@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;500;700&display=swap');

html {
    box-sizing: border-box;
    font-size: 62.5%;
  }
  *, *:before, *:after {
    box-sizing: inherit;
  }

:root{

    --astaraPurple:#1E1932;
    --energeticOrange:#FF5A00;
    --vitalYellow:#FAB42D;
    --coolGrey:#E4E4E4;
    --blanco:#ffffff;
    --verde:#4D8A4E;

}

body{
  font-family: 'Montserrat', sans-serif;
  font-size: 1.6rem;
  color: var(--astaraPurple);
  font-weight: 300;
  
}

html, body {
  /*max-width: 100%;*/
  overflow-x: hidden;
}

/* Utilidades */


.img-100{width: 100%; height: auto;}
.container,
.container-fluid,
.row{padding: 0;}

h1,h2,h3,h4,h5{font-weight: 700;}
h1{font-size: 4rem; text-transform: uppercase;}
strong{font-weight: 700;}

.titulo-intro{
    font-size: 1.2rem;
    border-radius: 3rem;
    border: var(--astaraPurple) 1px solid;
    padding: .5rem 3rem;
    display: inline-block;
    margin-bottom: 3rem;
    color: var(--astaraPurple)!important;
    text-transform: uppercase;
}



.fondo-celeste{background-color: #DAFAFD;}
.fondo-celeste span{color: #3B88BE;}
.fondo-verde{
    background: url('../img/contenido/a.svg'), #D5E057;
    background-repeat: no-repeat;
    background-position: center center;
    background-position-y:-100%;
}


/* Contenido */

/* Menu */

.menu-principal{
    list-style: none;
    margin: 0;
    padding: 0;
    width: auto;
}

.menu-contenido{width: 100%; z-index: 20;}
.ev-logo img{height: 5.5rem; width:auto;}


.reserva-header {
    display: block;
    text-align: center;
}

.menu-principal a {
    color: var(--blanco);
    text-decoration: none;
    font-weight: 500;
}


/* Banner Home */

.titular-banner {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 25%;
}
.titular-banner h5 span{color: var(--vitalYellow);}

/* Presetacion */

.presentacion{padding: 12rem 0 3rem 0;}
.presentacion p{text-align: center;}

.sostenibilidad{margin-top: 6rem; margin-bottom: 12rem;}
.sostenibilidad h3{font-size: 2.8rem; margin-bottom: 3rem;}
.lista-sostenibilidad{padding: 0; list-style: none;}
.lista-sostenibilidad li {
    margin-bottom: 1rem;
    display: flex;
}
.lista-sostenibilidad span {
    background-color: var(--coolGrey);
    color: var(--astaraPurple);
    width: 3rem;
    height: 3rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-right: 1rem;
    border-radius: 3rem;
    font-weight: 700;
}

.sostenibilidad-texto{padding-left: 6rem;}
.sostenibilidad .row{align-items: center;}

.testimoniales{padding: 9rem 0 30rem 0;}
.testimoniales h1{text-align: center;}
.testimoniales .titulo-intro{width: 20rem; text-align: center; margin: 0 auto; display: block; margin-bottom: 3rem;}
.item-testimonio{display: flex; margin: 0 auto; align-items: center; padding-top: 12rem;}
.item-testimonio img{width: 28.6rem;}
.testimonio-texto span{display: inline-block; color: var(--astaraPurple); font-weight: 500; margin-bottom: 1.5rem;}

.testimonios .carousel-indicators{bottom: -6rem;}
.testimonios .carousel-indicators [data-bs-target]{
    background-color: #61BFD4;
    width: 18px;
    height: 18px;
    border-radius: 3rem;
    border-top:inherit;
    border-bottom: inherit;
}
.testimonios .carousel-indicators .active{
    background-color: var(--astaraPurple);
}
.item-testimonio{
    background-image: url("../img/contenido/testimoniales_bckgr.png");
    background-repeat: no-repeat;
    background-position-x: 100%;
    background-position-y: 55% ;
}

.contenido-testimoniales{position: relative;}
.legal-reserva{color: var(--blanco); font-size: 1rem; opacity: .7;}
.legal-reserva span{color: var(--blanco);}

/* Reservas */

.formulario-reserva-contenido {
    padding: 5rem 5rem 0 5rem;
    bottom: -20rem;
    border-radius: 3rem;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 99;
}

.formulario-reserva-contenido{
    background-color: var(--astaraPurple);
}

.formulario-reserva-contenido h1 {
    color: var(--blanco);
    font-size: 3.3rem;
    font-weight: 700;
    text-align: center;
}
.formulario-reserva-contenido h3 {
    text-align: center;
}

.formulario-reserva-contenido .titulo-intro{
    border: var(--vitalYellow) 1px solid;
    color: var(--vitalYellow)!important;
    width: 25rem;
    text-align: center;
    margin: 0 auto;
    display: block;
    margin-bottom: 3rem;
}

.calculadora{padding: 20rem 0; text-align: center;}
.item-calculadora{display: flex; align-items: center; margin-bottom: 1.5remrem; border-bottom: 1px solid var(--astaraPurple); padding: 1.5rem 0;}
.item-calculadora img{display: block; margin-right: 1.5rem;}
.item-calculadora .cal-desc{text-align: left;}
.cal-desc span{font-weight: 700; font-size: 2.4rem; line-height: 1rem;}
.calculadora-form{border: 1px solid var(--verde); padding: 6rem; border-radius: 3rem; margin-top: 6rem;}
.legal-calculadora{font-size: 1.2rem; margin-bottom: auto; margin-top: 3rem;}
.item-calculadora:last-child{border-bottom: none;}

.vehiculos{text-align: center; padding: 12rem 0;}
.vehiculos h1{margin-bottom: 3rem;}

.lista-vehiculos{display: grid; grid-template-columns: repeat(2, 50%); padding: 0 6rem; position: relative; margin-top: 9rem;}

.desc-vehiculos{
    background-color: #ffffff;
    padding: 15rem 6rem 6rem 6rem;
    border-radius: 3rem;
    box-shadow: 10px 10px 21px 0px rgba(0,0,0,0.19);
    -webkit-box-shadow: 10px 10px 21px 0px rgba(0,0,0,0.19);
    -moz-box-shadow: 10px 10px 21px 0px rgba(0,0,0,0.19);
    position: relative;
}
.desc-vehiculos ul{padding: 0; list-style: none; padding: 0 6rem;}
.desc-vehiculos ul li{display: flex; margin-bottom: 1.5rem; border-bottom: 1px solid #82D973; padding-bottom: 3rem; align-items: center;}
.desc-vehiculos ul li:last-child{border-bottom: none;}
.item-vehiculo{margin: 0 3rem;}
.ico-desc{display: block; margin-right: 3rem;}
.ico-desc img{width: 50px; height: auto;}
.vehi-desc{text-align: left;}
.ver-video img{margin-right: 1rem;}
.ver-video{
    display: inline-block;
    border: 2px solid #3C6A32; 
    text-decoration: none;
    color: #3C6A32;
    font-weight: 700;
    padding: 1rem 3rem;
    border-radius: 1rem;
    margin-top: 3rem;
    width: 65%;
}



.titulo-vhiculo{font-weight: 700; font-size: 2.4rem; display: block; margin-bottom: 3rem;}
.vehiculos span{color: #4D8A4E;}


.videos{padding: 12rem 0; text-align: center;}

.videos span{color: var(--vitalYellow);}
.videos h1{margin-bottom: 3rem;}
.galeria-videos{margin-top: 9rem;}
.video-item{border-radius: 1.5rem;}
.video-item iframe{border-radius: 1.5rem;}

/* Locales */

.mapa-contenido{position: relative;}
.locales{position: absolute; width: 100%;}
.locales h2{color: #ffffff; text-transform: uppercase; font-size: 2.4rem;}
.locales span{color: #D5E057;}
.header-locales{background-color: var(--astaraPurple);}
.contenido-locales{margin: 3rem;}
.header-locales{padding: 3rem; border-radius: 3rem 3rem 0 0;}
.lista-locales{
    background-color: #F6F5FA;
    padding: 3rem 3rem 3rem 3rem;
    border-radius: 0 0 3rem 3rem;
    height: 76rem;
    overflow-y: scroll;

}
.local-item{border-bottom: 1px solid var(--astaraPurple); padding-bottom: 3rem; margin-bottom: 3rem;}
.local-item:last-of-type{border-bottom: none!important;}
.local-item p{font-size: 1.4rem;}
.local-item span{font-weight: 700; color: var(--astaraPurple); margin-bottom: 1.5rem; display: block;}
.rutas{display: flex;}
.ruta-item{margin-right: 1.5rem;}
.ruta-item a{text-decoration: underline; color: var(--astaraPurple); font-weight: 500; font-size: 1.3rem;}
.ruta-item img{width: 15px; height: auto; margin-right: .5rem;}
.paginacion{display: flex; align-items: center;}
.paginacion span{color: var(--astaraPurple); font-size: 1.2rem;}
.paginas{margin-left: 1.5rem; display: flex;}
.paginas span{
    border: 1px solid var(--astaraPurple);
    width: 30px; height: 30px;
    display: flex;
    justify-content: center;
    margin-left: .5rem;
    align-items: center;
}
.paginas span.active{background-color: var(--astaraPurple); color: var(--blanco); font-weight: 700;}

/* Contenido Genérico */

.titulo-generico {margin: 6rem 0 6rem 0; text-align: center;}

/* Footer */

.logo-footer img{height: 4rem;}
footer a{font-size: 1.4rem; color: var(--astaraPurple); text-decoration: none;}
footer ul{padding: 0; list-style: none;}
.fotter-link-parent{font-weight: 700; margin-bottom: 1.5rem;}
.footer-menu{padding: 6rem;}
.copyright{background-color: var(--astaraPurple); color: var(--blanco); padding: 3rem;}
.logo-astara-footer img {height: 3rem;}
.credito-astara p {
    margin-left: 1.5rem;
    font-size: 1.2rem;
}

/* Booking */

.formulario-reserva-contenido h3{color: var(--vitalYellow); font-weight: 500; margin-bottom: 3rem;}
.iframe-resize{min-height: 20rem!important;}

.calculadora-form h4{
    text-align: justify;
    font-size: 2rem;
    margin-bottom: 3rem;
}
input[type="range"] {width: 100%;}
.range-calculadora p{font-size: 2.4rem; font-weight: 500;}

input[type="range"] {accent-color: #78BC0B;}
.range-calculadora p{font-size: 1.4rem;}
.range-calculadora p span{font-size: 2.4rem;}

.cal-desc span{font-size: 1.4rem;}
.cal-desc span strong{font-size: 2.4rem;}
.local-item{padding: 0 1.5rem 2rem 1.5rem; cursor: pointer;}
.local-item:hover{background-color:#e9e6f7;}

.nota p{margin-top: 1.5rem; font-size: 1.1rem;}

/* Media Queries */

@media (min-width: 320px){
    h1{font-size: 3.4rem;} 
   .img-m{display: block;}
   .img-d{display: none;}
   .item-testimonio{width: 75%; flex-direction: column;}
   .lista-vehiculos{display: block; padding: 0;}
   .desc-vehiculos{padding: 6rem 0 3rem 0;}
   .item-vehiculo {margin: 0 3rem 9rem 3rem;}
   .item-vehiculo:last-child{margin-bottom: 0;}
   .container{padding: 0 1.5rem;}
   .sostenibilidad-texto {padding: 3rem 1.5rem 0 1.5rem;}
   .presentacion h1{padding: 0 1.5rem;}
   .presentacion h1 img{width: 100%; height: auto;}
   .testimonio-texto{margin-left: 0rem; margin-top: 3rem; }
   .formulario-reserva-contenido{padding: 3rem 0; width: 95%; bottom: -40rem;}
   .testimoniales {padding: 9rem 0 36rem 0;}
   .calculadora{padding: 46rem 0 10rem 0;}
   .calculadora-form{padding: 3rem;}
   .calculadora-form h4{text-align: center;}
   .desc-vehiculos ul{padding: 0 3rem;}
   .imagen-vehiculo {
    width: 90%;
    top: -9rem;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    }
    .menu-desktop{display: none;}
    .menu-mobile{display: block;}
    .menu-mobile-azul{background-color: var(--astaraPurple)!important; padding: 1rem;}
    .menu-mobile .navbar-brand img{height: 2.5rem;}
    .menu-mobile .nav-link{
        font-weight: 300;
        font-size: 2rem;
    }
    .menu-mobile .nav-item{padding:1rem;}
    .navbar-brand h1{padding-left: 1rem;}
    .menu-mobile .menu-principal{padding-top: 3rem;}
    .legal-reserva{padding: 0 1.5rem;}
    .video-item iframe{width: 100%; height: 24rem;}
}

@media (min-width: 768px){
    h1{font-size: 3.6rem;}  
    .img-m{display: none;}
    .img-d{display: block;}

    .menu-principal{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .menu-principal ul li{padding: 0 1.5rem;}

    .reserva-header {
        border: 2px solid var(--blanco);
        text-decoration: none;
        padding: 0.5rem 3.5rem;
        border-radius: 3rem;
    }
    .item-testimonio{width: 90%;}
    .lista-vehiculos{display: grid; padding: 0 1.5rem; }
    
    .desc-vehiculos ul{padding: 0 3rem;}
    .menu-mobile{display: block;}
    
}

@media (min-width: 960px){ 
    h1{font-size: 4rem;} 
    .menu-contenido {padding-top: 3rem;}
    .menu-mobile{display: none;}
    .menu-desktop {display: block; position: absolute;}
    .titular-banner h5 {font-size: 7.5rem;}
    .presentacion img{height: 5rem; display: block; margin:  0 auto; margin-bottom: 3rem;}
    .presentacion p{text-align: center; font-size: 2.4rem;}
    .bajada-presentacion{width: 80rem; margin: 0 auto;}
    .sostenibilidad{padding: 0 9rem;}



    .contenido-locales{width: 50rem;}
    footer  .container .row{display: flex;}

    .credito-astara {
        display: flex;
        justify-content: flex-end;
    }

    .calculadora{padding: 36rem 0 10rem 0;}
    .desc-vehiculos{height: 64rem;}
    .range-calculadora{padding: 3rem 6rem;}

    .contenido-generico{width: 75%; margin:  0 auto 10rem auto; text-align: justify;}
    .contenido-generico p strong{display: block; margin: 3rem 0 1.5rem 0; }
    .item-testimonio{width: 90rem; flex-direction: initial;}
    .desc-vehiculos{ padding: 15rem 6rem 6rem 6rem;}
    .container{padding: 0;}
    .sostenibilidad-texto {padding-left: 6rem;}
    .presentacion h1 img{width: initial}
    .formulario-reserva-contenido{padding: 6rem 6rem 3rem 6rem; bottom: -20rem; width: 90%;}
    .testimonio-texto{margin-left: 3rem; margin-top: 0;}
    .testimoniales {padding: 9rem 0 40rem 0;}
    .calculadora{padding: 29rem 0 20rem 0;}
    .calculadora-form{padding: 6rem;}
    .calculadora-form h4{text-align: initial;}
    .desc-vehiculos ul{padding: 0 6rem;}
    .imagen-vehiculo {
        width: 80%;
        position: absolute;
        left: 0;
        right: 0;
        margin: 0 auto;
        top: -12rem;
    }

    .contenido-locales{
        -webkit-box-shadow: 10px 10px 21px 0px rgba(0,0,0,0.15);
        -moz-box-shadow: 10px 10px 21px 0px rgba(0,0,0,0.15);
        box-shadow: 10px 10px 21px 0px rgba(0,0,0,0.15);
        border-radius: 3rem;
    }
    
    .legal-reserva{padding: 0}
    .video-item iframe{width: 56rem; height: 36rem;}

    
}

@media (min-width: 1200px){ 
    .item-testimonio{width: 100rem; }
}

@media (min-width: 1200px){ 
   
}