@font-face {
  font-family: GothamB;
  src: url(fonts/Gotham-Bold.otf);
}
@font-face {
  font-family: GothamBlack;
  src: url(fonts/Gotham-Black.otf);
}
@font-face {
  font-family: GothamBook;
  src: url(fonts/GothamBook.ttf);
}

body,html{ margin:0;padding:0;background:#000; }
h1,h2,h3,h6,h4,h5,ul,p,ol,li,legend,table,td,tr,thead,tbody,form,input,radio,select,address,header,footer,section,article,hr{ margin:0;padding:0;}
a img{ border:none; }


body,html{
	color:#f1f1f1;
	background:#111;
	font-family: GothamBook;
	font-size:13px;
}

a{
	font-family: GothamB;
	color:#ffa955;
}
a img, img{
	border:none;
}
.socials{
	display:block;
	text-align:center;
	padding: 20px;
}
.socials a img{
	display:inline-block;
	width:40px;
	margin:0 10px;
}
.center,
canvas{
	max-width:1000px;
	width:80%;
	margin:10px auto;
}
.center img{
	width:100%;
}
h1.logo{
	text-align:center;
	padding:10px 0 10px;
}
h1.logo img {
	height:160px;
	margin:0 auto;
}
h1{
	font-size:40px;
	font-family: GothamBook;
	padding:30px 0;
}
h2{
	font-size:30px;
	font-family: GothamB;
	padding:35px 0 5px;
}
h3{
	font-size:22px;
	font-family: GothamB;
	color:#ffce39;
	padding:15px 0 0px;	
}
h4, .h4{
	font-size:20px;
	font-family: GothamB;	
	color:#FF6699;
}

ul{
	padding-left:50px;	
}

p,li{
	font-size:16px;
	padding:8px 0;
	line-height:21px;
}

.qs{
	background: #f1f1f1;
	color:#333;	
	padding:20px 0 60px;
}
.qs h2{
	font-size:40px;
	padding:50px 0 25px;
}
.qs p{
	font-family: GothamB;		
}
.qs p b,
.qs h4{
	font-size:20px;
	display:block;
	color:#FF6699;
}

strong{
	font-family: GothamB;
	color:#ffce39;	
}

article section{
	width:990px;
	max-width:92%;
	margin:10px auto;
}
article input,
article textarea{
	width:90%;
	padding:4px 1%;
	margin:5px 0 25px;
}
article input{
	height:20px;
}
article textarea{
	min-height:120px;
}
.qs .btn{
	background:#FF6699;
	height:20px;
	width:180px;
	display:block;
	padding:10px;
	text-align:center;
	font-size:20px;
	color:#fff;
	text-decoration:none;
}

section img{
	max-width:100%;
}
.character-pitch img{
	width:500px;
	padding:20px 0;
}

.larger p{
	font-size:18px;
}
.larger strong{
	color:#ffce39;
}
.goal h4{
	display:inline;
	text-indent:100px;
}
.goal{
	text-align:center;
	max-width:80%;
	width:500px;
	margin:10px auto;
	line-height:25px;
	font-size:17px;
}
.goal h3{
	font-size:50px;
}

.catContainer{
	width:100%;
	position:relative;
}
.cat{
	width:100%;
}
.hr{
   background:yellow;
   height:60px;
   width:100%;
   display:block;
   mix-blend-mode: multiply;
   position:absolute;
   z-index:2;
   bottom:0;
   font-family:GothamB;
}
.hr h1{
	color:red;
	font-size:43px;
	line-height:50px;
	padding:10px 0;
}
.txtline{
	display:block;
}

/* https://www.w3schools.com/css/css_grid_item.asp */
.grid-container {
  display: grid;
}
.issuesList{
 /* background: green;*/
  border:2px solid green;
  display: grid;
  grid-template-columns: auto auto auto;
  gap: 20px 10px;
  margin-top:100px;
}
.issuesList .list-item{
	display:inline-block;
}
.list-item{
	
	position:relative;
	
	/*
	padding:12px;
	display:block;
	width:340px;
	height:360px;
	*/
}
.list-item img{
  width:100%;
  position:absolute;
  left:0;
}
.list-item .media-con{
  width:160px;
  height:280px;
  overflow:hidden;
  display:block;
  position:absolute;
  left:0;
}
.list-item .txt-con{
  width:170px;
  float:right;
}
.list-item .txt-con h2{
	font-family: GothamB;
}
.list-item .txt-con ul{
	padding:10px 0;
}
.txtline{
	font-size:20px;
	text-transform:uppercase;	
}
.txtline2{
	font-size:16px;
	color:#7b7b7b;
}

.txtline em{
	color:#fe6380;
	font-style:normal;
}


.charProfiles .media-con{
  width:240px;
  min-height:480px;
  overflow:hidden;
  display:block;
  position:absolute;
  left:0;
}
.overlayTxt{
	font-family: GothamBlack;
	width:540px;
	/*text-indent:-50px;*/
	color:#fe9f30;
	/*opacity:.5;*/
	font-size:89px;
	position:absolute;
	
	top:100px;
	z-index:4;
	mix-blend-mode: overlay;
	mix-blend-mode: color-dodge;
	/*mix-blend-mode: normal;*/
	transform: rotate(-25deg);
	left:-50px;/**/
}

/* https://css-tricks.com/almanac/properties/m/mix-blend-mode/ */

.charProfiles .txt-con{
  width:530px;
  width:auto;
  float:none;
  padding-left:250px;
   min-height:480px;
}
.charProfiles .list-item{
	width:90%;
	max-width:780px;
	height:auto;
	background:none;
}

.hidden{
	display:none;
}



h1{

}
.lineCon{
	 width:96%;
	 padding:0 2%;
	 height:800px; /* adjust this based on the height of the browser */
	 
}
.theLine{
	border-radius:2px;
	height:4px;
	width:100%;
	background:#fff;
	margin-top:400px;
	position:relative;
	
}
.spots{
	position:absolute;
	bottom:50px;
	width:100%;
	
}
.spot{
	position:absolute;
}

.spot b{
	position:absolute;
	height:20px;
	width:80px;
	display:block;
	background:red;
	border-radius:10px;
	border:2px solid #ffb400;
	z-index:2;
	text-indent:-5000px;
}
.spot .content{
	display:none;
	z-index:50;
	position:absolute;
	height:160px;
	width:160px;
	padding:20px;
	left:-100px;
	top:-250px;
	background:#fff;
	border-radius:15px;
	color:#333;
	font-family:Arial,sans-serif;
}

.spot:hover .content{
	display:block;
}

.spot .content em{
	font-style:normal;
	font-size:11px;
	text-transform:uppercase;
}
.spot .content h2{
	font-size:20px;
	margin:8px 0;
}
.spot .content p{
	font-size:14px;
	margin:10px 0;
}
.spot .content a{
	font-size:16px;
	font-weight:bold;
	color:blue;
}


/* Comic Reader */

/* Comic Reader */


.pageListSlider{
	overflow:hidden;
	height:0;
	width:auto;
	display:block;
}

.showps{
	height:auto;
}
.pageList{
	max-width: 1000px;
    width: 80%;
    margin: 10px auto;
}
.pageList li{
	display:inline-block;
}
.pageList li img{
	width:60px;
	margin:0 5px;
	border: 3px solid #333;
}
.pageList .selectedpage img{
	border-color:#ffa955;
}
.readerNav li{
	display:inline;
	margin:0 5px;
}
.readerNav a,
.readerNav li{
	color:#FF6699;	
	font-weight:bold;
}
.slideshow,
.openslideshow,
.togglePagelist{
	cursor:pointer;
}
.readerNav{
	text-align:center;
	padding:10px 0;
}

footer{
	text-align:center;
	padding-top:80px;
}




/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> exposeBox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
/*.exB_Gallery{
display:none;
}*/
#exB_overlay {
position: fixed;
_position: absolute;
z-index:100;
top:0px;
left:0px;
height:100%;
width:100%;
opacity:.85;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
filter:alpha(opacity=85);
background:#000;
}
* html #exB_overlay {
position: absolute;
height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
.exB_lv1 {
position: absolute;
position: fixed;
z-index: 500;
display:none;
top:50%;
left:50%;
}
.exB_lv1 .exB_lv2{
position:absolute;
display:block;
background:#fff;
padding:5px 6px 5px;
}
.exB_closeButton{
position:absolute;
right:0px;
top:0px;
height:25px;
display:block;
width:50px;
color:#fff;
font-size:18px;
z-index:700;
text-indent:-5000px;
background: #fff url(images/tc_closeBtn.png) center center no-repeat;
border:8px solid #fff;
}
/*.exB_closeButton:hover{
background-position: 0 -33px;
}*/
body .exB_lv1 .exB_lv2 .flash-replaced{
background:none;
}
#exB_lv3{
position:relative;
overflow:hidden;
background: #fff url(images/adultsOnly.jpg) center center no-repeat;
}
#exB_lv3 img{
width:100%;	
}

.exB_lv2 .arrow-left, .exB_lv2 .arrow-right{
position:absolute;
top:0;
width:44px;
height:100%;
z-index: 699;
opacity:0;
cursor:pointer;
}
.exB_lv2 .arrow-left:hover, .exB_lv2 .arrow-right:hover{
opacity:1;	
}
.exB_lv2 .arrow-left{
left:-44px;
background:#fff url(images/artbox_leftarrow.png) center center no-repeat;
}.exB_lv2 .arrow-right{
right:-44px;
background:#fff url(images/artbox_rightarrow.png) center center no-repeat;		
}
.exB_lv2 .caption{
position:absolute;
width:100%;
background: rgba(255,255,255,1);
color:#000;
padding:10px 0;	
opacity:0;
bottom:0;
font-size:24px;
font-family: 'Open Sans', sans-serif;
font-weight:100;
color:#60686e;
}
.exB_lv2 .caption a, .exB_lv2 .caption strong{
font-weight:bold;
color:#1a7412;	
}
.exB_lv2 .caption em{
font-weight:bold;
color:#229dfc;	
font-style:normal;
}
#exB_lv3:hover .caption{
opacity:1;
}