*{
    margin:0;
    padding: 0;
    transition: 0.5s;
    font-family: 'Mukta', sans-serif;
}



body{
    height: 100vh;
    width: 100%;
    position: relative;
}

body::-webkit-scrollbar {
    width: 5px;               /* width of the entire scrollbar */
}

body::-webkit-scrollbar-track {
    background:  rgb(38,42,45),1;     /* color of the tracking area */
}

body::-webkit-scrollbar-thumb {
    background-color: rgb(255, 145, 0);    /* color of the scroll thumb */
    border-radius: 20px;       /* roundness of the scroll thumb */
    border: 3px solid rgb(38,42,45),1; /* creates padding around scroll thumb */
    
}

.placa_obscura{
    background: rgba(0, 0, 0, 0.507);
    height: 100%;
    width: 100%;
    z-index: 1;
}

.inmobiliario{
    height: 100vh;
    width: 100vw;

}


.inmobiliario .bg-video__inmobiliario{
    position: absolute;
    left: 0;
    display: block;
    object-fit:fill;
    background-size:cover;
    background-repeat: no-repeat;
    height: 100vh;
    width: 100%;
    z-index: -3;
}



.content__service__description{
    position: absolute;
    top:250px;
    width: 50%;
    z-index: 99;
}

.title__option{
    font-family: 'Inter', sans-serif;
    font-size: 35px;
    font-weight: 900;
    color:#fff;
    
}

.conversation__box{
    background: #2e4e6b;
    max-height: 300px;
    overflow-y: auto; 
}


.text__conversation{
    font-size: 12px;
    color: #fff;
}

.conversation__zone{
    text-align: left;
}

.conversation__item{
    padding-left: 20px;
    padding-top: 20px;
}


.conversation__inputzone{
    width: 100%;
    background: #c0ced6;
    padding: 10px 0;
}

.conversation__inputzone input{
    width: 70%;
    height: 40px;
    margin-left: 20px;
    font-family: 'Cairo';
    font-size: 16px;
    border-radius: 5px;
}

.btn__enviar{
    background: #214C75 !important;
    color: #fff !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 12px !important;
    font-weight: bold;
    border: solid 1px #214C75 !important;
    border-radius: 5px ; 
    padding: 10px 20px;
    margin-left: 40px;
    width: 100px !important;
}

.btn__enviar:hover{
    background: #913508 !important;
    border: solid 1px #913508 !important;
}

.btn__box{
    position: relative;
    display: flex;
    width: 600px;
}

.button__item{
    position: relative;
    padding-right: 20px;
    width: 200px;
}





/* H E A D E R */

header{
    position: sticky;
    top: 0;
    left: 0;
    height: fit-content;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    background: #214c75;
    color: rgb(0, 0, 0);
    z-index: 99;
    box-shadow: 0 0.5em 1em #111;
}

.header-container{
    height: fit-content;
    width: 100%;
    /*padding: 3rem 6rem;*/
    /*padding-top: 10px;*/
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.header-content-container{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    border-right: 1px solid #1b4164;    
    border-color: #1b4164;
    padding: 8px 10px 1px 15px;
}

.header-info, .menu-item-header{
    margin: 0.2rem 0;
    opacity: 0.7;
    color: #c4bbbb;
    text-decoration: none;
    transition: 0.5s;
    font-family: 'Mukta', sans-serif;
    font-size: 13px;
}

.menu-item-header:hover{
    opacity: 1;
    color: #fff;
}


.social-link-header{
    height: 100%;
    width: 30px;
    margin-right: 1rem;
    color: #c4bbbb;
}

.social-link-header:hover{
    opacity: 1;
    color:  #fff;
}

.option-selected{
    border-bottom:3px solid #ff7b00;
}


/* I N D E X  */

.header-index{
    margin-top: -40px;
    background-image: url(https://wht.mx/assets/image/background/index_bg4.webp);
    background-size:cover;
    background-repeat: no-repeat;
    background-position: bottom;
    height:fit-content;
}

.contenedor_logo_menu{
    padding: 30px 0;
    border-bottom: 1px solid rgba(255,255,255,.4);
    opacity: 100%;
}

.logo{
    margin-top: 0;
    padding-top: 2%;
}

.logo img{
    margin-left: -90px;
    margin-top:  -5px;
    vertical-align: top;
    width: 200px;
    background: rgba(255, 255, 255, 0.322);
    border-radius: 20px 5px 20px 5px;
}

.logo img:hover{
    background: rgba(240, 76, 0, 0.322);
}

.menu{
    text-align: center;
    line-height: 50px;
    /*background: #8080803f;*/  
    border-radius: 10px;
    padding-top: 2%;

}

.menu a{
    text-transform: uppercase;
    font-weight: 900;
    color: #f0f0f0;
    margin-left: 20px;
    font-size: 14px;
    text-decoration: none;
    background: rgba(0, 0, 0, 0.514);
    padding: 3px 5px;
    border-radius: 10px;
}

.menu a:hover{
    color: #ff5404;
    background: rgba(38, 119, 224, 0.514);
}

.textos{
    color: #111;
    text-align: center;
}

.primera-linea{
    margin-top: 5%;
    font-size: 35px;
    line-height: 35px;
    margin-bottom: 30px;
    color: #ff7b00;

}

.segunda-linea{
    font-size: 25px;
    line-height: 25px;
    margin-bottom: 60px;
    color: #ff7b00;

}

.contenedor-btn a{
    border-radius: 4px;
    border: 2px solid rgba(2, 2, 2, 0.226);
    background:rgba(2, 2, 2, 0.37);
    padding: 12px 0;
    font-weight: 600;
    color: #ffffff;
    text-decoration: none;
    width: 20%;
    display: inline-block;
    margin: 0 20px 50px 20px;
    text-align: center;
}

.contenedor-btn a:hover{
    background:  #ff5404;
    border: 2px solid #ff5404;
    color:#fffafa;
}

/* services */


.services{
    padding: 70px 0;
}

.titulo{
    text-align: center;
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: 42px;
    color: #000;
    margin-bottom: 70px;
}

.servicio{
    text-align: center;
}

.icono{
    vertical-align: top;
    margin-bottom: 30px;
    width:40%
}

.Primera_linea{
    font-weight: 700;
    margin-bottom: 30px;
    font-size: 20px;
}

.parrafo{
    margin-bottom: 30px;
    line-height: 28px;
    text-align: justify;
}

.partners{
    background: rgb(38,42,45);
    background: linear-gradient(180deg, rgba(38,42,45,1) 0%, rgba(56,56,56,1) 48%, rgba(38,42,45,1) 94%);

}

.titulo-blanco{
    text-align: center;
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: 42px;
    color: #fff;
    margin-bottom: 70px;
}

/* S E C C I O N E S */

.section-index-slide{
    top: 0;
    left: 0;
    height: fit-content;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: #f7a903;
    color: rgb(0, 0, 0);
    z-index: 1;
}

.seccion-privacidad{
    position: relative;
    width: 95vw;
    height: fit-content;
    z-index: 1;
}

.seccion-legal{
    position: relative;
    width: 95vw;
    height: fit-content;
    z-index: 1;
}

.seccion-cookies{
    position: relative;
    width: 95vw;
    height: fit-content;
    z-index: 1;
}

/* T I T U L O S   Y   T E X T O S  */

.titles{
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    color:#214c75;
    text-align: center;
    padding-bottom: 40px;
}

.subtitles{
    font-family: 'Nunito', sans-serif;
    text-transform: uppercase;
    color:#ff7b00;
}

.texto-contenido{
    font-family: 'Mukta', sans-serif;
    color: #8b8787;
    text-align: justify;
}

.Fecha-Documento{
    font-family: 'Mukta', sans-serif;
    text-transform: uppercase;
    color: #3d3d3d;
}

.Texto-nota{
    font-family: 'Nunito', sans-serif;
    text-transform: uppercase;
    color: #3d3d3d;
    text-align: justify;
    font-weight: 900;
}

.bg-legalheader{
/*   background: #ffffff;
    background-image: url('https://wht.mx/assets/image/background/terms_bg.jpg');
    background-repeat: no-repeat;
    background-size: 100% 4%;*/
    position:relative;
    margin-top: -100;
    width: auto;
    z-index: 0;

}

.process{
    padding: 70px 0;
}

.texto-solucion{
    text-align: justify;
}

.cortina{
    position: absolute;
    margin-left: 370px;
    width: 320px;
    height: 150px;
    background: #ffffff;
}

.ProcessContent{
    width: 90%;
    align-items: center;
    text-align: center;
}

.DataProcess{
    width: 40vw;
    height: 50vh;
}

.cliente .foto img{
    border-radius: 50%;
}

.precios{
    background: url(https://wht.mx/assets/image/background/fondo-precios.png);
    background-size: cover;
    background-position: center 0;
    background-repeat: no-repeat;
    padding: 70px 0;
}

.plan{
    background: rgba(255, 255, 255);
    font-family: 'Mukta', sans-serif;
    padding: 50px 0;
    -webkit-box-shadow:0px 0px 15px 0px rgba(0,0,0,0.35);
    box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.35);
    margin-bottom: 50px;

}

.nombre{
    text-align: center;
    font-size: 32px;
}

.precio{
    font-weight: 300;
    font-size: 48px;
    margin-bottom: 0;
    text-align: center;
}

.texto-informativo{
    font-family: 'Mukta', sans-serif;
    font-size: 12px;
    font-style: italic;
    color:#3d3d3d;
    text-align: center;
    line-height: 5px;
}

.precio-informativo{
    font-family: 'Mukta', sans-serif;
    font-size: 14px;
    font-style: italic;
    color:#e7e7e7;
    text-align: center;
    line-height: 25px;
}

.caracteristicas{
    list-style: none;
    padding: 0 20px;
    margin-bottom: 50px;
}

.caracteristicas li{
    font-size: 18px;
    padding: 15px 0;
    border-bottom: 1px solid #dedede;
}

.verde{
    color:#86b773;  
}

.azul{
    color: #0d83e4;
}

.activo{
    background:#4c8dce;
    color:#fff;
}

.naranja{
    color:#ddb146;
}
    
.btn{
    width: 60%;
    padding: 15px 0;
    text-align: center;
    display: inline-block;
    border-radius: 100px;
    font-size: 16px;
    text-decoration: none;
}

.btn-verde{
    font-size: 16px;
    color:#86b773;
    border: 2px solid #86b773;
    width: 60%;
    padding: 15px 0;
    display: inline-block;
    border-radius: 100px;
    text-decoration: none;
}

.btn-verde:hover{
    background: #86b773;
    color: #fff;
}

.btn-activo{
    font-size: 16px;
    color:#fff;
    border: 2px solid #fff;
    width: 60%;
    padding: 15px 0;
    display: inline-block;
    border-radius: 100px;
    text-decoration: none;
}

.btn-activo:hover{
    background: #fff;
    color: #4c8dce  ;
}

.btn-naranja{
    font-size: 16px;
    color:#ddb146;
    border: 2px solid #ddb146;
    width: 60%;
    padding: 15px 0;
    display: inline-block;
    border-radius: 100px;
    text-decoration: none;
}

.btn-naranja:hover{
    background: #ddb146;
    color: #fff;
}

.reviews{
    padding: 70px 0;
}

.cliente{
    overflow: hidden;
    margin-bottom: 20px;
}

.cliente .foto{
    width: 20%;
    float: left;
    text-align: right;
}

.cliente .foto img{
    max-width: 100px;
    width: 100%;
    vertical-align: top;
    border-radius: 100%;
}

.cliente .review{
    float: left;
    width: 80%;
    padding: 0 30px;
    margin-top:20px;
}

.cliente .review .texto{
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 10px;
}

.cliente  .nombre{
    float: left;
    padding: 0 30px;
    color: #ddb146;
    font-size: 14px;
}


/*   W H A T S A P P   PA G E */

.header-whatsapp{
    background-image: url(https://wht.mx/assets/image/background/whatsapp_bg1.png);
    background-size:cover;
    background-repeat: no-repeat;
    background-position: bottom;
    height: 35vh;
}


.primera-lineawa{
    border-radius:30px;
    max-width: 800px;
    margin-top: 10px;
    margin-left: 20%;
    font-size: 45px;
    line-height: 55px;
    margin-bottom: 30px;
    color: #0d83e4;
    background: #fff;
    padding: 10px 10px;
}

.barra{
    background: #e45c0d;
    height: 3vh;
}


.formulario-whatsapp{
background: #e45c0d;
}

.segunda-lineawa{
    border-radius:10px;
    max-width: 600px;
    margin-top: 20px;
    font-size: 14px;
    line-height: 25px;
    margin-bottom: 40px;
    color: #ffffff;
    background: rgba(252, 93, 1, 0.664);
    padding: 2px 10px;
    text-align: center;
}


.card-whatsapp{
    align-items: center;
    border: 1px solid rgb(36, 36, 36);
    background: #fff;
    padding: 40px 40px;
    margin: 40px 0;
    box-shadow: 0 0.5em 1em #111;
}

.Foto-ccruz{
    background-image: url(https://wht.mx/assets/image/foto-ccruz.png);
    background-size:contain;
    background-repeat: no-repeat;
    background-position: center;
    
}

.titulo-carlos-wp{
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    color:#fff;
    text-align: center;
}

.subtitulo-carlos-wp{
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    color:#fff;
    text-align: center;
}

.privacidad-leido{
    font-family: 'Mukta', sans-serif; 
    font-size: 12px;
    font-style: italic;
    color:rgb(136, 135, 135);
}

/* F O O T E R */

footer{
    position:static;
    bottom: 0;
    left: 0;
    height: fit-content;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: rgb(38,42,45);
    background: linear-gradient(180deg, rgba(38,42,45,1) 0%, rgba(56,56,56,1) 48%, rgba(38,42,45,1) 94%);
    color: #fff;
    z-index: 99;
}

.copyright-content{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-top: 1px solid rgba(255, 255, b255, 0.3);
}

.copyright{
    font-size: 12px;
    opacity: 0.7;
    font-weight: 400;
    padding: 10px 0;
}

.footer-menus{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width:40%
}

.footer-container{
    bottom: 0;
    /*height: fit-content;*/
    width: 100%;
    padding: 3rem 6rem;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.footer-content-container{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
}

footer .website-logo{
    margin-bottom: 1.2rem;
    font-size: calc(1vw+20px);
}

.footer-info, .menu-item-footer{
    margin: 0.2rem 0;
    opacity: 0.7;
    color: #fff;
    text-decoration: none;
    transition: 0.5s;
}

.menu-item-footer:hover{
    opacity: 1;
}

.menu-title{
    font-size: 16px;
    font-weight: 400;
    text-transform: uppercase;
    margin-bottom: 1.2rem;
}

.social-container{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
    width: 100%;
}

.social-link{
    height: 100%;
    width: 30px;
    background-image: url(facebook.png);
    background-size: 70%;
    background-position: center;
    margin-right: 1rem;
    background-repeat: no-repeat;
    color: #fff;
}

.social-link:hover{
    color: #fff;
    opacity: 0.7;
}

footer .social-link:nth-of-type(2){
    background-image: url(twitterblanco.png);
}

footer .social-link:nth-of-type(3){
    background-image: url(linkedinblanco.png);
}


/*  PAGINA 404*/

.titulo-404{
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    color:#214c75;
    font-size: 2.4rem;
    text-align: center;
    padding: 20px 0;
}

.imagen-404{
    text-align: center;
}

.btn-404{
    text-align: center;
    margin: 70px 0;
}

.btn-404 a{
    background: #0d83e4;
    border: 2px solid #0d83e4;
    border-radius: 10px;
    color:#fff;
    padding: 5px 15px;
    text-decoration: none;
    font-family: 'Mukta', sans-serif;
    font-size: 22px;
    text-align: center;
}

.btn-404 a:hover{
    background: #e45c0d;
    color:#fff;
    border: 2px solid #e45c0d;
}


/* C O N T A C T O */

.datos-contacto{
    height: 100vh;
    background: #000;
}

.header-contact{
    background: rgb(248,186,17);
    background: linear-gradient(180deg, rgba(248,186,17,1) 0%, rgba(255,255,255,1) 100%);
    height: 20vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 80px;
    z-index: 1;
}

.header-contact img{
    height: 200px
}

.extracto{
    background: #fff;
}

.btn-contacto{
    background: #fff;  
}

.footer-contacto{
    background: #fff;
    text-align: center;
    border-radius: 0 0 30px 30px;
}

.footer-text{
    margin-top: 30px;
    font-family: 'Mukta', sans-serif;
    font-size: 13px;
    text-align:justify;
    color: #746f6f;
    padding: 5px 20px;
    font-style: italic;
}

/*Mukta, Nunito, Oswald*/
/*
font-family: 'Mukta', sans-serif;    Textos
font-family: 'Nunito', sans-serif;   Subtitulo
font-family: 'Oswald', sans-serif;   Titulo
*/



.contacto-titulo{
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    font-size: 32px;
    font-weight: 900;
    text-align: center;
    margin-top: 45px;
    margin-bottom: 0;
    color: #AC851B;
    z-index: 3;
}

.contacto-subtitulo{
    font-family: 'Nunito', sans-serif;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 0;
    color: #a19e9e;
}

.contacto-slogan{
    font-family: 'Nunito', sans-serif;
    font-size: 6;
    font-weight: 400;
    text-align: center;
    margin-bottom: 5px;
    color: #a19e9e;
}

.contacto-texto{
    font-family: 'Mukta', sans-serif;
    font-size: 14px;
    text-align: justify;
    padding: 10px 20px;
    color: #a19e9e;
}

.btn-contacto{
    width: 70%;
    display: flex;
    flex-direction: column;
    align-items: center;

}

.bg-whatsapp{
    background: #3ABB00;
    color: #fff;
}

.bg-telegram{
    background: #138AC5;
    color: #fff;
}

.bg-email{
    background: #324d61;
    color:#fff;
}

.bg-phone{
    background: #b47601;
    color:#fff;
}

.btn-contacto a{
    text-decoration: none;
    padding: 3px 5px;
    font-weight: 500;
    border-radius: 20px;
    min-width:220px;
    max-width: 320px;
    margin: 10px 0;
    text-align:start;
    padding: 8px 20px;
    margin-bottom: 35px;
}

.btn-contacto a:hover{
    transition: 0.8s;
    opacity: 60%;    
    color: #fff;
    box-shadow: 0 0.5em 1em #111;
}


/*  S I S T E M A S   W E B   */


.sistemas-web{
    background: rgb(36,107,205);
    background: radial-gradient(circle, rgba(36,107,205,1) 9%, rgba(36,107,205,1) 18%, rgba(36,107,205,1) 24%, rgba(74,150,200,1) 76%);
}


.letra-blanca{
    color:#fff;
}

.sistema-web{
    background: rgba(255, 255, 255);
    font-family: 'Mukta', sans-serif;
    padding: 50px 0;
    -webkit-box-shadow:0px 0px 15px 0px rgba(0,0,0,0.35);
    box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.35);
    margin-bottom: 50px;
}

.texto-informativo-sistemas{
    font-family: 'Mukta', sans-serif;
    font-size: 12px;
    font-style: italic;
    color:#3d3d3d;
    line-height: 15px;
    padding: 0 20px ;
    text-align: justify;
}

.imagen-sistemas{
    display: flex;
    align-content: center;
    justify-content: center;
    width: 100%;
    align-items: center;
    text-align: center;
}

.imagen-sistemas img{
    width: 250px;
    height: 200px;
    border-radius: 50%;
}



.video-sistemas{
    text-align: center;
    text-decoration: none;
    align-items: center;
}

.video-sistemas a{
    color:rgb(24, 148, 8);
    text-align: center;
    text-decoration: none;
}


.btn-venta-sistemas{
    width:fit-content;
    background: #3ABB00;
    color: #fff;
    align-items: center;
    padding: 3px 10px;
    border-radius: 10px;
    text-decoration: none;
}

.btn-venta-sistemas:hover{
    transition: all 0.4s;
    background: #329604;
    color: #fff;
    box-shadow: 0 0.5em 1em #111;
}

.btn-venta-sistemas-azul{
    width:fit-content;
    background: #067dcc;
    color: #fff;
    align-items: center;
    padding: 3px 10px;
    border-radius: 10px;
    text-decoration: none;
}

.btn-venta-sistemas-azul:hover{
    transition: all 0.4s;
    background: #04609e;
    color: #fff;
    box-shadow: 0 0.5em 1em #111;
}





/* MEDIA ADAPTACIÓN A DISPOSITIVOS */

@media screen and (max-width: 375px) {
/*celulares antiguos*/

    .header-index{
        background-image: url(https://wht.mx/assets/image/background/index_bg4_movil.png);
        background-size:content;
        background-repeat: no-repeat;
        background-position: center;
        height: 70vh;
    }

    .menu a{
        font-family: 'Mukta', sans-serif;
        font-size: 10px;
        font-style: normal;
        margin: 0;
        background: rgba(0, 0, 0, 0.514);
        padding: 3px 5px;
    }

    .primera-linea{
        font-family: 'Mukta', sans-serif;
        margin-top: 22px;
        font-size: 14px;
        line-height: 45px;
        margin-bottom: 30px;
        background: rgba(0, 0, 0, 0.514);
    }

    .segunda-linea{
        font-family: 'Mukta', sans-serif;
        font-size: 14px;
        line-height: 25px;
        background: rgba(0, 0, 0, 0.514);
        border-radius: 20px;
    }

    .contenedor-btn a{
        width: 30%;
        font-size: 12px;
        margin-bottom: 180px;
    }

    .services{
        padding: 20px 0;
    }

    .titulo{
        margin-bottom: 20px;
    }

    .icono{
        vertical-align: top;
        margin-bottom: 30px;
        width:30%
    }


    .header-whatsapp{
        height: 26vh;
    }


    .primera-lineawa{
        text-align: center;
        margin-left: 0;
        max-width: 340px;
        margin-top: 10px;
        font-size: 18px;
        line-height: 10px;
        margin-bottom: 30px;
        padding: 10px 10px;
    }


    .segunda-lineawa{
        max-width: 300px;
        margin-top: 5px;
        font-size: 10px;
        line-height: 20px;
        margin-bottom: 40px;
        color:#2a2a2a; 
    }

    .Foto-ccruz{
        padding: 0 20px;
        background-image: url(https://wht.mx/assets/image/foto-ccruz.png);
        background-size:contain;
        background-repeat: no-repeat;
        background-position:center;
        
    }
    
    .titulo-carlos-wp{
        font-family: 'Oswald', sans-serif;
        text-transform: uppercase;
        color:#fff;
        text-align: left;
        font-size: 16px;
    }
    
    .subtitulo-carlos-wp{
        font-family: 'Oswald', sans-serif;
        text-transform: uppercase;
        color:#fff;
        text-align: left;
        font-size: 12px;
    }

    .privacidad-leido{
        font-size: 10px;
    }


    /* footer*/
    
    .footer-container{
        padding: 2rem;
        flex-direction: column;
    }

    .footer-content-container{
        width: 100%;
        padding: 2rem 0;
        border-bottom: 1px solid #2a2a2a;
        justify-content: center;
        align-items: center;
    }

    .footer-content-container:nth-of-type(1){
        align-items: flex-start;
    }

    .footer-content-container:nth-of-type(3){
        border-bottom: none;
        padding-bottom: 0;
    }

    .footer-menus{
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        border-bottom: 1px solid #2a2a2a;
    }

    .footer-menus .footer-content-container:nth-of-type(1){
        width:45%;
        align-items: flex-start;
        border-bottom: none;
    }

    .footer-menus .footer-content-container:nth-of-type(2){
        width:45%;
        align-items: flex-start;
        border-bottom: none;
    }

    /*contacto*/
    .datos-contacto{
        height: 120vh;
        background: #fff;
    }

    .header-contact img{
        height: 150px
    }

    .contacto-titulo{
        font-size: 26px;
        margin-top: 45px;
    }

    .contacto-subtitulo{
        font-size: 12px;
    }

    .contacto-slogan{
        font-size: 10px;
        font-weight: 500;
    }

    .contacto-texto{
        font-size: 12px;
        padding: 10px 6px;
    }

    .btn-contacto a{
        font-family: 'Nunito', sans-serif;
        text-transform: uppercase;
        font-size: 12px;
        padding: 3px 5px;
        font-weight: 500;
        min-width:220px;
        max-width: 300px;
        text-align:start;
        padding: 8px 10px;
        margin-bottom: 20px;
    }
    

    .footer-contacto{
        border-radius: 0;
    }

    .footer-text{
        margin-top: 15px;
        font-size: 10px;
        font-style: italic;
    }


}


@media screen and (min-width:380px) and (max-width: 767px) {
/*celulares actuales*/

    .header-index{
        background-image: url(https://wht.mx/assets/image/background/index_bg4_movil.png);
        background-size:contain;
        background-repeat: no-repeat;
        background-position: center;
        height: 60vh;
    }


    .cliente .review .texto{
        font-size: 12px;
        line-height: 18px;
        margin-bottom: 10px;
    }

    .logo img{
        margin-left: 30%;
        margin-top: 0;
        width: 160px;
        align-items: center;
    }

    .menu a{
        font-size: 10px;
        background: rgba(0, 0, 0, 0.514);
        padding: 3px 5px;
        border-radius: 10px;
        margin:0 5px;
    }

    .primera-linea{
        margin-top: 50px;
        font-size: 35px;
        line-height: 45px;
        margin-bottom: 30px;
        background: rgba(0, 0, 0, 0.514);
    }
    
    .segunda-linea{
        font-size: 18px;
        line-height: 25px;
        margin-bottom: 10px;
        background: rgba(0, 0, 0, 0.514);
        border-radius: 20px;
    }

    .contenedor-btn a{
        width: 30%;
        font-size: 12px;
        margin-bottom: 180px;
    }


    /* services */

    .services{
        padding: 40px 0;
    }
    
    .titulo{
        margin-bottom: 50px;
    }

    .icono{
        vertical-align: top;
        margin-bottom: 30px;
        width:30%
    }
        
    .process{
        padding-bottom: 320px;
    }
    
    .DataProcess{
        background: #ddb146;
        position: absolute;
        width: 90vw;
        height: 23vh;
        margin-top: -20px;
        margin-left: -160px;
        z-index: 4;
    }


    .plan{
        margin: 0 20px;
        margin-bottom: 50px;
    }



    /* S E C C I O N E S */

    .seccion-privacidad{
        width: 97%;
        height: 760vh;
        padding-left: 20px;
        padding-right: 20px;
        z-index: 0;
    }



    .seccion-legal{
        width: 97%;
        height: 250vh;
        padding-left: 20px;
        padding-right: 20px;
        z-index: 0;
    }

    .seccion-cookies{
        width: 97%;
        height: 690vh;
        padding-left: 20px;
        padding-right: 20px;
        z-index: 0;
    }


    .footer-container{
        padding: 2rem;
        flex-direction: column;
    }

    .footer-content-container{
        width: 100%;
        padding: 2rem 0;
        border-bottom: 1px solid #2a2a2a;
        justify-content: center;
        align-items: center;
    }

    .footer-content-container:nth-of-type(1){
        align-items: flex-start;
    }

    .footer-content-container:nth-of-type(3){
        border-bottom: none;
        padding-bottom: 0;
    }

    .footer-menus{
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        border-bottom: 1px solid #2a2a2a;
    }

    .footer-menus .footer-content-container:nth-of-type(1){
        width:45%;
        align-items: flex-start;
        border-bottom: none;
    }

    .footer-menus .footer-content-container:nth-of-type(2){
        width:45%;
        align-items: flex-start;
        border-bottom: none;
    }

    /*  W H A T S A P P   F O R M  */

    .header-whatsapp{
        height: 26vh;
    }


    .primera-lineawa{
        text-align: center;
        margin-left: 0;
        max-width: 340px;
        margin-top: 30px;
        font-size: 18px;
        line-height: 10px;
        margin-bottom: 30px;
        padding: 10px 10px;
    }


    .segunda-lineawa{
        max-width: 500px;
        margin-top: 20px;
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 40px;
        color: #2a2a2a;
    }

    .Foto-ccruz{
        padding: 0 20px;
        margin: 0 20px;
        background-image: url(https://wht.mx/assets/image/foto-ccruz.png);
        background-size:contain;
        background-repeat: no-repeat;
        background-position:center;
        
    }
    
    .titulo-carlos-wp{
        font-family: 'Oswald', sans-serif;
        text-transform: uppercase;
        color:#fff;
        text-align: left;
        font-size: 18px;
    }
    
    .subtitulo-carlos-wp{
        font-family: 'Oswald', sans-serif;
        text-transform: uppercase;
        color:#fff;
        text-align: left;
        font-size: 14px;
    }


    /*contacto*/
    .datos-contacto{
        height: 110vh;
        background: #fff;
    }

    .header-contact img{
        height: 170px
    }

    .contacto-titulo{
        font-size: 26px;
    }

    .contacto-subtitulo{
        font-size: 12px;
    }

    .contacto-slogan{
        font-size: 10px;
        font-weight: 500;
    }

    .contacto-texto{
        font-size: 14px;
        padding: 10px 6px;
    }

    .btn-contacto a{
        font-family: 'Nunito', sans-serif;
        text-transform: uppercase;
        font-size: 14px;
        padding: 3px 5px;
        font-weight: 500;
        min-width:220px;
        max-width: 300px;
        text-align:start;
        padding: 8px 10px;
        margin-bottom: 35px;
    }
    

    .footer-contacto{
        border-radius: 0;
    }

    .footer-text{
        margin-top: 20px;
        font-size: 12px;
        font-style: italic;
    }



.title__option{
    font-family: 'Inter', sans-serif;
    font-size: 35px;
    font-weight: 900;
    color:#fff;
    
}

    
.content__service__description{
    position: absolute;
    top:220px;
    width: 90%;
    z-index: 99;
}


    
.conversation__box{
    background: #2e4e6b;
    max-height: 300px;
    overflow-y: auto; 
}


.text__conversation{
    font-size: 12px;
    color: #fff;
}

.conversation__zone{
    text-align: left;
}

.conversation__item{
    padding-left: 20px;
    padding-top: 20px;
}


.conversation__inputzone{
    width: 100%;
    background: #c0ced6;
    padding: 10px 0;
}

.conversation__inputzone input{
    width: 55%;
    height: 40px;
    margin-left: 20px;
    font-family: 'Cairo';
    font-size: 16px;
    border-radius: 5px;
}

.btn__enviar{
    background: #214C75 !important;
    color: #fff !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 12px !important;
    font-weight: bold;
    border: solid 1px #214C75 !important;
    border-radius: 5px ; 
    padding: 10px 20px;
    margin-left: 40px;
    width: 100px !important;
}

.btn__enviar:hover{
    background: #913508 !important;
    border: solid 1px #913508 !important;
}

.btn__box{
    position: relative;
    display: flex;
    width: 600px;
}

.button__item{
    position: relative;
    padding-right: 20px;
    width: 200px;
}




}


@media screen and (min-width: 768px) and (max-width: 1024px) {
    /* Estilos para tabletas */

    .header-index{
        background-image: url(https://wht.mx/assets/image/background/index_bg4.png);
        background-size:cover;
        background-repeat: no-repeat;
        background-position: center;
        height: 40vh;
    }

    .menu a{
        font-size: 10px;
        background: rgba(0, 0, 0, 0.514);
        padding: 3px 5px;
    }

    .logo img{
        margin-left: -20px;
        margin-top:  -5px;
        vertical-align: top;
        width: 200px;
    }


    /*contacto*/
    .datos-contacto{
        height: 100vh;
    }

    .contacto-titulo{
        font-size: 26px;
    }

    .contacto-subtitulo{
        font-size: 12px;
    }

    .contacto-slogan{
        font-size: 10px;
        font-weight: 500;
    }

    .contacto-texto{
        font-size: 14px;
        padding: 10px 6px;
    }

    .btn-contacto a{
        font-family: 'Nunito', sans-serif;
        text-transform: uppercase;
        font-size: 14px;
        padding: 3px 5px;
        font-weight: 500;
        min-width:220px;
        max-width: 300px;
        text-align:start;
        padding: 8px 10px;
        margin-bottom: 35px;
    }
    

    .footer-contacto{
        border-radius: 0 0 30px 30px;
    }

    .footer-text{
        margin-top: 20px;
        font-size: 12px;
        font-style: italic;
    }


}