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

	Theme Name: DevPatch - Custom Portfolio Theme
	Theme URI: http://www.devpatch.com
	Description: A Portfolio Theme by DevPatch.
	Author: Benjamin Sternthal.
	Author URI: http://blog.sternthal.org
	Version: 0.1
	Tags: portfolio, theme

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

@font-face {
	font-family: 'Delicious-Roman';
	src: url('style/fonts/Delicious-Roman.eot');
	src: local('☺'), url('style/fonts/Delicious-Roman.ttf') format('truetype');	
}

@font-face {
	font-family: 'Delicious-Bold';
	src: url('style/fonts/Delicious-Bold.eot');
	src: local('☺'), url('style/fonts/Delicious-Bold.ttf') format('truetype');	
}


/* ====== Layout ====== */

body{
    background: url('style/images/tile-bgrd.gif') repeat; 
    margin:0;
    padding:0;
    font: 14px 'Delicious-Roman', Arial, sans-serif;           
}

#page {
   background: #FFFFFF;
   padding:20px 0 40px 0;
   border-bottom:5px solid #323232; 
   border-top:5px solid #323232;      
}


#content {
   margin: 0 auto 0 auto; 
   overflow: hidden; 
   width: 946px;
}


div.sized-layout {
   margin: 0 auto 0 auto; 
   width: 946px;
}


/* reset */
img {border:0;}
div,ul,li,h1,h2,h3,h4,h5,h6,td,tr,table,dl,dt,dd{ margin:0;padding:0;font-weight:normal;}
p{margin:0px 0px 1em 0px; padding:0;line-height: 1.3em;}
.clear{clear:both;font-size: 8px;}
.clear-height{clear:both;height:10px;}
ol{margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%;}
ul{list-style: none;}
.align-left{text-align: left;}
.align-right{text-align: right;}
.align-center{text-align: center;}
.no-space,.nospace{padding:0 !important; margin:0 !important;}
.float-left{float:left !important;}
.float-right{float:right !important;}
.float-divider{float:left;height:8px;width:9px;}
.hidden{display:none;}
.spacer{height:10px;}
:focus {outline: 0;}
.no-bgrd {background:none !important;}

/* ====== Columns  ====== */
#cbox-main {
   float: left; 
   width: 626px;
}

#cbox-rail {
   float: right; 
   width: 264px;
}

/* ====== Links  ====== */
a,a:link {color:#1679a7;text-decoration:none;}
a:visited {color:#1679a7;text-decoration:none;}
a:hover {color:#20aff2;text-decoration:underline;}


/* ====== Headings  ====== */
h1.post-title  {
    margin-bottom:5px;
    font: 22px 'Delicious-Bold', Arial, sans-serif;    
    color:#81991f;
}

h2 {
    font: 20px 'Delicious-Bold', Arial, sans-serif;    
    color:#81991f;
    text-transform: uppercase;       
}

h2.content-divider, #cbox-rail h2 {
    border-bottom:1px solid #81991f;
    margin-bottom:10px;
}

h2.blog-title {
    margin-bottom:5px;
    font-size:22px;
    text-transform:none;
}

h1.post-title a{color:#81991f;}
h1.post-title a:hover{text-decoration: underline;}

h3#comments,
#respond h3 {
    font: 18px 'Delicious-Bold', Arial, sans-serif;   
    margin-bottom:8px; 
}

h3 {
    font: 22px 'Delicious-Roman', Arial, sans-serif;    
}

h4 {
    font: 16px 'Delicious-Bold', Arial, sans-serif;  
    text-transform: uppercase;       
      
}


/* ====== Top Nav  ====== */
#header {
    height:94px;
    position:relative;
}

#tagline{
    position:absolute;
    left:40px;
    top:58px;
    width: 580px;
    list-style-type:none;   
    margin-top:11px;
    font-size: 14px;
    color:#c0c0c0;
}

#tagline li {
   float:left;
   padding: 0 0 0 11px;
   margin:0 8px 0 0;
   background: url('style/images/header-bullet.png') 0 .5em no-repeat;
}

#header-nav {
    position:absolute;
    right:0px;
    top:47px;
    list-style-type:none;   
}

#header-nav li {
    float:left;
    padding:0;
    margin:0 0 0 30px;
}

#header-nav div {
    height:38px; 
}

#header-nav a {
	font-family: 'Delicious-Roman';
    display:block;
    float:left;
    height:28px;
    margin:0 4px 0 -19px;
    padding:12px 15px 0 19px;
    text-decoration: none; 
    color:#FFFFFF;  
    font-size:16px;    
    cursor:pointer;
    text-transform: uppercase; 
}

#header-nav .active div {
    background: url(style/images/button-sprite.png) no-repeat;  
    background-position: right  0;                  
}


#header-nav .active a {
    background: url(style/images/button-sprite.png) no-repeat;  
    background-position: left  0;                  
}


/* ====== Footer  ====== */
#footer{
   height: 140px;
   margin: 0 auto 0 auto; 
   width: 980px;   
   position:relative;
   color: #CCCCCC;
   font-family: Arial;
}

#footer-gears {
   background: url('style/images/footer_gears.png') no-repeat top left;
   width:419px;
   height:140px;
   position:absolute;
   top:0;
   left:-50px;
}

#footer-text{
    position:absolute;
    width:410px;
    right:10px;
    top:20px;
}

#footnav li{
   display: inline;
   float: left; 
   margin-right: 7px;
   color: #CCCCCC;
   font-size:11px;  
}

#footnav li a{color:#CCCCCC; text-decoration: none;}
#footnav li a.active{color: #CCCCCC;}
#footnav li a:focus{color: #CCCCCC;}


#footer p{
    color: #666; 
    font-size: 11px;
}
		
#footer p.rss{
   background: url('style/images/feed-icon.gif') no-repeat 0 50%; 
   padding-left: 18px;
}

#footer a{color: #ccc; text-decoration: none;}
#footer a:hover{text-decoration: underline;}


/* ====== Home  ====== */
#home-about {
    width:589px;
    height:207px;
    margin-top:30px;
    background: url('style/images/home-about-bgrd.png') no-repeat;
    float:left;
}

#home-about h1 {
    font: 27px 'Delicious-Roman', Arial, sans-serif;           
    color:#333333;
    padding:35px 20px 0 20px;
    margin:0 0 15px 0;
}

#home-about div {
    font: 23px 'Delicious-Roman', Arial, sans-serif;           
    color:#333333;
    padding:0 20px 0 20px;
}

#home-blog-posts {
    width:325px;
    float:right;
    margin-top:60px;
}

#home-blog-posts li {
    font-size:16px;
    margin:8px 0 0 0;
    padding:0 0 0 12px;
    background: url('style/images/arrow-bullet.gif') no-repeat 0px 4px;
    
}


/* ====== Portfolio Home/List  ====== */

.pf-list-item {
   width:276px;
}

.pf-list-float {
    float:left;
    margin:0 35px 30px 0;
}

a.pf-list img {
   border:1px solid silver;
   display:block;
   margin-bottom:10px;
}

a.pf-list:hover img{
   opacity: .7; 
}

.pf-title {
   font-family: 'Delicious-Bold','Trebuchet MS';
   font-size:20px;
   margin:0 0 0 10px;
}

.pf-desc {
    padding-top:4px;
    color:#333333;
}

.client-list {
    float:left;
    margin:0 50px 50px 0;;
    font-size:18px;
}


/* Contact Us Form*/
#contact-form {
   margin:0 25px 25px 5px;
}


#contact-form div#usermessageb.failure{
   border: 2px solid #ccc; 
   clear: both; 
   padding: 4px;
}


#contact-form .linklove,
#contact-form .cf_hidden{display: none;} 

#contact-form ol{margin: 0; padding: 0;}

#contact-form ol li{list-style: none; margin-bottom: 1.5em;}

#contact-form label, #contact-form .reqtxt {
   font-size:16px;
   font-family: 'Delicious-Roman','Trebuchet MS';	   
}

#contact-form .reqtxt, .emailreqtxt {
   padding-left:2px;
   font-size:14px;   
}


#contact-form input,
#contact-form textarea {
   display:block;
   width:350px;
   border:1px solid silver;
   padding:3px;
   font-size:14px;   
   font-family: Arial;   
}

#sendbutton {
   font-size:14px;	
   font-family: 'Delicious-Roman','Trebuchet MS';	
   color:#FFFFFF;
   background: #9cab32;  
   width:75px !important;
   cursor: pointer;
}

.cf_info.failure {
   border:1px solid silver;
   padding:3px 0 3px 6px;
   margin:10px 0 20px 0;
   width:350px;
   font-style: italic;
   background: #f4f4f4;
   color:red;
}


/* ====== Pages & Blog Content ====== */

img.photo{
   padding:3px;
   border:1px solid silver;
}

ul.meta-links li {
   display:block;
   clear:left;
   margin:0 0 10px 0;
   padding:0;   
}

ul.meta-links img {
   float:left;
   height:16px;
   padding-right:4px;
   width:16px;
}

ul.meta-links a{
   border:none;
   display: inline; 
   padding:0;
}

ul.meta-links div {
   margin-left:20px;   
}

ul.disc {
   font-size:14px;  
   color:#333;  
   margin:1em 0 1em .5em; 
}

ul.disc li {
   font-size:14px;  
   list-style-type: disc;
   list-style-position: inside; 
   padding:0 0 .4em 0;
}

.blog-post .info {
    border-bottom:1px dotted silver;
    margin-bottom:8px;
}

.date {
	float:left;
	background:url('style/icons/date.png') no-repeat;
	padding-left:22px;
	height:16px;
	line-height:16px;
	display:block;
	font-size:14px;	
    font-family: 'Delicious-Roman', 'Trebuchet MS';	
}

.postmetadata {
   font-family: 'Delicious-Roman','Trebuchet MS';
   color:#333333;
   font-size:13px;
   margin-bottom:50px;
   border-top:1px dotted silver;
   border-bottom:1px dotted silver;
   padding:3px 5px 3px 5px;
}

ul.work-nav li {
    display:block;
    font-size:13px;
    margin-left:5px;
    padding:5px 0;
}


ul.work-nav b {
   display:block;
   margin-left:-10px;
   padding-left:10px;
   background:url(style/images/arrow-bullet.gif) 0 2px no-repeat;
}

ul.work-nav li a{
   border-bottom:none; 
   display: inline; 
   padding:0 0 0 0;
}


#cbox-rail ul {
    margin-bottom:20px;
}

li.recentcomments {
   margin-bottom:1.5em;
}

.lb-thumbs {
   margin:0 0 15px 0;
}

a.lb-thumb {
   float:left;
   margin-left:10px;
}

a.lb-thumb img,
a.lb img  {
   padding:3px;
   border:1px solid silver;
}

a.lb-thumb:hover img,
a.lb:hover img{
   opacity: .7; 
}

.project-details {
   background:#F5F5F5;
   padding:8px 10px 8px 10px;
   margin:20px 0 40px 0;
   border:1px solid #81991f;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;   
   font-size:12px;   
}


.project-details dl dt{
   float: left; 
   display: inline;
}

.project-details dl dd{
   margin-bottom:3px;
}
	

/* comments */


.commentlist li ul li {
	font-size: 1em;
}

.commentlist li {
	font-weight: bold;
	margin:0 0 20px 0;
}

.commentlist li .avatar { 
	float: right;
	border: 1px solid silver;
	padding: 2px;
	background: #fff;
}

.commentlist cite, .commentlist cite a {
	font-weight: bold;
	font-style: normal;
	font-size: 1.1em;
}

.commentlist p {
	font-weight: normal;
	line-height: 1.5em;
	text-transform: none;
}

.commentmetadata {
	font-weight: normal;
}

.comment-body {
   background:#F5F5F5;
   padding:8px;
   border:1px solid #81991f;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;   
}
	
#submit {
   border:1px solid silver;
   padding:3px;
	font-size:14px !important;	
   font-family: 'Delicious-Roman', 'Trebuchet MS' !important;	
   color:#FFFFFF;
   background: #9cab32;  
   float:left;
   cursor: pointer;
}