/*---------------------------------------------------------
    NINIGAME VISUAL
---------------------------------------------------------*/

#minigame_visual {
    display: block;
    margin:0;
    border-bottom:1px solid #454462;
}

#minigame_visual .visual_list {
    display: block;
    margin:0;
    min-width:1400px;
    height:364px;
    position: relative;
    overflow: hidden;
}

#minigame_visual .visual_list .visual_item {
    display: block;
    position: absolute;
    left:0;
    top:0;
    right:0;
    bottom:0;
    opacity: 0;
    transition: all 600ms;
}

#minigame_visual .visual_list .visual_item.active {
    opacity: 1;
    transition: all 600ms;
}

#minigame_visual .visual_list .visual_item .visual_bg {
    display: block;
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%, -50%);
    width:1600px;
    height:364px;
    object-fit: none;
    object-position: center;
}

#minigame_visual .visual_list .visual_item .visual_entity {
    display: block;
    position:absolute;
    left:50%;
    bottom:-364px;
    width:800px;
    height:364px;
    margin-left:260px;
    object-fit:none;
    object-position: bottom right;
    transform: translate(-50%) scale(0.5);
    opacity: 0;
} 

#minigame_visual .visual_list .visual_item.active .visual_entity {
    transition-delay: 200ms;
    transition-property: all;
    transition-duration: 400ms;
    transform: translate(-50%) scale(1);
    bottom:0px;
    opacity: 1;
}

#minigame_visual .visual_list .visual_item .visual_label {
    display: block;
    position:absolute;
    left:50%;
    top:50%;
    width:800px;
    height:364px;
    margin-left:-600px;
    object-fit: none;
    object-position: left;
    transform: translate(-50%,-50%) scale(0.5);
    opacity: 0;
} 

#minigame_visual .visual_list .visual_item.active .visual_label {
    transition-delay: 400ms;
    transition-property: all;
    transition-duration: 400ms;
    margin-left:-260px;
    transform: translate(-50%,-50%) scale(1);
    opacity: 1;
}

#minigame_visual .visual_list .visual_item .visual_mask_left {
    display: block;
    position: absolute;
    right:50%;
    top:0px;
    bottom:0px;
    width:800px;
}

#minigame_visual .visual_list .visual_item .visual_mask_right {
    display: block;
    position: absolute;
    left:50%;
    top:0px;
    bottom:0px;
    width:800px;
}

#minigame_visual .visual_btns {
    position:absolute;
    display: flex;
    left:50%;
    height:0px;
    bottom:50px;
    transform: translate(-50%, -50%);
}

#minigame_visual .visual_btns .btn_circle {
    display: block;
    flex-shrink: 0;
    width:10px;
    height:10px;
    margin:10px;
    border-radius: 10px;
    background:#42425f;
    transform: translateY(-50%);
    cursor:pointer;
    transition: all 300ms;
}

#minigame_visual .visual_btns .btn_circle.active {
    background:#ffc967;
    box-shadow: 0px 0px 20px 5px #ffc967;
    width:16px;
    height:16px;
    border-radius:10px;
    transition: all 300ms;
}


/*---------------------------------------------------------
    MINIGAME NAV
---------------------------------------------------------*/
#minigame_nav {
    display: flex;
    justify-content: center;
    min-width: 1400px;
    background: #29324b;
    border-bottom: 1px solid #29324b;
}

#minigame_nav .flexbox {
    display: flex;
    min-width: 1400px;
    max-width: 2200px;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
}

#minigame_nav .flexbox .navitem {
    display: block;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    margin-left: 1px;
    background: #07172d;
    font-size: 16px;
    font-weight: 600;
    color: #888888;
    cursor: pointer;
}

#minigame_nav .flexbox .navitem.active,
#minigame_nav .flexbox .navitem:hover {
    border-top: 2px solid #ef7c00;
    line-height: 46px;
    background: #29324b;
    color: #ffffff;
}

/*---------------------------------------------------------
    MINIGAME LIST
---------------------------------------------------------*/
#minigame_list {
    display: flex;
    justify-content: center;
    min-width: 1400px;
    width:100%;
}

#minigame_list .gridbox {
    display: grid;
    min-width: 1400px;
    max-width: 2200px;
    width:100%;
    padding-left:20px;
    padding-right:20px;
    padding-top:40px;
    padding-bottom:40px;
    grid-gap: 20px;
    grid-template: repeat(1, 1fr) / repeat(12, 1fr);
}

@media screen and (max-width: 2050px) {
    #minigame_list .gridbox {
        grid-template: repeat(1, 1fr) / repeat(11, 1fr);
    }
}

@media screen and (max-width: 1900px) {
    #minigame_list .gridbox {
        grid-template: repeat(1, 1fr) / repeat(10, 1fr);
    }
}

@media screen and (max-width: 1750px) {
    #minigame_list .gridbox {
        grid-template: repeat(1, 1fr) / repeat(9, 1fr);
    }
}

@media screen and (max-width: 1600px) {
    #minigame_list .gridbox {
        grid-template: repeat(1, 1fr) / repeat(8, 1fr);
    }
}

@media screen and (max-width: 1450px) {
    #minigame_list .gridbox {
        grid-template: repeat(1, 1fr) / repeat(7, 1fr);
    }
}


#minigame_list .gridbox .minigameitem {
    position: relative;
    width:100%;
    aspect-ratio: 1/1;
    overflow: hidden;
    background:#09112a;
    border-radius: 25px;
    border: 2px solid #2e427e;
    cursor:pointer;
    z-index:10;
    transition: all 300ms;
    filter:grayscale(0.5) brightness(0.8);
    display: none;
    order:1;
}

#minigame_list .gridbox .minigameitem.show {
    order:0;
}

#minigame_list .gridbox .minigameitem:hover {
    z-index:20;
    transform: scale(1.2);
    box-shadow: 
        0px 0px 5px #cad0ff,
        0px 0px 10px #7785ff,
        0px 0px 20px #7785ff;
    filter:grayscale(0) brightness(1);
    transition: all 300ms;
}

#minigame_list .gridbox .minigameitem .bg {
    position: absolute;
    display: block;
    width:100%;
    height:100%;
    object-fit: cover;
}

#minigame_list .gridbox .minigameitem .time {
    position: absolute;
    display: block;
    right:3px;
    top:3px;
}


#minigame_list .gridbox .minigameitem .label {
    position: absolute;
    display: block;
    background: url('/images/1bet1/minigame/label_base.png');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
    left:0px;
    right:0px;
    bottom:0px;
    top:0px;
}

#minigame_list .gridbox .minigameitem .label span {
    position: absolute;
    display: block;
    bottom:8%;
    left:50%;
    transform: translate(-50%,50%);
    color:#ffffff;
    font-size:14px;
    line-height:14px;
    height:14px;
    font-weight: 600;
    font-family: 'Gmarket Sans';
    white-space: nowrap;
    text-shadow: 
        0px 0px 5px #00603a,
        0px 0px 10px #00603a,
        0px 0px 15px #00603a;
}

#minigame_list .gridbox .minigameitem .effect {
    position: absolute;
    display: block;
    left:0px;
    top:0px;
    right:0px;
    bottom:0px;
    box-shadow: inset 0px 0px 10px #000000;
    transition: all 300ms;
}

@keyframes minigame_list_effect {
    0%{
        background-position: 0rem;
    }
    100%{
        background-position: 20rem;
    }
}

#minigame_list .gridbox .minigameitem:hover .effect {
    background: 
        linear-gradient(135deg,
           rgba(255, 255, 255, .1) 25%,
            transparent 25%,
            transparent 50%,
          rgba(255, 255, 255, .1) 50%,
          rgba(255, 255, 255, .1) 75%,
            transparent 75%, transparent);
        background-size: 20rem 20rem;
    animation: minigame_list_effect 1s infinite linear;
    box-shadow: inset 0px 0px 10px #7785ff93;
    transition: all 300ms;
}

/*---------------------------------------------------------
    MINIGAME SLIDE LIST
---------------------------------------------------------*/
#minigame_slide_list {
    display: flex;
    justify-content: center;
    min-width:1400px;
}

#minigame_slide_list .flexbox {
    display: flex;
    min-width: 1400px;
    max-width: 2200px;
    padding-left:20px;
    padding-right:20px;
    margin-bottom:20px;

}

#minigame_slide_list .flexbox .slidebox {
    width:100%;
    overflow-y: hidden;
    overflow-x: scroll;
    padding-top:40px;
    padding-bottom:40px;
}

#minigame_slide_list .flexbox .slidebox::-webkit-scrollbar {
    height:8px;
}

#minigame_slide_list .flexbox .slidebox::-webkit-scrollbar-track {
    background: #141921;
}

#minigame_slide_list .flexbox .slidebox::-webkit-scrollbar-thumb {
    background: #262b32;
}

#minigame_slide_list .flexbox .slidebox .innerbox {
    display: flex;
    padding-left:40px;
    padding-right:40px;
}

#minigame_slide_list .flexbox .slidebox .innerbox .minigameitem {
    position: relative;
    overflow: hidden;
    background:#09112a;
    border-radius: 25px;
    border: 2px solid #2e427e;
    cursor:pointer;
    z-index:10;
    transition: all 300ms;
    filter:grayscale(0.5) brightness(0.8);
    display: block;
    flex-shrink: 0;
    width:147px;
    height:157px;
    margin-right:20px;
    order:2;
}

#minigame_slide_list .flexbox .slidebox .innerbox .minigameitem.active,
#minigame_slide_list .flexbox .slidebox .innerbox .minigameitem:hover {
    box-shadow: 
        0px 0px 5px #cad0ff,
        0px 0px 10px #7785ff,
        0px 0px 20px #7785ff;
    filter:grayscale(0) brightness(1);
    transition: all 300ms;
}

#minigame_slide_list .flexbox .slidebox .innerbox .minigameitem .bg {
    position: absolute;
    display: block;
    width:100%;
    height:100%;
    object-fit: cover;
}

#minigame_slide_list .flexbox .slidebox .innerbox .minigameitem .time {
    position: absolute;
    display: block;
    right:3px;
    top:3px;
}

#minigame_slide_list .flexbox .slidebox .innerbox .minigameitem .label {
    position: absolute;
    display: block;
    background: url('/images/1bet1/minigame/label_base.png');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
    left:0px;
    right:0px;
    bottom:0px;
    top:0px;
}

#minigame_slide_list .flexbox .slidebox .innerbox .minigameitem .label span {
    position: absolute;
    display: block;
    bottom:8%;
    left:50%;
    transform: translate(-50%,50%);
    color:#ffffff;
    font-size:14px;
    line-height:14px;
    height:14px;
    font-weight: 600;
    font-family: 'Gmarket Sans';
    white-space: nowrap;
    text-shadow: 
        0px 0px 5px #00603a,
        0px 0px 10px #00603a,
        0px 0px 15px #00603a;
}

#minigame_slide_list .flexbox .slidebox .innerbox .minigameitem .effect {
    position: absolute;
    display: block;
    left:0px;
    top:0px;
    right:0px;
    bottom:0px;
    box-shadow: inset 0px 0px 10px #000000;
    transition: all 300ms;
}

@keyframes minigame_list_effect {
    0%{
        background-position: 0rem;
    }
    100%{
        background-position: 20rem;
    }
}

#minigame_slide_list .flexbox .slidebox .innerbox .minigameitem:hover .effect {
    background: 
        linear-gradient(135deg,
           rgba(255, 255, 255, .1) 25%,
            transparent 25%,
            transparent 50%,
          rgba(255, 255, 255, .1) 50%,
          rgba(255, 255, 255, .1) 75%,
            transparent 75%, transparent);
        background-size: 20rem 20rem;
    animation: minigame_list_effect 1s infinite linear;
    box-shadow: inset 0px 0px 10px #7785ff93;
    transition: all 300ms;
}



/*---------------------------------------------------------
    MINIGAME_VIEW
---------------------------------------------------------*/
#minigame_view {
    display: block;
    min-width: 1400px;
}

#minigame_view .gamebox {
    display: flex;
    min-width: 1400px;
    overflow: hidden;
    height:1vh;
    justify-content: center;
    margin-bottom:20px;
	/*max-height:1165px;*/
}

#minigame_view .gamebox .flexbox {
    display: flex;
    min-width: 1400px;
    max-width: 2200px;
    width: 100%;
    width:100%;
    padding-left:20px;
    padding-right:20px;
}

#minigame_view .gamebox .flexbox .leftbox {
    width:37%;
    background:#030c18;
    display: flex;
    flex-direction: column;
}

#minigame_view .gamebox .flexbox .leftbox .titlebox {
    display: flex;
    height: 62px;
    background: url(/images/1bet1/sports/title_effect_overlay.png), #07172d;
    background-position: left;
    background-size: cover;
    position: relative;
    z-index: 10;
    margin-bottom:1px;
    flex-shrink: 0;
}

#minigame_view .gamebox .flexbox .leftbox #board_list {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow: hidden;
}

#minigame_view .gamebox .flexbox .leftbox #board_list .listbox {
    display: flex;
    flex-direction: column;
    margin-top:1px;
    overflow: hidden;
}

#minigame_view .gamebox .flexbox .leftbox #board_list .listbox .listhead {
    flex-shrink: 0;
    border-right:8px solid #29324b;
}

#minigame_view .gamebox .flexbox .leftbox #board_list .listbox .listbody {
    flex-grow: 1;
    overflow-y: scroll;
    overflow-x: hidden;
    height:100%;
}

#minigame_view .gamebox .flexbox .leftbox #board_list .listbox .listbody::-webkit-scrollbar {
    width:8px;
}

#minigame_view .gamebox .flexbox .leftbox #board_list .listbox .listbody::-webkit-scrollbar-track {
    background: #141921;
}

#minigame_view .gamebox .flexbox .leftbox #board_list .listbox .listbody::-webkit-scrollbar-thumb {
    background: #262b32;
}

#minigame_view .gamebox .flexbox .leftbox #board_list .listbox .listpagenation {
    flex-shrink: 0;
}


#minigame_view .gamebox .flexbox .leftbox .titlebox .label {
    display: block;
    flex-grow: 1;
    line-height: 62px;
    font-size: 16px;
    margin-left: 20px;
    font-weight: 600;
    color: #cccccc;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-shadow: 0 0 10px rgb(0 0 0 / 50%);
}


#minigame_view .gamebox .flexbox .centerbox {
    display: block;
    /*width:37%;*/
	width:700px;
    max-width: 830px;
    flex-shrink: 0;
    margin-right:10px;
    margin-left:10px;
    position: relative;
}

#minigame_view .gamebox .flexbox .centerbox .titlebox {
    display: flex;
    height: 62px;
    background: url(/images/1bet1/sports/title_effect_overlay.png), #07172d;
    background-position: left;
    background-size: cover;
    position: relative;
    z-index: 10;
    margin-bottom:1px;
	position:absolute;
	top:0;
	width:100%;
}

#minigame_view .gamebox .flexbox .centerbox .titlebox .label {
    display: block;
    flex-grow: 1;
    line-height: 62px;
    font-size: 16px;
    margin-left: 20px;
    font-weight: 600;
    color: #cccccc;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-shadow: 0 0 10px rgb(0 0 0 / 50%);
}

#minigame_view .gamebox .flexbox .centerbox .gamepadbox {
    background:#0d1d32;
    margin-top:1px;
}

#minigame_view .gamebox .flexbox .rightbox {
    display: block;
    width: 26%;
    background: #07172d;
    position: relative;
}


/*---------------------------------------------------------
    MINIGAME_BETTING
---------------------------------------------------------*/
#minigame_betting { 
    display: block;
    position: absolute;
    left:0px;
    right:0px;
    bottom:0px;
    top:0px;
}

#minigame_betting .bg {
    position: absolute;
    left:0px;
    right:0px;
    opacity: 0.1;
    filter:grayscale(0.6);
}

#minigame_betting form {
    display: flex;
    flex-direction: column;
    position: absolute;
    left:0px;
    right:0px;
    bottom:0px;
    top:0px;
}

#minigame_betting form .titlebox {
    display: flex;
    height: 62px;
    background: url(/images/1bet1/sports/title_effect_overlay.png), #07172d;
    background-position: left;
    background-size: cover;
    position: relative;
    z-index: 10;
    margin-bottom:1px;
    flex-shrink: 0;
    justify-content: space-between;
}

#minigame_betting form .titlebox .label {
    display: block;
    flex-grow: 1;
    line-height: 62px;
    font-size: 16px;
    margin-left: 20px;
    font-weight: 600;
    color: #cccccc;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-shadow: 0 0 10px rgb(0 0 0 / 50%);
}

#minigame_betting form .titlebox .btn_list {
    width:80px;
    height:62px;
    text-align: center;
    line-height:62px;
    color:#cccccc;
    background:#0d1d32;
    border-left:1px solid #070a0f;
    transition: all 300ms;
    font-size:15px;
    font-weight:600;
}

#minigame_betting form .titlebox .btn_list:hover {
    background:#29324b;
    transition: all 300ms;
    color:#ffffff;
}

#minigame_betting form .selbox {
    display: block;
    position: relative;
    flex-grow: 1;
    border-top:1px solid #070a0f;
}

#minigame_betting form .selbox .select_item {
    display: block;
    position: absolute;
    left:50%;
    bottom:50%;
    font-size:80px;
    white-space: nowrap;
    font-weight: 600;
    font-family: 'Gmarket Sans';
    margin-bottom:-35px;
    transform: translate(-50%);
    text-shadow: 
        0px 0px 5px #ff3939,
        0px 0px 10px #ef7c00,
        0px 0px 20px #ff3939,
        0px 0px 30px #ff3939;
}

#minigame_betting form .selbox .select_odds {
    display: block;
    position: absolute;
    left:50%;
    top:50%;
    font-size:40px;
    font-weight: 600;
    font-family: 'Gmarket Sans';
    transform: translate(-50%);
    margin-top:35px;
    height:40px;
    text-shadow: 
        0px 0px 5px #ff3939,
        0px 0px 10px #ef7c00,
        0px 0px 20px #ff3939;
}

#minigame_betting form .moneybox {
    display: block;
    position: relative;
    flex-shrink: 0;
}

#minigame_betting form .moneybox .moneyitem {
    display: flex;
    margin-top:10px;
    margin-bottom:10px;
    height:66px;
    border-top:1px solid #070a0f;
    border-bottom:1px solid #070a0f;
    background: #031124;
}

#minigame_betting form .moneybox .moneyitem .label {
    flex-shrink: 0;
    line-height: 64px;
    padding-left:20px;
    padding-right:20px;
    font-size:16px;
    color:#888888;
    width:120px;
    text-align: center;
    font-weight:600;
    border-right:1px solid #070a0f;
}

#minigame_betting form .moneybox .moneyitem .amount{
    flex-grow: 1;
    text-align: right;
    padding-right:20px;
    padding-left:20px;
    line-height:64px;
    position: relative;
    font-family: 'Rajdhani';
    font-size:28px;
    letter-spacing: 1px;
    color:#ffc967;
}

#minigame_betting form .moneybox .moneyitem .amount span {
    position: absolute;
    left:20px;
    top:50%;
    transform: translate(0, -50%);
    font-weight: 100;
    font-family: 'Nato Sans';
    font-size:20px;
    color:#ffc967;
}

#minigame_betting form .moneybox .moneyitem .amount input {
    position: absolute;
    display: block;
    left:0;
    right:0;
    bottom:0;
    top:0;
    background: transparent;
    margin:0;
    padding:0;
    border:0;
    text-align: right;
    padding-right:20px;
    font-family: 'Rajdhani';
    font-size:28px;
    letter-spacing: 1px;
    color:#ffc967;
}


#minigame_betting form .btnbox {
    display: grid;
    position: relative;
    flex-shrink: 0;
    grid-template: repeat(3, 1fr) / repeat(3, 1fr);
    grid-gap: 10px;
    padding:20px;
}

@keyframes minigame_betting_btn_active {
    from {
        box-shadow: 0 4px 3px 1px #07172d, 0 6px 8px #07172d, 0 -4px 4px #0e2950, 0 -6px 4px #030c18, inset 0 0 20px 0px rgba(79, 120, 255, 0.6);
    }
    to {
        box-shadow: 0 4px 3px 1px #07172d, 0 6px 8px #07172d, 0 -4px 4px #0e2950, 0 -6px 4px #030c18, inset 0 0 3px 3px #030c1a;
    }
}

#minigame_betting form .btnbox .btn {
    -webkit-appearance: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none;
    cursor: pointer;
    width: 100%;
    height: 60px;
    background-image: linear-gradient(to top, #07172d 0%, rgb(15, 51, 102) 95%, #07172d 100%);
    border-radius: 30px;
    border: 1px solid #0e2b55;
    box-shadow: 0 4px 3px 1px #07172d, 0 6px 8px #07172d, 0 -4px 4px #07172d, 0 -6px 4px #07172d, inset 0 0 3px 0 #07172d;
    transition: all 0.2s ease;
    font-size: 16px;
    font-weight: 600;
    font-family: 'Gmarket Sans';
    text-shadow: 0 1px #0e2950;
    transition: all 300ms;
}

#minigame_betting form .btnbox .btn * {
    color:#cccccc;
}

#minigame_betting form .btnbox .btn:hover {
    box-shadow: 0 4px 3px 1px #07172d, 0 6px 8px #07172d, 0 -4px 4px #07172d, 0 -6px 4px #07172d, inset 0 0 3px 3px #07172d;
    transition: all 300ms;
}

#minigame_betting form .btnbox .btn:not(:focus):not(:active) {
    box-shadow: 0 4px 3px 1px #07172d, 0 6px 8px #07172d, 0 -4px 4px #07172d, 0 -6px 4px #07172d, inset 0 0 3px 3px #07172d;
    animation: minigame_betting_btn_active 0.9s alternate;
}

#minigame_betting form .btnbox .btn:active {
    background-image: linear-gradient(to top, #07172d 0%, rgb(12, 42, 83) 95%, rgb(5, 17, 34)100%);
    transition: all 300ms;
}

#minigame_betting form .btnbox .btn:active * {
    transform: scale(0.95);
    transition: all 300ms;
    color:#888888;
}

#minigame_betting form .btnbox .btn:hover:not(:active) * {
    text-shadow: 
        0px 0px 5px #ff362f,
        0px 0px 10px #ef7c00,
        0px 0px 20px #ff362f;
    transition: all 500ms;
}

#minigame_betting form .btn_betting {
    -webkit-appearance: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none;
    cursor: pointer;
    height: 100px;
    margin-left:20px;
    margin-right:20px;
    margin-top:10px;
    margin-bottom:30px;
    background-image: linear-gradient(to top, #07172d 0%, rgb(15, 51, 102) 95%, #07172d 100%);
    border-radius: 30px;
    border: 1px solid #0e2b55;
    box-shadow: 0 4px 3px 1px #07172d, 0 6px 8px #07172d, 0 -4px 4px #07172d, 0 -6px 4px #07172d, inset 0 0 3px 0 #07172d;
    transition: all 0.2s ease;
    font-size: 25px;
    font-weight: 600;
    font-family: 'Gmarket Sans';
    text-shadow: 0 1px #0e2950;
    transition: all 300ms;
}

#minigame_betting form .btn_betting * {
    color:#cccccc;
}

#minigame_betting form .btn_betting:hover {
    box-shadow: 0 4px 3px 1px #07172d, 0 6px 8px #07172d, 0 -4px 4px #07172d, 0 -6px 4px #07172d, inset 0 0 3px 3px #07172d;
    transition: all 300ms;
}

#minigame_betting form .btn_betting:not(:focus):not(:active) {
    box-shadow: 0 4px 3px 1px #07172d, 0 6px 8px #07172d, 0 -4px 4px #07172d, 0 -6px 4px #07172d, inset 0 0 3px 3px #07172d;
    animation: minigame_betting_btn_active 0.9s alternate;
}

#minigame_betting form .btn_betting:active {
    background-image: linear-gradient(to top, #07172d 0%, rgb(12, 42, 83) 95%, rgb(5, 17, 34)100%);
    transition: all 300ms;
}

#minigame_betting form .btn_betting:active * {
    transform: scale(0.95);
    transition: all 300ms;
    color:#888888;
}

#minigame_betting form .btn_betting:hover:not(:active) * {
    text-shadow: 
        0px 0px 5px #ff362f,
        0px 0px 10px #ef7c00,
        0px 0px 20px #ff362f;
    transition: all 500ms;
}





/*---------------------------------------------------------
    MINIGAME_CONTENTS
---------------------------------------------------------*/
#minigame_contents {
    display: flex;
    position: absolute;
    left:0px;
    top:0px;
    right:0px;
    bottom:0px;
    flex-direction: column;
	padding-top:62px;
}

#minigame_contents .epxand {
    flex-grow: 1;
    /*background: #07172d;*/
    background: #0d1d32;
    margin-top:0px;
	height:100%;
	border-top:1px solid #000000;
}

#minigame_contents .titlebox {
    display: flex;
    height: 62px;
    background: url(/images/1bet1/sports/title_effect_overlay.png), #07172d;
    background-position: left;
    background-size: cover;
    position: relative;
    z-index: 10;
    margin-bottom:1px;
}

#minigame_contents .titlebox .label {
    display: block;
    flex-grow: 1;
    line-height: 62px;
    font-size: 16px;
    margin-left: 20px;
    font-weight: 600;
    color: #cccccc;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-shadow: 0 0 10px rgb(0 0 0 / 50%);
}

#minigame_contents .videobox {
    display: block;
    position: relative;
    background: #0d131d;
    margin-bottom:1px;
	min-height:100px;
}

#minigame_contents .videobox .empty_label {
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%, -50%);
}

#minigame_contents .gamepadbox {
    flex-shrink: 0;
    display: flex;
    justify-content: start;
    flex-direction: column;
}

#minigame_contents .gamepadbox .gridbox {
    display: grid;
    grid-template: repeat(1,1fr) / repeat(2, 1fr);
    grid-gap:1px;
}


#minigame_contents .gamepadbox .gridbox .gamegrp {
    grid-column: span 1;
    grid-row: span 1;
    width:100%;
    position: relative;
    padding:0px;
    height:224px;
    display: flex;
    justify-content: center;
    background:#0d1d32;
	border-top:1px solid #000000;
}

#minigame_contents .gamepadbox .gridbox .gamegrp.wide {
    grid-column: span 2;
    grid-row: span 1;
}

#minigame_contents .gamepadbox .gridbox .gamegrp.empty {
	border:0;
}


#minigame_contents .gamepadbox .gridbox .gamegrp  label {
    display: block;
    text-align: center;
    left:0;
    right:0;
    top:30px;
    font-size:16px;
    font-weight:400;
    font-family: 'Gmarket Sans';
    position: absolute;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem {
    display: block;
    position: relative;
    width: 170px;
    height: 200px;
    perspective:100px;
    margin-top:10px;
    cursor:pointer;
    transform: scale(1.3);
    z-index:10;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active {
    z-index:20;
}

@media screen and (max-width: 3000px) {
    #minigame_contents .gamepadbox .gridbox .gamegrp  label {
        font-size:14px;
        top:20px;
    }
    #minigame_contents .gamepadbox .gridbox .gamegrp {
        height:160px;
    }
    #minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem {
        transform: scale(1.1);
        width:152px;
        height:190px;
        perspective:90px;
        margin-top:-15px;
    }


    #minigame_contents .powerball_gamepadbox .gridbox .gamegrp {
        height:130px;
    }
    #minigame_contents .powerball_gamepadbox .gridbox .gamegrp .btn_betitem {
        transform: scale(0.8);
        width:152px;
        height:190px;
        perspective:90px;
        margin-top:-15px;
    }
}

@media screen and (max-width: 1800px) {
    #minigame_contents .gamepadbox .gridbox .gamegrp  label {
        font-size:12px;
        top:20px;
    }
    #minigame_contents .gamepadbox .gridbox .gamegrp {
        height:130px;
    }
    #minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem {
        transform: scale(0.8);
        width:110px;
        height:190px;
        perspective:90px;
        margin-top:-25px;
    }
}


#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .base_circle_1 {
    display: block;
    position: absolute;
    bottom:40px;
    left:50%;
    transform: translate(-50%) rotateX(60deg);
    border:1px solid #0a8abf;
    box-shadow: inset 0px 0px 20px #0284b7;
    height:108px;
    width:108px;
    border-radius: 100px;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_red .base_circle_1 {
    border:1px solid #bf0a0a;
    box-shadow: inset 0px 0px 20px #b70202;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_green .base_circle_1 {
    border:1px solid #1d9106;
    box-shadow: inset 0px 0px 20px #1d9106;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .base_circle_2 {
    display: block;
    position: absolute;
    bottom:46px;
    left:50%;
    transform: translate(-50%) rotateX(60deg);
    border:3px solid #d4e2ff;
    box-shadow:  0px 0px 5px #a7c3ff;
    height:100px;
    width:100px;
    border-radius: 100px;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .base_circle_2 {
    border:3px solid #d4e2ff;
    box-shadow:  
        0px 0px 5px #a7c3ff,
        0px 0px 10px #75a1ff,
        0px 0px 30px #0051ff,
        0px 0px 40px #75a1ff;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_red .base_circle_2 {
    border:3px solid #ffd4d4;
    box-shadow:  0px 0px 5px #ffa7a7;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active.btn_red .base_circle_2 {
    border:3px solid #ffd4d4;
    box-shadow:  
        0px 0px 5px #ffa7a7,
        0px 0px 10px #ff7575,
        0px 0px 30px #ff0000,
        0px 0px 40px #ff7575;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_green .base_circle_2 {
    border:3px solid #d4ffd7;
    box-shadow:  0px 0px 5px #aaffa7;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active.btn_green .base_circle_2 {
    border:3px solid #d4ffd7;
    box-shadow:  
        0px 0px 5px #aaffa7,
        0px 0px 10px #75ff81,
        0px 0px 30px #00ff0d,
        0px 0px 40px #75ff75;
    transition: all 100ms;
}


#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .push_circle_1 {
    display: block;
    position: absolute;
    bottom:50px;
    left:50%;
    transform: translate(-50%) rotateX(60deg);
    box-shadow: inset 0px 0px 30px #0ebbff;
    height:98px;
    width:92px;
    border-radius: 100px;
    background: 
    linear-gradient(
        90deg,
        rgba(255,255,255,.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255,255,255,.15) 50%,
        rgba(255,255,255,.15) 75%,
        transparent 75%,
        transparent),
    #1e1eb6;
    background-size: 0.3rem 0.3rem;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_red .push_circle_1 {
    background: 
    linear-gradient(
        90deg,
        rgba(255,255,255,.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255,255,255,.15) 50%,
        rgba(255,255,255,.15) 75%,
        transparent 75%,
        transparent),
    #6b0606;
    box-shadow: inset 0px 0px 30px #b70202;
    background-size: 0.3rem 0.3rem;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_green .push_circle_1 {
    background: 
    linear-gradient(
        90deg,
        rgba(255,255,255,.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255,255,255,.15) 50%,
        rgba(255,255,255,.15) 75%,
        transparent 75%,
        transparent),
    #196e07;
    box-shadow: inset 0px 0px 30px #1d9106;
    background-size: 0.3rem 0.3rem;
}


#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .push_circle_1 {
    height:92px;
    width:92px;
    background: 
    linear-gradient(
        90deg,
        rgba(255,255,255,.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255,255,255,.15) 50%,
        rgba(255,255,255,.15) 75%,
        transparent 75%,
        transparent),
    #1e1eb6;
    background-size: 0.3rem 0.3rem;
    transition: all 100ms;
}


#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .push_circle_2 {
    display: block;
    position: absolute;
    bottom:58px;
    left:50%;
    transform: translate(-50%) rotateX(60deg);
    height:90px;
    width:90px;
    border-radius: 100px;
    background:#0001a4;
    border:2px solid #4343ff;
    box-shadow: 0px 0px 5px #ffffff;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_red .push_circle_2 {
    background:#b70202;
    border:2px solid #b70202;
    background-size: 0.3rem 0.3rem;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_green .push_circle_2 {
    background:#1d9106;
    border:2px solid #1d9106;
    background-size: 0.3rem 0.3rem;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .push_circle_2 {
    bottom:50px;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .push_circle_3 {
    display: block;
    position: absolute;
    bottom:58px;
    left:50%;
    transform: translate(-50%) rotateX(60deg);
    box-shadow: inset 0px 0px 20px #0284b7;
    height:90px;
    width:90px;
    border-radius: 100px;
    background: 
    linear-gradient(
        90deg,
        rgba(255,255,255,.06) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255,255,255,.06) 50%,
        rgba(255,255,255,.06) 75%,
        transparent 75%,
        transparent);
    background-size: 0.5rem 0.5rem;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_red .push_circle_3 {
    box-shadow: inset 0px 0px 20px #b70202;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_green .push_circle_3 {
    box-shadow: inset 0px 0px 20px #1d9106;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .push_circle_3{
    bottom:50px;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .push_circle_4 {
    display: block;
    position: absolute;
    bottom:58px;
    left:50%;
    transform: translate(-50%) rotateX(60deg);
    box-shadow: inset 0px 0px 20px #0284b7;
    height:90px;
    width:90px;
    border-radius: 100px;
    background: 
    linear-gradient(
        0deg,
        rgba(255,255,255,.06) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255,255,255,.06) 50%,
        rgba(255,255,255,.06) 75%,
        transparent 75%,
        transparent)
    #0051ca88;
    background-size: 0.5rem 0.5rem;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_red .push_circle_4 {
    box-shadow: inset 0px 0px 20px #b70202;
    background: 
    linear-gradient(
        0deg,
        rgba(255,255,255,.06) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255,255,255,.06) 50%,
        rgba(255,255,255,.06) 75%,
        transparent 75%,
        transparent)
    #b7020288;
    background-size: 0.5rem 0.5rem;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.btn_green .push_circle_4 {
    box-shadow: inset 0px 0px 20px #1d9106;
    background: 
    linear-gradient(
        0deg,
        rgba(255,255,255,.06) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255,255,255,.06) 50%,
        rgba(255,255,255,.06) 75%,
        transparent 75%,
        transparent)
    #1d910688;
    background-size: 0.5rem 0.5rem;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .push_circle_4 {
    bottom:50px;
    box-shadow:
        inset 0px 0px 5px #ffffff,
        inset 0px 0px 10px #ffffff, 
        inset 0px 0px 30px #ffffff;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .name {
    position: absolute;
    left:50%;
    bottom:65px;
    color:#ffffffcc;
    font-size:45px;
    font-weight:900;
    white-space: nowrap;
    font-family: 'Gmarket Sans';
    transform: translate(-50%) rotateX(60deg);
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .name.sm {
    font-size:20px;
    bottom:85px;
    letter-spacing: -2px;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .name.md {
    font-size:30px;
    bottom:75px;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .name {
    bottom:55px;
    color:#ffffffff;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .name.sm {
    bottom:75px;
    color:#ffffffff;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .name.md {
    bottom:65px;
    color:#ffffffff;
    transition: all 100ms;
}


#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .odds {
    position: absolute;
    left:50%;
    bottom:68px;
    font-size:18px;
    font-family: 'Rajdhani';
    font-weight:600;
    color:#ffffffcc;
    transform: translate(-50%) rotateX(60deg);
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .odds {
    bottom:58px;
    color:#ffffffff;
    transition: all 100ms;
}


#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .option {
    position: absolute;
    left:50%;
    bottom:105px;
    font-size:16px;
    font-family: 'Rajdhani';
    font-weight:900;
    color:#ffffffcc;
    transform: translate(-50%) rotateX(0deg);
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .option {
    position: absolute;
    left:50%;
    bottom:103px;
    font-size:16px;
    font-family: 'Rajdhani';
    font-weight:900;
    color:#ffffffcc;
    transform: translate(-50%) rotateX(60deg);
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .option {
    bottom:93px;
    color:#ffffffff;
    transition: all 100ms;
}


#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .name_1 {
    position: absolute;
    left:50%;
    bottom:70px;
    color:#ffffff66;
    font-size:45px;
    font-weight:900;
    font-family: 'Gmarket Sans';
    filter: blur(4px);
    white-space: nowrap;
    transform: translate(-50%) rotateX(60deg) scale(1.2);
    transition: all 100ms;
    display: none;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .name_1.sm {
    font-size:20px;
    bottom:90px;
    letter-spacing: -2px;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .name_1.md {
    font-size:30px;
    bottom:80px;
    letter-spacing: -2px;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .name_1 {
    bottom:55px;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .name_1.sm {
    bottom:75px;
    transition: all 100ms;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .name_1.md {
    bottom:65px;
    letter-spacing: -2px;
}


#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .odds_1 {
    position: absolute;
    left:50%;
    bottom:65px;
    font-size:18px;
    font-family: 'Rajdhani';
    font-weight:600;
    color:#ffffff88;
    filter: blur(4px);
    transform: translate(-50%) rotateX(60deg) scale(1.2);
    transition: all 100ms;
    display: none;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .odds_1 {
    bottom:55px;
    color:#ffffff88;
    transition: all 100ms;
}


#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem .option_1 {
    position: absolute;
    left:50%;
    bottom:106px;
    font-size:18px;
    font-family: 'Rajdhani';
    font-weight:600;
    color:#ffffff88;
    filter: blur(4px);
    transform: translate(-50%) rotateX(60deg) scale(1.2);
    transition: all 100ms;
    display: none;
}

#minigame_contents .gamepadbox .gridbox .gamegrp .btn_betitem.active .option_1 {
    bottom:96px;
    color:#ffffff88;
    transition: all 100ms;
}