@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;700;800&display=swap");

/* FREE SHIPPING under $49 BANNER */

.top-promo {
    width: 100%;
    background: #A81D34;
    color: #fff;
    text-align: center;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
    padding: 8px 16px 16px;
    box-sizing: border-box;
  }

  .headline {
    display: block;
    font-weight: 700;
    font-size: 1.7rem;
    text-transform: uppercase;
    line-height: 1.3;
  }

  .subline {
    display: block;
    font-weight: 300;
    font-size: 0.95rem;
    text-transform: uppercase;
    line-height: 1.1;
  }

  .subline a {
    color: #fff;
    text-decoration: none;
    text-transform: lowercase;
    margin-left: 6px;
    font-weight: 300;
    font-size: 0.75rem;
  }

  /* Larger screens: one line layout */
  @media (min-width: 768px) {
    .top-promo {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 6px;
      padding: 8px 20px;
    }
    .headline,
    .subline {
      display: inline;
    }
    .headline {
      font-size: 1.7rem;
    }
    .subline {
      font-size: .95rem;
    }
    .subline a {
      margin-left: 10px;
      font-size: .75rem;
    }
  }

/* FREE SHIPPING under $49 BANNER */

/* FREE SHIPPING under $49 HOME BANNER  */


 #freeship-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
  }

  .freeship-promo-banner {
    width: 100%;
    min-height: 170px; /* adjust if needed */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/2025-Cyber-Monday-Sale/2025-free-shipping-mobile.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }

  @media (min-width: 600px) {
    .freeship-promo-banner {
      min-height: 240px;
    }
  }

  @media (min-width: 768px) {
    .freeship-promo-banner {
      min-height: 105px;
      background-image: url('https://www.pennstateind.com/mm5/images/banners/2025-Cyber-Monday-Sale/2025-free-shipping-full.png'); /* replace with your final desktop image */
    }
  }

  @media (min-width: 1200px) {
    .freeship-promo-banner {
      min-height: 180px;
    }
  }
    
@media (min-width: 1700px) {
    .freeship-promo-banner {
      min-height: 180px;
    }
  }


/* FREE SHIPPING under $49 HOME BANNER  */


/* top thin Banner CSS */ 

.promo-banner {
    width: 100%;
    box-sizing: border-box;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  }

  .promo-inner {
    max-width: 100%;
    margin: 0 auto;
    background: #A81D34;
    color: #ffffff;
    padding: 2px 14px 6px;
    text-align: center;
  }

  .promo-header {
    margin: 0 0 2px;
  }
    
    .promo-header-text {
    font-size: 1.8rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin: 0 0 2px;
  }

  .promo-subheader {
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    margin: 0 0 0px;
  }

  /* Optional tweak for very small screens */
  @media (max-width: 480px) {
    .promo-header {
      font-size: 1.6rem;
    }
    .promo-subheader {
      font-size: 0.85rem;
    }
  }


/* homepage banner 2 to 1 column CSS */

    .homepage-promo-row {
      display: flex;
      gap: 0px;         /* space between columns */
      background-color: #ac233b;
      margin-bottom: 16px;
    }

    .homepage-promo-column {
      flex: 1;             /* each column takes equal space */
      box-sizing: border-box;
      padding: 0;
      background: #fff;
      border: 0px solid #ddd;
      border-radius: 4px;
      text-align: center;
    }

    /* On small screens, stack into one column */
    @media (max-width: 600px) {
      .homepage-promo-row {
        flex-direction: column;
      }
    }


    /* BLACK FRIDAY CSS Nov 24 2025 */

  .BFS-top-promo-banner {
    width: 100%;
    background: #26231F;
    color: #ffffff;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
    box-sizing: border-box;
  }

  .BFS-top-promo-inner {
    max-width: 800px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    text-align: center;
    padding: 2px 0 3px;
  }

  .BFS-promo-col {
    padding: 0px 7px;
    box-sizing: border-box;
    margin: 6px 0 8px;
  }
    
    #border {border-right-width: 1px; border-right-style: solid; padding-left: 0rem; padding-right: 0rem;}
    #add-padding {padding-left: 0rem; padding-right: 4rem; }
    #arrow-link {font-weight: 900; color: #fff; text-decoration: none; font-weight: 200;}
    #give-promo-trigger-space {position: relative; left: 1.5rem; text-decoration: underline !important;}

  /* Desktop layout */
  @media (min-width: 768px) {
    .BFS-top-promo-inner {
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
    }
      
      #give-promo-trigger-space {left: 10%; }

    /* Vertical divider */
    .BFS-promo-divider {
      width: 2px;
      margin: 10px 0;
      height: calc(100% - 6px);
    }
      
    #border {border-right-width: 1px; border-right-style: solid; padding-left: 0rem; padding-right: 4rem;}
  }



/* BIG BANNER CSS */

 .BlackF-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
  }

  .BlackF-promo-banner {
    width: 100%;
    min-height: 340px; /* adjust if needed */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/2025-Cyber-Monday-Sale/Black-Friday-Large-banner-mobile-image.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 14px;
  }

  @media (min-width: 600px) {
    .BlackF-promo-banner {
      min-height: 450px;
    }
  }

  @media (min-width: 768px) {
    .BlackF-promo-banner {
      min-height: 300px;
      background-image: url('https://www.pennstateind.com/mm5/images/banners/2025-Cyber-Monday-Sale/Black-Friday-Large-banner-image-1.webp'); /* replace with your final desktop image */
    }
  }

  @media (min-width: 1200px) {
    .BlackF-promo-banner {
      min-height: 420px;
    }
  }
    
@media (min-width: 1700px) {
    .BlackF-promo-banner {
      min-height: 430px;
    }
  }


/* SALE CATEGORIES BANNER CSS */

    .BFS-promo-grid-wrap {
    width: 100%;
    box-sizing: border-box;
    padding: 12px 16px;
    background: #ffffff; /* white background */
  }

  .BFS-promo-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;    /* 1 column mobile */
    gap: 12px;
  }

  .BFS-promo-item {
    background: #A81D34; /* red background */
    padding: 10px;
    box-sizing: border-box;
    border-radius: 16px;  /* optional – remove if not needed */
  }

  .BFS-promo-item img {
    display: block;
    width: 100%;
    height: auto;
    border: 0;
  }

  /* Desktop: 3 columns */
  @media (min-width: 768px) {
    .BFS-promo-grid {
      grid-template-columns: repeat(3, 1fr);
    }
  }



/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
/* 12 DAYS OF DEALS PAGE CSS */


 /* Header */
  .page-header {
    text-align: center;
    padding: 20px 0px 10px;
    font-size: 2.4rem;
    font-weight: 700;
    background: #ffffff;
  }
	
	#page-header-masthead {margin: 0 auto; width: 40%;}

  /* Grid wrapper */
  .grid-wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 columns desktop */
    gap: 20px;
    padding: 0px 20px;
    max-width: 1400px;
    margin: 0 auto;
  }

  /* Grid items */
  .grid-item a {
    display: block;
    width: 100%;
    height: 100%;
  }

  .grid-item img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 6px;
    overflow: hidden;
  }

  /* Mobile: 1 column */
  @media (max-width: 768px) {
    .grid-wrap {
      grid-template-columns: 1fr;
	
    }
	  
	#page-header-masthead {width: 75%;}
  }
	
  /* Mobile  */
  @media (max-width: 440px) {
    .grid-wrap {
      grid-template-columns: 1fr;
	
    }
	  
	#page-header-masthead {width: 70%;}
  }


/* 12 DAYS OF DEALS PAGE CSS */ /* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/



/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
/* 12 DAYS OF DEALS TOP BANNER CSS */

.DOD-top-promo-banner {
    width: 100%;
    background: #a6192e;
    color: #ffffff;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
    box-sizing: border-box;
  }

  .DOD-top-promo-inner {
    max-width: 900px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    text-align: center;
    padding: 2px 0 3px;
  }

  .DOD-promo-col {
    padding: 0px 7px;
    box-sizing: border-box;
    margin: 6px 0 8px;
  }
    
    #DOD-border {border-right-width: 1px; border-right-style: solid; padding-left: 0rem; padding-right: 0rem;}
    #DOD-add-padding {padding-left: 0rem; padding-right: 4rem; }
    #DOD-arrow-link {font-weight: 900; color: #fff; text-decoration: none; font-weight: 200;}
    #DOD-give-promo-trigger-space {position: relative; left: 1.2rem; text-decoration: underline !important;}
	#DOD-give-promo-trigger-space2 {position: relative; left: 1.2rem; text-decoration: underline !important;}
	

  /* Desktop layout */
  @media (min-width: 768px) {
    .DOD-top-promo-inner {
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
    }
      
      #DOD-give-promo-trigger-space {left: 12%; }
	  #DOD-give-promo-trigger-space2 {left: 12%; }

    /* Vertical divider */
    .DOD-promo-divider {
      width: 2px;
      margin: 10px 0;
      height: calc(100% - 6px);
    }
      
    #DOD-border {border-right-width: 1px; border-right-style: solid; padding-left: 0rem; padding-right: 4rem;}
  }


/* 12 DAYS OF DEALS TOP BANNER CSS */ /* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/



dayodeals-promo-banner {
    width: 100%;
    box-sizing: border-box;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  }

.dayodeals-promo-inner {
    max-width: 100%;
    margin: 0 auto;
    background: #A81D34;
    color: #ffffff;
    padding: 10px 14px 12px;
    text-align: center;
  }

.dayodeals-promo-header {
    margin: 0 0 2px;
  }
    
.dayodeals-promo-header-text {
    font-size: 1.7rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin: 0 0 2px;
  }
	
.dayodeals-promo-header-text2 {
    font-size: 1.5rem;
    font-weight: 400;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin: 0 20px 2px;
  }
	
.dayodeals-promo-header-text-links {
    font-size: 1.258rem;
    font-weight: 200;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin: 0 0 2px;
	color: #FFFF00;
  }

.dayodeals-promo-subheader {
    font-size: 11px !important; 
	  font: 100 normal !important; 
	  font-family: Roboto, Helvetica, Arial, sans-serif !important; 
	  padding-left: .5rem;
	  letter-spacing: normal;
  }

  /* Optional tweak for very small screens */
  @media (max-width: 480px) {
	  
.dayodeals-promo-header {
      font-size: 1.4rem;
    }
	  
.dayodeals-promo-header-text {
    font-size: 1.8rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin: 0 12% 2px;
  }
	  
.dayodeals-promo-header-text2 {
	margin: 0 2% 0;
	
	  }
	  
.dayodeals-promo-header-link {
	margin: 0 2% 0;
	
	  }
	  
.dayodeals-promo-subheader {
      font-size: 16px;
    }
  }
	
	
  /* Optional tweak for very small screens */
  @media (max-width: 420px) {
	  
.dayodeals-promo-header {
      font-size: 1.4rem;
    }
	  
.dayodeals-promo-header-text {
    font-size: 1.8rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin: 0 8% 2px;
  }
	  
.dayodeals-promo-header-text2 {
	margin: 0 2% 0;
	
	  }
	  
.dayodeals-promo-header-link {
	margin: 0 2% 0;
	
	  }
	  
.dayodeals-promo-subheader {
      font-size: 16px;
    }
  }


/* DAY 11 TOP BANNER */


.dayodeals-dayeleven-promo-banner {
    width: 100%;
    box-sizing: border-box;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  }

  .dayodeals-dayeleven-promo-inner {
    max-width: 100%;
    margin: 0 auto;
    background: #A81D34;
    color: #ffffff;
    padding: 10px 14px 12px;
    text-align: center;
  }

  .dayodeals-dayeleven-promo-header {
    margin: 0 0 2px;
  }
    
    .dayodeals-dayeleven-promo-header-text {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin: 0 0 2px;
  }

  .dayodeals-dayeleven-promo-subheader {
    font-size: 12px !important; 
	  font: 100 normal !important; 
	  font-family: Roboto, Helvetica, Arial, sans-serif !important; 
	  padding-left: .5rem;
	  letter-spacing: normal;
  }

  /* Optional tweak for very small screens */
  @media (max-width: 480px) {
    .dayodeals-dayeleven-promo-header {
      font-size: 1.4rem;
    }
    .dayodeals-dayeleven-promo-subheader {
      font-size: 16px;
    }
  }



/*   DAY 6 TOP BANNER   */

.dayodeals-six-promo-banner {
    width: 100%;
    box-sizing: border-box;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  }

  .dayodeals-six-promo-inner {
    max-width: 100%;
    margin: 0 auto;
    background: #A81D34;
    color: #ffffff;
    padding: 10px 14px 12px;
    text-align: center;
  }

  .dayodeals-six-promo-header {
    margin: 0 0 2px;
  }
    
    .dayodeals-six-promo-header-text {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin: 0 0 2px;
  }

  .dayodeals-six-promo-subheader {
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: normal;
    margin: 0 0 0px;
  }

  /* Optional tweak for very small screens */
  @media (max-width: 480px) {
    .dayodeals-six-promo-header {
      font-size: 1.4rem;
    }
    .dayodeals-six-promo-subheader {
      font-size: 16px;
    }
  }


/* DAY 7 HOME BANNER.  */



#daysofdeals-seven-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
	  
  }

  /* Aspect-ratio box for auto height */
  .daysofdeals-seven-promo-banner {
    width: 100%;
    aspect-ratio: 1 / .55; /* adjust to match your image's shape */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-dealer-home-banner-mobile-day7.gif');
    background-size: contain;   /* ensures entire image stays visible */
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }

  /* Swap to desktop image */
  @media (min-width: 600px) {
    .daysofdeals-seven-promo-banner {
      aspect-ratio: 1 / .18; /* desktop aspect ratio */
      background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-deals-home-banner-day7.gif');
      background-size: cover; /* optional: cover fills space more nicely */
    }
  }


/* DAY 8 HOME BANNER */



#daysofdeals-eight-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
	  
  }

  /* Aspect-ratio box for auto height */
  .daysofdeals-eight-promo-banner {
    width: 100%;
    aspect-ratio: 1 / .55; /* adjust to match your image's shape */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-dealer-home-banner-mobile-day8.gif');
    background-size: contain;   /* ensures entire image stays visible */
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }

  /* Swap to desktop image */
  @media (min-width: 600px) {
    .daysofdeals-eight-promo-banner {
      aspect-ratio: 1 / .18; /* desktop aspect ratio */
      background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-deals-home-banner-day008.gif');
      background-size: cover; /* optional: cover fills space more nicely */
    }
  }


/* DAY 9 HOME BANNER. */

#daysofdeals-nine-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
	  
  }

  /* Aspect-ratio box for auto height */
  .daysofdeals-nine-promo-banner {
    width: 100%;
    aspect-ratio: 1 / .55; /* adjust to match your image's shape */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-dealer-home-banner-mobile-day9.gif');
    background-size: contain;   /* ensures entire image stays visible */
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }

  /* Swap to desktop image */
  @media (min-width: 600px) {
    .daysofdeals-nine-promo-banner {
      aspect-ratio: 1 / .18; /* desktop aspect ratio */
      background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-deals-home-banner-day9.gif');
      background-size: cover; /* optional: cover fills space more nicely */
    }
  }


/* DAY 10 HOME BANNER */


#daysofdeals-ten-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
	  
  }

  /* Aspect-ratio box for auto height */
  .daysofdeals-ten-promo-banner {
    width: 100%;
    aspect-ratio: 1 / .55; /* adjust to match your image's shape */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-dealer-home-banner-mobile-day10.gif');
    background-size: contain;   /* ensures entire image stays visible */
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }

  /* Swap to desktop image */
  @media (min-width: 600px) {
    .daysofdeals-ten-promo-banner {
      aspect-ratio: 1 / .18; /* desktop aspect ratio */
      background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-deals-home-banner-day10.gif');
      background-size: cover; /* optional: cover fills space more nicely */
    }
  }


/* DAY 11 HOME BANNER */


#daysofdeals-eleven-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
	  
  }

  /* Aspect-ratio box for auto height */
  .daysofdeals-eleven-promo-banner {
    width: 100%;
    aspect-ratio: 1 / .55; /* adjust to match your image's shape */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-dealer-home-banner-mobile-day11.gif');
    background-size: contain;   /* ensures entire image stays visible */
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }

  /* Swap to desktop image */
  @media (min-width: 600px) {
    .daysofdeals-eleven-promo-banner {
      aspect-ratio: 1 / .18; /* desktop aspect ratio */
      background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-deals-home-banner-day11.gif');
      background-size: cover; /* optional: cover fills space more nicely */
    }
  }




/* DAY 12 HOME BANNER.  */



 #daysofdeals-twelve-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
	  
  }

  /* Aspect-ratio box for auto height */
  .daysofdeals-twelve-promo-banner {
    width: 100%;
    aspect-ratio: 1 / .55; /* adjust to match your image's shape */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-dealer-home-banner-mobile-day12.gif');
    background-size: contain;   /* ensures entire image stays visible */
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }

  /* Swap to desktop image */
  @media (min-width: 600px) {
    .daysofdeals-twelve-promo-banner {
      aspect-ratio: 1 / .18; /* desktop aspect ratio */
      background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-deals-home-banner-day012.gif');
      background-size: cover; /* optional: cover fills space more nicely */
    }
  }




/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
/* 12 DAYS OF DEALS HOME BANNER CSS */



#daysofdeals-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
	  
  }

  /* Aspect-ratio box for auto height */
  .daysofdeals-promo-banner {
    width: 100%;
    aspect-ratio: 1 / .55; /* adjust to match your image's shape */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-dealer-home-banner-mobile-day05new.gif');
    background-size: contain;   /* ensures entire image stays visible */
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }

  /* Swap to desktop image */
  @media (min-width: 600px) {
    .daysofdeals-promo-banner {
      aspect-ratio: 1 / .16; /* desktop aspect ratio */
      background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-deals-home-banner-day05new.gif');
      background-size: cover; /* optional: cover fills space more nicely */
    }
  }


/*.  DAY 6 HOME BANNER CSS   */

#daysofdeals-six-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
	  
  }

  /* Aspect-ratio box for auto height */
  .daysofdeals-six-promo-banner {
    width: 100%;
    aspect-ratio: 1 / .55; /* adjust to match your image's shape */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-dealer-home-banner-mobile-day6.gif');
    background-size: contain;   /* ensures entire image stays visible */
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }

  /* Swap to desktop image */
  @media (min-width: 600px) {
    .daysofdeals-six-promo-banner {
      aspect-ratio: 1 / .18; /* desktop aspect ratio */
      background-image: url('https://www.pennstateind.com/mm5/images/banners/12-days-of-deals-2025/12-days-of-deals-home-banner-day6.gif');
      background-size: cover; /* optional: cover fills space more nicely */
    }
  }






/* 12 DAYS OF DEALS MAIN BANNER CSS */ /* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/



/* 2025 END OF YEAR SALE STYLES */
/*///////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////*/




#end-of-year-sale-promo-banner-link {
    display: block;
    width: 100%;
    text-decoration: none;
	  
  }

  /* Aspect-ratio box for auto height */
  .end-of-year-sale-promo-banner {
    width: 100%;
    aspect-ratio: 1 / .64; /* adjust to match your image's shape */
    background-image: url('https://www.pennstateind.com/mm5/images/banners/BuyMoreSaveMore2026/BuyMoreSaveMore_header2026-mobile.webp');
    background-size: contain;   /* ensures entire image stays visible */
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }

  /* Swap to desktop image */
  @media (min-width: 600px) {
    .end-of-year-sale-promo-banner {
      aspect-ratio: 1 / .13; /* desktop aspect ratio */
      background-image: url('https://www.pennstateind.com/mm5/images/banners/BuyMoreSaveMore2026/BuyMoreSaveMore_header2026.webp');
      background-size: cover; /* optional: cover fills space more nicely */
    }
  }




/* END OF 2025 END OF YEAR SALE STYLES */
/*///////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////*/






      /*///////////////////////////////////////////////////////////////////////////
//////////////////////////        20 OFF WHEN YOU SPEND 100        ///////////////////
/////////////////////////////////////////////////////////////////////////////////////////
///////////////////////       DATE: JUNE 8 2026 >>> JUNE 15 2026      ///////////////////
//////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////*/


.psi-20off-top-promo {
  background: #26231f;
  text-align: center;
  padding: 7px 12px;
  line-height: 1;
}

.psi-20off-promo-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  color: inherit;
  text-decoration: none;
  flex-wrap: wrap;
}

.psi-20off-promo-amount {
  color: #ffd15a;
  font-family: Open Sans, "Arial Black", sans-serif;
  font-size: clamp(28px, 3vw, 44px);
  font-weight: 900;
  letter-spacing: 1px;
  text-shadow: 2px 2px 0 #000;
}

.psi-20off-promo-condition {
  background: #d8d8d8;
  color: #1f1f1f;
  font-family: Open Sans, "Arial Black", sans-serif;
  font-size: clamp(18px, 2vw, 30px);
  font-weight: 900;
  letter-spacing: 1px;
  padding: 5px 12px 4px;
  box-shadow: 2px 2px 0 #000;
}

.psi-20off-promo-details {
  color: #ffffff;
  font-size: 12px;
  text-decoration: underline;
  opacity: 0.85;
  align-self: flex-end;
  margin-bottom: 5px;
}

@media (max-width: 600px) {
  .psi-20off-top-promo {
    padding: 10px 8px;
  }

  .psi-20off-promo-link {
    gap: 6px 10px;
  }

  .psi-20off-promo-amount {
    width: 100%;
    font-size: 34px;
  }

  .psi-20off-promo-condition {
    font-size: 18px;
  }

  .psi-20off-promo-details {
    font-size: 11px;
    margin-bottom: 3px;
  }
}


 .psi-20off-promo-group {
        background-color: #ac233b;
        margin-bottom: 10px
    }
    .psi-20off-promo-left {
        float: left;
        width: 50%;
    }
    .psi-20off-promo-right {
        float: right;
        width: 50%;
    }
    .psi-20off-promo-img {
        max-width: 100%;
        height: auto;
        margin: 0px;
        padding: 0px;
    }
    .psi-20off-group:after {
        content:"";
        display: table;
        clear: both;
    }
    @media screen and (max-width: 480px) {
        .psi-20off-promo-left, .psi-20off-promo-right {
            float: none;
            width: auto;
        }
    }



/*//////////////////////////////////////////////////////////////////////////////////
    ///////////////      EMD OF $20 OFF WHEN YOU SPEND $100      ///////////////
//////////////////////////////////////////////////////////////////////////////////*/






/*//////////////////////////////////////////////////////////////////////////////////
    ///////////////      START OF NEXT ORDER FREE     ///////////////
//////////////////////////////////////////////////////////////////////////////////*/


.psi-next-free-banner,
.psi-next-free-banner * {
  box-sizing: border-box;
}

.psi-next-free-banner {
  width: 100%;
  background: #A6192E;
  color: #fff;
  font-family: Inter, Arial, Helvetica, sans-serif;
}

.psi-next-free-inner {
  max-width: 1120px;
  min-height: 84px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: auto 1px minmax(190px, 1fr) 1px minmax(190px, 1fr) auto;
  align-items: center;
  column-gap: 34px;
}

.psi-next-free-title {
  font-size: 28px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -0.5px;
  text-transform: uppercase;
  white-space: nowrap;
}

.psi-next-free-title span {
  color: #ffc928;
}

.psi-next-free-break {
  display: none;
}

.psi-next-free-divider {
  width: 1px;
  height: 38px;
  background: rgba(255, 255, 255, 0.85);
}

.psi-next-free-item {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.psi-next-free-item img {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display: block;
}

.psi-next-free-item p {
  margin: 0;
  font-size: 13px;
  line-height: 1.2;
  font-weight: 400;
}

.psi-next-free-details {
  color: #fff;
  font-size: 12px;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.psi-next-free-details:hover {
  text-decoration: underline;
}


/* Tablet */
@media (min-width: 641px) and (max-width: 980px) {
  .psi-next-free-inner {
    max-width: none;
    min-height: 98px;
    padding: 18px 40px 12px;
    grid-template-columns: 205px 1px minmax(170px, 1fr) 1px minmax(200px, 1fr);
    grid-template-rows: auto auto;
    column-gap: 28px;
    row-gap: 8px;
    align-items: center;
  }

  .psi-next-free-title {
    grid-column: 1;
    grid-row: 1 / span 2;
    font-size: 22px;
    line-height: 0.98;
    white-space: normal;
  }

  .psi-next-free-break {
    display: block;
  }

  .psi-next-free-divider:nth-of-type(1) {
    grid-column: 2;
    grid-row: 1 / span 2;
  }

  .psi-next-free-refund {
    grid-column: 3;
    grid-row: 1;
  }

  .psi-next-free-divider:nth-of-type(2) {
    grid-column: 4;
    grid-row: 1 / span 2;
  }

  .psi-next-free-date {
    grid-column: 5;
    grid-row: 1;
  }

  .psi-next-free-details {
    grid-column: 5;
    grid-row: 2;
    justify-self: end;
    align-self: start;
  }

  .psi-next-free-item {
    gap: 12px;
  }

  .psi-next-free-item img {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  .psi-next-free-item p {
    font-size: 12px;
  }
}


/* Mobile */
@media (max-width: 640px) {
  .psi-next-free-inner {
    max-width: 375px;
    min-height: 236px;
    padding: 15px 20px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 19px;
  }

  .psi-next-free-title {
    font-size: 29px;
    line-height: 1.02;
    text-align: center;
    white-space: normal;
  }

  .psi-next-free-break {
    display: block;
  }

  .psi-next-free-divider {
    display: none;
  }

  .psi-next-free-item {
    width: 255px;
    gap: 11px;
    align-items: flex-start;
  }

  .psi-next-free-item img {
    width: 27px;
    height: 27px;
    flex-basis: 27px;
  }

  .psi-next-free-item p {
    font-size: 13px;
    line-height: 1.25;
	text-align: center;
  }

  .psi-next-free-details {
    width: 255px;
    font-size: 12px;
    margin-top: 1px;
  }
}


/*//////////////////////////////////////////////////////////////////////////////////
    ///////////////      EMD OF NEXT ORDER FREE       ///////////////
//////////////////////////////////////////////////////////////////////////////////*/





/*//////////////////////////////////////////////////////////////////////////////////
    ///////////////      PSI PROMO UNDER NAV BANNER      ///////////////
//////////////////////////////////////////////////////////////////////////////////*/

    * {
      box-sizing: border-box;
    }

    .psi-promo-category-nav {
      width: 100%;
      background: #a6192e;
	  font-family: Arial, Helvetica, sans-serif;
    }

    .psi-promo-category-nav__list {
      display: flex;
      align-items: stretch;
      justify-content: center;
      width: 100%;
      max-width: 1400px;
      min-height: 48px;
      margin: 0 auto;
      padding: 0;
      list-style: none;
    }

    .psi-promo-category-nav__item {
      position: relative;
      display: flex;
      margin: 0;
      padding: 0;
    }

    /* Desktop dividers */
    .psi-promo-category-nav__item:not(:last-child)::after {
      content: "";
      position: absolute;
      top: 0;
      right: 0;
      width: 2px;
      height: 100%;
      background: rgba(255, 255, 255, 0.9);
      pointer-events: none;
    }

    .psi-promo-category-nav__link {
      display: flex;
      flex: 1 1 auto;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      min-height: 48px;
      padding: 7px 15px;
      color: #ffffff;
      font-size: 14px;
      line-height: 1.1;
      font-weight: 700;
      letter-spacing: 0.4px;
      text-align: center;
      text-decoration: none;
      text-transform: uppercase;
      white-space: nowrap;
      transition: background-color 160ms ease;
    }

    .psi-promo-category-nav__discount {
      margin-top: 2px;
      font-size: 0.92em;
      font-weight: 300;
    }

    .psi-promo-category-nav__link:hover,
    .psi-promo-category-nav__link:focus-visible,
    .psi-promo-category-nav__link:active,
    .psi-promo-category-nav__link.is-active {
      background: rgba(255, 255, 255, 0.1);
    }

    .psi-promo-category-nav__link:focus-visible {
      outline: 2px solid #ffffff;
      outline-offset: -4px;
    }

    /* Slightly emphasize ALL SALE */
    .psi-promo-category-nav__item--all-sale {
      background: #a6192e;
    }

    .psi-promo-category-nav__link--all-sale {
      font-size: 15px;
      letter-spacing: 0.7px;
    }

    /*
      TABLET
      First six links: three columns and two rows.
      ALL SALE: fourth column spanning both rows.
    */
    @media (max-width: 999px) {
      .psi-promo-category-nav__list {
        display: grid;
        grid-template-columns:
          repeat(3, minmax(0, 1fr))
          minmax(140px, 1.1fr);
        grid-template-rows: repeat(2, minmax(54px, auto));
        min-height: auto;
      }

      .psi-promo-category-nav__item {
        min-width: 0;
        border: 0;
      }

      .psi-promo-category-nav__item::after {
        display: none;
      }

      /* Vertical dividers for the first six links */
      .psi-promo-category-nav__item:nth-child(-n + 6) {
        border-right: 2px solid rgba(255, 255, 255, 0.65);
      }

      /* Horizontal divider between tablet rows */
      .psi-promo-category-nav__item:nth-child(-n + 3) {
        border-bottom: 2px solid rgba(255, 255, 255, 0.65);
      }

      .psi-promo-category-nav__item--all-sale {
        grid-column: 4;
        grid-row: 1 / span 2;
      }

      .psi-promo-category-nav__link {
        width: 100%;
        min-width: 0;
        min-height: 54px;
        padding: 8px 10px;
        white-space: normal;
      }

      .psi-promo-category-nav__link--all-sale {
        height: 100%;
        padding-inline: 16px;
      }
    }

    /*
      MOBILE
      First six links: two columns and three rows.
      ALL SALE: full-width fourth row.
    */
    @media (max-width: 599px) {
      .psi-promo-category-nav__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
        grid-auto-rows: minmax(68px, auto);
      }

      .psi-promo-category-nav__item {
        grid-column: auto;
        grid-row: auto;
        border: 0;
      }

      /* Vertical divider between the first six links */
      .psi-promo-category-nav__item:nth-child(1),
      .psi-promo-category-nav__item:nth-child(3),
      .psi-promo-category-nav__item:nth-child(5) {
        border-right: 2px solid rgba(255, 255, 255, 0.65);
      }

      /* Dividers between all four mobile rows */
      .psi-promo-category-nav__item:nth-child(-n + 6) {
        border-bottom: 2px solid rgba(255, 255, 255, 0.65);
      }

      .psi-promo-category-nav__item--all-sale {
        grid-column: 1 / -1;
        grid-row: 4;
        min-height: 58px;
      }

      .psi-promo-category-nav__link {
        min-height: 68px;
        padding: 8px 10px;
        font-size: 13px;
        line-height: 1.15;
      }

      .psi-promo-category-nav__link--all-sale {
        min-height: 58px;
        font-size: 15px;
      }
    }




/*//////////////////////////////////////////////////////////////////////////////////
    ///////////////     END OF PSI PROMO UNDER NAV BANNER        ///////////////
//////////////////////////////////////////////////////////////////////////////////*/






/*//////////////////////////////////////////////////////////////////////////////////
    ///////////////      ABOVE NAV PROMO THIN BANNER       ///////////////
//////////////////////////////////////////////////////////////////////////////////*/


/* Shared base: change these values and the offer copy for each campaign. */
    .psi-promo-above-nav--with-deadline {
  --psi-promo-background: #a6192e;
  --psi-promo-color: #ffffff;
  --psi-promo-font: "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
  --psi-promo-offer-size: 2.5rem; /* 40px desktop heading only */
  --psi-promo-support-size: 1rem; /* 16px supporting copy */
  --psi-promo-details-size: 1.125rem; /* 18px desktop details */

  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  background: var(--psi-promo-background);
  color: var(--psi-promo-color);
  font-family: var(--psi-promo-font);
}

.psi-promo-above-nav--with-deadline,
.psi-promo-above-nav--with-deadline *,
.psi-promo-above-nav--with-deadline *::before,
.psi-promo-above-nav--with-deadline *::after {
  box-sizing: border-box;
}

.psi-promo-above-nav--with-deadline .psi-promo-above-nav__inner {
  display: grid;
  grid-template-columns: minmax(6.5rem, 1fr) minmax(0, auto) minmax(6.5rem, 1fr);
  align-items: center;
  column-gap: 1rem;
  width: 100%;
  max-width: 1400px;
  min-height: 54px;
  margin-inline: auto;
  padding: 6px clamp(12px, 3.5vw, 50px);
  font-family: inherit;
}

.psi-promo-above-nav--with-deadline .psi-promo-above-nav__main {
  grid-column: 2;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 16px;
  min-width: 0;
  font-family: inherit;
  text-align: left;
}

.psi-promo-above-nav--with-deadline .psi-promo-above-nav__offer {
  margin: 0;
  padding: 0;
  color: inherit;
  font-family: var(--psi-promo-font);
  font-size: var(--psi-promo-offer-size);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  white-space: nowrap;
}

.psi-promo-above-nav--with-deadline .psi-promo-above-nav__supplement {
  min-width: 0;
  margin: 0;
  padding: 0;
  color: inherit;
  font-family: var(--psi-promo-font);
  font-size: var(--psi-promo-support-size);
  font-weight: 400;
  line-height: 1.25;
  text-align: left;
  text-wrap: wrap;
  overflow-wrap: normal;
}

.psi-promo-above-nav--with-deadline .psi-promo-above-nav__line {
  display: block;
  margin: 0;
  padding: 0;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}

.psi-promo-above-nav--with-deadline .psi-promo-above-nav__nowrap {
  white-space: nowrap;
}

.psi-promo-above-nav--with-deadline .psi-promo-above-nav__details {
  grid-column: 3;
  justify-self: end;
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  margin: 0;
  padding: 6px 4px;
  border: 0;
  border-radius: 2px;
  appearance: none;
  background: transparent;
  color: inherit;
  font-family: var(--psi-promo-font);
  font-size: var(--psi-promo-details-size);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: normal;
  text-align: center;
  text-transform: none;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  white-space: nowrap;
  cursor: pointer;
}

.psi-promo-above-nav--with-deadline .psi-promo-above-nav__details:hover {
  background: rgb(255 255 255 / 12%);
  text-decoration-thickness: 2px;
}

.psi-promo-above-nav--with-deadline .psi-promo-above-nav__details:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* Tablet: keep the main message centered; details stay to the right. */
@media (max-width: 999px) {
  .psi-promo-above-nav--with-deadline {
    --psi-promo-offer-size: 2rem; /* 32px heading */
    --psi-promo-details-size: 1rem; /* 16px details */
  }

  .psi-promo-above-nav--with-deadline .psi-promo-above-nav__inner {
    padding-block: 7px;
  }

  .psi-promo-above-nav--with-deadline .psi-promo-above-nav__main {
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
  }

  .psi-promo-above-nav--with-deadline .psi-promo-above-nav__supplement {
    text-align: center;
  }
}

/* Mobile: heading on row one; two detail lines left, trigger right. */
@media (max-width: 599px) {
  .psi-promo-above-nav--with-deadline {
    --psi-promo-offer-size: 1.625rem; /* 26px mobile heading only */
    --psi-promo-details-size: 0.875rem; /* 14px details */
  }

  .psi-promo-above-nav--with-deadline .psi-promo-above-nav__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 12px;
    row-gap: 6px;
    min-height: 0;
    padding: 10px 12px;
  }

  .psi-promo-above-nav--with-deadline .psi-promo-above-nav__main {
    display: contents;
  }

  .psi-promo-above-nav--with-deadline .psi-promo-above-nav__offer {
    grid-column: 1 / -1;
    grid-row: 1;
    line-height: 1.15;
    text-align: center;
  }

  .psi-promo-above-nav--with-deadline .psi-promo-above-nav__supplement {
    grid-column: 1;
    grid-row: 2;
    text-align: left;
  }

  .psi-promo-above-nav--with-deadline .psi-promo-above-nav__details {
    grid-column: 2;
    grid-row: 2;
    min-height: 40px;
  }
}

/*//////////////////////////////////////////////////////////////////////////////////
  ///////////////     END OF ABOVE NAV PROMO THIN BANNER          ///////////////
//////////////////////////////////////////////////////////////////////////////////*/
