/*
 * Layout stability (not on live). Avada and Owl Carousel size these boxes
 * with script after the page has been drawn, which moved everything under
 * them (Lighthouse: CLS 0.32-0.86 on phones). The same sizes from the first
 * paint, by CSS; once the scripts have run nothing differs from the theme.
 */

/* Avada's 100%-height containers: at 980px and below (its content break
   point, with "100% height on mobile" off) its script sets them and their
   centred content to height:auto. */
@media only screen and (max-width: 980px) {
  .hundred-percent-height.non-hundred-percent-height-scrolling,
  .hundred-percent-height.non-hundred-percent-height-scrolling .fusion-fullwidth-center-content {
    height: auto !important;
  }
}

/* The home page's game carousels: Owl keeps them display:none until it has
   started. Before that they take the room they will have, still invisible.
   The large one is as tall as its tallest slide (Owl lays them side by side;
   here they share one grid cell). The thumbnails: a row of four (two below
   767px, Owl's breakpoint) 30px apart, with the theme's 30px margins and the
   current one's 3px border above and below, and below 767px Owl's dots
   (27px, shown while there are more than two). */
#large_carousel.owl-carousel:not(.owl-loaded) {
  display: grid;
  visibility: hidden;
  overflow: hidden;
}
#large_carousel.owl-carousel:not(.owl-loaded) > .item {
  grid-area: 1 / 1;
}
/* Owl's own rule for pictures in a slide (owl.carousel.min.css), which only applies inside its wrappers. */
#large_carousel.owl-carousel:not(.owl-loaded) > .item img,
#thumb_carousel.owl-carousel:not(.owl-loaded) > .item img {
  display: block;
  width: 100%;
}
#thumb_carousel.owl-carousel:not(.owl-loaded) {
  display: flex;
  align-items: flex-start;
  gap: 30px;
  padding-top: 33px;
  padding-bottom: 33px;
  visibility: hidden;
  overflow: hidden;
}
#thumb_carousel.owl-carousel:not(.owl-loaded) > .item {
  flex: 0 0 calc((100% - 90px) / 4);
}
@media (max-width: 766px) {
  #thumb_carousel.owl-carousel:not(.owl-loaded) {
    padding-bottom: 60px;
  }
  #thumb_carousel.owl-carousel:not(.owl-loaded) > .item {
    flex-basis: calc((100% - 30px) / 2);
  }
}