:root {
    --blue: #28a6a9;
    --darker: #124d4e;
    --dark: #3a3a3a;
    --grey: #f9f9f9;
    --orange: #fdc836;
}

body {
    font-family: 'Gudea', sans-serif;
    color: var(--dark);
}

@media (min-width: 1300px) {
    .container {
        max-width: 1240px;
    }
}

@media (min-width: 1400px) {
    .container {
        max-width: 1300px;
    }
}

section.tablas {
    font-weight: 500;
    font-size: 15px;
}

a {
    color: inherit;
    transition: .3s;
}

.text-blue {
    color: var(--blue);
}

a:hover {
    color: var(--darker);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
}

h1,
h2,
h3 {
    font-weight: 700;
    margin: 0;
    color: var(--blue);
}

h2 {
    font-size: 3rem;
}

.h7 {
    font-size: 18px;
}

h3 {
    color: var(--blue);
}

footer h5 {
    color: var(--blue);
}

.title h3 {
    margin-bottom: 15px;
}

.fw-6 {
    font-weight: 600;
}

.fw-7 {
    font-weight: 700;
}

.btn.btn-primary {
    font-weight: 700;
}

.fs-18 {
    font-size: 18px;
}

.j-left-md {
    justify-content: left !important;
}

.j-right {
    justify-content: right !important;
}

.j-center {
    justify-content: center !important;
}

img {
    vertical-align: center;
    max-width: 100%;
}

.form-control {
    border-color: var(--blue);
}

.btn-primary {
    background: var(--blue);
    border-color: var(--blue);
    white-space: normal;
    color: white !important;
}

.btn-primary:not(:disabled):not(.disabled):active,
.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--darker);
}

a.btn-primary:hover,
.btn-primary:hover {
    background: white;
    color: var(--blue) !important;
    border-color: var(--blue);
}

.social-media {
    list-style-type: none;
    display: flex;
    justify-content: center;
    padding: 0;
    margin: 0;
}

.social-media li {
    font-size: 1.3rem;
    margin: 0 20px;
    color: var(--blue);
}

.ion-icon {
    font-size: 1.3rem;
    padding-top: 3px;
}

.popup {
    position: absolute;
    font-size: 40px;
    color: #fff;
    opacity: 1;
    right: 15px;
}

.img-popup {
    width: 300px;
    height: 300px;
}

/* 4 columns */

.col-xs-14,
.col-sm-14,
.col-md-14,
.col-lg-14,
.col-xl-14 {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-14 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}


@media (min-width: 576px) {
    .col-sm-14 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (min-width: 768px) {
    .col-md-14 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (min-width: 992px) {
    .col-lg-14 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (min-width: 1200px) {
    .col-xl-15 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}


/* 5 columns */

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15,
.col-xl-15 {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-15 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

@media (min-width: 576px) {
    .col-sm-15 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}

@media (min-width: 768px) {
    .col-md-15 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}

@media (min-width: 992px) {
    .col-lg-15 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}

@media (min-width: 1200px) {
    .col-xl-15 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}


/* 6 columns */

.col-xs-16,
.col-sm-16,
.col-md-16,
.col-lg-16,
.col-xl-16 {
    position: relative;
    width: 50%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-16 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16%;
    flex: 0 0 16%;
    max-width: 16%;
}

@media (min-width: 576px) {
    .col-sm-16 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16%;
        flex: 0 0 16%;
        max-width: 16%;
    }
}

@media (min-width: 768px) {
    .col-md-16 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16%;
        flex: 0 0 16%;
        max-width: 16%;
    }
}

@media (min-width: 992px) {
    .col-lg-16 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16%;
        flex: 0 0 16%;
        max-width: 16%;
    }
}

@media (min-width: 1200px) {
    .col-xl-16 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16%;
        flex: 0 0 16%;
        max-width: 16%;
    }
}

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


/* top navigation */

.registar.btn {
    color: #FFF;
    font-size: 18px;
    padding: 8px;
    border-radius: 10px;
    background-color: #ff8300;
    border-color: #ff8300;
    font-weight: 600;
    filter: contrast(4.5);
}

.login.btn {
    font-size: 18px;
    color: #fff;
    padding: 8px;
    border-radius: 10px;
    background-color: #224E87 !important;
    border-color: #0084D4;
    font-weight: 600;
}

nav.top-navigation.navbar {
    background: var(--blue);
    color: white;
    box-shadow: 0px 2px 5px -1px rgba(0, 0, 0, 0.54);
}

nav.top-navigation.navbar .navbar-brand {
    width: 100%;
}

nav li.nav-item {
    margin-right: 10px;
    padding: 5px 0;
    border-bottom: 2px solid var(--blue);
    transition: .3px;
}

nav.top-navigation.navbar a.btn {
    color: white;
}

nav.top-navigation.navbar .navbar-toggler {
    color: white;
}

nav .dropdown-menu {
    background-color: var(--blue);
    border: none;
    border-radius: 0;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    padding: 0;
    top: 100%;
    padding-bottom: 10px;
    box-shadow: none;
}

nav .dropdown-menu a {
    color: white;
}


/* top navigation end */


/* header */

header.top-header {
    background-image: url('../img/slider.jpg');
    background-size: cover;
    background-position: center;
    color: white;
}

header.top-header .container {
    border-radius: 0;
    background-color: rgba(0, 0, 0, 0.7);
}

header.top-header a.btn {
    width: 100%;
}

header.top-header a.btn:hover {
    color: var(--blue);
}


/* header end */


/* content */

section {
    margin: 40px 0;
}

section:not(.featured-ad) .container {
    background: var(--grey);
    border-radius: 0;
    padding: 40px;
    border: 1px solid gainsboro;
    box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.08);
}

.container.ad-container {
    background: var(--grey);
    border-radius: 0;
    padding: 5px !important;
    border: 1px solid #28a6a9 !important;
    box-shadow: 0px 0px 11px 0px rgb(0 0 0 / 8%);
}

section .section-title {
    flex-direction: column;
}

table.resultados {
    width: 100%;
    text-align: center;
    border-collapse: separate;
    border-spacing: 5px;
    transition: .3s;
    border-radius: 3px;
    padding: 10px;
}

table.resultados:hover {
    transform: scale(1.02);
    background: #7fd0d2;
    color: var(--black);
    font-weight: 600;
}

table.resultados:hover th {
    background: var(--blue);
    color: white;
}

table.resultados:hover td.hora {
    color: var(--blue);
}

table.resultados th {
    padding: 10px;
    border: 1px solid var(--blue);
    color: var(--blue);
    border-radius: 3px;
    background: white;
    transition: .3s;
}

table.resultados td {
    padding: 9px;
    background: white;
    border-radius: 3px;
    border: 1px solid gainsboro;
}

@media (max-width: 769px) {
    table.resultados thead tr {
        text-align: center !important;
    }
    .img-48 {
        max-height: 36px !important;
    }
}

@media (max-width: 576px) {
    table.resultados tbody tr.ingrid {
        display: inline-grid !important;
        width: 50%;
    }
    table.resultados {
        border-collapse: collapse;
    }
    .img-popup {
        width: 400px;
        height: 400px;
    }
    .j-left-md {
        justify-content: center !important;
    }
}

@media (max-width: 420px) {
    .img-popup {
        width: 100%;
        height: 100%;
    }
}

.inline-grid {
    display: inline-grid !important;
}

.circle img {
    width: 100%;
    border-radius: 50%;
}

.circle {
    border: 5px solid var(--blue);
    border-radius: 50%;
    position: relative;
    padding: 5px;
    margin: 0 auto;
    width: 85%;
}

.circle .number {
    font-size: 3rem;
    font-weight: bold;
    position: absolute;
    top: 0;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.lotto-activo>.container>.row>div {
    transition: .3s;
}

.lotto-activo>.container>.row>div:hover {
    transform: scale(1.05);
}

.accordion .card {
    border-radius: 4px !important;
    margin-bottom: 10px;
    border: 1px solid gainsboro !important;
    border-bottom: 1px solid gainsboro !important;
}

.accordion .card-header {
    background: transparent;
    border-bottom: none;
}

.accordion .card-header .btn {
    white-space: normal;
    text-align: left;
    font-weight: 600;
}

.accordion .card-body {
    border-top: 1px solid gainsboro;
}

.accordion .card-header button {
    color: var(--dark);
}

.input-group-append,
.input-group-prepend {
    display: -ms-flexbox;
    display: flex;
    background: var(--blue);
    color: white;
    padding: 5px 15px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.datos .card {
    display: inline-block;
    width: 100%;
}

.datos .card img {
    display: inline-block;
    height: 160px;
    padding: 15px;
}

.datos .card a {
    display: block;
}

img.dato-single {
    max-width: 150px;
    border-radius: 4px;
}

.noticias>div:not(.ad-img) img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    object-position: center;
}

.noticias h3 {
    font-weight: normal;
}

.pagination li {
    display: inline-block;
    margin-bottom: 6px;
}

.page-item.active .page-link {
    background: var(--blue);
    border-color: var(--blue);
}

.page-link {
    margin: 0 3px;
    border-radius: 3px;
}

.page-link,
.page-link:hover {
    color: var(--blue);
}

.noticia-featured {
    margin: -40px -40px 0 -40px;
}

.noticia-featured img {
    object-fit: cover;
    object-position: center;
    height: 400px;
    width: 100%;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.title .social-media li {
    margin: 0 5px;
}

.featured-ad {
    background: var(--blue);
    color: white;
}

.featured-ad h3 {
    color: white;
}

.featured-ad .btn-primary {
    border-color: white;
}

.circle-legend>h4 {
    font-size: 25px;
}


/* content end */


/* misc */

.date-picker-wrapper {
    box-shadow: none;
    background: white;
    border-radius: 4px;
    border-color: gainsboro;
    margin-top: 15px;
}

.date-picker-wrapper .drp_top-bar .apply-btn {
    background: var(--blue);
    border: none;
    padding: 5px 10px;
}

.date-picker-wrapper table .caption {
    color: var(--darker);
}

.date-picker-wrapper .month-wrapper table .week-name {
    color: var(--blue);
}

.date-picker-wrapper .month-wrapper .week-name th {
    font-weight: normal;
    padding-bottom: 20px;
}

.date-picker-wrapper tbody {
    padding-top: 10px;
}

.date-picker-wrapper .month-wrapper {
    border: none;
}

.date-picker-wrapper .month-wrapper table .day {
    padding: 8px;
}

.date-picker-wrapper .first-date-selected,
.date-picker-wrapper .last-date-selected {
    background-color: var(--darker) !important;
}

.date-picker-wrapper .month-wrapper table .day.checked {
    background: var(--blue);
}

.dataTables_length select,
.dataTables_filter input {
    padding: 2px 10px;
    border: 1px solid gainsboro;
    padding: 0 -40px;
}

.semanal img {
    border-radius: 50%;
    max-width: 70px;
    margin: 0 auto;
}

#table_wrapper {
    margin: 0 -40px;
}

.dataTables_scroll {
    margin: 20px 0;
}

table.dataTable thead th,
table.dataTable tfoot th {
    color: var(--darker);
}

table.dataTable thead th,
table.dataTable thead td,
.dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-color: var(--blue);
}

table.dataTable.no-footer {
    border-color: var(--blue);
}

table.dataTable.dtr-inline.collapsed>tbody>tr[role="row"]>td:first-child:before,
table.dataTable.dtr-inline.collapsed>tbody>tr[role="row"]>th:first-child:before {
    background: var(--blue);
}

table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before,
table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th:first-child:before {
    background: var(--darker);
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    border-color: gainsboro;
    background: white;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--blue);
    border-color: var(--darker);
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 4px 12px;
}

#page-search {
    width: 200px;
    display: inline-block;
    margin-left: 20px;
    border-color: gainsboro;
}

table.historico2 thead th {
    color: white;
}

table.historico2.display tbody tr:first-child th {
    border-top: 1px solid #ddd;
}

table.historico2 thead tr {
    background: var(--blue);
}

table.historico2.display tbody tr.odd {
    background: #90a7a0;
}

table.historico2.display tbody td {
    border-right: 1px solid #ddd;
}

table.historico2 thead tr:hover {
    background: var(--blue);
}

table.historico2.display th.hora {
    background: var(--blue);
    color: white;
}

table.historico2 tr.border-top td {
    /* background: blue !important; */
    border-top: 1px solid var(--blue);
}


/* misc end */


/* footer */

footer {
    background: var(--grey);
    padding-top: 40px;
    border-top: 1px solid gainsboro;
}

ul.footer-links li {
    padding-bottom: 5px;
}

footer form .form-control {
    border: none;
    border-bottom: 1px solid gainsboro;
    margin-bottom: 10px;
}

footer form .form-control:focus {
    box-shadow: none;
    border-bottom: 1px solid var(--blue);
}

footer form input[type="submit"] {
    background: var(--blue);
    color: white;
    cursor: pointer;
}

footer .bottom {
    border-top: 1px solid gainsboro;
    font-size: .95rem;
}

.red,
.rojo {
    color: #b50c11 !important;
}

.black,
.negro {
    color: black !important;
}

.green,
.verde {
    color: var(--success) !important;
}

.white,
.blanco {
    color: white !important;
}
.orange,
.naranjado {
    color: var(--orange) !important;
}

.lottoactivo,
.lottoactivordint,
.lottoactivordominicana {
    color: #083206 !important;
    border-color: #083206;
}

.lagranjita {
    color: #5cb85c !important;
    border-color: #5cb85c;
}

.ruletaactiva {
    color: #035c11 !important;
    border-color: #035c11;
}

.junglamillonaria {
    color: #c18823 !important;
    border-color: #c18823;
}

h3[class^='lottoactivo2'],
div[class^='lottoactivo2']  {
    color: #083206 !important;
    border-color: #083206;
}

.selvaplus {
    color: #1726bb !important;
    border-color: #1726bb;
}

.guacharoactivo {
    color: #75a60c !important;
    border-color: #75a60c;
}

.la-ricachona {
    color: #79067b !important;
    border-color: #79067b;
}

.chanceconanimalitos {
    color: #bd1d20 !important;
    border-color: #bd1d20;
}

.cazaloton {
    color: #048e00 !important;
    border-color: #048e00;
}

.megaanimal40 {
    color: #210793 !important;
    border-color: #210793;
}

.granjamillionaria {
    color: #e77f21 !important;
    border-color: #e77f21;
}

.centenaanimalitos {
    color: #0050c0 !important;
    border-color: #0050c0;
}

.centenaplus {
    color: #0050c0 !important;
    border-color: #0050c0;
}

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

.small-img {
    vertical-align: center;
    max-width: 25%;
    max-height: 25%;
}

.box {
    border: 1px solid var(--blue);
    border-radius: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.border-bt-2 {
    border-bottom: 2px solid rgba(0, 0, 0, .125);
}


/* footer end */

.fortuna {
    width: 150px;
    height: 80px;
}

.fortuna-text {
    font-size: 40px;
}

@media (max-width: 769px) {
    .fortuna-text {
        font-size: 30px;
    }
}

@media (max-width: 576px) {
    .fortuna-text {
        font-size: 25px;
    }
}

.container.py-5.ads {
    background: var(--blue) !important;
}

.int-bg {
    background: #991205;
    border-color: #991205;
    white-space: normal;
    color: white !important;
}

.img-48 {
    max-height: 48px !important;
}

@media (max-width: 576px) {
    .img-48 {
        max-height: 36px !important;
    }
}

.scrollToTop {
    width: 40px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    z-index: 9999;
    bottom: 30px;
    right: 30px;
    font-size: 18px;
    position: fixed;
    -webkit-transform: translateY(150px);
    transform: translateY(150px);
    background: var(--blue);
    border-radius: 3px;
}

.scrollToTop:hover {
    color: #fff;
}

.scrollToTop.active {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation: bounceInDown 2s;
    animation: bounceInDown 2s;
}

.shop-page-wraper {
    padding-bottom: 25px;
    padding-top: 60px;
}


/* SHOP CUSTOMED CSS START */

.product-image span.onsale {
    background: #ffffff none repeat scroll 0 0;
    border: 2px solid #e23e57;
    border-radius: 25px;
    box-shadow: none;
    color: #e23e57;
    font-family: Open Sans, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 24px;
    left: 20px;
    line-height: 20px;
    min-height: auto;
    min-width: auto;
    padding: 0 15px;
    position: absolute;
    right: auto;
    text-shadow: none;
    text-transform: uppercase;
    top: 20px;
    z-index: 99;
}

.shop-page-product-area #list .single-product-area {
    margin-bottom: 20px;
}

.quantity input {
    background: #e5e5e5 none repeat scroll 0 0;
    border: medium none;
    border-radius: 3px;
    color: #6f6f6f;
    font-size: 15px;
    font-weight: normal;
    height: 32px;
    padding: 0 5px 0 10px;
    width: 60px;
}

.stock {
    color: #007600 !important;
}

@media (min-width: 992px) and (max-width: 1200px) {
    .home-one .header-bottom-area .category-wrapper {
        display: inline-table;
    }
}

.mobile-bottom-nav {
    display: none;
}

@media (max-width: 991px) {
    .mobile-bottom-nav {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1000;
        /*give nav it's own compsite layer*/
        will-change: transform;
        transform: translateZ(0);
        display: flex;
        height: 50px;
        box-shadow: 0 -2px 5px -2px #333;
        background-color: #fff;
        color: #38a4dd;
    }
    .mobile-bottom-nav__item {
        flex-grow: 1;
        text-align: center;
        font-size: 16px;
        font-weight: 500;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        width: 50%;
    }
    .mobile-bottom-nav__item-content.active {
        background: #3fbaee;
        color: #fff;
    }
    .mobile-bottom-nav__item-content {
        background: #fff;
    }
    /*     .mobile-bottom-nav__item__item--active {
        color: red;
    }
    .mobile-bottom-nav__item__item-content {
        display: flex;
        flex-direction: column;
    } */
    .btn-sticky-left {
        /* background: linear-gradient( 0deg, #2400f1 39%, #4e31ef 70%, #6750ea 88%) !important;
        border-radius: 0 5px 5px 0;
        box-shadow: 0 0 25px rgb(37 37 37 / 40%);
        bottom: 0;
        position: fixed;
        top: 32%;
        z-index: 99; */
        padding-bottom: 10px;
    }
    .sub-menu {
        display: none;
        padding-left: 25px;
        background: #fff;
    }
    .submenu.active {
        display: block;
        opacity: 1;
        visibility: visible;
        background-color: var(--main);
    }
    ul.responsive-menu.sub-menu.active {
        display: block;
        visibility: visible;
        opacity: 1;
        /*margin-top: 10px;*/
        padding-left: unset;
    }
    li.active {
        border-bottom: 1px solid #dee2e6;
        padding: 5px;
    }
    li.active:hover {
        border-bottom: 1px solid #3fbaee;
        color: #fff;
        padding: 5px;
    }
}

/* SHOP CUSTOMED CSS END */

/* LOTO CUSTOMED CSS START */

span.kingo {
    border: 2px solid;
    border-color: #28a6a9;
    padding: 7px;
    border-spacing: 0px !important;
    letter-spacing: 0px !important;
    margin: -1px;
    line-height: 20px;
    width: 38px !important;
    display: inline-block;
}

img.corona {
    width: 25px !important;
    margin: -2px !important;
    max-width: unset;
}

/* LOTO CUSTOMED CSS END */

/* ADS PEGA5 START */


.line1 {
    width: 100%;
    /*height: 3rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    margin: 30% 0 0 0;
}

.line2 {
    width: 100%;
    /*height: 3rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    margin: -1% 0 0 0;
}

.line3 {
    width: 100%;
    /*height: 3rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    margin: 10% 0 0 0;
}

.num1 {
    width: 2rem;
    /*height: 2rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    margin: 0% 0 0 0%;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
}

.num2 {
    width: 2rem;
    /*height: 2rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    margin: 0% 0 0 15%;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
}

.num3 {
    width: 2rem;
    /*height: 2rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    margin: 0% 0 0 15%;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
}

.num4 {
    width: 2rem;
    /*height: 2rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    margin: 0% 0 0 15%;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
}

.image1 {
    width: 2.6rem;
    /*height: 2.6rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    margin: 0% 0 0 0%;
    color: #fff;
}

.image2 {
    width: 2.6rem;
    /*height: 2.6rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    margin: 0% 0 0 10%;
    color: #fff;
}

.image3 {
    width: 2.6rem;
    /*height: 2.6rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    margin: 0% 0 0 10%;
    color: #fff;
}

.outline {
    width: 280px;
    height: 280px;
    display: inline-block;
    border: none;
    margin: 5% 0 0 5%;
    background-size: contain;
}

.trio-res {
    width: 4.5rem;
}

.trio-num {
    width: 2.5rem;
}

@media (max-width: 576px) {
    .line1 {
        /*height: 2rem;*/
    }

    .line2 {
        /*height: 2.6rem;*/
    }

    .line3 {
        margin: 12% 0 0 0;
    }

    .num2,
    .num4 {
        margin: 0% 0 0 30%;
        ;
    }
    .num3 {
        margin: 0% 0 0 0%;
        ;
    }

    .image2,
    .image3 {
        margin: 0% 0 0 4%;
        ;
    }

    .outline {
        width: 300px;
        height: 300px;
        display: inline-block;
        border: none;
        margin: 5% 0 0 5%;
        background-size: contain;
    }

    .trio-res {
        width: 3.6rem;
    }

    .trio-num {
        width: 2rem;
    }
}
@media (max-width: 350px) {
    .outline {
        width: 270px;
        height: 270px;
        display: inline-block;
        border: none;
        margin: 0% 0 0 0%;
        background-size: contain;
    }
    .line3 {
        margin: 10% 0 0 0;
    }
}
/*#main-trio .line1 {
    height: 2rem;
}

#main-trio .line2 {
    height: 2.6rem;
}*/

#main-trio .num2,
#main-trio .num3 {
    margin: 0% 0 0 10%;
    ;
}

#main-trio .image2,
#main-trio .image3 {
    margin: 0% 0 0 4%;
    ;
}

#main-trio .outline {
    width: 280px;
    height: 280px;
    display: inline-block;
    border: none;
    margin: 0% 0 0 0%;
    background-size: contain;
}

#main-trio .trio-res {
    width: 3.6rem;
}

#main-trio .trio-num {
    width: 2rem;
}

.pega-ads {
    height: 251px;
}

.line4,
.line5 {
    width: 100%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
}
.line4 {
    /* height: 3rem; */
    margin-top: 0%;
}
.line5 {
    /* height: 3rem; */
    margin-top: -66px;
}

.num5,
.num6,
.num7,
.num8 {
    width: 2rem;
    /*height: 2rem;*/
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: relative;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
}

.num5 {
    margin-top: 90px;
    margin-left: 1.5%;
}
.num6 {
    margin-top: 90px;
    margin-left: 14%;
}
.num7 {
    margin-top: 90px;
    margin-left: 13%;
}
.num8 {
    margin-top: 90px;
    margin-left: 13%;
}
@media (max-width: 991px) {
    .pega-ads {
        height: 180px;
    }
    .line4 {
        /* height: 3rem; */
        margin-top: -33px;
    }
    .line5 {
        /* height: 3rem; */
        margin-top: -82px;
    }
    .num2,
    .num4 {
        margin-left: 31%;
    }
    .num1,
    .num3 {
        margin: 0;
    }
    .num5 {
        /* height: 3rem; */
        margin-left: 4.5%;
    }
    .num6 {
        /* height: 3rem; */
        margin-left: 12.5%;
    }
    .num7 {
        /* height: 3rem; */
        margin-left: 11%;
    }
    .num8 {
        /* height: 3rem; */
        margin-left: 11%;
    }
}

@media (max-width: 767px) {
    .pega-ads {
        height: 140px;
    }
    .line4 {
        /* height: 3rem; */
        margin-top: -54px;
    }
    .line5 {
        /* height: 3rem; */
        margin-top: -88px;
    }
    .num2,
    .num4 {
        margin-left: 31%;
    }
    .num1,
    .num3 {
        margin: 0;
    }

    .num5 {
        /* height: 3rem; */
        margin-left: 6.5%;
    }
    .num6 {
        /* height: 3rem; */
        margin-left: 10.5%;
    }
    .num7 {
        /* height: 3rem; */
        margin-left: 10%;
    }
    .num8 {
        /* height: 3rem; */
        margin-left: 10%;
    }
}
/* ADS PEGA5 END */

/*@media (max-width: 576px){*/
.btn-ldy-right {
    color: #FFF;
    font-size: 11px;
    padding: 0px;
    padding-top: 5px;
    padding-bottom: 5px;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(14%, var(--cyan)), color-stop(73%, var(--var-light))) !important;
    background: linear-gradient(0deg, var(--cyan) 14%, var(--cyan) 73%) !important;
    width: 40px;
    height: fit-content;
    position: fixed;
    top: 15%;
    right: 0;
    border-bottom-left-radius: 25px;
    border-bottom-right-radius: 0px;
    border-top-left-radius: 25px;
    border-top-right-radius: 0px;
    margin: 0 !important;
}
.sidemenu {
    height: 40px;
    display: flex;
    margin-top: 3px;
    align-items: center;
    align-self: center;
    align-content: center;
    justify-content: center;
    justify-self: center;
    justify-items: center;
}
img.img-side-menu {
    width: 35px;
    height: auto;
    border-radius: 50%;
    transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Mega animal 40 Start */

.has-mega {
    /*display: inline-flex;*/
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: absolute;
    margin: -10% 0 0 45%;
    -webkit-transform: rotate(42deg);
    transform: rotate(42deg);
    top: 0;
}

.has-patronus {
   /*display: inline-flex;*/
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: absolute;
    margin: -7% 0 0 40%;
    -webkit-transform: rotate(38deg);
    transform: rotate(38deg);
    top: 0;
}

.has-patronus img,
.has-mega img {
    width: 6rem;
    height: auto;
    margin-right: -40%;
    margin-top: -15%;
    transition: transform 2.0s;
    transform-style: preserve-3d;
    border-radius: unset !important;
}

.ganador {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    position: absolute;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 15%;
    left: 20%;
    right: unset;
}

.ganador img {
    width: 9rem;
    height: auto;
    margin-right: -42%;
    margin-top: -15%;
    transition: transform 2.0s;
    transform-style: preserve-3d;
    border-radius: unset !important;
}
@media (max-width: 1199px) {
    .ganador {
        top: 15%;
        left: 33%;
        right: unset;
    }
}


@media (max-width: 991px) {
    .ganador {
        top: 10%;
        left: 16%;
        right: unset;
    }
}

@media (max-width: 767px) {
    .ganador {
        top: 8%;
        right: 4%;
        left: unset;
    }
    .has-patronus {
         -webkit-transform: rotate(31deg);
         transform: rotate(31deg);
         top: 0;
     }
}
@media (max-width: 576px) {
.has-patronus {
    margin: -15% 0 0 25%;
    -webkit-transform: rotate(33deg);
    transform: rotate(33deg);
    top: 0;
    }
}

@media (max-width: 480px) {
    .has-patronus {
        -webkit-transform: rotate(27deg);
        transform: rotate(27deg);

    }
}
/* Mega animal 40 End */