/* Added fallbacks to help with CLS, feel free to remove if it doesn't help on your project */
/* Colours */
/* Fluid heading sizes - set your min/max sizes and you're done! */
/* Some device sizes to use with min-width */
/* adjusted breakpoints for above */
/* 100% widths look better than "Snapping" IMO */
/* Utility */
/* Additional Spacers -- don't think you'll need more than 10, but if you do -- maybe just use a custom class  :)  */
#path-two,
#path-one {
  fill: #686868;
}

#masthead .container-logo {
  max-width: 180px;
}
#masthead .container-logo img {
  height: auto;
  width: fit-content;
  transition: height 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
#masthead {
  padding-bottom: 14px;
  background: #F3F3F3;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
#masthead .container-logo img {
  height: unset;
  width: fit-content;
}
#masthead .menu-span,
#masthead .icon-icons_menu {
  color: #007EA7;
}
#masthead.sticky #path-two,
#masthead.sticky #path-one {
  fill: #FFF;
}
#masthead.sticky .menu-span,
#masthead.sticky .icon-icons_menu {
  color: #AAE2F7;
}
@media screen and (min-width: 1431px) {
  #masthead.sticky .container-logo img {
    height: unset;
  }
}

#main {
  margin-top: 12em;
  margin-bottom: 4em;
}
@media screen and (min-width: 1025px) {
  #main {
    margin-top: 14em;
    margin-bottom: 6em;
  }
}