/*
How did this get here I am not good with computer
*/

body {
    /*background: url("../img/pinstripe.png");*/
    display: block;
    text-align: center;
    font-family: Verdana, Geneva, sans-serif;
}

#mainpanel {
    display: block;
    max-width: 790px;
    margin: 10px auto;
    padding: 10px 20px 20px 20px;
    text-align: center;
}

#titlediv {
    font-family: "Kite One", sans-serif;
    font-size: 36px;
    /*border-left: 5px solid #EEEEEE;
    border-right: 5px solid #EEEEEE;    */
}

#subtitlediv {
    margin-top: 5px;
    font-family: "Kite One", sans-serif;
    font-size: 12px;    
}

#sortdiv {
    display: block;
    width: 560px;
    height: 80px;
    margin: 15px auto 20px auto;
    font-size: 16px;
    /*border-left: 5px solid #CCCCCC;
    border-right: 5px solid #CCCCCC;*/
}

    .sortbox {
        width: 175px;
        height: 80px;
        float: left;
        line-height: 80px;
        margin-right: 10px;
        cursor: pointer;
        border-left: 5px solid;
    }  
    
#sorttwo {
    display: block;
    height: 30px;
    width: 210px;
    margin: 0 auto 20px auto;
    font-size: 14px;
}

    .twobox {
        width: 100px;
        height: 30px;
        float: left;
        cursor: pointer;
        margin-right: 10px;
        line-height: 30px;
    }

.textdiv {
    margin: 0 auto;
    font-size: 12px;
    margin-bottom: 10px;
}    

.showlink {
    text-decoration: underline;
    cursor: pointer;
}

.textshown {
    padding: 0 15px;
    border: 1px solid;
}

    .spacedul {
        padding-left: 20px;
    }

    .spacedul li {
        margin-bottom: 5px;
    }

#search {
    display: block;
    text-align: left;
    margin-top: 30px;
    margin-bottom: 5px;
}

#streams {
    display: block;
    text-align: left;
    /*border-left: 5px solid #EEEEEE;
    border-right: 5px solid #EEEEEE;*/ 
    padding: 10px;
}

    .numtext {
        font-size: 12px;
    }

    h2 {
        width: 100%;
        margin-top: 5px;
        border-bottom: 1px solid;
    }

    .h2header {
        clear: both;
        cursor: pointer;
    }
    
    .h2streams {
        font-size: 14px;
        font-weight: normal;
    }
    
.stream {
    position: relative;
    vertical-align: top;
    padding: 7px;
    margin-bottom: 15px;
    border-left: 5px solid;
}

    .streamoverlay {
        position: absolute; 
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;    
        z-index: 1;
        cursor: pointer;
        background-image: url("../img/empty.gif");
    }
    
    .apilogo {
        position: absolute;
        top: 0;
        right: 0;
        height: 32px;
        width: 32px;
        padding: 5px;
        z-index: 1;
    }
    
    .streamtools {
        position: absolute;
        display: none;
        top: 0;
        right: 42px;
        height: 32px;
        padding: 5px;
        z-index: 1;
    }
    
        .streamlink {
            display: block;
            width: 32px;
            height: 32px;
            float: left;
            margin: 0px 5px;
            cursor: pointer;
        }
    
    .str-logo {
        display: block;
        float: left;
        width: 60px;
        height: 60px;
    }
    
    .str-text {
        display: block;
        float: left;
        margin-left: 10px;
        height: 60px;
        width: 670px;
        overflow-y: hidden;
    }
    
    .logotall {
        padding: 8px 0 !important;
    }
    
    .tall {
        height: 76px !important;
    }
    
    .str-streamer {
        display: inline-block;
        font-weight: bold;
    }
    
    .str-viewers {
        display: inline-block;
    }
    
    .str-game {
        display: inline-block;
        font-weight: bold;
        line-height: 22px;
        width: 450px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .str-status {
        display: inline-block;
        font-size: 12px;
        line-height: 16px;
    }
       
.right {
    margin-right: 0px;
}

.colordiv {
    position: fixed;
    right: 0;
    top: 0;
}

    .colorbox {
        float: left;
        width: 25px;
        height: 25px;
        padding: 5px;   
        border: 1px solid;
        margin-right: 5px;
        margin-top: 5px;
        font-weight: bold;
        cursor: pointer;
    }
    
    .colorinner {
        width: 100%;
        height: 100%;
        line-height: 25px;
        text-align: center;
    }
    
    #css-light {
        color: black;
        background-color: #EEEEEE;
    }
    
    #css-dark {
        color: white;
        background-color: #333333;
    }
    
#p01 { background: url("../img/icon-video-black.png") no-repeat -9999px -9999px; }
#p02 { background: url("../img/icon-videochat-black.png") no-repeat -9999px -9999px; }
#p03 { background: url("../img/icon-chat-black.png") no-repeat -9999px -9999px; }
#p04 { background: url("../img/icon-closechat-black.png") no-repeat -9999px -9999px; }
#p05 { background: url("../img/icon-fullscreen-black.png") no-repeat -9999px -9999px; }
#p06 { background: url("../img/icon-popout-black.png") no-repeat -9999px -9999px; }
#p07 { background: url("../img/icon-globe-black.png") no-repeat -9999px -9999px; }
#p08 { background: url("../img/icon-video-white.png") no-repeat -9999px -9999px; }
#p09 { background: url("../img/icon-videochat-white.png") no-repeat -9999px -9999px; }
#p10 { background: url("../img/icon-chat-white.png") no-repeat -9999px -9999px; }
#p11 { background: url("../img/icon-closechat-white.png") no-repeat -9999px -9999px; }
#p12 { background: url("../img/icon-fullscreen-white.png") no-repeat -9999px -9999px; }
#p13 { background: url("../img/icon-popout-white.png") no-repeat -9999px -9999px; }
#p14 { background: url("../img/icon-globe-white.png") no-repeat -9999px -9999px; }
#p15 { background: url("../img/arrow-down-black.png") no-repeat -9999px -9999px; }
#p16 { background: url("../img/arrow-down-white.png") no-repeat -9999px -9999px; }
#p17 { background: url("../img/arrow-right-black.png") no-repeat -9999px -9999px; }
#p18 { background: url("../img/arrow-right-white.png") no-repeat -9999px -9999px; }
#p19 { background: url("../img/arrow-empty.png") no-repeat -9999px -9999px; }

.rightarrow, .downarrow {
    width: 16px;
    height: 16px;
}

checkbox {
    display: inline-block;
}