/* 
CSS for Schrott
Theme Name: SarahSchrottLCSW
Description: Sarah Schrott's professional website
Author: Frank Webster
Author URI: www.redrooster.us
.
EXPERIMENTAL
.
 */
html {
	background-color: #ccc;
	}

body {
	background-color: #ccc;
	font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif;
	margin: 0 auto;
	padding: 0 0; 
	}

/* for testing
* {
	border: 1px #000000 dashed;
	}  */

#wrapper {
	margin: 0 auto;
	padding: 0;
	width: 820px;
	/*height: 400px;*/
	}
 
	#wrapper.home {
		background: #ffffff url(images/home-bg-left.jpg) no-repeat 0 0;
		}
	#wrapper.who {
		background: #ffffff url(images/who-bg-left.jpg) no-repeat 0 0;
		}
	#wrapper.services {
		background: #ffffff url(images/services-bg-left.jpg) no-repeat 0 0;
		}	
	#wrapper.about {
		background: #ffffff url(images/about-bg-left.jpg) no-repeat 0 0;
		}	
	#wrapper.parenting {
		background: #ffffff url(images/parenting-bg-left.jpg) no-repeat 0 0;
		}	
	#wrapper.contact {
		background: #ffffff url(images/contact-bg-left.jpg) no-repeat 0 0;
		}	
	
/* HEADER */

img#clouds {
	float: left;
	margin: 0 0 0 107px; 
	}

#header {
	height: 199px;
	margin-left: 305px;
	margin-bottom: 5px;
	width: 510px;
	}
 
 	.home #header {
 		background: url(images/header-home-bg-2.gif) repeat-x ;
		/*background: #cbd599;*/
		}
		
 	.who #header {
 		background: url(images/header-who-bg-2.gif) repeat-x ;
		/*background: #cbd599;*/
		}
		
	.services #header {
 		background: url(images/header-services-bg-2.gif) repeat-x ;
 		/*background: #cdb067;*/
		}	
 	
 	.about #header {
 		background: url(images/header-about-bg-2.gif) repeat-x ;
		/*background: #cccc99;*/
		}
		
	.parenting #header {
 		background: url(images/header-parenting-bg-2.gif) repeat-x ;
		/*background: #b69b8a;*/
		}
		
	.contact #header {
 		background: url(images/header-who-bg-2.gif) repeat-x ;
		/*background: #a9b88d;*/
		}
 
	div#header img#portrait {
		float: left;
		margin: 40px 15px 30px 42px; 
		}

	div#header h1 {
		color: #ffffff;
		float: left;
		font-size: 21px;
		font-weight: normal;
		letter-spacing: 1px;
		margin: 54px 30px 22px 12px; 
		}
 
	div#header h2 {
		color: #ffffff;
		display: block;
		float: left;
		font-size: 11px;
		font-weight: bold;
		letter-spacing: 1px;
		margin: 0 50px 1px 12px;
		width: 200px; 
		line-height: 12px;
		}
 
 /* NAV */
 
div#navcontainer {
	float: left;
	margin-left: 305px; 
	height: 24px;
	width: 510px;
	background-color: #D1DAA4;
			}
 
	div#navcontainer ul {
		float: left;
		list-style: none;
		margin-top: 0;
		margin-left: 0;
		padding: 0;
		}
		
		div#navcontainer ul li {
			float: left;
			margin: 0;
			padding: 0;
 			font-size: 12px;
			font-weight: bold; 
 			border-right: 5px #ffffff solid;
			}
			
			div#navcontainer ul li a {
				float: left;
				height: 21px;
				text-decoration: none;
				padding: 3px 12px 0 11px;
				color: #ffffff;
				}
			
			div#navcontainer ul li#home a {
				background-color: #93adca;
				}
				div#navcontainer ul li#home a:hover, div#navcontainer ul li#home a#current {
					background-color: #657798;
					}
				
			div#navcontainer ul li#who a {
				background-color: #93adca;
				}
				div#navcontainer ul li#who a:hover, div#navcontainer ul li#who a#current {
					background-color: #a1a878;
					}
				
			div#navcontainer ul li#services a {
				background-color: #93adca;
				}
				div#navcontainer ul li#services a:hover, div#navcontainer ul li#services a#current {
					background-color: #d89257;
					}
				
			div#navcontainer ul li#about a {
				background-color: #93adca;
				}
				div#navcontainer ul li#about a:hover, div#navcontainer ul li#about a#current {
					background-color: #9c9478;
					}

			div#navcontainer ul li#parenting a {
				background-color: #93adca;
				}
				div#navcontainer ul li#parenting a:hover, div#navcontainer ul li#parenting a#current {
					background-color: #be7366;
					}

			div#navcontainer ul li#contact a {
				background-color: #93adca;
				}
				div#navcontainer ul li#contact a:hover, div#navcontainer ul li#contact a#current {
					background-color: #93b653;
					}

/* CONTENT */

div#content {
	/*height: 390px;*/
	margin: 100px 50px 120px 115px;
	width: 640px; }
 
div#footer { 
	height: 9px;
	background-color: #ffffff;
	}
 
div#content h2 {
	color: #93adca;
	font-size: 16px;
	font-weight: bold;
	line-height: 18px;
	margin: 20px 30px 15px 15px; }
 
h3 {
	color: #f90;
	font-size: 12px;
	font-weight: bold;
	line-height: 18px;
	margin-bottom: 5px;
	margin-left: 15px;
	margin-top: 10px;
	text-align: left; }
 
h6 {
	color: white;
	font-size: 9px;
	font-weight: bold;
	line-height: 11px;
	margin: 0 0 0 15px;
	padding: 2px 1px 1px;
	text-align: left;
	text-decoration: none; }
 
p {
	color: #555;
	font-size: 12px;
	line-height: 18px;
	margin: 0 30px 10px 15px;
	text-align: left; }
 
a { text-align: left; }

a#email {
	text-decoration: none;
	color: #ffffff;
	}
a#email:hover {
	color:#f7f583;
	} 
	
#content a.contact {
	text-decoration: none;
	color: #555;
	}
	
#content a.contact:hover {
	text-decoration: none;
	color: #f90;
	}