@charset "UTF-8";

/*
Theme Name: Joe
Author: Gabi Moore & Joe Moore
Author URI: http://gabimoore.com/
*/

/* 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, font, 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 {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary, video { 
    display:block;
}

/* General Styles */

body {
	width: 960px;
	position: relative;
	padding: 70px 0 20px 20px;
	margin-right: 20px;
	font: 13px/1.5 Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
	color: #333;
	background-color: #F0F2EB;
}

a {
	color: #992e00;
	text-decoration: none;
}

a:hover {
	border-bottom: 1px dotted #992e00;
}

article {
}

p {
	margin: 8px 0;	
}

h1, h2, h3 {
	font-weight: normal;
	font-family: ChunkFive, Helvetica, Arial, sans-serif;
	}
	
h1 {
	font-size: 22px; 
}	

h2 {
	
	font-size: 18px;
}

h3 {
	
	font-size: 14px;
}
	
h1 strong {
	font-weight: normal;
}


/* Layout */

body > header, body > nav {
	float: left;
	width: 160px; 
	text-align: left;
	font-family: ChunkFive, Helvetica, Arial, sans-serif; 
}

body > header {
	clear: left;
}

body > nav {
	clear: left;
}


section#main, h1.error-page {
	width: 768px;
	padding-top: 0px;
	float: right;
	padding-left: 32px;
}

body > footer {	
	width: 160px;
	border-top: 1px solid #CDBDAE;
	padding: 24px 0;
	float: left;
	clear: left;
}

/* Left Column */	

body > header h1 {
	border-bottom: 1px solid #CDBDAE;
	padding-bottom: 20px;
}

body > header h1 a {
	color: #1f1f1f;	
	border: none;
}

body > header h1 a:hover {
	border: none;
	color: #76756B;
}

body > nav li {
	margin: 12px 0;	
	font-size: 16px;
	font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
}

body > nav li a {
	border-bottom: none;
	text-transform: lowercase;
	display: inline-block;
	padding: 10px 20px;
	margin-left: -20px;
	color: #76756B; 
}

body > nav li.current a {
	background-color: #76756B;
	border-bottom: none;
	color: #F0F2EB;
	text-shadow: 0px 0px 4px rgba(0,0,0,0.3);
}

body > nav li.current a:hover {
	background-color: #76756B;
	border-bottom: none;
	color: #F0F2EB;
	text-shadow: 0px 0px 4px rgba(0,0,0,0.3);
}

body > nav li a:hover {
	background-color: #a8a799;
	border-bottom: none;
	color: #000;
	text-shadow: 0px 0px 4px rgba(0,0,0,0.3);
} 

body > footer h1 {
	font-size: 16px;	
}

body > footer h1 a {
	text-transform: lowercase;
	border: none;
	color: #76756B; 
	font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
}

body > footer h1 a:hover {
	color: #1f1f1f; 
}

body > footer p {
	color: #76756B;
	line-height: 2;
}

small {
	color: #76756B;
	font-size: 10px;
	margin-top: 24px;
	display: block;
}

/* Headers */

section#main > header, section#main > article > header {
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 4px solid #CDBDAE;
	color: #fa3500;
	font-size: 24px;
}

section#main > article > header div, section#main > article > header h1 {	
	
}

body.single section#main > article > header div, body.single section#main > article > header h1 {
	display: inline;
	
}

body.single section#main > article > header {
	margin-top: -4px;
}

body.single section#main > article > header h1 {
	font-weight: bold;;
}


body.single section#main > article > header div a {
	text-transform: lowercase;
	font-style: italic;
	color: #CDBDAE;
	font-size: 20px;
}

body.single section#main > article > header div a:hover {
	color: #CDBDAE;
}

body.single article header span {
	color:#CDBDAE;
	padding:0 4px;
	font-size: 20px;
 }

/* Categories */


section.category > ol li, section.archive > ol li {
	margin-bottom: 32px;
	position: relative;
}

section.category article p, section.archive article p {
	margin: 8px 0;
}

section.category li header h1, section.archive li header h1 {
	font-size: 18px;
}

div#category-description {
	border-bottom:1px dotted #CDBDAE;
	font-size:17px;
	margin-bottom: 20px;
	padding-bottom:10px;
	color: #76756B;
	
}

/* Web and Video */

li.category-web {
	padding-left: 168px;	
	min-height: 78px;
}

.archive li.category-video {
	padding-left: 168px;	
	min-height: 130px;
}

li.category-web img, .archive li.category-video img {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 140px;
	height: 70px;
	border: 4px solid #CDBDAE;
}

.archive li.category-video img {
	height: auto;	
}

li.category-web img:hover, .archive li.category-video img:hover {
	border: 4px solid #1f1f1f;	
}

/* Videos */

body.page-id-6 section.category > ol {
	margin-right: -16px;	
}

body.page-id-6 section.category > ol li {
	width: 140px;
	float: left;
	margin: 0 16px 16px 0;
	position: relative;
	padding-top: 110px;
}

body.page-id-6 section.category > ol li img {
	width: 140px;
	height: 105px;
	position: absolute;
	top: 0px;
	left: 0px;
}

body.page-id-6 section.category li header h1 {
	font-size: 12px;
	font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
} 

/* Writing */

section#blog-posts {
	width:368px; 
	float:left; 
	margin-right: 32px;
}
	
section#short-stories {
	width:368px; 
	float:right; 
}

section#blog-posts li, section#short-stories li {
	margin-bottom: 20px;
}

header.writing-sub {
	margin:10px 0;
}

/* Tags */

.tags h1 {
	display: inline;
	color: #76756B;
	font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
	font-weight: bold;
	font-size: 10px;
	text-transform: uppercase;
}

.tags div {
	display: inline;
	font-size: 11px;	
}

/* Pagination */

nav.pagination {
	border-top:1px solid #DDDDDD;
	clear:both;
	padding-top:8px;
}

/* Single and Page */

div.entry-content h2 {
	margin-top: 10px;
}

body.single article {
	position: relative;
}

body.single article time {
	background-color: #CDBDAE;
	padding: 2px 20px;
	text-align: center;
	width: 120px;
	top: 48px;
	right: 0;
	position: absolute;
	font-size: 11px;
	text-transform: uppercase;
	color: #fff;
	font-weight: bold;
	text-shadow: 0px 0px 6px rgba(0,0,0,0.3);
}

body.single article footer p {
	margin-top: 0;
}

body.single div.entry-content {
	width: 576px;
	float: left;
}

body.single .entry-content video, body.single .entry-content audio, body.single .entry-content embed, body.single .entry-content object {
	width: 576px;
}

body.single article footer {
	float: right;
	width: 120px;
	padding: 20px;
	background-color: rgba(255,255,255,0.5);
}

body.single article footer > h1 {
	font-size: 14px;
}

body.single article footer p {
	font-size: 12px;
	margin-bottom: 12px;
}

body.single footer .tags h1 {
	display: block;
	margin-bottom: 0;
}

div.entry-content pre {
	background-color: #fff;
	border: 1px solid #CDBDAE;
	padding: 10px 0;
}

/* Single Web */

body.single .category-web a.view-original {
	margin: 18px 0 0 0;
	display: block;
	padding: 3px 6px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border: 1px solid #CDBDAE;
	font-size: 11px;
	text-align: center;
	color: #76756B;
	background-color: #eee;
	background-color: rgba(255,255,255,.9);
	}
	
body.single .category-web a.view-original:hover {
	background-color: #fff;
	background-color: rgba(0,0,0,.03);
}	

/* Blog */

body.single .category-blog-post div.entry-content {
	margin-bottom: 2em;
}

/* Blo Comments */

section#comments {
	clear:both;
}

section#comments h1, section#comments h2 {
	color: #76756B;
	font-size: 18px;
	margin-bottom: 10px;
	border-top:1px solid #CDBDAE;
	padding-top:10px;
}

.commentlist li {
	padding: 10px 0;
	border-top: 1px dotted #fff;
}

.commentlist li img {
	float: left;
	margin: 0 10px 10px 0;
}

section#comments form label {
	display: block;
}

section#comments form input, section#comments form textarea {
	margin-bottom: 10px;	
}



/* Images */

img.post-image{
	padding:8px;
	border:1px solid #ccc;
	width:264px;
	margin: 0 16px 10px 16px;
}

img.post-image.right{
	float:right;
	margin-right:0;
}

img.post-image.left{
	float:left;
	margin-left:0;
}

img.post-image.auto{
	width:auto;
}


/* Clearing Floats */

.group:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
	}
	
/* Audio Player */

.source {display:none;}

div#controls {
	width:764px; 
	margin:30px 0;
	border: 2px solid #CDBDAE;
	background-color: rgba(255,255,255,0.3);
	}

/* Table of Songs */
table#song-list {
	border:2px solid #CDBDAE;
	border-collapse: collapse;
}
	
table#song-list tr.category-music {
	cursor:pointer;
}
	
table#song-list tr.category-music:hover {
	background-color:#feffba;
	
}
	
table#song-list tr.selected-song {
	background-color: rgba(0,0,0,0.7); 
	color:#F0F2EB;
}
	
table#song-list tr.selected-song  a {
	color:#fff;
}
	
table#song-list tr.selected-song:hover {
	background-color: rgba(0,0,0,0.7); 
	cursor: default;
}
	
table#song-list td {
	padding:0 5px;
}
	
table#song-list th {
	padding: 4px 8px;
	background: #76756B; 
	color:#fff;
}
	
tr.category-music {
	background-color: rgba(255, 255, 255, 0.3);
}
	
tr.category-music:nth-child(2n) {
	background-color: rgba(255, 255, 255, 0.7);
}
	
td.song-name {
	width:150px;
	font-weight: bold;
}
	
td.song-name h2 {
	font-size: 13px;
	font-weight: bold;
	font-family:  Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
}
	
td.song-tags {
	width:200px;
	color: #999;
}

/* Track Display */
div#current-track {
	width:384px; 
	position:relative; 
	float:left;
	margin: 8px 16px 8px 0;
	padding: 8px;
	border: 1px solid #ece4de;
}
	
span#current-time {
	position: absolute; 
	bottom: 7px;
	left: 8px;
}
	
span#remaining-time {
	position: absolute; 
	bottom: 7px;
	right: 8px;
}
	
div#progress {
	width:260px; 
	margin: 0 auto;
}

h1#track-title {
	text-align:center; 
	margin-bottom:5px;
	font-size: 16px;
}
	
a.ui-slider-handle {
	display:none;
}

/* Volume Container */
div#volume-container { 
	float:right;  
	margin:28px 16px 0 0;
}

img#min-volume {
	float:left; 
	width:30px; 
	margin-right:12px; 
	width:15px;
}

img#max-volume {
	float:left; 
	width:30px; 
	margin-left:12px; 
	width:15px;
}

div#volume-slider {
	width:122px; 
	float:left;
	margin-top: 2px;
}


/* Button Container */
div#buttons {
	float:left; 
	margin:22px 24px 0 16px;
}
	
button#play {
	background:url(i/play.png); 
	width:30px; 
	height:30px; 
	border:0; 
	text-indent:-9999px; 
	cursor:pointer;
	margin:0 20px;
}
	
button#pause {
	background:url(i/pause.png); 
	width:30px; 
	height:30px; 
	border:0; 
	text-indent:-9999px; 
	cursor:pointer;
	margin:0 20px;
}
	
button#previous {
	background:url(i/previous.png); 
	width:20px; 
	height:20px; 
	border:0; 
	text-indent:-9999px; 
	cursor:pointer;
}

button#next {
	background:url(i/next.png); 
	width:20px; 
	height:20px; 
	border:0; 
	text-indent:-9999px; 
	cursor:pointer;
}

button#play.disabled {
	background:url(i/play-disabled.png); 
	cursor:auto;
}
	
button#pause.disabled {
	background:url(i/pause-disabled.png);
	cursor:auto;
}

button#previous.disabled {
	background:url(i/previous-disabled.png); 
	cursor:auto;
}

button#next.disabled {
	background:url(i/next-disabled.png); 
	cursor:auto;
}

.toasty {
	position:absolute;
	display:none;
}


/* Fonts */	
	
@font-face {
	font-family: 'ChunkFive';
	src: url('f/Chunkfive-webfont.eot');
	src: local('☺'), url('f/Chunkfive-webfont.woff') format('woff'), url('f/Chunkfive-webfont.ttf') format('truetype'), url('f/Chunkfive-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}