/*
 * Load custom font
 -----------------------------------------------------------------*/

 @import url("https://use.typekit.net/uog1qpd.css");

/*
 * Font settings
 -----------------------------------------------------------------*/
.font-heading,
.brand-prose h2,
.brand-prose h3 {
  font-family: "filson-soft", sans-serif;
  font-style: normal;
  font-weight: 700;
  text-transform: none;
}

/*
 * Brand colours
 -----------------------------------------------------------------*/
/*body*/
.text-default { color: #374151; }
.text-darker { color: #111827; }
.text-heading { color: #5d4232; }
.text-cta { color: #5d4232 !important; }
.text-reversed { color: #FFFFFF !important; }
.text-reversed-cta { color: #FFFFFF !important; }
.bg-default { background-color: #FFFFFF; }
.bg-darker { background-color: #F3F4F6; }
.bg-cta { background-color: #5d4232; }
.bg-cta-seethrough { background-color: rgba(0,79,163,0.85); }
.bg-reversed-cta { background-color: #FFFFFF !important; }
.border-cta { border-color: #5d4232; }
.border-reversed-cta { border-color: #FFFFFF; }
.border-product-links { border-color: #F3F4F6; }
.border-pale { border-color: #D1D5DB; }
/*footer*/
.bg-footer-primary { background-color: #5d4232; }
.bg-footer-secondary { background-color: #D1D5DB; }
.border-footer-secondary { border-color: #D1D5DB; }
.text-footer-primary { color: #FFFFFF; }
.text-footer-secondary { color: #d8bcb5; }
a.text-footer-primary:hover { color: #d8bcb5; }
/*header*/
.bg-accent { background-color: #d8bcb5; }
.text-accent { color: #FFFFFF; }
.bg-header-primary { background-color: #5d4232; }
.bg-header-secondary { background-color: #d8bcb5; }
.border-header-secondary { border-color: #d8bcb5; }
.text-nav-primary { color: #FFFFFF; }
.text-nav-secondary { color: #FFD040; }
.border-nav { border-color: #5d4232; }
.bg-header-nav { background-color: #D1D5DB; }

/*
 * Extras
 -----------------------------------------------------------------*/
.flickity-button { background: #d8bcb5; }
.flickity-button-icon { fill: #FFFFFF; }
.flickity-button:hover { background: #d8bcb5; }
.flickity-page-dots .dot { background: #d8bcb5; }
hr.divider { background-image: url("/profiles/gf/themes/custom/gf_justbakery/assets/divider.png"); }
.homepage-quote:before,
.homepage-quote:after { background-image: url("/profiles/gf/themes/custom/gf_justbakery/assets/quotes.png"); }

.recipe-feature-image-bg:after,
.article-feature-image-bg:after,
.campaign-feature-image-bg:after { background: #FFFFFF }
/*
 * Brand prose styles
 -----------------------------------------------------------------*/
.brand-prose h2,
.brand-prose h3,
.brand-prose h4,
.brand-prose a {
  color: #5d4232;
}

/*
 * Button styles
 -----------------------------------------------------------------*/
.button,
a.button {
  color: #FFFFFF;
  background-color: #5d4232;
  border-color: #5d4232;
}
.button:hover,
a.button:hover {
  color: #5d4232;
  background-color: transparent;
  border-color: #5d4232;
}
.button.button--secondary,
a.button.button--secondary {
  color: #5d4232;
  background-color: transparent;
}
.button.button--secondary:hover,
a.button.button--secondary:hover {
  color: #ffffff;
  background-color: #5d4232;
}
.button.button--cta,
a.button.button--cta {
  color: #FFFFFF;
  background-color: #d8bcb5;
  border-color: #d8bcb5;
}
.button.button--cta:hover,
a.button.button--cta:hover {
  color: #d8bcb5;
  background-color: #FFFFFF;
  border-color: #FFFFFF;
}
.dark-style .button,
.dark-style a.button {
  color: #5d4232;
  background-color: #FFFFFF;
  border-color: #FFFFFF;
}
.dark-style .button:hover,
.dark-style a.button:hover {
  color: #FFFFFF;
  background-color: transparent;
  border-color: #FFFFFF;
}
.dark-style .button.button--secondary,
.dark-style a.button.button--secondary {
  color: #FFFFFF;
  background-color: transparent;
  border-color: #FFFFFF;
}
.dark-style .button.button--secondary:hover,
.dark-style a.button.button--secondary:hover {
  color: #5d4232;
  background-color: #FFFFFF;
  border-color: #FFFFFF;
}
/*
 * Responsive menu settings
 -----------------------------------------------------------------*/
.font-nav nav > ul {
  /* Mobile, first-level nav (only), is brand font. */
  font-family: "filson-soft", sans-serif;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
}

.font-nav nav > ul > li > ul > * {
  font-family: 'filson-soft', 'sans-serif';
  font-weight: 700;
  font-style: normal;
}

.nav-main-menu .sub-menu {
  background-color: #5d4232;
  color: #d8bcb5;
}

@media screen and (min-width: 768px) {
  .font-nav nav > ul {
    font-family: 'filson-soft', 'sans-serif';
    font-weight: 700;
    font-style: normal;
    text-transform: none;
  }
  .nav-main-menu a.is-active {
    color: #ffffff;
    background-color: #9A7F73;
  }
  .nav-main-menu a:hover,
  .nav-main-menu li.is-hover a,
  .nav-main-menu-search:hover {
    color: #ffffff;
    background-color: #9A7F73;
  }

  .nav-main-menu a, .nav-main-menu-search {
    border-radius: 20px 20px 0px 0px;
  }
}


.nav-main-menu-search.is-active  {
  color: #ffffff;
  background-color: #9A7F73;
}