/*视频去白边*/
video:focus {
    outline: -webkit-focus-ring-color auto 0;
}

/*标题栏*/
.vjs-title-bar {
    font-size: 1.2rem;
    background: none;
    border-top-left-radius: 0.375rem;
    border-top-right-radius: 0.375rem;
}

/*控制栏样式*/
.video-js .vjs-control-bar {
    background: rgba(0, 0, 0, .9);
    background: linear-gradient(360deg, rgba(0, 0, 0, .9) 0, rgba(0, 0, 0, .7) 60%, rgba(0, 0, 0, 0) 100%);;
    height: 5rem;
    padding: 0 2rem 2rem 2rem;
    /*bottom: 30px;*/
    flex-wrap: wrap;
    justify-content: space-between;
    /*border-radius: 15px;*/
    border-bottom-left-radius: 0.375rem;
    border-bottom-right-radius: 0.375rem;
}

/*进度条位置*/
.video-js .vjs-progress-control {
    width: 100%;
    order: -1 !important;
    height: 30px;
}

/*进度条高度*/
.video-js .vjs-progress-holder {
    height: .8em;
}

/*进度条底板和缓冲样式*/
.video-js .vjs-progress-holder,
.video-js .vjs-load-progress,
.video-js .vjs-load-progress div {
    border-radius: 12px;
    background-color: hsla(0, 0%, 100%, .2);
}

/*播放进度条样式*/
.video-js .vjs-play-progress {
    border-radius: 12px;
    background-color: #e13100;
}

/*播放进度条拖动按钮样式*/
.video-js .vjs-play-progress:before {
    font-size: 1.3em;
    top: 2px;
}

/*控制按钮左右分开*/
.video-js .vjs-custom-control-spacer {
    display: inline-block;
    flex: 1 1;
}

/*控件按钮大小*/
.vjs-button > .vjs-icon-placeholder:before {
    font-size: 2.8em;
}

/*控件按钮悬浮*/
.video-js button:hover {
    color: #ff501a;
}

/*音量进度条*/
.video-js .vjs-volume-level {
    background-color: #ff501a;
}

/*时间栏位置*/
.video-js .vjs-time-control {
    line-height: 4.7em;
}

/*音量滑动条上下的位置*/
.video-js .vjs-volume-bar {
    margin: 2.25em 0.45em;
}

@media screen and (max-width: 599.98px) {
    /*控制栏样式*/
    .video-js .vjs-control-bar {
        padding: 0 1rem 1rem 1rem;
        /*bottom: 0;*/
        height: 4rem;
    }

    /*进度条样式*/
    .video-js .vjs-progress-control {
        height: 14px;
    }
}