/* @override 
	http://clintmckoy.com/css/styles.css
	file:///Volumes/Macintosh%20HD/Users/clintonmckoy/Sites/New%20Clint%20McKoy%20Site/website/css/styles.css
	http://localhost:8501/ClintMcKoy/css/styles.css
	http://localhost:8500/ClintMcKoy/css/styles.css
*/

/* @group general */

* {
	margin: 0;
	padding: 0;
}

body {
	color: #fff;
	font-family: georgia, arial, times;
	background: url(../images/darkbg.jpg) repeat;
}

hr {
	border: none;
	height: 1px; line-height: 1px;
	background: #CCC;	
	margin-bottom: 10px;
	padding: 0;
}

a {
	color: #fff;
}

a:hover {
	color: #6c644e;
	text-decoration: none;
}

a img {
	border: none;
}

p, h1, h2, h3, h4, h5, h6 {
	padding: 5px;
}

.preload {
	display: none;
}

#wrapper {
	display: block;
	position: absolute;
	min-height: 100%;
	width: 100%;
}

/* The margin in "nonfooter" is what keeps the footer from overlapping the content */
#nonfooter {
	display: block;
	margin: auto;
	margin-bottom: 13em;
}

/*#musicpage #nonfooter {
	display: block;
	margin-bottom: 33em;
}*/

#top {
	background: url(../images/topbg.jpg) repeat-x;
	height: 163px;
}

#logo {
	background: url(../images/logo.jpg) no-repeat center top;
	width: 900px;
	height: 163px;
	margin: auto;
}

#middle {
	height: auto;
	width: 832px;
	margin: auto;
	color: #ccc;
	display: table;
}

#bottomwrapper {
	background: url(../images/bottombg.jpg) repeat-x;
	height: 160px;
	position: absolute;
	bottom: 0;
	width: 100%;
}

#footer {
	height: 160px;
	width: 900px;
	margin: auto;
}

#footer ul {
	float: right;
}

#footer ul li{
	list-style-type: none;
	float: left;
	padding: 10px 5px 5px;
}

#contactlink {
	clear: both;
	text-align: right;
	padding-top: 52px;
}

#contactlink a {
	text-decoration: none;
}

.smalltext {
	font-size: 16px;
}

/* @end */

/* @group nav */

#logo ul {
	width: 516px;
	float: right;
	list-style-type: none;
	padding-top: 129px;
}

#logo ul li {
	float: left;
	padding-left: 5px;
}

#welcome {
	background: url(../images/nav/welcome.jpg) no-repeat;
	width: 100px;
	height: 30px;
	display: block;
}

#welcome:hover, #welcomepage #welcome {
	background: url(../images/nav/welcome-over.jpg) no-repeat;
	width: 100px;
	height: 30px;
	display: block;
}

#music {
	background: url(../images/nav/music.jpg) no-repeat;
	width: 69px;
	height: 30px;
	display: block;
}

#music:hover, #musicpage #music {
	background: url(../images/nav/music-over.jpg) no-repeat;
	width: 69px;
	height: 30px;
	display: block;
}

#photography {
	background: url(../images/nav/photography.jpg) no-repeat;
	width: 142px;
	height: 30px;
	display: block;
}

#photography:hover, #photographypage #photography {
	background: url(../images/nav/photography-over.jpg) no-repeat;
	width: 142px;
	height: 30px;
	display: block;
}

#webdesign {
	background: url(../images/nav/webdesign.jpg) no-repeat;
	width: 121px;
	height: 30px;
	display: block;
}

#webdesign:hover, #webdesignpage #webdesign {
	background: url(../images/nav/webdesign-over.jpg) no-repeat;
	width: 121px;
	height: 30px;
	display: block;
}

#blog {
	background: url(../images/nav/blog.jpg) no-repeat;
	width: 56px;
	height: 30px;
	display: block;
}

#blog:hover, #blogpage #blog {
	background: url(../images/nav/blog-over.jpg) no-repeat;
	width: 56px;
	height: 30px;
	display: block;
}



/* @end */

/* @group pages */

#greyarea {
	list-style-type: none;
	width: 832px;
	margin: auto;
	padding-top: 10px;
	padding-bottom: 20px;
}

#greyareatop {
	width: 832px;
	height: 10px;
	background: url(../images/greybg-top.jpg) no-repeat;
}

#greyareamiddle {
	min-width: 792px;
	height: auto;
	display: table-cell;
	padding: 10px 20px;
	background: #56524f;
}

#musicpage #greyareamiddle {
	padding: 0;
	min-width: 832px;
}

#greyareabottom {
	width: 832px;
	height: 10px;
	background: url(../images/greybg-bottom.jpg) no-repeat;
}

#greyarea img {
	padding: 5px 20px;
}

#greyarea p, #greyarea h2, #greyarea h4, #greyarea ul {
	padding-left: 0;
	width: 400px;
}

.greyareatop {
	width: 832px;
	height: 10px;
	background: url(../images/greybg-top.jpg) no-repeat;
	clear: both;
}

.greyareabottom {
	width: 832px;
	height: 10px;
	background: url(../images/greybg-bottom.jpg) no-repeat;
}

#welcomepage #greyarea p, #webdesignpage #greyarea p {
	width: 580px;
}

h2, h4 {
	font-weight: normal;
	color: #fff;
}

h3 {
	font-weight: normal;
	color: #6c644e;
	padding-bottom: 0px;
}

h3 a {
	font-weight: normal;
	color: #6c644e;
}

h3 a:hover {
	font-weight: normal;
	color: white;
}

.vcenter {
	line-height: 73px;
	font-size: 17px;
}

.latestworkleft {
	float: left;
	width: 387px;
}

.latestworkright {
	float: right;
	width: 387px;
}

.latestworkleft h3, .latestworkright h3 {
	text-align: right;
}

.togglelink {
	text-decoration: none;
}

#refresh {
	width: 25px;
	height: 25px;
	display: block;
	background: url(../images/refresh.png) no-repeat;
}

#refresh:hover {
	width: 25px;
	height: 25px;
	display: block;
	background: url(../images/refresh-over.png) no-repeat;
}

#musicpage #greyarea ul {
	list-style-type: none;
	width: 800px;
	margin: auto;
}

#musicpage #greyarea ul li {
	float: left;
	padding-bottom: 10px;
	padding-top: 10px;
}

#musicpage #greyarea img {
	padding: 5px;
}

#musicpage img {
	padding: 5px 20px 5px 0;
}

#musicpage h2 img {
	padding: 0 2px;
}

#newsarea {
	width: 500px;
	float: left;
	display: table-cell;
	margin-bottom: 20px;
}

#rightcolumn {
	width: 250px;
	float: right;
	list-style-position: inside;
	border-left: 2px dotted #666;
	padding-left: 16px;
}

#photographypage #middle ul {
	list-style-type: none;
	width: 832px;
}

#photographypage #middle li {
	float: left;
	padding: 10px;
}

/*#photographypage #middle iframe {
	width: 100%;
	height: 70%;
}*/

#photoblog {
	margin-bottom: 10px;
}

#photoblog img {
	
}

.photoblogentry {

}

#photogallery {
	clear: both;
}

#webdesignpage #greyarea ul {
	list-style-position: inside;
	height: 50px;
}

#webdesignpage #greyarea ul li {
	float: left;
	padding: 5px;
}

#webdesignpage #middle #webportfolio, #webportfolio {
	list-style-type: none;
	width: 832px;
}

#webdesignpage #middle #webportfolio li, #webportfolio li {
	float: left;
	width: 387px;
	padding: 10px 13px;
}

#webdesignpage #webportfolio h4, #webportfolio h4 {
	font-size: 15px;
}

/* @end */
