@font-face {
    font-family:'AvenirNextDemiBold';
    src:url('../fonts/AvenirNext/AvenirNext-DemiBold-03.ttf');
}

@font-face {
    font-family:'AvenirNextBold';
    src:url('../fonts/AvenirNext/AvenirNext-Bold-01.ttf');
}

@font-face {
    font-family:'AvenirNextRegular';
    src:url('../fonts/AvenirNext/AvenirNext-Regular-08.ttf');
}

body{
    overflow-x: hidden;
 }

.navbar {
    background-color: #372A8D; 
}
.container{
    max-width: 1300px;
}

.background-gray{
    background-color: #EDECF2;
}

.background-blue{
    background-color: #2BB0E4;
}

.background-red{
    background-color: #E5006F;;
}

.navbar-toggler{
    background-color: white;
}

.margin-top-100 {
    margin-top: 100px;
}

.mt-testimonios{
    margin-top: 50px;
}

.mb-testimonios{
    margin-bottom: 50px;
}

.header-logo {
    width: 60px;
}

.navbar-light .nav-link{
    color: white !important;
}

.navbar-light a:hover{
    color: black !important;
}

footer {
    background-color: #372A8D;
    padding-top: 50px;
    padding-bottom: 20px;
}

.footer-logo{
    width: 300px;
}

#servicio-1{
    background-color: #f8fafc;
}

#servicio-2{
    background-color: #f8fafc;
}

.img-testimonio {
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

.fs-13{
    font-size: 13px;
}

.fs-17{
    font-size: 17px;
}

/*Home*/
.section-home{
    padding-bottom: 30px;
}
.fulfillment-logo {
    width: 50%;
    margin-top: 10%;
    margin-bottom: 10%;
}

.text-big-title {
    font-size: 100px;
    font-weight: bold;
    line-height: 60px;
    font-family: 'AvenirNextBold';
}

.text-middle-title{
    font-size: 40px;
    font-weight: bold;
    line-height: 50px;
    font-family: 'AvenirNextDemiBold';
}

.btn-contactar{
    border-radius: 50px;
    color: #EDECF2;;
    width: auto;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 20px;
}

.margin-top-ff{
    margin-top: 50px;
}

.social-networks div{
    width: 70px
}

.logo-whatsapp{
    width: 80px;
    /* position: absolute; */
    /* bottom: 0px; */
    /* right: 140px; */
}
/*Fulfillment*/
.section-ff{
    padding-top: 100px; 
    padding-bottom: 100px;
}

.text-big-title-ff{
    font-size: 80px;
    font-weight: bold;
    line-height: 100px;
    font-family: 'AvenirNextBold';
}

.text-ff-1{
    font-size: 40px;
    line-height: 100px;
    font-family: 'AvenirNextRegular';
}

.text-regular{
    font-size: 30px;
    line-height: 40px;
    font-family: 'AvenirNextRegular';
}

.text-regular-bold-35{
    font-size: 35px;
    line-height: 40px;
    font-family: 'AvenirNextBold';
    font-weight: bold;
}

.text-regular-bold{
    font-size: 30px;
    line-height: 40px;
    font-family: 'AvenirNextBold';
    font-weight: bold;
}

.text-regular-sm-bold{
    font-size: 18px;
    line-height: 20px;
    font-family: 'AvenirNextRegular';
    font-weight: bold;
}

/*Logistica*/
.section-logistica{
    padding-top: 50px;
    padding-bottom: 30px;
}

.borde-logistica{
    background-color: #623487;
    height: 450px;
    width: 5px;
    border-radius: 20px;
}

.img-logistica{
    width: 75%;
    margin-top: 30px;
    margin-bottom: 30px;
}

.text-title-logistica{
    font-family: 'AvenirNextBold';
    font-weight: bold;
    font-size: 17px;
    line-height: 20px;
}

.text-content-logistica{
    font-size: 12px;
    font-weight: bold;
    font-family: 'AvenirNextRegular';
}

.mt-logistica{
    margin-top: 15px;
}

.row-text-title-logistica{
    height: 15%;
}

/* Beneficios */
.section-beneficios{
    padding-top: 100px; 
    padding-bottom: 100px;
}

.content-check-right{
    background-color: #623487;
    border-radius: 30px 0px 0px 30px;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 70px;
    width: 57%;

    position: absolute;
}

.content-check-left{
    background-color: #372A8D; 
    border-radius: 0px 30px 30px 0px;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 70px;
    width: 57%;

    position: absolute;
    left: 0px;
}

.text-check p{
    color: #EDECF2;
    font-size: 25px;
    line-height: 25px;
    font-family: 'AvenirNextRegular';
}

/* Quienes somos */
.section-somos{
    height: 350px;
}

.img-quienes-somos{
    height: 80%;
    top: -80px;
    position: relative;
}

.section-somos .text-main-title{
    margin-top: 30px;
    line-height: 60px;
}

/* Precios */
.section-precios{
    margin-top: 80px;
}

.section-precios .text-regular{
    line-height: 30px;
}

.main-box-prices{
    width: 80%;
    height: 300px;
    border: 12px solid #2BB0E4;
    border-radius: 30px;
    position: relative;
    left: 10%;
    display: flex;
}

.box-price-left{
    width: 40%;
    height: 100%;
    position: relative;
    left: -10%;
    bottom: -50px;
    border-radius: 30px;
}

.box-price-center{
    width: 40%;
    height: 100%;
    position: relative;
    /* left: 5%; */
    bottom: -50px;
    border-radius: 30px;
}

.box-price-right{
    width: 40%;
    height: 100%;
    position: relative;
    right: -10%;
    bottom: -50px;
    border-radius: 30px;
}

.box-red-top{
    height: 33%;
    border-radius: 30px 30px 0px 0px;
}

.box-purple-center{
    height: 33%;
    border-top: 5px solid #EDECF2;
}

.box-purple-bottom{
    height: 42%;
    /* margin-top: 60%; */
    border-radius: 0px 0px 30px 30px;
    border-top: 5px solid #EDECF2;

}

.box-text-title-price{
    font-size: 40px;
    font-weight: bold;
    line-height: 40px;
    font-family: 'AvenirNextBold';
}

.box-text-content-price{
    margin-left: 2px;
    margin-right: 2px;
    color: #EDECF2;
    font-size: 22px;
    line-height: 25px;
    font-family: 'AvenirNextRegular';
}

.precios-height{
    height: 400px;
}

/* CONTACTO */
.section-contacto{
    padding-top: 60px;
    padding-bottom: 60px;
}

.section-contacto .text-main-title{
    line-height: 60px;
}

.box-contacto{
    background-color: #E5006F;
    width: 100%;
    border-radius: 80px;
    padding-top: 30px;
    padding-bottom: 30px;
}

.btn-enviar{
    background-color: #E5006F;
    color: #EDECF2;
    width: 60%;
    font-weight: bold;
    font-family: 'AvenirNextRegular';
    border-radius: 30px;
}

.btn-enviar-promo{
    background-color: #372A8D;
    color: #EDECF2;
    width: 50%;
    margin-right: 10%;
    margin-top: 15px;
    font-weight: bold;
    font-family: 'AvenirNextRegular';
    border-radius: 30px;
}

@media screen and (min-width: 768px) {
    .btn-tamaño {
        padding: 1.25rem;
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 767px) {
    .btn-tamaño {
        padding: 0.938rem;
        font-size: 0.938rem;
    }
}

.borde-red{
    border-bottom: #E5006F;
}

.m-top-0{
    margin-top: 0px !important;
}

#mktf_form{
    padding-left: 100px;
}

/* FOOTER */
.input-newsletter{
    width: 60%;
}

.input-newsletter input{
    border-radius: 30px;
}

.btn-newsletter{
    border-radius: 30px;
}

.social-networks-footer a{
    margin-left: 30px;
}

.text-suscribe{
    font-size: 25px;
    line-height: 15px;
    font-weight: bold;
    font-family: 'AvenirNextRegular';
}

.text-suscribe-2{
    font-size: 22px;
    line-height: 15px;
    font-family: 'AvenirNextRegular';
}

/* BOTÓN FLOTANTE */
.btn-flotante {
	font-size: 16px; /* Cambiar el tamaño de la tipografia */
	text-transform: uppercase; /* Texto en mayusculas */
	font-weight: bold; /* Fuente en negrita o bold */
	color: #ffffff; /* Color del texto */
	border-radius: 5px; /* Borde del boton */
	letter-spacing: 2px; /* Espacio entre letras */
	padding: 18px 30px; /* Relleno del boton */
	position: fixed;
	bottom: 20px;
	right: 10px;
	transition: all 300ms ease 0ms;
	z-index: 99;
}

.btn-flotante:hover {
	/* background-color: #2c2fa5; Color de fondo al pasar el cursor */
	/* box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.3); */
	transform: translateY(-7px);
}

/* GENERAL */
.color-blue{
    color: #2BB0E4;
}

.color-white{
    color: #EDECF2;
}

.color-bg-red{
    background-color: #E5006F;
}

.color-bg-blue{
    background-color: #2BB0E4;
}

.color-bg-purple{
    background-color: #623487;
}

.color-bg-blue-primary{
    background-color: #372A8D; 
}

.color-purple{
    color: #623487;
}

.color-red{
    color: #E5006F;
}

.mt-40{
    margin-top: 40px;
}

.text-main-title{
    font-size: 80px;
    font-weight: bold;
    line-height: 100px;
    font-family: 'AvenirNextBold';
}

.text-subtitle{
    font-size: 40px;
    line-height: 40px;
    font-family: 'AvenirNextRegular';
}

#form_emal_newsletter-error{
    display: none !important;
}

@media (max-width: 600px) {

    #testimonios .card{
        margin-bottom: 2rem;
    }

    .row{
        margin-left: 0px;
        padding-left: 0px;
        margin-right: 0px;
        padding-right: 0px;
    }

    .container{
        margin-left: 0px;
        padding-left: 0px;
        margin-right: 0px;
        padding-right: 0px;
    }

    .mt-movil{
        margin-top: 30px;
    }

    .borde-logistica{
        display: none;
    }

    .img-logistica{
        width: 40%;
    }

    .content-check-right{
        padding-left: 0px;
        border-radius: 30px 30px 30px 30px;
        width: 100%;
        position: relative;
    }

    .content-check-left{
        padding-left: 0px;
        border-radius: 30px 30px 30px 30px;
        width: 100%;
        margin-top: 25px;
        position: relative;
    }

    .section-somos .text-main-title{
        /* margin-top: 0px; */
        line-height: 60px;
    }

    .section-somos{
        height: auto;
    }

    .main-box-prices{
        width: 100%;
        height: 300px;
        border: 0px;
        border-radius: 30px;
        position: relative;
        left: 0%;
        display: block;
    }

    .box-price-left{
        width: 100%;
        left: 0%;
        right: 0%;
    }
    
    .box-price-center{
        margin-top: 40px;
        width: 100%;
        left: 0%;
        right: 0%;
    }
    
    .box-price-right{
        margin-top: 40px;
        width: 100%;
        left: 0%;
        right: 0%;
    }

    .text-big-title-ff{
        font-size: 60px;
    }

    .text-main-title{
        font-size: 60px;
    }

    .text-big-title {
        font-size: 60px;
    }

    .text-regular{
        font-size: 20px;
        line-height: 30px;
    }

    .container-nav{
        margin-left: 15px;
        margin-right: 15px;
    }

    .text-check p{
        font-size: 15px;
        line-height: 20px;
    }

    .img-quienes-somos{
        top: 0px;
    }

    .logo-whatsapp{
        width: 50px;
    }

    .section-precios{
        height: 1550px;
    }

    .margin-top-form-movil{
        margin-top: 50px;
    }

    .precios-height{
        height: 1100px;
    }

    #mktf_form{
        padding-left: 0px;
    }

    .input-newsletter{
        width:100%;
    }
    /* Botón flotante */
    .btn-flotante {
		font-size: 14px;
		padding: 12px 20px;
		bottom: 0px;
		right: 0px;
	}
    
}
footer a:visited {
    color:#ffffff;
}
footer a:hover {
    color:#1900ff;
}
/* Quitamos el subrayado */
a {
    text-decoration: none !important;
}

.spinner_welcome{
    position: absolute;
    display: none;
    left: 46%;
    margin-top: 15%;
    border: 13px solid rgba(0,0,0,0.1); /* White */
    border-top: 13px solid #333333; /* Black */
    border-radius: 50%;
    width: 105px;
    height: 105px;
    animation: spin 1s linear infinite;
}

.mktf_from_hide{
    animation: hideForm 1s linear;
}

@keyframes hideForm{
    from {height: 100%; opacity: 1;}
    to {height: 70%; opacity: 0;}
}

.mensaje{
    padding: 75px 40px;
    /*height: 728px;*/
    font-size: 180%;
    animation: mensajeShow .5s linear;
}

.error{
    color: red;
}

.contact-form-promo .error{
    color: #372A8D;
}

/* MODAL FORMULARIO OFERTA*/
.logo-formulario-oferta{
    width: 200px;
    margin-top: 0px;
    margin-bottom: 25px;
}

.modal-foto-cajas{
    width: 100%;
}