#pageHome .game-title, .special-mg, .game-item-cq9, .li-sport, .li-fishing, .li-crash, .nav-item span, .game-item-cq9, .icon_home_logo_slot_NETENT, .game-item-flowgaming , .contact-box li:nth-child(2), .bg-item5, .game-item-pussy888api, .upcoming-sport-matches-slider-container{ display: none !important; } #pageHome #homePage .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr{ height:5.2rem; } .header, .sidemenu-logo{ background-color:#000; background-image: linear-gradient(to top, #000, #000); } #pageHome #homePage .home_firmcontent_box .home_firmcontent .home_firms{ padding: .1rem!important; } #pageHome #homePage .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr li a{ padding-bottom: 0rem!important; } body, .casino-usrpwd-body .btn-common, .play-btn, .download-btn, .kiss918_mainBox .btn-common{ background-image: linear-gradient(to bottom, #015428, #002e11); } [data-page="login"] { background-color: #fff; } .copy-right[style]{ color:#fff; } #pageHome #homePage .home_navBox .home_nav li a, .gamelobby-content .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr li a{ color:#f2d249; } #pageHome #homePage .home_navBox .home_nav li a.on{ background-image: linear-gradient(to top, #002d0e, #002d0e); color:#f2d249; } #pageHome #homePage .home_join_login > a.home_to_join{ background-image: linear-gradient(to top, #002d0e, #002d0e); color:#d5a400; font-weight: bolder; border-radius: 10px ; font-size: 0.52rem; } #pageHome #homePage .home_navBox .home_nav, .reg-progress-bar-section .step-wrapper.on{ background-image: linear-gradient(to bottom, #00491e, #00491e); } #pageHome #homePage .home_join_login > a.home_to_login{ background-image: linear-gradient(to bottom, #e3ad05, #9b5b02); color:#1d2704; font-weight: bolder; font-size: 0.52rem; border-radius: 0px 10px 10px 0px; } .icon-menu{ filter: brightness(0) invert(1) ; } .icon_home_menu_cockfight{ background: url("img1794_rez8/cf_icon.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .icon_home_menu_lc{ background: url("img1794_rez8/casino_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .icon_home_menu_slot{ background: url("img1794_rez8/slot_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .icon_home_menu_sport{ background: url("img1794_rez8/sport_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .icon_home_menu_711{ background: url("img1794_rez8/711_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .icon_home_menu_keno{ background: url("img1794_rez8/keno_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .icon_home_menu_fishing{ background: url("img1794_rez8/fishing_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .icon_home_menu_lottery{ background: url("img1794_rez8/4d_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .on .icon_home_menu_lottery{ background: url("img1794_rez8/4d_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .fas.fa-luckybox{ background: url("img1794_rez8/gift_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .on .fas.fa-luckybox{ background: url("img1794_rez8/gift_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); } .fa-dharmachakra{ background: url("img1794_rez8/wheel_menu.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); width: 39px; height: 33px; } .on .fa-dharmachakra{ background: url("img1794_rez8/luckyspins.gif") ; background-size: 100%; filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); width: 39px; height: 33px; } .fa-dharmachakra:before{ content:none!important; } .ui-footer .navbar li a .i{ -webkit-animation: breathing 1s ease-out infinite normal; animation: breathing 1s ease-out infinite normal; } .on .icon_home_menu_lottery{ filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); -webkit-animation: breathing 1s ease-out infinite normal; animation: breathing 1s ease-out infinite normal; } .on .icon_home_menu_hotgames{ filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); -webkit-animation: breathing 1s ease-out infinite normal; animation: breathing 1s ease-out infinite normal; } .on .icon_home_menu_lc{ filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); -webkit-animation: breathing 1s ease-out infinite normal; animation: breathing 1s ease-out infinite normal; } .on .icon_home_menu_slot{ filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); -webkit-animation: breathing 1s ease-out infinite normal; animation: breathing 1s ease-out infinite normal; } .on .icon_home_menu_sport{ filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); -webkit-animation: breathing 1s ease-out infinite normal; animation: breathing 1s ease-out infinite normal; } .on .icon_home_menu_711{ filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); -webkit-animation: breathing 1s ease-out infinite normal; animation: breathing 1s ease-out infinite normal; } .on .icon_home_menu_keno{ filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); -webkit-animation: breathing 1s ease-out infinite normal; animation: breathing 1s ease-out infinite normal; } .on .icon_home_menu_fishing{ filter: invert(67%) sepia(201%) saturate(2452%) hue-rotate(28deg) brightness(133%) contrast(174%); -webkit-animation: breathing 1s ease-out infinite normal; animation: breathing 1s ease-out infinite normal; } .payment-menu .icon-funds, .payment-scroll-menu .icon-funds{ background-image:url('./img1794_rez8/deposit_icon.png?v=5') ; } .payment-menu .icon-withdrawal, .payment-scroll-menu .icon-withdrawal{ background-image:url('./img1794_rez8/withdraw_menu.png?v=5') ; } .payment-menu .icon-wallettransfer, .payment-scroll-menu .icon-wallettransfer{ background-image:url('./img1794_rez8/transfer_icon.png?v=5') ; } .payment-menu .icon-wallets, .payment-scroll-menu .icon-wallets{ background-image:url('./img1794_rez8/wallet_menu.png?v=5') ; } .payment-menu .icon-history, .payment-scroll-menu .icon-history{ background-image:url('./img1794_rez8/history_icon.png?v=5') ; } .payment-menu .icon-statement, .payment-scroll-menu .icon-statement{ background-image:url('./img1794_rez8/statement_icon.png?v=5') ; } .account-menu-section .icon-referral-program{ background-image:url('./img1794_rez8/refer_icon.png?v=5') ; } .icon_home_header_restore{ filter: invert(1%) sepia(1%) saturate(2452%) hue-rotate(360deg) brightness(0%) contrast(174%); background-image:url('./img1794_rez8//icons/green/refresh.png') ; } .ui-footer .navbar .icon-home-big{ background-image:url('./img1794_rez8/home_icon.png?v=5') ; width: .64rem; height: .64rem; } .ui-footer .navbar .icon-funds{ background-image:url('./img1794_rez8/walletbalance_icon.png?v=5') ; } .ui-footer .navbar .icon-account, .icon-myprofile{ background-image:url('./img1794_rez8/acc_icon.png?v=5') ; } .ui-footer .navbar .icon-promotion-big{ background-image:url('./img1794_rez8/promo_icon.png?v=5') ; } .ui-footer .navbar .icon-livechat, #contactusPage .icon-livechat{ background-image:url('./img1794_rez8/cs_icon.png?v=5') ; } .gamelobby-tab-content .tabs .tab.selected{ background: linear-gradient(180deg, #000, #000) ; } .gamelobby-tab-content .tabs .tab{ background: linear-gradient(180deg, #2a103a, #100519) ; } #slot_firmcontent .icon_home_logo_bg, #mobile_firmcontent .icon_home_logo_bg, #casino_firmcontent .icon_home_logo_bg, #sport_firmcontent .icon_home_logo_bg, #lottery4d_firmcontent .icon_home_logo_bg, #fishing_firmcontent .icon_home_logo_bg, #keno_firmcontent .icon_home_logo_bg{ animation: float 3s infinite; } #pageHome #homePage .home_firmcontent_box, #pageHome #homePage .home_firmcontent_box .home_firmcontent{ background: none; } .most-play-container .most-play-title, .m-referral-container .referral-title, .app-download .app-download-title{ color:#ebcc50; } #pageHome #homePage .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr li a{ font-size: 0.4rem; color:#ebcc50; font-weight: bolder; } #sport_firmcontent .icon_home_logo_sport_sbo{ background-image:url('./img1794_rez8/ssport.jpg?v5') ; border-radius: 15px; } #sport_firmcontent .icon_home_logo_sport_ibc{ background-image:url('./img1794_rez8/isport.jpg?v5') ; border-radius: 15px; } #sport_firmcontent .icon_home_logo_sport_cmd{ background-image:url('./img1794_rez8/csport.jpg?v5') ; border-radius: 15px; } #sport_firmcontent .icon_home_logo_sport_msport{ background-image:url('./img1794_rez8/msport.jpg?v5') ; border-radius: 15px; } #casino_firmcontent .icon_home_logo_casino_PT{ background-image:url('./img1794_rez8/pt_casino.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_rpsoft{ background-image:url('./img1794_rez8/rpsoft.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_kingmaker{ background-image:url('./img1794_rez8/km.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_jili{ background-image:url('./img1794_rez8/jili.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_jdb{ background-image:url('./img1794_rez8/jdb.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_SG{ background-image:url('./img1794_rez8/sg.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_fachai{ background-image:url('./img1794_rez8/fachai.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_JOKER{ background-image:url('./img1794_rez8/joker.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_PTS{ background-image:url('./img1794_rez8/playtech.jpg?v5') ; border-radius: 15px; }#slot_firmcontent .icon_home_logo_slot_ludobet{ background-image:url('./img1794_rez8/ludo.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_habanero{ background-image:url('./img1794_rez8/haba.jpg?v=5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_dctrelax{ background-image:url('./img1794_rez8/relax.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_naga{ background-image:url('./img1794_rez8/naga.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_inout{ background-image:url('./img1794_rez8/inout.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_bng{ background-image:url('./img1794_rez8/bccongo.jpg?v=5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_rich88{ background-image:url('./img1794_rez8/rich88.jpg?v5') ; border-radius: 15px; } #crash_firmcontent .icon_home_logo_slot_spribe{ background-image:url('./img1794_rez8/spribe.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_spribe{ background-image:url('./img1794_rez8/spribe.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_PRA{ background-image:url('./img1794_rez8/pp.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_scr_LIVE{ background-image:url('./img1794_rez8/live22.jpg?v5') ; border-radius: 15px; }#slot_firmcontent .icon_home_logo_scr_PUSSY{ background-image:url('./img1794_rez8/pussy.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_scr_MEGA{ background-image:url('./img1794_rez8/mega.jpg?v5') ; border-radius: 15px; } #slot_firmcontent .icon_home_logo_slot_gamerbuild{ background-image:url('./img1794_rez8/gamerbuild.jpg?v5') ; border-radius: 15px; } #casino_firmcontent .icon_home_logo_casino_DG{ background-image:url('./img1794_rez8/dg.jpg?v5') ; border-radius: 15px; } #casino_firmcontent .icon_home_logo_casino_SEXYB{ background-image:url('./img1794_rez8/sexyb.jpg?v5') ; border-radius: 15px; } #casino_firmcontent .icon_home_logo_casino_AB{ background-image:url('./img1794_rez8/allbet.jpg?v5') ; border-radius: 15px; } #casino_firmcontent .icon_home_logo_casino_SA{ background-image:url('./img1794_rez8/sa.jpg?v5') ; border-radius: 15px; } #casino_firmcontent .icon_home_logo_casino_pragmatic{ background-image:url('./img1794_rez8/pp.jpg?v5') ; border-radius: 15px; }#casino_firmcontent .icon_home_logo_casino_PT{ background-image:url('./img1794_rez8/playtech.jpg?v5') ; border-radius: 15px; } #casino_firmcontent .icon_home_logo_casino_marbula2{ background-image:url('./img1794_rez8/m2.jpg?v5') ; border-radius: 15px; } #casino_firmcontent .icon_home_logo_casino_EG{ background-image:url('./img1794_rez8/eg.jpg?v5') ; border-radius: 15px; } #mobile_firmcontent .icon_home_logo_slot_JOKER{ background: url("img1794_rez8/joker.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_lionking{ background: url("img1794_rez8/lk.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_scr_S918{ background: url("img1794_rez8/918.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_scr_MEGA{ background: url("img1794_rez8/mega.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_scr_PUSSY{ background: url("img1794_rez8/pussy.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_scr_LIVE{ background: url("img1794_rez8/live22.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_scr_GW{ background: url("img1794_rez8/gw.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_scr_PB{ background: url("img1794_rez8/pb.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_slot_XE{ background: url("img1794_rez8/xe.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_slot_VP{ background: url("img1794_rez8/vpower.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_slot_XE{ background: url("img1794_rez8/xe.jpg") ; background-size: 100%; } #mobile_firmcontent .icon_home_logo_evo888{ background: url("img1794_rez8/evo.jpg") ; background-size: 100%; } .sports-container-background{ background-image: url(".//img1794_rez8/soccer_bg.png?v=4"); } .most-play-button{ color:#000; } .most-play-container .header-section img { filter: hue-rotate(172deg) ; } .swiper{ width:74%; } .search-filter .button-style-1{ background: linear-gradient(to bottom, #2a103a 0%, #100519 100%) ; color: #000 ; box-shadow: inset -1px 0px 8px #2a103a ; } .btn-primary, .transfer-type-section .btn-default, .btn-blue, .standard-button-container .standard-submit-form-button, .casino-usrpwd-body .play-btn, .btn-red-play, .m-transfer-container .m-transfer-form .standard-button-container .standard-submit-form-button, .btn.btn-form.confirm-tran-btn, .swiper-slide .button-style-1, .product-filter .button-style-2.is-active, .product-filter .button-style-2, .button-filter, .button-style-1, .m-deposit-landing-container .deposit-tab-container .deposit-tab .active .img-container { background: linear-gradient(180deg, #2a103a, #100519) ; border-color: #282828 ; } #depositForm .quick_pay_input_item > label, #depositForm .quick_pay_select_item>label, #depositForm .quick_pay_input_item>div>label, .page-title, .primary-style .quick_pay_input_item > label, #walletWithdrawalContainer h1[style], #walletTransferContainer h1[style], #historyContainer h1[style], #regPage .regformBox .login_centent .steptitle, #regPage .regformBox .login_centent .input_item .label-aff span, .section-desc[style], .standard-label, .m-transfer-container .m-transfer-form .standard-form-field .standard-label, .m-deposit-landing-container .standard-content-container .m-standard-transaction-container .m-transaction-form .bank-list-container .st-title { color: #282828; font-weight: bold; text-transform: uppercase; } .btn-primary, .transfer-type-section .btn-default, .btn-blue, .standard-button-container .standard-submit-form-button, .casino-usrpwd-body .play-btn, .btn-red-play, .m-transfer-container .m-transfer-form .standard-button-container .standard-submit-form-button, .btn.btn-form.confirm-tran-btn, .swiper-slide .button-style-1, .product-filter .button-style-2.is-active, .product-filter .button-style-2, .button-filter, .button-style-1 , .m-deposit-landing-container .deposit-tab-container .deposit-tab .active .img-container, section.lotto-place-bet span.lotto-rules a, span.lotto-payout a{ background: linear-gradient(180deg, #2a103a, #100519) ; border-color: #282828; color:#000; } .member-action .icon_home_header_restore, .member-action .icon-wallettransfer{ filter: brightness(0) invert(0); } .account-menu-section .icon-myprofile{ background: url("./img1794_rez8/acc_user.png?=v4"); background-size: 100%; background-repeat: no-repeat; } .account-menu-section .icon-referral-program{ background: url("./img1794_rez8/acc_referral.png?=v4"); background-size: 100%; background-repeat: no-repeat; } .account-menu-section .icon-changepassword{ background: url("./img1794_rez8/acc_changepassword.png?=v4"); background-size: 100%; background-repeat: no-repeat; } .account-menu-section .icon-logout{ background: url("./img1794_rez8/acc_logout.png?=v4"); background-size: 100%; width: 1.2rem; height: 1.2rem; background-repeat: no-repeat; } .mobile-wallet-section .collapse, .m-deposit-landing-container .collapse{ background-image: linear-gradient(#2a103a, #100519) ; } #promotionsPage .history_nav{ background-image: linear-gradient(#2a103a, #100519) ; } .mobile-wallet-section .collapse p, .m-deposit-landing-container .collapse p, #promotionsPage .history_nav li a{ color:#fff; } #promotionsPage .history_nav li a.on{ color:#000; } .mobile-wallet-section .collapse svg, .m-deposit-landing-container .collapse svg{ fill:#fff; } .float-menu.dailyloginreward-floating-icon .floating-icon-image{ content: url("./img1794_rez8/g888_checkin2.gif?=v4"); } .mycredit-menu .icon-withdrawal, .mycredit-menu .icon-statement, .mycredit-menu .icon-history, .mycredit-menu .icon-wallets{ filter: brightness(0) invert(0) ; } #aboutUsPage .history_nav li a.on, #historyPage .history_nav li a.on, #slotPage .history_nav li a.on, #downloadPage .history_nav li a.on{ color:#2a103a; } #aboutUsPage .history_nav, .mobile-tnc .info-centre-header, .filtering-container{ background-image: linear-gradient(#2a103a, #100519) ; } .aboutus-tab-content .header{ background-color:#fff; background-image: linear-gradient(to top, #fff, #fff) ; } .vippagecontent{ background:#000!important; } .seocontentpage tr{ font-size:11px!important; } [data-page="vip"] .ui-content { padding: 0px!important; } .default-theme .vip-header-banner { content: url("./img1794_rez8/header_vip_club.png?=v4")!important; } .default-theme .vip-title-img { content: url("./img1794_rez8/vipclub.png?=v4")!important; } .swiper-slide{ max-width: 16vw!important; } i.provider.logo-dctrelax, i.provider.logo-habanero, i.provider.logo-pragmatic, i.provider.logo-pocketgame, i.provider.logo-spribe, i.provider.logo-playtech{ filter: brightness(0) invert(1)!important; } .swiper{ width:74%!important; } .search-filter .button-style-1{ background: linear-gradient(to bottom, #e3ad05 10%, #e3ad05 50%, #9b5b02 100%) !important; color: #000 !important; box-shadow: inset -1px 0px 8px #e3ad05 !important; } .btn-primary, .transfer-type-section .btn-default, .btn-blue, .standard-button-container .standard-submit-form-button, .casino-usrpwd-body .play-btn, .btn-red-play, .m-transfer-container .m-transfer-form .standard-button-container .standard-submit-form-button, .btn.btn-form.confirm-tran-btn, .swiper-slide .button-style-1, .product-filter .button-style-2.is-active, .product-filter .button-style-2, .button-filter, .button-style-1, .m-deposit-landing-container .deposit-tab-container .deposit-tab .active .img-container { background: linear-gradient(180deg, #e3ad05, #9b5b02) !important; border-color: #282828 !important; } .gamelobby-tab-content .tabs .tab{ background: linear-gradient(180deg, #e3ad05, #9b5b02) !important; } .gamelobby-tab-content .tabs .tab.selected{ background: linear-gradient(180deg, #000, #000) !important; } .daily-checkin-content-title, .daily-checkin-rewardexplain, .daily-checkin-progress-day-text{ color:#e3c28f!important; } .daily-checkin-content-button-activeRed{ background-image: linear-gradient(90deg, rgba(0,0,0,0.4) 10%, rgba(0,0,0,0.8) 100%); border:2px solid #92704d!important; color:#e3c28f!important; box-shadow: inset 0 -0.8vw 0.8vw #e3c28f, inset 0 0.8vw 0.8vw #e3c28f; } .daily-checkin-content { background-color: rgba(0, 0, 0, 0.4) !important; border: 2px solid #92704d !important; } .daily-checkin-home { background-image: url(./img1794_rez8/checkinbg.png?=v6) !important; height: 100% !important; } .float-menu.luckyspin-floating-icon .floating-icon-image { content: url("./img1794_rez8/spinicon.png") !important; background-size: 100% !important; } .luckyspin_banner { background-image: url("./img1794_rez8/luckyspin.png") !important; } .luckybox_banner{ background-image: url(./img1794_rez8/luckybox.png?v=3) !important; } .m-vip-about .about-header, .m-vip-about .about-subHeader, .about-content-container, .vip-upgrade .sub_header, .vipupgrade-tab-content, .vip-benefits .content_header, .vip-upgrade .content_title, .vip-upgrade .content3, .vip-faq .header, .vip-faq .content, .vip-faq .question, .vip-upgrade .content_footer .content, .m-vip-referral .ref-header, .m-vip-referral .ref-content-container, .m-vip-referral .ref-btm-header, .m-vip-referral .ref-btm-content li{ color:#fff!important; background-color: rgb(0,0,0,0)!important; } .about-content{ background-color: rgb(0,0,0,0)!important; } #vip-slide-0 img, .vipabout-tab img{ content: url(./img1794_rez8/supremelounge.png?v=3) !important; } #vip-slide-1 img, .vipbenefits-tab img:nth-child(2){ content: url(./img1794_rez8/vipexclusive.png?v=3) !important; } #vip-slide-2 img, .vipreferral-tab img{ content: url(./img1794_rez8/vipfantasy.png?v=3) !important; } #vip-slide-3 img, .vipupgrade-tab img:nth-child(2){ content: url(./img1794_rez8/viprebate.png?v=3) !important; } .vipfaq-tab img{ content: url(./img1794_rez8/faq.png?v=3) !important; } @keyframes float { 0% { transform: translatey(0px); } 50% { transform: translatey(-5px); } 100% { transform: translatey(1px); } } @-webkit-keyframes breathing { 0% { -webkit-transform: scale(0.9); transform: scale(0.9); } 25% { -webkit-transform: scale(1); transform: scale(1); } 60% { -webkit-transform: scale(0.9); transform: scale(0.9); } 100% { -webkit-transform: scale(0.9); transform: scale(0.9); } } @keyframes breathing { 0% { -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); } 25% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 60% { -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); } 100% { -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); } } /* =========================================================================== REZ8 | MIDNIGHT VIOLET / EMERALD SITE THEME Target: existing 1816.css HTML/class structure. Add this AFTER the old CSS. Design reference: user's Rez8 mobile screenshot (dark plum, lime, lavender). Assets: ./img1794_rez8/icons/{purple,green}/*.png (supplied ZIP) Important: provider photos and the logo still use your current image files. =========================================================================== */ :root { --rez-bg: #0f0315; --rez-bg-dark: #09010d; --rez-header: #17051f; --rez-panel: #1b0928; --rez-panel-2: #240b34; --rez-panel-deep: #12051d; --rez-purple: #b692e6; --rez-purple-soft: #d4b9fa; --rez-purple-border: rgba(182,146,230,.60); --rez-green: #98f26b; --rez-lime: #a4ff6e; --rez-lime-border: rgba(164,255,110,.69); --rez-silver: #c9c4cb; --rez-gold: #bca37b; --rez-muted: #aaa0b8; --rez-text: #f6f2fb; --rez-red: #ee384b; --rez-radius: 12px; --rez-icon-inactive: url('./img1794_rez8/icons/purple/slot.png'); } /* Base surface: blackened plum, subtly illuminated, legible white body text. */ html, body, .ui-page, .ui-content, #pageHome, #homePage, .casino-usrpwd-body, .kiss918_mainBox, .gamelobby-content { color: var(--rez-text) !important; background-color: var(--rez-bg) !important; background-image: radial-gradient(ellipse 120% 34% at 50% -8%,rgba(93,24,119,.35),transparent 70%), linear-gradient(160deg,#16041e 0%,#100117 49%,#09010d 100%) !important; } body { font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; } :where(p,span,div,li) { -webkit-tap-highlight-color: transparent; } a, a:link { text-decoration:none; } a:focus-visible,button:focus-visible { outline: 2px solid var(--rez-lime); outline-offset:3px; } /* Header and logo area */ .header,.sidemenu-logo,.ui-header,#leftmenu .header { background:#16051e !important; background-image: linear-gradient(180deg,#1e0828,#120219) !important; color:var(--rez-text) !important; border-bottom:1px solid rgba(147,232,103,.63) !important; box-shadow:0 2px 14px rgba(0,0,0,.36) !important; } .icon-menu,.header .icon-menu,.icon_home_header_restore { filter:brightness(0) saturate(100%) invert(82%) sepia(39%) saturate(664%) hue-rotate(47deg) brightness(112%) contrast(103%) !important; } .header :is(.icon-menu,.menu-icon) { color:var(--rez-green) !important; } /* All major panels: dark translucent plum rather than emerald green/gold. */ .home_navBox, .home_firmcontent_box, .home_firmcontent, .wallet-container,.wallet-section,.mobile-wallet-section,.mycredit-menu, .member-action,.account-menu-section,.m-deposit-landing-container, .standard-content-container,.m-standard-transaction-container, .gamelobby-tab-content,.games-tab-content,.payment-menu, .payment-scroll-menu,.search-filter,.filtering-container, .most-play-container,.m-referral-container,.app-download, .swiper-slide,.product-filter,.m-transfer-container, #depositForm, #walletWithdrawalContainer, #walletTransferContainer, #historyContainer, #leftmenu { color:var(--rez-text) !important; border-color:var(--rez-purple-border); } .wallet-container,.wallet-section,.mobile-wallet-section,.mycredit-menu, .payment-menu,.payment-scroll-menu,.member-action,.account-menu-section, .m-standard-transaction-container,.standard-content-container { background-color:rgba(27,9,40,.94) !important; background-image:linear-gradient(145deg,rgba(31,11,46,.92),rgba(15,3,24,.96)) !important; } .home_firmcontent_box, .home_firmcontent { background:transparent !important; } /* User balance and wallet – green balance, lavender action controls. */ .balance,.balance-amount,.total-balance,.wallet-balance, .mycredit-menu .amount,.mycredit-menu .balance, .member-action .balance, .credit-amount, [class*='balance-number'],[class*='balance_amount'] { color:var(--rez-green) !important; font-weight:800 !important; text-shadow:0 0 12px rgba(117,247,92,.15); } .payment-menu,.payment-scroll-menu,.mobile-wallet-section,.mycredit-menu { border:1px solid rgba(174,153,115,.67) !important; border-radius:var(--rez-radius) !important; } .payment-menu a,.payment-scroll-menu a,.mycredit-menu a, .member-action a { color:var(--rez-text) !important; border-color:rgba(180,147,232,.48) !important; border-radius:9px; } .payment-menu a:hover,.payment-scroll-menu a:hover, .member-action a:hover { border-color:var(--rez-lime) !important; } /* Website navigation: 4 compact tabs, red selected Slot as in reference. */ #pageHome #homePage .home_navBox .home_nav { display:flex !important; gap:6px !important; background:transparent !important; background-image:none !important; border:none !important; padding:2px 0 !important; } #pageHome #homePage .home_navBox .home_nav li { box-sizing:border-box !important; min-width:0 !important; } #pageHome #homePage .home_navBox .home_nav li a, .gamelobby-tab-content .tabs .tab, #pageHome #homePage .home_navBox .home_nav li a:not(.on) { box-sizing:border-box !important; color:var(--rez-text) !important; background:linear-gradient(165deg,#1c092b,#0d0314) !important; border:1px solid rgba(173,139,224,.61) !important; border-radius:8px !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.03) !important; text-align:center !important; } #pageHome #homePage .home_navBox .home_nav li a.on, #pageHome #homePage .home_navBox .home_nav li a.active, .gamelobby-tab-content .tabs .tab.selected, .gamelobby-tab-content .tabs .tab.on { color:#16071a !important; background:linear-gradient(160deg,#ff5361,#d92341) !important; border:1px solid #ff6970 !important; box-shadow:0 0 11px rgba(246,55,86,.18) !important; } #pageHome #homePage .home_navBox .home_nav li a:not(.on):hover, .gamelobby-tab-content .tabs .tab:not(.selected):hover { border-color:var(--rez-lime) !important; color:var(--rez-green) !important; } #pageHome #homePage .home_navBox .home_nav li a, #pageHome #homePage .home_navBox .home_nav li a span { font-size:clamp(10px,2.1vw,14px) !important; } /* Provider card grid – reference layout uses 2 cards per row on mobile. */ #pageHome #homePage .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr, .gamelobby-content .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr { height:auto !important; display:flex !important; flex-wrap:wrap !important; align-items:stretch !important; gap:9px 8px !important; margin:0 !important; padding:0 !important; overflow:visible !important; } #pageHome #homePage .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr li, .gamelobby-content .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr li { box-sizing:border-box !important; width:calc(50% - 4px) !important; max-width:calc(50% - 4px) !important; margin:0 !important; padding:0 !important; border:1px solid rgba(190,175,141,.86) !important; border-radius:12px !important; background:linear-gradient(180deg,#1b0b26,#180820) !important; overflow:hidden !important; box-shadow:0 2px 10px rgba(0,0,0,.28) !important; } #pageHome #homePage .home_firmcontent_box .tabcontent-mega888 .home_firms .home_firms_tr li, .gamelobby-content .home_firmcontent_box .tabcontent-mega888 .home_firms .home_firms_tr li, #pageHome #homePage .home_firmcontent_box .tabcontent-918kiss .home_firms .home_firms_tr li, .gamelobby-content .home_firmcontent_box .tabcontent-918kiss .home_firms .home_firms_tr li { box-sizing:border-box !important; width:calc(100% - 4px) !important; max-width:calc(100% - 4px) !important; margin:0 !important; padding:0 !important; border:1px solid rgba(190,175,141,.86) !important; border-radius:12px !important; background:linear-gradient(180deg,#1b0b26,#180820) !important; overflow:hidden !important; box-shadow:0 2px 10px rgba(0,0,0,.28) !important; } .gamelobby-content .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr li { height: 4rem!important;} /* Original provider images remain mapped by your existing .icon_home_logo_* rules. */ #slot_firmcontent .icon_home_logo_bg, #mobile_firmcontent .icon_home_logo_bg, #casino_firmcontent .icon_home_logo_bg, #sport_firmcontent .icon_home_logo_bg, #lottery4d_firmcontent .icon_home_logo_bg, #fishing_firmcontent .icon_home_logo_bg, #keno_firmcontent .icon_home_logo_bg, .home_firms_tr li a [class*='icon_home_logo_'] { display:block; box-sizing:border-box; width:100% !important; max-width:100% !important; height:auto !important; min-height:unset !important; aspect-ratio:1.52/1 !important; background-size:cover !important; background-position:center !important; background-repeat:no-repeat !important; border-radius:10px 10px 0 0 !important; animation:none !important; } .home_firms_tr li a > :is(span,p,small,label):last-child { display:block; width:100%; min-height:27px; box-sizing:border-box; margin:0 !important; padding:6px 4px !important; border-top:1px solid rgba(202,182,153,.63); background:linear-gradient(180deg,#17091e,#200b2b); color:#f6f1fa !important; font-weight:700 !important; text-align:center; line-height:1.15; } #pageHome #homePage .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr li:hover, .gamelobby-content .home_firms .home_firms_tr li:hover { border-color:var(--rez-green) !important; box-shadow:0 0 12px rgba(150,253,106,.12) !important; } /* Original image asset assignments are deliberately retained. To match the screenshot's artwork, replace the PNG/GIF provider files themselves. */ /* Unselected lavender icon assets and selected neon-green assets. */ .icon_home_menu_slot,.icon_home_menu_lc,.icon_home_menu_sport, .icon_home_menu_711,.icon_home_menu_keno,.icon_home_menu_fishing, .icon_home_menu_lottery,.icon_home_menu_cockfight, .fas.fa-luckybox,.fa-dharmachakra { filter:none !important; background-color:transparent !important; background-position:center !important; background-repeat:no-repeat !important; background-size:contain !important; } .icon_home_menu_slot { background-image:url('./img1794_rez8/icons/purple/slot.png') !important; } .icon_home_menu_sport { background-image:url('./img1794_rez8/icons/purple/sports.png') !important; } .icon_home_menu_lc { background-image:url('./img1794_rez8/icons/purple/live_casino.png') !important; } .icon_home_menu_711 { background-image:url('./img1794_rez8/icons/purple/slot.png') !important; } .icon_home_menu_keno { background-image:url('./img1794_rez8/icons/purple/slot.png') !important; } .icon_home_menu_lottery { background-image:url('./img1794_rez8/icons/purple/slot.png') !important; } .fa-dharmachakra { background-image:url('./img1794_rez8/icons/purple/luckyspin.png') !important; } /* For categories not in the supplied icon set, keep the original graphic, recolored lavender. */ .icon_home_menu_fishing,.icon_home_menu_cockfight,.fas.fa-luckybox,.fa-dharmachakra { filter:brightness(0) saturate(100%) invert(66%) sepia(15%) saturate(1113%) hue-rotate(211deg) brightness(110%) contrast(97%) !important; } .on .icon_home_menu_slot, a.on .icon_home_menu_slot { background-image:url('./img1794_rez8/icons/green/slot.png') !important; } .on .icon_home_menu_sport, a.on .icon_home_menu_sport { background-image:url('./img1794_rez8/icons/green/sports.png') !important; } .on .icon_home_menu_lc, a.on .icon_home_menu_lc { background-image:url('./img1794_rez8/icons/green/live_casino.png') !important; } .on .fa-dharmachakra, a.on .fa-dharmachakra { background-image:url('./img1794_rez8/icons/green/luckyspin.png') !important; } .on .icon_home_menu_711, a.on .icon_home_menu_711, .on .icon_home_menu_keno, a.on .icon_home_menu_keno, .on .icon_home_menu_lottery, a.on .icon_home_menu_lottery { background-image:url('./img1794_rez8/icons/green/slot.png') !important; } .on .icon_home_menu_fishing,.on .icon_home_menu_cockfight, .on .fas.fa-luckybox,.on .fa-dharmachakra { filter:brightness(0) saturate(100%) invert(80%) sepia(47%) saturate(683%) hue-rotate(42deg) brightness(109%) contrast(103%) !important; } /* Scale effect kept gentle, and only for active icons. */ .ui-footer .navbar li a .i { animation:none !important; -webkit-animation:none !important; } .on :is(.icon_home_menu_slot,.icon_home_menu_sport,.icon_home_menu_lc, .icon_home_menu_711,.icon_home_menu_keno,.icon_home_menu_lottery, .icon_home_menu_cockfight,.icon_home_menu_fishing,.fas.fa-luckybox,.fa-dharmachakra) { animation:rezActivePulse 3.5s ease-in-out infinite !important; } @keyframes rezActivePulse { 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.055); } } @media (prefers-reduced-motion:reduce) { .on :is(.icon_home_menu_slot,.icon_home_menu_sport,.icon_home_menu_lc,.icon_home_menu_711,.icon_home_menu_keno,.icon_home_menu_lottery,.icon_home_menu_cockfight,.icon_home_menu_fishing,.fas.fa-luckybox,.fa-dharmachakra){animation:none !important;} } /* Menu / transaction icons; explicit PNG replacements avoid unreliable CSS hue filters. */ .payment-menu .icon-funds,.payment-scroll-menu .icon-funds, .member-action .icon-funds { background-image:url('./img1794_rez8/icons/purple/deposit.png') !important; } .payment-menu .icon-withdrawal,.payment-scroll-menu .icon-withdrawal, .mycredit-menu .icon-withdrawal { background-image:url('./img1794_rez8/icons/purple/withdraw.png') !important; } .payment-menu .icon-wallettransfer,.payment-scroll-menu .icon-wallettransfer, .member-action .icon-wallettransfer { background-image:url('./img1794_rez8/icons/purple/transfer.png') !important; } .payment-menu .icon-history,.payment-scroll-menu .icon-history, .mycredit-menu .icon-history { background-image:url('./img1794_rez8/icons/purple/history.png') !important; } .payment-menu .icon-wallets,.payment-scroll-menu .icon-wallets { background-image:url('./img1794_rez8/icons/purple/account.png') !important; } .payment-menu .icon-statement,.payment-scroll-menu .icon-statement { background-image:url('./img1794_rez8/icons/purple/history.png') !important; } .ui-footer .navbar .icon-home-big { background-image:url('./img1794_rez8/icons/purple/home.png') !important; } .ui-footer .navbar .icon-account,.icon-myprofile { background-image:url('./img1794_rez8/icons/purple/account.png') !important; } .ui-footer .navbar .icon-funds { background-image:url('./img1794_rez8/icons/purple/deposit.png') !important; } .ui-footer .navbar .icon-promotion-big { background-image:url('./img1794_rez8/icons/purple/slot.png') !important; } .ui-footer .navbar .icon-livechat,#contactusPage .icon-livechat { background-image:url('./img1794_rez8/icons/purple/help.png') !important; } .ui-footer .navbar li.on .icon-home-big, .ui-footer .navbar a.on .icon-home-big { background-image:url('./img1794_rez8/icons/green/home.png') !important; } .ui-footer .navbar li.on .icon-account, .ui-footer .navbar a.on .icon-account { background-image:url('./img1794_rez8/icons/green/account.png') !important; } .ui-footer .navbar li.on .icon-funds, .ui-footer .navbar a.on .icon-funds { background-image:url('./img1794_rez8/icons/green/deposit.png') !important; } .ui-footer .navbar li.on .icon-promotion-big, .ui-footer .navbar a.on .icon-promotion-big { background-image:url('./img1794_rez8/icons/green/slot.png') !important; } .ui-footer .navbar li.on .icon-livechat, .ui-footer .navbar a.on .icon-livechat { background-image:url('./img1794_rez8/icons/green/help.png') !important; } .ui-footer .navbar [class*='icon-'],.payment-menu [class*='icon-'], .payment-scroll-menu [class*='icon-'] { background-repeat:no-repeat !important; background-position:center !important; background-size:contain !important; filter:none !important; } /* Footer tab area & menu surfaces */ .ui-footer,.ui-footer .navbar,.navbar,.footer,.ui-bar-inherit { background:linear-gradient(180deg,#180620,#110315) !important; border-color:rgba(179,149,217,.54) !important; color:#aa91bd !important; } .ui-footer .navbar li a { color:#a49ab8 !important; border:0 !important; } .ui-footer .navbar li.on a,.ui-footer .navbar li a.on, .ui-footer .navbar li a.ui-btn-active,.ui-footer .navbar li a.active { color:var(--rez-green) !important; border-bottom:2px solid var(--rez-green) !important; background:transparent !important; box-shadow:none !important; } #leftmenu { background:#14041d !important; } #leftmenu a { color:var(--rez-text) !important; } #leftmenu li.on a,#leftmenu li.active a { color:var(--rez-green) !important; } #leftmenu img, #leftmenu .icon { object-fit:contain; } /* Announcement ticker */ .home_marquee,.home_news,.announcement,.notice-marquee, .home_announcement,.notice-bar,[class*='announce-bar'] { color:#e8d8f3 !important; background:rgba(16,4,25,.89) !important; border:1px solid rgba(141,217,100,.43) !important; border-radius:7px !important; } .home_marquee i,.home_news i,.announcement i,.notice-bar i { color:var(--rez-green) !important; } /* Buttons, filters, login/register, payment and search */ #pageHome #homePage .home_join_login > a.home_to_join, .btn-secondary,.btn-default,.button-style-2:not(.is-active) { color:var(--rez-green) !important; background:linear-gradient(160deg,#1f092b,#100218) !important; background-image:linear-gradient(160deg,#1f092b,#100218) !important; border:1px solid var(--rez-lime-border) !important; } #pageHome #homePage .home_join_login > a.home_to_login, .btn-primary,.btn-blue,.play-btn,.download-btn, .standard-button-container .standard-submit-form-button, .m-transfer-container .m-transfer-form .standard-button-container .standard-submit-form-button, .btn.btn-form.confirm-tran-btn,.button-filter,.button-style-1, .search-filter .button-style-1,.swiper-slide .button-style-1, .product-filter .button-style-2.is-active, .m-deposit-landing-container .deposit-tab-container .deposit-tab .active .img-container, .m-deposit-landing-container button[type=submit] { color:#14200e !important; background:linear-gradient(180deg,#b7ff86 0%,#7cdb52 100%) !important; background-image:linear-gradient(180deg,#b7ff86 0%,#7cdb52 100%) !important; border:1px solid #a8ff79 !important; border-radius:9px !important; box-shadow:0 2px 13px rgba(101,236,86,.12) !important; font-weight:750 !important; } .btn-primary:hover,.button-style-1:hover,.play-btn:hover { filter:brightness(1.07); } button,input,select,textarea,.input_item input, .standard-form-field input,.quick_pay_input_item input,.quick_pay_select_item select { accent-color:var(--rez-green); } input,select,textarea,.input_item input,.standard-form-field input { color:var(--rez-text) !important; background:rgba(18,5,27,.93) !important; border-color:rgba(175,144,218,.55) !important; border-radius:8px; } input:focus,select:focus,textarea:focus { outline:1px solid var(--rez-green); border-color:var(--rez-green) !important; } /* Page headers and informational panels. */ .page-title,.standard-label,.section-desc[style], .most-play-container .most-play-title, .m-referral-container .referral-title,.app-download .app-download-title, #depositForm .quick_pay_input_item > label, #depositForm .quick_pay_select_item > label, #depositForm .quick_pay_input_item > div > label, #walletWithdrawalContainer h1[style],#walletTransferContainer h1[style], #historyContainer h1[style],#regPage .regformBox .login_centent .steptitle, #regPage .regformBox .login_centent .input_item .label-aff span { color:#f5ecff !important; font-weight:700 !important; } .most-play-container .header-section img { filter:none !important; } #aboutUsPage .history_nav, .mobile-tnc .info-centre-header,.filtering-container, .mobile-wallet-section .collapse,.m-deposit-landing-container .collapse, #promotionsPage .history_nav { color:var(--rez-text) !important; background:linear-gradient(180deg,#250c33,#160520) !important; background-image:linear-gradient(180deg,#250c33,#160520) !important; border:1px solid rgba(167,134,214,.46) !important; } #aboutUsPage .history_nav li a.on, #historyPage .history_nav li a.on, #slotPage .history_nav li a.on, #downloadPage .history_nav li a.on, #promotionsPage .history_nav li a.on { color:var(--rez-green) !important; } #promotionsPage .history_nav li a, .mobile-wallet-section .collapse p,.m-deposit-landing-container .collapse p { color:var(--rez-text) !important; } .ui-footer .navbar li a,.header,.home_navBox a { transition:background-color .18s ease,border-color .18s ease,color .18s ease; } /* Rewards, VIP and overlays. Avoid the old bright-yellow/gold paint. */ .daily-checkin-content,.daily-checkin-home,.vippagecontent, .vipupgrade-tab-content,.about-content-container,.about-content, .m-vip-about,.m-vip-referral,.vip-benefits,.vip-faq { background-color:rgba(19,5,27,.92) !important; color:var(--rez-text) !important; } .daily-checkin-content { background-image:linear-gradient(160deg,rgba(41,11,58,.91),rgba(11,2,17,.96)) !important; border:1px solid rgba(182,149,220,.65) !important; border-radius:12px; } .daily-checkin-content-title,.daily-checkin-rewardexplain,.daily-checkin-progress-day-text { color:var(--rez-purple-soft) !important; } .daily-checkin-content-button-activeRed { color:var(--rez-green) !important; border:2px solid var(--rez-lime-border) !important; box-shadow:inset 0 0 11px rgba(152,250,112,.11) !important; background:linear-gradient(180deg,#1c0925,#110418) !important; } .daily-checkin-home { background-image:none !important; } /* Defensive responsive rules: 2-up on mobile, stable desktop layout. */ @media (max-width:600px) { #pageHome #homePage .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr li, .gamelobby-content .home_firms .home_firms_tr li { flex-basis:calc(100% - 4px) !important width:calc(100% - 4px) !important max-width:calc(100% - 4px) !important } #pageHome #homePage .home_navBox .home_nav { gap:5px !important; } .home_firms_tr li a > :is(span,p,small,label):last-child { min-height:25px; padding:5px 2px !important; } } @media (min-width:900px) { #pageHome #homePage .home_firmcontent_box .home_firmcontent .home_firms .home_firms_tr li, .gamelobby-content .home_firms .home_firms_tr li { flex:0 0 calc(25% - 6px) !important; width:calc(25% - 6px) !important; max-width:calc(25% - 6px) !important; } } /* ========================================== REZ8 — 918KISS + MEGA888 SPECIAL DESIGN Purple / Neon Green / Silver Theme Full Width / Responsive ========================================== */ /* Main Container */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) { --rz-bg: #17051f; --rz-panel: #240b35; --rz-purple: #c391f5; --rz-green: #92ff51; --rz-silver: #bcb0c6; width: 100% !important; max-width: 100% !important; min-width: 0 !important; padding: 12px 10px 16px !important; box-sizing: border-box !important; background: radial-gradient( ellipse at 50% 0%, rgba(112, 35, 149, .30), transparent 70% ), linear-gradient( 160deg, #20082e 0%, #100519 100% ) !important; border: 1px solid rgba(191, 140, 230, .35); border-radius: 16px; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 8px 24px rgba(0,0,0,.22); } /* Provider Container */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .home_firms, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .home_firms_tr { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; background: transparent !important; box-sizing: border-box !important; } /* Single Provider Card */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .home_firms_tr > li { display: flex !important; flex-direction: column; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; margin: 0 !important; padding: 10px !important; box-sizing: border-box !important; float: none !important; background: linear-gradient( 145deg, #260c35, #100518 ) !important; border: 1px solid rgba(193,171,205,.65); border-radius: 14px; overflow: hidden; box-shadow: 0 6px 20px rgba(0,0,0,.35), inset 0 0 14px rgba(145,60,180,.12); } /* Provider Image Link */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .home_firms_tr > li > a { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 0 12px !important; padding: 0 !important; background: transparent !important; border: 0 !important; text-decoration: none; box-sizing: border-box !important; } /* Provider Artwork Frame */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .icon_home_logo_bg { position: relative; display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; aspect-ratio: 2.35 / 1; margin: 0 !important; padding: 0 !important; overflow: hidden; box-sizing: border-box !important; background: linear-gradient( 135deg, #280c39, #100518 ) !important; border: 1px solid var(--rz-silver) !important; border-radius: 12px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.07), 0 0 14px rgba(154,76,195,.18); } /* Shared Provider Image Styling */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .icon_home_logo_scr_S918, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .icon_home_logo_scr_MEGA { display: block !important; position: absolute; inset: 0; width: 100% !important; height: 100% !important; margin: 0 !important; background-size: contain !important; background-position: center !important; background-repeat: no-repeat !important; border-radius: 11px; filter: none !important; animation: none !important; } /* 918KISS Image */ [id="918kiss_firmcontent"] .icon_home_logo_scr_S918 { background-image: url("./img1794_rez8/918.jpg") !important; } /* MEGA888 Image */ #mega888_firmcontent .icon_home_logo_scr_MEGA { background-image: url("./img1794_rez8/mega.jpg") !important; } /* Account Credentials Panel */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .game-app-info { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 12px !important; box-sizing: border-box !important; background: linear-gradient( 180deg, rgba(58,22,78,.95), rgba(23,7,36,.98) ) !important; border: 1px solid rgba(174,116,211,.40); border-radius: 12px; box-shadow: inset 0 1px 0 rgba(255,255,255,.07); } /* Credentials Table */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .game-appinfo-table { width: 100% !important; max-width: 100% !important; margin: 0 !important; border-collapse: separate !important; border-spacing: 0 5px !important; background: transparent !important; table-layout: auto; } /* Credential Rows */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .game-appinfo-table tr { background: rgba(10,5,19,.46); } /* Credential Cells */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .game-appinfo-table td { height: 40px; padding: 7px 6px !important; border: 0 !important; vertical-align: middle !important; box-sizing: border-box; } /* Username / Password Labels */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .label-loginid, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .label-password { width: 33%; color: #c7a6df !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .1px; text-align: left !important; white-space: nowrap; } /* Credential Value Cells */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .td-app-loginid, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .td-app-password { color: #fff !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .25px; text-align: left !important; overflow: hidden; } /* Username / Password Values */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .app-loginid, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .app-password { color: var(--rz-green) !important; font-weight: 700 !important; overflow-wrap: anywhere; } /* Copy Button Area */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .game-appinfo-table td[role="button"] { width: 38px; text-align: center; cursor: pointer; border-radius: 8px; transition: background .2s, transform .2s; } /* Copy Button Press */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .game-appinfo-table td[role="button"]:active { background: rgba(146,255,81,.12); transform: scale(.95); } /* Copy Icon Color */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .icon_various_files { display: inline-block; vertical-align: middle; filter: brightness(0) saturate(100%) invert(82%) sepia(61%) saturate(520%) hue-rotate(45deg) brightness(108%); } /* Download Button */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .download-app-btn { display: flex !important; align-items: center; justify-content: center; width: 100% !important; max-width: 100% !important; min-height: 46px; margin-top: 12px !important; padding: 11px 14px !important; box-sizing: border-box !important; float: none !important; clear: both; background: linear-gradient( 180deg, #a8ff6b 0%, #65c934 100% ) !important; color: #10200b !important; border: 1px solid #d1ffac !important; border-radius: 10px !important; font-size: 14px !important; font-weight: 800 !important; letter-spacing: .3px; box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 4px 12px rgba(102,240,57,.22); cursor: pointer; transition: filter .2s, transform .2s; } /* Android Icon */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .download-app-btn .fa-android { font-size: 19px; color: #17360a !important; margin-right: 3px; } /* Download Button Press */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .download-app-btn:active { transform: scale(.98); filter: brightness(.92); } /* =================================== MOBILE RESPONSIVE =================================== */ @media (max-width: 480px) { :is([id="918kiss_firmcontent"], #mega888_firmcontent) { padding: 10px 8px 12px !important; border-radius: 13px; } :is([id="918kiss_firmcontent"], #mega888_firmcontent) .home_firms_tr > li { padding: 8px !important; } :is([id="918kiss_firmcontent"], #mega888_firmcontent) .game-app-info { padding: 9px !important; } :is([id="918kiss_firmcontent"], #mega888_firmcontent) .label-loginid, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .label-password { font-size: 11px !important; } :is([id="918kiss_firmcontent"], #mega888_firmcontent) .td-app-loginid, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .td-app-password { font-size: 12px !important; } } /* =================================== ACCESSIBILITY =================================== */ @media (prefers-reduced-motion: reduce) { :is([id="918kiss_firmcontent"], #mega888_firmcontent) * { transition: none !important; animation: none !important; } } /* =================================== REZ8 - 918KISS + MEGA888 FULL WIDTH =================================== */ :is([id="918kiss_firmcontent"], #mega888_firmcontent), :is([id="918kiss_firmcontent"], #mega888_firmcontent) .home_firms, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .home_firms_tr, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .home_firms_tr > li, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .home_firms_tr > li > a, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .icon_home_logo_bg, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .game-app-info, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .game-appinfo-table, :is([id="918kiss_firmcontent"], #mega888_firmcontent) .download-app-btn { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } /* Provider card layout */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .home_firms_tr > li { float: none !important; display: flex !important; flex-direction: column; height: auto !important; margin: 0 !important; } /* Provider image proportions */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .icon_home_logo_bg { aspect-ratio: 2.35 / 1; height: auto !important; } /* Download button */ :is([id="918kiss_firmcontent"], #mega888_firmcontent) .download-app-btn { float: none !important; display: flex !important; } /* ========================================== REZ8 — FORCE 918KISS & MEGA888 FULL WIDTH Override original 33% provider grid ========================================== */ /* Provider list containers */ .home_firms:has(.icon_home_logo_scr_MEGA), .home_firms:has(.icon_home_logo_scr_S918), .home_firms_tr:has(.icon_home_logo_scr_MEGA), .home_firms_tr:has(.icon_home_logo_scr_S918) { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; } /* Force individual provider card full width */ .home_firms_tr > li:has(.icon_home_logo_scr_MEGA), .home_firms_tr > li:has(.icon_home_logo_scr_S918) { display: flex !important; flex-direction: column !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 100% !important; height: auto !important; margin: 0 !important; float: none !important; grid-column: 1 / -1 !important; box-sizing: border-box !important; } /* Keep provider artwork proportional */ .home_firms_tr > li:has(.icon_home_logo_scr_MEGA) .icon_home_logo_bg, .home_firms_tr > li:has(.icon_home_logo_scr_S918) .icon_home_logo_bg { height: auto !important; aspect-ratio: 2.35 / 1 !important; } /* Keep download button centered */ .home_firms_tr > li:has(.icon_home_logo_scr_MEGA) .download-app-btn, .home_firms_tr > li:has(.icon_home_logo_scr_S918) .download-app-btn { display: flex !important; align-items: center; justify-content: center; } /* ========================================== REZ8 — JOIN NOW & LOGIN BUTTONS Purple + Neon Green Luxury Theme ========================================== */ .home_join_login { display: flex !important; width: 100% !important; max-width: 100% !important; gap: 0 !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; border-radius: 13px; overflow: hidden; } /* Shared Button Styling */ .home_join_login > a { display: flex !important; flex: 1 1 50% !important; align-items: center; justify-content: center; width: 50% !important; min-width: 0 !important; min-height: 54px; padding: 12px 8px !important; margin: 0 !important; box-sizing: border-box !important; font-size: clamp(16px, 4vw, 25px) !important; font-weight: 800 !important; line-height: 1.2 !important; text-align: center !important; text-transform: uppercase; text-decoration: none !important; letter-spacing: .3px; transition: filter .25s ease, box-shadow .25s ease, transform .2s ease; } /* JOIN NOW */ .home_join_login > a.home_to_join { background: linear-gradient( 180deg, #20082b 0%, #13051d 100% ) !important; color: #92ff51 !important; border: 1px solid #7bd849 !important; border-right: 0 !important; border-radius: 13px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), inset 0 0 12px rgba(146,255,81,.04); } /* LOGIN */ .home_join_login > a.home_to_login { background: linear-gradient( 180deg, #b3ff80 0%, #8be65a 55%, #65cc37 100% ) !important; color: #102008 !important; border: 1px solid #b5ff86 !important; border-radius: 0 13px 13px 0 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.42), inset 0 -2px 4px rgba(30,100,10,.12); } /* Hover */ @media (hover: hover) { .home_join_login > a:hover { filter: brightness(1.12); } } /* Press Effect */ .home_join_login > a:active { filter: brightness(.92); } /* Keyboard Focus */ .home_join_login > a:focus-visible { outline: 2px solid #fff; outline-offset: -4px; } /* Mobile */ @media (max-width: 480px) { .home_join_login > a { min-height: 48px; font-size: 17px !important; padding: 11px 6px !important; } } /* ========================================== REZ8 — LUCKY SPIN PREMIUM DESIGN Purple / Neon Green / Metallic Silver Mobile Responsive | Full Width ========================================== */ #luckyspin_firmcontent { --rz-purple: #c391f5; --rz-green: #92ff51; --rz-silver: #bcb0c6; --rz-dark: #12051c; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; padding: 14px 12px 18px !important; box-sizing: border-box !important; background: radial-gradient( ellipse at 50% 0%, rgba(130, 40, 175, .25), transparent 70% ), linear-gradient( 160deg, #240a34 0%, #12051c 100% ) !important; border: 1px solid rgba(195,145,245,.35); border-radius: 16px; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 8px 25px rgba(0,0,0,.28); } /* ========================================== PROVIDER LIST — FULL WIDTH ========================================== */ #luckyspin_firmcontent .home_firms_tr { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 !important; padding: 0 !important; list-style: none !important; background: transparent !important; } #luckyspin_firmcontent .game-item-luckyspin { display: flex !important; flex-direction: column; align-items: center; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; float: none !important; margin: 0 !important; padding: 12px !important; box-sizing: border-box !important; background: linear-gradient( 145deg, #2a103a 0%, #12051c 100% ) !important; border: 1px solid rgba(190,175,205,.65); border-radius: 15px; box-shadow: inset 0 0 20px rgba(160,70,210,.12), 0 6px 20px rgba(0,0,0,.3); } /* ========================================== LUCKY SPIN IMAGE Original Banner Proportion 422 × 363 ========================================== */ #luckyspin_firmcontent .game-item-luckyspin > a { display: block !important; width: 100% !important; max-width: 422px !important; height: auto !important; margin: 0 auto 14px !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-sizing: border-box !important; } #luckyspin_firmcontent .icon_home_logo_bg { position: relative; display: block !important; width: 100% !important; max-width: 422px !important; height: auto !important; aspect-ratio: 422 / 363; margin: 0 auto !important; padding: 0 !important; float: none !important; overflow: hidden; box-sizing: border-box !important; background: radial-gradient( circle at 50% 50%, #381449, #100419 80% ) !important; border: 1px solid #bcb0c6 !important; border-radius: 14px; box-shadow: 0 0 14px rgba(185,95,240,.22), inset 0 0 20px rgba(0,0,0,.3); } /* Lucky Spin Artwork */ #luckyspin_firmcontent .luckyspin_banner { position: absolute !important; inset: 0; display: block !important; width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0 !important; background-image: url("./img1794_rez8/luckyspin.png") !important; background-position: center !important; background-repeat: no-repeat !important; background-size: contain !important; filter: none !important; animation: none !important; } /* ========================================== PLAY NOW BUTTON ========================================== */ #luckyspin_firmcontent .spinplaynow-btn { position: relative; display: flex !important; align-items: center; justify-content: center; width: 100% !important; max-width: 422px !important; min-height: 50px; margin: 0 auto !important; padding: 12px 18px !important; box-sizing: border-box !important; background: linear-gradient( 180deg, #b8ff82 0%, #92ef58 50%, #60c934 100% ) !important; color: #102008 !important; border: 1px solid #caffab !important; border-radius: 12px !important; font-size: 16px !important; font-weight: 800 !important; text-align: center !important; text-transform: uppercase; letter-spacing: .7px; box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -2px 4px rgba(30,100,10,.15), 0 4px 15px rgba(110,245,60,.22); cursor: pointer; transition: filter .2s ease, transform .2s ease; } #luckyspin_firmcontent .spinplaynow-btn span { color: #102008 !important; font-size: inherit !important; font-weight: 800 !important; } #luckyspin_firmcontent .spinplaynow-btn:active { transform: scale(.98); filter: brightness(.93); } /* ========================================== SPIN TICKET COUNTER ========================================== */ #luckyspin_firmcontent .lucky-spin_ticket { display: flex !important; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; width: 100% !important; min-height: 58px; margin: 14px 0 0 !important; padding: 12px !important; box-sizing: border-box !important; background: linear-gradient( 110deg, #321044 0%, #1a0827 100% ) !important; border: 1px solid rgba(195,145,245,.5); border-radius: 12px; color: #d7b5f0 !important; font-size: 14px !important; font-weight: 600 !important; box-shadow: inset 0 0 12px rgba(180,80,220,.12); } /* Ticket Icon */ #luckyspin_firmcontent .lucky-spin_ticket .i { display: flex !important; align-items: center; justify-content: center; color: #c391f5 !important; filter: none !important; } #luckyspin_firmcontent .lucky-spin_ticket .icon-ticket { color: #c391f5 !important; font-size: 22px !important; } /* Ticket Text */ #luckyspin_firmcontent .lucky-spin_ticket .title { color: #e5cafa !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: .5px; text-transform: uppercase; } /* Available Ticket Number */ #luckyspin_firmcontent .lucky-spin_ticket .tk-count { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 30px; padding: 4px 12px; box-sizing: border-box; background: rgba(146,255,81,.10) !important; border: 1px solid rgba(146,255,81,.55); border-radius: 8px; color: #92ff51 !important; font-size: 18px !important; font-weight: 800 !important; text-shadow: 0 0 8px rgba(146,255,81,.3); } /* ========================================== LUCKY SPIN TERMS & CONDITIONS ========================================== */ #luckyspin_firmcontent .lucky-spin_rule { width: 100% !important; max-width: 100% !important; margin: 16px 0 0 !important; padding: 16px 14px !important; box-sizing: border-box !important; background: linear-gradient( 180deg, #220c30 0%, #11051a 100% ) !important; border: 1px solid rgba(180,140,205,.4); border-radius: 13px; box-shadow: inset 0 1px 0 rgba(255,255,255,.05); } /* Terms Text — English / Chinese / Malay */ #luckyspin_firmcontent .lucky-spin_rule pre { display: block; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; color: #d8c2e5 !important; font-family: Arial, "Microsoft YaHei", "PingFang SC", sans-serif !important; font-size: 12.5px !important; font-weight: 400 !important; line-height: 1.85 !important; white-space: pre-wrap !important; overflow-wrap: anywhere !important; word-break: normal !important; text-align: left !important; box-sizing: border-box !important; } /* ========================================== MOBILE RESPONSIVE ========================================== */ @media (max-width: 480px) { #luckyspin_firmcontent { padding: 10px 8px 14px !important; border-radius: 13px; } #luckyspin_firmcontent .game-item-luckyspin { padding: 9px !important; border-radius: 12px; } #luckyspin_firmcontent .spinplaynow-btn { min-height: 46px; font-size: 15px !important; } #luckyspin_firmcontent .lucky-spin_ticket { padding: 10px 8px !important; font-size: 12px !important; } #luckyspin_firmcontent .lucky-spin_ticket .title { font-size: 12px !important; } #luckyspin_firmcontent .lucky-spin_rule { padding: 12px 10px !important; } #luckyspin_firmcontent .lucky-spin_rule pre { font-size: 11.5px !important; line-height: 1.8 !important; } } /* ========================================== REDUCED MOTION ========================================== */ @media (prefers-reduced-motion: reduce) { #luckyspin_firmcontent * { animation: none !important; transition: none !important; } } /* ========================================== REZ8 — MEMBER WALLET COLOR THEME Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* Main Wallet Container */ .idr_box.payment-menu.theme1 { background: linear-gradient( 145deg, #270d36 0%, #160720 55%, #100519 100% ) !important; border: 1px solid rgba(181,145,196,.65) !important; border-radius: 14px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 4px 18px rgba(0,0,0,.25), 0 0 12px rgba(142,57,180,.10) !important; } /* Wallet Inner Background */ .idr_box.payment-menu.theme1 .idr_content, .idr_box.payment-menu.theme1 .idr_content_top, .idr_box.payment-menu.theme1 .idr_content_bottom { background: transparent !important; } /* Username */ .idr_box.payment-menu.theme1 .title-balance { color: #d8b7ef !important; font-weight: 600 !important; text-shadow: 0 0 5px rgba(180,100,220,.15); } /* Currency MYR */ .idr_box.payment-menu.theme1 .displaycurrency-txt { color: #92ff51 !important; font-weight: 700 !important; } /* Balance Amount */ .idr_box.payment-menu.theme1 #spanBalance { color: #92ff51 !important; font-weight: 700 !important; text-shadow: 0 0 8px rgba(146,255,81,.18); } /* Refresh Icon */ .idr_box.payment-menu.theme1 .home_header_refresh { filter: brightness(0) saturate(100%) invert(78%) sepia(55%) saturate(560%) hue-rotate(42deg) brightness(110%) !important; } /* Eye Icon */ .idr_box.payment-menu.theme1 .home_header_eyes { color: #c391f5 !important; filter: drop-shadow(0 0 4px rgba(195,145,245,.25)); } /* Voucher & Retrieve */ .idr_box.payment-menu.theme1 :is(.menu-item-myvoucher, .menu-item-withdrawalall) { background: transparent !important; } .idr_box.payment-menu.theme1 :is(.menu-item-myvoucher, .menu-item-withdrawalall) a { color: #d7b9ec !important; text-decoration: none !important; } /* Voucher / Retrieve Icons */ .idr_box.payment-menu.theme1 :is(.menu-item-myvoucher, .menu-item-withdrawalall) .i, .idr_box.payment-menu.theme1 :is(.menu-item-myvoucher, .menu-item-withdrawalall) .icon { color: #c391f5 !important; } /* Divider */ .idr_box.payment-menu.theme1 .homepage-div-hr { border-color: rgba(195,145,245,.3) !important; background: linear-gradient( 90deg, transparent, rgba(195,145,245,.45), transparent ) !important; } /* ========================================== PAYMENT MENU KEEP EXISTING GRID / POSITION ========================================== */ /* Individual Menu Items */ .idr_box.payment-menu.theme1 .idr_content_bottom > li { background: transparent !important; } /* Menu Button Appearance */ .idr_box.payment-menu.theme1 .idr_content_bottom > li > a { background: linear-gradient( 180deg, #2d103e 0%, #170820 100% ) !important; color: #e7d6f2 !important; text-decoration: none !important; } /* Menu Icon Color */ .idr_box.payment-menu.theme1 .idr_content_bottom .i > i { filter: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(1050%) hue-rotate(215deg) brightness(105%) !important; } /* Menu Text */ .idr_box.payment-menu.theme1 .idr_content_bottom li span { color: #e5d3f0 !important; font-weight: 600 !important; } /* Selected / Active Menu */ .idr_box.payment-menu.theme1 .idr_content_bottom > li:is(.active,.on) > a { background: linear-gradient( 180deg, #29421e, #162511 ) !important; border-color: #92ff51 !important; box-shadow: inset 0 0 10px rgba(146,255,81,.10), 0 0 9px rgba(146,255,81,.12) !important; } .idr_box.payment-menu.theme1 .idr_content_bottom > li:is(.active,.on) .i > i { filter: brightness(0) saturate(100%) invert(82%) sepia(53%) saturate(750%) hue-rotate(43deg) brightness(108%) !important; } .idr_box.payment-menu.theme1 .idr_content_bottom > li:is(.active,.on) span { color: #92ff51 !important; } /* Desktop Hover */ @media (hover:hover) { .idr_box.payment-menu.theme1 .idr_content_bottom > li > a:hover { background: linear-gradient( 180deg, #3a1751, #1b0928 ) !important; border-color: #c391f5 !important; } } /* ========================================== REZ8 — MOBILE WALLET THEME Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* Main Wallet */ .wallet-info { background: linear-gradient( 145deg, #270d36 0%, #170820 55%, #100519 100% ) !important; border-color: rgba(190,155,205,.65) !important; border-radius: 14px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 4px 18px rgba(0,0,0,.28), 0 0 12px rgba(145,65,185,.10) !important; } /* Top Section */ .wallet-info .top-content { background: linear-gradient( 135deg, #2b103b, #180822 ) !important; border-color: rgba(190,145,215,.35) !important; } /* Member Wallet */ .wallet-info .member-wallet { background: transparent !important; } /* Wallet Header */ .wallet-info .wallet-header { background: transparent !important; } /* Balance Title */ .wallet-info .wallet-header .title { color: #d8b7ef !important; text-shadow: 0 0 5px rgba(180,100,220,.15); } /* Currency */ .wallet-info .displaycurrency-txt { color: #92ff51 !important; font-weight: 700 !important; } /* Balance Amount */ .wallet-info .member-balance { color: #92ff51 !important; font-weight: 700 !important; text-shadow: 0 0 9px rgba(146,255,81,.22); } /* Eye Icon */ .wallet-info .eye-icon { color: #c391f5 !important; filter: brightness(0) saturate(100%) invert(76%) sepia(20%) saturate(930%) hue-rotate(213deg) brightness(106%) !important; } /* ========================================== REFRESH ICON — INLINE SVG ========================================== */ .wallet-info .mobile-beta-refresh path { fill: #92ff51 !important; } .wallet-info .mobile-beta-refresh stop:first-child { stop-color: #c8ff91 !important; } .wallet-info .mobile-beta-refresh stop:last-child { stop-color: #68d536 !important; } .wallet-info .mobile-beta-refresh { filter: drop-shadow( 0 0 3px rgba(146,255,81,.25) ) !important; } /* ========================================== RETRIEVE / TRANSFER ACTIONS ========================================== */ .wallet-info .member-action { background: transparent !important; } /* Action Boxes */ .wallet-info .member-action .action-box { background: linear-gradient( 180deg, #321344, #1d0a2b ) !important; border-color: rgba(181,135,205,.55) !important; border-radius: 10px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 0 0 8px rgba(170,80,200,.06) !important; } /* Action Text */ .wallet-info .member-action .action-label { color: #e0c7ef !important; font-weight: 600 !important; } /* Action Icons */ .wallet-info .member-action .i { background: transparent !important; } .wallet-info .member-action :is(.icon_home_header_restore, .icon-wallettransfer) { filter: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(1000%) hue-rotate(213deg) brightness(105%) !important; } /* Action Hover */ @media (hover: hover) { .wallet-info .member-action .action-box:hover { background: linear-gradient( 180deg, #422058, #260d35 ) !important; border-color: #c391f5 !important; } } /* ========================================== BOTTOM WALLET MENU KEEP EXISTING ARRANGEMENT ========================================== */ /* Bottom Container */ .wallet-info .bottom-content { background: linear-gradient( 180deg, #1e0a2b, #11051a ) !important; border-color: rgba(170,120,195,.35) !important; } /* Original Menu */ .wallet-info .idr_content_bottom { background: transparent !important; } /* Individual Items */ .wallet-info .idr_content_bottom > li { background: transparent !important; } /* Menu Links */ .wallet-info .idr_content_bottom > li > a { background: linear-gradient( 180deg, #301140, #190824 ) !important; color: #e6d5ef !important; border-color: rgba(165,125,185,.55) !important; border-radius: 10px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), inset 0 0 9px rgba(155,75,190,.06) !important; text-decoration: none !important; } /* Menu Labels */ .wallet-info .idr_content_bottom li span { color: #e5d3f0 !important; font-weight: 600 !important; } /* Icons — Purple Unselected */ .wallet-info .idr_content_bottom .i > i { filter: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(1050%) hue-rotate(215deg) brightness(105%) !important; } /* Selected Menu */ .wallet-info .idr_content_bottom > li:is(.active, .on) > a { background: linear-gradient( 180deg, #29451d, #162712 ) !important; border-color: #92ff51 !important; box-shadow: inset 0 0 10px rgba(146,255,81,.1), 0 0 8px rgba(146,255,81,.1) !important; } /* Selected Text */ .wallet-info .idr_content_bottom > li:is(.active, .on) span { color: #92ff51 !important; } /* Selected Icons */ .wallet-info .idr_content_bottom > li:is(.active, .on) .i > i { filter: brightness(0) saturate(100%) invert(82%) sepia(53%) saturate(750%) hue-rotate(43deg) brightness(108%) !important; } /* Hover */ @media (hover: hover) { .wallet-info .idr_content_bottom > li > a:hover { background: linear-gradient( 180deg, #3b1850, #210b30 ) !important; border-color: #c391f5 !important; } } /* ========================================== REZ8 — ACCOUNT MENU THEME Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* Account Menu Main Section */ .account-menu-section { background: linear-gradient( 145deg, #270d36 0%, #170820 55%, #100519 100% ) !important; border-color: rgba(190,155,205,.55) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 4px 16px rgba(0,0,0,.22) !important; } /* Individual Account Menu */ .account-menu-section .shortcut-menu { background: linear-gradient( 180deg, #301140 0%, #190824 100% ) !important; border-color: rgba(165,125,185,.50) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 0 0 8px rgba(165,75,195,.06) !important; color: #e5d3f0 !important; } /* Icon Wrapper */ .account-menu-section .menu-img-wrapper { background: transparent !important; border-color: rgba(195,145,245,.25) !important; } /* Preserve Original Icon Containers */ .account-menu-section .menu-img-wrapper .i { background: transparent !important; } /* Icons — Lavender Purple */ .account-menu-section .menu-img-wrapper .icon { filter: brightness(0) saturate(100%) invert(76%) sepia(20%) saturate(1050%) hue-rotate(215deg) brightness(105%) !important; color: #c391f5 !important; } /* Account Menu Labels */ .account-menu-section .shortcut-label { color: #e7d6f2 !important; font-weight: 600 !important; text-shadow: 0 0 4px rgba(175,90,215,.08); } /* Unread Message Badge */ .account-menu-section .unread-msg { background: linear-gradient( 180deg, #b4ff82, #71d83e ) !important; color: #122009 !important; border-color: #caffad !important; box-shadow: 0 0 7px rgba(146,255,81,.22) !important; } /* Active / Selected Menu */ .account-menu-section .shortcut-menu:is(.active, .on, .selected) { background: linear-gradient( 180deg, #304b21, #192b13 ) !important; border-color: #92ff51 !important; box-shadow: inset 0 0 10px rgba(146,255,81,.10), 0 0 10px rgba(146,255,81,.12) !important; } /* Active Icon */ .account-menu-section .shortcut-menu:is(.active, .on, .selected) .menu-img-wrapper .icon { filter: brightness(0) saturate(100%) invert(82%) sepia(53%) saturate(800%) hue-rotate(43deg) brightness(108%) !important; color: #92ff51 !important; } /* Active Label */ .account-menu-section .shortcut-menu:is(.active, .on, .selected) .shortcut-label { color: #92ff51 !important; } /* Logout — Subtle Special Accent */ .account-menu-section .menu-logout .shortcut-label { color: #e2b8f7 !important; } /* Hover — Desktop Only */ @media (hover: hover) { .account-menu-section .shortcut-menu:hover { background: linear-gradient( 180deg, #3b1950, #230c32 ) !important; border-color: #c391f5 !important; } .account-menu-section .shortcut-menu:hover .shortcut-label { color: #92ff51 !important; } } /* ========================================== REZ8 — ACCOUNT MENU FONT AWESOME ICONS CSS ONLY | ORIGINAL LAYOUT UNCHANGED ========================================== */ /* Load Font Awesome Free icons online */ @font-face { font-family: "Rez8FontAwesome"; src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/webfonts/fa-solid-900.woff2") format("woff2"); font-style: normal; font-weight: 900; font-display: swap; } /* Remove original icon sprite artwork */ .account-menu-section .shortcut-menu .menu-img-wrapper .i > i.icon { background: none !important; background-image: none !important; -webkit-mask-image: none !important; mask-image: none !important; filter: none !important; color: #c391f5 !important; font-size: 0 !important; text-indent: 0 !important; font-style: normal !important; } /* Shared Font Awesome appearance */ .account-menu-section .shortcut-menu .menu-img-wrapper .i > i.icon::before { display: inline-block !important; font-family: "Rez8FontAwesome" !important; font-size: 23px !important; font-weight: 900 !important; font-style: normal !important; line-height: 1 !important; color: #c391f5 !important; background: none !important; filter: none !important; -webkit-font-smoothing: antialiased; text-rendering: auto; } /* Hide any old decorative icon pseudo-element */ .account-menu-section .shortcut-menu .menu-img-wrapper .i > i.icon::after { content: none !important; display: none !important; } /* =================================== INDIVIDUAL ICONS =================================== */ /* 1. Profile — User */ .account-menu-section .menu-myaccountprofile .icon::before { content: "\f007" !important; } /* 2. Referral — Users */ .account-menu-section .menu-myaccountreferral .icon::before { content: "\f0c0" !important; } /* 3. Change Password — Lock */ .account-menu-section .menu-myaccountchangepassword .icon::before { content: "\f023" !important; } /* 4. Message — Envelope */ .account-menu-section .menu-inbox .icon::before { content: "\f0e0" !important; } /* 5. Voucher — Ticket */ .account-menu-section .menu-myvoucher .icon::before { content: "\f145" !important; } /* 6. Language — Globe */ .account-menu-section .menu-language .icon::before { content: "\f0ac" !important; } /* 7. Logout — Sign Out */ .account-menu-section .menu-logout .icon::before { content: "\f2f5" !important; } /* =================================== NEON GREEN ACTIVE / HOVER ICONS =================================== */ .account-menu-section .shortcut-menu:is(.active, .on, .selected) .menu-img-wrapper .i > i.icon::before { color: #92ff51 !important; } @media (hover: hover) { .account-menu-section .shortcut-menu:hover .menu-img-wrapper .i > i.icon::before { color: #92ff51 !important; text-shadow: 0 0 8px rgba(146,255,81,.35); } } /* ========================================== REZ8 — PROMOTION CARD THEME Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* Main Promotion Card */ .promotions_item { background: linear-gradient( 145deg, #2a0e3a 0%, #170720 55%, #100519 100% ) !important; border: 1px solid rgba(190,155,205,.65) !important; border-radius: 13px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 5px 18px rgba(0,0,0,.28), 0 0 12px rgba(155,75,195,.10) !important; } /* Promotion Image Area */ .promotions_item .img { background: #1a0827 !important; border-color: rgba(195,145,245,.35) !important; } /* Keep Original Image Size / Ratio */ .promotions_item .img img { border-radius: 8px !important; box-shadow: 0 3px 12px rgba(0,0,0,.20); } /* Bottom Promotion Information */ .promotions_item .promotitembottom { background: linear-gradient( 180deg, #291038 0%, #170720 100% ) !important; border-color: rgba(195,145,245,.3) !important; } /* Promotion Title */ .promotions_item .promotitembottom .p1 { color: #eddcf8 !important; font-weight: 700 !important; text-shadow: 0 0 5px rgba(195,145,245,.12); } /* Promotion Bonus / Description */ .promotions_item .promotitembottom .p2 { color: #92ff51 !important; font-weight: 700 !important; text-shadow: 0 0 8px rgba(146,255,81,.20); } /* Button Container */ .promotions_item .m-promotion-button-container { background: transparent !important; } /* Shared Button Appearance */ .promotions_item .m-promotion-button-container .btn-common { border-radius: 9px !important; font-weight: 700 !important; text-transform: uppercase !important; text-decoration: none !important; transition: background .2s ease, border-color .2s ease, filter .2s ease, box-shadow .2s ease; } /* =================================== DETAILS — PURPLE / SILVER =================================== */ .promotions_item .btn-blue-promo { background: linear-gradient( 180deg, #44205c 0%, #280e3b 100% ) !important; color: #f0def9 !important; border: 1px solid #a98abb !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 3px 8px rgba(0,0,0,.18) !important; } /* =================================== APPLY NOW — NEON GREEN =================================== */ .promotions_item .btn-red-promo { background: linear-gradient( 180deg, #b5ff80 0%, #92ee56 50%, #65cb36 100% ) !important; color: #14230b !important; border: 1px solid #caffaa !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 3px 12px rgba(110,240,55,.20) !important; } /* Hover Effects */ @media (hover: hover) { .promotions_item .btn-blue-promo:hover { background: linear-gradient( 180deg, #5a2b76, #321345 ) !important; border-color: #c391f5 !important; } .promotions_item .btn-red-promo:hover { filter: brightness(1.10); box-shadow: 0 0 12px rgba(146,255,81,.35) !important; } } /* Press Effects */ .promotions_item .btn-common:active { filter: brightness(.92); } /* Focus Accessibility */ .promotions_item .btn-common:focus-visible { outline: 2px solid #c391f5; outline-offset: 2px; } /* ========================================== REZ8 — COMPLETE PROMOTIONS THEME Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* MAIN PROMOTIONS PAGE */ #promotionsPage.theme1 { background: #12061d !important; color: #e8d9f2 !important; } /* CATEGORY FILTER AREA */ #promotionsPage .filtering-container { background: linear-gradient( 180deg, #2a103c, #160820 ) !important; border-color: rgba(190,155,205,.45) !important; } /* CATEGORY NAVIGATION */ #promotionsPage .history_nav { background: transparent !important; } #promotionsPage .history_nav li { background: linear-gradient( 180deg, #301344, #1b0a29 ) !important; border-color: rgba(175,135,195,.45) !important; } #promotionsPage .history_nav li a, #promotionsPage .history_nav li span { color: #d9bdec !important; } /* SELECTED CATEGORY */ #promotionsPage .history_nav li.active, #promotionsPage .history_nav li:has(> a.on) { background: linear-gradient( 180deg, #b5ff82, #6dd23d ) !important; border-color: #caffaa !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 0 10px rgba(146,255,81,.16) !important; } #promotionsPage .history_nav li.active a, #promotionsPage .history_nav li.active span, #promotionsPage .history_nav a.on, #promotionsPage .history_nav a.on span { color: #14230b !important; } /* ========================================== PROMOTION CARDS ========================================== */ #promotionsPage .history_content, #promotionsPage .history_list, #promotionsPage .history_list_item { background-color: transparent !important; } #promotionsPage .promotions_item { background: linear-gradient( 150deg, #2b103b, #12051c ) !important; border: 1px solid rgba(190,160,205,.65) !important; border-radius: 13px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 5px 18px rgba(0,0,0,.25) !important; } #promotionsPage .promotions_item .img { background: #190823 !important; } #promotionsPage .promotitembottom { background: linear-gradient( 180deg, #291038, #16071f ) !important; } #promotionsPage .promotitembottom .p1 { color: #f0e2fa !important; font-weight: 700 !important; } #promotionsPage .promotitembottom .p2 { color: #92ff51 !important; font-weight: 700 !important; } /* DETAILS BUTTON */ #promotionsPage .btn-blue-promo, #pagePromotionsDetail .btn-blue-promo { background: linear-gradient( 180deg, #4c2464, #280f39 ) !important; color: #f1e1fa !important; border: 1px solid #ab8aba !important; border-radius: 9px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12) !important; } /* APPLY NOW BUTTON */ #promotionsPage .btn-red-promo, #pagePromotionsDetail .btn-red-promo { background: linear-gradient( 180deg, #b6ff82, #91ec55, #64c933 ) !important; color: #132509 !important; border: 1px solid #caffab !important; border-radius: 9px !important; font-weight: 800 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.42), 0 3px 10px rgba(146,255,81,.17) !important; } /* ========================================== PROMOTION DETAIL POPUP ========================================== */ #pagePromotionsDetail { background: #12061d !important; color: #e7d7f1 !important; } /* DETAIL HEADER */ #pagePromotionsDetail .pDetailTitle { background: linear-gradient( 180deg, #321344, #1c0829 ) !important; border-color: rgba(195,145,245,.45) !important; box-shadow: 0 3px 12px rgba(0,0,0,.22) !important; } #pagePromotionsDetail .pDetailTitle .titleText, #pagePromotionsDetail .pDetailTitle .titleText span { color: #f2e1fd !important; font-weight: 700 !important; } /* CLOSE ICON — KEEP EXISTING ICON */ #pagePromotionsDetail .icon_language_close { filter: brightness(0) saturate(100%) invert(82%) sepia(52%) saturate(550%) hue-rotate(45deg) brightness(108%) !important; } /* DETAIL BODY */ #pagePromotionsDetail #promotionsDetailPage, #pagePromotionsDetail .promodetailContent { background: #12061d !important; } #pagePromotionsDetail .promodetail_banner { background: #1a0826 !important; border-color: rgba(195,145,245,.3) !important; } #pagePromotionsDetail .promodetail_textbox { background: linear-gradient( 180deg, #241030, #12061c ) !important; color: #e8d8f3 !important; } /* PROMOTION TITLE */ #pagePromotionsDetail .promosection .p_title, #pagePromotionsDetail .promosection .p_title.blue { background: linear-gradient( 90deg, #3a1650, #210c30 ) !important; color: #92ff51 !important; border-color: rgba(195,145,245,.4) !important; } /* DESCRIPTION */ #pagePromotionsDetail #promo-title { color: #f1e3fa !important; font-weight: 700 !important; } #pagePromotionsDetail #promo-description { color: #92ff51 !important; font-weight: 700 !important; } /* ========================================== TERMS & CONDITIONS CONTENT CUSTOM CONTENT INSIDE #contentDiv ========================================== */ #pagePromotionsDetail #contentDiv { background: #12061d !important; color: #dfcce9 !important; } /* TERMS MAIN WRAPPER */ #pagePromotionsDetail #contentDiv .wrap { background: linear-gradient( 180deg, #1b0928, #100519 ) !important; } /* REZ8 BRAND HEADER */ #pagePromotionsDetail #contentDiv .topbar { background: #1b0928 !important; border-bottom-color: #92ff51 !important; } /* REZ8 BRAND LETTER COLORS */ #pagePromotionsDetail #contentDiv .brand-name .b1, #pagePromotionsDetail #contentDiv .footer-brand .b1 { color: #e5d1f4 !important; } #pagePromotionsDetail #contentDiv .brand-name .b2, #pagePromotionsDetail #contentDiv .footer-brand .b2 { color: #92ff51 !important; } #pagePromotionsDetail #contentDiv .topbar-tag { color: #c391f5 !important; } /* MAIN PROMOTION HERO */ #pagePromotionsDetail #contentDiv .hero { background: linear-gradient( 180deg, #301041, #190824 ) !important; border-bottom-color: rgba(195,145,245,.35) !important; } #pagePromotionsDetail #contentDiv .hero-eye { color: #c391f5 !important; } #pagePromotionsDetail #contentDiv .hero h1 { color: #f5eafd !important; } #pagePromotionsDetail #contentDiv .hero h1 .hl { color: #92ff51 !important; } #pagePromotionsDetail #contentDiv .hero-sub { color: #d4b8e9 !important; } /* ========================================== 3 KEY TERMS HIGHLIGHT CARDS ========================================== */ /* DEPOSIT REQUIREMENT */ #pagePromotionsDetail #contentDiv .crit.gold { background: #261236 !important; border-color: #92ff51 !important; border-left-color: #92ff51 !important; } #pagePromotionsDetail #contentDiv .crit.gold :is(.crit-label, .crit-amount, .crit-desc) { color: #aaff77 !important; } #pagePromotionsDetail #contentDiv .crit.gold .crit-dot { background: #92ff51 !important; } /* WITHDRAWAL REQUIREMENT */ #pagePromotionsDetail #contentDiv .crit.cyan { background: #220e32 !important; border-color: #c391f5 !important; border-left-color: #c391f5 !important; } #pagePromotionsDetail #contentDiv .crit.cyan :is(.crit-label, .crit-amount, .crit-desc) { color: #d7b4f8 !important; } #pagePromotionsDetail #contentDiv .crit.cyan .crit-dot { background: #c391f5 !important; } /* RISK / RESTRICTION */ #pagePromotionsDetail #contentDiv .crit.red { background: #2b132f !important; border-color: #bc93cd !important; border-left-color: #bc93cd !important; } #pagePromotionsDetail #contentDiv .crit.red :is(.crit-label, .crit-amount, .crit-desc) { color: #ebc9f0 !important; } #pagePromotionsDetail #contentDiv .crit.red .crit-dot { background: #bc93cd !important; } /* ========================================== TERMS & CONDITIONS LIST ========================================== */ #pagePromotionsDetail #contentDiv .divider-line { background: rgba(195,145,245,.3) !important; } #pagePromotionsDetail #contentDiv .divider-text { color: #92ff51 !important; } /* Individual Terms */ #pagePromotionsDetail #contentDiv .tnc-item { background: linear-gradient( 90deg, #21102e, #16091e ) !important; border-color: rgba(162,124,185,.4) !important; } /* Term Number */ #pagePromotionsDetail #contentDiv .tnc-item .num { background: #342044 !important; color: #92ff51 !important; border-color: #74528b !important; } /* Term Description */ #pagePromotionsDetail #contentDiv .tnc-item .txt { color: #e1d0ea !important; } /* Override original inline highlight colors */ /* Original Gold -> Neon Green */ #pagePromotionsDetail #contentDiv .tnc-item strong[style*="#ffd000"] { color: #92ff51 !important; } /* Original Cyan -> Lavender */ #pagePromotionsDetail #contentDiv .tnc-item strong[style*="#00e5ff"] { color: #c391f5 !important; } /* Original Pink -> Soft Rose */ #pagePromotionsDetail #contentDiv .tnc-item strong[style*="#ff6ab0"] { color: #f6a9d0 !important; } /* ========================================== TERMS FOOTER ========================================== */ #pagePromotionsDetail #contentDiv .footer { background: #180820 !important; border-color: rgba(190,155,205,.4) !important; border-top-color: #92ff51 !important; } #pagePromotionsDetail #contentDiv .footer-line { background: rgba(195,145,245,.3) !important; } #pagePromotionsDetail #contentDiv .footer-note { color: #c391f5 !important; } /* ========================================== BUTTON INTERACTION ========================================== */ @media (hover: hover) { #promotionsPage .btn-red-promo:hover, #pagePromotionsDetail .btn-red-promo:hover { filter: brightness(1.1); } #promotionsPage .btn-blue-promo:hover, #pagePromotionsDetail .btn-blue-promo:hover { border-color: #c391f5 !important; filter: brightness(1.15); } } /* ========================================== REZ8 — MEMBER REGISTRATION PAGE Purple / Neon Green / Silver Theme ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* Main Registration Page */ #registrationPage { --rz-green: #92ff51; --rz-purple: #c391f5; --rz-silver: #bcb0c6; background: linear-gradient( 160deg, #260c35 0%, #170720 50%, #100519 100% ) !important; color: #e8d8f2 !important; } /* Registration Form Container */ #registrationPage .reg-step-container { background: linear-gradient( 160deg, #2b103b 0%, #180822 55%, #100519 100% ) !important; border-color: rgba(190,155,205,.55) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 5px 20px rgba(0,0,0,.24) !important; } /* ========================================== REGISTRATION TITLE ========================================== */ #registrationPage .form-title { color: #f2e5fa !important; font-weight: 800 !important; text-shadow: 0 0 8px rgba(195,145,245,.13); } #registrationPage .form-title span { color: inherit; } #registrationPage .form-title span:last-child { color: #92ff51 !important; } /* ========================================== REGISTRATION PROGRESS BAR ========================================== */ #registrationPage .reg-progress-bar-section { background: transparent !important; } /* Inactive Step */ #registrationPage .step-wrapper { background: linear-gradient( 180deg, #301341, #190a25 ) !important; color: #c391f5 !important; border: 1px solid #80628f !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important; } /* Active / Current / Completed Step */ #registrationPage .step-wrapper.on, #registrationPage .step-wrapper.current-step { background: linear-gradient( 180deg, #b4ff82, #71d33d ) !important; color: #142309 !important; border-color: #caffab !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 0 10px rgba(146,255,81,.22) !important; } /* Completed Step Tick SVG */ #registrationPage .step-wrapper svg path { fill: #c391f5 !important; } #registrationPage .step-wrapper.on svg path { fill: #142309 !important; } /* Connecting Progress Lines */ #registrationPage .progressBar { background: #6b487e !important; border-color: #6b487e !important; } #registrationPage .progressBar.on, #registrationPage .progressBar.active { background: #92ff51 !important; border-color: #92ff51 !important; } /* ========================================== FORM FIELD BACKGROUNDS ========================================== */ #registrationPage .reg-form-section, #registrationPage .register-input-container, #registrationPage .standard-form-field { background: transparent !important; } /* Input Wrapper */ #registrationPage .standard-form-field-wrapper { background: linear-gradient( 180deg, #24102f, #14081e ) !important; border: 1px solid #745489 !important; border-radius: 9px !important; box-shadow: inset 0 1px 3px rgba(0,0,0,.2) !important; } /* Input Fields — Keep Original Dimensions */ #registrationPage input.standard-input { background: transparent !important; color: #f3eafa !important; border-color: #745489 !important; border-radius: 9px !important; caret-color: #92ff51 !important; } /* Placeholder */ #registrationPage input.standard-input::placeholder { color: #a991bc !important; opacity: 1 !important; } /* Selected Input */ #registrationPage .standard-form-field-wrapper:focus-within { border-color: #92ff51 !important; box-shadow: 0 0 0 1px rgba(146,255,81,.15), 0 0 10px rgba(146,255,81,.12) !important; } #registrationPage input.standard-input:focus { outline-color: #92ff51 !important; box-shadow: none !important; } /* Chrome Autofill */ #registrationPage input.standard-input:-webkit-autofill { -webkit-text-fill-color: #f3eafa !important; box-shadow: inset 0 0 0 1000px #20102d !important; caret-color: #92ff51 !important; } /* ========================================== PASSWORD VISIBILITY ICON ========================================== */ #registrationPage .standard-password-eye { color: #c391f5 !important; fill: #c391f5 !important; } #registrationPage .standard-password-eye path { fill: #c391f5 !important; } /* ========================================== AFFILIATE / REFERRAL ID ========================================== */ #registrationPage .standard-label, #registrationPage .standard-label span { color: #d8b9ec !important; font-weight: 600 !important; } #registrationPage .affiliateid input.afffield { color: #f3eafa !important; } /* ========================================== VALIDATION MESSAGES ========================================== */ #registrationPage .standard-error-validation, #registrationPage .standard-error-validation span { color: #ff9db5 !important; } #registrationPage .text-danger { color: #ff9db5 !important; } /* ========================================== MOBILE NUMBER / COUNTRY CODE ========================================== */ #registrationPage .standard-select { background: linear-gradient( 180deg, #301342, #1a0927 ) !important; color: #e9d7f5 !important; border-color: #826494 !important; } /* Country Code */ #registrationPage #dropdownBtn, #registrationPage #dropdownBtn span { color: #e7d1f6 !important; } /* Dropdown Arrow */ #registrationPage .standard-select-arrow { border-color: #c391f5 !important; } /* Country Dropdown */ #registrationPage .standard-select-dropdown { background: #1d0b2a !important; border-color: #826494 !important; box-shadow: 0 6px 16px rgba(0,0,0,.35) !important; } /* Country Option */ #registrationPage .standard-select-options { background: #241033 !important; color: #dfcaed !important; } /* Country Selected */ #registrationPage .standard-select-options.active { background: #30451f !important; color: #92ff51 !important; } /* ========================================== CAPTCHA ========================================== */ #registrationPage .dob-field { background: transparent !important; } #registrationPage .dob-field img { border: 1px solid #826494 !important; box-shadow: 0 0 8px rgba(195,145,245,.12) !important; } /* ========================================== NEXT / REGISTER BUTTONS ========================================== */ /* Shared Submit Button */ #registrationPage .standard-submit-form-button { background: linear-gradient( 180deg, #b6ff82 0%, #91eb55 50%, #65c934 100% ) !important; color: #132309 !important; border: 1px solid #caffab !important; border-radius: 10px !important; font-weight: 800 !important; text-transform: uppercase !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 4px 12px rgba(146,255,81,.18) !important; } /* Disabled Next Button */ #registrationPage .standard-submit-form-button:disabled { background: linear-gradient( 180deg, #483454, #30223b ) !important; color: #a994b6 !important; border-color: #655570 !important; box-shadow: none !important; cursor: not-allowed !important; } /* Back Button */ #registrationPage .back-button { background: linear-gradient( 180deg, #46205e, #240e34 ) !important; color: #e5d1f4 !important; border-color: #a785b7 !important; border-radius: 9px !important; } /* Back Arrow */ #registrationPage .back-button svg path { fill: #e5d1f4 !important; } /* Submit Button Hover */ @media (hover: hover) { #registrationPage .standard-submit-form-button:not(:disabled):hover { filter: brightness(1.1); } } /* ========================================== REGISTRATION NOTICE ========================================== */ #registrationPage .reg-notice-section, #registrationPage .reg-notice-section span { color: #baa5ca !important; } #registrationPage .reg-notice-section a { color: #92ff51 !important; font-weight: 700 !important; text-decoration: underline; text-decoration-color: rgba(146,255,81,.5); } /* ========================================== ALREADY HAVE AN ACCOUNT? ========================================== */ #registrationPage .prompt-login-section { background: transparent !important; border-color: rgba(195,145,245,.25) !important; } #registrationPage .prompt-login-section span { color: #cdb4df !important; } #registrationPage .prompt-login-section a { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 7px rgba(146,255,81,.15); } /* ========================================== REGISTRATION BANNER / CAROUSEL Keep Original Images and Dimensions ========================================== */ #registrationPage .registration_banner { background: #170820 !important; } #registrationPage .registration_banner .owl-dots .owl-dot.active span { background: #92ff51 !important; } #registrationPage .registration_banner .owl-nav button { color: #c391f5 !important; } /* ========================================== REDUCED MOTION ========================================== */ @media (prefers-reduced-motion: reduce) { #registrationPage * { transition: none !important; } } /* ========================================== REZ8 — LOGIN PAGE PREMIUM THEME Purple / Neon Green / Metallic Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* MAIN LOGIN PAGE */ #loginPage.theme1 { --rz-green: #92ff51; --rz-purple: #c391f5; --rz-silver: #bcb0c6; background: radial-gradient( ellipse at 50% 0%, rgba(120,45,165,.22), transparent 65% ), linear-gradient( 160deg, #260c35 0%, #170720 55%, #100519 100% ) !important; color: #e9d9f3 !important; } /* LOGIN LOGO AREA */ /* Preserve original logo and dimensions */ #loginPage .logo_big { background: transparent !important; } #loginPage .logo_big img { filter: drop-shadow( 0 3px 10px rgba(195,145,245,.18) ); } /* LOGIN FORM CONTAINER */ #loginPage .login_centent { background: linear-gradient( 160deg, rgba(43,16,59,.65), rgba(17,5,26,.65) ) !important; border-color: rgba(190,155,205,.40) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06); } /* ========================================== USERNAME & PASSWORD INPUT ROWS ========================================== */ #loginPage .login_centent_item.input_item { background: linear-gradient( 180deg, #2b103b 0%, #170820 100% ) !important; border-color: rgba(175,140,195,.65) !important; box-shadow: inset 0 1px 2px rgba(255,255,255,.05), inset 0 -1px 3px rgba(0,0,0,.18) !important; } /* INPUT ICON LABEL BACKGROUND */ #loginPage .login_centent_item.input_item > label { background: linear-gradient( 180deg, #3a1850, #241032 ) !important; border-color: rgba(195,145,245,.35) !important; } /* USERNAME / PASSWORD ICONS */ #loginPage .icon_login_user, #loginPage .icon_login_key { filter: brightness(0) saturate(100%) invert(76%) sepia(20%) saturate(1000%) hue-rotate(215deg) brightness(105%) !important; } /* INPUT WRAPPER */ #loginPage .standard-form-field-wrapper { background: transparent !important; border-color: rgba(175,140,195,.35) !important; } /* INPUT FIELDS */ #loginPage input.standard-input { background: transparent !important; color: #f4eafa !important; caret-color: #92ff51 !important; border-color: rgba(170,130,195,.45) !important; font-weight: 500 !important; } /* PLACEHOLDERS */ #loginPage input.standard-input::placeholder { color: #b39ac6 !important; opacity: 1 !important; } /* INPUT FOCUS EFFECT */ #loginPage .login_centent_item.input_item:focus-within { border-color: #92ff51 !important; box-shadow: inset 0 0 0 1px rgba(146,255,81,.20), 0 0 10px rgba(146,255,81,.12) !important; } #loginPage .standard-form-field-wrapper:focus-within { border-color: #92ff51 !important; } #loginPage input.standard-input:focus { outline-color: #92ff51 !important; } /* BROWSER AUTOFILL */ #loginPage input.standard-input:-webkit-autofill { -webkit-text-fill-color: #f4eafa !important; -webkit-box-shadow: 0 0 0 1000px #21102f inset !important; caret-color: #92ff51 !important; } /* ========================================== PASSWORD VISIBILITY ICON ========================================== */ #loginPage .standard-password-eye { color: #c391f5 !important; fill: #c391f5 !important; } #loginPage .standard-password-eye path { fill: #c391f5 !important; } /* ========================================== REMEMBER ME ========================================== */ #loginPage .rememberme-formgroup { background: transparent !important; color: #d3b9e4 !important; } /* Checkbox */ #loginPage #rememberMe { accent-color: #92ff51 !important; } /* Remember Me Text */ #loginPage .remember-me { color: #d8c0e9 !important; font-weight: 500 !important; } /* ========================================== LOGIN BUTTON — NEON GREEN ========================================== */ #loginPage .login_btn .btn-common, #loginPage .login_btn .btn-blue { background: linear-gradient( 180deg, #b8ff84 0%, #93ed58 50%, #66c936 100% ) !important; color: #132409 !important; border: 1px solid #caffab !important; border-radius: 10px !important; font-weight: 800 !important; text-transform: uppercase !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -2px 4px rgba(35,100,15,.12), 0 4px 14px rgba(146,255,81,.20) !important; text-shadow: none !important; transition: filter .2s ease, box-shadow .2s ease; } /* LOGIN BUTTON HOVER */ @media (hover: hover) { #loginPage .login_btn .btn-common:hover { filter: brightness(1.10); box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 0 15px rgba(146,255,81,.35) !important; } } /* LOGIN BUTTON PRESS */ #loginPage .login_btn .btn-common:active { filter: brightness(.93); } /* ========================================== FORGOT PASSWORD ========================================== */ #loginPage .login_forgetpsd { background: transparent !important; } #loginPage .login_forgetpsd a, #loginPage .login_forgetpsd span { color: #c391f5 !important; font-weight: 600 !important; text-decoration: none !important; } @media (hover: hover) { #loginPage .login_forgetpsd a:hover, #loginPage .login_forgetpsd a:hover span { color: #92ff51 !important; } } /* ========================================== LOGIN ERROR MESSAGE ========================================== */ #loginPage #loginErr { background: linear-gradient( 180deg, #3a172d, #240e21 ) !important; border-color: rgba(255,115,145,.65) !important; box-shadow: inset 0 0 8px rgba(255,100,140,.08) !important; } #loginPage #loginErr, #loginPage #loginErr *, #loginPage #loginErr span { color: #ff9db5 !important; } /* ========================================== REGISTER LINK SECTION ========================================== */ #loginPage .login_toreg { background: linear-gradient( 180deg, #271035, #170720 ) !important; border-color: rgba(195,145,245,.32) !important; } /* Normal Registration Text */ #loginPage .login_toreg > span { color: #cdb4df !important; } /* HERE Registration Link */ #loginPage .login_toreg .m-register-link { color: #92ff51 !important; font-weight: 800 !important; text-decoration: none !important; text-shadow: 0 0 7px rgba(146,255,81,.18); } @media (hover: hover) { #loginPage .login_toreg .m-register-link:hover { color: #baff91 !important; } } /* ========================================== ACCESSIBILITY ========================================== */ #loginPage a:focus-visible, #loginPage input:focus-visible { outline: 2px solid #92ff51; outline-offset: 2px; } @media (prefers-reduced-motion: reduce) { #loginPage * { transition: none !important; } } /* ========================================== REZ8 — FORGOT / RESET PASSWORD THEME Purple / Neon Green / Metallic Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* MAIN RESET PASSWORD BACKGROUND */ .request-background { background: radial-gradient( ellipse at 50% 0%, rgba(120, 45, 165, .22), transparent 65% ), linear-gradient( 160deg, #260c35 0%, #170720 55%, #100519 100% ) !important; color: #e8d8f2 !important; } /* MAIN RESET PASSWORD CONTAINER */ .request-background .reset-request-container { background: linear-gradient( 150deg, #2b103b 0%, #180822 55%, #100519 100% ) !important; border-color: rgba(190,155,205,.55) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 5px 20px rgba(0,0,0,.24) !important; } /* FORM CONTENT */ .request-background .reset-request-form, .request-background .reqotp-form { background: transparent !important; color: #e8d8f2 !important; } /* ========================================== PAGE TITLE / DESCRIPTION ========================================== */ .request-background .reset-request-title { color: #f0e3fa !important; font-weight: 700 !important; text-shadow: 0 0 8px rgba(195,145,245,.12); } /* ========================================== MOBILE NO / CAPTCHA LABELS ========================================== */ .request-background .reset-email-label { color: #d8b9ec !important; font-weight: 600 !important; } /* ========================================== INPUT CONTAINERS ========================================== */ .request-background .reset-request-input-container { background: linear-gradient( 180deg, #271035, #160820 ) !important; border-color: rgba(175,140,195,.65) !important; box-shadow: inset 0 1px 3px rgba(0,0,0,.18) !important; } /* MOBILE NUMBER & CAPTCHA INPUT */ .request-background .reset-request-input-container input { background: transparent !important; color: #f4eafa !important; border-color: rgba(175,140,195,.55) !important; caret-color: #92ff51 !important; } /* INPUT PLACEHOLDER */ .request-background .reset-request-input-container input::placeholder { color: #b49dc6 !important; opacity: 1 !important; } /* INPUT CONTAINER FOCUS */ .request-background .reset-request-input-container:focus-within { border-color: #92ff51 !important; box-shadow: 0 0 0 1px rgba(146,255,81,.15), 0 0 10px rgba(146,255,81,.12) !important; } .request-background .reset-request-input-container input:focus { outline-color: #92ff51 !important; } /* BROWSER AUTOFILL */ .request-background .reset-request-input-container input:-webkit-autofill { -webkit-text-fill-color: #f4eafa !important; -webkit-box-shadow: 0 0 0 1000px #21102f inset !important; caret-color: #92ff51 !important; } /* ========================================== CAPTCHA IMAGE PRESERVE ORIGINAL DIMENSIONS ========================================== */ .request-background #imgCaptcha { border-color: #9a79ad !important; box-shadow: 0 0 8px rgba(195,145,245,.16) !important; } /* ========================================== VALIDATION / ERROR MESSAGES ========================================== */ .request-background .reset-request-error, .request-background .reset-request-error span, .request-background .general-error-msg { color: #ff9db5 !important; } .request-background .text-danger { color: #ff9db5 !important; } /* ========================================== REQUEST CODE BUTTON — NEON GREEN ========================================== */ .request-background .reset-button-container { background: transparent !important; } .request-background .reset-button-container .btn-common, .request-background .reset-button-container .btn-blue { background: linear-gradient( 180deg, #b8ff84 0%, #93ed58 50%, #66c936 100% ) !important; color: #132409 !important; border: 1px solid #caffab !important; border-radius: 10px !important; font-weight: 800 !important; text-transform: uppercase !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -2px 4px rgba(35,100,15,.12), 0 4px 14px rgba(146,255,81,.20) !important; text-shadow: none !important; transition: filter .2s ease, box-shadow .2s ease; } /* BUTTON HOVER */ @media (hover: hover) { .request-background .reset-button-container .btn-common:hover { filter: brightness(1.1); box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 0 15px rgba(146,255,81,.35) !important; } } /* BUTTON PRESS */ .request-background .reset-button-container .btn-common:active { filter: brightness(.93); } /* DISABLED BUTTON */ .request-background .reset-button-container .btn-common:disabled { background: linear-gradient( 180deg, #483454, #30223b ) !important; color: #a994b6 !important; border-color: #655570 !important; box-shadow: none !important; cursor: not-allowed !important; } /* ========================================== PASSWORD RESET INSTRUCTIONS ========================================== */ .request-background .reset-reqeust-top ul { background: transparent !important; } .request-background .reset-reqeust-top ul li { color: #d8c3e6 !important; } .request-background .reset-reqeust-top ul li::marker { color: #92ff51 !important; } /* ========================================== ACCESSIBILITY ========================================== */ .request-background .reset-request-input-container input:focus-visible { outline: 2px solid #92ff51; outline-offset: 1px; } @media (prefers-reduced-motion: reduce) { .request-background * { transition: none !important; } } /* ========================================== REZ8 — LANGUAGE SELECTION PAGE Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* MAIN LANGUAGE PAGE */ #pageLanguage, #languagePage { background: linear-gradient( 160deg, #260c35 0%, #170720 55%, #100519 100% ) !important; color: #e8d8f2 !important; } /* LANGUAGE REGION CONTAINER */ #languagePage .region_box { background: transparent !important; border-color: rgba(190,155,205,.35) !important; } /* MALAYSIA LANGUAGE PANEL */ #languagePage .reginItem { background: linear-gradient( 145deg, #2b103b 0%, #190925 60%, #11061a 100% ) !important; border: 1px solid rgba(190,155,205,.55) !important; border-radius: 13px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 5px 18px rgba(0,0,0,.25) !important; } /* COUNTRY TITLE — MALAYSIA */ #languagePage .reginItem > .title { color: #f0e2fa !important; font-weight: 700 !important; text-shadow: 0 0 7px rgba(195,145,245,.15); } /* ICON & LANGUAGE CONTENT */ #languagePage .iconsAndText { background: transparent !important; border-color: rgba(195,145,245,.25) !important; } /* MALAYSIA FLAG / LANGUAGE ICON */ /* Preserve original flag artwork and dimensions */ #languagePage .icon_language_malay { filter: drop-shadow(0 2px 5px rgba(0,0,0,.25)); } /* LANGUAGE LIST */ #languagePage .iconsAndText ul { background: transparent !important; } /* LANGUAGE ROWS */ #languagePage .iconsAndText ul li { background: linear-gradient( 180deg, #301340, #1b0a29 ) !important; border-color: rgba(175,135,195,.4) !important; } /* LANGUAGE LINKS */ #languagePage .iconsAndText ul li a { color: #dfc8ee !important; text-decoration: none !important; } /* LANGUAGE TEXT */ #languagePage .iconsAndText ul li .mainFont { color: #dfc8ee !important; font-weight: 600 !important; } /* ========================================== SELECTED LANGUAGE — NEON GREEN ========================================== */ /* Active Language Row */ #languagePage .iconsAndText ul li:has(.mainFont.on) { background: linear-gradient( 180deg, #304b20, #1a2d12 ) !important; border-color: #92ff51 !important; box-shadow: inset 0 0 10px rgba(146,255,81,.10), 0 0 9px rgba(146,255,81,.12) !important; } /* Active Language Text */ #languagePage .iconsAndText ul li .mainFont.on { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 7px rgba(146,255,81,.22); } /* Active Link */ #languagePage .iconsAndText ul li:has(.mainFont.on) a { color: #92ff51 !important; } /* ========================================== HOVER EFFECTS ========================================== */ @media (hover: hover) { #languagePage .iconsAndText ul li:hover { background: linear-gradient( 180deg, #3b1950, #230d33 ) !important; border-color: #c391f5 !important; } #languagePage .iconsAndText ul li:hover .mainFont { color: #baff91 !important; } /* Keep selected language green */ #languagePage .iconsAndText ul li:has(.mainFont.on):hover { background: linear-gradient( 180deg, #304b20, #1a2d12 ) !important; border-color: #92ff51 !important; } } /* ========================================== KEYBOARD FOCUS ========================================== */ #languagePage .iconsAndText a:focus-visible, #languagePage .iconsAndText [role="button"]:focus-visible { outline: 2px solid #92ff51; outline-offset: 2px; } /* ========================================== REZ8 — DEPOSIT / PAYMENT PAGE Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* Scope styling to deposit forms only */ .m-forms-page:has(.deposit-tab-container) { --rz-green: #92ff51; --rz-purple: #c391f5; --rz-silver: #bcb0c6; background: linear-gradient( 160deg, #260c35 0%, #170720 55%, #100519 100% ) !important; color: #e9d9f3 !important; } /* ========================================== DEPOSIT OPTIONS HEADER ========================================== */ .deposit-label-offline-bank-container { background: linear-gradient( 180deg, #301342, #1a0927 ) !important; border-color: rgba(190,155,205,.5) !important; } .deposit-label-offline-bank { background: transparent !important; } .deposit-label-offline-bank .st-title { color: #f0e2fa !important; font-weight: 700 !important; text-shadow: 0 0 7px rgba(195,145,245,.15); } /* Mandatory Indicator */ .deposit-label-offline-bank .standard-mandatory { color: #e9d7f5 !important; } /* ========================================== PAYMENT TAB CONTAINER ========================================== */ .deposit-tab-container { background: linear-gradient( 145deg, #29103a, #12061c ) !important; border-color: rgba(190,155,205,.45) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06); } .deposit-tab-container .deposit-tab { background: transparent !important; } /* INACTIVE PAYMENT TAB */ .deposit-tab-container .tab-header { background: linear-gradient( 180deg, #301241, #190924 ) !important; color: #d6b9e9 !important; border-color: rgba(160,120,185,.5) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important; } /* Tab Text */ .deposit-tab-container .tab-header :is(span, p, label) { color: #dfcaef !important; } /* ========================================== SELECTED PAYMENT TAB ========================================== */ .deposit-tab-container .tab-header.active, .deposit-tab-container .tab-header.on { background: linear-gradient( 180deg, #365425, #1b3014 ) !important; color: #92ff51 !important; border-color: #92ff51 !important; box-shadow: inset 0 0 10px rgba(146,255,81,.10), 0 0 10px rgba(146,255,81,.15) !important; } .deposit-tab-container .tab-header:is(.active, .on) :is(span, p, label) { color: #92ff51 !important; font-weight: 700 !important; } /* Payment Logo Container */ .deposit-tab-container .img-container { background: transparent !important; } /* Keep Original FPAY / Payment SVG Logos */ .deposit-tab-container .img-container svg { filter: drop-shadow(0 1px 3px rgba(0,0,0,.18)); } /* ========================================== DEPOSIT FORM CONTENT ========================================== */ .m-forms-page:has(.deposit-tab-container) .standard-tabcontent-container { background: linear-gradient( 180deg, #251033, #13071d ) !important; color: #e8d8f2 !important; border-color: rgba(180,145,200,.4) !important; } /* Input Field Wrappers */ .m-forms-page:has(.deposit-tab-container) .standard-form-field-wrapper { background: linear-gradient( 180deg, #271035, #160820 ) !important; border-color: rgba(175,140,195,.6) !important; box-shadow: inset 0 1px 3px rgba(0,0,0,.2) !important; } /* Form Inputs */ .m-forms-page:has(.deposit-tab-container) input.standard-input { background: transparent !important; color: #f4eafa !important; border-color: rgba(175,140,195,.5) !important; caret-color: #92ff51 !important; } /* Placeholders */ .m-forms-page:has(.deposit-tab-container) input::placeholder { color: #b49dc6 !important; opacity: 1 !important; } /* Input Focus */ .m-forms-page:has(.deposit-tab-container) .standard-form-field-wrapper:focus-within { border-color: #92ff51 !important; box-shadow: 0 0 0 1px rgba(146,255,81,.15), 0 0 10px rgba(146,255,81,.12) !important; } /* Labels */ .m-forms-page:has(.deposit-tab-container) :is(.standard-label, .standard-form-label) { color: #d8b9ec !important; } /* Dropdowns */ .m-forms-page:has(.deposit-tab-container) .standard-select { background: linear-gradient( 180deg, #301342, #1a0927 ) !important; color: #e9d7f5 !important; border-color: #826494 !important; } /* Dropdown Options */ .m-forms-page:has(.deposit-tab-container) .standard-select-dropdown { background: #1d0b2a !important; border-color: #826494 !important; } /* ========================================== DEPOSIT ACTION BUTTONS ========================================== */ /* Primary Buttons */ .m-forms-page:has(.deposit-tab-container) :is(.standard-submit-form-button, .btn-blue) { background: linear-gradient( 180deg, #b8ff84 0%, #93ed58 50%, #66c936 100% ) !important; color: #132409 !important; border-color: #caffab !important; border-radius: 10px !important; font-weight: 800 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 4px 12px rgba(146,255,81,.18) !important; } /* Disabled Buttons */ .m-forms-page:has(.deposit-tab-container) :is(.standard-submit-form-button, .btn-blue):disabled { background: linear-gradient( 180deg, #483454, #30223b ) !important; color: #a994b6 !important; border-color: #655570 !important; box-shadow: none !important; } /* Validation Messages */ .m-forms-page:has(.deposit-tab-container) :is(.standard-error-validation, .text-danger) { color: #ff9db5 !important; } /* Hover Effects */ @media (hover: hover) { .deposit-tab-container .tab-header:not(.active):not(.on):hover { background: linear-gradient( 180deg, #422057, #240e33 ) !important; border-color: #c391f5 !important; } .m-forms-page:has(.deposit-tab-container) :is(.standard-submit-form-button, .btn-blue):not(:disabled):hover { filter: brightness(1.10); } } /* ========================================== REZ8 — DEPOSIT PROMOTION SELECTION Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* Main Promotion List */ .promotion-list { background: transparent !important; } /* Individual Promotion Card */ .promotion-list .promotion-card { background: linear-gradient( 145deg, #2b103b 0%, #170820 100% ) !important; border-color: rgba(190,155,205,.55) !important; border-radius: 12px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 3px 12px rgba(0,0,0,.2) !important; color: #e8d8f2 !important; transition: background .2s ease, border-color .2s ease, box-shadow .2s ease; } /* Promotion Inner Content */ .promotion-list .promotion-item { background: transparent !important; } /* Selection Image / Radio Area */ .promotion-list .promotion-card .img-container { background-color: #261034 !important; border-color: rgba(195,145,245,.4) !important; } /* Radio Button Container */ .promotion-list .radio-input-card { background-color: transparent !important; } /* Unselected Radio Circle */ .promotion-list .radio-input-card .checkmark { background-color: #1b0a28 !important; border-color: #a88abd !important; box-shadow: inset 0 0 5px rgba(0,0,0,.25) !important; } /* ========================================== PROMOTION TITLE & DESCRIPTION ========================================== */ /* Promotion Title */ .promotion-list .promo-title { color: #f0e2fa !important; font-weight: 700 !important; } /* Minimum Deposit */ .promotion-list .promo-minamount { color: #c391f5 !important; } /* Bonus / Winover / Settings */ .promotion-list .promo-settings { color: #d7b9ec !important; } /* Description Container */ .promotion-list .promotion-card-desc { background: transparent !important; } /* ========================================== ACTIVE / SELECTED PROMOTION ========================================== */ .promotion-list .promotion-card.active { background: linear-gradient( 145deg, #30431f 0%, #1e1b25 55%, #170c22 100% ) !important; border-color: #92ff51 !important; box-shadow: inset 0 0 12px rgba(146,255,81,.08), 0 0 10px rgba(146,255,81,.14) !important; } /* Selected Title */ .promotion-list .promotion-card.active .promo-title { color: #92ff51 !important; } /* Selected Information */ .promotion-list .promotion-card.active :is(.promo-minamount, .promo-settings) { color: #e0edce !important; } /* Selected Radio */ .promotion-list .promotion-card.active .radio-input-card .checkmark { background-color: #92ff51 !important; border-color: #d4ffad !important; box-shadow: 0 0 8px rgba(146,255,81,.32) !important; } /* Existing Radio Check Indicator */ .promotion-list .promotion-card.active .radio-input-card .checkmark::after { border-color: #18310d !important; background-color: #18310d; } /* ========================================== DETAILS BUTTON — PURPLE / SILVER ========================================== */ .promotion-list .btn-blue-promo { background: linear-gradient( 180deg, #4c2464 0%, #280f39 100% ) !important; color: #f1e1fa !important; border: 1px solid #ae8fbd !important; border-radius: 9px !important; font-weight: 700 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 3px 8px rgba(0,0,0,.18) !important; } /* Selected Promotion Details Button */ .promotion-list .promotion-card.active .btn-blue-promo { background: linear-gradient( 180deg, #aaff79, #69cf39 ) !important; color: #142509 !important; border-color: #caffaa !important; } /* ========================================== HOVER ========================================== */ @media (hover: hover) { .promotion-list .promotion-card:not(.active):hover { background: linear-gradient( 145deg, #38174d, #1c092a ) !important; border-color: #c391f5 !important; } .promotion-list .btn-blue-promo:hover { filter: brightness(1.1); } } /* ========================================== KEYBOARD FOCUS ========================================== */ .promotion-list .btn-blue-promo:focus-visible { outline: 2px solid #92ff51; outline-offset: 2px; } /* ========================================== REZ8 — SIDEBAR FONT ICON REPLACEMENT Font Awesome 6 / CSS ONLY Original Layout Unchanged ========================================== */ /* Load Font Awesome Solid Webfont */ @font-face { font-family: "Rez8UISolid"; src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/webfonts/fa-solid-900.woff2") format("woff2"); font-weight: 900; font-style: normal; font-display: swap; } /* =================================== 1. REMOVE OLD MENU SPRITE ICONS =================================== */ .ui-panel-inner > ul > li .sm-item > i { background: none !important; background-image: none !important; -webkit-mask: none !important; mask: none !important; filter: none !important; font-size: 0 !important; font-style: normal !important; } /* New Font Awesome Icon */ .ui-panel-inner > ul > li .sm-item > i::before { display: inline-block !important; font-family: "Rez8UISolid" !important; font-size: 20px !important; font-weight: 900 !important; font-style: normal !important; line-height: 1 !important; color: #c391f5 !important; background: none !important; background-image: none !important; -webkit-mask: none !important; mask: none !important; filter: none !important; text-indent: 0 !important; -webkit-font-smoothing: antialiased; } .ui-panel-inner > ul > li .sm-item > i::after { content: none !important; display: none !important; } /* =================================== 2. SIDEBAR NAVIGATION ICONS =================================== */ /* Home */ .ui-panel-inner .list-item-home .sm-item > i::before { content: "\f015" !important; } /* 7-11 Games */ .ui-panel-inner .list-item-mobile .sm-item > i::before { content: "\f11b" !important; } /* Promotions */ .ui-panel-inner .list-item-promotion .sm-item > i::before { content: "\f06b" !important; } /* Live Chat */ .ui-panel-inner .list-item-livechat .sm-item > i::before { content: "\f590" !important; } /* Contact Us */ .ui-panel-inner .list-item-contactus .sm-item > i::before { content: "\f0e0" !important; } /* Language */ .ui-panel-inner .list-item-language .sm-item > i::before { content: "\f0ac" !important; } /* Logout */ .ui-panel-inner .list-item-logout .sm-item > i::before { content: "\f2f5" !important; } /* =================================== 3. ACCOUNT ICONS Username & Wallet Balance =================================== */ .ui-panel-inner .sidebar-menu-accountinfo .i > i { background: none !important; background-image: none !important; filter: none !important; font-size: 0 !important; font-style: normal !important; } /* Shared Account Icon Style */ .ui-panel-inner .sidebar-menu-accountinfo .i > i::before { display: inline-block !important; font-family: "Rez8UISolid" !important; font-size: 18px !important; font-weight: 900 !important; line-height: 1 !important; color: #c391f5 !important; background: none !important; filter: none !important; } /* Username — User */ .ui-panel-inner .list-item-loginid .i > i::before { content: "\f007" !important; } /* Wallet — Wallet */ .ui-panel-inner .list-item-wallet .i > i::before { content: "\f555" !important; } /* =================================== 4. BACK ARROW FONT ICON =================================== */ .ui-panel-inner .sidemenu-back-logo { position: relative; } /* Hide old back artwork but retain its dimensions */ .ui-panel-inner .sidemenu-back-logo img { opacity: 0 !important; } /* New Font Awesome Back Arrow */ .ui-panel-inner .sidemenu-back-logo::after { content: "\f060" !important; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-family: "Rez8UISolid" !important; font-size: 19px !important; font-weight: 900 !important; line-height: 1 !important; color: #92ff51 !important; pointer-events: none; } /* =================================== 5. ACTIVE ICON — NEON GREEN =================================== */ .ui-panel-inner > ul > li:is( .active, .on, .selected, .ui-btn-active ) .sm-item > i::before { color: #92ff51 !important; } /* Hover */ @media (hover: hover) { .ui-panel-inner > ul > li > a:hover .sm-item > i::before { color: #92ff51 !important; } .ui-panel-inner .sidebar-menu-accountinfo a:hover i::before { color: #92ff51 !important; } } /* ========================================== REZ8 — PROVIDER WALLET BALANCE Purple / Neon Green / Silver Theme ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* MAIN WALLET PAGE */ .m-walletbalance-container { --rz-green: #92ff51; --rz-purple: #c391f5; --rz-silver: #bcb0c6; background: linear-gradient( 160deg, #260c35 0%, #170720 55%, #100519 100% ) !important; color: #e8d8f2 !important; } /* FORM CONTAINER */ .m-walletbalance-container .m-transaction-form { background: transparent !important; color: #e8d8f2 !important; } /* PAGE TITLE */ .m-walletbalance-container .form-title, .m-walletbalance-container .form-title span { color: #f0e2fa !important; font-weight: 800 !important; text-shadow: 0 0 8px rgba(195,145,245,.15); } /* PROVIDER LIST CONTAINER */ .m-walletbalance-container .provider-list-container { background: linear-gradient( 145deg, #230d32, #11051b ) !important; border-color: rgba(190,155,205,.40) !important; } /* PROVIDER LIST WRAPPERS */ .m-walletbalance-container .list-box, .m-walletbalance-container .box-provider { background: transparent !important; } /* ========================================== INDIVIDUAL PROVIDER WALLET CARD ========================================== */ .m-walletbalance-container .provider-item { background: linear-gradient( 145deg, #301340 0%, #1a0927 100% ) !important; color: #e8d8f2 !important; border-color: rgba(180,145,200,.55) !important; border-radius: 12px !important; box-shadow: inset 0 0 0 1px rgba(190,155,205,.4), inset 0 1px 0 rgba(255,255,255,.07), 0 3px 12px rgba(0,0,0,.20) !important; } /* PROVIDER ICON AREA */ .m-walletbalance-container .pi-status { background: rgba(195,145,245,.05) !important; border-color: rgba(195,145,245,.25) !important; } /* KEEP ORIGINAL PROVIDER LOGOS */ .m-walletbalance-container .pi-status svg, .m-walletbalance-container .pi-status svg image { filter: none !important; } /* PROVIDER CONTENT */ .m-walletbalance-container .pi-content { background: transparent !important; } /* PROVIDER NAME */ .m-walletbalance-container .pi-name { color: #dbc1ec !important; font-weight: 600 !important; text-shadow: none !important; } /* PROVIDER BALANCE */ .m-walletbalance-container .pi-balance { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 8px rgba(146,255,81,.18); } /* ========================================== MAIN WALLET — SPECIAL HIGHLIGHT ========================================== */ .m-walletbalance-container .provider-item.wallet-main { background: linear-gradient( 145deg, #344b25 0%, #232336 55%, #180b27 100% ) !important; border-color: #92ff51 !important; box-shadow: inset 0 0 0 1px rgba(146,255,81,.65), inset 0 0 15px rgba(146,255,81,.07), 0 0 12px rgba(146,255,81,.12) !important; } /* MAIN WALLET NAME */ .m-walletbalance-container .wallet-main .pi-name { color: #e5f5d8 !important; font-weight: 800 !important; } /* MAIN WALLET BALANCE */ .m-walletbalance-container .wallet-main .pi-balance { color: #b3ff7f !important; font-weight: 800 !important; text-shadow: 0 0 10px rgba(146,255,81,.30); } /* ========================================== PROVIDER CARD HOVER ========================================== */ @media (hover: hover) { .m-walletbalance-container .provider-item:not(.wallet-main):hover { background: linear-gradient( 145deg, #3b1950, #210c30 ) !important; border-color: #c391f5 !important; box-shadow: inset 0 0 0 1px rgba(195,145,245,.65), 0 0 12px rgba(195,145,245,.15) !important; } } /* ========================================== ACTIVE / SELECTED PROVIDER ========================================== */ .m-walletbalance-container .provider-item:is(.active, .on, .selected) { background: linear-gradient( 145deg, #30491f, #1b1726 ) !important; border-color: #92ff51 !important; box-shadow: inset 0 0 0 1px rgba(146,255,81,.65), 0 0 12px rgba(146,255,81,.14) !important; } .m-walletbalance-container .provider-item:is(.active, .on, .selected) .pi-name { color: #e8f5da !important; } .m-walletbalance-container .provider-item:is(.active, .on, .selected) .pi-balance { color: #92ff51 !important; } /* ========================================== REZ8 — ANNOUNCEMENT / NOTICE BAR Purple / Neon Green / Silver Theme ORIGINAL MARQUEE ANIMATION PRESERVED ========================================== */ /* Main Announcement Bar */ .home_notice { background: linear-gradient( 180deg, #321343 0%, #210b30 55%, #12061c 100% ) !important; border: 1px solid rgba(190,155,205,.55) !important; border-radius: 10px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.09), inset 0 0 12px rgba(195,145,245,.08), 0 3px 12px rgba(0,0,0,.22) !important; } /* Announcement Icon */ .home_notice .icon_home_notice { filter: brightness(0) saturate(100%) invert(82%) sepia(55%) saturate(650%) hue-rotate(42deg) brightness(110%) !important; background-color: transparent !important; } /* Announcement Text Container */ .home_notice #sliderNotice { background: transparent !important; color: #e9daf4 !important; } /* Infinite Announcement Wrapper */ .home_notice .annoucement-infinite-container { background: transparent !important; } /* Scrolling Announcement Text */ .home_notice .notice-item { color: #e9daf4 !important; font-weight: 600 !important; text-shadow: 0 0 6px rgba(195,145,245,.15); } /* Actual Announcement Wording */ .home_notice .notice-item span { color: #e9daf4 !important; font-weight: 600 !important; } /* Subtle Green Accent Line */ .home_notice { border-bottom-color: rgba(146,255,81,.55) !important; } /* No changes to: - notice-enter animation - Scrolling speed - Marquee direction - Existing positioning - Original spacing */ .home_notice .notice-parent .notice-item { display: inline-block; height: 1.24rem; line-height: 1.24rem; text-align: left; background: #fff; word-break: break-all; white-space: nowrap; } .home_notice .notice-parent .notice-item{ background:rgba(255,255,255,0)!important; } /* ========================================== REZ8 — LEFT / RIGHT NAVIGATION ARROWS ICONS ONLY — ORIGINAL LAYOUT UNCHANGED ========================================== */ /* Both Arrow SVG Icons */ .home_navBox.home-nav-1 .m-scroll-btn svg { display: block !important; width: 20px !important; height: 20px !important; margin: auto !important; fill: #c391f5 !important; filter: drop-shadow( 0 0 3px rgba(195,145,245,.25) ); } /* Arrow Shape */ .home_navBox.home-nav-1 .m-scroll-btn svg path { fill: #c391f5 !important; stroke: none !important; } /* LEFT — Point Left */ .home_navBox.home-nav-1 .arrow-prev svg { transform: rotate(180deg) !important; } /* RIGHT — Point Right */ .home_navBox.home-nav-1 .arrow-next svg { transform: rotate(0deg) !important; } /* Hover — Neon Green */ @media (hover: hover) { .home_navBox.home-nav-1 .m-scroll-btn:hover svg path { fill: #92ff51 !important; } .home_navBox.home-nav-1 .m-scroll-btn:hover svg { filter: drop-shadow( 0 0 5px rgba(146,255,81,.4) ); } } /* Disabled Arrow */ .home_navBox.home-nav-1 .m-scroll-btn:disabled svg { opacity: .35; filter: none !important; } /* ========================================== REZ8 — 4D BETTING / RULES / PAYOUT Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* 4D Action Section */ .lotto-place-bet { --rz-green: #92ff51; --rz-purple: #c391f5; --rz-silver: #bcb0c6; background: linear-gradient( 145deg, #2a103a 0%, #170720 60%, #100519 100% ) !important; border-color: rgba(190,155,205,.55) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 4px 14px rgba(0,0,0,.22) !important; } /* =================================== BET NOW — NEON GREEN =================================== */ .lotto-place-bet .lotto-bet-btn, .lotto-place-bet .lotto-bet-btn .btn-common { background: linear-gradient( 180deg, #b8ff84 0%, #93ed58 50%, #66c936 100% ) !important; color: #142509 !important; border-color: #caffab !important; border-radius: 9px !important; font-weight: 800 !important; text-decoration: none !important; text-shadow: none !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 3px 12px rgba(146,255,81,.2) !important; } .lotto-place-bet .lotto-bet-btn span { color: #142509 !important; font-weight: 800 !important; } /* =================================== RULES / PAYOUT LINKS =================================== */ .lotto-place-bet .lotto-rules, .lotto-place-bet .lotto-payout { background: linear-gradient( 180deg, #412055, #220e32 ) !important; border-color: rgba(190,155,205,.65) !important; border-radius: 9px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important; } .lotto-place-bet .lotto-rules a, .lotto-place-bet .lotto-payout a { color: #e9d4f6 !important; font-weight: 700 !important; text-decoration: none !important; } /* =================================== 4D MODAL WINDOWS =================================== */ #lottoRulesModalDialog .modal-content, #lottoPayoutModalDialog .modal-content { background: linear-gradient( 160deg, #2b103b 0%, #170820 55%, #100519 100% ) !important; color: #e8d8f2 !important; border: 1px solid rgba(190,155,205,.65) !important; border-radius: 13px !important; box-shadow: 0 12px 35px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.08) !important; } /* Popup Headers */ #lottoRulesModalDialog .modal-header, #lottoPayoutModalDialog .modal-header { background: linear-gradient( 180deg, #3a1650, #220e31 ) !important; border-bottom-color: rgba(195,145,245,.45) !important; } /* Popup Titles */ #lottoRulesModalDialog .modal-title, #lottoPayoutModalDialog .modal-title, #lottoRulesModalDialog .modal-title strong, #lottoPayoutModalDialog .modal-title strong { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 7px rgba(146,255,81,.15); } /* Close Button — Preserve Original Icon */ :is(#lottoRulesModalDialog, #lottoPayoutModalDialog) .btn-close { filter: brightness(0) saturate(100%) invert(84%) sepia(42%) saturate(720%) hue-rotate(42deg) brightness(108%) !important; opacity: 1 !important; } /* Popup Body */ :is(#lottoRulesModalDialog, #lottoPayoutModalDialog) .modal-body { background: transparent !important; color: #dfcce9 !important; } /* Rules Paragraphs */ #lottoRulesModalDialog .modal-body p, #lottoRulesModalDialog .modal-body li { color: #e2d1ed !important; } /* =================================== PAYOUT TABLE HEADINGS =================================== */ #lottoPayoutModalDialog .modal-body h4 { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 7px rgba(146,255,81,.12); } /* =================================== 4D PAYOUT TABLES =================================== */ #lottoPayoutModalDialog table { background: #170920 !important; color: #e9d8f2 !important; border-color: rgba(180,145,200,.4) !important; } /* Table Header */ #lottoPayoutModalDialog table thead, #lottoPayoutModalDialog table tr.table-dark { background: linear-gradient( 180deg, #412055, #270e38 ) !important; } #lottoPayoutModalDialog table th, #lottoPayoutModalDialog table tr.table-dark th { background: #351648 !important; color: #92ff51 !important; border-color: rgba(195,145,245,.4) !important; font-weight: 800 !important; } /* Table Cells */ #lottoPayoutModalDialog table td { background: #21102e !important; color: #e6d6ef !important; border-color: rgba(165,125,185,.3) !important; } /* Alternate Rows */ #lottoPayoutModalDialog table tbody tr:nth-child(odd):not(.table-dark) td { background: #2a123a !important; } /* First Column — Prize Names */ #lottoPayoutModalDialog table td:first-child { color: #d4b5eb !important; font-weight: 700 !important; } /* Numeric Prize Values */ #lottoPayoutModalDialog table td:not(:first-child) { color: #b7ff88 !important; } /* =================================== INTERACTION =================================== */ @media (hover: hover) { .lotto-place-bet .lotto-bet-btn:hover { filter: brightness(1.1); } .lotto-place-bet :is(.lotto-rules, .lotto-payout):hover { background: linear-gradient( 180deg, #512768, #301341 ) !important; border-color: #c391f5 !important; } #lottoPayoutModalDialog table tbody tr:not(.table-dark):hover td { background: #382049 !important; } } /* Focus */ .lotto-place-bet a:focus-visible, .lotto-place-bet button:focus-visible { outline: 2px solid #92ff51; outline-offset: 2px; } /* ========================================== REZ8 — MOST PLAYED GAME CARD Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* Main Game Card Container */ .most-play-game-container-scroll { background: linear-gradient( 145deg, #281039 0%, #170820 60%, #100519 100% ) !important; border: 1px solid rgba(190,155,205,.55) !important; border-radius: 12px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 5px 16px rgba(0,0,0,.25) !important; } /* Decorative Background Layer */ .most-play-game-container-scroll .most-play-game-box { background: linear-gradient( 180deg, rgba(120,45,165,.18), rgba(20,6,30,.12) ) !important; border-color: rgba(195,145,245,.25) !important; } /* Game Content */ .most-play-game-container-scroll .most-play-game { background: transparent !important; } /* Game Image Container */ .most-play-game-container-scroll .most-play-game-image-container { background: linear-gradient( 145deg, #321344, #1a0927 ) !important; border-color: rgba(190,155,205,.45) !important; border-radius: 10px !important; } /* Preserve Original Game Image */ .most-play-game-container-scroll .most-play-game-image-container img { filter: none !important; border-radius: 8px !important; } /* Game Title Container */ .most-play-game-container-scroll .most-play-game-title-container { background: transparent !important; } /* Game Name */ .most-play-game-container-scroll .most-play-game-title { color: #f0e2fa !important; font-weight: 700 !important; text-shadow: 0 0 6px rgba(195,145,245,.12); } /* Provider Name — PLAYTECH */ .most-play-game-container-scroll .most-play-game-desc { color: #c391f5 !important; font-weight: 600 !important; } /* =================================== PLAY NOW — NEON GREEN =================================== */ .most-play-game-container-scroll .most-play-button { background: linear-gradient( 180deg, #b8ff84 0%, #92ec56 50%, #65c934 100% ) !important; color: #132509 !important; border: 1px solid #caffab !important; border-radius: 9px !important; font-weight: 800 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 3px 12px rgba(146,255,81,.20) !important; text-shadow: none !important; } /* =================================== HOVER EFFECTS =================================== */ @media (hover: hover) { .most-play-game-container-scroll:hover { border-color: #c391f5 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 0 14px rgba(195,145,245,.15) !important; } .most-play-game-container-scroll .most-play-button:hover { filter: brightness(1.10); } } /* Keyboard Focus */ .most-play-game-container-scroll .most-play-button:focus-visible { outline: 2px solid #92ff51; outline-offset: 2px; } /* ========================================== REZ8 — ACCOUNT MENU ICON CENTER FIX Keep Original Menu Structure ========================================== */ /* Center Icon Wrapper */ .account-menu-section .shortcut-menu .menu-img-wrapper { display: flex !important; align-items: center !important; justify-content: center !important; width: fit-content !important; float: none !important; margin-left: auto !important; margin-right: auto !important; position: relative !important; text-align: center !important; } /* Center Inner Icon Container */ .account-menu-section .shortcut-menu .menu-img-wrapper .i { display: flex !important; align-items: center !important; justify-content: center !important; float: none !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } /* Center Font Awesome Icons */ .account-menu-section .shortcut-menu .menu-img-wrapper .i > i { display: inline-flex !important; align-items: center !important; justify-content: center !important; position: relative !important; left: auto !important; right: auto !important; margin: 0 auto !important; text-align: center !important; } /* Font Icon Pseudo Element */ .account-menu-section .shortcut-menu .menu-img-wrapper .i > i::before { display: block !important; text-align: center !important; margin: 0 auto !important; } .mobile-wallet-section .wallet-info .top-content .member-wallet .bottom{ background: #09010d!important; background-color: #09010d!important; } /* ========================================== REZ8 — CHANGE PASSWORD PAGE Purple / Neon Green / Metallic Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* MAIN PAGE */ .m-settings-page { --rz-green: #92ff51; --rz-purple: #c391f5; --rz-silver: #bcb0c6; background: linear-gradient( 160deg, #260c35 0%, #170720 55%, #100519 100% ) !important; color: #e8d8f2 !important; } /* FORM CONTAINER */ .m-settings-page .m-change-password-container { background: linear-gradient( 150deg, #2b103b 0%, #190823 55%, #100519 100% ) !important; border-color: rgba(190,155,205,.50) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 5px 18px rgba(0,0,0,.22) !important; } /* FORM BACKGROUND */ .m-settings-page .m-transaction-form, .m-settings-page .change-password-form { background: transparent !important; } /* ========================================== PASSWORD TAB STYLING Keep Original Visibility ========================================== */ .m-settings-page .standard-tab-container { background: transparent !important; } .m-settings-page .tab-header-title { background: linear-gradient( 180deg, #301342, #1a0927 ) !important; color: #d8b9ec !important; border-color: rgba(190,155,205,.45) !important; } /* Active Tab */ .m-settings-page .tab-header-title[class*="_active_"] { background: linear-gradient( 180deg, #365425, #1b3014 ) !important; color: #92ff51 !important; border-color: #92ff51 !important; } /* Tab Text */ .m-settings-page .tab-header-title span { color: inherit !important; } /* ========================================== PASSWORD FIELD LABELS ========================================== */ .m-settings-page .change-password-form .standard-label { color: #d8b9ec !important; font-weight: 600 !important; text-shadow: 0 0 5px rgba(195,145,245,.10); } /* ========================================== PASSWORD INPUT WRAPPERS ========================================== */ .m-settings-page .change-password-form .standard-form-field-wrapper { background: linear-gradient( 180deg, #281036, #15071e ) !important; border: 1px solid rgba(175,140,195,.65) !important; border-radius: 9px !important; box-shadow: inset 0 1px 3px rgba(0,0,0,.22) !important; } /* PASSWORD INPUTS */ .m-settings-page .change-password-form input.standard-input { background: transparent !important; color: #f4eafa !important; caret-color: #92ff51 !important; border-color: transparent !important; font-weight: 500 !important; } /* PLACEHOLDERS */ .m-settings-page .change-password-form input::placeholder { color: #ae94c1 !important; opacity: 1 !important; } /* INPUT FOCUS */ .m-settings-page .change-password-form .standard-form-field-wrapper:focus-within { border-color: #92ff51 !important; box-shadow: 0 0 0 1px rgba(146,255,81,.15), 0 0 10px rgba(146,255,81,.15) !important; } .m-settings-page .change-password-form input.standard-input:focus { outline: none !important; } /* BROWSER AUTOFILL */ .m-settings-page .change-password-form input.standard-input:-webkit-autofill { -webkit-text-fill-color: #f4eafa !important; -webkit-box-shadow: 0 0 0 1000px #21102f inset !important; caret-color: #92ff51 !important; } /* ========================================== PASSWORD VISIBILITY EYE ICON ========================================== */ .m-settings-page .standard-password-eye { color: #c391f5 !important; fill: #c391f5 !important; filter: drop-shadow(0 0 3px rgba(195,145,245,.2)); } .m-settings-page .standard-password-eye path { fill: #c391f5 !important; } /* Eye Icon Hover */ @media (hover: hover) { .m-settings-page .standard-password-eye:hover, .m-settings-page .standard-password-eye:hover path { fill: #92ff51 !important; } } /* ========================================== PASSWORD VALIDATION MESSAGES ========================================== */ .m-settings-page .standard-error-container { background: transparent !important; } .m-settings-page .standard-error-validation, .m-settings-page .standard-error-validation span, .m-settings-page .text-danger { color: #ff9db5 !important; } /* ========================================== SUBMIT BUTTON — NEON GREEN ========================================== */ .m-settings-page .standard-submit-form-button { background: linear-gradient( 180deg, #b8ff84 0%, #93ed58 50%, #66c936 100% ) !important; color: #132409 !important; border: 1px solid #caffab !important; border-radius: 10px !important; font-weight: 800 !important; text-transform: uppercase !important; text-shadow: none !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 4px 14px rgba(146,255,81,.20) !important; transition: filter .2s ease, box-shadow .2s ease; } /* DISABLED SUBMIT BUTTON */ .m-settings-page .standard-submit-form-button:disabled { background: linear-gradient( 180deg, #493655, #30223a ) !important; color: #a994b6 !important; border-color: #675474 !important; box-shadow: none !important; cursor: not-allowed !important; } /* HOVER — ENABLED ONLY */ @media (hover: hover) { .m-settings-page .standard-submit-form-button:not(:disabled):hover { filter: brightness(1.1); box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 0 14px rgba(146,255,81,.3) !important; } } /* KEYBOARD ACCESSIBILITY */ .m-settings-page .standard-submit-form-button:focus-visible { outline: 2px solid #92ff51; outline-offset: 2px; } /* ========================================== REZ8 — REFERRAL & MY BONUS PAGE Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* MAIN PAGE */ .m-referral-container { --rz-green: #92ff51; --rz-purple: #c391f5; --rz-silver: #bcb0c6; background: linear-gradient( 160deg, #260c35 0%, #170720 55%, #100519 100% ) !important; color: #e9d9f3 !important; } /* ========================================== MY REFERRAL / MY BONUS TABS ========================================== */ .m-referral-container .standard-tab-container { background: #1b0928 !important; border-color: rgba(190,155,205,.4) !important; } .m-referral-container .tab-header-title { background: linear-gradient( 180deg, #301342, #190824 ) !important; color: #d8b9ec !important; border-color: rgba(190,155,205,.4) !important; } .m-referral-container .tab-header-title span { color: inherit !important; } /* Selected Tab */ .m-referral-container .tab-header-title[class*="_active_"] { background: linear-gradient( 180deg, #b5ff82, #70d13d ) !important; color: #142309 !important; border-color: #caffaa !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 0 10px rgba(146,255,81,.15) !important; } /* ========================================== REFERRAL MAIN CONTENT ========================================== */ .m-referral-container .m-myreferral-container, .m-referral-container .m-mybonus-container { background: linear-gradient( 160deg, #291039, #11051b ) !important; color: #e9d9f3 !important; border-color: rgba(190,155,205,.45) !important; } /* QR and Referral Area */ .m-referral-container .shareqr-container, .m-referral-container .referral-detail-container { background: linear-gradient( 145deg, #301342, #1a0927 ) !important; border-color: rgba(190,155,205,.45) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important; } /* Share Happiness Title */ .m-referral-container .referral-detail-title { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 8px rgba(146,255,81,.18); } /* Referral Description */ .m-referral-container .referral-detail-container > p:not(.referral-detail-title) { color: #dbc5ec !important; } /* ========================================== REFERRAL CODE ========================================== */ .m-referral-container .referral-copy-detail-container { background: #1c0a29 !important; border-color: rgba(195,145,245,.4) !important; } .m-referral-container .referral-copy-detail { background: linear-gradient( 180deg, #331545, #200d30 ) !important; border-color: rgba(195,145,245,.5) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important; } /* Referral Code Number */ .m-referral-container .referral-copy-detail-title, .m-referral-container .referral-copy-detail-title span { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 8px rgba(146,255,81,.2); } /* Arrow Icon */ .m-referral-container .referral-copy-detail .arrow svg path { fill: #c391f5 !important; } /* QR Code Image — Original Dimensions Preserved */ .m-referral-container .shareqr-container a img { background: #ffffff !important; border: 1px solid #bcb0c6 !important; border-radius: 9px !important; box-shadow: 0 4px 15px rgba(0,0,0,.25) !important; } /* ========================================== REFERRAL STATUS ========================================== */ .m-referral-container .referral-content { background: transparent !important; } .m-referral-container .ref-status-box { background: linear-gradient( 145deg, #2c113d, #180822 ) !important; border-color: rgba(190,155,205,.5) !important; } /* Status Label */ .m-referral-container .standard-label { color: #d8b9ec !important; font-weight: 600 !important; } /* Status Container */ .m-referral-container .ref-status, .m-referral-container .invi-status { background: #21102f !important; border-color: rgba(195,145,245,.3) !important; } /* Invitation Text */ .m-referral-container .invi-status .text { color: #e0caef !important; } /* Invitation Count */ .m-referral-container .invi-status .value { color: #92ff51 !important; font-weight: 800 !important; } /* ========================================== REFERRAL LINK ========================================== */ .m-referral-container .ref-code-link-container, .m-referral-container .ref-link-box { background: transparent !important; } /* Input Wrapper */ .m-referral-container .standard-form-field-wrapper { background: linear-gradient( 180deg, #271035, #160820 ) !important; border-color: rgba(175,140,195,.65) !important; box-shadow: inset 0 1px 3px rgba(0,0,0,.2) !important; } /* Referral Link Input */ .m-referral-container input.standard-input { background: transparent !important; color: #f0e4f9 !important; caret-color: #92ff51 !important; } /* Copy Icon */ .m-referral-container .beta-copy path { fill: #92ff51 !important; } /* ========================================== REFERRAL BONUS OFFER ========================================== */ .m-referral-container .welcomepromo-content { background: linear-gradient( 160deg, #2a103a, #16071f ) !important; border-color: rgba(190,155,205,.45) !important; } /* Share Offer Title */ .m-referral-container .share-title { color: #f0e2fa !important; font-weight: 700 !important; } /* Bonus Offer Card */ .m-referral-container .referOption-container { background: transparent !important; } .m-referral-container .referOption { background: linear-gradient( 145deg, #331545, #1a0926 ) !important; border: 1px solid rgba(190,155,205,.55) !important; border-radius: 11px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 4px 12px rgba(0,0,0,.2) !important; } /* Free MYR Bonus */ .m-referral-container .option-remark { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 8px rgba(146,255,81,.18); } /* Turnover / Withdrawal / Deposit */ .m-referral-container :is(.option-turnover, .option-deposit) { color: #e5d1f1 !important; } .m-referral-container .option-wrapper { background: transparent !important; } /* ========================================== INVITE FRIEND BUTTON ========================================== */ .m-referral-container .standard-submit-form-button { background: linear-gradient( 180deg, #b8ff84 0%, #93ed58 50%, #66c936 100% ) !important; color: #132409 !important; border: 1px solid #caffab !important; border-radius: 10px !important; font-weight: 800 !important; text-shadow: none !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 4px 12px rgba(146,255,81,.18) !important; } /* Disabled Submit */ .m-referral-container .standard-submit-form-button:disabled { background: #483454 !important; color: #a994b6 !important; border-color: #655570 !important; box-shadow: none !important; } /* ========================================== TERMS AND CONDITIONS NOTICE ========================================== */ .m-referral-container .notice-container { background: linear-gradient( 180deg, #281038, #160720 ) !important; border-color: rgba(190,155,205,.45) !important; } .m-referral-container .recent-transaction-title { background: #301342 !important; color: #92ff51 !important; } .m-referral-container .icon-alert path { fill: #c391f5 !important; } .m-referral-container #dropdown-arrow svg path { fill: #92ff51 !important; } .m-referral-container .notice-container li { color: #e1cdec !important; } /* ========================================== MY BONUS — DATE FILTERS ========================================== */ .m-referral-container .bonus-filter-form, .m-referral-container .date-form-field-container { background: transparent !important; } /* Date Input */ .m-referral-container .react-datepicker__input-container .standard-input { background: linear-gradient( 180deg, #281137, #170820 ) !important; color: #e8d9f3 !important; border-color: rgba(175,140,195,.6) !important; } /* Calendar Icon */ .m-referral-container .beta-calendar path { fill: #c391f5 !important; } /* Calendar Popup */ .m-referral-container .react-datepicker { background: #1b0928 !important; color: #e8d8f2 !important; border-color: #826494 !important; } .m-referral-container .react-datepicker__header { background: #301342 !important; border-color: #745489 !important; } .m-referral-container .react-datepicker__day--selected { background: #92ff51 !important; color: #142309 !important; } /* ========================================== MY BONUS TABLE ========================================== */ .m-referral-container #example { background: #190923 !important; color: #e9d8f2 !important; border-color: rgba(190,155,205,.4) !important; } /* Table Headings */ .m-referral-container #example thead th { background: #351648 !important; color: #92ff51 !important; border-color: rgba(195,145,245,.4) !important; font-weight: 700 !important; } /* Table Body */ .m-referral-container #example tbody td { background: #21102e !important; color: #e6d6ef !important; border-color: rgba(165,125,185,.3) !important; } /* Alternate Rows */ .m-referral-container #example tbody tr:nth-child(even) td { background: #2a123a !important; } /* Table Footer Totals */ .m-referral-container #example tfoot th { background: #2c133b !important; color: #d8c1ea !important; border-color: rgba(195,145,245,.3) !important; } .m-referral-container #example tfoot .dt-type-numeric { color: #92ff51 !important; font-weight: 800 !important; } /* ========================================== AFFILIATE REPORT BUTTON ========================================== */ .m-referral-container .aff-btn { background: linear-gradient( 180deg, #4a2362, #270e39 ) !important; color: #f0e2fa !important; border-color: #b08bbe !important; border-radius: 10px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.1) !important; } .m-referral-container .aff-btn .fa, .m-referral-container .aff-btn .text-title { color: #e9d3f6 !important; } /* ========================================== HOVER EFFECTS ========================================== */ @media (hover: hover) { .m-referral-container .standard-submit-form-button:not(:disabled):hover { filter: brightness(1.10); } .m-referral-container .aff-btn:hover { background: #3d1952 !important; border-color: #c391f5 !important; } } /* ========================================== REZ8 — MY PROFILE & DOCUMENT UPLOAD Purple / Neon Green / Silver Theme ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* MAIN PROFILE PAGE */ .m-settings-page:has(.m-profile-container) { --rz-green: #92ff51; --rz-purple: #c391f5; --rz-silver: #bcb0c6; background: linear-gradient( 160deg, #260c35 0%, #170720 55%, #100519 100% ) !important; color: #e8d8f2 !important; } /* ========================================== PROFILE / DOCUMENT TABS ========================================== */ .m-settings-page:has(.m-profile-container) .standard-tab-container { background: #1b0928 !important; border-color: rgba(190,155,205,.45) !important; } /* Inactive Tab */ .m-settings-page:has(.m-profile-container) .tab-header-title { background: linear-gradient( 180deg, #301342, #190824 ) !important; color: #d8b9ec !important; border-color: rgba(190,155,205,.45) !important; } /* Active Tab */ .m-settings-page:has(.m-profile-container) .tab-header-title[class*="_active_"] { background: linear-gradient( 180deg, #b5ff82, #70d13d ) !important; color: #142309 !important; border-color: #caffaa !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 0 10px rgba(146,255,81,.15) !important; } .m-settings-page:has(.m-profile-container) .tab-header-title span { color: inherit !important; } /* ========================================== PROFILE CONTENT ========================================== */ .m-profile-container, .m-docssubmission-container { background: linear-gradient( 160deg, #291039, #11051b ) !important; color: #e8d8f2 !important; border-color: rgba(190,155,205,.45) !important; } /* Profile Columns */ .m-profile-container .profile-column, .m-docssubmission-container .profile-column { background: transparent !important; } /* Section Titles */ .m-profile-container .column-title { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 8px rgba(146,255,81,.15); border-color: rgba(195,145,245,.35) !important; } /* ========================================== PROFILE LABELS ========================================== */ .m-profile-container .standard-label { color: #d8b9ec !important; font-weight: 600 !important; } /* Form Field Containers */ .m-profile-container .standard-form-field { background: transparent !important; } /* ========================================== PROFILE INPUT FIELDS ========================================== */ .m-profile-container input.standard-input { background: linear-gradient( 180deg, #281036, #160820 ) !important; color: #f0e4f9 !important; border: 1px solid rgba(175,140,195,.60) !important; border-radius: 9px !important; caret-color: #92ff51 !important; box-shadow: inset 0 1px 3px rgba(0,0,0,.2) !important; } /* Read-only / Disabled Inputs */ .m-profile-container input.standard-input:disabled { background: linear-gradient( 180deg, #24102f, #170b21 ) !important; color: #d8c3e7 !important; -webkit-text-fill-color: #d8c3e7 !important; border-color: rgba(160,125,180,.45) !important; opacity: 1 !important; } /* ========================================== EDIT / INFORMATION ICONS ========================================== */ /* Edit Icon */ .m-profile-container .beta-edit path { fill: #c391f5 !important; } /* Information Icon */ .m-profile-container .D-referral-important path { fill: #c391f5 !important; } /* Preserve Button Appearance */ .m-profile-container .edit-btn, .m-profile-container .more-info-btn { background: transparent !important; border-color: rgba(195,145,245,.4) !important; } /* ========================================== DOCUMENT UPLOAD SECTION ========================================== */ /* Document Field */ .m-docssubmission-container .kyc-form-field { background: linear-gradient( 145deg, #2c113c, #180822 ) !important; border-color: rgba(190,155,205,.5) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important; } /* Document Header */ .m-docssubmission-container .kyc-header { background: transparent !important; border-color: rgba(195,145,245,.3) !important; } /* Document Label */ .m-docssubmission-container .kyc-label { color: #f0e2fa !important; font-weight: 700 !important; } /* File Input Area */ .m-docssubmission-container .kyc-input-field { background: linear-gradient( 180deg, #24102f, #160820 ) !important; border-color: rgba(175,140,195,.55) !important; border-radius: 9px !important; } /* ========================================== UPLOAD BUTTON — PURPLE / SILVER ========================================== */ .m-docssubmission-container .kyc-choose-file { background: linear-gradient( 180deg, #49235f, #280f39 ) !important; color: #f0e2fa !important; border-color: #aa88bb !important; border-radius: 9px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12) !important; } /* Upload Icon */ .m-docssubmission-container .beta-upload path { fill: #c391f5 !important; } /* Upload Text */ .m-docssubmission-container .kyc-choose-file .kyc-file-content { color: #f0e2fa !important; font-weight: 700 !important; } /* No File Chosen */ .m-docssubmission-container .kyc-input-field > .kyc-file-content { color: #bfa8d0 !important; } /* Preview Button */ .m-docssubmission-container .kyc-choosefile-preview { background: linear-gradient( 180deg, #324b24, #1b3014 ) !important; color: #92ff51 !important; border-color: #92ff51 !important; border-radius: 9px !important; } /* Uploaded File Image */ .m-docssubmission-container .kyc-form-field > img { border-color: #bcb0c6 !important; border-radius: 9px !important; } /* Information Tooltip Icon */ .m-docssubmission-container .iconToolTip svg circle { fill: #c391f5 !important; } .m-docssubmission-container .iconToolTip svg path { fill: #210b30 !important; } /* ========================================== SUBMIT BUTTON — NEON GREEN ========================================== */ .m-settings-page:has(.m-profile-container) .standard-submit-form-button { background: linear-gradient( 180deg, #b8ff84 0%, #93ed58 50%, #66c936 100% ) !important; color: #132409 !important; border: 1px solid #caffab !important; border-radius: 10px !important; font-weight: 800 !important; text-transform: uppercase !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 4px 12px rgba(146,255,81,.18) !important; } /* Disabled Submit */ .m-settings-page:has(.m-profile-container) .standard-submit-form-button:disabled { background: linear-gradient( 180deg, #483454, #30223b ) !important; color: #a994b6 !important; border-color: #655570 !important; box-shadow: none !important; } /* ========================================== ERROR MESSAGES ========================================== */ .m-profile-container .text-danger, .m-docssubmission-container .text-danger { color: #ff9db5 !important; } /* ========================================== HOVER EFFECTS ========================================== */ @media (hover: hover) { .m-docssubmission-container .kyc-choose-file:hover { background: linear-gradient( 180deg, #603077, #341447 ) !important; border-color: #c391f5 !important; } .m-settings-page:has(.m-profile-container) .standard-submit-form-button:not(:disabled):hover { filter: brightness(1.1); } } /* ========================================== ACCESSIBILITY ========================================== */ .m-settings-page:has(.m-profile-container) button:focus-visible { outline: 2px solid #92ff51; outline-offset: 2px; } /* ========================================== REZ8 — TRANSACTION HISTORY TABLE Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* MAIN TABLE CONTAINER */ .m-history-betting-summary-table-container { background: linear-gradient( 160deg, #260c35 0%, #170720 55%, #100519 100% ) !important; border-color: rgba(190,155,205,.45) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 4px 16px rgba(0,0,0,.22) !important; } /* TABLE WRAPPER */ .m-history-betting-summary-table-container .standard-st-table-container { background: transparent !important; } /* TABLE BACKGROUND */ .m-history-betting-summary-table-container .standard-st-table { background: #170820 !important; color: #e8d8f2 !important; border-color: rgba(190,155,205,.4) !important; } /* ========================================== TABLE HEADER ========================================== */ .m-history-betting-summary-table-container .table-header-container { background: linear-gradient( 180deg, #401a55 0%, #260e38 100% ) !important; border-color: rgba(195,145,245,.45) !important; } /* HEADER CELLS */ .m-history-betting-summary-table-container .table-header { background: transparent !important; color: #e8d1f7 !important; border-color: rgba(195,145,245,.3) !important; font-weight: 700 !important; } /* HEADER TEXT */ .m-history-betting-summary-table-container .table-header span { color: #e8d1f7 !important; font-weight: 700 !important; } /* ========================================== TABLE ROWS ========================================== */ /* Regular Rows */ .m-history-betting-summary-table-container .table-content-container { background: #21102e !important; border-color: rgba(175,135,195,.2) !important; } /* Alternating Rows */ .m-history-betting-summary-table-container tbody tr:nth-child(even) { background: #2a1238 !important; } /* TABLE CELLS */ .m-history-betting-summary-table-container .table-content { background: transparent !important; color: #e7d8f1 !important; border-color: rgba(175,135,195,.22) !important; } /* ========================================== TRANSACTION INFORMATION ========================================== */ /* Transaction Type / Reference Number */ .m-history-betting-summary-table-container .col-transType { color: #f0e2fa !important; font-weight: 700 !important; } /* Transaction Date */ .m-history-betting-summary-table-container .col-date { color: #ad94bf !important; } /* Promotion Description */ .m-history-betting-summary-table-container .col-promotion { color: #c391f5 !important; } /* Transaction Remark */ .m-history-betting-summary-table-container .col-remark { color: #c7a8db !important; } /* ========================================== TRANSACTION AMOUNT ========================================== */ .m-history-betting-summary-table-container .col-amount { color: #baff8c !important; font-weight: 800 !important; text-shadow: 0 0 7px rgba(146,255,81,.12); } /* ========================================== TRANSACTION STATUS COLORS ========================================== */ /* APPROVED — NEON GREEN */ .m-history-betting-summary-table-container .col-status.text-success { color: #92ff51 !important; font-weight: 700 !important; } /* WAIVED — METALLIC SILVER */ .m-history-betting-summary-table-container .col-status.text-muted { color: #bcb0c6 !important; font-weight: 600 !important; } /* REJECTED — SOFT RED */ .m-history-betting-summary-table-container .col-status:not(.text-success):not(.text-muted) { color: #ff899e !important; font-weight: 700 !important; } /* ========================================== HOVER EFFECT ========================================== */ @media (hover: hover) { .m-history-betting-summary-table-container tbody tr:hover { background: #351846 !important; } } /* ========================================== OPTIONAL TABLE ACCENTS ========================================== */ /* Header Bottom Line */ .m-history-betting-summary-table-container thead { border-bottom: 1px solid rgba( 146,255,81,.45 ) !important; } /* Table Bottom Border */ .m-history-betting-summary-table-container tbody { border-color: rgba( 190,155,205,.3 ) !important; } /* ========================================== REZ8 — GAME APP DOWNLOAD INSTRUCTIONS Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* MAIN OUTER BACKGROUND */ .kiss918_mainBox_outer { --rz-green: #92ff51; --rz-purple: #c391f5; --rz-silver: #bcb0c6; background: radial-gradient( ellipse at 50% 0%, rgba(120,45,165,.22), transparent 65% ), linear-gradient( 160deg, #260c35 0%, #170720 55%, #100519 100% ) !important; color: #e8d8f2 !important; } /* MAIN CONTENT PANEL */ .kiss918_mainBox_outer .kiss918_mainBox { background: linear-gradient( 145deg, #2b103b 0%, #190923 60%, #100519 100% ) !important; border-color: rgba(190,155,205,.55) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 5px 18px rgba(0,0,0,.25) !important; } /* CONTENT WRAPPER */ .kiss918_mainBox_outer .textbox { background: transparent !important; color: #e8d8f2 !important; } /* ========================================== PAGE HEADING ========================================== */ .kiss918_mainBox_outer .textbox .p1 { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 8px rgba(146,255,81,.18); } /* ========================================== USERNAME & PASSWORD TABLE ========================================== */ /* Credentials Table */ .kiss918_mainBox_outer .userandpwd { background: linear-gradient( 180deg, #301342, #1a0927 ) !important; border-color: rgba(190,155,205,.5) !important; } /* Table Rows */ .kiss918_mainBox_outer .userandpwd tr { background: rgba(20,7,30,.32) !important; } /* Table Cells */ .kiss918_mainBox_outer .userandpwd td { color: #e8d8f2 !important; border-color: rgba(190,155,205,.25) !important; } /* Username / Password Labels */ .kiss918_mainBox_outer .userandpwd td.label, .kiss918_mainBox_outer .userandpwd td.label span { color: #c391f5 !important; font-weight: 600 !important; } /* Credential Values */ .kiss918_mainBox_outer .userandpwd td:nth-child(2):not(.label) { color: #92ff51 !important; font-weight: 700 !important; } /* Copy Button */ .kiss918_mainBox_outer .userandpwd td[role="button"] { color: #c391f5 !important; cursor: pointer; } /* Copy Icon — Lavender */ .kiss918_mainBox_outer .icon_various_files { filter: brightness(0) saturate(100%) invert(76%) sepia(20%) saturate(1050%) hue-rotate(215deg) brightness(105%) !important; } /* Copy Icon Hover */ @media (hover: hover) { .kiss918_mainBox_outer td[role="button"]:hover .icon_various_files { filter: brightness(0) saturate(100%) invert(82%) sepia(53%) saturate(750%) hue-rotate(43deg) brightness(108%) !important; } } /* ========================================== DOWNLOAD INSTRUCTION STEPS ========================================== */ /* Step List */ .kiss918_mainBox_outer .step_box { background: transparent !important; } /* Individual Step */ .kiss918_mainBox_outer .step_box > li { background: linear-gradient( 145deg, #2e123e, #190925 ) !important; border-color: rgba(190,155,205,.45) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important; } /* Step Heading — 第一步 / 第二步 / 第三步 */ .kiss918_mainBox_outer .step_box > li > span { color: #92ff51 !important; font-weight: 800 !important; text-shadow: 0 0 7px rgba(146,255,81,.16); } /* Step Description */ .kiss918_mainBox_outer .step_box > li > p { color: #e0cceb !important; line-height: inherit; } /* ========================================== DOWNLOAD BUTTON — NEON GREEN ========================================== */ .kiss918_mainBox_outer .download-btn { background: linear-gradient( 180deg, #b8ff84 0%, #93ed58 50%, #66c936 100% ) !important; color: #132409 !important; border: 1px solid #caffab !important; border-radius: 9px !important; font-weight: 800 !important; text-shadow: none !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 4px 12px rgba(146,255,81,.2) !important; } .kiss918_mainBox_outer .download-btn span { color: #132409 !important; } /* ========================================== PLAY NOW BUTTON — METALLIC PURPLE ========================================== */ .kiss918_mainBox_outer .play-btn { background: linear-gradient( 180deg, #5a2b75, #2b103d ) !important; color: #f0e1fa !important; border: 1px solid #b28ac6 !important; border-radius: 9px !important; font-weight: 800 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 4px 10px rgba(0,0,0,.2) !important; } .kiss918_mainBox_outer .play-btn span { color: #f0e1fa !important; } /* ========================================== RESET ID BUTTON PRESERVE ORIGINAL HIDDEN STATE ========================================== */ .kiss918_mainBox_outer .generateloginid-btn { background: linear-gradient( 180deg, #46205e, #240e34 ) !important; color: #e8d5f4 !important; border-color: #a785b7 !important; } .kiss918_mainBox_outer .generateloginid-btn span { color: #e8d5f4 !important; } /* ========================================== HOVER EFFECTS ========================================== */ @media (hover: hover) { .kiss918_mainBox_outer :is(.download-btn, .play-btn, .generateloginid-btn):hover { filter: brightness(1.1); } } /* ========================================== ACCESSIBILITY ========================================== */ .kiss918_mainBox_outer a:focus-visible, .kiss918_mainBox_outer [role="button"]:focus-visible { outline: 2px solid #92ff51; outline-offset: 2px; } /* ========================================== REZ8 — VOUCHER ICON FONT AWESOME / PURPLE & NEON GREEN ========================================== */ @font-face { font-family: "Rez8VoucherFA"; src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/webfonts/fa-solid-900.woff2") format("woff2"); font-weight: 900; font-style: normal; } /* Remove Old Voucher Sprite */ .voucher-count-badge .icon-voucher { background-image: none !important; background-color: transparent !important; color: #c391f5 !important; text-align: center !important; } .menu-item-myvoucher .icon-voucher{ margin-top: -64px!important; } .fa-stack[data-count]:after{ background: #92ff51!important; color:#000!important; } /* New Voucher Ticket Icon */ .voucher-count-badge .icon-voucher::before { content: "\f145" !important; font-family: "Rez8VoucherFA" !important; font-weight: 900 !important; font-style: normal !important; font-size: .2em !important; color: #c391f5 !important; display: inline-block !important; text-shadow: 0 0 7px rgba(195,145,245,.4), 0 0 12px rgba(146,255,81,.12) !important; } /* Hover */ @media (hover: hover) { .voucher-count-badge:hover .icon-voucher::before { color: #92ff51 !important; text-shadow: 0 0 10px rgba(146,255,81,.45) !important; } } /* ========================================== REZ8 — SWEETALERT2 CONFIRMATION POPUP Dark Purple / Neon Green / Silver ORIGINAL STRUCTURE UNCHANGED ========================================== */ /* POPUP BACKGROUND */ .swal2-popup.app-popup-popup { background: linear-gradient( 155deg, #301340 0%, #1b0927 55%, #100519 100% ) !important; color: #e9d9f3 !important; border: 1px solid rgba(190,155,205,.65) !important; border-radius: 14px !important; box-shadow: 0 14px 40px rgba(0,0,0,.5), 0 0 20px rgba(195,145,245,.10), inset 0 1px 0 rgba(255,255,255,.10) !important; } /* WARNING ICON — LAVENDER */ .swal2-popup.app-popup-popup .swal2-icon.swal2-warning { background: rgba(195,145,245,.08) !important; color: #c391f5 !important; border-color: #c391f5 !important; box-shadow: 0 0 13px rgba(195,145,245,.16) !important; } /* WARNING EXCLAMATION MARK */ .swal2-popup.app-popup-popup .swal2-warning .swal2-icon-content { color: #c391f5 !important; } /* POPUP TITLE */ .swal2-popup.app-popup-popup .swal2-title { color: #f0e4fa !important; font-weight: 800 !important; text-shadow: 0 0 8px rgba(195,145,245,.12); } /* POPUP DESCRIPTION */ .swal2-popup.app-popup-popup .swal2-html-container { color: #d9c6e8 !important; } /* ========================================== CONFIRM BUTTON — NEON GREEN ========================================== */ .swal2-popup.app-popup-popup .swal2-confirm { background: linear-gradient( 180deg, #b8ff84 0%, #92ec56 50%, #66c936 100% ) !important; color: #132409 !important; border: 1px solid #caffab !important; border-radius: 9px !important; font-weight: 800 !important; text-shadow: none !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 3px 12px rgba(146,255,81,.2) !important; } /* ========================================== CANCEL BUTTON — METALLIC PURPLE ========================================== */ .swal2-popup.app-popup-popup .swal2-cancel { background: linear-gradient( 180deg, #4b265e, #271037 ) !important; color: #f0e2fa !important; border: 1px solid rgba(190,155,205,.7) !important; border-radius: 9px !important; font-weight: 700 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important; } /* ========================================== HOVER STATES ========================================== */ @media (hover: hover) { .swal2-popup.app-popup-popup .swal2-confirm:hover { filter: brightness(1.1); } .swal2-popup.app-popup-popup .swal2-cancel:hover { background: linear-gradient( 180deg, #603177, #351647 ) !important; border-color: #c391f5 !important; } } /* ========================================== FOCUS STATES ========================================== */ .swal2-popup.app-popup-popup .swal2-confirm:focus-visible, .swal2-popup.app-popup-popup .swal2-cancel:focus-visible { outline: 2px solid #92ff51 !important; outline-offset: 2px !important; } /* ========================================== OTHER SWEETALERT STATES ========================================== */ /* Error */ .swal2-popup.app-popup-popup .swal2-icon.swal2-error { color: #ff899e !important; border-color: #ff899e !important; } /* Success */ .swal2-popup.app-popup-popup .swal2-icon.swal2-success { color: #92ff51 !important; border-color: #92ff51 !important; } /* Loading Spinner */ .swal2-popup.app-popup-popup .swal2-loader { border-color: #92ff51 transparent #92ff51 transparent !important; } /* Input Fields Inside Popup */ .swal2-popup.app-popup-popup :is(.swal2-input, .swal2-select, .swal2-textarea) { background: #21102e !important; color: #f0e2fa !important; border-color: rgba(190,155,205,.55) !important; }