/* Coast Breakz per-client desktop deltas on top of the kit parity template (Stage 3 base; Stage 4 continues). */
/* Divi caps .container at 80% / 1080px; live's is a fixed 1170px */
body.cb-site #page-container .container { width: 1170px; max-width: 1170px; position: static; }   /* Divi makes .container position:relative, which paints a bare .container over the floated .content above it (clicks on the FAQ intro link land on the container) */
/* the keyless map embed fills live's 350px map box (an inline iframe leaves a baseline gap and defaults to 150px high) */
body.cb-site #page-container .map-container iframe.ils-map { display: block; width: 100%; height: 100%; border: 0; }
/* live's .content blocks are floats cleared by #footer; here the Theme Builder footer is a positioned Divi row that starts at the top of those floats and covers them (clicks land on the footer).
   The blog views' main area encloses its floats so the footer layout starts below them. */
body.cb-site #main-content { display: flow-root; }
/* live's ol keeps the browser default (marker outside, text at the 40px indent); Divi sets ol inside inside its layouts */
body.cb-site .et-l ol { list-style-position: outside; }
/* live's property Rooms and Location tabs are in almost-standards mode (XHTML 1.0 Transitional doctype): an inline-only line has no strut there. Same line heights on the HTML5 theme (body class cb-xhtml, cb-sitewide.php). */
body.cb-site.cb-xhtml #page-container .footermenu li { line-height: 25px; }
body.cb-site.cb-xhtml #page-container .bookingform span.duration { line-height: 35px; }
body.cb-site.cb-xhtml #page-container .socialwidgets { box-sizing: border-box; height: 20px; }
/* the legacy Location tabs have no #feature: on live the booking panel is positioned against #container-outer, which there wraps the whole page, so it lands over the footer map (live behaviour, copied).
   Here Divi's header wrappers are positioned and only 614px high, so on these pages they are static and the body takes the role. */
body.cb-site.cb-xhtml:has(.property-container) { position: relative; }
body.cb-site.cb-xhtml:has(.property-container) #page-container #container-outer, body.cb-site.cb-xhtml:has(.property-container) #page-container,
body.cb-site.cb-xhtml:has(.property-container) #et-boc, body.cb-site.cb-xhtml:has(.property-container) header.et-l--header :is(.et_builder_inner_content, .et_pb_section, .et_pb_row, .et_pb_column, .et_pb_module, .et_pb_code_inner) { position: static; }
/* live's DoubleClick activity pixel is a display:block 1px image at the very top of #container-outer; Divi prints the body integration at the end of the page, so the same 1px sat at the bottom.
   The pixel keeps loading but takes no space, and the top carries the 1px instead. */
body.cb-site > img[src*="doubleclick.net/activity"] { position: absolute; top: 0; left: 0; }
body.cb-site #page-container #container-outer::before { content: ""; display: block; height: 1px; }
/* live's page bands are positioned against #container-outer (the whole page, position:relative); here that element holds only the header band, so Divi's wrappers around the page code module (all position:relative) became the containing block and
   the home's absolutely placed band photo and card (.uppercontentbg, .bannertop) landed 1385px low. They are static, so the page container (same box as live's container-outer) is the containing block again. */
body.cb-site #main-content :is(.et_builder_inner_content, .et_pb_section, .et_pb_row, .et_pb_column, .et_pb_module, .et_pb_code_inner) { position: static; }
body.cb-site #main-content :is(.entry-content, article.page, article.post) { position: static; }
/* live's #container-outer (z-index 2, #1a1a1a on the home) is the stacking context of the WHOLE page, so the home's band photo paints above its dark ground. Here it holds only the header band, so its z-index made the dark ground paint above
   the band photo, which sits later in the page. z-index auto puts everything back in one stacking context, in live's order. */
body.cb-site #page-container #container-outer { z-index: auto; }
/* Montserrat capitals in the bold weight come out about 2.4% narrower than Proxima Nova's in the menu words (measured on 9 page types); the menu keeps live's 1px tracking plus 0.3px */
body.cb-site #page-container #menu > ul > li > a { letter-spacing: 1.3px; }
/* Divi's img { max-width: 100% } shrinks an image inside an auto-layout table cell to the cell's minimum (special offer image 400px to 307px); live has no such rule */
@media (min-width: 1170px) { body.cb-site #page-container .maintext table img { max-width: none; } }
/* Divi's reset removes every outline, so a keyboard user saw nothing; live shows the browser's own focus ring. Back to the user agent's ring (below 1250 cb-mobile.css draws a heavier AA ring). */
body.cb-site #page-container :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: revert; }
/* widgets appended to <body> (the calendar, the photo pop-up) are outside #page-container */
body.cb-site :is(#datepicker_div, #fancybox-wrap, #fancybox-outer, #fancybox-content) :is(a, button, select, input):focus-visible { outline: revert; }
body.cb-site :is(#fancybox-close, #fancybox-left, #fancybox-right, a.datepicker_next, a.datepicker_prev):focus-visible { outline: revert; }
/* the booking calendar (#datepicker_div) is appended to <body>: the port scoped these two bundle.css rules under #page-container, so the calendar opened 120px wide instead of live's 185px */
body.cb-site .datepicker { clear: both; float: left; width: 100%; color: #fff; background: #ccc; text-align: center; font-size: 100%; }
body.cb-site .datepicker a { display: block; width: 100%; }
/* live's general.css gives every th and td its Proxima 15px/22px, including the calendar's cells (port scoped it under #page-container) */
body.cb-site #datepicker_div :is(th, td) { font-family: 'ProximaNovaRgRegular', Arial, Helvetica, sans-serif; font-size: 15px; line-height: 22px; font-weight: normal; vertical-align: top; }
body.cb-site #datepicker_div select { font-family: 'ProximaNovaRgRegular', Helvetica, sans-serif; }
/* the photo pop-up's shadow pieces (appended to <body>): bundle.css scoped this one rule under #page-container, so the eight pieces were 820px wide and 0 high */
body.cb-site .fancy-bg { position: absolute; padding: 0; margin: 0; border: 0; width: 20px; height: 20px; z-index: 1001; }
body.cb-site #fancy-bg-n, body.cb-site #fancy-bg-s { width: 100%; }
body.cb-site #fancy-bg-e, body.cb-site #fancy-bg-w { height: 100%; }
/* live's drop-down opens on hover only: the same list opens while a keyboard user is inside it */
body.cb-site #page-container #menu li:focus-within > ul { display: block; }
/* the home blog photo's link is a 132x94 corner on live and the date box above it covers even that (nothing on the photo can be clicked); the whole photo is the link, above the date box. No visible change. */
body.cb-site #page-container .panel.blog .blog-image { position: relative; }
body.cb-site #page-container .panel.blog .blog-image a { position: relative; z-index: 2; width: 100%; height: 100%; }
