@font-face {
  font-family: 'OpenSauceOne';
  src: url('fonts/OpenSauceOne-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'OpenSauceOne';
  src: url('fonts/OpenSauceOne-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'CanvaSans';
  src: url('fonts/CanvaSans-Regular.woff2') format('opentype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
    font-family: 'Hagrid-Extrabold';
    src: url('fonts/Hagrid-Extrabold.woff2') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Hagrid-Regular';
    src: url('fonts/Hagrid-Regular.woff2') format('truetype');
    font-weight: normal;
    font-style: normal;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* hide underline added by styles.php */
a:before {
  height: 0px;
}

html, body {
  overflow-x: hidden;
}

body {
  font-family: 'OpenSauceOne', sans-serif !important;
  color: #333333 !important;
  background-color: #ffffff !important;
}

.section {
  padding: 40px 20px;
  text-align: center;
}

.tall-height {
    min-height: 1065px;
    height: auto !important;
}

.color-blue {
    color: #4960e5
}

.color-white {
    color: white;
}

.color-pink {
    color: #f4bdf3;
}

.color-grey {
  color: #525252;
}

.circle{
    border-radius: 50%;
    position: absolute;
}

.btn-course {
  background-color: #7c20ff;
  color: white;
  border: none;
  padding: 6px 14px;
  border-radius: 12px;
  margin-top: 10px;
  font-size: 14px;
}

.flex {
  display: flex;
}

.flex-column {
  display: flex;
  flex-direction: column;
}

.justify-content-center {
  justify-content: center;
}

.justify-content-end {
  justify-content: end;
}

.circle-top {
  position: absolute;
  top: -125px;
  left: 50%;
  transform: translateX(-50%);
}

img.responsive {
  max-width: 100%;
/*   height: auto; */
}

.mb-125 {
  margin-bottom: 125px;
}

.bg-f4bdf3 {
  background-color: #f4bdf3;
}

.bg-ffd872 {
  background-color: #ffd872;
}

.bg-5474fc {
  background-color: #5474fc;
}

.pl-150 {
  padding-left: 150px;
}

.align-start {
  align-items: start;
}
 
.animate { opacity: 0; transition: opacity 0.8s ease-out; will-change: opacity; }
.animate.visible { opacity: 1; }

.animate {
  opacity: 0;
  transition: opacity 0.8s ease-out;
  will-change: opacity;
}

.animate.visible {
  opacity: 1;
}

/***Responsive**/

/* === BASE STYLES === */
.section-title {
  font-size: 34px;
  font-weight: 800;
  margin-bottom: 12px;
  font-family: 'Hagrid-Extrabold', sans-serif;
}

.section-subtitle {
  font-size: 38.5px;
  font-weight: 400;
}

.font-size-75 {
  font-size: 75px !important;
}

.font-size-95 {
  font-size: 95px !important;
}

.font-size-100 {
  font-size: 100px !important;
}

.font-size-165 {
  font-size: 165px !important;
}

.font-size-170 {
  font-size: 170px !important;
}


/* === MEDIA QUERIES === */

/* ≤ 1700px */
@media (max-width: 1700px) {
  .section-title { font-size: 32px; }
  .section-subtitle { font-size: 36px; }
  .font-size-75 { font-size: 70px !important; }
  .font-size-95 { font-size: 88px !important; }
  .font-size-100 { font-size: 92px !important; }
  .font-size-165 { font-size: 150px !important; }
  .font-size-170 { font-size: 155px !important; }
}

/* ≤ 1500px */
@media (max-width: 1500px) {
  .section-title { font-size: 30px; }
  .section-subtitle { font-size: 33px; }
  .font-size-75 { font-size: 65px !important; }
  .font-size-95 { font-size: 82px !important; }
  .font-size-100 { font-size: 86px !important; }
  .font-size-165 { font-size: 140px !important; }
  .font-size-170 { font-size: 135px !important; }
}

/* ≤ 1366px */
@media (max-width: 1366px) {
  .section-title { font-size: 28px; }
  .section-subtitle { font-size: 31px; }
  .font-size-75 { font-size: 60px !important; }
  .font-size-95 { font-size: 76px !important; }
  .font-size-100 { font-size: 80px !important; }
  .font-size-165 { font-size: 130px !important; }
  .font-size-170 { font-size: 125px !important; }
}

/* ≤ 1280px */
@media (max-width: 1280px) {
  .section-title { font-size: 26px; }
  .section-subtitle { font-size: 28px; }
  .font-size-75 { font-size: 56px !important; }
  .font-size-95 { font-size: 70px !important; }
  .font-size-100 { font-size: 74px !important; }
  .font-size-165 { font-size: 120px !important; }
  .font-size-170 { font-size: 115px !important; }
}

/* ≤ 992px */
@media (max-width: 992px) {
  .section-title { font-size: 24px; }
  .section-subtitle { font-size: 26px; }
  .font-size-75 { font-size: 50px !important; }
  .font-size-95 { font-size: 60px !important; }
  .font-size-100 { font-size: 66px !important; }
  .font-size-165 { font-size: 110px !important; }
  .font-size-170 { font-size: 105px !important; }
}

/* ≤ 768px */
@media (max-width: 768px) {
  .section-title { font-size: 22px; }
  .section-subtitle { font-size: 23px; }
  .font-size-75 { font-size: 44px !important; }
  .font-size-95 { font-size: 52px !important; }
  .font-size-100 { font-size: 58px !important; }
  .font-size-165 { font-size: 95px !important; }
  .font-size-170 { font-size: 90px !important; }
}

/* ≤ 500px */
@media (max-width: 500px) {
  .section-title { font-size: 21px; }
  .section-subtitle { font-size: 21px; }
  .font-size-75 { font-size: 40px !important; }
  .font-size-95 { font-size: 48px !important; }
  .font-size-100 { font-size: 52px !important; }
  .font-size-165 { font-size: 90px !important; }
  .font-size-170 { font-size: 75px !important; }
}

/* ≤ 360px */
@media (max-width: 360px) {
  .section-title { font-size: 20px; }
  .section-subtitle { font-size: 20px; }
  .font-size-75 { font-size: 38px !important; }
  .font-size-95 { font-size: 45px !important; }
  .font-size-100 { font-size: 48px !important; }
  .font-size-165 { font-size: 80px !important; }
  .font-size-170 { font-size: 75px !important; }
}




/* ≤1700px */
@media (max-width: 1700px) {
  .pl-150 {
    padding-left: 130px;
  }
}

/* ≤1500px */
@media (max-width: 1500px) {
  .pl-150 {
    padding-left: 110px;
  }
}

/* ≤1366px */
@media (max-width: 1366px) {
  .pl-150 {
    padding-left: 100px;
  }
}

/* ≤1280px */
@media (max-width: 1280px) {
  .pl-150 {
    padding-left: 30px;
  }
}

/* ≤992px */
@media (max-width: 992px) {
  .pl-150 {
    padding-left: 30px;
  }
}

/* ≤768px */
@media (max-width: 768px) {
  .pl-150 {
    padding-left: 30px;
  }
}

/* ≤500px */
@media (max-width: 500px) {
  .pl-150 {
    padding-left: 30px;
  }
}

/* ≤360px */
@media (max-width: 360px) {
  .pl-150 {
    padding-left: 20px;
  }
}

/* ≤1700px */
@media (max-width: 1700px) {
  .tall-height {
    min-height: 950px;
  }
}

/* ≤1500px */
@media (max-width: 1500px) {
  .tall-height {
    min-height: 850px;
  }
}

/* ≤1366px */
@media (max-width: 1366px) {
  .tall-height {
    min-height: 770px;
  }
}

/* ≤1280px */
@media (max-width: 1280px) {
  .tall-height {
    min-height: 690px;
  }
}

/* ≤992px */
@media (max-width: 992px) {
  .tall-height {
    min-height: 600px;
  }
}

/* ≤768px */
@media (max-width: 768px) {
  .tall-height {
    min-height: 520px;
  }
}

/* ≤500px */
@media (max-width: 500px) {
  .tall-height {
    min-height: 440px;
  }
}

/* ≤360px */
@media (max-width: 360px) {
  .tall-height {
    min-height: 380px;
  }
}