/*
Theme Name: Design Resilience
Theme URI: http://wordpress.org/
Description: Design Resilience blog for HOK
Version: 1.0
Author: TOKY Branding + Design
Author URI: http://toky.com/
Tags: 

*/

*{
	margin: 0;
	padding: 0;
}

body{
	font-family: arial, verdana, sans serif;
	font-size: 13px;
	line-height: 17px;
	letter-spacing: -.2px;
	color: #333333;
	background-color: #eaedee;
}

/***********************
	COMMON ELEMENTS
***********************/
a{
	color: #57a0ba;
	text-decoration: underline;
	outline: none;
}

a img{border: none;}

a:hover{color: #000;}

/***********************
	MAIN CONTAINERS
***********************/
#page{
	background: #f6fafb url("images/bground-gradient.gif") top left repeat-x;
	padding-bottom: 28px;
}

#header, #footer, #content{
	position: relative;
	width: 888px;
	margin: 0 auto 0;
}

/***********************
	HEADER
***********************/
#header{
	height: 141px;
	height: 117px;
	background: url("images/bground-header.png") top left no-repeat;
	_background: url("images/bground-header-ie6.gif") top left no-repeat;
}

#header h1{
	position: absolute;
	top: 0;
	right: -10px;
}

#header #pages{
	list-style: none;
	position: absolute;
	top: 44px;
	left: 36px;
}

#header #pages li{
	display: inline;
	padding-right: 5px;
}

#header #pages li a{
	text-transform: uppercase;
	font-size: 9px;
	font-weight: bold;
	text-decoration: none;
}

#header #pages li.active a:link, #header #pages li.active a:visited, #header #pages li.active a:hover {color: #979696;}
#header #pages li a:hover { color: #000000; }

/***********************
	CONTENT
***********************/
#content{
	overflow: auto;
	background: url("images/bground-content.png") top left repeat-y;
	_background: url("images/bground-content-ie6.gif") top left repeat-y;
}

#mainContent{
	width: 562px;
	float: left;
	padding: 5px 0 0 36px;
	padding-top: 29px;
}

#mainContent.home{padding-top: 12px;}

#mainContent.category{padding-top: 0;}
#mainContent.single{padding-top: 49px;}

.back{
	width: 75px; 
	margin: 0 0 12px;
	font-size: 11px; 
	line-height: 13px; 
	display: block; 
	font-weight: bold; 
	text-transform: uppercase;
}
.back.bottom{margin-top: 16px;}

.post{
	padding: 10px 0;
	overflow: auto;
	clear: both;
}

#mainContent.category .post{
	border-bottom: 2px solid #cccccc;
	padding: 7px 0;
}

.post h2{font-size: 20px; line-height: 22px; font-weight: normal;}
.post h2.home{font-size: 24px; line-height: 20px;}
.post h2 a:link, .post h2 a:visited, .post h2{color: #a4c94b; text-decoration: none;}
.post h2 a:hover {
	color:#000000;
}
.post .postmetadata a{text-decoration: none;}
#mainContent.category .post h2{padding-bottom: 0;}
#mainContent.category .post h2.thumbnail{width: 420px; float: left; display: block;}

.post h5{font-size: 9px; font-weight: bold; text-transform: uppercase; line-height:11px; }
.post h5.continue{padding-top: 6px;}

.post p{padding: 7px 0 0;}
#mainContent.category .post p{padding: 0;}
.post ul, .post ol{padding: 6px 0 0 17px;}
.post ul li, .entry ul li {
	padding: 0 0 0 11px;
	list-style: none;
	background: url("images/bullet-entry.gif") 2px 4px no-repeat;
}
.post img.alignright {
	float:right;
	display:inline;
	margin-left:10px;
	margin-bottom:10px;
}
.post img.alignleft {
	float:left;
	display:inline;
	margin-right:10px;
	margin-bottom:10px;
}
.post ol li{margin-left: 20px;}
.post a.pdf, .post a.email, .post a.word, .post a.excel, .post a.external {
	padding-left:20px;
	height:16px;
	padding-bottom:1px;
}
.post a.pdf { background:transparent url(images/icon-link-pdf.gif) no-repeat; }
.post a.email {	background:transparent url(images/icon-link-mailto.gif) no-repeat; }
.post a.word { background:transparent url(images/icon-link-word.gif) no-repeat; }
.post a.excel { background:transparent url(images/icon-link-excel.gif) no-repeat; }
.post a.external { background:transparent url(images/icon-link-go.gif) no-repeat; }

.excerpt{overflow: auto;}
.excerpt.thumbnail{width: 420px; clear: left; _height: 60px; _overflow: visible; _vertical-align: top;}
#mainContent.category .post .thumbnail_image{float: right; width: 131px;}
#mainContent.category .post .thumbnail_image img{_width: 131px; _height: 131px;}

h3#comments{font-size: 9px;
	line-height: 9px;
	color: #000;
	font-weight: bold;
	margin-top: 1px;
	padding: 10px 0;
	border-top: 4px solid #d3d2d0;
}

.commentlist{
	padding: 1px 0 5px;
	border-bottom: 5px solid #d3d2d0;
}

.commentlist li{
	border-top: 1px solid #d3d2d0;
	padding: 11px 0 6px;
	overflow: auto;
	list-style: none;
}

.commentlist li .commentDate, .commentlist li .commentAuthor{
	font-size: 10px;
	line-height: 10px;
	color: #000;
}

.commentlist li .commentAuthor{padding: 3px 0 0;}
.commentlist li .commentAuthor a{
	font-weight: bold;
	background: none;
	text-decoration: none;
}

.commentlist li .commentText{
	padding: 11px 0 3px;
	font-size: 11px;
}

#commentform{width: 480px; overflow: hidden;}
#respond h3{font-size: 9px;
	line-height: 9px;
	color: #000;
	font-weight: bold;
	margin-top: 1px;
	padding: 10px 0;
}

#commentform input{
	margin-bottom: 9px;
	width: 250px;
}

#commentform label{
	position: relative;
	*top: -10px;
}

#commentform textarea{
	width:445px;
	height: 115px;
	margin-bottom: 9px;
}

#commentform #submit{
	width: auto;
}

/***********************
	SIDEBAR
***********************/
#sidebar{
	width: 250px;
	padding-right: 7px;
	padding-top: 24px;
	float: right;
}

#sidebar h4{padding: 0 0 10px 10px; height: 8px; line-height: 8px;}
#sidebar h4.title_categories{padding-top: 5px;}

#searchform{padding: 2px 0 18px 10px; position: relative;}
#searchform #s{
	background: url("images/bground-search.gif") top left no-repeat;
	border: none;
	width: 177px;
	height: 16px;
	padding: 5px 3px 3px;
	margin-right: 3px;
}

#searchform #searchsubmit{
	width: 61px;
	height: 24px;
	position: absolute;
	right: 0;
	top: 2px;
	*top: 3px;
}

#categories, #resources, .delicious{list-style: none; padding-bottom: 11px;}
#categories{padding-bottom: 14px;}
#categories li, #resources li, .delicious li{
	padding: 0 5px 5px 11px;
	line-height: 13px;
	letter-spacing: 0;
	background: url("images/bullet-sidebar.gif") top left no-repeat;
}

#categories li a, #resources a, .delicious a{font-weight: bold;}
.delicious a{text-decoration: none;}
#categories li p.description{color: #000; font-size: 10px; padding: 1px 0 0;}
#categories li p.count{color: #888888; font-size: 9px; font-weight: bold; text-transform: uppercase;}

.delicious{padding-bottom: 0;}
.delicious li{background: none; font-size: 11px; color:#AAAAAA;}
.delicious li a { display:block;}

.readMore{font-size: 11px; font-weight: bold; padding: 0 5px 5px 11px; margin: 0; position: relative; top: -5px;}
.readMore a{display: block; text-decoration: none;}

#quote{
	font-size: 12px;
	line-height: 15px;
	color: #575757;
	font-style: italic;
	padding: 0 0 19px 21px;
	position: relative;
	width: 220px;
}
#quote .author{
	display: block;
	font-size: 9px;
	font-weight: bold;
	color: #a4a4a4;
	text-transform: uppercase;
	font-style: normal;
	padding: 3px 0 0;
}

#quote .source{display: none;}

#quote .opening_quote{font-size: 17px; position: absolute; left: 13px;}
#quote .closing_quote{font-size: 17px;}

/***********************
	FOOTER
***********************/
#footer{
	padding-top: 56px;
	height: 80px;
	top: -28px;
	position: relative;
	background: url("images/bground-footer.png") top left no-repeat;
	_background: url("images/bground-footer-ie6.gif") top left no-repeat;
}

#footer h3#hok{
	width: 18px;
	height: 18px;
	position: absolute;
	left: 11px;
	top: 51px;
}

#footer #info{
	width: 410px;
	float: left;
	padding-left: 4px;
}

#footer #info h2{
	position: absolute;
	left: -5px;
	padding: 3px 0 0;
}

#footer #info h3{
	padding-left: 31px;
	font-size: 11px;
	line-height: 15px;
	color: #000;
	font-weight: bold;
}

#footer #info p{
	padding-left: 31px;
	font-size: 10px;
	line-height: 14px;
	color: #000;
}

#footer #info a{color: #484545; background: none;}

#footer #subscribe{
	width: 200px;
	float: right;
	line-height: 12px;
	text-align: right;
	font-size: 10px;
	padding: 1px 4px 0;
}

#footer #subscribe a{color: #333333; background: none;}
#footer #subscribe img{vertical-align: bottom; padding-left: 4px;}

#footer #info a:hover, #footer #subscribe a:hover{color: #5d5d5d; background-color: #fff; text-decoration: none;}


/*
* * * * * * * * * * * * * *
* * * recent articles * * *
* * * * * * * * * * * * * *
*/
h3.recent {
	background:transparent url(images/text-featured-content.gif) no-repeat;
	width:144px;
	height:8px;
	text-indent:-2000px;
	margin:15px 0px 8px 6px;
}
ul#recentArticles {
	width:586px;
	overflow:auto;
	list-style:none;
	margin-bottom:15px;
}
ul#recentArticles li {
	clear:both;
	width:586px;
	border:none;
	margin:0px;
}
ul#recentArticles li ul {
	list-style:none;
	margin:0px;
}
ul#recentArticles li ul li {
	border:2px solid #EFF3F4;
	width:279px;
	float:left;
	clear:none;
	display:block;
	margin: 0 8px 8px 0;
	_margin-right: 5px;
	position: relative;
}

ul#recentArticles li ul li h2 {
	float: right;
	width: 130px;
	padding: 3px 5px 0 0;
	font-size: 17px;
	line-height: 19px;
	font-weight: normal;
	letter-spacing: -.2px;
}
ul#recentArticles li ul li h2 a{
	color:#A4C94B;
	text-decoration:none;
}
ul#recentArticles li ul li h2 a:hover { color:#000000; }
ul#recentArticles li ul li h5 {
	float: right;
	width: 130px;
	padding: 3px 5px 6px 0;
	font-size:9px;
	font-weight: bold;
	text-transform:uppercase;
	line-height: 10px;
	letter-spacing: -.2px;
	clear: right;
}
ul#recentArticles li ul li h5 a {
	color:#57a0ba;
	text-decoration:none;
}
ul#recentArticles li ul li h5 a:hover {
	color:#000000;
}

ul#recentArticles li ul li h6{
	width: 131px;
	float: left;
	padding: 6px;
}





/*
* * * * * * * * * * * *
* * * ContactForm * * *
* * * * * * * * * * * *
*/
div.wpcf7 { width:560px; overflow:hidden; }
form.wpcf7-form {
	font-size:10px;
	margin-top:8px;
}
form.wpcf7-form textarea {
	width:558px;
	margin-bottom:24px;
}
form.wpcf7-form p {
	clear:both;
	margin-bottom:10px;
}
form.wpcf7-form p span.wpcf7-form-control-wrap {
	margin-right:10px;
}
#captchaContainer {
	background:#EEEFF0 none;
	width:558px;
	padding:30px 0px;
	margin-bottom:3px;
}
#captchaContainer img {
	margin-left:40px;
	vertical-align:middle;
}
#captchaContainer span {
	margin-left:8px;
}
#captchaContainer span input {
	width:140px;
}
p#captchaInstructions {
	padding-bottom:3px;
	margin-bottom:0px;
}
p.submit {
	width:565px;
	border-top:1px solid #DCDBD9;
}



/*
pagination
*/
.wp-pagenavi {
	font-size:11px;
	font-weight:bold;
}
.wp-pagenavi a, .wp-pagenavi span.current {
	margin-right:10px;
}
.wp-pagenavi span.pages {
	display:none;
}
.wp-pagenavi span.extend {
	margin-right:10px;
}


/*
Misc.
*/
#archiveTitle{
	padding-bottom: 25px;
}
#categoryPosts{padding: 12px 0;}
h5.pagetitle {
	line-height:11px;
	font-size:9px;
	font-weight:bold;
	color:#FC3F25;
	text-transform:uppercase;
}
span.archive {
	line-height:11px;
	color:#000000;
	font-size:9px;
	font-weight:bold;
}

/*
twitter feed 
*/
ul.twitter {
	list-style:none;
	margin:0px 0px 0px 10px;
	padding:0px;
}
ul.twitter li {
	margin:0px;
	padding:0px 0px 7px;
	font-size:11px;
	line-height:14px;
}
ul.twitter li a:link, ul.twitter li a:visited {
	text-decoration:none;
	font-weight:bold;
}
