@charset "utf-8";
.Panel.Lottery { position: absolute; top: 17%; height: 72%; opacity: 0; width: 96%; left: 50%; margin-left: -48%; display: none }
.lottery-left { width: 60%; height: 100%; position: relative; float: left; margin-right: 2%; background-color: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.4) }
.lottery-right { width: 36%; height: 98%; position: relative; float: left; background-color: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.4); padding: 3px; overflow: auto }
.lottery-title { width: 100%; height: 60px; position: relative; color: #fff; font-size: 35px; line-height: 60px; font-family: Arial, Helvetica, sans-serif; border-bottom: 1px solid rgba(255, 255, 255, 0.4); background: url(../images/lot-title.png) 10px center no-repeat }
.lottery-title .title-label { margin-left: 50px }
.lottery-title .usercount-label { position: absolute; right: 10px; text-align: right }
.lottery-bottom { position: absolute; bottom: 0; width: 100%; height: 60px; border-top: 1px solid rgba(255, 255, 255, 0.4) }
.lottery-bottom .round-num { font-size: 15px; font-family: Arial, Helvetica, sans-serif; color: #fff; margin-left: 10px; line-height: 60px }
.select-panel div { display: inline-block; text-align: center }
.select-button { width: 28px; height: 28px; border: 1px solid #fff; line-height: 28px; font-size: 22px; cursor: pointer }
.select-value { width: 40px; height: 28px }
.lottery-bottom .button-happy { position: absolute; right: 10px; height: 40px; top: 50%; margin-top: -20px; line-height: 40px; padding-left: 40px; width: 80px; font-size: 20px; color: #fff; border: 1px solid #fff; background: url(../images/lot-happy.png) 15px center no-repeat; cursor: pointer; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px }
.lottery-bottom .button-showresult { position: absolute; right: 10px; height: 40px; top: 50%; margin-top: -20px; line-height: 40px; width: 80px; font-size: 20px; padding: 0 10px; color: #fff; border: 1px solid #fff; cursor: pointer; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px }
.lottery-bottom .button-reload { position: absolute; right: 10px; height: 40px; top: 50%; margin-top: -20px; line-height: 40px; width: 80px; font-size: 20px; padding: 0 10px; color: #fff; border: 1px solid #fff; cursor: pointer; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px }
.lottery-run { position: absolute; top: 42%; left: 50%; -webkit-transform:translate(50%,-50%) ;
   -moz-transform:translate(50%,-50%) ;
    -ms-transform:translate(50%,-50%) ;
     -o-transform:translate(50%,-50%) ;
        transform:translate(50%,-50%) ;}
.user { background: url(../images/lot_nouser.jpg) center center no-repeat; background-size: contain }
.user .nick-name { display: none }
.lottery-run .user {width:100%;height: 100%; background: url(../images/lot_nouser.jpg) center center no-repeat; background-size: contain; overflow: visible; border: 1px solid #fff; border-radius: 50%; box-shadow: 3px 5px 3px rgba(0, 0, 0, 0.11);position: relative; }
.lottery-run .user .nick-name {position: absolute;left: 0; height: 30px; line-height: 20px; bottom: -34px; font-size: 18px; color: #fff; text-align: center; display: block; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);width: 100%; }
.result-line { position: relative; width: 100%; height: 70px; margin: 3px auto; background: rgba(255, 255, 255, 0.15); overflow: hidden; display: none }
.result-line:first-child { margin-top: 0 }
.result-line:last-child { margin-bottom: 0 }
.delLottery { width: 22px; height: 30px; cursor: pointer; background: url(../images/lotteryDel.png) no-repeat left center; display: block; position: absolute; top: 20px; right: 5px; z-index: 2; display: none; }
#newLuckButton { position: absolute; left: 50%; margin-left: -60px; height: 8%; bottom: 10px; width: 100px; height: 18px; text-align: center; padding: 8px 10px 12px 10px; background-color: #fff; border-radius: 8px; font-weight: bolder; cursor: pointer; color: #E74145; box-shadow: 0 2px 0px 3px rgba(0, 0, 0, 0.15), 0 -3px 0px 0px #D0D0D0 inset; }
.lottery-bottom select { width: 100px; height: 40px; }
.result-line .result-num, .result-line .user, .result-line .user .nick-name { display: inline-block }
.result-line .result-num { width: 30px; height: 30px; color: #E62841; position: relative; top: 20px; text-align: center; margin-left: 10px; font-size: 16px; line-height: 30px; background-color: #FFF; border-radius: 100%; }
.result-line .user { position: absolute; display: inline-block; width: 60px; height: 60px; background: url(../images/lot_nouser.jpg) center center no-repeat; background-size: contain; top: 5px; left: 50px; border-radius: 100%; }
.result-line .user .nick-name { position: absolute; height: 60px; width: 500%; top: 0; left: 70px; overflow: visible; font-size: 20px; line-height: 60px; text-align: left; display: block; color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45); }
.lottery-run .control { display: none; position: absolute; left: 50%; margin-left: -60px; bottom: 10px; width: 100px; height: 18px; text-align: center; padding: 8px 10px 12px 10px; background-color: #fff; border-radius: 8px; font-weight: bolder; cursor: pointer; color: #E74145; box-shadow: 0 2px 0px 3px rgba(0, 0, 0, 0.15), 0 -3px 0px 0px #D0D0D0 inset; }
.lottery-run .control:active { padding: 10px 10px 10px 10px; box-shadow: 0 2px 0px 3px rgba(0, 0, 0, 0.15), 0 0 5px rgba(0, 0, 0, 0.52) inset; }
.lottery-award{position: absolute;left: 50%;top: 42%;text-align:center;-webkit-transform:translate(-150%,-50%) ;
   -moz-transform:translate(-150%,-50%) ;
    -ms-transform:translate(-150%,-50%) ;
     -o-transform:translate(-150%,-50%) ;
        transform:translate(-150%,-50%) ;color: #fff;font-size: 18px;}
.lottery-award img{display: block;width: 100%;height: 100%;border-radius: 50%}
.lottery-award p{margin: 0;padding: 0}