﻿.startSteps {
    padding: 0;
    margin-bottom: 0px;
    display: table-row;
    display: none;
}

    .startSteps .stepframe, .startSteps .centerframe {
        float: left;
    }

    .startSteps .centerframe {
        width: calc(100% - 282px);
        background-image: url(../img/3step-bg2.png);
        background-repeat: repeat-x;
    }

    .startSteps .content {
        display: table-cell;
        width: 100%;
        height: 133px;
        vertical-align: middle;
        line-height: 0;
    }

        .startSteps .content .steps {
            text-align: justify;
            margin: 0 0 0 25px;
        }

        .startSteps .content img {
            display: inline-block;
            margin: auto;
            max-width: 30%;
            text-align: justify;
            -ms-text-justify: distribute-all-lines;
            text-justify: distribute-all-lines;
        }

        .startSteps .content .steps:after {
            content: "";
            width: 100%;
            display: inline-block;
        }

.carousel {
    background-color: #000;
    margin: 0;
    max-height: 200px;
    height: 200px;
    border: solid 4px #131313;
    border-radius: 10px;
    padding: 0;
}

    .carousel .carousel-inner {
    }

    .carousel .carousel-control.left {
    }

    .carousel .carousel-control.right {
    }

    .carousel .carousel-indicators {
        bottom: 0px;
        z-index: 11;
        margin-bottom: 3px;
    }

    .carousel .carousel-inner .item {
        max-height: 194px;
        overflow: hidden;
        background-color: #131313;
        margin-top: 5px;
    }

        .carousel .carousel-inner .item img {
            width: auto;
            height: 194px;
            margin: auto;
            max-height: 194px;
            border-radius: 5px;
        }

    .carousel .carousel-inner .carousel-caption {
        bottom: 0px;
        left: 0;
        width: 100%;
        background-color: rgba(0,0,0,0.3);
        z-index: 10;
        text-align: left;
        padding-left: 10px;
    }

        .carousel .carousel-inner .carousel-caption h3 {
            margin-bottom: 4px;
        }

.homepadding {
    margin-bottom: 12px;
    padding-right: 8px !important;
}

.upcoming {
    font-size: 11px;
    font-weight: bold;
}

    .upcoming h4 {
        font-size: 16px;
        font-weight: bold;
    }

@media only screen and (max-width: 400px) {
    .carousel {
        height: 203px;
        max-height: 210px;
    }

        .carousel .carousel-inner .item {
            margin-top: 0;
        }
}

.desktop-header-controls {
    padding-right: 5px !important;
    padding-left: 10px;
}

.desktop-twitter {
    background-color: #000;
    border-radius: 10px;
    padding: 0;
    text-align: center;
    color: #fff;
    height: 344px;
    display: none;
}

    .desktop-twitter .twitter-control {
        border-radius: 10px;
    }

    .desktop-twitter .header {
        background: rgb(149,149,149); /* Old browsers */
        background: -moz-linear-gradient(top, rgba(149,149,149,1) 0%, rgba(13,13,13,1) 14%, rgba(1,1,1,1) 24%, rgba(10,10,10,1) 37%, rgba(78,78,78,1) 76%, rgba(56,56,56,1) 87%, rgba(27,27,27,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(149,149,149,1) 0%,rgba(13,13,13,1) 14%,rgba(1,1,1,1) 24%,rgba(10,10,10,1) 37%,rgba(78,78,78,1) 76%,rgba(56,56,56,1) 87%,rgba(27,27,27,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(149,149,149,1) 0%,rgba(13,13,13,1) 14%,rgba(1,1,1,1) 24%,rgba(10,10,10,1) 37%,rgba(78,78,78,1) 76%,rgba(56,56,56,1) 87%,rgba(27,27,27,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#959595', endColorstr='#1b1b1b',GradientType=0 ); /* IE6-9 */
    }

    .desktop-twitter h3 {
        background-image: url(/assets/img/header-text-frame.png);
        background-position: center top;
        background-repeat: no-repeat;
        background-size: contain;
        height: 41px;
        margin-top: 0;
        margin-bottom: 0;
        padding: 5px;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        font-size: 21px;
    }

    .desktop-twitter .inset {
        background: #292929 none repeat scroll 0 0;
        border-radius: 5px;
        color: #fff;
        height: 100%;
        line-height: 20px;
        margin: 5px;
        padding: 5px;
        font-weight: bold;
    }


    .desktop-twitter .twitter-control {
        margin: 5px 5px 0 5px;
        background-color: #fff;
    }

#dv_SocialBox, #dv_SocialBox2 {
    height: 46px;
    position: relative;
    text-align: center;
    top: 10px;
}

#dv_SocialBox2 {
    height: 26px;
    position: relative;
    width: 260px;
    top: 6px;
    left: 48px;
}

#likebox-frame, #likebox-nofacebook {
    border: 2px solid #292929;
    width: 280px;
    z-index: 10;
    height: 240px;
    overflow: hidden;
    position: relative;
    top: -2px;
    left: 0px;
    display: none;
}

    #likebox-nofacebook div {
        margin: 20px auto 0;
        width: 250px;
        text-align: center;
    }

    #likebox-frame iframe {
        left: -8px;
        overflow: hidden;
        position: relative;
        top: -62px;
    }


.sliderPaidAudience {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 800;
    height: 54px !important;
    width: 54px !important;
    opacity: 1;
}

h3 {
    font-size: 14px;
}

.showItems {
    margin-left: 8px;
}

    .showItems .col-md-4 {
        padding: 0;
    }

.showItem {
    position: relative;
    background-color: #111212;
    border-radius: 10px;
    color: #FFFFFF;
    margin: 2px 12px 5px 0;
    min-height: 218px;
    padding: 4px !important;
}

    .showItem .fill {
        height: 170px;
        width: 100%;
        max-height: 160px;
        max-width: 296px;
    }

    .showItem .paidIcon {
        height: 30px;
        position: relative;
        float: right;
        left: -4px;
        top: -2px;
        opacity: 1;
    }

    .showItem h2 {
        max-width: 290px;
        margin: 6px 0 4px 4px;
        font-size: 14px;
        font-weight: bold;
    }

        .showItem h2 a {
            color: #fff;
            text-decoration: none;
        }

            .showItem h2 a:hover {
                color: #ffc02b;
                text-decoration: underline;
            }

@media only screen and (max-width: 400px) {
    .showItem {
        height: 220px;
        max-height: unset;
    }

        .showItem .fill {
            height: 190px;
            width: 100%;
            max-height: 160px;
            max-width: unset;
        }
}

@media (min-width:800px) {
    .startSteps {
        display: block;
        width: calc(100% - 10px);
        margin: 8px;
    }

    .desktop-twitter {
        display: block;
    }

    .carousel {
        max-height: 344px;
        height: 344px;
    }

        .carousel .carousel-inner .item {
            max-height: 300px;
/*            max-width: 615px;*/
            height: 300px;
        }

            .carousel .carousel-inner .item .slide-image {
                min-height: 300px;
                min-width: 615px;
                height: 300px;
            }



    h3 {
        font-size: 24px;
    }
}
