/* 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}

/* Phone/tablet header (Avada shows the menu button up to 1100px). The child theme lays the header out as a table, so the
   menu opened inside the narrow menu cell, off the right edge, and stretched the header. Open it full width under the
   header instead, over the page, and give the button a 44px tap target. */
@media only screen and (max-width: 1100px) {
  .fusion-header { position: relative; }
  .fusion-mobile-menu-icons a { display: inline-flex !important; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0 !important; font-size: 24px; }
  .fusion-mobile-nav-holder.fusion-mobile-menu-expanded { position: absolute; left: 0; right: 0; top: 100%; z-index: 10000; margin: 0 !important; background: #fff; max-height: calc(100vh - 110px); overflow-y: auto; box-shadow: 0 8px 16px rgba(0, 0, 0, .2); }
}
