/* Minification failed. Returning unminified contents.
(30,39): run-time error CSS1039: Token not allowed after unary operator: '-color-red-txt--primary'
(100,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-txt--primary'
(171,34): run-time error CSS1046: Expect comma, found '0'
(171,37): run-time error CSS1046: Expect comma, found ')'
(227,29): run-time error CSS1039: Token not allowed after unary operator: '-color-red-txt--primary'
(288,17): run-time error CSS1039: Token not allowed after unary operator: '-color-red-txt--primary'
(348,21): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-txt--secondary'
(588,21): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-txt--primary'
(602,17): run-time error CSS1039: Token not allowed after unary operator: '-color-red-txt--primary'
(649,28): run-time error CSS1039: Token not allowed after unary operator: '-color-red-txt--primary'
(682,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-txt--secondary'
(779,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-txt--secondary'
(821,25): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-txt--secondary'
(869,40): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-txt--secondary'
(1171,40): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-txt--secondary'
 */
.container-home {
}

.contenido-home {
    overflow: hidden;
}

/*----- SECTION 1 -----*/
.section1 {
    background-image: url(/Content/assets/home/bg_mo_home_section_1.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.section1-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 5rem;
    position: relative;
    overflow: hidden;
    width: 100%;
}

    .section1-title h1 {
        text-shadow: 4px 4px 0px var(--color-red-txt--primary);
        -webkit-text-stroke-width: 2px;
        -webkit-text-stroke-color: #000;
        color: white;
        font-size: 48px;
        font-family: 'LtoUnicore-LabBlackIt';
        text-transform: uppercase;
        position: relative;
        font-size: calc(40px + .5vw);
        letter-spacing: -2px;
        display: flex;
        flex-direction: column;
    }

        .section1-title h1 > span {
            margin-left: 110px;
        }

    .section1-title .section1-title-imgs {
        display: flex;
        justify-content: end;
        align-items: center;
        margin-top: 10px;
        /* margin-left: 23px; */
    }

        .section1-title .section1-title-imgs > img {
            max-width: 220px;
            position: inherit;
            z-index: 2;
        }

    .section1-title .title-img-kellogg {
        width: 100%;
        max-width: 200px;
        /* margin-left: 10%; */
        /* transform: translateX(-10%); */
    }

    .section1-title .title-img-justiceleague {
        width: 100%;
    }

    .section1-title .section1-title-text {
        /* margin-top: 20px; */
        display: flex;
        flex-direction: column;
        max-width: 450px;
        width: 90%;
    }

.section1-title-text h5 {
    text-shadow: 4px 4px 0px black;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000;
    color: white;
    font-size: 24px;
    text-align: right;
    font-family: 'LtoUnicore-LabBlackIt';
    text-transform: uppercase;
    max-width: 330px;
    margin-left: -56px;
    letter-spacing: -2px;
    position: relative;
}

.section1-title-text h4 {
    text-shadow: 2px 3px 0px black;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000;
    color: var(--color-yellow-txt--primary);
    font-size: 28px;
    /* text-align: right; */
    font-family: 'LtoUnicore-LabBlackIt';
    text-transform: uppercase;
    max-width: 270px;
    margin-left: 80px;
    letter-spacing: -2px;
    position: relative;
    z-index: 1;
}

.section1-personajes .personajes-img {
    width: 100%;
}


.section1-title .section1-personajes {
    display: flex;
    align-items: end;
}

    .section1-title .section1-personajes > img {
    }

.section1-personajes .personajes-img--mujrmar {
    position: inherit;
    z-index: 1;
    max-width: 650px;
}

.section1-personajes .personajes-img--hombrelata {
    max-width: 180px;
    position: inherit;
    z-index: 3;
    margin-left: -72px;
}

.section1-personajes .personajes-img--poseidon {
    max-width: 190px;
    position: inherit;
    z-index: 1;
    margin-left: -80px;
}

.section1-title .personajes-img--mosca {
    position: absolute;
    width: 40%;
    top: 24px;
    right: -40px;
    max-width: 250px;
}

.section1-registrarpro {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 5rem;
    padding-bottom: 2rem;
    width: 95%;
}

    .section1-registrarpro .section1-registrarpro-form {
        width: 95%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

.registrarpro-form-title {
    background-color: white;
    box-shadow: 0 6px 12px rgb(0 0 0);
    border: 4px solid black;
    position: absolute;
    top: -30px;
}

    .registrarpro-form-title h6 {
        /* background-color: white; */
        padding: 15px 0px;
        font-size: 20px;
        font-family: 'Open Sans', sans-serif;
        text-transform: uppercase;
        font-weight: 900;
        font-style: italic;
        max-width: 200px;
        text-align: center;
        line-height: 20px;
        letter-spacing: -0.2px;
    }

.section1-registrarpro-form form {
}

#section1-form-regiprod {
    background-image: url(/Content/assets/home/bg_mo_home_section2.webp);
    background-size: 100% 100%;
    background-position: top;
    background-repeat: no-repeat;
    padding: 100px 10px 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    max-width: 500px;
    width: 100%;
}

    #section1-form-regiprod .form-group {
        display: flex;
        flex-direction: column;
        gap: 5px;
        margin-bottom: 20px;
        width: 80%;
    }

        #section1-form-regiprod .form-group label {
            font-family: 'Open Sans', sans-serif;
            font-size: 15px;
            font-weight: 700;
            display: flex;
            gap: 5px;
            align-items: center;
        }

            #section1-form-regiprod .form-group label i {
                color: var(--color-red-txt--primary);
                font-size: 15px;
            }

        #section1-form-regiprod .form-group > div {
            display: flex;
            align-items: center;
            gap: 5px;
        }

            #section1-form-regiprod .form-group > div svg {
                width: 20px;
                cursor: pointer;
            }

        #section1-form-regiprod .form-group input,
        #section1-form-regiprod .form-group select {
            padding: 10px 20px;
            border: 1px solid #090909;
            background: white;
            box-shadow: 1px 3px 0px 0px #000;
            font-size: 15px;
            font-family: 'Open Sans', sans-serif;
        }


            #section1-form-regiprod .form-group input:focus,
            #section1-form-regiprod .form-group select:focus {
                outline: none;
            }

.flatpickr-calendar.open {
    font-family: 'Open Sans', sans-serif;
}

#section1-form-regiprod button[type="submit"] {
    cursor: pointer;
    font-size: 20px;
    padding: 10px 40px;
    width: 80%;
    margin-top: 30px;
    font-weight: bold;
}

#section1-form-regiprod > a {
    color: black;
    margin-top: 50px;
    font-family: 'Open Sans', sans-serif;
    font-weight: bold;
}

.section1-registrarpro > span {
    color: white;
    text-align: center;
    font-size: 11px;
    font-weight: 400;
    font-family: 'Open Sans', sans-serif;
    margin-top: 20px;
}

#section1-form-regiprod small {
    color: var(--color-red-txt--primary);
    font-family: 'Open Sans', sans-serif;
    font-weight: 900;
    text-align: center;
}

#section1-form-regiprod > span {
    color: black;
    margin-top: 20px;
    font-family: 'Open Sans', sans-serif;
    font-weight: bold;
    text-align: center;
    text-decoration: underline;
}

.section1-title .section1-title-klalogo { /* margin-left: 130px; */ /* width: 100%; */
}

.section1-title-klalogo > img {
}
/*----- FINSECTION 1 -----*/
/*----- SECTION 2 -----*/
.section2 {
    background-image: url(/Content/assets/home/bg_mo_home_section2_2.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding-top: 15rem;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 5rem;
}

.section2-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: inherit;
}

    .section2-title h2 {
        color: #FFF;
        text-align: center;
        text-shadow: 3px 3px 0px #FFF;
        -webkit-text-stroke-width: 2px;
        -webkit-text-stroke-color: #020C1C;
        font-size: 36px;
        font-family: 'LtoUnicore-LabBlackIt';
        text-transform: uppercase;
        max-width: 350px;
    }

        .section2-title h2 > span {
            margin-left: 130px;
        }

    .section2-title > p {
        margin-top: 20px;
        color: var(--color-yellow-txt--secondary);
        font-family: 'LtoUnicore-LabBlackIt';
        font-size: 20px;
        text-transform: uppercase;
    }

.section2-pasos {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 100px;
    margin-top: 100px;
}

    .section2-pasos .section2-pasos-paso {
        background-color: white;
        border: 4px solid black;
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        width: 320px;
        height: 495px;
        gap: 10px;
    }

.section2-pasos-paso .pasos-paso--numero {
    color: #000;
    text-align: center;
    -webkit-text-stroke-width: 5px;
    -webkit-text-stroke-color: #FFCE34;
    font-size: 130px;
    font-family: 'LtoUnicore-LabBlackIt';
    position: absolute;
    top: -90px;
}

.section2-pasos-paso .pasos-paso--img {
}

    .section2-pasos-paso .pasos-paso--img .paso-img--1 {
        width: 100%;
        max-width: 320px;
        margin-top: 40px;
    }

    .section2-pasos-paso .pasos-paso--img .paso-img--2 {
        width: 100%;
        max-width: 355px;
        margin-top: 40px;
    }

    .section2-pasos-paso .pasos-paso--img .paso-img--3 {
        width: 100%;
        max-width: 300px;
        margin-top: 60px;
    }

.section2-pasos-paso .pasos-paso--title {
    font-family: 'LtoUnicore-LabBlackIt';
    font-size: 30px;
}

.section2-pasos-paso .pasos-paso--description {
    font-family: 'Open Sans', sans-serif;
    text-align: center;
    font-size: 17px;
    max-width: 300px;
    line-height: normal;
    letter-spacing: -0.198px;
}

.section2-pasos-paso .pasos-paso--span {
    font-size: 10px;
    font-family: 'Open Sans', sans-serif;
}

.section2 .section2-deco-img {
}

.section2 .section2-deco-gatubela {
    width: 100%;
    max-width: 260px;
    position: absolute;
    left: -58px;
    top: 0;
}

.section2 .section2-deco-img--robin {
    display: none;
    position: absolute;
    width: 100%;
}

.section2 > span {
    color: white;
    margin-top: 20px;
    font-weight: 400;
    font-family: 'Open Sans', sans-serif;
    font-size: 11px;
    text-align: center;
}

.section2 > a {
    cursor: pointer;
    font-size: 20px;
    padding: 15px 40px;
    margin-top: 30px;
    font-weight: bold;
    text-decoration: none;
}
/*----- FINSECTION 2 -----*/
/*----- SECTION 3 -----*/

.section3 {
    background-image: url(/Content/assets/home/bg_mo_home_section3.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding-top: 8rem;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 5rem;
    /* overflow: hidden; */
}

.section3-title > h2 {
    color: #FFF;
    text-shadow: 5px 5px 5px black;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #020C1C;
    font-size: 36px;
    text-transform: uppercase;
    max-width: 330px;
    text-align: left;
    margin-left: -40px;
    font-family: 'LtoUnicore-LabBlackIt';
}

.section3-mo-carrucel {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.section3 > a {
    cursor: pointer;
    font-size: 20px;
    padding: 15px 40px;
    margin-top: 30px;
    font-weight: bold;
    text-decoration: none;
    min-width: 230px;
    text-align: center;
}

.section3 .section3-img-asset {
    position: absolute;
}

.section3 .section3-mujersuper {
    width: 100%;
    max-width: 220px;
    top: -60px;
    right: -60px;
    z-index: 1;
    display: none;
}

.section3 .section3-superman {
    display: none;
}
/*---- SLIDER PREMIOS ----*/
.section3 .slider-container {
    overflow: hidden;
    width: 100%;
    margin-top: 80px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    max-width: 800px;
}

.section3 .swiper_container-tutorial {
    width: 100%;
}

.section3 .swiper-wrapper {
}

.section3 .swiper-slide,
.section3 .swiper-slide-dt {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* justify-content: space-around; */
    /* gap: 30px; */
    color: white;
}

.section3 .flecha-slider {
    position: absolute;
    cursor: pointer;
    z-index: 1;
}

.section3 .flecha-left {
    left: 3%;
    top: 35%;
    transform: translateY(-40%);
}

.section3 .flecha-right {
    right: 3%;
    top: 35%;
    transform: translateY(-40%);
}

.section3 .swiper-slide img,
.section3 .swiper-slide-dt img {
    /* width: 100%; */
    max-width: 250px;
}

.section3 .swiper-slide p,
.section3 .swiper-slide-dt p {
    max-width: 286px;
    text-align: center;
    text-transform: uppercase;
    font-family: 'LtoUnicore-LabBlackIt';
    font-size: 30px;
    color: black;
    margin-top: 15px;
}

    .section3 .swiper-slide p > span,
    .section3 .swiper-slide-dt p > span {
        color: var(--color-yellow-txt--primary);
    }

.slider-container .slider-container-legend {
    font-family: 'Montserrat';
    font-size: 13px;
    color: white;
    text-align: center;
    margin-top: 30px;
    /* max-width: 650px; */
}

.swiper-slide > h6,
.swiper-slide-dt > h6 {
    color: var(--color-red-txt--primary);
    text-shadow: -3px -3px 0 #FFF, 0px -3px 0 #FFF, 3px -3px 0 #FFF, -3px 0px 0 #FFF, 3px 0px 0 #FFF, -3px 3px 0 #FFF, 0px 3px 0 #FFF, 3px 3px 0 #FFF;
    font-size: 30px;
    font-family: 'LtoUnicore-LabBlackIt';
    text-transform: uppercase;
    text-align: center;
    min-height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 295px;
}

.swiper-slide > span {
}

.swiper-slide-container {
    display: flex;
    flex-direction: column;
    align-items: center; /* justify-content: space-between; */ /* min-height: 330px; */
    width: 300px;
    height: 270px;
    background-color: white;
    padding: 50px 10px;
    border: 4px solid black;
}

    .swiper-slide-container > span {
        font-size: 12px;
        font-family: 'Open Sans', sans-serif;
        color: black;
    }

.swiper-pagination {
    margin-top: 20px;
    position: initial;
}

.swiper-pagination-bullet {
    background-color: white;
    width: 10px;
    height: 10px;
    border: 2px solid black;
    opacity: 1;
}

.swiper-pagination-bullet-active {
    background-color: var(--color-red-txt--primary);
}


.section3-dt-carrucel {
    display: none;
}
/*----- FINSECTION 3 -----*/
/*----- SECTION 4 -----*/
.section4 {
    background-image: url(/Content/assets/home/bg_mo_home_section4.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding-top: 5rem;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 5rem;
}

.section4-ranking {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .section4-ranking .ranking-title {
    }

.ranking-title > h2 {
    color: var(--color-yellow-txt--secondary);
    text-align: center;
    text-shadow: 2px 2px 0px #000;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000;
    font-size: 22px;
    font-family: 'LtoUnicore-LabBlackIt';
    text-transform: uppercase;
    font-weight: 900;
    max-width: 400px;
    line-height: 26px; /* 118.182% */
    letter-spacing: -0.242px;
}

    .ranking-title > h2 > span {
        color: #FFF;
        text-shadow: 2px 2px 0px black;
        -webkit-text-stroke-width: 1px;
        -webkit-text-stroke-color: #020C1C;
    }

.section4-ranking .contenido-ranking {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 95%;
    max-width: 500px;
}

.section4-ranking .contenido-ranking--dt {
    display: none;
}

.section4-ranking .contenido-ranking--mo {
    width: 100%;
    max-width: initial;
    align-items: center;
}


.contenido-ranking .ranking-item {
    background-image: url(/Content/assets/teaser/bg_dt_tira_teaser.webp);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 10px 20px;
    border-bottom: 3px solid black;
}

.ranking-item .ranking-item--img {
}

    .ranking-item .ranking-item--img > img {
        width: 100%;
        max-width: 50px;
    }

.ranking-item > p {
    font-family: 'LtoUnicore-LabBlackIt';
    text-transform: uppercase;
}


.section4-ranking .contenido-ranking--mo .slider-container {
    display: flex;
    justify-content: center;
    width: 100%;
}

    .section4-ranking .contenido-ranking--mo .slider-container .swiper-container {
        width: 100%;
    }

.section4-ranking .contenido-ranking--mo .swiper-wrapper {
    max-width: 500px;
}

    .section4-ranking .contenido-ranking--mo .swiper-wrapper .swiper-slide {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }

        .section4-ranking .contenido-ranking--mo .swiper-wrapper .swiper-slide .ranking-item {
            width: 85%;
            max-width: 400px;
        }

.section4-ranking .contenido-ranking--mo .swiper-pagination {
}

.section4-ranking .contenido-ranking--mo .swiper-pagination-bullet-active {
    background-color: var(--color-yellow-txt--secondary);
}

/*----- FINSECTION 4 -----*/
/*----- SECTION 5 -----*/
.section5 {
    background-image: url(/Content/assets/home/bg_mo_home_section5_2.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right;
    padding-top: 5rem;
    padding-bottom: 2rem;
}

    .section5 .section5-img-asset {
        /*position: absolute;*/
    }

    .section5 .section5-melvin {
        width: 70%;
        max-width: 300px;
    }

    .section5 .section5-premios {
        margin-top: 40px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .section5 .contenido-section5-premios {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .section5 .section5-premios-title {
        display: flex;
        justify-content: center;
    }

        .section5 .section5-premios-title > h2 {
            color: var(--color-yellow-txt--secondary);
            text-align: center;
            text-shadow: 3px 3px 0px #000;
            -webkit-text-stroke-width: 1px;
            -webkit-text-stroke-color: #000;
            font-family: 'LtoUnicore-LabBlackIt';
            text-transform: uppercase;
            font-weight: 900;
            max-width: 400px;
            /*line-height: 26px;*/
            letter-spacing: -0.3px;
            font-size: 25px;
            /*margin-left: 25px;
            margin-right: 25px;*/
            padding-inline: 10px;
        }

            .section5 .section5-premios-title > h2 > span {
                color: white;
            }

    .section5 .section5-premios-actions {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0px;
        width: 95%;
    }

        .section5 .section5-premios-actions > button {
            cursor: pointer;
            background-color: transparent;
            border: none;
            color: white;
            font-family: 'LtoUnicore-LabBlackIt';
            text-transform: uppercase;
            font-size: 18px;
            padding: 0;
            position: relative;
        }

            .section5 .section5-premios-actions > button::after {
                content: '';
                position: absolute;
                left: 0;
                bottom: -15px;
                width: 0;
                height: 6px;
                background-color: var(--color-yellow-txt--secondary);
                transition: width 0.3s ease;
            }

            .section5 .section5-premios-actions > button:hover::after {
                width: 100%;
            }

            .section5 .section5-premios-actions > button.active::after {
                width: 100%;
            }

    .section5 .section5-premios-rankings {
        margin-top: 50px;
        display: flex;
        justify-content: center;
    }

.section5-premios-rankings .premios-rankings-container {
    width: 95%;
}

.section5-premios-rankings .premios-rankings-item {
    background-color: white;
    padding: 20px 45px;
    border-color: black;
    border-width: 2px 5px 5px 2px;
    border-style: solid;
}

.premios-rankings-item .ranking-item {
}

    .premios-rankings-item .ranking-item > img {
    }


.premios-rankings-accions {
    display: none;
    justify-content: center;
    gap: 40px;
    width: 100%;
    margin-top: 30px;
}


.section5-premios-actions {
}

    .section5-premios-actions button.premios-actions-mo {
        /* -webkit-text-stroke-width: 0.8px; */
        /* -webkit-text-stroke-color: #020C1C; */
        font-weight: bold;
        max-width: 100px;
        font-size: 12px;
        text-align: center;
        text-shadow: -2px -2px 0 black, 0px -2px 0 black, 2px -2px 0 black, -2px 0px 0 black, 2px 0px 0 black, -2px 2px 0 black, 0px 2px 0 black, 2px 2px 0 black;
    }

    .section5-premios-actions .premios-actions-dt {
        display: none;
    }


.section-ranking {
    background: #ed1c24;
    padding: 40px 20px;
    text-align: center;
    color: #fff;
}

.section-ranking-title h2 {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
}

.section-ranking-title p {
    font-size: 15px;
    margin-bottom: 30px;
    color: white;
    margin-top: 20px;
    font-weight: bold;
    font-family: 'Open Sans', sans-serif;
    text-align: center;
    padding-inline: 10px;
}

/*.ranking-list {
        list-style: none;
        padding: 0;
    }

        .ranking-list li {
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 10px 0;
            gap: 10px;
        }

        .ranking-list img {
            width: 40px;
            height: 40px;
            border-radius: 50%;
        }

    .swiper-container-ranking {*/
/*max-width: 600px;*/
/*margin: auto;
    }

    .swiper-slide {
        padding: 20px;
    }

    .swiper-pagination {
        margin-top: 20px;
        position: static;
    }*/

.ranking-buttons {
    margin-right: 100px;
    margin-top: 30px;
    display: flex;
    justify-content: center;
    gap: 20px;
}

.swiper-wrapper-section5 {
    align-content: center;
}

.section5 a {
}

.section5 .btn-bg-red-c-white {
    display: block;
    padding: 15px 0px;
    text-decoration: none;
    width: 40%;
    text-align: center;
    font-weight: bold;
}

.img-tabla-pre {
    /* padding: 20px; */
    max-width: 400px;
    width: 100%;
}

.section5-melvin--dt {
    display: none;
}

.section5-melvin--mo {
}

.section5-melvin-asset {
    width: 100%;
    display: flex;
    justify-content: center;
}
/*----- FINSECTION 5 -----*/
@media(min-width: 900px) {
    .container-home {
    }

    .section1 {
        background-image: url(/Content/assets/home/bg_dt_home_section_1.webp);
        /* min-height: 100vh; */
        flex-direction: row;
        padding-top: 5rem;
        align-items: start;
        justify-content: space-evenly;
    }

    .section1-title {
        width: 50%;
        padding-top: 3rem;
        /* max-width: 500px; */
    }

    .section1-registrarpro {
        width: 50%;
        padding-top: 3rem;
        /* max-width: 500px; */
    }

    .section1-title h1 {
        font-size: 60px;
    }

    .section1-title .personajes-img--mosca {
        max-width: 170px;
        top: 30%;
        right: 0%;
        display: none;
    }

    .registrarpro-form-title {
        top: 20px;
        left: -20px;
    }

        .registrarpro-form-title > h6 { /* max-width: initial; */
            padding: 10px 10px;
        }

    .section2 {
        background-image: url(/Content/assets/home/bg_dt_home_section_2.webp);
        /* min-height: 100vh; */
        padding-top: 5rem;
    }


        .section2 .section2-deco-gatubela {
            left: -30px;
            top: 0;
            max-width: 300px;
        }

    .section2-title h2 {
        max-width: initial;
        font-size: 45px;
    }

        .section2-title h2 > span {
            margin-left: 0;
        }

    .section2-title > p {
        font-size: 45px;
    }

    .section2-title {
        z-index: 2;
    }


    .section3 .section3-mujersuper {
        top: 200px;
        left: 0px;
        right: initial;
        max-width: 300px;
        display: block;
    }

    .section3 {
        background-image: url(/Content/assets/home/bg_dt_home_section_3.webp);
        /* min-height: 100vh; */
    }

    .section4 {
        background-image: url(/Content/assets/home/bg_dt_home_section_4.webp);
        /* min-height: 100vh; */
    }

    .ranking-title > h2 {
        font-size: 45px;
        max-width: initial;
        line-height: 40px;
        max-width: 800px;
    }

    .section5 {
        background-image: url(/Content/assets/home/bg_dt_home_section_5_2.webp);
        /* min-height: 100vh; */
    }

        .section5 .section5-premios-title {
            /*display: none;*/
        }

        .section5 .contenido-section5-premios {
        }

        .section5 .section5-premios {
            flex-direction: row;
            gap: 60px;
            width: 100%;
            max-width: 900px;
            align-items: start;
        }

        .section5 .section5-premios-actions {
            flex-direction: column;
            gap: 15px;
            width: 30%;
            /* align-items: end; */
            position: relative;
        }

            .section5 .section5-premios-actions > button::after {
                content: none;
            }

            .section5 .section5-premios-actions > button.active {
                background-image: url(/Content/assets/home/bg_cinta_1.webp);
                background-position: center;
                background-repeat: no-repeat;
                background-size: 100%;
                background-color: var(--color-yellow-txt--secondary);
                border-color: black;
            }

            .section5 .section5-premios-actions > button.active {
            }

            .section5 .section5-premios-actions .premios-actions-dt {
                display: flex;
                max-width: 250px;
                padding: 5px 20px;
                color: black;
                font-weight: 900;
                font-size: 16px;
                background-color: white;
                border-width: 2px 5px 5px 2px;
                border-style: solid;
                border-color: transparent;
            }

    .section5-premios-actions .premios-actions-mo {
        display: none;
    }

    .section5 .section5-premios-rankings {
        margin-top: 0;
        width: 70%;
        flex-direction: column;
        align-items: center;
    }

    .section4-ranking .contenido-ranking--dt {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        max-width: 1000px;
    }

    .section4-ranking .contenido-ranking--dt {
        display: grid;
    }

    .section4-ranking .contenido-ranking--mo {
        display: none;
    }

    .section5 .section5-premios-title > h2 {
        font-size: 45px;
        max-width: 1200px;
        padding-inline: 10px;
    }

    .section-ranking-title p {
        font-size: 20px;
    }

    .premios-rankings-accions {
        display: flex;
    }

    .section5 .section5-melvin--dt {
        display: flex;
        position: absolute;
        width: initial;
        max-width: 380px;
        bottom: -21rem;
        left: -10rem;
    }

    .section5-melvin--mo {
        display: none;
    }

    .section5 {
        padding-bottom: 10rem;
    }
}

@media(min-width: 1001px) {
    .section2-pasos {
        flex-direction: row;
        gap: 20px;
    }

    .section2 .section2-deco-gatubela {
        max-width: 350px;
        left: -30px;
        top: 0;
        /* z-index: 1; */
    }

    .registrarpro-form-title {
        left: -50px;
    }
}


@media(min-width: 1201px) {
    .section2 .section2-deco-gatubela {
        max-width: 330px;
        right: -30px;
        top: 0;
        left: initial;
        z-index: 1;
    }

    .section2 .section2-deco-img--robin {
        display: block;
        max-width: 330px;
        bottom: 0;
        right: -100px;
        z-index: 1;
        right: initial;
        left: -100px;
    }

    .registrarpro-form-title {
        left: -70px;
    }

    .section3-mo-carrucel {
        display: none;
    }

    .section3-dt-carrucel {
        display: flex;
        justify-content: center;
        gap: 50px;
        z-index: 1;
        margin-top: 40px;
    }

    .section3 .section3-mujersuper {
        max-width: 390px;
        left: -160px;
    }

    .section3-title > h2 {
        max-width: initial;
        text-shadow: none;
        -webkit-text-stroke-width: 0;
        font-size: 50px;
    }

    .section3 .section3-superman {
        max-width: 350px;
    }

    .section1-title .section1-title-text {
        flex-direction: row-reverse;
        width: 100%;
        max-width: initial;
        justify-content: center;
        margin-top: 20px;
        /* gap: 80px; */
    }

    .section1-title {
        width: 60%;
    }

    .section1-registrarpro {
        width: 40%;
    }

    .section1-title h1 > span {
        margin-left: -110px;
    }

    .section3 .section3-superman {
        /* display: block; */
        max-width: 300px;
        bottom: 0;
        right: -50px;
    }
}

@media(min-width: 1401px) {
    .section2 .section2-deco-img--robin {
        max-width: 420px;
        right: initial;
        left: -160px;
    }

    .section2 .section2-deco-gatubela {
        max-width: 380px;
        right: -100px;
    }

    .section3 .section3-mujersuper {
        z-index: 2;
        left: -120px;
    }

    .section3 .section3-superman {
        z-index: 2;
        display: block;
    }

    .section1-title .title-img-justiceleague {
        transform: translate(100px, -70px);
    }
}

