/* CSS Document */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td, cite { 	
	margin : 0; 
	padding : 0 }

a {
	text-decoration: none}

body, p, th, td{
	font-family:"Comic Sans MS", sans-serif;
	color:#ff0}
	
body{
	background-color:#06f}
	
#fixed_sidebar{
	position:fixed;
	top:10px;
	left:50%;
	margin-left:-446px;
	padding:5px
	}
	
#footer{
	position:relative;
	padding-bottom:35px
	}
	
#female{
	position:absolute;
	left:669px;
	top:650px}
	
#male{
	position:absolute;
	left:744px;
	top:266px}
	
#smilingboy{	
	position:absolute;
	left: 791px;
	top: 114px
	}
		
#allcontent{
	position:relative;
	background-color:#00f;
	width:800px;
	margin-left:auto;
	margin-right:auto;
	border-left:#ff0 solid 5px; 
	border-right:#ff0 solid 5px
	}
	
#allcontent p{
	font-size:110%;
	line-height:1.5em;
	padding-right:5px;
	padding-left:5px}
	
/*this is the styling for the main content of the page*/	
#content{
	width:600px;
	float:right;
	padding-top:30px;
	padding-right: 50px}
	


a.links {
	font-style:italic;
	color:#ff0}
	
	
#content p.home{
	font-size:170%;
	text-align:left;
	padding-bottom:20px}/*this gives more spacing between paragraphs in line with the larger font*/
	
#content p.about{
	font-size:130%;
	padding-bottom:10px}
	
#content p.italic{
	font-size:130%;
	padding-bottom:10px;
	font-style:italic}	
	
h3.about{
	font-weight:bold;
	font-size:140%}
	
h2{
font-size:1.25em;
padding-top:10px}
	
	
/*this is the end of styling for the main content of the page*/	
ul{
	width:110px;
	list-style:none;
	position:relative;
	text-decoration:none;
	padding-left:10px;
	padding-top:20px}
	
li{
	position:relative}
	
li a{
	height: 120px;
	width: 120px;
	text-decoration: none;
	text-indent:-1000em;
	display: block;
	outline:none
}
/*using display block makes the above a work with the image */

/*BUTTONS*/
#navheader #nav li#home a {background-position: 0 0}
#navheader #nav li#about a {background-position: 0 -120px}
#navheader #nav li#when a {background-position: 0 -240px}
#navheader #nav li#where a {background-position: 0 -360px}
#navheader #nav li#contact a {background-position: 0 -480px}
#navheader #nav li#comments a {background-position: 0 -600px}
#navheader #nav li#courses a {background-position: 0 -720px}

/*OVER STATES*/
#navheader #nav li#home a:hover {background-position: -120px 0}
#navheader #nav li#about a:hover {background-position: -120px -120px}
#navheader #nav li#when a:hover {background-position: -120px -240px}
#navheader #nav li#where a:hover {background-position: -120px -360px}
#navheader #nav li#contact a:hover {background-position: -120px -480px}
#navheader #nav li#comments a:hover {background-position: -120px -600px}
#navheader #nav li#courses a:hover {background-position: -120px -720px}

/*PRESSED STATES*/
#navheader #nav li#home a:active {background-position: -240px 0}
#navheader #nav li#about a:active {background-position: -240px -120px}
#navheader #nav li#when a:active {background-position: -240px -240px}
#navheader #nav li#where a:active {background-position: -240px -360px}
#navheader #nav li#contact a:active{background-position: -240px -480px}
#navheader #nav li#comments a:active {background-position: -240px -600px}
#navheader #nav li#courses a:active {background-position: -240px -720px}

/*ON STATES*/

#navheader.home #nav li#home a {background-position:-360px 0 }
#navheader.about #nav li#about a {background-position: -360px -120px}
#navheader.when #nav li#when a {background-position: -360px -240px}
#navheader.where #nav li#where a {background-position:-360px -360px}
#navheader.contact #nav li#contact a{background-position: -360px -480px}
#navheader.comments #nav li#comments a {background-position: -360px -600px}
#navheader.courses #nav li#courses a {background-position: -360px -720px}




li#home a, 
li#about a,
li#when a,
li#where a,
li#contact a,
li#comments a,
li#courses a,

li#home a:active, 
li#about a:active,
li#when a:active,
li#contact a:active,
li#comments a:active,
li#courses a:active,

li#home a:hover,   
li#about a:hover,   
li#when a:hover,  
li#where a:hover,   
li#contact a:hover,  
li#comments a:hover,   
li#courses a:hover {
	background-image:url(Images/4blobs.jpg)}
	
/*styling for when page */

table.whentable{
	width:600px;
	border-collapse:collapse;
	margin-top:20px;
	margin-bottom:20px}
	
table.whentable td, .whentable th{
	border:solid 2px #0066ff}
	
table.whentable td{
	width:14.28%}
	
table.whentable th{
	font-size:160%;
	padding:10px 0 10px 0}
	
.trdays{
	text-align:center;
	font-weight:bold}

p.closed{
	color:#f00}
	
/*end of styling for when page */

/*styling for contact page */
#content.contact{
	margin: 15px 0 0 0;
	padding: 0
}
	
#content fieldset{
	width:450px;
	border:2px solid #ff0;
	padding: 10px
}
	
#content legend{
	font-weight:bold;
	font-size:120%;
	padding:5px;
	margin: 0 5px 0 5px
}
	

	
#content label.fixedwidth{
	display:block;
	width:240px;
	float:left;
	line-height: 120%;
	font-size: 110%
}
	
#content input{
	line-height:150%}
	
#content .buttonarea input{
	background:#00f;
	color:#ff0;
	font-weight:bold;
	font-size:120%;
	padding:5px;
	text-align:center}
	
#content p.contactfield{
	margin:10px 0 10px 0;
	font-size: 110%;
	padding: 0
}
	
	
/*end of styling for contact page */
/*styling for where page*/

#content.location p{
	padding-left:30px;
	font-size: 110%;
	line-height: 1.5em}
	
#content .map{
	padding-left:30px}

/*styling for where page*/
blockquote{
	padding-top:20px;
	font-size:1.25em;
	font-style:italic}
	
cite{
	float:right;
	padding-right:15px}


#hidden{
	display:none}

#weather{
border:#f00 3px solid}
#weather p{
color:#f00;
font-size:150%}

#tree{
	position:absolute;
	left:723px;
	top:305px;
}
a.christmas{
color:#f00;
font-style:italic
}