/*Variables*/
:root {
    --fontPrimary:"Poppins", sans-serif;  
    --fontSecondary:  "Cormorant", serif; 
    --colorPrimary: #005172;  
    --colorPrimaryClear:#73C3CB;  
    --colorSecondary:#212121;  
    --colorLightBlue: #00C6D7;
    --colorBlue:#E3F1F2; 
    --colorAqua:#E3F1F2; 
    
    --colorbtn:#014C73;
    --colorClear:#BDDDE0;
    --colorMedium:#52B1BD;
    --colorDark:#0099AC;
    --colorGreenDark:#346E74;
    --colorPink:#FFACA9;
    --colorBrown:#4F4E2A;
}
/*botón motor*/
#buttonShowSearcherScroll{
    top:15% !important;
}

.be459{
  color:white !important;  
}

@media (min-width: 1280px) and (max-width: 1367px) {
    
     #buttonShowSearcherScroll{
    top:17% !important;
}


}    
@media (width: 1440px) {
   #buttonShowSearcherScroll{
    top:12% !important;
}
}

@media (width: 1024px) {
   #buttonShowSearcherScroll{
    top:12% !important;
}
}

#buttonShowSearcherScroll, #buttonShowSearcherMobile{
    border-radius: 20px;
    border: 2px solid #FFF;
    background-color: var(--colorPrimary) !important;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
    text-transform: none !important;
    font-size: 22px;
    padding: 12px 48px !important;
   
}

/*Botón de registro*/
.css-haaq5p{
    background-color:var(--colorPrimary) !important;
    color:#fff !important;
}
.css-haaq5p.Mui-disabled{
  
   color:#fff !important;

}

.person-login-text-logged{
    color:#fff;
}
 
.personLogin-wrapper .person-login-text-high {
    color:#fff;
    
}
/*ESTILOS GENERICOS*/

.center{
    text-align: center !important;
}
.left{
    text-align: left !important;
}
.right{
    text-align: right !important;
}
.fontPrimary{
    font-family: var(--fontPrimary) !important; 
}

.fontSecondary{
    font-family: var(--fontSecondary) !important; 
}
.colorPrimary{
    color:var(--colorPrimary) !important;
}
.colorPrimaryClear{
    color:var(--colorPrimaryClear) !important;
}
.colorSecondary{
    color:var(--colorSecondary) !important;
}
.colorBlue{
    color:var(--colorBlue) !important;
}
.colorbtn{
    color:var(--colorbtn) !important;
}
.colorClear{
    color:var(--colorClear) !important;
}
.colorPink{
    color:var(--colorPink) !important;
}
.bgAqua{
  background-color: var(--colorAqua);  
}
.bgBlue{
    background-color: var(--colorPrimary);
}
.bgGray{
    background:#F9F9F6;
    border-radius:4px;
}
.bgLight{
    background:#E5EEEF;
    border-radius:4px;
}
.box-medium{
    background:var(--colorMedium);
}
.box-clear{
    background:var(--colorClear);
}
.box-dark{
    background:var(--colorPrimary);
}
.bgGreenDark{
    background:var(--colorGreenDark);
}
.bgBrown{
    background:var(--colorBrown);
}
.white,.white strong, .white span{
    color:#fff !important;
}

b, strong {
    font-weight: 600 !important;
}

a{
    text-decoration:none !important;
    cursor:pointer !important;
    color:var(--colorbtn);
}
.img-responsive{
    max-width:100%;
    width:100%;
    height:auto;
    object-fit:cover;
}
.opTop{
    object-position:top;
}
.opBottom{
    object-position:bottom;
}
.m0Auto{
    margin:0 auto !important;
}
.mTop20{
    margin-top: 20px !important;
}
.mTop40{
    margin-top: 40px !important;
}
.mTop60{
    margin-top: 60px !important;
}

.mTop120{
    margin-top: 120px !important;
}
.mBT20{
    margin-bottom:20px !important;
}
.mBT40{
    margin-bottom: 40px !important;
}
.mBT60{
    margin-bottom: 60px !important;
}
.mBT100{
    margin-bottom: 100px !important;
}
.mBT120{
    margin-bottom: 120px !important;
}
.paddTop20{
    padding-top: 20px !important;
}
.paddTop40{
    padding-top: 40px !important;
}
.paddTop50{
    padding-top:50px !important;
}
.paddBT40{
    padding-bottom: 40px !important;
}
.paddTop60{
    padding-top: 64px !important;
}
.paddBT60{
    padding-bottom: 64px !important;
}
.paddTop80{
    padding-top: 80px !important;
}
.paddTop100{
    padding-top: 100px !important;
}
.paddBT100{
    padding-bottom: 100px !important;
}
.paddTop120{
    padding-top: 120px !important;
}
.paddBT120{
    padding-bottom: 120px !important;
}
.paddL{
    padding-left:20px !important;
}
.paddR{
    padding-right:20px !important;
}
.uppercase{
    text-transform:uppercase !important;
}
.w50{
    width:50% !important;
}
.w60{
    width:60% !important;
}
.w70{
    width:70% !important;
}
.w80{
    width:80% !important;
}
.w90{
    width:90% !important;
}
.mLeft10{
    margin-left:10%;
}
html,body{
    overflow-x:hidden;
}
a:focus{
    outline:none;
}
ul{
    padding-left:0 !important;
}
html body, body p,
.htt-text-image p, .htt-text-image ul li, .mybooking-content-text{
    font-size:18px;
    line-height:1.6em;
    font-family:var(--fontPrimary);
    font-weight:400;
    color: var(--colorSecondary);
}
.container, .container-fluid, .row {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* ANIMACIONES */

.opac{
    animation:animopac 1.5s forwards;
}
@keyframes animopac{
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}
.grow{
    animation:animgrow 1s forwards;
}
@keyframes animgrow{
    from{
        transform: scale(.1);
    }
    to{
        transform: scale(1);
    }
}
.animTop{
    animation:fadeintop .8s forwards;
}
@keyframes fadeintop{
    from{
        transform:translateY(-1000px);
    }
    to{
        transform: translateY(0);
    }
}
/*Header*/
.header:not(.editMode .header){
    position: absolute;
    z-index: 3;
    width: 100%;
}
.header.hfixed:not(.editMode .header.hfixed){
    position: fixed;
    background:var(--colorbtn);
    z-index:4;
}
.header.hfixed .logo-desktop{
    width:auto;
    max-height:50px;
}

.header-overlay{
     
     background: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.00) 90%);
}
.top-header{
    padding:20px 0;
   

}
.header.hfixed .top-header{
    padding:12px 0;
}
.top-header>.row{
    align-items:center;
}
.logo-desktop{
    filter:brightness(0) invert(1);
}
@media (width: 1280px){
    
  .logo-desktop {
      height:100px;
  }  
}

.menu-desktop a{
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}
.menu-desktop a .fa-chevron-down{
    font-size:8px;
    vertical-align:2px;
    padding:8px;
}
.menu-desktop ul{
    display:flex;
    gap:32px;
    list-style-type: none;
    justify-content:center;
    margin-bottom:0;
}
.menu-desktop ul li{
    position:relative;
}
.menu-desktop ul li ul{
    position: absolute;
    left: -20%;
    flex-direction: column;
    width:max-content;
    min-width:300px;
    gap: 0;
    padding: 0;
    background: var(--colorPrimaryClear);
    border-radius: 4px;
    align-items:flex-start;
}
.menu-desktop ul li ul li{
    transition:.5s all;
    text-align:left;
    width:100%;
    border-bottom:1px solid var(--colorClear);
}
.menu-desktop ul li ul li:last-child{
    border-bottom:none;
}
.menu-desktop ul li ul li .fa-star{
    font-size:8px;
    margin-left:5px;
}
.menu-desktop ul li ul li:hover{
    background:var(--colorbtn);
}
.menu-desktop ul li ul li a{
    color:#fff;
    padding: 15px 20px;
    width: 100%;
    display: block;
}
/* MENÚ MOBILE */

.navbar-toggler-icon{
    filter:brightness(0) invert(1);
}
.navbar-toggler{
    border:none;
}
.menu-mobile ul{
    list-style-type:none;
    padding-left:20px;
}
.menu-mobile>ul{
    margin-top:60px;
}
.menu-mobile ul a{
    color:var(--colorbtn);
    font-size: 24px;
    line-height: 180%;
}
.menu-mobile ul .sub-menu a{
    font-size: 21px;
}
.menu-mobile .fa{
    font-size: 10px;
    vertical-align: 1px;
    margin-left:2px;
}
.menu-mobile .fa-chevron-down{
    padding: 10px 12px 10px 6px;
    color: var(--colorbtn);
    vertical-align: 3px;
    margin-left:0;
}
.top-header-mobile .group-languages-texts{
    float:right;
}
.top-header-mobile .group-languages-texts .btn-secondary.open-selector-language,
.top-header-mobile .open-selector-language span:after{
    color:var(--colorbtn);
}
.top-header-mobile .group-languages-texts .btn-secondary.open-selector-language{
    border:1px solid var(--colorbtn);
    font-size:18px;
    padding:6px 18px 6px 12px;
}
.personLogin-content:before {
    content: url(/dam/multihotel-welikehotel/home/icons/ic-user.png);
}
.mybooking-content:before {
    content: url(/dam/multihotel-welikehotel/home/icons/ic-cart.png);
}
.mybooking-content-text, .person-login-text, span.bi-cart-fill, span.bi.bi-person-fill {
    display: none;
}
.group-languages-texts .btn-secondary.open-selector-language {
    background: transparent;
    border: 0;
    color:#fff;
    position: relative;
    vertical-align: 1px;
    font-size: 14px;
    letter-spacing: 0.7px;
}
.group-languages-texts .options-selector-language{
    padding:0;
}
.group-languages-texts .dropdown-item{
    color:#000;
}
.group-languages-texts .dropdown-item:hover{
    color:#fff;
    background:var(--colorPrimary);
}
.open-selector-language span{
    position:relative;
}
.open-selector-language span:after {
    position: absolute;
    top: 4px;
    right: -14px;
    font-size: 8px;
    content: "\f078";
    font-family: 'FontAwesome';
    color:#fff;
}
.header .access-right>.row:not(.editMode .header .access-right>.row) {
    float: right;
    flex-wrap: nowrap;
}
.editMode .header .access-right>.row{
    float:none;
}
.header .access-right>.row>.col{
    padding:0 20px;
}

/* VENTAJAS */

.ventajas-wrapper {
  padding: 2rem 0;
  max-width: 1200px;
  margin: auto;
  overflow-x: auto;
}

.ventajas-inner {
  display: flex;
  align-items: center;
}

.ventajas-contenido {
  display: flex;
  align-items: center;
  gap: 143px;
  margin-left: 100px;
}

.ventaja-mensaje.center {
  color: var(--colorPrimary);
  position: relative;
  padding-right: 100px;
  white-space: nowrap;
}

 .ventaja-mensaje.center p {
  font-family: var(--fontSecondary);
  font-size: 2rem;
  font-weight: 600 !important;
  color: var(--colorPrimary);
}

.ventaja-mensaje.center::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 60px;
  width: 2px;
  background-color: var(--colorPrimary);
}

.ventaja-item {
  text-align: center;
  color: var(--colorPrimary);
  cursor: default;
  min-width: 190px;
}

.ventaja-item img {
  width: 40px;
  height: 40px;
  margin-bottom: 0.5rem;
}

.ventaja-item p {
  margin: 0;
  font-family: var(--fontSecundary);
  font-weight: 400;
  font-size:1rem;
  color: var(--colorPrimary);
}

/*STAGE*/

.stage{
    position:relative;
}
.stage>.row>.col{
    padding:0;
}
.breadcrumb{
    padding-top:15px;
}
.breadcrumb li{
    font-size:16px;
}
.breadcrumb-item a{
    color:var(--colorSecondary);
}
.bgGreenDark .breadcrumb-item a,.bgBrown .breadcrumb-item a{
    color:#fff;
}
.bgGreenDark .breadcrumb-item+.breadcrumb-item::before,
.bgBrown .breadcrumb-item+.breadcrumb-item::before{
    color:#fff;
}
.breadcrumb-item.active{
    color:var(--colorPrimary);
    font-weight:600;
}
.breadcrumb-item+.breadcrumb-item::before{
    content:"/";
    font-weight:400;
}
.container-hero{
    position:relative;
}
.container-hero img.img-responsive{
    height:100vh;
}
.container-hero:before{
    content:"";
    position:absolute;
    width:100%;
    height:100vh;
    top:0;
    left:0;
    z-index:2;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.00) 86.52%, rgba(0, 0, 0, 0.00) 100%), linear-gradient(0deg, rgba(0, 0, 0, 0.10) 0%, rgba(0, 0, 0, 0.15) 100%);
}
.containerTxtSlide {
    position: absolute;
    width: 100%;
    top: 25%;
    left: 0;
    z-index: 2;
}
body p.titleHero{
    font-family: var(--fontSecondary) !important;
    color: #FFF;
    text-align: center;
    font-size: 74px;
    font-style: bold;
    font-weight: 500;
    line-height: 110%;
    
}
.grid-motor:not(.editMode .grid-motor){
    position:absolute;
    bottom:-2%;
    left:0;
    width:100%;
    z-index:2;
}

/*BODY*/

h1 {
    font-family: var(--fontSecondary);
    font-size: 4rem ;
    color: var(--colorPrimary);
    font-weight:600;
}
 
h2{
    font-family: var(--fontSecondary);
    font-size: 58px;
    line-height: 110%; 
    color: var(--colorPrimary);
    font-weight:500;
}
h3{
    font-family: var(--fontPrimary);
    font-weight: 600;
    font-size: 40px;
    line-height: 120%; 
    color: var(--colorPrimary);
}
body p.sub-title,h3.sub-title{
    font-family: var(--fontPrimary);
    color:var(--colorPrimary);
    text-transform: uppercase;
    font-weight: 300;
    font-size:26px;
}
.swiper-pagination{
    position:relative;
    margin-top:15px;
}
.swiper-pagination-bullet{
    width:6px;
    height:6px;
    background:var(--colorPrimary);
    opacity:.9;
}
.swiper-pagination-bullet-active{
    width:25px;
    border-radius:7px;
    background:var(--colorPrimary);
}

.swiper-services .swiper-pagination-bullet,
.swiper-villas .swiper-pagination-bullet{
     background: white !important;
}

.swiper-services .swiper-pagination-bullet-active,
.swiper-villas .swiper-pagination-bullet-active{
     background: white !important;
}

/* swiper Pag Villas */

.custom-swiper .swiper-button-next,
.custom-swiper .swiper-button-prev {
  position: absolute;
  top: 50% !important;             /* centrado vertical */
  width: 40px !important;          /* tamaño del círculo */
  height: 40px !important;
  margin-top: -20px !important;    /* compensa la altura para centrar */
  z-index: 10;
  cursor: pointer;
  display: flex !important;
  align-items: center;
  justify-content: center;
  background-color: #fff;          /* círculo blanco */
  border-radius: 50%;              /* forma circular */
  color: #000;                     /* flecha negra */
  font-size: 14px;                 /* tamaño del icono */
  box-shadow: 0 2px 4px rgba(0,0,0,0.15);
  transition: all 0.3s ease;
}

/* Flechas más pequeñas */
.custom-swiper .swiper-button-next::after,
.custom-swiper .swiper-button-prev::after {
  font-size: 14px !important;
}

/* Efecto hover */
.custom-swiper .swiper-button-next:hover,
.custom-swiper .swiper-button-prev:hover {
  background-color: #f5f5f5;       /* gris claro al pasar el ratón */
  transform: scale(1.05);          /* leve zoom */
}

/* Alineación horizontal básica */
.custom-swiper .swiper-button-prev {
  left: 10px !important;           /* separación del borde izquierdo */
}

.custom-swiper .swiper-button-next {
  right: 10px !important;          /* separación del borde derecho */
}



/* end swiper Pag Villas */


 img.img-responsive:not(.container-hero img.img-responsive){
    border-radius:4px;
}

.hotel-home{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:60px;
}
.hotel-home .img-hotel-home{
    flex:1;
}
.hotel-home .img-hotel-home img.img-responsive,
.servicio img.img-responsive{
    height:100%;
    height:480px;
}
.hotel-home .text-hotel-home{
    flex:2;
    justify-content: center;
    display: flex;
    flex-direction: column;
    align-items: center; 
}
/** Precio Desde **/

.hotel-home .price_from_container {
    background: var(--colorLightBlue);
    padding: 6px 16px;
    border-radius: 4px;
    width: max-content;
    margin: 0 auto;
    font-size: 18px;
    font-weight:600;
    color: var(--colorSecondary);
}
.hotel-home .price_from_container a{
    color:white;
}
/**----------------------**/
a.btn-corpo{
    color:var(--colorbtn);
    font-size: 22px;
    font-weight: 600;
    line-height: 32px; 
}
a.btn-corpo .fa{
       transition:.3s margin-left; 
}
a.btn-corpo:hover .fa{
    margin-left:3px;
}
.bg-up{
    background: linear-gradient(180deg, #FFF 0%, #E5EEEF 100%), #FFF;
}
.offer, .destino>div:first-child, .experience, .servicio,.card-hotel, .room,
.tabGallery .column, .tabGallery .tabGallery-container{
    position:relative;
    overflow:hidden;
}
.offer:hover img.img-responsive, .destino:hover img.img-responsive, 
.experience:hover img.img-responsive, .servicio:hover img.img-responsive,
.card-hotel:hover img.img-responsive,.room:hover img.img-responsive,
.grid-experiencias>div:hover img.img-responsive,.banner-destino:hover img.img-responsive,
.tabGallery .column:hover img, .tabGallery .tabGallery-container:hover img{
    transform:scale(1.2);
}
.offer img.img-responsive,
.tabGallery .column img, .tabGallery .tabGallery-container img,
.destino img.img-responsive,
.experience img.img-responsive, .card-hotel img.img-responsive,
.servicio img.img-responsive{
    transition:.5s all;
}

/* Oculta resto de filas de la galería */
.lightbox > div.image:nth-of-type(n+7) {
    display: none !important;
}



.text-offer{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width:100%;
    padding: 60px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    z-index:2;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.45) 100%);
}
.text-offer>div{
    flex:1;
}
.text-offer h3{
    color:#fff;
}

.text-offer a.btn-corpo{
    color:white;
}
.offer-section .htt-text-image, .offer-section .box-gray{
    height:100%;
}
.offer-section .box-gray{
    position:relative;
}
.offer-conditions{
    background: var(--colorLightBlue);
    padding:40px !important;
    border-radius:4px;
}
.grid-master-offer{
    background:var(--colorClear);
    border-radius:4px;
    padding:40px 20px;
}
.grid-master-offer p{
    margin-bottom:0;
}

.destino img.img-responsive{
    min-height:350px;
}
.box:before{
    bottom:96%;
    width: 100%;
    left: 0;
    position:absolute;
}


.text-destino{
    display: flex;
    justify-content: center;
    margin-top:-15%;
    width: 100%;
    padding:0 10%;
}
.destino .box{
    position:relative;
    position: relative;
    height: 300px;
    width: 80%;
    left: 10%;
    top: -20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 30px;
}
.bg-down{
    background: linear-gradient(0deg, #FFF 0%, #E6EEEF 100%);
}
.text-experience, .text-servicio, .text-card-hotel{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width:100%;
    padding: 40px 25px;
    display: flex;
    flex-direction:column;
    justify-content: flex-end;
    z-index:2;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.10) 0%, rgba(0, 0, 0, 0.50) 100%);
}
.experience img.img-responsive{
    max-height:40vh;
}
.card-hotel img.img-responsive{
    height:350px;
}
.experience.big-experience img.img-responsive{
    max-height:65vh;
}
/*Servicios*/
.servicio .htt-text-image,.servicio .htt-text-image>div:not(.editMode .servicio .htt-text-image>div), .servicio .htt-text-image>div:has(iframe), 
.servicio iframe,.servicio.club img.img-responsive{
    height:100% !important;
}
.servicio .bgGrayExperience,.servicio .box-clear{
    height: 100%;
    display: flex;
    flex-direction:column;
    justify-content:center;
}
.servicio img.img-responsive{
    min-height:350px;
}
.servicio .swiper,.servicio .swiper-slide>div, .servicio .swiper img.img-responsive{
    height:100%;
}
.servicio h3{
    font-size:36px;
}
.text-card-hotel h3{
    font-size:24px;
    font-weight:300;
}
.servicio .box-clear{
    position:relative;
}
.servicio .box-clear:before{
    bottom:97%;
    width: 100%;
    left: 0;
    position:absolute;
}
.servicio.club .box-clear:before{
    content:none;
}
.suscription .htt-text-image, .suscription .bgGray{
    height:100%;
}
.suscription .bgGray{
    display:flex;
    justify-content:center;
    align-items:center;
}
.footer{
    background:var(--colorbtn);
}

.text-footer p{
    color:white;
    font-size:18px;
}


.footer .copy{
    padding:30px 0 100px 0;
    border-top:1px solid white;
}
.footer .redes-footer a{
    margin-right:20px;
    font-size:35px;
}
.footer .copy p{
    font-size:14px;
}
.fila-especial {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-end;
   
}
/*Experiencias*/
.bgGrayExperience{
    background: var(--colorPrimary);
}
.bgGrayExperience, .box-clear{
    border-radius:4px;
    padding:60px;
}
.bgGrayExperience h2,
.bgGrayExperience p {
    color: white;
}

.grid-experiencias>div{
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    display: flex;
    flex-direction:column;
    justify-content: center;
    align-items: flex-start;
    /*aspect-ratio: 16 / 9;
    min-height:350px;*/
}
.grid-experiencias>div img.img-responsive{
    height:100%;
    transition:.5s all;
}
/*DESTINO*/

.banner-destino{
    position:relative;
    overflow:hidden;
}
.banner-destino.banner-destino-home{
    overflow:hidden;
}
.banner-destino.invert .box{
    right:auto;
    left:10%;
}
.banner-destino .box{
    position: absolute;
    width: 400px;
    bottom: -30px;
    height: 60%;
    right: 10%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 30px;
}
.box h3{
    font-family: var(--fontPrimary);
    font-size: 40px;
    font-weight: 400;
    line-height: 150%;
    color:white;
}

.box p{
    color:white;
}

.banner-destino img.img-responsive{
    height:75vh;
    transition:.5s all;
}
/*Navs*/
.nav-tabs{
    background:var(--colorPrimary);
    border-radius:4px;
    border:none;
    display:flex;
    justify-content:center;
}
.nav-tabs .nav-link{
    color:#fff;
    border-radius:0;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active,.nav-tabs .nav-link:hover{
    background:#fff;
    border:none;
    color:var(--colorPrimary);
    font-weight:500;
}
/*Área clientes*/

nav.custom-menu ul{
    display:flex;
    gap:16px;
    list-style-type: none;
    justify-content:center;
    margin-bottom:0;
    background:#F5F5F5;
    list-style-type:none;
}
nav.custom-menu ul li a{
    font-size:18px;
    font-family:var(--fontPrimary);
    transition:.3s all;
    color:var(--colorSecondary);
    padding:4px 12px;
    min-width:140px;
    border-radius:8px;
    display:block;
}
nav.custom-menu ul li a.active,nav.custom-menu ul li:hover a{
    color:#fff;
    border-radius:4px;
}
nav.custom-menu ul li a.active,nav.custom-menu ul li:hover a{ 
    background:var( --colorLightBlue);
    color: var(--colorSecondary);
}
/*Error*/
body p.text-error{
    font-size:36px;
}
body p.title-error{
    font-size:8rem;
    line-height:8rem;
    font-weight:600;
}
.error p:has(a){
    line-height:2.2em;
}
.error a{
    font-size:24px;
    color:var(--colorbtn);
}
.error a .fa{
    font-size:12px;
}

/* Legal Pages */
.legal h1{
    font-size: 3rem;
}
.legal h2{
    font-size: 38px;
}
/*Dropdown mobile*/
.menu-select-mobile button.dropdown-toggle{
    border-radius: 4px;
    background: var(--colorPrimary);
    border: none;
    font-size: 21px;
    padding:10px 0;
}
.dropdown-item.active, .dropdown-item:active{
    background-color:var(--colorClear);
}
.menu-select-mobile ul.dropdown-menu{
    width:calc(100% - 20px) !important;
}
/*Forms*/
.form-row input:not(.form-row input[type=checkbox]), .form-row select, .form-row textarea {
    margin-top: 5px;
    border-radius: 4px;
    padding: 8px 0;
    border-color: rgba(0, 0, 0, .12);
    width: 100%;
    font-size: 18px;
    color: var(--colorSecondary);
}
.form-row {
    display: flex;
    flex-direction: column;
    margin-top: 15px;
}
form input[type=submit], #personModify button.b2c-cr-wcm5, .btn-primary {
    padding: 15px 20px;
    border: none;
    color: #fff;
    font-weight: 400;
    font-size: 18px;
    border-radius: 4px;
    min-width: 170px;
    background: var(--colorPrimary);
    float: right;
    transition: .3s all;
    margin: 0 auto;
}
form input[type=submit]:hover, #personModify button.b2c-cr-wcm5:hover,.btn-primary:hover{
    background:var(--colorbtn);
}
.btn-primary{
    float:none;
}
.form-item:has(input[type=checkbox]){
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
body .form-item:has(input[type=checkbox]) p{
    font-size:15px;
    line-height:1.2em;
}
/*Club*/
table.club-plan{
    overflow-x: auto !important;
    display: block;
}
table.club-plan tr:not(table.club-plan tr:last-child){
    border-bottom:1px solid var(--colorClear);
}
table.club-plan td, table.club-plan th{
    padding:5px 15px;
}
table.club-plan th{
    width:15%;
    min-width:160px;
    font-weight:500;
    background:var(--colorClear);
}
table.club-plan th:first-child{
    border-top-left-radius:4px;
    border-bottom-left-radius:4px;
}
table.club-plan th:last-child{
    width:55%;
    min-width:250px;
    border-top-right-radius:4px;
    border-bottom-right-radius:4px;
}
/*Cómo llegar - Contacto*/
.distancias{
    display: flex;
    justify-content: space-between;
}
.distancias>div{
    padding:20px;
}
.distancias p.colorPrimary{
    font-size: 21px;
    font-weight: 500;
    margin-top: 10px;
}
.distancias p:last-child{
    position:relative;
    padding-top: 50px;
}
.distancias p:last-child:before{
    content:"";
    position: absolute;
    height: 40px;
    width: 1px;
    background: var(--colorSecondary);
    top: 0;
    left: 50%;
}
.contact .distancias h3{
    font-size:21px;
}
/*cms-btn-up-mov*/
.cms-btn-up-mov{
    position: fixed;
    width: 48px;
    height: 48px;
    opacity: 0.8;
    bottom: 100px;
    right: 20px;
    background: var(--colorPrimary);
    border-radius: 50% !important;
    border:3px solid #fff;
    text-align: center;
    padding: 10px;
    transition: .5s all;
    display:none;
    z-index:5;
    color:#fff;
}
.cms-btn-up-mov i{
    font-size:21px;
   transition:.5s all;
}
.cms-btn-up-mov:hover i{
    font-size:23px;
}
@media(min-width:768px) and (max-width:1280px){
    .top-header>.row>div:first-child, .top-header>.row>div:last-child{
        width:50%;
    }
    .top-header>.row>div:nth-child(2){
        order:3;
        width:100%;
    }
}
@media(min-width:992px){
    .grid-experiencias{
        display:grid;
        grid-template-rows: repeat(4, 1fr);
        grid-template-columns: repeat(2, 1fr);
        gap:10px;
    }
    .grid-experiencias>div:nth-child(1){
        grid-column: 1;
        grid-row: 1;
    }
    .grid-experiencias>div:nth-child(2){
        grid-column: 1;
        grid-row: 2;
    }
    .grid-experiencias>div:nth-child(3){
        grid-column: 2;
        grid-row: 1 / span 2;
    }
    .grid-experiencias>div:nth-child(4){
        grid-column: 1;
        grid-row: 3 / span 2;
    }
    .grid-experiencias>div:nth-child(5){
        grid-column: 2;
        grid-row: 3;
    }
    .grid-experiencias>div:nth-child(6){
        grid-column: 2;
        grid-row: 4;
    }
    .grid-experiencias>div:nth-child(7){
        grid-column: 1;
        grid-row: 5;
    }
    .grid-experiencias>div:nth-child(8){
        grid-column: 1;
        grid-row: 6;
    }
    .grid-experiencias>div:nth-child(9){
        grid-column: 2;
        grid-row: 5 / span 2;
    }
    .grid-experiencias>div:nth-child(10){
        grid-column: 1;
        grid-row: 7 / span 2;
    }
    .grid-experiencias>div:nth-child(11){
        grid-column: 2;
        grid-row: 7;
    }
    .grid-experiencias>div:nth-child(12){
        grid-column: 2;
        grid-row: 8;
    }
    .grid-experiencias>div img.img-responsive{
        height:100%;
    }
}
@media(min-width:768px){
    .flex-center>.row{
        display:flex;
        align-items:center;
    }
    .menu-mobile{
        display:none;
    }
}
@media(max-width:1440px){
.servicio h3{
    font-size:28px;
}
}

@media (min-width: 1280px) and (max-width: 1368px) {
   .footer-width-1366 {
    width:100% !important;
   }  
}

@media(max-width:1199px){
    .bgGrayExperience, .box-clear{
        padding:20px;
    }
}
@media(max-width:1024px){
    .w50, .w60, .w70, .w80, .w90{
        width:96% !important;
        padding-left:2%;
        padding-right:2%;
    }
    .hotel-home .img-hotel-home:first-child{
        display:none;
    }
    .hotel-home .text-hotel-home{
        flex:1;
    }
    .banner-destino .box{
        height:65%;
        right:3%;
    }
    .banner-destino.invert .box{
        left:3%;
    }
    .text-offer{
        padding:20px;
    }
   /*
    .text-offer>div:last-child{
        display:none;
    }*/
    .offer img.img-responsive, .experience img.img-responsive,
    .suscription img.img-responsive{
        min-height:300px;
    }
    .experience.big-experience img.img-responsive{
        min-height:450px;
    }
    
   .redes-footer.left{
       width:900px;
       display:flex;
       flex-direction: row;
       justify-content: flex-end;
    } 
}
@media(min-width:992px) and (max-width:1439px){
/*.grid-experiencias>div{
    min-height:450px;
}*/
}
@media(max-width:991px){
    section.animOpac.opac:has(.menu-select-mobile){
        animation:none;
    }
    .grid-experiencias>div{
        margin-top:10px;
        /*min-height:400px;*/
    }
    .header .access-right>.row>.col{
        padding:0 20px 0 5px;
    }
    .suscription img.img-responsive{
        margin-top:20px;
    }
    .menu-select-mobile .dropdown{
        padding:0 10px;
    }
    .grid-experiencias{
        display:flex;
        flex-wrap:wrap;
    }
   .grid-experiencias>div:nth-child(1){
        order:1;
    }
    .grid-experiencias>div:nth-child(2){
       order:2;
    }
    .grid-experiencias>div:nth-child(3){
        order:3;
    }
    .grid-experiencias>div:nth-child(4){
       order:5;
    }
    .grid-experiencias>div:nth-child(5){
       order:4;
    }
    .grid-experiencias>div:nth-child(6){
        order:6;
    }
    .grid-experiencias>div:nth-child(7){
       order:7;
    }
    .grid-experiencias>div:nth-child(8){
        order:8;
    }
    .grid-experiencias>div:nth-child(9){
        order:9;
    }
    .grid-experiencias>div:nth-child(10){
       order:11;
    }
    .grid-experiencias>div:nth-child(11){
        order:10;
    }
    .grid-experiencias>div:nth-child(12){
       order:12;
    }
    .distancias{
        flex-wrap:wrap;
        justify-content:center;
    }
}
@media(max-width:768px){
    .box:before{
        bottom:95%;
    }
}
@media(max-width:767px){
    .top-header>.row{
        align-items:flex-start;
    }
    .top-header .navbar{
        padding-top:0;
    }
    .top-header .logo-mobile{
        width:auto;
        max-height:60px;
    }
    body p.titleHero, h1,h2.uppercase {
        font-size:36px;
    }
    body h2{
        font-size:32px;
    }
    body h3{
        font-size:30px;
    }
    
     .paddTop120 {
         
        padding-top:90px !important; 
     }
    .text-container{
        padding:20px;
    }
    .hotel-home{
        flex-direction:column;
    }
    .banner-destino .box{
        width:96%;
        left:2% !important;
        right:auto !important;
        position:relative;
        margin-top:-80px;
    }
    .text-footer{
       padding:20px;
       text-align:center;
    }
    
    .text-footer.left{
        text-align:center !important;
    }
    
    .htt-text-image .d-flex.align-items-center{
        flex-direction:column;
    }
    .htt-text-image .d-flex.align-items-center img{
        display:none;
    }
    .htt-text-image .d-flex.align-items-center p.right{
        text-align:center !important;
        margin-top:20px;
    }
    .htt-text-image .title-flex.justify-content-between{
        justify-content:center !important;
    }
    .htt-text-image .title-flex img{
        display:none;
    }
    .servicio .box-clear{
        margin-top:20px;
    }
    .servicio.invert>.row>div:last-child{
        order:1;
    }
    .servicio.invert>.row>div:first-child{
        order:2;
    }
    .servicio>.row>div:has(img.img-responsive){
        margin-bottom:20px;
    }
    form .row>.col{
        flex-basis:100%;
    }
}