html, body{
    /*height: 100%;*/
}

body{
    height: 100%;

    /*background-color: #f7f7f9;*/
    /*background-color: #272B30;*/
    background: #5e5e5e;
    /*background: -moz-radial-gradient(center, ellipse cover, #5e5e5e 0%, #333333 100%);*/
    /*background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#5e5e5e), color-stop(100%,#333333));*/
    /*background: -webkit-radial-gradient(center, ellipse cover, #5e5e5e 0%,#333333 100%);*/
    /*background: -o-radial-gradient(center, ellipse cover, #5e5e5e 0%,#333333 100%);*/
    /*background: -ms-radial-gradient(center, ellipse cover, #5e5e5e 0%,#333333 100%);*/
    background: radial-gradient(ellipse at top, #5e5e5e 0%,#333333 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5e5e5e', endColorstr='#333333',GradientType=1 );
    background-attachment: fixed;
    background-repeat: no-repeat;
}

video{
    max-height: 470px;
}

html {
    min-height: 100%;
    position: relative;
}
body {
    margin-bottom: 100px;
}
.footer {
    background-color: #2e3338;
    bottom: 0;
    /*height: 60px;*/
    position: absolute;
    width: 100%;
    border-top:1px solid  rgba(0, 0, 0, 0.6);

    -webkit-box-shadow: 0 -8px 23px -10px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0 -8px 23px -10px rgba(0, 0, 0, 0.75);
    box-shadow: 0 -8px 23px -10px rgba(0, 0, 0, 0.75);
}
.footer .container{
    width: auto;
}
.container .text-muted {
    margin: 10px 0;
}


.padding-no{
    padding: 0;
}
.padding-no-left{
    padding-left: 15px;
}
.margin-no{
    margin: 0 -15px;
}
.margin-no-sides{
    margin-left: -15px;
    margin-right: -15px;
}

.margin-no-sides-sm{
}

.navbar {
    border-radius: 0;
    border-left: none;
    border-right: none;

    -webkit-box-shadow: 0 8px 23px -10px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0 8px 23px -10px rgba(0, 0, 0, 0.75);
    box-shadow: 0 8px 23px -10px rgba(0, 0, 0, 0.75);
}

.list-group, .panel{
    -webkit-box-shadow: 0 8px 23px -10px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0 8px 23px -10px rgba(0, 0, 0, 0.75);
    box-shadow: 0 8px 23px -10px rgba(0, 0, 0, 0.75);
}
.list-group-item:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.list-group-item:last-child {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.panel {
    border-radius: 0;
}

.caption{
    transition: all 0.5s;
    position: relative;
    z-index: 1;
    margin: -30px -15px;
    padding: 15px;
    padding-bottom: 1px;
}
.episode-bg{
    transition: all 0.5s;
    background-size:cover!important;
    opacity: 0.3;
    height:100%;
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
}
.episode-panel:hover .episode-bg{
    opacity: 1;
}
.episode-panel:hover .caption{
    background-color: rgba(15, 15, 15, 0.75);
    box-shadow: 0 -5px 6px 6px rgba(0, 0, 0, 0.7);
}
.episode-panel{
    position: relative;
    height: 175px;
    overflow: hidden;
}
.twitter-typeahead .tt-menu{
    width: 300%;
    left: auto !important;
    right: 0;
    text-align: right;
    padding: 10px;
    background: #505050;
    /*overflow: hidden;*/
    /*z-index: 20;*/
}
.twitter-typeahead .tt-menu a{
    white-space: normal;
}

.banner-bg{
    background: #ffffff;
    background: transparent linear-gradient(to right, #d6d6d6 0%, #ffffff 10%,#ffffff 90%, #d6d6d6 100%) repeat scroll 0% 0%;
}

.banner-bg .banner-text{
    color: #00000080;
    margin: 17px;
    display: inline-block;
}

.futurama-banner-bg{
    background: #0087c6;
    /*background: -moz-linear-gradient(left, #0087c6 0%, #29b8e5 50%, #0087c6 100%);*/
    /*background: -webkit-gradient(linear, left top, right top, color-stop(0%,#0087c6), color-stop(50%,#29b8e5), color-stop(100%,#0087c6));*/
    /*background: -webkit-linear-gradient(left, #0087c6 0%,#29b8e5 50%,#0087c6 100%);*/
    /*background: -o-linear-gradient(left, #0087c6 0%,#29b8e5 50%,#0087c6 100%);*/
    /*background: -ms-linear-gradient(left, #0087c6 0%,#29b8e5 50%,#0087c6 100%);*/
    background: transparent linear-gradient(to right, #2D7BA8 0%, rgb(63, 157, 211) 10%,rgb(63, 157, 211) 90%, #2D7BA8 100%) repeat scroll 0% 0%
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0087c6', endColorstr='#0087c6',GradientType=1 );*/
}
.the-simpsons-banner-bg{
    background: #ffe81d;
    background: transparent linear-gradient(to right, #ffcf09 0%, #ffe81f 10%,#ffe81f 90%, #ffcf09 100%) repeat scroll 0% 0%
}
.life-with-louie-banner-bg{
    background: #ffcc33;
    background: transparent linear-gradient(to right, #F29A0C 0%, #ffcc33 10%,#ffcc33 90%, #F29A0C 100%) repeat scroll 0% 0%
}
.the-angry-beavers-banner-bg{
    background: #ff9c46;
    background: transparent linear-gradient(to bottom, #ffdd4a 0%, #ff6141 100%) repeat scroll 0% 0%
}
.avatar-the-last-airbender-banner-bg{
    background: #ffffff;
    background: transparent linear-gradient(to right, #d6d6d6 0%, #ffffff 10%,#ffffff 90%, #d6d6d6 100%) repeat scroll 0% 0%
}

.avatar-the-legend-of-korra-banner-bg{
    background: #ffffff;
    background: transparent linear-gradient(to right, #d6d6d6 0%, #ffffff 10%,#ffffff 90%, #d6d6d6 100%) repeat scroll 0% 0%
}

.description{
    height: 32px;
    overflow: hidden;
    transition: height 200ms;
}

.show-full{
    height: auto;
}

.episode-panel .caption{
    display: flex;
    align-items: center;
}

.episode-panel .caption h4{
    flex: 1;
}
.episode-watched {
    background-color: #382020;
}

.episode-watched .watched-icon{
    display: inline-block !important;
}

.list-group-item.episode-watched {
    display: flex;
    align-items: center;
    background-color: #3e3232;
}
.list-group-item.episode-watched a {
    flex: 1;
}

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .padding-no-left{
        padding-left: 0;
    }
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

}

@media (max-width: 767px) {
    .margin-no-sides-sm{
        margin-left: -15px;
        margin-right: -15px;
        border-left: none;
        border-right: none;
        border-radius: 0;
    }

    .episode-bg{
        opacity: 0.2;
    }
    .episode-panel{
        height: auto;
    }
    .episode-panel .caption{
        padding-bottom: 15px;
    }

    .episode-panel .caption h4{
        font-size: 22px;
        padding: 15px;
    }

    .typeahead.dropdown-menu a{
        font-size: 20px;
        padding: 20px;
    }

}
@media (min-width: 768px) and (max-width: 991px) {

}
@media (min-width: 992px) and (max-width: 1199px) {

}
@media (min-width: 1200px) {

}