.mini-gbox-wrap * { margin: 0; padding: 0; box-sizing: border-box; transition: all 0.3s; }
.mini-gbox-wrap { position:fixed; z-index:2147483647; width:100%; height:100%; top:0; left:0 }
    .mini-gbox-wrap .ooverlay { position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.8) }
    .mini-gbox-wrap .mini-gbox { position:absolute; z-index:2; width:94%; height:94%; left:3%; top:3%; opacity:0 }
    .mini-gbox-wrap .mini-gbox.aaa { opacity:1 } 

.fr-wrap {
  font-family:Arial; height: 100%; display: flex; align-items: center; justify-content: center; background-size:cover; background-position:center center; background-repeat:no-repeat; transition:none;
}
.fr-wrap img { max-width:100% }

.fr-close { position:absolute; right:15px; top:15px; cursor:pointer }
    .fr-close img { max-width:50px; }
    .fr-close:hover { filter:brightness(1.4) }

.fr-holder { max-width:760px; margin-top:0; position:relative; width:90% }
    .fr-holder .fr-top { position:relative; z-index:1; text-align:center; margin-top:12px }
        .fr-holder .fr-top img { max-height:15vh }

    .fr-holder .fr-con-wbg { position:relative; padding:5% 5% 0 5%; margin:12px auto 0; max-width:68vh }
        .fr-holder .fr-con-wbg .bbg { position:absolute; width:100%; height:100%; top:0; left:0 }
    .fr-holder .fr-con { position:relative;  }
        .fr-holder .fr-con .bbg {  }

    .fr-holder .fr-btm { display:flex; justify-content:space-between; align-items:center; position:relative }

.fr-svg svg { width:28px }

.fr-startgame-holder { position:relative }
.fr-startgame { filter:brightness(0.8); pointer-events:none; position:relative; text-align:center }
    .fr-startgame.aaa { filter:brightness(1); pointer-events:auto; cursor:pointer }
    .fr-startgame.stop { pointer-events:none; filter:brightness(0.5) }

.fr-roulette { display:flex; justify-content:center; align-items:center; gap:12px; z-index:1 }

.fr-roulette[aa="8"] {  }
.fr-roulette[aa="8"] .frrlt { width:calc(33.33% - 8px) }
.fr-roulette[aa="8"] .frrlt:nth-child(n+4) { position:absolute }
.fr-roulette[aa="8"] .frrlt:nth-child(4) { right:0; top: 33.33% }
.fr-roulette[aa="8"] .frrlt:nth-child(5) { right:0; top: 66.66% }
.fr-roulette[aa="8"] .frrlt:nth-child(6) { right:calc(33.33% + 4px); top: 66.66% }
.fr-roulette[aa="8"] .frrlt:nth-child(7) { left:0%; top: 66.66% }
.fr-roulette[aa="8"] .frrlt:nth-child(8) { left:0%; top: 33.33% }
.fr-startgame-holder[aa="8"] { width:33.33%; margin:9px auto; padding-bottom:33.33% }

.fr-roulette[aa="12"] {  }
.fr-roulette[aa="12"] .frrlt { width:calc(25% - 9px) }
.fr-roulette[aa="12"] .frrlt:nth-child(n+5) { position:absolute }
.fr-roulette[aa="12"] .frrlt:nth-child(5) { right:0; top: 25% }
.fr-roulette[aa="12"] .frrlt:nth-child(6) { right:0; top: 50% }
.fr-roulette[aa="12"] .frrlt:nth-child(7) { right:0; top: 75% }
.fr-roulette[aa="12"] .frrlt:nth-child(8) { right:calc(25% + 3px); top: 75% }
.fr-roulette[aa="12"] .frrlt:nth-child(9) { right:calc(50% + 6px); top: 75% }
.fr-roulette[aa="12"] .frrlt:nth-child(10) { left:0; top: 75% }
.fr-roulette[aa="12"] .frrlt:nth-child(11) { left:0; top: 50% }
.fr-roulette[aa="12"] .frrlt:nth-child(12) { left:0; top: 25% }
.fr-startgame-holder[aa="12"] { width:50%; margin:8px auto; padding-bottom:25.5% }

.fr-roulette[aa="16"] {  }
.fr-roulette[aa="16"] .frrlt { width:calc(20% - 10px) }
.fr-roulette[aa="16"] .frrlt:nth-child(n+6) { position:absolute }
.fr-roulette[aa="16"] .frrlt:nth-child(6) { right:0; top: 20% }
.fr-roulette[aa="16"] .frrlt:nth-child(7) { right:0; top: 40% }
.fr-roulette[aa="16"] .frrlt:nth-child(8) { right:0; top: 60% }
.fr-roulette[aa="16"] .frrlt:nth-child(9) { right:0; top: 80% }
.fr-roulette[aa="16"] .frrlt:nth-child(10) { right:calc(20% + 2px); top: 80% }
.fr-roulette[aa="16"] .frrlt:nth-child(11) { right:calc(40% + 4px); top: 80% }
.fr-roulette[aa="16"] .frrlt:nth-child(12) { right:calc(60% + 6px); top: 80% }
.fr-roulette[aa="16"] .frrlt:nth-child(13) { left:0; top: 80% }
.fr-roulette[aa="16"] .frrlt:nth-child(14) { left:0; top: 60% }
.fr-roulette[aa="16"] .frrlt:nth-child(15) { left:0; top: 40% }
.fr-roulette[aa="16"] .frrlt:nth-child(16) { left:0; top: 20% }
.fr-startgame-holder[aa="16"] { width:60%; margin:8px auto; padding-bottom:20% }

.fr-roulette[aa="20"] {  }
.fr-roulette[aa="20"] .frrlt { width:calc(16.66% - 10px) }
.fr-roulette[aa="20"] .frrlt:nth-child(n+7) { position:absolute }
.fr-roulette[aa="20"] .frrlt:nth-child(7) { right:0; top: 16.66% }
.fr-roulette[aa="20"] .frrlt:nth-child(8) { right:0; top: 33.32% }
.fr-roulette[aa="20"] .frrlt:nth-child(9) { right:0; top: 50% }
.fr-roulette[aa="20"] .frrlt:nth-child(10) { right:0; top: 66.66% }
.fr-roulette[aa="20"] .frrlt:nth-child(11) { right:0; top: 83.32% }
.fr-roulette[aa="20"] .frrlt:nth-child(12) { right:calc(16.66% + 2px); top: 83.32% }
.fr-roulette[aa="20"] .frrlt:nth-child(13) { right:calc(33.32% + 4px); top: 83.32% }
.fr-roulette[aa="20"] .frrlt:nth-child(14) { right:calc(50% + 6px); top: 83.32% }
.fr-roulette[aa="20"] .frrlt:nth-child(15) { right:calc(66.66% + 8px); top: 83.32% }
.fr-roulette[aa="20"] .frrlt:nth-child(16) { left:0; top: 83.32% }
.fr-roulette[aa="20"] .frrlt:nth-child(17) { left:0; top: 66.66% }
.fr-roulette[aa="20"] .frrlt:nth-child(18) { left:0; top: 50% }
.fr-roulette[aa="20"] .frrlt:nth-child(19) { left:0; top: 33.32% }
.fr-roulette[aa="20"] .frrlt:nth-child(20) { left:0; top: 16.66% }
.fr-startgame-holder[aa="20"] { width:60%; margin:0px auto; padding-top:3.66%; padding-bottom:23.32% }

.fr-roulette[aa="24"] {  }
.fr-roulette[aa="24"] .frrlt { width:calc(14.28% - 10px) }
.fr-roulette[aa="24"] .frrlt:nth-child(n+8) { position:absolute }
.fr-roulette[aa="24"] .frrlt:nth-child(8) { right:0; top: 14.28% }
.fr-roulette[aa="24"] .frrlt:nth-child(9) { right:0; top: 28.56% }
.fr-roulette[aa="24"] .frrlt:nth-child(10) { right:0; top: 42.84% }
.fr-roulette[aa="24"] .frrlt:nth-child(11) { right:0; top: 57.12% }
.fr-roulette[aa="24"] .frrlt:nth-child(12) { right:0; top: 71.4% }
.fr-roulette[aa="24"] .frrlt:nth-child(13) { right:0; top: 85.68% }
.fr-roulette[aa="24"] .frrlt:nth-child(14) { right:calc(14.28% + 2px); top: 85.68% }
.fr-roulette[aa="24"] .frrlt:nth-child(15) { right:calc(28.56% + 3px); top: 85.68% }
.fr-roulette[aa="24"] .frrlt:nth-child(16) { right:calc(42.84% + 5px); top: 85.68% }
.fr-roulette[aa="24"] .frrlt:nth-child(17) { right:calc(57.12% + 7px); top: 85.68% }
.fr-roulette[aa="24"] .frrlt:nth-child(18) { right:calc(71.4% + 8px); top: 85.68% }
.fr-roulette[aa="24"] .frrlt:nth-child(19) { left:0; top: 85.68% }
.fr-roulette[aa="24"] .frrlt:nth-child(20) { left:0; top: 71.4% }
.fr-roulette[aa="24"] .frrlt:nth-child(21) { left:0; top: 57.12% }
.fr-roulette[aa="24"] .frrlt:nth-child(22) { left:0; top: 42.84% }
.fr-roulette[aa="24"] .frrlt:nth-child(23) { left:0; top: 28.56% }
.fr-roulette[aa="24"] .frrlt:nth-child(24) { left:0; top: 14.28% }
.fr-startgame-holder[aa="24"] { width:60%; margin:0px auto; padding-top:3.66%; padding-bottom:23.32% }

.fr-roulette[aa="28"] {  }
.fr-roulette[aa="28"] .frrlt { width:calc(12.5% - 10px) }
.fr-roulette[aa="28"] .frrlt:nth-child(n+9) { position:absolute }
.fr-roulette[aa="28"] .frrlt:nth-child(9) { right:0; top: 12.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(10) { right:0; top: 25% }
.fr-roulette[aa="28"] .frrlt:nth-child(11) { right:0; top: 37.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(12) { right:0; top: 50% }
.fr-roulette[aa="28"] .frrlt:nth-child(13) { right:0; top: 62.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(14) { right:0; top: 75% }
.fr-roulette[aa="28"] .frrlt:nth-child(15) { right:0; top: 87.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(16) { right:calc(12.5% + 2px); top: 87.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(17) { right:calc(25% + 3px); top: 87.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(18) { right:calc(37.5% + 4px); top: 87.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(19) { right:calc(50% + 6px); top: 87.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(20) { right:calc(62.5% + 8px); top: 87.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(21) { right:calc(75% + 9px); top: 87.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(22) { left:0; top: 87.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(23) { left:0; top: 75% }
.fr-roulette[aa="28"] .frrlt:nth-child(24) { left:0; top: 62.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(25) { left:0; top: 50% }
.fr-roulette[aa="28"] .frrlt:nth-child(26) { left:0; top: 37.5% }
.fr-roulette[aa="28"] .frrlt:nth-child(27) { left:0; top: 25% }
.fr-roulette[aa="28"] .frrlt:nth-child(28) { left:0; top: 12.5% }
.fr-startgame-holder[aa="28"] { width:60%; margin:0px auto; padding-top:3.66%; padding-bottom:23.32% }

.frrlt.sss { filter:drop-shadow(0px 0px 8px #ffbe25) drop-shadow(0px 0px 8px #ffbe25) brightness(1.3); transform:scale(1.05) }
    
.fr-token { position:absolute; top:0; left:0; display:flex; gap:4px; align-items:center; color:#ffffff; font-size:24px; font-weight:bold; text-shadow:0px 0px 4px #000000, 0px 0px 6px #000000; padding:6px 12px; border-radius:80px; border:2px solid #222222; background-color:#111111; text-align:center }
     
/*.fr-history { max-width:25%; cursor:pointer; margin:-4% 0 }*/

.fr-history { display:flex; flex-direction:column; color:#ffffff; font-size:18px; font-weight:bold; text-shadow:0px 0px 4px #000000, 0px 0px 6px #000000; padding:8px; border-radius:80px; border:2px solid #222222; background-color:#111111; text-align:center; cursor:pointer; position:absolute; top:0; right:0 }
    .fr-history:hover { filter:brightness(1.4) }

.fr-token-requirement { font-size:20px; font-weight:bold; color:#ffffff; text-shadow:0px 0px 4px #000000, 0px 0px 6px #000000; text-align:center; position:absolute; left:50%; bottom:3%; transform:translateX(-50%); width:100%; }

.fr-res { position:fixed; width:100%; height:100%; left:0px; top:0px; z-index:12; opacity:0; visibility:hidden }
.fr-res.aaa { opacity:1; visibility:visible}
    .fr-res .overlay { position:absolute; z-index:1; background:rgba(0,0,0,0.7); width:100%; height:100% }
    .fr-res .fr-res-con { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2; width:88%; max-width:870px }
        .fr-res .fr-res-con::after { content:''; position:absolute; width:100%; height:100%; top:0px; left:0px; z-index:-1; background-size:cover  }
        .fr-res .fr-res-con .res-top { display:flex; justify-content:center; margin-top:8%; margin-bottom:-2%; filter:grayscale(1) }
        .fr-res .fr-res-con .res-label small { font-size:24px; display:block }
        .fr-res .fr-res-con .res-label { text-transform:uppercase; color:#111111; font-size:66px; font-weight:bold; text-align:center; text-shadow:0px 3px 10px #ffffff,0px 3px 10px #ffffff,0px 3px 10px #ffffff,0px 3px 10px #ffffff,0px 3px 10px #ffffff,0px 3px 10px #ffffff; line-height:normal; margin:-3% 0 2%}
        
        .fr-res .res-con { position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:2; display:flex; flex-direction:column; justify-content:center; align-items:center }
        .fr-res .res-bbg { position:relative; z-index:1; }
        .fr-res .res-title {  }
        .fr-res .res-button { cursor:pointer; max-width:50% }
            .fr-res .res-button:hover img { filter:brightness(1.4); transform:scale(1.05) }
            
.fr-res[res="win"] .fr-res-con .res-bbg { animation: blink 1s ease infinite; filter:brightness(1); }
.fr-res[res="win"] .fr-res-con .res-title { animation: zoom 1s ease infinite; }
.fr-res[res="lose"] .fr-res-con .res-bbg { filter:grayscale(1); opacity:0.7 }
.fr-res[res="lose"] .fr-res-con .res-title { display:none }

.mob-landscape .fr-holder { max-width:66vh; height:100% }
.mob-landscape .fr-svg svg { max-width:20px }
.mob-landscape .fr-token { font-size:12px }
.mob-landscape .fr-token-requirement { font-size:14px }

.fr-winnerlist { position:fixed; width:100%; height:100%; left:0px; top:0px; z-index:12; opacity:0; visibility:hidden }
.fr-winnerlist.aaa { opacity:1; visibility:visible}
    .fr-winnerlist .overlay { position:absolute; z-index:1; background:rgba(0,0,0,0.7); width:100%; height:100% }
    .fr-winnerlist .ccon { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2; width:88%; max-width:480px }

.fr-wl-wrap { background-color:#ffffff; border-radius:6px; overflow:hidden }
    .fr-wl-tabs-wrap { display:flex; justify-content:center; align-items:center; background:#36304a; color:#ffffff }
        .fr-wl-tabs-wrap .fr-wl-tabs { text-align:center; width:100%; text-transform:uppercase; font-weight:bold; height:40px; display:flex; justify-content:center; align-items:center; cursor:pointer; font-size:16px; }
        .fr-wl-tabs-wrap .fr-wl-tabs.aaa, .fr-wl-tabs-wrap .fr-wl-tabs:hover { background:#201c2f; color:#ffffff }

.fr-wl-wrap .fr-wl-con { max-height:60vh; overflow-y:auto; }
    .fr-wl-wrap .fr-wl-con .fr-wl { display:none }
    .fr-wl-wrap .fr-wl-con .fr-wl.aaa { display:block }

.fr-wl table { width:100%; text-align:center; font-size:14px; color:#ffffff }
    .fr-wl table thead { background-color:#111111; color:#ffffff; position:sticky; top:0 }
    .fr-wl table tbody { font-size:12px; }
    .fr-wl table th, .fr-wl table td { padding:8px; width:33.33%; text-align:center }
    .fr-wl table tbody tr:nth-child(even) { background-color:#f5f5f5 }

.fr-wl-close { position:absolute; right:-15px; top:-15px; cursor:pointer }
    .fr-wl-close img { max-width:40px; }
    .fr-wl-close:hover { filter:brightness(1.4) }

@media only screen and (max-width: 1024px) {

}

@media only screen and (max-width: 760px) {

    .fr-svg svg { max-width:4vw }
    .fr-token { font-size:3.2vw }
    .fr-token-requirement { font-size:2.8vw }

    .fr-res .fr-res-con .res-label { font-size:16vw; margin-top:-8% }
    .fr-res .res-bbg { transform:scale(1.8) }

}