/**
 * Theme Name: Inkblot Child
 * Theme URI: http://maikeruon.com/webcomic/
 * Description: Make an impression with the original, highly customizable <a href="http://maikeruon.com/webcomic/">Webcomic</a> theme.
 * Version: 1.0.0
 * Author: Michael Sisk
 * Author URI: http://maikeruon.com/
 * Tags: black, white, one-column, two-columns, three-columns, left-sidebar, right-sidebar, fixed-width, flexible-width, theme-options, threaded-comments, sticky-post
 * Template: inkblot
 */
 
/** Load the Cascade Failure CSS Framework */
@import url( '../inkblot/includes/css/cf-reset.css' );
@import url( '../inkblot/includes/css/cf-layout.css' );
@import url( '../inkblot/includes/css/cf-typography.css' );

/* defaults - overrides basic styling from the Cascade Failure framework */
html {
	
        /** (JK-COMMENT) This is the main site page background color and image */
       
        background:#2e6004 url( 'images/artf.png' ) repeat;

        /** (JK-COMMENT) end of background color modification */
}

/** (JK-COMMENT) Added definitions for all type face headings */

h1 {
	font-family:'Tahoma';
	font-size:150%;
	font-weight:bold;
        line-height:1em;
	margin-bottom:.5em;
        color: #2e6004; /* dark olive green */
}

h2 {
	font-family:'Tahoma';
	font-weight:bold;
        font-size:150%;
	line-height:1em;
	margin-bottom:.75em;
        color: #2e6004; /* dark olive green */
}

h3 {
	font-family:'Tahoma';
	font-size:100%;
	line-height:1em;
	margin-bottom:1em;
        color: #f52a01;
}

h4 {
	font-family:'Tahoma';
	font-size:100%;
	line-height:1em;
	margin-bottom:1.2em;
        color: #f52a01; /* reddish orange */
}

h5 {
	font-family:'Tahoma';
	font-size:100%;
	line-height:1em;
	margin-bottom:1.3em;
        color: #f52a01; /* reddish orange */
}

h6 {
	font-family:'Tahoma';
	line-height:1em;
	margin-bottom:1.5em;
        color: #f52a01; /* reddish orange */
}
/** (JK-COMMENT) Added definitions for all type face headings above */

a {
	color:#333; /* dark blue-black */
	text-decoration:underline;
}

h1 a,h2 a,h3 a,h4 a,h5 a,h6 a,a:hover {
	text-decoration:none;
}

textarea {
	width:98%;
}

/** Site Width - This should replace any existing CSS rule in your style.css file */
.group { width: 910px; }

/**
 * These are the widths that Inkblot will use for the content and sidebar areas. See the style.css file if you want to change these widths.
 * 
 * .content-main will be 450px
 * .sidebar-one will be 225PX
 * .sidebar-two will be 225PX
 */

/** (JK-COMMENT) This code eliminates side bars of special pages **/
body.page-template-default .sidebar-one,
body.page-template-default .sidebar-two { display: none; }

body.page-template-default .content-main { width: 900px; }
/** (JK-COMMENT) This code above eliminates side bars of special pages */

/* wrappers */
#wrap-outer {
	background:url(images/trim-left.png) repeat-y;
	padding:0 12px;
}

#wrap-inner {
	background:url(images/trim-right.png) right repeat-y;
	margin:0 -12px 0 0;
	padding:0 12px 0 0;
}

/** (JK-COMMENT) The code below is for new divisions added Sept 25 2009*/
#todaycomic_title { 
      font:bold 400%/2.5em ;
      color:#f52a01; /* red-orange */
       }
#the_strip {
        background: #fa9801; /* a3b097 mid olive green */
        padding:1px 1px 1px 1px;
        color:#000000; /* black */
        border-width: 4px;
        border-style: outset;
        border-color: #f74401; /* 2e6004 dark olive green */
}
#blurb {
        background: #efeccf; /* sandy yellow */
        padding:12px 12px 12px 12px;
        color:#000000; /* black */
        border-width: 5px;
        border-style: outset;
        border-color: #2e6004; /* dark olive green */
       }
#albatross_journal {
     background: #efeccf; /* sandy yellow */
        padding:12px 12px 12px 12px;
       color:#000000; /* black */
        border-width: 5px;
        border-style: outset;
        border-color: #2e6004; /* dark olive green */
}
#journal_title { 
      font:bold 400%/2.5em ;
      color:#f52a01; /* red-orange */
       }

/** (JK-COMMENT) The code above is for new divisions that I added Sept 25 2009 **/

/* page */
#page {
        /* This is the background color of the pages */
        background-color:#acbaa0; 
        color: #000000;    
}
/** (JK COMMENT) adding this #body solved the background problem for Explorer **/
#body {
        /* This is the background color of the pages */
        background-color:#acbaa0; 
        color: #000000;    
}

/* site name */
#head .name {
	font:bold 300%/1em Constantia, Palatino, Times, serif;
        color: #acbaa0;
        /** commented out the next line to eliminate gap between banner and nav bar **/
	/**margin:0 0 .25em;**/
}

/* #head .name a {
	text-decoration:none;
        color: #acbaa0;
} */

/** (JK-COMMENT) Code to be inserted into style.css to add a Logo image in the header. **/

#head .interior    { padding: 0; }
#head .description { display: none; }
#head .name a span { display: none; }
  
    /** (JK-COMMENT) This code added as part of periodically changing banners functionality **/

#head .name { 
        background: url( 'images/banner9.jpg' );
        display: block; 
        color: #acbaa0;
        height: 264px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        } 
#head .name a .banner1 { 
        background: url( 'images/banner1.jpg' );
        display: block;
        color: #acbaa0; 
        height: 260px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        }
#head .name a .banner2 { 
        background: url( 'images/banner2.jpg' ); 
        display: block;
        color: #acbaa0; 
        height: 260px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        }
#head .name a .banner3 { 
        background: url( 'images/banner3.jpg' ); 
        display: block;
        color: #acbaa0; 
        height: 260px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        }
#head .name a .banner4 { 
        background: url( 'images/banner4.jpg' ); 
        display: block;
        color: #acbaa0; 
        height: 260px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        }
#head .name a .banner5 { 
        background: url( 'images/banner5.jpg' ); 
        display: block;
        color: #acbaa0; 
        height: 264px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        }
#head .name a .banner6 { 
        background: url( 'images/banner6.jpg' ); 
        display: block;
        color: #acbaa0; 
        height: 263px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        }
#head .name a .banner7 { 
        background: url( 'images/banner7.jpg' ); 
        display: block;
        color: #acbaa0; 
        height: 263px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        }
#head .name a .banner8 { 
        background: url( 'images/banner8.jpg' ); 
        display: block;
        color: #acbaa0; 
        height: 264px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        }         
 #head .name a .banner9 { 
        background: url( 'images/banner9.jpg' ); 
        display: block;
        color: #acbaa0; 
        height: 264px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        }         
#head .name a .banner10 { 
        background: url( 'images/banner10.jpg' ); 
        display: block;
        color: #acbaa0; 
        height: 264px; 
        border-width: 3px;
        border-style: outset;
        border-color: #f62d00; 
        /* orange */ 
        }           
/** (JK-NOTE) be sure when adding the final logo to adjust the pixel height to match the image which will be 900 pixels wide to match the comic strip **/
/** (JK-COMMENT) additional code above added on Sept 24th & Oct 8th 2009 **/

/* site description */
#head .description {
	font:italic 150%/1em Constantia, Palatino, Times, serif;
}



/* foot */
#foot {
	background:#fa9801; /* orange */
	color:#000000; /* black */
	text-align:center;
        border-width: 5px;
        border-style: outset;
        border-color: #f62d00; /* orange */
}

#foot a {
	color:#f62d00; /* mid-orange */
	font-weight:bold;
	text-decoration:none;
}

#foot a:hover {
	color:#ffffff; /* white */
}

#foot .interior {
	line-height:2em;
	padding:0 1em;
}



/* navigation - site */
/** (JK-COMMENT) navigation - site code for graphical roll-over navigation bar **/
#head .group { /* This rule ensures dropdown menus aren't hidden behind other page elements in Internet Explorer */
	z-index:1;
}

.navi-site {
	background: #fff url( 'images/bg-nav.png' ) 0 50%;
	/* border: 1px solid #acbaa0; */
	float:left;
	list-style:none;
	margin:0;
	padding:0;
	width:100%;
        border-width: 1px;
        border-style: outset;
        border-color: #f62d00; /* orange */
}

.navi-site li {
	background: url( 'images/sep-nav.png' ) 100% 0 no-repeat;
	float:left;
}

.navi-site li.alignright {
	float: right;
}

.navi-site a {
	color:#000; /* dark blue-black */
	display:block;
	line-height:24px;
	padding:0 1em;
	text-decoration:none;
}

.navi-site a:hover {
	background: url( 'images/bg-nav-hover.png' );
	color:#fff; /* dark blue-black */
}

.navi-site .current_page_item > a {
	background: url( 'images/bg-nav-current.png' );
	color: #fff; /* dark blue */
}

.navi-site li ul {
	background:#5d9347; /* mid olive green */
	display:none;
	list-style:none;
	margin:0;
	padding:0;
	position:absolute;
        z-index:1;
}

.navi-site li ul a {
	color: #fff; /* dark blue */
}

.navi-site li ul a:hover {
	background: #c99559; /* grayish orange */
}

.navi-site ul li {
	background: none;
	float:none;
	white-space:nowrap;
}

.navi-site .feed span {
	display: none;
}

.navi-site .feed a {
	background: url( 'images/feed-icon.png' );
	height: 22px;
	line-height: 22px;
	margin: 1px .5em;
	padding: 0;
	width: 22px;
}

.navi-site .feed a:hover {
	background: url( 'images/feed-icon.png' ) 0 22px;
}
/** (JK-COMMENT) above is the navigation - site code for graphical roll-over navigation bar **/
	
/* navigation - comic */
.navi-comic {

        background: #acbaa0;
	float:left;
	width:100%;
}

/** (JK-COMMENT) code added for graphical comic navigation buttons **/
.navi-comic a { display: block; float:left; height: 30px; width: 225px; }
.navi-comic a span { display: none; }
.navi-comic a:hover { background-position: 0 -30px; }
.navi-comic a.current-comic { background-position: 0 -60px; }
.navi-comic a.first-comic-link { background-image: url( 'images/firstButton.png' ); }
.navi-comic a.last-comic-link { background-image: url( 'images/lastButton.png' ); }
.navi-comic a.previous-comic-link { background-image: url( 'images/previousButton.png' ); }
.navi-comic a.next-comic-link { background-image: url( 'images/nextButton.png' ); }

.navi-comic .current-comic {
	visibility:hidden;
}

/** (JK-COMMENT) code added above for graphical comic navigation buttons **/




	
/* navigation - posts (for the blog and on single post pages) */
.navi-posts {
	float:left;
	width:100%;
}

.navi-posts-above {
	margin-bottom:1.5em;
}

.navi-posts .navi-next {
	float:right;
}

.navi-posts .navi-previous {
	float:left;
}


	
/* navigation - paged (for paged posts) */
#comments .navi-paged { /* This rule centers the paged navigation above and below comment lists */
	text-align:center;
}

.navi-paged a {
	border:.1em solid #333; /* dark blue-black */
	padding:.15em .25em;
	text-decoration:none;
}

.navi-paged a:hover {
	background:#333; /* dark blue-black */
	color:#fff; /* white */
}



/* navigation - images */
.navi-attachment { /* This rule hides the attachment navigation for non-image attachments */
	display:none;
}

.attachment-image .navi-attachment { /* This rule reveals the attachment navigation for image attachments */
	display:block;
	float:left;
	width:100%;
}

.navi-attachment {
	border-bottom:.1em solid;
	margin:0 0 1.5em;
	padding:.75em 0;
}

.navi-attachment img {
	height:5em;
	vertical-align:bottom;
	width:5em;
}

.navi-attachment .navi-next {
	float:right;
}

.navi-attachment .navi-previous {
	float:left;
}



/* blog title */
.blog-title {
	color: #2c5c04; /* dark green */
        border-bottom:.1em solid;
	margin:0 0 3em;
}

.blog-title span {
	display:none;
}



/* content */
#body .content { /* This rule prevents wide content from overlapping the sidebars */
	overflow:hidden;
}


	
/* comics */
#body .comic img,#body .comic object {
	vertical-align:center;
        
}



/* comic embed code */
.comic-embed-code {
	display:block;
	width:98%;
}



/* posts */
/** code brought over from Silkscreen */
#body .post {
	clear: both;
	margin:0 0 3em;
}

#body .datetime {
	background: url( 'images/date.png' );
	color: #fff;
	float: left;
	font-size: 85%;
	height: 48px;
	margin: 0 .5em 0 0;
	width: 48px;
	text-align: center;
	overflow: hidden;
}

#body .datetime strong {
	display: block;
	color: #333;
	font-size: 200%;
	margin: 3px 0 0;
}

#body .meta {
	text-align:right;
}

#body .meta .comments a {
	background: url( 'images/comments.png') 100% 0 no-repeat;
	color: #333;
	float: right;
	font-weight: bold;
	height: 24px;
}

#body .meta .comments a:hover {
	background-position: 100% -24px;
}

#body .meta .comments .num {
	color: #333;
	display: block;
	float: right;
	text-align: center;
	width: 40px;
}

#body .meta .comments a:hover .num {
	color: #fff;
}



/* attachments */
#body .attachment .object {
	text-align:center;
}

#body .attachment .meta {
	border-style:solid;
	border-width:.1em 0;
	padding:.75em 0;
}



/* transcripts */
#transcript-title {
	border-top:.1em solid;
	cursor:pointer;
	font-weight:bold;
	padding:.75em 0;
}

#transcript {
	display:none;
}

#transcript label {
	display:block;
	float:left;
	width:25%;
}

#transcript-response {
	color:#fff;
	margin:0 0 1.5em;
	font-weight:bold;
	text-align:center;
}

#transcript-response span {
	display:block;
	padding:.75em;
}

#transcript-response .error {
	background:#c10; /* dark blue-black */
}

#transcript-response .success {
	background:#9c0; /* dark blue */
}



/* comments */
#respond label {
	display:block;
	float:left;
	width:25%;
}

.commentlist {
	list-style:none;
	margin:0 0 3em;
	padding:0;
}

.commentlist .comment,.commentlist .pingback {
	border:.1em solid #ccc; /* dark blue-black */
	margin:0 0 3em;
	padding:.75em .75em 0;
}

.commentlist .comment.bypostauthor {
	border:.25em double #333; /* dark blue-black */
}

.commentlist .vcard {
	font-weight:bold;
}

.commentlist .vcard img.avatar {
	float:left;
	margin:0 1.5em 1.5em 0;
}

.commentlist .vcard span.says {
	display:none;
}

.commentlist .comment-meta {
	color:#999; /* dark blue */
	padding:0 0 1.5em;
}

.commentlist .reply {
	padding-bottom:.75em;
}

.commentlist .children {
	list-style:none;
	margin:0;
	padding:0;
}

.commentlist .even {
	background:#fff; /* link blue */
}

.commentlist .odd {
	background:#fafafa; /* white */
}



/* sidebars and widgetized areas */
.sidebar { /* This rule prevents wide content from breaking the sidebar */
	overflow:hidden;
        font-family: Tahoma;
        font-size:85%;
        background:#efeccf; /* sandy yellow */
}

.sidebar .interior {
        list-style:none;
	margin:0;
}

.sidebar .interior ul,.widgetized ul { /* This rule and the next correct unordered list display in the sidebars and widgetized areas */
	margin:0 0 1.5em 1.5em;
	padding:0 0 0 1.5em;
}

.sidebar .interior ul ul,.widgetized ul ul {
	margin:0 0 0 1.5em;
}

.sidebar input,.sidebar select { /* This rule ensures <input> and <select> elements don't break out of the sidebar */
	width:100%;
}



/* comic archive - date */
.comic-year {
	font:200%/1em 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
	margin:0 0 .75em;
}

table.comic-archive .comic-date-col {
	border-right:.1em solid #ccc; /* dark blue-black */
	width:30%;
}

table.comic-archive .alt {
	background:#fafafa; /* white */
}

table.comic-archive th {
	text-align:left;
}



/* comic archive - chapter */
ol.comic-archive {
	list-style:none;
	margin:0;
	padding:0;
}

ol.comic-archive .comic-series-item a {
	font:200%/1em 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
	margin:0 0 .75em;
}

ol.comic-archive .comic-volume-item a {
	font:150%/1em 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
	margin:0 0 1em;
}

ol.comic-archive .comic-chapter-item a {
	font:125%/1em 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
	margin:0 0 1.3em;
        line-height: 3em;
}

ol.comic-archive .comic-chapter-pages a {
	font:100%/1em 'Lucida Sans', 'Lucida Grande', 'DejaVu Sans', sans-serif;
	margin:0 0 1.3em;
}

/* 4-20-2010 this line of code eliminated list numbers being displayed and adds circle bullets*/
ol.comic-archive ol { list-style: circle; }

/* WordPress Calendar */
#calendar .widgettitle {
	display:none;
}

#wp-calendar {
	border:.1em solid #557a44; /* dark olive green */
	caption-side:top;
}

#wp-calendar caption {
	font-size:100%;
	font-weight:bold;
        color:#557a44; /* dark olive green */
}

#wp-calendar th {
	padding:0;
}

#wp-calendar td {
	border:.1em solid #557a44; /* dark olive green */
	padding:0;
	text-align:center;
        background:#fff;
}

#wp-calendar .pad {
        background:#8ccbac; /* middle green */
}

#wp-calendar a {
	background:#557a44; /* dark olive green */
	color:#fff;
	display:block;
	text-decoration:none;
}

#wp-calendar #today {
	border:.25em double #333; /* dark blue-black */
}



/* 404 Recent Comics */
.error-404 .recent-comics {
	float:left;
	list-style:none;
	margin:0;
	padding:0;
	width:100%;
}

.error-404 .recent-comics li {
	float:left;
	margin:0 1.5em 1.5em 0;
}

.error-404 .recent-comics a {
	text-decoration:none;
}