:root {
  /* Color Tokens */
  --color__blue: #0076a3;
  --color__white: #ffffff;
  --color__grey: #CACECF;
  --background-color: transparent;
  --background-image__footer-gradient: linear-gradient(180deg, #e4ffda 0%, #b8dcdf 100%);
  --background-image__main-section-gradient: linear-gradient(0deg, rgba(255, 224, 162, 1) 0%, rgba(215, 248, 254, 1) 100%);
  --color-foreground: #202020;
  --charcoal-black: #1D1C1D;
  --bright-royal-blue: #1863DC;
  --deep-slate-blue: #293C5B;
  --sky-blue: #2EA3F2;
  --midnight-teal: #05242F;
  --classic-green: #008000;
  --dark-forest-green: #133107;
  --deep-woodland-green: #143108;
  --ocean-navy: #004760;
  --fresh-leaf-green: #45A51E;
  --teal-blue: #0076A3;

  /* Spacing Tokens */
  --container-width: 100%;
  --container-max-width: none;
  --spacer-top: 30px;
  --spacer-bottom: 30px;

  /* Typography Tokens */
  --text__font-color: #000;
  --text__line-height: 1.6em;
  --text__font-weight: 300;
  --text__font-size: 18px;
  --text_font-family_public: "Public Sans",Helvetica,Arial,Lucida,sans-serif;
  --text_font-family_poppins: "Poppins",Helvetica,Arial,Lucida,sans-serif;
  --link__font-color: #2ea3f2;
  --link__text-decoration: none;
  --subtitle__font-color: #888;

  /* Miscellaneous Tokens */
  --border-radius: 40px;

  --gradient-height-desktop-offset: 0px;
  --gradient-height-mobile-offset: 0px;
}

header.initializing {
  height: 168px;
  padding-top: 54px;
  @media (max-width: 767px) {
    height: 220px;
  }
  @media (min-width: 981px) {
    padding-top: 4%;
  }
  @media (min-width: 1350px) {
    padding-top: 54px;
  }
  @media (max-width: 980px) {
    padding-top: 40px;
  }
}


html,
body {
  margin: 0;
  font-size:   var(--text__font-size);
  font-family: var(--text_font-family_public);
  line-height: var(--text__line-height);
  color:       var(--color-foreground);
  background:  var(--background-color);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  display: none;
}
body.appear {
  display: block;
}

a,a:hover {
  color: var(--link__font-color);
  text-decoration: var(--link__text-decoration);
}

button,
input,
optgroup,
select,
textarea {
  font: inherit;
}

h1,h2,h3,h4,h5,h6 {
  font-family: var(--text_font-family_poppins);
  font-weight: 400;
  padding-bottom: 10px;
  margin: 0;
}

/* default font sizes */

h1, h2, h3, h4, h5, h6, p, .caption, .quote {
  line-height: var(--text__line-height);
  color: var(--text__font-color);
  font-size: var(--text__font-size);
}
h1 {
  --text__font-size: 44px;
}
h2 {
  --text__font-size: 32px;
}
h3 {
  --text__font-size: 28px;
}
h4, .footer-links a  {
  --text__font-size: 24px;
}
h5, h6 {
  --text__font-size: 20px;
}
.caption {
  font-size: 16px;
}
sub {
  font-size: var(--text__font-size);
}

/* default font sizes - mobile */
@media only screen and (max-width: 768px) {
  h1 { --text__font-size: 32px; }
  h2, #heading-create-impact h2, .quote  { --text__font-size: 30px; }
  h3 { --text__font-size: 26px; }
  h4, .footer-links a { --text__font-size: 22px; }
  h5, h6 { --text__font-size: 20px; }
}
ul {
  list-style-type: disc;
}

.section i[class^="lh-icon--"]:before,
.section i[class*=" lh-icon--"]:before,
.header i[class*="lh-icon--"]:before {
  vertical-align: middle;
  line-height: inherit;
}

/* Spacing for each block */
.default-content-wrapper,
.columns > div > div,
.cards > ul > li > *,
.button-wrapper,
.cta-wrapper,
.tiles-wrapper,
.title-wrapper,
.carousel-wrapper,
.video-wrapper,
.section.gutters-loose {
  padding-top: var(--spacer-top);
  padding-bottom: var(--spacer-bottom);
  position: relative;
  z-index: 2;
}
.default-content-wrapper > p:has(picture) {
  margin: 0 auto;
}

.default-content-wrapper img,
.image-link img {
  max-width: 100%;
  height: auto;
}

/* Section - Styles */
.section {
  background-color: var(--background-color);
  box-sizing: border-box;

  &.gutters-loose {
    background-color: transparent;

    @media (max-width: 980px) {
      .columns > div > div {
        --spacer-top: 0;
        --spacer-bottom: 0;
      }
    }
  }

  &.gutters-loose > * > * {
    padding: var(--spacer-top) 100px var(--spacer-bottom);
    background-color: var(--background-color);

    @media (max-width: 768px) {
      padding: var(--spacer-top) 40px var(--spacer-bottom);
    }
  }

  @media (width >= 767px) {
    &.gutters-loose > * > * {
      padding-left: 100px;
      padding-right: 100px
    }
  }

  &.bg-gradient {
    position: relative;
    &.rounded:before {
      border-radius: 100px;
    }
    &:before {
      content: "";
      width: 100%;
      height: 100%;
      position: absolute;
      background: linear-gradient(0deg, rgba(255, 224, 162, 1) 0%, rgba(215, 248, 254, 1) 100%);
      display: block;
      left: 0;
    }
  }

  &.bg-charcoal-black {
    --background-color: var(--charcoal-black);
  }
  &.bg-bright-royal-blue {
    --background-color: var(--bright-royal-blue);
  }
  &.bg-deep-slate-blue {
    --background-color: var(--deep-slate-blue);
  }
  &.bg-sky-blue {
    --background-color: var(--sky-blue);
  }
  &.bg-midnight-teal {
    --background-color: var(--midnight-teal);
  }
  &.bg-classic-green {
    --background-color: var(--classic-green);
  }
  &.bg-dark-forest-green {
    --background-color: var(--dark-forest-green);
  }
  &.bg-deep-woodland-green {
    --background-color: var(--deep-woodland-green);
  }
  &.bg-ocean-navy {
    --background-color: var(--ocean-navy);
  }
  &.bg-fresh-leaf-green {
    --background-color: var(--fresh-leaf-green);
  }
  &.bg-teal-blue {
    --background-color: var(--teal-blue);
  }
  &.rounded,
  &.rounded.gutters-loose > * > * {
    border-radius: var(--border-radius);
  }

  &.bg-charcoal-black,
  &.bg-deep-slate-blue,
  &.bg-midnight-teal,
  &.bg-dark-forest-green,
  &.bg-deep-woodland-green,
  &.bg-ocean-navy,
  &.bg-teal-blue
  {
    --text__font-color: #FFFFFF;
  }

  &.width-sm > * {
    max-width: 720px;
    margin: auto;
    width: 80%;
  }
  &.width-md > *{
    max-width: 900px;
    margin: auto;
    width: 80%;
  }
  &.width-lg > * {
    max-width: 1080px;
    margin: auto;
    width: 80%;
  }
  &.width-xlg > * {
    max-width: 1440px;
    margin: auto;
    width: 90%;
  }

  &.expanding-circles {
    position: relative;
  }
}

.section.bg-gradient {
  &:before {
    height: calc(100% + var(--gradient-height-desktop-offset));
    z-index: -1;
  }
  @media only screen and (max-width: 767px) {
    &:before {
      height: calc(100% + var(--gradient-height-mobile-offset));
    }
  }
}

.section.bg-gradient.gradient-top-offset {
  &:before {
    top: -300px;
    --gradient-height-desktop-offset: 300px;
  }
  @media only screen and (max-width: 767px) {
    &:before {
      top: -200px;
      --gradient-height-mobile-offset: 200px;
    }
  }
}
.section.bg-gradient.gradient-bottom-offset {
  &:before {
    --gradient-height-desktop-offset: 200px;
  }
  @media only screen and (max-width: 767px) {
    &:before {
      --gradient-height-mobile-offset: 230px;
    }
  }
}
.section.bg-gradient.gradient-top-offset.gradient-bottom-offset {
  &:before {
    --gradient-height-desktop-offset: 500px;
  }
  @media only screen and (max-width: 767px) {
    &:before {
      --gradient-height-mobile-offset: 430px;
    }
  }
}