html body, html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body p,
html body ul,
html body li,
html body a,
html body button,
html body input,
html body select {
border: none;
margin: 0;
outline: none;
padding: 0; }
html {
overflow-x: hidden; }
html body {
background-color: #ffffff;
color: #111111;
font-family: AprovaSans, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: hidden;
position: relative;
width: 100%; }
html body ul,
html body ol {
list-style: none; }
html body ul li,
html body ol li {
list-style: none; }
html body a {
text-decoration: none; }
html body button,
html body input,
html body select {
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
background-color: transparent;
border-radius: 0;
font-family: AprovaSans, sans-serif; }
html body label:focus,
html body input[type='checkbox']:focus {
outline: none; }
html body button {
background: none;
background-color: transparent;
box-sizing: content-box;
color: inherit; }
html body .green-button {
background-color: #08db88;
border-radius: 32px;
box-sizing: border-box;
color: #111111;
cursor: pointer;
display: block;
font-size: 20px;
font-weight: bold;
letter-spacing: -0.6px;
line-height: 1.2;
padding: 20px 8px;
text-align: center;
transition: background-color 200ms;
width: 100%;
height: 42px; }
html body .green-button.small-button {
font-size: 16px;
font-weight: bold;
letter-spacing: -0.5px;
line-height: 1.25;
padding: 12px 8px; }
html body .green-button.disabled, html body .green-button:disabled {
background-color: #999999;
cursor: default; }
html body .green-button.disabled:hover, html body .green-button:disabled:hover {
background-color: #999999; }
html body .green-button:hover {
background-color: #00e98b; }
html body .default-content-size {
padding: 0 24px; }
@media (min-width: 768px) {
html body .default-content-size {
box-sizing: border-box;
margin: 0 auto;
max-width: 1384px;
padding: 0 52px; } }
html body {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
background-color: #ffffff;
color: #111111;
overflow-x: hidden;
max-width: 100vw;
position: relative; }
html body * {
border: none;
margin: 0;
padding: 0;
outline: none; }
html body h1,
html body h2,
html body h3 {
font-weight: bold; }
html body h1 {
font-size: 36px;
letter-spacing: -0.2px;
line-height: 1.1; }
@media (min-width: 1000px) {
html body h1 {
font-size: 60px;
letter-spacing: -2px; } }
html body h2 {
font-size: 32px;
line-height: 1.25;
letter-spacing: -0.6px; }
html body h3 {
font-size: 24px;
line-height: 1.2;
letter-spacing: -0.4px; }
@media (min-width: 1000px) {
html body h3 {
font-size: 32px;
line-height: 1.25; } }
html body p {
font-size: 16px;
line-height: 1.5; }
@media (min-width: 1000px) {
html body p {
font-size: 20px;
line-height: 1.6; } }
html body ul,
html body ol {
font-size: 16px;
line-height: 1.5;
list-style: none; }
@media (min-width: 1000px) {
html body ul,
html body ol {
font-size: 20px;
line-height: 1.6; } }
html body ul li,
html body ol li {
list-style: none; }
html body a {
text-decoration: none;
color: inherit; }
html body button {
border: 0;
box-sizing: content-box;
padding: 0;
color: inherit;
background: none;
outline: none; }
html body input {
border: none;
box-shadow: none;
border-radius: 0;
padding: 0;
margin: 0; }
@media (min-width: 768px) {
.Topic {
display: flex; } }
.Topic .cover {
background-color: #00e88f;
box-sizing: border-box;
margin-bottom: 40px;
padding: 44px 0;
position: relative;
width: 100%; }
@media (min-width: 768px) {
.Topic .cover {
margin-bottom: 0;
padding: 32px 0;
width: 50%; } }
.Topic .cover .cover-wrapper {
box-sizing: border-box;
opacity: 1;
padding: 0 24px;
transition: opacity 50ms;
width: 100%; }
@media (min-width: 768px) {
.Topic .cover .cover-wrapper {
max-width: 692px;
padding: 0 52px; } }
@media (min-width: 1384px) {
.Topic .cover .cover-wrapper {
margin-left: calc(100% - 692px);
padding: 0 168px 0 52px; } }
@media (min-width: 768px) {
.Topic .cover .cover-wrapper.fixed {
backface-visibility: hidden;
left: 0;
margin-left: 0;
position: fixed;
top: 33px;
transform: scale(1);
width: 50%; } }
@media (min-width: 1384px) {
.Topic .cover .cover-wrapper.fixed {
left: calc(50% - 692px); } }
@media (min-width: 768px) {
.Topic .cover .cover-wrapper.hide {
opacity: 0; } }
.Topic .cover .cover-wrapper .cover-title {
color: #111111;
font-size: 32px;
line-height: 1.13; }
@media (min-width: 768px) {
.Topic .cover .cover-wrapper .cover-title {
line-height: 1;
margin-bottom: 24px;
max-width: 472px;
padding-left: 21px;
width: calc(50vw - (52px * 2)); } }
.Topic .cover .cover-wrapper .item-navigation {
display: none; }
@media (min-width: 768px) {
.Topic .cover .cover-wrapper .item-navigation {
display: block; } }
@media (min-width: 768px) {
.Topic .cover .cover-wrapper .item-navigation .anchor-item {
border-left: 1px solid rgba(17, 17, 17, 0);
margin-bottom: 8px;
padding-left: 20px;
transition: border-left 400ms; } }
@media (min-width: 768px) {
.Topic .cover .cover-wrapper .item-navigation .anchor-item.current {
border-left: 1px solid #111111; } }
@media (min-width: 768px) {
.Topic .cover .cover-wrapper .item-navigation .anchor-item.current a {
color: #111111;
font-weight: 900; } }
@media (min-width: 768px) {
.Topic .cover .cover-wrapper .item-navigation .anchor-item:last-child {
margin-bottom: 0; } }
@media (min-width: 768px) {
.Topic .cover .cover-wrapper .item-navigation .anchor-item a {
color: rgba(0, 0, 0, 0.4);
font-size: 16px;
letter-spacing: -.4px; } }
.Topic .content-list {
margin-bottom: 48px; }
@media (min-width: 768px) {
.Topic .content-list {
margin-bottom: 0;
width: 50%; } }
.Topic .content-list .content-wrapper {
box-sizing: border-box;
padding: 0 24px;
width: 100%; }
@media (min-width: 768px) {
.Topic .content-list .content-wrapper {
max-width: 692px;
padding: 36px 52px 104px; } }
@media (min-width: 1384px) {
.Topic .content-list .content-wrapper {
margin-right: calc(100% - 692px);
padding: 36px 52px 104px 168px; } }
.Topic .content-list .content-wrapper .item {
margin-bottom: 36px; }
.Topic .content-list .content-wrapper .item:last-child {
margin-bottom: 0; }
.Topic .content-list .content-wrapper .item .item-title {
color: #111111;
font-size: 18px;
line-height: 1.33;
margin-bottom: 20px; }
@media (min-width: 768px) {
.Topic .content-list .content-wrapper .item .item-title {
margin-bottom: 36px; } }
.Topic .content-list .content-wrapper .item .cont h3 {
color: #111111;
font-size: 16px;
font-weight: normal;
letter-spacing: normal;
line-height: 1.5;
margin: 4px 0 16px; }
@media (min-width: 768px) {
.Topic .content-list .content-wrapper .item .cont h3 {
max-width: 456px; } }
.Topic .content-list .content-wrapper .item .cont li,
.Topic .content-list .content-wrapper .item .cont p {
color: #666666;
font-size: 14px;
letter-spacing: -.3px;
line-height: 1.69; }
@media (min-width: 768px) {
.Topic .content-list .content-wrapper .item .cont li,
.Topic .content-list .content-wrapper .item .cont p {
line-height: 1.57;
max-width: 456px; } }
.Topic .content-list .content-wrapper .item .cont p {
margin-bottom: 24px; }
.Topic .content-list .content-wrapper .item .cont p:last-child {
margin-bottom: 0; }
.Topic .content-list .content-wrapper .item .cont ul,
.Topic .content-list .content-wrapper .item .cont ol {
margin-bottom: 24px; }
.Topic .content-list .content-wrapper .item .cont ul li,
.Topic .content-list .content-wrapper .item .cont ol li {
margin-bottom: 16px;
margin-left: 28px; }
.Topic .content-list .content-wrapper .item .cont ul li {
list-style: disc; }
.Topic .content-list .content-wrapper .item .cont ol li {
list-style-type: decimal; }
.Topic .content-list .content-wrapper .item .cont img {
display: block;
height: auto;
margin-bottom: 24px;
max-width: 100%; }
.Topic .content-list .content-wrapper .item .cont a {
color: #111111;
font-weight: bold; }
.SimulationParameters {
display: flex;
align-items: stretch; }
.SimulationParameters .form-section {
height: 100vh; }
.SimulationParameters .form-section .simulation-parameters-form {
display: flex;
justify-content: center;
align-items: center; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper {
padding: 0 20px; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-content {
height: calc(90vh - 67px);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-content:not(:first-child) {
transform: translateY(-20%); }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper {
margin: 0;
max-width: 692px;
height: calc(100vh - 157px); } }
@media (min-width: 1256px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper {
max-width: 628px;
display: block;
margin: 0 auto; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper.default-content-size {
padding: 0;
margin: 0 auto;
width: 100%; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .title {
color: #111111;
font-size: 18px;
letter-spacing: normal;
line-height: 1.33;
margin-bottom: 20px;
margin-top: 40px; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .title {
font-size: 24px;
font-stretch: normal;
font-style: normal;
letter-spacing: -1px;
line-height: 0.86;
margin-top: 56px; } }
@media (min-width: 1256px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .title {
font-size: 28px; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .title:first-child {
margin-top: 0; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .grades-wrapper {
display: flex;
flex-wrap: wrap;
justify-content: space-between; } }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .grades-wrapper .form-field {
max-width: 188px;
width: 50%; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field {
position: relative;
width: 100%; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.active .label, .SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.error .label {
font-size: 12px;
top: 0; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.active .input input,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.active .input select {
border-color: #111111; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.error .label,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.error .message {
color: #d0021b; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.error .input {
margin-bottom: calc(28px - 7px); }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.error .input input,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.error .input select {
border-bottom: 2px solid #d0021b;
color: #d0021b; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.error .input select ~ .icon {
fill: #d0021b; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field[disabled] .label,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field[disabled] .message, .SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.disabled .label,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field.disabled .message {
color: #666666; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .label {
color: #111111;
cursor: text;
display: block;
font-size: 18px;
letter-spacing: -0.5px;
line-height: 1;
position: absolute;
top: 16px;
transition: font-size 200ms, color 200ms, top 200ms; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .label.disabled {
color: #cacaca; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .input {
margin-bottom: 28px; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .input input,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .input select {
border-bottom: 2px solid #e1e1e1;
color: #111111;
font-size: 18px;
letter-spacing: -0.5px;
padding: 15px 0 5px;
transition: border 200ms;
width: 100%; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .input select {
position: relative; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .input select[disabled], .SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .input select.disabled {
border-bottom: 2px solid #cacaca;
cursor: not-allowed; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .input select[disabled] ~ .icon, .SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .input select.disabled ~ .icon {
fill: #cacaca; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .input select ~ .icon {
background: -moz-linear-gradient(left, rgba(245, 245, 245, 0) 0%, whitesmoke 40%);
background: -webkit-linear-gradient(left, rgba(245, 245, 245, 0) 0%, whitesmoke 40%);
background: linear-gradient(to right, rgba(245, 245, 245, 0) 0%, whitesmoke 40%);
display: block;
fill: #08db88;
height: 24px;
padding-left: 16px;
position: absolute;
right: 0;
top: 16px;
transition: fill 200ms;
width: 24px; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .input select ~ .icon {
background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, white 40%);
background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, white 40%);
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 40%); } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .message {
color: #999999;
font-size: 14px;
margin-bottom: -10px;
transition: color 200ms; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .submit {
border-radius: 0;
bottom: 0;
left: 0;
position: fixed; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .form-field .submit {
border-radius: 32px;
bottom: inherit;
left: inherit;
margin-top: 52px;
position: relative; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles {
width: 100%;
height: calc(100vh - 67px);
overflow: hidden; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles h3 {
font-weight: 900;
color: #111111;
text-align: center;
display: block;
margin: 0 auto;
font-size: 24px; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles h3 {
font-size: 32px; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .synced-gabarito-header h3 {
font-size: 20px;
margin-bottom: 20px; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .synced-gabarito-header h3 {
font-size: 24px;
margin-bottom: 30px;
max-width: 500px; } }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .synced-gabarito-header {
margin-top: 6rem; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .default-gabarito-header {
margin-top: 32px;
margin-bottom: 39px;
padding-top: 28px; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .default-gabarito-header h3 {
max-width: 492px; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .default-gabarito-header h3 {
margin-top: 0; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .checkbox {
position: relative;
display: flex;
flex-direction: row-reverse;
font-size: 12px;
margin-top: 5px;
margin-bottom: 32px; }
@media (min-width: 1256px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .checkbox {
margin-bottom: 0px; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .checkbox input {
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
cursor: pointer;
z-index: 3; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .checkbox input:checked ~ .checkmark {
background-color: #00e88f; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .checkbox input:checked ~ .checkmark::after {
border-color: black; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .checkbox .checkmark {
position: relative;
box-sizing: border-box;
min-width: 14px;
height: 14px;
border-radius: 4px;
border: 1px solid #00e88f;
margin-right: 10px; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles .checkbox .checkmark::after {
content: "";
position: absolute;
left: 4px;
top: 2px;
width: 3px;
height: 6px;
border: solid white;
border-width: 0 1px 1px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg); }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles button {
font-size: 16px;
padding: 12px 0;
text-align: center;
width: 100%;
max-width: 180px;
display: flex;
justify-content: center;
gap: 10px;
align-items: center; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles button:disabled {
cursor: not-allowed;
opacity: 0.6;
background-color: #dddddd;
border: none;
color: #111111; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles button#goToCourses {
margin: 0px auto 0; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles button#goToCourses {
margin: 35px auto 32px; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles button#goToCourses span,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles button#goToCourses svg {
pointer-events: none; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles button#goToResults {
margin-bottom: 50px; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles button#goToResults span,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .step-styles button#goToResults svg {
pointer-events: none; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset {
display: flex;
flex-wrap: wrap;
justify-content: center;
max-width: 555px;
margin: 0; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset {
margin: 0 -8px; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset p {
margin: 0 0 5px 0;
font-size: 12px;
text-align: center; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset p {
margin: 0 0 30px 0;
font-size: 16px; } }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset {
margin: 0 auto;
margin-bottom: 9px; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset label {
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction: column;
width: 50%;
margin-bottom: 24px;
padding: 0 8px;
box-sizing: border-box; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset label input {
text-align: center;
border: 1px solid #999999;
border-radius: 8px;
font-size: 16px;
width: 100%;
height: 48px;
margin-bottom: 12px;
box-sizing: border-box; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset label input.error {
border-color: #d0021b; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset label span {
font-weight: normal;
color: #666666;
font-size: 12px;
text-align: center; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset label span.error {
color: #d0021b; }
@media (min-width: 768px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset label {
width: 20%;
margin-bottom: 0; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset label input {
width: 72px;
height: 72px;
margin-bottom: 15px; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper #grade-step fieldset label span {
font-size: 14px; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset {
display: flex;
flex-wrap: wrap;
margin-left: -8px;
margin-right: -8px;
width: 100%; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset .custom-select__control {
border-radius: 8px; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset .custom-select__menu {
z-index: 3; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset .custom-select__indicator-separator {
display: none; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset .custom-select__value-container {
width: 0px;
height: 48px;
align-items: center; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset .custom-select__input-container {
margin: 0;
padding: 0; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label {
display: flex;
flex-direction: column;
width: calc(100% - 16px);
margin: 0 8px; }
@media (min-width: 744px) {
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label {
width: calc(50% - 16px); }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label.full-width-input {
width: 100%; } }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input {
position: relative;
margin-bottom: 32px; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input input,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input select {
width: 100%;
height: 48px;
display: flex;
align-items: center;
border: 1px solid #999999;
border-radius: 8px;
padding: 0 16px;
font-size: 16px;
box-sizing: border-box;
background-color: transparent;
z-index: 1;
position: relative; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input input:disabled,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input select:disabled {
opacity: 0.2; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input input:disabled ~ *,
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input select:disabled ~ * {
opacity: 0.2; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input .label {
font-size: 16px;
background-color: white;
position: absolute;
z-index: 0;
padding: 0 4px;
bottom: 50%;
transform: translateY(50%);
left: 12px;
transition: 0.2s ease-in-out; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input .label.disabled {
opacity: 0.2; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input .icon {
position: absolute;
bottom: 50%;
transform: translateY(50%);
right: 10px;
z-index: 0; }
.SimulationParameters .form-section .simulation-parameters-form .form-wrapper .single-courses-step fieldset label .input.active .label {
font-size: 12px;
transform: translateY(-110%);
z-index: 2; }
.SimulationParameters fieldset[disabled] input {
border-color: #dddddd; }
.StudentsForm {
flex-direction: column;
display: flex;
justify-content: space-between;
margin-top: 8px; }
.StudentsForm .invite {
color: #111111;
font-size: 16px;
font-weight: bold; }
.StudentsForm .statement {
font-weight: bold;
color: #666666;
font-size: 16px; }
.StudentsForm .alternatives {
margin: 12px 0px; }
.StudentsForm .alternatives .item {
color: #666666;
font-size: 14px;
padding: 12px;
border-color: #e8e8e8;
border-width: 1px;
border-style: solid;
border-radius: 4px;
margin-bottom: 8px;
cursor: pointer; }
.StudentsForm .alternatives .item:active,
.StudentsForm .alternatives .item-checked {
background-color: #00e88f; }
.Header {
background-color: #ffffff;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.05);
width: 100%; }
.Header.fixed {
left: 0;
position: fixed;
top: 0;
z-index: 99999; }
.Header.is-clean {
background: transparent;
box-shadow: none; }
.Header .header-wrapper {
box-sizing: border-box;
padding: 0 24px;
height: 80px;
position: relative;
display: flex;
align-items: center;
justify-content: space-between; }
@media (min-width: 768px) {
.Header .header-wrapper {
height: 90px;
margin: 0 auto;
max-width: 1384px;
padding: 0 52px; } }
.Header .header-wrapper .login-link,
.Header .header-wrapper .logout-link {
box-sizing: border-box;
border-radius: 300px;
cursor: pointer;
display: block;
font-size: 16px;
font-weight: bold;
letter-spacing: -0.7px;
line-height: 1;
padding: 10px 22px;
transition: background-color 200ms, border 200ms, color 200ms;
width: fit-content; }
@media (min-width: 768px) {
.Header .header-wrapper .login-link,
.Header .header-wrapper .logout-link {
padding: 14px 26px;
font-size: 16px; } }
.Header .header-wrapper .login-link {
border: 2px solid #111111;
background-color: transparent;
color: #111111; }
.Header .header-wrapper .login-link:hover {
border: 2px solid #111111;
color: #f5f5f5;
background-color: #111111; }
.Header .header-wrapper .logout-link {
background-color: #ffffff;
border: 2px solid #111111;
box-sizing: content-box;
color: #111111; }
.Header .header-wrapper .logout-link:hover {
border: 2px solid #111111;
background-color: #111111;
color: #f5f5f5; }
.Header .header-wrapper .mobile .menu-hamburguer {
position: absolute;
top: 0;
right: 0;
z-index: 7;
margin: 37px 5%;
width: 22px;
height: 28px;
border: 0;
background: transparent;
border-top: 1px solid #5e5e5e; }
.Header .header-wrapper .mobile .menu-hamburguer:before, .Header .header-wrapper .mobile .menu-hamburguer::after {
position: absolute;
content: "";
top: 5px;
left: 0;
width: 100%;
height: 1px;
background-color: #5e5e5e; }
.Header .header-wrapper .mobile .menu-hamburguer::after {
top: 11px; }
.Header .header-wrapper .mobile .menu-mask {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
z-index: 8;
opacity: 0.5;
background-color: #000000;
display: none; }
.Header .header-wrapper .mobile .menu-mobile {
position: fixed;
top: 0;
left: -100%;
width: 90vw;
height: 100vh;
z-index: 9;
background-color: #ffffff; }
.Header .header-wrapper .mobile .menu-mobile > button {
position: absolute;
top: 0;
right: 0;
width: 22px;
height: 22px;
margin: 6% 7% 0 0;
padding: 0;
background: transparent;
border: 0; }
.Header .header-wrapper .mobile .menu-mobile > button::after, .Header .header-wrapper .mobile .menu-mobile > button::before {
position: absolute;
content: "";
top: 8px;
left: 0;
width: 100%;
height: 1.5px;
background-color: #666666; }
.Header .header-wrapper .mobile .menu-mobile > button::after {
transform: rotate(45deg); }
.Header .header-wrapper .mobile .menu-mobile > button::before {
transform: rotate(-45deg); }
.Header .header-wrapper .mobile .menu-mobile-container {
position: absolute;
top: 50%;
left: 50%;
width: 70vw;
height: 70vh;
margin: -35vh 0 0 -38vw;
padding: 0;
z-index: 99; }
.Header .header-wrapper .mobile .menu-mobile-container .mobile-menu-item {
font: 700 20px;
color: #5e5e5e;
margin: 5px 0;
padding: 13px 10px 13px 15px;
float: left;
width: 100%; }
.Header .header-wrapper .mobile .mobile-submenu div.submenu-arrow {
position: relative;
top: -34px;
left: 75%;
width: 22px;
height: 0px;
margin: 6% 7% 0 0;
padding: 0;
background: transparent;
border: 0;
transition: all 170ms ease-in-out; }
.Header .header-wrapper .mobile .mobile-submenu div.submenu-arrow::after, .Header .header-wrapper .mobile .mobile-submenu div.submenu-arrow::before {
position: absolute;
content: "";
top: 8px;
left: 0;
width: 50%;
height: 1.5px;
background-color: #666666; }
.Header .header-wrapper .mobile .mobile-submenu div.submenu-arrow::after {
transform: rotate(50deg);
margin-left: 0; }
.Header .header-wrapper .mobile .mobile-submenu div.submenu-arrow::before {
transform: rotate(-50deg);
margin-left: 6px; }
.Header .header-wrapper .mobile .mobile-submenu div.opened {
transform: rotate(-180deg);
top: -17px;
left: 73%; }
.Header .header-wrapper .mobile .mobile-submenu .submenu {
display: none; }
.Header .header-wrapper .mobile .mobile-submenu .submenu .submenu-item {
display: flex;
flex-direction: column;
margin: 15px; }
.Header .header-wrapper .mobile .mobile-submenu span.opened {
display: block; }
.Header .header-wrapper .mobile .open-menu {
display: block; }
.Header .header-wrapper .mobile .open-container {
animation: slideOpen 0.4s forwards; }
.Header .header-wrapper .mobile .close-menu {
display: none; }
.Header .header-wrapper .mobile .close-container {
animation: slideClose 0.4s forwards; }
@keyframes slideOpen {
100% {
left: 0; } }
@keyframes slideClose {
0% {
left: 0; }
100% {
left: -100%; } }
.universal-menu {
position: relative;
box-sizing: border-box;
background-color: #f2f2f3;
padding: 0 24px; }
.universal-menu * {
box-sizing: border-box; }
.universal-menu .close-btn button {
transition: ease-in-out 200ms;
width: 24px;
height: 24px; }
.universal-menu ul {
position: absolute;
background-color: #f2f2f3;
top: 24px;
bottom: 0;
right: 0;
left: 0;
z-index: 2;
height: 100vh;
opacity: 0;
pointer-events: none;
transition: ease-in-out 200ms; }
.universal-menu ul li {
padding: 20px 0;
border-bottom: 1px solid #e5e6e7;
font-family: "AprovaNova", sans-serif;
font-size: 16px;
line-height: 24px;
text-align: center; }
.universal-menu ul li:first-child {
color: #00804f;
font-weight: bold; }
.universal-menu[data-active="true"] .close-btn button {
transform: rotate(180deg); }
.universal-menu[data-active="true"] ul {
opacity: 1;
pointer-events: auto; }
@media (min-width: 768px) {
.universal-menu .close-btn {
display: none; }
.universal-menu ul {
position: relative;
top: initial;
bottom: initial;
right: initial;
left: initial;
height: initial;
pointer-events: auto;
opacity: 1;
display: flex;
gap: 32px;
justify-content: flex-end;
max-width: 1280px;
margin: 0 auto; }
.universal-menu ul li {
padding: 12px 0;
border-bottom: 0; } }
.HomeContent {
box-sizing: border-box; }
.HomeContent * {
box-sizing: border-box; }
.HomeContent .highlight {
font-family: AprovaNova;
margin: 0 auto;
padding-top: 60px;
display: flex;
align-items: center;
flex-direction: column; }
@media (min-width: 768px) {
.HomeContent .highlight {
gap: 50px;
align-items: center;
flex-direction: row; } }
.HomeContent .highlight .highlight-wrapper {
box-sizing: border-box;
height: 100%; }
@media (min-width: 768px) {
.HomeContent .highlight .highlight-wrapper {
width: 50%;
padding: 0; } }
.HomeContent .highlight .highlight-wrapper .page-title {
font-weight: 700;
margin-bottom: 20px;
color: #111111;
display: block;
font-size: 28px;
line-height: 1.29;
width: 100%;
text-align: center;
white-space: nowrap; }
@media (min-width: 768px) {
.HomeContent .highlight .highlight-wrapper .page-title {
margin-bottom: 16px;
font-size: 38px;
letter-spacing: -0.9px;
line-height: 1.33;
text-align: left;
margin-bottom: 28px; } }
.HomeContent .highlight .highlight-wrapper .page-subtitle {
color: #666666;
font-size: 14px;
font-weight: normal;
letter-spacing: normal;
line-height: 21.6px;
margin-bottom: 28px;
max-width: 400px;
text-align: center; }
@media (min-width: 768px) {
.HomeContent .highlight .highlight-wrapper .page-subtitle {
font-size: 20px;
line-height: 1.6;
max-width: 481px;
text-align: left; } }
.HomeContent .highlight .highlight-wrapper .green-button {
margin: 0 auto;
max-width: 308px;
height: auto !important; }
@media (min-width: 768px) {
.HomeContent .highlight .highlight-wrapper .green-button {
margin: 0; } }
.HomeContent .highlight .img-wrapper {
padding: 0 15px 150px 15px;
margin-top: 48px;
max-width: 500px; }
@media (min-width: 768px) {
.HomeContent .highlight .img-wrapper {
width: 50%;
padding: 0;
margin-top: 0; } }
.HomeContent .highlight .img-wrapper img {
width: 100%; }
.FaqList .section-title {
color: #111111;
font-size: 24px;
letter-spacing: -0.5px;
line-height: 1.17;
margin-bottom: 22px;
text-align: center;
margin-top: 24px; }
@media (min-width: 768px) {
.FaqList .section-title {
font-size: 56px;
font-weight: 900;
letter-spacing: -0.6px;
line-height: 0.64;
margin-bottom: 50px; } }
@media (min-width: 1256px) {
.FaqList .section-title {
margin-top: 66px; } }
.FaqList .section-description {
text-align: center;
margin-bottom: 22px; }
@media (min-width: 768px) {
.FaqList .section-description {
margin-bottom: 50px; } }
.FaqList .faq-gallery {
margin-bottom: 76px; }
@media (min-width: 768px) {
.FaqList .faq-gallery {
margin-bottom: 148px; } }
.FaqList .faq-gallery .faq-card {
background-color: #ffffff;
border-radius: 5px;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
margin-bottom: 8px;
transition: box-shadow 300ms;
width: 100%; }
@media (min-width: 768px) {
.FaqList .faq-gallery .faq-card {
border: 1px solid #e1e1e1;
box-shadow: none; } }
.FaqList .faq-gallery .faq-card:last-child {
margin-bottom: 0; }
.FaqList .faq-gallery .faq-card.visible {
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.08); }
@media (min-width: 768px) {
.FaqList .faq-gallery .faq-card.visible .card-top {
margin-bottom: 0; } }
.FaqList .faq-gallery .faq-card.visible .card-top .toggle-visibility .arrow-icon {
stroke: #111111;
transform: rotate(270deg); }
.FaqList .faq-gallery .faq-card.visible .card-content {
max-height: 50em;
opacity: 1;
padding: 0 20px 20px; }
@media (min-width: 768px) {
.FaqList .faq-gallery .faq-card.visible .card-content {
margin-top: -12px;
padding: 0 80px 24px 36px; } }
@media (min-width: 768px) {
.FaqList .faq-gallery .faq-card .card-top {
margin-bottom: 24px; } }
.FaqList .faq-gallery .faq-card .card-top .toggle-visibility {
box-sizing: border-box;
color: #111111;
cursor: pointer;
display: block;
font-size: 16px;
font-weight: bold;
letter-spacing: -0.2px;
line-height: 1.25;
padding: 20px 72px 20px 20px;
position: relative;
text-align: left;
width: 100%;
pointer-events: all; }
@media (min-width: 768px) {
.FaqList .faq-gallery .faq-card .card-top .toggle-visibility {
font-size: 20px;
letter-spacing: -0.3px;
line-height: 1.4;
padding: 24px 80px 24px 36px; } }
.FaqList .faq-gallery .faq-card .card-top .toggle-visibility span,
.FaqList .faq-gallery .faq-card .card-top .toggle-visibility .arrow-icon {
pointer-events: none; }
.FaqList .faq-gallery .faq-card .card-top .toggle-visibility .arrow-icon {
display: block;
fill: none;
height: 20px;
position: absolute;
right: 20px;
stroke-linecap: round;
stroke-width: 2px;
stroke: #b7b7b7;
top: 24px;
transform: rotate(90deg);
transition: stroke 200ms, transform 200ms;
width: 20px; }
@media (min-width: 768px) {
.FaqList .faq-gallery .faq-card .card-top .toggle-visibility .arrow-icon {
height: 32px;
right: 24px;
stroke-width: 3px;
width: 32px; } }
.FaqList .faq-gallery .faq-card .card-content {
color: #666666;
max-height: 0;
opacity: 0;
overflow: hidden;
padding: 0 20px;
transition: max-height 300ms, opacity 300ms, padding 100ms, margin-top 300ms; }
@media (min-width: 768px) {
.FaqList .faq-gallery .faq-card .card-content {
margin-top: -24px;
padding: 0 80px 0 36px; } }
.FaqList .faq-gallery .faq-card .card-content p,
.FaqList .faq-gallery .faq-card .card-content li {
font-size: 14px;
letter-spacing: -0.2px;
line-height: 1.43; }
@media (min-width: 768px) {
.FaqList .faq-gallery .faq-card .card-content p,
.FaqList .faq-gallery .faq-card .card-content li {
font-size: 16px;
letter-spacing: -0.2px;
line-height: 1.5;
max-width: 872px; } }
.FaqList .faq-gallery .faq-card .card-content ul,
.FaqList .faq-gallery .faq-card .card-content p {
margin-bottom: 16px; }
@media (min-width: 768px) {
.FaqList .faq-gallery .faq-card .card-content ul,
.FaqList .faq-gallery .faq-card .card-content p {
margin-bottom: 24px; } }
.FaqList .faq-gallery .faq-card .card-content ul:last-child,
.FaqList .faq-gallery .faq-card .card-content p:last-child {
margin-bottom: 0; }
.FaqList .faq-gallery .faq-card .card-content ul {
padding-left: 28px; }
@media (min-width: 768px) {
.FaqList .faq-gallery .faq-card .card-content ul {
padding-left: 32px; } }
.FaqList .faq-gallery .faq-card .card-content ul li {
list-style-type: disc;
margin-bottom: 16px; }
.FaqList .faq-gallery .faq-card .card-content ul li:last-child {
margin-bottom: 0; }
.FaqList .faq-gallery .faq-card .card-content a {
color: #00c974;
font-weight: bold; }
.footer {
padding-top: 20px;
padding-bottom: 60px;
background: #ffffff; }
.footer .container {
width: 85%;
max-width: 1200px;
margin: 0 auto; }
@media (min-width: 800px) {
.footer .container {
max-width: 1384px;
padding: 0 52px;
width: 100%; } }
.footer ul,
.footer li {
padding: 0;
list-style: none; }
.footer a {
color: #111111;
text-decoration: none; }
.footer .footer-header {
display: flex;
padding-bottom: 30px; }
.footer .footer-header .scroll-top {
cursor: pointer;
position: fixed;
bottom: 30px;
right: 30px;
z-index: 8;
display: none; }
@media (min-width: 800px) {
.footer .footer-header {
padding-bottom: 54px;
justify-content: space-between; } }
.footer .footer-menu-items {
display: flex;
flex-wrap: wrap;
justify-content: space-between; }
@media (min-width: 800px) {
.footer .footer-menu-items {
gap: 40px; } }
.footer .footer-menu-item {
width: 100%;
border-top: 1px solid #e0e0e0; }
.footer .footer-menu-item .footer-menu-item-title {
font-size: 23px;
letter-spacing: -0.6px;
position: relative;
display: flex;
align-items: center;
font-family: AprovaNova; }
.footer .footer-menu-item .footer-menu-item-title .footer-menu-item-icon {
margin-right: 10px; }
.footer .footer-menu-item .footer-menu-item-title a {
display: block;
font-weight: normal;
padding: 26px 0px;
width: 100%; }
@media (min-width: 800px) {
.footer .footer-menu-item .footer-menu-item-title a {
padding: 0;
font-size: 17px;
margin-bottom: 10px; } }
.footer .footer-menu-item .footer-menu-item-title.no-border-top {
border-top: 0; }
.footer .footer-menu-item .footer-menu-item-title .sub-menu-toggle {
position: absolute;
right: 0;
top: 50%;
margin-top: -8px;
width: 15px;
height: 15px;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
transition: all 150ms ease-in-out; }
.footer .footer-menu-item .footer-menu-item-title .sub-menu-toggle.opened {
transform: rotate(-180deg); }
@media (min-width: 800px) {
.footer .footer-menu-item .footer-menu-item-title .sub-menu-toggle {
display: none; } }
@media (min-width: 800px) {
.footer .footer-menu-item .footer-menu-item-title {
margin-bottom: 7px;
height: 36px;
padding: 0;
border: 0; } }
.footer .footer-menu-item .footer-menu-item-list {
letter-spacing: -0.44px;
font-size: 16px;
padding-bottom: 20px;
display: none; }
.footer .footer-menu-item .footer-menu-item-list a {
color: #666666;
cursor: pointer; }
.footer .footer-menu-item .footer-menu-item-list ul {
margin: 0; }
.footer .footer-menu-item .footer-menu-item-list li {
font-family: "InterUI", sans-serif;
line-height: 1.3;
padding-bottom: 20px; }
.footer .footer-menu-item .footer-menu-item-list li.current-menu-item a {
color: #00e88f; }
@media (min-width: 800px) {
.footer .footer-menu-item .footer-menu-item-list {
display: block; }
.footer .footer-menu-item .footer-menu-item-list a {
font-size: 12px;
margin: 0px; }
.footer .footer-menu-item .footer-menu-item-list li {
padding-bottom: 0; } }
.footer .footer-menu-item.opened .footer-menu-item-list {
display: block; }
@media (min-width: 800px) {
.footer .footer-menu-item {
width: fit-content;
border-top: 0; } }
#footer-menu ul {
display: flex;
padding: 0;
margin: 40px 0;
flex-direction: column; }
@media (min-width: 800px) {
#footer-menu ul {
margin: 0;
flex-direction: row;
justify-content: space-around; } }
#footer-menu li {
list-style: none;
margin: 0px 10px; }
.socials {
width: 80%;
margin-top: 35px; }
.socials ul {
list-style: none;
display: flex;
padding: 0;
margin: 0%;
align-items: center;
justify-content: space-between; }
@media (min-width: 800px) {
.socials ul {
justify-content: space-around; } }
@media (min-width: 800px) {
.socials {
width: auto;
margin-top: 0; }
.socials .logo-socials-mobile {
display: none; }
.socials li {
list-style: none;
margin: 0; }
.socials li:last-child {
margin-right: 0; } }
.copyright {
font-size: 10px;
display: flex;
padding-top: 35px;
align-items: center;
flex-direction: column;
border-top: 1px solid #e8e8e8;
color: #666666; }
.copyright .footer-logo {
display: none; }
.copyright .row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 70%; }
.copyright .row > ul {
display: flex;
flex-direction: row;
flex-wrap: wrap; }
@media (min-width: 800px) {
.copyright .row > ul {
flex-wrap: nowrap;
width: 40%; } }
.copyright .row > ul li {
flex: 0 0 50%;
margin: 15px 0;
font-size: 16px;
line-height: 24px;
letter-spacing: -.44px; }
.copyright .row > ul li a {
color: #666666;
font-weight: bold; }
@media (min-width: 800px) {
.copyright {
flex-direction: row;
margin-top: 35px; }
.copyright .footer-logo {
display: block; }
.copyright .socials {
margin-left: auto; }
.copyright ul {
margin: 0px 0px 0px 30px;
flex-wrap: nowrap; }
.copyright ul li {
flex: 1;
margin-left: 20px;
display: inline-block; }
.copyright ul li a {
white-space: nowrap; }
.copyright ul li:first-child {
margin-left: 0; } }
@media (min-width: 1256px) {
.main-hero-wrapper {
background: #f2f2f3; } }
.main-hero-wrapper .main-hero {
width: 100%;
padding: 32px 24px;
box-sizing: border-box;
max-width: 1280px;
margin: 0 auto; }
.main-hero-wrapper .main-hero * {
box-sizing: border-box; }
@media (min-width: 768px) {
.main-hero-wrapper .main-hero {
padding: 42px;
display: flex;
gap: 75px; } }
@media (min-width: 1256px) {
.main-hero-wrapper .main-hero {
gap: 122px;
padding: 68px; } }
@media (min-width: 768px) {
.main-hero-wrapper .main-hero .hero-details {
max-width: 310px; } }
@media (min-width: 1256px) {
.main-hero-wrapper .main-hero .hero-details {
max-width: 495px;
margin: auto 0; } }
.main-hero-wrapper .main-hero .hero-details h1 {
font-family: "VanguardCF", sans-serif;
font-size: 54px;
text-transform: uppercase;
letter-spacing: -1.08px;
line-height: 1; }
@media (min-width: 768px) {
.main-hero-wrapper .main-hero .hero-details h1 br {
display: none; } }
@media (min-width: 1256px) {
.main-hero-wrapper .main-hero .hero-details h1 {
font-size: 100px; }
.main-hero-wrapper .main-hero .hero-details h1 br {
display: block; } }
.main-hero-wrapper .main-hero .hero-details p {
margin-top: 24px;
font-size: 16px;
font-family: "AprovaNova", sans-serif;
line-height: 24px; }
.main-hero-wrapper .main-hero .hero-details button.simulate-button {
border-radius: 300px;
background: #00f99d;
color: #191a1a;
text-align: center;
font-family: "AprovaNova", sans-serif;
font-size: 14px;
width: 100%;
padding: 12px 24px;
font-weight: bold;
margin-top: 24px;
transition: ease-in-out 200ms;
cursor: pointer;
line-height: 1; }
.main-hero-wrapper .main-hero .hero-details button.simulate-button:hover {
background-color: #00e88f; }
@media (min-width: 768px) {
.main-hero-wrapper .main-hero .hero-details button.simulate-button {
padding: 16px 28px;
font-size: 16px; } }
.main-hero-wrapper .main-hero .hero-illustration {
margin-top: 75px; }
@media (min-width: 768px) {
.main-hero-wrapper .main-hero .hero-illustration {
margin-top: 0;
display: flex;
align-items: center;
justify-content: center; } }
.main-hero-wrapper .main-hero .hero-illustration img {
width: 100%; }
.about-wrapper {
background-color: #000000; }
.about-wrapper .about {
padding: 44px 24px;
width: 100%;
box-sizing: border-box;
color: #ffffff;
max-width: 1280px;
margin: 0 auto; }
.about-wrapper .about * {
box-sizing: border-box; }
@media (min-width: 768px) {
.about-wrapper .about {
flex-direction: row;
padding: 42px; } }
@media (min-width: 1256px) {
.about-wrapper .about {
padding: 68px; } }
.about-wrapper .about h2.section-title {
color: inherit;
font-family: "AprovaNova", sans-serif;
letter-spacing: -1px;
line-height: 38.4px;
font-size: 32px; }
@media (min-width: 1256px) {
.about-wrapper .about h2.section-title {
font-size: 48px;
line-height: 57.6px;
letter-spacing: -0.48px; } }
.about-wrapper .about .section-text p {
font-size: 16px;
line-height: 24px;
letter-spacing: -0.16px;
color: inherit;
margin-top: 24px; }
@media (min-width: 768px) {
.about-wrapper .about .section-text p {
margin-top: 0;
font-size: 15px; } }
@media (min-width: 1256px) {
.about-wrapper .about .section-text p br {
display: none; } }
@media (min-width: 768px) {
.about-wrapper .about .about-details {
display: flex;
gap: 24px;
align-items: center; }
.about-wrapper .about .about-details .section-title,
.about-wrapper .about .about-details .section-text {
flex: 1; } }
@media (min-width: 1256px) {
.about-wrapper .about .about-details {
gap: 66px; } }
.about-wrapper .about .infos-list {
margin-top: 24px;
display: flex;
flex-direction: column;
gap: 24px; }
@media (min-width: 768px) {
.about-wrapper .about .infos-list {
flex-direction: row; } }
@media (min-width: 1256px) {
.about-wrapper .about .infos-list {
margin-top: 68px;
gap: 32px; } }
.about-wrapper .about .infos-list .info {
background-color: #ffffff;
border-radius: 24px;
padding: 42px 24px;
color: #000000; }
@media (min-width: 768px) {
.about-wrapper .about .infos-list .info {
flex: 1; } }
@media (min-width: 1256px) {
.about-wrapper .about .infos-list .info {
padding: 32px; } }
.about-wrapper .about .infos-list .info .icon-wrap {
width: 68px;
height: 68px;
background-color: #00e88f;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%; }
.about-wrapper .about .infos-list .info h3 {
font-family: "AprovaNova", sans-serif;
color: inherit;
margin-top: 24px;
font-size: 18px;
font-weight: bold;
letter-spacing: -0.18px;
line-height: 21.6px; }
.about-wrapper .about .infos-list .info .text p {
font-family: "AprovaNova", sans-serif;
color: inherit;
margin-top: 8px;
font-size: 16px;
letter-spacing: -0.16px;
line-height: 24px; }
.about-wrapper .about .infos-list .info .text p p {
margin: 0; }
.about-wrapper .about .infos-list .info .text p a {
background-image: linear-gradient(to right, #000000, #000000);
background-position: 0 100%;
background-repeat: no-repeat;
background-size: 100% 2px;
transition: background-size 0.3s ease; }
.anchor-bar {
position: fixed;
bottom: 0;
padding: 12px 24px;
box-sizing: border-box;
display: flex;
flex-direction: column;
gap: 8px;
background-color: #000000;
width: 100%;
transition: ease-in-out 200ms;
z-index: 3; }
@media (min-width: 768px) {
.anchor-bar {
padding: 16px 28px;
flex-direction: row;
gap: 32px;
align-items: center;
justify-content: center; } }
.anchor-bar * {
box-sizing: border-box; }
.anchor-bar .anchor-bar-text p {
color: #ffffff;
font-size: 16px;
font-weight: bold;
line-height: 20.8px; }
.anchor-bar button {
background-color: #00f99d;
color: #000000;
transition: ease-in-out 200ms;
padding: 12px 24px;
display: flex;
align-items: center;
gap: 8px;
border-radius: 300px;
width: max-content;
font-weight: bold;
font-size: 14px;
line-height: 1;
cursor: pointer; }
.anchor-bar button:hover {
background-color: #00e88f; }
@media (min-width: 768px) {
.anchor-bar button {
padding: 16px 28px;
font-size: 16px; } }
.anchor-bar[data-hidden="true"] {
transform: translateY(100%); }
.ModalError {
background-color: #ffffff;
bottom: 0;
display: flex;
flex-direction: column;
justify-content: center;
left: 0;
padding: 24px;
position: fixed;
right: 0;
top: 0;
z-index: 100000; }
@media (min-width: 768px) {
.ModalError {
padding: 0; } }
.ModalError .error-title {
background-position: top left;
background-repeat: no-repeat;
background-size: auto;
font-size: 40px;
font-weight: bold;
letter-spacing: -2.1px;
line-height: 1.15;
margin: 0 auto 12px;
padding-top: 80px;
max-width: 376px;
width: 100%; }
@media (min-width: 768px) {
.ModalError .error-title {
font-size: 48px;
letter-spacing: -2.4px;
line-height: 1.08;
max-width: 352px;
padding-top: 76px; } }
.ModalError .error-message {
color: #999999;
font-size: 20px;
letter-spacing: -.6px;
margin: 0 auto 44px;
max-width: 376px; }
@media (min-width: 768px) {
.ModalError .error-message {
max-width: 352px; } }
.ModalError .error-button-close {
background-color: #08db88;
border-radius: 28px;
box-sizing: border-box;
cursor: pointer;
display: block;
font-size: 20px;
font-weight: bold;
letter-spacing: -.6px;
line-height: 1;
margin: 0 auto;
max-width: 376px;
padding: 16px;
text-align: center;
transition: 200ms background-color;
width: 100%; }
@media (min-width: 768px) {
.ModalError .error-button-close {
max-width: 188px;
margin: 0 auto;
transform: translateX(calc((188px - 376px) / 2)); } }
.ModalError .error-button-close:hover {
background-color: #00e98b; }
#steps #grade-step {
z-index: 3; }
#steps #courses-step {
z-index: 2; }
#steps #courses-step button {
padding-bottom: 15px; }
#steps #mgm-step {
z-index: 1; }
#steps .step-content {
position: relative;
opacity: 0;
transition: 0.3s ease-in-out; }
#steps .step-content input,
#steps .step-content select,
#steps .step-content button {
display: none; }
#steps.step-grades #grade-step {
opacity: 1; }
#steps.step-grades #grade-step input,
#steps.step-grades #grade-step select {
display: block; }
#steps.step-grades #grade-step button {
display: flex; }
#steps.step-courses #courses-step {
opacity: 1; }
#steps.step-courses #courses-step input,
#steps.step-courses #courses-step select {
display: block; }
#steps.step-courses #courses-step button {
display: flex; }
#steps.step-courses #grade-step {
transform: translateY(-100%); }
#steps.step-courses #courses-step {
transform: translateY(-95%); }
#steps.step-courses #mgm-step {
transform: translateY(-120%); }
#steps.step-mgm #mgm-step,
#steps.step-mgm #grade-step,
#steps.step-mgm #courses-step {
transform: translateY(-200%); }
#steps.step-mgm #mgm-step {
opacity: 1; }
#steps #breadcrumbs {
margin-top: 25px;
position: relative;
display: none; }
@media (min-width: 768px) {
#steps #breadcrumbs {
display: block; } }
#steps #breadcrumbs .back-button {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 30px;
transform: translateY(-50%);
cursor: pointer;
display: none; }
@media (min-width: 768px) {
#steps #breadcrumbs .back-button {
display: block; } }
@media (min-width: 1256px) {
#steps #breadcrumbs .back-button {
left: 55px; } }
#steps #breadcrumbs ul.step-list {
display: flex;
align-items: center;
justify-content: space-between;
max-width: 250px;
width: 100%;
margin: 0 auto;
min-height: 42px; }
#steps #breadcrumbs ul.step-list.hide-handlers {
visibility: hidden; }
#steps #breadcrumbs ul.step-list li.step-item {
width: 33.33%;
position: relative;
display: flex;
align-items: center;
justify-content: center; }
#steps #breadcrumbs ul.step-list li.step-item button {
width: 40px;
height: 40px;
border: 1px solid #dddddd;
border-radius: 50%;
font-size: 16px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: 0.3s ease-in-out; }
#steps #breadcrumbs ul.step-list li.step-item button::before {
content: "";
position: absolute;
width: 0;
height: 1px;
background-color: #00e88f;
bottom: 50%;
transform: translateY(50%);
left: 61px;
z-index: 2;
transition: 0.8s ease-in-out; }
#steps #breadcrumbs ul.step-list li.step-item button::after {
content: "";
position: absolute;
width: calc(100% - 20px);
height: 1px;
background-color: #dddddd;
bottom: 50%;
transform: translateY(50%);
right: -50%; }
#steps #breadcrumbs ul.step-list li.step-item button:disabled {
cursor: not-allowed; }
#steps #breadcrumbs ul.step-list li.step-item button.current {
transition-delay: 0.8s;
color: #00e88f;
border-color: #00e88f; }
#steps #breadcrumbs ul.step-list li.step-item button.passed {
background-color: #00e88f;
border-color: #00e88f; }
#steps #breadcrumbs ul.step-list li.step-item button.passed::before {
width: calc(100% - 20px); }
#steps #breadcrumbs ul.step-list li.step-item:first-child {
justify-content: flex-start; }
#steps #breadcrumbs ul.step-list li.step-item:first-child button::before {
left: 41px; }
#steps #breadcrumbs ul.step-list li.step-item:first-child button::after, #steps #breadcrumbs ul.step-list li.step-item:first-child button::before {
right: calc(-50% + 20px); }
#steps #breadcrumbs ul.step-list li.step-item:last-child {
justify-content: flex-end; }
#steps #breadcrumbs ul.step-list li.step-item:last-child button::after, #steps #breadcrumbs ul.step-list li.step-item:last-child button::before {
display: none; }
.Loading {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
background-color: #ffffff;
z-index: 100000; }
.Loading .spinner {
animation: rotator 1.4s linear infinite; }
@keyframes rotator {
0% {
transform: rotate(0deg); }
100% {
transform: rotate(270deg); } }
.Loading .path {
stroke-dasharray: 187;
stroke-dashoffset: 0;
transform-origin: center;
stroke: #00e88f;
animation: dash 1.4s ease-in-out infinite; }
@keyframes dash {
0% {
stroke-dashoffset: 187; }
50% {
stroke-dashoffset: 46.75;
transform: rotate(135deg); }
100% {
stroke-dashoffset: 187;
transform: rotate(450deg); } }
.page-header {
background-color: #00e88f;
display: none;
width: 35%;
height: 100vh;
padding: 28px 33px 94px 33px;
left: 0;
position: fixed;
top: 90px;
display: flex;
flex-direction: column;
box-sizing: border-box;
display: none; }
.page-header.is-fullscreen {
top: 0; }
.page-header .principal-white {
display: none;
margin-bottom: 26px; }
@media (min-width: 768px) {
.page-header {
display: flex; }
.page-header .principal-white {
display: block; } }
@media (min-width: 1256px) {
.page-header {
align-items: center;
padding: 28px 56px 86px 56px; } }
.page-header .page-header-title {
align-self: start;
max-width: 60%;
width: 100%; }
@media (min-width: 768px) {
.page-header .page-header-title {
max-width: 75%; } }
.page-header .page-header-title h2 {
font-family: "VanguardCF", sans-serif;
text-transform: uppercase;
line-height: 1;
font-size: 48px; }
@media (min-width: 1256px) {
.page-header .page-header-title h2 {
font-size: 72px; } }
.page-header .page-header-illustration {
max-width: 388px;
width: 100%;
margin: auto; }
.page-header .page-header-illustration img {
width: 100%; }
.form-section {
background-color: #ffffff;
padding: 0 20px;
box-sizing: border-box;
margin: 0 auto; }
.form-section .principal-green {
display: block;
margin: 28px auto 33px auto; }
@media (min-width: 768px) {
.form-section {
margin-left: 35%;
width: 65%; }
.form-section .principal-green {
display: none; } }
input[type="number"] {
-moz-appearance: textfield; }
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none; }
.shareButtons {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
box-sizing: border-box; }
.shareButtons * {
box-sizing: border-box; }
.shareButtons button {
display: flex !important;
align-items: center !important;
justify-content: center;
min-width: 32px;
min-height: 32px;
background-color: #00e88f;
border-radius: 50%;
cursor: pointer;
transition: ease-in-out 200ms;
position: relative;
padding: 0 !important; }
.shareButtons button::after {
content: "";
width: 38px;
height: 38px;
position: absolute;
transform: translate(50%, 50%);
right: 50%;
bottom: 50%;
border: 1px solid transparent;
border-radius: 50%; }
.shareButtons button:hover {
background-color: #4affb1; }
.shareButtons button:focus::after {
border-color: #191a1a; }
.shareButtons button svg {
width: 15px;
height: 15px; }
@media (min-width: 768px) {
.shareButtons button {
min-width: 42px;
min-height: 42px; }
.shareButtons button::after {
width: 46px;
height: 46px; }
.shareButtons button svg {
width: 20px;
height: 20px; } }
.shareButtons .tooltip {
width: auto;
position: relative; }
.shareButtons .tooltip .tooltipContent {
font-size: 12px;
position: absolute;
background-color: #191a1a;
color: #ffffff;
padding: 8px 12px;
position: absolute;
border-radius: 4px;
white-space: nowrap;
transform: translate(calc(50% + 20px), calc(-100% - 13px));
right: 50%;
bottom: 50%;
opacity: 0;
transition: opacity 200ms ease-in-out, visibility 200ms ease-in-out;
visibility: hidden; }
.shareButtons .tooltip .tooltipContent[data-show="true"] {
opacity: 1;
visibility: visible; }
.shareButtons .tooltip .tooltipContent::after {
position: absolute;
content: "";
width: 18px;
height: 18px;
background-color: #191a1a;
transform: rotate(45deg);
bottom: -9px;
left: 16px; }
.share {
width: 100%;
box-sizing: border-box; }
.share * {
box-sizing: border-box; }
.share h3 {
font-size: 24px;
font-weight: 700;
margin: 0 auto;
line-height: 28.8px;
letter-spacing: -1px;
font-family: AprovaSans, sans-serif;
letter-spacing: -0.4px; }
@media (min-width: 768px) {
.share h3 {
font-size: 32px;
line-height: 38.4px;
text-align: center;
max-width: 492px;
letter-spacing: -0.32px;
line-height: 38.4px; } }
.share p {
font-family: AprovaNova, sans-serif;
font-size: 16px;
margin: 12px auto 0;
color: #636769;
line-height: 24px;
text-align: center; }
@media (min-width: 768px) {
.share p {
font-size: 20px;
letter-spacing: -0.2px;
line-height: 30px;
margin: 16px auto 0;
max-width: 492px; } }
.share .linkContainer {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
background-color: #f5f5f5;
padding: 17px 21px;
border-radius: 4px;
font-size: 14px;
color: #636769;
max-width: 492px;
margin: 31px auto; }
.share .linkContainer span {
display: block;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
max-width: 100%; }
@media (min-width: 768px) {
.share .linkContainer {
gap: 12px;
padding: 18px 40px;
font-size: 18px;
margin-top: 48px; } }
.share .resultButton {
margin-top: 36px; }
.share .resultButton button {
display: flex !important;
align-items: center;
justify-content: center;
gap: 4px;
cursor: pointer;
margin: 0 auto;
font-size: 16px; }
.share .resultButton button span {
color: #191a1a;
font-family: AprovaNova, sans-serif;
font-size: 16px;
font-weight: 700; }
.share .resultButton button:hover span, .share .resultButton button:focus span {
background-image: linear-gradient(currentColor, currentColor);
background-repeat: no-repeat;
background-position: 0% 100%;
background-size: 100% 2px; }
.SisuAdBanner {
color: #ffffff;
font-family: AprovaNova;
margin-bottom: 40px;
border-radius: 10px; }
@media (min-width: 768px) {
.SisuAdBanner {
margin-bottom: 48px; } }
.SisuAdBanner a {
display: block;
align-items: flex-end;
gap: 20px;
background-size: cover;
background-position: right;
padding: 26px;
border-radius: 10px;
align-items: center; }
.SisuAdBanner a button {
margin: 0 auto; }
@media (min-width: 768px) {
.SisuAdBanner a {
padding: 21px;
display: flex;
justify-content: space-between;
background-position: center;
height: fit-content; } }
.SisuAdBanner a .mediumText {
font-size: 20px;
font-weight: 700;
white-space: normal;
width: 300px; }
@media (min-width: 768px) {
.SisuAdBanner a .mediumText {
width: 230px; } }
.SisuAdBanner a p {
font-family: AprovaNova;
font-size: 14px;
font-weight: normal;
line-height: 21px;
text-align: left;
white-space: nowrap;
margin-bottom: 16px; }
.SisuAdBanner a p .biggerText {
font-size: 24px;
font-weight: 700; }
@media (min-width: 768px) {
.SisuAdBanner a p .biggerText {
font-size: 32px; } }
@media (min-width: 768px) {
.SisuAdBanner a p {
font-size: 16px;
letter-spacing: 0;
line-height: 27px;
margin-bottom: 0;
height: fit-content; } }
.SisuAdBanner a p .nowrap {
white-space: nowrap; }
.SisuAdBanner a .ad-button {
appearance: none;
border: none;
border-radius: 32px;
background-color: #ffe900;
box-sizing: border-box;
display: block;
color: black;
font-weight: 700;
font-size: 14px;
height: 40px;
width: 180px;
font-family: AprovaNova; }
@media (min-width: 768px) {
.SimulationResult {
padding-top: 90px; } }
.SimulationResult .admission-estimate-aligner {
max-width: 498px;
margin: 0 auto;
text-align: center; }
.SimulationResult .institution-label .institution {
color: #111111; }
.SimulationResult .institution-label .campus {
color: #666666;
font-weight: 400; }
.SimulationResult .admission-estimates-gallery {
padding: 0 4px 0; }
@media (min-width: 768px) {
.SimulationResult .admission-estimates-gallery {
padding-top: 90px; } }
.SimulationResult .admission-estimates-gallery .sales-banner {
margin: 36px auto 0;
padding: 0 0 10px;
max-width: 480px;
position: relative; }
@media (min-width: 768px) {
.SimulationResult .admission-estimates-gallery .sales-banner {
max-width: 514px;
margin: 0 0; } }
.SimulationResult .admission-estimates-gallery .admission-big-hero {
margin: 0 0 40px 0;
display: flex;
align-items: center;
flex-direction: column; }
@media (min-width: 768px) {
.SimulationResult .admission-estimates-gallery .admission-big-hero {
margin: 0 0 48px 0; } }
.SimulationResult .admission-estimates-gallery .admission-big-hero h1 {
font-size: 16px;
line-height: 24px;
letter-spacing: -1px;
font-weight: 400; }
@media (min-width: 768px) {
.SimulationResult .admission-estimates-gallery .admission-big-hero h1 {
font-size: 24px;
line-height: 28px; } }
.SimulationResult .admission-estimates-gallery .admission-big-hero .admission-graph {
width: 150px;
height: 150px;
display: flex;
align-items: center;
justify-content: center;
background: transparent center center no-repeat;
vertical-align: middle; }
.SimulationResult .admission-estimates-gallery .admission-big-hero .admission-graph p {
margin-top: 15px;
color: #666666;
font-size: 14px;
line-height: 1.2; }
.SimulationResult .admission-estimates-gallery .admission-big-hero .admission-graph strong {
color: black;
font-size: 32px;
letter-spacing: -1.2px; }
.SimulationResult .admission-estimates-gallery .admission-big-hero footer {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column; }
.SimulationResult .admission-estimates-gallery .admission-big-hero footer p {
font-size: 14px;
line-height: 20px;
color: #111111; }
.SimulationResult .admission-estimates-gallery .admission-big-hero footer .admission-grade-range {
width: 100%;
max-width: 205px;
color: #666666;
display: flex;
align-items: center;
justify-content: space-between;
margin: 12px 0; }
.SimulationResult .admission-estimates-gallery .admission-big-hero footer .admission-grade-range .admission-grade-range-values {
font-weight: 600;
font-size: 16px;
line-height: 24px;
text-align: center;
letter-spacing: -0.6px;
color: #666666; }
.SimulationResult .admission-estimates-gallery .admission-big-hero footer .admission-grade-range .admission-grade-range-values.admission-grade-min {
margin-right: 8px; }
.SimulationResult .admission-estimates-gallery .admission-big-hero footer .admission-grade-range .admission-grade-range-values.admission-grade-max {
margin-left: 8px; }
.SimulationResult .admission-estimates-gallery .admission-big-hero footer .admission-grade-range .admission-grade-range-separator {
flex: 1;
background: #666666;
height: 1px;
margin: 0 12px; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card {
max-width: 498px;
padding: 20px;
padding-left: 30px;
position: relative;
border-radius: 10px;
margin-bottom: 22px;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: center;
text-indent: -0.6px;
border: 1px solid #dddddd;
border-left: none;
text-align: left; }
@media (min-width: 768px) {
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card {
padding: 16px 30px 30px 41px; } }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card:before {
content: '';
display: block;
height: 100%;
left: 0px;
position: absolute;
top: 0;
width: 8px; }
@media (min-width: 768px) {
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card:before {
width: 11px; } }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card:last-child {
margin-bottom: 0; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card.high-chance:before {
background-color: #00c974; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card.some-chance:before {
background-color: #fed500; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card.slight-chance:before {
background-color: #f69999; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card header {
margin-bottom: 20px;
color: #111111;
font-weight: 700; }
@media (min-width: 768px) {
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card header {
margin-right: 45px; } }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer {
font-weight: 700;
color: #333333;
font-size: 18px;
line-height: 16px;
display: flex;
align-items: end;
justify-content: space-between; }
@media (max-width: 744px) {
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer {
display: block; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .result-index {
margin-bottom: 5px; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer > div {
justify-content: start !important; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer > div:first-child {
padding-bottom: 20px; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer > div:first-child > div:first-child {
padding-right: 20px; } }
@media (min-width: 768px) {
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer {
font-size: 18px;
line-height: 24px; } }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .chances-information {
display: flex;
align-items: center; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .user-grade,
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .time-of-day {
display: block !important; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .user-grade img,
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .time-of-day img {
margin-right: 5px; }
@media (min-width: 351px) {
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .user-grade .result-index,
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .time-of-day .result-index {
line-height: normal; } }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .user-grade .result-index,
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .time-of-day .result-index {
display: flex;
font-weight: 400;
font-size: 12px;
color: #666666; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer > div {
display: flex;
align-items: center;
justify-content: center; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer > div div:first-child {
padding-right: 10px; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer > div img {
margin-right: 4px;
display: block; }
@media (min-width: 768px) {
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer > div img {
margin-right: 5px; } }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer > div .text {
white-space: nowrap;
text-overflow: ellipsis; }
.SimulationResult .admission-estimates-gallery .gallery-wrapper .admission-estimate-card footer .chances-information .emoji {
margin-left: 10px; }
.SimulationResult .admission-estimates-gallery .progress {
margin: 16px 0px;
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between; }
.SimulationResult .admission-estimates-gallery .progress .step {
flex: 1;
font-weight: bold;
text-align: center;
color: #e0e0e0;
border-bottom-width: 3px;
border-bottom-color: #e0e0e0;
border-bottom-style: solid; }
.SimulationResult .admission-estimates-gallery .progress .step-completed {
flex: 1;
font-weight: bold;
text-align: center;
color: #00e88f;
border-bottom-width: 3px;
border-bottom-color: #00e88f;
border-bottom-style: solid; }
.SimulationResult .simulate-again {
padding-top: 32px;
padding-bottom: 56px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center; }
.SimulationResult .simulate-again a {
display: flex;
gap: 10px;
align-items: center;
justify-content: center;
max-width: 180px; }
.SimulationResult .simulate-again p {
font-size: 16px;
margin-top: 20px; }
.SimulationResult .know-more-course {
margin-top: 10px;
margin-bottom: -5px; }
.SimulationResult .know-more-course a {
color: #666666;
font-size: 14px;
line-height: 18px;
text-decoration: underline; }
.SimulationResult .experimentar-btn {
border-radius: 25px;
cursor: pointer;
display: block;
font-size: 14px;
font-weight: bold;
line-height: 14px;
margin-top: 5px;
padding: 10px 20px;
width: fit-content; }
.SimulationResult .experimentar-btn {
background-color: #ffffff;
border: 1px solid #111111;
box-sizing: content-box;
color: #111111; }
.SimulationResult .experimentar-btn:hover {
border: 1px solid #111111;
background-color: #111111;
color: #f5f5f5; }