/*

	Theme Name: welcomebrand
	Author: James Young
	Version: 1.0
*/

/* 01 START : Global reset styles */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,dialog,figure,footer,header,hgroup,menu,nav,section,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,dialog,figure,footer,header,hgroup,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}a{margin:0;padding:0;border:0;vertical-align:baseline;background:transparent}ins,mark{background:#ff9;color:#000;text-decoration:none}mark{font-style:italic}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted #000;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}::selection{text-shadow:none;background:#333;color:#fff;}
/* 01 END : Global reset styles */

/* Global elements */
body {
	/*background: 		#fff url(images/body-background.jpg);*/
	background: 		#f6f6f6;
	color: 				#525252;
	border-top: 		7px solid #212121;
	padding: 			0;
	margin: 			0;
	position: 			relative;
}


body, input, textarea {
	font: 				.9em/155% PT Sans, arial, sans-serif;
}

img, object, embed {
	margin-bottom: 		20px;
	max-width:			100%
}

input, textarea {
	text-shadow: 		none;
}

#site-title {
	float: 				left;
	display: 			inline;
}

h1, h2, h3, h4, blockquote {
	font-size: 			3em;
	font-weight: 		bold;
	line-height: 		100%;
	margin: 			0 0 25px 0;
	letter-spacing: 	-1px;
	text-shadow: 		1px 1px 1px #fff;
}

h1 {
	font-weight: 		bold;
	letter-spacing: 	-2px;
	line-height:		normal;
	margin: 			0 0 50px 0;
	color: 				#072339;
}

h2 { font-size: 2em; }
h3 { font-size: 1.8em; }
h4 { font-size: 1.6em; }


p {
	margin: 			0 0 35px 0;
	line-height: 		155%;
}

blockquote {
	margin-bottom: 50px;
	font-size: 2em;
	font-weight: bold;
	letter-spacing: -2px;
	border-left: 3px double #ccc;
	padding: 0 25px;
	text-transform: none;
}

blockquote p {
	line-height: 125%;
	text-indent: 0;
	margin: 0;
}

a {
	color: #2a2a2a;
	text-decoration: none;
	font-weight: bold;
	border-bottom: 1px dotted #aaa;
	
    -webkit-transition: all 0.6s ease 0s; 
    -moz-transition: 	all 0.6s ease 0s;
    -o-transition: 		all 0.6s ease 0s;  
    transition:	 		all 0.6s ease 0s;
}

#secondary-content a {
	font-weight: normal;
	color: #999;
}

a:hover {
	color: #444;
	border-bottom: 1px solid #666;
	}

a img {
	display: block;
}

img,
a img {
	max-width: 100%;
}

input[type="text"],
textarea,
input[type="submit"] {
	border: 0;
	padding: 8px 10px;
}

input[type="submit"] {
	cursor: pointer;
}

pre, 
code,
p code {
	font: 13px/125% 'Courier 10 Pitch', Courier, monospace;
	background: #f4f4f4;
	border: 1px solid #666;
	padding: 15px;
	margin: 0 0 25px 0;
	display: block;
	overflow: auto;
	maximum-width: 95%;
	
	border-radius: 5px;
}

/* Global layout stuff */
#wrapper {
	width: 96%;
	margin: 0 auto;
	padding: 0 2%;
	max-width: 1680px;
}

.primary-content {
	float: left;
	width: 70%;
}

#secondary-content {
	float: right;
	width: 25%;
}

header, footer {
	margin: 0 0 2%;
	padding: 1% 0;
	background: #fff;
	background: 		#fff url(images/body-background.jpg);	
	border-bottom: 3px double #eee;
	overflow: hidden;
	width: 100%;
	float: left;
	display: block;
	position: relative;
	box-shadow: 0 0 15px #ccc;
}

header ul {
	overflow: hidden;
	font-size: 1em;
	float: left; 
	display: inline;
	position: absolute;
	bottom: 0;
	margin: 0 0 0 3%;
}

header nav li {
	float: left;
	display: inline;
	margin: 0 1px 0 0;
	position: relative;
}

header nav a {
	float: left;
	padding: 1em 1em 4em;
	display: inline;
	background: #eee;	
	border-bottom: 0;
}

header nav a:hover,
.current-menu-item a,
.current-post-ancestor a,
.current-page-ancestor a {
	background: #212121;	
	color: #fff;
	border-bottom: 0;
}

header nav a:hover {
	opacity: .8;
}

#site-title {
	margin: 0 0 0 2em;
}

#site-title a {
	float: left;
	width: 79px;
	height: 95px;
	text-indent: -9999px;
	background: url(images/logo.png) 0 0 no-repeat;
	border: 0;
	opacity: .5;
}

#site-title a:hover {
	opacity: 1;
}

#searchform,
.elsewhere {
	top: 3.6em;
	right: 5%;
	position:absolute;
}

.elsewhere {
	top: .6em;
	bottom: auto;
	margin: 0;
}

footer .elsewhere {
	float: left;
	display: inline;
	position: relative;
	top: auto;
	right: auto;
	margin: .3em 2em 0 2em;
}

.elsewhere li {
	float: left;
	display: inline;
	width: 16px;
	height: 16px;
	margin-left: .4em;
	text-indent: -9999px;
	opacity: .6;
	
    -webkit-transition: all 0.6s ease 0s; 
    -moz-transition: 	all 0.6s ease 0s;
    -o-transition: 		all 0.6s ease 0s;  
    transition:	 		all 0.6s ease 0s;	
}

.elsewhere li a {
	float: left;
	display: inline;
	width: 16px;
	height: 16px;
	border-bottom: 0;
}

.elsewhere li:hover {
	opacity: 1;
}

/* Icons from http://www.softicons.com/free-icons/social-media-icons/social-media-icons-by-paul-robert-lloyd */
.elsewhere li.twitter {
	background: url(images/twitter-16x16.png) 0 0 no-repeat;
}

.elsewhere li.dribbble {
	background: url(images/dribbble-16x16.png) 0 0 no-repeat;
}

.elsewhere li.zootool {
	background: url(images/zootool-16x16.png) 0 0 no-repeat;
}

.elsewhere li.rss {
	background: url(images/rss-16x16.png) 0 0 no-repeat;
}

.elsewhere li.email {
	background: url(images/email-16x16.png) 0 0 no-repeat;
}

#searchform label {
	display: none;
}

#searchform input {
	border: 0;
	border-bottom: 1px solid #999;
	background: none;
	padding: 0;
	color: #999;
	width: auto;
}

#searchform input:hover,
#searchform input:focus {
	border-bottom: 1px solid #999;
	outline-width:0;
}

#searchform input#searchsubmit {
	color: #323232;
	border: 0;
	font-weight: bold;
	text-transform: uppercase;
}

#searchsubmit {
}

footer {
	/*margin: 5% -4% 0;
	padding: 2% 4%;*/
	margin: 5% 0 0;
	padding: 2% 0;
	border-top: 3px double #eee;
	border-bottom: 0;
}

footer p {
	float: left;
	display: inline;
	color: #bbb;
	margin: 0;
}

footer #footer-action a {
	margin: 0 2em 0 0;
}



footer #copyright {
	float: right; 
	text-align: right;
	margin-right: 2em;
}


.alignleft {
	float: left;
	margin: 0 30px 30px 0;
}

.alignright {
	float: right;
	margin: 0 0 30px 30px;
}

.aligncenter {
	margin: 0 auto 30px;
}

figure {
	background: #fff;
	width: auto;
	padding: 1.4em;
	border: 1px solid #ddd;
	display: inline;
	text-align: center;
	border-radius: 4px;
}

figcaption {
	max-width: 90%;
	color: #555;
}

/* Portfolio stuff */
#portfolio-content {
	overflow: hidden;
}

#portfolio-page {
	display: block;
	clear: both;
	margin: 5em 0  0;
	float: left;
	width: 100%;
	opacity: .3;
}

#portfolio-page:hover {
	opacity: 1;
	
	    -webkit-transition: all 0.6s ease 0s; 
    -moz-transition: 	all 0.6s ease 0s;
    -o-transition: 		all 0.6s ease 0s;  
    transition:	 		all 0.6s ease 0s;

}

#portfolio-listing {
	margin: 0 0 25px 0;
}

#portfolio-listing img {
	box-shadow: 0 0 8px #ccc;
	max-width: 375px;
	opacity: 1;

	-webkit-transition: all 0.6s ease 0s; 
    -moz-transition: 	all 0.6s ease 0s;
    -o-transition: 		all 0.6s ease 0s;  
    transition:	 		all 0.6s ease 0s;
	}

#portfolio-listing a img:hover {
	opacity: .9;
	box-shadow: 0 0 2px #fff, 0 0 3px #111, 0 0 12px #777;
}


#portfolio-listing li {
	float: left; 
	display: inline;
	margin: 0 2% 6% 0;
	text-transform: uppercase;
	}

#portfolio-listing li a span {
	clear: both;
	display: block;
	font-weight: normal;
	font-size: .9em;
	color: #888;
	text-transform: none;
}

#portfolio-listing li a:hover span {
	color: #666;
}

.portfolio-thumbs {
	float: left;
	list-style: none;
}

.portfolio-thumbs img {
	margin-right: 3em;
}

#portfolio-screenshots {
	float: left;
	margin-right: 3em;
}

#portfolio-detail {

}


#project-info {
	margin: 0 0 2.6em 2.6em;
}

/* Blog stuff */
article ul {
	margin: 0 0 2.6em 0;
}

.post.category-blog,
.type-page,
.post {
	margin-top: 50px;
	padding-bottom: 25px;
	background: url(images/split.png) bottom left repeat-x;
}

.post.type-post h2 a {
	font-size: .6em;
	font-weight: bold;
	text-transform: uppercase;
}

article header,
article footer {
	margin: 0 0 5% 0;
	width: 100%;
	padding: 0;
	background: none;
	box-shadow: none;
	border: 0;
}

article blockquote {
	clear: both;
}

/*.entry-content {
	overflow: hidden;
	}*/

/*.entry-content h2, .entry-content h3  {
	font-size: 26px;
}



.entry-content h3, #secondary-content h3 {
	font-size: 18px;
}*/

#secondary-content h3 {
	float: left; 
	font-size: 1.1em;
	width: 100%;
	display: block;
	color: #222;
	text-transform: uppercase;
	letter-spacing: -1px;
}

#secondary-content ul {
	margin-bottom: 45px;
}

.entry-content ul,
.entry-content ol,
article ul,
article ol {
	margin: 0 0 25px 25px;
}

.portfolio-detail ul.portfolio-thumbs {
	margin: 0;
	}

/*article.twelvecol li,*/
.entry-content li {
	margin-bottom: 5px;
}

#secondary-content li {
	list-style: none;
	margin-bottom: 15px;
	line-height: 110%;
}

/*.retweet {
	display: inline;
	position: absolute;
	top: 2px;
	right: 0;
}*/

.navigation {
	margin: 80px 0;
	overflow: hidden;
	line-height: 200%;
	clear: both;
}

.navigation h2 {
	/*text-align: center;*/
}

.navigation div {
	float: left;
	display: inline;
	max-width: 50%;
}

.navigation a {
	padding: 8px 0 0 10px;
	float: left;
	display: inline;
	font-size: 1.4em;
	border: 0;
}

.navigation a:hover {
	border-bottom: 0;
	text-decoration: none;
}

.navigation .nav-next {
	float: right;
}

.navigation .nav-next a,
.navigation .nav-previous a {
	background: url(images/point-left.png) top left no-repeat;
	text-transform: uppercase;
	min-height: 35px;
	float: left;
	display: inline;
	padding-left: 85px;
}

.navigation .nav-next a {
	background: url(images/point-right.png) top right no-repeat;
	padding-right: 85px;
	padding-left: 0;
}

#related-posts-title {
	margin-top: 50px;
}

#related-posts {
	margin: 25px 25px 50px;
}

#related-posts li {
	list-style: decimal;
}

/* Blog comments & contact form plugin*/
#contact-form,
#commentform {
	margin-bottom: 80px;
}

#contact-form {
	float: left;
	display: inline;
	width: 50%;
	margin: 0 25px 0 0;
}

#contact-form div {
	margin-bottom: 7px;
}

#contact-form label, 
#commentform label {
	float: left;
	width: 150px;
	color: #2C2C1F;
	font-weight: bold;
	padding-top: 5px;
}

.form-allowed-tags code {
	margin-top: 2.2em;
	font-size: .7em;
	width: 84%;
}

.form-allowed-tags {
	margin-left: 150px;
}

#contact-form label {
	width: 175px;
	padding-top: 9px;
}

#contact-form label span,
#commentform label span {
	color: #fff;
	margin-left: 10px;
}

#contact-form .required,
#commentform .required {
	color: red;
	display: inline;
}

#contact-form h3 {
	margin: 55px 0 5px 0;
	font-size: 16px;
	font-weight: bold;
}

#contact-form p {
	margin-bottom: 50px;
}

#commentform #comment {
	width: 75%;
}

#contact-form input[type="submit"],
#commentform .form-submit #submit {
	font-size: 16px;
	font-weight: bold;
	padding: 6px 15px;
	margin-left: 17.3%;
	margin-top: 25px;
	color: #fff;
	background: #2c2c1f;
	border: 2px solid #fff;
}

#commentform .form-submit #submit {
	margin-left: 150px;
	margin-top: 0;
}

#contact-form input[type="submit"] {
	margin: 0 0 0 175px;
}

#contact-form input,
#contact-form textarea, 
#contact-form select, 
#commentform input,
#commentform textarea {
	border: 1px solid #c2c2c2;
	background: #f4f4f4;
	padding: 5px;
	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	

	-webkit-transition: all 0.6s ease 0s; 
    -moz-transition: opacity 0.6s ease 0s;
    -o-transition: opacity 0.6s ease 0s;  
    transition: opacity 0.6s ease 0s;	
}

#contact-form textarea {
	width: 329px;
	}

#contact-form input:hover,
#contact-form input:focus,
#contact-form textarea:hover,
#contact-form textarea:focus,

#commentform input:hover,
#commentform input:focus,
#commentform textarea:hover,
#commentform textarea:focus,
#commentform .form-submit #submit {
	border: 1px solid #666;
	background: #ffc;
}

#commentform .form-submit #submit {
	background: #2a2a2a;
}

#comment-subscribe {
	margin: -40px 0 0 150px;
	font-weight: bold;
}

#comment-subscribe input {
	margin-right: .5em;
}

.commentlist li {
	background: url(images/split.png) bottom left repeat-x;
	overflow: hidden;
}

.commentlist li div {
	overflow: hidden;
}

.commentlist li, 
.commentlist li ul li {
	overflow: hidden;
	display: block;
	clear: both;
	margin: 0 0 25px 0;
	padding: 0 0 25px 0;
}

.commentlist li .children {
	margin-bottom: -25px;
}

.commentlist li .children li {
	display: block;
	background: none;
}

.commentlist li .children li .comment-body {
	border-left: 1px solid #e2e2d5;
}

.commentlist li .children li .comment-body p {
	margin-left: 35px;
}

.vcard {
	margin-bottom: 20px;
	overflow: hidden;
}

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

.vcard .comment-author {
	text-transform: uppercase;
}

.vcard .comment-date {
	font-size: 12px;
}

.vcard p a:hover {
	text-decoration: underline;
}

.vcard p {
	margin: 0;
	font-size: 14px;
}

.twitter-bird {
	float: left;
	display: inline;
	background: url(images/twitter.png) 0 center no-repeat;
	padding-left: 35px;
	margin-right: 15px;
}

.social-share {
	margin: 20px 0 10px 0;
}

footer.entry-meta {
	margin-bottom: 4em;
}

.entry-meta,
footer.entry-meta p {
	position: relative;
	float: none;
	display: block;
	font-size: 13px;
	margin: 0;
	line-height: 205%;
	color: #777;
	border-radius: 1px;
	/*margin-bottom: 10px;*/
}

footer.entry-meta .twitter-share {
	margin: 0 0 0 15px;
}

.share-button {
	float: left;
	display: inline;
	margin-right: 1em;
}

.twitter-share { }

.enjoyed {
	background: #f93;
	color: #111;
	padding: .3em .6em;
	margin: 0 .5em 0 0;
}

/*.comment-link {
	background: url(images/comment-icon.png) 0 center no-repeat;
	padding-left: 23px;
}
*/

#missing {
	list-style: none;
	/*font-size:15px;*/
}

.dribbble li a {
	float: left;
	display: block;
	min-height: 370px;
	}

/* Specific element styling */
.why-me {
	margin: 0 0 3em 3em;
}

.why-me li {
	margin-bottom: .6em;
}

.why-me li p {
	margin: 0;
	color: #777;
	font-style: normal;
	font-weight: normal;
}

.why-me li span {
	color: #adadad;
	font-style: italic;
	text-shadow: none;
}

article footer {
	padding: 25px 0 15px 0;
	margin: 5% 0 10% 0;
	background: none;
	float: left;
	width: 100%;
}

/* Portfolio page gallery */
.blueberry { margin: 0 auto; position: relative; }
.blueberry .slides {
	display: block;
	position: relative;
	overflow: hidden;
	margin: 40px 0 0 0;
	padding: 0;
}

.portfolio-detail ul.portfolio-thumbs.slides {
	margin: 0;
}

.blueberry .slides li {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.blueberry .slides li img {
	display: block;
	width: 100%;
	max-width: none;
}
.blueberry .slides li.active { display: block; position: relative; }
.blueberry .crop li img { width: auto; }

.blueberry .pager {
	height: 40px;
	background: #2a2a2a;
	opacity: .8;
	clear: both;
	float: left;
	width: 100%;
	text-align: center;
	margin: 0;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 100;
	
	border-radius: 2px;
}
.blueberry .pager li { display: inline-block; }
.blueberry .pager li a,
.blueberry .pager li a span {
	display: block;
	height: 8px;
	width: 8px;
	border: 0;
}
.blueberry .pager li a {
	padding: 18px 4px;
	-webkit-border-radius: 16px;
   -moz-border-radius: 16px;
	border-radius: 16px;
}
.blueberry .pager li a span {
	overflow: hidden;
	background: #fff;
	text-indent: -9999px;
	-webkit-border-radius: 5px;
   -moz-border-radius: 5px;
	border-radius: 5px;
}

.blueberry .pager li.active a span,
.blueberry .pager li a:hover span { 
	background: #f93; 
	}
	
	
html#qr {
	background-image: url(images/qrcode.png);
}	

html#qr body {
	background: none;
}

/* Promo slot on sidebar */
.promo-slot, .promo-slot a {
	text-align: center;
	float: left;
	width: 100%;
	height: 190px;
	margin-bottom: 1em;
	}

.promo-slot {
	background: #f2f2f2;
	border: 1px solid #eee;
	padding: .2em;
	height: auto;
	margin-bottom: 2em;
}

.promo-slot a {
	background: #fff url(images/cutting-edge-knives.jpg) center center no-repeat;
	}
	
.promo-slot a span {
	display: none;
	}	
	
.promo-slot p {
	font-size: .7em;
	margin: 0 0 1.8em 0;
	color: #888;
	}