@charset "utf-8";@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap');

body{font-family:"Roboto",sans-serif; font-size:14px; margin:0px auto; background-size:cover; background-position:top center; background-repeat:no-repeat; color:var(--syscolor-text) }

* { transition: all .3s }

a { text-decoration:none }

img { max-width:100%; }

.hide { display:none }

.cons { max-width:660px; padding:0px 10px; margin: 0 auto; position:relative }
.cons.nopad { padding:0px; }
.consin { padding:15px }

label.error { font-size:11px; padding-top:3px; color:#ffffff; font-weight:bold; display:block }

.note { margin-top: 5px; display: block; font-size: 11px; color: #df0e0b; font-weight: bold; }
    .note.white { color:#ffffff }

.btn-submit { border:0; font-weight:bold; font-size:18px; padding:8px 30px; text-transform:uppercase; line-height:normal; display:inline-block }
    .btn-submit-sm { border:0; font-weight:bold; font-size:14px; padding:6px 18px; text-transform:uppercase; line-height:normal; display:inline-block }
    .btn-submit-xs { border:0; font-weight:bold; font-size:12px; padding:4px 16px; text-transform:uppercase; line-height:normal; display:inline-block }
.btn-s1 { background:linear-gradient(90deg, var(--syscolor-button1Background), var(--syscolor-button1Background2)); border-radius:20px; color:var(--syscolor-button1Text)!important; border:2px solid var(--syscolor-button1Border) }
    .btn-s1:hover { filter:brightness(1.3) }
    .btn-s1[disabled], .btn-s1.nono { background:#bbbbbb; color:#555555 }
    .btn-s1.ani { animation-name:buttonGlowing; animation-duration:1.5s; animation-timing-function:linear; animation-direction:normal; animation-iteration-count:infinite; }
.btn-s2 { background-color:#000000; border:2px solid var(--syscolor-button1Background); border-radius:20px; color:var(--syscolor-button1Text)!important;  }

@keyframes buttonGlowing {
  60% {filter:brightness(1.4) drop-shadow(0px 0px 12px var(--syscolor-primary)) }
}

.cons h3 { text-align:center; color:var(--syscolor-title); text-transform:uppercase }

.header-wrapper { position:fixed; top:0; left:0; width:100%; z-index:2; background:linear-gradient(180deg, var(--syscolor-background), var(--syscolor-background2)); background-size:100% 100%; background-repeat:no-repeat; background-position:center center }

.header { }
.header .logo { height: 46px; margin: 5px; position: relative; left: 50%; transform: translateX(-50%);}
.header .lang { position:absolute; right:8px; top:8px; height:40px; width:40px; border-radius:50%; display:flex; justify-content:center; align-items:center; background-color:#000000; color:#ffffff; font-weight:bold; font-size:14px }
    .header .lang:hover { filter:brightness(1.3) }
.header .welcome { position:absolute; left:8px; top:0px; height:100%; display:flex; align-items:start; justify-content:center; flex-direction:column; line-height:normal; font-size:14px; font-weight:bold; color:var(--syscolor-text)  }

.ann {background-color:/*rgba(0,0,0,0.7)*/#b4963f; color:#ffffff; font-size:11px; height:24px; position:relative; display:flex; justify-content:center; align-items:center; padding:0px 12px; }
    .ann .iicon { color:var(--syscolor-primary); font-size:14px; }
    .ann .ttext { width:100% }
    .ann .ttext span { padding-right:20px }
    .ann .readmore { position:absolute; top:10%; right:10px; height:80%; display:flex; justify-content:center; align-items:center; padding:0 8px; font-weight:bold; font-size:11px }

.banner-wrapper, .harea-wrapper, .livetx-wrapper, .hgame-wrapper, .htabs-wrapper, .balance-wrapper, .aftabs-wrapper, .happ-wrapper, .href-wrapper, .winner-wrapper
{ margin-bottom:16px; }

.banner-wrapper {  }
.splide__slide img { height:auto }
.splide__progress { transition:none }
.splide__progress__bar { height: 2px; background: #ffc107; margin-top: -2px; z-index: 1; position: relative; transition:none}
.splide__arrow svg { width:12px; height:12px; }
.splide__arrow--prev { left:0 }
.splide__arrow--next { right:0 }

.harea-wrapper { }
.harea { display:flex; justify-content:center; align-items:center; gap:16px }
    .harea a { width:100% }
    .harea img { width:100% }

.livetx-wrapper { display:none }
.livetx { /*border-width: 2px; border-style: solid; border-image: linear-gradient(to left,rgb(42,209,240),rgb(160,0,255)) 1;*/ text-transform:uppercase; color:#ffffff; border-radius:8px; overflow:hidden }
.livetx .green { color:#5ed700 }
.livetx .yellow { color:#ffd200 }
table { width:100%; font-size:12px; line-height:1; border-style:hidden }
table thead tr th { background:var(--syscolor-tableheadBackground); color:var(--syscolor-tableheadText); position:relative; }
table thead tr:nth-child(1) th { padding:10px 12px }
table thead tr:nth-child(2) th { background:var(--syscolor-tablehead2Background); color:var(--syscolor-tablehead2Text) }
table td, table th { border:1px solid var(--syscolor-boxBorder); padding:6px 12px }
table tbody td { background:rgba(0,0,0,.4); }
table tbody tr td:nth-child(-n+2) { background:rgba(0,0,0,.6); }
table .title span { font-size:14px; }
table span.currency {float: right;color: var(--syscolor-primary);}
table td.amount { text-align:right; color:var(--syscolor-primary)}
table .live { position:absolute; top:6px; right:8px; background:red; padding:4px 8px; border-radius:20px; color:#fff; font-weight:bold; }
table .live span { display:block; width:8px; height:8px; background:#fff; float:right; border-radius:10px; margin:1px 1px 0 3px }

.winner-wrapper {  }
.winner-cons { background:rgba(0,0,0,.8); padding:6px; border-radius:8px }
    .winner-cons .mqhold { display:flex; align-items:center; gap:5px;}
    .winner-cons .mqhold div { margin-right:8px }
    .winner-cons img { max-width:40px; margin-right:5px; }
    .winner-cons .user { color:var(--syscolor-secondary); font-weight:bold }
    .winner-cons .amo { color:var(--syscolor-primary); font-weight:bold }

.hgame-wrapper { }
.hgame { display:flex; justify-content:center; align-items:center; flex-wrap:wrap }
.hg { position:relative; width:50%; }
    .hg .iimg img { width:100% }
    .hg .cclose { position:absolute; right:-1%; top:14%; max-width:5vw}

.htabs-wrapper {  }
.htabs { display:flex; flex-wrap:wrap; justify-content:center; align-items:center }
    .htabs a { width:33.33%; padding:0px 6px; text-align:center; filter:opacity(0.5) }
    .htabs a.aaa, .htabs a:hover { filter: opacity(1) }
    .htabs img { width:100% }

.href-wrapper {  }
.hrefbox { position:relative }
    .hrefbox .iimg {  }
    .hrefbox .iicon { position:absolute; right:8px; top:12%; height:88%; width:200px; max-width:30vw; display:flex; flex-direction:column; justify-content:space-evenly; align-items:center }

.aftabs-wrapper {  }
.aftabs { display:flex; gap:8px }
    .aftabs a { width:100%; text-align:center }

.gsp { padding:0px 8px 0px 0px; filter:brightness(0.5); cursor:pointer }
    .gsp img { width:100% }
    .gsp.aaa, .gsp:hover { filter:brightness(1) }

.globby-wrapper {  }
    .globby-wrapper .gcats {  }
    .globby-wrapper .gcons { padding-top:16px }
    
.glbox { display:none }
.glbox.aaa, .glbox.s2 { display:block }
    .glbox .games { display:flex; flex-wrap:wrap }
        .glbox .games .gl { width:calc(33.3% - 10px); margin:10px 5px; cursor:pointer; position:relative }
        .glbox .games .gl:hover { filter:brightness(1.2) }
            .glbox .games .gl .iimg {  }
            .glbox .games .gl .bds { position:absolute; max-width:22%; right:0; top:8% }
            .glbox .games .gl .name { font-size:12px; text-align:center; padding-top:8px; line-height:normal }
        .glbox.s2 .games .gl { width:calc(16.66% - 10px); }
        .glbox.s2 .games .gl .iimg { border-radius:8px; overflow:hidden; }

.glcats { background-color:#333333; display:none; justify-content:space-between; align-items:center; gap:4px; padding:4px; overflow-x:auto; }
    .glcats a { border-radius:4px; text-transform:uppercase; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; background-color:#000000; color:#ffffff; font-size:12px; width:100%; text-align:center; padding:8px; font-weight:bold; line-height:normal; text-decoration:none; min-width:100px; }
    .glcats a.active { background-color:#E9B82D }
    .glcats.active { display:flex }

.gamenote { background-image: linear-gradient(to bottom, #222222, #000000); color:#ffffff; margin:10px auto 0; padding:10px; font-size: 11px; border-radius:8px }
.gamenote p { margin:0 }

.content { padding:90px 0px 110px; min-height:100vh }
.content.af { padding-top: 110px}

.footer { position: fixed; bottom: 0; left: 0; z-index: 3; width: 100%;text-align: center; height: 65px; box-shadow:0 -1px 5px rgba(0,0,0,1); background:linear-gradient(180deg, var(--syscolor-background), var(--syscolor-background2)); background-size:100% 100%; background-repeat:no-repeat; background-position:center center }
.footer .iin { display:grid; grid-template-columns: 20% 20% 20% 20% 20%; }
.footer .iin img { max-height:35px; }
.footer .iin a { display:flex; flex-direction:column; justify-content:center; align-items:center; font-weight:bold; font-size:12px; line-height:20px; color:var(--syscolor-textFooter); padding:5px; position:relative; text-transform:uppercase }
.footer .iin .cc { position:relative }
    .footer .iin .cc a { position:absolute; bottom:0; width:100%; }
    .footer .iin .cc a img { max-height:70px }
.footer a .badge, .float-lc a .badge { position: absolute; background: #dc143c; color: #fff; height: 20px; width: 20px; border-radius: 10px; top: 5px; right: 50%; margin: 0 -35px; font-weight: 700; font-size: 12px; display:flex; justify-content:center; align-items:center; border:2px solid #ffffff}

.float-lc { position:fixed; right:15px; bottom:60px; z-index:3; max-width:76px; }

.langbox-wrapper { display:flex; flex-direction:column; gap:12px; }
.langbox { display:flex; gap:12px; width:100%; align-items:center }
    .langbox .iicon {  }
        .langbox .iicon img { max-width:46px; }
    .langbox .ccon {  }
        .langbox .ccon .country { font-weight:bold; font-size:16px; text-transform:uppercase }
        .langbox .ccon .ttext { font-size:12px }
        .langbox .ccon .ttext a { color:#000000 }

.main-blink-me { animation: blinkme 1.5s linear infinite; }
@keyframes blinkme {
  0% { opacity:0 }
  38% { opacity:0 }
  39% { opacity:1 }
  100% { opacity:1 }
}

.main-pulse { animation: pulse 1s infinite ease-in-out alternate }
@keyframes pulse {
  from { transform:scale(1) }
  to { transform:scale(0.8) }
}

.regmethod {  }
    .regmethod .ttitle { color:var(--syscolor-primary); text-transform:uppercase; font-weight:bold }
    .regmethod .notes {  }

.fwb {  }
    .fwb .iin { position:relative }
        .fwb .iin .bbtn { position:absolute; right:0; top:0%; height:100%; padding:4px 12px; border-radius:5px; color:#ffffff; font-weight:bold; display:flex; justify-content:center; align-items:center; gap:8px }
        .fwb .iin .iimg { position:absolute; right:5px; top:50%; transform:translateY(-50%); max-height:34px }

.form-label { margin-bottom:3px; }

.sysbtn { text-align:center }
    .sysbtn img { max-width:70%; margin:0 auto; }
    .sysbtn.s2 img { max-width:42% }

.button-allno { border:0; background:transparent; padding:0; margin:0 }

.modal.fade.bottom .modal-dialog { transform:translate(0,50px) }
.modal.show.bottom .modal-dialog { transform:none }
.modal.bottom .modal-dialog { min-height:100%; display:flex; align-items:flex-end; margin:0 auto }

.pann-wrapper { display:block; border-radius:5px; overflow:hidden }
.pann-sidemenu { background-color:#111111; min-width:auto; max-width:none; width:100%; padding:10px; overflow-x:auto; white-space:nowrap; font-size:0 }
    .pann-sidemenu a { color:#ffffff; background-color:#363636; display:inline-block; padding:8px 16px; font-size:14px; border-radius:5px; margin:0px 3px; font-weight:bold }
    .pann-sidemenu a.aaa { background:linear-gradient(90deg, var(--syscolor-button1Background), var(--syscolor-button1Background2)); color:var(--syscolor-button1Text) }
.pann-content { width:100%; }
    .pann-content.more { background-color:#ffffff; padding:10px; }

.pannbox { display:none; }
.pannbox.aaa { display:block }

.promobox .ptitle { float: left; width: 100%; margin-top: 10px; font-weight: 700; }
.promobox .packet { width: calc(33.33% - 10px ); height: auto; max-width: 110px; display: inline-block; padding: 0; vertical-align: top; position: relative; margin: 15px 10px 0 0; text-align: center; overflow: hidden; color: #fff; cursor:pointer}
.promobox .packet.s2 { width: 100%; max-width:none; border-radius: 0px; }
.promobox .packet .bbg, .promobox .packet .bbg img { width:100% }
.promobox .packet .ttext { position: absolute; height: 100%; width: 100%; display: flex; justify-content: center; align-items: center; top: 0; left: 0; font-size:12px; font-weight:bold; padding:15%; line-height:normal }
.promobox .packet.no { filter:grayscale(0) brightness(0.5) }
.promobox .packet:hover { filter:brightness(1.2) }
.promobox .packet.no:hover { filter:grayscale(1) brightness(0.4) }

#loading { z-index: 1080; position: fixed; width: 100%; top: 0; bottom: 0; display:none }
#loading.aaa { display:block }
#loading .mask { height: 100%; width: 100%; background: #000; opacity: .6;}
#loading .mask img { position: absolute; top: 50%; left: 50%; width: 100px; margin: -50px; -webkit-animation-name: spin; -webkit-animation-duration: 1s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-name: spin; animation-duration: 1s; animation-iteration-count: infinite; animation-timing-function: linear;}
#loading .logo { position: absolute; top: 50%; left: 50%; height: 80px; width: 80px; margin: -40px; background-size: cover; background-position: center; background-color: #000; border-radius: 100%;}

.balance-wrapper { margin-top:12px; }
.balancebox { display:flex; gap:12px; font-size:12px; color:#ffffff; font-weight:bold; }
    .balancebox .bals { color:var(--syscolor-boxText) }
.bals-info-wrapper { position:relative; width:60%; border-radius:8px; padding:12px; border:2px solid var(--syscolor-boxBorder); background:var(--syscolor-boxBackground); display:flex; justify-content:space-evenly; flex-direction:column }
    .bals-info-wrapper .bals-refresh { position:absolute; top:6px; right:10px; font-size:20px; color:#999999; z-index:1 }
    .bals-info-wrapper div { display:flex; gap:4px; position:relative }
    .bals-info-wrapper div span:first-child { /*width:32%;*/ white-space:nowrap }
    .bals-info-wrapper div .readmore { position:absolute; right:0; top:50%; transform:translateY(-50%); padding:0 6px; font-weight:bold; font-size:9px; text-transform:uppercase }
.bals-rebate-wrapper { position:relative; width:40%; border-radius:8px; padding:12px; text-align:center; border:2px solid var(--syscolor-boxBorder); background:var(--syscolor-boxBackground); line-height:normal }
    .bals-rebate-wrapper .bals-amo { font-size:28px; color:var(--syscolor-primary); font-weight:bold }
.bals-rebate-wrapper.s2 { width:100%; display:flex; justify-content:space-between; align-items:center; text-align:left }

.history-wrapper {  }
.histabs { display:flex; gap:8px; flex-wrap:wrap }
    .histabs span { border:1px solid #999999; border-radius:20px; font-size:14px; font-weight:bold; text-align:center; padding:4px; background-color:#dddddd; color:#999999; cursor:pointer; width:calc(50% - 4px)}
    .histabs span.aaa, .histabs span:hover { background:linear-gradient(90deg, var(--syscolor-button1Background), var(--syscolor-button1Background2)); color:var(--syscolor-button1Text); border-color:var(--syscolor-boxBorder) }
.hisform { display:flex; gap:12px }
    .hisform div { width:100% }
.his-table { font-size:12px; }

.acc-user-wrapper { display:flex; align-items:center; justify-content:space-between; border:2px solid var(--syscolor-boxBorder); background:rgba(0,0,0,0.5); line-height:normal; border-radius:8px; margin:10px 20px; padding:8px 24px; margin-bottom:30px }
    .acc-user-wrapper small { font-size:10px; }
    .acc-user-wrapper span { font-weight:bold; font-size:24px; color:var(--syscolor-primary); }
    .acc-user-wrapper img { max-height:56px }

.acc-title { font-weight:bold; font-size:24px; color:var(--syscolor-title); padding:10px 20px; line-height:normal }

.acc-info-wrapper { margin-bottom:30px }

.accmenu { border-top:2px solid #422400; }
    .accmenu .menurow { display:flex; justify-content:space-between; align-items:center; font-size:16px; height:48px; background:rgba(0,0,0,0.7); border-bottom:2px solid var(--syscolor-boxBorder); font-weight:bold; gap:18px; padding:0px 22px; line-height:normal }
    .accmenu .menurow:hover { filter:brightness(1.3); cursor:pointer; background:#000000 }
    .accmenu .menurow .iicon { color:var(--syscolor-primary); font-size:18px }
    .accmenu .menurow .ttext { width:100%; color:#ffffff }
    .accmenu .menurow .aarrow { color:#999999 }

.acc-logout-wrapper { margin-bottom:20px; text-align:center }
.acclogout { background:rgba(0,0,0,0.7); color:var(--syscolor-primary); cursor:pointer; padding:8px 24px; border-radius:20px; display:inline-flex; justify-content:center; align-items:center; gap:8px }
    .acclogout:hover { color:#ffffff; background:#000000 }
    
.acc-follow-wrapper { padding:0px 20px }
.acc-follow-wrapper .ttitle { font-size:11px; text-align:center; padding-bottom:5px; }

.accfollow { display:flex; justify-content:center; align-items:center; gap:12px }
    .accfollow a {  }
    .accfollow a img { max-width:30px; width:30px }
    .accfollow a:hover { filter:brightness(1.3) }

.refqr-wrapper {  }
.refqrbox { margin-bottom:30px; }
    .refqrbox .refqrimg { text-align:center; }
        .refqrbox .refqrimg .iimg { padding:10px; background-color:#ffffff; display:inline-block }
        .refqrbox .refqrimg .iimg img { width: 100%; max-width: 250px }
        .refqrbox .refqrimg .iimg canvas { width: 100%; max-width: 250px }
    .refqrbox .refqrtext { text-align:center; padding:12px 4px; }
    .refqrbox .refqrbtn { margin-bottom:30px; display:flex; justify-content:center; align-items:center; gap:8px }
        .refqrbox .refqrbtn a { display:flex; justify-content:center; align-items:center; gap:4px; color:#ffffff; background-color:#000000; border-radius:8px; padding:8px 16px }
        .refqrbox .refqrbtn a i { font-size:16px; color:#ffd302; }
        .refqrbox .refqrbtn a span { font-size:14px; }

.startgame-wrapper { position:fixed; top:0; left:0; width:100%; height:100%; z-index:1079; display:none }
.startgame-wrapper.aaa { display:block }
.startgame { position:absolute; top:0; left:0; width:100%; height:100%; background-color:#000000 }
    .startgame .frame { width:100%; height:calc(100% - 46px) }
        .startgame .frame iframe { width:100%; height:100%; }
    .startgame .frame-close { height:46px; font-size:16px; font-weight:bold; color:#ffffff; background-color:#222222; display:flex; justify-content:center; align-items:center; cursor:pointer; text-transform:uppercase }
        .startgame .frame-close:hover { filter:brightness(1.3) }
.startgame-close { display:none; position:absolute; width:100%; height:100%; top:0; left:0; justify-content:center; align-items:center; background:rgba(0,0,0,0.6); z-index:1 }
.startgame-close.aaa { display:flex }
.sgc { padding:24px; background-color:#111111; color:#ffffff }
    .sgc h5 { font-size:16px; }
    .sgc .sgc-btn { margin-top:20px; display:flex; justify-content:center; align-items:center; gap:12px }
    .sgc .sgc-btn button { border:2px solid #ffffff; color:#ffffff; background:transparent; width:100%; padding:2px; text-transform:uppercase }
    .sgc .sgc-btn button:hover { color:#ffc107; border-color:#ffc107 }

.download-pop-wrapper {  }
.prov-title-img { text-align: center; padding-bottom: 10px; }
.access-info { text-align: center; overflow: auto; margin: 10px auto 15px; font-size: 14px; }
.download-wrapper {  }
.downloadbox { display:flex; gap:20px; justify-content:center }
.dlbox { max-width:160px; }
    .dlbox .iimg { padding:10px; background-color:#ffffff }
    .dlbox .iimg img, .dlbox .iimg canvas { width:100% }
    .dlbox .bbtn { padding-top:3px; text-align:center }

.selbox-method { display:flex; flex-wrap:wrap; justify-content:start; align-items:center; gap:6px;}
    .selbox-method span { width:calc(33.33% - 6px); border:1px solid #888888; border-radius:20px; font-size:14px; font-weight:bold; text-align:center; padding:4px; color:#888888; background:linear-gradient(90deg, #333333, #000000); cursor:pointer; }
    .selbox-method span:hover, .selbox-method span.aaa { background:linear-gradient(90deg, var(--syscolor-button1Background), var(--syscolor-button1Background2)); color:var(--syscolor-button1Text); border-color:var(--syscolor-boxBorder) }

.selbox-method-img { display:flex; flex-wrap:wrap; justify-content:start; align-items:center;}
    .selbox-method-img span { width:16.66%; cursor:pointer; filter:brightness(0.6); padding:6px; }
    .selbox-method-img span:hover, .selbox-method-img span.aaa { filter:brightness(1) }

.selbox-amount { display:flex; flex-wrap:wrap; justify-content:start; align-items:center; gap:6px;}
    .selbox-amount span { width:calc(25% - 5px); background-color:#dddddd; color:#999999; padding:6px; border-radius:4px; text-align:center; font-size:12px; font-weight:bold; cursor:pointer }
    .selbox-amount span:hover, .selbox-amount span.aaa { background:linear-gradient(90deg, var(--syscolor-button1Background), var(--syscolor-button1Background2)); color:var(--syscolor-button1Text); border-color:var(--syscolor-boxBorder) }

.bi-info { font-size:12px; padding:5px 0px 0px 15px }

.form-control { border-color:#422400; color:#747474; background-color:#000000; border-width:2px; font-size:14px; }
    .form-control::placeholder { color:#747474 }
    .form-control:focus { border-color:var(--syscolor-primary); color:#ffffff; background-color:#000000; box-shadow:none }

.modal-content { color:#000000 }
.modal-banner {  }
    .modal-banner img { width:100%; }
.modal-s1 {  }
    .modal-s1 .modal-content { border:3px solid var(--syscolor-button1Border); color:var(--syscolor-text) }
    .modal-s1 .modal-body { background-size:cover; background-repeat:no-repeat; background-position:center }
    .modal-s1 .modal-footer { border:0; background-color:#000000 }
    .modal-s1 .modal-title-cus { color:var(--syscolor-title); font-size:30px; font-weight:bold; text-transform:uppercase; margin-bottom:12px; text-align:center; line-height:normal }
    .modal-s1 a {color:var(--syscolor-primary); font-weight:bold }
    .modal-s1 a.btn-modal-close { color:var(--syscolor-primary) }
.btn-modal-close { position:absolute; z-index:1; font-size:28px; color:#ffffff; right:-6px; top:-6px; line-height:normal }
.modal-s2 {  }
    .modal-s2 .modal-content { background:transparent }

table.dataTable tbody tr { background-color:transparent!important }
.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate { color:#ffffff!important }

.header-hals-wrapper { }
.header-bals { border:1px solid var(--syscolor-boxBorder); background:var(--syscolor-boxBackground); padding:0px 12px; height:28px; font-size:14px; display:flex; justify-content:center; align-items:center; gap:4px; position:absolute; border-right:0px; font-weight:bold; right:10px; border-radius:30px; margin-top:5px; cursor:pointer }
    .header-bals .iicon::before { content:"\f100" }
    .header-bals .fas { color:var(--syscolor-primary) }
    .header-bals .bals { opacity:0; visibility:hidden; width:0px; max-width:max-content }
    .header-bals.aaa .iicon::before { content:"\f101" }
    .header-bals.aaa .bals { opacity:1; visibility:visible; width:50vw }

.msdp-wrapper {  }
    .msdp-wrapper .tt { text-align:center; text-transform:uppercase; font-weight:bold; font-size:20px; line-height:normal; margin-bottom:12px; }
        .msdp-wrapper .tt span { display:block; font-size:40px }
    .msdp-wrapper .ccon { display:flex; justify-content:center; align-items:center }

.msdpbox { width:calc(33.33% - 8px); margin:4px; position:relative; filter:brightness(.2) }
    .msdpbox .ov { position:absolute; width:100%; height:100%; top:0; left:0; }
    .msdpbox.ready { cursor:pointer; }
    .msdpbox.ready, .msdpbox.done { filter:brightness(1) }

.mscibox { margin:2px; position:relative; filter:brightness(.6) }
    .mscibox .ov { position:absolute; width:100%; height:100%; top:0; left:0; filter:grayscale(1) }
    .mscibox .bbg {  }
    .mscibox .ddate {  position:absolute; color:var(--syscolor-button1Text); font-size:14px; font-weight:bold; display:flex; justify-content:center; align-items:center; width:90%; height:38%; top:5%; left:5% }
    .mscibox.miss { filter:grayscale(1) }
    .mscibox.ready { cursor:pointer; }
    .mscibox.ready, .mscibox.done { filter:brightness(1) }
    .mscibox.done .ov { filter:grayscale(0) }

.ps-wrapper {  } 
    .ps-wrapper .ccon { display:flex; flex-wrap:wrap; justify-content:center; align-items:center }
.psbox { width:calc(50% - 12px); margin:6px; position:relative; }
    .psbox .tt { border:2px solid var(--syscolor-boxBorder); border-radius:8px; background-color:#000000; padding:8px; text-align:center; display:flex; flex-direction:column; gap:4px; font-weight:bold; line-height:normal }
        .psbox .tt h5 { font-size:14px; color:var(--syscolor-secondary); margin:0 }
        .psbox .tt img { }
        .psbox .tt span { font-size:12px; text-transform:uppercase }
    .psbox .act { margin-top:4px; text-align:center; filter:grayscale(1); pointer-events:none }
        .psbox .act.ready { filter:grayscale(0); pointer-events:auto }

.pscon-wrapper {  }
.pscon { text-transform:uppercase; display:flex; flex-direction:column; line-height:normal }
    .pscon h5 { color:var(--syscolor-title); font-size:18px; font-weight:bold; text-transform:uppercase; margin:0px; text-align:center; line-height:normal }
    .pscon span { color:var(--syscolor-secondary); display:block; text-align:center; font-size:18px; font-weight:bold; text-transform:uppercase; }
    .pscon .act { display:flex; justify-content:center; align-items:center; gap:8px; margin-top:6px; text-align:center }
        .pscon .act a { width:100%; max-width:180px }

.ef-glow { animation: glow 2s linear infinite; }
@keyframes glow {
    50% { filter:brightness(1) drop-shadow(0 0 12px var(--syscolor-primary)) }
}

@keyframes spin {
    from { transform: rotate(0deg) }
    to { transform: rotate(360deg) }
}

.promo-wrap { }
.prmenu { display:flex; align-items:center; justify-content:space-between; border-radius:12px; background-color:var(--syscolor-boxBackground); padding:0px 24px; overflow-x:auto; height:48px }
    .prmenu a { color:#ffffff; padding:12px 18px; font-weight:bold; white-space:nowrap }
    .prmenu a.aaa, .prmenu a:hover { color:var(--syscolor-primary); }
.prcon { margin:24px 0px; display:flex; gap:24px; flex-wrap:wrap; position:relative }
.prbox { background-color:var(--syscolor-boxBackground); border-radius:12px; overflow:hidden; width:0; opacity:0; visibility:hidden; height:0; position:absolute }
    .prbox .iimg {  }
        .prbox .iimg img { width:100% }
    .prbox .ccon { padding:12px; text-align:center }
        .prbox .ccon h5 { margin:0 }
        .prbox .ccon small { font-size:10px; display:block; color:#888888 }
        .prbox .ccon .act { display:flex; justify-content:center; align-items:center; gap:8px; margin-top:8px }
    .prbox.aaa {opacity:1; visibility:visible; height:100%; width:calc(50% - 12px); position:relative}
    .prbox.ready { filter:drop-shadow(0px 0px 6px var(--syscolor-primary)) drop-shadow(0px 0px 8px var(--syscolor-primary))}
.prdetail {  }
    .prdetail .iimg { border-radius:12px; overflow:hidden; margin-bottom:16px }
        .prdetail .iimg img { width:100% }
    .prdetail .ddesc {  }
    .prdetail .cta { margin:8px 0px 16px; text-align:center }

.cert-wrapper { border-top: 1px solid rgba(0,0,0,0.1); padding-top: 16px; margin-top: 16px; }
    .cert-wrapper .cons { display:flex; gap:30px }
.certbox-wrap { width:50% }

.certbox { display: flex; flex-direction:column; justify-content: start; gap: 8px; font-size:14px; margin-bottom:16px}
    .certbox .tt { white-space:nowrap; text-transform:uppercase }
    .certbox .icons { display: flex; gap: 16px; flex-wrap:wrap; padding:0; justify-content:start; align-items:center}
        .certbox .icons img { max-height: 30px; }
    .certbox .ttext { font-size:12px }

.seo-wrap { color:#888888; border-top: 1px solid rgba(0,0,0,0.1); margin-top:24px; padding-top:24px }
    .seo-wrap h1 { font-size:20px; color:#ffffff; text-align:left }
    .seo-wrap h2 { font-size:18px; color:#ffffff; text-align:left }
    .seo-wrap h3 { font-size:16px; color:#ffffff; text-align:left }
    .seo-wrap h4 { font-size:14px; color:#ffffff; text-align:left }
    .seo-wrap h5 { font-size:12px; color:#ffffff; text-align:left }
    .seo-wrap a { color:var(--syscolor-primary) }

.dpqrwrap { margin-top:22px }
    .dpqrwrap .ttitle { text-align:center; padding-bottom:6px; }
    .dpqrwrap .iimg { max-width:200px; margin:0 auto }
        .dpqrwrap .iimg img { width:100% }

.btn-smicon { font-size:26px }
.btn-wa { color:#25d366!important }
.btn-sms { color:#ffffff!important }

.sys-bals { display:none!important }
    .sys-bals.aaa { display:flex!important }

.blinking { animation: blinker 1s linear infinite; }

.file-input-wrapper { position: relative; overflow: hidden; display: block; background-color:#000000; color:#747474; border:2px solid #422400; border-radius:6px }
.file-input-wrapper button { border: 0px; color: #111111; background-color: #f8f9fa; padding: 8px 12px; font-size: 12px; cursor: pointer;}
.file-input-wrapper input[type="file"] { position: absolute; left: 0; top: 0; opacity: 0; cursor: pointer; height:100%; width:100%;}
.file-input-wrapper .filename { margin-left: 10px; font-style: italic; font-size:12px }

@keyframes blinker {
    50% { opacity: 0; }
}
     
@media only screen and (max-width: 767px) {
    .glbox.s2 .games .gl { width:calc(25% - 10px); }
}   

@media only screen and (max-width: 660px) {
  .header-bals { right:0px; border-radius:30px 0px 0px 30px; }

  .mscibox .ddate { font-size:2.4vw }
}

@media only screen and (max-width: 479px) {
    
    .glbox.s2 .games .gl { width:calc(33.33% - 10px); }
    .cert-wrapper .cons { flex-wrap:wrap; gap:0 }
    .certbox-wrap { width:100% }

}