/* 
	Designed by Martin Neumann, Rush.media Webdesign www.rushmedia.de  -  Buckenhof  Germany
	
	Bugfixed by Andrew Tay (www.andrewtay.com) for HostBaby.com May 2007 
   All styles that have been changed are indented
	
	- added Arial to the list of fonts for body. Previously, FF and IE would automatically choose Arial to
	  match Helvetica but Opera would go to the next choice, which is Verdana
	- margins added to home page img
	- found an IE-only margin bug related to float clearing: essentially, the bottom margin on p (on the home
	  page, for example) pushes down the #footer even though it shouldn't affect it at all. The #footer should
	  be up against the bottom of the #banner since the banner is floated and the #footer is cleared. This bug
	  is a part of Internet Explorer and is documented here: 
	  	
			http://www.brunildo.org/test/IEFloatClearMargin.html but it's not really 
			
	  apparently, there's no fix or workaround but on this layout, it's not the end of the world
	- removed some hacks on the #footer. the solution isn't perfect as the hacks were trying to compensate for
	  the aforementioned--and unfixable--IE-only float clearing margin bug, but it is future-proof.
	
*/


/* =========== LAYOUT =========== */


/* Basic HTML Elements */

         body {
         	padding: 0;
         	margin: 0;
         	text-align: center;
         	font: 80% Helvetica, Arial, Verdana, sans-serif;	/* NEW!! added Arial to the list */
         	color: #E2E2E2;
         	background: #000;
         }
			
html>body {
	width: auto;
	min-width: 700px;
}
ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
}
form {
	margin: 0;
}

/* main structural elements */
#accessibility {
	position: absolute;
	left: -9999px;
}
#container {
	width: auto;
	text-align: left;
	margin: 0 auto;
}

/* main content elements */

            #banner {
            	width: 211px;
            	float: left;
            /*	margin-right: -211px; 		NEW!! This caused inconsistencies between IE and FF/Opera */
				/*	margin-bottom: 50px;		/* NEW!! These 50px were taken from the #footer, reducing IE problems */
            }

/* -- navigation -- */
#navigation {
    position:relative;
    padding: 30px 0 0 0;
    margin: 0 0 0 30px;
    height:35px;
    width:750px;
    top:10px;
    background: url(/shared/darkvengeance/nav_bg.jpg) left bottom no-repeat;

}
/* ie5/mac hack \*/
#navigation {
    padding:0;
    height:60px;
}
/* end hack */
#navigation ul {
	margin: 0;
	padding: 0 0 0 20px;
	list-style:none;
	}
#navigation li {
    float:left;
    padding-top:10px;
}
/* ie5/mac hack \*/
#navigation li {
    padding-top:0;
    display:block;
    margin:auto;
}
/* end hack */
#navigation li a {
	text-decoration: none;
    padding: 27px 3px 10px 10px;
	margin: 0;
	font-size: 1.2em;
}
/* ie5/mac hack \*/
#navigation li a {
    display:block;
}
/* end hack */
#navigation li a:hover {
	background: none;
}
/* ie5/mac hack \*/
#navigation li a:hover {
	background: url(/shared/darkvengeance/star.gif) 15px 2px no-repeat;
}
/* end hack */

#emailsignup {
	margin-left: 231px;
	margin-top: 20px;
	height: 30px;
	text-align: right;
	padding: 8px;
	z-index: 1;
}

/* -- banner area -- */
#banner .photo {
	width: 209px;
	height: 535px;
	position: relative;
background: url(/images/gnmgetdown.jpg) 0 0 no-repeat;
}
#banner .band span {
	display: none;
}
#banner .photo span {
	display: none;
}

/* =========== STYLE =========== */


/* -- basic html elements -- */
a {
	color: #CC0000;
	font-weight: bold;
}
a:hover {
	color: #FF0000;
}
h1 {
	color: #8E1718;
}
h2 {
	text-transform: lowercase;
	color: #FCE100;
	font-weight: normal;
	font-style: italic;
	font-size: 1.3em;
	letter-spacing: 1px;
	margin: 0 0 5px 15px;
}
h3 {
	font-size: 15px;
	margin: 0 10px;
}
h4 {
	font-size: 14px;
	font-style: italic;
	margin: 2px 10px 10px 0;
	color: #40673A;
}
ul {
	padding: 0;
	margin: 0 0 0 30px;
	list-style-type: square;
}
p {
	line-height: 1.3;
}

/* layout tweaks */
#content {
    margin: 0 0 0 211px;
	padding: 0 15px;
}
#content h1 {
    margin-top: 20px;
}

			/* NEW!! This section has been revamped. Previously, a couple of hacks were used to compensate for the
				IE float clearing bug by applying padding-top and margin-top to the #footer to push it down, and 
				pssing these values to non-IE browsers. Removing the hack and using margin-bottom on the #banner and
				#content didn't work because IE doubles the #content margin. The best fix was to use 
				position: relative; top: 50px; on the #footer. This also required moving the footer.jpg
				background image from the #container to the actual #footer div (not sure why it wasn't there in the
				first place, but it works now--mostly. Now, in IE6 only, the copyright notice disappears off the
				bottom of any long pages, but we'll have to live with it. */

         #container {
         /*	background: url(/shared/darkvengeance/footer.jpg) bottom center no-repeat; 		NEW!! moved */
            width: 760px;
         	voice-family: "\"}\"";
         	voice-family:inherit;
         	width: 750px;
         	padding: 0px;
         }

         #footer {
         	margin: 0;
            padding: 0 0 15px 0;			/* The IE float clearing bug causes padding-top to double, hence 0px */
         	clear: both;
				position: relative;
				top: 50px;
				background: url(/shared/darkvengeance/footer.jpg) bottom center no-repeat;		/* NEW!! moved */
         }
			
			/* NEW!! This hack tried to compensate for the IE float clearing bug (see lengthy explanation above)
				
         html > body #footer {
             padding: 30px 0 15px 0;
         }
			*/
			
#footer p {
    margin: 0; margin-top: 20px;
	font-size: 0.8em;
	text-align: center;
}

			/* NEW!! This hack tried to compensate for the IE float clearing bug (see lengthy explanation above)

         html > body #footer p {
             margin-top: 20px;
         }
			*/
			
			
/* -- content area --*/
#content .entry {
	margin: 0 15px 30px 15px;
  /* the clear line below cause gaps in pages, in FF and Safari... surprisingly OK in IE.
	clear: left;
  */
}
.entry .name, .entry .act {
	font-weight: bold;
	font-style: normal;
	font-size: 1em;
	margin-left: 5px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #FCE100;
}
.entry .name {
	margin-left: 4em;
}
.entry ul {
	margin-top: 10px;
}
.entry li {
	line-height: 20px;
}
.entry p {
	margin: 10px 30px 15px 30px;
}
.details {
	margin: 0 20px 0 30px;
}

/* -- section-specific style -- */
#navigation a {
    color: #E2E2E2;
}
#navigation a:hover {
    color: #FFF;
}
.home p, .index p, .list p {
	margin: 0 20px 1.5em 20px;
	line-height: 130%;
}

.contact ul {
	list-style: none;
}
.contact h2 {
    letter-spacing: 5px;
}
#postForm {
	height: 250px;
	margin: 0 auto 35px auto;
	padding: 10px;
	w\idth:300px;
	text-align:center;
	}
#postForm input, #postForm label, #postForm textarea {
	display: block;
	text-align: left;
	width: 300px;
	margin: 0 auto 10px auto;
}
#postForm input:focus, #postForm textarea:focus {
	color: #fff;
	background: #C84130;
	font-weight: bold;
}
#postForm label {
	padding: 3px 0;
	margin-bottom: 1px;
	font-style: italic;
}
.guestbook h2 {
	margin: 0 0 2px 0;
	padding: 1px 1px 1px 20px;
	letter-spacing: 0;
	font-size: 1.1em;

}
.guestbook h2 a {
	text-transform: lowercase;
	font-weight:normal;
}
.guestbook h3 {
	margin: 0;
	padding: 10px 0 0 20px;
	font-weight:normal;
	font-size: 1em;
	text-transform: uppercase;
}
.guestbook blockquote {
	margin: 0;
	padding: 0px 20px 15px 20px;
}
.guestbook p:first-letter {
    font-size: 1.2em;
}
.links h2 {
	margin: 0 20px 10px;
}
.links dl {
	margin: 0 25px 20px;
}
.links dd {
	margin-bottom: 5px;
}
.music h2 {
	font-size: 1.3em;
}
.music h2 {
	margin-top: 40px;
	padding-bottom: 10px;
	letter-spacing: 5px;
}
.music h3 {
    text-transform:uppercase;
	font-weight: normal;
	margin: 5px 10px 5px 60px;
}
.music h3 a {
    text-decoration: none;
    font-weight:normal;
}
.music .details {
	margin: 0 30px 15px 60px;
}
.music .artist {
	color: #838386;
}
.music .artist, .music .caption {
	display: inline;
	text-size: 0.7em;
	padding-right: 10px;
}
.music .description {
	line-height: 150%;
	font-style: italic;
	border-bottom: solid 1px #797982;
}
.music #content ul {
	list-style-type: none;
	background: url(/shared/darkvengeance/box_bg.jpg) top left no-repeat;
	padding: 5px 10px;
	margin: 10px 0;
}
.music #content li a {
	font-weight: normal;
}
.music .mp3_hifi_download, .music .mp3_lofi_download {
	padding: 0 0 10px 20px;
	background: url(/shared/darkvengeance/ico-cd.gif) no-repeat;
	display: block;
}
.music .mp3_hifi_play, .music .mp3_lofi_play {
	padding: 0 0 10px 20px;
	background: url(/shared/darkvengeance/ico-play.gif) no-repeat;
	display: block;
}
.news {
	line-height: 130%;
}
.photos img {
	border: solid 10px #F3F5F2;
	background: #F3F5F2;
	padding: 0;
}
.photos dl {
    text-align:center;
	margin: 0 20px;
	padding: 0;
}
.photos dt {
	padding: 5px;
	margin: 20px 0 1px 0;
}
.photos dd {
	margin: 0;
	padding: 0;
}
.press h2 {
	margin-left: 20px;
	margin-right: 20px;
	letter-spacing: 5px;
}
.press .caption {
	margin: 0 40px 40px;
	padding: 0 5px 0 35px;
	background: url(/shared/darkvengeance/ico-speech.gif) no-repeat;
}
.links h3 a {
	font-size: 0.9em;
}
.calendar h2 {
	font-size: 1.1em;
	text-transform:uppercase;
	font-style: normal;
	color: #464646;
}
.calendar h2 a {
    font-weight:normal;
}
.calendar h3 {
	font-weight: normal;
	font-variant: small-caps;
	font-size: 1.1em;
	margin: 0;
}

/* -- selected links --*/
.home #navhome, .index #navindex, .bio #navbio, .music #navmusic, .contact #navcontact, .press #navpress, .news #navnews, .calendar #navcalendar, .photos #navphotos, .guestbook #navguestbook, .links #navlinks, .products #navproducts {
	text-transform: uppercase;
}

/* -- section-specific image replacement -- */
h1 {
	height: 116px;
	margin: 4em 0 1em 0;
	background-repeat: no-repeat;
	background-position: top left;
	background-color: transparent;
}
.contact h1 {
	background-image: url(/shared/darkvengeance/is_h1-contact.jpg);
}
.calendar h1 {
	background-image: url(/shared/darkvengeance/is_h1-calendar.jpg);
}
.guestbook h1 {
	background-image: url(/shared/darkvengeance/is_h1-guestbook.jpg);
}
.home h1, .index h1, .list h1 {
	background-image: url(/shared/darkvengeance/is_h1-welcome.jpg);
}
.links h1 {
	background-image: url(/shared/darkvengeance/is_h1-links.jpg);
}
.music h1 {
	background-image: url(/shared/darkvengeance/is_h1-music.jpg);
}
.news h1 {
	background-image: url(/shared/darkvengeance/is_h1-news.jpg);
}
.photos h1 {
	background-image: url(/shared/darkvengeance/is_h1-photos.jpg);
}
.press h1 {
	background-image: url(/shared/darkvengeance/is_h1-press.jpg);
}
.bio h1 {
	background-image: url(/shared/darkvengeance/is_h1-bio.jpg);
}
.products h1 {
	background-image: url(/shared/darkvengeance/is_h1-store.jpg);
}
h1 span {
	display: none;
}

			/* NEW!! new margins for home page image */

         .home img {margin: 0 0 1.5em 20px;}


#splashimage { text-align: center; margin: 100px auto; }
#splashimage a img { border: 0; }



