@import url('/sites/content/css/2600016803409');
@import url('/sites/content/css/2600016778956');

/* Defaults for Hero Banners */
.banner-hero-container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 260px;
  max-width: 960px;
  width: 100%;
  margin-top: var(--vd-space-l);
  margin-bottom: var(--vd-space-l);
  margin-left: auto;
  margin-right: auto;
  border-radius: 3px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  container-type: inline-size;
  container-name: banner-hero;
}

/* text focused classes */
.banner-hero-textfocused .banner-primary-message,
.banner-hero-textfocused .banner-secondary-message {
  max-width: 600px;
}

/* imagery focused classes */
.banner-hero-container .banner-imagery {
  height: 200px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* product focused classes */
.banner-hero-container .banner-product {
  display: flex;
  justify-content: center;
  align-items: center;
}

.banner-hero-container .banner-product > img {
  width: 100%;
  height: 100%;
  max-width: 320px;
  max-height: 180px;
  object-fit: contain;
  object-position: center;
}

@supports (container-type: inline-size) {
  /* Medium devices (tablets, 768px and up) */
  @container banner-hero (min-width: 768px) {
    /* imagery/product focused classes */
    .banner-hero-container .banner-content-imagelocationwrap {
      min-height: inherit;
    }

    /* imagery focused classes */
    .banner-hero-container .banner-imagery {
      height: auto;
    }

    /* product focused classes */
    .banner-hero-container .banner-product {
      height: auto;
    }

    .banner-hero-productfocused .banner-content-imageleft .banner-product {
      padding-right: 0;
      padding-bottom: auto;
    }

    .banner-hero-productfocused .banner-content-imageright .banner-product {
      padding-left: 0;
      padding-bottom: auto;
    }
  }

  @container banner-hero (max-width: 768px) {
    /* product focused classes */
    .banner-hero-productfocused .banner-content-imageleft .banner-product,
    .banner-hero-productfocused .banner-content-imageright .banner-product {
      padding-bottom: 0;
    }
  }
}

@supports not (container-type: inline-size) {
  /* Medium devices (tablets, 768px and up) */
  @media (min-width: 768px) {
    /* imagery/product focused classes */
    .banner-hero-container .banner-content-imagelocationwrap {
      min-height: inherit;
    }

    /* imagery focused classes */
    .banner-hero-container .banner-imagery {
      height: auto;
    }

    /* product focused classes */
    .banner-hero-container .banner-product {
      height: auto;
    }

    .banner-hero-productfocused .banner-content-imageleft .banner-product {
      padding-right: 0;
      padding-bottom: auto;
    }

    .banner-hero-productfocused .banner-content-imageright .banner-product {
      padding-left: 0;
      padding-bottom: auto;
    }
  }

  @media (max-width: 768px) {
    /* product focused classes */
    .banner-hero-productfocused .banner-content-imageleft .banner-product,
    .banner-hero-productfocused .banner-content-imageright .banner-product {
      padding-bottom: 0;
    }
  }
}

/* Defaults for Catalog Banners */
.banner-catalog-container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 180px;
  max-width: 700px;
  width: 100%;
  margin-top: var(--vd-space-m);
  margin-bottom: var(--vd-space-m);
  margin-left: auto;
  margin-right: auto;
  border-radius: 3px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  container-type: inline-size;
  container-name: banner-catalog;
}

/* text focused classes */
.banner-catalog-textfocused .banner-primary-message,
.banner-catalog-textfocused .banner-secondary-message {
  max-width: 500px;
}

/* imagery focused classes */
.banner-catalog-container .banner-imagery {
  height: 150px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* product focused classes */
.banner-catalog-container .banner-product {
  display: flex;
  justify-content: center;
  align-items: center;
}

.banner-catalog-container .banner-product > img {
  width: 100%;
  height: 100%;
  max-width: 250px;
  max-height: 130px;
  object-fit: contain;
  object-position: center;
}

@supports (container-type: inline-size) {
  /* Medium devices (tablets, 768px and up) */
  @container banner-catalog (min-width: 480px) {
    /* imagery/product focused classes */
    .banner-catalog-container .banner-content-imagelocationwrap {
      min-height: inherit;
    }

    /* imagery focused classes */
    .banner-catalog-container .banner-imagery {
        height: auto;
    }

    /* product focused classes */
    .banner-catalog-container .banner-product {
      height: auto;
    }

    .banner-catalog-productfocused .banner-content-imageleft .banner-product {
      padding-right: 0;
      padding-bottom: auto;
    }

    .banner-catalog-productfocused .banner-content-imageright .banner-product {
      padding-left: 0;
      padding-bottom: auto;
    }
  }

  @container banner-catalog (max-width: 480px) {
    /* product focused classes */
    .banner-catalog-productfocused .banner-content-imageleft .banner-product,
    .banner-catalog-productfocused .banner-content-imageright .banner-product {
      padding-bottom: 0;
    }
    .banner-imagery.banner-content-60 {
        height: 235px!important;
    }
  }
}

@supports not (container-type: inline-size) {
  /* Medium devices (tablets, 768px and up) */
  @media (min-width: 768px) {
    /* imagery/product focused classes */
    .banner-catalog-container .banner-content-imagelocationwrap {
      min-height: inherit;
    }

    /* imagery focused classes */
    .banner-catalog-container .banner-imagery {
        height: auto;
    }

    /* product focused classes */
    .banner-catalog-container .banner-product {
      height: auto;
    }

    .banner-catalog-productfocused .banner-content-imageleft .banner-product {
      padding-right: 0;
      padding-bottom: auto;
    }

    .banner-catalog-productfocused .banner-content-imageright .banner-product {
      padding-left: 0;
      padding-bottom: auto;
    }
  }

  @media (max-width: 768px) {
    /* product focused classes */
    .banner-catalog-productfocused .banner-content-imageleft .banner-product,
    .banner-catalog-productfocused .banner-content-imageright .banner-product {
      padding-bottom: 0;
    }
  }
}

/* Defaults for Side Banners */
.banner-side-container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 320px;
  max-width: 220px;
  width: 100%;
  margin-top: var(--vd-space-l);
  margin-bottom: var(--vd-space-l);
  margin-left: auto;
  margin-right: auto;
  border-radius: 3px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}

/* imagery focused classes */
.banner-side-container .banner-imagery {
  height: 120px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* imagery/product focused classes */
.banner-side-imageryfocused .banner-content-block,
.banner-side-productfocused .banner-content-block {
  min-height: 200px;
}

/* product focused classes */
.banner-side-container .banner-product {
  height: 120px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.banner-side-container .banner-product > img {
  width: 100%;
  height: 100%;
  max-width: 150px;
  max-height: 100px;
  object-fit: contain;
  object-position: center;
}

.banner-side-container .banner-product {
  padding-bottom: 0;
}

/* Defaults for Brand Header Banners */
.banner-brand-header-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 120px;
  max-width: 700px;
  width: 100%;
  margin-top: var(--vd-space-m);
  margin-bottom: var(--vd-space-m);
  margin-left: auto;
  margin-right: auto;
  border-radius: 3px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}

/* brand header banner specific */
.banner-brand-header-container .banner-logo > img {
  width: 100%;
  height: 100%;
  max-height: 90px;
  max-width: 300px;
}