/*
Theme Name: Superbland v.1.0 
Theme URI: http://www.superbland.co.uk/ 
Description: Version 1, superbland wordpress theme. 
Author: Jon White 
Author URI: http://www.superbland.co.uk/ 
Version: 1.0  
*/ 

@import 'reset.css';

/* -------- Colour Key -------- */
 /*

Dark Grey			#6b6a6a		(headers and text)
---------------------------
Light Grey			#bababa		(h5)
---------------------------
Paper				#f7f7ef		(main background colour)
---------------------------
Lighter Paper		#ededdc		(even comments)
---------------------------
Darker Paper		#dcdccb		(odd comments)
---------------------------
Dark yellow/brown	#c6c4b5		(borders)


*/
/* ---------------------------- */

body{
	font-size:100%;
	line-height:1.25em;
	height:100%;
	background:url(../../../../_assets/images/bg2.gif);
	margin:2px 10px 20px 20px;
}

b.clear{
	float:none;
	display:block;
	clear:both;
}

/*------------------

Typhography
------------------*/

/* links */
a{color:#3b3b3b; text-decoration:none;}
a:hover{color:#8d8e8e; text-decoration:underline;}
a:active{color:#aaaaaa; text-decoration:underline;}


h1, h2, h3{
	color:#6b6a6a;
	font-family:"Trebuchet MS", Verdana, Arial, Helvetica;
	font-weight:bold;
}

h2{
	font-size:2.50em;
	line-height:0.875em;
	margin-top:1em;
}

h3{
	font-size:1.625em;
	line-height: 0.769231em;
}

h4{
	font-size:1.125em;
	line-height: 1.111em;
	color:#6b6a6a;
	font-weight:normal;
	font-family:Verdana, Arial, Geneva, Helvetica, sans-serif;
}

h5{
	font-size:1.125em;
	line-height: 1.111em;
	color:#bababa;
	font-weight:normal;
	font-style:italic;
	font-family:Verdana, Arial, Geneva, Helvetica, sans-serif;
}

small{
	font-size:0.625em;
	line-height:2.0em;
	color:#6b6a6a;
	font-family:Verdana, Arial, Geneva, Helvetica, sans-serif;
}


p, li, input, label, textarea{
	font-size:0.875em;
	line-height:1.429em;
	color:#6b6a6a;
	font-family:Verdana, Arial, Geneva, Helvetica, sans-serif;
}

label{
	font-weight:bold;
	line-height:2.143em;
}

br{line-height:1.429em;}


em{
	font-weight:normal;
	font-style:italic;
	color:#6b6a6a;
}

p.error, ul.error, ul.error li{color:#CC0000;}

/*------------------

Inputs
------------------*/

input, textarea{
	background-color:#ddddcc;
	border:1px solid #c6c4b5;
}

input:hover, input:focus,
textarea:hover, textarea:focus{
	background-color:#efefe5;
}

input#submit{background-color:#ddddcc;}

input#submit:hover{cursor:pointer;}


/*------------------

Positioning
------------------*/

#container{
	width:950px;
	background:transparent;
	margin:0px auto;
}

#header{
	float:left;
	clear:left;
	width:940px;
	height:140px;
	background:transparent;
}

#logo{
	float:left;
	width:475px;
	height:140px;
	background:url(../../../../_assets/images/header-sprites.png) no-repeat 0px 0px transparent;
}

#logo h1{text-indent: -9000px;}


#descriptive{
	float:left;
	width:465px;
	height:140px;
	background:url(../../../../_assets/images/header-sprites.png) no-repeat -475px 0px transparent;
}

#navbar{
	float:left;
	width:370px;
	height:40px;
	background:transparent;
	margin:20px 0 0 33px;
}

#content-box{
	float:left;
	width:655px;
	background-color:#f7f7ef;
	border:1px solid #c6c4b5;
	padding-bottom:50px;
}

#inner-content{
	float:left;
	width:465px;
	margin-left:95px;
	background:transparent;
}

#sidebar{
	float:left;
	width:235px;
	margin-left:10px;
	display:inline;
	background-color:#f7f7ef;
	border:1px solid #c6c4b5;
	padding:1em 10px 50px 20px;
}


/*------------------

Navigation

------------------*/

/* css sprites technique, with a little JQuery 
extra divs also need to be pre-styled (it works better with a new div for some reason)
*/

ul.nav{
	position:absolute;
	width:370px;
	height:40px;
	background:url(../../../../_assets/images/sprites4.png) no-repeat 0px 0px;
}

.nav li {display: inline;}

.nav li a, .nav li a:hover{width:85px;}

.nav li a, .nav li div{
	position: absolute;
	top: 0;
	height: 56px;
	text-indent: -9000px;
	overflow: hidden;
}
.nav li div {width:85px;}

/* default button positions */
.nav #nav-about a{left:0px;}
.nav #nav-work a, .nav #nav-work div{left:95px;}
.nav #nav-blog a, .nav #nav-blog div{left:190px;}
.nav #nav-contact a, .nav #nav-contact div{left:285px;}


/* hover and selected states */
.nav li a:hover{height:56px; }
.nav #nav-about a:hover, .nav #nav-about div{background:url(../../../../_assets/images/sprites4.png) no-repeat 0px 0px;}
.nav #nav-work a:hover, .nav #nav-work div{background:url(../../../../_assets/images/sprites4.png) no-repeat -95px 0px;}
.nav #nav-blog a:hover, .nav #nav-blog div{background:url(../../../../_assets/images/sprites4.png) no-repeat -190px 0px;}
.nav #nav-contact a:hover, .nav #nav-contact div{background:url(../../../../_assets/images/sprites4.png) no-repeat -285px 0px;}

/* show full label and do not show link cursor where the current page corresponds to the navigation */
#about .nav #nav-about a,
#work .nav #nav-work a,
#blog .nav #nav-blog a,
#contact.nav #nav-contact a{
	height:56px;
	cursor:default;
}  

/* position current states */
#about .nav #nav-about a{background:url(../../../../_assets/images/sprites4.png) no-repeat 0px 0px;}
#work .nav #nav-work a{background:url(../../../../_assets/images/sprites4.png) no-repeat -95px 0px;}
#blog .nav #nav-blog a{background:url(../../../../_assets/images/sprites4.png) no-repeat -190px 0px;}
#contact .nav #nav-contact a{background:url(../../../../_assets/images/sprites4.png) no-repeat -285px 0px;}

/*------------------

Blog Specific

------------------*/

h3#comments{padding:1em 0em;}

textarea#comment{
	white-space:normal;
	overflow:hidden;
	width:446px;
}

#inner-content p, #inner-content h4{margin-bottom:1em;}
#inner-content h4{font-weight:bold;}

ol.commentlist li{padding:10px 10px 1em 10px;}

ol.commentlist li p{padding-top:1em;}

ol li.thread-even{background-color:#ededdc;}

ol li.thread-odd{background-color:#dcdccb;}

#respond{margin-top:1em;}

input#author{margin-top:2em;}

.archive-category, .archive-month{margin:1em 0}

#sidebar ul{margin-top:0.5em;}

#sidebar ul li{
	font-size:0.750em;
	text-indent:10px;
}

#sidebar div{margin:0.5em 0;}