:root {
    --spacing: 8px;
    --hue: 400;
    --background1: hsl(214, 14%, 20%);
    --background2: hsl(214, 14%, 13%);
    --background3: hsl(214, 14%, 5%);
    --brand1: hsl(var(--hue) 80% 60%);
    --text1: hsl(0, 0%, 100%);
    --text2: hsl(0, 0%, 90%);
}

[tabs-filters] ul li a {
    background: none;
}

[tabs-filters] ul li a.\--active {
    background: none;
    font-weight: 800;
    color: #ffffff;
}

/* Countdown*/
.time_circles canvas {
    display: none;
    background-color: none;
}

.countdown {
    position: absolute;
    left: -64px;
    right: 0;
    top: 340px;
    margin: 0 auto;
    width: 300px;
    height: 50px;
}

.textCountDown {
    position: absolute;
    left: 165px;
    right: 0;
    top: 300px;
    margin: 0 auto;
    width: 300px;
    height: 50px;
}

.textDiv_Days,
.textDiv_Hours,
.textDiv_Minutes,
.textDiv_Seconds {
    display: inline-block;
}

.textDiv_Days span,
.textDiv_Days h4,
.textDiv_Hours span,
.textDiv_Hours h4,
.textDiv_Minutes span,
.textDiv_Minutes h4,
.textDiv_Seconds span,
.textDiv_Seconds h4 {
    display: inline-block;
    font-size: 1rem;
    color: #ffffff;
}

.textDiv_Days h4,
.textDiv_Hours h4,
.textDiv_Minutes h4,
.textDiv_Seconds h4 {
    padding-left: 5px;
}

/* Countdown */

.active_sport {
    background: rgb(46, 94, 162);
    background: radial-gradient(circle, rgba(46, 94, 162, 1) 0%, rgba(2, 42, 70, 1) 100%);
    outline: none;
    border-color: #9ecaed;
    box-shadow: 0 0 10px #9ecaed;
    color: #fff;
}

#animated-gif {
    margin-top: -15px;
}

.banner-pick {
    background: url(../img/backgrounds/bg-banner-pick.png) repeat;
    color: #cccccc;
}

.bg-amarillo {
    background: rgb(255 234 42/1);
}

.bg-banner-mx {
    background: rgb(0, 2, 10, 1);
    overflow: hidden;
}

.bg-black {
    background-color: #000;
}

.bg-blue {
    background: #021E2F;
}

.bg-blue-2 {
    background: rgb(50 97 189/1);
}

.bg-blue-3 {
    background: rgb(5, 17, 25);
}

.bg-blue-4 {
    background: #01111D;
}

.bg-blue-mx {
    background: #005FFF;
}

.bg-brackets {
    background: rgba(134, 16, 63, 0.7);
}

.bg-card-quiniela {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.bg-card-store {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.bg-card-payment-success {
    background-color: #0e2233;
    border: 0;
    border-radius: 20px;
    overflow: hidden;
    width: 100%;
    min-height: 100px;
    height: auto;
}

.bg-category {
    position: relative;
    left: 0;
    right: 0;
    width: 100%;
    background: #021e2f !important;
}

.bg-category-list {
    position: absolute;
    left: 0px;
    right: 0px;
    background: #021e2f !important;
    text-transform: uppercase;
    z-index: 99;
}

.bg-category-list img {
    width: 10%;
}

.bg-desempate {
    background: url(../img/backgrounds/bg-banner-pick.png) repeat;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color: #ffffff;
}

.bg-duelazo-mx {
    background: #064877;
    /*background: linear-gradient(180deg, rgba(0,95,255,1) 0%, rgba(0,0,0,1) 30%);*/
    background: linear-gradient(180deg, #064877 -5.69%, #01040A 47.51%);

}

.bg-glow {
    top: -160px;
    width: 1200px;
    height: 1200px;
    background: url(../img/home/Ellipse2925.png);
    background-size: cover;
    background-position: center;
}

.bg-gold {
    background: url(../img/backgrounds/gold.png);
}

.bg-gradient-body-todas {
    background: rgb(0, 0, 0);
    background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(10, 34, 52, 1) 53%);
}

.bg-gray {
    background: rgba(107, 110, 112, 0.7);
}

.bg-gray-2 {
    background: rgb(230 230 230 / 1);
}

.bg-gray-blue {
    background: rgb(38 38 171 / 70%);
}

.bg-green {
    background: #51E8AE;
}

.bg-green-2 {
    background: rgba(84, 254, 223, 0.6)
}

.bg-green-3 {
    background: rgb(227 249 81/1);
}

.bg-modal {
    background: rgba(9, 27, 54, 0.8);
}

.bg-patrocinador {
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 20%;
}

.bg-position {
    background: rgba(21, 63, 141, 0.3);
}

.bg-quinielas {
    background-image: url(../img/backgrounds/bg-quinielas.png);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 1;
    min-height: 1110px;
}

.bg-quinielas-home {
    background-image: url(../img/backgrounds/bg-quinielas.png);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 1;
    min-height: 950px;
}

.bg-highlight {
    border-radius: 30px !important;
    background: rgba(102, 96, 96, 0.4);
}

.bg-pools {
    border-radius: 20px !important;
    background: #3261BD;
}

.bg-pools-vip {
    border-radius: 40px !important;
    background: rgba(20, 21, 22, 0.8);
}

.bg-pools-sponsor {
    width: 35%;
    height: 30%;
    position: absolute;
    right: 0;
    bottom: 0;
}

.bg-red {
    background: #E8516C;
}

.bg-row-1 {
    background: url(../img/backgrounds/bg-teams.png) repeat;
    color: #ffffff;
}

.bg-row-2 {
    background: url(../img/backgrounds/bg-banner-pick.png) repeat;
    color: #ffffff;
}

.bg-row-3 {
    background: url(../img/backgrounds/bg-questions.png) repeat;
    color: #ffffff;
}

.bg-row-4 {
    background: #021E2F;
    color: #ffffff;
}

.bg-row-5 {
    background: #324F64;
    color: #ffffff;
}

.bg-sports {
    background: #021e2f;
    border-top: none !important;
}

.bg-tabs {
    background: #00263d;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    color: #cccccc;
}

.bg-tabs>div.active {
    border-bottom: 1px solid #ffffff;
}

.bg-tabs a.--active {
    color: #ffffff;
    font-weight: bold;
}

.bg-yellow {
    background: #EBBC70;
}

.blur {
    opacity: 0.4;
}

.border-top-0 {
    border-top: none !important;
}

.border-banner-middle {
    border: 2px solid #141627;
    border-radius: 20px;
    overflow: hidden;
}

.border-balance {
    border: 3px solid #ffffff;
    border-radius: 30px !important;
}

.border-participant {
    border: 2px solid #ffd52b;
}

.border-rad-15 {
    border-radius: 15px !important;
}

.border-rad-18 {
    border-radius: 18px !important;
}

.border-rad-20 {
    border-radius: 20px !important;
}

.border-rad-30 {
    border-radius: 30px !important;
}

.border-rad-40 {
    border-radius: 40px !important;
}

.border-rad-50 {
    border-radius: 50px !important;
}

.bracket-0-pts {
    background: #E8516C !important;
    color: #000 !important;
}

.bracket-1-pts {
    background: #51E8AE !important;
    color: #000 !important;
}

.bracket-3-pts {
    background: #EBBC70 !important;
    color: #000 !important;
}

.bracket-down {
    position: absolute;
    left: 21%;
    right: 0;
    top: 53%;
    bottom: 0;
    background: rgba(18, 55, 77, 0.6);
    border-radius: 0px 0px 30px 0px;
}

.bracket-left {
    position: absolute;
    left: 0;
    right: 80%;
    top: 2%;
    bottom: 0;
    background: rgba(18, 55, 77, 0.6);
    border-radius: 30px 0px 0px 30px;
}

.bracket-up {
    position: absolute;
    left: 21%;
    right: 0;
    top: 2%;
    bottom: 51%;
    background: rgba(18, 55, 77, 0.6);
    border-radius: 0px 30px 0px 0px;
}

.bracket-info {
    background: #021E2F;
    opacity: 0.7;
    border-radius: 50px !important;
    border: 0;
    color: #ffffff;
    font-size: 0.8rem;
    padding: 7px 10px;
    margin: 0 auto;
    padding-bottom: 10px;
    cursor: pointer;
    width: 90%;
}

.bracket-input {
    width: 94%;
    height: 88%;
    background: rgba(2, 30, 47, 0.7);
    border: none;
    border-radius: 10px;
    color: #ffffff;
    font-weight: 800;
    font-size: 2rem;
    text-align: center;
}

.btn-aceptar1 {
    background: #FEDBA2;
    border: 1px solid #FEDBA2;
    border-radius: 10px;
    padding: 6px 40px;
    color: #041825;
    font-weight: 700;
}

.btn-amarillo-transp {
    background-color: transparent;
    color: rgb(238 238 238/1);
    border-color: rgb(255 234 42/1);
    border-style: solid;
    border-width: 2px;
    border-radius: 10px;
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
}

.btn-amarillo-transp:hover {
    background-color: rgb(255 234 42/1);
    color: rgb(10 34 52/1);
    border: solid 2px transparent;
}

.btn-balance {
    background: #13425F;
    border-radius: 50px !important;
    border: 0;
    color: #ffffff;
    font-size: 0.8rem;
    padding: 7px 30px !important;
    padding-bottom: 10px;
    cursor: pointer;
    width: 6rem;
    text-align: center;
}

.btn-balance1 {
    background: #02263d;
    border: 2px solid #fff;
    border-radius: 40px;
    color: #cec6c6;
}

.btn-bienvenida {
    background: linear-gradient(#01111D, #01111D) padding-box,
        linear-gradient(45deg, rgba(15, 0, 89, 1) 0%, rgba(4, 83, 218, 1) 50%, rgba(227, 249, 81, 1) 80%) border-box;
    border: solid 2px transparent;
    border-radius: 10px;
    color: #FFFFFF;
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
}

.btn-crear-cuenta {
    background-color: rgb(227 249 81/1);
    border: solid 2px transparent;
    border-radius: 10px;
    color: rgb(10 34 52/1);
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
}

.btn-crear-cuenta:hover {
    background-color: transparent;
    border-color: rgb(227 249 81/1);
    color: rgb(238 238 238/1);
}

.btn-default {
    background: #22417d;
    border-radius: 40px !important;
    border: 0;
    color: #ffffff;
    height: 50px;
    padding: 0 60px !important;
}

.btn-default:hover {
    background: #00263d;
}

.btn-default-vip {
    background: #FEDBA2;
    border-radius: 40px !important;
    border: 0;
    color: #000000;
    height: 50px;
    padding: 0 60px !important;
}

.btn-default-vip:hover {
    background: #f5c16e;
}

.btn-dark {
    padding: 0 60px !important;
}

.btn-dark-2 {
    padding: 10px 60px 0 !important;
}

.btn-dark,
.btn-dark-2 {
    background: #000;
    border-radius: 40px !important;
    border: 1px solid #fff;
    color: #ffffff;
    height: 50px;
}

.btn-dark:hover,
.btn-dark-2:hover {
    background: #333;
}

.btn-disabled {
    background: #9A9A9A;
    border: 2px solid #9A9A9A;
    border-radius: 40px;
    color: #ffffff;
}

.btn-file {
    background: #fff;
    border: 2px solid #fff;
    border-radius: 40px;
    color: #05173B;
    padding: 10px 24px;
    cursor: pointer;
    font-weight: bold;
}

.btn-file-2 {
    background: none;
    border: none;
    color: #ffffff;
    padding: 5px;
    cursor: pointer;
    font-weight: bold;
}

.btn-highlight {
    background: #22417d;
    border-radius: 40px !important;
    border: 0;
    color: #ffffff;
    height: 24px;
    padding: 2px 35px !important;
    font-weight: normal;
    font-size: 0.8rem !important;
    text-transform: capitalize;
}

.btn-highlight:hover {
    background: #00263d;
}

.btn-ingresar {
    background: #13425F;
    border-radius: 50px !important;
    border: 0;
    color: #ffffff;
    font-size: 0.8rem;
    padding: 7px 10px !important;
    padding-bottom: 10px;
    cursor: pointer;
    width: 6rem;
    text-align: center;
}

.btn-ingresar-2 {
    background-color: #2E7CFF;
    border: solid 2px transparent;
    border-radius: 10px;
    color: #FFFFFF;
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
    position: relative;
    z-index: 10;
}

.btn-ingresar-2:hover {
    background-color: transparent;
    border-color: rgb(255 234 42/1);
    color: rgb(238 238 238/1);
}

.btn-juega-responsable {
    background: none;
    border: 1px solid #fff;
    border-radius: 40px;
    padding: 3px 10px;
    color: #fff;
}

.btn-marcadores {
    background-color: #0C2635;
    padding: 10px 20px;
    border: none;
    border-radius: 20px;
    position: absolute;
    top: 8px;
    right: 20px;
}

.btn-marcadores-movil {
    background-color: #021E2F;
    padding: 10px 20px;
    border: none;
    border-radius: 20px;
}

.btn-modal {
    background: rgba(67, 112, 144, 0.8);
    border: none;
    border-radius: 20px;
    width: 100%;
    padding: 10px 20px;
}

.btn-naranja-transp {
    background-color: transparent;
    color: rgb(238 238 238/1);
    border-color: #FFBF11;
    border-style: solid;
    border-width: 2px;
    border-radius: 10px;
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
}

.btn-naranja-transp:hover {
    background-color: #FFBF11;
    color: rgb(10 34 52/1);
    border: solid 2px transparent;
}

.btn-profile {
    background: #021e2f;
    border-radius: 40px;
}

.btn-profile2 {
    background: #13425F;
    border-radius: 50px !important;
    border: 0;
    color: #ffffff;
    font-size: 0.8rem;
    padding: 7px !important;
    padding-bottom: 10px;
    cursor: pointer;
    width: 2rem;
    text-align: center;
}

.btn-reclamar-bono-1 {
    background-color: rgb(255 234 42/1);
    border: solid 2px transparent;
    border-radius: 10px;
    color: rgb(10 34 52/1);
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
}

.btn-reclamar-bono-1:hover {
    background-color: rgb(10, 34, 52);
    color: rgb(255, 234, 42);
}

.btn-reclamar-bono-2 {
    background-color: rgb(227 249 81/1);
    border: solid 2px transparent;
    border-radius: 10px;
    color: rgb(10 34 52/1);
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
}

.btn-reclamar-bono-2:hover {
    background-color: rgb(10, 34, 52);
    color: rgb(227, 249, 81);
}

.btn-reclamar-bono-3 {
    background-color: #FFBF11;
    border: solid 2px transparent;
    border-radius: 10px;
    color: rgb(10 34 52/1);
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
}

.btn-reclamar-bono-3:hover {
    background-color: rgb(10, 34, 52);
    color: rgb(255, 191, 17);
}

.btn-suscribirse {
    background: linear-gradient(286deg, rgba(0, 95, 255, 1) 0%, rgba(66, 33, 227, 1) 50%, rgba(102, 0, 212, 1) 80%) border-box;
    border: solid 2px transparent;
    border-radius: 10px;
    color: #FFFFFF;
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
}

.btn-ver-mas {
    background: #02263d;
    border: 2px solid #fff;
    border-radius: 40px;
    color: #cec6c6;
    padding: 5px 20px;
}

.btn-verify {
    background: #469AFF;
    border: 2px solid #469AFF;
    border-radius: 40px;
    color: #ffffff;
}

.btn-vip {
    background: #827F7B;
    border-radius: 40px;
    color: #cec6c6;
}

.btn-racha-actual {
    background: #15ffd4;
    border: 2px solid #15ffd4;
    border-radius: 40px;
    color: #000000;
    font-size: 0.8rem;
    font-weight: bold;
    padding: 2px 10px;
}

.btn-select-picks {
    background: #22417d;
    border-radius: 40px !important;
    border: 0;
    color: #ffffff;
    height: 50px;
    width: 100%;
}

.btn-select-picks-disabled {
    background: #647fb2;
    border-radius: 40px !important;
    border: 0;
    color: #3b3b3b;
    height: 50px;
    width: 100%;
}

.btn-streaks {
    background: #021E2F;
    opacity: 0.7;
    border-radius: 50px !important;
    border: 0;
    color: #ffffff;
    font-size: 0.8rem;
    padding: 7px 10px;
    margin: 0 3px;
    padding-bottom: 10px;
    cursor: pointer;
    width: 80%;
}

.btn-streaks-all {
    background-color: #FFEA2A;
    color: #000000;
    font-weight: 800;
    border-radius: 50px !important;
    border: 0;
    font-size: 0.8rem;
    padding: 7px 10px;
    margin: 0 3px;
    padding-bottom: 10px;
    cursor: pointer;
    width: 80%;
}

.btn-streaks-all:hover {
    background: #bf6007;
    color: #000;
}

.btn-streaks-yt {
    background: #021E2F;
    border-radius: 40px;
    color: #ffffff;
    padding: 5px 24px;
    cursor: pointer;
    font-weight: lighter;
}

.btn-streaks-yt:hover,
.btn-streaks-yt.active {
    background: #007fcd;
    color: #ffffff;
}

.btn-tutorial {
    background: #FFEA2A;
    border: 2px solid #FFEA2A;
    border-radius: 40px;
    color: #041825;
    font-size: 0.6rem;
    font-weight: bolder;
    padding: 2px 10px;
}

.btn-tutorial:hover {
    color: #041825;
}

.btn-ver-todas {
    background: #FFEA2A;
    border-radius: 50px !important;
    border: 0;
    color: #000000;
    font-size: 0.8rem;
    font-weight: 800;
    padding: 7px 10px;
    margin: 0 3px;
    padding-bottom: 10px;
    cursor: pointer;
    width: 80%;
}

.btn-verde-transp {
    background-color: transparent;
    color: rgb(238 238 238/1);
    border-color: rgb(227 249 81/1);
    border-style: solid;
    border-width: 2px;
    border-radius: 10px;
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
}

.btn-verde-transp:hover {
    background-color: rgb(227 249 81/1);
    color: rgb(10 34 52/1);
    border: solid 2px transparent;
}

.teams .btn-radio {
    text-align: center;
    font-size: 0.6rem;
    width: 100%;
}

.teams .btn-radio span {
    display: block !important;
}

.c-amarillo {
    color: rgb(255 234 42/1);
}

.c-black {
    color: #000;
}

.c-black-2 {
    color: rgb(10 34 52/1)
}

.c-blue {
    color: #62D1F4;
}

.c-blue-mx {
    color: #2E7CFF;
}

.c-blue-light {
    color: #385e9d;
}

.c-blue-dark {
    color: #021E2F;
}

.c-closed {
    color: #E8516C;
}

.c-fail {
    color: #F95E5E;
}

.c-gray {
    color: #EDEAE5;
}

.c-gray-2 {
    color: #F0F1F3;
}

.c-gray-3 {
    color: #CAC6DD;
}

.c-green {
    color: #62F48B;
}

.c-green-2 {
    color: rgb(227 249 81/1);
}

.c-grey-light {
    color: #cccccc;
}

.c-live {
    color: #51E8AE;
}

.c-red {
    color: #770808;
}

.c-red-2 {
    color: #f21212;
}

.c-red-light {
    color: #f34848;
}

.c-whatsapp {
    color: #25D366;
}

.c-white {
    color: white;
}

.c-yellow {
    /*color: #ffd52b;*/
    color: rgba(254, 219, 162, 1);
}

.c-yellow-2 {
    color: #FFEA2A;
}

.c-join {
    color: #1BB278;
}

.c-join-in {
    color: #67a6ff;
}

.c-vip {
    color: #edbe4f;
}

.c-gold-out {
    font-family: 'Anton', sans-serif;
    color: #fff;

    min-height: 10vh;
    display: flex;
    align-items: left;
}

.c-gold-text {
    width: 100%;
    color: transparent;
    text-align: left;
    text-transform: uppercase;
    font-size: 1.5rem;
    font-weight: bold;

    background-image: url('../img/backgrounds/gold.png');
    background-size: cover;
    background-position-y: 700px;

    background-clip: text;
    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;
}

.card-bono {
    padding: 30px 25px 40px 25px;
    /*height: 100%;*/
}

.card-group {
    background-color: #0C2635;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    padding-top: 30px;
}

.card-header {
    background-color: #021E2F;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    width: 100%;
    height: 50px;
    padding: 12px 30px 5px 12px;
    margin-top: 30px;
}

.card-item {
    background-color: rgba(18, 55, 77, 0.7);
    border-radius: 25px;
    position: absolute;
    width: 128px;
    height: 48px;
}

.card-item-change {
    background-color: rgba(60, 84, 255, 0.7);
    border-radius: 25px;
    color: #000;
    font-weight: bold;
    position: absolute;
    width: 128px;
    height: 48px;
}

.card-item-failed {
    background-color: #E8516C;
    border-radius: 25px;
    color: #000;
    font-weight: bold;
    position: absolute;
    width: 128px;
    height: 48px;
}

.card-item-success {
    background-color: #51E8AE;
    border-radius: 25px;
    color: #000;
    font-weight: bold;
    position: absolute;
    width: 128px;
    height: 48px;
}

.card-item-winner {
    background-color: rgba(237, 190, 79, 0.7);
    border-radius: 25px;
    color: #000;
    font-weight: bold;
    position: absolute;
    width: 128px;
    height: 48px;
}

.card-item2 {
    background-color: rgba(18, 55, 77, 0.7);
    border-radius: 25px;
    position: absolute;
    width: 128px;
    height: 48px;
}

.card-text-header {
    background-color: #ffffff;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    margin-bottom: 3px;
    width: 100%;
}

.card-text-body {
    background-color: #ffffff;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 30px;
    width: 100%;
}

.container {
    width: 90%;
}

.content-center {
    justify-content: center;
}

.copy-code {
    cursor: pointer;
    position: absolute;
    top: 14px;
    right: 20px;
}

.cur-pointer {
    cursor: pointer;
}

.d-block {
    display: block !important;
}

.d-inline-block {
    display: inline-block;
}

.d-none {
    display: none;
}

.discount-vip {
    position: absolute;
    top: 4px;
    right: 26px;
}

.disposicion {
    background: #00263d;
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
    color: #ffffff;
}

.div-btn {
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.div-back {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    display: inline-block;
    width: 64px;
    height: auto;
}

.div-bonos {
    background: hsla(0, 0%, 100%, .25);
    border-radius: 10px;
}

.div-list {
    position: absolute;
    border-radius: 15px;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.div-list:hover {
    background-color: rgba(22, 27, 41, .65);
}

.div-list:hover .div-btn {
    display: flex;
}

.div-nav {
    display: inline-block;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    width: auto;
}

.div-promos {
    /*background: rgba(46, 46, 46, 0.8);*/
    background: rgba(9, 25, 37, 1);
    border-radius: 10px;
}

.f-normal {
    font-weight: normal;
}

.f-bold {
    font-weight: 700;
}

.f-extrabold {
    font-weight: 800;
}

.f-light {
    font-weight: 300;
}

.f-mayus {
    text-transform: uppercase;
}

.f-size-7 {
    font-size: 0.7rem;
}

.float-l {
    float: left;
}

.float-r {
    float: right;
}

.font-openSans {
    font-family: Open Sans, sans-serif !important;
}

.font-SF-Pro {
    font-family: 'SF Pro Display', sans-serif;
}

.header-picks {
    background: #021e2f;
    height: 130px;
}

.header-section {
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    /*position: fixed;*/
    width: 100%;
    height: 360px;
    z-index: 10;
}

.header-section>div {
    border-top: none !important;
}

.header-section-home {
    background: #00263d;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 125px;
    z-index: 10;
}

.hero_right {
    margin-bottom: 1px;
}

.hide {
    display: none;
}

.highlight-todos {
    position: absolute;
    right: 0;
    padding-right: 20px;
}

.highlight-left {
    position: absolute;
    left: -10px;
    top: 20%;
    width: 50%;
    text-align: center;
}

.highlight-middle {
    position: absolute;
    left: 30%;
    right: 0;
    top: 35%;
    width: 40%;
    text-align: center;
}

.highlight-right {
    position: absolute;
    right: -10px;
    top: 20%;
    width: 50%;
    text-align: center;
}

.home-list {
    border-radius: 10px;
    width: 100%;
    height: 100%;
}

.home-list:hover {
    background: rgba(22, 27, 41, .65);
}

.home-footer {
    content: »;
    background-image: linear-gradient(0deg, rgba(0, 0, 0, .5), rgba(0, 0, 0, .5));
}

.hp-90 {
    height: 90%;
}

.hp-100 {
    height: 100%;
}

.hp-101 {
    height: 101%;
}

.ico-balance {
    width: 10vh;
}

.ico-balance-movil {
    width: 20%;
}

.ico-balance-web {
    width: 1rem;
}

.ico-profile {
    width: 20vh;
}

.ico-toogle {
    position: absolute;
    left: -36px;
}

.Imagenhero {
    max-width: 30% !important;
    margin-top: -85px;
}

.Imagenhero img {
    max-width: 148% !important;
}

.img-3x {
    position: absolute;
    object-fit: contain;
}

.img-3x-side {
    position: absolute;
    object-fit: contain;
}

.img-banner {
    display: block;
    height: 100%;
    object-fit: cover;
}

.img-banner-2 {
    top: 0;
    right: 0;
    position: absolute;
    object-fit: contain;
    opacity: 0.5;
}

.img-list {
    box-shadow: 0px 20px 33px -12px #707070;
    border-radius: 15px;
}

.img-patrocinador {
    width: 11.5vh;
}

.img-todas {
    display: block;
    border-radius: 15px;
    object-fit: cover;
    height: 100%;
}

.info-brackets {
    font-size: 1.2rem;
    margin-left: 10px;
}

.info-jackpot {
    cursor: pointer;
    position: absolute;
    top: 22px;
    left: 61%;
    width: 18px;
}

.info-jackpotText {
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 3%;
    width: 18px;
}

.info-partidos {
    width: auto;
    height: auto;
    border-radius: 20px;
}

.info-tiebreakers {
    cursor: pointer;
    position: absolute;
    top: 18px;
    left: 25%;
    width: 18px;
}

.info-tiebreakersText {
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 3%;
    width: 18px;
}

input[type="file"] {
    display: none;
}

.input-suscripcion {
    background: linear-gradient(#000, #000) padding-box,
        /*linear-gradient(90deg, rgba(0,95,255,1) 0%, rgba(66,33,227,1) 50%, rgba(102,0,212,1) 80%) border-box;*/
        linear-gradient(160deg, rgba(15, 0, 89, 1) 0%, rgba(4, 83, 218, 1) 50%, rgba(227, 249, 81, 1) 80%) border-box;
    border: solid 2px transparent;
    border-radius: 10px;
    color: #FFFFFF;
    display: inline-flex;
    justify-content: center;
    line-height: 108%;
    font-weight: 800;
    text-decoration: inherit;
    height: 54px;
    width: 300px;
}

.input-suscripcion::placeholder {
    color: #FFFFFF;
    opacity: 1;
    /* Firefox */
    padding-left: 20px;
}

.input-text {
    width: 95%;
    height: 50px;
    font-size: 1.2rem;
}

.item-icon {
    position: absolute;
    right: 8px;
    top: 18px;
    text-align: center;
    width: 10px;
    font-size: 10px;
}

.item-img {
    position: absolute;
    left: 16px;
    top: 12px;
    text-align: left;
    width: 26px;
    height: 26px;
}

.item-points {
    position: absolute;
    right: 6px;
    top: 12px;
    text-align: left;
    width: 26px;
    height: 26px;
    color: #000;
    padding: 6px;
}

.item-points-r {
    position: absolute;
    left: -25px;
    top: 12px;
    text-align: left;
    width: 26px;
    height: 26px;
    color: #000;
}

.item-text {
    position: absolute;
    right: 30px;
    top: 16px;
    text-align: center;
    width: 50px;
}

.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer;
}

.join-pool {
    position: absolute;
    top: 9px;
    right: 20px;
    width: auto;
    font-size: 0.6rem;
    text-transform: uppercase;
}

.left-161 {
    left: 161px;
}

.left-330 {
    left: 330px;
}

.left-408 {
    left: 408px;
}

.left-586 {
    left: 586px;
}

.letter-spcng-1 {
    letter-spacing: 1.3px;
}

.line-yellow {
    border-bottom: 16px solid rgba(220, 247, 0, 1);
}

.link-black {
    color: rgb(10 34 52/1)
}

.link-black:hover {
    color: rgb(50 97 189/1);
}

.link-black.active {
    background-color: rgb(50 97 189/1);
    border-radius: 10px;
    color: #ffffff;
    padding: 15px 20px;
}

.link-black.active:hover {
    color: rgb(255 234 42/1);
}

.link-blue {
    color: #ffffff;
}

.link-blue:hover {
    color: rgb(255 234 42/1);
}

.link-blue.active {
    background: rgba(227, 249, 81, 1);
    border-radius: 5px;
    color: rgba(0, 31, 83, 1);
    padding: 10px 10px;
}

.link-blue.active:hover {
    color: #005FFF
}

.ln-h-15 {
    line-height: 15px;
}

.ln-h-20 {
    line-height: 20px;
}

.ln-h-26 {
    line-height: 26px;
}

.ln-h-32 {
    line-height: 32px;
}

.ln-h-36 {
    line-height: 36px;
}

.ln-h-5r {
    line-height: 5rem;
}

.ln-h-97p {
    line-height: 97%;
}

.ln-h-100p {
    line-height: 100%;
}

.ln-h-108p {
    line-height: 108%;
}

.logo-duelazo-letra {
    position: absolute;
    left: -64px;
    right: 0;
    top: 336px;
    margin: 0 auto;
}

.logo-patrocinador {
    position: relative;
    width: 4.5vh;
}

.logo-patrocinador-quiniela {
    position: relative;
    width: 34%;
}

.logo-fase2-sport {
    position: absolute;
    left: -64px;
    right: 0;
    top: 0;
    margin: 0 auto;
}

.logo-fase2-text {
    position: absolute;
    left: -64px;
    right: 0;
    top: 80px;
    margin: 0 auto;
}

.logo-sport {
    position: relative;
    width: 100%;
}

.m-auto {
    margin: 0 auto;
}

.m-left-1_5p {
    margin-left: 1.5%;
}

.m-top-10 {
    margin-top: 10px;
}

.m-top-20 {
    margin-top: 20px !important;
}

.m-top-grey {
    border-color: #a0a0a0;
}

.marcador-bracket {
    position: absolute;
    top: 0;
    right: 16px;
    width: 3.5rem;
    height: 3.5rem;
}

.main-menu nav ul li {
    padding: 0;
    text-align: right;
}

.min-h-screen {
    min-height: 100vh;
}

.nav-promos {
    margin: 0;
    padding: 0;
    list-style: none;
}

.nav-promos li {
    display: inline-block;
    color: #ffffff;
    font-family: Open Sans, sans-serif !important;
    margin: 0 10px;
}

.object-contain {
    object-fit: contain
}

.object-cover {
    object-fit: cover;
}

.pad-0 {
    padding: 0;
}

.pad-5 {
    padding: 5px;
}

.pad-12 {
    padding: 12px !important;
}

.pad-left-1r {
    padding-left: 1rem;
    padding-right: 1rem;
}

.pad-lr-5 {
    padding: 0 5px !important;
}

.pad-right-1r {
    padding-right: 1rem;
    padding-left: 1rem;
}

.pad-top-show-quinielas {
    /*padding-top: 87%;*/
    padding-top: 0;
}

.pad-top-show-quinielas-home {
    padding-top: 25%;
}

.pad-top-10 {
    padding-top: 10px;
}

.pad-tb-10 {
    padding: 10px 0 !important;
}

.pad-top-1p {
    padding-top: 1%;
}

.pad-top-2p {
    padding-top: 2%;
}

.pad-top-3p {
    padding-top: 3%;
}

.pad-top-4p {
    padding-top: 4%;
}

.pad-top-5p {
    padding-top: 5%;
}

.pad-top-6p {
    padding-top: 6%;
}

.pad-top-10p {
    padding-top: 10%;
}

.pad-top-12p {
    padding-top: 12%;
}

.pad-top-15p {
    padding-top: 15%;
}

.pad-top-20p {
    padding-top: 20%;
}

.pad-left-neg-36 {
    padding-left: -36px;
}

.participants-all {
    list-style: none;
    margin: 0;
    padding: 0;
}

.patrocinador-img {
    position: absolute;
    bottom: 0;
    right: 0px;
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;
    width: 25%;
    z-index: 10;
    height: 30%;
    text-align: center;
    line-height: 52px;
    vertical-align: middle;
}

.phase2-button {
    position: absolute;
    left: -30px;
    right: 0;
    top: 480px;
}

.playera-bracket {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    right: 0;
}

.playera-streak {
    max-width: 55px;
    position: absolute;
    top: 4px;
    left: 6px;
    right: 0;
}

.pool-card {
    box-shadow: none;
    position: relative;
    bottom: -1px;
}

.pos-abs {
    position: absolute !important;
    top: 0;
    right: 0;
    left: 0;
}

.pos-abs-btm {
    position: absolute !important;
    bottom: 0;
    right: 0;
    left: 0;
}

.pos-abs-single {
    position: absolute !important;
}

.pos-rel {
    position: relative !important;
}

.posicion:hover {
    background: #2270ff;
}

.premios {
    min-height: 300px;
    height: auto;
    overflow-y: scroll;
    margin: 0;
}

.profile-fb {
    position: absolute;
    bottom: 20px;
    right: 20%;
}

.profile-fb img {
    width: 70%;
}

.profile-foto {
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    width: 60%;
}

.push {
    background: rgba(254, 219, 162, 0.7) !important;
    color: #000 !important;
}

.quinielas-bt {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    bottom: 0px !important;
    margin: 0 0px 0 10px;
    width: 94.5%;
    height: 40px;
}

.quinielas-picks-bt {
    width: 100%;
    height: 40px;
}

.quiniela-head {
    background: url(../img/backgrounds/bg-quiniela-head.png) repeat;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    color: #ffffff;
    position: relative;
    height: 190px;
}

.quiniela-jackpot {
    position: relative;
    text-align: left;
    left: 90px;
    width: 65%;
}

.quiniela-title,
.quiniela-subtitle {
    position: relative;
    text-align: left;
    left: 90px;
    width: 75%;
}

.quiniela-title {
    margin-top: 0;
}

.--bottom-status {
    background: #ffffff;
}

.--open {
    background: #1BB278;
}

.--open-pools {
    color: #1BB278;
}

.--running {
    background: #2E5EA2;
}

.--running-pools {
    color: #2E5EA2;
}

.--finished {
    background: #933235;
}

.--finished-pools {
    color: #933235;
}

.right-64 {
    right: 64px;
}

.right-229 {
    right: 229px;
}

.right-397 {
    right: 397px;
}

.right-474 {
    right: 474px;
}

.s-green {
    stroke: #44bf0d !important;
}

.s-red {
    stroke: #bf1a0d !important;
}

.show {
    display: block;
}

.space-blank-1 {
    position: absolute;
    width: 1px;
    padding: 32px 2px;
    top: 0;
    left: 64px;
}

.splide-img.sport {
    width: 50%;
}

.splide-img {
    width: 95%;
}

.sport-img {
    background: none !important;
    border-bottom-right-radius: 10px;
    position: absolute;
    overflow: hidden;
    top: 22%;
    left: 12px;
    width: 70px;
    height: 70px;
}

.sport-img2 {
    background: none !important;
    border-bottom-right-radius: 10px;
    position: absolute;
    overflow: hidden;
    top: 18%;
    left: 6px;
    width: 80px;
    height: 80px;
}

.stores {
    opacity: 1;
}

.stores:hover {
    opacity: 0.7;
}

.streak-bg-vip {
    background: rgba(28, 29, 30, 0.6) !important;
}

.streak-group {
    position: relative;
    width: 100%;
    height: 164px;
}

.streak-left {
    position: absolute;
    left: 0;
    right: 80%;
    top: 2%;
    bottom: 0;

    background: rgba(2, 30, 47, 0.6);
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
}

.streak-status {
    border: 1px solid;
    border-radius: 15px;
    margin-top: 5px;
}

.streak-up,
.streak-up-yesterday,
.streak-up-locked,
.streak-up-yesterday-locked {
    position: absolute;
    left: 21%;
    right: 0;
    top: 2%;
    bottom: 51%;

    background: rgba(2, 30, 47, 0.6);
    border-radius: 0px 50px 50px 0px;
}

.streak-down,
.streak-down-yesterday,
.streak-down-locked,
.streak-down-yesterday-locked {
    position: absolute;
    left: 21%;
    right: 0;
    top: 53%;
    bottom: 0;
    color: #FFFFFF;
    background: rgba(2, 30, 47, 0.6);
    border-radius: 0px 50px 50px 0px;
}

.streak-up:hover,
.streak-down:hover {
    background: #FEDBA2;
    color: #000;
}

.streak-up.active,
.streak-down.active {
    background: #FEDBA2;
    color: #000;
}

.streak-up.answer,
.streak-down.answer {
    background: rgba(81, 232, 174, 0.4);
    color: #000;
}

.streak-up.sucess,
.streak-down.sucess {
    background: #51E8AE;
    color: #000;
}

.streak-up.fail,
.streak-down.fail {
    background: #E8516C;
    color: #000;
}

.streak-up-locked.fail,
.streak-down-locked.fail {
    background: #E8516C;
    color: #000;
}

.streak-up-locked:hover,
.streak-down-locked:hover {
    color: #FFFFFF;
}

.streak-up-yesterday-locked:hover,
.streak-down-yesterday-locked:hover {
    color: #FFFFFF;
}

.streak-up-locked.answer,
.streak-down-locked.answer,
.streak-up-yesterday.answer,
.streak-down-yesterday.answer,
.streak-up-yesterday-locked.answer,
.streak-down-yesterday-locked.answer {
    background: rgba(81, 232, 174, 0.4);
    color: #000;
}

.streak-up-locked.answer-failed,
.streak-down-locked.answer-failed,
.streak-up-yesterday.answer-failed,
.streak-down-yesterday.answer-failed,
.streak-up-yesterday-locked.answer-failed,
.streak-down-yesterday-locked.answer-failed {
    background: #E8516C;
    color: #000;
}

.streak-icon-plus {
    position: absolute;
    top: 30px;
    right: 26px;
}

.swal-modal {
    background-color: rgba(67, 112, 144, 0.7);
    border-radius: 30px;
    color: #fff;
}

.swal-button--confirm {
    padding: 7px 20px;
    border-radius: 10px;
    background-color: rgba(9, 27, 54, 0.6);
    color: #fff;
    font-size: 1.3rem;
}

.swal-button--cancel {
    padding: 7px 20px;
    border-radius: 10px;
    background-color: transparent;
    color: #fff;
    font-size: 1.3rem;
}

.swal-button--cancel:not([disabled]):hover {
    background-color: transparent;
    color: #000;
}

.swal-title {
    color: #fedba2;
    font-size: 2.5rem;
}

.swal-text {
    color: #fff;
    font-size: 1.5rem;
    text-align: center;
}

.t-center {
    text-align: center;
}

.t-justify {
    text-align: justify;
}

.t-left {
    text-align: left;
}

.t-right {
    text-align: right;
}

.t-indent-10 {
    text-indent: 10px;
}

.t-indent-10p {
    text-indent: 10%;
}

.t-indent-36 {
    text-indent: 36px;
}

.testimonial-participant {
    bottom: 4rem;
    left: 0;
    right: 0;
}

.testimonial-rating {
    top: 3rem;
}

.testimonial-text {
    top: 8rem;
}

.top-18neg {
    top: -18px;
}

.top-0 {
    top: 0;
}

.top-4 {
    top: 4px;
}

.top-38 {
    top: 38px;
}

.top-68 {
    top: 68px;
}

.top-76 {
    top: 76px;
}

.top-124 {
    top: 124px;
}

.top-144 {
    top: 144px;
}

.top-164 {
    top: 164px;
}

.top-165 {
    top: 165px;
}

.top-200 {
    top: 200px;
}

.top-219 {
    top: 219px;
}

.top-220 {
    top: 220px;
}

.top-237 {
    top: 237px;
}

.top-275 {
    top: 275px;
}

.top-294 {
    top: 294px;
}

.top-315 {
    top: 315px;
}

.top-350 {
    top: 350px;
}

.top-378 {
    top: 378px;
}

.top-387 {
    top: 387px;
}

.top-434 {
    top: 434px;
}

.top-454 {
    top: 454px;
}

.top-475 {
    top: 475px;
}

.top-510 {
    top: 510px;
}

.top-548 {
    top: 548px;
}

.v-align-super {
    vertical-align: super;
}

.v-align-middle {
    vertical-align: middle;
}

.teams {
    background: url(../img/backgrounds/bg-teams.png) repeat;
    color: #ffffff;
}

.team-name span {
    font-size: 0.75rem;
    text-align: center;
}

.teams-final {
    border-bottom-left-radius: 15px;
    ;
    border-bottom-right-radius: 15px;
}

.team-shield {
    width: 7.5vh;
}

.team-img-shield {
    max-width: 50%;
    position: relative;
    top: 0;
    right: 0;
    text-align: center;
}

.text-banner {
    background: linear-gradient(90deg, rgba(0, 8, 18, 0.95) 10%, rgba(12, 27, 58, 0) 50%);
    background-blend-mode: multiply;

}

.text_hero {
    margin-top: 1%;
}

.text_hero>p:nth-child(2) {
    padding-bottom: 1%;
}

.text_hero>p:nth-child(3) {
    padding-bottom: 1%;
}

.text-profile {
    background: url(../img/backgrounds/bg-profile.png) repeat;
    border-radius: 40px;
}

.container-yellow {
    perspective: 500px;
    /* Adjust for desired depth */
    transform-style: preserve-3d;
}

.sub-container-yellow {
    background-color: #005FFF;
    width: 100px;
    height: 100px;
    transform: rotate3d(1, 1, 1, 45deg);
}

.text-yellow {
    background-image: linear-gradient(90deg, #FFEA00 -1.48%, #B3FF00 110.2%);
    -webkit-background-clip: text;
    background-clip: text;
    border: 3px solid;
    border-image-source: linear-gradient(90deg, #FFEA00 -1.48%, #B3FF00 110.2%);
    -webkit-text-fill-color: transparent;
    -webkit-text-fill-color: transparent;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    transform: rotate3d(1, 1, 1, 45deg);
}

.-top-15 {
    top: -15px;
}

ul.no-style {
    list-style: none;
}

.v-align-middle {
    vertical-align: middle;
}

.w-212 {
    width: 212px;
}

.wp-5 { width: 5%; }
.wp-8 { width: 8%; }
.wp-10 { width: 10%; }
.wp-15 { width: 15%; }
.wp-20 { width: 20%; }
.wp-22 { width: 22%; }
.wp-24 { width: 24%; }
.wp-26 { width: 26%; }
.wp-28 { width: 28%; }
.wp-30 { width: 30%; }
.wp-32 { width: 32%; }
.wp-34 { width: 34%; }
.wp-36 { width: 36%; }
.wp-38 { width: 38%; }
.wp-40 { width: 40%; }
.wp-42 { width: 42%; }
.wp-44 { width: 44%; }
.wp-46 { width: 46%; }
.wp-48 { width: 48%; }
.wp-50 { width: 50%; }
.wp-52 { width: 52%; }
.wp-54 { width: 54%; }
.wp-56 { width: 56%; }
.wp-58 { width: 58%; }
.wp-60 { width: 60%; }
.wp-65 { width: 65%; }
.wp-70 { width: 70%; }
.wp-80 { width: 80%; }
.wp-90 { width: 90%; }
.wp-95 { width: 95%; }
.wp-100 { width: 100%; }
.wp-120 { width: 120%; }

.z-index-0 {
    z-index: 0 !important;
}

/* Lightbox Personal */
.lightbx {
    z-index: 99;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(9, 38, 74, 0.7);
    justify-content: center;
    align-items: center;
    vertical-align: center;
    text-align: center;
}

.lightbx-content {
    z-index: 99999;
    border: 2px solid #fff;
    width: 80%;
    height: auto;
    position: relative;
    background-color: #05173B;
    margin: 42% auto 0;
    overflow: hidden;
}

/* Lightbox Personal */

/* Tooltip */
/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
    /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltiptext {
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    padding: 5px;
    border-radius: 6px;
    font-size: 0.8rem;

    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 1;
}

/* Tooltip */

/* Scrollbar */
/* Estilos para motores Webkit y blink (Chrome, Safari, Opera... )*/
.contenedor::-webkit-scrollbar {
    -webkit-appearance: none;
}

.contenedor::-webkit-scrollbar:vertical {
    width: 10px;
}

.contenedor::-webkit-scrollbar-button:increment,
.contenedor::-webkit-scrollbar-button {
    display: none;
}

.contenedor::-webkit-scrollbar:horizontal {
    height: 6px;
}

.contenedor::-webkit-scrollbar-thumb {
    background-color: #021E2F;
    /* 021E2F */
    border-radius: 20px;
    border: 2px solid #021E2F;
}

.contenedor::-webkit-scrollbar-track {
    border-radius: 10px;
}

/* Scrollbar */

/* Credit Card */
.has-error input {
    border-width: 2px;
}

.validation.text-danger:after {
    content: 'Validation failed';
    color: #770808;
}

.validation.text-success:after {
    content: 'Validation passed';
    color: chartreuse;
}

/* Credit Card */

/* Code number */
.number-code>div {
    display: flex;
}

.number-code>div>input:not(:last-child) {
    margin-right: calc(16px);
}

.code-input {
    background-color: #698295;
    border-radius: 14px;
    border: 4px solid #698295;
    color: #fff;
    font-size: 1.5em;
    width: 2em;
    text-align: center;
    padding: 8px;
    flex: 1 0 1em;
}

/* Code number */

@media (min-width: 480px) and (max-width: 768px) {
    .header-section {
        height: 315px;
    }

    .pad-top-show-quinielas {
        /*padding-top: 38%;*/
        padding-top: 0;
    }

    .pad-top-show-quinielas-home {
        padding-top: 19%;
    }

    .quiniela-title {
        margin-top: 5px;
    }

    .splide-img.sport {
        width: 50%;
    }

    .splide-img {
        width: 95%;
    }

    .lightbx-content {
        z-index: 99999;
        border: 2px solid #fff;
        width: 40%;
        height: auto;
        position: relative;
        background-color: #05173B;
        margin: 30% auto 0;
        overflow: hidden;
    }

    .img-patrocinador {
        width: 11.5vh !important;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .btn-balance {
        padding: 7px 30px !important;
    }

    .header-section {
        height: 325px;
    }

    .pad-top-show-quinielas {
        /*padding-top: 38%;*/
        padding-top: 0;
    }

    .pad-top-show-quinielas-home {
        padding-top: 19%;
    }

    .quiniela-title {
        margin-top: 5px;
    }

    .splide-img.sport {
        width: 50%;
    }

    .splide-img {
        width: 95%;
    }

    .lightbx-content {
        z-index: 99999;
        border: 2px solid #fff;
        width: 50%;
        height: auto;
        position: relative;
        background-color: #05173B;
        margin: 24% auto 0;
        overflow: hidden;
    }

    .img-patrocinador {
        width: 7.5vh;
    }
}

@media (min-width: 1024px) and (max-width: 1280px) {
    .btn-balance {
        padding: 7px 10px !important;
    }

    .header-section {
        height: 350px;
    }

    .main-menu nav ul li {
        padding: 0 0.1rem;
    }

    .pad-top-show-quinielas {
        /*padding-top: 31%;*/
        padding-top: 0;
    }

    .pad-top-show-quinielas-home {
        padding-top: 14%;
    }

    .quiniela-title {
        margin-top: 5px;
    }

    .splide-img.sport {
        width: 50%;
    }

    .splide-img {
        width: 95%;
    }

    .lightbx-content {
        z-index: 99999;
        border: 2px solid #fff;
        width: 40%;
        height: auto;
        position: relative;
        background-color: #05173B;
        margin: 18% auto 0;
        overflow: hidden;
    }

    .img-patrocinador {
        width: 7.5vh;
    }

    .testimonial-text {
        top: 5rem;
        width: 80%;
    }
}

@media (min-width: 1280px) {
    .btn-balance {
        padding: 7px 10px !important;
    }

    .header-section {
        height: 30%;
    }

    .main-menu nav ul li {
        padding: 0 0.6rem;
    }

    .pad-top-show-quinielas {
        /*padding-top: 24%;*/
        padding-top: 0;
    }

    .pad-top-show-quinielas-home {
        padding-top: 7%;
    }

    .quiniela-title {
        margin-top: 5px;
    }

    .splide-img.sport {
        width: 30%;
    }

    .splide-img {
        width: 95%;
    }

    .lightbx-content {
        z-index: 99999;
        border: 2px solid #fff;
        width: 30%;
        height: auto;
        position: relative;
        background-color: #05173B;
        margin: 12% auto 0;
        overflow: hidden;
    }

    .img-patrocinador {
        width: 7.5vh;
    }

    .testimonial-text {
        top: 5rem;
        width: 80%;
        font-size: 7px;
    }
}

@media only screen and (min-width: 1440px) {

    /* styles for browsers larger than 1440px; */
    .img-patrocinador {
        width: 12vh;
    }
}

/* Lanscsape */
@media (min-width: 480px) and (max-width: 768px) and (orientation: landscape) {
    .pad-bottom-highlights {
        padding-bottom: 100px !important;
    }
}

/* Ajustes visuales al modal de alerta */
.swal-overlay {
    z-index: 999999992 !important;
}

.swal-icon--success:before {
    background: transparent;
}

.swal-icon--success:after {
    background: transparent;
}

.swal-icon--success__hide-corners {
    background: transparent;
}

/* Animations */
.animate-bottom {
    animation-duration: 2s;
    animation-delay: 0s;
    animation-name: slidebottom;
}

.animate-top {
    animation-duration: 2s;
    animation-delay: 0s;
    animation-name: slidetop;
}

.animate-left {
    animation-duration: 2s;
    animation-delay: 0s;
    animation-name: slideleft;
}

.animate-right {
    animation-duration: 2s;
    animation-delay: 0s;
    animation-name: slideright;
}

.animate-fade-in {
    opacity: 1;
    animation-name: fadeInOpacity;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: 2.2s;
}

@keyframes slidebottom {
    from {
        translate: 0 -150vw;
        scale: 200% 1;
    }

    to {
        translate: 0 0;
        scale: 100% 1;
    }
}

@keyframes slidetop {
    from {
        translate: 0 150vw;
        scale: 200% 1;
    }

    to {
        translate: 0 0;
        scale: 100% 1;
    }
}

@keyframes slideleft {
    from {
        translate: 150vw 0;
        scale: 200% 1;
    }

    to {
        translate: 0 0;
        scale: 100% 1;
    }
}

@keyframes slideright {
    from {
        translate: -150vw 0;
        scale: 200% 1;
    }

    to {
        translate: 0 0;
        scale: 100% 1;
    }
}

@keyframes fadeInOpacity {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}