* { margin:0; padding:0; }
body { background:#111; height:100%; }
img { border:none; }

#supersized-loader { position:absolute; top:50%; left:50%; z-index:0; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:url(../img/progress.gif) no-repeat center center;}

#supersized {  display:block; position:fixed; width:100%; height:100%; overflow:hidden; z-index:-999; }
#supersized img { width:auto; height:auto; position:relative; display:none; outline: 12px solid #EEE; border:none; margin: 80px 34px 68px 34px; box-shadow: 0px 5px 15px 15px rgba(0, 0, 0, 0.35); }
#supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }	/*Speed*/
#supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }			/*Quality*/

#supersized li { display:block; list-style:none; z-index:-30; position:fixed; overflow:hidden; top:0px; right:0px; bottom:0px; left:0px; background:#111; }
#supersized a { width:100%; height:100%; display:block; }
#supersized li.prevslide { z-index:-20; }
#supersized li.activeslide { z-index:-10; }
#supersized li.image-loading { background:#111 url(../img/progress.gif) no-repeat center center; width:100%; height:100%; }
#supersized li.image-loading img{ visibility:hidden; }
#supersized li.prevslide img, #supersized li.activeslide img{ display:inline; }

#nav_icon {
    display: block;
    top: 0px;
    position: relative;
}

.menu_button {
    display: block;
    cursor: pointer;
    float: right;
    padding: 1px 5px 1px 8px;
}

.bar1, .bar2, .bar3 {
    width: 35px;
    height: 5px;
    background-color: #fff;
    margin: 6px 0;
    transition: 0.4s;
}

.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px);
    transform: rotate(-45deg) translate(-9px, 6px);
}

.change .bar2 {
    opacity: 0;
}

.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px);
    transform: rotate(45deg) translate(-8px, -8px);
}

#genre_list {
    display: none;
    position: absolute;
    right: 0;
    top: 41px;
    width: 200px;
    height: 283px;
    background: #222;
    color: #999;
    font: 15px "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-shadow:#000 0 -1px 0;
    padding: 15px;
    line-height: 34px;
    z-index: 999999999;
    overflow: auto;
    border: 1px solid #333;
}

#genre_list div:not(:first-child) {
    border-top: 1px solid #333;
}

#genre_list div {
    padding-left: 15px;
    cursor: pointer;
}

#genre_list a {
    text-decoration: none;
    color: #999;
    display: block;
}

#progress-back, #progress-bar {
    display: none !important;
}

#slide-list {
    display: none !important;
}

#tag {
    padding-left: 10px;
}

@media all and (max-width: 800px) {
    #slideinfo, #linkinfo {
        width: 75% !important;
    }
    #slidecaption {
        line-height: 30px !important;
        background: rgba(0, 0, 0, 0.25);
        position: fixed;
        bottom: 45px;
        width: 100%;
        text-align: center;
        margin: 0 !important;
        padding: 0 !important;
    }
    #genre_list {
        font-size: 18px;
        line-height: 44px;
        width: 200px;
        height: 234px;
    }
    #heading img {
        height: 46px !important;
    }
    #supersized img {
        margin: 80px 24px 68px 24px !important;
        outline: 9px solid #FFF !important;
        box-shadow: 0px 4px 10px 10px rgba(0, 0, 0, 0.35) !important;
    }
}