/* 
	Designed by Stacy Bias for Hostbaby, www.hostbaby.com  -  Portland OR USA
	
	Bugfixed by Andrew Tay (www.andrewtay.com) for HostBaby.com December 2008
   All styles that have been changed are indented
	
	- removed all IE7 hacks
	- added support for .png transparency for IE5.5 and IE6. previously, the negative space of the dollars
	  displayed as gray instead of tranparent. this could also have been solved using a transparent .gif
	- cured an IE6 expanding box problem by setting #banner .photo as position: absolute;. the problem was that
	  the #banner .photo needed to be taller than the #banner itself
	- put #content back into the normal flow, where it used to be floated, solving a straange #footer clearing
	  bug and an ie doubled margin float bug
	- several tweaks to placement of navigation, content, headers, etc. generally caused by not zeroing or
	  standardizing margin and padding values at the outset
	- set navigation to the correct width of 900px, solving an IE6 expanding box problem
	- added standard tweak for splash page
	
*/

   
body{
	background:#000;
	font-family:Arial;
	font-size:12px;
	color:#888888;
	margin: 0 auto;
}

          #container{
         	width:900px;
         	margin:0px auto;
         	padding:0px;
         	position:relative;
         /*	top:-12px;				NEW!! This was a failed attempt to eliminate the top margin from the nav ul */
         	background:#000 url(/shared/madmoney/body.jpg) no-repeat;
         }

#accessibility {
	position: absolute;
	left: -9999px;
}



/*--------- TOP BANNER ---------*/



         #banner .photo{
         	width:700px;
         	height:240px;
         	background:url(/shared/madmoney/silver.png) no-repeat;
         	position: absolute;			/* NEW!! was position:relative; but that caused IE6 to expand #banner */
         	top:0px;
         	left:0px;
         	z-index:2;
         }

			/* NEW!! This ultra-safe hack allows IE6 and IE5 to use PNG alpha transparency. The * html and _ hacks
				make sure that no other browsers see this (each acheives the same thing, but using both is more
				future-proof. The IE proprietary AlphaImageLoader filter then serves up the .png file (but it
				can't use repeat, unfortunately). See http://msdn2.microsoft.com/en-us/library/ms532969.aspx */
			
			* html #banner .photo {
				_background: none;
				_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/shared/madmoney/silver.png');
			}

			
#banner{
	width:700px;
	height:200px;
	position:absolute;
	top:37px;
	left:60px;
	z-index:1;
}

			/* NEW!! Removed all IE7 hacks
			
         *:first-child+html #banner .photo{
         }

         *:first-child+html #banner{
         	position:relative;
         	top:-20px;
         	left:60px;
         }
			*/


#banner span{
	position: absolute;
	left: -9999px;	
}

			/* NEW!! Several changes to how #content is coded cure multiple IE bugs. Before, #content had been
				floated, which required clear: both to be applied to the footer, which in turn was causing
				#emailsignup and #banner to disappear in IE for some bizarre reason. It was easier to just return
				it to the normal flow. */
			
         #content{
         	width:465px;
         /*	float:right;						NEW!! it's easier to just leave it in the normal flow */
         	margin: 0 0 20px 295px;		/* NEW!! this was margin:182px 140px 20px 0; */
         	min-height:350px;
				padding-top: 198px;			/* NEW!! replaces the 182px top margin, which IE wrongly collapses */
         }

         /* NEW!! An ultra-safe hack for IE6 and IE5 only, combining the Tan hack and the Pixy hack. The
         	* html makes sure that only IE5/6 see any of this (and the underscores act as a backup). */
         
         * html #content { 		
            _height: 350px;		/* IE5/6 treats this as if it were min-height  */
            }
			
			/* NEW!! Removed all IE7 hacks
         *:first-child+html #content{
         	margin-top:-20px;
         }
			(*/

/*--------- NAVIGATION ---------*/

			/* NEW!! Solved an IE6 expanding box problem, caused by setting the navigation div to be 50px wider
				than the container div. */
				
         #navigation{
         	width: 900px;			/* NEW!! was 950px, but this made no sense since #container is only 900px */
         	height:37px;
         	margin-top:0px;
         	background:url(/shared/madmoney/silver-nav_bg.png) top left no-repeat;	
         	text-align:center;
         }
			
         /* NEW!! Removed all IE7 hacks
         *:first-child+html #navigation{
         }
			*/

         
			/* NEW!! IE was displaying this differently from the other browsers (higher and further to the right),
				due to different default top and left margins on the ul element. */
				
         #navigation ul{
         	padding:14px 0 0 75px;
				margin: 0;			/* NEW!! this forces consistency between browsers */
         }

			
#navigation a{
	font-size:11px;
	font-weight:bold;
	font-family:verdana;
	color:#009933;
	text-decoration:none;
	text-transform:uppercase;
	border-right:1px solid #009933;
	padding:0 8px;
}

#navigation a#navlinks{
	border-right:none;
}

#navigation a:hover{
	text-decoration:underline;
	color:#ccc;
}

#navigation ul li{
	list-style:none;
	float:left;
}
			/* NEW!! Removed all IE7 hacks
         *:first-child+html #navigation ul{
         }
			*/

.home #navhome, .blog #navblog, .index #navindex, .music #navmusic, .contact #navcontact,   .press #navpress, .news #navnews, .photos #navphotos, .guestbook #navguestbook,  .links #navlinks, .calendar #navcalendar, .bio #navbio, .store #navstore {
	text-decoration: underline;
	color:#ccc;
}

/*-------- LEFT BAR ----------*/

#emailsignup{
	width:188px;
	height:86px;
	color:#fff;
	position:absolute;
	z-index:4;
	top:278px;
	left:77px;
	font-weight:bold;
	background:url(/shared/madmoney/silver-email.jpg) no-repeat;
	padding:23px 0 0 24px;
}

.band{
	width:188px;
	height:188px;
	color:#fff;
	position:absolute;
	z-index:4;
	top:355px;
	left:17px;
	font-weight:bold;
background: url(/images/dangerscallin4-cropped-cd.jpg) 0 0 no-repeat;
	padding:23px 0 0 24px;		
}
/*--------- FOOTER ---------*/

			/* NEW!! Eliminated clear: both; which caused #emailsignup and #banner to disappear in IE. Since
				#content is now longer floated, clearing is no longer needed. */
				
         #footer{
         	color:#999;
         	font-size:9px;
         /*	clear:both;					NEW!! no longer needed */
         	width:718px;
         	height:20px;
         	background: #272727;
         /*	padding-right:; 			NEW!! bad code didn't so anything anyway */
         	margin-left:70px;
         	font-weight:bold;
         	text-align:center;
         }

#footer p{
	font-size:11px;
	padding-top:4px;
}



/*--------- HEADERS ---------*/

         h1{
         	color:#ccc;
         	font-size:24px;
         	font-family:impact;
         	font-weight:normal;
         	text-align:right;
         	margin-bottom:30px;
				margin-top: 0;				/* NEW!! This forces consistency between browsers (especially IE) */
	      }
			
			/* NEW!! Removed all IE7 hacks
         *:first-child+html h1{
         }
			*/

h2{
	color:#669966;
	font-size:24px;
	font-weight:bold;
	font-family:helvetica;
}




/*--------- LINKS ---------*/

a{
	color:#009933;
	text-decoration:none;
}

a h2{
	color:#009933;
	text-decoration:none;	
}

a:hover, a h2:hover{
	text-decoration:underline;
	color:#ccc;
}

.music #content ul { list-style-type: none;	padding: 0;	margin: 10px 0 0; }
.mp3_hifi, .mp3_lofi,
.m3u_hifi, .m3u_lofi,
.m3u_hifi_clip, .m3u_lofi_clip { background: url('/shared/madmoney/btn-music.png') no-repeat 0 2px; line-height: 21px; padding: 2px 0 2px 20px; }
.photos dl { padding: 0; }
.photos dt { font-size: 12px; padding: 0 0 10px; text-align: center; }
.photos dd { text-align: center; margin: 0;	padding: 0 0 30px; }
.press .caption { margin: 0 40px 0;	padding: 0; }
.products .caption { padding: 10px 0 0; }
.entry { margin: 0 0 15px; }
.entry .name, .entry .act {	font-size: 18px; margin: 0 0 0 30px; }
.entry ul {	margin: 10px 0 0 60px; }
.guestbook h2 {	color: #669966; font-size: 18px; margin: 0 10px; }
.guestbook h3 { font-size: 12px; }
#postForm {	margin: 0 0 30px; padding: 10px; height: 300px; }
#postForm label { color: #666; display: block; margin: 0 auto 1px auto; padding: 3px; width: 300px; }
#postForm input, #postForm textarea { background: #eaeaea; border: 1px solid #999; color: #666; display: block; font: 12px normal Arial, Helvetica, sans-serif; margin: 0 auto 10px auto; padding: 1px 4px; width: 300px; } 
#postForm input:hover, #list_submit:hover { background:#f1f1f1; border: 1px solid #333; color: #333; }
/* Captcha stuff */ 
#postForm img#gbimage {
	width: 100px;
	float: left;
	margin-left: 74px;
}

#postForm label.security_code_label {
	width: 200px;
	margin-left: 10px;
	float: left;
}

#postForm input#security_code {
	width: 180px;
	float: left;
	margin-left: 10px;
	background: #fff;
}

#postForm input[type=submit] {
	text-align: center;
	margin-top: 10px;
	clear: both;
}

input#gbname, input#gbaddress, textarea#gbcomment { background: #fff; }
input#gbname:hover, input#gbaddress:hover {  background:#fff; border: 1px solid #999; color: #666; }
.links dl { padding: 0 0 15px 10px; }



			/* NEW!! standard tweak for splash page images */

         #splashimage { text-align: center; margin: 100px auto; }
         #splashimage a img { border: 0; }