.filterGroupToggle{font-size:9pt;}
.viewAllDiv{cursor:pointer;}
.browseSort{
 padding-top:25px;
padding-right:15px;
 padding-left:15px;

}
.filterGroup .filterGroupHead{
    padding-bottom: 0.563rem;
    padding-top: 0.500rem;
    margin-bottom: 0.25rem; 
}
.catalogGroupInner ul li, .filterGroupInner ul li{
    margin:0;
    margin-bottom:0.313rem;
}
/* Force responsive images in browse  based on img-responsive from bootstrap */
.browseProdImg img{
  display: block !important;
  width: 100% \9;
  max-width: 100% !important;
  height: auto !important;
  margin:0 auto;
}
.browseProd {
  border: 0px solid #ddd;
  padding: 10px;
  margin-bottom: 10px;
  border-radius: 5px; /* Add rounded corners for card-like appearance */
  display: inline-block; /* Change layout to display cards side-by-side */
}
.
img{
  display: block !important;
  width: 100% \9;
  max-width: 100% !important;
  height: auto !important;
  margin:0 auto;
}
.browseProdImg {
  height: auto;
}

/* Handle akward dimensions */
@media (min-width: 450px, max-width: 768px) {
  .browseProdImg img{
    width: 80% !important;
    max-width: 100% !important;
    height: auto !important;
  }
}


#catalogMenu{ padding: 0 } /* Remove .navbar-collapse padding */

.browseCatLink:hover,
.browseCatLink{ color:#333; }


.browseProd .thumbnail{ min-height: 305px; max-width:285px; margin-left:auto; margin-right:auto;border:none; }
.browseProdDesc{ word-wrap: break-word; }

/* browse Paging */
.browsePaging{ margin:0; padding:0; }
.browsePaging li{ 
  margin:0; 
  padding: 0 5px; 
  float:left; 
  list-style:none; 
  cursor:pointer; 
}
.pgSelected{ font-weight:bold; }


.sortChoice,
.sortChoice:hover{
  text-decoration:none;
  vertical-align:middle;
  position:relative;
  top:1px;
}
.sortChoice .fa,
.sortChoice .glyphicon{
  font-size:18px;
  color: #666;
  border:1px solid #666;
  border-radius:5px;
  padding:2px;
  margin:1px; 
}
.sortSelected .fa,
.sortSelected .glyphicon{
  color: #000;
  border-color:#000;
}

/* Selected Filters */
.browseSelectedFilters{ background:#ccc; border-bottom:5px solid #666; }
.browseSelectedFilters ul{ margin:0; padding:0; float:left; }
  .browseSelectedFilters li{ list-style: none; float:left; text-shadow: 0 -1px 0 #fff; }
    .removeFilter{ border: 1px solid #666; cursor:pointer; margin: 0 5px; }


/* Filter Menu */
.browseFilter{

}
  .catalogGroupHead,
  .filterGroupHead{
    font-weight:bold;
  }
  .browseCategory ul,
  .filterGroup ul{ 
    margin:0; 
    padding:0; 
  }
  .browseCategory li,
  .filterGroup li{
    margin:0 0 0 5px; padding:0;
    list-style:none;
    cursor:pointer;
  }

  .browseCategory li.selected,
  .filterGroup li.selected{
    font-weight:bold;
  }

  .browseCategory li .prodCount,
  .filterGroup li .prodCount{
    font-size:80%;
    font-style:italic;
    white-space:nowrap;
    font-weight:normal;
  }
  .filterCheck{
    color:#999;
    font-size:14px;
    padding-right:5px;
  }
  .filterCheck.glyphicon-check,
  .filterCheck.fa-check-square-o{
    color:#666;
    font-size:14px;
    padding-right:4px;
  }

  .filterGroup li.filterInactive{ opacity:0.6; cursor: inherit; }

.browseRegPrice{  }
.browseSalePrice{ color:red; }
.browseRegPriceStrike{ text-decoration:line-through; }
.filterGroup li{padding-left:15px; }
.filterCheck{ margin-left:-15px; }

.colorSwatches {
   float:none;
   margin: 0 auto;
   clear:both;
   max-width:180px;
}

.colorSwatch{
   width: 100%;
   height: 100%;
   overflow: hidden; 
   vertical-align:top;
}

.colorOuter {
   float: left;
   margin: 2px;
   cursor: pointer;
   border: 0px solid #ccc;
   background-color: #FFF;
}

.colorInner {
 
   width: 15px;
   height: 15px;
   /*margin: 1px;*/
   overflow: hidden;
 
}

.colorOuter.selected { border-color:#666; }

.colorOuter.selected { box-shadow:0 0 6px #666; }
.show-more-colors{ display:block; clear:both; }

.noProdFound{
  text-align: center;
  font-weight: bold;
  margin-top: 25px; 
}

/* Multi Hex value colors */
.multiHex{ float:left; height:100%; border:0; margin:0; padding:0; }
.multi1of2,
.multi2of2{
  width:50%;
}
.multi1of3{ width:50%; }
.multi2of3,
.multi3of3{
  width:25%;
}
.multi1of4,
.multi2of4,
.multi3of4,
.multi4of4{
  width:25%;
}


.filterResetOuter{
 font-weight:normal;
 font-size: 13px; 
 margin-left:4px;
 color:#999;
}

#filterReset, .filterGroupClear{ margin-left:4px; color:#333; text-decoration:none; cursor:pointer; }
#filterReset:hover, .filterGroupClear:hover{ color:#000; text-decoration:underline; }
.filterGroupHead{ cursor:pointer; }
.filterGroupToggle{ margin-right:5px; }

.browseProd .thumbnail{
   position:relative;   
}
@media (min-width: 420px) {
.ribbon {
   position: absolute;
   right: -5px; top: -5px;
   z-index: 100;
   overflow: hidden;
   width: 75px; height: 75px; 
   text-align: right;
}
.ribbon span {
   font-size: 10px;
   color: #fff; 
   text-transform: uppercase; 
   text-align: center;
   font-weight: bold; line-height: 20px;
   transform: rotate(45deg);
   -webkit-transform: rotate(45deg); /* Needed for Safari */
   width: 100px; display: block;
   background: #79A70A;
   background: linear-gradient(#9BC90D 0%, #79A70A 100%);
   box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
   position: absolute;
   top: 19px; right: -21px;
}
.ribbon span::before {
   content: '';
   position: absolute; 
   left: 0px; top: 100%;
   z-index: -1;
   border-left: 3px solid #79A70A;
   border-right: 3px solid transparent;
   border-bottom: 3px solid transparent;
   border-top: 3px solid #79A70A;
}
.ribbon span::after {
   content: '';
   position: absolute; 
   right: 0%; top: 100%;
   z-index: -1;
   border-right: 3px solid #79A70A;
   border-left: 3px solid transparent;
   border-bottom: 3px solid transparent;
   border-top: 3px solid #79A70A;
}
}
@media (max-width: 419px) {
.ribbon { 
 text-align:center; 
 margin: -4px -5px 0 -5px; 
 height:23px; 
 border-radius: 4px 4px 0 0;
}
 .ribbon span {
   font-size: 10px;
   color: #fff; 
   text-transform: uppercase; 
   text-align: center;
   font-weight: bold; line-height: 20px;
   width: 100%; 
   height:23px;
   display: block;
   background: #79A70A;
   background: linear-gradient(#9BC90D 0%, #79A70A 100%);
   border-radius: 4px 4px 0 0;
}
}
.ribbon span {
   background: #79A70A;
   background: linear-gradient(#9BC90D 0%, #79A70A 100%); 

}
.ribbon.red span {background: linear-gradient(#F70505 0%, #8F0808 100%);}
.ribbon.red span::before {border-left-color: #8F0808; border-top-color: #8F0808;}
.ribbon.red span::after {border-right-color: #8F0808; border-top-color: #8F0808;}

.ribbon.blue span {background: linear-gradient(#2989d8 0%, #1e5799 100%);}
.ribbon.blue span::before {border-left-color: #1e5799; border-top-color: #1e5799;}
.ribbon.blue span::after {border-right-color: #1e5799; border-top-color: #1e5799;}


/* Color Swatches */
.filter_colorxref {
   float:left;
   margin-bottom: 5px;
}

.filter_colorxref li {
   text-indent: -9999px;
   width: 28px;
   height: 28px;
   float: left;
   margin: 1px 2px 3px 2px;
   padding:0;
   border: 1px solid #DDD;
   box-shadow: inset 0 0 0 2px #FDFDFD;
   border-radius: 18px;
   background-clip: content-box;
   background-size:cover; 
   background-repeat: no-repeat; 
   background-position:center center; 
}

.filter_colorxref li.selected {
   border: 1px solid #222;
   box-shadow: inset 0 0 0 1px white, 0 0 3px #444;
}

.filter_colorxref .fa-square-o:before, #filter_Color .fa-check-square-o:before {
   content: normal;
}
.filter_colorxref .filterInactive{ border-style:dotted; position:relative; }
.filter_colorxref .filterInactive:after {
  text-indent:0;
  content: "\f00d"; /* Close icon */
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
  position: absolute;
  font-size: 18px;
  color: #999;  
  top: 50%;
  left: 50%;  
  margin: -12px 0 0 -7px;
  z-index: 1;
  opacity:0.5;
}
.browse_banner img{width:100%}


@media (min-width: 420px) {
.circle {
   /*font-size: 10px;*/
   color: #fff; 
   text-transform: uppercase; 
   text-align: center;
   font-weight: bold; line-height: 20px;
   width: 50px; display: block;
   background: #7f7f7f;
   /*box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);*/
   position: absolute;
   top: 0px; right: 30px;
   border-radius:50%;
   height:50px;
}
.circle span {
 position:relative;
 top:19px;
 font-size:20px;
 color:white;
}


}
@media (max-width: 419px) {
.circle { 
   /*font-size: 10px;*/
   font-weight: bold; line-height: 20px;
   width: 25px; display: block;
   background: #7f7f7f;
   position: absolute;
   right: 15px;
   border-radius:50%;
   height:25px;
}
 .circle span {
 position:relative;
 top:2px;
 font-size:10px;
}
}
.circle span {
   background: #7f7f7f;
}

/*Hide colorCode and Promo filter*/
.filterGroup[data-filter_code="colorCode"]{ display:none; }

.filterGroup[data-filter_code="Promo"]{ display:none; }

 .nav-padding {
 padding: 0px;
 margin-top: 20px;
 }

/* Mobile and Desktop "View All" Nav */
@media (min-width: 768px) {
.mobile-page-nav {
 display: none;
}
 
}

@media (max-width: 768px) {
.desktop-page-nav {display: none;
}
}
/* END Mobile and Desktop "View All" Nav */
.center-container {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }


/* Hide Sale Ribbon For Specific Products */
#browse3112 .ribbon {
display: none;
}

#browse3118 .ribbon {
display: none;
}

#browse37002 .ribbon {
display: none;
}

#browse37008 .ribbon {
display: none;
}
/* END Hide Sale Ribbon For Specific Products */

@media (min-width: 420px) {
.closeoutcircle {
   color: #fff; 
   text-transform: uppercase; 
   text-align: center;
   font-weight: bold; line-height: 20px;
   width: 50px; display: block;
   background: #da0000;
   /*box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);*/
   position: absolute;
   top: 0px; right: 30px;
   border-radius:50%;
   height:50px;
}
.closeoutcircle span {
 position:relative;
 top:15px;
 font-size:10px;
 color:white;
}


}
@media (max-width: 419px) {
.closeoutcircle { 
   /*font-size: 10px;*/
   font-weight: bold; line-height: 20px;
   width: 40px; display: block;
   background: #da0000;
   position: absolute;
   right: 15px;
   border-radius:50%;
   height:40px;
}
 .closeoutcircle span {
 position:relative;
 top:9px;
 font-size:9px;
 color: white;
}
}
.closeoutcircle span {
   background: #da0000;
}


.btn-primary2 {
width: 350px;
padding: 10px 10px 10px 10px;
font-size: 1.5em; 
color: white;
background-color: black;
border-radius: 0px;
}
.btn-primary2:hover {
color: white;
}

.div-btn {
  display: block; 
  margin: 10px auto; 
  width:350px;
}