body {
  font-family: Helvetica,Arial,sans-serif;
  color: #000;
  background-color: #FFF;
}

body, html {

  height: 100%;

  margin: 0;

}
 
  /* Home page - Why bROK */
  .whybrok {background-color: #000; color: #fff; background-image:url( '../images/red-bar-with-grit.jpg');} 
  
   /* Home page - Product Categories */
   .productCategoryContainer {background-color: #000; color: #fff;}
  
.homeFeatureProducts a.add-to-cart { color:#FFF!important;}
.loop-action a.add-to-cart { color:#FFF!important;}

        /* Caption box */
        .carousel-caption {
            position: absolute;
            left: 10%;
            top: 50%;
            transform: translateY(-50%);
            text-align: left;
            color: white;
            background: rgba(0, 0, 0, 1);
            padding: 20px;
            box-shadow: 26px 26px 0px rgba(218,38,46,0.81); /* No blur, square corners */
            max-width: 300px;
        } 
  
  /* Home page - Featured Products */
  
  .greyLightText
  { color:#909090;}
  .greyDarkText
  { color:#4C4C4C;}
   .greyLightBackground
  { background-color:#D8D8D8;} 
  
  /* Home page - Innovation Tabs */

        .homeTabs .tabs-container {
            width: 100%; /* Ensure it spans full width */
            max-width: 100%; /* Remove any max-width restriction */
            background: white;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            text-align: center;
        }
        
        .homeTabs .tabs {
            display: flex;
            width: 100%;
        }
        
        .homeTabs .tab-button {
            flex-grow: 1;
            padding: 20px; font-size:18px;
            background: #EBEBEB;
            color: #828282;
            border: none;
            cursor: pointer;
            transition: background 0.3s;
            text-align: center;
            width: 100%; /* Ensures full-width buttons */
        }

        .homeTabs .tab-button.active {
            background: #da262e; color: white;
        }

        /* Tab content */
        .homeTabs .tab-content {
            display: none;
            font-size: 18px;
            padding: 20px;
            border-radius: 5px; min-height: 450px; max-height: 550px;
        }

        .homeTabs .tab-content.active {
            display: block; 
        }

        /* Navigation buttons */
        .homeTabs .nav-button {
            width: 30px;
            height: 30px;
            background: grey;
            border: none;
            cursor: pointer;
            clip-path: polygon(100% 50%, 0% 100%, 0% 0%);
            transition: background 0.3s;
        }

        .homeTabs .nav-button:hover {
            background: darkgrey;
        }

        .homeTabs .prev {
            transform: rotate(180deg);
        }

        /* Centering the nav buttons */
        .homeTabs .nav-buttons {
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .homeTabs .nav-buttons .prev {
            margin-right: 10px;
        }

        .homeTabs .nav-buttons .next {
            margin-left: 10px;
        }






  /* Home page - School of bROK */
.blackGritBack { background: url('../images/black-grit-background-3.gif') center / cover no-repeat; background-color: #404040;}
.resource-head { font-size: 34px; font-weight: bold;}
  .resource-link {
    text-decoration: none; /* Remove underline */
    color: #fff; /* Default text color */
    display: flex;
    flex-direction: column;
    align-items: center; font-size: 22px;
  }

  .resource-link:hover {
    color: red; /* Change text color on hover */
  }

  .resource-link img {
    margin-bottom: 5px;
    transition: filter 0.3s ease-in-out; /* Smooth effect */
  }

.resource-link:hover img {
  /* Apply the circular glow effect with a soft shadow */
  /*box-shadow: 0 0 15px rgba(255, 0, 0, 0.8); /* Red glow */
  /*border-radius: 50%; /* Makes the glow circular */
  /*transition: box-shadow 0.3s ease;*/
  filter: invert(5%) sepia(40%) saturate(400%) hue-rotate(0deg); 
}


  /* Home page - Why bROK */

  .redbutWithOutline
   { letter-spacing: 1px; /* Adjust the spacing as needed */
    border-radius:0px!important;
    border:1px solid #ffffff!important;
    display:inline-block;
    font-size:17px!important;
    background-color:  #d31634!important; /* Change the color to whatever you want */
    color: white;
    padding:12px 18px!important;
    cursor: pointer;
    transition: background-color 0.3s ease;
    position: relative; /* Ensure proper stacking */
    z-index: 1; /* Higher z-index to ensure button is above image */    
  }
  
  .redbutWithOutline:hover { background-color: #860303!important; }
  
  /* Home page - Innovation */

  .redbutBlackText
   { font-weight: bold!important;
     letter-spacing: 1px; /* Adjust the spacing as needed */
    border-radius:0px!important;
    border:1px solid #ffffff!important;
    display:inline-block;
    font-size:17px!important;
    background-color:  #d31634!important; /* Change the color to whatever you want */
    color: black!important;
    padding:12px 28px!important;
    cursor: pointer;
    transition: background-color 0.3s ease;
    position: relative; /* Ensure proper stacking */
    z-index: 1; /* Higher z-index to ensure button is above image */    
  }
  
  .redbutBlackText:hover { background-color: #860303!important; color: white!important; }
 



 @media only screen and (min-width: 0px) and (max-width:767px)  {
   .news-content, .news-content div  {padding-left:0px; padding-right;0px}   
   .newsline {width: 100%; border-top: 1px solid #b4b4b4; margin-left: 0px;}
 }


 @media only screen and (min-width: 768px)  {
   .news-content, .news-content div  {padding-left:15px; padding-right;15px}
   .newsline {width: 70%; border-top: 1px solid #b4b4b4; margin: auto;}
 }
 
.white-text { color: #fff;}
.red-text { color: #da262e;}
 /* for responsive tables */
.feature-table-cell {min-width: 90px!important; word-wrap: break-word!important;}


.red { color: #d31634;}
.home-menu-pulldown-text { padding-left: 10px;}
.breadcrumb-category a { color: #000; text-decoration: none;}
.breadcrumb-category  { padding-top: 20px; padding-bottom:20px;}

.home-bullets {line-height: 100%; margin-bottom: 7px;} 
.home-ad-head { line-height: 130%; margin-bottom: 12px; text-align:center; }
.home-ad-subhead { line-height: 100%; margin-bottom: 18px; }

.text-primary, .text-primary-red {
    color: #DC3545 !important;
}
.sg-hero.sg-hero-03a h1 {
    color: #fff;
}
h1.sg-hero, .sg-h1.sg-hero {
    color: #000;
    font-size: 50px;
    font-weight: 400;
    line-height: 1.22em;
    margin-bottom: 15px;
}
h1, h2, h3, h4, h5, h6 {
    font-family: "Montserrat", sans-serif;
}

.sg-btn.sg-btn-primary {
    background-color: #DC3545;
    border-color: #DC3545;
    color: #fff;
}

a {
    color: #DC3545;
    font-size: inherit;
    font-weight: 400;
    line-height: 1.625em;
}

#maincontent a {color: #DC3545; text-decoration:none;}

#maincontent #p7BCB_1 a {color: rgb(134, 134, 134);}
#maincontent a.btn-primary  {color:#fff;}
:root {
  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-primary: #da262e;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-font-sans-serif: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
}


  /* Home page - Category Links */  
  a.category-link, a .category-text {
    text-decoration: none; /* Remove underline */
    color: #fff; /* Default text color */
    display: flex;
    flex-direction: column;
    align-items: center; transition: filter 0.4s ease-in-out; /* Smooth effect */
  }
  a.category-link:hover span, a .category-text:hover {
    color: red; /* Change text color on hover */
  }
  .category-link img {
    margin-bottom: 5px;
  }
 .category-link:hover img, .category-link.active img {
    filter: brightness(0) saturate(100%) invert(17%) sepia(93%) saturate(7481%) hue-rotate(-6deg);
}  

  a.category-link.active span, a .category-text.active {
    color: red; /* Change text color on hover */
  }
  
  
.row {
    --bs-gutter-x: 0rem!important;}
    
    .brok-tag {padding-left: 20px; margin-bottom: 5px!important; padding-top: 20px;}
    .brok-search-container {padding-top: 20px;}
    
     .fa {    display: inline-block;
    font: normal normal normal 20px/1 FontAwesome;
    /*font-size: inherit;*/
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
   color: var(--bs-gray);
 }
  .fa:hover {  
   color: var(--bs-red);
 }
 
 /* Product Category Section */
 h5.category-header {color:#FFF!important;} 
.category-links a {color:#000;text-decoration:none; }
.category-links a:hover {color:#da262e; }
.category-links li {margin-bottom:0px;}
.category-links-parent a { font-weight: bold;}
.category-links-child a { font-weight:normal; }


.category-links ul li, .category-links ul li ul li  { list-style-type: none; list-style-position: outside; }

.category-links ul {margin-left: 0; padding-left: 0; }
.category-links ul li { margin-bottom: 25px; }
.category-links ul li a { font-weight:bold!important;}
.category-links ul ul li { margin-top: 4px; margin-bottom: 4px;}
.category-links ul ul li a { font-weight:lighter!important;}
.category-links ul ul  {margin: 0; padding-left: 20px;}


  
.cat-text-holder p { color: #000; font-size: 20px; line-height: 150%; font-weight: lighter;}

.cat-title {display:inlineblock; border-top: 1px solid #000; border-bottom: 1px solid #000; padding-top:30px;  padding-bottom:30px;}

/* retailer store buttons */
 .ext-store-div {width: 90%; height: 90%; display: block; border: 1px solid #bdbdbd; padding: 5px; border-radius: 5px; margin: 5px; }
 
  .ext-store-div:hover {filter:alpha(opacity=65);-moz-opacity:0.6;opacity:0.6;} 
  
.buybutton {display:block; background-color: #d31634; line-height:110%; color: #FFF; padding: 3px; border-radius: 4px; margin-bottom: 2px; }  

/* search */

button, input, optgroup, select, textarea {
    padding-left: 10px; 
    color: #000;
    font-weight: lighter; font-size: 13px;
}




.bROKOutlineButton {
	background-color:transparent;
	border-radius:0px;
	border:1px solid #ffffff;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:17px;
	padding:8px 15px;
	text-decoration:none;
	margin-top:15px;
	margin-bottom:15px;	
}
.bROKOutlineButton:hover {
	background-color: RGBA(0,0,0,0.4); 	color:#ffffff; 	border:1px solid #FFF;
}
.bROKOutlineButton:active {
	position:relative;
	top:1px;
}

.bROKRedOutlineButton {
	background-color:transparent;
	border-radius:0px;
	border:1px solid #9E0F12;
	display:inline-block;
	cursor:pointer;
	color:#9E0F12;
	font-family:Arial;
	font-size:17px;
	padding:8px 15px;
	text-decoration:none;
	margin-top:15px;
	margin-bottom:15px;	
}
.bROKRedOutlineButton:hover {
	color:#000;
}
.bROKRedOutlineButton:active {
	position:relative;
	top:1px;
}

.footer-dark { padding-top: 70px; padding-bottom: 220px; background-position: top center; background-size: cover; background-color: #343434; }


.red-jagged-grit-bk {border-bottom: 4px solid rgb(255, 255, 255); background-size: 100%; background-position: top; background-color:#000; background-image:url('../images/top-jagged-bar-2.gif' ); background-repeat: no-repeat; }


  .red-jagged-grit-bk h2 { text-align: center;  text-transform:uppercase; font-size: 16px; font-weight:bold; color:#FFF;}
  .red-jagged-grit-bk p { text-align: center;  font-size: 14px; font-weight:lighter; color:#FFF;}
  
 .red-jagged-grit-bk h2.not-centered {
    text-align: left;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: bold;
    color: #FFF;} 
  
  
  .red-jagged-grit-black-bk {border-bottom: 4px solid rgb(255, 255, 255);   background-repeat: no-repeat;
  background-size: 100%; background-position; top center; background-image:url('../images/top-jagged-bar-center-red-2.png' );}
  
    .red-jagged-grit-black-bk-36 {border-bottom: 4px solid rgb(255, 255, 255);   background-repeat: no-repeat;
  background-size: 100%; background-position; top center; background-image:url('../images/top-jagged-bar-center-red-50.png' );}
  
  
   .intro-text { color: #000; font-size: 22px; line-height: 150%; font-weight: lighter;} 
 .intro-text-icons   { color: #000; font-size: 16px; line-height: 150%; font-weight: lighter;} 
 
 
  .sg-background-overlay {
    background: rgba(0,0,0,0.2); 

}

ul li, ol li {
  margin-bottom: 8px; }
  .large.detail-view.ecommerce.mt-2  li		{ color: #000;}

 .big-bullets li {font-size:16px!important; font-weight:bold;}  
 .not-bold { font-weight:lighter;}   

.brok-job-header-bk {
  background-repeat: no-repeat!important;
  background-size: cover!important; 
  
  background-position: center center!important; 
  min-height: 380px!important; 
  position: relative!important; 

}

.pad-bot-30 {padding-bottom:40px!important; }
.subhead-rule {border-top: 1px solid #000; padding-top: 25px;}


.sg-feature-05a { padding-top: 35px!important;}
.hd-45 {font-size: 45px!important;}



 .job-container {  min-height: 400px!important; max-height: 400px!important; background-position: center; background-size: 100%; -webkit-transition: all 1s ease-in-out; background-repeat: no-repeat; margin-top:0px; margin-bottom:0px; overflow: hidden; display: inline-block; }

.jobPulldownProducts {font-size: 22px; padding-left: 55px;}

   .p7AP4-01.p7AP4trig h3  {font-size: 40px!important;}

  
 @media only screen and (min-width: 0px) and (max-width: 800px) {
   
   
   .job-container { min-height: 200px!important; max-height: 200px!important; background-color: #f00;}
   
  .hd-45 {font-size: 30px!important;} 
  .p7AP4-01.p7AP4trig h3  {font-size: 22px!important;}
  .jobPulldownProducts {font-size: 16px; padding-left: 0px;}
  
  
   /* Siteglide Override */
.sg-feature {    padding: 50px 20px!important;}
.container { padding-left:20px!important; padding-right:20px!important;}

   
 }
 
/* Category stuff */
       .towing-ball-mounts { background-image: url('../images/cat-menu/cat-menu-towing-ball-mount-white.png');}
       .towing-ball-mounts:hover, li.active  a.towing-ball-mounts { background-image: url('../images/cat-menu/cat-menu-towing-ball-mount-red.png');}
       .towing-hitch-balls {  background-image: url('../images/cat-menu/cat-menu-towing-hitch-ball-white.png');}
       .towing-hitch-balls:hover, li.active  a.towing-hitch-balls { background-image: url('../images/cat-menu/cat-menu-towing-hitch-ball-red.png');}
       .towing-locks { background-image: url('../images/cat-menu/cat-menu-towing-locks-2-white.png');}
       .towing-locks:hover, li.active  a.towing-locks { background-image: url('../images/cat-menu/cat-menu-towing-locks-2-red.png');}
       .towing-misc { background-image: url('../images/cat-menu/cat-menu-towing-adapter-white.png');} 
       .towing-misc:hover, li.active  a.towing-misc { background-image: url('../images/cat-menu/cat-menu-towing-adapter-red.png');} 
       .towing-pin-clips { background-image: url('../images/cat-menu/cat-menu-towing-pin-clip-white.png');}
       .towing-pin-clips:hover, li.active  a.towing-pin-clips { background-image: url('../images/cat-menu/cat-menu-towing-pin-clip-red.png');}     
       .towing-starter-kit { background-image: url('../images/cat-menu/cat-menu-towing-starter-kit-white.png');}
       .towing-starter-kit:hover, li.active  a.towing-starter-kit { background-image: url('../images/cat-menu/cat-menu-towing-starter-kit-red.png');}  
        .towing-security-kit { background-image: url('../images/cat-menu/cat-menu-towing-security-kits-white-3.png');}
       .towing-security-kit:hover, li.active  a.towing-starter-kit { background-image: url('../images/cat-menu/cat-menu-towing-security-kits-red-2.png');}       
       
       .towing-channel-mounts { background-image: url('../images/cat-menu/cat-menu-towing-channel-mount-white.png');}
       .towing-channel-mounts:hover, li.active  a.towing-starter-kit { background-image: url('../images/cat-menu/cat-menu-towing-channel-mount-red.png');}       
            
       
       .trailering-coupler { background-image: url('../images/cat-menu/cat-menu-trailering-coupler-white.png');}
       .trailering-coupler:hover, li.active  a.trailering-coupler { background-image: url('../images/cat-menu/cat-menu-trailering-coupler-red.png');}     
       .trailering-jacks {  background-image: url('../images/cat-menu/cat-menu-trailering-jack-white.png');}
       .trailering-jacks:hover, li.active  a.trailering-jacks { background-image: url('../images/cat-menu/cat-menu-trailering-jack-red.png');} 
       .trailering-locks { background-image: url('../images/cat-menu/cat-menu-trailering-coupler-lock-white.png');}
       .trailering-locks:hover, li.active  a.trailering-locks  { background-image: url('../images/cat-menu/cat-menu-trailering-coupler-lock-red.png');} 
       .trailering-misc { background-image: url('../images/cat-menu/cat-menu-trailering-chain-white.png');}
       .trailering-misc:hover, li.active  a.trailering-misc  { background-image: url('../images/cat-menu/cat-menu-trailering-chain-red.png');} 

.category-nav { background-color: #000!important; padding: 10px;}  
 #p7MXM_3 .mxm-toolbar {
    text-align: right;
}
#p7MXM_3 a.mxm-root-link {
      font-size: 12px;
      display: block;             
      text-decoration: none;
      color: white;
      text-align: center!important;
      padding: 50px 12px 5px 7px;
      text-decoration: none;
      background-size: 45px 45px;
      background-position: 50% 7%;
      background-repeat: no-repeat;
}


#p7MXM_3 a.mxm-root-link:hover, .category ul li a.current_mark {color: red!important;}
#p7MXM_3 .mxm-responsive .mxm-root-ul, .mxm-responsive .mxm-root-li {
    text-align: center!important;
}

#p7MXM_3 li.mxm-root-li {
    border-top: 0px solid #909090;
}

@media only screen and (min-width: 0px) and (max-width: 768px)
{
#p7MXM_3 .mxm-responsive li.mxm-root-li {
    text-align: center!important; 
}
#p7MXM_3 li.mxm-root-li {border-top: 1px solid #909090!important;}

}
 .cat-topper {
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat; 
        padding-top: 60px; 
        padding-bottom: 60px; }
        .cat-h1 {
         color: #fff!important; font-size: 55px 
        }

 
 
 
.job-container:hover {background-size: 120%; }

  .market-container {
    height: 188px;
    overflow: hidden;
    position: relative;
    border: 1px solid #FFF;
}

  .market-title-link {
    width: 100%;
    height: 100%;
    color: #ffffff;
    font-size: 17px;
    letter-spacing: 3px;
    position: absolute;
    bottom: 0;
    padding: 10px;
    text-decoration: none;
    width: 100%;
    height: 100%;
    display: inline-block;
    text-align: center;
}
a.market-title-link {
    color: #fff!important;
}
a.market-title-link:hover {
    color: #ffffff;
}

.article-container {
    height: 400px;
    overflow: hidden;
    position: relative; border: 1px solid #FFF; 
}

.article-img-holder {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transition: all 1s;
}

.article-img-holder:hover {
    transform: scale(1.2);
}
 
.article-title-link {
    width: 100%;
    height: 100%;
    color: #ffffff;
    font-size: 20px; letter-spacing: 3px;
   
    position: absolute;
    bottom: 0;
    padding: 10px;
    text-decoration: none;  width: 100%;
    height: 100%; display: inline-block; text-align: center;
}
.article-title-link:hover {
    text-decoration: none; color: #ffffff;  font-weight: bold;
}

.mxs-section p { font-size: 13px;}

/* red pulldown bar */

.red-pulldowns-bar {  background-repeat:no-repeat; background-size:cover; position:relative; z-index: 99; }

.home-menu-pulldown { border-top: 1px solid #FFF; padding: 5px;}
.home-menu-pulldown-image { text-align:right; padding-right: 5px;}
.home-menu-pulldown-text {text-align:left;}
.pulldown-row .row:hover { background-color: #da262e!important; }
a.pulldown-row .row { color: #FFF!important; }

.icon-pulldown {max-height: 30px;  width:auto;}
 .job-done-link { color: #FFF; font-size: 25px; letter-spacing: 2px;} 
 
  .jobs-landing-button {font-size: 25px!important; text-align: left; padding-left: 35px; letter-spacing: 1px; color: #DC3545; } 

 a.jobs-landing-button:before, a.jobs-landing-button:before, a.jobs-landing-button.open:before, a.jobs-landing-button.open:before {
margin-left: -3em!important;}

.jobs-landing-link-content {border: 1px solid #333;  background-color: rgb(21,21,21); padding: 15px;}
.spread-letters {letter-spacing: 1px;}
 
 /* end red pulldown bar */
 /* form pulldown */
   #p7AP4_1 h3 a.form-button {
    padding-left: 0%;
padding:15px; border: 1px solid #888; font-size: 18px;
}
.cookiebanner {padding-left: 65px!important;}   
  /* Siteglide Override */
.sg-feature {    padding: 50px 20px;}
  /* Prodouct Pagination */
  
.model_pagination a {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
 
    color: #fff!important;
    background-color: #d31634;
    border-color: #d31634; 
    
  }
 
 
 #maincontent .model_pagination a {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
 
    color: #fff!important;
    background-color: #d31634;
    border-color: #d31634; 
    
  }
a.inactive { color: #d31634!important;   background-color: #fff!important;
    border-color: #d31634; color: #d31634!important; }
    
 #maincontent a.inactive { color: #d31634!important;   background-color: #fff!important;
    border-color: #d31634; color: #d31634!important; }
    
    .detail-view img {
    width: 100%; max-width: 100% ;height: auto;
}


.news-content .container {
padding-left: 0px!important;
padding-right: 0px!important; }

.news-content .container img {max-width: 100%; height: auto;}

/* Featured Landing Pages */

  .featuresubholder {
    display: flex;
    justify-content: center;
    align-items: center; /* Center vertically */
  }

  .featuresubcontainer {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center; /* Center horizontally */
  }

  .featuresubcontainer:hover img {
    transform: scale(1.2);
  }

  .featuresubcontainer:hover button {
    background-color: black; /* Change the color to whatever you want */
    color: #d31634;
  }

  .featuresubcontainer img {
    transition: transform 0.3s ease;
    max-width: 100%;
    height: auto;
    display: block;
    position: relative; /* Ensure proper stacking */
   z-index: 0; /* Lower z-index to ensure button is above */
  }

  .featuresubcontainer p {
  margin: 0; /* Remove default margin */
  min-height: 60px;
  max-height: 60px;
  overflow: hidden;
  display: flex;
  align-items: flex-end; /* Align paragraph text to the bottom */ 
  font-size:13px;
  }

  .featuresubcontainer button {
    font-size:14px;
    background-color:  #d31634; /* Change the color to whatever you want */
    color: white;
    border: none;
    padding: 10px 25px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    position: relative; /* Ensure proper stacking */
    z-index: 1; /* Higher z-index to ensure button is above image */    
  }
section.sg-hero { padding: 100px 0; }

/* E-commerce Overrides and Additions */ 
.store-search-container .search-container .search-button {
    width: auto; }
