:root {
  --orange: #FF735C;
  --top-left: 0 100px 100px 100px;
  --top-left-small: 0 50px 50px 50px;
  --bottom-left: 100px 100px 100px 0;
  --bottom-left-small: 60px 60px 60px 0;
}

body {line-height: 1; font-family: 'RB-Rational-Neue-Test', sans-serif; font-size: 19px; color: #24053A;}
h1 {line-height: 1.2; font-family: 'RB-Rational-Neue-Mix-Test';}
h2 {line-height: 1.2; font-family: 'RB-Rational-Neue-Mix-Test';}
h3 {line-height: 1.1; font-family: 'RB-Rational-Neue-Mix-Test'; font-size: 3vw; margin-bottom: 2vw;}
h4 {line-height: 1.3; font-family: 'RB-Rational-Neue-Mix-Test'; font-size: 2vw; margin-bottom: 1.5vw;}
h5 {line-height: 1;}
p:last-child {margin-bottom: 0;}

.content p {font-size: 22px; margin-bottom: 2.5vw; line-height: 1.7; font-weight: 300;}

/* General */

.no-scroll {height: 100vh; overflow-y: hidden;}

.wrapper {max-width: 1720px; width: 100%; margin: 0 auto;}
.wrapper-lrg {max-width: 95%; margin: 0 auto; width: 100%;}
.wrapper-sml {max-width: 1530px; width: 100%; margin: 0 auto;}
.wrapper-xsml {max-width: 800px; width: 100%; margin: 0 auto;}

.button-outline {border-radius: 50px; border: 1px solid var(--orange); background: #24053A; transition: 0s ease; box-sizing: border-box; display: inline-block; padding: 13px 40px 16px; font-weight: 500; position: relative; overflow: hidden; z-index: 1; transition-delay: 0s;}
.button-outline::after {content: ""; display: block; position: absolute; border-radius: 50vw; background: var(--orange); width: 101%; top: 100%; left: 50%; height: 0; transition: 0.7s; padding-bottom: 100%; transform: translate(-50%,0%); z-index: -1;}

.button-outline:hover {background: var(--orange); transition-delay: 0.5s;}
.button-outline:hover::after {top: 50%; transform: translate(-50%,-50%);}

.button-outline.circle {height: 50px; width: 50px; padding: 0;}
.button-outline.circle::before {content: ""; display: block; mask-size: contain; mask-position: center; mask-repeat:no-repeat; width: 23px; height: 23px; background: #fff; top: 50%; left: 50%; transform: translate(-50%,-50%); position: absolute;}
.button-outline.circle::after {transition: 0.5s;}

.button-outline.circle.contact::before {mask-image: url('/img/contact.svg');}
.button-outline.circle.facebook::before {mask-image: url('/img/facebook.svg');}
.button-outline.circle.instagram::before {mask-image: url('/img/instagram.svg');}
.button-outline.circle.linkedin::before {mask-image: url('/img/linkedin.svg');}

.button-outline.light {border-radius: 50px; border: 1px solid #fff; background: #fff0; transition: 0s ease; box-sizing: border-box; display: inline-block; padding: 13px 40px 16px; font-weight: 500; position: relative; overflow: hidden; z-index: 1; transition-delay: 0s;}
.button-outline.light::after {background: #fff3;}

.button {border-radius: 50vw; border: 0; background: var(--orange); transition: 0s ease; box-sizing: border-box; display: inline-block; padding: 43px 60px 43px; font-weight: 500; position: relative; overflow: hidden; z-index: 1; transition-delay: 0s; color: #fff; font-size: 23px; line-height: 24px; font-family: inherit;}
.button::after {content: ""; display: block; position: absolute; border-radius: 50vw; background: #24053A; width: 100%; top: 100%; left: 50%; height: 0; transition: 0.7s; padding-bottom: 100%; transform: translate(-50%,0%); z-index: -1;}

.button:hover {background: #24053A; transition-delay: 0.5s; }
.button:hover::after {top: 50%; transform: translate(-50%,-50%);}

.button.small {font-size: 19px; line-height: 20px; padding: 15px 26px; cursor: pointer;}

.grid {display: grid; grid-template-columns: 1fr 1fr; align-items: center;}
.grid-left {display: grid; grid-template-columns: 500px 1fr; align-items: center;}

.cream-bg {background: #F6F4F1;}

/* CONTENT */

.gradient-bg {background: linear-gradient(180deg, rgba(245,241,237,1) 0%, rgba(245,241,237,1) 60%, rgba(255,255,255,1) 100%);}

.home-banner {padding: 10vw 0 5vw; position: relative;}
.home-banner::before {content: "";background: url('/img/background-circle.svg') right no-repeat;background-size: contain;position: absolute;top: 0;right: 0;width: 48vw;height: 140dvh;z-index: 0;}
.home-banner::after {content: "";background: url('/img/decoration-1.svg') right no-repeat;background-size: contain;position: absolute;top: 80dvh;left: -100px;width: 426px;height: 360px;z-index: 0;}
.home-banner .flex-row {align-items: initial;}

.home-banner article {max-width: 715px; width: 100%;}
.home-banner article h1 {font-size: 15px; font-weight: 500; margin-bottom: 5px; text-transform: uppercase; }
.home-banner article h2 {font-size: 3.5vw; font-weight: 500; margin-bottom: 20px;}
.home-banner article h2 em {color: #FF735C; font-style: normal;}
.home-banner article p {font-size: 1.4vw; font-weight: 200;}
.home-banner article .form-wrapper {margin-top: 80px;}
.home-banner article .form-wrapper input {box-shadow: 0 20px 50px #FF735C40;}

.inner-banner {padding: 10vw 0 5vw; position: relative; background: #F5F1ED;}
.inner-banner article {max-width: 715px; width: 100%;}
.inner-banner article h1 {font-size: 15px; font-weight: 500; margin-bottom: 10px; text-transform: uppercase; color: #FF735C;}
.inner-banner article h2 {font-size: 3.5vw; font-weight: 500; margin-bottom: 20px;}
.inner-banner article h2 em {color: #FF735C; font-style: normal;}
.inner-banner article p {font-size: 1.4vw; font-weight: 200;}
.inner-banner figure img {border-radius: var(--bottom-left-small)}

.inner-banner .toggle-switch {display: flex; align-items: center; position: relative; width: 300px; height: 45px; border: 1px solid #24053A; border-radius: 50vw; box-sizing: border-box; margin-bottom: 30px; margin-top: 40px;}
.inner-banner .toggle-switch input[type="radio"] { display: none;}
.inner-banner .toggle-switch label {flex: 1; text-align: center; line-height: 40px; cursor: pointer; color: #24053A; z-index: 1; font-size: 16px; font-weight: 500; transition: 0.5s;}
.inner-banner .toggle-switch .slider { position: absolute; top: -1px; bottom: -1px; left: -1px; background-color: #24053A; border-radius: 50vw; transition: 0.4s ease; z-index: 0; width: 100px;}

.inner-banner #inner-personal:checked ~ .slider { transform: translateX(0);}
.inner-banner #inner-business:checked ~ .slider { transform: translateX(100%);}
.inner-banner #inner-both:checked ~ .slider { transform: translateX(200%);}
.inner-banner #inner-personal:checked + label, .inner-banner #inner-business:checked + label, .inner-banner #inner-both:checked + label { color: #fff;}

.login-banner {background: #EDDEE5;}
.login-banner .wrapper-sml {padding: 250px 0; margin-bottom: -125px;}
.login-banner .login-box {background: #fff; border-radius: var(--top-left-small); box-sizing: border-box; padding: 50px 40px 30px; width: 100%; max-width: 600px; margin: 0 auto;box-shadow: 0 20px 50px #FF735C30; border: 1px solid #FF735C60; overflow: hidden;}
.login-banner .login-box h1 {text-transform: capitalize; font-size: 18px; font-weight: 500; color: #24053A; margin-bottom: 20px;}
.login-banner .login-box h2 {font-size: 2vw; line-height: 2.5vw; font-weight: 600; font-family: 'RB-Rational-Neue-Test', sans-serif; margin-bottom: 0px;}
.login-banner .login-box p {line-height: 1.5;}
.login-banner .login-box p#systemMessage {margin: 20px 0 10px;}
.login-banner .login-box #resetForm {margin-top: 20px;}
.login-banner .login-box #resetForm .form-field {grid-column: span 2;}
.login-banner .login-box.register h2 {margin-bottom: 20px;}
.login-banner .login-box.register p {margin-bottom: 10px;}
.login-banner .login-box .button-group p {margin: 0;}

.small-banner {padding: 230px 0 100px; background: #BCB7CC;}
.small-banner h1 {text-align: center; color: #fff; font-size: 2vw;}

.course-item {position: relative; width: auto; max-width: 154px; transition: 0.5s; overflow: hidden; transition: 0.5s; height: 700px; border-radius: var(--top-left); overflow: hidden;}
.course-item > span {position: absolute; z-index: 1; display: flex; flex-wrap: nowrap; align-items: center; height: 700px; flex-direction: column-reverse; width: 100%; box-sizing: border-box; padding-bottom: 50px; transition: 0.5s; right: 0;}
.course-item > span div {width: 30px; height: 30px; margin-top: 25px; background: #24053A; mask-size: contain; mask-position: center; mask-repeat:no-repeat;}
.course-item > span p {writing-mode: vertical-lr; display: inline-block; transform: rotate(180deg); font-size: 20px; text-transform: uppercase; font-weight: 500; letter-spacing: 5px;}
.course-item article {position: absolute; bottom: 50px; left: 45px; color: #fff;}
.course-item article p {font-size: 28px; font-weight: 400; margin-bottom: 15px;}
.course-item article span {font-size: 17px; font-weight: 300;}
.course-item figure {height: 100%; opacity: 0; transition: 0.3s; position: relative;}
.course-item figure .circle {position: absolute; width: 52px; height: 52px; border-radius: 50vw; background: var(--orange); right: 40px; top: 40px;}
.course-item figure .circle::before {content: ""; display: block; mask-size: contain; mask-position: center; mask-repeat:no-repeat; width: 28px; height: 28px; background: #fff; top: 50%; left: 50%; transform: translate(-50%,-50%); position: absolute;}
.course-item figure::after {content: ""; display: block; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(36,5,58,0) 70%, rgba(36,5,58,1) 100%);}
.course-item::after {content: ""; display: block; position: absolute; background: #D6D5DA; width: 800px; height: 800px; top: 0px; border-radius: 0vw; right: 0%; transition: 0.5s;}

.course-item.rocket > span div {mask-image: url('/img/rocket-icon.svg');}
.course-item.construction > span div {mask-image: url('/img/construction-icon.svg');}
.course-item.hospitality > span div {mask-image: url('/img/hospitality-icon.svg');}

.course-item.rocket .circle::before {mask-image: url('/img/rocket-icon.svg');}
.course-item.construction .circle::before {mask-image: url('/img/construction-icon.svg');}
.course-item.hospitality .circle::before {mask-image: url('/img/hospitality-icon.svg');}

.course-item.blue::after {background: #D6D5DA;}
.course-item.yellow::after {background: #E0DB9A;}
.course-item.brown::after {background: #D3B497;}

.course-item.opened {max-width: 474px; border-radius: var(--bottom-left);}
.course-item.opened figure {opacity: 1;}
.course-item.opened span {right: 100%;}
.course-item.opened::after {border-radius: 20vw; right: 100%;}

/*.category-slider h3 {text-align: center;}*/

.custom-pagination {display: flex; justify-content: center; margin-bottom: 50px;}
.custom-pagination a {margin: 0 10px; font-size: 20px;}
.custom-pagination a:first-of-type {font-weight: 600; border-bottom: 1px solid #24053A;}

.categorySwiper {width: 100vw;}
.categorySwiper .swiper-slide article {margin-top: 40px;}
.categorySwiper .swiper-slide article p strong {font-family: 'RB-Rational-Neue-Mix-Test'; font-size: 24px; display: block; margin-bottom: 15px; font-weight: 500;}
.categorySwiper .swiper-slide article p {font-size: 18px; font-weight: 300;}
.categorySwiper .swiper-slide figure {border-radius: var(--top-left-small); background: #f1f1f1; height: 400px;}

.custom-navigation {display: flex; justify-content: center; margin: 2vw 0; gap: 50px;}
.custom-navigation .custom-prev, .custom-navigation .custom-next {width: 50px; height: 50px; border-radius: 50vw; background: #FF735C00; transition: 0.5s; position: relative; cursor: pointer;}
.custom-navigation .custom-prev::after, .custom-navigation .custom-next::after {content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 30px; height: 30px; mask-image: url('/img/nav-arrow.svg'); mask-size:contain; mask-repeat:no-repeat; mask-position: center; background: #707070; transition: 0.5s;}
.custom-navigation .custom-prev:hover, .custom-navigation .custom-next:hover {background: #FF735C}
.custom-navigation .custom-prev:hover::after, .custom-navigation .custom-next:hover::after {background: #fff;}
.custom-navigation .custom-next {transform: rotate(180deg);}

.content.padding {padding: 6vw 0;}
.content.padding .grid {align-items: flex-start;}

.content.purple {background: #24053A; color: #fff; position: relative; z-index: 1;}
.purple .button::after {background: #D3B497;}

.content.border-radius {border-radius: var(--top-left);}

.content .grid > article:last-child {padding-right: 6vw; max-width: 710px;}
.content .grid > figure:first-child {margin-right: 6vw;}
.content figure {border-radius: var(--top-left); overflow: hidden;}

.info-tab {background: #E0DB9A; padding: 30px; border-radius: 20px; max-width: 680px; width: 100%; box-sizing: border-box; grid-template-columns: 1fr; margin-bottom: -45px; z-index: 1; position: relative;}
.info-tab .flex-row {flex-wrap: nowrap;/* border-right: 1px solid #000;*/ width: 100%; padding-right: 20px; box-sizing: border-box;justify-content: flex-start;}
.info-tab .flex-row p {margin: 0; font-size: 18px; line-height: 1.2;}
.info-tab .flex-row p strong {font-size: 44px; font-family: 'RB-Rational-Neue-Mix-Test'; display: inline-block; margin-right: 10px;}
.info-tab .flex-start:last-child {border: 0; padding-right: 0 !important; padding-left: 20px;}

.master h3 {max-width:550px;}

.highlight figure {border-radius: var(--top-left)}

.decoration-2 {position: relative;}
.decoration-2::after {content: "";background: url('/img/decoration-2.svg') right no-repeat;background-size: contain;position: absolute;bottom: -180px;right: 0px;width: 220px;height: 442px;z-index: -1;}

.highlight .container .grid {grid-template-columns: 70px 1fr; grid-gap: 30px; position: relative; opacity: 0; transition: 0.7s ease; box-sizing: border-box; padding-bottom: 90px;}
.highlight .container .grid article {max-width: 250px;}
.highlight .container .grid article p {margin: 0; font-size: 18px;}
.highlight .container .grid article p strong {font-size: 24px; font-weight: 700; margin-bottom: 5px; display: block;}
.highlight .container .grid figure {width: 70px; height: 70px; background: #D3B497; border-radius: 50vw; position: relative; margin-top: 8px;}
.highlight .container .grid figure img {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 30px; height: 30px; object-fit: contain;}
.highlight .container .grid > img {height: 72px; max-height: 0px; overflow: hidden; position: absolute; top: 110px; left: 34px; transition: 0.7s;}

.highlight .container .grid:nth-child(3) {padding-bottom: 0px;}

.highlight .container .grid:nth-child(2) figure {background: #BCB7CC;}
.highlight .container .grid:nth-child(3) figure {background: #D6D188;}
.highlight .container .grid:last-child > img {display: none;}

.highlight .in-view.container .grid {opacity: 1;}
.highlight .in-view.container .grid > img {max-height: 72px;}
.highlight .in-view.container .grid:nth-child(2) {transition-delay: 0.5s;}
.highlight .in-view.container .grid:nth-child(2) > img {max-height: 72px; transition-delay: 0.5s;}
.highlight .in-view.container .grid:nth-child(3) {transition-delay: 1s;}

.content.purple .grid-left {grid-template-columns: 565px 1fr;}

.stepsSwiper {width: 65vw; height: 394px; padding: 0 150px; box-sizing: border-box; position: absolute; right: -5vw;}

.steps-scroll { position: relative; overflow: hidden; width: 65vw;}
.stepsSwiper::before { content: ""; position: absolute; top: 0; bottom: 0; left: -50px; width: 50px; z-index: 9; box-shadow: 20px 0px 30px 30px #24053A; background: linear-gradient(to left, rgba(0, 0, 0, 0), #24053A);}

.steps-wrapper { width: auto; display: grid; height: 394px; padding-left: 150px; position: relative; overflow-y: scroll; scrollbar-width: none;}


.step-item {display: flex; height: 394px; align-items: flex-start; animation-delay: 0s;}
.step-item:nth-child(2n+2) {align-items: flex-end;}
.step-item:last-child {margin-right: 100px;}

.step-tile {border-radius: var(--top-left-small); padding: 35px 30px 25px; background: #E4D4C5; box-sizing: border-box; margin: 0 0 0 -80px; height: 160px; width: 350px; position: relative; transform: scale(0); transition: transform 0.6s ease-out; animation-delay: 0s;}
.step-tile p {margin-bottom: 0px!important; color: #24053A; font-size: 18px;}
.step-tile p strong {display: block; font-size: 24px; line-height: 1; margin-bottom: 10px;}
.step-tile > div {display: block; position: absolute; top: 20px; right: 25px; background: #24053A; width: 40px; height: 30px; mask-size:contain; mask-repeat:no-repeat;}

.on-screen .step-tile { animation: scaleUp 1s ease-out forwards; animation-delay: 0.5s;}

@keyframes scaleUp {
  0% {
    transform: scale(0);
  }
  60% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}

.step-tile::after {
  content: "";
  display: block;
  position: absolute;
  width: 117px;
  height: 130px;
  left: 155px;
  top: 160px;
  background: url('/img/dots-steps.svg') no-repeat center/contain;
  clip-path: inset(100% 0 0 0); /* Initially hides the element */
  transition: 0s;
}

.on-screen .step-tile::after {
  clip-path: inset(0 0 0 0); transition: clip-path 1s ease-in-out 1.5s;
}


.step-item:nth-child(2n+2) .step-tile::after {bottom: 155px; top: auto; transform: rotate(90deg);}
.step-item:last-child .step-tile::after {display: none;}

.step-item:nth-child(6n+2) .step-tile {background: #E0DB9A;}
.step-item:nth-child(6n+3) .step-tile {background: #D6D5DA;}
.step-item:nth-child(6n+4) .step-tile {background: #EDDEE5;}
.step-item:nth-child(6n+5) .step-tile {background: #E4D4C5;}
.step-item:nth-child(6n+6) .step-tile {background: #D0DAB2;}

.on-screen.step-item:nth-child(6n+5) .step-tile {animation-delay: 0s;}
.on-screen.step-item:nth-child(6n+6) .step-tile {animation-delay: 0s;}

.negative-margin {margin: -5vw 0; padding: 10vw 0;}


.content-standard {padding: 20vw 0 10vw;}
.content-standard h1 {font-size: 15px; font-weight: 500; margin-bottom: 5px; text-transform: uppercase;}
.content-standard h2 {font-size: 3.5vw; font-weight: 500; margin-bottom: 20px;}
.content-standard p {font-size: 1.2vw; line-height: 1.5; max-width: 600px; margin-bottom: 20px;}
.content-standard p:last-child {margin-bottom: 0px;}

.content-standard .wrapper-xsml h1 {margin-bottom: 10px;}
.content-standard .wrapper-xsml h2 {font-size: 40px;}
.content-standard .wrapper-xsml h3 {font-size: 30px; max-width: none; margin-bottom: 20px;}
.content-standard .wrapper-xsml p {font-size: 20px; max-width: none; margin-bottom: 30px;}
.content-standard .wrapper-xsml p:last-child {margin-bottom: 0px;}

.content-standard.contact article .flex-row {justify-content: flex-start; gap: 20px; margin-bottom: 50px;}
.content-standard.contact article .social-row + div p {display: flex; flex-direction: column;}
.content-standard.contact article .social-row .button-outline {border: 1px solid #24053A; background: transparent;}
.content-standard.contact article .social-row .button-outline::after {background: #24053A;}
.content-standard.contact article .social-row .button-outline.circle::before {background: #24053A; transition: 0.5s;}
.content-standard.contact article .social-row .button-outline.circle:hover::before {background: #fff; transition-delay: 0.3s;}
.content-standard.contact article .social-row .button-outline:hover {background: #24053A;}

.vertical-swiper-wrapper {display: grid; grid-template-columns: 125px 1fr; background: #fff; border-radius: var(--top-left); height: 790px; box-sizing: border-box; padding: 0 4vw 0 0; margin-bottom: 5vw; position: relative;}

.vertical-swiper-wrapper .custom-pagintion {position: relative;}
.vertical-swiper-wrapper .custom-pagintion .swiper-pagination {right: auto; left: 30px;}
.vertical-swiper-wrapper .custom-pagintion .swiper-pagination-bullet {width: 70px; height: 70px; background: #FF735C00; transition: 0.5s; position: relative; opacity: 1;}
.vertical-swiper-wrapper .custom-pagintion .swiper-pagination-bullet::before {content: ""; display: block; position: absolute; width: 30px; height: 30px; background: #24053A; top: 50%; left: 50%; transform: translate(-50%,-50%); mask-repeat: no-repeat; mask-size: contain; mask-position: center; transition: 0.5s;}
.vertical-swiper-wrapper .custom-pagintion .swiper-pagination-bullet-active {background: #FF735C;}
.vertical-swiper-wrapper .custom-pagintion .swiper-pagination-bullet-active::before {background: #fff;}

.vertSwiper {}
.vertSwiper .swiper-slide {display: grid; grid-template-columns: 1fr 1fr; grid-gap: 5vw; align-items: center; box-sizing: border-box; padding: 4vw 0;}
.vertSwiper .swiper-slide figure {border-radius: 0 70px 70px 70px; overflow: hidden; height: 100%;}
.vertSwiper .swiper-slide article h3 {margin-bottom: 1vw;}
.vertSwiper .swiper-slide article h6 {font-size: 15px; color: #FF735C; font-family: 'RB-Rational-Neue-Mix-Test'; line-height: 1.1; margin-bottom: 10px; text-transform: uppercase;}
.vertSwiper .swiper-slide article p {max-width: 545px; font-weight: 200; font-size: 22px; line-height: 1.6; margin-bottom: 1.5vw;}
.vertSwiper .swiper-slide article div p {margin-bottom: 0; line-height: 1.3;}
.vertSwiper .swiper-slide .details {position: absolute; bottom: 50px; right: 20px; display: flex;}
.vertSwiper .swiper-slide .details div {padding: 12px 20px; background: #F6F4F1; border-radius: 50vw; display: flex; align-items: center; margin-left: 20px;}
.vertSwiper .swiper-slide .details div img {width: 28px; display: inline-block; margin-right: 10px;}
.vertSwiper .swiper-slide .details div:last-child img {width: 23px;}

.testiSwiper {width: 110vw;}
.testiSwiper .swiper-slide {border-radius: var(--top-left-small); background: #fff; padding: 30px 60px 30px 45px; box-sizing: border-box;}
.testiSwiper .swiper-slide article {min-height: 106px; margin-bottom: 30px;}
.testiSwiper .swiper-slide p {font-size: 18px; font-weight: 300; line-height: 1.5;}
.testiSwiper .swiper-slide p strong {font-weight: 600;}

.dashboard {padding: 250px 0; margin-bottom: -200px;}
.dashboard .wrapper-sml {max-width: 1300px;}
.dashboard .grid-left {display: grid; grid-template-columns: 350px 1fr; grid-gap: 40px; margin: 0 auto 100px; align-items: flex-start;}

.dashboard.pink {background: #EDDEE5;}
.dashboard.green {background: #A9D68870;}

.notice-banner p {text-align: center !important; padding: 25px; width: 100%; margin: 0 auto 25px !important; font-size: 19px; background: #2DD284 !important; color: #fff !important; border: 1px solid #2DD284 !important; box-sizing: border-box; border-radius: 0 30px 30px 30px; font-weight: 500; font-family: 'RB-Rational-Neue-Mix-Test';}

.dashboard .sticky {position: sticky; top: 220px;}

.dashboard-content {background: #fff; border-radius: var(--top-left-small); box-sizing: border-box; padding: 40px; width: 100%; margin: 0 auto; border: 1px solid #fff; overflow: hidden;}
.dashboard-content article {padding: 30px 0; border-bottom: 1px solid #e5e5e5;}
.dashboard-content article:first-child {padding-top: 0px;}
.dashboard-content article:last-child {padding-bottom: 0px; border: 0;}
.dashboard-content article label {font-size: 15px; font-weight: 500; display: block; font-family: 'RB-Rational-Neue-Mix-Test'; line-height: 1.5; margin-bottom: 5px;}
.dashboard-content article p {font-size: 1vw; line-height: 1.5vw; font-weight: 600; font-family: 'RB-Rational-Neue-Test', sans-serif; margin-bottom: 0px;}
.dashboard-content h1 {font-size: 2vw; line-height: 2.5vw; font-weight: 600; font-family: 'RB-Rational-Neue-Test', sans-serif; margin-bottom: 0px;}

.dashboard .breadcrumbs {position: relative; text-transform: uppercase; font-size: 15px; font-family: 'RB-Rational-Neue-Mix-Test'; line-height: 1.5; margin: -52px 0 30px;}
.dashboard .breadcrumbs a:first-child {padding-left: 20px;}
.dashboard .breadcrumbs a:first-child::before {content: ""; display: block; position: absolute; left: 0px; top: 50%; transform: translateY(-50%); width: 12px; height: 12px; background: url('/img/breadcrumbs-arrow.svg') no-repeat center/contain;}

.dashboard .course-container {display: none;}
.dashboard .course-container.active {display: block;}
.dashboard .course-container .video-container { height: 55vh; background: #f9f9f9; border-radius: 0 30px 30px 30px; margin-bottom: 40px;}

.dashboard .course-container h2 {font-size: 2vw; line-height: 2.5vw; font-weight: 600; font-family: 'RB-Rational-Neue-Test', sans-serif; margin-bottom: 40px;}
.dashboard .course-container p {margin-bottom: 30px; font-weight: 300;}
.dashboard .course-container p strong {font-size: 24px; display: block;}


.dashboard .course-stage {height: auto; max-height: 140px; transition: 0.5s ease; overflow: hidden; padding: 40px 40px 0; cursor: pointer;}
.dashboard .course-stage.open {max-height: 1000px;}
.dashboard .course-stage p {margin-bottom: 40px;}
.dashboard .course-stage p:first-child {margin: 0;}

.course-stage.faq {cursor: pointer;}
.course-stage.faq .panel {height: auto; max-height: 0px; overflow: hidden; transition: 0.3s ease;}
.course-stage.faq.open .panel {max-height: 500px;}

.grid-left-courses {display: grid; grid-template-columns: 550px 1fr; align-items: flex-start; grid-gap: 40px; margin-bottom: 70px;}

.sticky {}

.account-nav {background: #fff; border-radius: 0 40px 40px 40px; padding: 15px; box-sizing: border-box;}
.account-nav ul {margin: 0; list-style: none;}
.account-nav ul li {margin-bottom: 15px;}
.account-nav ul li:last-child {margin-bottom: 0px;}
.account-nav ul li > a {font-size: 19px; line-height: 1.5vw; font-weight: 500;font-family: 'RB-Rational-Neue-Mix-Test'; padding: 30px; border-radius: 0 30px 30px 30px; background: #F6F4F1; display: block;}
.pink .account-nav ul li > a.active {background: #EDDEE5;}
.green .account-nav ul li > a.active {background: #A9D68870;}


.account-nav ul li .course-nav-item {position: relative; padding: 20px; border-radius: 0 30px 30px 30px; overflow: hidden; background: #F6F4F1; transition: 0.5s; box-sizing: border-box; height: 188px;}
.account-nav ul li .course-nav-item .active-overlay article {position: absolute; z-index: 1; box-sizing: border-box; padding: 20px;}
.account-nav ul li .course-nav-item .active-overlay article h4 {font-size: 36px; line-height: 1.2; font-weight: 600; font-family: 'RB-Rational-Neue-Mix-Test'; max-width: 60%; margin-bottom: 10px;}
.account-nav ul li .course-nav-item .active-overlay article p {font-size: 17px;font-weight: 300;}
.account-nav ul li .course-nav-item .active-overlay figure {position: absolute; width: 100%; height: 250px; max-height: 0px; transition: 0.5s;}
.account-nav ul li .course-nav-item .active-overlay figure img {height: 250px;}
.account-nav ul li .course-nav-item .active-overlay {position: absolute; left: 0px; top: 0px; max-height: 0px; height: 100%; width: 100%; overflow: hidden;transition: 0.5s; display: block;}

.account-nav ul li .course-nav-item .flex-row {position: absolute; bottom: 20px; width: 100%; box-sizing: border-box; padding: 0 20px; left: 0px; align-items: flex-end;}
.account-nav ul li .course-nav-item .flex-row .expand-button {position: relative; border-radius: 50vw; box-sizing: border-box; background: #24053A; transition: 0.5s; padding: 18px; width: 100%; max-width: 36px; overflow: hidden;}
.account-nav ul li .course-nav-item .flex-row .expand-button a {max-width: 0px; display: inline-block; position: absolute; top: -100%; left: 50%; transform: translate(-50%,-50%); transition: 0.5s; color: #24053a; font-size: 13px; line-height: 13px; width: 115px; text-align: right; box-sizing: border-box; padding-right: 10px;}
.account-nav ul li .course-nav-item .flex-row .expand-button a::before {content: ""; display: block; position: absolute; left: 0px; top: 50%; transform: translateY(-50%); background: url('/img/play-button.svg') no-repeat center/contain; width: 23px; height: 23px;}
.account-nav ul li .course-nav-item .flex-row .expand-button > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 12px; height: 12px; transition: 0.5s;}

.account-nav ul li .course-nav-item.active .expand-button {max-width: 130px; background: #F6F4F1;}
.account-nav ul li .course-nav-item.active .expand-button a {max-width: 120px; top: 50%;}
.account-nav ul li .course-nav-item.active .expand-button > img {top: 150%;}


.account-nav ul li .course-nav-item.active .active-overlay figure {max-height: 250px;}

.account-nav ul li .course-nav-item .progress-wrapper p {font-weight: 300; font-size: 17px; margin-bottom: 10px;}
.account-nav ul li .course-nav-item .progress-bar {background: #fff; width: 300px;border-radius: 50vw; padding: 5px; box-sizing: border-box; position: relative; margin-bottom: 11px;}

.progress-bar.progress-25::after, .progress-bar.progress-50::after, .progress-bar.progress-75::after, .progress-bar.progress-100::after {position: absolute; display: block; content: ""; height: 100%; background: #38E058; width: 100%; top: 0px; left: 0px; border-radius: 50vw;}

.progress-bar.progress-25::after {width: 25%; background: #FF735C;}
.progress-bar.progress-50::after {width: 50%; background: #F2B653;}
.progress-bar.progress-75::after {width: 75%; background: #F2B653;}

.account-nav ul li .course-nav-item .top h5 {font-size: 24px; display: block; font-weight: 600; font-family: 'RB-Rational-Neue-Test', sans-serif; margin-bottom: 10px;}
.account-nav ul li .course-nav-item .top p {font-size: 17px; line-height: 1.3; font-weight: 300; max-width: 75%; padding-bottom: 70px;}
.account-nav ul li .course-nav-item .top .pill {top: 20px;}

.account-nav ul li .course-nav-item.active {height: 250px;}
.account-nav ul li .course-nav-item.active .active-overlay { max-height: 250px; border-radius: 0; top: 0; }


.details-pop {position: fixed; opacity: 0; transition: 0.5s; width: 100%; max-width: 800px; transform: translate(-50%, -50%); left: 150%; top: 50%; z-index: -999;}
.details-pop::after {content: ''; background: #0008; width: 101vw; height: 101vh; z-index: -1; position: absolute; transform: translate(-50%, -50%); left: 150%; top: 50%; transition: 0.6s;}
.details-pop.active {opacity: 1; z-index: 999;  transform: translate(-50%, -50%); left: 50%;}
.details-pop::after {transform: translate(-50%, -50%); left: 50%;}

.details-pop article {background: #fff; border-radius: 0 30px 30px 30px; padding: 30px; box-sizing: border-box; position: relative; z-index: 1;}
.details-pop article h3 {font-size: 2vw; line-height: 2.5vw; font-weight: 600; font-family: 'RB-Rational-Neue-Test', sans-serif; margin-bottom: 20px;}
.details-pop label, .address-form label {top: 22px;}
.details-pop .form-field input, .details-pop .form-field textarea, .address-form .form-field input, .address-form .form-field textarea {color: inherit;}
.details-pop .cream-bg {padding: 20px; border-radius: 0 20px 20px 20px;}
.details-pop .success {margin-bottom: 20px;}

.close-icon {padding: 20px; background: #fff; right: 30px; top: 30px; position: absolute; z-index: 9999; overflow: hidden; transition: 0.5s; transform: rotate(180deg); cursor: pointer; border-radius: 10px; border: 1px solid #e5e5e5;}
.close-icon::before {content: ''; position: absolute; width: 2px; height: 20px; background: #24053A; transform: translateX(-50%) rotate(45deg); top: 10px; transition: 0.5s;}
.close-icon::after {content: ''; position: absolute; width: 2px; height: 20px; background: #24053A; transform: translateX(-50%) rotate(-45deg); top: 10px; transition: 0.5s;}

.close-icon:hover {background: #FFDCD6; border: 1px solid #FFDCD6;}
.close-icon:hover::before {transform: translateX(-50%) rotate(-135deg)}
.close-icon:hover::after {transform: translateX(-50%) rotate(-225deg)}

.course-content.faqs {margin: 5vw 0;}
.course-content.faqs h3 {text-align: center;}

.faq-wrapper {max-width: 850px; width: 100%; margin: 0 auto;}

footer {padding: 5vw 0 30px; border-radius: 100px 100px 0 0;}
footer.purple {background: #24053A; color: #fff; position: relative; z-index: 1;}

footer .grid {position: relative; padding-bottom: 6vw; grid-gap: 150px;}
footer .grid > article {max-width: 700px;}
footer .grid > article h3 {margin-bottom: 2vw;}
footer .grid > article p {font-size: 1.1vw; font-weight: 300;}
footer .grid > article .form-wrapper {margin: 3vw 0;}
footer .grid > article .form-wrapper input {box-shadow: none; background-color: #fff; color: #24053a;}

footer .grid > article a {margin-right: 10px;}

footer .social-row ~ div {display: flex; align-items: center;}
footer .social-row ~ div p a {display: block; margin-bottom: 10px; font-size: 18px; font-weight: 400;}
footer .social-row ~ div p a:last-child {margin-bottom: 0px;}

#scrollToTopBtn {width: 50px; transition: 0.5s; height: 50px; position: absolute; background: #FF735C30; border:0; outline: 0; bottom: 40px; left: 50%; transform: translateX(-50%); border-radius: 50vw;}
#scrollToTopBtn img {width: 25px; height: 25px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); opacity: 0.6; transition: 0.5s;}

#scrollToTopBtn:hover {background: #FF735C;}
#scrollToTopBtn:hover img {opacity: 1;}

footer .copyright {padding: 30px 30px 0; border-top: 1px solid #fff4;}
footer .copyright a, footer .copyright p {color: #fff4; font-size: 14px; transition: 0.5s;}
footer .copyright a {margin-right: 10px;}
footer .copyright a:hover {color: #fff;}

/* LANDING SCREEN */

#loading-screen {position: fixed; top: 0; left: 0; width: 100%; height: 100dvh; background-color: #24053A; display: flex; justify-content: center; align-items: center; z-index: 1000; transition: 0.7s ease-in-out; max-height: 100dvh; overflow: hidden; visibility: visible;}
#loading-text {font-size: 3rem; color: var(--orange); font-weight: 600; text-shadow: 0 0 20px var(--orange)80; position: absolute; bottom: 65px; right: 100px;}
#loading-screen.hidden {max-height: 0dvh;}
#loading-screen article {position: absolute; top: 150px; left: 150px; width: 1000px;}
#loading-screen article span { position: relative; color: #fff; font-size: 5vw; line-height: 6vw; overflow: hidden; display: inline-block;}
#loading-screen article span p {transform: translateY(100px);opacity: 0;animation: slide-up 0.85s cubic-bezier(0.65, 0, 0.35, 1) forwards;}

#loading-screen article span:nth-child(1) p { color: var(--orange)}
#loading-screen article span:nth-child(2) p { animation-delay: 0.2s; margin-left: 15px;}
#loading-screen article span:nth-child(3) p { animation-delay: 0.4s;}
#loading-screen article span:nth-child(4) p { animation-delay: 0.6s; margin-left: 15px;}
#loading-screen article span:nth-child(5) p { animation-delay: 0.8s; margin-left: 15px;}

@keyframes slide-up { 0% { transform: translateY(100px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; }}


.grecaptcha-badge {display: none;}
