/**Definicion de variables**/

:root {
  --fontPrimary: "Literata", serif;
  --fontSecondary: "Roboto", sans-serif;
  --colorWhite: #fff;
  --colorPrimary: #40e0d0;
  --colorSecondary: #2d2d2c;
  --colorYellow: #ffca00;
  --colorGreen: #154b45;
  --colorGray: #5a5a59;
  --colorPrice: #bff5ef;
  --colorBreadcrumb: #f7f8fa;
}
html{
    scroll-padding-top:80px;
}
/*Estilos genéricos*/
.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;
}
.colorSecondary {
  color: var(--colorSecondary) !important;
}
.colorGreen {
  color: var(--colorGreen) !important;
}
.colorGray {
  color: var(--colorGray) !important;
}
.colorBreadcrumb {
  color: var(--colorBreadcrumb) !important;
}
.white,
.white strong,
.white span {
  color: var(--colorWhite) !important;
}
strong {
  font-weight: 500 !important;
}
a{
    text-decoration:none;
    color:var(--colorSecondary);
}
.none {
  display: none !important;
}
.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;
}
.mBT120 {
  margin-bottom: 120px !important;
}
.paddTop40 {
  padding-top: 40px !important;
}
.paddBT40 {
  padding-bottom: 40px !important;
}
.paddTop60 {
  padding-top: 60px !important;
}
.paddBT60 {
  padding-bottom: 60px !important;
}
.paddTop120 {
  padding-top: 120px !important;
}
.paddBT120 {
  padding-bottom: 120px !important;
}
.padd0 .row>div{
    padding:0 !important;
}
.w50 {
  width: 50% !important;
}
.w60 {
  width: 60% !important;
}
.w70 {
  width: 70% !important;
}
.w80 {
  width: 80% !important;
}
.w90 {
  width: 90% !important;
}
.img-responsive{
    width:100%;
    max-width:100%;
    object-fit:cover;
}
.breadcrumb-item{
    font-size:16px;
}
#buttonShowSearcherScroll,
#buttonShowSearcherMobile {
  text-transform: none !important;
  background-color: var(--colorGreen) !important;
  transform: scale(0.9);
  border: 2px solid var(--colorPrimary);
  border-radius: 8px;
  padding: 13px !important;
}
main{
    overflow-x:hidden;
}
/*Header*/
header{
    z-index:2;
}
.person-login-text,
.hotel-login-text,
.mybooking-content-text,
body .accesos-header .htt-text-image p.checkin,
body .htt-text-image p.linksMenuExt,.hotel-login-text-high {
  font-size: 18px;
  font-family: var(--fontSecondary);
  font-weight: 500;
  color:#fff;
}
.hotelLogin-content img, .personLogin-content img, .mybooking-content img{
    filter:none !important;
}
.logo img {
  filter: brightness(0) invert(1);
  max-height:75px;
  width:auto;
}
.log img{
  max-height: 85px;
  width:auto;
}
.top-header {
  padding: 10px 40px;
}
.top-header-mobile {
  padding: 10px 0;
}
.top-header-mobile .logo img{
   max-height:60px; 
}
.top-header>.row{
    align-items:center;
}
.accesos-header>.row {
  float: right;
}
.accesos-header > .row>div {
  width: auto;
}
.top-header-mobile .accesos-header > .row{
    float:none;
    gap:.5rem;
}
.top-header-mobile .accesos-header > .row>div{
    padding:0;
}
.open-selector-language{
    background-color:transparent !important;
    border:none;
}
.options-selector-language{
    border-radius:0;
}
.open-selector-language span{
    font-weight:500;
}
.open-selector-language span:before {
    content: url(/dam/sbh-hotels-resorts-agencias/home/icon-language.png);
    filter: brightness(0) invert(1);
    margin-right:4px;
}
.top-header-mobile .open-selector-language,
.top-header-mobile .options-selector-language{
    color:var(--colorSecondary);
    background: var(--colorPrice) !important;
    border-radius: 8px;
}
.httHeaderFixedToTopPlusAbsolute .open-selector-language span:before,
.top-header-mobile .open-selector-language span:before{
    filter:none;
}
.top-header-mobile .group-languages-texts{
    position: absolute;
    right: 1.1rem;
    top:4.5rem;
}
.top-header-mobile .navbar-nav{
    padding-top:4rem;
}
header.httHeaderFixedToTopPlusAbsolute{
    background:#fff;
}
header.httHeaderFixedToTopPlusAbsolute .open-selector-language span:before,
header.httHeaderFixedToTopPlusAbsolute .hotelLogin-content img, 
header.httHeaderFixedToTopPlusAbsolute.personLogin-content img,
header.httHeaderFixedToTopPlusAbsolute .mybooking-content img{
    filter:brightness(0%) !important;
}
header.httHeaderFixedToTopPlusAbsolute .person-login-text,
header.httHeaderFixedToTopPlusAbsolute .hotel-login-text,
header.httHeaderFixedToTopPlusAbsolute .hotel-login-text-high,
header.httHeaderFixedToTopPlusAbsolute .mybooking-content-text,
body header.httHeaderFixedToTopPlusAbsolute .accesos-header .htt-text-image p.checkin,
body header.httHeaderFixedToTopPlusAbsolute .htt-text-image p.linksMenuExt,
body header.httHeaderFixedToTopPlusAbsolute .open-selector-language{
    color:var(--colorSecondary);
}
header.httHeaderFixedToTopPlusAbsolute .logo img{
    filter:none;
    max-height:55px;
}
.top-header-mobile .hotel-login-text-not-logged,
.top-header-mobile .mybooking-content-text{
    display:none;
}
.top-header-mobile .accesos-header>.row{
    flex-wrap:nowrap;
}
.navbar-toggler{
    filter:brightness(0) invert(1);
    border:none;
    opacity:1;
}
.httHeaderFixedToTopPlusAbsolute .navbar-toggler{
    filter:none;
}
.offcanvas{
    background:var(--colorPrimary);
}
/*Stage*/
.stage .container-hero{
    position:relative;
}
.container-hero img{
    height:70vh;
}
.container-hero .overlay {
  position: absolute;
  z-index: 1;
  background: rgba(0, 0, 0, 0.3);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.containerTxtSlide p.titleHero {
  font-weight: 500;
}
/*Body*/
body{
    font-size: 20px;
    font-family: var(--fontSecondary);
    color: var(--colorGray);
    line-height: 2em;
    margin-bottom: 0;
}
h1,
h2,
h3{
  font-weight: 600;
  background: transparent;
  color: var(--colorSecondary);
  font-style: normal !important;
  font-family: var(--fontSecondary);
  line-height:1.1;
}
h1,p.titleHero{
  font-size: 3.5rem;
}
h2{
    font-size:2.8rem;
}
/*Botones*/
.buttonMore, form input[type=submit] {
  background: var(--colorPrimary);
  border: 2px solid var(--colorPrimary);
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 500;
  transition: 0.3s all;
}
.buttonMore:hover,form input[type=submit]:hover {
  background: var(--colorGreen);
  color: #fff !important;
}
.buttonMore.colorGray{
    color:var(--colorSecondary) !important;
}
.buttonMore.colorGray:hover{
    color:#fff !important;
}
h2.colorPrimary{
    background:rgba(255,255,255,.002);
}
/*Forms*/
form .form-row{
    display:flex;
    flex-direction:column;
    gap:8px;
}
form input:not(form input[type=checkbox],form input[type=submit]){
    border-radius:10px;
    width:100%;
}
form .button-wrapper{
    text-align:center;
}
/*Footer*/
.footer{
    background-color: var(--colorPrimary);
    margin-top: 240px;
    position:relative;
    font-size:16px;
    color:var(--colorGreen) !important;
    padding:60px 0 20px 0;
}
.footer ul{
    padding-left:0;
    list-style:none;
    color:var(--colorSecondary);
}
.footer-olas{
    position: absolute;
    bottom: 99%;
    height: 150px;
    width: 100%;
    background: url(/dam/sbh-hotels-resorts-agencias/home/footer-olas.webp);
    background-repeat: no-repeat;
    background-size: cover;
    content: "";
    z-index: 1;
}
.footer ul.flex a{
    text-decoration:underline;
}
.footer .social a {
  margin-right: 1.5rem;
}
.footer .social img {
  transition: 0.3s all;
}
.footer .social a:hover img {
  transform: scale(0.9);
}
.footer .copy .fa {
    color: var(--colorYellow);
    margin: 0 8px;
}
.footer .copy .row{
    align-items:center;
}
.footer address p{
    margin-bottom:0;
}
.footer ul.flex{
    display: flex;
    justify-content: center;
    gap: .5rem;
    margin-bottom:0;
}
.httButtonScrollToTop {
    width: 48px;
    height: 48px;
    opacity: 0.8;
    bottom: 100px;
    right: 20px;
    background: var(--colorGreen);
    border-radius: 50% !important;
    border: 3px solid var(--colorPrimary);
    text-align: center;
    padding: 10px;
    transition: .5s all;
    color: var(--colorPrimary) !important;
    display:flex;
}
/*Error 404*/
.img404 {
  max-height: 300px;
  width: auto;
  margin: 0 auto;
}
/*Área cliente menús*/
.nav-pills{
    justify-content:center !important;
}
.nav-pills .nav-link{
    color:var(--colorSecondary);
    font-size:20px;
}
.nav-pills .nav-link:hover{
    color:var(--colorGreen);
}
.nav-pills .btn-group{
    border-radius:3px;
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    background-color:var(--colorGreen);
    color:#fff;
}
.htt-content-navigation .dropdown button.dropdown-toggle {
    border-radius: 3px;
    background: var(--colorGreen);
    border: none;
    font-size: 21px;
    padding: 10px 0;
}
.htt-content-navigation .dropdown-menu>div{
    text-align:center;
    width:100%;
}
.htt-content-navigation ul.dropdown-menu,
.htt-content-navigation ul.dropdown-menu .btn-group{
    width: 100%;
}
.htt-content-navigation ul.dropdown-menu .dropdown-item,
.htt-content-navigation .dropdown-item{
    font-size:18px !important;
}
.htt-content-navigation ul.dropdown-menu .dropdown-item.active{
    background-color:var(--colorGreen);
}
.ul-card{
    align-items:center;
}
.ul-card__image img{
    max-height: 50vh !important;
    width: 100% !important;
    object-fit: cover;
}
@media (max-width: 1024px) {
  .w60,
  .w70,
  .w80 {
    width: 90% !important;
  }
}
@media(max-width:991px){
    .footer{
        padding-bottom:80px;
    }
}
@media (max-width: 767px) {
  .w50,
  .w60,
  .w70,
  .w80,
  .w90 {
    width: 100% !important;
  }
  h1, p.titleHero{
      font-size:3rem;
  }
  h2{
    font-size:2.3rem;
  }
  .footer ul.flex{
      flex-direction:column;
      align-items:flex-start;
  }
  .footer .right, .footer .center{
      text-align:left !important;
  }
}