.ar_game_wrap {
margin-top:20px;
	width:calc(100% - 2px);
    position: relative;
    /* z-index: 300; */
    background: #badafe url(img/roulette_bg2.png);
    border: 1px solid #b9bec7;
}

.ar_game {
	width:100%;
	max-width:800px;
	min-width:392px;
    min-height: 500px;
	margin:0 auto;
}

.ar_game .sn {
	padding-top:5px;
	color:#777;
	font-size: 11px;
}

.ar_game:after {display:block;visibility:hidden;clear:both;content:""}


.ar_game .left {
	position:relative;
	float:left;
	min-width:392px;

}

.ar_game .right {
    position: absolute;
    top: 0px;
    right: 0;
	text-align:center;
}

.ar_game .right #lady_wait {
	border-radius:50%;
	border:1px solid #4C83E7;	
	background-image: url(img/wait_02.png);
	background-size: 90% 90%;
	margin:20px auto;
	width: 200px;
	height: 200px;
	background-position: center;
	background-position-y: 20px;
    background-repeat: no-repeat;
    cursor: pointer;
	-webkit-box-shadow: 0px 0px 2px 3px rgba(0,0,0,0.29);
	-moz-box-shadow: 0px 0px 2px 3px rgba(0,0,0,0.29);
	box-shadow: 0px 0px 2px 3px rgba(0,0,0,0.29);
}

.ar_game .right #lady_wait.lazy_1 {background-image: url(img/wait_02.png) !important;}
.ar_game .right #lady_wait.lazy_2 {background-image: url(img/wait_01.png) !important;}
.ar_game .right #lady_wait.lazy_3 {background-image: url(img/wait_03.png) !important;}
.ar_game .right #lady_wait.lazy_4 {background-image: url(img/wait_04.png) !important;}
.ar_game .right #lady_wait.lazy_5 {background-image: url(img/wait_051.png) !important;}
.ar_game .right #lady_wait.lazy_6 {background-image: url(img/wait_06.png) !important;}
.ar_game .right #lady_wait.lazy_7 {background-image: url(img/wait_07.png) !important;}
.ar_game .right #lady_wait.lazy_9 {
	background-image: url(img/wait_09.png) !important;
	background-size: 100% 100%;
	margin:20px auto;
	width: 220px;
	height: 220px;
	margin-bottom:-10px;
}

.ar_game .right #lady_wait.lazy_10 {
	background-image: url(img/wait_10.png) !important;
	background-size: 100% 100%;
	margin:20px auto;
	width: 250px;
	height: 250px;
}
.ar_game .right #lady_wait.lazy_11 {background-image: url(img/lady_01.png) !important;}
.ar_game .right #lady_wait.lazy_12 {background-image: url(img/lady_02.png) !important;}
.ar_game .right #lady_wait.lazy_13 {background-image: url(img/lady_03.png) !important;}
.ar_game .right #lady_wait.lazy_14 {background-image: url(img/lady_04.png) !important;}
.ar_game .right #lady_wait.lazy_15 {background-image: url(img/lady_05.png) !important;}
.ar_game .right #lady_wait.lazy_16 {background-image: url(img/lady_06.png) !important;}
.ar_game .right #lady_wait.lazy_17 {background-image: url(img/lady_07.png) !important;}
.ar_game .right #lady_wait.lazy_18 {background-image: url(img/lady_11.png) !important;}
.ar_game .right #lady_wait.lazy_19 {background-image: url(img/lady_12.png) !important;}
.ar_game .right #lady_wait.lazy_20 {background-image: url(img/lady_13.png) !important;}
.ar_game .right #lady_wait.lazy_21 {background-image: url(img/lady_14.png) !important;}
.ar_game .right #lady_wait.lazy_22 {background-image: url(img/lady_15.png) !important;}
.ar_game .right #lady_wait.lazy_23 {background-image: url(img/lady_16.png) !important;}
.ar_game .right #lady_wait.lazy_24 {background-image: url(img/lady_21.png) !important;}
.ar_game .right #lady_wait.lazy_25 {background-image: url(img/lady_22.png) !important;}
.ar_game .right #lady_wait.lazy_26 {background-image: url(img/lady_23.png) !important;}
.ar_game .right #lady_wait.lazy_27 {background-image: url(img/lady_24.png) !important;}
.ar_game .right #lady_wait.lazy_28 {background-image: url(img/lady_25.png) !important;}
.ar_game .right #lady_wait.lazy_29 {background-image: url(img/lady_26.png) !important;}
.ar_game .right #lady_wait.lazy_30 {background-image: url(img/lady_31.png) !important;}
.ar_game .right #lady_wait.lazy_31 {background-image: url(img/lady_32.png) !important;}
.ar_game .right #lady_wait.lazy_32 {background-image: url(img/lady_33.png) !important;}
.ar_game .right #lady_wait.lazy_33 {background-image: url(img/lady_34.png) !important;}
.ar_game .right #lady_wait.lazy_34 {background-image: url(img/lady_35.png) !important;}
.ar_game .right #lady_wait.lazy_35 {background-image: url(img/lady_36.png) !important;}
.ar_game .right #lady_wait.lazy_36 {background-image: url(img/lady_37.png) !important;}

.auto-selcect {
	margin:10px 0 10px 0;
	font-size:1.5em;
}

.power_btn {
	margin-bottom:10px;
}
.btn10 {
	display: inline-block;
    background: #fff;
    border: 1px solid #ccc;
    color: #707070;
    text-decoration: none;
    vertical-align: middle;
	width:40px;
	padding:5px 0 5px 0;
	font-size:1.1em;
}
.btn10:hover {
    color: #FFF;
    background: #ff3746;
    border: 1px solid #ff3746;
	font-weight:bold;
}

.btn10.on {
    color: #FFF;
    background: #ff3746;
    border: 1px solid #ff3746;
	font-weight:bold;
}


.right #sound {
    display: inline-block;
	width:27px;
	height:27px;
	vertical-align: middle;
	margin-left:2px;
	background-size: 100% 100%;
}

.right #sound.sound1 {background-image: url(img/sound1.png);}
.right #sound.sound2 {background-image: url(img/sound2.png);}
.right #sound.sound3 {background-image: url(img/sound3.png);}


.the_wheel
{
    background-image: url(img/wheel_back.png);
    background-position:1px 20px;
    background-repeat: no-repeat;
	background-size: 100% auto;
	padding:0;
}


.the_pin {
    z-index: 999;
    position: absolute;
    background: url(img/roulette_pin.png) no-repeat;
	background-size: 100%;
}




#canvas {
}

.gift_box {
	position:relative;
	max-width:180px;
	margin:0 auto;
	text-align:center;
	text-align: center;
	padding:0;
}


.gift_box li {
	float:left;width:calc(100% / 2 - 10px);
	position:relative;
	margin:0;
	padding:0 5px 0 5px;
	list-style:none
}
.gift_box li img {width:100%;height:auto;}

.gift_box li div {
    position: absolute;
    bottom: 0;
    background: #666;
    background: rgba(80, 80, 80, 0.65);
    width: 60%;
	margin:0 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	padding:0;
}



.gift_box:after {display:block;visibility:hidden;clear:both;content:""}




#center_image {
	position:absolute;
	background-image: url(img/center_button1_off.png);
	background-size: cover;
    cursor: pointer;
	background-size: 100%;
}

#center_image:hover {
	background-image: url(img/center_button1_on.png);
}


.box_bg {
	position:absolute;
    margin: auto;
    display: block;
	margin-top:20px;
    max-width: 500px;
	z-index:500;
	background-size: 100% auto;
}


.game_status {
	color:#333;
	font-size:12px;
	padding:0 0 5px 0;
}



/* The Modal (background) */
#myModal {
	position:absolute;
    width: 100%;
    height: 100%;
	display: none;
    z-index: 1000; /* Sit on top */
    left: 0;
    top: 0;
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.5); /* Black w/ opacity */
}

#myModal .box_bg_img {
	position:absolute;
    width: 100%;
    height: 100%; /* Full height */
	background-image: url(img/game_point.png);
	background-size: 100%;
    background-repeat: no-repeat;
	border-radius:10px;
	z-index:1000;

}



/* Add Animation */
@-webkit-keyframes zoom {
    from {-webkit-transform:scale(0)} 
    to {-webkit-transform:scale(1);}
}

@keyframes zoom {
    from {transform:scale(0)} 
    to {transform:scale(1);}
}

/* The Close Button */
.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 1.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

#modal-content {
	position:relative;
    margin: auto;
    display: block;
    margin-top: 100px; /* Location of the box */
    width: 80%;
    max-width: 500px;
    height: 340px; /* Full height */
	border-radius:10px;
	z-index:1000;
	background-image: url(img/background.jpg);
}

#modal-content .lady_img {
	position:absolute;
	top:90px;
	left:60px;
	background-image: url(img/wait_03.png);
	background-position: 0px 10px;
	background-size: 180px 180px;
    background-repeat: no-repeat;
	border-radius:10px;
	text-align:right;
    width: 290px;
    height: 200px;
	z-index:900;
	font-size:15px;
	text-shadow: 2px 2px 4px #777;
	padding:0 0 0 20px;
}



#modal-content .score {
	position:absolute;
	top:140px;
	left:180px;
	z-index:900;
	font-size:45px;
	width:250px;
	color:#FF3746;
	text-align:center;
	text-shadow: 2px 2px 4px #777;
	z-index:910;
    -webkit-animation-name: zoom_in;
    -webkit-animation-duration: 0.5s;
    animation-name: zoom_in;
    animation-duration: 0.5s;
}

#modal-content .score span {
	font-size:30px;
	color:blue;
	padding-right:10px;
}


/* Add Animation */
@-webkit-keyframes zoom_in {
    from {-webkit-transform:scale(3)} 
    to {
		-webkit-transform:scale(1);
	}
}

@keyframes zoom_in {
    from {transform:scale(3)} 
    to {
		transform:scale(1);
	}
}



#myModal .giftbox_img {
	position:absolute;
	top:190px;
	left:320px;
	background-image: url(img/giftbox_1.png);
	background-size: cover;
	border-radius:10px;
    width: 120px;
    height: 120px;
	z-index:800;
    -webkit-animation-name: zoom_in;
    -webkit-animation-duration: 0.5s;
    animation-name: zoom_in;
    animation-duration: 0.5s;
}


#modal-content .lady_img strong{display: block;font-size: 10px;text-align: center;/* padding-left: 86px; */width: 208px;margin-left: 83px;}

