/*
  1. Rating Banner
  2. Brand Logos
  3. Retailer Inventory
  4. Mobile Nav
  5. Top Bar Nav
  6. 2023 Updates
  7. Global
  8. Home Page
  9. Boot Styles
  10. About Our Boots
  11. About Us
*/

/* 1. Rating Banner */

.rating {
  background-color: #414141;
  padding: 0.5rem 0;
  text-align: center;
}

.rating a {
  display: block;
}

.rating img {
  max-width: 600px;
}

@media screen and (max-width: 40em) {
  
  .rating img {
    max-width: 90%;
  }
  
}

/* 2. Brand Logos */

.addendum .addendum-brands .brand-logo-ab,
.addendum .addendum-brands .brand-logo-hp,
.addendum .addendum-brands .brand-logo-ol,
.addendum .addendum-brands .brand-logo-mb,
.addendum .addendum-brands .brand-logo-mm,
.addendum .addendum-brands .brand-logo-rm {
  margin-top: 0px;  
}

/* 3. Retailer Inventory */

.boot-retailer-locator {
  padding-top: 1rem;
}

.heading-retailers h2 {
  border-bottom: 1px solid #000;
  color: #000;
  font-family: "TradeGothic-Condensed",sans-serif;
  font-weight: bold;
  font-size: 1.25rem;
  margin-bottom: 1rem;
  text-transform: uppercase;
}

.inventory-heading,
.inventory-retailer-name,
.boot-inventory-retailer h3 {
  color: #000;
  font-family: "TradeGothic-Condensed",sans-serif;
  font-weight: bold;
  font-size: 1.25rem;
  text-transform: uppercase;
}
  
.inventory-heading {
  border-bottom: 1px solid #000;
  margin-bottom: 2rem;
}

/* 4. Mobile Nav */

.top-bar .toggle-topbar {
  right: auto;
  left: 0;
}

@media screen and (max-width: 40em) {
  
  .header-nav .top-bar .top-bar-section ul li a {
    padding-left: .9375rem;
  }
  
  .top-bar-section ul.right {
    padding-left: .9375rem;
  }
  
  .header-nav .top-bar .top-bar-section ul.right li:first-child a {
    padding-left: 0;
  }
  
}

/* 5. Top Bar Nav */

@media screen and (min-width: 40em) {

.top-bar li.parent-link {
  display: none;
}

}

/* 6. 2023 Updates */

/* 7. Global */

.header {
  background-color: #000;
  background-image: none;
}

.header-nav {
  background-color: #5A5A5A;
}

.addendum-nav ul {
  margin: 1rem 0 2rem 0;
}
    
.addendum-nav ul li {
  display: inline-block;
}
    
.addendum-nav ul li a {
  border-right: 1px solid #fff;
  margin-right: 1rem;
  padding-right: 1rem;
}
    
.addendum-nav ul li:last-child a {
  border-right: none;
  margin-right: 0;
  padding-right: 0;
}

@media screen and (max-width: 40em) {
  
  .addendum-nav ul li {
    display: block;
  }
  
  .addendum-nav ul li a {
    border-right: none;
    margin-right: 0;
    padding-right: 0;
  }
  
}

/* 8. Home Page */

.home .banner {
  height: 790px;
}
    
@media screen and (max-width: 40em) {
  
  .home .banner {
    height: 150px;
  }
  
}

.home .banner > .columns {
  padding-right: 0 !important;
  padding-left: 0 !important;
}
    
.home .banner .hero-images {
  position: relative;
  visibility: hidden;
}
        
.home .banner .hero-images.slick-initialized {
  visibility: visible;
}
      
.home .banner .hero-images .slide {
  background-position: center top;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 790px;
}
        
@media screen and (max-width: 40em) {
  
  .home .banner .hero-images .slide {
    height: 150px;
  }
          
  .home .banner .hero-images .slide a {
    height: 150px;
  }

}
        
.home .banner .hero-images .slide:first-child {
  background-position: center bottom;
}
        
.home .banner .hero-images .slide a {
  display: block;
  height: 790px;
}
      
.home .banner .hero-images .slick-prev,
.home .banner .hero-images .slick-next {
  background-color: rgba(255,255,255,0.4);
  color: #333;
  display: block;
  font-size: 2rem;
  position: absolute;
  text-align: center;
  top: 40%;
  width: 40px;
  z-index: 1000;
}
        
@media screen and (max-width: 40em) {
  
  .home .banner .hero-images .slick-prev,
  .home .banner .hero-images .slick-next {
    font-size: 2rem;
    top: 30%;
  }

}
      
.home .banner .hero-images .slick-prev {
  left: 0;
}
      
.home .banner .hero-images .slick-next {
  right: 0;
}
      
.home .banner .hero-images .slick-dots {
  list-style: none;
  margin: 0.75rem 0 2rem 0;
  text-align: center;
}
        
.home .banner .hero-images .slick-dots li {
  display: inline-block;
  margin-right: 1rem;
}
          
.home .banner .hero-images .slick-dots li:last-child {
  margin-right: 0;
}
          
.home .banner .hero-images .slick-dots li.slick-active button {
  background-color: #333;
  color: #333;
}
        
.home .banner .hero-images .slick-dots button {
  background-color: #666;
  border-radius: 50%;
  color: #666;
  height: 18px;
  margin-right: 6px;
  margin-left: 6px;
  padding: 0;
  width: 18px;
}
  
.home .home-callout-grid a {
  display: block;
}
  
.home .retailer-banner {
  background-color: #5A5A5A;
  color: #fff;
  padding: 2rem 0;
}
    
.home .retailer-banner a:hover {
  color: #f90c10;
}
    
.home .retailer-banner h1, 
.home .retailer-banner h2,
.home .retailer-banner h3, 
.home .retailer-banner h4, 
.home .retailer-banner h5, 
.home .retailer-banner h6 {
  color: #fff;
  font-family: "TradeGothic-Condensed",sans-serif;
  font-weight: bold;
  text-transform: uppercase;
}
    
.home .retailer-banner i {
  font-size: 4rem;
}
  
.home .instagram-images {
  padding-top: 2rem;
}
    
.home .instagram-images a {
  display: block;
}
    
@media screen and (max-width: 40em) {
      
  .home .instagram-images img {
    display: block;
    margin-bottom: 2rem;
  }
  
}
  
.home .instagram-banner {
  padding: 2rem 0;
}
    
.home .instagram-banner a:hover {
  color: #f90c10;
}
    
.home .instagram-banner h1,
.home .instagram-banner h2, 
.home .instagram-banner h3, 
.home .instagram-banner h4, 
.home .instagram-banner h5, 
.home .instagram-banner h6 {
  font-family: "TradeGothic-Condensed",sans-serif;
  font-weight: bold;
}
  
.home .sponsor-banner {
  padding: 2rem 0;
}
    
.home .sponsor-banner a {
  display: inline-block;
}
    
.home .sponsor-banner img {
  display: inline-block;
}
  
.home .page-content {
  background-color: #fff;
}
  
.home .addendum-nav {
  border-top: none;
}

/* 9. Boot Styles */

.boot-styles .category-image-banner,
.boot-styles .category-text-banner {
  background-color: #000;
}
  
.boot-styles .category-details-banner {
  background-color: #E7E7E8;
}
  
.boot-styles .category-image-banner {
  background-position: center top;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 650px;
}

@media screen and (max-width: 40em) {
  
  .boot-styles .category-image-banner {
    height: 150px;
  }
  
}
  
.boot-styles .category-text-banner,
.boot-styles .category-details-banner {
  margin-bottom: 2rem;
}
    
.boot-styles .category-text-banner h1,
.boot-styles .category-text-banner h2,
.boot-styles .category-details-banner h1,
.boot-styles .category-details-banner h2 {
  font-family: "TradeGothic-Condensed",sans-serif;
  font-weight: bold;
  text-transform: uppercase;
}
    
.boot-styles .category-text-banner h1,
.boot-styles .category-details-banner h1 {
  font-size: 1.875rem;
  padding: 3rem 0 1rem 0;
}
    
.boot-styles .category-text-banner h2,
.boot-styles .category-details-banner h2 {
  font-size: 1.5rem;
}
    
.boot-styles .category-text-banner img,
.boot-styles .category-details-banner img {
  display: inline-block;
  margin-bottom: 2rem;
}
  
.boot-styles .category-text-banner h1 {
  color: #fff;
}
  
.boot-styles .category-details-banner h1 {
  color: #000;
}
  
.boot-styles.horse-power .category-image-banner {
  background-image: url("/images/pages/Boots-HPHeader_NEW.webp");
}
  
.boot-styles.top-hand-collection .category-image-banner {
  background-image: url("/images/pages/Boots-TopHand-Header_NEW.webp");
}
  
.boot-styles.work .category-image-banner {
  background-image: url("/images/pages/Boots-HPWorkHeader_r.jpg");
}
  
.boot-styles .button-group {
  margin-bottom: 2rem;
}
    
.boot-styles .button-group .button {
  background-color: #fff;
  border: 1px solid #ccc;
  color: #000;
  font-family: "TradeGothic-Condensed",sans-serif;
  text-transform: uppercase;
}
      
.boot-styles .button-group .button.active,
.boot-styles .button-group .button:hover {
  background-color: #5a5a5a;
  border-color: #5a5a5a;
  color: #fff;
}
  
.boot-styles .featured-image-caption,
.boot-styles .boot-info h2 {
  font-family: "TradeGothic-Condensed",sans-serif;
  text-transform: uppercase;
}
  
.boot-styles .boot-info h2 {
  font-size: 1.875rem;
}

/* 10. About Our Boots */

.about-our-boots .page-content {
  padding-bottom: 0;
}
  
.about-our-boots .page-banner {
  background-image: url("/images/pages/Boots-3SubbrandsHeader-1600x750_NEW.webp");
  background-position: center top;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 750px;
}

@media screen and (max-width: 40em) {
  
  .about-our-boots .page-banner {
    height: 250px;
  }
  
}
  
.about-our-boots .boot-style-nav {
  margin: 2rem 0;
}
    
.about-our-boots .boot-style-nav .button {
  background-color: #fff;
  border: 1px solid #ccc;
  color: #000;
  display: block;
  font-family: "TradeGothic-Condensed",sans-serif;
  margin: 0 2rem 0.5rem 2rem;
  text-transform: uppercase; 
}   
      
.about-our-boots .boot-style-nav .button:hover {
  background-color: #5a5a5a;
  border-color: #5a5a5a;
  color: #fff;
}
  
.about-our-boots .boot-style-detail-banner {
  padding: 3rem;
  text-transform: uppercase;
}
    
.about-our-boots .boot-style-detail-banner.horse-power,
.about-our-boots .boot-style-detail-banner.work {
  background-color: #E7E7E8;
}
    
.about-our-boots .boot-style-detail-banner img {
  display: inline-block;
}
    
.about-our-boots .boot-style-detail-banner ul {
  list-style-type: none;
  margin: 2rem 0 0 0;
}

/* 11. About Us */

.about-us .page-banner {
  background-image: url("/images/pages/AboutUsHeader_r.jpg");
  background-position: center top;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 600px;
}

@media screen and (max-width: 40em) {
  
  .about-us .page-banner {
    height: 150px;
  }
  
}
  
.about-us h1,
.about-us h2 {
  border: none;
  font-family: "TradeGothic-Condensed",sans-serif;
  font-size: 1.875rem;
  font-weight: bold;
  text-transform: uppercase;
}
  
.about-us h1 {
  margin-top: 2rem;
}