/*
Theme Name: Ross's Comicpress 2012
Theme URI: http://systemcomic.com/
Description: Comicpress hacked up for rosscott
Author: comicpress and lori goldberg
Version: 1.0

License:
License URI:

General comments (optional).
*/
/************************************************************************************

RESET

*************************************************************************************/

html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul, dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object, a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span, strong, sub, sup, tt, var, legend, fieldset {

	margin: 0;

	padding: 0;

}

img, fieldset {

	border: 0;

}

/* set image max width to 100% */

img {

	max-width: 100%;

	height: auto;

	width: auto\9; /* ie8 */

}

/* set html5 elements to block */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {

	display: block;

}

/************************************************************************************

GENERAL STYLING

*************************************************************************************/

.clearfix:after {

	content: ".";

	display: block;

	clear: both;

	visibility: hidden;

	line-height: 0;

	height: 0;

}

 

.clearfix {

	display: inline-block;

}

 

html[xmlns] .clearfix {

	display: block;

}

 

* html .clearfix {

	height: 1%;

}



body {

	background: #f7f7f7 url(images/bg.gif) top left;

	font: .81em/150% Helvetica, Arial, sans-serif;

	color: #2e2e2e;

}

a {

	color: #0099cc;

	text-decoration: none;

	outline: none;

	-webkit-transition:color 0.15s ease-in;

	-moz-transition:color 0.15s ease-in;

	-o-transition:color 0.15s ease-in;

	transition:color 0.15s ease-in;

}

a:hover {

	text-decoration: underline;

	color: #00ccff;

	

}

p {

	margin: 0 0 1.2em;

	padding: 0;

	font-size:1.15em;

}

/* list */

ul, ol {

	margin: 1em 0 1.4em 24px;

	padding: 0;

	line-height: 140%;

}

li {

	margin: 0 0 .5em 0;

	padding: 0;

}

/* headings */

h1, h2, h3, h4, h5, h6 {

	line-height: 1.4em;

	margin: 20px 0 .4em;

	color: #000;

}

h1 {

	font-size: 2.1em;

}

h2 {

	font-size: 1.7em;

}

h3 {

	font-size: 1.4em;

}

h4 {

	font-size: 1.2em;

}

h5 {

	font-size: 1.1em;

}

h6 {

	font-size: 1em;

}



strong{

	color:#000;

}

a strong, strong a{

	color:#0099CC;

}

blockquote {

	padding: 1.2em 3em 1.2em 4em;

	color: #666666;

	background-image:url(images/quot_start.png), url(images/quot_end.png);

	background-position:top left, bottom right;

	background-repeat:no-repeat;

	}

	

.hideit{

	display:block;

	text-indent:-9999px;

}



/* reset webkit search input styles */

input[type=search] {

	-webkit-appearance: none;

	outline: none;

}

input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button {

 display: none;

}

/************************************************************************************

STRUCTURE

*************************************************************************************/

#pagewrap {

	max-width: 900px;

	margin: 66px auto 20px auto;

}

/************************************************************************************

HEADER

*************************************************************************************/

#header {

	height: 70px;

	border-bottom:4px solid #FC0;

	background-color:#000;

	color:#FFF;

	position:fixed;

	top:0;

	left:0;

	width:100%;

	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4);

	-moz-box-shadow: 0 1px 3px rgba(0,0,0,.4);

	box-shadow: 0 1px 3px rgba(0,0,0,.4);

	-webkit-border-radius: 0px;

	-moz-border-radius: 0px;

	border-radius: 0px;

	z-index:40;

}

#header a {

	color:#fff;

}

#header a:hover {

	color:#0CF;

}

#site_logo{

	background-image:url(images/logo.png) !important;

	background-repeat:no-repeat;

	width:268px;

	height:40px;

}

hgroup {

	width:268px;

	padding:0 20px;

	float:left;

}

#head_elements{

	width:900px;

	margin:0 auto;

}

/* searchform */

#searchform {

	/*position: absolute;

	right: 10px;

	bottom: 6px;

	z-index: 100;*/

	width: 90px;

	float:left;

}

#searchform #s {

	width: 90px;

	background: #fff;

	border: none;

	padding: 6px 10px;

	/* border radius */

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

	/* box shadow */

	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);

	-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);

	box-shadow: inset 0 1px 2px rgba(0,0,0,.2);

	/* transition */

	-webkit-transition: width .7s;

	-moz-transition: width .7s;

	transition: width .7s;

}

/************************************************************************************

MAIN NAVIGATION

*************************************************************************************/

nav{

	width:470px;

	float:right;

}

#main-nav {

	padding:0;

	margin:0;

	float:right;

	border-left:1px solid #666;

	height:70px;

}

#main-nav li {

	float:left;

	list-style:none;



}

#main-nav a {

	display:block;

	height:30px;

	width:103px;

	padding:40px 7px 0 7px;

	-webkit-transition:color 0.3s ease-in;

	-moz-transition:color 0.3s ease-in;

	-o-transition:color 0.3s ease-in;

	transition:color 0.3s ease-in;

	-webkit-transition:background-color 0.15s ease-in;

	-moz-transition:background-color 0.15s ease-in;

	-o-transition:background-color 0.15s ease-in;

	transition:background-color 0.15s ease-in;

	font-weight:bold;

		border-right:1px solid #666;

		margin-right:-1px;

		position:relative;

}

#main-nav a:hover {

	background-color:#FC0;

	color:#000;

	text-decoration:none;

	-webkit-transition:color 0.3s ease-in;

	-moz-transition:color 0.3s ease-in;

	-o-transition:color 0.3s ease-in;

	transition:color 0.3s ease-in;	

}

/************************************************************************************

COMIC CONTROLS

*************************************************************************************/

#controls{

	position:fixed;

	top:85px;

	left:0;

	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4);

	-moz-box-shadow: 0 1px 3px rgba(0,0,0,.4);

	box-shadow: 0 1px 3px rgba(0,0,0,.4);

	-webkit-border-radius: 0px 10px 10px 0;

	-moz-border-radius: 0px 10px 10px 0;

	border-radius: 0px 10px 10px 0;

	background-color:#343434;

	font-size:0.75em;

	text-transform:uppercase;

	width:65px;

	z-index:2000;

}

#controls a{

	color:#fff;

	display:block;

	height:61px;

	width:41px;

	text-align:center;

}

#controls a:hover{

	color:#CCC;

	text-decoration:none;

}

#controls ul{

	margin:7px 12px 7px 12px;

}

/* ///////////// CONTROL BACKGROUNDS //////////////// */

#controls li{

	height:60px;

	width:40px;

	background:url(images/nav.png);

	list-style:none;

}

#controls li.first{

	background-position:0 -60px;

}

#controls li.previous{

	background-position:0 -120px;

}

#controls li.next{

	background-position:0 -180px;

}

#controls li.last{

	background-position:0 -240px;

}

/* ///////////// CONTROL AVAILABLE //////////////// */

#controls li a{

	text-indent:-9999px;

	background:url(images/nav.png);

}

#controls li.random a{

	background-position:-41px 0px;

}

#controls li.first a{

	background-position:-41px -60px;

}

#controls li.previous a{

	background-position:-41px -120px;

}

#controls li.next a{

	background-position:-41px -180px;

}

#controls li.last a{

	background-position:-41px -240px;

}

/* ///////////// CONTROL HOVERS //////////////// */

#controls li.random a:hover{

	background-position:-82px 0px;

}

#controls li.first a:hover{

	background-position:-82px -60px;

}

#controls li.previous a:hover{

	background-position:-82px -120px;

}

#controls li.next a:hover{

	background-position:-82px -180px;

}

#controls li.last a:hover{

	background-position:-82px -240px;

}





/************************************************************************************

CONTENT

*************************************************************************************/

.post {

	background: #fff;

	margin: 0 0 26px;

	/* rounded corner */

	-webkit-border-radius: 8px;

	-moz-border-radius: 8px;

	border-radius: 8px;

	/* box shadow */

	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4);

	-moz-box-shadow: 0 1px 3px rgba(0,0,0,.4);

	box-shadow: 0 1px 3px rgba(0,0,0,.4);

}

article header {

	background:#000;

	color:#fff;

	-webkit-border-top-left-radius: 8px;

	-moz-border-top-left-radius: 8px;

	border-top-left-radius: 8px;

	-webkit-border-top-right-radius: 8px;

	-moz-border-top-right-radius: 8px;

	border-top-right-radius: 8px;

	padding:1px 26px 8px 26px;

}



.post-title{

	width:700px;

	font-size:1.75em;

	line-height:1.1em;

	float:left;

	margin:13px 0 0 0;

	color:#fff;

}

.post-title a{

	color:#fff;

}

.post-title a:hover{

	text-decoration:none;

	color:#09C;

}

.post-meta{

	text-align:right;

	font-style:italic;

	font-size:0.75em;

	padding:21px 0 0 0;

	margin:0;

}

.post-meta a:hover{

	text-decoration:none;

}

figure.post-image{

	margin:0;

	/* box shadow */

	-webkit-box-shadow: 0 15px 12px -12px rgba(0,0,0,.2);

	-moz-box-shadow: 0 15px 12px -12px rgba(0,0,0,.2);

	box-shadow: 0 15px 12px -12px rgba(0,0,0,.2);

}

figure img{

	display:block;

	margin:0 auto;

	height:auto;

}

/*//////////////////// LEFT COLUMN OF POST ////////////////////*/

.left_post{

margin-top:15px;

	padding:10px 25px 20px 25px;

	width:600px;

	float:left;

}

.related{

	border-top:1px solid #999;

	margin-bottom:20px;

	padding:20px 0 0px;

	display:table;

	width:100%;

}

table{

	font-size:17px;

	line-height:110%;

}

.archive-date{

	display:none;

}

.archive-title{

	padding-bottom:10px;

}

.related ul{

	font-size:1.9em;

	font-weight:bold;

	list-style:none;

	margin:0;

	padding:0;

	line-height:1em;

}

.related li{

	margin-bottom:16px;

	clear:both;

}

.related li a:first-child{

	display:block;

	overflow:hidden;

	height:50px;

	width:120px;

	border:2px solid #00ccff;

	float:left;

	margin-right:10px;

	margin-bottom:16px;

}

.related li a:first-child:hover{

border:2px solid #00ccff;

}

	

.related img{

	margin:-10px 0 0 -10px;

}

.related a:hover img{



}

.related_posts h4{

display:none;

}

.tag_area{

	border:1px solid #999;

	border-left:none;

	border-right:none;

	padding:20px 0 10px;

	margin-bottom:20px;

}

.tag_area h4, .comments h4, .related h4{

	font-size:0.75em;

	color:#949494;

	text-transform:uppercase;

	margin:0 0 12px;

	font-weight:normal;

}

.comments h4{

	margin: 0 0 6px;

}

.tag_area ul{

	margin:0;

	padding:0;

	list-style:none;

}

.tag_area li{

	display:block;

	margin-right:5px;

	line-height:3em;

	float:left;

}

.tag_area a, #tags a{

	padding:10px 10px 6px 10px;

	background-color:#FC0;

	color:#000;

	font-weight:bold;

	text-transform:uppercase;

	font-size:1.2em;

	/* rounded corner */

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

}

.tag_area a:hover, #tags a:hover{

	text-decoration:none;

	background-color:#000;

	color:#FFF;

}

.comments a{

	font-size:1.2em;

	font-weight:bold;

}

/*//////////////////// END LEFT COLUMN OF POST ////////////////////*/

/*//////////////////// RIGHT COLUMN OF POST ////////////////////*/



sidebar{

	width:234px;

	float:left;

	margin:15px 0 20px;

}

.buyprint{	

	color:#000;

	font-weight:bold;

	text-transform:uppercase;

	font-size:1.1em;

	line-height:1.1em;

	padding:20px 20px 10px 20px;

	width:192px;

	display:block;

	border:1px solid #E0AA00;

	margin:0 0 10px;

	/* rounded corner */

	-webkit-border-radius: 10px;

	-moz-border-radius: 10px;

	border-radius: 10px;

	/* gradient info */

	background: rgb(255,204,0); /* Old browsers */

	background: -moz-linear-gradient(top,  rgba(255,204,0,1) 0%, rgba(229,179,0,1) 100%); /* FF3.6+ */

	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,204,0,1)), color-stop(100%,rgba(229,179,0,1))); /* Chrome,Safari4+ */

	background: -webkit-linear-gradient(top,  rgba(255,204,0,1) 0%,rgba(229,179,0,1) 100%); /* Chrome10+,Safari5.1+ */

	background: -o-linear-gradient(top,  rgba(255,204,0,1) 0%,rgba(229,179,0,1) 100%); /* Opera 11.10+ */

	background: -ms-linear-gradient(top,  rgba(255,204,0,1) 0%,rgba(229,179,0,1) 100%); /* IE10+ */

	background: linear-gradient(top,  rgba(255,204,0,1) 0%,rgba(229,179,0,1) 100%); /* W3C */

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffcc00', endColorstr='#e5b300',GradientType=0 ); /* IE6-9 */

}

.buyprint:hover{	

	color:rgba(0, 0, 0, 0.8);

	text-decoration:none;

	/* gradient info */

	background: rgb(229,179,0); /* Old browsers */

	background: -moz-linear-gradient(top,  rgba(229,179,0,1) 0%, rgba(255,204,0,1) 100%); /* FF3.6+ */

	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(229,179,0,1)), color-stop(100%,rgba(255,204,0,1))); /* Chrome,Safari4+ */

	background: -webkit-linear-gradient(top,  rgba(229,179,0,1) 0%,rgba(255,204,0,1) 100%); /* Chrome10+,Safari5.1+ */

	background: -o-linear-gradient(top,  rgba(229,179,0,1) 0%,rgba(255,204,0,1) 100%); /* Opera 11.10+ */

	background: -ms-linear-gradient(top,  rgba(229,179,0,1) 0%,rgba(255,204,0,1) 100%); /* IE10+ */

	background: linear-gradient(top,  rgba(229,179,0,1) 0%,rgba(255,204,0,1) 100%); /* W3C */

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5b300', endColorstr='#ffcc00',GradientType=0 ); /* IE6-9 */

}

.fixit{

	position:fixed;

	z-index:10;

	width:234px;

}

.sharethings, .turboreader{

	padding:15px 15px 10px 15px;

	/* box shadow */

	box-shadow:0 0 20px rgba(0, 0, 0, 0.3) inset;

	-webkit-box-shadow:0 0 20px rgba(0, 0, 0, 0.3) inset;

	-moz-box-shadow:0 0 20px rgba(0, 0, 0, 0.3) inset;

	/* rounded corner */

	-webkit-border-radius: 10px;

	-moz-border-radius: 10px;

	border-radius: 10px;

}

.sharethings #imagelink{

	width: 89%;

	background: #fff;

	border: none;

	padding: 6px 10px;

	/* border radius */

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

	/* box shadow */

	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);

	-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);

	box-shadow: inset 0 1px 2px rgba(0,0,0,.2);

	/* transition */

	-webkit-transition: width .7s;

	-moz-transition: width .7s;

	transition: width .7s;

		border:1px solid #ccccd8;

}

.sharethings ul, .turboreader ul{

	margin:0;

	padding:0;

	list-style:none;

}

.sharethings li{

	padding:0;

	margin:0;

	font-size:0.75em;

	text-transform:uppercase;

	font-weight:bold;

	margin-bottom:9px;

}

.sharethings a{

	border:1px solid #ccccd8;

	display:block;

	width:89%;

	background:#CCC;

	/* rounded corner */

	-webkit-border-radius: 10px;

	-moz-border-radius: 10px;

	border-radius: 10px;

	padding:10px 10px 5px 10px;

	color:#535353;

	text-transform:capitalize;

	font-size:1.3em;

}

.sharethings a:hover{

	text-decoration:none;

	color:#333;

	background:#C3C3C3;

}



/*//////////////////// END RIGHT COLUMN OF POST ////////////////////*/

/************************************************************************************

ADVERT

*************************************************************************************/

.advert{

	background:#000;

	margin-bottom:26px;

	padding:8px;

	/* rounded corner */

	-webkit-border-radius: 8px;

	-moz-border-radius: 8px;

	border-radius: 8px;

	/* box shadow */

	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4);

	-moz-box-shadow: 0 1px 3px rgba(0,0,0,.4);

	box-shadow: 0 1px 3px rgba(0,0,0,.4);

}

.advert table, .advert tr, .advert td{
	width: 100% !important;
}


.advert .left{

	float:left;

	width:140px;

	font-size:0.9em;

	padding:0 0 0 5px;

  /* Was #333 */
	color:#fff;

	line-height:1.5em;

}

.advert img{

	height:auto;

	width:100%;

}

.advert .right{

	width:730px;

	float:right;

  /* Need to account for the extra "Ads by PW" banner at the bottom of the ad */
	height:120px;

}



/************************************************************************************

FOOTER

*************************************************************************************/

#footer {

	clear: both;

	background-color:#000;

	font-size:11px;

	color:#fff;

}

#footer p{

	font-size:11px;

	padding:0;

	margin:0;

}

#footer a {

	color:#00ccff;

}

#footer a:hover{

	text-decoration:none;

	color:#99ffff

;

}

#footer .inner{

	max-width:900px;

	margin:0 auto;

	padding:20px 0 40px;

	display:table;

}

#footer .left{

	width:550px;

	padding:10px 0 0 0px;

	float:left;

}

#footer .left a{

	margin:0 30px 15px 0;

}

.f_in_left{

	width:20%;

	height:120px;

	background:url(images/jimmy.gif) no-repeat top left;

	float:left;

	color:#fff;

	margin-left:0px;

}

.f_in_right{

	width:80%;

	float:left;

	padding-bottom:10px;

}

#footer .right{

	width:270px;

	float:right;

}

#footer h5{

	color:#cccccc;

	margin:0;

	padding:12px 0 0;

	font-size:11px;

	font-weight:normal;

}







/************************************************************************************

CLEARFIX

*************************************************************************************/

.clearfix:after {

	visibility: hidden;

	display: block;

	font-size: 0;

	content: " ";

	clear: both;

	height: 0;

}

.clearfix {

	display: inline-block;

}

.clearfix {

	display: block;

	zoom: 1;

}

/************************************************************************************

ARCHIVE PAGE

*************************************************************************************/



#archive h1{

	border-bottom:2px solid #000;

	padding:0px 0 0 0;

}

#archive h2{

	border-top:1px solid #000;

	padding:7px 0 2px;

	margin-bottom:0;

	margin:10px 0 2px;

}

#archive h3{

	border-top:1px solid #CCC;

	font-size:0.95em;

	margin-top:0;

	padding:7px 0 0 0;

}

#archive .post-image{

	height:41px;

	padding-top:3px;

}

#archive .post-image li{

	display:inline;

	padding-right:20px;

	font-size:1.1em;

	font-weight:bold;



}

#archive #years{

	margin:0;

	font-weight:bold;

	color:#999;

	font-size:0.9em;

}

#archive #years li{

	display:inline;

	padding-right:35px;

	margin:0;

}



#archive .left_post ul{

	margin:-25px 0 10px 20.8333333%;

	position:relative;

	z-index:3;

	font-size:1.25em;

	list-style:none;

}

#archive .left_post li{

	padding:0;

}

#archive .left_post a{

	font-weight:bold;

}

#archive #tags ul{

	font-weight:bold;

	margin:20px 0;

	padding:0;

}

#archive #tags li{

	margin-bottom:20px;

}

#archive #tags a{

	margin-left:10px;

}

#searcharea{

	width:93%;

	margin:2.5% 2.5% 0 2.5%;

		-webkit-box-shadow:inset 0 0px 5px rgba(0,0,0,.6);

	-moz-box-shadow:inset 0 0px 5px rgba(0,0,0,.6);

	box-shadow:inset 0 0px 5px rgba(0,0,0,.6);

	padding:13px 1% 10px 1%;

	background:url(images/search.gif) 7px 10px no-repeat;

}

#searcharea form{

	width:100%;

	overflow:hidden;

}

#search{

font-size:1.5em;

	border:0;

	width:100%;

	margin-left:35px;

	background:none;

	font-family:Helvetica, Arial, sans-serif;

}

.post-image ul{

	margin-left:2.5%;

	margin-right:2.5%

}

.turboreader ul{

	border-top:none;

}



#archive .turboreader h3{

	border-top:none;

	border-bottom: 1px solid #ccc;

	font-size:1.3em;

	text-transform:uppercase;

}

#archive .turboreader strong{

	text-decoration:blink;

}

.turboreader h4{

	margin-bottom:0;

}

#select, #select2{

	width:100%;

font-size:1em;

}



/************************************************************************************

404 Page

*************************************************************************************/

.post-404{

background:url("images/404-jimmy.gif") no-repeat scroll center 20px #0000CC;

color:#cccccc;

font-family:Lucida Console, Monaco, monospace;

padding:30px;



}

.post-404 h2{

	background-color:#cccccc;

	color:#0000cc;

	width:50%;

	margin:180px auto 50px auto;

	text-align:center;

}

.post-404 #searcharea{

background-color:#fff;

}

.post-404 #search{

font-family:Lucida Console, Monaco, monospace;

}