.b-banner {
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  font: 400 16px/1.4rem  var(--font-primary);
  font-weight: var(--font-weight-normal);
  overflow: hidden;
  width: 100%;
}
.b-banner * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
.b-banner.m-100 {
  max-width: 960px;
}
.b-banner.m-50 {
  max-width: 450px;
}
.b-banner.m-vertical {
  flex-direction: column;
  max-width: 400px;
  text-align: center;
}

.b-hero {
  box-sizing: border-box;
  display: flex;
  font: 400 16px/1.4rem var(--font-primary);
  font-weight: var(--font-weight-normal);
  width: 100%;
  min-height: 200px;
  max-height: 260px;
  max-width: 960px;
  margin: 0 auto;
}
.b-hero * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.b-container {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  overflow: hidden;
}
.b-container.m-col-1 {
  width: 100%;
  text-align: center;
  margin: 0 auto;
}
.b-container.m-col-3-4 {
  width: 100%;
}
.b-container.m-col-2-3 {
  width: 100%;
}
.b-container.m-col-2 {
  width: 100%;
}
.b-container.m-col-1-3 {
  width: 100%;
}
.b-container.m-col-1-4 {
  width: 100%;
}
.b-container img.right {
  display: block;
  height: 100%;
  object-fit: contain;
  object-position: 100% 0;
}
.b-container img.left {
  display: block;
  height: 100%;
  object-fit: contain;
  object-position: 0 100%;
}

.b-content {
  height: 100%;
}
.b-content.m-content-flex {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.b-content.hero-content {
  align-items: center;
}

.b-title {
  font-family: var(--font-primary);
  font-weight: var(--font-weight-bold);
  line-height: 1;
  text-transform: uppercase;
}
.b-title + a {
  margin-top: 1rem;
}
.b-title.m-sm {
  font-size: 1.5rem;
}
.b-title.m-md {
  font-size: 1.75rem;
}
.b-title.m-lg {
  font-size: 2rem;
}
.b-title.m-xl {
  font-size: 2.5rem;
}

.b-subtitle {
  font-family: var(--font-primary);
  font-weight: var(--font-weight-semibold);
  line-height: 1.2;
}
.b-subtitle + a {
  margin-top: 1rem;
}
.b-subtitle.m-sm {
  font-size: 1rem;
}
.b-subtitle.m-md {
  font-size: 1.25rem;
}
.b-subtitle.m-lg {
  font-size: 1.5rem;
}
.b-subtitle.m-xl {
  font-size: 2rem;
}

.b-img-logo-sm {
  max-width: 120px;
}

.b-img-logo-lg {
  max-width: 200px;
}

.b-img-product {
  min-width: 200px;
}

img {
  display: inline-block;
  max-width: 100%;
}

.b-button {
  border-radius: .25rem;
  box-shadow: inset 0rem 0rem 0rem 0.1rem rgba(0, 0, 0, 0.1);
  display: inline-block;
  padding: .5rem 1rem;
  text-align: center;
  text-decoration: none;
}
.b-button.m-primary {
  background: #1c88c7;
  color: #ffffff;
}
.b-button.m-primary:hover {
  background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), #1c88c7;
}
.b-button.m-secondary {
  background: #d8e8f5;
  color: #1c88c7;
}
.b-button.m-secondary:hover {
  background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), #d8e8f5;
}
.b-button.m-link {
  box-shadow: none;
}

.m-bg-brand {
  background: #00446a;
}

.m-bg-light {
  background: #eff3f6;
}

.m-bg-dark {
  background: #03324c;
}

.m-bg-white {
  background: #ffffff;
}

.m-bg-info-alt {
  background: #dbe3e9;
}

.m-color-brand {
  color: #00446a;
}

.m-color-primary {
  color: #1c88c7;
}

.m-color-light {
  color: #eff3f6;
}

.m-color-dark {
  color: #03324c;
}

.m-color-white {
  color: #ffffff;
}

.m-padding {
  padding: 1rem;
}

.m-border-brand {
  border: 0.5rem solid #00446a;
}

.m-border-grey {
  border: 1px solid #dddddd;
}

.m-align-center {
  align-items: center;
}

.m-align-left {
  align-items: flex-start;
}

.m-align-right {
  align-items: flex-start;
}

@media screen and (min-width: 500px) {
  .b-banner.m-50.m-height-sm {
    height: 100%;
    max-height: 100%;
  }
  .b-banner.m-50.m-height-md {
    height: 100%;
    max-height: 100%;
  }
  .b-banner.m-50.m-height-lg {
    height: 100%;
    max-height: 100%;
  }
  .b-banner.m-height-sm {
    max-height: 120px;
    min-height: 100px;
  }
  .b-banner.m-height-md {
    max-height: 200px;
    min-height: 160px;
  }
  .b-banner.m-height-lg {
    min-height: 240px;
    max-height: 260px;
  }

  .b-container.m-col-1 {
    width: 80%;
  }
  .b-container.m-col-3-4 {
    width: 75%;
  }
  .b-container.m-col-2-3 {
    width: 66.6666666667%;
  }
  .b-container.m-col-2 {
    width: 50%;
  }
  .b-container.m-col-1-3 {
    width: 33.3333333333%;
  }
  .b-container.m-col-1-4 {
    width: 25%;
  }

  .m-padding {
    padding: 1.5rem;
  }

  .m-align-center {
    align-items: center;
  }

  .m-align-left {
    align-items: flex-start;
  }

  .m-align-right {
    align-items: flex-end;
  }
}
@media screen and (min-width: 960px) {
  .b-title.m-sm {
    font-size: 1.75rem;
  }
  .b-title.m-md {
    font-size: 2rem;
  }
  .b-title.m-lg {
    font-size: 2.5rem;
  }
  .b-title.m-xl {
    font-size: 3.5rem;
  }

  .b-subtitle.m-sm {
    font-size: 1rem;
  }
  .b-subtitle.m-md {
    font-size: 1.5rem;
  }
  .b-subtitle.m-lg {
    font-size: 2rem;
  }
  .b-subtitle.m-xl {
    font-size: 2.5rem;
  }

  .b-img-logo {
    max-width: 150px;
  }

  .b-img-product {
    min-width: 200px;
  }
}
