/*--------------------------------------*/
/* CSS Created by Penny Arcade - 2010 --*/
/* www.penny-arcade.com ----------------*/
/*--------------------------------------*/

@import url(css_rockwell.css);

/*---------------------*/
/* General ------------*/
/*---------------------*/
* {margin: 0;padding: 0;}
body {
    background: #010d21;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 14px;
	color: #e7f3ff;
}
hr {display: none;}
img, fieldset {border: none;}
a:link, a:visited {color: #ef860c;}
a:hover, a:active {color: #2abae1;}
.content {
	width: 990px;
	margin: 0 auto;
}
.btn,
.btn a,
.nav a {
	display: block;
	text-indent: -999em;
	overflow: hidden;
	outline: none;
	cursor: pointer;
	border: 0;
	text-transform: uppercase;
}
.btn:hover,
.btn a:hover,
#merchNav .nav a:hover {
	background-position: bottom left !important;
}
/*---------------------*/
/* Header -------------*/
/*---------------------*/
#header {
	background: #032255 url(img_bg_header_tile.png) top left repeat-x;
}
#header .pixels {
	background: url(img_bg_header.png) top center no-repeat;	
}
#header .content {
	overflow: hidden;
	height: 155px;
}
#header h1 a {
	background: url(img_logo_penny_arcade.png) top left no-repeat;
	float: left;
	display: inline;
	text-indent: -999em;
	overflow: hidden;
	width: 200px;
	height: 126px;
	margin: 17px 0 0 16px;
	outline: none;
}
#header h1 a:hover {
	background-position: bottom;
}
#header #bannerAd {
	width: 728px;
	height: 90px;
	float: left;
	display: inline;
	margin: 10px 0 0 21px;
}
/*---------------------*/
/* Nav ----------------*/
/*---------------------*/
#header ul {
	overflow: hidden;
	width: 760px;
	float: left;
	display: inline;
	margin: 0 0 0 11px;
	list-style: none;
	list-style-position: outside;
}
#header li {
	float: left;
	display: inline;
}
#header ul .nav a {
	height: 38px;
	float: left;
	display: inline;
	padding: 0;
	margin: 0;
}
#header .nav a {
	border: 0;
	position: relative;
	display: block;
	text-indent: -999em;
	overflow: hidden;
}
#header .nav a:hover {text-decoration: none;}
#header .active a {background-position: bottom;}
#navComic a {background: url(img_nav_comic.png) top left no-repeat; width: 92px;}
#navArchive a {background: url(img_nav_archive.png) top left no-repeat; width: 104px;}
#navStore a {background: url(img_nav_store.png) top left no-repeat; width: 84px;}
#navForum a {background: url(img_nav_forum.png) top left no-repeat; width: 87px;}
#navPATV a {background: url(img_nav_patv.png) top left no-repeat; width: 78px;}
#header .nav a span {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	height: 38px;
	width: 92px;
}
#navComic a span {background: url(img_nav_comic.png) bottom left no-repeat; width: 92px;}
#navArchive a span {background: url(img_nav_archive.png) bottom left no-repeat; width: 104px;}
#navStore a span {background: url(img_nav_store.png) bottom left no-repeat; width: 84px;}
#navForum a span {background: url(img_nav_forum.png) bottom left no-repeat; width: 87px;}
#navPATV a span {background: url(img_nav_patv.png) bottom left no-repeat; width: 78px;}
/*---------------------*/
/* Sub Nav ------------*/
/*---------------------*/
#header ul a {
	color: #fff;
	float: left;
	display: inline;
	font-size: 11px;
	line-height: 14px;
	font-weight: bold;
	text-decoration: none;
	padding: 0 11px 0 11px;
	margin: 8px 0 0 0;
}
#header ul a:hover {
	color: #2abae1;
}
#header ul .last a {
	border-right: 0;
}
/*---------------------*/
/* Main ---------------*/
/*---------------------*/
#main {
	background: #02183b url(img_bg_main_tile.png) top center repeat-y;
}
#main .pixels {
	background: url(img_bg_main.png) top center no-repeat;
}
#main .content {
	background: url(img_bg_main_content.png) bottom left no-repeat;
	overflow: hidden;
	width: 950px;
	padding: 20px 20px 30px 20px;
} 
/*---------------------*/
/* Body ---------------*/
/*---------------------*/
#main .content #body {
	float: left;
	display: inline;
	width: 765px;
	position: relative;
}
#main .content #sidebar {
	float: right;
	display: inline;
	width: 170px;
}
#main .content #bodyFull {
	width: 950px;
}
/*---------------------*/
/* Hero ---------------*/
/*---------------------*/
#heroFeature {
	background: url(img_bg_hero.png) bottom left no-repeat;
	width: 765px !important;
	height: 211px;
	margin: 0 0 20px 0;
	overflow: hidden;
	position: relative;
}
#heroFeature .ui-tabs-hide { 
	display: none; 
}
#heroFeature #feature {
	background: #02183b;
	float: left;
	display: inline;
	width: 560px;
}
/*---------------------*/
/* Video Tabs ---------*/
/*---------------------*/
#heroFeature #featTabs {
	list-style: none;
	list-style-position: outside;
	float: right;
	display: inline;
	width: 205px;
}
#featTabs h4 a {
	display: block;
	color: #fff;
/*	font-size: 16px;*/
	font-size: 14px;
	line-height: 19px;
	padding: 12px 0 0 15px;
	height: 30px;
	width: 190px;
	text-decoration: none;
	font-weight: normal;
}
#featTabs li {
	background-position: top;
	background-repeat: no-repeat;
	width: 205px;
	height: 42px;	
}
#featTabs #iconNew {background-image: url(img_tab_new.png);}
#featTabs #iconPAX {background-image: url(img_tab_pax.png);}
#featTabs #iconCP {background-image: url(img_tab_cp.png);}
#featTabs #iconFP {background-image: url(img_tab_fp.png);}
#featTabs #iconGH {background-image: url(img_tab_gh.png);}
#featTabs li a {
	outline: none;
}
#featTabs li.ui-tabs-selected {
	background-position: bottom;
}
#featTabs li.ui-tabs-selected a {
	font-weight: bold !important;
}
#featTabs li h4 a:hover {
	color: #2abae1;
}
#featTabs li.ui-tabs-selected h3 a:hover {
	color: #fff;
}
/*---------------------*/
/* Hero Image & Txt ---*/
/*---------------------*/
#feature img {
	display: block;
}
#feature .info {
	background: url(img_bg_overlay.png) bottom left repeat;
	position: absolute;
	z-index: 1;
	width: 520px;
/*	height: 90px; Change to 84 to align with tabs */
	height: 74px;
	bottom: 1px;
	padding: 10px 20px 0 20px;
}
#feature p {
	font-family: "Rockwell", Helvetica, sans-serif;
	font-size: 14px;
	float: left;
	display: inline;
	line-height: 17px;
	width: 390px;
}
#feature .info h3 {
	width: 518px;
	font-family: "RockwellBold", Helvetica, sans-serif;
}
#feature .info h3,
#feature .info h3 a {
	font-weight: normal;
	color: #ef860c;
	font-size: 22px;	
	line-height: 28px;
	margin: 0 0 2px 0;
	text-decoration: none;
}
#feature .btnLearnMore {
	background: url(img_btn_learn_more.png) top left no-repeat;
	float: right;
	display: inline;
	text-indent: -999em;
	overflow: hidden;
	width: 118px;
	height: 34px;
/*	margin: 30px 0 0;*/
}
/*---------------------*/
/* News ---------------*/
/*---------------------*/
.news {
	width: 760px;
	background: #01468b;
	margin: 0 0 20px 0;
}
.news .postTop,
.news .postBtm {
	background: url(img_bg_blue_btm.png) top left no-repeat;
	height: 5px;
	line-height: 0;
	font-size: 0;
	width: 760px;
}
.news .postTop {
	background: url(img_bg_blue_top.png) top left no-repeat;
}
.news .copy {
	padding: 10px 15px 0 15px;
}
.news .copy p {
	margin: 0 0 10px 0;
}
.newsNav {
	overflow: hidden;
	width: 752px;
	height: 29px;
	padding: 7px 2px 0 6px;
}
.newsNav li {
	display: inline;
	list-style: none;
	list-style-position: outside;
}
.newsNav .btn,
.newsNav .btnBlank,
.newsNav .ellipses {
	width: 26px;
	height: 24px;
	float: left;
	display: inline;
	margin: 0 4px 0 0;
}
.newsNav .ellipses {
	overflow: hidden;
	color: #fff;
	font-weight: bold;
	font-size: 16px;
	line-height: 18px;
	text-align: center;
	padding: 4px 0 0 0;
	height: 20px;
	margin: 0 0 0 -3px;
	text-shadow: 0 1px 0 #353f0f;
}
.newsNav.top {background: url(img_bg_post_nav_top.png) top left no-repeat;}
.newsNav.btm {background: url(img_bg_post_nav_btm.png) top left no-repeat;}
.newsNav .btnFirst {background: url(img_icon_first.png) top left no-repeat;}
.newsNav .btnPrev {background: url(img_icon_prev.png) top left no-repeat;}
.newsNav .btnComic {background: url(img_icon_comic.png) top left no-repeat;}
.newsNav .btnNews {background: url(img_icon_news.png) top left no-repeat;}
.newsNav .btnNext {background: url(img_icon_next.png) top left no-repeat;}
.newsNav .btnNew {background: url(img_icon_new.png) top left no-repeat;}
.newsNav .btnRSS {
	background: url(img_icon_rss.png) top left no-repeat;
	width: 107px;
	float: right;
	display: inline;
}
/*---------------------*/
/* Content Area -------*/
/*---------------------*/
.contentArea {
	width: 950px;	
}
.contentArea .post {
	background: #01468b;	
	width: auto;
	margin: 0;
	padding: 0;
}
.contentArea .comic img {
	display: block;
	margin: 0 auto;
}
.contentArea .newsNav {
	width: 944px;
}
.contentArea .share {
	list-style: none;
	list-style-position: outside;
	border: 1px solid red;
	width: 100px;
	float: left;
	display: inline;
}
.contentArea .newsNav.top {background: url(img_bg_top_lrg.png) top left no-repeat;}
.contentArea .newsNav.btm {background: url(img_bg_btm_lrg.png) top left no-repeat;}
.contentArea .newsNav .btnTwt {
	background: url(img_icon_twt.png) top left no-repeat;
	margin-left: 290px;
}
.contentArea .newsNav .btnFB {background: url(img_icon_fb.png) top left no-repeat;}
.contentArea .subTitle {
	background: url(img_bg_top_lrg.png) top left no-repeat;
	width: 950px;
	height: 36px;
	overflow: hidden;
}
.contentArea .postBtm {
	background: url(img_bg_blue_btm_lrg.png) bottom left no-repeat;
	width: 950px;
	height: 5px;
	font-size: 0;
	line-height: 0;
}
/*---------------------*/
/* Comic --------------*/
/*---------------------*/
#bodyFull #pageTitle {
	background: url(img_bg_page_title.png) top left no-repeat;
	width: 950px;
	height: 55px;
	margin: 0 0 5px 0;
	color: #fff;
}
#pageTitle.comic h2 {
	width: 750px;
}
#pageTitle h2 {
	float: left;
	display: inline;
	line-height: 26px;
	font-weight: normal;
	font-family: "Rockwell", Helvetica, sans-serif;
	font-size: 22px;
	margin: 15px 0 0 20px;
	text-shadow: 0 -1px 0 #001b38;
}
#pageTitle .btnBuyPrint {
	background: url(img_btn_buy_print.png) top left no-repeat;
	float: right;
	display: inline;
	width: 153px;
	height: 44px;
	margin: 6px 10px 0 0;
}
/*---------------------*/
/* Archive ------------*/
/*---------------------*/
.contentArea .archive {
	padding: 20px;
}
.contentArea .tagcloud li {
	display: inline;
	list-style: none;
	line-height: 35px;
	list-style-position: outside;
	margin: 0 0 15px 0;
}
.contentArea .tagcloud li a {
	text-decoration: none;
	padding: 5px;
	color: #fff;
}
.contentArea .tagcloud li a:hover {
	background: #2abae1;
}
.tagcloud .tag1 {font-size: 10px;}
.tagcloud .tag2 {font-size: 12px;}
.tagcloud .tag3 {font-size: 14px;}
.tagcloud .tag4 {font-size: 18px;}
.tagcloud .tag5 {font-size: 20px;}
.tagcloud .tag6 {font-size: 24px;}
.tagcloud .tag7 {font-size: 30px;}
#pageTitle.archive h2 {
	width: 450px;
}
#pageTitle form {
	float: right;
	display: inline;
	width: 457px;
	margin: 10px 10px 0 0;
}
#pageTitle form label {display: none;}
#pageTitle form .txt {
	background: url(img_input_search.png) top left no-repeat;
	float: left;
	display: inline;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-weight: bold;
	color: #333;
	font-size: 16px;
	line-height: 22px;
	width: 348px;
	height: 34px;
	border: 0;
	padding: 1px 0 0 32px;
}
#pageTitle .btnSearch {
	background: url(img_btn_search.png) top left no-repeat;
	float: right;
	display: inline;
	width: 73px;
	height: 34px;
	border: 0;
	text-transform: capitalize;	
	cursor: pointer;
	margin: 1px 0 0 0;
}
.subTitle .txtKeywords {
	background: url(img_txt_top_keywords.png) top left no-repeat;
	width: 109px;
	height: 16px;
	display: block;
	text-indent: -999em;
	overflow: hidden;
	margin: 10px 0 0 18px;
}
/*---------------------*/
/* Results ------------*/
/*---------------------*/
.newsNav .btnBlank {
	background: url(img_btn_blank_green.png) top left no-repeat;
	overflow: hidden;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	font-size: 16px;
	line-height: 18px;
	text-align: center;
	padding: 2px 0 0 0;
	height: 22px;
	text-shadow: 0 1px 0 #353f0f;
}
.newsNav .btnBlank:hover,
.newsNav .current .btnBlank {
	background-position: bottom;
	height: 20px;
	padding: 4px 0 0 0;
}
.newsNav h3 {
	margin: 0 18px 0 0;
	padding: 1px 0 0 0;
	line-height: 20px;
	float: right;
	display: inline;
	font-size: 15px;
	color: #ef860c;
	text-shadow: 0 -1px 0 #02122c;
}
.post.results {
	padding: 20px 0 20px 20px;
}
.post ul.results li {
	background: #013e7f;
	border: 1px solid #013b78;
	border-bottom: 1px solid #005bb2;
	width: 425px;
	padding: 10px;
	float: left;
	display: inline;
	margin: 0 17px 10px 0;
}
.post ul.results .imgTmb {
	background: url(img_bg_img_frame.png) top left no-repeat;
	width: 151px;
	height: 101px;
	float: left;
	display: inline;
	overflow: hidden;
}
.post ul.results .imgTmb img {
	margin: 0 auto;
	overflow: hidden;
	display: block;
}
.post .imgTmb .imgH {
	margin: 12px 0 0 0 !important;
}
.post ul.results .info {
	float: right;
	display: inline;
	width: 255px;
	margin: 27px 0 0 0;
}
.post ul.results li h4 a {
	font-size: 14px;
	text-decoration: none;
	border-bottom: 1px solid #ef860c;
}
.post ul.results li h4 a:hover {
	border-bottom: 1px solid #2abae1;
}
.post ul.results li p {
	margin: 5px 0 0 0;
	font-size: 12px;
	font-weight: bold;
}
/*---------------------*/
/* Posts --------------*/
/*---------------------*/
.post {
	margin: 1px 5px 10px 3px;
	width: 752px;
	overflow: hidden;
}
.post .byTycho {background: url(img_bg_tycho.png) top left no-repeat;}
.post .byGabe {background: url(img_bg_gabe.png) top left no-repeat;}
.post .heading {	
	width: 672px;
	height: 89px;
	overflow: hidden;
	padding: 0 0 0 80px;
	margin: 0 0 15px 0;
}
.post p {
	font-size: 13px;
	line-height: 20px;
	margin: 0 15px 15px 17px;
}
.post .title {
	width: 600px;
	float: left;
	display: inline;
	margin: 22px 0 0 0;
}
.post .title h2 a,
.post .title h2 {
	font-weight: normal;
	font-size: 22px;
	font-family: 'Rockwell', Helvetica, sans-serif;
	color: #fff;	
	text-decoration: none;
	margin: 0 0 7px 0;
	text-shadow: 0 -1px 0 #001b38;
}
.post .title h2 a:hover {
	color: #2abae1;
}
.post .title .iconEmail,
.post .title .iconDate {
	background: url(img_icon_email.png) center left no-repeat;
	float: left;
	display: inline;	
	width: 50px;
	padding: 0 0 0 20px;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	color: #2abae1;
	line-height: 18px;
	margin: 0 5px 0 0;
}
.post .title .iconEmail:hover {
	color: #ef860c;
}
.post .title .iconDate {
	background: url(img_icon_date.png) center left no-repeat;
	width: auto;
	margin: 0;
}
.post .share {
	list-style: none;
	list-style-position: outside;
	overflow: hidden;
	float: right;
	display: inline;
	width: 26px;
	margin: 20px 15px 0 0;
}
.post .share a {
	width: 26px;
	height: 24px;
	margin: 0 0 5px 0;	
}
.post .share .btnTwt {background: url(img_icon_twt.png) top left no-repeat;}
.post .share .btnFB {background: url(img_icon_fb.png) top left no-repeat;}
/*---------------------*/
/* Sidebar ------------*/
/*---------------------*/
#newsletter {
	background: #01468b url(img_bg_newsletter.png) bottom left no-repeat;
	margin: 0 0 20px 0;
	font-size: 12px;
	width: 170px;
	overflow: hidden;
}
#newsletter h3 {
	background: url(img_txt_newsletter.png) top left no-repeat;
	width: 170px;
	height: 36px;
	text-indent: -999em;
	overflow: hidden;
	margin: 0 0 10px 0;
}
#newsletter p,
#newsletter input {
	margin: 0 0 5px 10px;
}
#newsletter label {
	display: none;
}
#newsletter input.txt {
	border: 0;
	font-weight: bold;
	color: #333;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 11px;
	background: url(img_input_newsletter.png) top left no-repeat;
	width: 145px;
	height: 23px;
	padding: 0 0 0 5px;
}
#newsletter input.btn {
	background: url(img_btn_signup.png) top left no-repeat;
	width: 92px;
	height: 27px;
	border: 0;
	text-transform: capitalize;	
	cursor: pointer;
	display: block;
	margin: 0 0 10px 10px;
}
#sidebar #skyscraperAd {
	background: url(img_bg_skyscraper.png) top left no-repeat;
	padding: 5px;
}
/*---------------------*/
/* Footer -------------*/
/*---------------------*/
#footer {
	background: url(img_bg_footer.png) top center no-repeat;
}
#footer .content {
	width: 970px;
	padding: 30px 0 50px 20px;
}
#footer #promos {
	list-style: none;
	list-style-position: outside;
	overflow: hidden;
	width: 970px;
}
#footer #promos li {
	float: left;
	display: inline;
	margin: 0 14px 0 0;
}
/*#footer #promos p {display: none;}*/
#footer p {
	font-size: 11px;
	color: #003e7c;
	margin: 5px 0 0 0;
}
/*---------------------*/
/* Promos -------------*/
/*---------------------*/
#footer .promo {
	background: url(bg_promo.png) top left no-repeat;
	width: 175px;
	height: 109px;
	padding: 5px 0 0 5px;
	position: relative;
}
#footer .promo img {
	display: block;
	margin: 0 0 8px 0;
}
#footer .promo h4 a {
	font-family: "Rockwell", Helvetica, sans-serif;	
	font-weight: normal;
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	line-height: 16px;
	display: block;
	width: 133px;
	padding: 0 27px 0 8px;
}
#footer .promo h4 a strong {
	font-family: "RockwellBold", Helvetica, sans-serif;	
	font-weight: normal;
}
#footer .promo h4 a:hover {color: #ef860c;}
#footer .promo .icon {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 39px;
	height: 38px;	
}
#footer .promo .icon a {
	display: block;
	text-indent: -999em;
	overflow: hidden;
	width: 39px;
	height: 38px;
}
#footer .promo .icon .patv {background: url(icon_promo_patv.png) top left no-repeat;}
#footer .promo .icon .merch {background: url(icon_promo_merch.png) top left no-repeat;}
#footer .promo .icon .new {background: url(icon_promo_new.png) top left no-repeat;}
/*---------------------*/
/* Brands -------------*/
/*---------------------*/
#footer #brands {
	list-style: none;
	list-style-position: outside;
/*	width: 950px;*/
	width: 640px;
	margin: 0 auto;
	overflow: hidden;
}
#footer #brands li {
	float: left;
	display: inline;
}
#footer #logoPAX a {
	background: url(img_logo_pax.png) top left no-repeat;
	width: 65px;
	height: 35px;
	margin: 64px 50px 0 0;
}
#footer #logoFP a {
	background: url(img_logo_fp.png) top left no-repeat;
	width: 125px;
	height: 21px;
/*	margin: 70px 54px 0 0;*/
	margin: 70px 0 0 0;
}
#footer #logoCP a {
	background: url(img_logo_cp.png) top left no-repeat;
	width: 58px;
	height: 57px;
	margin: 43px 28px 0 0;
}
#footer #logoPA a {
	background: url(img_logo_pa.png) top left no-repeat;
	width: 189px;
	height: 141px;
/*	margin: 0 27px 0 0;*/
	margin: 0 20px 0 0;
}
#footer #logoPATV a {
	background: url(img_logo_patv.png) top left no-repeat;
	width: 61px;
	height: 36px;
/*	margin: 60px 64px 0 0;*/
	margin: 60px 34px 0 0;
}
#footer #logoGH a {
	background: url(img_logo_gh.png) top left no-repeat;
	width: 104px;
	height: 23px;
	margin: 68px 64px 0 0;
}
#footer #logoBench a {
	background: url(img_logo_bench.png) top left no-repeat;
	width: 61px;
	height: 32px;
	margin: 60px 0 0 0;
}