/*
Copyright (C) 2017 Enproduktion GmbH

This file is part of 3gears.

3gears is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/


.vjs-default-skin .vjs-timebar-RS {
    color: red;
    top: -1em;
    height: 100%;
    position: relative;
    background: rgba(100, 100, 100, .5)
}

.vjs-default-skin .vjs-rangeslider-holder {
    height: 100%
}

.vjs-default-skin .vjs-selectionbar-RS {
    height: 100%;
    float: left;
    width: 100%;
    left: 0;
    right: 0;
    position: absolute;
    background-color: #ffe800;
    background: #ffe800;
    background: -webkit-gradient(linear, 0% 0, 0% 100%, from(#ffe800), to(#a69700));
    background: -webkit-linear-gradient(top, #ffe800, #a69700);
    background: linear-gradient(top, #ffe800, #a69700);
    opacity: .8
}

.vjs-default-skin div.vjs-rangeslider-holder.locked>div.vjs-selectionbar-RS {
    background-color: #ff6565;
    background: #ff6565;
    background: -webkit-gradient(linear, 0% 0, 0% 100%, from(#ff6565), to(#300000));
    background: -webkit-linear-gradient(top, #ff6565, #300000);
    background: linear-gradient(top, #ff6565, #300000)
}

.vjs-default-skin div.vjs-rangeslider-handle {
    position: absolute;
    margin-top: 0;
    cursor: pointer!important;
    background-color: transparent
}

.vjs-default-skin .vjs-selectionbar-left-RS {
    height: 100%;
    left: 0;
    z-index: 10
}

.vjs-default-skin .vjs-selectionbar-right-RS {
    height: 100%;
    left: 100%;
    z-index: 20
}

.vjs-default-skin div.vjs-selectionbar-left-RS,
.vjs-default-skin div.vjs-selectionbar-right-RS {
    top: 0;
    position: absolute;
    width: 0
}

.vjs-default-skin div.vjs-selectionbar-arrow-RS {
    width: 0;
    height: 0;
    border-left: 1em solid transparent;
    border-right: 1em solid transparent;
    border-top: 1em solid #fff273;
    margin-left: -1em;
    opacity: .8;
    position: absolute;
    top: -1em
}

.vjs-default-skin div.vjs-rangeslider-handle.active>div.vjs-selectionbar-arrow-RS {
    border-top-color: #5f5fb3
}

.vjs-default-skin div.vjs-rangeslider-holder.locked .vjs-rangeslider-handle>div.vjs-selectionbar-arrow-RS {
    border-top-color: #ff6565
}

.vjs-default-skin div.vjs-selectionbar-line-RS {
    width: 1px;
    height: 1em;
    background-color: #fff273;
    position: absolute;
    top: 0
}

.vjs-default-skin div.vjs-rangeslider-handle.active>div.vjs-selectionbar-line-RS {
    background-color: #5f5fb3
}

.vjs-default-skin div.vjs-rangeslider-holder.locked .vjs-rangeslider-handle>div.vjs-selectionbar-line-RS {
    background-color: #ff6565
}

.vjs-default-skin .vjs-timepanel-RS {
    width: 100%;
    height: 1em;
    font-weight: bold;
    font-size: 15px;
    top: -2em;
    position: absolute;
    visibility: visible;
    opacity: 1;
    -webkit-transition-delay: 0s;
            transition-delay: 0s
}

.vjs-default-skin .vjs-timepanel-RS.disable {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: visibility 1s linear 1s, opacity 1s linear;
    transition: visibility 1s linear 1s, opacity 1s linear
}

.vjs-default-skin .vjs-timepanel-left-RS,
.vjs-default-skin .vjs-timepanel-right-RS {
    font-weight: normal;
    font-size: 1em;
    color: #666;
    border: 1px solid #666;
    background-color: white;
    border-radius: 5px;
    position: absolute;
    height: 116%;
    padding-right: .3em;
    padding-left: .3em
}

.vjs-default-skin .vjs-timepanel-left-RS {
    left: .5%
}

.vjs-default-skin .vjs-timepanel-right-RS {
    left: 92%
}

.vjs-default-skin .vjs-controltimepanel-RS {
    width: 18em;
    font-size: 1em;
    line-height: 3em
}

.vjs-default-skin .vjs-controltimepanel-RS input {
    width: 1.5em;
    background: rgba(102, 168, 204, 0.16);
    border: 1px solid transparent;
    color: black;
    font-size: 1em;
    margin-left: 2px;
    text-align: center;
    color: white
}

.vjs-default-skin .vjs-controltimepanel-left-RS {
    width: 50%;
    float: left
}

.vjs-default-skin .vjs-controltimepanel-right-RS {
    float: right;
    width: 48%
}

.vjs-default-skin .vjs-controltimepanel-RS input {
    margin: 0;
    padding: 0;
    display: table-cell
}

.vjs-default-skin *,
.vjs-default-skin *:before,
.vjs-default-skin *:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}