@charset "utf-8";
/* CSS Document */

/* This block of code controls the TV links on the index page. */
.tv {margin:0; padding:0; list-style:none;}
.tv li {margin:0 18px 18px 0; display:block; width:150px; height:144px; float:left; position:relative;}
.tv li a {display:block; width:150px; height:144px; background:url(../graphics/tvFrame150x144.png) top left no-repeat; position:absolute; top:0; z-index:2; text-decoration:none; color:#000; text-align:center;}
*html .tv li a {background:url(../graphics/tvFrame150x144.gif) top left no-repeat;}
.tv li img {position:absolute; top:10px; z-index:1;}
.tv li a span {display:none;}
.tv li a:hover {background:#0099FF;}
.tv li a:hover span {display:block; padding:4px; width:140px; height:134px; border:1px solid #000;}
.tv li.last {margin-right:0;}
/* Random color backgrounds for tv links. */
.tv li a.bla:hover {background:#000000; color:#fff;}
.tv li a.gra:hover {background:#CCCCCC;}
.tv li a.yel:hover {background:#FFFF00;}
.tv li a.cya:hover {background:#00FFFF;}
.tv li a.gre:hover {background:#009900;}
.tv li a.pur:hover {background:#9900CC;}
.tv li a.red:hover {background:#FF0000;}
.tv li a.blu:hover {background:#0000CC;}



/* Styling for the logo art home link on the far left of the page. */
#logo p {margin:-36px 0 0 0; padding:0;}
#logo p a {margin:0; padding:0; display:block; width:234px; height:432px; background:url(../graphics/logoArt.jpg) top left no-repeat;}
#logo p a span {display:none;}

/* Styling for the vertical color test bar. */
#bar div {height:54px;}
#bar div p, #bar div p a {color:#777; text-align:center;}
#bar div p a:hover {color:#000;}
#bar div.bla {background:#000000; height:18px;}
#bar div.gra {background:#CCCCCC;}
#bar div.yel {background:#FFFF00;}
#bar div.cya {background:#00FFFF;}
#bar div.gre {background:#009900;}
#bar div.pur {background:#9900CC;}
#bar div.red {background:#FF0000;}
#bar div.blu {background:#0000CC;}

/* IDs for the content divs of each page. Not needed right now. */
#content-programming {}
#content-music {}
#content-resources {}
#content-events {}
#content-members {}

/* Column class for lists in the content areas. Sets list items to 4 column layout. */
.col:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
.col {display:inline-block;}
* html .col {height:1%;}
.col {display:block;}
.col li {width:25%; float:left;}

#compact-nav-bar {width:auto; height:18px; background:#FFFFCC;}
#compact-nav-bar #holder {margin:0 auto; width:990px;}
#compact-nav-bar #holder ul {margin-bottom:0; width:654px; float:right;}