/*
---------------------------
Hostbaby Wizard Template Design: version 9: Appalachian #2
author: Dave Kobrenski/BBM Designs
http://www.bbmdesigns.com
version: 27 june 2005
---------------------------

	Bugfixed by Andrew Tay (www.andrewtay.com) for HostBaby.com July 2007 - August 2008
   All styles that have been changed are indented

	- calendar styling is now applied at the div level instead of the page level (#calendar instead 
	  of .calendar). This means the styling gets applied to the calendar when it's chosen to appear on the home
	  page, too.
	- minor tweak to margins on home page image
	- fixed background images: an odd bug turned up, where the background images for #container and #footer
	  were shifted 1px to the left (i.e. misaligned with the banner background image), but only in FF3 and IE7.
	  the reason? these images were 801px wide, while the banner image was 1600px wide. both were centered, but
	  since one has an odd-numbered width and the other had an even-numbered width, whether they were aligned
	  or not basically came down to the mathematical intricacies of each browser. the solution was to crop
	  1px off the left side of each image in photoshop. the new images are called main-##a.jpg and
	  footer-##a.jpg, instead of main-##.jpg and footer-##.jpg.

*/

body {
	background: #000 url(/shared/perfect/header-9.jpg) repeat-x center top;
	margin: 0;
	padding: 0;
	font-family: Georgia, Times New Roman, Times, serif;
	font-size: 13px;
	line-height: 1.6em;
	text-align: center;
}

/* Accessibility -------------------------- */

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

/* Basic HTML ----------------------------- */

div, h1, h2, h3, h4, h5, ul, li, dl, dt, dd, form, blockquote {
	margin: 0;
	padding: 0;	
}

/* Main Structure -------------------------- */

			/* NEW!! Replaced original 801px-wide image with new, better 800px-wide image */
			
         #container {
         	margin: 0 auto;
         	width: 800px;
         	background: transparent url(/shared/perfect/main-8a.jpg) repeat-y center top;
         	position: relative;
         }

#navigation {
	position: absolute;
	top: 235px;
	left: 118px;
	width: 171px;
	background-color: #fff;
	text-align: left;
	background: #E5E3DD url(/shared/perfect/nav_round_bot-3.gif) no-repeat center bottom;
}

#emailsignup {
	position: absolute;
	top:620px;
	left:120px;
	width:180px;
	text-align: left;
	color: #52659D;
	font-weight: bold;
}

#emailsignup input {
	margin: 0 6px;
}

#banner {
	margin: 0 auto;
	width: 800px;
	height: 270px;
	background: transparent url(/shared/perfect/header-9.jpg) repeat-x center top;
	font-weight: bold;
}

/* fixes bizarre 1px discrepancy on IE Win versions 5+ */
/* with IE5/Mac backslash filter \*/
* html #banner {
 	padding: 0 1px;
}
/* end IE5mac filter */

#banner {
	width: 802px; /* for IE5 Win */
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 800px;	 /* actual value */
}

html>body #banner {
	width: 800px; /* for Opera */
}

.photo {
	position: absolute;
	top: 78px;
	left: 118px;
	height: 130px;
	width: 170px;
background: transparent url(/images/ssmstylelogo-170x130-01.jpg) no-repeat center center;
	border: 1px solid #000;
}

.photo span {
	display: none;
}

.band {
	color: #fff;
	font: 30px Georgia, Times New Roman, Times, serif;
	text-transform: uppercase;	
	font-weight: bold;
	letter-spacing: .2em;
	text-align: left;
	float: left;
	padding-top: 26px;
	margin-left: 100px;
	line-height: 1em;
	display: inline;
}

#content {
	position: relative;
	float: left;
	display: inline;
	width: 360px;
	text-align: left;
	margin-left: 309px;
	margin-top: -190px;
	background: none;
}

/* Begin min-height workaround */

/* for Mozilla/Safari/Opera */
*>#content {
 	padding-top: 600px;
 	min-height: 1px;
}

*>#content h1 {
 	margin-top: -600px;
}

/* for IE, with IE5 Mac backslash filter \*/
* html #content {
 	height: 600px;
}
/* end min-height workaround */

			/* NEW!! Replaced original 801px-wide image with new, better 800px-wide image */
			
         #footer {
         	width: 800px;
         	height: 132px;
         	margin: 0 auto;
         	background: transparent url(/shared/perfect/footer-8a.jpg) no-repeat center top;
         	padding-top: 1px;
         	text-align: left;
         	clear: both;
         }

/* fixes bizarre 1px discrepancy on IE Win versions 5+ */
/* with IE5/Mac backslash filter \*/
* html #footer {
 	padding: 0 1px;
}
/* end IE5mac filter */

#footer {
	width: 802px; /* for IE5 Win */
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 800px;	 /* actual value */
}

html>body #footer {
	width: 800px; /* for Opera */
}

#footer p {
	padding: 32px 109px 0 125px;
	color: #666;
	font-size: 11px;
}

/* Navigation Links --------------------------- */

#navigation ul {
	padding-top: 20px;
	padding-bottom: 30px;
	background: transparent url(/shared/perfect/nav_round_top-6.gif) no-repeat center top;
}

#navigation li {
	padding-top: 1px;
	padding-bottom: 1px;
	margin: 0;
	background-color: #E5E3DD;
}

#navigation ul, #navigation li {
	position: relative;
}

#navigation li a {
	display: block;	
	line-height: 24px;
	margin: 0;
	padding: 1px 8px 1px 18px;
	height: 1em;
	color: #404E7A;
}

html>body #navigation li a {
	height: auto;
}

#navigation li a:hover {
	background-color: #F6F4EE;
	text-decoration: none;
	color: #D3854C;
	background-image: none;
}

/* Active Navigation Links --------------------------- */

body.home a#navhome,
body.bio a#navbio,
body.music a#navmusic,
body.contact a#navcontact,
body.press a#navpress,
body.news a#navnews,
body.calendar a#navcalendar,
body.photos a#navphotos,
body.products a#navproducts,
body.guestbook a#navguestbook,
body.links a#navlinks,
body.home a#navhome:hover,
body.bio a#navbio:hover,
body.music a#navmusic:hover,
body.contact a#navcontact:hover,
body.press a#navpress:hover,
body.news a#navnews:hover,
body.calendar a#navcalendar:hover,
body.photos a#navphotos:hover,
body.products a#navproducts:hover,
body.guestbook a#navguestbook:hover,
body.links a#navlinks:hover {
	background-color: #CAC8C3;
	color: #fff;
	background-image: none;
}

/* Header elements -------------------------- */

h1 {
	height: 33px;
	width: 315px;
	background-color: transparent;
	background-position: left top;
	background-repeat: no-repeat;
	background-image: url(/shared/perfect/pgh6_welcome.gif);
	padding-bottom: 5px;
	border-bottom: 2px solid #E2C09A;
}

h1 span {
	display: none;
}

h2 {
	margin: 12px 0 6px 0;
	color: #C98941;
	font-size: 1.4em;
	font-weight: bold;
}

h2 span.date {
	display: block;
	margin: 3px 0 0 0;
	text-align:right;
	font-size: 13px;
	padding-top: 3px;
	border-top: 1px solid #E2C09A;
	font-style: italic;
	color: #666;
	font-weight: normal;
}

h3 {
	font-size: 15px;
	font-weight: bold;
	color: #000;
	margin: 12px 0 0 0;
}

/* Links -------------------------------- */

a {
	font-weight: bold;
}

a:link {
	color: #3E578B;
	text-decoration: none;
}

a:visited {
	color: #3E578B;
	text-decoration: none;
}

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

a:active {
	color: #3E578B;
}

a img {
	border: 1px solid #fff;
}

a:hover img {
	border: 1px solid #CA863D;
}

/* images -------------------------- */

img {
	padding: 3px;
	border: 1px solid #ccc;
}

/* Lists -------------------------------- */

ul, li {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

dl {
	margin-top: 12px;
}

dt {
	font-weight: bold;
}

dd {
	margin-bottom: 16px;
	padding-bottom: 18px;
	border-bottom: 1px solid #ccc;
}

/* Page Headers (Replacement Images) ----------------- */

body.home #content h1 {
	background-image: url(/shared/perfect/pgh6_welcome.gif);
	height: 30px;
}

body.bio #content h1 {
	background-image: url(/shared/perfect/pgh6_bio.gif);
	height: 39px;
}

body.music #content h1 {
	background-image: url(/shared/perfect/pgh6_music.gif);
	height: 30px;
}

body.contact #content h1 {
	background-image: url(/shared/perfect/pgh6_contact.gif);
	height: 26px;
}

body.press #content h1 {
	background-image: url(/shared/perfect/pgh6_press.gif);
	height: 26px;
}

body.news #content h1 {
	background-image: url(/shared/perfect/pgh6_news.gif);
	height: 26px;
}

body.calendar #content h1 {
	background-image: url(/shared/perfect/pgh6_calendar.gif);
	height: 30px;
}

body.photos #content h1 {
	background-image: url(/shared/perfect/pgh6_photos.gif);
	height: 30px;
}

body.products #content h1 {
	background-image: url(/shared/perfect/pgh6_products.gif);
}

body.products #content h1 {
	background-image: url(/shared/perfect/pgh6_store.gif);
	height: 26px;
}

body.guestbook #content h1 {
	background-image: url(/shared/perfect/pgh6_guestbook.gif);
	height: 30px;
}

body.links #content h1 {
	background-image: url(/shared/perfect/pgh6_links.gif);
	height: 30px;
}

body.video #content h1 {
	background-image: url(/shared/perfect/pgh6_video.gif);
	height: 30px;
}

/* Page Specific Stuff ----------------- */

.artist {
	font-style: italic;
	color: #666;
}

body.music .details li {
	margin-left: 12px;
}

.name {
	font-weight: bold;
}

/* for the contact page */

body.contact .entry ul {
	margin-left: 12px;
}

/* for the press page */

body.press .entry {
	margin: 12px 0 18px 0;
	background: transparent url(/shared/perfect/quote_lft.gif) no-repeat left top;
	padding-bottom: 10px;
	border-bottom: 1px solid #F5A500;
}

blockquote {
	position: relative;
	text-indent: 30px;
	background: transparent url(/shared/perfect/quote_rt.gif) no-repeat right bottom;
	padding-right: 30px;
	padding-top: 4px;
	z-index: 100;
}

body.press .caption {
	text-align: right;
	font-style: italic;
	font-weight: bold;
}

/* for the calendar page */

			/* NEW!! Before, these were styled at the page level (using body.calendar or .calendar for short).
			Now that calendars can also appear on the	home page, they are styled using div#calendar or
			#calendar for short. Calendars are always contained within a #calendar div, no matter what page
			they're on. Good, no? */

         #calendar .entry {
         	border-bottom: 1px solid #ccc;
         	padding-bottom: 4px;
         	margin-bottom: 14px;
         }
         
         address {
         	font-style: italic;
         }
         
         #calendar .entry p {
         	margin: 0 0 0 10px;
         	color: #4C4C4C;
         }

/* for the guestbook page */

body.guestbook #postForm {
	border: 1px solid #ccc;
	padding: 9px;
	background: transparent url(/shared/perfect/trans_bck.gif) repeat 0 0;
	margin: 16px 0;
}

body.guestbook #postForm label, 
body.guestbook #postForm input {
	display: block;	
}

body.guestbook #postForm input {
	height: 16px; /* for IE5 mac */
}

/* hide real value from IE5 Mac \*/
body.guestbook #postForm input {
	height: auto;
}
/* end hack */

body.guestbook #postForm label {
	font-weight: bold;
}

body.guestbook #postForm input, body.guestbook #postForm textarea {
	width: 300px;
	margin-bottom: 12px;
}

body.guestbook .entry {
	padding-bottom: 10px;
	border-bottom: 1px solid #F5A500;
}

body.guestbook blockquote {
	text-indent: 0px;
	background-image: none;
}

#guestbook h2, #guestbook h3 {
	
}

#guestbook .entry {
	
}

/* for the products page */

body.products div.products h2, body.products div.products p {
	margin: 0;
}

body.products div.products .entry {
	border-bottom: 1px solid #ccc;
	padding-bottom: 4px;
}

body.products div.products form table {
	border-collapse: collapse;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	margin: 12px 0;
}

body.products div.products form table td, body.products div.products form table th {
	padding: 3px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

body.products div.products form table th {
	font-weight: bold;
	background-color: #F1F0EB;
	text-align: center;
}

/* for the links page */

body.links dt h3 a {
	font-size: 13px;
	font-weight: normal;
}

			/* NEW!! minor tweak home page image */

         .home img {margin: 1em 0; display: block;}	/* NEW!! display: block triggers margin collapse */

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