/** Shopify CDN: Minification failed

Line 15:0 Unexpected "<"
Line 181:0 Unexpected "<"
Line 251:0 Unexpected "<"
Line 341:0 Unexpected "<"
Line 511:0 Unexpected "<"

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:dc-truck-video-frame (INDEX:10, SCOPED:FALSE) */
<style>
  .section-truck-video {
    width: 100%;
  }

 .truck-video-wrapper {
  position: relative;
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
  }

  .bg-truck {
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center;
  }

  @media (max-width: 768px) {
    .bg-truck {
      width: 200%;
      max-width: none;
      margin-left: -50%;
    }
  }


  /* This defines the "video box" on the truck image */
  .video-zone {
    position: absolute;
    top: 11%;
    left: 28.6%;
    width: 42.4%;
    aspect-ratio: 16 / 9;
    z-index: 10;
    background-color: #000;
  }

  /* MOBILE: re-position video */
  @media (max-width: 768px) {
    .video-zone
    {
      width: 90vw;
      left: 5vw;
    }
  }

  
  /* Video inside container */
  .truck-video-frame {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 10;
    overflow: hidden;
    border-radius: 8px;
  }
  
  .truck-video-frame iframe,
  .truck-video-frame video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: none;
    display: block;
  }
  
  /* Frame overlay inside video-zone, extends beyond */
  .video-frame-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 113%;
    max-width: 150%;
    transform: translate(-50%, -50%);
    z-index: 15;
    pointer-events: none;
  }
  .next-video-image {
    position: absolute;
    top: 0px;
    left: -16vw;
    width: 15vw;
    height: auto;
    z-index: 20;
    cursor: pointer;
    transition: transform 0.2s ease;
  }
  
  .prev-video-image {
    position: absolute;
    top: 170px;
    left: -16vw;
    width: 15vw;
    height: auto;
    z-index: 20;
    cursor: pointer;
    transition: transform 0.2s ease;
  }

  /* Mobile repositioning */
  @media (max-width: 768px) {
    .next-video-image
    {
      top: 95%;
      left: 45vw;
      width: 40vw;
    }
    .prev-video-image
    {
      top: 95%;
      left: 5vw;
      width: 40vw;
    }
  }
  
  /* Desktop shake on hover only */
  @media (hover: hover) {
    .next-video-image:hover, .prev-video-image:hover {
      animation: shake 0.3s infinite;
    }
  }
  
  /* Mobile shake via JS trigger only */
  .shake-once {
    animation: shake 0.3s ease;
  }
  
  @keyframes shake {
    0% { transform: translate(0px, 0px) rotate(0deg); }
    25% { transform: translate(2px, -2px) rotate(1deg); }
    50% { transform: translate(-2px, 2px) rotate(-1deg); }
    75% { transform: translate(2px, 2px) rotate(1deg); }
    100% { transform: translate(0px, 0px) rotate(0deg); }
  }
  
  .dc-contact-overlay {
    position: absolute;
    bottom: 2%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    color:rgb(255, 210, 1);
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 1.6rem;
    text-align: center;
    background: #131c29;
    padding: 1rem 1.5rem;
    border-radius: 8px;
    max-width: 90%;
  }
  
  .dc-contact-overlay a {
  }
  
  @media (max-width: 768px) {
    .dc-contact-overlay {
      font-size: 1rem;
      bottom: 3%;
      padding: 0.8rem 1rem;
    }
  }


</style>
/* END_SECTION:dc-truck-video-frame */

/* START_SECTION:full-width-image (INDEX:14, SCOPED:FALSE) */
<style>
  .section-full-width-image .full-width-image {
    width: 100%;
    display: block;
  }

  .section-full-width-image.full img {
    height: 100vh;
    object-fit: cover;
    width: 100%;
  }

  .section-full-width-image.small img { height: 300px; object-fit: cover; }
  .section-full-width-image.medium img { height: 500px; object-fit: cover; }
  .section-full-width-image.large img { height: 700px; object-fit: cover; }

  @media screen and (max-width: 768px) {
    .section-full-width-image.mobile-disable img {
      width: auto;
    }
  }
  .image-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
  }

  .image-wrapper img.full-width-image {
    width: 100%;
    height: auto;
    display: block;
  }

  @media (max-width: 768px) {
    .image-wrapper img.full-width-image {
      width: 200%;
      max-width: none;
      margin-left: -50%;
    }
  }

  .overlay-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    will-change: transform;
    pointer-events: none;
    z-index: 5;
  }

  .overlay-logo img {
    max-width: 50vw;
    width: 100%;
    height: auto;
  }

  @media (max-width: 768px) {
    .overlay-logo {
      left: 50vw;
    }
    .overlay-logo img {
      width: 100vw;
      max-width: 100vw;
    }
  }
</style>
/* END_SECTION:full-width-image */

/* START_SECTION:full-width-image2 (INDEX:15, SCOPED:FALSE) */
<style>
  .section-full-width-image .full-width-image {
    width: 100%;
    display: block;
  }

  .section-full-width-image.full img {
    height: 100vh;
    object-fit: cover;
    width: 100%;
  }

  .section-full-width-image.small img { height: 300px; object-fit: cover; }
  .section-full-width-image.medium img { height: 500px; object-fit: cover; }
  .section-full-width-image.large img { height: 700px; object-fit: cover; }

  .desktop-image {
  display: block;
  }

  .mobile-image {
    display: none;
  }

  @media (max-width: 768px) {
    .desktop-image {
      display: none;
    }

    .mobile-image {
      display: block;
    }
  }


  @media screen and (max-width: 768px) {
    .section-full-width-image.mobile-disable img {
      width: auto;
    }
  }
  .image-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
  }

  .image-wrapper img.full-width-image {
    width: 100%;
    height: auto;
    display: block;
  }

  @media (max-width: 768px) {
    .image-wrapper img.full-width-image {
      width: 200%;
      max-width: none;
      margin-left: -50%;
    }
  }

  .overlay-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    will-change: transform;
    pointer-events: none;
    z-index: 5;
  }

  .overlay-logo img {
    max-width: 50vw;
    width: 100%;
    height: auto;
  }

  @media (max-width: 768px) {
    .overlay-logo {
      top: 40%;
      left: 50vw;
    }
    .overlay-logo img {
      width: 100vw;
      max-width: 100vw;
    }
  }
</style>
/* END_SECTION:full-width-image2 */

/* START_SECTION:rpm-truck-video-frame (INDEX:37, SCOPED:FALSE) */
<style>
  .section-truck-video {
    width: 100%;
  }

 .truck-video-wrapper {
  position: relative;
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
  }

  .bg-truck {
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center;
  }

  @media (max-width: 768px) {
    .bg-truck {
      width: 200%;
      max-width: none;
      margin-left: -50%;
    }
  }


  /* This defines the "video box" on the truck image */
  .video-zone {
    position: absolute;
    top: 11%;
    left: 28.6%;
    width: 42.4%;
    aspect-ratio: 16 / 9;
    z-index: 10;
    background-color: #000;
  }

  /* MOBILE: re-position video */
  @media (max-width: 768px) {
    .video-zone
    {
      width: 90vw;
      left: 5vw;
    }
  }

  
  /* Video inside container */
  .truck-video-frame {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 10;
    overflow: hidden;
    border-radius: 8px;
  }
  
  .truck-video-frame iframe,
  .truck-video-frame video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: none;
    display: block;
  }
  
  /* Frame overlay inside video-zone, extends beyond */
  .video-frame-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 113%;
    max-width: 150%;
    transform: translate(-50%, -50%);
    z-index: 15;
    pointer-events: none;
  }
  .next-video-image {
    position: absolute;
    top: 0px;
    left: -16vw;
    width: 15vw;
    height: auto;
    z-index: 20;
    cursor: pointer;
    transition: transform 0.2s ease;
  }
  
  .prev-video-image {
    position: absolute;
    top: 170px;
    left: -16vw;
    width: 15vw;
    height: auto;
    z-index: 20;
    cursor: pointer;
    transition: transform 0.2s ease;
  }

  /* Mobile repositioning */
  @media (max-width: 768px) {
    .next-video-image
    {
      top: 95%;
      left: 45vw;
      width: 40vw;
    }
    .prev-video-image
    {
      top: 95%;
      left: 5vw;
      width: 40vw;
    }
  }
  
  /* Desktop shake on hover only */
  @media (hover: hover) {
    .next-video-image:hover, .prev-video-image:hover {
      animation: shake 0.3s infinite;
    }
  }
  
  /* Mobile shake via JS trigger only */
  .shake-once {
    animation: shake 0.3s ease;
  }
  
  @keyframes shake {
    0% { transform: translate(0px, 0px) rotate(0deg); }
    25% { transform: translate(2px, -2px) rotate(1deg); }
    50% { transform: translate(-2px, 2px) rotate(-1deg); }
    75% { transform: translate(2px, 2px) rotate(1deg); }
    100% { transform: translate(0px, 0px) rotate(0deg); }
  }
  
  .contact-overlay {
    position: absolute;
    bottom: 2%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    color: #fd00f9;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 1.6rem;
    text-align: center;
    background: #131c29;
    padding: 1rem 1.5rem;
    border-radius: 8px;
    max-width: 90%;
  }
  
  .contact-overlay a {
  }
  
  @media (max-width: 768px) {
    .contact-overlay {
      font-size: 1rem;
      bottom: 3%;
      padding: 0.8rem 1rem;
    }
  }


</style>
/* END_SECTION:rpm-truck-video-frame */