@font-face {
    font-family: 'Satoshi-Variable';
    src: url('../fonts/Satoshi-Variable.woff2') format('woff2'),
         url('../fonts/Satoshi-Variable.woff') format('woff'),
         url('../fonts/Satoshi-Variable.ttf') format('truetype');
         font-weight: 300 900;
         font-display: swap;
         font-style: normal;
  }

  @font-face {
    font-family: 'Brandon-Grotesque-Black';
    src: url('../fonts/Brandon_blk.otf') format('opentype');
         font-weight: 800;
         font-display: swap;
         font-style: normal;
  }

  @font-face {
    font-family: 'Brandon-Grotesque-Bold';
    src: url('../fonts/Brandon_bld.otf') format('opentype');
         font-weight: 700;
         font-display: swap;
         font-style: normal;
  }

  @font-face {
    font-family: 'Brandon-Grotesque-Medium';
    src: url('../fonts/Brandon_med.otf') format('opentype');
         font-weight: 500;
         font-display: swap;
         font-style: normal;
  }

  @font-face {
    font-family: 'Brandon-Grotesque-Regular';
    src: url('../fonts/Brandon_reg.otf') format('opentype');
         font-weight: 400;
         font-display: swap;
         font-style: normal;
  }

  @font-face {
    font-family: 'Brandon-Grotesque-Light';
    src: url('../fonts/Brandon_light.otf') format('opentype');
         font-weight: 300;
         font-display: swap;
         font-style: normal;
  }

  @font-face {
    font-family: 'Brandon-Grotesque-Thin';
    src: url('../fonts/Brandon_thin.otf') format('opentype');
         font-weight: 100;
         font-display: swap;
         font-style: normal;
  }

  :root{
    --index: calc( 1vw + 1vh);
    --gutter: 30px;
    --side-small: 26;
    --side-big:36;
    --depth: 4000px;
    --transition: .75s cubic-bezier(0.075, 0.500, 0.000, 1.000);
}


*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}



/***********************************************HEADER******************/

body{
background-color: #F5F5F5;

}

nav{

    width: 100%;
    height: 10vh;
    background-color: #353535;
    display: flex;
    padding: 0% 6%;
    z-index: 1;
}

nav .logo{
    width: 40%;
    
    padding: 5px 0px;
    position: relative;
}

.logo img{
    object-fit: cover;
    height: 100%;
}

nav .content-menu{
    width: 60%;

}

.content-menu ul{ 
    display: flex;
    color: white;
   
    height: 100%;
    align-items: center;
    justify-content: flex-end;
}

.content-menu ul li{ 
    font-family: 'Satoshi-Variable';
    /*font-size: 12px;*/
    font-size: calc(var(--index) * 0.531);
    text-transform: uppercase;
    list-style: none;
    width: 20%;
    text-align: right;
}

.content-menu ul li a{ 
    color: white;
    text-decoration: none;
}




.menu-btn{
    position: relative;
    display: none;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 100%;
    cursor: pointer;
    transition: all .5s ease-in-out;

}

.menu-btn_burger{
    width: 35px;
    height: 2px;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(255, 101, 47, 0.2);
    transition: all 0.1s ease-in-out;
}

.menu-btn_burger::before,
.menu-btn_burger::after{
    content: '';
    position: absolute;
    width: 35px;
    height: 2px;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(255, 101, 47, 0.2);
    transition: all 0.5s ease-in-out;
}

.menu-btn_burger::before{
    transform: translateY(-16px);
}

.menu-btn_burger::after{
    transform: translateY(16px);
}

/*ANIMATION*/

.menu-btn.open .menu-btn_burger  {
    transform: translateX(-50px);
    background: transparent;
    box-shadow: none;
}

.menu-btn.open .menu-btn_burger::before  {
    transform: rotate(45deg) translate(35px, -35px);
}

.menu-btn.open .menu-btn_burger::after  {
    transform: rotate(-45deg) translate(35px, 35px);
}


.mobile-menu{
    display: none;
    background-color: #252525;
    width: 100%;
    height: 90vh;
    z-index: 110;
    position: absolute;
    top: 9vh;
    transition: 0.3s all ease-in;
}

.mobile-menu ul{
    width: 100%;
    height: 50%;
    border-bottom: 2px solid rgba(255, 255, 255, 0.5);
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-direction: column;
    list-style: none;
    padding: 10px 10px;
}

.mobile-menu ul li { 
    font-family: 'Satoshi-Variable';
    /*font-size: 12px;*/
    font-size: calc(var(--index) * 1.585);
    text-transform: uppercase;
    list-style: none;
}


.mobile-menu ul li a{ 
    color: white;
    text-decoration: none;
    
}

.mobile-contact{
    width: 100%;
    height: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;

}

.mb-datos{
    width: 80%;
    height: 30%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-direction: column;
    text-align: center;
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    font-size: 24px; font-size: calc(var(--index) * 1.062);
    
}

.mb-redes{
    width: 80%;
    height: 20%;
    display: flex;
    align-items: center;
    justify-content: center;
  
}

.m-redes{
    width: 25%;
    height: 60%;
    
    display: flex;
    align-items: center;
    justify-content: center;
}

.m-redes img{
    height: 100%;
    object-fit: cover;
}

.mb-logo{
    width: 80%;
    height: 50%;

    display: flex;
    align-items: center;
    justify-content: center;
}

.mb-img-logo{
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mb-img-logo img{
    height: 80%;
    object-fit: cover;
}

.mb-copy{
    padding-left: 10px;
    padding-right: 10px;
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-family: 'Brandon-Grotesque-Light';
    font-size: 26px; font-size: calc(var(--index) * 1.1505);
    text-align: center;
}

.show-m{
    display: block;
}

.hide-m{
    display: none;
}

@media only screen and (max-width: 668px) {
    nav .content-menu{
        display: none;
    }

    nav{
        height: 9vh;

        z-index: 10;
    }
    nav .logo{
        width: 100%;
        display: flex;
        justify-content: center;
        padding: 0px 0px;
    }

    .menu-btn{
        padding-top: 10px;
        padding-bottom: 10px;
        display: flex;
        position: absolute;
        right: 0%;
    }

}

@media only screen and (max-height: 475px ) and (orientation: landscape){
    nav .content-menu{
        display: block;
    }

    nav{
        height: 25vh;
    }

    .mobile-menu{
        display: none;
    }
}

@media only screen and (max-width: 1365px ) and (min-width: 1026px ) {
    nav{
        height: 8vh;
    }
    .mobile-menu{
        display: none;
    }
}

/***********************************************HOME******************/
a{
    text-decoration: none;
}

.container-home{
    width: 100%;
    
}

.home-1{
    width: 100%;
    height: 100vh;
    position: relative;
    overflow: hidden;
   display: flex;
   align-items: center;
   justify-content: center;
}

#img-desk{
    display: block;
}

#img-mob{
    display: none;
}

.bg-img-home{
    position: absolute;
    
    width: 100%;
    height: 100%;
}

.bg-img-home img{
    object-fit:cover;
    height: 100%;
    width: 100%;
}

.container-hero{
    height: 40%;
    width: 70%;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-direction: column;
    color: white;
}

.container-hero h1{
    font-family: 'Brandon-Grotesque-Light';
    /*font-size: 70px;*/
    font-size: calc(var(--index) * 3.07);
    letter-spacing: 4px;
    text-align: center;

}

.container-hero .line{
    width: 40%;
    background-color: white;
    height: 2px;
}

.container-hero p{
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    /*font-size: 20px;*/
    font-size: calc(var(--index) * 0.885);
    letter-spacing: 8px;
    text-transform: uppercase;
}

.home-section2{
    width: 100%;
    height: 105vh;
    display: flex;
    position: relative;
    overflow: hidden;
}

.home-venta, .home-renta{
    width: 50%;
    height: 100%;
    
}

.home-renta{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

 .content-home-section2{
    position: relative;
  
    z-index: 2;  
    text-align: center;

    transition: 0.3s all ease-in-out;
}

.content-home-section2 img{
    width: 10vh;
    height: 10vh;
    transition: 0.3s all ease-in-out;
}


.content-home-section2  .svg-comprar{
    width: 10vh;
    height: 11vh;
}

.content-home-section2 p {
     font-family: 'Brandon-Grotesque-Regular';
     color: white;
     font-size: 30px;
     font-size: calc(var(--index) * 1.327);
     letter-spacing: 1.5px;
     transition: 0.3s all ease-in-out;
}

.content-home-section2:hover img{
    transform: scale(1.1);
}

.content-home-section2:hover p{
    font-size: 34px;
     letter-spacing: 2px;
}

.bg-home-renta{
    position: absolute;
    width: 100%;
    height: 100%;
    
}


.bg-home-renta img{
    object-fit: fill;
    height: 100%;
    width: 100%;
}

.home-venta{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}



.bg-home-venta{
    position: absolute;
    width: 100%;
    height: 100%;
    
    z-index: -1;
}


.bg-home-venta img{
    object-fit: fill;
    height: 100%;
    width: 100%;
}

.bg-op{
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.35);
    transition: 0.4s all ease-in-out;
}



.home-venta:hover .bg-op{
    background-color: rgba(0, 0, 0, 0.1);
}

.home-renta:hover .bg-op{
    background-color: rgba(0, 0, 0, 0.1);
}


.home-section3{
  
    padding-left: 6%;
    padding-top: 5%;

}



.section3-text-container{
    width: 100%;
    height: 20%;
    
}

.title-section-home{
    /*font-size: 36px;*/
    font-size: calc(var(--index) * 1.585);
    font-family: 'Brandon-Grotesque-Regular';
    letter-spacing: 3px;
    text-transform: uppercase;
}

.text-section-home{
    /*font-size: 20px;*/
    font-size: calc(var(--index) * 0.885);
    font-family: 'Satoshi-Variable';
    font-weight: 400;
}

.wrapper{
    width: 94vw !important;
    margin-top: 2%;

    
    position: relative;
    
}

.wrapper .carousel{
    font-size: 0px;
   
    overflow-x: hidden !important;
    white-space: nowrap;
    scroll-behavior:smooth;
    margin-left: 6%;
    padding-top: 3%;
    padding-bottom: 5%;

}

.carousel.dragging{
    scroll-behavior:auto;
    cursor: grab;
}


.carousel.dragging .card-house{
    pointer-events: none;
}

.wrapper i{
    z-index: 5;
    margin-left: 2%;
    top: 50%;
    border: 3px solid rgba(35,35,35,1);
    color: white;
    background-color: #353535;
    height: 45px;
    width: 45px;
    position: absolute;
    text-align: center;
    line-height: 44px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 1.2rem;
    transform: translateY(-50%);
    transition: 0.5s all ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wrapper i:hover{

    border: 3px solid rgba(35,35,35,0.7);
    color: #353535;
    background-color: white;
}

.wrapper i:first-child{
    left: 0px;
    display: none;
}

.wrapper i:last-child{
    right: -4%;
}


.container-cards-house{
    margin-top: 2%;
    display: inline-flex;
    margin-left: 6%;
    align-items: center;
    min-width: 100vw !important;
    border: 1px solid red;
}

/*
.card-house{
    
    margin-right: 30px;
    box-shadow: 0px 4px 16px  rgba(0,0,0,0.20);
    

    width: 520px !important;
    height: 450px;
    width: 30vw;



    width: 480px;
    height: 530px;
    transition: 0.3s all ease-in-out;
}*/

.card-house{
    margin-right: 30px;
    box-shadow: 0px 4px 16px  rgba(0,0,0,0.15);
    /*width: 520px !important;
    height: 450px;
    width: 30vw;*/
    /*width: 500px !important;*/
    width: calc(100vw/3) !important;
    /*height: 530px !important;*/
    height: calc(70vh);
    transition: 0.3s all ease-in-out;
    display: inline-flex;
    cursor: pointer;
    flex-direction: column;
}

.button-card-house{
    display: inline-flex;

    flex-direction: column;
}


.card-house:hover{
    box-shadow: 0px 4px 16px  10px rgba(0,0,0,0.2);
    cursor: pointer;
}

.card-img-container{
    width: 100%;
    height: 65%;

    position: relative;
}

.card-img-container img{
    position: relative;
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.tipo-adquisicion-container{
    position: absolute;
    width: 30%;
    padding: 1vh 2vw;
    z-index: 1;
    background-color: rgba(255, 255, 255, 0.75);
    text-align: center;
    display: flex;
    align-items: center !important;
    justify-content: center !important;
}

p{
    margin-bottom: 0;
}

.tipo-adquisicion{
    font-family: 'Brandon-Grotesque-Bold';
    font-family: 'Brandon-Grotesque-Black';
    text-transform: uppercase;
    /*font-size: 18px;*/
    font-size: calc(var(--index) * 0.796);
    letter-spacing: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    
    height: 100%;
}

.tipo-adquisicion.venta, .card-titulo.venta p{
    color: #689F38;
}

.tipo-adquisicion.renta, .card-titulo.renta p{
    color: #1976D2;
}



.precio-card.vendida{
    color: #D32F2F;
    /*font-size: 18px;*/
    font-size: calc(var(--index) * 0.796);
    letter-spacing: 6px;
}

.card-titulo.vendida p{
    color: #D32F2F;
}

.precio-card-container{
    position: absolute;
    width: 35%;
    padding: 3px 5px; 
    z-index: 1;
    background-color: rgba(255, 255, 255, 0.75);
    text-align: center;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.precio-card{
    font-family: 'Brandon-Grotesque-Medium';
    color: #252525;
    text-transform: uppercase;
    /*font-size: 19px;*/
    font-size: calc(var(--index) * 0.840);
    
}

.card-data-container{
    width: 100%;
    height: 35%;

    display: flex;
    flex-wrap: wrap;
}

.card-data-c1{
    height: 80%;
    width: 80%;
    padding: 0px 15px;
    padding-top: 10px;
   
}
.card-data-c2{
    height: 80%;
    width: 20%;
   display: flex;
   flex-direction: column;
   justify-content: flex-end;
   align-items: center;
   
}
.card-direccion{
    width: 100%;
    height: 15%;

    display: flex;
    padding: 0px 15px;
    align-items: center;
    justify-content: flex-start;
    font-family: 'Satoshi-Variable';
    font-weight: 700;
    /*font-size: 14px;*/
    font-size: calc(var(--index) * 0.6195);
    line-height: 14px;
    margin-bottom: 10px;
    
}


.card-direccion p{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card-titulo{
    width: 100%;
   
    height: 20%;
    display: flex;
    align-items: center;
    padding-top: 15px;
    white-space: nowrap;
}

.card-titulo p{
    font-family: 'Brandon-Grotesque-Bold';
    color: #689F38;
    text-transform: uppercase;
    /*font-size: 26px;*/
    font-size: calc(var(--index) * 1.150);
}

.card-descripcion{
    width: 100%;
 
    height: 30%;
    display:flex;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
}

.card-descripcion p{
    white-space: nowrap;
    width: 100%;

    font-family: 'Satoshi-Variable';
    font-weight: 500;
    /*font-size: 14px;*/
    font-size: calc(var(--index) * 0.6195);

}

.card-caracteristicas{
    width: 100%;
    height: 40%;
    margin-top: 1%;
    display: flex;
}

.col-caract-1{
    width: 50%;
  
}
.col-caract-2{
    width: 50%;
    
}

.content-caract{
    height: 50%;
    width: 100%;
 
   
    display: flex;
    align-items: flex-end;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 5%;
}

.content-caract svg{
    width: 25px;
    height: 25px;
    margin-right: 4px;
    fill: #bdbdbd ;
}

.content-caract img{
    width: 25px;
    height: 25px;
    margin-right: 4px;
    fill: #bdbdbd ;
}

svg path{
    fill: #616161  ;
}

.content-caract span{
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    /*font-size: 13px;*/
    font-size: calc(var(--index) * 0.5752);
}


.card-info{
    width: 100%;
    height: 35%;
   
    display: flex;
    align-items: center;
    justify-content: center;

}
.card-info a{
  
    width: 90%;
    height: 90%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-info svg{
    width: 90%;
    height: 90%;
}

.card-whats{
    width: 100%;
    height: 35%;
 
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-whats a{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-whats img{
    height: 100%;
    object-fit: cover ;
}

.home-section4{
    margin-top: 10vh;
    width: 100%;
    height: 50vh;
    padding: 0% 6%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-family: 'Brandon-Grotesque-Light';
    /*font-size: 30px;*/
    font-size: calc(var(--index) * 1.341);
    
    background-image: url(../images/back-gra-3.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    color: white;
    letter-spacing: 3px;
}

.home-contacto{
    margin-top: 10vh;
    width: 100%;
    height: 100vh;
    display: flex;
    background-color: white;
}

.contacto-container-img,.contacto-container-text{
    
    width: 50%;
    height: 100%;
    
}

.contacto-container-img {
    background-image: url(../images/contacto-img.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.contacto-container-text{
    display: flex;
    align-items: center;
    justify-content: center;
}

.contacto-text-contain{
    width: 70%;
}

.contacto-text-contain h1{
    font-family: 'Brandon-Grotesque-Light';
    text-align: center;
    /*font-size: 52px;*/
    font-size: calc(var(--index) * 2.301);
    margin-bottom: 7vh;

}

.text-contacto{
    margin-bottom: 7vh;
}

.contacto-text-contain p{
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    /*font-size: 19px;*/
    font-size: calc(var(--index) * 0.8407);
    text-align: center;
}

.contacto-subtitle{
    font-family: 'Satoshi-Variable';
    font-weight: 600;
    display: block;
    text-align: center;
    width: 100%;
    margin-top: 2vh;
    margin-bottom: 1vh;
    /*font-size: 22px;*/
    font-size: calc(var(--index) * 0.9735);
}
@media only screen and (min-width: 1900px) {

}


@media only screen and (max-width: 668px) {

    .precio-card.vendida{
        font-size: calc(var(--index) * 0.996);
        letter-spacing: 5px;
    }
    .tipo-adquisicion-container{
        width: 40%;
    }

    .precio-card-container{
        width: 40%;
    }

    #img-desk{
        display: none;
    }

    #img-mob{
        display: block;
    }

    .home-1{
        height: 90vh;
    }

    .container-hero h1{
        font-size: calc(var(--index) * 3.37);
        letter-spacing: 6px;
    }

    .container-hero p{
        font-size: calc(var(--index) * 1.285);
        text-align: center;
        letter-spacing: 5px;
    }

    .home-section2{
        height: 100vh;
        flex-direction: column;
    }

    .home-venta, .home-renta{
        width: 100%;
        height: 50%;
    }

    .title-section-home{
        font-size: calc(var(--index) * 2.085);
    }

    .text-section-home{
        font-size: calc(var(--index) * 1.385);
    }

    .home-section3{
        margin-top: 10%;
    }

    .card-house{
        margin-right: 15px;
        width: 85vw !important;
        height: 55vh !important;
    }

    .tipo-adquisicion{
        font-size: calc(var(--index) * 1.296);
    }

    .precio-card{
        font-size: calc(var(--index) * 1.340);
    }

    .card-titulo p{
        font-size: calc(var(--index) * 1.650);
    }

    .card-descripcion p{
        font-size: calc(var(--index) * 1.0195);
        line-height: 12px;
    }

    .card-descripcion{
        flex-grow: 1;
    }

    .content-caract svg{
        width: 17px;
        height: 17px;
    }

    .content-caract img{
        width: 20px;
        height: 20px;
    }

    .content-caract span{
        font-size: calc(var(--index) * .8752);
    }

    .card-direccion{
        width: 85%;
        font-size: calc(var(--index) * 0.9195);
    }

    .home-section4{
        height: 40vh;
        font-size: calc(var(--index) * 1.471);
    }

    .home-contacto{
        flex-direction: column;
        height: 60vh;
    }

   .contacto-container-text{
        width: 100%;
        height: 100%;
        background-image: url(../images/contacto-mob.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        color: white;
    }

    .contacto-container-img{
      display: none;
    }

    .contacto-text-contain h1{
        font-size: calc(var(--index) * 2.801);
        margin-bottom: 3vh;
    }

    .contacto-text-contain p{
        font-size: calc(var(--index) * 1.2407);
    }

    .contacto-subtitle{
        font-size: calc(var(--index) * 1.3735);
    }

    .text-contacto{
        margin-bottom: 3vh;
    }
}

@media only screen and (max-height: 475px ) and (orientation: landscape){
    .container-hero h1{
        
    }

    .home-1{
        height: 150vh !important;
    }

    .home-section2{
        height: 120vh  !important;
        flex-direction: row !important;
    }

    .home-venta, .home-renta{
        width: 50%  !important;
        height: 100%  !important;
    }

    .card-house{
        margin-right: 15px;
        width: calc(100vw/2) !important;
        height: 450px !important;
    }

    .home-contacto{
        height: 120vh;
    }

}


@media only screen and (min-height: 1000px ) and (orientation: portrait){
    .container-hero h1{

    }
    .mobile-menu{
        display: none;
    }

    .home-1{
        height: 60vh !important;
    }

    .container-hero p{
        text-align: center;
    }

    .home-section2{
        height: 50vh !important;
    }

    .home-section4{
        height: 40vh !important;
    }

    .home-contacto{
        height: 50vh !important;
    }

    
    
    .title-section-home{
        /*font-size: 36px;*/
        font-size: calc(var(--index) * 1.785) !important;
    }

    .text-section-home{
        /*font-size: 20px;*/
        font-size: calc(var(--index) * 1.085) !important;
    }

    
    
    .tipo-adquisicion{
        font-size: calc(var(--index) * 0.996)!important;
    }

    
    .precio-card{
        font-size: calc(var(--index) * 1.040) !important;
    }

    .card-direccion{
        font-size: calc(var(--index) * 0.7195) !important;
    }

    .card-titulo p{
        font-size: calc(var(--index) * 1.350);
    }

    .card-descripcion p{
        font-size: calc(var(--index) * 0.7195);
    }

    .content-caract span{
        font-size: calc(var(--index) * 0.7752);
    }
    
    .precio-card.vendida{
        font-size: calc(var(--index) * 0.996);
    }

    .contacto-text-contain h1{
        margin-bottom: 2vh !important;
    }

    .text-contacto{
        margin-bottom: 3vh !important;
    }
    .contacto-subtitle{
        margin-top: 1vh !important;
        margin-bottom: 1vh !important;
    }
    
    .card-house{
        width: 60vw !important;
       /* height: 650px;*/
       height: calc(100vh/2) !important;;
    }
}

@media only screen and (max-width: 1025px ) and (min-width: 835px ) {
  
    .container-hero h1{
        font-size: calc(var(--index) * 3.57);
        letter-spacing: 6px;
    }

    .container-hero p{
        font-size: calc(var(--index) * 1.185);
        text-align: center;
    }


    .home-1{
        height: 90vh;
    }

    .home-section2{
        height: 85vh;

    }

    
    .title-section-home{
        /*font-size: 36px;*/
        font-size: calc(var(--index) * 1.785);
    }

    .text-section-home{
        /*font-size: 20px;*/
        font-size: calc(var(--index) * 1.085);
    }

   
    
    .tipo-adquisicion{
        font-size: calc(var(--index) * 0.996);
    }

    .card-house{
        width: calc(100vw/2) !important;
        height: calc(65vh);
    }

    .precio-card{
        font-size: calc(var(--index) * 1.040);
    }

    .card-direccion{
        font-size: calc(var(--index) * 0.7195);
    }

    .card-titulo p{
        font-size: calc(var(--index) * 1.350);
    }

    .card-descripcion p{
        font-size: calc(var(--index) * 0.7195);
    }

    .content-caract span{
        font-size: calc(var(--index) * 0.7752);
    }

    
    .home-section4{
        font-size: calc(var(--index) * 1.541);
    }

    .precio-card.vendida{
        font-size: calc(var(--index) * 0.996);
    }

    
    .contacto-text-contain h1{
        font-size: calc(var(--index) * 2.501);
    }

    .contacto-subtitle{
        font-size: calc(var(--index) * 1.1735);
    }

    .contacto-text-contain p{
        font-size: calc(var(--index) * 1.0407);
    }
    
}

@media only screen and (max-width: 1365px ) and (min-width: 1026px ) {
    .container-hero h1{
        font-size: calc(var(--index) * 3.47);
        letter-spacing: 6px;
    }

    .container-hero p{
        font-size: calc(var(--index) * 1.085);
        text-align: center;
    }

    .home-1{
        height: 90vh;
    }

    .home-section2{
        height: 85vh;
    }

    .title-section-home{
        /*font-size: 36px;*/
        font-size: calc(var(--index) * 1.785);
    }

    .text-section-home{
        /*font-size: 20px;*/
        font-size: calc(var(--index) * 1.085);
    }

    .tipo-adquisicion{
        font-size: calc(var(--index) * 0.996);
    }

    .card-house{
        width: calc(100vw/2.3) !important;
        height: calc(65vh);
    }

    .precio-card{
        font-size: calc(var(--index) * 1.040);
    }

    .card-direccion{
        font-size: calc(var(--index) * 0.7195);
    }

    .card-titulo p{
        font-size: calc(var(--index) * 1.350);
    }

    .card-descripcion p{
        font-size: calc(var(--index) * 0.7195);
    }

    .content-caract span{
        font-size: calc(var(--index) * 0.7752);
    }

    .home-section4{
        font-size: calc(var(--index) * 1.541);
    }

    .precio-card.vendida{
        font-size: calc(var(--index) * 0.996);
    }

    .contacto-text-contain h1{
        font-size: calc(var(--index) * 2.501);
    }

    .contacto-subtitle{
        font-size: calc(var(--index) * 1.1735);
    }

    .contacto-text-contain p{
        font-size: calc(var(--index) * 1.0407);
    }
}
/*
@media only screen and (min-height: 1000px ) and (orientation: portrait){
    .home-1{
        height: 60vh;
    }

    .container-hero p{
        text-align: center;
    }

    .home-section2{
        height: 50vh;
    }

    .home-section4{
        height: 40vh;
    }

    .home-contacto{
        height: 50vh;
    }

    
    .card-house{
        width: calc(100vw/1.8) !important;
        height: calc(50vh);
    }
}

@media only screen and (max-width: 1365px ) and (min-width: 669px ) and (orientation: landscape){
    .card-house{
        width: calc(100vw/3) !important;
        height: calc(60vh);
    }
}*/




/*****************************FIN HOME*********************************/

/*****************************FOOTER*********************************/
footer{
    width: 100%;
    height: 35vh;
    background-color: #353535;
    display: flex;
    align-items: center;
}

.fo-logo{
    width: 25%;
    height: 85%;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-right: 3px solid rgba(255, 255, 255, 0.5);
}

.fo-img-logo{
    width: 80%;
   
    display: flex;
    align-items: center;
    justify-content: center;
    
}

.fo-img-logo img{
    width: 40%;
    height: 95%;
}

.copy{
    color: white;
    font-family: 'Brandon-Grotesque-Light';
    /*font-size: 12px;*/
    font-size: calc(var(--index) * 0.531);
    
}

.content-footer{
    width: 75%;
    height: 100%;
    
}

.fo-data{
    width: 100%;
    height: 70%;
    
    display: flex;
    
}

.fo-menu{
    width: 40%;
    height: 100%;
    /*font-size: 16px;*/
    font-size: calc(var(--index) * 0.708);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: white;
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    letter-spacing: 1px;
    padding-top: 3%;
}

.fo-menu p{
    margin-bottom: 7px;
    color: white;
}

.fo-menu p a{
   
    color: white;
}


.fo-datos{
    width: 60%;
    height: 100%;
/*font-size: 16px;*/
font-size: calc(var(--index) * 0.708);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: white;
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    padding-top: 3%;
    text-align: center;
}

.fo-datos p{
    margin-bottom: 7px;
    text-align: center;
}

.fo-redes{
    width: 100%;
    height: 30%;
   
    display: flex;
    justify-content: center;
}

.fo-redes .redes{
    height: 100%;
    width: 10%;

    display: flex;
    align-items: center;
    justify-content: center;
}

.fo-redes .redes img{
    height: 35px;
    width: 35px;
}

@media only screen and (max-width: 668px) {
    footer{
        flex-direction: column-reverse;
        height: 55vh;
    }

    .fo-logo{
        width: 100%;
        height: 50%;
        border-right: none;
        border-top: 3px solid rgba(255, 255, 255, 0.5);
    }

    .copy{
        font-size: calc(var(--index) * 1.031);
        margin-top: 4px;
    }

    .fo-img-logo img{
        width: 40%;
        height: 95%;
    }


    .content-footer{
        width: 100%;
        height: 50%;
      
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
    }

    .fo-menu,.fo-datos{
        font-size: calc(var(--index) * 0.908);
    }

    .fo-data{
        
        height: 60%;
    }

    .fo-datos p{
        text-align: center;
    }
    .fo-redes{
        height: 40%;
        width: 70%;
       padding-bottom: 2%;
        
        justify-content: space-around;
    }

    .fo-redes .redes{
        align-items: flex-end;
    }

}

@media only screen and (max-height: 475px ) and (orientation: landscape){
    footer{
        flex-direction: row;
        height: 100vh;
    }

    .fo-logo{
        width: 40%;
        height: 90%;
        border-right: none;
        border-right: 3px solid rgba(255, 255, 255, 0.5);
        border-top: none !important;
    }

    .content-footer{
        width: 60%;
        height: 90%;
      
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
    }
}


@media only screen and (max-width: 1025px ) and (min-width: 835px ) {
    .fo-img-logo img{
        width: 45%;
        height: 95%;
    }

    .copy{
        font-size: calc(var(--index) * 0.631);
    }

    .fo-menu{
        font-size: calc(var(--index) * 0.808);
    }

    .fo-datos{
        font-size: calc(var(--index) * 0.808);
    }

    .fo-redes .redes img{
        height: 40px;
        width: 40px;
    }

}

@media only screen and (max-width: 1365px ) and (min-width: 1026px ) {

    .fo-img-logo img{
        width: 45%;
        height: 95%;
    }

    .copy{
        font-size: calc(var(--index) * 0.631);
    }

    .fo-menu{
        font-size: calc(var(--index) * 0.808);
    }

    .fo-datos{
        font-size: calc(var(--index) * 0.808);
    }

    .fo-redes .redes img{
        height: 40px;
        width: 40px;
    }
}

@media only screen and (min-height: 1000px ) and (orientation: portrait){
    footer{
      
        height: 22vh;
    }
}

/*****************************FIN FOOTER*********************************/




/*************************************INFORMACION****************************/

.container-info-portada{
    width: 100%;
    height: 95vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #212121;
}



.container-info-portada img{
    object-fit: contain;
    width: 100%;
    height: 100%;
}

.container-info-fotos{
    padding: 10px 10px;
    min-height: 15vh;
    display: flex;
    background-color: #212121;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.info-foto{
    height: 90%;
    width: 140px;
    margin-right: 10px;
    opacity: 0.6;
}

.info-foto:hover{
    cursor: pointer;
    opacity: 1;
}

.info-foto.active{
    border: 6px solid rgba(255, 255, 255, 1);
    opacity: 1;
}

.info-foto img{
    object-fit: cover;
    width: 100%;
    height: 100%;
}



.container-info-fotos img{
    height: 90%;
    width: 140px;
    margin-right: 10px;
    opacity: 0.6;
    object-fit: cover;
    transition: 0.2s all ease-out;
}

.container-info-fotos img.active{
    height: 90%;
    width: 140px;
    margin-right: 10px;
    opacity: 0.6;
    object-fit: cover;
    transition: 0.2s all ease-out;
    border: 6px solid rgba(255, 255, 255, 1);
    opacity: 1;
}

.container-info-fotos img:hover{
    cursor: pointer;
    opacity: 1;
}


.container-info{
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-around;
    padding-top: 30px;
    padding-bottom: 30px;
}

.content-info{
    width: 60%;
   
    box-shadow: 0px 4px 16px  rgba(0,0,0,0.10);
    padding: 20px 20px;
}

.content-info h1{
    font-family: 'Brandon-Grotesque-Regular';
    text-align: center;
    /*font-size:54px;*/
    font-size: calc(var(--index) * 2.3675);
    letter-spacing: 2px;
    text-transform: uppercase !important;
}


.info-precio{
    font-family: 'Brandon-Grotesque-Regular';
    text-align: center;
    /*font-size:36px;*/
    font-size: calc(var(--index) * 1.585);
    letter-spacing: 4px;
}


.info-direccion{
    font-family: 'Brandon-Grotesque-Regular';
    text-align: center;
    /*font-size:36px;*/
    font-size: 18px; font-size: calc(var(--index) * 0.796);
    letter-spacing: 4px;
}

.all-info{
    margin-top: 5%;
    width: 100%;
    padding: 3% 5%;
    font-family: 'Satoshi-Variable';
    font-weight: 600;
    /*font-size: 17px;*/
    font-size: calc(var(--index) * 0.7522) !important;
    color: rgba(0, 0, 0, 0.55);
    overflow: hidden;
    transition: 1s all ease-in-out;
 
}

.all-info span{
    font-family: 'Satoshi-Variable';
    font-weight: 800;
    color: rgba(0, 0, 0, 0.85);
}


.mostrar-mas, .mostrar-menos{
   
    width: 100%;
    padding: 3% 5%;
    font-family: 'Satoshi-Variable';
    font-weight: 700;
    /*font-size: 17px;*/
    font-size: calc(var(--index) * 0.7522);
    color: rgba(0, 0, 0, 0.65);
    text-align: right;
    text-decoration: underline;
}

.mostrar-mas:hover, .mostrar-menos:hover{
   cursor: pointer;
}

.content-caract-esp{
    width: 30%;
    
}

.cont-car-esp{
    width: 100%;
    box-shadow: 0px 4px 16px  rgba(0,0,0,0.15);
    padding: 20px 20px;
}



.container-caract{
    width: 100%;

    margin-bottom: 15%;
    margin-top: 5%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.container-espec{
    width: 100%;
    
    margin-bottom: 15%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
   
}

.container-espec h1, .container-caract h1{
    font-family: 'Brandon-Grotesque-Regular';
    text-align: center;
    /*font-size: 24px;*/
    font-size: calc(var(--index) * 1.062);
    letter-spacing: 2px;
   
}

.content-text-caract1{
    width: 60%;
    margin-top: 5%;

   
}

.content-text-caract1 span{
    font-family: 'Satoshi-Variable';
    font-weight: 600;
    /*font-size: 17px !important;*/
    font-size: calc(var(--index) * 0.7522);
    color: rgba(0, 0, 0, 0.55);
    margin-left: 12px;
}

.content-text-caract1 p svg{
    width: 30px;
    height: 30px;
    margin-right: 4px;
    fill: #bdbdbd ;
}

.content-text-caract1 p img{
    width: 30px;
    height: 30px;
    margin-right: 4px;
    fill: #bdbdbd ;
}

.icono-cocina{
    fill:none;
    stroke: #616161;
}

.content-text-caract1 p{
    
    display: flex;
    align-items: center;
    margin-bottom: 3%;
}


.content-text-caract{
    width: 70%;
    margin-top: 5%;

   
}

.info-sub{
    font-family: 'Satoshi-Variable';
    font-weight: 800;
    color: rgba(0, 0, 0, 0.85);
}

.container-espec p{
    font-family: 'Satoshi-Variable';
    /*font-size: 17px;*/
    font-size: 17px; font-size: calc(var(--index) * 0.7522);
    color: rgba(0, 0, 0, 0.55);
}

.container-vendedor{
    margin-top:10%;
    width: 100%;
    box-shadow: 0px 4px 16px  rgba(0,0,0,0.15);
    padding: 20px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    
}

.container-vendedor h1{
    margin-top: 5%;
    text-transform: uppercase;
    font-family: 'Brandon-Grotesque-Regular';
    text-align: center;
    /*font-size: 24px;*/
    font-size: calc(var(--index) * 1.062);
    letter-spacing: 2px;
}

.vendedor-texto{
    margin-top: 5%;
    width: 100%;
    padding: 3% 5%;
    font-family: 'Satoshi-Variable';
    font-weight: 600;
    /*font-size: 17px;*/
    font-size: 17px; font-size: calc(var(--index) * 0.7522);
    color: rgba(0, 0, 0, 0.55);
    text-align: center;
}

.nombre-vendedor{
    padding: 3% 5%;
    font-family: 'Satoshi-Variable';
    font-weight: 800;
    /*font-size: 19px;*/
    font-size: calc(var(--index) * 0.8407);
    color: rgba(0, 0, 0, 0.65);
    text-align: center;
}

.telefono-vendedor {
    font-family: 'Satoshi-Variable';
    font-weight: 600;
    /*font-size: 18px !important;*/
    font-size: calc(var(--index) * 0.796);
    
    color: rgba(0, 0, 0, 0.55);
    margin-left: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.telefono-vendedor svg{
    width: 30px;
    height: 30px;
    margin-right: 10px;
    fill: #bdbdbd ;
}

.vendedor-correo{
    margin-top: 5%;
    width: 60%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    background-color: #1E88E5;
    color: white;
    /*font-size: 20px;*/
    font-size: 20px; font-size: calc(var(--index) * 0.885);
    padding: 12px 16px;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(255, 101, 47, 0.2);
}

.vendedor-correo svg {
    width: 30px;
    height: 30px;
    margin-right: 10px;
    fill:white;
}

.vendedor-correo svg path{
    fill: white;
}

.vendedor-whats{
    margin-top: 5%;
    width: 60%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    background-color: #25D366;
    color: white;
     /*font-size: 20px;*/
     font-size: 20px; font-size: calc(var(--index) * 0.885);
    padding: 12px 16px;
    margin-bottom: 5%;
    box-shadow: 0 2px 5px rgba(255, 101, 47, 0.2);
}

.vendedor-whats a{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
}

.vendedor-whats img{ 
    width: 30px;
    height: 30px;
    margin-right: 10px;
}

.ficha{
    margin-top: 5%;
    width: 60%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    background-color: #a10808;
    color: white;
     /*font-size: 20px;*/
     font-size: 20px; font-size: calc(var(--index) * 0.885);
    padding: 12px 16px;
    margin-bottom: 5%;
    box-shadow: 0 2px 5px rgba(255, 101, 47, 0.2);
}

.ficha a{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
}

.ficha img{ 
    width: 30px;
    height: 30px;
    margin-right: 10px;
}


.all-info.gradient,.container-all-car.gradient{
    -webkit-mask-image: linear-gradient(#fff 70%, rgba(255,255,255,0));
}

.container-all-car.gradient{
    -webkit-mask-image: linear-gradient(#fff 70%, rgba(255,255,255,0));
}


.all-info.maxHeight{
    overflow: hidden;
    max-height: 70vh;
}

.container-all-car.maxHeight{
    overflow: hidden;
    max-height: 35vh;
}

.d-none{
    display: none;
}

.modal-header{
    background-color: #353535;
    color: white;
}

.modal-body{
    padding-top: 5%;
    display: flex;
    flex-direction: column;
    align-items: center;
}


.modal-body form{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.input-data.correo  input{
    color: #353535;
}

.input-data.correo  label{
    color: #353535;
}

.info-correo{
    font-family: 'Satoshi-Variable';
    font-weight: 700;
    font-size: 18px; font-size: calc(var(--index) * 0.796);
}

.instrucciones{
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    font-size: 16px; font-size: calc(var(--index) * 0.708);
    width: 80%;
    margin-bottom: 25px;
}


@media only screen and (max-width: 668px) {

    .info-correo{
    
        font-size: 30px; font-size: calc(var(--index) * 1.3275);
        text-align: center;
    }
    
    .instrucciones{
        
        font-size: 26px; font-size: calc(var(--index) * 1.1505);
        width: 90%;
    }

    .container-info-portada{
        position: absolute;
        height: 40vh;
        z-index: 100;
    }

    .container-info-fotos{
        margin-top: 40vh;
    }


    .container-info{
        flex-direction: column;
        padding: 0% 4%;
        margin-top: 7%;
    }

    .content-info{
        width: 100%; 
        margin-bottom:  10%;
        box-shadow: 0px 4px 16px  rgba(0,0,0,0.15);

    }

    .content-info h1{
        font-size: calc(var(--index) * 1.8675);
       width: 100%;

    }

    .info-precio{
        font-size: calc(var(--index) * 1.985);
    }

    .all-info{
        font-size: calc(var(--index) * 1.1522) !important;
        padding: 3% 0%;
    }

    .mostrar-mas, .mostrar-menos{
        font-size: calc(var(--index) * 1.3522);
    }

    .all-info.maxHeight{
        overflow: hidden;
        max-height: 40vh;
    }

    .content-caract-esp{
        width: 100%;   
    }

    .container-espec h1, .container-caract h1{
        font-size: calc(var(--index) * 1.562);
    }

    .content-text-caract1 span{
        font-size: calc(var(--index) * 1.1522);
    }
    
    .container-espec .content-text-caract{
        font-size: 17px; font-size: calc(var(--index) * 1.1522) !important;
    }

    .container-espec p{
        font-size: 17px; font-size: calc(var(--index) * 1.1522) !important;
    }
    
       .container-espec p{
        font-size: 17px; font-size: calc(var(--index) * 1.1522) !important;
    }

    .container-espec p span{
        font-size: 17px; font-size: calc(var(--index) * 1.1522) !important;
    }

    .container-all-car.maxHeight{
        overflow: hidden;
        max-height: 30vh;
    }

    .container-vendedor h1{
        font-size: calc(var(--index) * 1.562);
    }

    .vendedor-texto{
        font-size: 17px; font-size: calc(var(--index) * 1.2522);
    }

    .nombre-vendedor{
        font-size: calc(var(--index) * 1.5407);
    }

    .telefono-vendedor {
        font-size: calc(var(--index) * 1.396);
    }

    .vendedor-correo{
        font-size: 20px; font-size: calc(var(--index) * 1.385);
        text-align: center;
    }

    .vendedor-whats{
        font-size: 20px; font-size: calc(var(--index) * 1.385);
    }
}

@media only screen and (max-height: 475px ) and (orientation: landscape){
    .all-info.maxHeight{
        overflow: hidden;
        max-height: 150vh;
    }
    
    .container-all-car.maxHeight{
        overflow: hidden;
        max-height: 100vh;
    }
}


@media only screen and (min-height: 1000px ) and (orientation: portrait){
    .container-info-portada{
        height: 40vh;
    }

    .container-info{
        flex-direction: column;
        padding: 0% 4%;
        margin-top: 7%;
    }

    .content-info{
        width: 100%; 
        margin-bottom:  10%;
        box-shadow: 0px 4px 16px  rgba(0,0,0,0.15);
    }

    .content-caract-esp{
      
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .cont-car-esp, .container-vendedor{
        width: 45%;
        
    }

    .container-vendedor{
        width: 45%;
        height: 35vh;
        
    }

}

/************************************************FIN INFORMACION**********************/


/************************************************QUIENES SOMOS**********************/

.container-somos{
    width: 100%;
    height: 130vh;
    display: flex;
}

.content-somos-col1{
    width: 50%;
    height: 100%;

}

.somos-text{
    width: 100%;
    height: 50%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.somos-bg{
    position: absolute;
    width: 100%;
    height: 100%;
}

.somos-bg img{
    width: 100%;
    height: 100%;
    object-fit: cover;
   z-index:0;
}

.somos-bg-opacity{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.18);
    z-index: 1;
}

.somos-bg-opacity.type2{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.35);
    z-index: 1;
}


.somos-data{
    position: relative;
    z-index: 2;
    color: white;
 
    width: 80%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.somos-data h1{
    font-family: 'Brandon-Grotesque-Thin';
    /*font-size: 42px;*/
     font-size: calc(var(--index) * 1.8585);
    letter-spacing: 4px;
    margin-bottom: 5%;

}

.somos-data p{
    margin-bottom: 5%;
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    padding: 0px 6%;
    /*font-size: 20px;*/
    font-size: calc(var(--index) * 0.885);
}

.valores{
    margin-bottom: 2% !important;
}
/*
.home-renta{
    position: relative;
    background-image: url(../images/vive4.png);
   
    background-size: cover;
    background-repeat: no-repeat;
}

.home-venta{
    position: relative;
    background-image: url(../images/vive5.png);
    background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}*/

@media only screen and (max-width: 668px) {

    .container-somos{
        flex-direction: column;
        height: 200vh;
    }

    .content-somos-col1{
        width: 100%;
        height: 50%;
    }

    .somos-data h1{
        font-family: 'Brandon-Grotesque-Thin';
        font-size: calc(var(--index) * 2.4585);
    }

    .somos-data p{
        font-size: calc(var(--index) * 1.385);
        font-weight: 400;
    }
}

@media only screen and (max-height: 475px ) and (orientation: landscape){
    .container-somos{
        flex-direction: row;
        height: 200vh !important;
    }

    .content-somos-col1{
        width: 50%;
        height: 100%;
    }
}

@media only screen and (max-width: 1025px ) and (min-width: 835px ) {
    .somos-data h1{
        font-family: 'Brandon-Grotesque-Light';
        font-size: calc(var(--index) * 1.7585);
        letter-spacing: 2px;
    }

    .somos-data p{
        font-size: calc(var(--index) * 0.985);
    }
}

@media only screen and (max-width: 1365px ) and (min-width: 1026px ) {

    .container-somos{
        height: 130vh;
    }

    .somos-data h1{
        font-family: 'Brandon-Grotesque-Light';
        font-size: calc(var(--index) * 1.7585);
        letter-spacing: 2px;
    }

    .somos-data p{
        font-size: calc(var(--index) * 0.885);
    }
}

@media only screen and (min-height: 1000px ) and (orientation: portrait){
    .container-somos{
        height: 90vh;
    }

    .somos-data h1{
        text-align: center;
    }
}

/************************************************FIN QUIENES SOMOS**********************/


/******************Busqueda********************/

.container-form{
    background-image: url(../images/back-gra-3.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 70vh;
    padding: 0% 6%;
    display: flex;
    align-items: center;
}

.column-form-info{
    width: 50%;
    height: 70%;
   
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    border-right: 3px solid rgba(255, 255, 255, 0.75);
}

.column-form-info h1{
    font-family: 'Brandon-Grotesque-Thin';
    letter-spacing: 4px;
    /*font-size: 52px;*/
    font-size: calc(var(--index) * 2.301);
    color: white;
    width: 100%;
}
.column-form-info p{
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    /*font-size: 26px;*/
    font-size: calc(var(--index) * 1.1505);
    color: white;
    text-align: left;
    letter-spacing: 1px;
    width: 100%;
    margin-top: 10px;
}

.content-form{
    width: 50%;
    height: 70%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;

}

.content-form form{

    width: 100%;
    display: flex;
    flex-wrap: wrap;
}


.container-resultados{
    width: 100%;
    margin-top: 5%;
    display: flex;
    align-items: center;
    justify-content: center ;
    flex-wrap: wrap;
}

.container-resultados .card-house{
    
    margin-top: 2%;
    
}

.card-descripcion.b{
   display: flex;
   flex-wrap: wrap !important;
  padding-top: 10px;
}

.card-descripcion.b p{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
 
}

.pagination{
    padding:0% 6%;

    width: 100;
    color: #9e9e9e  ;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Brandon-Grotesque-Medium';
    font-size: 34px;
    letter-spacing: 5px;
    margin-top: 4vh;
    margin-bottom: 4vh;
}

.pagination .active{
    color: #252525;
    font-size: 36px;
}


.col1-form{
    height: 80%;
    width: 50%;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}

.col2-form{
    height: 80%;
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.button-buscar{
    width: 100%;
    height: 20%;

    display: flex;
    justify-content: center;
}

.button-buscar button{
    border: 2px solid white;
    height: 65px;
    width: 65px;
    border-radius: 50%;
    background-color: transparent;
    transition: 0.3s all ease-in;
    box-shadow: 0px 4px 16px  rgba(0,0,0,0.20);
}

.button-buscar button svg path{
    fill: white;
}

.button-buscar button:hover{
    background-color: rgba(255,255, 255, 1);
    cursor: pointer;
    height: 70px;
    width: 70px;
    box-shadow: 0px 4px 16px  rgba(0,0,0,0.30);
}

.button-buscar button:hover  svg {
    height: 35px;
    width: 35px;
}


.button-buscar button:hover  svg path{
    fill: #212121;
    stroke-width: 5px !important;
}

.input-data{
    height: 40px;
    width: 80%;
    position: relative;
    background-color: transparent;
    margin-bottom: 10%;
}

.input-data input{
    background-color: transparent;
   /*font-size: 20px;*/
   font-size: calc(var(--index) * 0.885);
    height: 100%;
    width: 100%;
    border: none;
    border-bottom: 2px solid silver;
    outline: none;
    color: white;
    font-family: 'Brandon-Grotesque-Medium';
    padding-left: 10px;
}

.input-data input:valid ~ label,
.input-data input:focus~ label
{
    transform: translateY(-30px);
    /*font-size: 12px;*/
    font-size: calc(var(--index) * 0.531);
    border: none;
}

.input-data  label{
    position: absolute;
    bottom: 10px;
    left: 0;
    color: white;
    pointer-events: none;
    transition: all 0.3s ease;
    font-family: 'Satoshi-Variable';
    font-weight: 400;
    letter-spacing: 2px;
    /*font-size: 14px;*/
    font-size: calc(var(--index) * 0.6195);
}

.input-data  .underline{
    position: absolute;
    bottom: 0px;
    height: 2px;
    width: 100%;

}

.input-data  .underline::before{
    position: absolute;
    content: '';
    height: 100%;
    width: 100%;
    background: #353535;
    transform: scaleX(0);
    transition: transform 0.3s ease ;
}

.input-data input:valid ~ .underline::before,
.input-data input:focus ~ .underline::before
{
    transform: scaleX(1);
}

.input-data select{
    background-color: transparent;
    /*font-size: 20px;*/
    font-size: calc(var(--index) * 0.885);
    height: 100%;
    width: 100%;
    border: none;
    border-bottom: 2px solid silver;
    outline: none;
    color: white;
    font-family: 'Brandon-Grotesque-Medium';
    padding-left: 10px;
}

.input-data select option{
    background-color: #424242;
    margin-bottom: 20px !important;
}

.input-data select:valid ~ label,
.input-data select:focus~ label
{
    transform: translateY(-30px);
    /*font-size: 12px;*/
    font-size: calc(var(--index) * 0.531);
    border: none;
}


.input-data  label{
    position: absolute;
    bottom: 10px;
    left: 0;
    color: white;
    pointer-events: none;
    transition: all 0.3s ease;
}

.input-data select:valid ~ .underline::before,
.input-data select:focus ~ .underline::before
{
    transform: scaleX(1);
}

@media only screen and (max-width: 668px) {

    .container-form{
        flex-direction: column;
    }

    .column-form-info{
        width: 95%;
        height: 40%;
        border-right: none;
        border-bottom: 3px solid rgba(255, 255, 255, 0.75);
    }

    .column-form-info h1{
        font-size: calc(var(--index) * 2.501);
        text-align: center;
        
    }

    .column-form-info p{
        font-size: calc(var(--index) * 1.6505);
        text-align: center;
    }

    .content-form{
        width: 95%;
        height: 60%;
    }

    .input-data{
        width: 90%;
    }

    .input-data input{
        font-size: calc(var(--index) * 1.385);
    }

    .input-data input:valid ~ label,
    .input-data input:focus~ label
    {
        font-size: calc(var(--index) * 0.831);
    }

    .input-data  label{
        font-size: calc(var(--index) * 0.8195);
    }

    .input-data select{
        font-size: calc(var(--index) * 1.385);
    }
    .input-data select:valid ~ label,
    .input-data select:focus~ label
    {
        transform: translateY(-30px);
        /*font-size: 12px;*/
        font-size: calc(var(--index) * 0.831);
        border: none;
    }

    .col1-form, .col2-form{
        height: 60%;
    }

    .container-resultados{
        flex-direction: column;
        flex-wrap: nowrap;
        
    }

    .container-resultados .card-house{
        margin-top: 8%;
        margin-right: 0px;
        height: 415px !important;
    }

    

    .card-data-c2{
        
    }

    .card-data-c1{
        
    }
}

@media only screen and (max-height: 475px ) and (orientation: landscape){
    .container-form{
        height: 180vh;
    }
}

@media only screen and (max-width: 1025px ) and (min-width: 835px ) {

    .container-resultados{
       
        align-items: center;
        justify-content: center;
    }

    .container-resultados .card-house{
        width: calc(100vw/2.3) !important; 
        
    }
}

@media only screen and (max-width: 1365px ) and (min-width: 1026px ) {
  
}