/* Things Avada's JavaScript used to do, done in CSS instead. */

/* Entrance animations: content started hidden until a script revealed it. */
.fusion-animated, [data-animationtype] { visibility: visible !important; opacity: 1 !important; animation: none !important; }

/* Mobile menu (Avada cloned the desktop menu into this holder with JS). */
.fusion-mobile-nav-holder > ul { display: none; }
.fusion-mobile-nav-holder.fusion-mobile-menu-expanded { display: block !important; }
.fusion-mobile-nav-holder.fusion-mobile-menu-expanded > ul { display: block; }
.fusion-mobile-nav-holder .mobile-nav-heading > span { display: block; padding: 0 20px; font-family: Montserrat, Arial, Helvetica, sans-serif; color: #333; }

/* Static first slide in place of Revolution Slider. */
.static-hero { background-size: cover; background-position: center center; min-height: 380px; display: flex; align-items: center; width: 100%; max-width: 100%; box-sizing: border-box; }
/* width is explicit so aspect-ratio + min-height can't widen the hero past the screen on phones */
.static-hero-inner { min-width: 0; box-sizing: border-box; max-width: 1170px; margin: 0 auto; padding: 0 30px; width: 100%; }
.static-hero-inner p { max-width: 560px; color: #fff; font-family: Montserrat, Arial, Helvetica, sans-serif; font-size: 20px; line-height: 30px; background: rgba(3, 83, 160, .85); padding: 20px 25px; margin: 0; }

/* Lead form honeypot: off-screen, never seen by people. */
.lead-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.wpcf7-response-output[hidden] { display: none; }
form.sent .wpcf7-response-output { border: 2px solid #46b450; }
form.failed .wpcf7-response-output, form.invalid .wpcf7-response-output { border: 2px solid #dc3232; }

/* Mobile menu items (Avada 7 styles these when its JS builds the menu). */
.fusion-mobile-nav-holder .fusion-mobile-menu { margin: 0; padding: 0; list-style: none; border-top: 1px solid #e5e5e5; }
.fusion-mobile-nav-holder .fusion-mobile-nav-item a { display: block; padding: 0 20px; line-height: 42px; border-bottom: 1px solid #e5e5e5; color: #333; font-family: Montserrat, Arial, Helvetica, sans-serif; font-size: 14px; }
.fusion-mobile-nav-holder .fusion-mobile-sub-item a { padding-left: 36px; }
.fusion-mobile-nav-holder .fusion-mobile-current-nav-item > a, .fusion-mobile-nav-holder .fusion-mobile-current-nav-item > a .menu-text { color: #fff; }

/* Lazy-load placeholders are gone; never hide images waiting for a script. */
img.lazyload, img.lazyloading, .lazyload { opacity: 1 !important; visibility: visible !important; }

/* Font Awesome 4.7 icon font, self-hosted (the old sites loaded it from use.fontawesome.com). */
@font-face { font-family: 'FontAwesome'; src: url('/fonts/fa4/fontawesome-webfont.woff2') format('woff2'), url('/fonts/fa4/fontawesome-webfont.woff') format('woff'); font-weight: normal; font-style: normal; font-display: block; }
@font-face { font-family: 'fontawesome'; src: url('/fonts/fa4/fontawesome-webfont.woff2') format('woff2'), url('/fonts/fa4/fontawesome-webfont.woff') format('woff'); font-weight: normal; font-style: normal; font-display: block; }

/* Avada "100% height" containers: its JS set them to the window height minus the header, growing with the content.
   Without that JS they fall back to a fixed height and taller content spills under the header. */
.fullwidth-box.hundred-percent-height { height: auto !important; min-height: calc(100vh - 160px); }
.fullwidth-box.hundred-percent-height > .fusion-fullwidth-center-content { height: auto !important; min-height: inherit; }

/* WordPress theme page preloaders: their hide-on-load script is not carried over, so they would cover the page forever. */
#ct-loadding,.ct-loader,#preloader,.preloader,#page-preloader,.page-loader,#loader-wrapper,.site-loader{display:none!important}

/* Mobile menu button: Avada drew a 21px light-grey (#dadada) icon, too small to tap and hard to see on white. */
.fusion-mobile-menu-icons a { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-left: 0; font-size: 24px; color: #005b8d; }
.fusion-mobile-menu-icons a:hover, .fusion-mobile-menu-icons a:focus-visible { color: #003a5c; }
/* Open mobile menu: the current page in the site's blue (it was white on light grey), and the list scrolls when
   it is taller than the screen (phones held sideways). */
body .fusion-mobile-nav-holder .fusion-mobile-current-nav-item > a { background-color: #005b8d !important; color: #fff !important; }
.fusion-mobile-nav-holder.fusion-mobile-menu-expanded > ul { max-height: calc(100vh - 80px); max-height: calc(100dvh - 80px); overflow-y: auto; }

/* Home hero: the quote form sits beside the text (as on the old site), so the hero is only as tall as the form.
   The photo is anchored to the finished floor rather than the wall above it. */
.hero-home { background-position: center bottom !important; }
@media only screen and (min-width: 801px) {
  .hero-home { padding-top: 60px !important; padding-bottom: 40px !important; }
  .hero-home .banner__form-textarea { height: 110px !important; }
}
@media only screen and (max-width: 800px) {
  /* Phones: the form stacks under the text; the photo covers the text part at its own size and fades out behind the form. */
  .hero-home { padding-top: 50px !important; background-color: #555 !important; background-repeat: no-repeat !important; background-position: center top !important;
    background-image: linear-gradient(rgba(85, 85, 85, 0) 380px, #555 500px), url('/wp-content/uploads/2020/10/banner-home-1.jpg') !important;
    background-size: 100% 500px, auto 500px !important; }
}

/* Home page on phones: keep text off the screen edges (the old site had a 30px margin). */
@media only screen and (max-width: 800px) {
  #post-2 .fusion-fullwidth.nonhundred-percent-fullwidth > .fusion-row { padding-left: 30px !important; padding-right: 30px !important; box-sizing: border-box; }
}

/* Mobile menu button bars: Avada draws them with ::before in light grey (#dadada, 1.4:1 on white). */
.fusion-mobile-menu-icons a::before, .fusion-mobile-menu-icons a.awb-icon-bars::before { color: #005b8d !important; }
.fusion-mobile-menu-icons a:hover::before, .fusion-mobile-menu-icons a:focus-visible::before { color: #003a5c !important; }

/* Photo columns (a background image on an empty column): Avada's equal-heights script stretched them to the height of
   the text column beside them. Without it they collapse to 1px and the photo disappears, so stretch them with flexbox. */
@media only screen and (min-width: 801px) {
  .fusion-builder-row.fusion-row:has(> .fusion-layout-column > .fusion-empty-column-bg-image) { display: flex; flex-wrap: wrap; align-items: stretch; }
  .fusion-builder-row.fusion-row:has(> .fusion-layout-column > .fusion-empty-column-bg-image)::before,
  .fusion-builder-row.fusion-row:has(> .fusion-layout-column > .fusion-empty-column-bg-image)::after { display: none; }
  .fusion-builder-row.fusion-row:has(> .fusion-layout-column > .fusion-empty-column-bg-image) > .fusion-layout-column { display: flex; flex-direction: column; float: none; }
  .fusion-layout-column > .fusion-empty-column-bg-image { flex: 1 1 auto; min-height: 308px; }
}

/* Blog thumbnails: Flexslider hides every slide until its script runs; show the first (only) image without it. */
.fusion-post-slideshow .slides > li:first-child { display: block !important; }