﻿.flowplayer{
    max-height: 70vh!important;
}

@media (max-width: 850px) {
    #mainContent {
        padding-top: 50px;
    }

    .socialMediaList {
        float: none;
        direction: ltr;
    }

        .socialMediaList li {
            position: relative;
            text-align: center;
            display: inline-block;
            float: none;
            margin: 8px;
        }

    .seriesInfo {
        text-align: center;
    }

        .seriesInfo .seriesTitle {
            text-align: center;
        }
}

.channelsLogoBlock {
    text-align: right;
    line-height: 0;
}

.channelLogoDiv {
    position: relative;
    height: 45px;
    width: 20%;
    border-left: 2px solid #dedede;
    overflow: hidden;
    border-radius: 0px !important;
    background: transparent;
    box-shadow: 0px 0px 0px;
    border: 0px !important;
}

.channelLogoDiv{
    /*cursor: pointer;*/
}

    .channelLogoDiv a {
        max-width: 90%;
        height: 100%;
        right: 0%;
        width: 100%;
    }

        .channelLogoDiv a img {
            position: relative;
            display: block;
            float: right;
            top: 5px;
            height: calc(100% - 8px);
        }

    .channelLogoDiv.active.filled:before {
        /* box-shadow: 0px 2px 4px; */
        border-right: 2px solid rgba(51, 51, 51, 0.4);
    }


    .channelLogoDiv.active a {
        padding-top: 0px;
    }

    .channelLogoDiv:after,
    .channelLogoDiv:before {
        position: absolute;
        content: '';
        width: calc(100% - 0px);
        left: 0px;
        z-index: -1;
    }

    .channelLogoDiv:before {
        height: 100%;
        top: 0px;
        border: 0px solid #dedede;
        border-width: 0px 0px 0px 0px;
        transform: skew(-45deg);
        transform-origin: right bottom;
    }

    .channelLogoDiv:after {
        height: calc(0% - 4px);
        bottom: 0px;
        border: 2px solid #dedede;
        border-width: 0px 2px 2px 0px;
        height: calc(0% - 0px);
        bottom: 0px;
        border: 0px solid #dedede;
        border-width: 0px 0px 0px 0px;
    }

.filled:before, .filled:after {
    background-color: #dedede;
    background: rgb(0,0,0);
    background: -moz-linear-gradient(135deg, rgba(210,210,210,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(135deg, rgba(210,210,210,1) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(135deg, rgba(210,210,210,1) 0%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#ffffff",GradientType=1);
}

.video-container {
    background: rgb(0,0,0);
    background: -moz-linear-gradient(135deg, rgba(210,210,210,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(135deg, rgba(210,210,210,1) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(135deg, rgba(210,210,210,1) 0%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#ffffff",GradientType=1);
    padding: 5px;
}

.main-footer {
    margin-top: 0%;
    margin-bottom: 0%;
    /*background-color: rgba(180,180,180,0.6);*/
}

    .main-footer .navbar-bottom {
        margin-bottom: 0px;
        margin-top: 1%;
        background-color: rgba(158, 158, 158, 0.74);
        padding-top: 1%;
        padding-bottom: 1%;
    }

.socialMediaList {
    display: inline-block;
    text-align: center;
    float: none;
    margin-bottom: 1%;
}

.main-footer #footer {
    text-align: center;
    background: transparent;
}

.main-footer .sub-footer {
    background: transparent;
}

