#home-banner-area {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.2) , rgba(0, 0, 0, 0)), url(https://res.cloudinary.com/classuruguay/image/upload/q_auto/f_auto/v1712344550/nfp7yeo6hpmp1ks0mkfo.webp);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 75px 0;
    color: #fff;
    height: 470px;
    background-position: 50% 50%;
}
.container-xl {width: 100%;padding-right: 20px;padding-left: 20px;margin-right: auto;margin-left: auto;}
.position-relative {position: relative!important;}
.col {flex: 1 0 0%;}
.home-banner-wrap {max-width: 490px;}
.home-banner-wrap h2 {color:#ffffff;font-family: 'Roboto';font-size:6rem;}
.home-banner-wrap h3 {color:#ffffff; font-family: 'Roboto';font-size:3rem;line-height: 1.4;}
.fw-bold {font-weight: 700!important;font-size:5rem;}
.caption {margin-bottom: 40px;}
.player-cptn h2 {font-weight: bold;}
#player {background-color: #f0f0f0;}
.fila {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
}
.fila h2 {font-weight: bold;font-size:22px;}
.fila ul li {font-family: 'Muli', sans-serif !important;}
.fila>* {
    flex-shrink: 0;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-top: var(--bs-gutter-y);
}
*, ::after, ::before {box-sizing: border-box;}
.d-flex {display: flex!important;}
.flex-column {flex-direction: column!important;}
.align-items-stretch {align-items: stretch!important;}
.text-center {text-align: center!important;}
#courses {padding: 60px 0;}
#como-funciona {padding: 60px 0;}
#why-us {background-color: #f0f0f0;padding:80px 0;}
.why-us .content {padding: 30px;background: #3f51b5;border-radius: 4px;color: #fff;font-family: 'Nunito', sans-serif;width: 100%;font-size:15px;}
.why-us .content p {color: white; font-size: 15px;font-family: 'Muli', sans-serif;line-height:22px;}
.why-us .content .more-btn {
    display: inline-block;
    background: #ffffff;
    padding: 10px 30px;
    color: #3f51b5;
    border-radius: 50px;
    transition: all ease-in-out 0.4s;
    font-size: 2rem;
    /* font-weight: bold; */
    margin: 20px 0;
    border:2px solid #fff;
}
.why-us .content .more-btn:hover {color: #fff;background-color: #29CA8E;}
.why-us .icon-boxes .icon-box {text-align: center;background: #fff;padding: 40px 30px;width: 100%;border: 4px solid #eef0ef;}
.why-us .icon-boxes .icon-box i {font-size: 32px;padding: 18px;color:#3f51b5;margin-bottom: 30px;background: #ecf9f0;border-radius: 50px;}
.why-us .icon-boxes .icon-box p {font-size: 16px;color: #848484;text-align: left;}
.comofunciona {padding:10px;text-align: center;}
.img-panel {clear: both;width: 80px;padding: 20px 0;}
.mt-4 {margin-top: 1.5rem!important;}
.stn-reg {
    background-image: url(https://res.cloudinary.com/classuruguay/image/upload/v1662338421/fotos_todas/profesor-particular-en-clase-particular-online.webp);
    background-size: cover;
    padding: 96px 0;
    position: relative;
    width: 100%;
    background-blend-mode: multiply;
    background-color: #00000040;
}
.regis {margin: 0 auto;max-width: 1024px;padding: 0 16px;position: relative;}
.registr {color: rgb(0, 0, 0);display: -webkit-flex;display: flex;-webkit-flex-direction: column;flex-direction: column;margin-right: auto;max-width: 400px;}
.reg-title {font-size:40px;font-weight:700;line-height:48px;padding-bottom:16px;color:rgb(255, 255, 255);}
.reg-subtitle {font-size:22px;line-height:28px;color:rgb(255, 255, 255);}
.reg-btn {
    position: relative;
    display: inline-flex;
    justify-content: center;
    border: 0;
    align-items: center;
    min-height: 32px;
    min-width: 176px;
    font-size: 20px;
    line-height: 1;
    text-decoration: none;
    font-weight: 500;
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 100%;
    cursor: pointer;
    outline: 0;
    transition: background-color 50ms;
    color: #fff;
    background-color: #3f51b5;
    padding: 16px;
    border-radius: 28px;
    margin-top: 30px;
}
.btnn {background-color: #29CA8E;color: white;padding: 16px 20px;border: none;cursor: pointer;width: 49%;margin-bottom:10px;opacity: 0.8;}
.cancel {background-color: rgb(177, 177, 177);}
.help-text {font-size: small;margin-top: 6px;}
.help-block {color: tomato;margin-top: 6px;}
@media (min-width:768px) and (max-width:1023px) {#home-banner-area {background-position-x:75%;}}
@media (min-width: 992px) {.col-lg-4 {flex: 0 0 auto;width: 33.33333333%;}.col-lg-8 {flex: 0 0 auto;width: 66.66666667%;}}
@media (min-width: 1200px) {.container-xl {max-width: 1140px;}.col-xl-4 {flex: 0 0 auto;width: 33.33333333%;}}
@media only screen and (max-width: 767px) {
    .stn-reg {background-position: 25%;}
    .home-banner-wrap h2 {font-size:4rem;}
    .home-banner-wrap h3 {font-size:2.2rem;max-width:49vw;}
    #home-banner-area {background-position: 80% bottom;padding-top:20px;}
    .btn-signup {margin-top:30px;}
    .reg-btn {font-size:1.4rem;min-width:136px;}
}
@media (min-width:1920px) {#home-banner-area {height:695px;padding:200px 0;}.reg-btn{width:65%;margin-top:70px;}}