﻿/*/////////////////////////////////////////////////////////////////////*/
/*CSS Stylesheet for City of West Columbia Website coded by Keith Ward*/
/*////////////////////////////////////////////////////////////////////*/

/*///////////////*/
/*SITE BACKGROUND*/
/*///////////////*/
body {
	background: #FFFFFF url('../images/wc_back.jpg') no-repeat center top;
}

/*//////////////*/
/*NAVIGATION BAR*/
/*//////////////*/
#navigation ul {
	width: 970px;
	height: 50px;
	position: relative;
	top: 187px;
	background: url('../images/navbar.png') no-repeat 0 0;
	list-style: none;
	margin: 0 auto;
	padding: 0;
	text-align: center;
}
#navigation li {
	display: inline;
}
#navigation li a:link, #navigation li a:visited {
	border: none;
	width: 97px;
	height: 50px;
	display: block;
	position: absolute;
	top: 0;
	text-indent: -7000px;
	outline: none;
}
#navigation li.home a:link, #navigation li.home a:visited {
	left: 0;
}
#navigation li.history a:link, #navigation li.history a:visited {
	left: 97px;
}
#navigation li.recreation a:link, #navigation li.recreation a:visited {
	left: 194px;
}
#navigation li.districts a:link, #navigation li.districts a:visited {
	left: 291px;
}
#navigation li.culture a:link, #navigation li.culture a:visited {
	left: 388px;
}
#navigation li.quality a:link, #navigation li.quality a:visited {
	left: 485px;
}
#navigation li.education a:link, #navigation li.education a:visited {
	left: 582px;
}
#navigation li.location a:link, #navigation li.location a:visited {
	left: 679px;
}
#navigation li.utilities a:link, #navigation li.utilities a:visited {
	left: 776px;
}
#navigation li.contact a:link, #navigation li.contact a:visited {
	left: 873px;
}
#navigation li.home a:hover {
	background: url(../images/navbar.png) no-repeat 0 -50px;
}
#navigation li.history a:hover {
	background: url(../images/navbar.png) no-repeat -97px -50px;
}
#navigation li.recreation a:hover {
	background: url(../images/navbar.png) no-repeat -194px -50px;
}
#navigation li.districts a:hover {
	background: url(../images/navbar.png) no-repeat -291px -50px;
}
#navigation li.culture a:hover {
	background: url(../images/navbar.png) no-repeat -388px -50px;
}
#navigation li.quality a:hover {
	background: url(../images/navbar.png) no-repeat -485px -50px;
}
#navigation li.education a:hover {
	background: url(../images/navbar.png) no-repeat -582px -50px;
}
#navigation li.location a:hover {
	background: url(../images/navbar.png) no-repeat -679px -50px;
}
#navigation li.utilities a:hover {
	background: url(../images/navbar.png) no-repeat -776px -50px;
}
#navigation li.contact a:hover {
	background: url(../images/navbar.png) no-repeat -873px -50px;
}
#navigation li.home a:active {
	background: url(../images/navbar.png) no-repeat 0 -100px;
}
#navigation li.history a:active {
	background: url(../images/navbar.png) no-repeat -97px -100px;
}
#navigation li.recreation a:active {
	background: url(../images/navbar.png) no-repeat -194px -100px;
}
#navigation li.districts a:active {
	background: url(../images/navbar.png) no-repeat -291px -100px;
}
#navigation li.culture a:active {
	background: url(../images/navbar.png) no-repeat -388px -100px;
}
#navigation li.quality a:active {
	background: url(../images/navbar.png) no-repeat -485px -100px;
}
#navigation li.education a:active {
	background: url(../images/navbar.png) no-repeat -582px -100px;
}
#navigation li.location a:active {
	background: url(../images/navbar.png) no-repeat -679px -100px;
}
#navigation li.utilities a:active {
	background: url(../images/navbar.png) no-repeat -776px -100px;
}
#navigation li.contact a:active {
	background: url(../images/navbar.png) no-repeat -873px -100px;
}

/*/////////////*/
/*DROP BOX MENU*/
/*/////////////*/
#dropbox {
	top:200px;
	width:956px;
	height:110px;
	margin: 0 auto;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	font-size:medium;
	font-weight:bold;
	position:relative;
	text-decoration:none;
}

/*//////////*/
/*MAIN IMAGE*/
/*//////////*/
#mainimg {
	width: 956px;
	height: 298px;
	position: relative;
	top: 192px;
	margin-top: 0px;
	margin: 0 auto;
	text-align: center;
	z-index: 1;
}

/*////////////*/
/*MAIN CONTENT*/
/*////////////*/
#maincontent {
	width: 990px;
	position: relative;
	top: 220px;
	margin-top: 0px;
	margin: 0 auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	z-index: 2;
}

/*//////*/
/*FOOTER*/
/*//////*/
* {
	margin: 0;
}
html, body, #wrap {
	height: 100%;
}
body > #wrap {
	height: auto;
	min-height: 100%;
}
#main {
	padding-bottom: 177px;
}
/* must be same height as the footer */
#footer {
	position: relative;
	top: 150px;
	margin-top: -177px; /* negative value of footer height */;
	height: 177px;
	clear: both;
	background-image: url('../images/footer.png');
	text-align: center;
	margin: 0 auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	font-weight: bold;
	text-decoration:none;
}
/* CLEAR FIX*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/* End hide from IE-mac */
