Theme Name: joelsoutherland
Theme URI: http://www.joelsoutherland.com/
Version: 1.0
Author: Hungry Dog Media
Author URI: http://www.hungrydogmedia.com/
*/


@import url('style/reset.css');
@import url('style/typography.css');

* {margin : 0;padding : 0;}
html,body{margin:0;padding:0}
body{background: #2e2e2e;font-family : Arial, Helvetica, sans-serif;font-size :11px;text-align:left;color : #77767b;line-height:16px}
#container{width:927px;margin:0 auto;text-align:left;border-left: 3px #fff solid;border-right: 3px #fff solid;}

/********************************************************
************************HEADER***********************/
#header {background: url('images/header.jpg') no-repeat;width: 933px;height: 112px;margin: 50px auto 0 auto;}
	/********************************************************
	************************NAVIGATION***********************/
		/* Begin CSS Drop Down Menu */
		#menu {background-color: #000;border-top: 1px #fff solid;border-bottom: 1px #fff solid;}
		
		.nav, .nav ul { 
			list-style: none;
			margin: 0;
			padding: 0;
			height: 35px;
		}
		
		.nav {
			z-index: 100;
			position: relative;
		}
		.nav a,.nav a:hover{
			text-decoration:none
		}
		.nav li {
			float: left;
			margin: 0;
			padding: 0;
			position: relative;
			border-right: 1px #fff solid;
		}
		.nav li#home,.nav li#home a{
			background:#fff;
			color: #000;		}
		.nav li a, .nav li a:link, .nav li a:active, .nav li a:visited {
			display: block;
			font-size:14px;
			padding:10px;
			color:#fafeff;
		}
		
		.nav li hover {
			background:#494343 url('images/nav-li-h.gif') repeat-x;
		}

		#nav li:hover a, 
		#nav li.sfHover a {
			background:#fff;
			color: #000;
		}
		.nav li:hover ul {
			left: auto;
			margin-bottom:0;
			margin-top:12px
		}
		.nav li:hover ul li {
			width:200px;
		}
		#nav li:hover ul a, 
		#nav li.sfHover ul a {
			background:#494343;
		}
		#nav li:hover ul li, 
		#nav li.sfHover ul li {
			border-bottom:1px #3f3939 solid;
			margin-left:-1px;
		}
		
		
		#nav li:hover ul a:hover, 
		#nav li.sfHover ul a:hover {
			background:#5d6067 url('images/nav-li-ul-h.gif') repeat-x;	
		}
		
		.nav ul {
			list-style: none;
			margin: 0;
			width: 100px;
			position: absolute;
			top: -999em;
			left: -1px;
		}
		.nav li:hover ul,
		.nav li.sfHover ul {
			 top: 25px;
		 }
		.nav ul li {
			border: 0;
			float: none;
		}
		.nav ul a {
			border-bottom: 0;
			padding-right: 20px;
			white-space: nowrap;
		}


/*******************************************************
*******************CONTENT******************************/
.weclcome {
	height: 238px;
	border-bottom: 1px #fff solid;
}
.img {
	background: url('images/img.jpg') no-repeat;
	width: 925px;
	height: 238px;
	border-right: 1px #fff solid;
}
.ctop {
	background: url('images/ctop.jpg') no-repeat;
	width: 621px;
	height: 4px;
}
.cbottom {
	background: url('images/cbottom.jpg') no-repeat;
	width: 621px;
	height: 4px;
}
#content{width:621px;float:left;margin: 5px 0 5px 5px;background: #0d0d0d;}
.post h2, .post h2 a:hover, .post h2 a:visited, .post h2 a {font-weight : bold;text-decoration : none;color : #fff;font-size: 18px;padding-bottom: 5px;}
.post {margin-bottom : 10px;padding: 10px;}
.post ul, .post ol {margin-left : 25px;}
.entry {padding :10px 10px 10px 0;min-height: 150px;}
	.entry img {
		max-width: 550px;
	}
small {background: #1a1924;padding : 3px 5px;font-family : Arial, Helvetica, sans-serif;font-size : 11px;color : #77767b;}
blockquote {background-repeat: no-repeat;background-position: left top;margin:10px;font-family : Georgia, "Times New Roman", Times, serif;color : #555;clear: both;padding-top: 15px;padding-left: 38px;}
code {font : 14px 'Courier New', Courier, Fixed;display : block;overflow : auto;text-align : left;margin : 10px 0 10px 0;padding : 5px 10px 5px 10px;background : #eee;border-top : 1px solid #ccc;border-bottom : 1px solid #ccc;width: 95%}
p.postmetadata {margin-bottom : 10px;font-size: 11px}
.navigation {display : block;font-size : 16px;font-weight : bold;text-transform : uppercase;padding:20px 5px;}
	.alignleft {float : left;text-align : left;}
	.alignright {float : right;text-align : right;}


/*******************************************************
*******************CONTENT2******************************/
#content2{width:918px;float:left;margin: 5px 0 5px 5px;background: #0d0d0d;}
.post h2, .post h2 a:hover, .post h2 a:visited, .post h2 a {font-weight : bold;text-decoration : none;color : #fff;font-size: 18px;padding-bottom: 5px;}
.post {margin-bottom : 10px;padding: 10px;}
.post ul, .post ol {margin-left : 25px;}
.entry {padding :10px 10px 10px 0;min-height: 150px;}
	.entry img {
		max-width: 550px;
	}
	.thumbnail {
		width: 150px;
		height: 125px;
		float: left;
		margin-right: 10px;
		margin-top: 0;
		padding: 0;
	}
small {background: #1a1924;padding : 3px 5px;font-family : Arial, Helvetica, sans-serif;font-size : 11px;color : #77767b;}
blockquote {background-repeat: no-repeat;background-position: left top;margin:10px;font-family : Georgia, "Times New Roman", Times, serif;color : #555;clear: both;padding-top: 15px;padding-left: 38px;}
code {font : 14px 'Courier New', Courier, Fixed;display : block;overflow : auto;text-align : left;margin : 10px 0 10px 0;padding : 5px 10px 5px 10px;background : #eee;border-top : 1px solid #ccc;border-bottom : 1px solid #ccc;width: 95%}
p.postmetadata {margin-bottom : 10px;font-size: 11px}
.navigation {display : block;font-size : 16px;font-weight : bold;text-transform : uppercase;padding:20px 5px;}
	.alignleft {float : left;text-align : left;}
	.alignright {float : right;text-align : right;}

/*******************************************************
*******************SIDEBAR******************************/
.stop {
	background: url('images/stop.jpg') no-repeat;
	width: 281px;
	height: 5px;
}
.sbottom {
	background: url('images/sbottom.jpg') no-repeat;
	width: 281px;
	height: 5px;
}
#sidebar{float:right;width:281px;background: #0d0d0d;margin:5px 5px 0 0 ;}
#sidebar a,#sidebar a:visited {color:#77767b;text-decoration: none}
#sidebar ul {list-style : none;margin-bottom : 20px;}
#sidebar ul ul  {list-style-type: none;margin: 0;padding: 0px 0 10px 5px;}
#sidebar ul ul ul {margin: 0 0 0 5px;padding:0;}
#sidebar ul ul ul ul{margin: 0 0 0 5px;padding:0;}
#sidebar ul li {line-height : 21px;}
#sidebar ul ul li {margin-left : 10px;list-style: disc}
#sidebar ul ul ul li {margin-left : 15px;}
#sidebar ul h2 {font-size : 16px;line-height: 21px;font-weight : bold;color : #fff;text-align : left;}
table#wp-calendar{
width: 100%;
}
/*******************************************************
*******************COMMENTS******************************/
h3#comments,h3#respond {
	color : #656971;
	margin-left:5px;
	margin-bottom: 20px;
}
h3#respond{
	border-top:1px #ccc dotted;
	padding-top:10px;
}
ol.commentlist .left{
	width: 150px;
	float: left;
}
ol.commentlist .right{
	width: 400px;
	float: left;
	margin-bottom: 20px;
	padding: 0 10px;
}
#auth{
	padding:10px 10px;
}
.avatar {
	padding : 3px;
	border : 1px solid #ccc;
	margin:0 5px 5px 0;
	float: left;
}
ol.commentlist {
	list-style-type : none;
	margin-bottom: 20px;
}
ol.commentlist li {
    width: 650px;
}
.authcomment {
	border-bottom : 0px;
} 
.authcomment .right{
	background-color: #333 !important;
} 
small.commentmetadata{
	padding-bottom: 5px;
	float: right;
}
span.comauth{
	margin-bottom : 12px;
	font-family : Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	color:#666;
}
#comment_title {
	margin-bottom : 5px;
}
#commentform {
	margin-bottom : 50px;
	margin-left : 10px;
}
#commentform label{
	margin-bottom : 5px;
	font-family : Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	color:#666;
}
#commentform textarea {
	width : 96%;
	padding : 5px;
	font-size : 12px;
	background : #fff;
	border : 1px solid #d2cece;
	margin:5px 0px;
}
input#author,input#email,input#url {
	width : 300px;
	padding : 4px;
	font-size : 12px;
	background : #fff;
	border : 1px solid #d2cece;
	margin:5px 0px;
}
input#submit{
	background : #d2cece;
	color:#656971;
	padding:5px;
	border:0px;
} 

/*******************************************************
*******************FOOTER******************************/
#footer{background:#2e2e2e url('images/footer.jpg') no-repeat;height: 54px;width:933px;margin-left:-3px;margin-bottom: 10px;clear: left}
#footer p{margin:0;padding:15px}
/*******************************************************
*******************Defaults******************************/
h1{
	font-size: 28px;
}
h2{
	font-size: 24px;
}
h3{
	font-size: 21px;
}
h4{
	font-size: 18px;
}
h5{
	font-size: 16px;
}
h6{
	font-size: 14px;
}
hr {display : none;}
a{color: #fff;text-decoration:none;}
a:hover{text-decoration: underline;}
img{ padding:5px;margin:5px;}
a img{border:0px;}
blockquote {
    font-style:italic;
    font-size:13px;
}
blockquote em, blockquote cite, blockquote i {
    font-style:normal;
}
input, textarea {
    font-family:Georgia, serif;
}
.caps {
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:1px;
}
.important {
    font-weight:bold;
}

/*******************************************************
*******************Search Form******************************/

/* Search form for header area */
#searchform {

}


#searchform input {
	width: 175px;
	height: 15px;
	background: #eee;
	font-size: 0.9em;
	color: #666;
	padding: 3px 3px 2px 3px;
	border: 1px solid #ccc;
}

input#searchsubmit {
	width: 40px;
	height: 20px;
	background:#333;
	margin: 0 0 0 3px;
	padding: 2px;
}
input#searchsubmit:hover {background: #000}

/* Search form for 404 Pages */
#content #searchform {

}


#content #searchform input {
	width: 300px;
	background: #eee;
	color: #666;
	border: 1px solid #ccc;
	padding: 10px;
	margin: 5px 0;
}

#content input#searchsubmit {
	width: 40px;
	height: 100%;
	background: #333;
	margin: 0 0 0 3px;
	padding: 10px 25px;
}
#content input#searchsubmit:hover {background: #000}