@import url('../fonts/Gotham/gotham.css');

:root {
    --color-gris: #76777a;
    --color-verde: #4c9c2e;
    --color-verde-alt: #3b7f42;
    --color-verde-special: #80bc00;
    --color-verde-oscuro: #487629;
	--color-blanco: #ffffff;
	--color-gris-claro: #c8c8c7;
	--color-gris-clarito: #e8e8e3;
	--color-wgreen: #419639;
	--color-rewards: #0F7EBC;
}

a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}body{-webkit-text-size-adjust:none}mark{background-color:transparent;color:inherit}input::-moz-focus-inner{border:0;padding:0}input,select,textarea{-moz-appearance:none;-webkit-appearance:none;-ms-appearance:none;appearance:none}@-ms-viewport{width:device-width}body{-ms-overflow-style:scrollbar}@media screen and (max-width:480px){body,html{min-width:320px}}html{box-sizing:border-box}*,:after,:before{box-sizing:inherit}

body {font-family: Gotham;font-size: 16pt;font-weight: 300;line-height: 1.35em;letter-spacing: 0.015em;}
@media screen and (max-width: 1680px) {body, input, select, textarea {font-size: 13pt;}}
@media screen and (max-width: 1280px) {body, input, select, textarea {font-size: 11pt;}}

.container{margin:0 auto;padding: 4em 0;max-width:calc(100% - 5em);width:60em}.container.xsmall{width:15em}.container.small{width:30em}.container.medium{width:45em}.container.large{width:75em}.container.xlarge{width:90em}.container.max{width:100%}@media screen and (max-width:840px){.container{width:100%!important}}@media screen and (max-width:736px){.container{max-width:calc(100% - 3em)}}

a {color: var(--color-verde);text-decoration: none;}
a:hover {color: var(--color-verde-alt)}
h1,h2,h3,h4,h5,h6 {margin-bottom:0.5em;font-weight:500;line-height:1em;}
h1{font-size: 2em;text-transform: uppercase;margin-bottom: 0;}
h2 {font-size: 1.5em;color: var(--color-verde-alt);margin-bottom: 0.5em;text-transform: uppercase;}
h3{font-size: 1em;font-weight: 400;text-transform: uppercase;}
h4{font-size: 1.5em}
h5{font-size: 1.25em}
p {font-size: 1em;margin: 0;}
img {margin-bottom: 1em;}
input:is([type="text"],[type="password"],[type="email"]),select,textarea {background-color: #f8f8f8;border-radius: 6px;border: solid 1px #e5e5e5;color: inherit;display: block;outline: 0;padding: 0 1em;text-decoration: none;width: 100%;}
input:is([type="text"],[type="password"],[type="email"]),select {height: 2em;}
textarea {padding: 0.75em 1em;}
@media screen and (max-width: 736px) {h2 {font-size: 1.25em;}}

.small {font-size:0.9em}
strong {font-weight: 600;}

.button {-moz-transition: opacity 0.2s ease-in-out;-webkit-transition: opacity 0.2s ease-in-out;-ms-transition: opacity 0.2s ease-in-out;transition: opacity 0.2s ease-in-out;font-size: 0.8em;background-color: var(--color-verde-alt);color: var(--color-blanco);text-decoration: none;border-radius: 0.5em;border: none;cursor: pointer;display: inline-block;font-weight: 500;height: 2.5em;line-height: 2.5em;padding: 0 1.25em;text-transform: uppercase;}
.button:hover {color:var(--color-blanco);opacity: 0.8;}
@media screen and (max-width: 1680px) {.button {font-size: 1em;}}

.grecaptcha-badge{display: none;}

#header {background: var(--color-blanco);color: var(--color-verde-alt);cursor: default;height: 6em;left: 0;line-height: 5em;position: relative;top: 0;width: 100%;z-index: 10000;}
#header .container {padding: 0;position: relative;}
#header .logo {position: relative;background: transparent;padding: 0;width: 20em;height: 7em;padding-top: 0;}
#header .logo img {position: relative;display: block;height: 6.5em;margin: 0 auto;z-index: 4;}
#header .logo:before {content: "";position: absolute;right: 0;bottom: calc(-3.5em + 8px);left: 0;width: 0px;height: 0px;margin: auto;border-style: solid;border-color: var(--color-blanco) transparent transparent transparent;border-width: 5em 10em 0 10em;z-index: 1;}
#header .balloon1 {position: relative;background: transparent;padding: 0;border-bottom: 2px solid var(--color-gris);width: 100%;margin-top: -2.5em;}
#header .balloon2 {position: relative;background: transparent;padding: 0;border-bottom: 2px solid var(--color-gris);width: 100%;margin-top: 3.5em;margin-top: -2em;}
#header .balloon2:before {content: "";position: absolute;right: 0;bottom: -4em;left: 0;width: 0px;height: 0px;margin: auto;border-style: solid;border-color: var(--color-gris) transparent transparent transparent;border-width: 4em 8em 0 8em;z-index: 2;}
#header .balloon2:after {content: "";position: absolute;right: 0;bottom: calc(-4em + 2px);left: 0;width: 0px;height: 0px;margin: auto;border-style: solid;border-color: var(--color-blanco) transparent transparent transparent;border-width: 4em 8em 0 8em;z-index: 3;}

#header nav {height: inherit;line-height: inherit;position: absolute;right: 0;top: 0;vertical-align: middle;}
#header nav > ul {list-style: none;margin: 0;padding-left: 0;}
#header nav > ul > li {display: inline-block;padding-left: 0;}
#header nav > ul > li a {-moz-transition: border-bottom-color 0.2s ease-in-out;-webkit-transition: border-bottom-color 0.2s ease-in-out;-ms-transition: border-bottom-color 0.2s ease-in-out;transition: border-bottom-color 0.2s ease-in-out;font-size: 0.7em;font-weight: 500;letter-spacing: 0;text-transform: uppercase;display: inline-block;height: 2.5em;line-height: 2.5em;padding: 0 0.5em;border-bottom: solid 4px transparent;}
#header nav > ul > li a.active, #header nav > ul > li a:hover {border-bottom-color: var(--color-verde-special);}
#header nav > ul > li .icon .label {display: none;}

#header nav > ul > li a:not(.button) {color: var(--color-verde-alt);display: inline-block;text-decoration: none;}
#header nav > ul > li a:not(.button).icon {border-bottom-color: transparent !important;}
#header :is(input[type="submit"],input[type="reset"],input[type="button"],.button) {background-color: transparent;box-shadow: inset 0 0 0 2px #999;color: var(--color-blanco);}
#header :is(input[type="submit"],input[type="reset"],input[type="button"],.button):hover {background-color: rgba(153, 153, 153, 0.25);}
#header :is(input[type="submit"],input[type="reset"],input[type="button"],.button):active {background-color: rgba(153, 153, 153, 0.5);}

#navPanel, #navButton {display: none;}
@media screen and (max-width: 1680px) {#header nav > ul > li a {font-size: 0.9em;}}
@media screen and (max-width: 1280px) {#header .logo {margin-left: -4em;}#header nav {margin-right: -1em}}
@media screen and (max-width: 980px) {
    #header nav {display: none;}
	#navButton {-moz-backface-visibility: hidden;-webkit-backface-visibility: hidden;-ms-backface-visibility: hidden;backface-visibility: hidden;-moz-transition: -moz-transform 0.5s ease;-webkit-transition: -webkit-transform 0.5s ease;-ms-transition: -ms-transform 0.5s ease;transition: transform 0.5s ease;display: block;right: 0;position: absolute;top: 0;z-index: 10001;}
	#navButton .toggle {text-decoration: none;height: 100%;right: 0;position: absolute;top: 0;width: 100%;border: 0;outline: 0;}
	#navButton .toggle:before {-moz-osx-font-smoothing: grayscale;-webkit-font-smoothing: antialiased;display: inline-block;font-style: normal;font-variant: normal;text-rendering: auto;line-height: 1;text-transform: none !important;font-family: 'Font Awesome 5 Free';font-weight: 900;}
	#navButton .toggle:before {border-radius: 6px;color: var(--color-gris);content: '\f0c9';display: block;font-size: 16px;height: 2.25em;right: 1em;line-height: 2.25em;position: absolute;text-align: center;top: 1em;width: 3.5em;}
	#navPanel {-moz-backface-visibility: hidden;-webkit-backface-visibility: hidden;-ms-backface-visibility: hidden;backface-visibility: hidden;-moz-transform: translateX(16em);-webkit-transform: translateX(16em);-ms-transform: translateX(16em);transform: translateX(16em);-moz-transition: -moz-transform 0.5s ease;-webkit-transition: -webkit-transform 0.5s ease;-ms-transition: -ms-transform 0.5s ease;transition: transform 0.5s ease;display: block;height: 100%;right: 0;overflow-y: auto;position: fixed;top: 0;width: 16em;z-index: 10002;background: var(--color-gris);color: var(--color-blanco);}
	#navPanel .link {border-bottom: 0;border-top: solid 1px rgba(255, 255, 255, 0.05);color: #bbb;display: block;height: 44px;line-height: 44px;padding: 0 1em 0 1em;text-decoration: none;}
	#navPanel .link:first-child {border-top: 0;}
    #navPanel .link.depth-0 {color: var(--color-blanco);}
	body.navPanel-visible #navPanel {-moz-transform: translateX(0);-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);}
}
@media screen and (max-width: 480px) {#header .logo {margin-left: -6em;}}

#title header {color: var(--color-blanco);padding: 5em 0 4em 0;text-align: center;background-size: cover;}
#title header.style-1 {background-image: url('../img/galeria/BelAir_Business_CDMX_habitacion5.jpg');background-position: 50% 55%;}
#title header.style-2 {background-image: url('../img/galeria/BelAir_Business_CDMX_wtc2.jpg');background-position: 50% 35%;}
#title header.style-3 {background-image: url('../img/galeria/BelAir_Business_CDMX_salon2.jpg');background-position: 50% 55%;}
#title header.style-4 {background-image: url('../img/galeria/BelAir_Business_CDMX_lobby.jpg');background-position: 50% 65%;}
#title header.style-7 {background-image: url('../img/wyndam_green/WYNDHAM REWARDS_BAU CDMX_WEB_Banner_Slider_Escritorio_Green.png');background-position: 50% 70%;}
#title header.style-8 {background-image: url('../img/wyndam_rewards/WYNDHAM REWARDS_BAU CDMX_WEB_Banner_Slider_Escritorio_Rewards.png');background-position: 50% 70%;}
#title header.style-9 {background-image: url('../img/galeria/BelAir_Business_CDMX_fachada.jpg');background-position: 50% 75%;}
@media screen and (max-width: 840px) {#title header.style-7 {background-image: url('../img/wyndam_green/WYNDHAM REWARDS_BAU CDMX_WEB_Banner_Slider_Tablet_Green.png');background-position: 50% 0%;}}
@media screen and (max-width: 480px) {#title header.style-7 {background-image: url('../img/wyndam_green/WYNDHAM REWARDS_BAU CDMX_WEB_Banner_Silder_Mobile_Green.png');background-position: 50% 0%;}}
@media screen and (max-width: 840px) {#title header.style-8 {background-image: url('../img/wyndam_rewards/WYNDHAM REWARDS_BAU CDMX_WEB_Banner_Slider_Tablet_Rewards.png');background-position: 50% 0%;}}
@media screen and (max-width: 480px) {#title header.style-8 {background-image: url('../img/wyndam_rewards/WYNDHAM REWARDS_BAU CDMX_WEB_Banner_Slider_Mobile_Rewards.png');background-position: 50% 0%;}}
#title.simple header {display: none;}
#title footer {background-color: var(--color-verde);color: var(--color-blanco);padding: 0.5em 0;}
#title.simple footer {padding: 1em 0;}
#title footer a {color: var(--color-blanco)}
#title footer .container {display: flex;flex-wrap: wrap;flex-direction: row;justify-content: center;padding: 0;}
#title footer span {text-align: center;display: block;width: 16em;line-height: 2em;}
#title footer .button {color: var(--color-verde-alt);background-color: var(--color-blanco);}
@media screen and (max-width: 840px) {#title footer .button {font-size: 1em;text-align: center;}}
@media screen and (max-width: 840px) {#title.simple footer .container {justify-content: flex-end;}#title.simple footer span {width: auto;}#title.simple footer .button {margin-left: 2em;}}
@media screen and (max-width: 736px) {#title.simple footer .container {flex-direction: column;}#title footer span {text-align: right;}}
@media screen and (max-width: 480px) {#title.simple footer {display: none;}}

#footer .logo {display: block; width:17em; margin: -1em auto -2.5em auto; max-width: 100%;}
#footer p {text-align: center;margin-bottom: 2em;color: var(--dark-gray);}
#footer ul {margin: 0; padding: 0;}
#footer ul li {list-style: none;}
#footer ul.icono {text-align: center; margin-bottom: 2em;}
#footer ul.icono li {display: inline-block; padding: 0 1.5em;}
#footer ul.icono li span {color: var(--color-verde-alt); font-size: 1.5em;}
#footer ul.icono li img {height: 2em; margin: -0.5em 0 -0.5em 0; line-height: 2em;}
#footer .direccion {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; margin-bottom: 2em;}
#footer .direccion div {width: 50%;}
#footer .direccion div:last-child {width: 25em;}
#footer .direccion ul {border-left: solid 4px var(--color-gris); margin-left: 0.75em; padding-left: 0.75em; width: 100%; height: 100%; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center;}

#footer ul.copy { text-align: center;}
@media screen and (max-width: 840px) {#footer .direccion div,#footer .direccion div:last-child {width: 100%;} #footer .direccion ul {margin: 0; padding: 0; border: 0; margin-top: 1em; padding-top: 1em; border-top: solid 4px var(--color-gris);}}
@media screen and (max-width: 480px) {#footer{padding-bottom: 5em;}#footer .direccion ul li a br {display: none;} #footer .direccion ul li a {display: block;} #footer ul.icono li {padding: 0 1em;}}

#float-action-button-book {position: fixed;bottom: 1em;right: 1em;font-size: 0.8em;font-weight:500;z-index: 11000;}
#float-action-button-book .main-button {display: block;background-color: var(--color-verde-alt);color: var(--color-blanco);position: relative; -moz-transition: -moz-transform 0.25s ease; -webkit-transition: -webkit-transform 0.25s ease; -ms-transition: -ms-transform 0.25s ease; transition: transform 0.25s ease; height: 3em; line-height: 3em; text-align: center; padding: 0 1.5em; border-radius: 0.75em; cursor: pointer; box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px; -webkit-tap-highlight-color: transparent;text-transform: uppercase;}
#float-action-button-book .main-button:hover {-moz-transform: scale(1.05);-webkit-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);}
@media screen and (max-width: 1680px) {#float-action-button-book {font-size: 1em;}}
@media screen and (max-width: 480px) {#float-action-button-book {font-size: 0.8em;bottom: 0.25em;right: 0.5em;}#float-action-button-book a {padding: 0 1em;}}
@media screen and (max-width: 480px) {.zopim{left: 0.25em !important;}}

#cookies {background-color: var(--color-verde-alt); position: fixed;bottom: 0.5em;left: 0.5em;color: var(--color-blanco); box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px; width: calc(45em); border-radius: 1em; padding: 1em 2em 1em 1em; z-index:16000002; -moz-transform: translateY(11rem); -webkit-transform: translateY(11rem); -ms-transform: translateY(11rem); transform: translateY(11rem); opacity: 0;}
#cookies span {position: absolute; right: 1em; top: 1em; cursor: pointer;}
@media screen and (max-width: 840px) {#cookies {width: calc(100vw - 10em); max-width: calc(100vw - 1em);}}
@media screen and (max-width: 480px) {#cookies {bottom: 0.5em; width: calc(100vw - 1em);-moz-transform: translateY(11em); -webkit-transform: translateY(11em); -ms-transform: translateY(11em); transform: translateY(11em);} }

@-moz-keyframes cookies { 0% {-moz-transform: translateY(0.75rem); transform: translateY(0.75rem); opacity: 0;} 100% {-moz-transform: translateY(0); transform: translateY(0); opacity: 1;}}
@-webkit-keyframes cookies { 0% {-webkit-transform: translateY(0.75rem);transform: translateY(0.75rem); opacity: 0;} 100% {-webkit-transform: translateY(0);transform: translateY(0); opacity: 1;}}
@-ms-keyframes cookies { 0% {-ms-transform: translateY(0.75rem); transform: translateY(0.75rem); opacity: 0;} 100% {-ms-transform: translateY(0); transform: translateY(0); opacity: 1;}}
@keyframes cookies { 0% {transform: translateY(0.75rem); opacity: 0; } 100% {transform: translateY(0); opacity: 1;} }
@-moz-keyframes cookies_out { 0% {-moz-transform: translateY(0);transform: translateY(0); opacity: 1;} 80% {-moz-transform: translateY(0.75rem);transform: translateY(0.75rem); opacity: 0;} 100% {-moz-transform: translateY(11em); transform: translateY(11em);}}
@-webkit-keyframes cookies_out { 0% {-webkit-transform: translateY(0);transform: translateY(0); opacity: 1;} 80% {-webkit-transform: translateY(0.75rem); transform: translateY(0.75rem);opacity: 0;} 100% {-webkit-transform: translateY(11em); transform: translateY(11em);}}
@-ms-keyframes cookies_out { 0% {-ms-transform: translateY(0); transform: translateY(0); opacity: 1; } 80% {-ms-transform: translateY(0.75rem); transform: translateY(0.75rem); opacity: 0;} 100% {-ms-transform: translateY(11em); transform: translateY(11em);}}
@keyframes cookies_out { 0% {transform: translateY(0); opacity: 1;} 80% {transform: translateY(0.75rem); opacity: 0;} 100% {transform: translateY(11em);}}
#cookies.accept {-moz-animation: cookies_out 1.5s forwards; -webkit-animation: cookies_out 1.5s forwards; -ms-animation: cookies_out 1.5s forwards; animation: cookies_out 1.5s forwards; }
#cookies.active {-moz-animation: cookies 1.5s forwards; -webkit-animation: cookies 1.5s forwards; -ms-animation: cookies 1.5s forwards; animation: cookies 1.5s forwards; }

#float-sociales {position: fixed;bottom: 5em;right: 1em;color: #ffffff;z-index:900;}
#float-sociales .main-button, #float-sociales ul .single-button {background-color: #3b7f42;}
#float-sociales .main-button {position: relative;-moz-transition: -moz-transform 0.25s ease;-webkit-transition: -webkit-transform 0.25s ease;-ms-transition: -ms-transform 0.25s ease;transition: transform 0.25s ease;height: 3em;width: 8em;line-height: 3em;padding: 0 1.5em;border-radius: 1.5em;cursor: pointer;z-index: 1000;box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;-webkit-tap-highlight-color: transparent;}
#float-sociales .main-button:hover {-moz-transform: scale(1.05);-webkit-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);}
#float-sociales a {border-bottom-color: transparent !important;}
#footer #float-sociales span.fa,#footer #float-sociales span.fab {font-size: 1.2em;margin-right: 0.25em;}
#footer #float-sociales .fa.fa-phone::before {font-size: 0.8em;}
#float-sociales ul {position: fixed;bottom: 5em;right: 1em;margin: 0;padding: 0;text-align: center;cursor: pointer;}
#float-sociales ul li {display: inline-block !important;margin: 0;padding: 0;font-size: 0.9em;}
#float-sociales ul .single-button {-moz-transition: -moz-transform 0.35s ease;-webkit-transition: -webkit-transform 0.35s ease;-ms-transition: -ms-transform 0.35s ease;transition: transform 0.35s ease;-moz-transform: scale(0.5) translateY(6.5em);-webkit-transform: scale(0.5) translateY(6.5em);-ms-transform: scale(0.5) translateY(6.5em);transform: scale(0.5) translateY(6.5em);position: relative;color: #ffffff;width: 3em;height: 3em;border-radius: 100%;line-height: 3em;z-index: 1000;box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;}
#float-sociales ul.loading .single-button {-moz-transform: scale(1) translateY(0);-webkit-transform: scale(1) translateY(0);-ms-transform: scale(1) translateY(0);transform: scale(1) translateY(0);}
#float-sociales ul .single-button:hover {-moz-transform: scale(1.1);-webkit-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1);}
@media screen and (max-width: 480px) {#float-sociales ul {bottom: 3.5em;}}