/* Step #1 - Eric Meyer's Reset */

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

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;
}

/* Step #2: */

@font-face {
    font-family: 'MuseoSans500';
    src: url('fonts/MuseoSans_500-webfont.eot');
    src: url('fonts/MuseoSans_500-webfont.eot?iefix') format('embedded-opentype'),
         url('fonts/MuseoSans_500-webfont.woff') format('woff'),
         url('fonts/MuseoSans_500-webfont.ttf') format('truetype'),
         url('fonts/MuseoSans_500-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Museo500';
    src: url('fonts/Museo500-Regular-webfont.eot');
    src: url('fonts/Museo500-Regular-webfont.eot?iefix') format('embedded-opentype'),
         url('fonts/Museo500-Regular-webfont.woff') format('woff'),
         url('fonts/Museo500-Regular-webfont.ttf') format('truetype'),
         url('fonts/Museo500-Regular-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* Step #2: Global Styles */

html
{
	color			: #080000;
	/*background-color: #eeeef3;*/
	background-color: white;
	/*font-family		: Palatino,Georgia,"Times New Roman",serif;*/
    font-family     : MuseoSans500, Arial, Helvetica, Sans-Serif;
	font-size		: 14px;
}

body
{
	-webkit-text-size-adjust: 100%;
}

body.customize-support {
	padding-top: 20px;
}

h1
{
font-family		: "Open Sans", sans-serif;
font-weight: bold;
}

h2
{
font-family		: "Open Sans", sans-serif;
font-weight: bold;

}

h3
{
	font-family			: "Open Sans", sans-serif;
	font-size			: 1.5em;
	text-transform		: lowercase;
	font-weight			: normal;
}

h4
{
	font-family			: "Open Sans", sans-serif;
	font-weight			: bold;
	text-transform		: lowercase;
}

h5
{
font-family		: "Open Sans", sans-serif;
font-weight: bold;

}

h6
{
font-family		: "Open Sans", sans-serif;
font-weight: bold;

}

p
{
	line-height		: 2em;
	margin			: 1em 0;
}

ul
{
	line-height		: 2em;
	margin			: 1em 0;
}

ol
{
	line-height		: 2em;
	margin			: 1em 0;
}

li
{
}

strong
{
	font-weight		: bold;
}

em
{
	font-style		: italic;
}

i
{
	font-style		: italic;
}

b
{
	font-weight		: bold;
}

u
{
}

a
{
	color			: #2d91e6;
	text-decoration	: none;
}

a:visited
{
	color			: #2d91e6;
	text-decoration	: none;
}

a:active
{
	outline			: none;
	color			: #45aaff;
	text-decoration	: underline;
}

a:hover
{
	outline			: none;
	color			: #45aaff;
	text-decoration	: underline;
}

/*.js #content p a,
.js #content li a
{
	display: none;
}*/

table
{
}

tr
{
}

th
{
}

td
{
}

img
{
}

blockquote
{
	line-height				: 1.5em;
	padding					: 10px;
	margin					: 1em 2em;
	background-color		: rgba(128, 155, 185, 0.5);
	font-size				: 16px;
}

blockquote cite {
	text-align: right;
	font-style: normal;
	display: block;
	position: relative;
}

blockquote cite:before {
	content: " - ";
}

blockquote cite a {
	display: block;
}

/* mobile */
@media handheld, only screen and (max-device-width: 480px)
{
	html
    {
        font-size: 32px;
    }
}


/* Step #3: Specific Styles */

/*___ DIV _________________________________________________________________*/

#container
{
	padding					: 0 5px;
}

footer
{
	height						: 200px;
	background-color	: #2D91E6;
	background-image	: url(images/forest.png), url(images/hills.png), url(images/mountains.png), url(images/clouds.png);
	position					: relative;
	overflow					: hidden;
}

#container
{
	padding-top			: 10px;
}
/*
header
{
	height						: 150px;
	background				: transparent url(images/header.png) no-repeat right top;
	border						: solid 3px #fff;
	-webkit-box-shadow: 0 0 5px #080000;
	-moz-box-shadow : 0 0 5px #080000;
	box-shadow			: 0 0 5px #080000;
	max-width				: 844px;
	margin					: 0 auto;
	position					: relative;
}
*/
#content
{
	max-width				: 750px;
	padding					: 0 50px;
	margin					: 0 auto;
	position					: relative;
	z-index					: 1;
}

.comic
{
	margin					: 2em -50px;
}

#menu
{
	position					: relative;
	max-width				: 850px;
	height						: 1px;
	margin					: 0 auto;
	z-index					: 2;
}

footer .wrapper
{
	max-width				: 850px;
	margin					: 0 auto;
	position					: relative;
	height						: 200px;
}

#copyright
{
	position				: absolute;
	bottom					: 5px;
	right					: 50px;
	text-align				: right;
	color					: white;
	font-size				: 10px;
	font-family				: Arial, Helvetica, sans-serif;
	font-weight				: bold;
}

#content .post + .post
{
	padding-top		: 15px;
}

.tags
{
	font-size				: 0.9em;
	line-height			    : 1.5em;
	border					: solid 2px #080000;
	padding				    : 10px;
	/*margin				: 1em 0;*/
	background-color        : #08000;
}

.postmetadata,
#commentform
{
	padding				: 10px;
	margin				: 1em 0;
	background-color	: #333;
	color					: #bdbec1;
}

.postmetadata div
{
	line-height			: 1.5em;
	border				: none;
	padding				: 0;
}

#contact
{
	background-color	: black;
	color				: white;
	padding				: 10px;
	display				: block;
	position			: absolute;
    left				: 165px;
    margin				: 0;
    padding				: 10px;
    top					: 15px;
    width				: 360px;
}

#contact div
{
	margin-bottom		: 3px;
}

/*___ SPAN _________________________________________________________________*/

#spnComicNav
{
	display				: block;
	width				: 100%;
	margin				: 1em 0;
	text-align			: center;
}

#commentform label > span
{
	display				: block;
	margin-bottom		: 3px;
}

#filterWarning
{
	display				: block;
	font-size			: 10px;
	font-family			: Arial, Helvetica, sans-serif;
}

.byline
{
	font-size			: 20px;
	font-family		: 'Open Sans', sans-serif;
	font-weight		: bold;
	text-transform	: lowercase;
}

.eg-image
{
	display				: block;
	width				: 80px;
	height				: 80px;
	border				: solid 3px white;
	-moz-box-shadow		: 0 0 5px #080000;
	-webkit-box-shadow	: 0 0 5px #080000;
	box-shadow			: 0 0 5px #080000;
	background			: transparent url(images/default-comment-icon.png) no-repeat left top;
}

#char-left , #send-response-wrapper,#facebook-respond-wrapper,#blog-respond-wrapper{
	width: 410px;
	text-align: center;
	margin: 0 auto 5px;
	display: block;
}

#blog-respond-wrapper, #facebook-respond-wrapper {
	font-size: 14px;
}

#char-left.low {
	color: #ff3131;
	text-shadow: 1px 1px 1px black;
}

/*___ H1 _________________________________________________________________*/

#content h1
{
	font-family		    : 'Open Sans', sans-serif;
	font-size			: 32px;
	text-transform	    : lowercase;
    margin				: 0 -50px 5px -50px;
    padding				: 0;
	color				: #080000;
    font-weight         : normal;
	border-top			: solid 2px black;
	padding-top			: 5px;
}

#content #post-2 h1 {
	border-bottom		: solid 2px black;
	padding-bottom		: 5px;
}

/*___ H2 _________________________________________________________________*/

header h2
{
	bottom				: 5px;
    color				: white;
    font-size			: 0.8em;
    font-style			: italic;
    position			: absolute;
    right				: 5px;
    font-weight			: bold;
}

/*___ H3 _________________________________________________________________*/

footer h3
{
	font-size			: 17px;
	font-weight		: normal;
	color					: white;
}

#about-links ~ h3
{
	clear				: both;
}

/*___ H4 _________________________________________________________________*/

.responses h4 {
	margin: 0 0 10px;
	font-size: 20px;
	line-height: 26px;
    font-weight: normal;
}

#share-with-others h4 {
	text-align: left;
	margin-top: 20px;
}

/*___ H5 _________________________________________________________________*/

.responses h5 {
	text-align: center;
	margin: 10px 0;
	font-size: 18px;
	line-height: 20px;
	padding: 3px;
	color: #bdbec1;
	text-transform: lowercase;
    text-decoration: underline;
    font-weight: normal;
}

/*___ H6 _________________________________________________________________*/

/*___ P _________________________________________________________________*/

.tags p
{
	margin			: 0;
}

.nocomments {
	display: none;
}

/*___ UL/OL _________________________________________________________________*/

#menu ul
{
	margin			: 10px 0 0;
}

#social-list
{
	position		: absolute;
	color			: #EDFFF4;
	line-height		: 20px;
	margin			: 0;
	width			: 100%;
	height			: 1px;
}

#social-list ul
{
	line-height		: 20px;
	margin			: 0;
	text-transform: lowercase;
}

#about-links
{
	font-size			: 0.9em;
	line-height			: 1.5em;
	border				: solid 2px #080000;
	padding				: 10px;
	margin				: 1em 0;
	background-color	: #809bb9;
	max-width			: 200px;
}

#commentlist ul
{
	margin-left			: 2em;
	list-style-type		: disc;
}

#commentlist ol
{
	margin-left			: 2em;
	list-style-type		: decimal;
}

ol.numerical {
	list-style-type		: decimal;
	margin-left			: 2em;
}

/*___ LI _________________________________________________________________*/

#social-list > li
{
	padding			: 10px;
	position		: absolute;
	background-color: #000;
}

#social-list .rss
{
	left			: 50px;
	top				: 15px;
	width			: 80px;
	height			: 60px;
}

#social-list .elsewhere
{
	left			: 50px;
	top				: 110px;
	width			: 80px;
}

#social-list .mindfly
{
	right			: 50px;
	top				: 15px;
	width			: 220px;
	text-align		: center;
}

.commentlist li
{
	background-color: #809bb9;
	padding			: 10px;
	margin			: 1em 0;
	color					: white;
}

#social-list .search
{
	right			: 50px;
	top				: 70px;
}

/*___ STRONG/B _________________________________________________________________*/

/*___ EM/I _________________________________________________________________*/

/*___ U _________________________________________________________________*/

/*___ A _________________________________________________________________*/

#content .timestamp
{
    display					: block;
	font-size				: 16px;
    font-family				: 'Open Sans', sans-serif;
	text-transform			: lowercase;
	margin-left				: -50px;
	margin-right			: -50px;
	border-bottom			: solid 2px black;
	padding-bottom			: 10px;
}

/*
header h1 a,
header h1 a:active,
header h1 a:visited,
header h1 a:hover
{
	color					: #EDFFF4;
	font-size				: 2.5em;
	left						: 22%;
	top						: 15px;
	position				: absolute;
}*/

#menu a
{
	position		: absolute;
	top				: 0;
	display			: block;
	width			: 44px;
	height			: 44px;
	background-color: #809bb9;
	color			: white;
	-moz-box-shadow : inset 0 0 5px #000000;
	box-shadow		: inset 0 0 5px #000000;
	text-align		: center;
	font-family		: Arial, Helvetica, sans-serif;
	text-transform	: uppercase;
	font-weight		: bold;
	font-size		: 10px;
	-moz-border-radius: 22px;
	-webkit-border-radius: 22px;
	border-radius	: 22px;
	line-height		: 44px;
}

#menu a:hover
{
	background-color: #4D5E1D;
	text-decoration	: none;
}

#menu .show-link
{
	left			: 0;
}

#menu .comic-link
{
	left			: 50px;
}

#menu .shop-link
{
	left			: 100px;
}

#menu .blog-link
{
	right			: 100px;
}

#menu .brew-link
{
	right			: 50px;
}

#menu .about-link
{
	right			: 0;
}

#social-list li li a
{
	font-size		: 15px;
}

.aComicPost
{
	display					: block;
    font-size				: 16px;
    font-family				: 'Open Sans', sans-serif;
	margin					: 5px 0 5px;
	font-weight				: normal;
	padding-bottom			: 10px;
	border-bottom			: solid 2px black;
}

#spnComicNav a
{
	margin					: 0 0.5em;
}

#ariaLink
{
	display			: block;
	width			: 1px;
	height			: 1px;
	text-indent		: -9999em;
}

a[href="#"],
a[href="#"]:hover,
#menu a[href="#"]:hover
{
	opacity			: 0.3;
	cursor			: default;
	background-color: #809bb9;
}


.postmetadata a,
.postmetadata a:visited,
.postmetadata a:hover,
.postmetadata a:active,
.tags a,
.tags a:visited,
.tags a:hover,
.tags a:active,
.commentlist a,
.commentlist a:active,
.commentlist a:hover,
.commentlist a:active,
#commentform a,
#commentform a:visited,
#commentform a:active,
#commentform a:hover
{
	color			: #2D83E5;
}

#social-list .search button,
#contact input[type="submit"]
{
	text-align		: center;
	text-indent		: 0;
    border			: none;
    font-family		: 'Open Sans', sans-serif;
	text-transform: lowercase;
    font-size		: 15px;
    padding			: 4px 5px;
	background-color: #2D91E6;
	color			: white;
	cursor			: pointer;
	width			: 60px;
}

#social-list .search button:hover,
#contact input[type="submit"]:hover
{
	color			: #2D91E6;
	background-color: white;
}

#commentform input[type="submit"]
{
	text-align				: center;
	text-indent				: 0;
    border						: none;
    font-family				: Palatino,Georgia,"Times New Roman",serif;
    font-size					: 15px;
    padding					: 4px 5px;
	color						: #809bb9;
	background-color	: white;
	cursor						: pointer;
}

#commentform input[type="submit"]:hover
{
	background-color	: black;
	color						: white;
}

#commentform #brain
{
	width						: 197px;
}

#about-links a,
#about-links a:hover,
#about-links a:visited,
#about-links a:active,
blockquote a,
blockquote a:hover,
blockquote a:visited
{
	color				: white;
}

.postmetadata .m-trigger,
.postmetadata .m-trigger:visited,
.postmetadata .m-trigger:hover {
	color: white !important;
	cursor: pointer;
}

#send-response {
	background-color: #2D91E6;
    border: medium none;
    color: white;
    cursor: pointer;
    font-family: Palatino,Georgia,"Times New Roman",serif;
    font-size: 15px;
    padding: 4px 5px;
    text-align: center;
    text-indent: 0;
    width: 120px;
}

#send-response:hover {
	color: #2D91E6;
	background: white;
	text-decoration: none;
}

#must-like-first {
	font-size: 11px;
	line-height: 20px;
}

/*___ TABLE _________________________________________________________________*/

/*___ TR _________________________________________________________________*/

/*___ TH/TD _________________________________________________________________*/

/*___ IMG _________________________________________________________________*/

.comic img
{
	display				: block;
	margin				: 0;
/*	-webkit-box-shadow: 0 0 5px #080000;
	-moz-box-shadow : 0 0 5px #080000;
	box-shadow		: 0 0 5px #080000;*/
	max-width			: 100%;
}

img[class*="wp-image"],
.imgCap
{
	border					: solid 3px white;
/*	-webkit-box-shadow: 0 0 5px #080000;
	-moz-box-shadow : 0 0 5px #080000;
	box-shadow		: 0 0 5px #080000;	*/
	max-width			: 100%;
	height					: auto !important;
}

img[class*="captcha"]
{
	border				: solid 3px white;
/*	-webkit-box-shadow	: 0 0 5px #080000;
	-moz-box-shadow		: 0 0 5px #080000;
	box-shaodw			: 0 0 5px #080000;*/
	margin				: 5px 0 10px;
	display				: block;
}

img.alignleft{
	margin-right		: 10px;
	margin-top			: 10px;
	float					: left;
	max-width			: 50%;
	height					: auto !important;
}

img.alignright{
	margin-left			: 10px;
	margin-top			: 10px;
	float					: right;
	max-width			: 50%;
	height					: auto !important;
}

img.aligncenter {
	margin: 10px auto;
	display: block;
}

/*___ FORM _________________________________________________________________*/

/*___ INPUT/TEXTAREA/SELECT __________________________________________*/

.search input
{
	font-family		: 'Open Sans', sans-serif;
	text-transform: lowercase;
	font-size		: 15px;
	padding			: 5px;
	background-color: white;
	border			: none;
	margin-right	: 10px;
	width			: 140px;
}

#contact input[type="text"],
#contact textarea,
#commentform input[type="text"],
#commentform textarea
{
	font-family		: Palatino,Georgia,"Times New Roman",serif;
	font-size		: 15px;
	padding			: 5px;
	background-color: #E3F1BA;
	border			: none;
	margin-bottom	: 5px;
	width			: 235px;
}

#contact textarea{
	width			: 345px;
}

#contact input[type="text"]:focus,
#contact textarea:focus,
.search input:focus,
#commentform input[type="text"]:focus,
#commentform textarea:focus
{
	-webkit-box-shadow: inset 0 0 5px #2D91E6;
	-moz-box-shadow : inset 0 0 5px #2D91E6;
	box-shadow		: inset 0 0 5px #2D91E6;
}

#commentform #comment,
#commentform textarea[name="your-message"]
{
	width			: 95%;
	height			: 10em;
	padding		: 5px;
}

#response {
    border: 2px solid #2D83E5;
    display: block;
    font-family: MuseoSans500, sans-serif;
    font-size: 15px;
    height: 60px;
    line-height: 20px;
    margin: 0 auto 5px;
    padding: 5px;
    width: 400px;
}

/*___ LABEL _________________________________________________________________*/

.h
{
	display			: none;
}

#commentform label
{
	display			: block;
	margin			: 1em 0;
}

/*___Group/Section/Class_________________________________________________________________*/

/*-- Banner --*/

#banner {
	position: relative;
	height: 0;
	max-width: 850px;
	margin: 0 auto;
}

#banner  .banner-wrapper{
	position: absolute;
	left: -270px;
	top: 10px;
	width: 210px;
	height: 460px;
	padding: 20px;
	/*background: #809bb9 url(images/squirrel-logo.png) no-repeat 138px 296px;*/
	background: white url(images/squirrel-shield.png) no-repeat 138px 296px;
	color: #fff;
	font-family: 'Open Sans', sans-serif;
	font-size: 36px;
	font-weight: normal;
	line-height: 36px;
	text-align: right;
	letter-spacing: 0.05em;
}

#banner h1 {
	font-family: 'Open Sans', sans-serif;
	font-size: 36px;
	font-weight: bold;
	line-height: 36px;
	text-align: right;
	margin: 0;
	padding: 0;
	border: none;
	position: absolute;
	bottom: 20px;
	right: 20px;
}

#banner h6 {
	font-family: 'Open Sans', sans-serif;
	font-size: 24px;
	font-weight: bold;
	line-height: 24px;
	padding: 0;
	margin: 0;
	position: absolute;
	right: 20px;
	bottom: 67px;
}

#banner ul {
	margin: 0;
	padding: 0;
}

#banner li {
	line-height: 36px;
	margin-bottom: 10px;
}

#banner a, #banner a:visited, #banner a:hover{
	/*color: #fff;*/
	color: black;
	text-decoration: none;
}

#banner a:hover:before {
	content: "[";
}

#banner a:hover:after {
	content :"]";
}

#banner h1:hover {
	right: 10px;
}
/*
@media screen and (max-width:1389px) {
*/
	#banner {
		height: auto;
	}

	#banner .banner-wrapper {
		position: relative;
		left: 0;
		top: 0 !important;
		margin-top: 0;
		width: auto;
		height: auto;
		background-position: 50% 0%;
		padding: 0;
		margin-bottom: 0;
		background-image: url(images/squirrel-shield.png);
	}

	#banner h1, #banner h6, #banner h1 a {
		opacity: 0;
		width: 0;
		height: 0;
		left: 0;
		top: 0;
		pointer-events: none;
		padding: 0;
		margin: 0;
		display: block;
		overflow: hidden;
	}

	#banner h1 {
		opacity: 1;
		pointer-events: auto;
		width: 150px;
		height: 150px;
		left: calc(50% - 75px);
	}

	#banner h1 a {
		width: 100%;
		height: 100%;
		display: block;
		pointer-events: auto;
	}

	#banner ul {
		text-align: left;
		padding-top: 150px;
		overflow: hidden;
	}

	#banner li {
		line-height: 24px;
		font-size: 24px;
		width: 20%;
		float: left;
		text-align: center;
		padding-top: 5px;
	}
/*
}
*/

@media screen and (max-width:550px) {
	#banner li {
		font-size: 16px;
	}
}
/*-- Podcast Page --*/

#post-1242 h1 {
	display: none;
}

#post-1242 .comic {
	margin-top: 10px;
}