/** 7/3/23  **/

/****** Modular Main Hero Component *******/
.hp-hero-grid-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 0px 5px;
  align-items: center;
}

@media (max-width: 767px) {
  .nested-grid-item {
      display: contents;
  }

  .hp-hero-grid-wrapper {
      display: grid;
      gap: 0px 8px;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: auto 1fr;
      align-items: initial;
  }

  .hp-box-1 {
      grid-column: 1 / 2;
      grid-row: 1;
  }

  .hp-box-2 {
      grid-column: 2 /2;
      grid-row: 1;
  }

  .hp-box-3 {
      grid-column: 1 / 2;
      grid-row: 1;
      margin-top: 156%;
  }

  .hp-box-4 {
      grid-column: 2 / 2;
      grid-row: 1 / 2;
      margin-top: 77%;
  }
}

/****** END Modular Main Hero Component *******/

/****** Modular Main Hero Component - Flipped *******/
.hp-hero-grid-wrapper-flipped {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 0px 5px;
  align-items: center;
}

@media (max-width: 767px) {
  .nested-grid-item {
      display: contents;
  }

  .hp-hero-grid-wrapper-flipped .hp-box-1-flipped {
      grid-column: 2 / 2;
      grid-row: 1;
      margin-top: 77%;
  }

  .hp-hero-grid-wrapper-flipped .hp-box-2-flipped {
      grid-column: 2 /2;
      grid-row: 1;
  }

  .hp-hero-grid-wrapper-flipped .hp-box-3-flipped {
      grid-column: 1 / 2;
      grid-row: 1;
      margin-top: 156%;
  }

  .hp-hero-grid-wrapper-flipped .hp-box-4-flipped {
      grid-column: 1 / 2;
      grid-row: 1 / 2;
  }
}

/** Medium and Smaller Screen Sizes **/
@media (max-width: 767px) {
  .hp-hero-grid-wrapper-flipped {
      display: grid;
      gap: 0px 8px;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: auto 1fr;
      align-items: initial;
  }
}

/****** END Modular Main Hero Component - Flipped ***/

/****** Modular 4 Card Layout *******/
.hp-first-row,
.hp-second-row {
  display: grid;
  gap: 15px;
}

.hp-first-row {
  grid-template-columns: 66.75% 32.4%;
}

.hp-second-row {
  grid-template-columns: 32.4% 66.75%;
}

@media (max-width: 767px) {
  .hp-mod-4-card-layout {
      display: grid;
      gap: 15px;
  }

  .hp-first-row,
  .hp-second-row {
      display: contents;
  }

  .hp-first-row>div.spanTwoColumns,
  .hp-second-row>div.spanTwoColumns {
      width: 100%;
      grid-column: 1 / span 2;
  }

  .hp-first-row>div:first-child {
      grid-row: 1;
  }

  .hp-first-row>div:last-child,
  .hp-second-row>div:first-child {
      grid-row: 2;
  }

  .hp-second-row>div:last-child {
      grid-row: 3;
  }
}

/****** END Modular 4 Card Layout *******/

/****** Modular 4 Card Layout - V2 *******/
.hp-mod-4-card-layout-v2 .first-row,
.hp-mod-4-card-layout-v2 .middle-row,
.hp-mod-4-card-layout-v2 .third-row {
  display: contents;
}

@media (max-width: 767px) {
  .hp-mod-4-card-layout-v2 {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: auto;
      gap: 10px;
  }

  .hp-mod-4-card-layout-v2 .first-row,
  .hp-mod-4-card-layout-v2 .middle-row,
  .hp-mod-4-card-layout-v2 .third-row {
      display: grid;
  }

  .hp-mod-4-card-layout-v2 .first-row {
      grid-column: span 2;
  }

  .hp-mod-4-card-layout-v2 .middle-row:nth-child(2),
  .hp-mod-4-card-layout-v2 .middle-row:nth-child(3) {
      grid-column: span 1;
  }

  .hp-mod-4-card-layout-v2 .third-row {
      grid-column: span 2;
  }
}

/****** END Modular 4 Card Layout - V2 *******/

.display-contents-on-d {
  display: contents;
}

@media (max-width: 767px) {
  .display-contents-on-m {
      display: contents;
  }
}

a,
a.hp-link {
  color: #003366;
}

a:hover,
a.hp-link:hover {
  color: #003366;
  cursor: pointer;
}

.hp-col:hover h3,
.hp-col:hover .macro-title {
  text-decoration: underline !important;
}

.corners-small {
  border-radius: 0.25rem;
}

.corners-left {
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}

.corners-right {
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}

.corners-top {
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
}

.corners-bottom {
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}

.hp-col {
  position: relative;
}

.macro-title {
  font-weight: 700;
  font-size: 28px;
  line-height: 30px;
}

.macro-shop-all {
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 20px;
}

.text-kicker {
  font-size: 16px;
  line-height: 24px;
}

.text-special {
  font-size: 40px;
  line-height: 50px;
}

.light-border {
  border: 1px solid #e5ebf0;
} 

.macro-box {
  background-color: #1928A0;
  max-width: 320px;
}

.text-red {
  color: #b30000;
}

.text-promo-blue {
  color: #0255cc;
}

.mobile-only {
  display: block;
  /* show on mobile */
}

.desktop-only {
  display: none;
  /* hide on mobile */
}

/* Change display at the 768px breakpoint */
@media screen and (min-width: 768px) {
  .mobile-only {
      display: none;
      /* hide on desktop */
  }

  .desktop-only {
      display: block;
      /* show on desktop */
  }
}

/** Between Medium and Large **/
@media (min-width: 768px) and (max-width: 1400px) {
  .macro-title {
      font-weight: 700;
      font-size: 28px;
      line-height: 30px;
  }

  .macro-shop-all {
      font-style: normal;
      font-weight: 600;
      font-size: 18px;
      line-height: 20px;
  }

  h3.mod-title {
      font-size: 18px !important;
  }

  .text-special {
      font-size: 22px;
      line-height: 22px;
  }

  .text-kicker {
      font-size: 12px;
      line-height: 18px;
  }
}

/** Medium and Smaller Screen Sizes **/
@media (max-width: 767px) {
  h3.mod-title {
      font-size: 14px !important;
  }

  .macro-title {
      font-weight: 700;
      font-size: 28px;
      line-height: 30px;
  }

  .text-special {
      font-size: 22px;
      line-height: 22px;
  }

  .text-kicker {
      font-size: 12px;
      line-height: 18px;
  }

  .macro-title {
      font-weight: 700;
      font-size: 22px;
      line-height: 24px;
  }

  .macro-shop-all {
      font-weight: 600;
      font-size: 18px;
      line-height: 24px;
  }
}