/* 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      ///////////////
//////////////////////////////////////////////////////////////////////////////////*/