/*=============================================================
Type:			All Markedup Up - main stylesheet
---------------------------------------------------------------
Author:			Mark Perkins
Contact:		mark@allmarkedup.com
=============================================================*/

/*==============================================

Layout is based on a 6 column grid.

Outer gutters - 3%
Inner gutters - 2%
column widths - 15%

==============================================*/

@font-face {
  font-family: 'Museo Sans';
  src: url(/common/fonts/MuseoSans_500.otf);
}

/*=============================================================
Some layout styles & typographic defaults...
=============================================================*/

body {
	background: #FFF;
	color: #555;
	font-family: Georgia, Palatino, "Palatino Linotype", serif;
}

p, li, time, blockquote {
	font-size: 1.5em;
	line-height: 1.6;
	margin: 0 0 1.0em 0;
}

a {
	color: #111;
	text-decoration: none;
	border-bottom: 1px solid #999;
}

a:hover {
	color: #932626;
}

.segment {
	padding-left: 3%;
	padding-right: 3%;
}

.contents {
	max-width: 96.0em;
	min-width: 76.0em;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.main {
	width: 66%; /* 4 columns */
	float: left;
	margin-right: 2%;
}

.sub {
	width: 32%; /* 2 columns */
	float: left;
}

#main {
	min-height: 300px;
}

h1 {
	font-family: "Museo Sans", Helvetica, "Helvetica Neue", Arial;
	font-size: 2.0em;
	line-height: 1.0;
	margin: 1.0em 0;
	text-shadow:0 2px 2px #FFFFFF;
}

h1 a {
	border-bottom: 0;
	color: #555;
}

h2 {
	font-family: "Museo Sans", Helvetica, "Helvetica Neue", Arial;
	font-size: 1.7em;
	line-height: 1.2;
	margin: 1.0em 0 ;
}

strong {
	font-weight: bold;
}

/*=============================================================
The header 
=============================================================*/

header h1 {
	margin-bottom: 0;
	font-size: 3.2em;
}


header h1 a, header h1 a:hover {
	color: #932626;
	border: 0;
}

header h2 {
	font-size: 1.5em;
	margin: 0.6em 0 0 0;
	padding-bottom: 1.3em;
	border-bottom: 1px dotted #CCC;
	color: #777;
	font-family: Georgia, Palatino, "Palatino Linotype", serif;
	font-style: italic;
}

header nav {
	margin-bottom: 2.0em;
	border-bottom: 1px dotted #CCC;
}

header li {
	float: left;
	width: 15%;
	margin: 0.75em 2% 0.75em 0;
}

header li:last-child {
	margin-right: 0;
}

header li a {
	font-family: "Museo Sans", Helvetica, "Helvetica Neue", Arial;
	color: #333;
	text-decoration: none;
	float: left;
	border: 0;
}

.home header li.home a,
.journal header li.journal a,
.code header li.code a,
.about header li.about a {
	text-decoration: line-through;
}

header li a:hover {
	border: 0;
	color: #932626;
}

/*=============================================================
Content
=============================================================*/

section > p:first-child {
	margin-top: 1.0em;
} 

/* homepage */

#tea_pic {
	width: 100%;
	height: 300px;
	margin: 1.0em 0 1.2em 0;
	overflow: hidden;
	position: relative;
}

#tea_pic img {
	position: relative;
}

#tea_pic p#photo_details {
	position: absolute;
	bottom: 10px;
	right: 10px;
	font-size: 1.1em;
	color: #FFF;
	margin: 0;
	padding: 5px 10px 5px 30px;
	background: rgba(48, 48, 48, .50) url('../images/flickr.png') no-repeat 8px 6px;
	
}

p#photo_details span {
	font-style: italic;
}

p#photo_details a {
	color: #FFF;
	border-bottom: 0;
}

.home .sub {
	border-top: 1px dotted #CCC;
}

/* standout boxes */

.sub .important {
	border: 1px dotted #CCC;
	background: #f5f5f5;
	margin-top: 1.5em;
	font-size: 0.9em;
	color: #777;
}

.sub .important {
	padding: 0 5% 5% 5%;
}

.sub .important h1 {
	margin-bottom: 0.5em;
	color: #222;
}

/* downloads */

.sub .downloads li {
	border-bottom: 0;
	list-style: none;
	margin-bottom: 0;
}

.sub .downloads p {
	margin-bottom: 0
}

.sub .downloads span {
	font-style: italic;
}


/* homepage */

.home .sub {
	float: left;
	margin-right: 2%;
}

.home .sub:last-child {
	margin-right: 0;
}

/* blog */

.journal .main {
	width: 83%;
}

.journal .sub {
	width: 15%;
}

article {
	padding: 3.0em 0 1.5em 0;
	float: left;
	width: 100%;
}

.list article {
	border-bottom: 1px dotted #CCC;
}

article .post_meta, .comment_meta {
	width: 18.072%;
	float: left;
	margin-right: 2.409%;
}

article .post_body, .comment_body {
	float: left;
	width: 79.518%;
}

.main article p, .comment_body p {
	padding-right: 21.0%;
}

section time {
	float: left;
	width: 80%;
	font-size: 1.3em;
	font-style: italic;
	color: #999;
	display: none;
	margin-top: -2px;
}

time.primary {
	display: block;
}

.post_tags {
	font-size: 1.1em;
}

.post_tags a {
	background: #EEE;
	padding: 3px 6px;
	border-bottom: 0;
}

.footnote {
	border-top: 1px dotted #CCC;
	padding-top: 20px;
}

.footnote h3 {
	font-size: 1.3em;
	font-style: italic;
	margin-bottom: 1.0em;
	font-weight: bold;
}

.footnote p {
	font-size: 1.2em;
	font-style: italic;
}

a.permalink {
	font-size: 1.5em;
	border-bottom: 0;
	margin-right: -6%;
	float: right;
	font-family: Georgia, Palatino, "Palatino Linotype", serif;
	color: #999;
	font-size: 1.8em;
}

a.permalink:hover {
	color: #932626;
}

.quotes_category  a.permalink {
	font-size: 4.2em;
}

.links_category  a.permalink {
	font-size: 2.0em;
}

.notes_category  a.permalink {
	font-size: 1.8em;
	margin-top: -1px;
}

p.pagination {
	padding: 1.0em 0 1.5em 0;
	clear: left;
}

p.pagination a {
	float: left;
	border-bottom: 0;
}

p.pagination a:last-child {
	float: right;
}

.post_main_meta {
	border-top: 1px dotted #CCC;
	border-bottom: 1px dotted #CCC;
	padding: 1.0em 21.0% 1.0em 20.481%;
	background: #F9F9F9;
	font-size: 1.3em;
	font-style: italic;
	color: #888;
	clear: both;
	margin-bottom: 2.0em;
}

.post_main_meta a {
	color: #888;
}

#taglist {
	padding-top: 3.0em;
}

#taglist h1 {
	margin-top: 0;
}

/* comments etc */

#comments h2 {
	padding-left: 20.481%;
	margin-bottom: 1.7em;
}

#respond {
	padding-left: 20.481%;
}

#respond p label {
	padding-left: 10px;
	color: #999;
}

#respond #submit {
	border: 0px;
	padding: 3px 9px;
	background: #999;
	color: #FFF;
	font-size: 0.9em;
	font-family: Georgia, Palatino, "Palatino Linotype", serif;
	font-style: italic;
	margin-top: 10px;
	cursor: pointer;
}

#respond #submit:hover {
	background: #666;
}

#respond input[type=text], #respond textarea {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	color: #888;
}

ol#comment_list {
	list-style: none;
}

ol#comment_list li {
	border-bottom: 1px dotted #CCC;
}

.comment_meta time {
	display: block;
	font-size: 0.8em;
	width: 60%;
}

.comment_meta time a {
	color: #999999;
	border-bottom: 0;
}

.comment_meta img {
	float: right;
}


/* some common content elements */

article h1 {
	margin-top: 0;
}

article h1 a {
	border-bottom: 0;
}

article h2 {
	margin-bottom: 0.2em;
	color: #222;
}

blockquote p {
	color: #999;
	font-style: italic;
	font-size: 1.2em;
	line-height: 1.4;
}

section ul li {
	list-style: none;
	padding-left: 22px;
	background: url('../images/bullet_arrow.png') no-repeat 0 0.4em;
}

/* syntax highlighting */

.wp_syntax {
	border: 1px dotted #CCC !important;
	border-left: 0px !important;
	border-right: 0px !important;
}

.wp_syntax div.code {
	padding: 14px 10px;
}

.wp_syntax span {
		line-height: 1.4em !important;
}

/*=============================================================
Footer
=============================================================*/

footer {
	border-top: 1px dotted #CCC;
	clear: both;
	padding: 2.0em 0;
}

footer p {
	font-size: 1.3em;
}