.theoplayer-container {
    width: 100% !important;
    height: 100% !important;
}

/* hidden */
.theo-menu-header,
.theo-big-play-button-svg-container,
.theo-settings-control-menu .theo-menu-animation-container > div:nth-child(1) .theo-menu-item:nth-child(2),
.theo-button-tooltip,
.theo-cast-button,
.vjs-time-tooltip,
.vjs-duration,
.vjs-time-divider,
.theo-live-control,
.vjs-remaining-time,
.player-no-subtitles .theo-text-track-control-button {
    display: none !important;
}

.theo-primary-color {
    color: #fff !important;
}

.theo-secondary-color.vjs-control-bar {
    height: 3.5em !important;
    background-color: #dbdbdb !important;
    background: rgba(219,219,219,1) !important;
    border-top: 1px solid rgba(170,168,168,0.5) !important;
    border-bottom: 3px solid #ececec !important;
}

    .theo-tertiary-color.theo-control-bar-shadow {
        background: none !important;
    }


.vjs-big-play-button {
    color: rgb(51,51,51) !important;
    border-radius: 8px !important;
    background-color: rgb(219, 219, 219) !important;
    height: 64px !important;
    width: 85px !important;
    padding-bottom: 0 !important;
}
    .vjs-big-play-button::after {
        font-size: 50px;
        opacity: 1 !important;
        content: "\25BA" !important; /*"\f101"*/
        border-radius: 5px !important;
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
    }

.theoplayer-skin .theo-menu,
.theoplayer-skin .theo-menu,
.theoplayer-skin .theo-menu {
    color: #dbdbdb;
}

.theoplayer-skin .theo-menu .theo-menu-item.vjs-selected,
.theoplayer-skin .theo-menu .theo-menu-item.vjs-selected:focus,
.theoplayer-skin .theo-menu .theo-menu-item.vjs-selected:hover {
    color: #fff;
    background-color: rgba(255,255,255,0.2);
}

.vjs-play-progress::before {
    color: rgb(51, 51, 51) !important;
    transform: translate(50%, -50%) scale(1) !important;
}

.vjs-slider {
    background-color: #828282 !important;
}

.vjs-play-progress {
    background-color: rgb(190, 227, 237) !important;
}
.vjs-progress-control {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
}

.theoplayer-skin .vjs-progress-control .vjs-progress-holder {
    height: 10px !important;
}

.vjs-button {
    color: rgb(51, 51, 51) !important;
    text-shadow: 0px 0px 0px rgba(0, 0, 0, 0) !important;
    box-shadow: 0px 0px 1px 1px rgba(25, 25, 25, 0.40) !important;
    margin-top: .5em !important;
    border-radius: 3px !important;
    border: 1px solid #ffffff !important;
    width: 25px !important;
    height: 27px !important;
    line-height: 2.5em !important;
    background: #dbdbdb !important;
    background: rgb(191,191,191) !important;
    background: -moz-linear-gradient(top, rgba(191,191,191,1) 0%, rgba(255,255,255,1) 64%) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(191,191,191,1)), color-stop(64%,rgba(255,255,255,1))) !important;
    background: -webkit-linear-gradient(top, rgba(191,191,191,1) 0%,rgba(255,255,255,1) 64%) !important;
    background: -o-linear-gradient(top, rgba(191,191,191,1) 0%,rgba(255,255,255,1) 64%) !important;
    background: -ms-linear-gradient(top, rgba(191,191,191,1) 0%,rgba(255,255,255,1) 64%) !important;
    background: linear-gradient(to bottom, rgba(191,191,191,1) 0%,rgba(255,255,255,1) 64%) !important;
}

    .vjs-button:hover {
        background: rgb(162,213,225) !important;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) !important;
        background: -moz-linear-gradient(top, rgba(162,213,225,1) 0%, rgba(125,185,232,1) 100%) !important;
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(162,213,225,1)), color-stop(100%,rgba(125,185,232,1))) !important;
        background: -webkit-linear-gradient(top, rgba(162,213,225,1) 0%,rgba(125,185,232,1) 100%) !important;
        background: -o-linear-gradient(top, rgba(162,213,225,1) 0%,rgba(125,185,232,1) 100%) !important;
        background: -ms-linear-gradient(top, rgba(162,213,225,1) 0%,rgba(125,185,232,1) 100%) !important;
        background: linear-gradient(to bottom, rgba(162,213,225,1) 0%,rgba(125,185,232,1) 100%) !important;
    }

    .vjs-button::before {
        font-size: 15px;
    }
.vjs-volume-control.vjs-control {
    width: 5em !important;
    margin-right: 1em !important;
    opacity: 1 !important;
}

.vjs-volume-bar {
    opacity: 1 !important;
    height: 8px !important;
    border: 1px solid #666666 !important;
    background-color: rgb(136, 136, 136) !important;
}

.vjs-volume-level {
    color: #bee3ed !important;
    height: 6px !important;
}

.vjs-volume-level::before{
    content:none !important;
}

.vjs-control:before {
    top: -5px !important;
}

.vjs-current-time {
    display: block !important;
    color: #000;
    position: absolute !important;
}

.vjs-fullscreen-control {
    background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), -moz-linear-gradient(top, rgba(191,191,191,1) 0%, rgba(255,255,255,1) 64%) !important;
    background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(191,191,191,1)), color-stop(64%,rgba(255,255,255,1))) !important;
    background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), -webkit-linear-gradient(top, rgba(191,191,191,1) 0%,rgba(255,255,255,1) 64%) !important;
    background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), -o-linear-gradient(top, rgba(191,191,191,1) 0%,rgba(255,255,255,1) 64%) !important;
    background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), -ms-linear-gradient(top, rgba(191,191,191,1) 0%,rgba(255,255,255,1) 64%) !important;
    background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), linear-gradient(to bottom, rgba(191,191,191,1) 0%,rgba(255,255,255,1) 64%) !important;
    background-position: 50% 50%, 0 0 !important;
    background-repeat: no-repeat, repeat !important;
}

    .vjs-fullscreen-control:hover {
        background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), -moz-linear-gradient(top, rgba(162,213,225,1) 0%, rgba(125,185,232,1) 100%) !important;
        background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(162,213,225,1)), color-stop(100%,rgba(125,185,232,1))) !important;
        background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), -webkit-linear-gradient(top, rgba(162,213,225,1) 0%,rgba(125,185,232,1) 100%) !important;
        background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), -o-linear-gradient(top, rgba(162,213,225,1) 0%,rgba(125,185,232,1) 100%) !important;
        background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), -ms-linear-gradient(top, rgba(162,213,225,1) 0%,rgba(125,185,232,1) 100%) !important;
        background-image: url("../../../Content/img/theoplayer/ukp-fullscreen.gif"), linear-gradient(to bottom, rgba(162,213,225,1) 0%,rgba(125,185,232,1) 100%) !important;
    }

.vjs-fullscreen-control::before {
    content: none !important;
}

.theoplayer-skin.vjs-fullscreen {
    font-size: 12px;
}

.vjs-control.vjs-skip {
    color: rgb(51, 51, 51) !important;
    text-shadow: 0px 0px 0px rgba(0, 0, 0, 0) !important;
    box-shadow: 0px 0px 1px 1px rgba(25, 25, 25, 0.40) !important;
    margin-top: .5em !important;
    border-radius: 3px !important;
    border: 1px solid #ffffff !important;
    width: 25px !important;
    height: 27px !important;
    line-height: 2.5em !important;
}

.vjs-skip {
    /*margin: .5em 3px 0 .5em !important;*/
    cursor: pointer;
    background-repeat: no-repeat, repeat !important;
    position: absolute !important ;
}

    .vjs-skip[skip-value="-300"] {
        background-image: url("../../../Content/icons/5m Back.svg"), linear-gradient(rgba(191, 191, 191, 1) 0%, rgba(255, 255, 255, 1)64%);
    }

        .vjs-skip[skip-value="-300"]:hover {
            background-image: url("../../../Content/icons/5m Back.svg"), linear-gradient(rgba(162, 213, 225, 1) 0%, rgba(125, 185, 232, 1)100%);
        }

    .vjs-skip[skip-value="-60"] {
        background-image: url("../../../Content/icons/1m Back.svg"), linear-gradient(rgba(191, 191, 191, 1) 0%, rgba(255, 255, 255, 1)64%);
    }

        .vjs-skip[skip-value="-60"]:hover {
            background-image: url("../../../Content/icons/1m Back.svg"), linear-gradient(rgba(162, 213, 225, 1) 0%, rgba(125, 185, 232, 1)100%);
        }

    .vjs-skip[skip-value="-10"] {
        background-image: url("../../../Content/icons/10s Back.svg"), linear-gradient(rgba(191, 191, 191, 1) 0%, rgba(255, 255, 255, 1)64%);
    }

        .vjs-skip[skip-value="-10"]:hover {
            background-image: url("../../../Content/icons/10s Back.svg"), linear-gradient(rgba(162, 213, 225, 1) 0%, rgba(125, 185, 232, 1)100%);
        }

    .vjs-skip[skip-value="10"] {
        background-image: url("../../../Content/icons/10s Forward.svg"), linear-gradient(rgba(191, 191, 191, 1) 0%, rgba(255, 255, 255, 1)64%);
    }

        .vjs-skip[skip-value="10"]:hover {
            background-image: url("../../../Content/icons/10s Forward.svg"), linear-gradient(rgba(162, 213, 225, 1) 0%, rgba(125, 185, 232, 1)100%);
        }

    .vjs-skip[skip-value="60"] {
        background-image: url("../../../Content/icons/1m Forward.svg"), linear-gradient(rgba(191, 191, 191, 1) 0%, rgba(255, 255, 255, 1)64%);
    }

        .vjs-skip[skip-value="60"]:hover {
            background-image: url("../../../Content/icons/1m Forward.svg"), linear-gradient(rgba(162, 213, 225, 1) 0%, rgba(125, 185, 232, 1)100%);
        }

    .vjs-skip[skip-value="300"] {
        background-image: url("../../../Content/icons/5m Forward.svg"), linear-gradient(rgba(191, 191, 191, 1) 0%, rgba(255, 255, 255, 1)64%);
    }

        .vjs-skip[skip-value="300"]:hover {
            background-image: url("../../../Content/icons/5m Forward.svg"), linear-gradient(rgba(162, 213, 225, 1) 0%, rgba(125, 185, 232, 1)100%);
        }

.theo-text-track-control-button::before {
    font-size: 12px !important;
    font-family: Arial, Helvetica, sans-serif;
    content: "cc" !important;
    text-transform: lowercase;
    margin-top: 7px;
}

.theo-settings-control-button {
    width: 50px !important
}

    .theo-settings-control-button::before {
        font-size: 12px !important;
        font-family: Arial, Helvetica, sans-serif;
        content: "quality"!important;
        text-transform: lowercase;
        margin-top: 7px;
    }

    .vjs-volume-label {
        position: absolute;
        color: #000;
        top: 14px;
    }

/***********************************
     positions

 ***********************************/
.vjs-button,
.vjs-volume-control {
    position: absolute !important;
}

.vjs-current-time {
    left: 6px;
}

.vjs-skip[skip-value="-300"] {
    left: 92px;
}

.vjs-skip[skip-value="-60"] {
    left: 123px;
}

.vjs-skip[skip-value="-10"] {
    left: 153px;
}

.vjs-play-control {
    left: 184px;
}

.vjs-skip[skip-value="10"] {
    left: 215px;
}

.vjs-skip[skip-value="60"] {
    left: 246px;
}

.vjs-skip[skip-value="300"] {
    left: 277px;
}

.theo-text-track-control-button {
    right: 201px;
}

.vjs-mute-control {
    right: 170px;
}

.vjs-volume-control {
    right: 98px;
}

.vjs-volume-label {
    right: 97px;
}

.theo-settings-control-button {
    right: 37px;
}

.vjs-fullscreen-control {
    right: 6px;
}



@media (max-width: 550px) {

    .vjs-skip[skip-value="300"],
    .vjs-skip[skip-value="-300"]
    {
        display: none !important;
    }

    .vjs-current-time {
        width: 60px !important;
    }

    /* positions*/
    .vjs-skip[skip-value="-60"] {
        left: 78px;
    }

    .vjs-skip[skip-value="-10"] {
        left: 108px;
    }

    .vjs-play-control {
        left: 139px;
    }

    .vjs-skip[skip-value="10"] {
        left: 170px;
    }

    .vjs-skip[skip-value="60"] {
        left: 201px;
    }
}


@media (max-width: 460px) {

    .vjs-skip[skip-value="300"],
    .vjs-skip[skip-value="-300"],
    .vjs-skip[skip-value="60"],
    .vjs-skip[skip-value="-60"],
    .vjs-volume-label {
        display: none !important;
    }

    /* positions */
    .vjs-skip[skip-value="-10"] {
        left: 78px;
    }

    .vjs-play-control {
        left: 108px;
    }

    .vjs-skip[skip-value="10"] {
        left: 139px;
    }

    .theo-text-track-control-button {
        right: 178px;
    }

    .vjs-mute-control {
        right: 147px;
    }

    .vjs-volume-control {
        right: 75px;
    }
}

@media (max-width: 380px) {
    .vjs-volume-control,
    .vjs-skip[skip-value="10"],
    .vjs-skip[skip-value="-10"] {
        display: none !important;
    }

    /* positions */
    .vjs-play-control {
        left: 78px;
    }

    .theo-text-track-control-button {
        right: 126px;
    }

    .vjs-mute-control {
        right: 95px;
    }
}

@media (max-width: 260px) {

    .vjs-volume-control,
    .vjs-mute-control,
    .theo-text-track-control-button,
    .theo-settings-control-button {
        display: none !important;
    }
}