﻿header.header-sticky, header .header-sticky {
    position: relative;
    display: none;
}

footer {
    display: none;
}

.video-container {
    width: 100% !important;
    height: 100vh !important;
}

.video-js {
    width: 100% !important;
    height: 100vh !important;
    z-index: 99999 !important;
}

.livePage {
    height: 100%;
    display: block;
    position: absolute;
    /* float: right; */
    width: 100%;
}

.example-video-dimensions {
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    /*z-index: -1 !important;*/
    width: 100% !important;
    height: 100vh !important;
}

.verticle-slider .PreArrow {
    bottom: 25%;
}

.verticle-slider .NextArrow {
    bottom: 18%;
}
/*.example-video-dimensions {
        width: 100%;
        height: 100%;
    }*/
.vertical_s {
    position: relative;
    top: 0px;
    right: 0;
    bottom: 0;
    left: 70px;
    left: 0px;
    overflow: visible;
    height: 100vh;
    z-index: 99999;
    width: 400px;
    width: auto;
}

.main-content {
    /*width: 400px;*/
    /* height: 100vh;
        padding-top: 0px !important;*/
}

#top-ten-slider {
    position: absolute;
}

.notActive {
    display: none !important;
}

.verticle-slider {
    position: absolute;
    width: 12%;
    height: 100vh;
    top: 0px;
    padding: 0 !important;
    z-index: 999999;
}

    .verticle-slider .slider {
        height: 100%;
    }

    .verticle-slider .slider-flex {
        height: 100%;
    }

    .verticle-slider .slider-thumbs {
        height: 100vh;
        width: 100%;
    }

    .verticle-slider .vertical-slider-prev {
        top: 100px;
    }

    .verticle-slider .vertical-slider-next {
        bottom: 100px;
    }

.swiper-wrapper {
    align-items: center;
}

.verticle-slider .slider-thumbs .swiper-slide .block-images {
    border: 0px;
    background: none;
    background: rgba(255, 255, 255, 0.2);
    cursor: pointer;
}


/*.verticle-slider .slider-thumbs .swiper-slide .block-images img {
        background: rgba(255, 255, 255, 1);
    }*/

.verticle-slider .slider-thumbs .swiper-slide-active .block-images img {
    background: rgba(255, 255, 255, 1);
}

/*.livePage .slider-thumbs .swiper-slide-active {
        border: 0px solid #ff0000;
        border-right: 4px solid #fa183d;
        border-radius: 0;
    }*/
.verticle-slider .slider-thumbs .swiper-slide.swiper-slide-active .block-images {
    border: 0px solid #ff0000;
    border-right: 4px solid #fa183d;
    border-radius: 0;
}

.verticle-slider .slider .swiper-container .swiper-wrapper .swiper-slide {
    height: 100px;
}

#sidebar-close {
    background-color: transparent;
    border-radius: 0;
    display: block;
    height: 3em;
    left: 1em;
    position: absolute;
    text-decoration: none;
    top: 1em;
    width: 3em;
    z-index: 999999;
    padding: 2px;
    font-size: 42px;
    color: #fff;
}

.continue-watching-block {
    position: absolute;
    bottom: 15%;
    z-index: 99999;
    width: 100%;
    text-align: right;
}

    /*.continue-watching-block .swiper-wrapper {
        display: flex;
        justify-content: center;
    }*/

    .continue-watching-block .swiper-wrapper {
        align-items: start;
    }

.swiper-pagination-bullet-active {
    background: #ff0000;
}
@media(max-width: 767px) {
    .example-video-dimensions {
        position: relative !important;
        height: initial !important;
    }

    .video-js .vjs-tech{
        position: relative;
    }

   /* .verticle-slider {
        display: none;
    }*/

    .livePage {
        position: relative;
    }

    .verticle-slider {
        position: relative;
        width: 80%;
        margin: auto;
        height: auto;
        top: 0px;
        padding: 0 !important;
    }

        .verticle-slider .slider .swiper-container .swiper-wrapper {
            align-items: start;
        }

        .verticle-slider .slider .swiper-container .swiper-wrapper .swiper-slide{
            height: auto;
        }

        .verticle-slider .vertical-slider-prev {
            position: absolute;
            top: 40%;
            left: -30px;
            text-align: left;
            right: auto;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .verticle-slider .slider-thumbs{
            height: auto;
        }

        .verticle-slider .vertical-slider-next {
            position: absolute;
            bottom: 40%;
            right: -30px;
            text-align: left;
            left: auto;
            display: flex;
            align-items: center;
            justify-content: center;
        }

    #sidebar-close {
        background-color: transparent;
        border-radius: 0;
        display: block;
        height: auto;
        left: 1em;
        position: relative;
        text-decoration: none;
        top: 0;
        width: 100%;
        z-index: 9999;
        padding: 2px;
        font-size: 42px;
        color: #fff;
        text-align: left;
    }

    .notActive {
        display: block !important;
    }
    .verticle-slider .vertical-slider-prev i:before {
        content: "\e908";
    }

    .verticle-slider .vertical-slider-next i:before {
        content: "\e90d";
    }

    .video-js {
        height: auto !important;
        z-index: 999999 !important;
    }

    .vjs-default-skin .vjs-big-play-button {
        font-size: 3em;
        line-height: 45px;
        height: 45px !important;
        width: 45px;
        border: 1px solid #fff;
        border-radius: 0.3em;
        left: 0.5em;
        top: 0;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
    }

    .vjs-button > .vjs-icon-placeholder:before {
        font-size: 1.8em;
        line-height: 1.67;
        position: relative;
    }

    .vjs-visible-nextEps:before {
        font-size: 1.8em;
        line-height: 1.67;
    }

    .vjs-visible-fullScreenCustom:before {
        font-size: 1.8em;
        line-height: 1.67;
    }

    .video-js .vjs-control {
        width: 3em;
    }
    .continue-watching-block {
        position: relative;
        bottom: 0%;
    }
    
}