/*
  Macie Bean - mb.css
  Redesign 2025 - Modeled after HP layout

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

/* Global overflow fix - prevents horizontal scrollbar from Foundation .row margins */
html {
  overflow-x: hidden;
}

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

.boot-retailer-locator p,
.boot-retailer-locator label,
.boot-retailer-locator select,
.boot-retailer-locator input {
  font-family: "Roboto Condensed", sans-serif;
}

.boot-retailer-locator p b {
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
}

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

.inventory-heading,
.inventory-retailer-name,
.boot-inventory-retailer h3 {
  color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  font-size: 1.25rem;
  text-transform: uppercase;
}

.inventory-heading {
  border-bottom: 1px solid #2a7c7c;
  margin-bottom: 2rem;
}

/* 4. Mobile Nav */

.top-bar .toggle-topbar {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}

.top-bar .toggle-topbar.menu-icon a {
  color: #58595B;
}

.top-bar .toggle-topbar.menu-icon a span::after {
  box-shadow: 0 0 0 1px #58595B, 0 7px 0 1px #58595B, 0 14px 0 1px #58595B;
}

.top-bar.expanded .toggle-topbar a {
  color: #58595B;
}

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

  .header-nav .top-bar .top-bar-section ul li a {
    padding-left: .9375rem;
  }

  .top-bar-section ul.right {
    display: flex;
    justify-content: center;
    padding-left: 0;
  }

  .top-bar-section ul.right li {
    display: inline-block;
    float: none !important;
  }

  .top-bar-section ul.right li a {
    padding: 0.5rem 0.75rem !important;
  }

}

/* 5. Top Bar Nav */

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

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

}

/* 6. Global */

.header {
  background-color: #fff;
  background-image: none;
  padding: 1rem 0 0.25rem 0;
  position: relative;
  z-index: 201;
}

.header .branding {
  text-align: center;
}

.header .branding img {
  max-height: 80px;
  width: auto;
}

.header-nav {
  background-color: #fff;
  border-bottom: none;
  position: relative;
  z-index: 200;
}

.header-nav .top-bar {
  background: #fff;
}

.header-nav .top-bar-section li:not(.has-form) a:not(.button) {
  background: #fff;
  color: #58595B;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.header-nav .top-bar-section li:not(.has-form) a:not(.button):hover {
  color: #2a7c7c;
}

.header-nav .top-bar-section .social-btn {
  font-size: 1.25rem;
  color: #58595B;
}

/* Desktop nav: centered, tight spacing */
@media screen and (min-width: 40.0625em) {

  .header-nav .top-bar-section {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .header-nav .top-bar-section ul.left {
    display: flex;
    justify-content: center;
    align-items: center;
    float: none;
    margin: 0;
  }

  .header-nav .top-bar-section ul.left > li {
    float: none;
  }

  .header-nav .top-bar-section li:not(.has-form) a:not(.button) {
    line-height: 45px;
    padding: 0 0.75rem;
  }

  .header-nav .top-bar-section ul.right {
    display: flex;
    align-items: center;
    float: none;
    margin: 0 0 0 0.25rem;
  }

  .header-nav .top-bar-section ul.right > li {
    float: none;
  }

  .header-nav .top-bar-section .social-btn {
    padding: 0 0.35rem;
  }

}

.header-nav .top-bar-section .social-btn:hover {
  color: #2a7c7c;
}

/* Hide dropdown triangle/arrow and remove extra padding */
.header-nav .top-bar-section .has-dropdown > a::after {
  display: none;
}

.header-nav .top-bar-section .has-dropdown > a {
  padding-right: 0.75rem !important;
}

.header-nav .top-bar-section .dropdown::before,
.header-nav .top-bar-section .dropdown::after {
  display: none !important;
}

.f-dropdown::before,
.f-dropdown::after {
  display: none !important;
}

/* Active nav highlight - hot pink background */
.header-nav .top-bar-section li.active > a {
  background-color: #d5236a !important;
  color: #fff !important;
}

/* Dropdown styling */
.header-nav .top-bar-section .dropdown li a {
  background: #fff;
  color: #58595B;
}

.header-nav .top-bar-section .dropdown li a:hover {
  background: #f5f5f5;
  color: #2a7c7c;
}

/* Remove dashed borders from page content */
.page-content {
  border-bottom: none !important;
}

.content h1 {
  border-bottom: none !important;
}

/* Page headings */
.heading h1,
.find-a-retailer h1 {
  color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 2rem;
  font-weight: 700;
  padding: 6rem 0 1rem 0;
  text-transform: uppercase;
}

/* Addendum / Footer */

.addendum-wrap {
  background-color: #2F6D71;
  background-image: url('/images/ui/footer-bg-left.webp'), url('/images/ui/footer-bg-right.webp');
  background-position: left bottom, right bottom;
  background-repeat: no-repeat, no-repeat;
  background-size: auto, auto;
  border-top: none !important;
  padding-top: 0 !important;
}

.addendum {
  background-color: transparent;
}

.addendum-wrap,
.addendum-wrap p,
.addendum-wrap span,
.addendum-wrap li {
  color: #fff !important;
}

.addendum-wrap a,
.addendum-wrap a:link,
.addendum-wrap a:visited {
  color: #fff !important;
}

.addendum-wrap a:hover,
.addendum-wrap a:active,
.addendum-wrap a:focus {
  color: #d5236a !important;
}

.addendum-nav ul {
  margin: 1rem 0 2rem 0;
}

.addendum-nav ul li {
  display: inline-block;
}

.addendum-nav ul li a,
.addendum-nav ul li a:link,
.addendum-nav ul li a:visited {
  border-right: 1px solid #fff;
  color: #fff !important;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.8rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  margin-right: 0.75rem;
  padding-right: 0.75rem;
  text-transform: uppercase;
}

.addendum-nav ul li a:hover,
.addendum-nav ul li a:active,
.addendum-nav ul li a:focus {
  color: #d5236a !important;
}

.addendum-nav ul li:last-child a {
  border-right: none;
  margin-right: 0;
  padding-right: 0;
}

.addendum .addendum-brands {
  padding: 1rem 0;
}

.addendum .addendum-brands ul {
  display: flex;
  align-items: center;
  justify-content: center;
}

.addendum .addendum-brands ul > li {
  display: flex;
  align-items: center;
  justify-content: center;
  float: none;
}

.addendum .addendum-brands img {
  filter: brightness(0) invert(1);
  opacity: 1;
}

.addendum .copyright p {
  color: #fff !important;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.75rem;
  font-weight: 400;
}

.addendum .fob a,
.addendum .fob a:link,
.addendum .fob a:visited {
  color: #fff !important;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.8rem;
  font-weight: 400;
  text-transform: uppercase;
}

.addendum .fob a:hover,
.addendum .fob a:active,
.addendum .fob a:focus {
  color: #d5236a !important;
}

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

  .addendum-nav ul li {
    display: block;
    text-align: center;
  }

  .addendum-nav ul li a,
  .addendum-nav ul li a:link,
  .addendum-nav ul li a:visited {
    border-right: none !important;
    margin-right: 0;
    padding-right: 0;
  }

}

/* MB brand button */

.button-mb,
.button.button-mb,
button.button-mb {
  background-color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif !important;
  font-size: 1.25rem;
  font-weight: 700;
  text-transform: uppercase;
}

.button-mb.active,
.button-mb:focus,
.button-mb:hover {
  background-color: #2F6D71;
  color: #fff;
}

/* Retailer search buttons on boot detail pages */
.boot-styles .retailer-search-form .button,
.boot-styles .retailer-search-form button {
  font-family: "Roboto Condensed", sans-serif !important;
  font-weight: 700;
  text-transform: uppercase;
}

/* Form pages */

.content-contact h1,
.content-ambassadors h1,
.content-gift-certificate h1 {
  color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}

.retailer-search-form label {
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}

.retailer-search-form input,
.retailer-search-form select,
.retailer-search-form p,
.retailer-search-form b,
.retailer-search-form strong {
  font-family: "Roboto Condensed", sans-serif;
}

/* 7. Home Page */

.home .banner {
  height: 790px;
  position: relative;
}


@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 center;
  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 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: 0 3px;
}

.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;
}

.home .banner .hero-images .slick-dots button {
  background-color: #999;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 0;
  height: 10px;
  line-height: 0;
  overflow: hidden;
  padding: 0;
  text-indent: -9999px;
  width: 10px;
}

.home .home-callout-grid a {
  display: block;
}

.home .retailer-banner {
  background-color: #fff;
  color: #333;
  padding: 2rem 0;
}

.home .retailer-banner a {
  color: #2a7c7c;
}

.home .retailer-banner a:hover {
  color: #d5236a;
}

.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: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}

.home .retailer-banner p {
  color: #666;
  font-family: "Roboto Condensed", sans-serif;
  font-style: normal;
  font-weight: 400;
}

.home .retailer-banner i {
  color: #2a7c7c;
  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 {
  color: #333;
}

.home .instagram-banner a:hover {
  color: #2a7c7c;
}

.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: "Roboto Condensed", sans-serif;
  font-weight: 700;
}

.home .page-content {
  background-color: #fff;
}

.home .addendum-nav {
  border-top: none;
}

/* 8. Boot Styles */

.boot-styles .category-image-banner {
  background-color: #000;
}

.boot-styles .category-text-banner {
  background-color: #fff;
}

.boot-styles .category-details-banner {
  background-color: #E7E7E8;
}

.boot-styles .category-image-banner {
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 650px;
}

.boot-styles.macie-bean .category-image-banner {
  background-image: url('/images/pages/MB-Boots-Header-1600x650.jpg');
}

.boot-styles.macie-bean .category-image-banner.kids-banner {
  background-image: url('/images/pages/MB-Kids-Header-1600x650.jpg');
}

.boot-styles.top-hand-collection .category-image-banner {
  background-image: url('/images/pages/MB-TopHand-Header-1600x650.jpg');
}

.boot-styles.swedge .category-image-banner {
  background-image: url('/images/pages/MB-Swedge-Header-1600x650.jpg');
}

@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: "Roboto Condensed", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}

.boot-styles .category-text-banner h1,
.boot-styles .category-details-banner h1 {
  color: #2a7c7c;
  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;
}

/* Tagline under banner */
.boot-styles .category-tagline {
  color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  padding: 3rem 2rem 1.5rem 2rem;
  text-align: center;
}

/* Sidebar filters */
.boot-styles .filter-sidebar {
  padding: 1rem 0;
}

.boot-styles .filter-sidebar h2 {
  color: #333;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 0.25rem;
  text-transform: uppercase;
}

.boot-styles .filter-sidebar .filter-toggle {
  color: #999;
  cursor: pointer;
  display: inline-block;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.8rem;
  margin-bottom: 0.75rem;
  text-transform: uppercase;
}

.boot-styles .filter-sidebar .filter-toggle:hover {
  color: #2a7c7c;
}

.boot-styles .filter-sidebar .filter-list {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.boot-styles .filter-sidebar .filter-list li {
  border-bottom: 1px solid #eee;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
}

.boot-styles .filter-sidebar .filter-list li a {
  color: #58595B;
  display: block;
  padding: 0.5rem 0;
  text-transform: capitalize;
}

.boot-styles .filter-sidebar .filter-list li a:hover {
  color: #2a7c7c;
}

.boot-styles .filter-sidebar .filter-list li.active a {
  color: #2a7c7c;
  font-weight: 700;
}

.boot-styles .filter-sidebar .filter-list.hidden {
  display: none;
}

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

  .boot-styles .filter-sidebar {
    margin-bottom: 1.5rem;
    padding: 0 1rem;
  }

}

/* Button group for sub-brand navigation */
.boot-styles .button-group {
  margin-bottom: 2rem;
}

.boot-styles .button-group .button {
  background-color: #fff;
  border: 1px solid #ccc;
  color: #333;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}

.boot-styles .button-group .button.active,
.boot-styles .button-group .button:hover {
  background-color: #2a7c7c;
  border-color: #2a7c7c;
  color: #fff;
}

.boot-styles .featured-image-caption,
.boot-styles .boot-info h2 {
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}

.boot-styles .boot-info h2 {
  font-size: 1.875rem;
}

/* Boot gallery grid */
.boot-styles .boot-gallery-grid li {
  margin-bottom: 1.5rem;
  text-align: center;
}

.boot-styles .boot-gallery-grid li img {
  background-color: #eee;
  display: block;
  width: 100%;
}

.boot-styles .boot-style-number {
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  margin-top: 0.5rem;
  text-transform: uppercase;
}

/* Boot detail / entry page */
.boot-styles .boot-entry {
  padding-bottom: 4rem;
}

/* Image area: thumbs on left, large image on right */
.boot-styles .boot-entry-images {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
}

/* Thumbnail grid: 2 columns on the left */
.boot-styles .boot-img-thumbs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  flex-shrink: 0;
  width: 35%;
}

.boot-styles .boot-img-thumbs .thumb {
  cursor: pointer;
}

.boot-styles .boot-img-thumbs .thumb img {
  background-color: #eee;
  display: block;
  width: 100%;
}

.boot-styles .boot-img-thumbs .thumb.active img {
  border: 2px solid #2a7c7c;
}

/* Large main image */
.boot-styles .boot-img-lg {
  flex: 1;
  min-width: 0;
}

.boot-styles .boot-img-lg img {
  background-color: #eee;
  display: block;
  width: 100%;
}

/* Boot info panel */
.boot-styles .boot-info h2 {
  color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.875rem;
  font-weight: 700;
  margin-bottom: 1rem;
  text-transform: uppercase;
}

.boot-styles .boot-details li {
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.9375rem;
  padding: 0.25rem 0;
}

.boot-styles .boot-details .detail.name {
  color: #333;
  font-weight: 700;
}

.boot-styles .boot-details .detail.value {
  color: #666;
  font-weight: 400;
}

.boot-styles .boot-description {
  color: #666;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.6;
  margin-top: 1.5rem;
}

.boot-styles .boot-entry-nav {
  margin-top: 1.5rem;
}

.boot-styles .boot-entry-nav .nav {
  color: #333;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
}

.boot-styles .boot-entry-nav .nav:hover {
  color: #2a7c7c;
}

/* Mobile: stack thumbnails above large image */
@media screen and (max-width: 40em) {

  .boot-styles .boot-entry-images {
    flex-direction: column;
  }

  .boot-styles .boot-img-thumbs {
    width: 100%;
    order: 2;
    margin-top: 0.75rem;
  }

  .boot-styles .boot-img-lg {
    order: 1;
  }

  .boot-styles .boot-info {
    padding-top: 1.5rem;
  }

}

/* 9. About Our Boots */

.about-our-boots .page-content {
  padding-bottom: 0;
}

/* Three-panel hero banner */
.about-our-boots .three-panel-banner {
  display: flex;
  gap: 0;
  height: 650px;
  margin: 0;
  overflow: hidden;
  padding: 0;
}

.about-our-boots .three-panel-banner .panel {
  background-color: #999;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  flex: 1;
  margin: 0;
  padding: 0;
}

.about-our-boots .three-panel-banner .macie-bean-panel {
  background-image: url('/images/pages/MB-Boots-Header-1600x650.jpg');
}

.about-our-boots .three-panel-banner .top-hand-panel {
  background-image: url('/images/pages/MB-TopHand-Header-1600x650.jpg');
}

.about-our-boots .three-panel-banner .swedge-panel {
  background-image: url('/images/pages/MB-Swedge-Header-1600x650.jpg');
}

@media screen and (max-width: 64em) {

  .about-our-boots .three-panel-banner {
    height: 400px;
  }

}

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

  .about-our-boots .three-panel-banner {
    height: 200px;
  }

}

/* Boot style detail sections */
.about-our-boots .boot-style-detail-banner {
  padding: 3rem;
  text-align: center;
  text-transform: lowercase;
}

.about-our-boots .boot-style-detail-banner.macie-bean {
  background-color: #fff;
}

.about-our-boots .boot-style-detail-banner.top-hand {
  background-color: #E7E7E8;
}

.about-our-boots .boot-style-detail-banner.swedge {
  background-color: #fff;
}

.about-our-boots .boot-style-detail-banner img {
  display: inline-block;
  max-width: 200px;
}

.about-our-boots .boot-style-detail-banner p {
  color: #999;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 500;
  margin-top: 1rem;
}

.about-our-boots .boot-style-detail-banner ul {
  list-style-type: none;
  margin: 2rem 0 0 0;
}

.about-our-boots .boot-style-nav {
  margin: 2rem 0;
}

.about-our-boots .boot-style-nav .button {
  background-color: #fff;
  border: 1px solid #ccc;
  color: #333;
  display: block;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  margin: 0 2rem 0.5rem 2rem;
  text-transform: uppercase;
}

.about-our-boots .boot-style-nav .button:hover {
  background-color: #2a7c7c;
  border-color: #2a7c7c;
  color: #fff;
}

/* 10. Our Story */

.our-story .page-banner {
  background-image: url('/images/pages/MB-OurStory-Header-1600x444.jpg');
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 444px;
}

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

  .our-story .page-banner {
    height: 150px;
  }

}

.our-story h1,
.our-story h2 {
  border: none;
  color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.875rem;
  font-weight: 700;
  text-transform: none;
}

.our-story .story-headline {
  color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 500;
  margin: 6rem 0 2rem 0;
  text-align: center;
}

.our-story .content p {
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
}

.our-story h1 {
  margin-top: 4rem;
}

/* 11. Find a Retailer */

.find-a-retailer .page-banner {
  background-image: url('/images/pages/MB-FindRetailer-Header-1600x650.jpg');
  background-position: center center;
  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) {

  .find-a-retailer .page-banner {
    height: 200px;
  }

}

.find-a-retailer h1 {
  color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 2rem;
  font-weight: 700;
  margin: 3rem 0 1rem 0;
  text-transform: uppercase;
}

/* Add whitespace between retailer content and footer */
.find-a-retailer .page-content {
  padding-bottom: 4rem;
}

/* 12. Secondary Pages (Contact, FAQs, Ambassadors, Gift Certificate) */

.contact .page-banner,
.faqs .page-banner,
.ambassadors .page-banner,
.gift-certificate .page-banner,
.features-and-care .page-banner {
  background-image: url('/images/pages/MB-OurStory-Header-1600x444.jpg');
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 444px;
}

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

  .contact .page-banner,
  .faqs .page-banner,
  .ambassadors .page-banner,
  .gift-certificate .page-banner,
  .features-and-care .page-banner {
    height: 150px;
  }

}

/* Footer link pages: fonts, headings, body copy, buttons, whitespace */
.contact .heading h1,
.faqs .heading h1,
.ambassadors .heading h1,
.gift-certificate .heading h1,
.features-and-care .heading h1 {
  color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 2rem;
  font-weight: 700;
  padding: 6rem 0 1rem 0;
  text-transform: uppercase;
}

.contact .content,
.faqs .content,
.ambassadors .content,
.gift-certificate .content,
.features-and-care .content {
  padding-bottom: 4rem;
}

.contact .content,
.faqs .content,
.ambassadors .content,
.gift-certificate .content,
.features-and-care .content {
  font-family: "Roboto Condensed", sans-serif !important;
  font-weight: 400;
}

.contact .content p,
.contact .content li,
.contact .content span,
.contact .content div,
.contact .content a,
.contact .content strong,
.contact .content b,
.contact .content td,
.contact .content th,
.faqs .content p,
.faqs .content li,
.faqs .content span,
.faqs .content div,
.faqs .content a,
.faqs .content strong,
.faqs .content b,
.faqs .content td,
.faqs .content th,
.ambassadors .content p,
.ambassadors .content li,
.ambassadors .content span,
.ambassadors .content div,
.ambassadors .content a,
.ambassadors .content strong,
.ambassadors .content b,
.ambassadors .content td,
.ambassadors .content th,
.gift-certificate .content p,
.gift-certificate .content li,
.gift-certificate .content span,
.gift-certificate .content div,
.gift-certificate .content a,
.gift-certificate .content strong,
.gift-certificate .content b,
.gift-certificate .content td,
.gift-certificate .content th,
.features-and-care .content p,
.features-and-care .content li,
.features-and-care .content span,
.features-and-care .content div,
.features-and-care .content a,
.features-and-care .content strong,
.features-and-care .content b,
.features-and-care .content td,
.features-and-care .content th {
  font-family: "Roboto Condensed", sans-serif !important;
}

.contact .content h2,
.contact .content h3,
.contact .content h4,
.faqs .content h2,
.faqs .content h3,
.faqs .content h4,
.ambassadors .content h2,
.ambassadors .content h3,
.ambassadors .content h4,
.gift-certificate .content h2,
.gift-certificate .content h3,
.gift-certificate .content h4,
.features-and-care .content h2,
.features-and-care .content h3,
.features-and-care .content h4 {
  color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif !important;
  font-weight: 700;
  text-transform: uppercase;
}

.contact .content label,
.ambassadors .content label,
.gift-certificate .content label {
  font-family: "Roboto Condensed", sans-serif !important;
  font-weight: 700;
  text-transform: uppercase;
}

.contact .content input[type="text"],
.contact .content input[type="email"],
.contact .content textarea,
.contact .content select,
.ambassadors .content input[type="text"],
.ambassadors .content input[type="email"],
.ambassadors .content textarea,
.ambassadors .content select,
.gift-certificate .content input[type="text"],
.gift-certificate .content input[type="email"],
.gift-certificate .content textarea,
.gift-certificate .content select {
  font-family: "Roboto Condensed", sans-serif !important;
}

.contact .content .button,
.faqs .content .button,
.ambassadors .content .button,
.gift-certificate .content .button,
.features-and-care .content .button {
  background-color: #2a7c7c;
  font-family: "Roboto Condensed", sans-serif !important;
  font-weight: 700;
  text-transform: uppercase;
}

.contact .content .button:hover,
.faqs .content .button:hover,
.ambassadors .content .button:hover,
.gift-certificate .content .button:hover,
.features-and-care .content .button:hover {
  background-color: #2F6D71;
}

/* Force Roboto Condensed on ALL elements within these pages (forms, CMS content, Freeform fields) */
.contact *,
.faqs *,
.ambassadors *,
.gift-certificate *,
.features-and-care *,
.our-story * {
  font-family: "Roboto Condensed", sans-serif !important;
}

/* Ambassadors brand logos on page */
.ambassadors .addendum-brands img {
  max-height: 44px;
  width: auto;
}

/* Floral border accents for footer - hide on medium and small */
@media screen and (max-width: 64em) {
  .addendum-wrap {
    background-image: none;
  }
}