/* Theme Name: ComicPress Theme URI: http://comicpress.org Description: Publish a comic with WordPress. Visit the ComicPress Website. Author: Tyler Martin, John Bintz, Philip M. Hofer Author URI: http://mindfaucet.com/ Version: 2.8.0.4 . The CSS, XHTML and design is released under GPL v3: http://www.opensource.org/licenses/gpl-3.0.html . */ /* STANDARD TAGS */ body { margin: 0; font-size: 14px; font-family: 'Arial', sans-serif; z-index: 0; } a { color: #800; text-decoration: none; } a:hover { color: #f00; } a:focus { outline: none; } a img { border: none; } p { margin: 12px 0; } img { max-width: 100%; padding: 0; } small { font-size: 11px; } hr { height: 1px; color: #000; border: 0px; } blockquote { margin: 10px; padding: 5px 10px 5px 20px; border-width: 1px 1px 1px 5px; border-style: solid; border-color: #000; } blockquote cite { margin: 5px 0 0; display: block; } cite { font-size: 13px; font-weight: bold; font-style: normal; } code { padding: 10px; display: block; font-family: 'Courier New', monospace; border: 1px dotted #000; overflow: scroll; } acronym, abbr, span.caps { cursor: help; } acronym, abbr { border-bottom: 1px dashed #000; } form { margin: 0; } .sfhover { padding: 0; margin: 0; } /* HEADINGS */ h1, h1 a { padding: 10px 0 0 0; margin: 0; color: #000; font-size: 60px; font-family: 'Georgia', serif; font-weight: normal; line-height: 50px; text-decoration: none; letter-spacing: -4px; font-variant: small-caps; } h2, h2 a { margin: 0; color: #000; font-weight: bold; letter-spacing: -1px; font-size: 24px; } h2.pagetitle, h2.pagetitle a { padding: 0 0 5px 0; margin: 0 0 20px 0; font-family: 'Georgia', serif; font-size: 32px; font-weight: normal; letter-spacing: -2px; clear:both; } h3, h3 a { padding: 0; margin: 0; font-size: 20px; font-weight: bold; text-align: left; color: #000; text-decoration: none; clear: both; letter-spacing: -1px; } /* THE PAGE WRAPPER */ /* Change this width to set the entire site's width - increase/reduce #content width by the same amount */ #page { width: 780px; margin: 0px auto; } #page-wide { width: 980px; margin: 0px auto; } /* THE HEADER */ #header { text-align: center; } .description { padding: 0 0 10px 0; font-size: 14px; font-style: italic; letter-spacing: 2px; } /* THE MENU */ #menubar { background: #000 /* url('images/menubarbgdark.jpg') repeat-x*/; text-align: left; } #menunav { float: right; text-align: center; } #menunav a { width: 25px; height: 25px; display: block; float: left; color: #fff; font-size: 19px; font-weight: bold; line-height: 24px; } #menunav a:hover { background: #800; } #menu { padding: 0; margin: 0; list-style: none; float: left; line-height: 25px; font-size: 13px; text-transform: uppercase; } #menu a { padding: 0px 10px 0 10px; display: block; color: #fff; text-decoration: none; } #menu li .rss { padding: 5px 0 5px 0; } #menu li { float: left; } #menu li:hover a, #menu li.sfhover a { color: #fff; /* Main menu highlighted text color */ } #menu li:hover, #menu li.sfhover { background: #800; /* Main menu highlighted background color */ } /* For submenu dropdowns - this order must be maintained */ #menu ul { padding: 0; margin: 0; list-style: none; position: absolute; left: -9999px; width: 175px; line-height: 1; } #menu li li { width: 165px; padding: 4px 5px; color: #fff; } #menu li li a { width: 174px; padding: 0; color: #fff; border: none; } #menu li ul ul { margin: -17px 0 0 170px; } #menu li ul li:hover a, #menu li ul li li:hover a, #menu li ul li li li:hover a, #menu li ul li li li:hover a { color: #fff; /*Submenu highlighted text color */ } #menu li:hover li a, #menu li li:hover li a, #menu li li li:hover li a, #menu li li li li:hover li a { color: #fff; /*Submenu text color */ } #menu li li:hover { background: #f00; /*Submenu highlighted background color */ } #menu li:hover ul ul, #menu li:hover ul ul ul, #menu li:hover ul ul ul ul, #menu li.sfhover ul ul, #menu li.sfhover ul ul ul, #menu li.sfhover ul ul ul ul { left: -9999px; } #menu li:hover ul, #menu li li:hover ul, #menu li li li:hover ul, #menu li li li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul, #menu li li li.sfhover ul, #menu li li li li.sfhover ul { left: auto; background: #000; /* Submenu background color */ text-transform: none; } #menu .current_page_item a { color: #fff000; } /* THE COMIC */ #comic { padding: 0; text-align: center; z-index: 100; } .comic-left { float: left; } .comic-right { float: right; } .comic-content { z-index:100; } /* THE FOOTER */ #footer { padding: 5px 0; text-align: center; } /* NAVIGATION */ .nav { float: right; font-size: 12px; font-weight: bold; margin-right: 10px; padding: 5px; } .nav-first { padding: 0 5px 0 0; float: left; } .nav-previous { padding: 0 5px; float: left; } .nav-next { padding: 0 5px; float: left; } .nav-last { padding: 0 0 0 5px; float: left; } .nav-blog { color: #000; font-size: 12px; font-weight: bold; float: right; } .nav-blog-previous { padding: 0 5px 0 0; float: left; } .nav-blog-next { padding: 0 0 0 5px; float: left; border-left: 1px solid #000; } .pagenav,.commentnav { height: 25px; color: #000; font-size: 12px; font-weight: bold; line-height: 25px; padding: 0 5px 0 5px; margin-top: 5px; clear: both; } .pagenav-left,.commentnav-left { float: left; } .pagenav-right,.commentnav-right { float: right; } .nav a, .pagenav a, .nav-blog a { display: block; float: left; color: #000; } .nav a:hover, .pagenav a:hover, .nav-blog a:hover { color: #800; } /* POSTS - PAGES */ #pagewrap-right { width: 770px; float: left; overflow: hidden; padding: 0; margin: 0; } #content-wrapper { margin: 0 auto; padding: 0; clear: both; } #content { float: left; overflow: hidden; } .narrowcolumn { width: 560px; margin: 0 auto; float: left; } .widecolumn { margin: 0 auto; } .column { margin: 0 5px 0 5px; } .post, .post-comic, .post-page { clear: both; padding: 0 5px; } .post-head, .post-page-head, .post-comic-head { } .post-foot, .post-comic-foot, .post-page-foot { } .post-foot { margin-bottom: 20px; } .entry { padding: 5px; } .post-info { margin-bottom: 5px; } .post-text { padding-left: 5px; overflow: hidden; display: block; } .post-date { color: #777; font-family: 'Georgia' , serif; font-size: 15px; font-weight: bold; float: left; } .post-date .date { height: 50px; width: 45px; background: url(images/calendar.png) center no-repeat; font: normal 22px Verdana, Arial, Helvetica, sans-serif; color: #000; text-align: center; line-height: 100%; padding: 0 2px 0 0; } .post-date .date span { height: 16px; display: block; font: normal 11px Verdana, Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; padding-top: 5px; } .comicdate { font-size: 14px; } .postdate { font-size: 11px; } .more-link { border-top: 1px dashed #000; font-style: italic; display: block; clear: both; } .tags { font-size: 11px; } .comment-link { font-family: 'Georgia', serif; font-size: 13px; text-align: right; } .related_posts { margin-top: 10px; font-weight: 700; } .related_posts ul { list-style: none; font-weight: normal; font-size: 12px; } /* THE BLOG HEADER */ #blogheader { font-family: 'Georgia', serif; padding: 5px 0 5px 0; font-size: 32px; letter-spacing: -2px; border-top: 1px groove #000; margin-top: 10px; } /* COMMENTS */ .comment-wrap{ padding: 0 20px; } .comment-wrap h3 { margin: 0; padding: 20px 0 0 0; font-weight: normal; font-size: 20px; clear: both; font-family: 'Georgia', serif; } .comment { padding: 10px; margin: 10px 0 0 0; clear: both; min-height: 64px; } .comment .avatar { border: solid 1px #000; margin: 0 10px 0 0; float: left; } .comment .trackping { float: left; } .comment .comment { margin-left: 30px; } .comment .comment .comment { } .comment #respond { } .comment-author { display: inline; } .comment-meta { display: inline; padding: 0 0 0 5px; margin: 0 0 0 2px; border-left: 1px solid #000; } .says { display:none; } .commentsrsslink { float: right; font-size: 11px; } #comment { width: 99%; font-size: 12px; font-family: 'Arial', sans-serif; } #author, #email, #url { font-size: 12px; font-family: 'Arial', sans-serif; } #submit { margin: 0 0 20px 0; float: right; } .commentlist ul { list-style: none; margin-bottom: 30px; } ol.commentlist { margin: 0; padding: 0; font-size: 11px; list-style: none; } ol.commentlist p { margin: 10px 0 0 74px; } ul.children { margin: 0; padding: 0; list-style: none; } .reply { padding: 10px 0 0 0; text-align: right; } /* ARCHIVE */ /* For the built-in WordPress archive pages (by month or category) as well as search result pages */ .comicarchiveframe { padding: 5px; border: 1px solid #000; background: #fff; margin-bottom: 20px; } .comicarchiveframe:hover { } .comicarchiveframe h3 { margin: 0; } .comicarchiveframe a small { display: block; color: #000; } .archive-year { font-size: 48px; } .archive-yearlist { padding: 0 0 10px 0; font-size: 14px; } /* SIDEBAR */ /* Left Sidebar Themes */ #sidebar-left { float: left; width: 210px; } /* Right Sidebar Themes */ #sidebar-right { float: right; width: 210px; } .customsidebar ul, .customsidebar li { margin: 0; padding: 0; list-style: none; } .widget { margin: 0 auto; } /* Sidebar Class */ .sidebar { font-size: 11px; margin: 0 5px 0 5px; overflow: hidden; padding-bottom: 10px; } .sidebar h2, .sidebar h2 a { font-size: 16px; } .sidebar .widget { margin-bottom: 10px; } .sidebar ul { margin: 0; padding: 0; list-style: none; } .sidebar ul li { margin: 0; padding: 0; text-align: left; list-style: none; } .sidebar ul li ul li { margin: 0 0 0 13px; padding: 0; text-align: left; } .sidebar li h2 { margin-top: 15px; } /* WIDGETS */ .random-comic-icon { padding: 0 5px; color: #fff; background: #000; } .comic-bookmark { width: 185px; margin: 0 auto; margin-bottom: 10px; } .archive-dropdown { max-width: 100%; } /* CALENDAR */ #wp-calendar { border: solid 1px #000; width: 165px; margin: 0 auto; } #wp-calendar th { font-size: 10px; font-weight: normal; text-align: center; } #wp-calendar caption { font-family: 'Georgia', sans-serif; font-size: 18px; letter-spacing: -1px; font-variant: small-caps; } #wp-calendar td { min-width: 20px; padding: 0; text-align: center; border: 1px solid #000; } #wp-calendar a { display: block; text-decoration: none; font-weight: bold; } #wp-calendar a:hover { color: #fff; background: #000; } /* SEARCH */ #s { width: 140px; margin: 0; padding: 2px; font-size: 12px; font-family: 'Arial', sans-serif; } #searchform { margin-top: 10px; } #searchsubmit { padding: 0 5px; font-size: 12px; font-family: 'Arial', sans-serif; } .button { color: #fff; background: #838ab5; border: 1px solid #000; font-weight: 700; font-family: 'Arial', sans-serif; padding: 1px 5px 1px 4px; } .searchresults { padding: 10px; float: right; } /* GALLERY */ .gallery-image { width: 518px; border: 1px solid #000; overflow: hidden; background: #000; } .gallery-caption { font-size: 11px; } .gallery-caption p { width: 510px; padding: 5px; margin: 0; text-align: center; color: #fff; background: #000; } .imagenav-wrap { margin: 5px 0 0 0; } .imagenav { width: 77px; height: 77px; float: left; overflow: hidden; } .imagenav-center { width: 344px; height: 65px; margin: 0 5px; padding: 10px 5px 0 5px; float: left; color: #000; text-align: center; border: 1px solid #000; overflow: hidden; } .imagetitle { color: #000; font-size: 18px; } .imagenav-bg { width: 75px; height: 75px; position: absolute; z-index: 0; background: #ddd; border: 1px solid #000; overflow: hidden; } .imagenav-bg img { width: 75px; height: 75px; } .imagenav-arrow { width: 75px; height: 75px; position: absolute; z-index: 1; color: #fff; font-size: 80px; font-weight: bold; line-height:75px; text-align: center; border: 1px solid #000; float: left; } .imagenav-link { width: 75px; height: 75px; position: absolute; z-index: 2; border: 1px solid #000; float: left; overflow: hidden; } .imagenav-link img { width: 75px; height: 75px; /* opacity: 0.50; filter: alpha(opacity=50); */ } .imagenav-link img:hover { /* opacity: 0.00; filter: alpha(opacity=0); */ } /* POSTED IMAGES */ .wp-caption p { margin: 5px 0; line-height: 11px; font-size: 11px; } .aligncenter { margin: 0 auto; display: block; } .alignright { margin: 10px 0 10px 10px; display: inline; float: right; } .alignleft { margin: 10px 10px 10px 0; display: inline; float: left } /* TRANSCRIPT */ #transcript { padding: 0 10px; font-size: 11px; border-left: 4px dotted #000; border-right: 4px dotted #000; } .transcript-border { padding: 0 5px; margin: 15px 0; border: 1px solid #000; background: #fff; clear: both; } a.transcript-title { padding: 0 0 5px 0; margin: 0 0 5px 0; display: block; font-family: 'Georgia', serif; font-style: italic; font-size: 16px; letter-spacing: -1px; border-bottom: 1px dashed #000; } #transcript-content { font-family: 'Courier New', monospace; overflow: hidden; } #s-transcript { width: 140px; margin: 0; padding: 2px; font-size: 12px; font-family: 'Georgia', serif; font-style: italic; } #searchsubmit-transcript { padding: 0 5px; font-size: 12px; font-family: 'Arial', sans-serif; } #s-search { width: 140px; margin: 0; padding: 2px; font-size: 12px; font-family: 'Georgia', serif; font-style: italic; } #searchsubmit-search { padding: 0 5px; font-size: 12px; font-family: 'Arial', sans-serif; } /* Pingbacks and Trackbacks */ li.pingback div p, li.trackback div p { margin-left:0; } /* STORYLINES */ #storyline-cats { padding: 0; margin: 0 10px 0 0; list-style: none; } #storyline-cats li { display: inline; } #storyline-cats ul { display: inline; margin-right: 10px; } /* CLEAR FLOATS */ .clear { clear: both; } /* CLEAR MARGINS */ /* Used with BR for clearing paragraph margins for Safari, Chrome - avoid background gaps */ .clear-margins { clear: both; height: 0; line-height: 0; font-size: 0; } /* COMIC NAVIGATION */ a.rollnext, .rollnext { display: inline-block; height: 50px; width: 60px; float: left; text-decoration: none; background: url('images/nav/nextroll.png') no-repeat; } a.rolllast, .rolllast { display: inline-block; height: 50px; width: 60px; float: left; text-decoration: none; background: url('images/nav/lastroll.png') no-repeat; } a.rollprev, .rollprev { display: inline-block; height: 50px; width: 60px; float: left; text-decoration: none; background: url('images/nav/prevroll.png') no-repeat; } a.rollfirst, .rollfirst { display: inline-block; height: 50px; width: 60px; float: left; text-decoration: none; background: url('images/nav/firstroll.png') no-repeat; } a.rollrandom, .rollrandom { display: inline-block; height: 50px; width: 60px; text-decoration: none; background: url('images/nav/randomroll.png') no-repeat; } a.rollfirst:hover, a.rollprev:hover, a.rollnext:hover, a.rolllast:hover, a.rollrandom:hover { background-position: -60px 0; } .rollagain { background-position: -120px 0; } #comic_navi_wrapper { } .comic_navi { width: 370px; margin: 0 auto; } .comic_navi_left { width: 120px; float: left; } .comic_navi_center_spacer { width: 130px; margin: 0 auto; } .comic_navi_center { width: 60px; margin: 0 auto; } .comic_navi_right { width: 120px; float: right; } /** BUY THIS **/ .buythis { padding: 0 5px 0 5px; } .buythisbutton { height: 27px; width: 240px; margin: 5px 0 5px 0; background: url('images/buythis.png') no-repeat; } /** Project Wonderful CSS Embedded areas **/ .blogpwad { text-align: center; width: 100%; } .headerpwad { float: right; margin: 5px 5px 0 0; } .footerpwad { display: block; width: 100%; text-align: center; } /* Archive Calendar Template */ .cpcal-month { width: 157px; height: 138px; padding: 5px 0 5px 5px; margin: 0 8px 8px 0; float: left; border: 1px solid #000; } .cpcal-monthtitle { width: 154px; height: 16px; padding: 0 0 5px 0; text-align: center; font-family: 'Georgia', serif; font-variant: small-caps; font-size: 16px; line-height: 16px; letter-spacing: -1px; } .cpcal-dayletter { width: 20px; height: 15px; margin: 0 2px 2px 0; display: block; float: left; text-align: center; font-size: 10px; line-height: 13px; } .cpcal-day { width: 18px; height: 13px; margin: 0 2px 2px 0; display: block; float: left; text-align: center; font-size: 10px; line-height: 13px; border: 1px solid #000; } .cpcal-day a { width: 18px; height: 13px; line-height: 13px; display: block; font-size: 12px; font-weight: bold; } .cpcal-day a:hover { color: #fff; background: #000; } /* Storyline Template */ #storyline, #storyline ul { padding: 0; margin: 0; list-style: none; } #storyline li { padding: 0; margin: 0; } #storyline li img { height: 50px; display: none; } #storyline li li img { display: block; float: right; padding: 0 0 0 10px; } #storyline ul ul { margin: 0 0 0 20px; } #storyline li li .storyline-title { font-size: 24px; font-weight: bold; display: block; color: #000; } #storyline li li .storyline-title:hover { color: #900; } #storyline li li li a.storyline-title { font-size: 18px; } #storyline li li li li a.storyline-title { font-size: 14px; } .storyline-description { font-size: 11px; } .storyline-foot { clear: both; margin: 0 0 10px 0; height: 10px; border-bottom: 4px solid #000; } #storyline li li .storyline-foot { border-bottom: 2px solid #000; } #storyline li li li .storyline-foot { border-bottom: 1px solid #000; } /* Archive Year Template */ .archive-date { padding: 0 5px 0 0; font-size: 11px; white-space: nowrap; } .archive-title { padding: 2px 5px; line-height: 11px; border-left: 1px solid #000; } .month-table{ border-collapse: collapse; margin: 0 0 20px 0; } #linkspage, #linkspage ul, #linkspage li { list-style:none; } #linkspage h2 { margin-top: 20px; } .wp-pagenavi, .paginav { height: 25px; line-height: 25px; font-size: 14px; } .wp-pagenavi a, .wp-pagenavi a:link, .wp-pagenavi a:visited, .wp-pagenavi a:hover, .wp-pagenavi a:active { padding: 2px; text-decoration: none; } .wp-pagenavi span.pages { color: #777; margin-right: 10px; } .wp-pagenavi span.current, .paginav .current { font-size: 16px; font-weight: bold; } .wp-pagenavi span.extend { } /* Drop Bar */ .dropbar { position:absolute; left:0px; width:100%; height:98px; border-bottom: solid 1px #fff; color: white; font-family: Verdana; font-size: 11px; z-index:10000; background: #000; } .dropbar .droptab { position: absolute; bottom: -23px; left: 30px; width: 142px; height: 23px; background-image: url('images/dropbar.png'); } /* members only */ .members-only { border: solid 1px #000; background: #ccc; padding: 3px; } /* Tool Tips */ .tt a { position:relative; z-index:1000; color:#3CA3FF; font-weight:bold; text-decoration:none; margin-bottom: -100px; } a.tt span{ display: none; } a.tt:hover span.tooltip { position: absolute; display:block; width:200px; color: #000; margin: 0 auto; text-align: center; height: 164px; background: url('images/anomaly.png') no-repeat; z-index:1000; } a.tt:hover span.top{ display: block; width: 200px; height: 20px; padding-top: 10px; margin-top: 55px; margin-left: 25px; background: url('images/bubble.gif') no-repeat top; z-index:1000; } a.tt:hover span.middle{ /* different middle bg for stretch */ display: block; width: 190px; margin-left: 25px; padding: 0 5px 0 5px; background: url('images/bubble_filler.gif') repeat bottom; z-index:1000; } a.tt:hover span.bottom{ display: block; width: 200px; height: 15px; background-position: -100px; color: #548912; margin-left: 25px; background: url('images/bubble.gif') no-repeat bottom; z-index:1000; } /* User Pages */ #userpage { width: 100%; padding: 5px; } .userpage-avatar { float: left; width: 64px; height: 64px; border: 1px solid #000; } .userpage-info { margin-left: 10px; float: left; } .userpage-desc { width: 400px; padding: 5px; margin-top: 30px; border: 1px dotted #efefef; } .userpage-posts { margin-top: 20px; } .userpage-posts ol { margin: 10px 0 0 30px; padding: 0; } .userpage-posts li { list-style: none; margin: 0; padding: 0; }