* {margin: 0; padding: 0; -moz-outline: none !important}
li {list-style: none;}
a { font-family: "Century Gothic", Verdana, Arial, sans-serif; color: #999;}
a:hover {color: #ccc;}
body {text-align: center; background-color: #000; color: #aaa; font-size: small; font-family: Verdana, Arial, sans-serif; behavior: url(csshover.htc);}
* html body {
  font-size: x-small; /* for IE5/Win */
  f\ont-size: small; /* for other IE versions */
}
h1 {position: relative; text-align: center; font-size: 160%; font-weight: normal; text-transform: lowercase; font-style: italic; letter-spacing: 3px; margin-bottom: 20px;}
#wrapper {width: 980px; margin: 0 auto; text-align: left; position: relative;}
#extras {position: absolute;}
#extras p {font-family: "Copperplate Gothic Bold", "Century Gothic", "Bitstream Vera Sans", Verdana, Arial, sans-serif; position: absolute; top: 28px; width: 20em; font-size: 16px; height: 16px; line-height: 16px;}
#extras #xdate { left: 400px;}
#extras #countdown {left: 615px;}
#extras #countdownh {display: none;}
#extras #ximg {position: absolute; left: 840px; top: 45px;}
#content {margin-left: 226px; background: #000 url(images/tile.gif);}
#events {text-align: center;}
#topctrl {margin-bottom: 20px; height: 30px;}
#topctrl a, #bottomctrl a {font-size: 120%; text-decoration: none; color: #970007; font-family: Eurostile, "Trebuchet MS", Verdana, Arial, sans-serif;}
#topctrl a:hover, #bottomctrl a:hover {color: #bf0008;}
a.prev {float: left; margin-left: 40px;}
a.next {float: right; margin-right: 45px;}
a.hidden {visibility: hidden;}
#bottom {clear: both; height: 42px; background: transparent url(images/bottom.gif);}

/* nav */
#nav {height: 305px; width: 226px; position: absolute; top: 221px; left: 0;}
#nav a {display: block; height: 24px; width: 226px; background-position: 0 0; text-indent: -2000px}
#nav a:hover {background-position: 0 -24px;}
#nav-home {background-image: url(images/home.gif);}
#nav-news {background-image: url(images/news.gif);}
#nav-events {background-image: url(images/events.gif);}
#nav-location {background-image: url(images/location.gif);}
#nav-djs {background-image: url(images/djs.gif);}
#nav-playlists {background-image: url(images/playlists.gif);}
#nav-fliers {background-image: url(images/flyers.gif);}
#nav-photos {background-image: url(images/photos.gif);}
#nav-links {background-image: url(images/links.gif);}
#nav-tribe {background-image: url(images/tribe.gif);}
#wrapper #nav a.nav-active {background-position: 0 -24px;}

/* under construction */
#uc {margin: 0 50px 0 45px; border: 2px solid #333; background: url(images/tile2.gif) top left repeat-y; padding: 15px;}
#uc h2 {text-align: center; font-size: 140%; font-weight: normal; font-style: italic;}

/* home */
#more {text-align: right; margin-top: -12px;}
#more a {text-decoration: none; color: #666; font-family: Arial, Helvetica, sans-serif; font-style: italic; font-size: 90%; font-weight: bold;}
#more a:hover {color: #aaa;}
#next-event {margin: 15px 50px 0 45px; padding: 10px 0 25px; border: 2px solid #333; background: url(images/tile2.gif) top left repeat-y; text-align: center;}
#next-event h2 {font-size: 150%; font-weight: bold; font-style: italic;}
#next-event img {margin-top: 15px;}

/* news */
#news {margin: 0 50px 0 45px; padding-top: 15px;}
#news .one-news {border: 2px solid #333; background: url(images/tile2.gif) top left repeat-y; margin-bottom: 15px; position: relative; padding-left: 15px;}
#news .date {position: absolute; top: 0px; right: 0px; text-align: right; font-family: Arial, Helvetica, sans-serif; font-size: 90%; padding: 5px; border: solid #333; border-width: 0 0 1px 1px; font-style: italic; color: #999; letter-spacing: 1px; text-transform: lowercase;}
* html #news .date {right: 50px;} /* for IE */
#news h2 {font-size: 140%; font-weight: normal; font-style: italic; margin: 10px 8em 7px 0; color: #777; text-decoration: underline;}
#news .text {text-indent: 2em; line-height: 1.5em; font-size: 90%; padding-right: 15px;}
#news .author {text-align: right; font-style: italic; font-size: 85%; padding: 0 5px 5px 0; color: #999;}
#news .author span {font-variant: small-caps; font-size: 115%; padding: 0 5px 5px 0;}

/* location */
#location {margin: 0 50px 0 45px; border: 2px solid #333; background: url(images/tile2.gif) top left repeat-y; padding: 15px; height: 155px;}
#location #map {float: right;}
#location #map img {border: solid 2px #999;}
#location #map a:hover img{border-color: #ccc;}
#location #map p {text-align: center;}
#location h2 {font-size: 150%; font-weight: normal; font-variant: small-caps; letter-spacing: 1px; text-decoration: underline; padding-bottom: 5px;}
#location a {text-decoration: none;}
/* events */
#events {margin: 0 45px 0 50px;}
#events .frame {position: relative; float: left; width: 160px; height: 160px; margin-bottom: 15px;}
#events a{position: absolute; display: block; bottom: 0px; left: 15px; width: 130px; text-decoration: none;}
#events a img {border: solid 2px #999};
#events a:hover img {border-color: #ccc;}
* html #events dd {padding-top: 5px;} /* for IE */

/* event */
#event {margin: 0 0 20px 37px; padding-left: 10px; background: url(images/tile2.gif) top left repeat-y; width: 660px; border: 2px solid #333;}
#event #flier {text-align: right;}
#event #flier img {border: solid #333; border-width: 0 0 2px 2px; padding: 0 0 8px 8px; position: relative; top: -2px; right: -2px; background: url(images/tile.gif) 50% 50% repeat-y;}
#event #details {position: absolute; top: 275px; left: 275px;}
* html #event #details {top: 280px;} /* for IE */
#event #links {position: relative; top: -2.5em;}
#event #links li {display: inline; margin: 0 5px;}
#event #links a {text-decoration: none; border: solid 1px #666; line-height: 1.5em; padding: 0 10px;}
#event #links a:hover {color: #aaa; border-color: #999;}
#event #desc-sum {position: relative; top: -1.5em;}
#event #desc-sum h3 {background-color: #090909; font-size: 100%; line-height: 1.5em; margin-left: -10px; border: solid #333; border-width: 2px 0; padding-left: 10px; position: relative; top: -4px; font-weight: normal; text-transform: lowercase; letter-spacing: 1px; font-style: italic;}
#event #desc-sum p {padding-top: 5px;}
#event #description {padding-bottom: 15px;}
#event h2 {color: #666; font-size: 150%; font-family: Arial, Helvetica, sans-serif; font-weight: normal; text-transform: lowercase; font-style: italic; letter-spacing: 2px; text-decoration: underline; margin-bottom: 0.25em;}
#event #details p {line-height: 1.25em;}
#event #club-name {font-size: 115%; font-variant: small-caps;}
#event #address {font-size: 80%;}
#event #time {font-size: 90%; text-transform: lowercase;}
#event #lineup {margin-top: 0.5em;}
#event #lineup h3 {color: #666; padding: 0.5em 0 0.25em; font-size: 115%; text-transform: lowercase; font-style: italic; letter-spacing: 1px; font-weight: normal; text-decoration: underline;}
#event #lineup a {color: #aaa; text-decoration: none; font-variant: small-caps; font-size: 115%;}
#event #lineup a:hover {color: #ccc; text-decoration: underline;}

/* playlists */
#rooms {clear: both; text-align: center; display: none;}
#rooms li {display: inline; font-size: 115%;}
#rooms a {text-decoration: none; margin: 0 1px; border: solid 2px #333; border-bottom: none; padding: 0 10px; color: #666; background: url(images/tile2.gif) top left; position: relative; -moz-outline: none !important}
#rooms a.over { color: #aaa;}
#rooms a.active { color: #aaa; top: 2px;}

#tablelimitter {padding: 0 45px 0 40px;}
#playlists {margin: 0 auto 20px; border: solid 2px #333; background: url(images/tile2.gif) top left repeat-y; text-align: left; border-collapse: collapse;}
#playlists th {text-align: center; padding: 5px 5px; border: solid 1px #333; background-color: #050505; font-style: italic; letter-spacing: 2px;}
#playlists td {padding: 3px 10px; border: solid 1px #333;}
#playlists .req {background: transparent url(images/bh_s.gif) left 50% no-repeat;}
#playlists .req_yes {text-indent: -5000px; background: transparent url(images/bh.gif) 50% 50% no-repeat;}
#playlists .room {border: none; font-size: 140%; text-align: center; color: #999;}
#playlists .playlist {border: none; font-size: 150%; font-variant: small-caps;  text-align: center; padding-top: 30px; color: #ccc;}
#playlists .minor {font-size: 75%;}
#playlists .note { border: none; font-size: 110%; font-style: italic; text-align: center; padding-bottom: 5px; color: #bbb;}

/* djs */
#alldjs {margin: 0 45px 0 65px;}
#alldjs h3 {font-size: 135%; padding: 10px 0 20px; font-variant: small-caps;}
#alldjs div.djtype:hover h3 {color: #ccc;}
#alldjs a {display: block; float: left; text-decoration: none; padding-bottom: 5px; margin: 0 10px 5px; height: 180px;}
#alldjs a:hover img {border-color: #eee;}
#alldjs a:hover dd {color: #eee;}
#alldjs .djtype {clear: both;}
#alldjs img {border: solid 2px #aaa;}
#alldjs dd {font-variant: small-caps; font-size: 120%; text-align: center;}

#alldjs div.floater {margin: 0; position: absolute; width: 605px; background: url(images/tile2.gif) top left repeat-y; border: solid 2px #666; padding: 15px 5px 0; display: none;}

#thedj {clear: both; margin: 15px 0 0 50px; padding: 10px; border: solid 2px #333; background: url(images/tile2.gif) top left repeat-y; width: 625px;}
#thedj img {float: left; border: solid 2px #aaa; margin: 0 25px 10px 0;}
#thedj .links {clear: both;}
#thedj .details {margin: 0 10px 0 0;}
#thedj .details h3 {font-size: 160%; font-variant: small-caps; font-family: "Century Gothic", Verdana, Arial, sans-serif; font-weight: normal; margin-bottom: 5px;}
#thedj .djnote {font-style: italic;}
#thedj .details .minor {font-size: 60%; text-transform: uppercase; font-family: Verdana, Arial, sans-serif;}
#thedj .details ul {margin: 20px 0 15px 0;}
#thedj .details li {padding-left: 35px;}
#thedj a, #thedj .details li{font-family: Verdana, Arial, sans-serif;}
#thedj a:hover {color: #ccc;}
#thedj .djdesc {text-indent: 2em; margin: 30px 0 15px;}
#thedj .links p {text-align: center; background-color: #090909; line-height: 1.5em; margin: 0 -10px; border: solid #333; border-width: 1px 0;}
#thedj .links ul {margin: 10px 5px 5px;}

/* temp use together with rooms later! */
#types {clear: both; text-align: center; position: relative; top: 2px;}
* html #types {top: 0;} /*for IE/Win*/
#types li {display: inline; font-size: 115%;}
#types a {text-decoration: none; margin: 0 1px; border: solid 2px #333; padding: 0 10px; color: #666; background: url(images/tile2.gif) top left; position: relative; -moz-outline: none !important}
#types a.active { color: #aaa; border-color: #666;}

/* fliers */
#fliers {margin: 0 50px 30px 45px;}
#fliers .flier {margin-bottom: 20px; padding: 20px; border: solid 2px #333; background: url(images/tile2.gif) top left repeat-y; text-align: center; position: relative;}
#fliers ul {margin-top: 15px; text-align: right;}
#fliers ul {text-transform: lowercase; letter-spacing: 1px; font-style: italic;}
#fliers .person{text-transform: none; font-style: normal;}
#fliers p {margin-top: 15px;}

/* tribe.net RSS */
#tribe {margin: 0 0 0 65px; overflow: hidden; width: 650px;}
#tribe h3 {text-align: center; padding: 20px 0 15px; font-size: 130%;}
#tribe ul a {font-size: 120%; font-variant: small-caps;}
#tribe .date{font-size: 80%; padding-left: 2em; font-variant: normal;}
#tribe ul p {margin: 15px 2em 25px 2em;}

/* drop-down */
#drop-down {width: 50px; height: 20px; overflow: visible; position: absolute; top: 223px; left: 577px; z-index: 80;}
#drop-down div {text-align: center; display: none; width: 200px; position: absolute; top: 0px; left: -75px; background: url(images/tile2.gif) top left repeat-y; border: solid 2px #666; padding: 5px 0;}
div#drop-down:hover div {display: block;}
