@font-face { font-family: "iconfont"; src: url("../fonts/iconfont.eot"); src: url("../fonts/iconfont.eot?#iefix") format("embedded-opentype"),  url("../fonts/iconfont.woff2") format("woff2"),  url("../fonts/iconfont.woff") format("woff"),  url("../fonts/iconfont.ttf") format("truetype"),  url("../fonts/iconfont.svg#iconfont") format("svg"); }
* { padding: 0; margin: 0; box-sizing: border-box; list-style: none; }
a { text-decoration: none; }
.video_box { font-family: "iconfont"; box-sizing: content-box; position: relative; width: 100%; height: 728px; border: 15px solid #3a3b4c; background: none; border-radius: 10px; box-sizing: border-box; -moz-box-sizing: border-box; }
.video_box .video_img{ width: 100%; height: 658px;}


.video_box video { cursor: pointer; width: 100%; }
.video { cursor: pointer; width: 100%;}

/* 全屏后隐藏控件 */
video::-webkit-media-controls {
 display: none !important;
}
.controls { position: absolute; bottom: 0; width: 100%; height: 40px; background-color: rgba(58, 59, 76, .8); line-height: 40px; padding-left: 5px; }
.controls a { color: white; }
.switch { display: block; float: left; width: 30px; height: 30px; margin-right: 10px; font-size: 20px; }
.play { display: block; width: 100px; height: 100px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; font-size: 100px; color: #3a3b4c; }
.controls .enlarge { float: right; font-size: 40px; opacity: 0.5; }
.enlarge:hover { opacity: 1; }
.time { float: left; position: relative; width: 60%; height: 40px; }
.progress { float: left; width: calc(100% - 100px); height: 6px; margin-top: 17px; margin-right: 10px; border-radius: 3px; background-color: #333333; cursor: pointer; }
.playprogress { width: 0; height: 100%; background: #00a1d6; border-radius: 3px; cursor: pointer; }
.slider { display: none; float: right; width: 12px; height: 12px; margin-top: -3px; margin-right: -6px; border-radius: 50%; border: 3px solid #fff; background-color: #00a1d6; }
.timedisplay { float: left; width: 90px; font-size: 14px; color: white; }
.volume { float: left; width: 150px; }
.volume a { font-size: 25px; }
.volume input { width: 100px; margin-left: 5px; margin-top: -10px; height: 5px; vertical-align: middle; }
.speed { position: relative; float: left; cursor: pointer; color: #fff; width: 60px; height: 40px; font-weight: 600; font-size: 14px; text-align: center; line-height: 40px; }
.speed ul { display: none; position: absolute; top: -150px; }
.speed ul li { width: 60px; height: 25px; background-color: rgba(58, 59, 76, .8); line-height: 25px; }
.speed ul li:hover { background: rgba(43, 43, 43, .8); color: aquamarine; }
