/* @override http://origencreatives.com/css/display.css */

body {
	background: url(../i/body_bg.jpg) left top;
	font-family: Helvetica, Arial, sans-serif;
	margin: 0;
	font-size: 12px;
	line-height: 1.6em;
	color: #333333;
}

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

a:hover {
	color: #5b7633;
}

span.amp {
	font-family: Baskerville, 'Goudy Old Style', Palatino, 'Book Antiqua', serif;
	font-style: italic;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "museo-slab-1","museo-slab-2", Helvetica, Arial, Sans-serif;
}
header, section, article, footer {
	display: block;
}

#header_wrapper {
	background: url(../i/header_bg.jpg) center top repeat-x;
}

header {
	margin: 0 auto;
	width: 960px;
	position: relative;
	height: 60px;
}

header h1 {
	background: url(../i/logo.png) top left no-repeat;
	display: block;
	height: 119px;
	text-indent: -9999px;
	width: 98px;
	position: absolute;
	margin-left: 20px;
	margin-top: 0;	
}

header h1 a {
	width: 98px;
	height: 119px;
	display: block	;
}

header h1:hover {
	margin-top: -5px;
}
header ul {
	overflow: hidden;
	margin: 0 0 0 243px;
}
header ul li {
	float: left;
	display: block;
	margin:  15px 11px 0 0;
	width: 108px;

}

header ul li a {
	display: block;
	background-image: url(../i/nav_bg.png);
	background-repeat: no-repeat;
	background-position: top center;
	width: 100px;
	font-size: 12px;
	text-align: center;
	text-transform: uppercase;
	padding: 6px;
	color: #f4e7bd;
	font-family: "museo-slab-1","museo-slab-2", Helvetica, Arial, Sans-serif;
}

header ul li.login {
	margin: 15px 0 0 0;
}

header ul li.login a {
	letter-spacing: normal;
	background: none;
}

header ul li.login a:hover {
	background: none;
}
header ul li a:hover, header ul li a.current {
	color: #fff;
	background-image: url(../i/nav_bg_hover.png);
}

/* @group Content Top */

/* @group HOME - Content Top  */

#home #content_top_wrapper {
	height: 380px;	
	background-position: top;
	border-top: none;
}

#home #content_top img {
	float: right;
	margin: -35px 0 0 0 ;
}

#home #content_top h1 {
	width: 385px;
	height: 103px;
	text-indent: -9999px;
	background: url(../i/home_headline.png) top left no-repeat;
	margin: 65px 0 10px 20px;
}

/* @end */

#content_top_wrapper {
	background: url(../i/content_top_bg.jpg) bottom center repeat-x;
	overflow: hidden;
	border-top: 1px solid;
	border-color: #4a661b;
}

#content_top {
	width: 960px;
	margin: 0 auto;
	color: #fff;
	display: block;
}

#content_top h1 {
	font-size: 18px;
	margin: 17px 0 0 130px;
	text-transform: uppercase;
}

#contact #content_top h1, #musings #content_top h1, #about #content_top h1 {
	margin-bottom: 30px;
}

#content_top h1 em {
	color: #e6ffb9;
	text-transform: none;
	font-size: 14px;
	font-style: italic;
	padding-bottom: 4px;
}
section#portfolio_slider {
	position: relative;
	margin: 20px 0;
}

#content_top ul.items li img {
	background: #FFF;
	padding: 3px;
	float: left;
	margin: 0 18px 0 0;
}

#content_top ul.items li img:hover {
		background: #FFF;
}

#content_top p {
	width: 408px;
	padding: 0 0 0 40px;
	font-size: 14px;
	line-height: 24px;
	color: #ebf2dd;
}

/* @end */

div#content {
	width: 960px;
	margin: 20px auto;
	overflow: hidden;
}

#home #content {
	margin: 0 auto;
}

/* @group PORTFOLIO - Details Section */

div#details {
	padding: 10px 30px 10px 10px;
	width: 350px;
	float: left;	
	margin: 0 0 30px 0 ;
}

div#details h2 {
	color: #5a6d37;
	font-size: 24px;
	margin: 0 0 10px 0;
	line-height: 30px;
}

div#details h3 {
	color: #3b2b1b;
	font-size: 16px;
	margin: 10px 0 11px 0;
}

div#details div.quote {
	border-left: 3px solid #6a952f;
	padding: 0 20px;
	margin: 20px 0;	
}
div#details blockquote {
	font-family: Georgia, Times, 'Times New Roman', serif;
	font-style: italic;
	color: #333;
	margin: 0 0 5px 0;

}

div#details cite {
	color: #333;
	text-transform: uppercase;
	font-size: 10px;
	

}
div#details p.btn {
	float: right;
	margin: 0;
}

/* @end */

/* @group PORTFOLIO - Portfolio Images */
div#portfolio_images {
	padding: 10px;
}
div#portfolio_images img {
	background: #FFF;
	padding: 10px;
}

/* @end */



/* @group HOME - Feature Blog and Work Sections */

section#feature_work, section#feature_blog {
	width: 459px;
	padding: 10px;
	float: left;
	margin: 0 0 20px 0;
}

section#feature_work img, section#feature_blog img {
	background: #FFF;
	padding: 3px;
	float: left;
	margin: 0 20px 10px 0;	
}

section#feature_work img:hover, section#feature_blog img:hover {
	background: #FFF;
}



section#feature_work h3, section#feature_blog h3 {
	text-transform: uppercase;
	color: #4e453c;
	font-size: 12px;
}

section#feature_work h2 a, section#feature_blog h2 a {
	color: #6a952f;
	font-size: 24px;
	line-height: 1em;
	display: block;
	margin: 0 0 12px 0;
}

section#feature_work h2 a:hover, section#feature_blog h2 a:hover {
	color: #35530d;
}

section#feature_work p {
	padding-right: 15px;
}

section#feature_blog h2 a {
	font-size: 18px;
	line-height: 26px;
}

section#feature_blog {
	border-left: 1px dotted #4a4949;
}

section#feature_blog img {
	margin: 20px 20px 70px 10px;
}

/* @end */
p.btn {
	background: url(../i/btn_corner.png) -3px top no-repeat;
	padding-left:15px;
	margin: 10px 0 0 0;
	display: inline-block;

}

p.btn a {
	background: url(../i/btn_body.png) right top no-repeat ;
	padding:5px 15px 6px 0;
	font-weight: bold;
	color: #696969;
	font-size: 10px;
	text-transform: uppercase;
	min-height: 1px;
	display: inline-block;	
}

p.btn a:hover {
	color: #6a952f;
}

/* @group Home - Services Section */

section#services {
	clear: both;
	background: url(../i/service_bg.png) top center no-repeat;
	padding: 50px 0 35px 0;
	overflow: hidden;
	margin: 0 0 30px;
}

section#services h3 {
	text-indent: -9999px;
	height: 0;
}

section#services h2 {
	color: #6a952f;
	font-size: 18px;
	margin: 0 0 12px 0;
}

section#services ul li {
	width: 300px;
	padding: 10px;
	float: left;
}

section#services ul li p {
	margin: 0 10px 0 0;
	line-height: 20px;
}

/* @end */

/* @group Home - Quote Section */

section#quote {
	width: 380px;
	padding: 0 15px 0 10px;
	float: left;
	margin: 0 100px 30px 0;
	overflow: hidden;
}

section#quote blockquote {
	font-size: 14px;
	color: #537524;
	font-family: "museo-slab-1","museo-slab-2", Helvetica, Arial, Sans-serif;
	line-height: 22px;
}

section#quote p cite {
	display: block;
	text-align: right;
}

section#quote p cite span {
	display: block;
	font-weight: bold;
}

/* @end */

/* @group Home - Get Started Section */

section#get_started h2 {
	text-transform: uppercase;
	font-size: 14px;
	color: #4e453c;
	font-family: "museo-slab-1","museo-slab-2", Helvetica, Arial, Sans-serif;
	margin: 0 0 6px 0;
}
section#get_started p {
	margin: 0 0 10px;
}

section#get_started p a.project_survey {
	float: right;
	width: 90px;
	height: 25px;
	background: url(../i/project_survey.png) center top no-repeat;
	padding: 90px 0 0 0;
	margin: 0 20px;
}

/* @end */

/* @group Footer */

footer {
	clear: both;
	margin: 10px 0 0 0 ;
	text-align: center;
	font-size: 12px;
	background: #f6f4eb;
	padding: 20px 0;
	color: #4e453c;
	border-top: 1px solid;
	border-color: #dad8d2;
}

footer p {
	margin: 0 auto;
	width: 900px;
}

/* @end */

/* @group Portfolio Scroller */

/* 
    root element for the scrollable. 
    when scrolling occurs this element stays still. 
*/ 
div.scrollable { 
 
    /* required settings */ 
    position:relative; 
    overflow:hidden; 
    width: 782px; 
    height:90px; 
    margin: 0 90px;
} 
 
/* 
    root element for scrollable items. Must be absolutely positioned 
    and it should have a extremely large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element. 
*/ 
div.scrollable ul.items { 
    /* this cannot be too large */ 
    width:20000em; 
    position:absolute; 
} 
 
 
a.prevPage {
	width: 36px;
	height: 35px;
	background: url(../i/left_control.png) top left no-repeat;
	left: 20px;
	top: 15px;
	display: block;
	text-indent: -9999px;
	position: absolute;
}
a.nextPage {
	width: 36px;
	height: 35px;
	background: url(../i/right_control.png) top left no-repeat;
	left: 900px;
	top: 15px;
	display: block;
	text-indent: -9999px;
	position: absolute;
}

section#portfolio_slider a.disabled {
	opacity: 0.5;
}
/* 
    a single item. must be floated in horizontal scrolling. 
    typically, this element is the one that *you* will style 
    the most. 
*/ 
div.scrollable ul.items li { 
    float:left; 
} 
 
/* you may want to setup some decorations to active the item */ 
ul.items div.active { 
    border:1px inset #ccc; 
    background-color:#fff; 
}

/* @end */


#about nav#nav_page {
	width: 140px;
	padding: 10px;
	
}

#contact nav#nav_page {
	width: 300px;
	float: left;
	padding: 10px;
}

#content_main {
	float: right;
	border: 1px solid #FFF;
	border-radius:5px;
	background: #f7f6ed;
	padding: 40px 70px 50px 80px;
}

#about #content_main {
	width: 640px;
}

#musings #content_main {
	width: 560px;
}

#contact #content_main {
	width: 530px;
	padding: 20px 50px;
}
#content_main h2 {
	color: #3b342d;
	font-size: 30px;
	line-height: 1.5em;
	margin: 0 0 10px 0;
}

#content_main h3 {
	color: #6a952f;
	font-size: 18px;
	font-family: Georgia, Times, 'Times New Roman', serif;
	font-style: italic;
	line-height: 1.4em;
	margin: 0 0 14px 0;
}

#content_main section header {
	margin: 35px 0;
	height: inherit;
	border-bottom: 1px solid #ccc;
	position: relative;
	width: 100%;
}

#content_main section header p.top {
	position: absolute;
	background: #6a952f ;
	bottom: 0;
	right: 0;
	display: block;
}

#content_main section header p.top a {
	color: #fff;
	font-size: 9px;
	text-transform: uppercase;
	display: block;
	padding: 0 5px;
}

#content_main section#intro > p {
	font-size: 13px;
	line-height: 22px;
	padding: 0 250px 20px 0;
}
#content_main section header h3 {
	margin: 0;
	padding: 5px 0;
	color: #4e453c;
	font-size: 14px;
	text-transform: uppercase;
	font-style: normal;
	font-family: "museo-slab-1","museo-slab-2", Helvetica, Arial, Sans-serif;
	
}

section img, article img {
	background: #FFF;
	padding: 10px;
}

article .meta img {
	margin: 0;
}
article img {
	padding: 3px;
	margin: 10px 0 10px -155px;
}

section img.left {
	float: left;
	margin: 0 20px 0 0;	
}

section img.right {
	float: right;
	margin: 0 0 0 20px;
}

#content_main section#intro aside {
	float: right;
	width: 200px;
	height: 250px;
	margin-left: 20px;
	padding-top: 55px;
}

#content_main section#intro aside blockquote {
	font-size: 24px;
	color: #3a4b20;
	font-style: italic;
	line-height: 30px;
	font-family: Georgia, Times, serif;
	
}

#content_main section#intro aside p cite {
	text-align: right;
	display: block;
	text-transform: uppercase;
	font-size: 10px;
	margin: 10px 0 0 0;
}

section#who img {
		float: left;
	margin: 0 30px 0 -10px;	
}


section#who h4 {
	font-size: 13px;
	font-weight: bold;
	line-height: 2.5em;
	font-family: Helvetica, Aria, sans-serif;
}

section#who h4 a {
	color: #000;
	padding: 0 5px;
}
section#about_services ul {
	overflow: hidden;
}
section#about_services  ul li {
	float: left;
	width: 183px;
	padding: 0 30px 0 0;	
}

section#about_services ul li:nth-child(3), section#about_services ul li.last {
	padding: 0;
}

section ul li h4 {
	color: #3b342d;
	font-size: 18px;
	margin: 0 0 11px;
	line-height: 1.3em;
}

section#process ul li {
	clear: both;
	padding: 30px 0;
}
#about nav#nav_page {
	position: fixed;
}

#about nav#nav_page p.instructions {
	font-size: 10px;
	font-style: italic;
	margin: 10px 10px 0 10px;
	padding: 10px 0;
	font-family: Georgia, Times, serif;
	border-top: 1px dotted #ccc;
}

#musings nav#nav_page {
	width: 210px;
	float: left;
	padding: 10px;
}

#contact nav#nav_page h4, #musings nav#nav_page h4 {
	color: #3d4e22;
	font-weight: bold;
	font-family: Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	margin: 15px 0;
}

#contact nav#nav_page h4 {
	margin: 10px 0;
}
#musings nav#nav_page h4 a {
	font-weight: normal;
	text-transform: lowercase;
	font-size: 10px;
	padding: 0 0 0 5px;
}

#musings ul#twitter_update_list li {
	margin: 0 0 10px 0;
}

#musings ul#twitter_update_list li span a {
	font-weight: bold;
	text-transform: none;
}

#musings ul#twitter_update_list li a {
	text-transform: uppercase;
	color: #3c4d21;
	
}

#musings ul#categories li a {
	color: #383838;
	font-weight: bold;
	margin: 0 0 5px;
	display: block;
}

#musings ul#categories li a:hover {
	color: #6a952f;
}
#about nav#nav_page ul li a {
	text-transform: uppercase;
	color: #383838;
	font-weight: bold;
	display: block;
	padding: 8px;
}

#about nav#nav_page ul li a.current {
	color: #fff;
	background: #322111;
	border-top: 1px solid rgba(0,0,0,0.2);
	border-left: 1px solid rgba(0,0,0,0.2);
	border-bottom: 1px solid #fff;
	border-right: 1px solid #fff;

}

article div.meta {
	width: 160px;
	float: left;
	height: 220px;
}

article div.meta p {
	margin: 20px 0 0 0;
	color: #555;
}

#content_main article div.meta ul {
	margin: 0;
}

#content_main article div.meta ul li {
	list-style: none;
}
article div.meta li a {
	color: #3e4f23;
	font-weight: bold;
}

#musings #content_main article div.meta p {
	margin: 10px 0 0 0;
}

#content_main article h3.date {
	font-size: 12px;
	color: #6a952f;
	font-family: Helvetica, Arial, sans-serif;
	font-style: normal;
	text-transform: uppercase;
	line-height: 1.5em;
	margin: 0;
}

#content_main article h3 {
	margin: 20px 0 10px 140px;
	font-family: "museo-slab-1","museo-slab-2", Helvetica, Arial, Sans-serif;
	font-style: normal;
	
}

#content_main article h4 {
	margin: 20px 0 10px 160px;
	text-transform: uppercase;
	color: #7c3717;
	font-family: Helvetica, Arial, sans-serif;
}
#content_main article h2 a:hover {
	color: #6a952f;

}

#content_main article h2 {
	line-height: 36px;
}

#content_main article pre {
	background: #fcfcfa;
	padding: 20px;
	margin: 10px 0;
	font-family: "Courier New", Courier, mono;
	color: #000;
}
#musings #content_main article h2 a {
	color: #3b342d;
}

article {
	padding: 30px 0;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #fff;
	overflow: hidden;
}

#content_main article ul, #content_main article ol {
	margin: 0 0 10px 160px;
}

#content_main article ul li {
	list-style: square;
}

#content_main article ol li {
	list-style: decimal;
}


article:first-child {
	padding: 0 0 30px 0;
	border-top: none;
}

#musings #content_main article p {
	margin: 0 0 10px 160px;
}

#content_main article p.btn {
	text-align: right;
	float: right;
}


#comments_posted {
	padding: 20px 0 10px 0;
	border-bottom: 1px solid #ccc;
}

div.comment_entry {
	padding: 50px 20px 20px 20px;
	background: #c6d0b1;
	margin: 0 0 20px 0;
	position: relative;
	color: #405c19;
}

div.comment_entry h5 {
	position: absolute;
	top: 0;
	left: 0;
	padding: 10px 20px ;
	background-color: #6a952e;
	color: #e3edcb;
	text-transform: uppercase;
}

div.comment_entry h5 a {
	color: #fff;
}

div.comment_entry h5 a:hover {
	color: #e7f1ce;
}

div.comment_entry p {
	margin: 0 0 5px 0;
}
/* @group Forms */

#comment_form input.textbox {
	width: 385px;
	border-bottom: 1px solid #eee;
	border-right: 1px solid #eee;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	padding: 10px 5px;
	margin: 0 0 10px 0;
	color: #555;	
}

#content_main #comment_form textarea {
	width: 375px;
	height: 200px;
	border-bottom: 1px solid #eee;
	border-right: 1px solid #eee;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	padding: 10px;
	margin: 0 0 10px 0;	
	line-height: 1.5em;
	color: #555;
}

form#comment_form .comment_label {
	float: left;
	width: 140px;
	text-align: right;
	padding: 8px 20px 10px 0;
	text-transform: uppercase;
	font-weight: bold;
	clear: left;
}

#comment_form .comment_notify {
	padding: 20px 0 20px 160px;
	border-top: 1px solid #ccc;
}

input.comment_submit {
	margin: 0 0 0 160px;
	color: #fff;
	border: none;
	padding: 10px;
	text-transform: uppercase;
	background-color: #6f9834;
}

#comment_form {
	margin: 20px 0;
}
#content_main #comment_form h3, #content_main #comments_posted h3 {
		font-family: "museo-slab-1","museo-slab-2", Helvetica, Arial, Sans-serif;
		font-size: 18px;
		text-transform: uppercase;
		font-style: normal;

}

/* @end */