body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin:0;padding:0;} body { font-family: "Lantinghei SC","Open Sans",Arial,"Hiragino Sans GB","Microsoft YaHei","微软雅黑",STHeiti,"WenQuanYi Micro Hei",SimSun,sans-serif; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; font-smoothing: antialiased; font-smooth: always; font-size: 14px; line-height: 1.42857143; color: #333; background: #f5f7fa; } input, button, textarea, select, optgroup, option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; } input, img, select, button { vertical-align: middle; border: none; text-decoration: none; outline: none; } input[type="submit"] {cursor: pointer;} button {cursor: pointer;} button:active {cursor: pointer; opacity:0.8} input::-moz-focus-inner { border: 0; padding: 0;} .clearfix{zoom:1;} .clearfix:after{content:""; display:block; visibility:hidden; height:0; clear:both;} .fl{float:left;} .fr{float:right;} .box-sizing { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .table-box{ display: table; width: 100%; } .table-box .cell{ display: table-cell; } .section-form{ padding: 20px; padding-bottom: 5px; } .bet-box{ min-width: 800px; vertical-align: top; } .bet-box .list{ margin-bottom: 15px; } .bet-box .list .item{ width:15.83%; margin-left: 1%; position: relative; float: left; } .bet-box .list .item:first-child{ margin-left: 0; } .bet-box .list .item .absolute-box{ -moz-box-shadow:0px 0px 3px #ccc; -webkit-box-shadow:0px 0px 3px #ccc; box-shadow:0px 0px 3px #ccc; background: #fff; border-radius: 2px; padding: 10px; z-index: 1; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; overflow: hidden; } .bet-box .absolute-box button{ width: 50px; position: absolute; right: 10px; top: 10px; line-height: 30px; height: 30px; text-align: center; background: #006070; border-radius: 3px; color: #fff; font-weight: 500; } .bet-box .list .item .absolute-box.focus{ z-index: 99; -moz-box-shadow:0px 4px 15px rgba(0,0,0,0.36); -webkit-box-shadow:0px 4px 15px rgba(0,0,0,0.36); box-shadow:0px 4px 15px rgba(0,0,0,0.36); } .bet-box .number-box{ position: relative; padding-left: 34px; padding-right: 66px; padding-bottom: 18px; } .bet-box .number-box span{ width: 30px; height: 30px; line-height: 30px; text-align: center; background: #016875; font-size: 16px; border-radius: 100px; position: absolute; left: 0; color: #fff; font-weight: 500; } .bet-box .number-box input{ width: 100%; font-size: 15px; height: 20px; line-height: 20px; padding:4px 5px; border: 1px solid #d8dbdf; border-radius: 3px; color: #016b76; font-weight: 500; background: #f5f7fa; } .bet-box .number-box input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { font-weight: normal; } .bet-box .number-box input:-moz-placeholder, textarea:-moz-placeholder { font-weight: normal; } .bet-box .number-box input::-moz-placeholder, textarea::-moz-placeholder { font-weight: normal; } .bet-box .number-box input:-ms-input-placeholder, textarea:-ms-input-placeholder { font-weight: normal; } .bet-box .number-box button:active{ opacity: 0.8; } .bet-box .item-box{ position: relative; padding-left: 68px; margin-bottom: 8px; } .bet-box .item-box label{ position: absolute; width:62px; line-height: 26px; text-align: center; border-radius: 100px; color: #fff; font-weight: 500; left: 0; } .bet-box .item-box input[type=text]{ width: 100%; background: #f5f7fa; font-size: 14px; line-height: 26px; height: 26px; padding: 0 5px; font-weight: 500; color: #444; } .bet-box .item-box input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { font-weight: normal; color: #c5c5c5; } .bet-box .item-box input:-moz-placeholder, textarea:-moz-placeholder { font-weight: normal; color: #c5c5c5; } .bet-box .item-box input::-moz-placeholder, textarea::-moz-placeholder { font-weight: normal; color: #c5c5c5; } .bet-box .item-box input:-ms-input-placeholder, textarea:-ms-input-placeholder { font-weight: normal; color: #c5c5c5; } .bet-box .item-box label.bank{ background: #e12217; } .bet-box .item-box label.tie{ background: #27cf00; } .bet-box .item-box label.player{ background: #133ffd; } .bet-box .item-box label.banktie{ background: #e12217; } .bet-box .item-box label.playertie{ background: #0030ff; } .bet-box .currency { background: #006070; display: block; text-align: center; color: #fff; border-radius: 100px; line-height: 26px; cursor: pointer; position: relative; font-weight: 500; } .bet-box .currency:active{ opacity: 0.8; } .bet-box .currency input[type=checkbox] { position: absolute; width: 100%; height: 100%; opacity: 0; left: 0; top: 0; z-index: 2; cursor: pointer; } .footer-box{ width: 100%; background: #fff; -moz-box-shadow: 0px 0px 3px #ccc; -webkit-box-shadow: 0px 0px 3px #ccc; box-shadow: 0px 0px 3px #ccc; overflow: hidden; margin-top: 20px; } .footer-box .radio-box{ width: 800px; float: right; } .footer-box .radio-box .item{ width: 14%; height: 40px; display: inline-block; text-align: center; line-height: 40px; border-radius: 1000px; color: #fff; font-size: 16px; font-weight: 500; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; overflow: hidden; position: relative; background: #c5c5c5; vertical-align: middle; margin: 13px 0.5%; } .footer-box .radio-box .item input { -webkit-appearance: none; -moz-appearance: none; appearance: none; resize: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; } .footer-box .radio-box .submit{ height: 40px; width: 20%; font-size: 16px; font-weight: 500; background: #53a3a1; color: #fff; border-radius: 100px; display: inline-block; vertical-align: middle; margin-right: 1%; } .footer-box .radio-box .submit:active{ opacity: 0.8; } .header-box{ background: #fff; width: 100%; padding: 15px 0; margin-bottom: 20px; -moz-box-shadow: 0px 0px 3px #ccc; -webkit-box-shadow: 0px 0px 3px #ccc; box-shadow: 0px 0px 3px #ccc; } .header-box .item { padding-left: 30px; padding-right: 60px; float: left; } .header-box .item label{ height: 30px; line-height: 30px; font-size: 14px; display: inline-block; vertical-align: middle; } .header-box .item .select-box { width: 118px; border: 1px solid #DADADA; font-size: 13px; height: 30px; line-height: 30px; border-radius: 3px; background: none; display: inline-block; vertical-align: middle; -webkit-appearance: none; padding-left: 8px; } .header-box .item:last-child{ padding-right: 0; } .header-box .item.title{ line-height: 32px; font-size: 18px; color: #444; font-weight: 500; position: relative; height: 30px; overflow: hidden; } .header-box .item.title:after{ content: ""; position: absolute; border-right: 2px solid #ddd; left: 115px; height: 30px; top: 50%; margin-top: -15px; } /* 底部选择结果高亮样式 */ .footer-box .radio-box span.on { background: #27cf00; } /* 返回按钮样式 */ .item .item-back{ width:40px; text-align:center; border:1px solid #0ae; border-radius:5px; } .item .item-back:hover{ background:#0ae; color:#fff; } .back{ text-decoration:none; font-size:14px; color:#0ae; }