
* {
    margin: 0;
    padding: 0;
}

body { 
    background-color: #111;
    font-family:  arial, sans-serif;
}

img { 
    border: 0;
}

/* these two settings will remove borders from playlist entries */
a:active {  outline:none; }
:focus   { -moz-outline-style:none; }


/* container has a background image */
#player {	
    display:block;
    width:542px;
    height:329px;
    margin: 0 auto;
}


/*{{{ general playlist settings, light gray */
div.playlist {
    position:relative;
    overflow:hidden;	 	
    height:288px !important;
}

div.playlist div.clips {	
    position:absolute;
    height:20000em;
}

div.playlist, div.clips {
    width:260px;	
}

div.clips a {
    background:url(/images/powderplex/h80.png);
    display:block;
    background-color:#fefeff;
    padding: 8px 15px 16px 15px;
    height:46px;
    width:195px;
    font-size:12px;
    border:1px outset #ccc;		
    text-decoration:none;
    color:#000;
}

div.clips a.first {
    border-top-width:1px;
}

div.clips a.playing, div.clips a.paused, div.clips a.progress {
    background:url(/images/powderplex/light.png) no-repeat 0px -69px;
    width:225px;
    border:0;
}

div.clips a.progress {
    opacity:0.6;		
}

div.clips a.paused {
    background-position:0 0;	
}

div.clips a span {
    display:block;		
    font-size:11px;
    color:#666;
}

div.clips a em {
    font-style:normal;
    color:#f00;
}	

div.clips a:hover {
    background-color:#f9f9fa;		
}

div.clips a.playing:hover, div.clips a.paused:hover, div.clips a.progress:hover {
    background-color:transparent !important;		 
}

div.clips.petrol a {
    background-color:#193947;
    color:#fff;
    border:1px outset #193947;
}

div.clips.petrol a.playing, div.clips.petrol a.paused, div.clips.petrol a.progress {
    background:url(/images/powderplex/dark.png) no-repeat 0px -69px;
    border:0;
}

div.clips.petrol a.paused {
    background-position:0 0;	
}

div.clips.petrol a span {
    color:#aaa;
}

div.clips.petrol a em {
    color:#FCA29A;
    font-weight:bold;
}	

div.clips.petrol a:hover {
    background-color:#274D58;		
} 

div.clips.petrol a.playing:hover, div.clips.petrol a.paused:hover, div.clips.petrol a.progress:hover {
    background-color:transparent !important;		 
}

div.clips.low a {	
    height:31px;
}

div.clips.low a.playing, div.clips.low a.paused, div.clips.low a.progress {
    background-image:url(/images/powderplex/light_small.png);
    background-position:0 -55px;
}

div.clips.low a.paused {
    background-position:0 0;	
}

.clipInfo {
    width: 175px;
}

.clipTitle {
    width: 175px;
}

.clipGrapher {
    width: 175px;
    font-style: italic;
    color: #fcc;
display: inline;
}

.clipTime {
    color: #5a5;
display: inline;
}

.clipThumb {
    float: left;
    height: 40px;
    padding: 6px 5px 0px 0px;
}

a.go {
    display:block;
    width:18px;
    height:18px;
    background:url(/images/powderplex/up.png) no-repeat;
    margin:5px 0 5px 105px;
    cursor:pointer;
}

a.go:hover, a.go.down:hover {
    background-position:0px -18px;		
}

a.go.down {
    background-image:url(/images/powderplex/down.png);	
}

div.petrol a.go {
    background-image:url(/images/powderplex/up_dark.png);		
}

div.petrol a.go.down {
    background-image:url(/images/powderplex/down_dark.png);		
}

a.go.disabled {
    display: block;	
}

/*}}}*/

#powderplex {
    width: 956px;
    height: 374px;
    margin: 0 auto;
    padding: 5px;  
    background-color: #111;
}

#category {
    color: #67a;
    margin-right: 50px;
    text-align: center;
    font-size: 1.5em;
    font-weight: bold;
}

#videoMenu {
    float:left;
    width:282px;
    padding-left: 10px;
    padding-top: 10px;
}    

#playerContainer {
    margin-left: 292px;
    width: 664px;
    position: absolute;
}

/* curtain */

.leftcurtain{  
    width: 50%;  
    height: 349px;  
    top: 0px;  
    left: 0px;  
    position: absolute;
    z-index: 2;  
}

.rightcurtain{  
    width: 51%;  
    height: 349px;  
    right: 0px;  
    top: 0px;  
    position: absolute;
    z-index: 3;  
}  

.rightcurtain img, .leftcurtain img{  
    width: 100%;  
    height: 100%;  
}  

#stageLedge {
    background: #111 url("/images/powderplex/stageLedge.png") no-repeat 0 0;
    width: 664px;
    height: 45px;
}

#ppSign {
    background: #111 url("/images/powderplex/headerSignBG.png") no-repeat 0 0;
    width: 964px;
    height: 145px;
    margin: 0 auto;
    display: block;
    margin-top: 5px
}

#marquis {
    background: url("/images/powderplex/marquis.png") no-repeat 0 0;
    width: 936px;
    height: 35px;
    margin: 0 auto;
    display: block;
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    padding-top: 5px;
    margin-top: 5px;
}

#catContainer {
    position: absolute;
    width: 956px;
    height: 120px;
    margin: 50px auto 0px auto;
    padding-top: 0px;
    background-color: #111;
    z-index: 10;
}

#catContainer #catList {
    margin: 0 auto;
    z-index: 20;
    width: 880px;
}

#catContainer #catList .cat {
    z-index: 30;
    text-decoration: none;
    font-size: 12px;
    color: #bbf;
    width: 86px;
    height: 100px;
    float: left;
    display: inline;
    text-align: center;
    padding: 0px 5px;
}
