@font-face {
  font-family: "aleobold";
  src: url("../assets/fonts/aleo-bold-webfont.woff2") format("woff2"), url("aleo-bold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "aleoregular";
  src: url("../assets/fonts/aleo-regular-webfont.woff2") format("woff2"), url("aleo-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "font_awesome_5_brandsregular";
  src: url("../assets/fonts/fontawesome5brands-regular-webfont.woff2") format("woff2"), url("fontawesome5brands-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "font_awesome_5_prolight";
  src: url("../assets/fonts/fontawesome5pro-light-webfont.woff2") format("woff2"), url("fontawesome5pro-light-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "gothambold";
  src: url("../assets/fonts/gotham-bold-webfont.woff2") format("woff2"), url("gotham-bold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "gothambook";
  src: url("../assets/fonts/gotham-book-webfont.woff2") format("woff2"), url("gotham-book-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "gothammedium";
  src: url("../assets/fonts/gotham-medium-webfont.woff2") format("woff2"), url("gotham-medium-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "pt_sansregular";
  src: url("../assets/fonts/ptsans-regular-webfont.woff2") format("woff2"), url("ptsans-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
html {
  scroll-behavior: smooth;
}

* {
  font-size: 15px;
}

body {
  position: relative;
  overflow-x: hidden;
}
@media (max-width: 768px) {
  body {
    padding: 0;
  }
}
body .div-container {
  overflow-x: hidden;
}

.logo {
  width: 14rem;
}
@media (max-width: 768px) {
  .logo {
    width: 176px;
  }
}
@media (max-width: 400px) {
  .logo {
    width: 140px;
  }
}

h1,
h5 {
  font-family: "aleoregular";
}

h1 {
  font-size: 3.5rem;
}

h2 {
  font-family: "aleobold";
  font-size: 2.4rem;
}

h3 {
  font-family: "aleobold";
  font-size: 2rem;
}

p {
  font-family: "PT Sans";
  font-size: 1.2rem;
}

strong {
  font-weight: bolder !important;
}

section {
  margin-bottom: 6rem;
}

a:hover {
  color: #79CC39;
  text-decoration: none;
}

/* Button */
.btn-primary {
  border-radius: 1.5rem;
  background-color: #79CC39 !important;
  border: 0;
  font-family: "aleobold";
  vertical-align: -webkit-baseline-middle;
  font-size: 1.3rem;
  padding: 0.5rem 1.8rem;
}
.btn-primary:hover {
  background-color: #61a72b !important;
  outline: none;
}
.btn-primary:active, .btn-primary:focus {
  outline: none;
}

/* Navigation */
.nav-link {
  font-size: 1.5rem;
  font-weight: 700;
  color: black;
  font-family: "PT Sans";
}
.nav-link:hover {
  color: #38434D;
}
@media (max-width: 768px) {
  .nav-link {
    font-size: 0.9rem;
    display: inline-block;
  }
}
.nav-link.active {
  border-bottom: 4px solid #38434d;
  border-bottom-style: dotted;
}

.nav-item {
  margin-left: 2rem;
}
@media (max-width: 768px) {
  .nav-item {
    margin-left: 0.5rem;
  }
}

/* Media */
.media img {
  width: 80px;
  height: 80px;
}

/* Infographics */
.how-infographics img {
  width: 100px;
  height: 100px;
  object-fit: contain;
}
@media (max-width: 768px) {
  .how-infographics img {
    width: 80%;
  }
}
.how-infographics label {
  display: block;
  text-align: center;
  font-family: "aleoregular";
  margin-top: 0.5rem;
  font-size: 1.3rem;
  line-height: 1.3;
}
@media (max-width: 768px) {
  .how-infographics label {
    font-size: 0.8rem;
  }
}

.benefits-img {
  width: 100px;
  height: 100px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
@media (max-width: 768px) {
  .benefits-img {
    width: 40px;
    height: 40px;
  }
}

.logo-white {
  background-color: white;
  width: 400px;
  height: 400px;
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  margin-top: -240px;
  margin-left: -76px;
}
@media (max-width: 768px) {
  .logo-white {
    background-color: white;
    width: 298px;
    height: 298px;
    margin-top: -187px;
  }
}

/* Oval */
.oval {
  position: absolute;
  width: 100%;
  height: 460px;
  background-image: url(../assets/images/top-oval.png);
  background-size: cover;
  background-repeat: no-repeat;
  z-index: -1;
  background-position: bottom;
}

/* Hero */
.hero {
  height: 290px;
  margin-bottom: 6rem;
  margin-top: 4rem;
}

/* FAQ */
details {
  margin-bottom: 2rem;
}
details p,
details button {
  padding-right: 2rem;
  padding-left: 2rem;
}
details p {
  margin-top: 1.5rem;
  margin-bottom: 0;
}
details button {
  border: 0;
  color: #38434D;
  text-decoration: underline;
  font-weight: bold;
  margin-top: 0.5rem;
}

summary::-webkit-details-marker {
  color: #79CC39;
  background: transparent;
}

summary {
  background-color: #F0F0F0;
  padding: 1rem;
  border-radius: 1rem;
  margin-bottom: 0.5rem;
  font-size: 1.5rem;
  font-weight: 500;
}
summary:focus {
  outline: none;
}

/* Get in touch */
.get-in-touch {
  padding: 3rem;
  background-color: #F0F0F0;
  margin-bottom: 0;
}
@media (max-width: 768px) {
  .get-in-touch {
    padding: 3rem 1rem 3rem 1rem;
  }
}
.get-in-touch a {
  font-size: 1.5rem;
  font-weight: bold;
}

/* Parallax */
.rellax {
  position: relative;
}
@media (max-width: 768px) {
  .rellax {
    display: none;
  }
}

.rel-first .bubble-left {
  margin-top: 210px;
}

.bubble-left {
  width: 15rem;
  margin-left: -100px;
  position: absolute;
}

.bubble-right {
  width: 15rem;
  margin-right: -100px;
  margin-top: 10rem;
  position: absolute;
  right: 0;
}

.bubble-footer {
  width: 15rem;
  margin-right: -120px;
  margin-top: -160px;
  position: absolute;
  right: 0;
}
@media (max-width: 768px) {
  .bubble-footer {
    display: none;
  }
}

/* Footer */
footer {
  color: white;
  padding: 2rem;
  background-color: #38434D;
}
@media (max-width: 768px) {
  footer {
    padding: 1rem 0.5rem;
  }
}
footer label,
footer a {
  color: white;
  font-family: "PT Sans";
  font-weight: 700;
}
footer a {
  font-size: 1.3rem;
}
@media (max-width: 768px) {
  footer a {
    font-size: 0.8rem;
  }
}
footer .cba-logo {
  display: block;
  width: 22rem;
  margin-top: 0.5rem;
}
footer .footer-social img {
  width: 20px;
  margin-left: 0.5rem;
}
footer .footer-link.active {
  border-bottom: 4px solid white;
  border-bottom-style: dotted;
  padding-bottom: 0.5rem;
}

/*# sourceMappingURL=style.css.map */