/* Desktop only: flyout (3rd-level) menus for BigCommerce nav */
@media (hover: hover) and (min-width: 1025px) {
  /* Each submenu item can have a flyout */
  .navPage-subMenu-item {
    position: relative; }
  /* 3rd-level flyout panel (children of submenu items) */
  .navPage-subMenu .navPage-childList {
    position: absolute;
    top: 0;
    left: 100%;
    /* sit immediately to the right of parent item */
    min-width: 220px;
    /* Make it visible over video/background */
    background: #ffffff;
    /* change to your header color if needed */
    z-index: 9999;
    /* Hide by default */
    display: none; }
  /* Show flyout when hovering parent item */
  .navPage-subMenu-item:hover > .navPage-childList,
  .navPage-subMenu-item:focus-within > .navPage-childList,
  .navPage-subMenu .navPage-childList:hover {
    display: block; }
  /* Ensure nav container doesn't clip the flyout */
  .navPages-container,
  .navPage-subMenu {
    overflow: visible; } }

/* =========================================
   Vimeo Showcase fix for Vault-v1 Natural
   ========================================= */
.vimeo-showcase-fix {
  width: 100%;
  max-width: 1200px;
  margin: 40px auto !important;
  /* Helps inside flex containers */
  align-self: center !important; }

/* Guaranteed responsive height */
.vimeo-showcase-ratio {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  /* <-- this is the magic */ }

/* Fill the ratio box */
.vimeo-showcase-ratio iframe {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  border: 0 !important; }
