/**********************************************************
        B O T O N    R E S E R V A
***********************************************************/
#contieneBotonReserva {
  top: 90px;
  right: 25px;
  width: 70px;
  z-index: 11;
  cursor: pointer;
}
#botonReserva img {
  width: 100%;
  transition: 0.5s ease-in-out;
}
#botonReserva img:hover {
  filter: grayscale(60%);
}
.posicionAbsoluta {
  position: absolute;
  transition: 0.8s ease-in-out;
}
.posicionFija {
  position: fixed;
  transition: 0.8s ease-in-out;
}
#disparadorBotonReserva {
  position: absolute;
  top: 10px;
  left: 10px;
}


/**********************************************************
        S E R V.    A L    H U É S P E D 
***********************************************************/

#contieneServiciosHuesped {
  position: absolute;
  top: 90px;
  right: 4%;
  z-index: 10;
  display: flex;
  vertical-align: top;
  cursor: pointer;
}
#contieneRRSSMenu {
  width: 150px;
  display: inline-block;
}
#contieneRRSSMenu p {
  font-size: 0.6rem;
  color: #044852;
}
#contieneServiciosHuesped #contieneRRSSMenu ul li{
   display: inline-block;
   width: 22%;
}
#contieneServiciosHuesped #contieneRRSSMenu ul li a img {
  width: 95%;
  filter: brightness(150%);
  transition: 0.5s ease;
}
#contieneServiciosHuesped #contieneRRSSMenu ul li a img:hover {
  filter: brightness(100%);
}
#contieneServiciosHuesped #botonServiciosHuesped {
   display: inline-block;
  width: 200px;
}
#contieneServiciosHuesped #botonServiciosHuesped img {
  width: 100%;
  transition: 0.5s ease-in-out;
}
#contieneServiciosHuesped #botonServiciosHuesped img:hover {
  filter: grayscale(100%);
}

/**********************************************************
        L A N D I N G    P A G E 
***********************************************************/
#landingContienePromos {
  margin-top: -60px;
  padding-bottom: 40px;
  width: 100%;
}
#landingContienePromos #landingBannerPromos {
  position: relative;
  width: 80%;
  max-width: 800px;
  margin: auto;
}
#landingContienePromos #landingBannerPromos .contieneTercios {
  width: 98%;
  position: absolute;
  left: 0;
  top: 45%;
}
#landingContienePromos #landingBannerPromos .contieneTercios .tercio {
  text-align: center;
}
#landingContienePromos #landingBannerPromos .contieneTercios .tercio .contieneSeisCuatro .seis h3 {
  text-align: right;
  font-size: 4rem;
  font-weight: 900;
  letter-spacing: 0;
}
#landingContienePromos #landingBannerPromos .contieneTercios .tercio .contieneSeisCuatro .cuatro h5 {
  text-align: left;
  font-size: 1.2rem;
}
#landingContienePromos #landingBannerPromos .contieneTercios .tercio .contieneSeisCuatro .cuatro h6 {
  text-align: left;
  font-size: 1.2rem;
  font-weight: 600;
}
#landingContienePromos #landingBannerPromos .contieneTercios .tercio .infoPromo {
  width: 85%;
  margin: auto;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 0.9rem;
  padding-top: 5px;
}
#landingContienePromos #landingBannerPromos img {
  width: 100%;
}

/*Landing Poster*/

#contienePoster {
  width: 90%;
  max-width: 850px;
  margin: auto;
}
#contienePoster img {
  width: 100%;
  border-radius: 15px;
}

/*Landing Instalaciones*/

#landingInstalaciones {
  width: 90%;
  max-width: 1200px;
  margin: auto;
}
#landingInstalaciones .contieneDosColumnas .landingItemInstalaciones {
  position: relative;
   display: flex;
  justify-content: center; 
  align-items: center; 
}
#landingInstalaciones .contieneDosColumnas .landingItemInstalaciones img{
  width: 100%;
  max-width: 580px;
  box-shadow: 1px 7px 14px 0px rgba(0,0,0,0.66);
  -webkit-box-shadow: 1px 7px 14px 0px rgba(0,0,0,0.66);
  -moz-box-shadow: 1px 7px 14px 0px rgba(0,0,0,0.66);
}
#landingInstalaciones .contieneDosColumnas .landingItemInstalaciones .infoHover {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80%;
  transform: translate(-50%, -50%);
  color: white;
}
#imagenHover01, #imagenHover02, #imagenHover03, #imagenHover04, #imagenHover05 {
  z-index: 2;
}
#landingInstalaciones .contieneDosColumnas .landingItemInstalaciones .infoHover h2 {
  font-size: 1.4rem;
  line-height: 1.5rem;
  margin-bottom: 10px;
}
#landingInstalaciones .contieneDosColumnas .landingItemInstalaciones .infoHover p {
  font-size: 0.9rem;
}
#landingInstalaciones .contieneDosColumnas .landingItemInstalaciones .infoHover a {
  color: white;
}
#landingInstalaciones .contieneDosColumnas .cajaDosColumnas #columna01 {
  z-index: 2;
}
#landingInstalaciones .contieneDosColumnas #itemColumna02 {
  margin-right: -30px;
  margin-top: -40px;
  margin-left: 40px;
}
#landingInstalaciones .contieneDosColumnas #itemColumna03 {
  width: 75%;
  margin: auto;
  margin-top: -15px;
}
#landingInstalaciones .contieneDosColumnas .landingItemInstalaciones .cajaTextoColumna {
  padding: 20px;
  color:white;
  text-align: right;
}
#landingInstalaciones .contieneDosColumnas .landingItemInstalaciones .cajaTextoColumna h3 {
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 10px;
}
#landingInstalaciones .contieneDosColumnas .landingItemInstalaciones .cajaTextoColumna p {
  font-size: 0.8rem;
  line-height: 1.4rem;
}

/* Experiencias */

#landingExperiencias {
  width: 100%;
  position: relative;
  margin-top: -60px;
}
#landingExperiencias #textoExperiencias {
  position: absolute;
  right: 9%;
  top: 35%;
  width: 30%;
  text-align: right;
  color: white;
}
#landingExperiencias #textoExperiencias h3 {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 20px;
}
#landingExperiencias #textoExperiencias p {
  font-size: 0.9rem;
  line-height: 1.2rem;
  margin-bottom: 10px;
}
#landingExperiencias #fondoExperiencias {
  width: 100%;
}

 /* Landing Galeria */

#landingGaleria {
  width: 100%;
  padding: 60px 0;
}
#landingGaleria .cajaGaleria {
  width: 80%;
  margin: auto;
}
#landingGaleria .cajaGaleria .filaGaleria {
  width: 100%;
  display: flex;
}
#landingGaleria .cajaGaleria .filaGaleria .itemGaleria {
  width: 33.33%;
  border: 1px solid rgb(255, 255, 255);
  overflow: hidden;
}
#landingGaleria .cajaGaleria .filaGaleria .itemGaleria img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    transition: 0.4s ease-in-out;
}
#landingGaleria .cajaGaleria .filaGaleria .itemGaleria img:hover {
  filter:  saturate(150%);
  cursor: pointer;
}

/* Landing Grupos y Eventos */

#landingGrupos {
  width: 100%;
  position: relative;
  padding: 90px 0;
}
#landingGrupos #textoGrupos {
  color: white;
  width: 80%;
  margin: auto;
  margin-top: 35%;
}
#landingGrupos #fondoTextoGrupos {
  position: absolute;
  top: 5%;
  right: 6%;
  width: 30%;
  height: 90%;
  max-height: 630px;
  margin-bottom: 5%;
  background-color: #0a89a9;
  background-image: url(../images/landing/fondoTextoGrupos.webp);
  background-position: center;
  background-size: contain;
  box-shadow: -1px 6px 11px 0px rgba(0,0,0,0.75);
-webkit-box-shadow: -1px 6px 11px 0px rgba(0,0,0,0.75);
-moz-box-shadow: -1px 6px 11px 0px rgba(0,0,0,0.75);
z-index: 10;
}
#landingGrupos #fondoTextoGrupos h2 {
  font-size: 1.8rem;
  line-height: 2rem;
  margin-bottom: 10px;
}
#landingGrupos #fondoTextoGrupos p {
  font-size: 0.9rem;
  line-height: 1.3rem;
}

#landingGrupos #fondoGrupos {
  width: 100%;
}

/* Landing Habitaciones */

#landingHabitaciones {
  text-align: center;
  color: white;
  font-size: 2rem;
}
#landingHabitaciones #cajaLandingHabitaciones {
  width: 80%;
  margin: auto;
  padding: 9%;
  background-color: rgba(255, 255, 255, 0.485);
}
#landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones {
  width: 100%;
  display: flex;
}
#landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitaciones {
  position: relative;
  width: 33.33%;
  padding: 0.5%;
  transition: 0.5s ease-in-out;
}
#landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitacionesDoble {
  position: relative;
  width: 66.66%;
  padding: 0.5%;
  transition: 0.5s ease-in-out;
}
#landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitaciones .botonHabitaciones, #landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitacionesDoble .botonHabitaciones {
  position: absolute;
  width: fit-content;
  top: 30%;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  background-color: #0095dc;
  padding: 10px;
  border-radius: 8px;
  opacity: 0;
  transition: 0.5s ease-in-out;
}
#landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitaciones:hover .botonHabitaciones, #landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitacionesDoble:hover .botonHabitaciones {
  opacity: 1;
}
#landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitaciones .botonHabitaciones a, #landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitacionesDoble .botonHabitaciones a {
  font-size: 0.8rem;
  line-height:0.8rem;
  color: white;
}
#landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitaciones:hover, #landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitacionesDoble:hover {
  padding: 0;
}
#landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitaciones img, #landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitacionesDoble img {
  width: 100%;
}

/* Landing RRSS */

#landingRRSS {
  width: 100%;
  padding: 60px 0;
}
#landingRRSS #titulolandingRRSS {
  text-align: center;
  color: white;
  font-size: 1.8rem;
  line-height: 2rem;
}
#landingRRSS #cajaLandingRRSS {
  width: 100%;
  position: relative;
}
#landingRRSS #cajaLandingRRSS #fondoLandingRRSS {
  width: 100%;
}
#landingRRSS #cajaLandingRRSS #chicaLandingRRSS {
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
  top:10%;
  width: 30%;
  max-width: 750px;
}
#landingEnlacesRRSS {
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
  bottom:38%;
  width: 30%;
  max-width: 250px;
  padding: 8px 20px;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0.54);
}
#landingEnlacesRRSS ul {
  display: flex;
  justify-content: space-between;
}
#landingEnlacesRRSS ul li {
  width: 20%;
}
#landingEnlacesRRSS ul li a img {
  width: 90%;
  padding: 10%;
  margin: auto;
  transition: 0.5s ease-in-out;
}
#landingEnlacesRRSS ul li a img:hover {
  width: 100%;
  padding: 0;
  filter: invert(60%);
}

/* Landing Mapa */

.contieneMapa {
  width: 100%;
  position: relative;
  margin-top: -1%;
  z-index: 1;
}


@media (max-width: 768px) and (orientation: portrait) {

        
/**********************************************************
        B O T O N    R E S E R V A    M Ó V I L E S
***********************************************************/
      #contieneBotonReserva {
        right: auto;
        left: 20px;
        top: 80px;
        width: 55px;
      }

/**********************************************************
        W  H  A  T  S    M Ó V I L E S
***********************************************************/

        .contieneWhats{
          position: fixed;
          bottom: 10px;
          right: 70px;
          width: 50px;
        }
        .contieneWhats a img{
          width: 100%;
          opacity: .8;
          transition: 0.8s ease-in-out;
        }
        .contieneWhats a img:hover{
          opacity: 1;
        }
          

/**********************************************************
        S E R V.    A L    H U É S P E D    M Ó V I L E S
***********************************************************/

    #contieneServiciosHuesped {
      position: absolute;
      top: 90px;
      right: 4%;
      z-index: 10;
      display: flex;
      vertical-align: top;
    }
    #contieneRRSSMenu {
      width: 100px;
      height: fit-content;
      display: inline-block;
      justify-content: space-between;
      margin-right: -20px;
    }
    #contieneRRSSMenu p {
      display: none;
    }
    #contieneServiciosHuesped #contieneRRSSMenu ul li{
      display: inline-block;
      width: 20%;
    }
    #contieneServiciosHuesped #botonServiciosHuesped {
      width: 100px;
    }


/**********************************************************
        L A N D I N G    P A G E    M Ó V I L E S
***********************************************************/

      #landingContienePromos #landingBannerPromos .contieneTercios {
        top: 35%;
        margin-top: -5%;
      }
      #landingContienePromos #landingBannerPromos .contieneTercios .tercio .contieneSeisCuatro .seis {
        text-align: center;
      }
      #landingContienePromos #landingBannerPromos .contieneTercios .tercio .contieneSeisCuatro .seis h3 {
        font-size: 1.4rem;
      }
      #landingContienePromos #landingBannerPromos .contieneTercios .tercio .contieneSeisCuatro .cuatro h5 {
        font-size: 0.9rem;
        line-height: 0.9rem;
      }
      #landingContienePromos #landingBannerPromos .contieneTercios .tercio .contieneSeisCuatro .cuatro h6 {
        letter-spacing: 0;
        font-size: 0.6rem;
        line-height: 0.8rem;
      }
      #landingContienePromos #landingBannerPromos .contieneTercios .tercio .infoPromo {
        font-size: 0.5rem;
        font-weight: 400;
        line-height: 0.5rem;
        text-transform: lowercase;
      }
      #landingContienePromos #landingBannerPromos img {
        width: 100%;
      }


      
/*Landing Instalaciones Móviles*/

      #landingInstalaciones {
        padding: 40px 0;
      }
      #landingInstalaciones .contieneDosColumnas .landingItemInstalaciones .infoHover {
        display: block;
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        transform: translate(0, 0);
        background-color: white;
        color: rgb(49, 49, 49);
        padding: 20px;
        padding-top: 30px;
      }
      #landingInstalaciones .contieneDosColumnas .landingItemInstalaciones {
        display: block;
        border-radius: 8px;
        overflow: hidden;
        margin-bottom: 30px;
      }
      #landingInstalaciones .contieneDosColumnas .cajaDosColumnas #columna02 {
        order: 1;
      }
      #landingInstalaciones .contieneDosColumnas .cajaDosColumnas #columna01 {
        order: 2;
      }
      #imagenHover01, #imagenHover02, #imagenHover03, #imagenHover04, #imagenHover05 {
       display: block;
       position: relative;
      }
      #imagenHoverFondo01, #imagenHoverFondo02, #imagenHoverFondo03, #imagenHoverFondo04, #imagenHoverFondo05 {
        display: none;
      }
      #landingInstalaciones .contieneDosColumnas .cajaDosColumnas #columna01 {
        z-index: 2;
      }
      #landingInstalaciones .contieneDosColumnas #itemColumna02 {
        margin-right: 0px;
        margin-top: 0px;
        margin-left: 0px;
      }
      #landingInstalaciones .contieneDosColumnas #itemColumna03 {
        width: 100%;
        margin: auto;
        margin-top: 0x;
      }

      #landingInstalaciones .contieneDosColumnas .landingItemInstalaciones .cajaTextoColumna h3 {
        font-size: 1.4rem;
        font-weight: 600;
        margin-bottom: 10px;
      }
      #landingInstalaciones .contieneDosColumnas .landingItemInstalaciones .cajaTextoColumna p {
        font-size: 0.8rem;
        line-height: 1.4rem;
      }

      /* Landing Experiencias Móviles*/

      #landingExperiencias {
        margin-top: 0;
        overflow: hidden;
      }
      #landingExperiencias #textoExperiencias {
        position: absolute;
        top: 10%;
        width: 45%;
      }
      #landingExperiencias #textoExperiencias h3 {
        font-size: 1.2rem;
        margin-bottom: 10px;
      }
      #landingExperiencias #textoExperiencias p {
        font-size: 0.8rem;
      }
      #landingExperiencias #fondoExperiencias {
        width: 160%;
        margin-left: -40%;
      }

      /* Landing Galeria Móviles */

      #landingGaleria .cajaGaleria {
        width: 80%;
        margin: auto;
      }
      #landingGaleria .cajaGaleria .filaGaleria {
        display: block;
        gap: 20px; 
      }
      #landingGaleria .cajaGaleria .filaGaleria .itemGaleria {
        width: 100%;
        flex: 1;
        aspect-ratio: 16 / 9;
        overflow: hidden;
        position: relative;
        margin-bottom: 20px;
      }
      #landingGaleria .cajaGaleria .filaGaleria .itemGaleria img {
        width: 100%;
        object-fit: cover;
        object-position: center center;
      }


/* Landing Grupos y Eventos Móviles */

      #landingGrupos {
        height: fit-content;
      }
      #landingGrupos #textoGrupos {
        position: relative;
        color: white;
        width: 80%;
        margin: auto;
        margin-top: 35%;
        overflow: hidden;
      }
      #landingGrupos #fondoTextoGrupos {
        position: relative;
        display: block;
        top: auto;
        right: auto;
        width: 100%;
        height: fit-content;
        margin-bottom: 0;
        padding-bottom: 30px;
        border: 1px solid #0a89a9;
        box-shadow: -1px 6px 11px 0px rgba(0,0,0,0);
      -webkit-box-shadow: -1px 6px 11px 0px rgba(0,0,0,0);
      -moz-box-shadow: -1px 6px 11px 0px rgba(0,0,0,0);
      }
      #landingGrupos #fondoTextoGrupos h2 {
        font-size: 1.8rem;
        line-height: 2rem;
        margin-bottom: 10px;
      }
      #landingGrupos #fondoTextoGrupos p {
        font-size: 0.9rem;
        line-height: 1.3rem;
      }

      #landingGrupos {
        width: 100%;
        overflow: hidden;
      }
      #landingGrupos #fondoGrupos {
        width: 160%;
      }

/* Landing Habitaciones Móviles */

      #landingHabitaciones h2 {
        margin-top: 10px;
      }

      #landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones {
        display: block;
      }
      #landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitaciones {
        position: relative;
        width: 100%;

        padding: 0.5%;
        transition: 0.5s ease-in-out;
      }
      #landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitacionesDoble {
        position: relative;
        width: 100%;
        padding: 0.5%;
        transition: 0.5s ease-in-out;
      }
      #landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitaciones .botonHabitaciones, #landingHabitaciones #cajaLandingHabitaciones .filaLandingHabitaciones .itemLandingHabitacionesDoble .botonHabitaciones {
        opacity: 1;
      }

      /* Landing RRSS Móviles */

      #landingRRSS #cajaLandingRRSS #chicaLandingRRSS {
        position: absolute;
        right: 0;
        left: 0;
        margin: auto;
        top:10%;
        width: 55%;
        max-width: 750px;
      }
      #landingEnlacesRRSS {
        position: absolute;
        right: 0;
        left: 0;
        margin: auto;
        bottom:0;
        width: 30%;
        max-width: 250px;
        padding: 5px 10px;
        border-radius: 8px;
        background-color: rgba(255, 255, 255, 0.54);
      }
      #landingEnlacesRRSS ul {
        display: flex;
        justify-content: space-between;
      }
      #landingEnlacesRRSS ul li {
        width: 23%;
      }
      #landingEnlacesRRSS ul li a img {
        width: 90%;
        padding: 10%;
        margin: auto;
        transition: 0.5s ease-in-out;
      }
      #landingEnlacesRRSS ul li a img:hover {
        width: 100%;
        padding: 0;
        filter: invert(60%);
      }


      /* Remate Móviles */
      .contieneRemate .cajaRemate {
        width: 80%;
      }
      .contieneRemate .cajaRemate .logoRemate {
        width: 100%;
      }



}