/* Pages 41 to 45 of the book Styling Web Pages with CSS */

body {
	width: 760px;
	font-family: Palatino, Georgia, "Times New Roman", serif;
	background-color: #f4a460;
	color: #000000;
	margin:10px auto;
	
	}
	
			/* Rules for headings */
h1 {
	position: static;
	top: 50px;
	font-size: 400%;
	text-align: center;
	color: #fff;           /* White */
	  }


h2 {
	font-size:120%;
	text-align:center;
	}

h3 {
	font-size:110%;
	text-align: center;
	}

h4{
	font-size: 110%;
	text-align: center;
	color: #00cc33;    /* Bright Green */
	}
	
p {
	font-size:100%;
	line-height:105%;
	}
				/* Masthead */
#masthead {
	margin: 0;
	width:760px;
	height:165px;
	background-color: #008b8b;   /* Dark Cyan */
	border: 2px solid #000;
	top: 65px;
	}

#masthead h1 {
	margin: 0;
	padding: 0;
	}

#masthead h4 {
	position: static;
	top: 120px;
	}
			/* Content */

/* This is the CSS for the project on Pages 28 - 33 of the book */
/* Only one container element allowed per page */
/* we're not styling the footer but the paragraphs in the footer */

#container {
	width:100%;
	background-color: #ebebeb;
	padding: 0;
	border-right: 3px solid #ebebeb;
	bottom: 10px;
	}
		
#sidebar {
	width: 170px;
	float:left;
	}
	
#sidebar ul{
	list-style: none;
	margin: 0;
	padding: 0;
	}
	
#sidebar li {
	border-bottom: 2px solid #ed9f9f;
	}
	
#sidebar li a:link, #sidebar li a:visited {
	font-size: 90%;
	display: block;
	padding: 0.4em 0 0.4em 0.5em;
	border-left: 12px solid #711515;
	border-right; 2px solid #711515;
	background-color: #b51032;
	color: #ffffff;
	text-decoration: none;
	}
	
	#sidebar li a:hover {
	background-color: #711515;
	color: #ffffff;
	}
	
#maincontent {
		margin-left: 11.5em;
		
		}
 
#banner{
	width: 735px;
	height: 350px;
	background-color: #778899;  /* light slate gray - all */
	padding: 0 10px 0 10px;
	border: 4px solid #778899;
	
	}
				/* Footer */ 
 #footer { 
	clear:both;     
	margin: 0;  
	padding: 0;  
	width:760px; 
	background-color: #f4a460;  /* Sandy Brown */ 
  	}
			/* Reusable class for columns in the footer */  
.footerCol {    
	float:left;     
	width:155px;    
	margin-left: 0px; 
	 }
			/* Spacer div to follow multiple floated items */ 
 
 .spacer {   
 clear: both;      
		} 

#one {       /*Column 1*/
	width: 165px;
	height: 435px;
	background-color: #ffe4b5;
	padding: 0 10px 0 10px;
	margin: 0 0 10px 0;
	border: 2px solid #000000;
	}

#two {           /*Column 2*/
	width: 163px;
	height: 435px;
	background-color: #ffa500;
	padding: 0 5px 0 5px;
	margin-left: 29px;
	border: 2px solid #000000;
	}

#three {             /*Columm 3*/
	width: 165px;
	height: 433px;
	background-color: #778899;  /* light steel gray - all */
	padding: 0 5px 0 5px;
	margin-left: 51px;
	border-top: 3px solid #778899;
	border-left: 3px solid #778899;
	border-bottom: 2px solid #000000;
	border-right: 3px solid #778899;
	}

#four {        /*Column 4*/
	width: 198px;
	height:435px;
	margin-left: 76px;
	background-color:#ffe4e1;
	padding: 0 10px 0 10px;
	border: 2px solid #000000;
	}
	
#footer ul { 	 
	margin: 0;
	padding: 0 0 0 25px; 
	line-height: 150%; 	   
	} 
	
#footer fieldset { 
 	margin: 0; 	 
 	border: 0; 	 
 	padding: 0; 	   
	}
	
.footerCol img { 	  
	float: left; 	  
	border: 2px solid #999; 	 
	margin: 0 5px 10px 0; 	
	 }