/* 
Theme Name: Above the Crowd
Version: 1.0
Author: Fuzzco
Author URI: http://www.fuzzco.com
*/

/* $typography & colors
------------------------------------------------

"arno-pro"				Regular (400)	Semibold (600)	Bold (700)
"lucida grande", "lucida sans"	Regular (400)	Regular Italic	Medium (500)
	
light green 	#82B78F
dark green		#539163
light grey		#949494
dark grey		#474747

h1 = Blog Title
h2 = Page Title
h3 = Post Title
h4 = Sidebar Titles
h5 = Share Labels
											  */

/* $reset
--------------------------------------------- */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center,
dl, dt, dd, ol, ul, li,fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
	}
body {
	line-height: 1;
	}
ol, ul {
	list-style: none;
	}
blockquote, q {
	quotes: none;
	}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
	}
table {
	border-collapse: collapse;
	border-spacing: 0;
	}

/* $global
--------------------------------------------- */
body {font: normal 16px/24px "lucida grande", "lucida sans", "Helvetica Neue", Helvetica, Arial, sans-serif; background: url('-/img/background-lite.gif') repeat-x #FFF; color: #555;}
em {font-style: italic;}
strong {font-weight: 500;}
a {outline: none;}
a:link, a:visited {text-decoration: none; color: #539163;}
a:hover {color: #3a6646; -webkit-transition: color .5s linear; transition: color .5s linear;}

h1, h1 a:link, h1 a:visited {font: 700 75px/1 "arno-pro", Palatino, Georgia, Times, "Times New Roman", serif; letter-spacing: -3px; color: #474747;}
h2 {margin: 40px 0 0; padding: 15px 0; border-top: 3px solid; border-bottom: 5px solid; font-size: 24px; line-height: 100%; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;}
h3, h3 a:link, h3 a:visited {font: 400 45px/46px "arno-pro", Palatino, Georgia, Times, "Times New Roman", serif; color: #474747;}
h4, h5 {font-size: 16px; line-height: 100%; text-transform: uppercase; letter-spacing: 1px;}
h4 {font-family: "arno-pro", Palatino, Georgia, Times, "Times New Roman", serif; color: #6D6E70;}
h5 {font-weight: 500; color: #929496;}
h1 a:hover, h3 a:hover {color: #539163;}

::selection {background: #539163; color: #fff;}
::-moz-selection {background: #539163; color: #fff;}
*:focus {outline: none}
.clear:before, .clear:after {content: ""; display: table;}
.clear:after {clear: both;}
.clear {zoom:1;}
.hide {display: none;}
::-webkit-input-placeholder {}
:-moz-placeholder {}
input[type=text],
input[type=submit] {-webkit-appearance: none;}
	
/* $layout
--------------------------------------------- */
* {margin: 0;}
html, body {height: 100%;}
.push {height: 44px;}
.wrapper {margin: 0 auto -44px; min-height: 100%; height: auto !important; height: 100%; width: 100%;}
.container {margin: 30px auto; width: 992px;}
.main {float: left; width: 656px;}
.sidebar {float: right; width: 230px;}

/* Header */
header {margin: 0 0 40px 127px;}
nav {margin: 0 0 40px;}
nav li {display: inline; padding: 0 20px 0 0;}
nav a:link, nav a:visited {font-weight: 600; font-size: 15px; line-height: 100%; color: #929496;}
nav a:hover {color: #539163;}
.byline {letter-spacing: 3px; color: #474747;}

h1 {margin: 0 0 10px; line-height: 56px; border-bottom: 3px solid;}

/* $posts
--------------------------------------------- */
.post-title {margin: 0 0 20px 127px;}
.post-content {margin: 0 0 20px;}
.post-content a {text-decoration: underline;}
.post-content * {margin: 0 0 12px 127px;}
.post-content span, .post-content a, .post-content img, .post-content strong, .post-content bold, .post-content em, .post-content italic, .post-content del, .post-content iframe {margin: 0;}
.post-content h1, .post-content h2, .post-content h3, .post-content h4, .post-content h5, .post-content h6 {margin: 20px 0 12px 127px; font-family: "arno-pro", Palatino, Georgia, Times, "Times New Roman", serif; color: #6D6E70; text-transform: uppercase; letter-spacing: 1px;}
.post-content ul, .post-content ol {margin: 0 0 12px 147px;}
.post-content li {margin: 0 0 5px;}
.post-content ul {list-style: disc;}
.post-content ol {list-style: decimal;}
.post-content blockquote {margin: 0 20px 12px 147px;}
.hide-date {display: none;}
.post-date {display: inline; font-weight: 700;}
.post-content .img-link, .post-content img, .post-content iframe {display: block; float: right;}
.post-content img { margin: 20px 0 40px 20px; height: auto; max-width: 630px;}
.post-content .post-thumbnail {margin-top: 0;}

.post-actions {margin: 0 0 50px 127px; padding: 15px 0; border-top: 3px solid; border-bottom: 3px solid;}
.post-actions h5 {float: left; line-height: 30px;}
.share-post {float: left;}
.share-link {display: block; float: left; margin: 0 0 0 5px; padding: 4px; border: 2px solid #fff; height: 18px; width: 18px; background: url('-/img/icon-share.png') no-repeat 0 0;}
.share-link span {display: none;}
.share-link:hover {border-color: #FDD158;}
.share-twitter {margin: 0 0 0 15px;}
.share-twitter:hover {background-position: -22px 0;}
.share-google {background-position: 0 -24px;}
.share-google:hover {background-position: -22px -24px;}
.share-facebook {background-position: 0 -48px;}
.share-facebook:hover {background-position: -22px -48px;}

.post-actions .read-more {float: right;}
.post-actions .read-more a {display: block; padding: 0 10px 0 0; height: 30px; background: url('-/img/icon-read-more.png') no-repeat right top;}
.post-actions .read-more a:hover {background-position: right -30px; -webkit-transition: none; transition: none;}

/* $comments
--------------------------------------------- */
#comments {margin: 0 0 40px 127px;}

/* Comment List */
.commentlist {margin: 10px 0 40px;}
.comment, .pingback {padding: 15px 0 0; border-top: 1px solid #DEDEDE;}
.pingback {padding: 15px 0;}

.comment-meta {float: left; padding: 0 0 10px; width: 150px;}
.comment-meta span {display: block;}
.comment-author {font-weight: 500;}
.comment-date {font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: 1px; color: #666;}

.comment-awaiting-moderation {display: block; float: right; margin: 0 0 5px; width: 325px;}
.comment-body {float: right; padding: 0 0 10px; width: 325px; font: 17px/22px "arno-pro", Palatino, Georgia, Times, "Times New Roman", serif;}
.comment-body p {margin: 0 0 10px;}
.comment-reply-link {display: block; margin: 5px 0 0; font: normal 16px/26px "lucida grande", "lucida sans", "Helvetica Neue", Helvetica, Arial, sans-serif;}

.real-thread {margin: 0 0 20px;}
.depth-2 {border-top-color: #efefef; color: #777;}
.depth-2 .comment-date {color: #999;}
.depth-2 a:link, .depth-2 a:visited {color: #82B78F;}
.depth-2 a:hover {color: #539163;}

/* Comment Form */
#reply-title {padding: 0 0 10px; border-bottom: 1px solid #dedede;}
#reply-title #cancel-comment-reply-link {text-transform: none; letter-spacing: 0;}
#commentform {margin: 10px 0 40px;}
#commentform .logged-in-as, #commentform .comment-notes {margin: 0 0 10px; font-size: 12px;}
#commentform label {display: block; font-weight: 500;}
#commentform input[type="text"], #respond textarea {margin: 0 0 10px; padding: 10px; border: 1px solid #ccc; width: 507px; font: 18px/26px "arno-pro", Palatino, Georgia, Times, "Times New Roman", serif; color: #474747;}
#commentform input[type="text"] {padding: 12px 10px 10px; line-height: 100%;}
#commentform textarea {height: 150px; resize: none; scrollbar: none;}
#commentform input[type="text"]:focus, #respond textarea:focus {border-color: #539163;}
#commentform input[type="submit"] {padding: 10px 20px; border: 0 none; outline: 0 none; font: 500 16px/1 franklin-gothic-urw, 'Helvetica Neue', Helvetica, Arial, sans-serif; text-transform: uppercase; letter-spacing: 1px; color: #fff; background: #539163;}
#commentform input[type="submit"]:hover {background: #3a6646; cursor: pointer;}

#commentform .cptch_block {padding-bottom: 1.5em; padding-top: 1em;}

/* $sidebar
--------------------------------------------- */
.sidebar {padding: 56px 0 0; font: 14px/22px "arno-pro", Palatino, Georgia, Times, "Times New Roman", serif; color: #949494;}
.sidebar section {margin: 0 0 40px;}
.sidebar section.above-illo {margin: 0 0 30px; height: 170px; width: 100%; background: url('-/img/above-illo.png') no-repeat center;}

.sidebar a:link, .sidebar a:visited {color: #82B78F;}
.sidebar a:hover {color: #539163;}
.sidebar h4, .sidebar h5 {padding: 10px 0; border-bottom: 1px solid #dedede;}
.sidebar h4 {border-top: 1px solid #dedede;}

.sidebar h4 a, .follow-twitter {font: 500 16px/1 "lucida grande", "lucida sans", "Helvetica Neue", Helvetica, Arial, sans-serif;}
.sidebar h4 a {float: right; text-transform: none;}
.sidebar h4 .twitter-label {float: left; font: 16px/100% "arno-pro", Palatino, Georgia, Times, "Times New Roman", serif; text-transform: uppercase; letter-spacing: 1px; color: #6D6E70;}
.sidebar h4 .twitter-label:hover {color: #333;}
.tweet, .popular-post {padding: 15px 0 12px; border-bottom: 1px solid #dedede;}
.follow-twitter a:link, .follow-twitter a:visited {display: block; padding: 0 0 0 30px; height: 20px; line-height: 20px; background: url('-/img/icon-twitter.png') no-repeat 0 0; font-size: 14px; color: #539163;}
.follow-twitter a:hover {background-position: 0 -20px; color: #3a6646;}

.popular-posts {margin: 0 0 20px;}

#searchform {
	margin-top: 20px;
	height: 85px;
}
#searchform input {
	font: 14px/22px "arno-pro", Palatino, Georgia, Times, "Times New Roman", serif;
	color: #555;
}
#searchform input[type="text"] {
	width: 208px;
	height: 22px;
	padding: 6px 10px;
	border: 0;
	outline: 0;
	border: 1px solid #474747;
}
#searchform input[type="text"]:focus {
	background: #f7f7f7;
}
#searchform input[type="submit"] {
	padding: 7px 14px 5px;
	outline: none;
	border: none;
	color: #fff;
	background: #474747;
	cursor: pointer;
	float: right;
	margin: 10px 0 0 0;
}
#searchform input[type="submit"]:hover {
	background: #539163;
}


/* $post navigation
--------------------------------------------- */
.post-navigation-wrapper {padding: 15px 0; background: #474747; width: 100%;}
.post-navigation {margin: 0 auto; width: 992px;}
.post-navigation nav {float: left; margin: 0 0 0 127px; width: 509px;}
.post-navigation nav a {display: block; background: url('-/img/icon-navigation.png') no-repeat right top; font-size: 14px; line-height: 14px; height: 14px; text-transform: uppercase; letter-spacing: 1px; color: #efefef;}
.post-navigation nav a:hover {color: #fff;  -webkit-transition: none; transition: none;}
.post-navigation .old-posts-link {float: left;} 
.post-navigation .old-posts-link a {padding: 0 0 0 20px; background-position: 0 -28px;}
.post-navigation .old-posts-link a:hover {background-position: 0 -42px;}
.post-navigation .new-posts-link {float: right;}
.post-navigation .new-posts-link a {padding: 0 20px 0 0; }
.post-navigation .new-posts-link a:hover {background-position: right -14px;}

/* $archives
--------------------------------------------- */
.archives-wrapper {margin: 0 0 0 127px;}
.archives-wrapper h3 {margin: 0 0 30px;}
.archives-column {float: left; margin: 0 79px 0 0; width: 300px; line-height: 20px;}
.archives-column-right {margin-right: 0; width: 150px;}
.archives-column h5 {margin: 0 0 15px;}

.archives-column ul {padding: 0 0 0 18px; list-style: disc; list-style-position: outside; color: #539163;}
.archives-column ul li {margin: 0 0 10px;}
.archives-column-right ul {padding: 0; list-style: none;}

/* $retina
--------------------------------------------- */
@media only screen and (-webkit-min-device-pixel-ratio: 2),
       only screen and (-moz-min-device-pixel-ratio: 2),
       only screen and (-o-min-device-pixel-ratio: 2/1),
       only screen and (min-device-pixel-ratio: 2) {
       
       	/* Basic Styles */
       	body {background: url('-/img/background-lite@2x.gif') repeat-x #fff; background-size: 1px 10px;}
       
       	/* Posts */
       	.share-link, .share-link:hover {background: url('-/img/icon-share@2x.png') no-repeat 0 0; background-size: 48px 144px;}
       	.share-google, .share-google:hover {background-position: 0 -48px;}
       	.share-facebook, .share-facebook:hover {background-position: 0 -96px;}
       
       	/* Sidebar */
       	.sidebar section.above-illo {background: url('-/img/above-illo@2x.png') no-repeat center; background-size: 230px 170px;}
		.follow-twitter a:link, .follow-twitter a:visited {background: url('-/img/icon-twitter@2x.png') no-repeat 0 0; background-size: 46px 80px;}
		.follow-twitter a:hover {background-position: 0 -40px;}
		
		/* Post Navigation */
		.post-navigation nav a {background: url('-/img/icon-navigation@2x.png') no-repeat right 0; background-size: 12px 48px;}
		.post-navigation .new-posts-link a:hover {background-position: right -12px;}
		.post-navigation .old-posts-link a {background-position: 1px -24px;}
		.post-navigation .old-posts-link a:hover {background-position: 1px -36px;}
}