/*Colourful Ranch website for assignment5-4304 -Karen Passmore.*/


body {
	text-align: center;
	background: #fff url(images/background_cranch.jpg) no-repeat center top;
	font-family: Geneva, Arial, Helvetica, sans-serif;
}

#wrapper {
	width: 735px;
	margin: 0 auto;
	text-align: left;
	background: #669999;
}
/*text-align: left; added as IE5.x and IE6 does not recognize the auto margin property, plus the text-align:center: code is added to 'body'*/

#header img {
	float: left;
	padding-bottom: 3px;
	margin: 20px 0px 13px 0px;
	background: #fff;
}


/*navigation.............Marg. was at -20px 20px 25px ..............*/
#navcontainer ul { 
	margin: 0 0 0 20px; 
	padding: 0; 
	list-style-type: none; 
	text-align: center; 
	float: left;
} 

#navcontainer ul li { 
	display: inline;
	margin: 0px;
	padding: 0px;  
}


/*content...for all pages except the home and bird page................*/
#content {
	width: 530px;
	height: 100%;
	float: right;
	color: #069;
	background: #ccc;
	margin: 2px 20px 20px 0;
	border: 5px solid gray;

}

#content h2 {
	font-size: 130%;
	text-align: center;
	font-style: italic; 
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #069; background: #fff;
		
}

#content h3 {
	font-size: 100%;
	text-align: left; 
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #069; background: #ccc;
	padding: 0 5px 0 5px;
	
}

#content p {
	text-align: justify;
	padding: 2px 5px 2px 5px;
}

#content img {
	float: inherit;
	padding: 3px;
	margin: 5px;
	border: 1px solid #fff;
	background: #fff;
 }
 
 /*content...for the home page................*/
#contenthome {
	width: 530px;
	height: 100%;
	float: right;
	color: #069; background: #ccc;
	margin: 2px 20px 20px 0;
	border: 5px solid gray;
}

#contenthome h2 {
	font-size: 130%;
	text-align: center;
	font-style: italic; 
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #069; background: #fff;
	margin: 0px;
	padding: 0px;
	
}

#contenthome h3 {
	font-size: 100%;
	text-align: center; 
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #069; background: #ccc;
	padding: 0 5px 0 5px;
	
}
#contenthome a:link {
	text-decoration: none;
	color: #069;
	background: #fff;
	padding: 0px 2px;
}  

#contenthome p {
	text-align: justify;
	padding: 2px 5px 2px 5px;
}

IMG.slideshow {
    display: block;
    margin-left: auto;
    margin-right: auto;
	padding: 3px;
	border: 3px solid #ccc;
	background: #fff; color: #fff;
}
#contenthome img {
	float: inherit;
	padding: 3px;
	margin: 5px;
	border: 1px solid #fff;
	background: #fff;
 }



/*sidecolumn........................................*/

#sidecolumn {
	width: 120px;
	height: 100%;
	float: left;
	background: #918390;
	color: #000;
	margin: 55px 0 0 20px;
	padding: 2px;
	border: 3px solid white; /* ------works fine with purple BG */
}

#sidecolumn p {
	text-align: center;
	font-size: 14px;
	margin: 1px;
	padding: 5px;
}

/*links---for side Column ------*/ 

#sidecolumn a:link {
	text-decoration: none;
	color: #fff;
	background: #918390;
}  

#sidecolumn a:visited {
	text-decoration: none;
	color: #fff;
	background: #918390;
}

#sidecolumn a:hover {
	text-decoration: none;
	color:#FEEE05;
	background: #918390;
}  

#sidecolumn a:active {
	text-decoration: underline;
	color: #fff;
	background: #918390;
}  



/*SIDE COLUMN B-------------------------------*/
#sidecolumn-b {
	width: 120px;
	float: left;
	background: #918390;
	color: #000;
	margin: 40px 0 0 20px;
	padding: 2px; 
	border: 3px solid white; /* --works fine with purple BG */
}

#sidecolumn-b p {
	text-align: center;
	font-size: 14px;
	margin: 1px;
	padding: 5px;
}

#sidecolumn-b img {
	float: inherit;
	padding: 1px;
	margin: 3px;
	border: 1px solid #000;
	background: #369;
 }
 
/*links---for side Column b------*/ 

#sidecolumn-b a:link {
	text-decoration: none;
	color: #fff;
	background: #918390;
}  

#sidecolumn-b a:visited {
	text-decoration: none;
	color: #fff;
	background: #918390;
}

#sidecolumn-b a:hover {
	text-decoration: none;
	color:#feee05;
	background: #918390;
}  

#sidecolumn-b a:active {
	text-decoration: underline;
	color: #fff;
	background: #918390;
}  

 
/*SIDE COLUMN C----------*/
#sidecolumn-c {
	width: 120px;
	height: 100%;
	float: left;
	background: #918390;
	color: #000;
	margin: 40px 0 20px 20px;
	padding: 2px;  
	border: 3px solid white; /* ------works fine with purple BG  */
}

#sidecolumn-c p {
	text-align: center;
	font-size: 12px;
	margin: 1px;
	padding: 5px;
}

#sidecolumn-c img {
	float: inherit;
	padding: 1px;
	margin: 3px;
	border: none;
 }
 
 /*links---for side Column b------*/ 

#sidecolumn-c a:link {
	text-decoration: none;
	color: #fff;
	background: #918390;
}  

#sidecolumn-c a:visited {
	text-decoration: none;
	color: #fff;
	background: #918390;
}

#sidecolumn-c a:hover {
	text-decoration: none;
	color:#feee05;
	background: #918390;
}  

#sidecolumn-c a:active {
	text-decoration: underline;
	color: #fff;
	background: #918390;
}  


/*footer........................................*/
#footer {
	clear: both;
	color: #000; background: #999;
	border: 5px solid gray;
}


#footer p {
	padding: 2px 5px 2px 2px;
	text-align: left;
	font-size: 60%;
	font-family: Geneva, Arial, Helvetica, sans-serif;
}

#footer a:link {
	text-decoration: none;
	color: #000;
	background: #999;
}  

#footer a:visited {
	text-decoration: none;
	color: #000;
	background: #999;
}

#footer a:hover {
	text-decoration: none;
	color:#feee05;
	background: #999;
}  

#footer a:active {
	text-decoration: underline;
	color: #000;
	background: #999;
}