body {
  margin: 0;
  font-family: "Metropolis-Regular", Helvetica, sans-serif; }
  body .wrapper {
    max-width: 1200px;
    margin: 0px auto;
    padding: 0px 20px; }
    @media only screen and (min-width: 1116px) and (max-width: 1400px) {
      body .wrapper {
        max-width: 100%; } }
    @media only screen and (min-width: 768px) and (max-width: 1115px) {
      body .wrapper {
        max-width: unset;
        width: auto;
        margin: 0px; } }
  body p {
    line-height: 1.5em; }
  body a {
    color: #003C79;
    font-weight: 300;
    text-decoration: none;
    line-height: 1.5em; }
  body button {
    background-color: unset;
    border: none; }
  body header {
    background-image: url(/img/gradient-bar.png);
    background-size: 100% 8px;
    background-repeat: no-repeat;
    background-position: center bottom;
    padding: 50px 0px 30px 0px; }
    body header .logo {
      display: inline;
      padding-right: 40px; }
    body header h1 {
      display: inline;
      font-size: 33px;
      font-weight: 300; }
      body header h1 a {
        color: #686868; }
    body header .header-links {
      float: right;
      margin: 5px 0px 0px 0px;
      padding-left: 0px; }
      body header .header-links li:last-of-type {
        padding-right: 0px; }
      body header .header-links a {
        font-size: 16px; }
    body header .mobile-hamburger, body header .mobile-menu {
      display: none; }
    @media only screen and (min-width: 768px) and (max-width: 1115px) {
      body header .logo {
        padding-right: 15px; }
      body header h1 {
        font-size: 20px; }
      body header .header-links li {
        padding-right: 15px; } }
    @media only screen and (max-width: 767px) {
      body header {
        position: relative;
        padding: 30px 0px 20px 0px; }
        body header .logo {
          display: block;
          margin: auto;
          padding-right: 0px;
          margin-bottom: 20px; }
        body header h1 {
          display: block;
          font-size: 20px;
          width: 60%;
          margin: auto;
          text-align: center; }
        body header .header-links {
          display: none; }
        body header .mobile-hamburger {
          display: block;
          position: absolute;
          top: 20px;
          right: 20px; }
        body header .mobile-menu {
          box-shadow: 0px 0px 20px #a2a2a2;
          background-color: #fff;
          position: absolute;
          top: 60px;
          right: 10px;
          width: 200px; }
          body header .mobile-menu ul {
            padding: 15px 0px 20px 15px; }
            body header .mobile-menu ul li {
              display: block;
              margin-bottom: 20px; }
              body header .mobile-menu ul li:last-of-type {
                margin-bottom: 0px; } }
  body footer {
    padding: 30px 0px 100px 0px;
    background-image: url(/img/gradient-bar.png);
    background-size: 100% 8px;
    background-repeat: no-repeat;
    background-position: center top; }
    body footer img {
      display: block; }
    body footer .left-links {
      padding: 0px;
      float: left;
      margin-top: 20px; }
      body footer .left-links li {
        color: #28333C; }
        body footer .left-links li a {
          color: #28333C; }
    body footer .right-links {
      margin-top: 20px;
      padding: 0px;
      float: right; }
    @media only screen and (max-width: 767px) {
      body footer {
        padding: 35px 0px 20px 0px; }
        body footer img {
          margin-bottom: 30px; }
        body footer ul li {
          display: block;
          margin-bottom: 10px; }
        body footer .left-links, body footer .right-links {
          float: unset; }
        body footer .left-links {
          margin-bottom: 35px; } }
  body li {
    list-style-type: none;
    display: inline;
    padding-right: 25px;
    font-size: 12px; }
  body .hero {
    background-repeat: no-repeat;
    background-position: left center;
    margin: 0px auto 40px auto; }
    body .hero.home {
      background-image: url(/img/homepage-hero.png);
      height: 548px; }
      body .hero.home .text-block {
        padding-top: 0px;
        max-width: 445px; }
        body .hero.home .text-block p {
          max-width: 350px; }
      body .hero.home h2 {
        margin-top: .5em; }
      body .hero.home .wrapper {
        position: relative; }
        body .hero.home .wrapper .image {
          position: absolute;
          top: 0px;
          right: 20px; }
          @media only screen and (min-width: 1116px) and (max-width: 1400px) {
            body .hero.home .wrapper .image {
              top: 60px; } }
          @media only screen and (min-width: 768px) and (max-width: 1115px) {
            body .hero.home .wrapper .image {
              width: 335px;
              top: 165px; } }
          @media only screen and (max-width: 767px) {
            body .hero.home .wrapper .image {
              display: none; } }
    body .hero.green {
      background-image: url(/img/green-hero.png);
      height: 324px; }
    body .hero.blue {
      background-image: url(/img/blue-hero.png);
      height: 324px; }
    body .hero.aqua {
      background-image: url(/img/aqua-hero.png);
      height: 324px; }
    body .hero.green-teal {
      background-image: url(/img/green-teal-hero.png);
      height: 324px; }
    body .hero.blue-purple {
      background-image: url(/img/blue-purple-hero.png);
      height: 324px; }
    body .hero.purple-blue {
      background-image: url(/img/purple-blue-hero.png);
      height: 324px; }
    @media only screen and (min-width: 1401px) {
      body .hero {
        width: 1460px; } }
    body .hero h2 {
      font-weight: 300;
      line-height: 1.25em;
      font-size: 40px;
      margin: 0px 0px .5em 0px; }
    body .hero img {
      padding: 35px 0px 15px 0px; }
    body .hero .text-block {
      max-width: 500px;
      color: #fff;
      padding-top: 20px; }
    body .hero hr {
      border: 0;
      height: 1px;
      background: #fff;
      max-width: 600px;
      margin-left: 0px; }
    @media only screen and (max-width: 767px) {
      body .hero {
        padding: 0px;
        width: auto;
        background-size: cover;
        background-position: bottom right; }
        body .hero.home {
          width: auto;
          height: 670px;
          background-image: url(/img/homepage-hero-mobile.png); }
        body .hero.green {
          height: 550px;
          background-image: url(/img/green-hero-mobile.png); }
        body .hero.blue {
          background-image: url(/img/blue-hero-mobile.png);
          height: 550px; }
        body .hero.aqua {
          background-image: url(/img/aqua-hero-mobile.png);
          height: 550px; }
        body .hero.green-teal {
          background-image: url(/img/green-teal-hero-mobile.png);
          height: 550px; }
        body .hero.blue-purple {
          background-image: url(/img/blue-purple-hero-mobile.png);
          height: 550px; }
        body .hero.purple-blue {
          background-image: url(/img/purple-blue-hero-mobile.png);
          height: 550px; }
        body .hero .text-block {
          padding-top: 40px; } }
  body .grid.two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: 40px;
    column-gap: 50px;
    margin-bottom: 60px; }
    body .grid.two .card {
      background-color: #f5f5f5;
      display: grid;
      grid-template-columns: 220px 1fr; }
      body .grid.two .card .mobile-image {
        display: none; }
      body .grid.two .card .card-content {
        padding: 20px 20px 0px 20px; }
        body .grid.two .card .card-content p {
          margin-top: 0px;
          color: #686868; }
          body .grid.two .card .card-content p a {
            font-size: 28px;
            margin-bottom: .5em; }
            @media only screen and (min-width: 768px) and (max-width: 1115px) {
              body .grid.two .card .card-content p a {
                font-size: 22px; } }
        @media only screen and (max-width: 767px) {
          body .grid.two .card .card-content {
            padding: 20px 0 0 0; } }
      @media only screen and (min-width: 768px) and (max-width: 1115px) {
        body .grid.two .card {
          grid-template-columns: 180px 1fr; }
          body .grid.two .card img {
            width: 100%;
            height: 100%;
            object-fit: cover; } }
    @media only screen and (min-width: 768px) and (max-width: 1115px) {
      body .grid.two {
        column-gap: 30px; } }
    @media only screen and (max-width: 767px) {
      body .grid.two {
        grid-template-columns: 1fr; }
        body .grid.two .card {
          grid-template-columns: 1fr;
          background-color: #fff; }
          body .grid.two .card .desktop-image {
            display: none; }
          body .grid.two .card .mobile-image {
            display: block;
            object-fit: cover; }
          body .grid.two .card img {
            width: 100%;
            height: 220px; } }
  body .grid.three {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    row-gap: 120px;
    column-gap: 35px;
    margin-bottom: 125px; }
    body .grid.three .card {
      position: relative; }
      body .grid.three .card img {
        width: 100%; }
      body .grid.three .card .label {
        color: #fff;
        text-transform: uppercase;
        padding: 10px 0px 10px 25px;
        width: 235px;
        position: absolute;
        bottom: 30px;
        z-index: 1; }
        body .grid.three .card .label.green {
          background-color: #78BF20; }
        body .grid.three .card .label.blue {
          background-color: #003C79; }
        body .grid.three .card .label.aqua {
          background-color: #07B1C3; }
        body .grid.three .card .label.bright-blue {
          background-color: #0091DA; }
      body .grid.three .card .title {
        background-color: #f5f5f5;
        padding: 30px 25px 0px 25px;
        width: 270px;
        height: 90px;
        position: absolute;
        bottom: -70px; }
        body .grid.three .card .title a {
          font-size: 18px; }
    @media only screen and (min-width: 768px) and (max-width: 1115px) {
      body .grid.three {
        grid-template-columns: 1fr 1fr; } }
    @media only screen and (max-width: 767px) {
      body .grid.three {
        grid-template-columns: 1fr; } }

@font-face {
  font-family: "Metropolis-Bold";
  src: url("/fonts/Metropolis-Bold.eot");
  src: url("/fonts/Metropolis-Bold.eot?#iefix") format("embedded-opentype"), url("/fonts/Metropolis-Bold.woff2") format("woff2"), url("/fonts/Metropolis-Bold.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Metropolis-BoldItalic";
  src: url("/fonts/Metropolis-BoldItalic.eot");
  src: url("/fonts/Metropolis-BoldItalic.eot?#iefix") format("embedded-opentype"), url("/fonts/Metropolis-BoldItalic.woff2") format("woff2"), url("/fonts/Metropolis-BoldItalic.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Metropolis-Light";
  src: url("/fonts/Metropolis-Light.eot");
  src: url("/fonts/Metropolis-Light.eot?#iefix") format("embedded-opentype"), url("/fonts/Metropolis-Light.woff2") format("woff2"), url("/fonts/Metropolis-Light.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Metropolis-LightItalic";
  src: url("/fonts/Metropolis-LightItalic.eot");
  src: url("/fonts/Metropolis-LightItalic.eot?#iefix") format("embedded-opentype"), url("/fonts/Metropolis-LightItalic.woff2") format("woff2"), url("/fonts/Metropolis-LightItalic.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Metropolis-Regular";
  src: url("/fonts/Metropolis-Regular.eot");
  src: url("/fonts/Metropolis-Regular.eot?#iefix") format("embedded-opentype"), url("/fonts/Metropolis-Regular.woff2") format("woff2"), url("/fonts/Metropolis-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Metropolis-RegularItalic";
  src: url("/fonts/Metropolis-RegularItalic.eot");
  src: url("/fonts/Metropolis-RegularItalic.eot?#iefix") format("embedded-opentype"), url("/fonts/Metropolis-RegularItalic.woff2") format("woff2"), url("/fonts/Metropolis-RegularItalic.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Metropolis-Medium";
  src: url("/fonts/Metropolis-Medium.eot");
  src: url("/fonts/Metropolis-Medium.eot?#iefix") format("embedded-opentype"), url("/fonts/Metropolis-Medium.woff2") format("woff2"), url("/fonts/Metropolis-Medium.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Metropolis-MediumItalic";
  src: url("/fonts/Metropolis-MediumItalic.eot");
  src: url("/fonts/Metropolis-MediumItalic.eot?#iefix") format("embedded-opentype"), url("/fonts/Metropolis-MediumItalic.woff2") format("woff2"), url("/fonts/Metropolis-MediumItalic.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Metropolis-SemiBold";
  src: url("/fonts/Metropolis-SemiBold.eot");
  src: url("/fonts/Metropolis-SemiBold.eot?#iefix") format("embedded-opentype"), url("/fonts/Metropolis-SemiBold.woff2") format("woff2"), url("/fonts/Metropolis-SemiBold.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Metropolis-SemiBoldItalic";
  src: url("/fonts/Metropolis-SemiBoldItalic.eot");
  src: url("/fonts/Metropolis-SemiBoldItalic.eot?#iefix") format("embedded-opentype"), url("/fonts/Metropolis-SemiBoldItalic.woff2") format("woff2"), url("/fonts/Metropolis-SemiBoldItalic.woff") format("woff");
  font-weight: normal;
  font-style: normal; }