body{padding: 0;margin: 0;}
.video_top{width: 100%;height: 300px;background-color: #fff;position: relative;}
.video_top .view_box{position: absolute;bottom: 60px;left: 20px;width: 90%;}
.video_top .view_box h1{color: #fff;padding: 0;margin-top: 15px; font-size: 20px;text-shadow: 0 3px 6px rgba(0,0,0,0.1);}
.video_top .view_box .time{color: #fff; width: 80%;position: relative;font-size: 10px;bottom: -50px;}
.video_top .text14{background: url(../../images/black_bg.png) repeat bottom center;color: #fff;font-size: 14px;padding:3px 10px;border-radius: 20px;}
.video_top .zhanghao{color: #fff; width: 80%; position: relative;font-size: 12px;bottom: 0px;}
.video_top .zhanghao img{height: 45px; width: 45px;border-radius: 60px;position: absolute;}
.video_top .zhanghao span{left: 50px;position: absolute; margin-top: 7px;}
.video_top .eyes_num{float: right;position: absolute;right: 0px;bottom: -30px;color: #fff;background:url(../../images/eyes.png) no-repeat left center;background-size: 24px;padding-left: 25px;}
.video_content_box{background-color: #fff;border-radius: 20px;padding: 15px 5px;margin-top: -20px;color: #253746;font-size: 14px;position: relative;z-index: 999}

.video_bottom{width: 100%;height: 190px;position: absolute;bottom: 0;}
.video_bottom .view_box{position: absolute;bottom: 75px;left: 20px;width: 90%;}
.video_bottom .view_box h1{color: #fff;padding: 0;margin-top: 15px;font-weight: normal;font-size: 20px;}
.video_bottom .text14{color: #fff;font-size: 14px;padding:3px 10px;border-radius: 15px;background-color: #616161}
.video_bottom .zhanghao{color: #fff;width: 80%;position: relative;font-size: 16px;bottom: 0px;}
.video_bottom .zhanghao img{height: 40px;width: 40px;border-radius: 60px;position: absolute;}
.video_bottom .zhanghao span{left: 45px;position: absolute;top: 9px;}
.video_bottom .eyes_num{float: right;position: absolute;right: 0px;bottom: -30px;color: #fff;background:url(../../images/eyes.png) no-repeat left center;background-size: 24px;padding-left: 25px;}

.video_box{background-color: #000;}
.video_position{margin-top: 50%}


@media only screen and (max-width: 360px)  {
    .video_top{height: 230px !important;}
}

@media screen and (min-width: 361px) and (max-width: 375px) {
    .video_top{height: 270px !important;}
}


@media screen and (min-width: 376px) {
    .video_top{height: 290px !important;}
}


@media screen and (min-width: 736px) {
    .video_top{height: 300px !important;}
}
@media screen and (min-width: 812px) {
    .video_top{height: 300px !important;}
}
