@charset "UTF-8";
/* CSS Document */

/* move navbar and content down to make room for static announcement bar */
.navbar-with-banner {
  margin-top: 35px;
}

/* to fix non-round buttons */
.btn-round {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

/* FINE TUNE SIZE OF BRAND LOGO */
.brand-logo {
  width: 70%; /* Default */
  max-width:250px; /* Restrict max size */
}
/*
@media (max-width: 768px) {
  .brand-logo {
      width: 60%;
  }
}

@media (max-width: 480px) {
  .brand-logo {
      width: 45%;
  }
}
*/

      /* Set the size of the div element that contains the Google map */
      #map {
        height: 300px;
        width: 100%;
        /* The width is the width of the web page */
      }
		/* Modify primary colour for ABS */
		.text-primary{color:#1033A3!important;}
		.text-primary-desat{color:#6c8aec!important;}
    .text-absgrey {color: #747474  !important;}
    .text-absPrice {color: #204d70  !important;}
    .text-specials{color:#e1bf25!important;}

    /*.btn-primary{color:#1033A3!important}
    .btn-primary-desat{color:#6c8aec!important} */

    .absFont {font-family: 'Courier New', Courier, monospace !important;}

    .absButtonText{color:whitesmoke!important;}

    #absTransparentBackground {background-color:transparent !important;}

    .absBackgroundPrimary{background-color:#1033A3!important;}
    .absBackground1 {background-color: #233f55 !important;}
    .absTextGrey {background-color: #747474 !important;}
    #absBackground2 {background-color: #6a070f !important;}
    .absBackground3 {background-color: #2c2c2c !important;}
    .absBackground4 {background-color: #FFFFFF !important;}
    .absLightGrey {background-color: #e5e5e5 !important;}
    .bg-absBlack {background-color: #161616 !important;}

    .bg-orange {background-color: #ff5100 !important;}
    .text-orange {color: #ff5100 !important;}
    .t1550-red {color: #de1e2b !important;}

    .absOpacity {background: rgba(255, 255, 255, 0.5);}

    .ms-1 {
      margin-left: 1px !important;
    }

    .absSuperscript{vertical-align: super;font-weight: bold;}
    .absSuperscript-small{vertical-align: super;font-size: 0.8rem;font-weight: bold;}
    .abssmallcaps {
      font-variant: small-caps;
    }

    /* smooth scroll to Buy */
    #absCart {
      display: block;
      position: relative;
      top: -80px;
      visibility: hidden;
      scroll-behavior: smooth;
    }

    html {
      scroll-behavior: smooth;
      scroll-padding-top: 80px; /* Adjust to match your navbar height */
    }

    /* Custom Styling for the Alert Dismiss Button */
    .btn-close {
      border: none; /* Remove border */
      width: 1.5rem; /* Adjust size */
      height: 1.5rem;
      color: white!important;
      opacity: 1!important;
    }
    .btn-close::after {
      content: '×'; /* Replace default icon with a custom one */
      font-size: 1.8rem;
      color: white; /* Change icon color */
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
    .alert-link {
      text-decoration: underline;
    }

/* THE FOLLOWING USED BY C5 AERO PAGE FOR VIDEO POSITIONING */
    /* Hero container always maintains 16:9 aspect ratio */
    .hero-container {
      width: 100%;
      height: 70vh; /* fullscreen */
      overflow: hidden;
      aspect-ratio: 9 / 16;
      position: relative;
    }

    /* Full width video that stays within aspect ratio */
    .hero-video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }

    /* Overlay for text readability */
    .hero-overlay {
      position: absolute;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.5);
    }

    /* Center text on video */
    .hero-content {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      text-align: center;
      color: white;
    }

    /* for main images that span screen width */
    .background-section {
      
      width: 100%;
      height: 100vh; /* Full screen */
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      text-align: center;
    }