/*  
Theme Name: THE WEREHAUS
Theme URI: http://www.thewerehaus.com
Description: Wordpress There for THE WEREHAUS.
Version: 1.0
Author: Mark Grothman
Author URI: http://www.thewerehaus.com
*/

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> SETUP AND RESET <<<<<*/

body, html  {
	height: 100%;
	margin: 0;
	padding: 0;
}

body  {
	font-family: Helvetica, Arial, Sans-serif;
	font-size: 13px;
	line-height: 1.3;  /*unitless for proper inheritance*/
	background: url(img/bg-main.jpg) repeat #000;
	color: #5d5d5d;
}

h1, h2, h3, h4, h5, h6  {
	margin: 0;
	color: #43442b;
	font-weight: normal;
}

h1  {font-size: 36pt}

h2.title  {
	font-size: 1.4em;
	font-family: 'Arial Black';
	width: 100%;
	float: left;
	text-transform: uppercase;
}

h2.folio-title  {
	font-size: 1.4em;
	font-family: 'Arial Black';
	width: 190px;
	float: left;
	text-transform: uppercase;
}

h3  {
	font-size: 2em;
	font-family: 'Arial Black';
	color: #2A353E;
	text-transform: uppercase;
	margin: 0 0 10px 0;
}
h4  {
	font-size: 1.6em;
	color: #43442b;
	text-transform:uppercase;
	font-weight:bold;
}

p  {
	margin: 16px 0 16px 0;
}

p.android  {
	margin: -15px 0 0 10px;
	color: #171717;
	position: relative;
	z-index: -100;
}

strong {
	font-family: "Arial Black";
	text-transform: uppercase;
	color: #5d5d5d;
	padding: 1px;
}

em {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 120%;
	color: #2A353E;
}

ul, ol  {
	margin: 0;
	padding: 0;
}

img  {
	border: none;
}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> TOP BAR <<<<<*/

a {
	color: #4c4d2c;
	text-decoration: none;
	outline: none;
}

a:hover  {
	color: #2A353E;
	text-decoration: none;
}

#nav {
	background:url(img/menu.gif) no-repeat scroll center bottom #000000;
	height:129px;
	margin-top: -129px;
	display:block;
	left:0;
	position:fixed;
	top:0;
	width:100%;
	z-index:1000;
}

.nav-bg {
	background: #2a353e;
	height: 112px;
	width: 100%;
}

.nav-wrap {
	margin: 0 auto;
	width: 980px;
	height: 112px;
}

#openCloseIdentifier {display:block;}

#nav-hitarea {
	display: block;
	height: 34px;
	left:0;
	position:fixed;
	top:0;
	width:100%;
	z-index:2000;
}

h1.logo {
	width: 99px;
	height: 91px;
	text-indent: -9999px;
	background: url(img/logo.gif) no-repeat;
	cursor: pointer;
	float: left;
	margin: 10px 0 0 20px;
}

.center-top {
	float: left;
	width: 860px;
	height: 112px;
}

.center-top ul {
	list-style:none;
}

.center-top span {
	background: #000;
	left: 3px;
	top: 0px;
	width: 20px;
	height: 112px;
	cursor:pointer;
	position:absolute;
	display: none;
	z-index: 3500;
}

.center-top span strong {
	font-family: 'Arial Black';
	font-size: 0.8em;
	width: 112px;
	height: 20px;
	left: -53px;
	top: 46px;
	color:#FFFFFF;
	text-align:center;
	position: absolute;
	text-transform: uppercase;
	-webkit-transform: rotate(90deg); 
	-moz-transform: rotate(90deg);
}

.center-top span.blog-txt {
	left: 0px;
}

.center-top span:hover {
	background: #2a353e;
}

.recent-work {
	float: left;
	width: 200px;
	height: 112px;
	margin-left: 11px;
	position: relative;
	background: #000;
	padding: 0 0 0 3px;
}

.folio {
	float: left;
	width: 200px;
	height: 112px;
	position: relative;
	padding: 0 3px;
	background: #000;
}

.blog {
	float: left;
	width: 200px;
	height: 112px;
	position: relative;
	background: #000;
}

.weekly-photo {
	float: left;
	width: 200px;
	height: 112px;
	position: relative;
	padding: 0 0 0 3px;
	background: #000;
}

.contact {
	float: left;
	width: 20px;
	height: 112px;
	background: #000;
	position: relative;
	padding: 0;
}

#nav-top {
	float: right;
	width: 187px;
	margin-top: 85px;
}

#nav-top ul  {
	padding: 0;
	list-style: none;
}

#nav-top ul li a {
	color: #171717;
	position: relative;
	float: left;
	margin: 0 20px 0 0;
	font-size: 0.9em;
	font-weight:bold;
	text-transform: uppercase;
	text-decoration: none;
}

#nav-top ul li a:hover, #nav-top .current_page_item a  {
	color: #fff;
	text-decoration: none;
}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> LAYOUT <<<<<*/

.main-wrap {
	width: 100%;
}

#header {
	width: 100%;
	height: 350px;
	background: url(img/bg.jpg) no-repeat top left;
}

#main  {
	margin: 0 auto;
	width: 980px;
	position: relative;
}

#header p  {
	margin: 0;
	text-transform: uppercase;
}

#content  {
	margin: 0 auto;
	width: 860px;
}

.titlebar {
	width: 100%;
	height: 34px;
	margin-bottom: 35px;
	border-bottom: 1px dotted #171717;
}

ul.folio-nav  {
	padding: 0;
	list-style: none;
	float: right;
	width: 670px;
}

ul.folio-nav li a {
	color: #4c4d2c;
	position: relative;
	float: right;
	margin: 0 15px 0 0;
	font-size: 0.9em;
	font-weight:bold;
	text-transform: uppercase;
	text-decoration: none;
	padding: 2px 4px 0;
}

ul.folio-nav li.current a  {
	color: #2a353e;
	text-decoration: none;
	background: #171717;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}

ul.folio-nav li a:hover {
	color: #2a353e;
	text-decoration: none;
}

ul.folio-list {
	padding: 0;
	margin: 0;
	list-style: none;
	width: 100%;
}

ul.folio-list img {
	margin-bottom: 5px;
}

ul.folio-list li {
	float: left;
	padding: 0 20px 30px 0;
}

ul.folio-list li.last {
	padding-right: 0px;
}

ul.folio-list li p{
	margin: 0;
}

ul.new-work {
	padding: 0;
	margin: 0;
	list-style: none;
	width: 100%;
}

ul.new-work li {
	float: left;
	padding: 0 20px 20px 0;
}

ul.new-work li.last {
	padding: 0 0 20px 0;
}

#footer  {
	margin: 0 auto;
	width: 860px;
	padding: 10px;
	color: #5d5d5d;
}

#footer p  {
	margin: 0;
}

#footer a {
	color: #2a353e;
}

#footer a:hover {
	color: #171717;
}

.facebook {
	float: left;
	margin: -2px 0 0 0;
}

.twitter {
	float: left;
	margin: -2px 2px 0 0;
}

.missing {
	width: 700px;
	height: 411px;
	display: block;
	background: #000 url(img/404.gif) no-repeat center;
	margin: 0 auto;
}

.folio-page .hideimg {
	display:none;
}

.folio-back {
	position: absolute;
	top: 50%;
	left: 0px;
}

.folio-left {
	float: left;
	width: 360px;
	margin: -26px 35px 0 0;
}

.folio-left p{
	color: #313131;
}

.folio-right {
	float: left;
	width: 465px;
	margin-top: 16px;
}

.folio-right img {
	background: #0e0e0e;
	padding: 5px;
	margin: 0 10px 10px 0;
}

.videobox {
	margin: 0 0 10px 0;
}

.contactinfo {margin-left: 240px;}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> POST AND ENTRY <<<<<*/

#blog {
	margin: 0 auto;
	display: block;
}

#blog h3{
	font-size: 1.4em;
	line-height: 1em;
}

#blog li {
	background: #0e0e0e;
	cursor:pointer;
	display:block;
	float:left;
	height:280px;
	margin-bottom:10px;
	margin-right:10px;
	padding:5px;
	width:123px;
}

#blog .img {
	width:123px;
	overflow: hidden;
}

#blog .post-content {
	height:280px;
	overflow: hidden;
}

.post  {
	padding: 0;
	overflow: hidden;
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}

.post .title a:link, .post .title a:visited  {
	text-decoration: none;
}

.entry blockquote  {
	color: #666;
}

.entry blockquote p  {
	margin: 0;
}

.entry blockquote.pullquote_left  {
	float: left;
	width: 150px;
	font-size: 18px;
	font-weight: bold;
	font-family: Georgia, Times, Serif;
}

.entry blockquote.pullquote_right  {
	float: right;
	width: 150px;
	font-size: 18px;
	font-weight: bold;
	font-family: Georgia, Times, Serif;
}

.entry ol  {
	padding: 0 0 0 30px;
}

.entry  ol li ol li  {
	list-style-type: lower-latin;
}

#commentform ul {
	list-style: none;
}

#commentform ul li {
	display: block;
	margin: 0 0 10px 0;
	float: left;
}

#commentform label {
	width: 120px;
	float: left;
	text-align: right;
	padding: 0 20px 0 0;
	font-size: 0.8em;
}

#commentform {
	padding-left: 100px;
}

#commentform input[type=text]{
	width: 385px;
	background: #171717;
	color: #43442B;
	border: none;
	padding: 5px;
	float: left;
	font-size: 0.8em;
}

#commentform textarea {
	width: 385px;
	background: #171717;
	color: #43442B;
	border: none;
	padding: 5px;
	float: left;
	font-family: Helvetica, Arial, Sans-serif;
	font-size: 0.9em;
}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> POST AND IMAGE NAVIGATION <<<<<*/

.prev a {
	width: 52px;
	height: 41px;
	text-decoration: none;
	text-indent: -9999px;
	background: url(img/prev.gif) no-repeat;
	position: absolute;
	top: 50%;
	left: 0px;
}


.next a {
	width: 52px;
	height: 41px;
	text-decoration: none;
	text-indent: -9999px;
	background: url(img/next.gif) no-repeat;
	position: absolute;
	top: 50%;
	right: 0px;
}

.website {
	color: #43442b;
}

.website:hover  {
	color: #2A353E;
	text-decoration: none;
	border-bottom: 1px dotted #171717;
}

.photoset {
	margin: -12px 0 0 2px;
}

.photoset em {
	color: #43442b;
	font-size: 1em;
}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> COMMENTS <<<<<*/

#comments  {
	padding: 10px 0 0 0;
}

#comments h3  {
	margin: 15px 0;
	font-size: 1.2em;
	color: #2A353E;
}

#formsblock  {
	padding: 30px 0 20px 0;
	margin: 0 auto;
	position: relative;
}

#formsblock .hi  {
	margin: 0 0 10px 0;
	font-size: 1.2em;
	margin-left: 140px;
	color: #43442B;
}

#formsblock .comments   {
	background: url(img/icons/rss_comments.gif) no-repeat center right;
	padding: 6px 30px 6px 0;
	text-decoration: none;
	line-height: 20px;
}

#comments ol  {
	margin: 5px 0 30px 0;
	list-style: none;
	border-top: 1px dotted #171717;
	border-bottom: 1px dotted #171717;
	
}

#comments ol li  {
	padding: 10px 0 25px 0px;
	list-style: none;
}

.commententry {
	float: left;
	width: 620px;
}

.commententry p.moderate  {
	font-style: italic;
	font-weight: bold;
	padding: 4px 0 4px 10px;
}

.commentmeta  {
	font-size: 11px;
	width: 220px;
	float: left;
	margin-right: 20px;
}

.commentmeta .gravatar img  {
	float: left;
	margin: 0 10px 0 0;
}

.commentmeta .commentauthor  {
	font-size: 14px;
	font-weight: bold;
}

#comments #tagbox  {
	color: #9e9e9e;
	margin: 0 0 25px 0;
}

#comments #tagbox:hover  {
	color: #000;
}

#comments #tagbox p  {
	margin: 0;
	font-size: 12px;
}

#comments #tagbox strong  {
	font-size: 12px;
}

#comments p.nocomments{
	padding: 0;
}

#commentform #submit  {
	border: none;
	background-color: #2A353E;
	color: #fff;
	padding: 5px;
	margin-left: 140px;
	text-transform: uppercase;
	cursor: pointer;
	letter-spacing: 1px;
}

#commentform #submit:hover  {
	background-color: #4C4D2C;
}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> POST IMAGE ALIGNMENT <<<<<*/

.entry .alignleft  {
	float: left;
	margin: 10px 15px 10px 0;
}

.entry .alignright  {
	float: right;
	margin: 10px 0 10px 15px;
}

.entry .aligncenter  {
	text-align: center;
}

.entry {
	margin-bottom: 20px;
}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> POST TABLES <<<<<*/

.post table  {
	width: 100%;
	border-left: 1px solid #d2d2d2;
	border-top: 1px solid #d2d2d2;
	border-spacing: 0;
	margin: 10px 0;
}

*:first-child+html .post table  {
	border-collapse: collapse;
}

.post table th  {
	font-size: 15px;
	background-color: #111;
	color: #ededed;
}

.post table th, .post table td  {
	border-right: 1px solid #d2d2d2;
	border-bottom: 1px solid #d2d2d2;
	padding: 3px 0 3px 5px;
}

.post .altrow  {
	background-color: #eee;
}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> FLOAT & ALIGN <<<<<*/

.floatl  {float: left;}
.floatr  {float: right;}

.alignl  {text-align: left;}
.alignr  {text-align: right;}
.alignc  {text-align: center;}

.hide  {display: none;}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> CLEAN CONTACT <<<<<*/

#clean_contact ul {
	list-style: none;
}

#clean_contact ul li {
	display: block;
	margin: 0 0 10px 0;
	float: left;
}

#clean_contact label {
	width: 120px;
	float: left;
	text-align: right;
	padding: 0 20px 0 0;
	font-size: 0.8em;
}

#clean_contact {
	padding-left: 100px;
}

#clean_contact input[type=text]{
	width: 385px;
	background: #171717;
	color: #43442B;
	border: none;
	padding: 5px;
	float: left;
	font-size: 0.8em;
}

#clean_contact textarea {
	width: 385px;
	background: #171717;
	color: #43442B;
	border: none;
	padding: 5px;
	float: left;
	font-family: Helvetica, Arial, Sans-serif;
	font-size: 0.9em;
}

#clean_contact #clean_contact_send  {
	border: none;
	background-color: #2A353E;
	color: #fff;
	padding: 5px;
	margin-left: 140px;
	text-transform: uppercase;
	cursor: pointer;
	letter-spacing: 1px;
}

#clean_contact #clean_contact_send:hover  {
	background-color: #4C4D2C;
}

#clean_contact_msg { padding: 5px; margin-left: 15px; font-family: Georgia, "Times New Roman", Times, serif; font-style:italic;}
.CleanContact_msg.ok{color: #fff; font-family: "Arial Black"; text-transform: uppercase; margin-left: 240px;}
.CleanContact_msg.err{color: #fff; font-family: "Arial Black"; text-transform: uppercase; margin-left: 240px;}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> I LIKE THIS <<<<<*/

.iLikeThis {
	background:url(img/high-five.png) no-repeat;
	display: block;
	width: 58px;
	height: 89px;
	position: absolute;
	right: 215px;
	top: -20px;
}

.iLikeThis .counter {
	font-family: "Arial Black";
	position: absolute;
	font-size: 1.2em;
	right: 10px;
	top: 36px;
}

.iLikeThis .counter a {
	cursor: pointer;
}