/* 
	Designed by designer: Jessica Dunn, www.vcdesignconcept.com - Franklinton Louisiana USA
	
	Tweaked by Andrew Tay (www.andrewtay.com) for HostBaby.com May 2007 
   All styles that have been changed are indented. most are located at the end of the file
	
	- image styling was once spceifc to products page but is now universal, styling homepage images as well
	- homepage image is now centered and .home p centering is now automatic instead of using margin-left
	- minor styling changes on links, products and music pages
	- fixed centering problems on calendar
	- very strange... although this variation is supposed to be simply a bright version of fleur-blue, there
	  are actually many many little differences, so this had to have many of its own fixes
	
*/


/* -- MAIN ELEMENTS --*/
input, textarea {
	background-color: #3B4143;
	border: #5A6569 1px solid;
	color: #fff;
}
hr {
	border-top: 1px dashed #3B4143;
	border-bottom: 1px solid #3B4143;
	border-left: none;
	border-right: none;
	width: 100%;
	padding-bottom: 1px;
	height: 4px;
	background: #020911;
	color: #020911;
}

body {
	background:#221509 url(/shared/fleur/blue-mainbg5.jpg) repeat-y;
	color: #fff;
	padding: 0;
	margin: 0;
	font-family: verdana, times new roman;
	font-size: 75%;

}
/* -- LAYOUT CONTAINER --*/
#container {
	width: 741px;
	text-align: left;
	background: url(/shared/fleur/blue-bg2.jpg) 312px 0 no-repeat;
	margin-left: 12px;
	padding-top:0px;
	margin-top: 0px;
}

         .home p {
         	background: #000;
         	width: 310px;
         	padding: 10px;
         	border: 1px solid #3B4143;
         /*	margin-left: 60px; 					NEW!! centering is now done automatically. see end of file. */      
			}

a {
	color: #ccccff;
	font-weight: normal;
	text-decoration: none;
}
a:hover {
	color: #ccccff;
	text-decoration: overline underline;
}

ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
}
h1 {
	display:none;
	width: 479px;
	padding-top: 0px;
	voice-family: "\"}\"";
	voice-family:inherit;
	height: 0;
}
h2 {
	color: #ffffff;
	text-transform: uppercase;
	font-family: courier new;
	font-size: 9pt;
	font-weight: normal;
	margin: 0 0 0.5em 0;
}
h3 {
	text-transform: uppercase;
	font-family: courier new;
	font-size: 9pt;
	font-weight: normal;
	color: #ffffff;
	margin: 0 0 4px 0;
	text-indent: 8px;

}

.calendar h3 {
	text-transform: uppercase;
	font-family: courier new;
	font-size: 9pt;
	font-weight: normal;
	color: #fff;

}
.calendar h4 {
	text-transform: uppercase;
	font-family: courier new;
	font-size: 9pt;
	font-weight: normal;
	color: #fff;

}

.entry {
	padding: 25px;
	background: url(/shared/fleur/blue-div.gif) bottom no-repeat;
}
.bio .entry {
	padding: 25px;
	background: url();
}
.bio p {

}
.contact .entry {
	background: #000 url();
	padding: 25px 25px 25px 20px;
	margin-left: 45px;
	width: 375px;
	border: 1px solid #3B4143;
}
.press .entry {
	padding: 0;
	background: url();
}

         .calendar .entry {
         	padding: 0px;
         /*	margin-left: 75px; 		 			NEW!! centering is now done automatically. see end of file. */
         	width: 300px;
         	background: #020911;
         	margin-bottom: 10px;
         	border: 1px solid #3B4143;
         }

.calendar p {
	margin: 10px;
	font-style: italic;
}
.products .entry {
	padding: 0;
	background: url();
}
.press .entry {
	padding: 25px;
	background: url(/shared/fleur/blue-div.gif) bottom no-repeat;
}
/* -- PICTURE PLACEHOLDERS --*/
#banner {
	background: url(/shared/fleur/blue-pic1.jpg) 0 0 no-repeat;
	width: 313px;
	height: 323px;
	top: 0;
	margin-left: 0px;
	position: absolute;

}

#banner .photo {
	width: 342px;
	overflow: hidden;
background: url(/images/Ellum1web_resized-cropped-photo.jpg) 0 0 no-repeat;
	position: absolute;
	top: 41px;
	left: 355px;
	padding-top:245px;
	height: 245px;
	height: 0;
}

#banner .band {
	width: 342px;
	overflow: hidden;
	position: absolute;
	top: 10px;
	left: 355px;
	padding-top:200px;
	height: 222px;
	voice-family: "\"}\"";
	voice-family:inherit;
	height: 0;
}
/*-- MENU -- */
#navigation {
	font-family: courier new;
	font-size: 9pt;
	background: url(/shared/fleur/blue-bg4.jpg) 0 323px no-repeat;
	height: 141px;
	text-transform: uppercase;
	padding-top: 328px;

}
#navigation ul {
	margin: 0;
	text-align: left;
	position: absolute;	
	padding: 35px 0px 0px 3px;
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 570px;

}
#navigation li {
	list-style: none;
	display: inline;
}
#navigation li a {
	color: #ccf;
	text-decoration: none;
	padding: 2px;

}

#navigation li a:visted {
	color: #ccf;
	text-decoration: none;
	padding: 2px;

}
#navigation li a:hover {
	color: #fff;
	padding-top:1px;
	padding: 2px;
}

/* -- WEBSITE CONTENT -- */
         #content {
         	margin-top: 0px;
         	padding-top: 10px;		/* NEW!! was 0, but page content was overlapping #emailsignup slightly */
         	padding-left: 10px;
         	padding-right: 250px;
         	text-align: justify;
         }

/* -- EMAIL LIST -- */

         #emailsignup {
         	width: 170px;				/* NEW!! was 204px, but this looked weird and was unlike other variations */
         	margin-left: 0px;
         	margin-top: 0;
         	margin-bottom: 0;
         	margin-right: 0;
         	padding-left: 415px;		/* NEW!! was 350px, but this looks better */
         	color: #A9B9BF; 
         }
			
#emailsignup span {
	display: block;
	width: 204px;
	font-size: 1px;
	letter-spacing: -1px;
	voice-family: "\"}\"";
	voice-family:inherit;
	height: 0;
}
#emailsignup div {
}

#emailsignup input {
	margin-right: 5px;
}
#emailsignup input[type="text"] {
	color: #A9B9BF;
	margin: 0 5px 0 0;
	border: black 1px solid;
	height: 17px;
	font-size: 9px;
	background: #3B4143;
	padding: 0;
}
#emailsignup input[type="submit"] {
	color: #A9B9BF;
	margin: 0 0 0 0;
	background: #3B4143;
	border: black 1px solid;
	voice-family: "\"}\"";
	voice-family:inherit;
	height: 17px;
	font-size: 9px;
	padding: 0;
}
.music .details {
	margin: 0 30px 15px 30px;
	color: #9C9084;
}
/* hide from ie5/mac 
.music .details {
	padding-bottom: 1px;
}
* html .music .details {
	padding-bottom: 7px;
}
/* end hide 
.music .details ul {
	margin-bottom: 0;
}
.music .details li a {
	text-decoration: none;
}
.music .details li a:hover {
	border-top: 1px solid #9E7132;
}

.music #content ul {
	background: #FFB4DC;
	list-style-type: none;
	margin: 10px 0;
	padding: 15px 20px 5px 20px;
	width: 400px;
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 360px;

}
.music .mp3_hifi_download, .music .mp3_lofi_download {
	padding: 6px 0 6px 25px;
	display: block;
}
.music .mp3_hifi_play, .music .mp3_lofi_play {
	padding: 6px 0 6px 25px;
	display: block;
}
.music blockquote {
	background: #FFB4DC;
	margin: 0;
	padding: 10px 40px;
	width: 400px;
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 320px;
}
.music blockquote p {
	margin: 0 0 1em 0;
}
.music blockquote.lyrics {
	margin-bottom: 6px;
}
*/
/* -- LINKS ON SELECT -- */
.home #navhome, .blog #navblog, .index #navindex, .music #navmusic, .contact #navcontact,   .press #navpress, .news #navnews, .photos #navphotos, .guestbook #navguestbook,  .links #navlinks, .calendar #navcalendar, .bio #navbio, .products #navproducts {
	color: #fff;
	border-top: 1px solid #000;
}

/*-- ACCESSIBILITY HIDE-- */
#accessibility {
	position: absolute;	
	left: -9999px ;
}
#footer {
	padding: 0;
	margin: 0;
}
#footer p {
	background: transparent;
	text-align: center;
	margin: 0;
	padding: 17px 290px 23px 40px;
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 410px;
	border: 0;
	height: 10px;
}

			/* NEW!! was applied to photo page only, but this styling works well on .home img too. Now it's applied
				to all images (which, of course, only appear on the home photo pages. */

         img {
         	margin: 10px;
         	padding: 10px;
         	border: solid 1px #3B4143;
         	background: #000;
         }

.photos dl {
	margin: 0 20px;
	padding: 0;
}
.photos dt {
	padding: 5px;
	background: ;
	margin: 10px 0 1px 0;
	text-align: center;
}
.photos dd {
	text-align: center;
	margin: 0;
	padding: 0;

}
.photos h1 {
	}
.calendar h2 {
	width: 300px;
	height: 39px;
	text-align: center;
	background: url(/shared/fleur/blue-calbg.gif) top;
	padding-top: 2px;

}
.calendar h3 {
	margin-left: 5px;

}
.calendar .details {
	margin: 10px;
}
#guestbook {
	margin: 0 20px 30px 20px;
}

.guestbook h2 {
	margin-bottom: 5px;
	text-transform: uppercase;
	font-family: courier new;
	font-size: 9pt;

}
.guestbook h2 a {
	text-transform: lowercase;
	
}
.guestbook h3 {
	width: 100px;
	float: left;
	margin: 15px 15px 20px 0;
	padding: 3px 3px;
	background: #000;
	text-align: center;
	border: 1px solid #3B4143;
}
#postForm {
	margin: 0 20px 0px 20px;
	padding: 10px;
	height: 330px;
}
#postForm input, #postForm label, #postForm textarea {
	display: block;
	text-align: left;
	width: 300px;
	margin: 0 auto 10px auto;
}
#postForm label {
	padding: 3px;
	margin-bottom: 1px;
	width: 294px;
}

/* Captcha stuff */ 
#postForm img#gbimage {
	width: 100px;
	position: relative;
	top: 0px;
	left: 50px;
}

#postForm label.security_code_label {
	width: 150px;
	position: relative;
	top: -65px;
	left: 57px;
}

#postForm input#security_code {
	position: relative;
	top: -65px;
	left: 70px;
	width: 160px;
}

#postForm input[type=submit] {
	text-align: center;
	position: relative;
	top: -50px;
}

.products img {
	border: 2px solid #A9B9BF;
}
.products td {
	padding: 10px;
}

.press .caption {
	text-transform: uppercase;
	font-family: courier new;
	font-size: 9pt;
	text-align: center;
	margin-left: 8px;
}

			/* NEW!! Minor adjustments to improve layout - generally, the don't override earlier settings */
			
         .home	#content		{text-align: center;}	/* NEW!! forces centering of img and p in IE */

         .home #content p	{									
				text-align: left;								/* NEW!! realigns text (part of the above IE workaround) */ 
				margin-left: auto; 							/* NEW!! centers p */
				margin-right: auto;
			}
			
         .calendar .entry {
				margin-left: auto; 							/* NEW!! centers p */
				margin-right: auto;
			}

			.links h2, .links dl	{padding-left: 25px;}	/* NEW!! because everything else is indented */
			
			.products .details {
				margin: 0 30px 15px 30px;					/* NEW!! these are the same styles as .music .details */
			/*	color: #9C9084; */
			}

			.music ul	{margin-top: 4px;}				/* NEW!! slight improvement to readability */


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