/*
Theme Name: Hello Elementor Child — Castle Hot Springs
Theme URI: https://www.castlehotsprings.com/
Description: Castle Hot Springs child theme on Hello Elementor. Carries the site logic and styling
             previously held by camyno-child; header and footer are Elementor Theme Builder templates.
Author: AZDS
Author URI: https://www.azds.com/
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-child
*/

/* ==================================================================
 * Ported verbatim from camyno-child/style.css. This is the site's own
 * styling and is independent of the parent theme -- 0 of its rules
 * target .elementor-section / .elementor-column / .elementor-row, which
 * is why the container migration does not disturb it.
 * ================================================================== */


/* Custom Fonts */
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-thin-webfont.eot');
    src: url('fonts/metropolis/metropolis-thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-thin-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-thin-webfont.woff') format('woff');
    font-weight: 100;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-thinitalic-webfont.eot');
    src: url('fonts/metropolis/metropolis-thinitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-thinitalic-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-thinitalic-webfont.woff') format('woff');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-extralight-webfont.eot');
    src: url('fonts/metropolis/metropolis-extralight-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-extralight-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-extralight-webfont.woff') format('woff');
    font-weight: 200;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-extralightitalic-webfont.eot');
    src: url('fonts/metropolis/metropolis-extralightitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-extralightitalic-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-extralightitalic-webfont.woff') format('woff');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-light-webfont.eot');
    src: url('fonts/metropolis/metropolis-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-light-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-light-webfont.woff') format('woff');
    font-weight: 300;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-lightitalic-webfont.eot');
    src: url('fonts/metropolis/metropolis-lightitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-lightitalic-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-lightitalic-webfont.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-regular-webfont.eot');
    src: url('fonts/metropolis/metropolis-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-regular-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-regular-webfont.woff') format('woff');
    font-weight: 400;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-regularitalic-webfont.eot');
    src: url('fonts/metropolis/metropolis-regularitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-regularitalic-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-regularitalic-webfont.woff') format('woff');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-medium-webfont.eot');
    src: url('fonts/metropolis/metropolis-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-medium-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-medium-webfont.woff') format('woff');
    font-weight: 500;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-mediumitalic-webfont.eot');
    src: url('fonts/metropolis/metropolis-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-mediumitalic-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-mediumitalic-webfont.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-semibold-webfont.eot');
    src: url('fonts/metropolis/metropolis-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-semibold-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-semibold-webfont.woff') format('woff');
    font-weight: 600;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-semibolditalic-webfont.eot');
    src: url('fonts/metropolis/metropolis-semibolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-semibolditalic-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-semibolditalic-webfont.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-bold-webfont.eot');
    src: url('fonts/metropolis/metropolis-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-bold-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-bold-webfont.woff') format('woff');
    font-weight: 700;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-bolditalic-webfont.eot');
    src: url('fonts/metropolis/metropolis-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-bolditalic-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-bolditalic-webfont.woff') format('woff');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-extrabold-webfont.eot');
    src: url('fonts/metropolis/metropolis-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-extrabold-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-extrabold-webfont.woff') format('woff');
    font-weight: 800;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-extrabolditalic-webfont.eot');
    src: url('fonts/metropolis/metropolis-extrabolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-extrabolditalic-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-extrabolditalic-webfont.woff') format('woff');
    font-weight: 800;
    font-style: italic;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-black-webfont.eot');
    src: url('fonts/metropolis/metropolis-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-black-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-black-webfont.woff') format('woff');
    font-weight: 900;
    font-display: swap;
}
@font-face{
    font-family: 'Metropolis';
    src: url('fonts/metropolis/metropolis-blackitalic-webfont.eot');
    src: url('fonts/metropolis/metropolis-blackitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/metropolis/metropolis-blackitalic-webfont.woff2') format('woff2'),
         url('fonts/metropolis/metropolis-blackitalic-webfont.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

.owl-carousel .owl-controls .owl-buttons .owl-prev:before {
   content: '\e8a7';
}

.owl-carousel .owl-controls .owl-buttons .owl-next:before {
   content: '\e8a8';
}

/*
 * Booking Engine Dropdown Widget Styles
 */
#reservation-widget {
    position: fixed;
    z-index: 99999999;
    top: 103px;
    width: 100%;
    display: none;
}

#reservation-widget-wrap {
    position: relative;
    max-width: 65em;
    margin: 0 auto;
}

#reservation-widget-content {
    position: absolute;
    right: 24px;
    padding: 22px 25px 23px;
    background-color: rgba(81,93,105,0.95);
    display: none;
    height: 0;
    opacity: 0;
}

#reservation-widget-content:before {
    content: "";
    position: absolute;
    top: -26px;
    right: 57px;
    width: 0;
    height: 0;
    border: 13px solid rgb(81,93,105);
    border: 13px solid rgba(81,93,105,0.95);
    border-left-color: transparent;
    border-right-color: transparent;
    border-top-color: transparent;
}

#reservation-widget-content a.close {
    display: block;
    width: 44px;
    height: 44px;
    text-align: center;
    line-height: 44px;
    float: right;
    margin-top: -25px;
    margin-right: -25px;
    color: #fff !important;
}

#reservation-widget-content form {
    margin-bottom: 0;
}

#reservation-widget-content #check-out-wrap,
#reservation-widget-content #rooms-wrap,
#reservation-widget-content #adults-wrap,
#reservation-widget-content #children-wrap {
    margin-top: 15px;
}

#reservation-widget-content #check-in-wrap {
    margin-top: 0;
}

#reservation-widget-content .caption {
    color: #fff;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 600;
    display: block;
}

#reservation-widget-content input:not([type="submit"]) {
    border-radius: 0;
    padding: 10px;
    font-size: 16px;
    width: 251px;
    border: 1px solid #dedede;
}

#reservation-widget-wrap #check-in-wrap,
#reservation-widget-wrap #check-out-wrap {
    position: relative;
}

#reservation-widget-wrap #check-in-wrap input,
#reservation-widget-wrap #check-out-wrap input {
    padding: 10px 40px 10px 10px;
}

#reservation-widget-wrap #check-in-wrap:after,
#reservation-widget-wrap #check-out-wrap:after {
    content: '\f133';
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 11px;
    font-family: 'FontAwesome';
    font-size: 20px;
    line-height: 1;
    color: #e8c48a;
    pointer-events: none;
}

#reservation-widget-content #rooms-wrap,
#reservation-widget-content #adults-wrap,
#reservation-widget-content #children-wrap {
    float: left;
    position: relative;
    width: 75px;
}

#reservation-widget-content #rooms-wrap,
#reservation-widget-content #adults-wrap {
    margin-right: 13px;
}

#reservation-widget-content select {
    height: 39px;
    width: 100%;
    padding: 6px 15px;
    border-radius: 0;
    border: 1px solid #dedede;
    -moz-appearance: none;
    -moz-border-radius: 0px;
    -webkit-appearance: none;
    -webkit-border-radius: 0px;
}

#reservation-widget-content #rooms-wrap:after,
#reservation-widget-content #adults-wrap:after,
#reservation-widget-content #children-wrap:after {
    content: '\f0d7';
    position: absolute;
    bottom: 9px;
    right: 9px;
    font-family: 'FontAwesome';
    font-size: 20px;
    line-height: 1;
    color: rgb(81,81,81);
    pointer-events: none;
}

#reservation-widget-content #submit-wrap {
    text-align: center;
    clear: both;
}

#reservation-widget-content #submit-button,
#reservation-widget-content #submit-button:active,
#reservation-widget-content #submit-button:visited {
    border-color: #67A5BF;
    color: #fff;
    margin-top: 26px;
    background-color: #67A5BF;
    text-transform: uppercase;
    font-weight: 600;
    border-radius: 0;
    padding: 13px 18px;
    font-size: 16px;
}

#reservation-widget-content #submit-button:focus,
#reservation-widget-content #submit-button:hover {
    background-color: #80CCEE;
    border-color: #80CCEE;
}

#ui-datepicker-div {
    width: 15em;
    box-shadow: 0 0 6px rgba(0,0,0,0.3);
    position: absolute !important;
    /*left: auto !important;*/
    background-color: #fdf7ef;
    border-color: #fdf7ef;
    font-family: 'Open Sans', Verdana, Arial, sans-serif;
}

/*#ui-datepicker-div:before {
    position: absolute;
    top: -8px;
    right: 13px;
    width: 13px;
    height: 13px;
    background: #fdf7ef;
    border: 1px solid #dedede;
    border-left: none;
    border-bottom: none;
    -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
}*/

#ui-datepicker-div .ui-datepicker-header {
    /*border-color: #fdf7ef;
    background-color: #fdf7ef;
    color: #515d69;*/
    text-transform: uppercase;
    /*font-weight: 600;*/
}

#ui-datepicker-div .ui-datepicker-prev,
#ui-datepicker-div .ui-datepicker-next {
    top: 1px;
}

#ui-datepicker-div .ui-datepicker-next {
    right: 1px;
}

#ui-datepicker-div .ui-datepicker-prev {
    left: 1px;
}

#ui-datepicker-div .ui-datepicker-prev span, 
#ui-datepicker-div .ui-datepicker-next span {
    margin-left: -6px;
    margin-top: -11px;
    background-image: none;
    text-indent: 0;
}

#ui-datepicker-div .ui-datepicker-next span {
    margin-left: 0;
    left: auto;
    right: 50%;
    margin-right: -6px;
}

#ui-datepicker-div th {
    text-align: center;
}

#ui-datepicker-div td {
    border: 0;
    padding: 0;
}

#ui-datepicker-div td a,
#ui-datepicker-div td span {
    text-align: center;
    padding: 0;
    height: 36px;
    line-height: 36px;
}

/*#ui-datepicker-div .ui-state-hover {
    border-color: #f4ebe1;
    background: #f4ebe1;
    color: #444;
}*/

#ui-datepicker-div .ui-state-checkin {
    border-color: #515d69;
    background: #515d69;
    color: #fff; 
}

/*#ui-datepicker-div .ui-state-active {
    border-color: #515d69;
    background: #515d69;
    color: #fff;
}

#ui-datepicker-div .ui-state-highlight {
    border-color: #f4ebe1;
    background: #f4ebe1;
    color: #444;
}*/

/* 
 * GLOBAL STYLES 
 */

#skip-nav-link.sr-only-focusable:active, #skip-nav-link.sr-only-focusable:focus,
#skip-ada-link.sr-only-focusable:active, #skip-ada-link.sr-only-focusable:focus {
   color: #000;
   position: absolute;
   z-index: 9999999;
   font-weight: 400;
}

#body:focus { 
   outline: none; 
}

body {
   /* Montserrat first: Open Sans is not loaded anywhere on the site, so the original
      stack fell straight through to Verdana. The correct font is Montserrat (Domine for
      headings), which is already what the Elementor kit delivers to widgets -- the body
      was diverging from the site itself. */
   font-family: Montserrat, 'Open Sans', Verdana, Arial, sans-serif !important;
   font-weight: 300;
}

#top-banner {
    min-height: 200px !important;
    max-height: 800px !important;
    height: 100vh;
}

#top-banner .bread-crumbs {
   right: auto;
   left: 0;
   margin: 0;
}

#container #top-banner .bread-crumbs a, #top-banner .bread-crumbs span {
   font-size: 12px;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 1px;
}

#container #top-banner .bread-crumbs a {
   color: #515d69 !important;
}

#container #top-banner .bread-crumbs span {
   color: #ecca82 !important;
}

#container #top-banner .bread-crumbs li:not(:last-child):after {
   content: "|";
}

h1,h2,h3,h4,h5,h6 {
   /*font-weight: bold !important;*/
   text-transform: uppercase;
   letter-spacing: 1px;
}

h1 {
	/*
    font-size: 1.3em !important;
    line-height: 1.3 !important;
	*/
	font-weight: 500 !important;
}

h3 {
   font-size: 2em;
   margin: 0 0 15px;
   line-height: 1.3;
   font-weight: 300 !important;
}

h2 {
   font-size: 2em;
   margin: 0 0 15px;
   line-height: 1.3;
   font-weight: 300 !important;
}

h4 {
   font-size: 1.3em;
   margin: 0 0 4%;
   line-height: 1;
   font-weight: 700 !important;
}

h5 {
   font-weight: 800 !important;
}

@media screen and (max-width: 450px) {
   h2 {
      line-height: 1.2;
   }
}

sup {
   font-size: 1.3em;
   top: 0;
}

/*.cv-header-stack i {
   color: #e8c48b !important;
}*/

.quote-block {
   position: relative;
}

.quote-block:before,
.quote-block:after {
   content: '';
   height: 25px;
   width: 35px;
   background-size: contain;
   background-repeat: no-repeat;
   position: absolute;
   top: 0;
   left: -42px;
}

.quote-block:after {
   top: auto;
   bottom: 0;
   left: auto;
   right: -42px;
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   -o-transform: rotate(180deg);
   transform: rotate(180deg);
}

@media screen and (min-width: 640px) {
   .quote-block:after {
      right: -25px;
   }
}

#header.transparency-active {
    border-bottom: 1px solid transparent !important;
}

#header.transparency-active #primary-navigation {
   text-shadow: none !important;
}

#header.transparency-active.is-transparent,
#header.transparency-active.is-transparent .dropdown-menu ul.sub-menu a {
   background: rgba(221,221,221,0.7) !important;
}

#header.transparency-active,
#header.transparency-active .dropdown-menu ul.sub-menu a {
   background: rgba(221,221,221,0.9) !important;
}

#header.transparency-active.is-transparent .navigation-container > nav > ul > li > a:hover,
#header.transparency-active.is-transparent .navigation-container > nav > ul > li > a:focus {
    color: #515d69 !important;
}

#header.transparency-active.is-transparent .dropdown-menu ul.sub-menu li:first-child {
    border-top: 1px solid rgba(221,221,221,0.7);
}

#header.transparency-active .dropdown-menu ul.sub-menu li:first-child {
    border-top: 1px solid rgba(221,221,221,0.9);
}

#header.transparency-active.is-transparent .dropdown-menu ul.sub-menu a {
    border: 1px solid transparent;
}

#header #primary-menu .dropdown-menu ul.sub-menu a:hover,
#header #primary-menu .dropdown-menu ul.sub-menu a:focus {
    color: #515d69 !important;
}

#header #primary-navigation .primary-menu a,
#header #primary-navigation .primary-tools a,
#header #primary-navigation .primary-social a {
    font-family: 'Metropolis', 'Open Sans', Verdana, Arial, sans-serif;
    font-weight: 500;
    font-size: .85em !important;
    text-transform: uppercase;
}

#header .navigation-container .primary-tools>a {
   font-size: 18px !important;
}

#header .navigation-container #primary-menu .dropdown-menu>li>a {
   padding-left: 10px;
   padding-right: 10px;
}

#header .navigation-container #primary-menu .dropdown-menu>li:nth-last-child(2)>a  {
   margin-right: 10px;
}

#header #primary-navigation .reservation-button {
   background-color: #AE5F47;
}

#header #primary-navigation .reservation-button>a {
   padding-left: 16px !important;
   padding-right: 16px !important;
   color: #ffffff;
}

#header div#reservation-button{
   width: 140px;
   height: 51px;
   top: 0;
   right: 20px;
   position: fixed;
   z-index: 150;
   background-color: #AE5F47;
}

#header a.res-button-link {
   display: block;
   text-align: center;
   height: 51px;
   line-height: 50px;
   color: #ffffff;
   font-size: .85em;
   text-transform: uppercase;
   font-weight: 500;
}

@media screen and (min-width: 992px) {
   #header div#reservation-button{
      display: none;
   }

   #reservation-widget {
      display: block;
   }
}

@media screen and (min-width: 640px) and (max-width: 992px) {
   #header .wrap {
      position: relative;
   }

   #header div#reservation-button {
      height: 48px;
      width: 140px;
      top: 5px;
      right: 65px;
      position: absolute;
   }

    #header.is-transparent div#reservation-button {
        top: 19px;
    }

   #header a.res-button-link {
      height: auto;
      line-height: 48px;
   }
}

/*
#header .cv-logo {
   width: 270px;
}
*/

#header .cv-logo a {
   background-size: contain;
   /* width: 270px;*/
}

#body .ls-v5 .ls-nav-prev, 
#body .ls-v5 .ls-nav-next {
   top: 56%;
}

.ls-slide h1.ls-l {
    top: 50% !important;
    font-family: 'Petit Formal Script', 'Playfair Display', 'Lucida Bright', Georgia, serif !important;
    text-transform: none;
    text-shadow: 0 0 10px rgba(51,51,51,0.2);
    z-index: 5;
    letter-spacing: 0;
}

@media (max-width: 639px) {
    #body .ls-v5 .ls-nav-prev, 
    #body .ls-v5 .ls-nav-next {
        top: 62%;
    }
    
    .ls-slide h1.ls-l {
        top: 56% !important;
    }

    h1.ls-l.cv-fullwidth-slider-line {
        top:58% !important;
    }
}

.ls-wp-fullwidth-container .ls-inner {
    position: relative;
}
.ls-wp-fullwidth-container .ls-inner .ls-slide:after {
    content: "";
    width: 100%;
    height: 100%;
    top:0;
    left: 0;
    position: absolute;
    background: rgba(28,28,28,0.4);
    background: -moz-linear-gradient(left, rgba(28,28,28,0.7) 0%, rgba(40,40,40,0.15) 51%, rgba(51,51,51,0.4) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(28,28,28,0.7)), color-stop(51%, rgba(40,40,40,0.15)), color-stop(100%, rgba(51,51,51,0.4)));
    background: -webkit-linear-gradient(left, rgba(28,28,28,0.7) 0%, rgba(40,40,40,0.15) 51%, rgba(51,51,51,0.4) 100%);
    background: -o-linear-gradient(left, rgba(28,28,28,0.7) 0%, rgba(40,40,40,0.15) 51%, rgba(51,51,51,0.4) 100%);
    background: -ms-linear-gradient(left, rgba(28,28,28,0.7) 0%, rgba(40,40,40,0.15) 51%, rgba(51,51,51,0.4) 100%);
    background: linear-gradient(to right, rgba(28,28,28,0.7) 0%, rgba(40,40,40,0.15) 51%, rgba(51,51,51,0.4) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c1c1c', endColorstr='#333333', GradientType=1 );
}

.ls-wp-fullwidth-container .ls-inner .ls-slide img {
    object-fit: cover;
    font-family: 'object-fit: cover;'; /* object fit polyfill */
}

.cv-fullwidth-slider,
.cv-fullwidth-slider .cv-wrap-wrapper {
   max-height: 425px !important;
   min-height: 200px;
}

.cv-fullwidth-slider .slick-list,
.cv-fullwidth-slider .slick-track {
   height: 100%;
}

@media (min-width: 640px) {
   .cv-fullwidth-slider,
   .cv-fullwidth-slider .cv-wrap-wrapper {
      max-height: 600px !important;
   }
}

@media (min-width: 1300px) {
   .cv-fullwidth-slider,
   .cv-fullwidth-slider .cv-wrap-wrapper {
      max-height: 800px !important;
   }
}

#hotel-details-section {
   background-position: center 7% !important;
   font-size: 1.2em;
   text-transform: uppercase;
   line-height: 1.4;
}

#hotel-details-section .wrap {
   padding: 0 2em;
}

@media screen and (max-width: 799px) {
   #hotel-details-section .column-inner>p {
      margin-bottom: 40px;
   }
}

@media screen and (min-width: 800px) {
   #hotel-details-section .column-inner {
      padding-left: 15px;
      padding-right: 15px;
   }
}

#hotel-details-section span.first-line {
   font-size: 1.3em;
}

#intro-section p {
   font-size: 1.2em;
   line-height: 1.6;
}

#intro-section h2 {
   line-height: 1.3;
}

@media screen and (min-width: 640px) {
   #intro-section .wrap {
      padding: 0 5em;
   }
}

#intro-section .cv-social-group {
   width: 200px;
   margin: 30px auto 0;
}

#intro-section .cv-social-group .social-profile {
   padding: 0 !important;
}

#intro-section .cv-social-group .social-profile p {
   border: 1px solid #ecca82;
   border-radius: 50%;
   width: 50px;
   height: 50px;
   margin: 0 auto;
}

#intro-section .cv-social-group .social-profile p>a {
   line-height: 50px;
} 

#intro-section .cv-social-group .social-profile .icon-instagram:before {
   font-size: 1.13em;
}

#testimonial-section p {
   font-size: 1.1em;
   line-height: 1.6;
}

#testimonial-section a,
#testimonial-section a:active,
#testimonial-section a:visited {
   font-weight: bold;
   color: #444;
   font-style: italic;
   border-bottom: 1px solid #bbb;
}

#testimonial-section a:focus,
#testimonial-section a:hover {
   color: #e8c58d;
   border-bottom-color: #e8c58d;
} 

#eat-section-full-width-image .cv-wrap-wrapper {
   padding-top: 9.5em;
   padding-bottom: 9.5em;
}

#eat-section-full-width-image p {
   font-size: 2em;
   font-weight: bold;
   color: #fff;
   text-shadow: 0 0 10px #444;
}

#eat-section-full-width-image em {
   color: #fff;
}

@media (min-width: 40em) {
   #eat-section-content .flag-media {
      width: 45%;
   }
   #eat-section-content .flag-content {
      width: 55%;
      padding: 3em;
      float: left;
   }
}

#eat-section-content .flag-content {
   color: #fff;
   max-width: 590px;
}

#eat-section-content .flag-content p:last-of-type {
   margin-bottom: 0;
}

#eat-section-content .flag-media-inner {
   background-size: cover;
}

#eat-section-content .flag-media-inner img {
   display: none;
}

@media (max-width: 639px) {
   #eat-section-content .flag-content {
      padding: 1.5em .7em 2.2em;
      text-align: center;
   }

   #eat-section-content .flag-content .cv-header-stack {
      text-align: center !important;
   }
}

#body .owl-carousel .item img {
   display: block;
}

#body .owl-item .owl-carousel-item-imgoverlay {
   opacity: 1;
   background-color: transparent;
   position: static;
   text-align: left;
   text-shadow: none;
   color: #444;
   font-family: 'Metropolis', 'Open Sans', Verdana, Arial, sans-serif;
   padding: 10px 15px 0;
}

#body .owl-item .owl-carousel-item-imgoverlay .owl-carousel-item-imgtitle {
   font-size: 13px;
   font-weight: bold;
   text-transform: uppercase;
   letter-spacing: 1px;
}

#body .owl-item .owl-carousel-item-imgoverlay .room-description {
   font-size: 13px;
   margin-bottom: 5px;
}

#body .owl-item .owl-carousel-item-imgoverlay .room-link a {
   font-size: 14px;
   font-weight: bold;
   text-transform: uppercase;
   font-style: italic;
   border-bottom: 1px solid;
}

#body .owl-carousel .item:hover .owl-carousel-item-imgoverlay {
   background-color: transparent;
}

#body .owl-carousel .owl-controls {
   margin-top: 0;
   position: absolute;
   top: 30%;
   width: 100%;
   height: 0;
}

#body .owl-carousel .owl-controls .owl-buttons div {
   border-radius: 50%;
   background-color: rgb(0,0,0);
   background-color: rgba(0,0,0,0.5);
   opacity: 1;
   width: 45px;
   height: 45px;
   line-height: 45px;
   font-size: 0;
}

#body .owl-carousel .owl-controls .owl-buttons div:hover,
#body .owl-carousel .owl-controls .owl-buttons div:focus {
   background-color: rgb(0,0,0);
}

#body .owl-carousel .owl-controls .owl-buttons div:before {
   font-family: "theme-icons";
   color: #ecca82;
   font-size: 23px;
}

#body .owl-carousel .owl-controls .owl-buttons .owl-prev {
   float: left;
   padding: 2px 13px 2px 10px;
}

#body .owl-carousel .owl-controls .owl-buttons .owl-next {
   float: right;
   padding: 2px 10px 2px 13px;
}

#callout-links-section .wrap {
   padding: 0 2em;
}

@media (min-width: 500px) {
   #callout-links-section .wrap {
      padding: 0 7em;
   }
}

#callout-links-section .column-inner .cv-user-image-wrap {
   padding: 0 20px;
}

#callout-links-section .column-inner p {
   text-align: center;
   font-size: 14px;
   line-height: 1.4;
   padding-top: 20px;
   margin-bottom: 0;
}

#callout-links-section .column-inner p a,
#callout-links-section .column-inner p a:active,
#callout-links-section .column-inner p a:visited,
#callout-links-section .column-inner p a:focus,
#callout-links-section .column-inner p a:hover {
   color: #fff;
}

#social-section .cv-gallery {
   margin-left: -2.5% !important;
   margin-right: 0 !important;
   margin-bottom: 0 !important;
}

#social-section .cv-gallery > div {
   width: 47.5% !important;
   margin: 0 0 2.5% 2.5% !important;
   padding: 0 !important;
}

#social-section .jr-insta-thumb {
    padding-bottom: 10%;
}

#social-section .jr-insta-thumb ul {
    text-align: center;
    margin-left: 0;
    margin-bottom: -1px;
}

#social-section .jr-insta-thumb li {
    width: auto !important;
    margin: 0 10% 5%;
    overflow: hidden;
}

@media (min-width: 640px) {
    #social-section .jr-insta-thumb {
        padding-bottom: 0;
    }

    #social-section .jr-insta-thumb li {
        width: 20% !important;
        margin: 0;
        position: relative;
    }

    #social-section .jr-insta-thumb li a img {
        -webkit-transition: all .5s ease-in-out;
           -moz-transition: all .5s ease-in-out;
            -ms-transition: all .5s ease-in-out;
             -o-transition: all .5s ease-in-out;
                transition: all .5s ease-in-out;
    }
    
    #social-section .jr-insta-thumb li:hover a img {
        opacity: 0.8;
        -webkit-transform: scale(1.2);
           -moz-transform: scale(1.2);
            -ms-transform: scale(1.2);
             -o-transform: scale(1.2);
                transform: scale(1.2);
    }
}

/* HOME PAGE - ALTERNATING TILE LAYOUT STYLES */

#alternating-parallax-content-section {
    background-attachment: fixed !important;
}

#alternating-parallax-content-section .content-section-detail .cv-column-row {
    margin: 0;
}

#alternating-parallax-content-section .content-section-detail .cv-column-row:nth-of-type(odd) > div:first-of-type,
#alternating-parallax-content-section .content-section-detail .cv-column-row:nth-of-type(even) > div:last-of-type {
    background: #fff;
    text-align: center;
    padding: 60px 30px 40px;
    margin-bottom: 350px;
}

#alternating-parallax-content-section--mobile .content-section-detail .cv-content-row {
    background: #fff;
    text-align: center;
    padding-bottom: 40px;
}

#alternating-parallax-content-section--mobile .content-section-detail .cv-content-row .cv-user-image-wrap {
    height: 240px;
}

#alternating-parallax-content-section--mobile .content-section-detail .cv-content-row .cv-header-stack {
    padding: 60px 30px 0;
}

#alternating-parallax-content-section .content-section-detail .cv-column-row h2,
#alternating-parallax-content-section--mobile .content-section-detail .cv-content-row .cv-header-stack h2 {
    margin-bottom: 14px;
    line-height: 0;
    color: rgba(51,51,51,0.15);
    /*font-weight: 800 !important;*/
    font-family: 'Petit Formal Script', 'Playfair Display', 'Lucida Bright', Georgia, serif !important;
    text-transform: none;
    letter-spacing: 0;
    font-size: 65px !important;
}

#alternating-parallax-content-section .content-section-detail .cv-column-row h3,
#alternating-parallax-content-section--mobile .content-section-detail .cv-content-row .cv-header-stack h3 {
    font-size: 24px !important;
}

#alternating-parallax-content-section--mobile .content-section-detail .cv-content-row > p {
    padding: 0 30px;
}

#alternating-parallax-content-section .content-section-detail .cv-column-row .button.is-ghost,
#alternating-parallax-content-section--mobile .content-section-detail .cv-content-row .button.is-ghost {
    background-color: transparent;
    border: 1px solid rgba(51,51,51,0.6);
    color: rgb(51,51,51);
    border-radius: 0;
    font-family: 'Playfair Display', 'Lucida Bright', Georgia, serif !important;
    font-size: 18px;
    /*font-style: italic;*/
    padding: 0.75em 1.5em;
    -webkit-transition: all .4s ease-in-out;
       -moz-transition: all .4s ease-in-out;
        -ms-transition: all .4s ease-in-out;
         -o-transition: all .4s ease-in-out;
            transition: all .4s ease-in-out;
}

#alternating-parallax-content-section .content-section-detail .cv-column-row .button.is-ghost:hover,
#alternating-parallax-content-section--mobile .content-section-detail .cv-content-row .button.is-ghost:hover {
    background-color: rgba(51,51,51,0.6);
    color: #fff;
}

@media (min-width: 580px) {
    #alternating-parallax-content-section--mobile .content-section-detail .cv-content-row .cv-user-image-wrap {
        height: 48vw;
    }
}

@media (min-width: 768px) {
    #alternating-parallax-content-section .content-section-detail .cv-column-row:nth-of-type(odd) > div:first-of-type,
    #alternating-parallax-content-section .content-section-detail .cv-column-row:nth-of-type(even) > div:last-of-type {
        padding: 80px 50px 60px;
    }
}

@media (min-width: 991px) {
    #alternating-parallax-content-section .content-section-detail .cv-column-row:nth-of-type(odd) > div:first-of-type,
    #alternating-parallax-content-section .content-section-detail .cv-column-row:nth-of-type(even) > div:last-of-type {
        padding: 90px 100px 70px;
    }

    #alternating-parallax-content-section .content-section-detail .cv-column-row h2 {
        font-size: 80px !important;
    }
}

@media (min-width: 1200px) {
    #alternating-parallax-content-section .content-section-detail .cv-column-row:nth-of-type(odd) > div:first-of-type,
    #alternating-parallax-content-section .content-section-detail .cv-column-row:nth-of-type(even) > div:last-of-type {
        padding: 8% 11% 7%;
    }

    #alternating-parallax-content-section .content-section-detail .cv-column-row h3 {
        font-size: 30px !important;
    }
}

/* IMAGE TILE IN COLUMNS LAYOUT STYLES */

#image-tile-columns-layout .cv-user-image-wrap {
    height: 200px;
}

#image-tile-columns-layout .column-inner {
    position: relative;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

#image-tile-columns-layout .color-overlay {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: rgba(51,51,51,0.2);
    -webkit-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

#image-tile-columns-layout .tile-link:hover .color-overlay {
    background-color: rgba(51,51,51,0.4);
}

#image-tile-columns-layout .text-overlay {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 5;
    padding: 0 8%;
    background-color: transparent;
    color: #fff;
    width: 100%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

#image-tile-columns-layout .text-overlay .cv-header-stack {
    margin: 0;
}

#image-tile-columns-layout .text-overlay h4 {
    font-size: 26px !important;
    margin: 0;
    text-transform: uppercase;
    font-weight: 400 !important;
    color: #fff;
    letter-spacing: 2px;
    -webkit-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

#image-tile-columns-layout .tile-link:hover .text-overlay h4 {
    color: #ddd;
}

@media (min-width: 640px) {
    #image-tile-columns-layout .cv-user-image-wrap {
        height: 420px;
    }
}

@media (min-width: 800px) {
    #image-tile-columns-layout .cv-user-image-wrap {
        height: 500px;
    }

    #image-tile-columns-layout .text-overlay h4 {
        font-size: 18px !important;
    }
}

@media (min-width: 1024px) {
    #image-tile-columns-layout .cv-user-image-wrap {
        height: 588px;
    }

    #image-tile-columns-layout .text-overlay h4 {
        font-size: 24px !important;
    }
}


/* IMAGE TILE LAYOUT STYLES */

#image-tile-layout .wrap {
   padding-left: 0;
   padding-right: 0;
   max-width: 105em;
   position: relative;
}

#image-tile-layout .cv-user-image-wrap {
    height: 200px;
}

#image-tile-layout .column-inner {
    position: relative;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

#image-tile-layout .color-overlay {
    display: none;
}

#image-tile-layout .text-overlay {
    padding: 16px .8em 21px;
    text-align: center;
}

#image-tile-layout .text-overlay h2 {
    font-size: 18px !important;
    margin: 0;
}

#image-tile-layout.cv-content-section .tile-link:hover .text-overlay .button,
#image-tile-layout.cv-content-section .tile-link:focus .text-overlay .button {
    background-color: rgba(34,34,34,0.65);
}

#image-tile-layout .cv-content-row {
    position: relative;
}

#image-tile-layout .grid-item-sizer,
#image-tile-layout .grid-item {
    width: 100%;
}


@media (min-width: 640px) {
    #image-tile-layout .cv-user-image-wrap {
       height: 100%;
    }
    
    #image-tile-layout .color-overlay {
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        background-color: rgba(51,51,51,0.7);
    }

    #image-tile-layout .text-overlay {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 5;
        padding: 0 8%;
        background-color: transparent;
        color: #fff;
        width: 100%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    #image-tile-layout .text-overlay h2 {
        font-size: 20px !important;
        color: #fff;
        margin: inherit;
    }

    .no-js #image-tile-layout .column-inner {
        text-align: center;
    }

    .no-js #image-tile-layout .column-inner .button {
        display: none;
    }

    .no-js #image-tile-layout .cv-split-25-35>*:nth-child(1) .cv-user-image-wrap, 
    .no-js #image-tile-layout .cv-split-35-25>*:nth-child(2) .cv-user-image-wrap {
        height: 264px;
    }

    #image-tile-layout .grid-item {
        float: left;
        clear: none;
    }
}

@media (min-width: 640px) and (max-width: 768px) {
    #image-tile-layout .wrap {
        height: 240vw;
    }
    
    #image-tile-layout .grid-item-sizer,
    #image-tile-layout .grid-item {
        width: 50%;
    }

    #image-tile-layout .grid-item {
        height: 80vw;
    }

    #image-tile-layout .grid-item-3 {
        height: 40vw;
    }

    #image-tile-layout .grid-item-5 {
        position: absolute;
        top: 120vw;
        left: 0;
    }

    #image-tile-layout .grid-item-6 {
        position: absolute;
        top: 200vw;
        left: 0;
        height: 40vw;   
    }

    #image-tile-layout .grid-item-7 {
        position: absolute;
        top: 160vw;
        left: 50%;
    }
}

@media (min-width: 769px) {
    #image-tile-layout .wrap {
        height: 120vw;
    }

    #image-tile-layout .grid-item-sizer,
    #image-tile-layout .grid-item {
        width: 25%;
    }

    #image-tile-layout .grid-item {
        height: 40vw;
        float: left;
        clear: none;
    }

    #image-tile-layout .grid-item-3 {
        width: 50%;
    }

    #image-tile-layout .grid-item-6 {
        width: 50%;
        height: 80vw;
    }

    #image-tile-layout .grid-item-7 {
        position: absolute;
        top: 80vw;
        left: 0;
        width: 50%;
    }
}

@media (min-width: 991px) {
    #image-tile-layout .color-overlay {
        background-color: transparent;
        -webkit-transition: background-color .3s ease-in-out;
        -o-transition: background-color .3s ease-in-out;
        transition: background-color .3s ease-in-out;
    }

    #image-tile-layout .text-overlay {
        opacity: 0;
        -webkit-transition: opacity .3s ease-in-out;
        -o-transition: opacity .3s ease-in-out;
        transition: opacity .3s ease-in-out;
    }

    #image-tile-layout .text-overlay .cv-header-stack {
        position: relative;
        bottom: -25px;
        -webkit-transition: bottom .3s ease-in-out;
        -o-transition: bottom .3s ease-in-out;
        transition: bottom .3s ease-in-out;
    }

    #image-tile-layout .text-overlay p {
        position: relative;
        bottom: -15px;
        -webkit-transition: bottom .3s ease-in-out;
        -o-transition: bottom .3s ease-in-out;
        transition: bottom .3s ease-in-out;
    }

    #image-tile-layout .tile-link:hover .text-overlay .cv-header-stack,
    #image-tile-layout .tile-link:hover .text-overlay p {
        bottom: 0;
    }

    #image-tile-layout .tile-link:hover .text-overlay {
        opacity: 1;        
    }

    #image-tile-layout .tile-link:hover .color-overlay {
        background-color: rgba(51,51,51,0.7);
    }
}



/* INTERIOR PAGE STYLES */

#interior-intro-section .wrap {
   padding: 0 2em;
}

@media screen and (min-width: 705px) {
   #interior-intro-section .wrap {
      padding: 0 5em;
   }
}

#interior-intro-section p {
   text-align: center;
   color: #fff;
   font-size: 1.1em;
}

#interior-intro-section p:last-of-type {
   margin-bottom: 0;
}

.cv-toggle-group>.toggle>.toggle-title {
   font-size: 18px !important;
   padding: 10px 15px !important;
   color: #b86850;
   border: 1px solid #b86850;
}

/* EVENTS CALENDAR */
.single .cv-section-main .below-single-post {
   border-top: 0;
}

article.ai1ec_event .post-meta {
   display: none;
}

/* ROOMS PAGE */
/*@media screen and (max-width: 40em) {
   .page-id-12 .cv-section-main .cv-divider {
      margin: 42px 0 52px !important;
   }
}*/

.page-id-12 .cv-section-main.padding-top-more .cv-wrap-wrapper {
   padding-top: 95px;
}

#room-type-details .owl-item .owl-carousel-item-imgoverlay {
   display: none;
}

#room-type-details .owl-carousel .owl-controls {
   top: 50%;
   margin-top: -27px;
}

.page:not(.home) .cv-section-main h4 {
   text-transform: uppercase;
   font-size: 18px !important;
   margin-top: 15px;
   letter-spacing: 1px;
   line-height: 1.4;
}

#body .cv-section-main ul.bullets {
   padding-left: 0;
   margin: 0 0 1em;
   list-style: none;
}

#body .cv-section-main .content-section-detail ul.list-column-1 {
   margin-bottom: 0;
}

#body .cv-section-main ul.bullets li {
   font-weight: bold;
   letter-spacing: 1px;
   padding-left: 18px;
   text-indent: -19px;
   line-height: 1.5;
   margin-bottom: 5px;
}

.page-id-12 .cv-section-main .content-section-detail li:last-of-type {
   margin-bottom: 0;
}

#body .cv-section-main ul.bullets li:before {
   content: '•';
   color: #ecca82;
   padding-right: 6px;
   font-size: 1.4em;
   line-height: 1;
   vertical-align: middle;
}

.page-id-12 .cv-section-main .cv-split-2 > div:nth-of-type(2) {
   margin-bottom: 0;
}

.page-id-12 .cv-section-main .cv-split-2 > div:nth-of-type(2) .column-inner p:last-of-type {
   margin-bottom: 0;
}

@media screen and (min-width: 705px) {
   .page-id-12 .cv-section-main .cv-split-2 > div:nth-of-type(2) .column-inner {
      padding-left: 20px;
   }
}

.book-button {
   display: block;
   margin-top: 20px;
   text-transform: uppercase;
   font-weight: bold;
   width: 135px;
   height: 44px;
   text-align: center;
   background-color: #515d69;
   line-height: 44px;
   color: #fff !important;  
}

@media screen and (min-width: 900px) {
   .cv-section-main ul.list-column-1,
   .cv-section-main ul.list-column-2 {
      width: 50%;
      float: left;
   }

   .cv-section-main ul.list-column-1 {
      padding-right: 10px;
   }

   .cv-section-main ul.list-column-2 {
      padding-left: 10px;
   }
}

/*@media screen and (min-width: 1020px) {
   .page:not(.home) .cv-section-main .column-inner .cv-user-image-wrap {
      padding: 0 20px;
   }
}*/
#parent-block-grid .cv-user-image-link {
   position: relative;
   display: block;
}

#parent-block-grid .cv-user-image-link:hover:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(81,93,105,0.8);
}

#parent-block-grid .cv-user-image-link:hover:before {
   content: "Learn More";
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%);
   padding: 10px 15px;
   border: 1px solid #fff;
   color: #fff;
   text-transform: uppercase;
   z-index: 200;
   font-weight: 600;
   letter-spacing: 1px; 
}

@media screen and (min-width:800px) {
   #parent-block-grid .column-inner p:last-of-type {
      margin-bottom: 30px;
   }
}

/* ATTRACTIONS PAGE */


.page-id-13 #body .cv-section-main a,
.page-id-13 #body .cv-section-main a:active,
.page-id-13 #body .cv-section-main a:focus,
.page-id-13 #body .cv-section-main a:visited,
.page-id-13 #body .cv-section-main a:hover {
   color: #444;
   border-bottom: 1px solid;
}

/*.js.page-id-13 #body .section-main-container > .cv-section-main {
   background-color: transparent !important;
}

.no-js.page-id-13 #body > .cv-section-main {
   background-color: #515151 !important;
}*/

.page-id-13 .cv-section-main .column-inner .cv-header-stack {
   margin-bottom: 0;
}

.page-id-13 .cv-section-main .column-inner h4 {
   margin-top: 0;
}

.page-id-13 .cv-section-main .cv-column-row div:nth-of-type(2) {
   margin-bottom: 0;
}

#body .cv-section-main .content-section-detail ul h4 {
   margin: 0;
}

#body .cv-section-main .content-section-detail ul li.header:before {
   content: none;
}

#body .cv-section-main .content-section-detail ul li.header {
   padding: 0;
   text-indent: 0;
}

@media (max-width: 639px) {
   #col2-square-img-layout .cv-user-image-wrap {
      position: relative;
      height: 250px;
      overflow: hidden;      
   }

   #col2-square-img-layout .cv-user-image {
      position: absolute;
      top:-100%; 
      left:0; 
      right: 0; 
      bottom:-100%;
      margin: auto;
   }
} 

@media (min-width: 800px) {
   #col2-square-img-layout .cv-user-image-wrap {
      position: relative;
      height: 320px;
      overflow: hidden;      
   }

   #col2-square-img-layout .cv-user-image {
      position: absolute;
      top:-100%; 
      left:0; 
      right: 0; 
      bottom:-100%;
      margin: auto;
   }
} 

/*.section-main-container {
   background-image: url("/wp-content/uploads/2016/10/chicago-canal-skyline-blurred-darkened.jpg");
   background-size: cover;
   background-repeat: no-repeat;
}*/

.gm-style-iw h4,
.gm-style-iw p {
   margin: 0;
}

.gm-style-iw h4 {
   margin-bottom: 3px;
}

.gm-style-iw a {
   color: #444 !important;
}

/* CONTACT FORM STYLES */

#rfp .wpcf7-form,
#rfp .wpcf7-form p,
#rfp .wpcf7-form input,
#rfp .wpcf7-form textarea,
#rfp .wpcf7-form div,
#rfp .wpcf7-form legend,
#rfp .wpcf7-form label {
   font-family: 'Metropolis', 'Open Sans', Verdana, Arial, sans-serif;
}

#rfp .wpcf7-form legend {
   text-transform: uppercase;
   font-weight: bold;
   margin-top: 30px;
   margin-bottom: 10px;
   clear: both;
}

#rfp .wpcf7-form label {
   width: 100%;
   display: block;
}

#rfp .wpcf7-form .wpcf7-form-control:not(.wpcf7-submit) {
   padding: .5em;
   width: 100%;
}

#rfp .wpcf7-form select {
   height: 37px;
}

#rfp .wpcf7-form .required-text {
   font-size: 13px;
}

#rfp .wpcf7-form em {
   color: #c45c03;
   font-weight: bold;
}

#rfp .wpcf7-form input[type="date"] {
   height: 40px;
}

#rfp .wpcf7-form input.wpcf7-submit {
   width: 160px;
   background-color: #444;
   border-color: #444;
   font-weight: bold;
   font-size: 14px;
   color: #fff;
   -webkit-transition: color 0.3s ease, background 0.3s ease, border 0.3s ease;
   transition: color 0.3s ease, background 0.3s ease, border 0.3s ease; 
}

#rfp .wpcf7-form input.wpcf7-submit:hover,
#rfp .wpcf7-form input.wpcf7-submit:focus {
   background-color: #999;
   border-color: #999;
   color: #fff;
}

@media (min-width: 769px) {
   #rfp .wpcf7-form legend {    
      margin-right: 70%;
      float: right;
   }

   #rfp .wpcf7-form label {
      width: 30%;
      display: inline;
      float: left;
      text-align: right;
      margin-right: 10px;
      padding-top: 5px;
   }

   #rfp .wpcf7-form label.textarea-label {
      vertical-align: top;
   }
   
   #rfp .wpcf7-form .wpcf7-form-control:not(.wpcf7-submit) {
      width: 50%;
   }

   #rfp .wpcf7-form .submit-btn,
   #rfp .wpcf7-form .required-text,
   #rfp .wpcf7-form .wpcf7-response-output,
   #rfp .wpcf7-form .wpcf7-not-valid-tip {
      margin-left: 31%;
   }
}

@media (min-width: 960px) {
    #rfp .wpcf7-form .col-row {
        width: 100%;
        margin-left: -1%;
        clear: both;
    }

    #rfp .wpcf7-form .col-row > [class^="col-"] {
        float: left;
        padding-left: 1%;
        padding-right: 1%;
    }

    #rfp .wpcf7-form .col-1 {
        width: 8.333333333%;
    }

    #rfp .wpcf7-form .col-2 {
        width: 16.666666666%;
    }

    #rfp .wpcf7-form .col-3 {
        width: 24.999999999%;
    }

    #rfp .wpcf7-form .col-4 {
        width: 33.333333333%;
    }

    #rfp .wpcf7-form .col-5 {
        width: 41.666666666%;
    }

    #rfp .wpcf7-form .col-6 {
        width: 49.999999999%;
    }

    #rfp .wpcf7-form .col-7 {
        width: 58.333333333%;
    }

    #rfp .wpcf7-form .col-8 {
        width: 66.666666666%;
    }

    #rfp .wpcf7-form .col-9 {
        width: 74.999999999%;
    }

    #rfp .wpcf7-form .col-10 {
        width: 83.333333333%;
    }

    #rfp .wpcf7-form .col-11 {
        width: 91.666666666%;
    }

    #rfp .wpcf7-form .col-12 {
        width: 100%;
    }
}

/* EMAIL OFFERS SIGNUP FORM STYLES  */
.email-offers-form-container p {
    margin-bottom: 10px;
}

.email-offers-form-container p:last-of-type {
    margin: 0;
}

.wpcf7-form .email-offers-form-container input.wpcf7-form-control:not(.wpcf7-submit) {
    width: 100% !important;
    color: #333;
    background-color: #f9f9f9;
    padding: 8px 10px;
}

.email-offers-form-container .submit-btn {
    margin-bottom: 0;
    max-width: 150px;
    width: 100%;
}

.email-offers-form-container .submit-btn .wpcf7-submit {
    margin-bottom: 0;
    width: 100%;
    padding: 13px 0;
    border: 1px solid #fff;
    border-radius: 0;
    background-color: transparent;
    color: #fff;
    font-family: 'Playfair Display', 'Lucida Bright', Georgia, serif !important;
    font-weight: 700;
    font-size: 16px;
    /*font-style: italic;*/
    -webkit-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.email-offers-form-container .submit-btn .wpcf7-submit:hover,
.email-offers-form-container .submit-btn .wpcf7-submit:focus {
    background-color: #fff;
    color: #333;
}

.wpcf7 .email-offers-form-container h3 {
    font-family: 'Open Sans', Verdana, Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 500;
    letter-spacing: 1px;
}

.wpcf7 .email-offers-form-container label {
    text-align: left;
    text-transform: uppercase;
    font-size: 12px;
    color: #ccc;
}

.textwidget .email-offers-form-container img {
    width: auto;
}

.email-offers-form-container .name-wrapper,
.email-offers-form-container .email-wrapper {
    margin-bottom: 10px;
    width: 100%;
    max-width: 350px;
}

.consent-wrapper {
    margin-top: 10px;
    margin-bottom: 10px;
    clear: both;
    color: #fff !important;
    font-size: 11px;
    font-weight: 400;
    max-width: 350px;
    width: 100%;
}

.consent-wrapper a,
.consent-wrapper a:active,
.consent-wrapper a:visited {
    color: #bbbbbb !important;
}

.consent-wrapper a:focus,
.consent-wrapper a:hover {
    color: #fff !important;
}

.gdpr-email-consent .wpcf7-form-control {
    background-color: transparent !important;
}

.gdpr-email-consent .wpcf7-list-item {
    margin: 0;
}

.gdpr-email-consent label {
    text-transform: none !important;
}

.gdpr-email-consent input[type='checkbox'] {
    margin-right: 7px;
}

#footer .textwidget .wpcf7-form .wpcf7-response-output {
    clear: both;
    color: #eee;
    line-height: 1.3;
    font-size: 15px;
    text-transform: none;
    border: 1px solid #bbb;
    padding: 13px 15px;
    margin-top: 15px;
}

@media (min-width: 800px) {
    .email-offers-form-container .name-wrapper,
    .email-offers-form-container .email-wrapper {
        width: 49% !important;
        margin-right: 2%;
        float: left;
    }

    .email-offers-form-container .email-wrapper {
        margin-right: 0;
    }

    .consent-wrapper {
        margin-top: 0;
        float: left;
        width: 70%;
        margin-right: 5%;
    }

    .email-offers-form-container .submit-btn {
        margin-bottom: 0;
        width: 25%;
        float: left;
    }
}

/* SIDEBAR */

.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li {
    text-transform: uppercase;
    padding: 0.5em 0;
    line-height: 1.2;
    font-weight: bold;
    letter-spacing: 1px;
}

.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li a,
.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li a:active,
.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li a:visited {
    color: #444444 !important;
    font-size: 14px;
}

.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li a:focus,
.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li a:hover {
    color: #ecca82 !important;
}

.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li.current_page_item a,
.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li.current_page_item a:active,
.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li.current_page_item a:visited,
.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li.current_page_item a:focus,
.page .cv-content-section:not(#blog-index-section) .sidebar.content-section-sidebar .list-pages-shortcode li.current_page_item a:hover {
    color: #ecca82 !important;
    font-weight: bold;
    cursor: default;
}

/* FOOTER */

#footer .sidebar aside.widget {
   font-weight: 500;
   text-align: left;
   text-transform: uppercase;
   margin-bottom: 20px !important;
   font-size: .9em !important;
}

.wp-image-89214,
.wp-image-90366,
.widget .has-clearfix img {
    max-width: 160px !important;
}

#footer .sidebar aside.widget:nth-of-type(3) {
   margin: 10px auto 0 !important;
}

#footer .widget h3.widget-title {
   display: inline-block;
   margin: 4px 10px 4px 0 !important;
   font-size: 1em !important;
   font-family: 'Metropolis', 'Open Sans', Verdana, Arial, sans-serif !important;
   font-weight: 500;
   letter-spacing: 1px;
}

#footer .sidebar aside.widget a:hover,
#footer .sidebar aside.widget a:focus {
   color: #bbb;
}

#footer #menu-footer-navigation li a {
    letter-spacing: 1px;
}

#footer .widget ul.cv-social-profiles {
   display: inline-block;
   text-align: center; 
}

#footer .widget .social-profile {
   display: inline-block;
   margin: 0 10px 0 0 !important;
   width: 30px;
   height: 30px;
   border: 1px solid;
   line-height: 29px;
   border-radius: 50%;
}

#footer .widget .social-profile:last-of-type {
   margin-right: 0 !important;
}

#footer .widget .social-profile a {
   /*padding: 0 0 0 4px;*/
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
}

#footer .widget .social-profile a i {
    margin: 0;
    padding: 0;
}

#footer .widget .social-profile a i:before {
    margin: 0;
    display: initial;
}

#footer .widget .social-profile:hover {
   border-color: #bbb;
}

#footer .widget .social-profile a span {
   display: none;
}

@media screen and (max-width: 639px){
    .simple-banner {
        position: absolute;
    }
}

.sr-only {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px; }

.sr-only-focusable:active, .sr-only-focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto; }

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    position: absolute;
}

.ui-datepicker.ui-widget .ui-datepicker-next,
.ui-datepicker.ui-widget .ui-datepicker-prev {
    color: #fff !important;
    width: 30px;
    height: 30px;
    line-height: 30px;
    display: inline-block;
    text-align: center;
    border-radius: 33px;
    background: #ecfcff;
    transition: all .2s ease;
    font-family: dashicons;
    -webkit-font-smoothing: antialiased;
    font-style: normal;
    font-weight: 400;
    margin-top: 2px;
}

.ui-datepicker .ui-datepicker-prev:hover,
.ui-datepicker .ui-datepicker-next:hover {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    opacity: 0.75 !important;
}

#ui-datepicker-div .ui-datepicker-prev,
#ui-datepicker-div .ui-datepicker-next {
    top: 1px;
}

#ui-datepicker-div .ui-datepicker-next {
    right: 1px;
}

#ui-datepicker-div .ui-datepicker-prev {
    left: 1px;
}

.ui-datepicker .ui-datepicker-next:before {
    content: "\f345";
    display: block;
}

.ui-datepicker .ui-datepicker-prev:before {
    content: "\f341";
    display: block;
}

.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
    opacity: .35;
    filter: Alpha(Opacity=35);
    background-image: none;
}

.elementor-post__title a {
    color: #5a5a5a !important;
}

.grecaptcha-badge { 
    visibility: hidden !important;
}

.post.style-standard .post-featured-image img {
    height: auto;
}

#footer .widget select {
    background-color: white !important;
    padding: 8px 10px;
    display: block;
    height: 35px;
}

/* Video.js Background Video Overrides */
.bg-video-wrapper .video-js {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: transparent !important;
    pointer-events: none !important;
}

.bg-video-wrapper .video-js .vjs-tech {
    object-fit: cover !important;
    width: 100% !important;
    height: 100% !important;
}

/* Hide Video.js controls, big play button, and overlays for background video */
.bg-video-wrapper .video-js .vjs-big-play-button,
.bg-video-wrapper .video-js .vjs-control-bar,
.bg-video-wrapper .video-js .vjs-poster,
.bg-video-wrapper .video-js .vjs-loading-spinner,
.bg-video-wrapper .video-js .vjs-text-track-display,
.bg-video-wrapper .video-js .vjs-modal-dialog,
.bg-video-wrapper .video-js .vjs-error-display {
    display: none !important;
}

/* /recipes/ — Elementor tabs widget: remove active-tab border box to match production */
.chs-tab-container .elementor-tab-title.elementor-active,
.chs-tab-container .elementor-tab-title.elementor-active.elementor-tab-desktop-title {
    border: none !important;
    margin-bottom: 0 !important;
}
.chs-tab-container .elementor-tab-title.elementor-active::after,
.chs-tab-container .elementor-tab-title.elementor-active::before {
    display: none !important;
    content: '' !important;
}

/* ------------------------------------------------------------------------- *
 * MSPRET-8173: kill CLS from Elementor native section background videos.
 *
 * Elementor injects the background-video <iframe> client-side and sizes it in
 * JS after the video's metadata loads (default box -> computed cover, e.g.
 * 426x182 -> 936x400). The iframe is position:absolute + translate(-50%,-50%),
 * so growing repositions its own visible box -> a large layout shift (staging
 * mobile Lighthouse: 0.155 CLS, culprit .elementor-background-video-embed).
 *
 * Pin the iframe to a deterministic cover size in CSS so it is already at its
 * final dimensions at first layout — before Elementor's JS runs. !important
 * overrides the inline width/height Elementor writes (its inline styles carry
 * no !important), so the JS sizing becomes a no-op and the box never resizes:
 * no post-paint movement, no CLS. aspect-ratio 16/9 + min-width/height:100%
 * reproduces object-fit:cover (fills the section both ways, keeps ratio, clips
 * via the container's overflow:hidden) — visually identical to Elementor's own
 * cover, just computed by the browser instead of by JS.
 *
 * Scoped to the native background-video container only; the homepage hero's
 * HTML-widget poster+facade iframe (handled in perfmatters-config.php §11) is
 * not inside .elementor-background-video-container and is untouched.
 * ------------------------------------------------------------------------- */
.elementor-background-video-container .elementor-background-video-embed {
    aspect-ratio: 16 / 9;
    width: auto !important;
    height: auto !important;
    min-width: 100% !important;
    min-height: 100% !important;
    max-width: none !important;
}



/* ==================================================================
 * Elementor Theme Builder header/footer — parity with production.
 *
 * The values below are the ones MEASURED on https://www.castlehotsprings.com/
 * at 1280px, not approximations:
 *   #header        [0,0,1265,86]  bg #fff  border-bottom 1px  z-index 1000  position relative
 *   .header-logo a [57,0,250,85]  background-image, background-size contain
 *   .primary-menu  [517,0,692,0]  items Metropolis 13.6px/500 uppercase, padding 0 10px, line-height 85px
 *   .reservation-button [1073,0,136,86] bg #AE5F47, <a> padding 0 16px, color #fff
 *   #footer        [0,5310,1265,633] bg #252525 color #777, links #bbb
 *   footer columns [41,296] [337,296] [633,592]  (cv-split-14-14-12 = 25/25/50)
 *   footer menu items: padding 0.3125em 0
 *
 * Rules inherited from the camyno parent (style-responsive.css) and from the
 * cv-dynamic-stylesheet were translated to the Elementor DOM, since those files
 * disappear along with the theme.
 * ================================================================== */

.chs-header {
   height: 85px;
   line-height: 85px;
   background-color: #ffffff;
   color: #171717;
   border-bottom: 1px solid #ffffff;
   z-index: 1000;
   position: relative;
   box-sizing: content-box;
}

.chs-header > .e-con-inner {
   /* 1280px aligned with the kit and with the content containers.
      camyno used `.wrap { max-width: 75em; padding: 0 1.5em }` = a 1200 box with the
      content inset 24px. Keeping that inset here, the logo would sit 24px to the right
      of the left edge of the content sections, which have no horizontal padding.
      Zeroed so the three edges coincide. */
   max-width: 1280px;
   padding-left: 0;
   padding-right: 0;
   height: 85px;
   align-items: center;
}

/* Same width as the header and the content. In camyno the footer wrap measured 1184px
   (the 1152 .wrap plus the 1em negative margins of .cv-split-*.spacing-2); it is the
   columns that carry the 1em padding, so they keep their inner breathing room. */
.chs-footer > .e-con-inner {
   max-width: 1280px;
   /* Zero only the horizontal: in a boxed container Elementor applies the vertical
      padding (--padding-block-*) on THIS element, and a `padding: 0` here would wipe
      out the 56px top and bottom defined in the template. */
   padding-left: 0;
   padding-right: 0;
}

/* camyno used a background-image on a 250x85 block; Elementor's Image widget emits
   an <img>, so the same box is reproduced with object-fit. */
.chs-header .chs-header-logo,
.chs-header .chs-header-logo .elementor-widget-container,
.chs-header .chs-header-logo a {
   width: 250px;
   height: 85px;
   display: block;
}

.chs-header .chs-header-logo img {
   width: 250px;
   height: 85px;
   object-fit: contain;
   object-position: left center;
}

.chs-header .elementor-nav-menu--main > ul.elementor-nav-menu > li > a.elementor-item {
   font-family: 'Metropolis', 'Open Sans', Verdana, Arial, sans-serif;
   font-weight: 500;
   font-size: 13.6px;
   text-transform: uppercase;
   color: #171717;
   line-height: 85px;
   padding: 0 10px;
}

/* Reservations is menu item #51; that is why the in-room menus have no button.
   The selector must mirror the structure of the general rule above: with
   `.chs-header .elementor-nav-menu .reservation-button > a` (0,4,1) the 10px padding
   of the general rule (0,4,3) won and the button came out 12px narrower than production. */
.chs-header .elementor-nav-menu--main > ul.elementor-nav-menu > li.reservation-button {
   background-color: #AE5F47;
}

.chs-header .elementor-nav-menu--main > ul.elementor-nav-menu > li.reservation-button > a.elementor-item,
.chs-header .elementor-nav-menu--main > ul.elementor-nav-menu > li.reservation-button > a.elementor-item:hover,
.chs-header .elementor-nav-menu--main > ul.elementor-nav-menu > li.reservation-button > a.elementor-item:focus {
   padding: 0 16px;
   color: #ffffff;
}

/* camyno: #header .navigation-container .primary-menu.dropdown-menu > li { padding-bottom: 1px }
   -- it is what makes the <li> measure 86px while the <a> measures 85. */
.chs-header .elementor-nav-menu--main > ul.elementor-nav-menu > li {
   padding-bottom: 1px;
   box-sizing: content-box;
   transition: background .15s;
}

/* camyno: #header .navigation-container #primary-menu .dropdown-menu > li:nth-last-child(2) > a
   { margin-right: 10px } -- spaces off the last item before the Reservations button. */
.chs-header .elementor-nav-menu--main > ul.elementor-nav-menu > li:nth-last-child(2) > a.elementor-item {
   margin-right: 10px;
}

/* camyno: the top-level item's transition is background/color 0.15s. */
.chs-header .elementor-nav-menu--main > ul.elementor-nav-menu > li > a.elementor-item {
   transition: background .15s, color .15s;
}

/* Submenu. Measured on local camyno:
      ul   224px wide (14em on the 16px base), transparent background, shadow 0 3px 2px 2px
      a    Metropolis 13.6px/500, line-height 1.25 (=17px), padding 15px, white background,
           1px white side borders; the first <li> has a 1px #171717 top border and the
           last <a> a 1px white bottom border.
   Elementor delivers Roboto 13px/400 and an 8px left border, hence the divergence. */
.chs-header .elementor-nav-menu--main ul.sub-menu {
   /* !important is required here: SmartMenus (used by the Nav Menu widget) writes
      `width: auto; min-width: 10em; max-width: 1000px` INLINE when opening the submenu,
      and inline style beats the stylesheet. Without this the width becomes content-driven
      (~203px) instead of the 224px (14em) camyno applies to all submenus. */
   width: 224px !important;
   min-width: 224px !important;
   background-color: transparent;
   box-shadow: 0 3px 2px 2px rgba(0,0,0,0.05);
}

.chs-header .elementor-nav-menu--main ul.sub-menu > li > a.elementor-sub-item {
   font-family: 'Metropolis', 'Open Sans', Verdana, Arial, sans-serif;
   font-size: 13.6px;
   font-weight: 500;
   line-height: 1.25;
   padding: 15px;
   background: #ffffff;
   color: #171717;
   border-top: 0;
   border-bottom: 0;
   border-left: 1px solid #ffffff;
   border-right: 1px solid #ffffff;
   text-transform: uppercase;
   text-shadow: none;
   transition: color .25s, background .25s, padding .25s;
}

/* Sub-item hover. camyno:
      #header .navigation-container .primary-menu.dropdown-menu ul a:hover
         { padding: 15px 10px 15px 20px }        -- indents the text 5px, animated
      #header #primary-menu .dropdown-menu ul.sub-menu a:hover
         { color: rgb(81,93,105) !important }
      #header .primary-menu.dropdown-menu ul li:hover > a
         { background: #fff }                                                   */
.chs-header .elementor-nav-menu--main ul.sub-menu > li > a.elementor-sub-item:hover,
.chs-header .elementor-nav-menu--main ul.sub-menu > li > a.elementor-sub-item:focus,
.chs-header .elementor-nav-menu--main ul.sub-menu > li:hover > a.elementor-sub-item {
   padding: 15px 10px 15px 20px;
   background: #ffffff;
   color: #515D69;
}

.chs-header .elementor-nav-menu--main ul.sub-menu > li:first-child {
   border-top: 1px solid #171717;
}

.chs-header .elementor-nav-menu--main ul.sub-menu > li:last-child > a.elementor-sub-item {
   border-bottom: 1px solid #ffffff;
}

.chs-footer {
   background-color: #252525;
   color: #777777;
}

.chs-footer a {
   color: #bbbbbb;
}

.chs-footer h1, .chs-footer h2, .chs-footer h3,
.chs-footer h4, .chs-footer h5, .chs-footer h6 {
   color: #cccccc;
}

.chs-footer .chs-footer-nav ul.elementor-nav-menu > li > a.elementor-item {
   padding: 0.3125em 0;
   color: #bbbbbb;
   line-height: 1.7;
}

.chs-footer input,
.chs-footer select,
.chs-footer textarea {
   color: #757575;
   background: #1e1e1e;
   border: 1px solid #444444;
}

/* ------------------------------------------------------------------
 * Image sizing inherited from camyno (style-responsive.css).
 *
 * These two rules are the reason 14 homepage images render at 0x0 on
 * https://www.castlehotsprings.com/ : the lazy-load plugin swaps the src for an
 * SVG placeholder that only has a viewBox, and with width/height at auto the
 * intrinsic size resolves to zero. Without them Hello uses the markup's
 * width/height attributes and renders the image at natural size, which changes
 * the layout of several sections.
 *
 * Ported to keep parity with production. If the lazy-load is ever fixed,
 * removing these rules will make the images appear.
 * ------------------------------------------------------------------ */

img {
   max-width: 100%;
}

/* camyno's `width: auto` rule for <img> with a `width` attribute was REMOVED.
 *
 * It came from the parent theme's style-responsive.css and overrode the HTML attribute. On an
 * already-loaded image that is harmless -- `auto` gives the natural size, same as the attribute.
 * On an image NOT yet loaded there is no intrinsic size, and then `auto` resolves to the parent
 * block's width: on /wellness-protocols-during-stay/ a 200x200 logo occupied 1280x1280 and the
 * page came out 893px taller than production. In production the same rule exists and does no
 * harm because the image loads before measurement.
 *
 * Without it the attribute counts again, and `max-width: 100%` with `height: auto` keeps
 * handling responsiveness -- only now the box is reserved before the image arrives, which also
 * avoids CLS. Measured on removal: /wellness-protocols-during-stay/ +893 -> -360, /culinary/
 * -565 -> -324, home unchanged.
 *
 * The exception that existed here for the lazysizes placeholder went out with it: it was only
 * needed because `width: auto` zeroed the placeholder. With the attribute in effect, the
 * placeholder reserves the right box on its own. */
img.wp-post-image[height],
img[class*="attachment-"][height],
img[class*="wp-image-"][height] {
   height: auto;
}

/* The header logo is an <img> with a wp-image-* class, so the rules above would
   zero it too; the measured box (250x85) is reasserted here. */
.chs-header .chs-header-logo img {
   width: 250px;
   height: 85px;
}

/* ==================================================================
 * Typographic and layout base inherited from camyno.
 *
 * Extracted from style-responsive.css (parent theme) and from the
 * cv-dynamic-stylesheet, filtering only the rules that match elements OUTSIDE
 * #header/#footer on the home. Without them Hello applies its own base and
 * every text block changes height -- that is what produced -50px in several
 * sections and wrongly computed negative margins on widgets (the child uses
 * margins relative to this base).
 *
 * Rules whose markup no longer exists (camyno's overlay menu,
 * #cv-floating-anchor, .cv-content-section) were NOT ported.
 * ================================================================== */

body {
   margin: 0;
   line-height: 1.7;
   font-family: Raleway, sans-serif;
   -webkit-font-smoothing: antialiased;
   background: #252525;
}

* {
   box-sizing: border-box;
}

p {
   margin: 0 0 10px;
}

h1, h2, h3, h4, h5, h6 {
   margin: 5px 0;
}

h1 { font-size: 2.5em;  font-family: Raleway, sans-serif; font-weight: 300; }
h2 { font-size: 2.25em; font-family: Raleway, sans-serif; font-weight: 300; }
h3 { font-size: 2em;    font-family: Raleway, sans-serif; font-weight: 400; }
h4 { font-size: 1.75em; font-family: Raleway, sans-serif; font-weight: 400; }

b, strong { font-weight: 700; }

a {
   cursor: pointer;
   text-decoration: none;
   background: transparent;
}

.cv-user-font { font-size: 1em; }

/* Camyno painted the main content area white over a dark body; Hello has no #body. */
.site-main,
.elementor-location-single,
.hello-elementor-default {
   background: #ffffff;
}

/* Equivalent of camyno's .cv-section-main ("main" color scheme). */
.site-main {
   color: #222222;
}

.site-main h1, .site-main h2, .site-main h3,
.site-main h4, .site-main h5, .site-main h6,
.site-main strong {
   color: #000000;
}

.site-main a {
   color: #b7674f;
}

.button {
   display: inline-block;
   padding: 0.5em 0.75em;
   margin: 0.25em;
   border-style: solid;
   border-color: transparent;
   border-width: 1px !important;
   border-radius: 3px;
   font-weight: 400;
   font-size: 0.85em;
   transition: color .15s, background .15s, border .15s;
}

/* ------------------------------------------------------------------
 * Elementor footer -- translation of the camyno rules that target markup
 * that no longer exists (aside.widget, .cv-social-profiles, .social-profile).
 * Values measured on local camyno.
 * ------------------------------------------------------------------ */

/* camyno: #footer .sidebar aside.widget
      { font-weight:500; text-align:left; text-transform:uppercase; font-size:.9em; margin-bottom:20px } */
#footer .footer-column .elementor-widget {
   font-weight: 500;
   text-align: left;
   text-transform: uppercase;
   font-size: .9em;
   margin-bottom: 20px;
}

/* camyno: #footer .widget ol li, #footer .widget ul li { display:block; padding:0.3125em 0 }
   and #footer #menu-footer-navigation li a { letter-spacing:1px } */
#footer .chs-footer-nav ul.elementor-nav-menu > li {
   padding: 0.3125em 0;
}

#footer .chs-footer-nav ul.elementor-nav-menu > li > a.elementor-item {
   padding: 0;
   font-size: 1em;
   letter-spacing: 1px;
   line-height: 1.7;
   color: #bbbbbb;
}

/* Social icons. camyno renders hollow 30px circles with a 1px border in the current
   color and the text label hidden:
      #footer .widget .social-profile
         { display:inline-block; margin:0 10px 0 0; width:30px; height:30px;
           border:1px solid; line-height:29px; border-radius:50% }
      #footer .widget .social-profile a span { display:none }
      #footer .widget .social-profile:hover { border-color:#bbb }
   Elementor's Social Icons widget delivers 50px squares in the brand color
   (facebook #3B5998, instagram #262626, tripadvisor #589442), so all of that is overridden. */
#footer .chs-footer-social .elementor-grid {
   display: block;
}

#footer .chs-footer-social .elementor-grid-item {
   display: inline-block;
   margin: 0 10px 0 0;
}

#footer .chs-footer-social .elementor-grid-item:last-child {
   margin-right: 0;
}

#footer .chs-footer-social .elementor-social-icon {
   width: 30px;
   height: 30px;
   background-color: transparent;
   border: 1px solid currentColor;
   border-radius: 50%;
   color: #bbbbbb;
   line-height: 29px;
   font-size: 14.4px;
   padding: 0;
   margin: 0;
   display: flex;
   align-items: center;
   justify-content: center;
}

#footer .chs-footer-social .elementor-social-icon:hover {
   background-color: transparent;
   border-color: #bbbbbb;
}

#footer .chs-footer-social .elementor-social-icon svg,
#footer .chs-footer-social .elementor-social-icon i {
   width: 14px;
   height: 14px;
   font-size: 14px;
   fill: currentColor;
   color: currentColor;
}

/* Footer menu typography. Measured on camyno: Open Sans 14.4px with line-height
   24.48px (=1.7). Elementor's Nav Menu widget applies the kit's global font (Roboto),
   so the family has to be re-anchored to the body's.
   Careful: the 17px the <a> box measures in camyno is the height of the font's CONTENT
   (the <a> there is inline), not the line-height -- pinning 17px here flattened the 11 lines. */
#footer .chs-footer-nav ul.elementor-nav-menu > li > a.elementor-item {
   font-family: inherit;
   line-height: 1.7;
}

/* camyno shows the Relais & Chateaux seal at the column width (264px = 296 - 2x16),
   not at the thumbnail's natural size of 150px. */
#footer .footer-column1 .elementor-widget-image a,
#footer .footer-column1 .elementor-widget-image img {
   display: block;
   width: 100%;
   height: auto;
   max-width: 100%;
}

/* Form control normalize, inherited from camyno (style-responsive.css).
   Without `font: inherit` the browser applies its own default (16px) to <input>/<select>,
   instead of the 14.4px the footer widget defines -- which is what left the newsletter
   form fields 42px tall versus camyno's 35px, and the button 52 versus 47. */
button,
input,
optgroup,
select,
textarea {
   color: inherit;
   font: inherit;
   margin: 0;
}

/* camyno: `input { line-height: normal }`. Without it the `font: inherit` above makes the
   input inherit line-height 1.7 (24.48px), inflating the fields from 35 to 42px tall. */
input {
   line-height: normal;
}

/* Hello's reset flattens the line-height of <label>s; in camyno they inherit the body's 1.7
   (12px x 1.7 = 20.4px), which yields the 15px height measured on the form labels. */
#footer .wpcf7 label {
   line-height: 1.7;
}

/* camyno declares this AFTER the normalize above, restoring the breathing room between
   fields that `margin: 0` had zeroed. Without it the form fields sit glued together. */
input,
select,
textarea {
   margin: 0 0 1em;
}

/* Buttons inside loop items (blog cards).
 *
 * The template applies `margin-left: -24px` to the button's <a> on purpose: it cancels
 * Elementor's default side padding (24px) and leaves the TEXT flush with the card's margin,
 * aligned with the title and excerpt at x=20.
 *
 * The `.elementor-button { padding: 10px }` in the Customizer's Additional CSS breaks that
 * compensation -- 10px doesn't cancel 24px, and the "READ MORE" came out 14px left of the
 * title. In production this doesn't show because Perfmatters' RUCSS discards that rule on
 * the blog page; the template's original intent, however, is this. */
.e-loop-item .elementor-button {
   padding: 12px 24px;
}

/* ==================================================================
 * Toggles converted from camyno (Elementor Toggle widget).
 *
 * The Elementor 4.x Toggle exposes almost no style controls -- widget introspection
 * returns 11 controls, none for typography or spacing -- so the appearance comes from here.
 * Values measured from production's computed style on /faq/, not estimated.
 * ================================================================== */

.chs-cv-toggle .elementor-toggle-item {
   margin: 0 0 15px;
   border: 0;
}

.chs-cv-toggle .elementor-tab-title {
   padding: 10px 15px;
   background: transparent;
   color: #b86850;
   font-family: Montserrat, sans-serif;
   font-size: 18px;
   font-weight: 300;
   line-height: 23.4px;
   letter-spacing: 1px;
   text-transform: uppercase;
   /* production leaves the box open at the bottom while closed: 1px on top and on the
      sides, nothing at the bottom -- the bottom line only appears as the content's
      border-top when it opens */
   border: 1px solid #b86850;
   border-bottom: 0;
}

.chs-cv-toggle .elementor-toggle-icon {
   display: none;
}

.chs-cv-toggle .elementor-tab-content {
   padding: 15px;
   border: 0;
   border-top: 1px solid #b86850;
   color: #222222;
   /* Montserrat, not the Open Sans production renders here: the site's correct font is
      Montserrat with Domine for headings, and it is production that is serving the wrong one. */
   font-family: Montserrat, sans-serif;
   font-size: 16px;
   font-weight: 300;
   line-height: 27.2px;
}

/* ==================================================================
 * Horizontal clipping of the page.
 *
 * camyno wraps everything in a `div.wrap-all` with `overflow: hidden`, and that is what holds
 * the Elementor carousel arrows in: they sit at `right: -41px`, outside the container by
 * design, and in production reach x=1444 in a 1425 viewport without producing a scrollbar.
 * Hello has no equivalent wrapper, so on /blog/ 18px of horizontal scroll were left over.
 *
 * `clip` and not `hidden` on purpose: `hidden` would turn the body into a scroll container
 * and break the header's `position: sticky`. `clip` cuts without creating that context, and
 * leaves the vertical axis intact.
 *
 * The rule on the body alone was not enough: it clips what gets painted, but the root's
 * scrollable area was still 11px wider than the screen on desktop and 18px on mobile, and the
 * page genuinely scrolled -- `window.scrollX` reached those values on /blog/ and on
 * /new-stories-webpage-2026/, versus zero in production. No unclipped element crossed the
 * edge; it is the root's scrollable area that does not inherit the body's clip. Repeating it
 * on `html` zeroes both.
 * ================================================================== */

html {
   overflow-x: clip;
}

body {
   overflow-x: clip;
   overflow-y: visible;
}

/* ==================================================================
 * Search results (Archive Posts widget, classic skin).
 *
 * The widget exposes not a single typography control in this Elementor version --
 * introspection returns zero -- so the appearance comes from here, as with the toggles.
 * Values measured from production's computed style on /?s=spa: title Montserrat 36/46.8
 * weight 300, uppercase, 1px letter-spacing, black; meta at 16/27.2 weight 300 #222; 24px
 * between results. The meta family follows Montserrat, not the Open Sans of production's
 * computed style -- the wrong font there.
 * ================================================================== */

.search .elementor-widget-archive-posts .elementor-post {
   margin: 0 0 24px;
   padding: 0;
   border: 0;
}

.search .elementor-widget-archive-posts .elementor-post__title {
   margin: 0;
   font-family: Montserrat, sans-serif;
   font-size: 36px;
   font-weight: 300;
   line-height: 46.8px;
   letter-spacing: 1px;
   text-transform: uppercase;
}

.search .elementor-widget-archive-posts .elementor-post__title a {
   color: #000000;
}

.search .elementor-widget-archive-posts .elementor-post__meta-data {
   margin: 0;
   color: #222222;
   font-family: Montserrat, sans-serif;
   font-size: 16px;
   font-weight: 300;
   line-height: 27.2px;
}

/* ==================================================================
 * Posts widget cards: each card's "Read More" on the same line.
 *
 * The grid equalizes card heights, but inside each one the content only stacks top to
 * bottom. A two-line title pushes the link down, a one-line title lets it rise: measured,
 * 15px from the bottom versus 39px in the same block of six cards. It is what gives the
 * impression of inconsistent spacing in a grid whose cards are all 368px.
 *
 * The text block now grows with the card and the link gets `margin-top: auto`, so it sits
 * against the bottom regardless of how many lines the title takes.
 *
 * Applies to both skins in use. `classic` accounts for 102 of the widgets and `cards` for 2;
 * on `cards` the problem is bigger because the excerpt also varies in size -- there the
 * three cards measured 22, 43 and 45px from the bottom.
 * ================================================================== */

.elementor-posts--skin-classic .elementor-post__text,
.elementor-posts--skin-cards .elementor-post__text {
   display: flex;
   flex-direction: column;
   flex: 1 1 auto;
}

.elementor-posts--skin-classic .elementor-post__read-more,
.elementor-posts--skin-cards .elementor-post__read-more {
   margin-top: auto;
}

/* ==================================================================
 * /reserve/ -- reserves the booking engine's box before it mounts
 *
 * The revraise-plugin prints an empty `<booking-layout></booking-layout>` between the header
 * and the footer, and an Angular app hosted at newbooking.azds.com fills the tag later. An
 * unknown element is born `display: inline`, so until the bundle arrives -- measured at 2.6s
 * to 3.0s -- the tag occupies 0px and the footer sits right below the header, on screen.
 * When the app mounts, the footer drops all at once and that shift alone is worth 0.44 CLS.
 *
 * Production has exactly the same defect (0.4687 versus 0.4536 here), so this is not a
 * migration regression -- it is a fix that goes beyond what exists today.
 *
 * The mounted height varies too much to be pinned: 902px on desktop, 823px on tablet and
 * 1410px on mobile, and it also changes per step of the flow. 100vh matches none of them on
 * purpose -- it matches what matters, which is keeping the footer off screen before and
 * after the mount, and an off-screen shift does not score. On tablet about 200px of
 * breathing room is left above the footer; that is the price of 0.86 CLS leaving the page.
 *
 * `:empty` was tried first, so the reservation would hold only while the tag is empty, and
 * came out WORSE (0.86 versus 0.67 with nothing): Angular inserts a contentless
 * `<router-outlet>` before painting, so the tag stops matching `:empty` while still
 * measuring 0px. The box collapses and grows back 400ms later -- two shifts instead of one.
 *
 * If the third-party bundle never loads, the page is left with a screen's worth of blank
 * height. That is better than the footer glued to the header announcing the page is over.
 * ================================================================== */

booking-layout {
   display: block;
   min-height: 100vh;
}

/* ==================================================================
 * Typeform embed -- reserves the 500px before the script mounts the iframe
 *
 * The HTML widget prints an empty `<div data-tf-live="..."></div>` and Typeform's embed.js
 * replaces it with a 500px iframe, measured at 2.4s. Until then the div occupies 0px, so on
 * /contact-us/ the whole section is 56px and the footer sits on screen; when the form
 * mounts, everything drops 500px at once. It cost 0.30 CLS on desktop and 0.51 on mobile.
 *
 * The height is always 500px, not responsive: measured the same on desktop and mobile, here
 * and in production. So the reservation is exact and no space is left over once the iframe
 * comes in.
 *
 * Production has the same defect (0.2245 desktop / 0.3524 mobile). Four documents use the
 * embed: /contact-us/, /gatherings/, the groups page and the donation form.
 * ================================================================== */

[data-tf-live] {
   min-height: 500px;
}

/* ==================================================================
 * Gift Up embed -- reserves the 2000px iframe's box
 *
 * Same defect as the Typeform, at a bigger scale: `.gift-up-target` is born empty and
 * gift-up.js injects a 2000px iframe at 1.8s. The three gift card pages measure exactly
 * 2000, on desktop and mobile, so the reservation is exact.
 *
 * The reservation holds only while the box is empty, unlike booking-layout: Gift Up inserts
 * the iframe already with its height, in a single step, so there is no window in which the
 * selector stops matching with the box still at 0px. And it matters that it goes away
 * afterwards -- the iframe resizes as the user walks the purchase flow, and a 2000px floor
 * would leave dead space below on the shorter steps.
 *
 * Production does not have this problem (0.0004): there the page is camyno's and the embed
 * is born off screen. Here it rose to 657px from the top and started scoring.
 * ================================================================== */

.gift-up-target:empty {
   min-height: 2000px;
}

/* ==================================================================
 * 56px of breathing room above the content, like camyno's wrapper
 *
 * Production wraps the whole page in a `div.cv-wrap-wrapper` with `padding: 3.5em 0`, the
 * same 56px top and bottom. Hello has no equivalent: `div.page-content` comes with zero, so
 * the content sits against the header. Measured on /immerse/activities-and-adventures/, the
 * hero starts at 96px here versus 152px in production -- and the same 56 shows up on every
 * page compared.
 *
 * Both ends come from here. The bottom had previously been restored as padding on the LAST
 * section (padding-de-borda-da-pagina.php), and that was undone: inside the section the
 * breathing room did not reach the pages whose last band has padding in `%` --
 * /stay/accommodations/ was left with 11px between the card grid and the footer versus 67px
 * in production, and there were 30 pages like that -- nor the bands with their own
 * background, where the padding would make the color grow instead of opening space. On the
 * wrapper, outside any section, neither problem exists.
 *
 * Applies only to pages. The archive template (/blog/) and the single-post one hang the
 * `.elementor` straight off the body, without `.page-content`, and there production uses a
 * different measure (32px on /blog/). The `>` selector keeps both out.
 * ================================================================== */


/*
 * Exception: a page that opens with a full-width media band. There the breathing room
 * becomes a white strip between the menu and the image, and the hero should touch the
 * header. Production shows the strip -- measured 66px on both, at 1440 and at 1920 -- so
 * this is a deliberate deviation, chosen after seeing the two side by side. The class comes
 * from the `body_class` hook in functions.php, which has to open the `template` widget to
 * know what the page starts with.
 *
 * The 10px left over are the `--padding-block` of the band's own container, and exist the
 * same in production; zeroing them here would raise the hero above what either one shows.
 */
.chs-abre-com-hero .page-content > .elementor[data-elementor-type="wp-page"] {
   padding-top: 0;
}

/*
 * Mirror of that at the bottom, with one difference. At the top the hero touches the menu
 * and that's it. At the bottom the breathing room cannot simply vanish: without it the
 * /promotions/ cards sat 18px from the footer, versus 85 in production. What was wrong was
 * its PLACE -- it lived on the wrapper, outside the band, so the band's color stopped and a
 * strip of the page's white was left before the footer.
 *
 * The breathing room changes sides: it leaves the wrapper and enters the band itself. The
 * color runs all the way to the footer and the content keeps the same 56px of air.
 *
 * Only applies to the band that IS the painted paper -- the one on /promotions/ uses the
 * site's own background color. The band that separates itself, like the green one on
 * /summer-in-arizona/, gets nothing: it touches the footer and its content already has its
 * own symmetry, 30 on top and 30 below, which adding 56 would break. What separates the two
 * cases is the color's luminance, in functions.php.
 *
 * `max()` because the band may already ask for more than that, and then what it asks for wins.
 */
.chs-fecha-com-faixa .page-content > .elementor[data-elementor-type="wp-page"] {
   padding-bottom: 0;
}

.chs-faixa-final.e-con-full,
.chs-faixa-final > .e-con-inner {
   padding-block-end: max(56px, var(--padding-block-end, 0px));
}


/*
 * And the band's own 10px `--padding-block`, which would survive the wrapper's breathing
 * room and leave a 10px white strip between the menu and the image.
 * hero-sem-padding-horizontal.php already zeroes those 10px on media bands, but does not
 * reach these: the content is inside a `template` widget, and from the outside the band
 * looks like it holds text.
 *
 * Only the top, and only on the first band. The bottom stays: that is where the separation
 * from the next section lives.
 */
.chs-abre-com-hero .page-content > .elementor[data-elementor-type="wp-page"] > .e-con:first-child,
.chs-abre-com-hero .page-content > .elementor[data-elementor-type="wp-page"] > .e-con:first-child > .e-con:first-child {
   --padding-top: 0px;
   --padding-block-start: 0px;
}

/* ==================================================================
 * The page's margin lives on the wrapper, and only there
 *
 * Measured across the whole site before this rule: the top gave 56px on most pages, but the
 * bottom varied between 56 and 204. The difference is the first and last sections adding
 * THEIR padding and margin to the wrapper's breathing room -- 11px of margin here, 56px of
 * padding there, and each page ended on a different number.
 *
 * Both ends now come from a single place. The first section contributes nothing on top, the
 * last nothing below, and what remains is the wrapper's 56/56, the same on all.
 *
 * The padding is only zeroed when the section does NOT have a background. With a background
 * that padding is the breathing room INSIDE the colored band: the page's white already ends
 * at the band's edge, so it does not enter the margin calculation, and zeroing it would just
 * glue the title to the top of the color. The class comes from
 * `elementor/frontend/container/before_render` in functions.php.
 *
 * The margin is always zeroed, background or not, because margin is space outside the band
 * and adds to the breathing room in every case. That includes negative ones: 21 pages pulled
 * the first section upward -- as far as -142px -- counting on the 56px camyno reserved, and
 * without that pair the band rose behind the menu. /stay/accommodations/ started 58px above
 * the bottom of the header.
 *
 * Applies to the four top-level documents, not just pages: archive, single-post and search
 * hang the `.elementor` straight off the body and needed the same treatment for the rule to
 * hold across the whole site.
 *
 * And it applies one level down too. Zeroing only the section left 23 pages at 66/56: the
 * section started at the right 56, but the container nested inside it brought Elementor's
 * 10px of `--padding-block` and the first text fell 10px lower. The same background
 * condition applies there.
 *
 * There are two ways of going one level down because Elementor has two: a `full` container
 * hangs the child directly, a `boxed` container hangs it off a `.e-con-inner` in between.
 * Matching only the first left the boxed pages exactly as they were.
 * ================================================================== */

.page-content > .elementor[data-elementor-type="wp-page"],
body > .elementor[data-elementor-type="archive"],
body > .elementor[data-elementor-type="single-post"],
body > .elementor[data-elementor-type="search-results"] {
   padding-top: 56px;
   padding-bottom: 56px;
}

.page-content > .elementor[data-elementor-type="wp-page"] > .e-con:first-child,
body > .elementor[data-elementor-type="archive"] > .e-con:first-child,
body > .elementor[data-elementor-type="single-post"] > .e-con:first-child,
body > .elementor[data-elementor-type="search-results"] > .e-con:first-child {
   --margin-top: 0px;
   --margin-block-start: 0px;
}

.page-content > .elementor[data-elementor-type="wp-page"] > .e-con:last-child,
body > .elementor[data-elementor-type="archive"] > .e-con:last-child,
body > .elementor[data-elementor-type="single-post"] > .e-con:last-child,
body > .elementor[data-elementor-type="search-results"] > .e-con:last-child {
   --margin-bottom: 0px;
   --margin-block-end: 0px;
}

.page-content > .elementor[data-elementor-type="wp-page"] > .e-con:first-child:not(.chs-com-fundo),
.page-content > .elementor[data-elementor-type="wp-page"] > .e-con:first-child > .e-con:first-child:not(.chs-com-fundo),
.page-content > .elementor[data-elementor-type="wp-page"] > .e-con:first-child > .e-con-inner > .e-con:first-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="archive"] > .e-con:first-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="archive"] > .e-con:first-child > .e-con:first-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="archive"] > .e-con:first-child > .e-con-inner > .e-con:first-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="single-post"] > .e-con:first-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="single-post"] > .e-con:first-child > .e-con:first-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="single-post"] > .e-con:first-child > .e-con-inner > .e-con:first-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="search-results"] > .e-con:first-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="search-results"] > .e-con:first-child > .e-con:first-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="search-results"] > .e-con:first-child > .e-con-inner > .e-con:first-child:not(.chs-com-fundo) {
   --padding-top: 0px;
   --padding-block-start: 0px;
}

.page-content > .elementor[data-elementor-type="wp-page"] > .e-con:last-child:not(.chs-com-fundo),
.page-content > .elementor[data-elementor-type="wp-page"] > .e-con:last-child > .e-con:last-child:not(.chs-com-fundo),
.page-content > .elementor[data-elementor-type="wp-page"] > .e-con:last-child > .e-con-inner > .e-con:last-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="archive"] > .e-con:last-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="archive"] > .e-con:last-child > .e-con:last-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="archive"] > .e-con:last-child > .e-con-inner > .e-con:last-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="single-post"] > .e-con:last-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="single-post"] > .e-con:last-child > .e-con:last-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="single-post"] > .e-con:last-child > .e-con-inner > .e-con:last-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="search-results"] > .e-con:last-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="search-results"] > .e-con:last-child > .e-con:last-child:not(.chs-com-fundo),
body > .elementor[data-elementor-type="search-results"] > .e-con:last-child > .e-con-inner > .e-con:last-child:not(.chs-com-fundo) {
   --padding-bottom: 0px;
   --padding-block-end: 0px;
}

/*
 * The last paragraph counts too. Zeroing the boxes' padding and margin leaves the BOX 56px
 * from the footer, but the text inside it ends earlier: a `<p>` carries
 * `margin-bottom: 10px` and the blog posts closed at 66 or 70 instead of 56. It is the
 * page's last content element -- after it comes only the footer -- so its margin separates
 * nothing from nothing.
 */
.page-content > .elementor[data-elementor-type="wp-page"] > .e-con:last-child .elementor-widget:last-child > :last-child,
.page-content > .elementor[data-elementor-type="wp-page"] > .e-con:last-child .elementor-widget:last-child > :last-child > :last-child,
body > .elementor[data-elementor-type="archive"] > .e-con:last-child .elementor-widget:last-child > :last-child,
body > .elementor[data-elementor-type="archive"] > .e-con:last-child .elementor-widget:last-child > :last-child > :last-child,
body > .elementor[data-elementor-type="single-post"] > .e-con:last-child .elementor-widget:last-child > :last-child,
body > .elementor[data-elementor-type="single-post"] > .e-con:last-child .elementor-widget:last-child > :last-child > :last-child,
body > .elementor[data-elementor-type="search-results"] > .e-con:last-child .elementor-widget:last-child > :last-child,
body > .elementor[data-elementor-type="search-results"] > .e-con:last-child .elementor-widget:last-child > :last-child > :last-child {
   margin-bottom: 0;
}

/*
 * Blog (/blog/): the last section is the Wellness carousel with a gray background (#f7f5f2).
 * The wrapper's 56px of padding-bottom become a white band between the gray and the footer —
 * up top the gray touches the header, so at the bottom it should touch the footer too.
 */
body.blog > .elementor[data-elementor-type="archive"] {
   padding-bottom: 0;
}

/* ==================================================================
 * Tabs widget -- shows the first tab before the JS arrives
 *
 * Elementor marks no tab as active in the HTML: `elementor-active` is added by the
 * frontend.js handler. Until then every `.elementor-tab-content` is hidden and the widget
 * measures only the height of the titles. Measured on /recipes/colorado-lamb-rack/ on
 * mobile: 194px until 1.8s, then 1214px all at once. Worth 0.30 CLS, and the recipes all
 * use the same widget.
 *
 * The rule shows from first paint exactly what the JS would show: tab 1. When the handler
 * runs, it puts `elementor-active` on the same element that was already visible, so there
 * is no swap. The `hidden="false"` attribute Elementor prints on that tab does not get in
 * the way -- the author rule beats the browser's stylesheet.
 * ================================================================== */

.elementor-widget-tabs .elementor-tab-content[data-tab="1"] {
   display: block;
}

/* ==================================================================
 * Offers grid -- card footers at the same height
 *
 * In a row of cards the columns stretch to the tallest one's height, but the content stays
 * anchored at the top, so a different amount of white is left at the bottom of each card
 * depending on the text's length. On /promotions/ the three orange bars of a single row fell
 * at y=668, 686 and 710. Production does the same; this is a deliberate deviation.
 *
 * The first child -- the image-and-text block, the variable-height part -- absorbs the
 * slack, and what comes after sits against the bottom. Done this way, and not with
 * `margin-top: auto` on a child picked by position, so it does not depend on how many
 * children each card has.
 *
 * The class is written into the content by alinha-base-dos-cards-de-oferta.php, only in the
 * offers template. This row's structural signature appears 90 times across the site, footer
 * included, so it is no use as a selector.
 * ================================================================== */

.chs-card-oferta > :first-child,
.chs-card-oferta > .e-con-inner > :first-child {
   flex-grow: 1;
}