@import url('https://fonts.googleapis.com/css2?family=Playpen+Sans:wght@100..800&display=swap');

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
      font-family: "Playpen Sans", cursive !important;
  }

  .btn-secondary {
      color: var(--color-theme-text) !important;
  }

  .btn-secondary:hover {
      color: var(--color-theme-text-btn) !important;
  }

  /*  Header / Nav
=================================================================================================*/

  .header__top {
      background: var(--color-theme-primary);
      color: var(--color-theme-background);
      padding: 10px 0;
      font-size: 14px;
      text-align: center;
  }


  .header__top a {
      color: inherit;
  }

  .header__top a:hover {
      opacity: .8;
      /* color: var(--color-theme-highlight); */
  }

  .header__top .cw-social-media a {
      font-size: 1rem;
  }

  .navbar .container {
      padding-top: 10px;
      padding-bottom: 10px;
  }

  .header .navbar-nav .nav-item a,
  .header .navbar-nav .nav-item .nav-link {
      font-size: 14px;
  }

  @media (min-width: 992px) {

      .header .navbar-nav .nav-item a,
      .header .navbar-nav .nav-item .nav-link {
          margin-right: 15px;
          margin-left: 15px;
      }

      .header .navbar .active>.nav-link,
      .header .navbar .dropdown-item.active,
      .header .navbar .dropdown-item:active,
      .header .navbar .show>.nav-link {
          background-color: transparent;
      }

      .header:has(+.title) .navbar.bg-primary,
      .header:has(+section>.cw-hero) .navbar.bg-primary {
          /* background: unset !important; */
          background: rgba(255, 255, 255, .85) !important;
      }

      .header nav.navbar.navbar-expand-lg.header-scroll {
          transition: top 0.5s ease;
          filter: drop-shadow(0 1px 10px rgba(0, 0, 0, 0.5));
          transition: background-color 0.5s ease;
          opacity: 0.95;
      }

      .header nav.navbar.navbar-expand-lg.header-scroll {
          background: rgba(255, 255, 255, 0.95) !important;
      }

      .header .navbar-brand {
          min-height: auto;
          margin-left: 0;
          display: inline-block !important;
          -webkit-box-ordinal-group: 2;
          -ms-flex-order: 1;
          order: 1;
          width: 180px;
      }

      .navbar-collapse {
          -webkit-box-flex: initial;
          -ms-flex-positive: initial;
          flex-grow: initial;
      }

      .navbar .container {
          /* padding-top: 15px; */
          /* padding-bottom: 15px; */
      }

      .header .nav-link-cart,
      .header .navbar .nav-link {
          line-height: 20px;
          font-size: 14px;
      }

      section:not(.page-inventory-details) .header .header-container {
          position: fixed;
          top: 0;
          right: 0;
          left: 0;
          width: 100%;
          z-index: 1030;
      }

      /** Adds top margin to all pages to account for fixed header**/
      section[class*="page-"]:not(.page-inventory-details) {
          margin-top: var(--cw-headerHeight);
      }

      section[class*="page-"]:not(.page-inventory-details) .title,
      .cw-hero {
          margin-top: calc(-1 * var(--cw-headerHeight) + 51px);
      }

      /* There's a script to make the variable always the size of the header container */
      :root {
          --cw-headerHeight: 140px;
      }
  }

  @media (min-width: 1200px) {
      .header li.nav-item:last-of-type {
          margin-right: 0;
      }
  }

  @media (max-width: 991px) {
      .navbar .container {
          text-align: center;
          max-width: 100%;
      }
  }

  @media (min-width: 992px) {
      .header .navbar .navbar-nav .nav-link {
          padding-right: 0px;
          padding-left: 0px;
      }
  }

  /* Title */
  section:not(.page-home) .title {
      padding: 3em 0;
      text-align: center;
      background: url("https://cdn.powersports.com/cdn-cgi/image/h=1440,w=1920/75BF0A7C4BBA6125EDB5E4DED667E896.jpg");
      background-color: rgba(0, 0, 0, 0.5);
      background-blend-mode: overlay;
      background-size: cover;
      background-position: center;
      margin-bottom: 0;
  }

  @media (min-width:992px) {
      section:not(.page-home) .title {
          padding-top: calc(100px + 5em);
          padding-bottom: 3em;
      }
  }

  section:not(.page-home) .title h1 {
      color: var(--color-theme-text-btn);
      font-size: 2.5rem;
  }


  /* Hero */
  .cw-hero {
      background: url("https://cdn.powersports.com/cdn-cgi/image/h=1440,w=1920/75BF0A7C4BBA6125EDB5E4DED667E896.jpg");
      background-color: rgba(0, 0, 0, 0.5);
      background-blend-mode: overlay;
      background-size: cover;
      background-position: center;
      padding: 3em 0;
  }

  @media (min-width:992px) {
      .cw-hero {
          padding-top: calc(100px + 8em);
          padding-bottom: 6em;
      }
  }

  .cw-hero h1 {
      font-size: 1rem;
      color: var(--color-theme-text-btn);
      font-weight: 500;
  }

  .cw-hero h1 span {
      font-size: 2.25rem;
      font-weight: 600;
  }

  @media (min-width:440px) {
      .cw-hero h1 span {
          font-size: 3.25rem;
      }
  }

  .cw-hero p {
      width: 100%;
      max-width: 700px;
      margin: 1em auto 2em auto;
      color: var(--color-theme-text-btn);
  }

  /* About  */
  .cw-about {
      /* background: var(--color-theme-border); */
      background: url(https://s3.amazonaws.com/fcwebmanager/Textures/SmartSites/HeroImages/0/texture_09.jpg);
      background-size: cover;
      background-position: center;
      padding: 3em 0;
  }

  .cw-about .row {
      display: flex;
      align-items: center;
      justify-content: center;
  }

  .cw-about .cw-box {
      background: var(--color-theme-background);
      box-shadow: 2px 2px 3px #bbb;
      border-top: 4px solid var(--color-theme-primary);
      padding: 1em;
      border-radius: 20px;
      margin-bottom: 1em;
  }


  /* Highlights Section */
  .cw-highlight {
      padding: 3em 0;
  }

  .cw-highlight h5 {
      font-size: 1rem;
      color: var(--color-theme-highlight);
  }

  .cw-highlight .cw-card-group {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
  }

  .cw-highlight .cw-card {
      flex: 1 1 100%;
      background: var(--color-theme-border);
      border-radius: 20px;
      margin: 1.5em 0;
      min-height: 350px;
      padding: 1em;
      text-align: start;
      display: flex;
      align-items: end;
  }

  @media (min-width:576px) {
      .cw-highlight .cw-card {
          flex: 0 1 48%;
          margin: 1.5em 1%;
      }
  }

  @media (min-width:992px) {
      .cw-highlight .cw-card {
          flex: 0 1 23%;
      }
  }

  .cw-highlight .cw-card h3 {
      color: var(--color-theme-text-btn);
      font-size: 2rem;
  }

  .cw-highlight .cw-card1 {
      background: linear-gradient(45deg, #000 0%, transparent 70%), url("https://cdn.powersports.com/cdn-cgi/image/h=1440,w=1920/35940170CDE269C5298EAA171A460D55.jpg");
      background-size: cover;
      background-position: center;
  }

  .cw-highlight .cw-card2 {
      background: linear-gradient(45deg, #000 0%, transparent 70%), url("https://cdn.powersports.com/cdn-cgi/image/h=1440,w=1920/111D685E47BEC5BA5698EB77F739C5EB.jpg");
      background-size: cover;
      background-position: center;
  }

  .cw-highlight .cw-card3 {
      background: linear-gradient(45deg, #000 0%, transparent 70%), url("https://cdn.powersports.com/cdn-cgi/image/h=1440,w=1920/4F58FEB268F03716C48D1142C32FBA23.jpg");
      background-size: cover;
      background-position: center;
  }

  .cw-highlight .cw-card4 {
      background: linear-gradient(45deg, #000 0%, transparent 70%), url("https://cdn.powersports.com/cdn-cgi/image/h=1440,w=1920/1382ECB646015BD7897E7B83AE48ACFA.jpg");
      background-size: cover;
      background-position: center;
  }

  /* Menu Favorites */
  .cw-home-menu {
      padding: 4em 0;
      background: url(https://s3.amazonaws.com/fcwebmanager/Textures/SmartSites/HeroImages/0/texture_09.jpg);
      background-size: cover;
      background-position: center;

      /* background: var(--color-theme-border); */
  }

  .cw-home-menu .row {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
  }

  .cw-home-menu h5 {
      font-size: 1rem;
      color: var(--color-theme-highlight);
  }


  .cw-home-menu .cw-title-price {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 0.5em;
  }

  .cw-home-menu .cw-title-price p {
      margin-bottom: 0;
      font-weight: 700;
  }

  .cw-home-menu .cw-title-price p span {
      color: var(--color-theme-primary);
  }

  .cw-home-menu .cw-title-price hr {
      flex: 1;
      border-top: 2px dotted var(--color-theme-primary);
      opacity: 1;
      background: 0;
      margin: 0 1em;
  }

  .cw-home-menu img {
      border-radius: 20px;
  }



  /* Footer */

  .footer,
  .footer .footer-bottom-section {
      position: relative;
      background: transparent;
      overflow: hidden;
  }

  .footer::before {
      content: "";
      z-index: -1;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: var(--footer-background);
  }

  .footer::after {
      content: "";
      z-index: -1;
      position: absolute;
      top: -30%;
      left: 0%;
      width: 100%;
      height: 160%;
      background-image: url(https://cdn.powersports.com/cdn-cgi/image/h=540,w=720/32BB3C6BD5448B7B415482A29E2F0BBD.png);
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      filter: grayscale(1);
      opacity: 0.1;
      /* transform: rotate(333deg); */
  }

  @media (min-width:768px) {
      .footer::after {
          width: 500px;
          left: 55%;
          background-size: 500px;
          transform: rotate(333deg);
      }
  }

  @media (min-width:1920px) {
      .footer::after {
          width: 700px;
          left: 50%;
          background-size: 700px;
      }
  }


  /* Review Page */

  /*---- Reviews ---*/

  .cw-reviews .card {
      border-radius: 1rem;
      box-shadow: 0px -10px 0px rgb(248, 6, 6);
  }

  @media (max-width: 767px) {
      .cw-reviews .card {
          margin: 1rem 0.7rem 1rem;
          max-width: 80vw;
      }
  }

  .cw-reviews img {
      width: 6.2rem;
      border-radius: 5rem;
      margin: 1.3rem auto 1rem auto;
  }

  .cw-reviews .col-md-4 {
      padding: 0 0.5rem;
  }

  .card-title {
      font-size: 1rem;
      margin-bottom: 0;
  }

  .card-text {
      text-align: center;
      padding: 1rem 2rem;
      font-size: 0.8rem;
      color: rgb(82, 81, 81);
      line-height: 1.4rem;
  }

  .card-footer {
      border-top: none;
      text-align: center;
      line-height: 1.2rem;
      padding: 2rem 0 1.4rem 0;
  }

  .cw-name {
      font-size: 0.8rem;
      font-weight: bold;
  }

  .cw-reviews a {
      color: rgb(248, 6, 6);
      font-weight: bold;
  }

  .cw-reviews a:hover {
      color: rgb(248, 6, 6);
  }

  .menu-section h2 {
      font-size: 2rem;
      font-weight: 700;
      color: #3d170e;
      letter-spacing: 1px;
  }

  #our_menu .menu_tab {
      margin: 0 auto;
      justify-content: center;
  }

  #our_menu .nav-item {
      display: inline-block;
      text-align: center;
  }

  #our_menu .nav-tabs .nav-link {
      transition: 0.3s;
      color: #000;
  }

  #our_menu .nav-tabs .nav-link.active {
      background: #3d170e;
      color: #fff;
      font-weight: 700;
      border: 1px solid #3d170e;
      text-transform: capitalize;
  }

  #our_menu .nav-tabs .nav-link:hover {
      background: #aed137;
      color: #3d170e;
      border: 1px solid #aed137;
  }

  #our_menu .tab-content {
      padding: 2rem;
  }

  .single_menu {
      position: relative;
      transition: 0.3s;
      background: #fff7e9;
      padding: 0 40px 1px 0;
      margin-bottom: 60px;
      align-items: center;
      display: flex;
      min-height: 100px;
      border-bottom: 1px dashed #ddd;
  }

  .single_menu:hover img {
      -webkit-clip-path: polygon(0% 0%, 100% 0, 100% 50%, 100% 100%, 0% 100%);
      clip-path: polygon(0% 0%, 100% 0, 100% 50%, 100% 100%, 0% 100%);
  }

  .single_menu img {
      position: absolute;
      height: 126px;
      -webkit-clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);
      clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);
      transition: 0.3s;
      border: 1px solid #ddd;
      border-radius: 5px;
  }

  .menu_content {
      padding-left: 230px;
      width: 100%;
  }

  .menu_content h4 {
      font-size: 15px;
      font-weight: 300;
      border-bottom: 1px dashed #c0392b;
      line-height: 2;
      text-transform: capitalize;
  }

  .menu_content h4 span {
      font-size: 16px;
      font-weight: 800;
      float: right;
      font-style: italic;
      color: #c0392b;
  }

  .menu_content p {
      font-weight: 200;
      font-size: 13px;
      letter-spacing: 1px;
  }

  .menu_btn.btn.btn-danger {
      margin: 0 auto;
      display: block;
      width: 140px;
  }

  @media (max-width: 568px) {
      .single_menu {
          margin-bottom: 30px;
          padding: 2rem;
          flex-direction: column;
      }

      .single_menu img {
          position: relative;
          -webkit-clip-path: none;
          clip-path: none;
      }

      .menu_content {
          padding-left: 0;
      }
  }

  /* Menu Image Popup */
  .cw-menu-image {
      cursor: pointer;
  }

  .cw-menu-image-modal .modal-dialog {
      max-width: 95vw;
      margin: 1.75rem auto;
  }

  .cw-menu-image-modal .modal-content {
      background: transparent;
      border: 0;
      box-shadow: none;
  }

  .cw-menu-image-modal .modal-body {
      padding: 0;
      text-align: center;
      position: relative;
  }

  .cw-menu-image-modal img {
      display: block;
      max-width: 100%;
      max-height: 85vh;
      width: auto;
      height: auto;
      margin: 0 auto;
      border-radius: 6px;
  }

  .cw-menu-image-modal .cw-menu-image-close {
      position: absolute;
      top: -15px;
      right: -15px;
      z-index: 10;
      width: 40px;
      height: 40px;
      border: 0;
      border-radius: 50%;
      background: #fff;
      color: #000;
      font-size: 28px;
      line-height: 36px;
      padding: 0;
      cursor: pointer;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
  }

  .cw-menu-image-modal .cw-menu-image-close:hover {
      background: #3d170e;
      color: #fff;
  }

  @media (max-width: 767px) {
      .cw-menu-image-modal .modal-dialog {
          max-width: 94vw;
          margin: 1rem auto;
      }

      .cw-menu-image-modal img {
          max-height: 80vh;
      }

      .cw-menu-image-modal .cw-menu-image-close {
          top: -12px;
          right: -8px;
          width: 36px;
          height: 36px;
          font-size: 24px;
          line-height: 32px;
      }
  }