.slider {
    /*background-image:url('../Images/slide/bg.jpg');*/
    background-size: cover;
    display: flex;
    flex-direction: column;
    position: relative;
}


.slider::before {
    content: "";
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 30%;
    z-index: 2;
}


.swiper-wrapper {
    margin-top: auto;
}

.swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.slide {
    height: 70vmin;
    margin-bottom: 15vmin;
}

.learn_btn {
    position: absolute;
    left: 50%;
    bottom: 44%;
    text-decoration: none;
    color: var(--color3_2);
    background: linear-gradient(rgb(20, 20, 20), black);
    padding: 1vmin 2vmin;
    border-radius: 5px;
    font-size: clamp(12px, 3vmin, 18px);
    cursor: pointer;
    z-index: 5;
}

.learn_btn:hover {
    color: white;
}

.swiper-pagination {
    bottom: 27% !important;
    width: auto !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: rgba(0, 0, 0, 0.5);
    padding: 0.5vmin 1vmin;
    border-radius: 2vmin;
}


.swiper-pagination {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.swiper-pagination-bullet {
    height: 2vmin !important;
    width: 2vmin !important;
    min-width: 15px;
    min-height: 15px;
    border-radius: 100% !important;
    cursor: pointer;
    transition: 0.2s !important;
    border: solid 2px var(--color1_1) !important;
    background: none !important;
    padding: 3px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1 !important;
}

.swiper-pagination-bullet::after {
    content: "";
    width: 0%;
    height: 0%;
    border-radius: 100%;
    background: var(--color1_1);
    transition: 0.2s;
}


.dot:hover {
    transform: scale(1.1);
}

.swiper-pagination-bullet-active::after {
    width: 100% !important;
    height: 100% !important;
    content: "";
    border-radius: 100%;
    background: var(--color1_1);
    transition: 0.2s;
}

.marquee {
    display: flex;
    align-items: center;
    z-index: 2;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 16%;
    width: 80%;
    max-width: 1200px;
    color: white;
    font-weight: lighter;
    font-size: clamp(12px, 3vmin, 18px);
}

.marquee img {
    height: 8vmin;
}

.marquee marquee {
    width: 100%;
    background: rgba(0, 0, 0, 0.3);
    padding: 1vmin;
}


.tutorial {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0), black);
    height: 18%;
}

.mobile_shortcut_nav {
    display: none !important;
}

.tutorial_step {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    text-decoration: none;
    margin: 0 4vmin;
    transition: 0.3s;
}


.tutorial_step img {
    height: 8vmin;
    margin-bottom: 1vmin;
}

.step_text {
    font-size: clamp(12px, 3vmin, 28px);
    font-weight: bold;
    white-space: nowrap;
}


.tutorial_step:hover {
    -moz-transform: translateY(-20%);
    -webkit-transform: translateY(-20%);
    transform: translateY(-20%);
}


.btn {
    cursor: pointer;
    transition: 0.3s;
}

.btn:hover, .btn2:hover {
    transform: translateY(-1vmin);
}


/*-----------------------Live Casino-------------------------------------------*/


.casino {
    background-size: cover;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    padding-bottom: 10vmin !important;
    position: relative;
}

.casino_list {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    z-index: 3;
    position: relative;
    width: 85%;
    max-width: 1400px;
    margin-bottom: 25px;
}

.casino_item {
    display: flex;
    flex-direction: column;
    align-items: center;
    opacity: 0.5;
    transition: transform 0.3s;
    position: relative;
}

.casino_card {
    width: 100%;
}

.casino_light {
    position: absolute;
    z-index: 2;
    width: 50%;
    display: none;
}

.casino_light1 {
    left: 0;
    top: 0;
    margin-left: -25%;
    animation: light_left linear infinite 2.5s;
}

.casino_light2 {
    right: 0;
    bottom: 0;
    margin-right: -25%;
    animation: light_right linear infinite 2.5s;
}

.casino_item:hover {
    opacity: 1;
    transform: scale(1.2);
    z-index: 2;
}

.casino_item:hover .casino_light {
    display: block;
}


.lc_city {
    position: absolute;
    z-index: 1;
    pointer-events: none;
}

.left_city {
    left: 0;
    bottom: 0vmin;
    width: 60vmin;
}

.right_city {
    right: 0vmin;
    bottom: 0vmin;
    width: 70vmin;
}

.lc_model {
    z-index: 1;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0vmin;
    width: 45vmin;
}

/*-----------------------Slot-------------------------------------------*/

.slot {
    background-size: cover;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    background-image: url('../Images/background/slot_bg.png');
    background-size: cover;
    background-position: center top;
}


.slot_content {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90%;
    max-width: 1500px;
}

.slot_list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 35%;
    z-index: 2;
}


.slot_item {
    width: 42%;
    min-width: 100px;
    display: flex;
    align-items: center;
    transition: 0.3s;
    opacity: 0.7;
    position: relative;
    margin: 3%;
}

.slot_light_wrapper {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 45%;
    height: 100%;
    z-index: 2;
    display: flex;
    align-items: center;
    display: none;
    mix-blend-mode: screen;
}

.slot_light {
    position: relative;
    width: 100%;
    height: 100%;
}

.slot_item img {
    width: 100%;
}

.slot_hovered {
    opacity: 1;
}

.slot_hovered .slot_light_wrapper {
    display: flex;
}

.slot_light::after {
    content: "";
    background-image: url('../Images/slot/light.png');
    background-size: 100% 100%;
    height: 80%;
    width: 80%;
    position: absolute;
    left: 50%;
    top: 50%;
    animation: light linear infinite 2.5s;
}

.slot_light::before {
    content: "";
    background-image: url('../Images/slot/light.png');
    background-size: 100% 100%;
    height: 80%;
    width: 80%;
    position: absolute;
    left: 50%;
    top: 50%;
    animation: light2 linear infinite 2.5s;
}

.selected_slot {
    display: flex;
    align-items: center;
    width: 65%;
    position: relative;
    display: none;
}

.slot_banner {
    width: 100%;
    -webkit-animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both, glow 2s infinite;
    animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both, glow 2s infinite;
}

.slot_frame {
    position: absolute;
    left: 37.5%;
    bottom: 20%;
    width: 25%;
    -webkit-animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
    animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
    animation-delay: 0.3s;
}

.slot_logo {
    position: absolute;
    left: 30%;
    bottom: 25%;
    width: 40%;
    -webkit-animation: puff-in-center 0.7s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;
    animation: puff-in-center 0.7s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;
    animation-delay: 0.3s;
    filter: drop-shadow(0 0 3px black);
}

.slot_active {
    display: flex;
}


/*-----------------------Slot-------------------------------------------*/

.e-games {
    background-size: cover;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

.e_content {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 3vmin;
    position: relative;
}

.water_bottom {
    position: absolute;
    left: 0;
    bottom: -20%;
    height: 60%;
    transform: translateX(-46%);
    pointer-events: none;
    z-index: 2;
}

.water_top {
    position: absolute;
    right: 0;
    top: -10%;
    height: 30%;
    transform: translateX(37%);
    pointer-events: none;
    z-index: 2;
}


.e_item {
    display: flex;
    align-items: center;
    overflow: hidden;
}

.e_item_banner {
    height: 40vmin;
    min-height: 400px;
    cursor: pointer;
}

.e_item_content {
    background: url('../Images/fishing/content_bg.jpg');
    background-size: 100% 100%;
    display: flex;
    align-items: center;
    padding: 1vmin 0;
    width: 1vmin;
    height: 35vmin;
    min-height: 320px;
    transition: 0.4s;
    position: relative;
}

.e_item:last-child .e_item_content {
    width: 0;
}

.e_content_bg {
    height: 32vmin;
    min-height: 300px;
}

.e_item:hover .e_item_content {
    width: 32vmin;
}

.overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    z-index: 2;
    white-space: nowrap;
    background: rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: 0.3s;
}

.fish_play {
    display: flex;
    align-items: center;
    color: var(--color1_2);
    background: black;
    padding: 5px;
    padding-right: 1vmin;
    margin-top: 10%;
    text-decoration: none;
    border-top-left-radius: 999px;
    border-bottom-left-radius: 999px;
}

.fish_play img {
    height: 3vmin;
    margin-right: 1vmin;
}

.e_item_content:hover .overlay {
    opacity: 1
}

/*-----------------------Sportsbook-------------------------------------------*/

.sb {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    background-image: url('../Images/background/sb_bg.png');
    background-size: cover;
    background-position: center top;
}

.sb_content {
    display: flex;
    justify-content: center;
    width: 90%;
    max-width: 1500px;
    overflow: hidden;
    margin-bottom: 5%;
}

.sb_banner {
    width: 40%;
    margin-right: 5%;
    display: none;
    -webkit-animation: slide-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.active_banner {
    display: block;
}

.sb_window {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 40%;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 2vmin;
    padding: 2% 5%;
}


.sb_info {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 7;
    overflow: hidden;
    display: none;
}

.sb_info > * {
    -webkit-animation: slide-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.active_info {
    display: flex;
}

.sb_logo {
    height: 4vmin;
    min-height: 50px;
}

.sb_info p {
    text-align: center;
    width: 90%;
    color: white;
    font-size: clamp(12px, 3vmin, 16px);
    margin: 10% 0;
    animation-delay: 0.2s;
}

.sb_games {
    width: 90%;
    animation-delay: 0.4s;
}

.sb_nav {
    flex: 3;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sb_nav_item {
    display: flex;
    align-items: center;
    height: 8vmin;
    width: 8vmin;
    min-width: 100px;
    min-height: 100px;
    background: linear-gradient(#ffe3ab 50%, #5b3118, #b57d28, #ffe3ab);
    border-radius: 1vmin;
    margin: 0 2vmin;
    padding: 2%;
    border: solid 0.2vmin #FFC400;
    opacity: 0.7;
}

.sb_nav_item img {
    width: 100%;
    filter: brightness(0) invert(1) drop-shadow(1px 1px 1px black);
    transition: 0.2s;
}

.sb_nav_active img {
    transform: scale(1.5);
}

.sb_nav_active {
    opacity: 1;
}

/*-----------------Lottery -----------------------------*/


.lotto {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    padding: 12vmin 0;
}

.lotto_title {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
}

.lotto_list {
    display: flex;
    flex-wrap: wrap;
    gap: 2vmin;
    max-width: 1200px;
    padding: 2vmin 3vmin;
    width: 90%;
    justify-content: center;
    position: relative;
}

.table_nav {
    position: absolute;
    width: 5vmin;
    bottom: 50%;
    cursor: pointer;
    display: none;
}

.table_next {
    right: 0%;
}

.table_prev {
    left: 0%;
}

.lotto_table {
    padding: 1px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 30%;
    transition: transform 0.3s;
}

.lotto_table:hover {
    transform: scale(1.05);
}

.table_name {
    text-align: left;
    width: 100%;
    font-size: clamp(12px, 2vmin, 16px);
    font-weight: bold;
    padding: 3%;
    padding-bottom: 0;
}

.table_header {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    font-size: clamp(12px, 2vmin, 16px);
    font-weight: bold;
    padding: 3%;
}

.table_header img {
    height: 3vmin;
    min-height: 30px;
    margin-right: 1vmin;
}

.lotto_table table {
    width: 100%;
    text-align: center;
    border-collapse: collapse;
    font-size: clamp(14px, 2vmin, 18px);
    background: #2E2E2E;
    color: white;
}

.lotto_table th {
    background: #1C1C1C;
    padding: 1vmin 0;
}

.lotto_table td, .lotto_table th {
    padding: 2%;
}

.lotto_btns {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    width: 30%;
}

.lotto_btn {
    background: linear-gradient(#ffe3ab 50%, #5b3118, #b57d28, #ffe3ab);
    width: 80%;
    text-align: center;
    padding: 3%;
    font-size: clamp(2.5vmin, 2vmin, 22px);
    text-decoration: none;
    color: black;
    border: solid 1px #FFC400;
    border-radius: 999px;
    margin: 2% 0;
    white-space: nowrap;
}

.result_input {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 80%;
    color: var(--color1_1);
    margin: 10% 0;
    position: relative;
    font-size: clamp(2vmin, 2vmin, 18px);
}

.result_input input {
    width: 100%;
    background: black;
    border: solid 1px #FFC400;
    border-radius: 999px;
    font-size: clamp(2vmin, 2vmin, 22px);
    color: white;
    padding: 3%;
    margin-top: 5%;
}

.result_input img {
    position: absolute;
    height: 30%;
    bottom: 15%;
    right: 8%;
    pointer-events: none;
}


.showall_btn {
    order: 2;
    background: linear-gradient(#ffe3ab 50%, #5b3118, #b57d28, #ffe3ab);
    width: 30%;
    text-align: center;
    padding: 2%;
    font-size: clamp(2.5vmin, 2.5vmin, 22px);
    text-decoration: none;
    color: black;
    border: solid 1px #FFC400;
    border-radius: 999px;
    margin: 2% 0;
    display: none;
    cursor: pointer;
}

.large_lotto .lotto_btns {
    flex-direction: row;
    width: 80%;
    margin: 0 auto;
    align-items: flex-end;
}

.large_lotto .lotto_btn {
    padding: 2%;
    width: 30%;
    margin: 0;
    margin-right: 2%;
}

.large_lotto .result_input {
    margin: 0;
    margin-left: auto;
    align-items: flex-start;
    width: 30%;
}

.large_lotto .lotto_table {
    order: 2;
}

.large_lotto .lotto_table {
    width: 80%;
    margin: 0 auto;
    display: none;
}

.large_lotto .active_table {
    display: flex;
    -webkit-animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
    animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

.active_table .table_name, .active_table .table_header {
    font-size: clamp(15px, 3vmin, 22px);
    padding: 2%;
}

.active_table table {
    font-size: clamp(15px, 3vmin, 22px);
}

.active_table td, .active_table th {
    padding: 1%;
}

.large_lotto .showall_btn {
    display: block;
}

.large_lotto .table_nav {
    display: block;
}