/* 
	Designed by  Deonya Fields, www.deonya.com  -  Kokomo IN US
	
	Bugfixed by Andrew Tay (www.andrewtay.com) for HostBaby.com May 2007 
   All styles that have been changed are indented
	
	- due to what was obviously a typo, the font-size for h4 was set to 9em (i.e. absolutely enormous).
	  Normally, h4 only appears on the calendar page but the bug didn't show up because .calendar h4 is set to
	  1.1em. The simple fix was to set h4 font-size globally to 1.1em

*/


#accessibility {
  display: none;
}

* {
  margin: 0;
  padding: 0;
}

body {
  margin: 0px auto 30px;
  color: #333333;
  text-align:center;
  font: normal .8em/2em Arial, Helvetica, sans-serif;
  	font-style: normal;
	font-weight: normal;
	font-variant: normal;
  background: #e8ebf1;
}

a:link {
	color: #212837;
	text-decoration: none;
	background-color: transparent;
	border-width: 0px;
	font-weight: bold;
}

a:visited {
  color: #5f739d;
  text-decoration: none;
  background-color: transparent;
  border-width: 0px;
  font-weight: bold;
}

a:hover, a:active {
  color: #5f739d;
  text-decoration: none;
  background-color: transparent;
  border-bottom: 1px dashed #5f739d;
  font-weight: bold;
}

         h1 {
         	font-size: 1.7em;
         	color: #343f56;
         	background: url(/shared/mic/3_bg_title.jpg) no-repeat;
         	height: 40px;
         	width: 482px;
         	margin-bottom: 10px;			/* NEW!! was padding-bottom, but switching to margin allows collapsing */         
			}
         
         
         h2 {
           text-transform: lowercase;
           color: #343f56;
           font-weight: bold;
           font-size: 1.3em;
           letter-spacing: 1px;
           margin: 10px 0 5px 0;			/* NEW!! margin-top was 0px, but this helps layout immensly */
         }

h3 {
  text-transform: lowercase;
  color: #343f56;
  font-weight: bold;
  font-size: 1.3em;
  letter-spacing: 1px;
  margin: 0 0 5px 0;
}

         h4 {
           font-size: 1.1em;		/* NEW!! was 9em, an obvious typo */
           font-style: italic;
           margin: 2px 10px 10px 0;
           color: #764400;
         }

input {
	background: #FFFFFF;
	border: 1px solid #343f56;
	color: #343f56;
	font-size: 12px;
	margin: 2px 2px 2px 2px;
	padding: 2px;
}

#container {
  position: relative;
  margin: 0px auto;
  padding: 0;
  width: 704px;
  border: none;
  text-align: left;
  background: url(/shared/mic/3_bg_content.jpg) repeat-y center;
}

#navigation ul {
	margin: 0px auto;
	padding-top: 200px;
	padding-bottom: 15px;
	width: 100%;
	width:100%;
	color: #ffffff;
	text-align: center;
	font-weight: bold;
	background: url(/shared/mic/3_bg_header.jpg) no-repeat;
	border: none;
}

#navigation ul li {
  display: inline;
}

#navigation ul li a {
  color: #ffffff;
  text-decoration: none;
  padding: 4px;
}

#navigation ul li a:hover {
  background: #212837;
  color: #ffffff;
  border: none;
}

#banner {
  position: absolute;
  top:150px;
  right: 20px;
  width: 410px;
  text-align: right;
}

#banner .band span {
  color: #9eaac4;
  font-size: 36px;
  font-weight: bold;
}

#banner .photo span {
  display: none;
}

#emailsignup {
  float:left;
  color: #343f56;
  font-weight: bold;
  text-align: center;
  width:167px;
  height:81px;
  padding: 8px 0px 0px 0px;
  background: url(/shared/mic/3_bg_newsletter.jpg) no-repeat;
  position: absolute;
  left: 10px;
}

#content {
  margin: 0px 10px 0px 182px;
  padding: 0px 10px 10px;
}

#footer {
  clear: both;
  height: 108px;
  width: 704px;
  background: url(/shared/mic/3_bg_footer.jpg) no-repeat bottom;
}

#footer p {
  width:100%;
  color: #212837;
  width: 95%;
  text-align: right;
  padding-top: 60px;
}

li {
	list-style: none;
}

img {
	border: none;
}

/*** Music ***/

.music .details {
	margin-bottom: 20px;
	border-bottom: 1px solid #343f56;
	width: 95%;
}

.music #content li {
	list-style-image: url(/shared/mic/3_sound_icon.jpg);
	margin-left: 23px;
	padding-bottom: 5px;
}

/*** /End Music ***/

/*** Calendar ***/


			/* NEW!! New styling for calendar when it's chosen to appear on the home page */

			.home #calendar {
				border-top: 1px solid #343f56;
				margin-top: 15px;
				padding-top: 15px;
			}
			
			/* NEW!! These next two statements were previously applied at the page class level 
			(e.g. .calendar .entry instead of #calendar .entry. Doing it this way has the added 
			advantage that the styling also affects the calendar when it's on the home page */
			
         #calendar .entry {
         	margin-bottom: 20px;
         	border-bottom: 1px solid #343f56;
         	width: 95%;
         	padding-bottom: 15px;
         }

         #calendar h2, #calendar h3, #calendar h4, #calendar .entry, #calendar p {
         	color: #343f56;
         	font-size: 1.1em; 
         	font-style: normal;
         	font-weight: normal;
         	font-variant: normal;
         	line-height: 1.1em;		/* NEW!! Was 1em, but text looked a little too bunched together */
         }
			
			/* NEW!! improves spacing and makes the calendar a lot clearer */
			#calendar .entry p {
				margin-top: 10px;
			}

/*** /End Calendar ***/

/*** Photos ***/

.photos dt {
	color: #fff;
	padding: 2px 2px 2px 8px;
	width: 95%;
	font-weight: bold;
	margin-bottom: 4px;
	background: #212837;
	font-size: 1em;
}

.photos dd {
	margin-bottom: 20px;
}

.photos img {
	background: url(/shared/mic/3_bg_img.jpg);
	padding: 6px;
	border: 1px solid #212837;
}

/*** /End Photos ***/

/*** Store ***/

.products table {
	margin-bottom: 15px;
	border-bottom: 1px solid #212837;
	width: 98%;
}

.products img {
	margin-top: 5px;
	margin-right: 10px;
	margin-bottom: 10px;
	background: url(/shared/mic/3_bg_img.jpg);
	padding: 6px;
	border: 1px solid #212837;
}

.products hr {
	visibility: hidden;
}
/*** /End Store ***/

/*** Guestbook ***/

#postForm {
	height: 300px;
	background: #e8ebf1;
	border: 1px solid #212837;
	font-weight: bold;
	color: #343f56;
	font-size: 12px;
	margin: 4px 4px 15px;
	width: 320px;
	padding: 8px;
}
#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;
}

/*** /End Guestbook ***/


			/* NEW!! several minor tweaks to improve text flow, margins and layout */

			dd 		{font-style: italic;}
			h2 		{margin-top: 10px;}
				
			p 			{margin: 0 0 0.2em 0;}		/* NEW!! Improves visual rhythm of text */
				
			.links dl {
				line-height: 1.5em;
				}
			
			.products .details {
				margin-bottom: 1em;
				}
			
			.guestbook blockquote {
				margin-bottom: 1.5em;
				}

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