/* 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 7, but if you do -- maybe just use a custom class  :)  */
.banner {
  position: relative; }
  .banner:after {
    content: '';
    background: linear-gradient(0deg, rgba(50, 50, 52, 0.55) 0%, #323234 100%);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0; }
  .banner .banner-content-wrap {
    z-index: 99;
    position: relative; }
    .banner .banner-content-wrap h1 span {
      margin-top: 5px;
      display: block;
      font-family: "Montserrat", "Arial Narrow", "Verdana", serif;
      font-size: clamp(1.875rem, calc(30px + (50 - 30) * ((100vw - 320px) / (1920 - 320))), 3.125rem); }

.intro {
  padding: 100px 0 0 0; }
  .intro h2 {
    position: relative;
    margin: 0 auto 2rem auto;
    padding-bottom: 1.25rem; }
    .intro h2:after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 0 auto;
      width: 76px;
      height: 4px;
      background-color: #51806A; }
  .intro .store-logo {
    margin: 0 auto 2rem auto;
    max-width: 230px !important;
    max-height: 150px !important;
    width: auto !important;
    height: auto !important; }

.store-info {
  padding: 75px 0 0 0; }
  .store-info .img img,
  .store-info .img picture {
    border-radius: 5px; }
  .store-info .img-wrap {
    overflow: hidden;
    border-radius: 5px; }
    .store-info .img-wrap img,
    .store-info .img-wrap picture {
      border-radius: 5px; }
    @media (min-width: 1025px) {
      .store-info .img-wrap {
        position: relative; }
        .store-info .img-wrap img,
        .store-info .img-wrap picture {
          position: absolute;
          object-fit: cover;
          object-position: top;
          height: 100% !important;
          max-height: 100% !important;
          width: 100% !important;
          max-width: 100% !important; }
          .store-info .img-wrap img img,
          .store-info .img-wrap picture img {
            max-width: 100% !important; } }
  .store-info .store-card {
    height: 100%;
    background-color: #F8F8F8;
    padding: 2rem 2rem; }
    @media (min-width: 641px) {
      .store-info .store-card {
        padding: 2rem 3rem; } }
    .store-info .store-card h4 {
      margin-bottom: 8px;
      font-weight: 600; }
    .store-info .store-card address {
      display: block;
      margin-bottom: 2rem; }
    .store-info .store-card address,
    .store-info .store-card span,
    .store-info .store-card a {
      font-size: 18px; }
    .store-info .store-card .hours {
      display: flex;
      justify-content: space-between;
      max-width: 500px;
      align-items: center;
      margin-bottom: 5px; }
      .store-info .store-card .hours .day {
        margin-right: 10px; }
      .store-info .store-card .hours .time {
        margin-left: 10px;
        text-align: left;
        min-width: 102px; }
      .store-info .store-card .hours .dots {
        flex: 1;
        width: 100%;
        height: 1px;
        border-bottom: 1px dotted #DBDADA; }
      .store-info .store-card .hours:last-of-type {
        margin-bottom: 16px; }
    .store-info .store-card a {
      display: block;
      margin-bottom: 2rem; }

.chefs-vendors {
  padding: 100px 0; }
  .chefs-vendors h2 {
    position: relative;
    margin: 0 auto 2rem auto;
    padding-bottom: 1.25rem; }
    .chefs-vendors h2:after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 0 auto;
      width: 76px;
      height: 4px;
      background-color: #51806A; }
  .chefs-vendors .vendor-card img, .chefs-vendors .vendor-card picture {
    height: 150px !important;
    max-height: 150px !important;
    width: 100% !important;
    max-width: 100% !important;
    object-fit: cover;
    margin-bottom: 1rem;
    border-radius: 5px; }
  .chefs-vendors .vendor-card h6 {
    font-weight: 700;
    font-size: 20px;
    margin-bottom: 0; }
  .chefs-vendors hr {
    background: #B2B2B2;
    border-top: #B2B2B2;
    margin-top: 3rem;
    margin-bottom: 0rem; }
