html,body{
	height:100%; -moz-user-select:none; 
	-webkit-text-size-adjust:none; text-size-adjust:none;
	-webkit-user-select:none; user-select:none;
}
body { 
	background-color:#239DC5 !important;
	background-image: url("images/pat-2.svg");
    background-repeat: repeat;
    background-attachment: fixed;
    background-position: 0 0;
    
	overflow-x:hidden; overflow-y:auto;
	font:normal 16px/1.2 Arial, Verdana, sans-serif;
}


* { box-sizing:border-box; margin:0; padding:0; border:0; }
img { -webkit-touch-callout:none; }
h1 { font-size:1.5em; }
h2 { font-size:1.2em; }
h3 { font-size:1em; }

td { vertical-align:top; text-align:left; }
table { border-collapse:collapse; border-spacing:0; }
a { color:#F60; font-weight:700; text-decoration:none; }
a:hover { text-decoration:underline; }

.warning { 
	display:block; width:100%; height:40px; font-weight:700;
	background:#F00; color:#FFF; line-height:40px; text-align:center;
}
.hide { display:none; }
#header { position:relative; height:150px; overflow:hidden; text-indent:-200px; white-space:nowrap; }
.animate {
	cursor:pointer;
	animation-duration:1.0s;
    animation-timing-function:ease-in-out;
    animation-fill-mode:forwards;
    animation-iteration-count:1;
}
#mhs {
	display:block; position:absolute; top:0; left:10px;
	width:87%; height:150px; /*margin-left:10px;*/
	/*background:transparent url(images/header/mhs-2.svg) 0 0 no-repeat; background-size:100% 100%;*/
	animation-duration:.7s; 
}
#mhs svg { transform:translate(200px,0); }
#mhs svg .st1 {
	mix-blend-mode:multiply; fill:#000; 
	opacity:.5; filter: url(#f1);
}
@keyframes bounce {
    0%   { transform:scale(1,1) translateY(0); }
    10%  { transform:scale(1.05,.99) translateY(0); }
    30%  { transform:scale(.99,1.01) translateY(-2px);}
    50%  { transform:scale(1.01,.99) translateY(0); }
    58%  { transform:scale(1,1) translateY(-1px); }
    65%  { transform:scale(1,1) translateY(0);}
    100% { transform:scale(1,1) translateY(0);}
}
#rs {
	display:block; position:absolute; top:0; left:77%; width:216px; height:150px;
	overflow:hidden; /*background:transparent url(images/header/rs-1.svg) 0 0 no-repeat;*/
	animation-duration:.3s;
}
#rs svg { transform:translate(200px,0); }
#rs svg .st1 {
	mix-blend-mode:multiply; fill:#000; 
	opacity:.5; filter: url(#f1);
	transform:translate(-3,-3);
}
#rs svg .st5 { fill:#ffe300; }
#rs svg .st6 { fill:#fff; }
#rs svg .st8 { fill:#d9937a; }
@keyframes jittery {
    10% {transform: translate(-2px, -3px) scale(1.01, 1.01);}
    20% {transform: translate(3px, 2px) scale(.99, .99);}
    30% {transform: translate(-4px, -5px) scale(1.01, 1.01);}
    40% {transform: translate(2px, 3px) scale(1, 1);}
    50% {transform: translate(-1px, -2px) scale(.98, .98);}
    60% {transform: translate(0px, 3px) scale(1.02, 1.02);}
    70% {transform: translate(-2px, -4px) scale(1, 1);}
    80% {transform: translate(3px, 5px) scale(.99, .99);}
    90% {transform: translate(-5px, -3px) scale(1.1, 1.1);}
    100% {transform: translate(0, 0) scale(1, 1);}
}
@keyframes idle { 100% {}}

#wrapper {
	width:100%; height:100%; max-width:1150px; margin:0 auto;
}
#intro { 
	padding:20px 20px 10px; max-width:1150px; min-height:200px; 
	letter-spacing:.03rem; background:#FEC;
}
#me_div {
	float:left;margin-right:10px;width:180px;height:180px; overflow:hidden;
	background:url(images/mhansen-180w.jpg);
}
#me { 
	width:100%; height:100%; animation-duration:.5s;
}
@keyframes imageFX {
    0%   { transform:translate(0,0); filter:hue-rotate(0deg); }
    10%  { transform:translate(2px,0); }
    30%  { transform:translate(1px,-1px); }
    50%  { transform:translate(-2px,2px); }
    58%  { transform:translate(0,0); }
    65%  { transform:translate(-3px,2px); }
    100% { transform:translate(0,0); filter:hue-rotate(30deg); }
}
#banner {
	width:100%; max-width:1150px; font-weight:700;
	background:#F00; color:#FFF; padding:8px;
	font-size:16px; line-height:16px; text-align:center;
}
#banner a { color:#FF0; }
.blinking-text {
	animation: blink 1s infinite; 
}
@keyframes blink {
	0% { color:#FFF; }
	40% { color:#FFF; }
	50% { color:#FCC; }
	60% { color:#FFF; }
	100% { color:#FFF; }
}
#content { padding:10px 0 0 10px; background:#fff;  min-height:100vh; }
#disclaimer {
	clear:both; padding-bottom:50px; margin:20px 30px;
	font-size:14px; text-align:center; color:#666;
}
#footer {
	position:fixed; bottom:0; width:100%; max-width:1150px; height:40px;
	background:#F90; box-shadow:0 2px 16px 0 rgba(0, 0, 0, .5);
	font-size:14px; line-height:30px; text-align:center; 
}
.flinks { 
	color:#fff; vertical-align:top; margin:5px;
	min-width:20px; height:20px; display:inline-block; line-height:20px; }
.social {
	background:url(images/socialbles-4.svg) no-repeat; background-size:66px 60px;
	width:66px; height:20px; display:inline-block; margin:5px 0;
}
.fbShare { background-position:0 -20px; }
.instagram { background-position:0 0; }
.youtube { background-position:0 -40px; }
.box { 
	width:460px; min-width:280px; height:280px; display:inline-block; overflow:hidden;
}
.box table { margin:10px; max-height:280px; }
.cover { 
	width:165px; height:256px; overflow:hidden; box-shadow:3px 3px 6px 0 rgba(0, 0, 0, .5);
	/*background:#ccc url(images/lo-res-covers-pg1.jpg) 0 0 no-repeat;*/
	background-size:660px 768px; /* set bkgd size separate */
}
.coverBI1 { background:#ccc url(images/lo-res-covers-pg1a.jpg) 0 0 no-repeat; }
.coverBI2 { background:#ccc url(images/lo-res-covers-pg1b.jpg) 0 0 no-repeat; }

/*.coverBI2 { 
	@supports (background-image: url(images/lo-res-covers-pg1b.webp)) {
		background-image: url(images/lo-res-covers-pg1b.webp);
	}
	@supports (background-image: url(images/lo-res-covers-pg1b.avif)) {
		background-image: url(images/lo-res-covers-pg1b.avif);
	}
}*/

.coverBI3 { background:#ccc url(images/lo-res-covers-pg2.jpg) 0 0 no-repeat; }
.cover img { width:165px; height:256px; }

.copyblock { padding-left:10px; }
.text-ellipsis {
  	display:-webkit-box; -webkit-line-clamp:13; -webkit-box-orient:vertical; -moz-box-orient:vertical; overflow:hidden;
	/*text-align: justify;
	text-justify: inter-word;*/
}
.text-hyphen { /* doesn't work in Chrome yet */
	word-wrap:break-word;
	overflow-wrap:break-word;
	-webkit-hyphens:auto;
	-moz-hyphens:auto;
	-ms-hyphens:auto;
}
.title { font-weight:700; }
.tbold { color:#f00; }
.subhead { font-style:italic; }
#request_download {
	position:absolute;top:150px; left:0; right:0; bottom:0;
	width:100%; height:100%; min-height:100vh;text-align:center;
}
/*added in javascript: .full_rs {  }*/
.request_text { padding:16px 0 20px; }
.error { width:100%;height:100%;text-align:center; }
/*.generator {
	margin:0 auto; text-align:center; width:275px; height:42px; cursor:pointer;
	background:url(images/download_btns-1.svg) no-repeat;background-size:100%;
}*/
#notrobot { background-position:0 0; }
#waiting { cursor:wait; background-position:0 -42px; }
#download { background-position:0 -84px; }
.download_btn {
	background:none; text-decoration:none; cursor:pointer;
	color:#F60; font-weight:700; font-size:16px;
}
.download_btn:hover { text-decoration:underline; }
#formx { display:none; }

.opacity40 { opacity:.4; }
#fadebkgd { position:fixed;top:0;left:0;width:100%;height:100%;background:#000;visibility:hidden;z-index:99;overflow:hidden; }
#dialog_container { 
	position:fixed; left:50%; top:50%;
	margin-left:-160px; margin-top:-250px; 
	width:320px; height:500px; 
	z-index:100; visibility:hidden;
	background:#fff; border-radius:16px;
	box-shadow:0 0 10px 10px rgba(0,0,0,.2);
}
#dialog_contents { padding:40px; letter-spacing:.03rem; }
#dialog_contents p { line-height:21px; padding-bottom:20px; color:#666; }
.btn {
	background:#f00; text-decoration:none; cursor:pointer;
	color:#fff; font-weight:700; font-size:16px; text-align:center;
	width:100%; height:40px; line-height:40px; border-radius:20px;
}
.btn:hover { text-decoration:underline; }
.disabled { pointer-events:none; }
.spacer { height:10px; width:100%; line-height:10px; }
.cancel { background:#fff; color:#000; border:#ccc 1px solid; }
.hdr { display:block; padding-bottom:10px; color:#000; font-weight:700; font-size:21px; }
#waitsvg { width:240px; height:40px; background:#ccc; border-radius:20px; overflow:hidden; }
#waitsvg svg rect {animation:fadeRight 9s linear forwards;}
@keyframes fadeRight {
	from {transform: scaleX(0)}
	to {transform: scaleX(1)}
} /* nix crop_object? */
.crop_object { width:100%; height:40px; border-radius:20px; overflow:hidden; }
.donate { text-align:center; padding-top:20px; padding-bottom:20px; color:#2087a9; font-weight:700; }
.donate_btns {
	width:112px; height:34px; cursor:pointer; box-shadow:2px 2px 6px 0 rgba(0, 0, 0, .5);
	background:url(images/paypal_crypto_btns.svg) no-repeat;
	text-decoration:none; border-radius:4px;
}
#paypal { background-position:0 0; }
#details {  }
#details_dialog {
	position:absolute; top:0; left:0; border-radius:16px;
	width:320px; height:500px; display:none;
	background:#fff; padding-top:30px; text-align:center;
}
#details_dialog p { text-align: justify; padding:10px 20px 0 20px; }
#close-btn {
    background:#fff url(images/paypal_crypto_btns.svg) -2px -75px no-repeat;
    position:absolute; top:10px; left:290px;
    width:20px; height:20px; cursor:pointer;
}
.copy-btn {
    background:transparent url(images/paypal_crypto_btns.svg) -24px -75px no-repeat;
    display:inline-block; width:16px; height:20px;
}
.qrcode { width:150px; height:150px; }
#footer_coin {
	font:normal 16px/1.2 Arial, Verdana, sans-serif;
	width:120px; height:24px; padding-left:8px;
	-webkit-appearance:none;
    -webkit-border-radius:0px;
    background:#ddd url(images/arrow.svg) 100% 0 no-repeat;
  	border:0; outline:1px solid #CCC;
  	margin-bottom:1em;
}
#copyaddr {
	background:#fff; width:150px; height:30px; 
	border-radius:5px; margin:0 auto; cursor:pointer;
}
#copyaddr p { vertical-align:top; line-height:30px; color:#F60; font-weight:700; }
#footer_address { font-size:.7em; height:30px; }
@media only screen and (min-width:961px) { .box { width: 33%; } #rs { left:81%; } }
@media only screen and (min-width:667px) and (max-width:960px) { .box { width: 49%; } #rs { left:79%; } }
@media only screen and (max-width:666px) { .box { width: 100%; } }

#more_comics { cursor:pointer; background:#fff; }
#more_comics svg { margin:10px; padding-right:20px; padding-bottom:10px; }
#more_comics svg use { transition: all 0.1s ease-in-out; }
#more_comics svg:hover .top { transform:translate(4px,4px); }
#more_comics svg:hover .shadow { opacity: 0.5; }
	
#rs_sticker table td { padding: 5px; text-align: center; }