/*SCREEN*/

/*GENERAL*/

body { margin: 0; background-color: #272808; }
body, div, span, p, li { font-family: verdana, sans-serif; font-size: small; color: #996; }
a:link, a:visited, a:active { color: #996; text-decoration: underline; }
a:hover { color: #cc9; text-decoration: underline; }
div#container { background-color: transparent; position: absolute; top: 50%; left: 0px; width: 100%; margin-top: -290px; min-width: 900px; }
div#main{ position: relative; width: 990px; height: 580px; margin: 0px auto; }
h1#title span { display: block; height: 0px; overflow: hidden; }
h2#subtitle span { display: block; height: 0px; overflow: hidden; }

span.safari-hack { display: block; width: 1px; height: 1px; overflow: hidden; clear: both; }


/*NAV1*/

ul#nav1 { position: absolute; left: 55px; top: 42px; width: 116px; margin: 0; padding: 0; list-style: none; }
ul#nav1 li { margin: 0; padding: 0; }
ul#nav1 li a { font-size: 11px; padding: 0 10px 0 0; background-color: #000; }
ul#nav1 li a:link, 
ul#nav1 li a:visited, 
ul#nav1 li a:active { color: #996; text-decoration: none; }
ul#nav1 li a:hover { color: #cc9; text-decoration: none; }

#navitem7 { position: absolute; left: 0px; top: 0px; }
#navitem1 { position: absolute; left: 0px; top: 18px; }
#navitem2 { position: absolute; left: 0px; top: 36px; }
#navitem3 { position: absolute; left: 0px; top: 54px; }
#navitem4 { position: absolute; left: 0px; top: 72px; }
#navitem5 { position: absolute; left: 0px; top: 90px; }


/*NAV2*/

ul#nav2 { position: absolute; left: 0; top: 554px; width: 990px; height: 26px; background: transparent url(../images/nav2_bg.gif) top left repeat-x; margin: 0; padding: 0; list-style: none; }
ul#nav2 li { font-size: 10px; float: right; display: inline; height: 17px; padding: 3px 22px 0 22px; margin: 4px 0 0 0; background: transparent url(../images/nav2_bullet.gif) 0px 2px no-repeat; }
ul#nav2 li.end { margin: 4px 0 0 0; }
ul#nav2 li.start { background: none; }
ul#nav2 li a { font-size: 10px; }
ul#nav2 li a:link, 
ul#nav2 li a:visited, 
ul#nav2 li a:active { color: #996; text-decoration: none; }
ul#nav2 li a:hover { color: #cc9; text-decoration: none; }


/*SCROLLER*/
div#scrollArea p { margin: 0 0 10px 0; font-size: .8em; line-height: 1.3em;}


/*PAGE 0: LANDING*/

body#page0 div#main { width: 990px; height: 580px; background: transparent url(../images/page0_bg.jpg) top left no-repeat; }
body#page0 h1#title { position: absolute; left: 121px; top: 0px; width: 90px; height: 458px; background: transparent url(../images/page0_title.gif) top left no-repeat; margin: 0; padding: 0; }
body#page0 h2#subtitle { position: absolute; left: -10000px; }

body#page0 h3#enter { position: absolute; left: 44px; top: 140px; margin: 0; padding: 0; }
body#page0 h3#enter a { display: block; width: 77px; height: 18px; background: transparent url(../images/page0_subtitle.gif) top left no-repeat;  }

h3#enter span { display: block; height: 0px; overflow: hidden; }


/*PAGE 7: HOME PAGE*/

body#page7 div#main { width: 990px; height: 554px; background: #000 url(../images/page7_bg.jpg) top left no-repeat; }
body#page7 h1#title { width: 0; height: 0; overflow: hidden; margin: 0; padding: 0; }
body#page7 h2#subtitle { position: absolute; left: 76px; top: 0px; width: 97px; height: 512px; background: transparent url(../images/page7_title.gif) top left no-repeat; margin: 0; padding: 0; }

/*Navitem*/
body#page7 ul#nav1 li#navitem7 a:link, 
body#page7 ul#nav1 li#navitem7 a:visited, 
body#page7 ul#nav1 li#navitem7 a:active { color: #cc9; }

body#page7 div#section-a { position: absolute; left: 190px; top: 44px; width: 428px; }
	body#page7 div#section-a h3 { font-size: 10px; text-transform: uppercase; margin: 0 0 10px 0; padding: 0; }
	body#page7 div#section-a p { font-size: 10px; margin: 0 0 10px 0; }
	body#page7 div#section-a ul { list-style: none; margin: 0; padding: 0; }
		body#page7 div#section-a ul li { font-size: 10px; line-height: 12px; }
			body#page7 div#section-a ul li a { text-decoration: none; }

body#page7 div#section-b { position: absolute; left: 210px; top: 213px; width: 388px; height: 260px; }
	body#page7 div#section-b h3 { font-size: 10px; margin: 0 0 10px 0;  padding: 0; }
	body#page7 div#section-b p { font-size: 10px; margin: 0 0 10px 0; }
	body#page7 div#section-b div#player { margin: 0 0 10px 0; }

body#page7 div#section-c { position: absolute; left: 635px; top: 191px; width: 250px; }
	body#page7 div#section-c h3 { font-size: 10px; text-transform: uppercase; margin: 0 0 10px 0; padding: 0; }
	body#page7 div#section-c p { font-size: 10px; }
	body#page7 div#section-c ul { list-style: none; margin: 0 0 10px 0; padding: 0; }
		body#page7 div#section-c ul li { font-size: 10px; line-height: 12px; }
			body#page7 div#section-c ul li a { text-decoration: none; }
			
			body#page7 a.active-item { color: #cc9; }


/*PAGE 1: BIOGRAPHY*/

body#page1 div#main { width: 990px; height: 554px; background: #000 url(../images/page1_bg.jpg) top left no-repeat; }
body#page1 h1#title { width: 0; height: 0; overflow: hidden; margin: 0; padding: 0; }
body#page1 h2#subtitle { position: absolute; left: 76px; top: 0px; width: 97px; height: 512px; background: transparent url(../images/page1_title.gif) top left no-repeat; margin: 0; padding: 0; }

/*Navitem*/
body#page1 ul#nav1 li#navitem1 a:link, 
body#page1 ul#nav1 li#navitem1 a:visited, 
body#page1 ul#nav1 li#navitem1 a:active { color: #cc9; }

/*Scroller*/
body#page1 div#scrollContainer { position: absolute; left: 168px; top: 44px; width: 292px; height: 465px; overflow: hidden; }
body#page1 div#scrollArea { position: absolute; left: 22px; top: 0px; width: 250px; }
body#page1 div#scrollUP{ position: absolute; left: -10px; top: 0px; visibility: hidden; z-index: 20; display: none; }
body#page1 div#scrollDN{ position: absolute; left: -10px; top: 137px; visibility: hidden; z-index: 20; display: none; }
body#page1 div#scrollButton{ position: absolute; left: 0px; top: 38px; width: 9px; height: 28px; visibility: hidden; z-index: 30; cursor: pointer; }
body#page1 div#scrollTrack{ position: absolute; left: 4px; top: 48px; width: 1px; height: 419px; visibility: hidden; background: transparent url(../images/scroller/track.gif) top left repeat-y; overflow: hidden; z-index: 10; }


/*PAGE 2: DISCOGRAPHY*/

body#page2 div#main { width: 990px; height: 554px; background: #000 url(../images/page2_bg.jpg) top left no-repeat; }
body#page2 h1#title { width: 0; height: 0; overflow: hidden; margin: 0; padding: 0; }
body#page2 h2#subtitle { position: absolute; left: 76px; top: 0px; width: 97px; height: 512px; background: transparent url(../images/page2_title.gif) top left no-repeat; margin: 0; padding: 0; }

/*Navitem*/
body#page2 ul#nav1 li#navitem2 a:link, 
body#page2 ul#nav1 li#navitem2 a:visited, 
body#page2 ul#nav1 li#navitem2 a:active { color: #cc9; }

body#page2  div#scrollArea ul { margin: 0; padding: 0; list-style: none; }
body#page2  div#scrollArea ul li { margin: 0 0 5px 0; padding: 0; clear: both; overflow: hidden; }
body#page2  div#scrollArea ul li h3 { margin: 0; padding: 0; text-transform: uppercase; font-size: 10px; }
body#page2  div#scrollArea ul li h4 { margin: -2px 0 0 0; padding: 0; font-size: 10px; font-weight: normal; }
body#page2  div#scrollArea ul li div.album { width: 320px;  }
body#page2  div#scrollArea ul li div.album div.cover { width: 84px; height: 88px; padding: 1px; border: 1px solid #996; float: left; display: inline; }
body#page2  div#scrollArea ul li div.album div.clips { width: 220px; margin: 0 0 0 8px; float: left; display: inline; }
body#page2  div#scrollArea ul li div.album div.clips ol { list-style: none; padding: 0; margin: 0; }
body#page2  div#scrollArea ul li div.album div.clips ol li { margin: 0; padding: 0; }
body#page2  div#scrollArea ul li div.album div.clips ol li a { font-size: 10px; text-decoration: none; }

/*Scroller*/
body#page2 div#scrollContainer { position: absolute; left: 168px; top: 44px; width: 370px; height: 465px; overflow: hidden; }
body#page2 div#scrollArea { position: absolute; left: 22px; top: 0px; width: 320px; }
body#page2 div#scrollUP{ position: absolute; left: -10px; top: 0px; visibility: hidden; z-index: 20; display: none; }
body#page2 div#scrollDN{ position: absolute; left: -10px; top: 137px; visibility: hidden; z-index: 20; display: none; }
body#page2 div#scrollButton{ position: absolute; left: 0px; top: 56px; width: 9px; height: 28px; visibility: hidden; z-index: 30; cursor: pointer; }
body#page2 div#scrollTrack{ position: absolute; left: 4px; top: 48px; width: 1px; height: 401px; visibility: hidden; background: transparent url(../images/scroller/track.gif) top left repeat-y; overflow: hidden; z-index: 10; }


/*PAGE 3: SHOWS*/

body#page3 div#main { width: 990px; height: 554px; background: #000 url(../images/page3_bg.jpg) top left no-repeat; }
body#page3 h1#title { width: 0; height: 0; overflow: hidden; margin: 0; padding: 0; }
body#page3 h2#subtitle { position: absolute; left: 76px; top: 0px; width: 97px; height: 512px; background: transparent url(../images/page3_title.gif) top left no-repeat; margin: 0; padding: 0; }

/*Navitem*/
body#page3 ul#nav1 li#navitem3 a:link, 
body#page3 ul#nav1 li#navitem3 a:visited, 
body#page3 ul#nav1 li#navitem3 a:active { color: #cc9; }

body#page3 div#scrollArea ul { margin: 0 0 10px 0; padding: 0; list-style: none; }
body#page3 div#scrollArea ul li { font-size: 10px; margin: 0; padding: 0; }
body#page3 div#scrollArea h3 { margin: 0 0 10px 0; padding: 0; text-transform: uppercase; font-size: 10px; }

/*Scroller*/
body#page3 div#scrollContainer { position: absolute; left: 168px; top: 44px; width: 400px; height: 465px; overflow: hidden; }
body#page3 div#scrollArea { position: absolute; left: 22px; top: 0px; width: 360px; }
body#page3 div#scrollUP{ position: absolute; left: -10px; top: 0px; visibility: hidden; z-index: 20; display: none; }
body#page3 div#scrollDN{ position: absolute; left: -10px; top: 137px; visibility: hidden; z-index: 20; display: none; }
body#page3 div#scrollButton{ position: absolute; left: 0px; top: 73px; width: 9px; height: 28px; visibility: hidden; z-index: 30; cursor: pointer; }
body#page3 div#scrollTrack{ position: absolute; left: 4px; top: 73px; width: 1px; height: 384px; visibility: hidden; background: transparent url(../images/scroller/track.gif) top left repeat-y; overflow: hidden; z-index: 10; }


/*PAGE 4: PROJECTS*/

body#page4 div#main { width: 990px; height: 554px; background: #000 url(../images/page4_bg.jpg) top left no-repeat; }
body#page4 h1#title { width: 0; height: 0; overflow: hidden; margin: 0; padding: 0; }
body#page4 h2#subtitle { position: absolute; left: 76px; top: 0px; width: 97px; height: 512px; background: transparent url(../images/page4_title.gif) top left no-repeat; margin: 0; padding: 0; }

/*Navitem*/
body#page4 ul#nav1 li#navitem4 a:link, 
body#page4 ul#nav1 li#navitem4 a:visited, 
body#page4 ul#nav1 li#navitem4 a:active { color: #cc9; }
body#page4 div#secondary { position: absolute; left: 191px; top: 274px; width: 174px; height: 130px; padding: 1px; border: 1px solid #996; }
body#page4 p img { width: 174px; height: 130px; padding: 1px; border: 1px solid #996; margin: 6px 0 0 0; }
/*Scroller*/
body#page4 div#scrollContainer { position: absolute; left: 168px; top: 44px; width: 277px; height: 465px; overflow: hidden; }
body#page4 div#scrollArea { position: absolute; left: 22px; top: 0px; width: 235px; }
body#page4 div#scrollUP{ position: absolute; left: -10px; top: 0px; visibility: hidden; z-index: 20; display: none; }
body#page4 div#scrollDN{ position: absolute; left: -10px; top: 137px; visibility: hidden; z-index: 20; display: none; }
body#page4 div#scrollButton{ position: absolute; left: 0px; top: 92px; width: 9px; height: 28px; visibility: hidden; z-index: 30; cursor: pointer; }
body#page4 div#scrollTrack{ position: absolute; left: 4px; top: 98px; width: 1px; height: 320px; visibility: hidden; background: transparent url(../images/scroller/track.gif) top left repeat-y; overflow: hidden; z-index: 10; }


/*PAGE 5: GALLERY*/

body#page5 div#main { width: 990px; height: 554px; background: #000 url(../images/page5_bg.jpg) top left no-repeat; }
body#page5 h1#title { width: 0; height: 0; overflow: hidden; margin: 0; padding: 0; }
body#page5 h2#subtitle { position: absolute; left: 76px; top: 0px; width: 97px; height: 512px; background: transparent url(../images/page5_title.gif) top left no-repeat; margin: 0; padding: 0; }

/*Navitem*/
body#page5 ul#nav1 li#navitem5 a:link, 
body#page5 ul#nav1 li#navitem5 a:visited, 
body#page5 ul#nav1 li#navitem5 a:active { color: #cc9; }

body#page5 ul#shows { margin: 0; padding: 0; list-style: none; }
body#page5 ul#shows li { margin: 0 0 5px 0; padding: 0; }

/*gallery*/
body#page5 div#gallery { position: absolute; left: 190px; top: 168px; width: 415px; }
body#page5 div#gallery div.large { width: 408px; height: 276px; padding: 1px; border: 1px solid #996; margin: 0 0 3px 0; overflow: hidden; }
body#page5 div#gallery div.thumbs { width: 415px; }
body#page5 div#gallery div.thumbs div.small { width: 76px; height: 57px; padding: 1px; margin: 0 3px 0 0; overflow: hidden; float: left; display: inline;  }

body#page5 div#gallery div.gallery-nav { clear: both; overflow: hidden; margin: 0 0 8px 0; }
body#page5 div#gallery div.gallery-nav a:link,
body#page5 div#gallery div.gallery-nav a:visited,
body#page5 div#gallery div.gallery-nav a:active { font-size: 10px; text-decoration: none; }
body#page5 div#gallery div.gallery-nav a:hover { font-size: 10px; text-decoration: none; }
body#page5 div#gallery div.gallery-nav a#prev { float: left; }
body#page5 div#gallery div.gallery-nav a#next { float: right; margin: 0 4px 0 0; }

body#page5 div#gallery div#gallery-desc { font-size: 10px; clear: both; }
body#page5 div#gallery div.off { border: 1px solid #5C5C3B; }
body#page5 div#gallery div.on { border: 1px solid #996; }


/*PAGE 6: SAMPLE TRACK POPUP*/

body#page6 { margin: 10px; }
body#page6 h2#subtitle { font-size: 10px; font-weight: normal; margin: 0 0 10px 0; }
body#page6 div#media { width: 320px; height: 16px; }