/**********************************************************
        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;
}

/**********************************************************
        W  H  A  T  S
***********************************************************/

.contieneWhats{
  position: fixed;
  bottom: 30px;
  right: 105px;
  width: 50px;
  z-index: 20;
}
.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 
***********************************************************/

#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;
}

/* Remate */

.contieneRemate {
  width: 100%;
  padding: 90px 0;
  background: #1faec4;
  background: radial-gradient(circle,rgba(31, 174, 196, 1) 0%, rgba(0, 122, 141, 1) 77%);
  }
  .contieneRemate .cajaRemate {
    width: 40%;
    margin: auto;
    text-align: center;
  }
  .contieneRemate .cajaRemate a {
    color: white;
    line-height: 1.8rem;
  }
  .contieneRemate .cajaRemate .logoRemate {
    width: 300px;
    margin-bottom: 20px;
  }

/**********************************************************
        E X P E R I E N C I A S
***********************************************************/

#columnasExperiencias {
  display: flex; 
  align-items: flex-start;
  padding: 5% 0;
  gap: 20px; 
}
#columnasExperiencias .columnaExperiencias {
  width: 50%;
}
#columnasExperiencias .columnaExperiencias img {
  width: 80%;
  margin: auto;
}
#columnasExperiencias .columnaExperiencias #textoColumnaExperiencias {
 width: 80%;
  margin: auto;
  color: white;
}
#columnasExperiencias .columnaExperiencias #textoColumnaExperiencias h1 {
  font-size: 1.3rem;
  margin-bottom: 10px;
}
#columnasExperiencias .columnaExperiencias #textoColumnaExperiencias p {
  font-size: 0.9rem;
  font-weight: 400;
  line-height: 1.4rem;
}
#contieneFechasExperiencias {
  position: relative;
}
#contieneFechasExperiencias #cajaFechasExperiencias {
  position: absolute;
  top: 35%;
  left: 0;
  right: 0;
  margin: auto;
  width: 80%;
  max-width: 600px;
  margin: auto;
  color: white;
  text-align: center;
}
#contieneFechasExperiencias #cajaFechasExperiencias h3 {
  font-size: 1.2rem;
}
#contieneFechasExperiencias #cajaFechasExperiencias h2 {
  font-size: 2.2rem;
  line-height: 3rem;
  padding: 10px 0;
}

/**********************************************************
        I  N  S  T  A  L  A  C  I  O  N  E  S
***********************************************************/

#instalacionesGaleria {
  width: 75%;
  margin: auto;
}
#contieneVideos {
  width: 75%;
  margin: auto;
  padding: 60px 0;
}
#contieneVideos a {
  display: block;
  padding: 40px 0;
}
#contieneVideos a img {
  width: 100%;
  transition: 0.5s ease-in-out;
}
#contieneVideos a img:hover {
  filter:saturate(150%);
  transform: scale(1.03);
  box-shadow: 0px 5px 9px 0px rgba(0,0,0,0.65);
  -webkit-box-shadow: 0px 5px 9px 0px rgba(0,0,0,0.65);
  -moz-box-shadow: 0px 5px 9px 0px rgba(0,0,0,0.65);
}

/**********************************************************
        G  R  U  P  O  S
***********************************************************/
.contieneCotizador {
  width: 80%;
  max-width: 650px;
  position: absolute;
  bottom: 10%;
  left: 0;
  right: 0;
  margin: auto;
  background-color: #26325e;
  color: white;
  padding: 20px;
  box-shadow: 0px 7px 12px 0px rgba(0,0,0,0.65);
  -webkit-box-shadow: 0px 7px 12px 0px rgba(0,0,0,0.65);
  -moz-box-shadow: 0px 7px 12px 0px rgba(0,0,0,0.65);
}
.contieneCotizador form {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.contieneCotizador form .itemformularioCotizador {
  width: 18%;
}
.contieneCotizador form .itemformularioCotizador input {
  width: 100%;
  border: 0;
  padding: 7px;
}
.contieneCotizador form .itemformularioCotizador label {
  font-size: 0.7rem;
  text-align: center;
  margin-top: 5px;
}
.contieneCotizador form button {
  border: 0;
  color: white;
  border-radius: 4px;
  width: 20%;
  font-weight: 600;
  color: #26325e;
  background-color:#88c41f;
}
.dosColumnasGrupos {
  text-align: center;
}
.dosColumnasGrupos img {
  width: 80%;
  margin: auto;
}
.dosColumnasGrupos #textoColumnaGrupos {
  color: white;
  width: 75%;
  margin: auto;
}
.dosColumnasGrupos #textoColumnaGrupos h3 {
  font-weight: 600;
  font-size: 1.3rem;
}
.dosColumnasGrupos #textoColumnaGrupos p {
  text-align: justify;
  font-size: 0.9rem;
  line-height: 1.3rem;
}
#contieneFormularioPie {
  width: 100%;
  position: relative;
  overflow: hidden;
}
#contieneFormularioPie #fondoMar {
  width: 100%;
}
.cajaFormularioPie {
  width: 75%;
  margin: auto;
  position: absolute;
  top: 25%;
  left: 0;
  right: 0;
  margin: auto;
}
.cajaFormularioPie .textoFormularioPie {
  text-align: right;
}
.cajaFormularioPie .formularioPie form {
  width: 80%;
  max-width: 450px;
  margin: auto;
  padding: 60px 40px;
  background-color: rgba(0, 0, 0, 0.5);
}
.cajaFormularioPie .formularioPie form input {
  width: 100%;
  border: 0;
  background: transparent;
  border-bottom: 1px solid white;
  color:white;
  font-size: 0.9rem;
  line-height: 1.4rem;
  padding: 5px;
}
.cajaFormularioPie .formularioPie form textarea {
  width: 100%;
  border: 0;
  background: transparent;
  border: 1px solid white;
  color:white;
  font-size: 0.9rem;
  line-height: 1.4rem;
  padding: 5px;
}
.cajaFormularioPie .formularioPie form button {
  background-color: #0095dc;
  color: white;
  padding: 8px 25px;
  min-width: 120px;
  border: 0;
  border-radius: 4px;
}
.cajaFormularioPie .textoFormularioPie h3 {
  font-size: 1.4rem;
  margin-bottom: 10px;
  color: #ffb83b;
}
.cajaFormularioPie .textoFormularioPie ul li a {
  font-size: 0.9rem;
  line-height: 1.6rem;
  color: white;
}
.contieneSeisCuatroFormulario {
  width: 100%;
  display: flex;
}
.contieneSeisCuatroFormulario .seisFormulario {
  width: 60%;
}
.contieneSeisCuatroFormulario .cuatroFormulario {
  width: 40%;
}


/**********************************************************
        H  A  B  I  T  A  C  I  O  N  E  S
***********************************************************/

#contieneHabitaciones {
  width: 80%;
  max-width: 900px;
  margin: auto;
}
#contieneHabitaciones #visorHabitaciones {
  width: 100%;
  position: relative;
}
#contieneHabitaciones #visorHabitaciones .avanzar, #contieneHabitaciones #visorHabitaciones .retroceder {
  position: absolute;
  top: 45%;
  color: gray;
  font-size: 2rem;
  font-weight: 900;
  z-index: 10;
  cursor: pointer;
  transition: 0.5s ease-in-out;
}
#contieneHabitaciones #visorHabitaciones .avanzar:hover, #contieneHabitaciones #visorHabitaciones .retroceder:hover {
  color: black;
}
#contieneHabitaciones #visorHabitaciones .avanzar {
  right: 20px;
}
#contieneHabitaciones #visorHabitaciones .retroceder {
  left: 20px;
}
#contieneHabitaciones #visorHabitaciones #imagenVisor {
  width: 100%;
}
#contieneHabitaciones #menuVisor {
  position: relative;
  width: 100%;
  background-color: #20283c;
  color: white;
}
#contieneHabitaciones #menuVisor ul {
  display: flex;
  justify-content: space-between;
  margin-top: -5px;
}
#contieneHabitaciones #menuVisor ul li {
  width: 20%;
  text-align: center;
}
#contieneHabitaciones #menuVisor ul li p {
  font-size: 0.8rem;
  letter-spacing: 0;
  cursor: pointer;
  padding: 10px;
  transition: 0.5s ease-in-out;
}
#contieneHabitaciones #menuVisor ul li p:hover {
  background-color: #0095dc;
}
.menuVisorActiva {
  background-color:#88c41f;
  font-weight: 600;
}
#contieneHabitaciones #contieneInfoHabitacion {
  padding: 40px 0;
  color: white;
}
#contieneHabitaciones #tituloHabitacion {
  width: 100%;
  text-align: center;
  padding: 20px 0;
}
#contieneHabitaciones #tituloHabitacion img {
  width: 70%;
  max-width: 290px;
  margin: auto;
}
#contieneHabitaciones #contieneInfoHabitacion p {
   font-size: 0.9rem;
  line-height: 1.4rem;
}
#contieneHabitaciones #contieneInfoHabitacion h4 {
  font-size: 1rem;
  font-weight: 600;
}
#seccionReservaYa {
  width: 100%;
  background-image: url("../images/habitaciones/fondoOndas.webp");
  background-size: contain;
  background-repeat: no-repeat;
}
#contieneReservaYa {
  width: 75%;
  margin: auto;
  padding: 40px 0;
}
#contieneReservaYa #tituloReservaYa {
  width: 100%;
  text-align: center;
}
#contieneReservaYa #tituloReservaYa img {
  width: 75%;
  max-width: 500px;
  margin: auto;
}
#contieneReservaYa #tituloReservaYa h4 {
  text-align: center;
  color: white;
  font-size: 1.1rem;
  line-height: 1.6rem;
}
#contieneReservaYa #asistente {
  padding: 40px 0;
  width: 75%;
  max-width: 450px;
  margin: auto;
  display: block;
}
#contieneReservaYa #asistente img {
  width: 100%;
}
#contieneReservaYa #telefonos {
  text-align: center;
  color: white;
}
#contieneReservaYa #telefonos ul li h2 {
  font-size: 1.9rem;
  line-height: 2.2rem;
}
#contieneReservaYa .contieneMail {
  width: 100%;
  text-align: center;
  padding-bottom: 60px;
}
#contieneReservaYa .contieneMail a {
  color: white;
}


/**********************************************************
        U B I C A C I O N
***********************************************************/

#descripcionUbicacion {
  width: 60%;
  margin: auto;
  color: white;
  padding: 70px 0;
}
#descripcionUbicacion h1 {
  font-size: 1.2rem;
  margin-bottom: 10px;
}
#descripcionUbicacion h4 {
  font-size: 0.9rem;
  line-height: 1.4rem;
  margin-bottom: 60px;
  text-align: justify;
}
#descripcionUbicacion img {
  width: 100%;
}


/**********************************************************
        P  O  L  I  T  I  C  A  S
***********************************************************/
.seccionPoliticas {
  width: 100%;
  padding: 120px 0;
  background-color: white;
}
.seccionPoliticas .contienePoliticas{
  width: 80%;
  margin: auto;
  color: rgb(41, 41, 41);
}
.seccionPoliticas .contienePoliticas h1 {
  text-align: center;
  display: block;
  font-size: 1.8rem;
  line-height: 2.2rem;
}
.seccionPoliticas .contienePoliticas .apartadoPoliticas {
  padding: 20px 0;
}
.seccionPoliticas .contienePoliticas .apartadoPoliticas h2 {
  font-size: 1.2rem;
  line-height: 1.5rem;
  font-weight: 600;
  margin-bottom: 10px;
}
.seccionPoliticas .contienePoliticas .apartadoPoliticas p {
  line-height: 1.8rem;
}

.promoHome {
  cursor: pointer;
}
#modalPromos {
  padding: 2% 0;
}
#modalPromos #promoModal {
  width: 100%;
  max-width: 800px;
  display: block;
  margin: auto;
}
#modalPromos #promoModal #imagenModalPromos {
  width: 100%;
}


#contieneConfirmacion {
  width: 100%;
  max-width: 1350px;
  margin: auto;
  padding: 10% 0;
  background-color: white;
  color: darkslategray;
}
#contieneConfirmacion #cajaConfirmacion {
  width: 60%;
  margin: auto;
  text-align: center;
}
#contieneConfirmacion #cajaConfirmacion #contieneLogoConfirmacion {
  width: 50%;
  max-width: 200px;
  margin: auto;
}
#contieneConfirmacion #cajaConfirmacion #contieneLogoConfirmacion #logoConfirmacion {
  width: 100%;
}
#contieneConfirmacion #cajaConfirmacion h1 {
  color: #19549b;
  font-size: 2rem;
  font-weight: 900;
  line-height: 2.5rem;
}
#contieneConfirmacion #cajaConfirmacion h4 {
  font-size: 1.4rem;
  line-height: 1.8rem;
  padding: 10px 0;
}

.contieneReCaptcha {
  width: fit-content;
  margin: auto;
  display: block;
}

/* Carrusel */
  #contieneTestimoniales {
    width: 100%;
    padding: 60px 0;
    background-color: #ececec;
  }
  #contieneTestimoniales #contieneLogoMaps {
      width: 100%;
      text-align: center;
      margin-top: 20px;
  }
  #contieneTestimoniales #contieneLogoMaps #logoMaps {
    width: 200px;
  }
  #contieneCarrusel {
        overflow: hidden;
        width: 100%;
        white-space: nowrap;
        position: relative;
    }
    .carrusel {
        display: flex;
        width: max-content;
        animation: desplazamiento 75s linear infinite;
    }

    .carrusel img {
        width: 20vw; /* Cada imagen ocupa 1/5 de la pantalla */
        padding: 0 30px;
        flex-shrink: 0;
    }

    @keyframes desplazamiento {
        from { transform: translateX(0); }
        to { transform: translateX(-50%); }
    }

/* Colores */

.azulFondo {
  background-color: #258b9c;
}
.azulOscuroFondo {
  background-color: #024456;
}
.magenta {
  color: white;
  background-color: #df0159;
  transition: 0.5 ease-in-out;
}
.magenta:hover {
  background-color: #94003b;
}
.textoMagenta {
  color: #df0159;
}
.textoAzul {
  color: #0095dc;
}
.textoAzulOscuro {
  color: #024456;
}
.textoVerdeClaro {
  color: #9cbb22;
}
.textoGris {
  color: rgb(57, 57, 57);
}

/* Animaciones */

@keyframes float {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-15px); /* se mueve hacia arriba */
  }
  100% {
    transform: translateY(0px); /* regresa a la posición original */
  }
}

.float {
  animation: float 5s ease-in-out infinite;
}


@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 667px)
  and (-webkit-min-device-pixel-ratio: 2)
  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%;
      }

/**********************************************************
        E X P E R I E N C I A S    M Ó V I L E S
***********************************************************/

      #columnasExperiencias {
        display: flex; 
        flex-direction: column;
        align-items: flex-start;
        padding: 5% 0;
        gap: 20px; 
      }
      #columnasExperiencias .columnaExperiencias {
        width: 100%;
        text-align: center;
      }

/***************************************************************************
        I  N  S  T  A  L  A  C  I  O  N  E  S       M  Ó  V  I  L  E  S
****************************************************************************/

      #instalacionesGaleria {
        width: 90%;
        margin: auto;
      }
      #contieneVideos a {
        padding: 10px 0;
      }

/**********************************************************
        G  R  U  P  O  S       M  Ó  V  I  L  E  S
***********************************************************/
      .contieneCotizador {
        width: 100%;
        max-width: 100%;
      }
      .contieneCotizador form input {
        font-size: 0.6rem;
      }
      .contieneCotizador form button {
        font-size: 0.7rem;
      }
      #contieneFormularioPie #fondoMar {
        display: none;
        background-image: url("../images/experiencias/fondoFechasExperiencias.webp");
        background-size: contain;
        background-position: center;
      }
      .cajaFormularioPie {
        width: 75%;
        margin: auto;
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        margin: auto;
        padding: 60px 0;
      }
      .cajaFormularioPie .textoFormularioPie {
        margin-bottom: 40px;
      }
      .cajaFormularioPie .formularioPie form {
        width: 90%;
        max-width: 90%;
      }
      .contieneSeisCuatroFormulario {
        display: block;
      }
      .contieneSeisCuatroFormulario .seis {
        width: 100%;
      }
      .contieneSeisCuatroFormulario .cuatro {
        width: 100%;
      }


/**********************************************************
        H  A  B  I  T  A  C  I  O  N  E  S       M  Ó  V  I  L  E  S
***********************************************************/
      #contieneHabitaciones {
        width: 100%;
        max-width: 100%;
        margin: auto;
      }
      #contieneHabitaciones #menuVisor ul {
        display: block;
        margin-top: -5px;
      }
      #contieneHabitaciones #menuVisor ul li {
        width: 100%;
      }
      #contieneHabitaciones #contieneInfoHabitacion {
        width: 80%;
        margin: auto;
      }



      /* Carrusel Móviles */

      .carrusel img {
          width: 70vw; /* Cada imagen ocupa 1/5 de la pantalla */
          padding: 0 15px;
      }

  }