/* RESET - Prevenir scroll horizontal */
html {
    width: 100%;
    overflow-x: hidden;
}

body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    box-sizing: border-box;
}

* {
    box-sizing: border-box;
}

.container,
.container-fluid {
    max-width: 100%;
    overflow-x: hidden;
}

/* Header Fixed Enhancement */
body {
    padding-top: 60px !important;
}

    /* Header fixed */
    body > header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 1000 !important;
        box-shadow: 0 2px 10px rgba(255, 255, 255, 0.2) !important;
    }

header > div.container-fluid {
    width: 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}

.offcanvas {
    z-index: 999;
}

@media (max-width: 991px) {
    body {
        padding-top: 85px !important;
    }

        body > header {
            position: fixed !important;
            z-index: 1000 !important;
        }
}

@media (max-width: 690px) {
    body {
        padding-top: 60px !important;
    }
}
.modal {
    z-index: 1050 !important;
}

.modal-backdrop {
    z-index: 1040 !important;
}
/**

    Cookies
*/
.aviso-cookies {
    display: none;
    background: #fff;
    padding: 20px;
    width: calc(100% - 40px);
    max-width: 300px;
    line-height: 150%;
    border-radius: 10px;
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 100;
    padding-top: 60px;
    box-shadow: 0px 2px 20px 10px rgba(222,222,222,.25);
    text-align: center;
}

    .aviso-cookies.activo {
        display: block;
    }

    .aviso-cookies .galleta {
        max-width: 100px;
        position: absolute;
        top: -50px;
        left: calc(50% - 50px);
    }

    .aviso-cookies .titulo,
    .aviso-cookies .parrafo {
        margin-bottom: 15px;
    }

    .aviso-cookies .boton {
        width: 100%;
        background: #595959;
        border: none;
        color: #fff;
        font-family: 'Roboto', sans-serif;
        text-align: center;
        padding: 15px 20px;
        font-weight: 700;
        cursor: pointer;
        transition: .3s ease all;
        border-radius: 5px;
        margin-bottom: 15px;
        font-size: 14px;
    }

        .aviso-cookies .boton:hover {
            background: #000;
        }

    .aviso-cookies .enlace {
        color: #4DBFFF;
        text-decoration: none;
        font-size: 14px;
    }

        .aviso-cookies .enlace:hover {
            text-decoration: underline;
        }

.fondo-aviso-cookies {
    display: none;
    background: rgba(0,0,0,.20);
    position: fixed;
    z-index: 99;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
}

    .fondo-aviso-cookies.activo {
        display: block;
    }

.custom-br-15 {
    border-radius: 10px !important;
}

.custom-fw-600 {
    font-weight: 600 !important;
}

.custom-padding {
    padding: 4px 20px !important;
}

.bg-warning {
    background: linear-gradient(180deg, #FFCA2B 44.83%, #FFB52B 168.97%) !important;
}

.title-out-fit {
    font-family: 'Outfit' !important;
    font-weight: 600 !important;
}

button.login-button.w-25 {
    width: 15% !important;
}
/** ====HEADER== **/
#loading {
    display: none;
    background: url(/backend/images/loading2.gif) rgba(11, 55, 157, 0.715) no-repeat center center;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 9999;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}

span.asterisk {
    color: #FF4E00;
}

body {
    min-height: 100vh;
    overflow-x: hidden !important;
    background-color: rgba(8, 26, 15, 1);
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

    body > header {
        height: 60px;
        background-color: #081A0F;
    }

.btn-navbar {
    min-width: 70px !important;
    min-height: 40px;
    font-size: 1rem;
}

.neo-navbar {
    width: 100%;
}

.neo-navbar-toggler {
    display: none;
    padding: 2px 2.5px 2px 2.5px;
    background-color: rgba(8, 26, 15, 1);
    color: #FFF;
    cursor: pointer;
}

a {
    text-decoration: none;
}

#subcaptcha, .height-captcha {
    min-height: 175px !important;
}

.header-right {
    display: block;
}

    .header-right > nav > ul {
        list-style: none;
        text-align: right;
    }

        .header-right > nav > ul > li {
            display: inline;
        }

.user-box {
    text-align: right;
    margin-bottom: 42px;
}

.header-right > nav {
    margin-bottom: -20px;
}


a.signup-button {
    border-radius: 15px;
    padding: 6px 20px;
    background-color: #1976D2;
    color: #FFFFFF;
    text-decoration: none;
    font-family: Montserrat, sans-serif;
    line-height: 20px;
    font-weight: 700;
    display: inline-block;
    font-size: 16px;
}

a.forgot-link {
    color: #FFFFFF;
    font-weight: 300;
    text-decoration: underline
}

a.rules-button, div.rules-button, button.rules-button {
    border-radius: 15px;
    border: 2px solid #FFA72B;
    padding: 8px 20px;
    background: #3E3114;
    background: linear-gradient(to bottom, #3E3114 0%, #3E3114 44.555%, #90691E 100%);
    color: #FFFFFF;
    text-decoration: none;
    font-family: 'Outfit';
    line-height: 20px;
    font-weight: 700;
    display: inline-block;
    font-size: 16px;
}

a.livelines-button, div.livelines-button, button.livelines-button {
    border-radius: 15px;
    border: 2px solid #E65555;
    padding: 8px 20px;
    background: #3E3114;
    background: linear-gradient(180deg, rgba(62, 20, 20, 0.5) 44.83%, rgba(230, 85, 85, 0.5) 168.97%);
    color: #FFFFFF;
    text-decoration: none;
    font-family: 'Outfit';
    line-height: 20px;
    font-weight: 700;
    display: inline-block;
    font-size: 16px;
}

a.pph-button, div.pph-button {
    border-radius: 15px;
    border: 2px solid #8655E6;
    padding: 8px 20px;
    background: #3E3114;
    background: linear-gradient(180deg, #21143E 44.83%, #8655E6 168.97%);
    color: #FFFFFF;
    text-decoration: none;
    font-family: 'Outfit';
    line-height: 20px;
    font-weight: 700;
    display: inline-block;
    font-size: 16px;
}

a.login-button, div.login-button, button.login-button {
    border-radius: 15px;
    border: 2px solid #55E675;
    padding: 8px 20px;
    background: #3E3114;
    background: linear-gradient(180deg, #143E19 44.83%, #55E675 168.97%);
    color: #FFFFFF;
    text-decoration: none;
    font-family: 'Outfit';
    line-height: 20px;
    font-weight: 700;
    display: inline-block;
    font-size: 16px;
}

div.pick-button {
    border-radius: 25px;
    border: 2px solid rgba(255, 202, 43, 1);
    padding: 8px 20px;
    background: rgba(255, 202, 43, 1);
    color: rgba(7, 8, 83, 1);
    text-decoration: none;
    font-family: 'Bebas Neue';
    line-height: 20px;
    font-size: 20px;
    font-weight: 700;
    display: inline-block;
    font-size: 16px;
}

div.earn-button {
    border-radius: 25px;
    padding: 12px 20px;
    background: rgba(253, 189, 79, 0.4);
    color: rgba(7, 8, 83, 1);
    text-decoration: none;
    font-family: 'Bebas Neue';
    line-height: 20px;
    font-size: 20px;
    font-weight: 700;
    display: inline-block;
    font-size: 16px;
}

div.game-button {
    border-radius: 20px;
    padding: 10px 20px;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(7, 8, 83, 1);
    text-decoration: none;
    font-family: 'Bebas Neue';
    line-height: 20px;
    font-size: 20px;
    font-weight: 700;
    display: inline-block;
    font-size: 16px;
}

.header-right > nav > ul > li > a {
    border-radius: 8px 8px 0px 0px;
    padding: 12px 20px 10px 20px;
    background-color: #190056;
    color: #FFFFFF;
    margin-left: 4px;
    text-decoration: none;
    font-family: Raleway, sans-serif;
    line-height: 19.96px;
    font-weight: 700;
}

    .header-right > nav > ul > li > a.active {
        background-color: #369ECC;
    }

.list-menu a {
    color: #FFFFFF !important;
    text-decoration: none !important;
    font-family: 'Outfit' !important;
    line-height: 20px !important;
    font-weight: 700 !important;
    display: inline-block !important;
    font-size: 16px !important;
    padding: 12px 20px !important;
}
/** ====MODAL== **/
.modal-container {
    border-radius: 8px;
}

#signupModal .modal-body {
    padding-left: 2rem;
    padding-right: 2rem;
    font-family: 'Outfit';
    color: #555555;
}

.modal-body h2 {
    color: #FFFFFF;
    font-size: 36px;
    font-weight: 600;
    line-height: 40px;
    text-align: center;
    font-family: Kanit, Verdana;
}

.modal-subtitle {
    font-size: 24px;
    font-family: 'Outfit';
}

.modal-body .modal-subtitle {
    font-size: 18px;
    text-align: center;
    margin-top: 1rem;
    font-family: 'Outfit';
    font-weight: 400;
    line-height: 21.79px;
}

label {
    font-family: 'Outfit';
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    letter-spacing: 0em;
    color: white;
}

.btn-warning {
    background-color: #FF4E00;
    color: #FFF;
    border-color: #ff4800;
    font-family: Poppins;
    padding: 13px 24px 13px 24px;
    border-radius: 8px;
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
    letter-spacing: 0em;
}

    .btn-warning:hover {
        background-color: #ff4800;
        color: #FFF;
    }

    .btn-warning:disabled, fieldset:disabled .btn {
        background-color: #FF4E00;
        color: #FFF;
        border-color: #ff4800;
        opacity: .8;
    }

#registerError {
    color: maroon;
    font-size: 16px;
    font-weight: bold;
    font-family: Outfit,Verdana, Geneva, Tahoma, sans-serif;
}

#contactSubmit, #btn_submit_aff {
    width: 300px;
    margin-bottom: 3rem;
}

    #contactSubmit:disabled, #btn_submit_aff:disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

.modal-content {
    background-color: #171717;
}

.modal-dialog input, .modal-dialog select {
    height: 48px;
    padding: 5px 16px 5px 16px;
    font-family: 'Outfit';
    font-size: 16px;
    font-weight: 300;
    line-height: 22px;
    letter-spacing: 0em;
    color: #555555;
    border: solid 2px #D4D4D4;
    background-color: transparent !important;
    color: white;
}

    .modal-dialog select option {
        padding: 5px 16px 5px 16px;
        font-family: 'Outfit';
        color: #555555;
    }

    .modal-dialog input::placeholder {
        color: #666;
    }

/** ====SLIDE== **/

#carouselTop > .carousel-inner {
    border-radius: 0px;
}

#carouselTop .carousel-caption {
    width: 45%;
}

    #carouselTop .carousel-caption > h4 {
        font-family: 'Outfit';
        font-size: 30px;
        font-weight: 500;
        line-height: 40px;
        letter-spacing: 0em;
        text-align: center;
        text-transform: unset !important;
    }

    #carouselTop .carousel-caption > h3 {
        font-family: 'Bebas Neue';
        font-size: 96px;
        font-weight: 400;
        line-height: 90%;
        letter-spacing: 0em;
        text-align: center;
        margin-bottom: 1rem;
        text-transform: uppercase;
    }

    #carouselTop .carousel-caption > p {
        font-family: 'Outfit';
        font-size: 40px;
        font-weight: 400;
        line-height: 50px;
        letter-spacing: 0em;
        margin-bottom: 1rem;
    }

        #carouselTop .carousel-caption > p.h3 {
            font-family: 'Outfit';
            font-size: 35px;
            font-weight: 400;
            line-height: 22px;
            letter-spacing: 0em;
            margin-bottom: 1rem;
        }

    #carouselTop .carousel-caption > a.btn {
        font-family: 'Outfit';
        font-size: 22px;
        font-weight: 800;
        line-height: 27px;
        letter-spacing: 0.08em;
        padding: 10px 16px 10px 16px;
        border-radius: 16px;
        background-color: #FFFFFF;
    }

        #carouselTop .carousel-caption > a.btn:hover {
            border-color: #fff;
        }

.carousel-caption {
    position: absolute;
    bottom: 28%;
    left: auto;
    z-index: 2;
}

    .carousel-caption.position-right {
        right: 5%;
        bottom: 5%;
    }

    .carousel-caption.position-center {
        right: 27.50%;
        bottom: 15%;
    }

    .carousel-caption.position-left {
        left: 10%;
        bottom: 5%;
        width: 60% !important;
    }

        .carousel-caption.position-left p,
        .carousel-caption.position-left h3 {
            text-align: left !important;
        }

        .carousel-caption.position-left a {
            float: left !important;
        }

.carousel-control-next, .carousel-control-prev {
    width: 5.5%;
    z-index: 2;
    opacity: 1 !important;
}

.carousel-control-next-icon, .carousel-control-prev-icon {
    background-image: none;
}

.carousel-indicators {
    margin-right: 0px;
    margin-left: 0px;
    margin-bottom: 20px;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #070853;
    border-radius: 15px;
    width: fit-content;
    left: calc(50% - 70.5px);
}

    .carousel-indicators [data-bs-target] {
        width: 10px;
        height: 10px;
        margin-right: 5px;
        margin-left: 5px;
        border-radius: 50%;
    }

    .carousel-indicators > button.active {
        width: 11px;
        height: 11px;
        margin-right: 5px;
        margin-left: 5px;
        border-radius: 50%;
        background-color: #55E87B;
    }

.btn.orange-color {
    color: white;
    background-color: #FF4E00 !important;
}

.carousel-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #070853;
    background: linear-gradient(180deg, rgba(7, 8, 83, 0.2) 0%, rgba(85, 232, 123, 0.2) 100%);
    z-index: 1; /* Por debajo del caption pero sobre la imagen */
}

small {
    position: absolute;
    font-size: 7px;
    bottom: -10%;
    left: 0;
    width: 100%;
}
/**===BANNER==*/
section.banner {
    margin-top: 0px;
    background-color: rgba(7, 8, 83, 1);
}

    section.banner div.card {
        max-height: 150px
    }

        section.banner div.card img {
            object-fit: cover;
            object-position: top left;
            overflow: hidden;
            height: 150px;
            width: 100%;
        }

        section.banner div.card h5.card-title {
            font-family: Montserrat;
            font-size: 32px;
            font-weight: 800;
            line-height: 30px;
            letter-spacing: 0em;
            color: #190056;
        }

    section.banner div.card-body > p {
        font-family: Montserrat;
        font-size: 18px;
        font-weight: 400;
        line-height: 22px;
        letter-spacing: 0em;
        color: #190056;
    }

section.tri-bundle-banner {
    margin-top: 0px;
    min-height: 292px;
    background-image: url(./images/LuckyQuads/bgdeskcard1.png);
    background-size: cover; /* Cubre todo el div sin deformar (puede recortar) */
    background-position: center; /* Centra la imagen */
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
}

.bg-numbers {
    min-height: 172px;
    background-image: url(./images/LuckyQuads/numbers.svg);
    background-size: 60% 200%; /* Cubre todo el div sin deformar (puede recortar) */
    background-position: left center; /* Centra la imagen */
    background-repeat: no-repeat;
}

.bg-numbers1 {
    min-height: 232px;
    background-image: url(./images/LuckyQuads/numbers2.png);
    background-size: 60% 120%; /* Cubre todo el div sin deformar (puede recortar) */
    background-position: left center; /* Centra la imagen */
    background-repeat: no-repeat;
}

section.referral-banner {
    margin-top: 1rem;
}

    section.referral-banner div.card,
    section.tri-bundle-banner div.card {
        max-height: auto;
        border-radius: 0px;
        border: 0px;
        background-color: transparent;
    }

        section.referral-banner div.card img {
            object-fit: cover;
            object-position: top left;
            overflow: hidden;
            height: auto;
            min-height: 351px;
            width: 100%;
        }

        section.referral-banner div.card h5.card-title,
        section.tri-bundle-banner div.card h5.card-title,
        .title-cards {
            font-family: 'Bebas Neue';
            font-size: 48px;
            font-weight: 400;
            line-height: 100%;
            letter-spacing: 0em;
            color: #190056;
            text-transform: uppercase;
            margin-bottom: 0px;
        }

    section.referral-banner div.card-body > p,
    section.tri-bundle-banner div.card-body > p {
        font-family: 'Outfit';
        font-size: 24px;
        font-weight: 400;
        line-height: 25px;
        letter-spacing: 0em;
        color: #190056;
        text-transform: uppercase;
    }

.bg-orange {
    border-radius: 20px;
    border: 5px solid #C04646;
}

.bg-info-light {
    border-radius: 20px;
    border: 5px solid #58ADFF;
}

.badge {
    padding: 0.45em 0.85em 0.45em 0.85em;
    border-radius: 10px;
    font-family: 'Outfit'
}

.bg-orange-dark {
    background-color: #FF6600 !important;
    border-radius: 8px;
}

.bg-blue-dark-1 {
    background-color: #034089;
    border-radius: 8px;
}

.bg-blue {
    background-color: #9AC9E5 !important;
    border-radius: 8px;
}

.bg-blue-light {
    background-color: #359ECD !important;
    border-radius: 8px;
}

.bg-green {
    border-radius: 20px;
    border: 5px solid #46C061;
}

.bg-green-dark {
    background-color: #206D43 !important;
    border-radius: 8px;
}

.bg-green-dark-1 {
    background-color: #38AF47 !important;
    border-radius: 8px;
}

.bg-green-light {
    background-color: #83C73E !important;
    border-radius: 8px;
}

.bg-green-light-1 {
    background-color: #51B734 !important;
    border-radius: 8px;
}

.bg-green-light-2 {
    background-color: #68C243 !important;
    border-radius: 8px;
}

.bg-yellow {
    border-radius: 20px;
    border: 5px solid #FFA72B;
}

.bg-purple {
    border-radius: 20px;
    border: 5px solid #685CFF;
}



.bl-blue-dark {
    background-color: #034089;
}

.text-color-green {
    color: #55E675 !important;
}
/* #9AC9E5 #359ECD blue light*/
/* #FFBB00  yellow */
/* #034089 blue dark */
/* #190056 purple*/
/* #FF4E00 #FF6600 orange dark */
/* #00844D #206D43 #38AF47 green dark */
/* #83C73E, #51B734, #68C243 green light*/
.blue-light-linear-gradient {
    background-image: linear-gradient(to right, #9AC9E5, #359ECD);
}

.green-light-linear-gradient {
    background-image: linear-gradient(to right, #68C243, #38AF47)
}

.green-dark-bg {
    background: rgba(8, 26, 15, 1);
}

.purple-linear-gradient {
    background-image: linear-gradient(to right, #190056, #FF6600)
}

.yellow-linear-gradient {
    background: #EE7621;
    background: linear-gradient(to bottom, #EE7621 0%, #EE7621 64.555%, #E3B322 100%);
}

.text-blue {
    color: #190056 !important;
}

.text-blue-dark {
    color: rgba(7, 8, 83, 1);
}

.text-blue-light {
    color: #369ECC !important;
}

.text-green {
    color: #55E87B !important;
}

.text-orange {
    color: #FF4E00 !important;
}

.text-title {
    font-family: Montserrat;
    font-size: 36px;
    font-weight: 800;
    line-height: 50px;
    letter-spacing: 0em;
    text-align: center;
    border-bottom: solid 1px #369ECC;
}

.text-content {
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 800;
    line-height: 22px;
    letter-spacing: 0em;
    text-align: center;
}

.border-8 {
    border-radius: 8px
}

.title-text-green {
    color: rgba(85, 232, 123, 1);
}

.title-text-yellow {
    color: rgba(255, 202, 43, 1);
}

/** ====CARD== **/
.card-section {
    background-color: rgba(7, 8, 83, 1);
}

    .card-section .card {
        border: 2px solid rgba(255,255,255,0.2);
        border-radius: 15px;
    }

        .card-section .card .card-img-top {
            border-top-left-radius: 15px;
            border-top-right-radius: 15px;
            max-height: 490px;
            object-fit: cover;
        }

.custom-bg-blue {
    background: #21143E;
    background: linear-gradient(180deg, #21143E 44.83%, #070853 168.97%) !important;
}

.desc-text-card {
    font-family: Outfit;
    font-weight: 400;
    font-size: 20px;
    line-height: 140%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
}

ul.desc-text-card li {
    text-align: left;
}

.card-section > .container > .row {
    padding-left: 10px;
    padding-right: 10px;
}

    .card-section > .container > .row > .card {
        text-align: center;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #EEEEEE 100%);
        box-shadow: 2px 8px 8px 0px #00000040;
        border: 4px solid #FFFFFF;
        border-radius: 8px;
        width: 32%;
        padding: 0;
    }

.card-mini-section > .container > .row > div > .card {
    border-radius: 8px;
    /*width: 32%;*/
    background-color: #EEEEEE;
    margin: 20px 0;
    border: none;
    text-align: center;
    color: #190056;
    font-size: 18px;
    font-weight: 400;
    line-height: 27px;
}

.card-section > .container > .row > .card > div.card-img-top > img {
    width: 200px;
    height: 200px;
    margin: 0 auto;
    margin-bottom: 10px;
}

.card-section > .container > .row > .card.pick3 > div.card-img-top {
    background: linear-gradient(180deg, #FF7B00 0%, #FFBB00 100%);
}

.card-section > .container > .row > .card.pick4 > div.card-img-top {
    background: linear-gradient(180deg, #4FA319 0%, #82C73D 100%);
}

.card-section > .container > .row > .card.pick5 > div.card-img-top {
    background: linear-gradient(180deg, #00B68D 0%, #369ECC 100%);
}

.card-section > .container > .row > .card > div.card-body > h5 {
    font-family: Montserrat;
    font-size: 36px;
    font-weight: 800;
    line-height: 44px;
    letter-spacing: 0em;
    border-bottom: solid 1px #369ECC;
    text-transform: uppercase;
}

.card-mini-section > .container > .row > div > .card > div.card-body > h5 {
    font-family: 'Outfit';
    font-size: 28px;
    font-weight: 800;
    line-height: 38px;
    letter-spacing: 0em;
    text-align: center;
}

.card-section > .container > .row > div > .card.pick2 > div.card-body > h5,
.card-section > .container > .row > .card.pick2 > div.card-body > h5,
.card-mini-section > .container > .row > div > .card.pick2 > div.card-body > h5 {
    color: #675DFA;
}

.card-section > .container > .row > div > .card.pick3 > div.card-body > h5,
.card-section > .container > .row > .card.pick3 > div.card-body > h5,
.card-mini-section > .container > .row > div > .card.pick3 > div.card-body > h5 {
    color: #4FA319;
}

.card-section > .container > .row > div > .card.pick4 > div.card-body > h5,
.card-section > .container > .row > .card.pick4 > div.card-body > h5,
.card-mini-section > .container > .row > div > .card.pick4 > div.card-body > h5 {
    color: #FF4E00;
}

.card-section > .container > .row > div > .card.pick5 > div.card-body > h5,
.card-section > .container > .row > .card.pick5 > div.card-body > h5,
.card-mini-section > .container > .row > div > .card.pick5 > div.card-body > h5 {
    color: #076C9E;
}

.card-section > .container > .row > .card > div.card-body > p {
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 800;
    line-height: 22px;
    letter-spacing: 0em;
    color: #190056;
}

.card > div.card-body > a.btn, .card > div.card-body p.card-text > a.btn {
    padding: 10px 16px 10px 16px;
    border-radius: 16px;
    gap: 10px;
    background-color: #FF7B00;
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 800;
    line-height: 22px;
    letter-spacing: 0.08em;
    color: #000;
}
/**
*Formulario de login, ver contase�a
*/
.toggle-visible {
    position: absolute;
    right: 3%;
    top: 45%;
    height: 2.5em;
    width: 2.5em;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='15' viewBox='0 0 24 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_420_4147)'%3E%3Cpath d='M12.0458 14.8216C5.32922 14.8216 0.579506 9.33018 0.579506 7.62504C0.579506 5.91075 5.30294 0.428467 12.0435 0.428467C16.8298 0.428467 23.4995 5.91075 23.4995 7.62504C23.4995 9.33018 16.8378 14.8216 12.0435 14.8216H12.0458ZM12.0458 12.3039C14.6435 12.3039 16.7315 10.169 16.7315 7.62504C16.7335 7.0099 16.6135 6.40047 16.3785 5.83198C16.1436 5.26348 15.7982 4.7472 15.3625 4.31297C14.9268 3.87875 14.4093 3.53519 13.8401 3.30216C13.2708 3.06913 12.6609 2.95124 12.0458 2.95532C9.42865 2.95532 7.33951 5.00904 7.34865 7.62504C7.35779 10.169 9.42865 12.3039 12.0458 12.3039ZM12.0458 9.33018C11.5916 9.33021 11.1558 9.15122 10.8327 8.83203C10.5097 8.51283 10.3255 8.07915 10.3201 7.62504C10.3201 6.6879 11.0972 5.91075 12.0435 5.91075C12.9806 5.91075 13.7669 6.6879 13.7669 7.62504C13.7669 8.55304 12.9806 9.33018 12.0435 9.33018H12.0458Z' fill='%2355E675'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_420_4147'%3E%3Crect width='24' height='14.8571' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
}

input[type="text"] ~ .toggle-visible {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 7C14.76 7 17 9.24 17 12C17 12.65 16.87 13.26 16.64 13.83L19.56 16.75C21.07 15.49 22.26 13.86 22.99 12C21.26 7.61 16.99 4.5 11.99 4.5C10.59 4.5 9.25 4.75 8.01 5.2L10.17 7.36C10.74 7.13 11.35 7 12 7V7ZM2 4.27L4.28 6.55L4.74 7.01C3.08 8.3 1.78 10.02 1 12C2.73 16.39 7 19.5 12 19.5C13.55 19.5 15.03 19.2 16.38 18.66L16.8 19.08L19.73 22L21 20.73L3.27 3L2 4.27ZM7.53 9.8L9.08 11.35C9.03 11.56 9 11.78 9 12C9 13.66 10.34 15 12 15C12.22 15 12.44 14.97 12.65 14.92L14.2 16.47C13.53 16.8 12.79 17 12 17C9.24 17 7 14.76 7 12C7 11.21 7.2 10.47 7.53 9.8V9.8ZM11.84 9.02L14.99 12.17L15.01 12.01C15.01 10.35 13.67 9.01 12.01 9.01L11.84 9.02Z' fill='%2355E675'/%3E%3C/svg%3E%0A") !important;
}
/** ====FOOTER=== **/
.history-section {
    width: 100%;
    min-height: 178px;
    gap: 40px;
    background-color: #FF9900;
}

.lotto-img {
    width: 100%;
    height: 178px;
    background-image: url(./images/lotto_schedules.png);
    background-size: cover;
    background-position: center;
}

.history-right {
    text-align: center;
    padding: 20px;
}

    .history-right > h5 {
        font-family: Montserrat;
        font-size: 32px;
        font-weight: 800;
        line-height: 39px;
        letter-spacing: 0em;
        color: #190056;
    }

.history-button, .history-button:hover {
    padding: 12px 20px 12px 20px;
    border-radius: 8px;
    gap: 10px;
    background-color: #190056;
    font-family: Raleway;
    font-size: 18px;
    font-weight: 700;
    line-height: 21px;
    color: #FFFFFF;
}

footer {
    text-align: center;
    width: 100%;
    background-color: rgba(8, 26, 15, 1);
    padding: 16px 0 16px 0;
    color: #FFFFFF;
    font-family: Montserrat;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0em;
}

/***ARTICLE****/
ol.breadcrumb {
    font-family: 'Outfit';
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    padding: 8px 0;
    color: #55E87B !important
}

    ol.breadcrumb > li > a {
        text-decoration: none;
        color: #55E87B !important
    }

    ol.breadcrumb > li.active > a {
        color: #fff !important
    }

.breadcrumb-item.active {
    color: #fff !important
}

.breadcrumb-item + .breadcrumb-item::before {
    content: '>';
    color: #fff !important
}

h1.title {
    font-family: Kanit;
    font-size: 40px;
    font-weight: 700;
    line-height: 44px;
    color: #034089;
    margin-top: 10px;
    margin-bottom: 45px;
}

h3.title {
    font-family: 'Outfit';
    font-size: 30px;
    font-weight: 700;
    line-height: 44px;
    color: white;
    margin-top: 40px;
    text-transform: uppercase;
}

div.info-card p.text-white {
    font-family: Outfit;
    font-weight: 400;
    font-size: 18px;
    line-height: 140%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
}

article {
    margin: 15px 0;
}

    article > p, article ul li {
        font-family: 'Outfit';
        font-size: 16px;
        font-weight: 400;
        line-height: 22px;
        color: #fff;
    }
/***RULES & DRAWING-SCHEDULE****/
.table-section {
}

    .table-section > .container > table {
        display: inline-table;
    }

    .table-section .table > * > :not(.table-header-pick-columns) > * {
        color: #190056;
    }

    .table-section > .container > h2,
    .table-pick-section > .container > h2 {
        color: #076C9E;
        font-family: Kanit;
        font-size: 36px;
        font-weight: 600;
        line-height: 40px;
        margin-bottom: 30px;
    }

    .table-section > .container > h3,
    .table-pick-section > .container > h3 {
        color: #0994d8;
        font-family: Kanit;
        font-weight: 600;
        line-height: 40px;
    }

.table-header-pick-columns > th:first-child {
    padding-left: 20px;
}

.table-header-pick-columns > th {
    /*background-color: #076C9E;*/
    font-family: 'Outfit';
    font-size: 22px;
    font-weight: 600;
    line-height: 27px;
    color: #FFFFFF;
}

table.table-pick {
    border-collapse: collapse;
    border-radius: 20px; /* Esto solo no hará nada */
}

    /* Redondear esquinas superiores */
    table.table-pick tr:first-child th:first-child {
        border-top-left-radius: 20px;
    }

    table.table-pick tr:first-child th:last-child {
        border-top-right-radius: 20px;
    }

    /* Redondear esquinas inferiores */
    table.table-pick tr:last-child td:first-child {
        border-bottom-left-radius: 20px;
    }

    table.table-pick tr:last-child td:last-child {
        border-bottom-right-radius: 20px;
    }

    table.table-pick tr.table-header-pick > th {
        background-color: rgba(70, 192, 97, 1);
    }


.table-header-pick > th > h3 {
    float: left;
    margin-top: 15px;
    margin-left: 15px;
    font-family: Kanit;
    font-size: 36px;
    font-weight: 600;
    line-height: 40px;
}

.table-header-pick > th > img {
    float: right;
}

#table-section-mobile, #table-section-mobile-1, #table-section-mobile-2 {
    display: none;
}

    #table-section-mobile tr:nth-child(odd), #table-section-mobile-1 tr:nth-child(odd), #table-section-mobile-2 tr:nth-child(odd) {
        background-color: #EEEEEE;
    }

        #table-section-mobile tr:nth-child(odd) ul, #table-section-mobile-1 tr:nth-child(odd) ul, #table-section-mobile-2 tr:nth-child(odd) ul {
            background-color: #EEEEEE;
        }

    #table-section-mobile td > ul, #table-section-mobile-1 td > ul, #table-section-mobile-2 td > ul {
        margin-bottom: 2px;
        list-style: none;
    }

        #table-section-mobile td > ul > li, #table-section-mobile-1 td > ul > li, #table-section-mobile-2 td > ul > li {
            margin-bottom: 8px;
        }

.table-pick-section td {
    padding: 0;
    margin-left: 0;
    margin-right: 0;
    order: none;
}

    .table-pick-section td > div {
        background-color: #EEEEEE;
    }

        .table-pick-section td > div > ul {
            list-style: none;
            padding: 10px;
        }

.table-pick3 > tbody > tr:nth-of-type(even) > *, .table-pick4 > tbody > tr:nth-of-type(even) > *, .table-pick5 > tbody > tr:nth-of-type(even) > * {
    background-color: #EEEEEE !important;
}

.table-pick3 > tbody > tr:nth-of-type(odd) > *, .table-pick4 > tbody > tr:nth-of-type(odd) > *, .table-pick5 > tbody > tr:nth-of-type(odd) > * {
    background-color: #FFF !important;
}
/***STEPPER****/
.stepper-section {
    margin-bottom: 1.5rem;
}

#how-to-play-stepper > div {
    padding: 1.2rem .8rem;
}

    #how-to-play-stepper > div > .step {
        background-color: #EEEEEE;
        padding: 20px;
        border-radius: 8px;
        gap: 20px
    }

.step-number-orange {
    background-color: #FF4E00;
}

.step-number-lightblue {
    background: #369ECC;
}

.step-number-blue {
    background: #034089;
}

.step-number-green {
    background-color: #4FA319;
}

#how-to-play-stepper > div > .step > .step-number {
    padding: 8px 16px 8px 16px;
    border-radius: 40px;
    font-family: Kanit;
    font-size: 36px;
    font-weight: 700;
    line-height: 40px;
    letter-spacing: 0em;
    text-align: center;
    color: #FFF;
    margin: 0 auto;
    margin-bottom: 15px;
    width: 56px;
    height: 56px;
}

#how-to-play-stepper > div > .step > .step-title {
    font-family: Kanit;
    font-size: 30px;
    font-weight: 400;
    line-height: 30px;
    color: #034089;
    text-transform: uppercase;
    min-height: 60px;
}

#how-to-play-stepper > div > .step > .step-new-content {
    font-family: 'Outfit';
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    color: #444444;
}

div.ratio {
    min-height: 200px !important;
    min-width: 270px !important;
    max-height: 200px !important;
}

.card-btn-login {
    width: 50% !important;
}
/**
        Sidebar
    */
.btn-close {
    color: #fff !important;
    font-size: large;
    font-weight: 700;
    --bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFF'%3e%3cpath d='M0.293 0.293a1 1 0 0 1 1.414 0L8 6.586 14.293 0.293a1 1 0 0 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 0.293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") !important;
}

.offcanvas-body ul {
    list-style-type: none;
    margin-top: 0px;
}

    .offcanvas-body ul li {
        text-align: center;
        padding: 15px 20px;
    }

        .offcanvas-body ul li a {
            color: white !important;
            text-decoration: none;
            line-height: 0px;
        }

        .offcanvas-body ul li:hover {
            background-color: #369ECC !important;
        }
/**
        contact
    */
.border-green {
    border-bottom: solid 4px rgba(70, 192, 97, 1);
    border-radius: 20px;
    background-image: url(./images/LuckyQuads/contact/bgPhone.svg);
    background-size: cover;
    background-position: top left;
    background-repeat: no-repeat;
}

.border-orange {
    border-bottom: solid 4px rgba(255, 167, 43, 1);
    border-radius: 20px;
    background-image: url(./images/LuckyQuads/contact/bgEmail.svg);
    background-size: cover;
    background-position: top left;
    background-repeat: no-repeat;
}

.border-blue {
    border-bottom: solid 4px rgba(104, 92, 255, 1);
    border-radius: 20px;
    background-image: url(./images/LuckyQuads/contact/bgSocial.svg);
    background-size: cover;
    background-position: top left;
    background-repeat: no-repeat;
}

.title-contact-card {
    font-family: 'Outfit';
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 0em;
    text-align: left;
    color: white;
}

.custom-alert {
    border-radius: 20px !important;
    border-color: rgba(85, 232, 123, 1);
    background-color: rgba(255, 255, 255, 1) !important;
}

.bonuses-section {
    display: flex;
    flex-direction: column;
    min-height: 85vh;
}
/**
   Banking
*/
.text-banking {
    font-family: 'Outfit';
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 0em;
    text-align: left;
    color: #190056;
}
/**
 Icons
*/
.bs-stepper-content {
    min-height: 57vh;
}

.color-coin {
    color: #190056;
}

.icon {
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    display: inline-block;
    height: 32px;
    width: 32px;
    object-fit: contain;
}

.icon-big {
    transform: scale(1.75);
}

.icon-btc {
    background-image: url("images/icons/pay/bitcoin.svg");
}

.icon-eth {
    background-image: url("images/icons/pay/ethereum.svg");
}

.icon-ltc {
    background-image: url("images/icons/pay/litecoin.svg");
}

.icon-dog {
    background-image: url("images/icons/pay/dogecoin.svg");
}

.icon-usd {
    background-image: url("images/icons/pay/usdcoin.svg");
}

.icon-ptp {
    background-image: url("images/icons/pay/personal.svg");
}

.icon-visa {
    background-image: url("images/icons/pay/visa.svg");
}

.icon-mc {
    background-image: url("images/icons/pay/mastercard.svg");
}

.icon-dn {
    background-image: url("images/icons/pay/discover.svg");
}

.icon-ae {
    background-image: url("images/icons/pay/amex.svg");
}

.icon-bank {
    background-image: url("images/icons/pay/check.svg");
}

.icon-social-twitter {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M27.265 26.195L19.64 14.22L27.105 6.00875C27.367 5.71348 27.502 5.32687 27.4808 4.93273C27.4595 4.53859 27.2838 4.16869 26.9917 3.90323C26.6996 3.63777 26.3147 3.49814 25.9203 3.51462C25.5259 3.53109 25.154 3.70235 24.885 3.99125L17.9763 11.5962L13.265 4.195C13.1296 3.98212 12.9427 3.80683 12.7216 3.68535C12.5005 3.56386 12.2523 3.50012 12 3.5H6.00001C5.73131 3.50012 5.46757 3.57242 5.23637 3.70934C5.00517 3.84626 4.81499 4.04277 4.68572 4.27833C4.55644 4.51389 4.49281 4.77985 4.50148 5.04841C4.51016 5.31697 4.59081 5.57827 4.73501 5.805L12.36 17.78L4.89001 25.9912C4.75476 26.1365 4.64969 26.3072 4.58089 26.4934C4.5121 26.6796 4.48094 26.8776 4.48922 27.0759C4.49751 27.2742 4.54508 27.469 4.62916 27.6488C4.71325 27.8286 4.83219 27.9899 4.97909 28.1234C5.12599 28.2569 5.29792 28.3599 5.48493 28.4265C5.67193 28.493 5.87029 28.5218 6.0685 28.5111C6.26671 28.5005 6.46083 28.4506 6.63961 28.3643C6.81839 28.2781 6.97828 28.1572 7.11001 28.0088L14.0238 20.4037L18.735 27.805C18.8704 28.0179 19.0573 28.1932 19.2784 28.3147C19.4995 28.4361 19.7477 28.4999 20 28.5H26C26.2687 28.4999 26.5324 28.4276 26.7636 28.2907C26.9949 28.1537 27.185 27.9572 27.3143 27.7217C27.4436 27.4861 27.5072 27.2202 27.4985 26.9516C27.4899 26.683 27.4092 26.4217 27.265 26.195ZM20.8238 25.5L8.73251 6.5H11.1763L23.2675 25.5H20.8238Z' fill='%23FFFFFF'/%3E%3C/svg%3E");
}

.icon-social-facebook {
    background-image: url("data:image/svg+xml,%3Csvg width='27' height='27' viewBox='0 0 27 27' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.5 0C10.83 0 8.21987 0.791761 5.99981 2.27516C3.77974 3.75856 2.04942 5.86697 1.02763 8.33377C0.00584936 10.8006 -0.261496 13.515 0.259405 16.1337C0.780305 18.7525 2.06606 21.1579 3.95406 23.0459C5.84207 24.934 8.24754 26.2197 10.8663 26.7406C13.485 27.2615 16.1994 26.9942 18.6662 25.9724C21.133 24.9506 23.2414 23.2203 24.7248 21.0002C26.2082 18.7801 27 16.17 27 13.5C26.996 9.9208 25.5724 6.48932 23.0416 3.95844C20.5107 1.42756 17.0792 0.00397028 13.5 0ZM15 23.8913V17H17.5C17.8978 17 18.2794 16.842 18.5607 16.5607C18.842 16.2794 19 15.8978 19 15.5C19 15.1022 18.842 14.7206 18.5607 14.4393C18.2794 14.158 17.8978 14 17.5 14H15V11.5C15 11.1022 15.158 10.7206 15.4393 10.4393C15.7207 10.158 16.1022 10 16.5 10H18.5C18.8978 10 19.2794 9.84196 19.5607 9.56066C19.842 9.27936 20 8.89782 20 8.5C20 8.10218 19.842 7.72064 19.5607 7.43934C19.2794 7.15804 18.8978 7 18.5 7H16.5C15.3065 7 14.1619 7.47411 13.318 8.31802C12.4741 9.16193 12 10.3065 12 11.5V14H9.50001C9.10218 14 8.72065 14.158 8.43935 14.4393C8.15804 14.7206 8.00001 15.1022 8.00001 15.5C8.00001 15.8978 8.15804 16.2794 8.43935 16.5607C8.72065 16.842 9.10218 17 9.50001 17H12V23.8913C9.37262 23.512 6.9864 22.1517 5.32156 20.084C3.65673 18.0163 2.83686 15.3948 3.02696 12.747C3.21707 10.0992 4.40303 7.62171 6.34617 5.81307C8.28931 4.00444 10.8454 2.99895 13.5 2.99895C16.1546 2.99895 18.7107 4.00444 20.6538 5.81307C22.597 7.62171 23.7829 10.0992 23.973 12.747C24.1632 15.3948 23.3433 18.0163 21.6784 20.084C20.0136 22.1517 17.6274 23.512 15 23.8913Z' fill='%23FFFFFF'/%3E%3C/svg%3E");
}

.icon-social-facebook-2 {
    background-image: url("data:image/svg+xml,%3Csvg fill='%23034089' height='24px' width='24px' version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 310 310' xml:space='preserve'%3E%3Cg id='XMLID_834_'%3E%3Cpath id='XMLID_835_' d='M81.703,165.106h33.981V305c0,2.762,2.238,5,5,5h57.616c2.762,0,5-2.238,5-5V165.765h39.064 c2.54,0,4.677-1.906,4.967-4.429l5.933-51.502c0.163-1.417-0.286-2.836-1.234-3.899c-0.949-1.064-2.307-1.673-3.732-1.673h-44.996 V71.978c0-9.732,5.24-14.667,15.576-14.667c1.473,0,29.42,0,29.42,0c2.762,0,5-2.239,5-5V5.037c0-2.762-2.238-5-5-5h-40.545 C187.467,0.023,186.832,0,185.896,0c-7.035,0-31.488,1.381-50.804,19.151c-21.402,19.692-18.427,43.27-17.716,47.358v37.752H81.703 c-2.762,0-5,2.238-5,5v50.844C76.703,162.867,78.941,165.106,81.703,165.106z'/%3E%3C/g%3E%3C/svg%3E");
}

.icon-social-youtube {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.3113 14.7388L14.3112 10.2388C14.0847 10.0931 13.8231 10.0111 13.5539 10.0014C13.2847 9.99174 13.0179 10.0547 12.7815 10.1837C12.545 10.3128 12.3477 10.5031 12.2102 10.7347C12.0727 10.9663 12.0001 11.2306 12 11.5V20.5C12.0001 20.7694 12.0727 21.0337 12.2102 21.2653C12.3477 21.4969 12.545 21.6872 12.7815 21.8163C13.0179 21.9453 13.2847 22.0083 13.5539 21.9986C13.8231 21.9889 14.0847 21.9069 14.3112 21.7613L21.3113 17.2613C21.5223 17.1254 21.6959 16.9387 21.8161 16.7184C21.9363 16.498 21.9993 16.251 21.9993 16C21.9993 15.749 21.9363 15.502 21.8161 15.2816C21.6959 15.0613 21.5223 14.8746 21.3113 14.7388ZM15 17.75V14.25L17.7262 16L15 17.75ZM29.7763 8.5625C29.6382 8.02462 29.3743 7.52723 29.0064 7.11127C28.6385 6.69532 28.177 6.37271 27.66 6.17C23.3 4.48875 16.4113 4.5 16 4.5C15.5887 4.5 8.7 4.48875 4.34 6.1725C3.823 6.37521 3.36154 6.69782 2.99361 7.11377C2.62569 7.52973 2.36183 8.02712 2.22375 8.565C1.89375 9.84 1.5 12.165 1.5 16C1.5 19.835 1.89375 22.16 2.22375 23.435C2.36183 23.9729 2.62569 24.4703 2.99361 24.8862C3.36154 25.3022 3.823 25.6248 4.34 25.8275C8.52625 27.4438 15.045 27.5 15.9213 27.5H16.0788C16.9538 27.5 23.4737 27.4438 27.66 25.8275C28.177 25.6248 28.6385 25.3022 29.0064 24.8862C29.3743 24.4703 29.6382 23.9729 29.7763 23.435C30.1063 22.16 30.5 19.835 30.5 16C30.5 12.165 30.1063 9.84 29.7763 8.565V8.5625ZM26.875 22.6825C26.857 22.7592 26.8211 22.8305 26.7702 22.8907C26.7194 22.9508 26.6551 22.9982 26.5825 23.0288C22.8475 24.47 16.5338 24.5 16.04 24.5H15.9913C15.925 24.5 9.28625 24.5213 5.42125 23.0288C5.34797 22.9986 5.28289 22.9515 5.23139 22.8913C5.17988 22.8311 5.14342 22.7596 5.125 22.6825C4.89 21.7775 4.5 19.705 4.5 16C4.5 12.295 4.89375 10.2225 5.125 9.3175C5.14304 9.24083 5.17893 9.1695 5.22976 9.10933C5.28059 9.04916 5.34492 9.00185 5.4175 8.97125C9.28625 7.47875 15.9237 7.5 15.99 7.5H16.0088C16.0763 7.5 22.7138 7.47875 26.5788 8.97125C26.652 9.00137 26.7171 9.04847 26.7686 9.10867C26.8201 9.16887 26.8566 9.24044 26.875 9.3175C27.11 10.2225 27.5 12.295 27.5 16C27.5 19.705 27.1063 21.7775 26.875 22.6825Z' fill='%23FFFFFF'/%3E%3C/svg%3E");
}

.icon-social-instagram {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 10C14.8133 10 13.6533 10.3519 12.6666 11.0112C11.6799 11.6705 10.9108 12.6075 10.4567 13.7039C10.0026 14.8003 9.88378 16.0067 10.1153 17.1705C10.3468 18.3344 10.9182 19.4035 11.7574 20.2426C12.5965 21.0818 13.6656 21.6532 14.8295 21.8847C15.9933 22.1162 17.1997 21.9974 18.2961 21.5433C19.3925 21.0892 20.3295 20.3201 20.9888 19.3334C21.6481 18.3467 22 17.1867 22 16C21.9983 14.4092 21.3657 12.884 20.2408 11.7592C19.116 10.6343 17.5908 10.0017 16 10ZM16 19C15.4067 19 14.8266 18.8241 14.3333 18.4944C13.8399 18.1648 13.4554 17.6962 13.2284 17.1481C13.0013 16.5999 12.9419 15.9967 13.0576 15.4147C13.1734 14.8328 13.4591 14.2982 13.8787 13.8787C14.2982 13.4591 14.8328 13.1734 15.4147 13.0576C15.9967 12.9419 16.5999 13.0013 17.1481 13.2284C17.6962 13.4554 18.1648 13.8399 18.4944 14.3333C18.8241 14.8266 19 15.4067 19 16C19 16.7956 18.6839 17.5587 18.1213 18.1213C17.5587 18.6839 16.7956 19 16 19ZM22 2.5H10C8.01159 2.50232 6.10528 3.29324 4.69926 4.69926C3.29324 6.10528 2.50232 8.01159 2.5 10V22C2.50232 23.9884 3.29324 25.8947 4.69926 27.3007C6.10528 28.7068 8.01159 29.4977 10 29.5H22C23.9884 29.4977 25.8947 28.7068 27.3007 27.3007C28.7068 25.8947 29.4977 23.9884 29.5 22V10C29.4977 8.01159 28.7068 6.10528 27.3007 4.69926C25.8947 3.29324 23.9884 2.50232 22 2.5ZM26.5 22C26.5 23.1935 26.0259 24.3381 25.182 25.182C24.3381 26.0259 23.1935 26.5 22 26.5H10C8.80653 26.5 7.66193 26.0259 6.81802 25.182C5.97411 24.3381 5.5 23.1935 5.5 22V10C5.5 8.80653 5.97411 7.66193 6.81802 6.81802C7.66193 5.97411 8.80653 5.5 10 5.5H22C23.1935 5.5 24.3381 5.97411 25.182 6.81802C26.0259 7.66193 26.5 8.80653 26.5 10V22ZM24.5 9.5C24.5 9.89556 24.3827 10.2822 24.1629 10.6111C23.9432 10.94 23.6308 11.1964 23.2654 11.3478C22.8999 11.4991 22.4978 11.5387 22.1098 11.4616C21.7219 11.3844 21.3655 11.1939 21.0858 10.9142C20.8061 10.6345 20.6156 10.2781 20.5384 9.89018C20.4613 9.50222 20.5009 9.10009 20.6522 8.73463C20.8036 8.36918 21.06 8.05682 21.3889 7.83706C21.7178 7.6173 22.1044 7.5 22.5 7.5C23.0304 7.5 23.5391 7.71071 23.9142 8.08579C24.2893 8.46086 24.5 8.96957 24.5 9.5Z' fill='%23FFFFFF'/%3E%3C/svg%3E");
}

.icon-social-tiktok {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M28 8.5C26.5418 8.49835 25.1438 7.91835 24.1127 6.88726C23.0816 5.85617 22.5017 4.45818 22.5 3C22.5 2.60218 22.342 2.22064 22.0607 1.93934C21.7794 1.65804 21.3978 1.5 21 1.5H16C15.6022 1.5 15.2206 1.65804 14.9393 1.93934C14.658 2.22064 14.5 2.60218 14.5 3V19.5C14.4998 19.8579 14.4035 20.2092 14.2212 20.5172C14.039 20.8252 13.7774 21.0787 13.4638 21.2512C13.1502 21.4236 12.796 21.5088 12.4383 21.4977C12.0806 21.4867 11.7324 21.3799 11.43 21.1884C11.1276 20.9969 10.8822 20.7278 10.7192 20.4091C10.5563 20.0905 10.4819 19.7339 10.5037 19.3767C10.5256 19.0194 10.6429 18.6746 10.8434 18.3781C11.0439 18.0817 11.3203 17.8445 11.6438 17.6912C11.9 17.5695 12.1165 17.3775 12.268 17.1377C12.4196 16.8979 12.5 16.62 12.5 16.3363V11C12.4999 10.7808 12.4518 10.5644 12.3591 10.3658C12.2663 10.1672 12.1312 9.9914 11.9632 9.85068C11.7952 9.70996 11.5983 9.60776 11.3866 9.55128C11.1748 9.49479 10.9533 9.4854 10.7375 9.52375C8.42717 9.94637 6.34176 11.1751 4.8525 12.9913C3.33597 14.8216 2.50418 17.123 2.5 19.5C2.5 22.1522 3.55357 24.6957 5.42893 26.5711C7.3043 28.4464 9.84784 29.5 12.5 29.5C15.1522 29.5 17.6957 28.4464 19.5711 26.5711C21.4464 24.6957 22.5 22.1522 22.5 19.5V15.3337C24.2306 16.1061 26.1049 16.5035 28 16.5C28.3978 16.5 28.7794 16.342 29.0607 16.0607C29.342 15.7794 29.5 15.3978 29.5 15V10C29.5 9.60218 29.342 9.22064 29.0607 8.93934C28.7794 8.65804 28.3978 8.5 28 8.5ZM26.5 13.3938C24.8298 13.1575 23.2424 12.5178 21.875 11.53C21.6508 11.369 21.3864 11.2729 21.1111 11.2525C20.8358 11.232 20.5602 11.2879 20.3146 11.4141C20.069 11.5402 19.863 11.7317 19.7193 11.9674C19.5756 12.2031 19.4997 12.4739 19.5 12.75V19.5C19.5 21.3565 18.7625 23.137 17.4497 24.4497C16.137 25.7625 14.3565 26.5 12.5 26.5C10.6435 26.5 8.86301 25.7625 7.55025 24.4497C6.2375 23.137 5.5 21.3565 5.5 19.5C5.50462 18.1607 5.88103 16.849 6.58729 15.711C7.29354 14.5731 8.3019 13.6536 9.5 13.055V15.5C8.81817 16.0114 8.27838 16.6885 7.93188 17.4672C7.58537 18.2459 7.44366 19.1002 7.5202 19.949C7.59674 20.7979 7.88899 21.6131 8.3692 22.3172C8.8494 23.0213 9.50163 23.591 10.2639 23.9721C11.0262 24.3533 11.8733 24.5333 12.7247 24.4949C13.5762 24.4566 14.4037 24.2013 15.1287 23.7533C15.8537 23.3052 16.4521 22.6792 16.8671 21.9348C17.2821 21.1904 17.5 20.3523 17.5 19.5V4.5H19.6325C19.9423 6.20758 20.7657 7.77998 21.9929 9.00713C23.22 10.2343 24.7924 11.0577 26.5 11.3675V13.3938Z' fill='%23FFFFFF'/%3E%3C/svg%3E");
}

ul.notice-import {
    list-style-type: disc;
}

    ul.notice-import li {
        font-family: 'Outfit';
        font-size: 16px;
        font-weight: 400;
        line-height: 22px;
        letter-spacing: 0em;
        text-align: left;
        color: #190056;
    }

.bonuses-text {
    font-family: 'Outfit';
    font-size: 20px;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0em;
    text-align: center;
}

.info-card {
    min-height: 290px;
}

.info-card-contact {
    min-height: 210px;
}

.table-header-pick,
.card-bonus6 .card-header,
.card-bonus7 .card-header {
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgb(2,0,36) 0%, rgb(9,9,121) 35%, rgb(0,212,255) 100%);
    border: none;
}
    /* Estilos del texto del encabezado */
    .table-header-pick h3,
    .card-bonus6 .card-header h3,
    .card-bonus7 .card-header h3 {
        color: #fff !important;
        font-size: 1.2rem;
        font-weight: 600;
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        display: inline-block;
    }
    /* Estilo del badge */
    .table-header-pick .badge {
        margin-left: 0.75rem;
        padding: 0.35rem 0.7rem;
        font-size: 0.8rem;
        font-weight: 500;
        background: #ffc107;
        color: #000;
        border-radius: 4px;
        vertical-align: middle;
    }
/* Encabezados de columnas */
.table-header-pick-columns {
    background: transparent;
}

    .table-header-pick-columns th {
        padding: 0.75rem 1rem;
        color: rgba(23, 23, 23, 1);
        font-weight: 400;
        font-size: 0.95rem;
        border-bottom: 1px solid #eff2f5;
    }
/* Cuerpo de la tabla */
.table tbody tr td {
    padding: 0.75rem 1rem;
    color: #181c32;
    vertical-align: middle;
    border-bottom: 1px solid #eff2f5;
}

.table tbody tr:last-child td {
    border-bottom: none;
}
/* Footer de tabla */
.table tfoot td {
    padding: 1rem;
    background: #f8f9fa;
}

.table tfoot ul {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

    .table tfoot ul li {
        position: relative;
        padding-left: 1.2rem;
        margin: 0.5rem 0;
        color: #181c32;
    }

        .table tfoot ul li:before {
            content: "•";
            position: absolute;
            left: 0;
            color: #181c32;
        }
/* Card body styles */
.card-bonus6 .card-body,
.card-bonus7 .card-body {
    padding: 1.25rem;
}

.outfit {
    font-family: 'Outfit' !important;
    font-weight: 600 !important;
}

.table {
    margin-bottom: 2rem;
    background: transparent;
}
/* Header de tabla */
.table-header-pick {
    --bs-table-bg: rgb(2,0,36);
    --bs-table-bg: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%);
    border: none;
}
    /* Contenedor del header */
    .table-header-pick th {
        /*padding: 0 !important;*/
        border: none !important;
    }
    /* Contenedor flex para título e imagen */
    .table-header-pick .d-flex {
        padding: 1rem;
        min-height: 60px;
    }
    /* Título */
    .table-header-pick h3 {
        color: #ffffff;
        font-size: 1.2rem;
        margin: 0;
        font-weight: 600;
        font-family: 'Outfit';
        line-height: 1.2;
    }
    /* Imagen en el header */
    .table-header-pick img {
        height: 32px;
        width: auto;
        object-fit: contain;
    }
    /* Badge estilo */
    .table-header-pick .badge {
        margin-left: 0.75rem;
        padding: 0.35rem 0.7rem;
        font-size: 12px;
        font-weight: 600 !important;
        background: #ffc107;
        color: #000;
        border-radius: 10px;
        vertical-align: middle;
    }
/* Columnas del header */
.table-header-pick-columns {
    background-color: transparent;
}
/*Games Section*/
.games-section {
    background-color: rgba(8, 26, 15, 1) !important;
}
/*Features Section*/
.features-section {
    background-color: #171717;
}

.payouts-section {
    background-color: #190056
}
/**
    Stepper
*/
.active .bs-stepper-circle {
    background: linear-gradient(180deg, #143E19 44.83%, #55E675 168.97%);
    border: solid 2px rgba(70, 192, 97, 1);
    border-radius: 0.75em !important;
    padding: .36em 0;
}

.bs-stepper-circle {
    color: #fff;
    background: linear-gradient(180deg, #404040 44.83%, #E4E4E4 168.97%);
    border: solid 2px rgba(196, 196, 196, 1);
    border-radius: 0.75em !important;
    padding: .36em 0 !important;
}

.bs-stepper .line, .bs-stepper-line {
    background-color: rgba(109, 109, 109, 1) !important;
}

.text-gray {
    color: rgba(100, 100, 100, 1);
}

.cursor-pointer {
    cursor: pointer;
}

.cursor-not-allowed {
    cursor: not-allowed;
}

.form-check-input:checked {
    background-color: #46C061 !important;
    border-color: #46C061 !important;
}

.form-control {
    border: solid 2px #D4D4D4;
    background-color: transparent !important;
    color: white;
}

    .form-control::placeholder {
        color: white;
        opacity: 0.8;
        font-size: 14px;
        font-weight: 400;
    }

    .form-control:focus {
        color: white;
    }

h5.subtitle-cards {
    font-family: 'Outfit';
    font-weight: 800;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
}

.btn:disabled {
    color: white;
    pointer-events: none;
    cursor: not-allowed;
    opacity: 0.6;
}

div.step-new-content p.card-text {
    min-height: 88px;
}

.card-green {
    background-color: #46C061;
    background-image: url(./images/LuckyQuads/cards/cardGreen.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.card-brown {
    background-color: #46C061;
    background-image: url(./images/LuckyQuads/cards/cardBrown.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.card-purple {
    background-color: #46C061;
    background-image: url(./images/LuckyQuads/cards/cardPurple.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.card-blue {
    background-color: #46C061;
    background-image: url(./images/LuckyQuads/cards/cardBlue.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.card-red {
    background-color: #46C061;
    background-image: url(./images/LuckyQuads/cards/cardRed.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.f-bebas {
    font-family: 'Bebas Neue' !important;
}

img.custom-cards-img {
    position: absolute;
    width: 80%;
    top: -12%;
    left: 10%
}

img.custom-cards-contact-img {
    position: absolute;
    width: 30%;
    top: 4%;
    left: 35%
}

img.custom-cards-contact-email-img {
    position: absolute;
    width: 30%;
    top: 15%;
    left: 35%
}

img.custom-cards-contact-social-img {
    position: absolute;
    width: 40%;
    top: 4%;
    left: 30%
}

/* Configuración de fuentes y caja general */
.bonus-card {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #121212;
    color: #e0e0e0;
    border: 1px solid #2a2a2a;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
    margin-bottom:25px;
}

/* Encabezado con el check verde */
.card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}

.icon-check-bg {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #2ecc71;
    color: #121212;
    font-weight: bold;
    font-size: 14px;
    width: 24px;
    height: 24px;
    border-radius: 6px;
}

.card-header h2 {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin: 0;
}

/* Cuerpo y Secciones */
.card-body {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.section h3 {
    color: #f1c40f;
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 10px 0;
}

/* Listas alineadas con Flexbox */
.list-items {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

    .list-items li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        line-height: 1.5;
        font-size: 13.5px;
    }

/* Icono de check verde para la lista */
.check-icon {
    color: #2ecc71;
    font-weight: bold;
    user-select: none;
}

.list-items p {
    margin: 0;
    font-size:20px;
}

/* Destacados en amarillo */
.highlight-yellow {
    color: #f1c40f;
    font-weight: 600;
}

/* Estilo para la flecha de flujo */
.arrow {
    margin: 0 4px;
    color: #b0b0b0;
}

/* Icono de recarga verde (reemplaza o añade junto a .icon-check-bg) */
.icon-reload-bg {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #2ecc71;
    color: #121212;
    width: 24px;
    height: 24px;
    border-radius: 6px;
}

/* Las etiquetas/botones amarillos redondos */
.badge-yellow {
    display: inline-block;
    background-color: #f1c40f;
    color: #121212;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 12px;
    margin-bottom: 16px;
}

/* Contenedor gris del ejemplo */
.example-box {
    background-color: #222222;
    border-left: 3px solid #2ecc71;
    border-radius: 4px;
    padding: 12px 16px;
    margin-top: 14px;
    margin-left: 24px; /* Alineado para que empiece donde el texto de la lista */
}

    .example-box p {
        margin: 0;
        font-size: 20px;
        line-height: 1.6;
        color: #cccccc;
    }

/* Formateo sutil para resaltar la operación matemática */
.math {
    font-family: 'Times New Roman', Times, serif;
    font-style: italic;
    font-weight: bold;
    color: #ffffff;
    font-size: 14px;
}
/* Nuevo contenedor de icono para la sección de referidos */
.icon-referral-bg {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #2ecc71;
    color: #121212;
    width: 24px;
    height: 24px;
    border-radius: 6px;
}
/* Nuevo contenedor de icono para la sección de Free Spins */
.icon-circle-bg {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #2ecc71;
    color: #121212;
    width: 24px;
    height: 24px;
    border-radius: 6px;
}
/* Contenedor de icono para la sección de Diamond Rules */
.icon-diamond-bg {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #2ecc71;
    color: #121212;
    width: 24px;
    height: 24px;
    border-radius: 6px;
}

/* Colores específicos para los niveles VIP */
.vip-blue {
    color: #3498db;
    font-weight: 600;
}

.vip-red {
    color: #e74c3c;
    font-weight: 600;
}

.vip-green {
    color: #2ecc71;
    font-weight: 600;
}

.vip-pink {
    color: #f39c12; /* Ajustable al tono exacto de rosa/salmón de la interfaz */
    font-weight: 600;
}

.vip-purple {
    color: #9b59b6;
    font-weight: 600;
}
/* ==========================================================================
   MEDIA QUERIES (ordenadas de mayor a menor breakpoint)
   ========================================================================== */
/* min-width: 1400px (pantallas grandes) */
@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1140px;
    }

    #carouselTop .carousel-item > img {
        width: 100%;
    }
}

@media (max-width: 1749px) {
    #carouselTop .carousel-caption {
        width: 60%;
        font-size: 80px;
        line-height: 82px;
    }

        #carouselTop .carousel-caption > h3 {
            font-size: 80px;
            line-height: 82px;
        }

    .carousel-caption.position-center {
        right: 15%;
        bottom: 15%;
    }

    .carousel-caption {
        position: absolute;
        right: 26.5%;
        bottom: 25%;
    }
}
/**Ajuste para el menu */
@media (max-width: 1707px) {
    a.rules-button, a.login-button, a.livelines-button {
        font-size: 14px;
        padding: 8px 10px !important;
    }

    .list-menu a {
        font-size: 14px !important;
        padding: 8px 10px !important;
    }
}

@media (max-width: 1573px) {
    .features-section div.col-md-8 {
        width: 75% !important;
    }

    .payouts-section div.col-md-4 {
        width: 50% !important;
    }
}

@media (max-width: 1405px) {
    .carousel-caption {
        bottom: 15%;
    }

    #carouselTop .carousel-caption > a.btn {
        font-size: 14px;
        padding: 4px 10px 4px 10px !important;
    }
}
/* max-width: 1442px */
@media (max-width: 1442px) {
    .info-card {
        height: 220px;
    }
}

@media (max-width: 1399px) {
    .features-section div.col-md-8 {
        width: 85% !important;
    }

    .payouts-section div.col-md-4 {
        width: 60% !important;
    }

    div.carousel-item img {
        width: 100% !important;
    }

    #carouselTop .carousel-caption > h3 {
        font-size: 60px;
        line-height: 62px;
    }

    #carouselTop .carousel-caption > p {
        font-family: 'Outfit';
        font-size: 25px;
        line-height: 30px;
    }

    .carousel-caption.position-right {
        right: 0%;
    }
    /* max-width: 1376px */
    @media (max-width: 1376px) {
        h3.title {
            font-size: 28px;
        }

        .bg-numbers, .bg-numbers1 {
            background-size: 90% 120%;
        }
    }

    @media (max-width: 1352px) {
        header div.col-7 {
            width: 53% !important;
        }

        header div.col-3 {
            width: 30% !important;
        }
    }

    @media (max-width: 1308px) {
        h5.subtitle-cards {
            font-size: 16px;
        }
    }

    @media (max-width: 1290px) {
        .list-menu a {
            font-size: 14px !important;
            padding: 8px 5px !important;
        }

        .carousel-caption {
            right: 27.5%;
            bottom: 10%;
        }

        .tri-bundle-banner div.col-lg-3 {
            width: 25%;
        }

        .tri-bundle-banner div.col-lg-9 {
            width: 50%;
        }
    }

    @media (max-width: 1253px) {
        #carouselTop .carousel-caption > h3 {
            font-size: 50px;
            line-height: 55px;
        }

        #carouselTop .carousel-caption > p {
            font-size: 20px;
            line-height: 25px;
        }

        .features-section div.col-md-8 {
            width: 95% !important;
        }

        .card-btn-login {
            width: 80% !important;
        }
    }
    /* max-width: 1200px (combinado) */
    @media (max-width: 1200px) {
        section.banner div.card {
            max-height: 170px;
        }

        .user-box {
            margin-bottom: 55px;
        }

        section.banner div.card img {
            object-fit: cover;
            object-position: top left;
            overflow: hidden;
            height: 170px;
            width: 100%;
        }

        section.banner div.card h5.card-title {
            font-size: 25px;
        }

        body > header > div.container.d-lg-block.d-none > div {
            width: 100%;
        }
    }

    /* max-width: 1198px */
    @media (max-width: 1198px) {
        .info-card {
            height: 240px;
        }

        h3.title {
            font-size: 26px;
            line-height: 30px;
        }

        h5.title-cards {
            font-size: 35px;
        }

        h5.subtitle-cards {
            font-size: 14px;
        }

        .pick-button {
            font-size: 15px !important;
            padding: 6px 14px !important;
        }
    }

    @media (max-width: 1158px) {
        .list-menu a {
            font-size: 13px !important;
            padding: 8px 3px !important;
        }

        a.rules-button, a.login-button, a.livelines-button {
            font-size: 13px;
            padding: 8px 8px !important;
        }

        .features-section div.col-md-8 span.title-cards {
            font-size: 40px !important;
        }

        .pick-button {
            font-size: 13px !important;
        }
    }
    /* max-width: 1117px (combinado) */
    @media (max-width: 1117px) {
        .header-right > nav > ul {
            font-size: 13px;
        }

        .col-lg-10 {
            width: 90%;
        }

        .user-box {
            margin-bottom: 60px;
        }

        #carouselTop .carousel-caption {
            right: 0%;
        }
    }

    @media (max-width: 1093px) {
        h5.subtitle-cards {
            font-size: 12px;
        }

        #carouselTop .carousel-caption > h3 {
            font-size: 40px;
            line-height: 41px;
        }
    }

    @media (max-width: 1049px) {
        a.rules-button, a.login-button, a.livelines-button {
            font-size: 12px;
            padding: 5px 3px !important;
        }

        .list-menu a {
            font-size: 12px !important;
            padding: 6px 2px !important;
        }

        #carouselTop .carousel-caption > h3 {
            font-size: 46px;
        }

        #carouselTop .carousel-caption > h4 {
            font-size: 25px;
            line-height: 25px;
        }

        .features-section div.col-md-8 span.title-cards {
            font-size: 35px !important;
        }

        .pick-button {
            font-size: 12px !important;
        }
    }

    @media (max-width: 999px) {
        .info-card {
            height: 285px;
        }

        .bonuses-text {
            font-size: 15px;
        }

        h5.title-cards {
            font-size: 30px;
        }

        .pick-button {
            padding: 4px 8px !important;
            border-radius: 15px;
        }
    }

    /* max-width: 991px */
    @media (max-width: 991px) {
        .neo-navbar-toggler {
            display: block;
        }

        a.login-button {
            font-size: 14px;
            padding: 8px 20px !important;
        }

            a.login-button.col-md-3 {
                width: 35% !important;
            }

        section.banner div.card {
            max-height: 250px;
        }

            section.banner div.card img {
                object-fit: cover;
                object-position: top left;
                overflow: hidden;
                height: 230px;
                width: 100%;
            }

            section.banner div.card h5.card-title {
                font-size: 32px;
            }

        .card-btn-login {
            width: 80% !important;
        }
    }

    /* max-width: 990px (tablet/escritorio pequeño) */
    @media (max-width: 990px) {
        body > header {
            height: auto;
        }

        .features-section div.col-md-8 span.title-cards {
            margin-top: .70rem !important;
            font-size: 25px !important;
        }

        .tri-bundle-banner div.col-lg-3 {
            width: 25%;
        }

        .tri-bundle-banner div.col-lg-9 {
            width: 50%;
        }

        .container, .container-sm {
            --bs-gutter-x: 3.5rem;
            max-width: none;
            padding-right: calc(var(--bs-gutter-x) * .5);
            padding-left: calc(var(--bs-gutter-x) * .5);
        }

        .user-box {
            margin-top: -96px;
            margin-bottom: 5px;
        }

        .neo-navbar-toggler {
            display: inline-block;
            margin-top: 24px;
            margin-bottom: 0;
        }

        .header-right > nav {
            margin-bottom: 10px;
            display: none;
        }

            .header-right > nav > ul {
                text-align: left;
                display: contents;
            }

                .header-right > nav > ul > li {
                    width: 100%;
                    display: inline-block;
                    height: 35px;
                }

                    .header-right > nav > ul > li > a {
                        border-radius: 0;
                        display: block;
                        width: 100%;
                    }

        #carouselTop .carousel-caption > h5 {
            font-size: 1.7rem;
        }


        .history-right {
            padding-bottom: 0;
        }

            .history-right > h5 {
                font-size: 22px;
            }

        h5.title-cards {
            font-size: 20px;
        }

        h5.subtitle-cards {
            font-size: 10px;
        }

        .pick-button {
            font-size: 8px !important;
        }

        .payouts-section div.col-md-4 {
            width: 80% !important;
        }

        #carouselTop .carousel-caption > h3 {
            font-size: 30px;
            line-height: 30px;
        }
        .carousel-caption.position-right,
        .carousel-caption.position-left,
        .carousel-caption.position-center {
            bottom: 0%;
        }
        #carouselTop .carousel-caption > h4 {
            font-size: 20px;
            line-height: 20px;
        }

        button.login-button.w-25 {
            width: 25% !important;
        }
    }

    @media (max-width: 832px) {
        #carouselTop .carousel-caption > h3 {
            font-size: 25px;
            line-height:25px;
        }
    }

    @media (max-width: 832px) {
        a.login-button.col-md-3 {
            width: 55% !important;
        }

        h5.subtitle-cards {
            font-size: 8px;
        }

        .tri-bundle-banner div.col-lg-3 {
            width: 50%;
        }

        .tri-bundle-banner div.col-lg-9 {
            width: 50%;
        }

        section.referral-banner div.card h5.card-title,
        section.tri-bundle-banner div.card h5.card-title,
        .title-cards {
            font-size: 40px;
            line-height: 100%;
        }
    }

    @media (max-width: 789px) {
        .features-section div.col-md-8 span.title-cards {
            margin-top: .70rem !important;
            font-size: 20px !important;
        }
    }
    /* max-width: 768px (combinado) */


    @media (max-width: 768px) {
        section.banner div.card {
            max-height: 100%;
        }

        #carouselTop .carousel-caption > p {
            font-size: 25px;
            line-height: 30px;
        }

        section.banner div.card img {
            object-fit: cover;
            object-position: top left;
            overflow: hidden;
            height: 100%;
            width: 100%;
        }

        section.banner div.card h5.card-title {
            font-family: Montserrat;
            font-size: 22px;
            font-weight: 800;
            line-height: 28px;
            letter-spacing: 0em;
            color: #190056;
        }

        #carouselTop .carousel-caption > p.h3 {
            line-height: 45px;
        }

        .nt-5 {
            margin-top: -80px !important;
        }

        .table-header-pick h3 {
            font-size: 1rem;
        }

        .table-header-pick .badge {
            display: inline-block;
            margin-top: 0.5rem;
        }

        .table-header-pick img {
            height: 28px;
        }
    }

    /* max-width: 767px */
    @media (max-width: 767px) {
        .info-card {
            height: 395px;
            margin-top: 3em;
        }

        .bonuses-text {
            font-size: 20px;
        }

        .card {
            margin-top: 1em;
        }

        h5.title-cards {
            font-size: 35px;
        }

        h5.subtitle-cards {
            font-size: 20px;
        }

        .pick-button {
            font-size: 20px !important;
        }

        .features-section div.col-md-8 span.title-cards {
            margin-top: .35rem !important;
            font-size: 40px !important;
        }

        section.tri-bundle-banner {
            background-image: none;
            background-color: #081A0F !important;
        }

        .tri-bundle-banner div.col-lg-3, .tri-bundle-banner div.col-lg-9 {
            width: 100%;
            display: flex !important;
            justify-content: center;
            align-items: center;
        }

        .bg-numbers {
            min-height: 470px;
            background-image: url(./images/LuckyQuads/number11.png);
            background-size: 100%;
            background-position: center center;
            background-repeat: no-repeat;
        }

        .bg-numbers1 {
            min-height: 470px;
            background-image: url(./images/LuckyQuads/numbers21.png);
            background-size: 100%;
            background-position: center center;
            background-repeat: no-repeat;
        }

        .tri-bundle-banner div.col-lg-9 {
            margin-top: -85px;
        }

        img.custom-cards-contact-img {
            position: absolute;
            width: 10%;
            top: 15%;
            left: 45%
        }

        img.custom-cards-contact-email-img {
            position: absolute;
            width: 20%;
            top: 15%;
            left: 40%
        }

        img.custom-cards-contact-social-img {
            position: absolute;
            width: 20%;
            top: 5%;
            left: 40%
        }
        #carouselTop .carousel-caption {
            width: 100%;
        }
            #carouselTop .carousel-caption > h3 {
                font-size: 70px;
                line-height: 75px;
            }
            #carouselTop .carousel-caption > p {
                font-size: 30px;
                line-height: 35px;
            }
        .carousel-caption.position-right, .carousel-caption.position-left, .carousel-caption.position-center {
            bottom: 15%;
        }
    }

    /* max-width: 690px (móvil) */
    @media (max-width: 690px) {
        .tri-bundle-banner div.mt-5 {
            margin-top: -60px !important;
        }

        .container, .container-sm {
            padding-right: 12px;
            padding-left: 12px;
        }

        .logo > img {
            margin-top: 1%;
        }

        .user-box {
            margin-top: -145px;
        }

        .neo-navbar-toggler {
            margin-top: 1%;
            margin-right: 10px;
        }

        #carouselTop .carousel-caption,
        .carousel-caption.position-right,
        .carousel-caption.position-center {
            width: 100%;
            position: absolute;
            left: 0%;
            bottom: 5%;
        }

            #carouselTop .carousel-caption.position-left {
                width: 100% !important;
                position: absolute;
                left: 0%;
                bottom: 5%;
            }

        .carousel-caption.position-left p, .carousel-caption.position-left h3 {
            text-align: center !important;
        }

        .carousel-caption.position-left a {
            float: none !important;
        }

        .carousel-indicators {
            left: calc(50% - 70.5px);
            margin-bottom: 5px;
        }

        #carouselTop .carousel-caption > h3 {
            font-size: 64px;
        }

        #carouselTop .carousel-caption > h4 {
            font-size: 24px;
        }

        #carouselTop .carousel-caption > a.btn {
            font-size: 18px;
        }

        #carouselTop .carousel-item > img {
            margin-left: 0;
            min-height: 600px;
            object-fit: cover;
        }

        .card-section > .container > .row > .card {
            width: 100%;
            margin-bottom: 1rem;
        }

        .card-mini-section > .container > .row > .card {
            width: 100%;
            margin-bottom: 0;
        }

        .carousel-caption {
            bottom: 1.5rem;
        }

        .history-right {
            padding-bottom: 20px;
        }

            .history-right > h5 {
                font-size: 28px;
            }
        /***RULES & DRAWING-SCHEDULE****/
        .table-section > .container > table {
            display: none;
        }

        #table-section-mobile, #table-section-mobile-1, #table-section-mobile-2 {
            display: block;
        }

            #table-section-mobile .table > :not(caption) > * > * {
                background-color: transparent;
            }

        .table-header-pick > th > h3 {
            font-size: 25px;
            margin-top: 5px;
            background-color: transparent !important;
        }

        .table-header-pick > th > img {
            width: 85px;
            margin-top: 5px;
        }

        .table-pick-section td > div:nth-child(1) > ul {
            padding-bottom: 0;
            margin-bottom: 0;
        }

        .table-pick-section td > div:nth-child(3) > ul {
            padding-bottom: 0;
            margin-bottom: 0;
        }

        .table-pick-section td > div:nth-child(2) > ul {
            padding-top: 0;
            margin-top: 0;
        }

        .table-pick-section td > div:nth-child(4) > ul {
            padding-top: 0;
            margin-top: 0;
        }

        .table-pick-section td > div:nth-child(2) {
            order: 2;
            background-color: #F7F7F7;
            padding-top: 0;
            margin-top: 0;
        }

        .table-pick-section td > div:nth-child(3) {
            background-color: #EEEEEE;
            padding-bottom: 0;
            margin-bottom: 0;
        }

        .table-pick-section td > div:nth-child(4) {
            order: 4;
            padding-top: 0;
            margin-top: 0;
        }
        /***CONTACT**/
        #contactSubmit {
            width: 100%;
        }

        section.tri-bundle-banner div.card {
            margin-top: 0px;
        }

            section.tri-bundle-banner div.card img {
                object-fit: contain;
                object-position: center;
                overflow: hidden;
                height: auto;
                min-height: 321px;
                width: 100%;
                padding: 20px;
            }

            section.tri-bundle-banner div.card div.card-body {
                padding-top: 0px;
                padding-bottom: 0px;
            }

        .text-colunms {
            display: flex !important;
            flex-flow: column !important;
        }

            .text-colunms h5 {
                padding: 5px 40px;
                background-color: rgba(7, 8, 83, 1);
                line-height: 50px;
                font-size: 40px !important;
            }

        a.rules-button, a.login-button, a.livelines-button {
            font-size: 16px;
            padding: 8px 20px !important;
        }
    }

    @media (max-width: 640px) {
        .info-card {
            height: 340px;
            margin-top: 3em;
        }
    }

    @media (max-width: 576px) {
        .info-card {
            height: 295px;
            margin-top: 3em;
        }

        div.step-new-content p.card-text {
            min-height: auto;
        }

        header > div.container-fluid.d-lg-none.d-block > div > div.col-11 {
            width: 85% !important;
        }

        #carouselTop .carousel-caption > h3 {
            font-size: 30px;
            line-height: 35px;
        }
        #carouselTop .carousel-caption > p {
            font-size: 20px;
            line-height: 25px;
        }
        .tri-bundle-banner div.col-lg-9 {
            margin-top: -75px;
        }

        button.login-button.w-25 {
            width: 100% !important;
        }

        div.referal-header-card {
            flex-flow: column !important;
            align-items: center !important;
            padding-top: 10px;
        }

        .table-header-pick .badge {
            margin-top: 0rem;
        }
    }

    /* min-width: 576px (tablets vertical) */
    @media (min-width: 576px) {
        #signupModal .modal-dialog {
            max-width: 750px;
        }

        #forgotPasswordForm .modal-dialog, #loginModal .modal-dialog {
            max-width: 450px;
        }
    }

    /* max-width: 448px (móviles pequeños) */
    @media (max-width: 448px) {
        .modal-body {
            padding-left: 3px !important;
            padding-right: 3px !important;
        }

        .card-btn-login {
            width: 100% !important;
        }
    }