body {
    background-color: #EEEEEE;
    /*background-image: url("background.gif");*/
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center;
}

h3{
    text-decoration: underline;
    font-family: serif;
}	

/* 2026 WTF was this for? I think for my abandoned testing multiple screen resolutions
made spacing between lines too much
span{ display: inline-block; margin:1em; } 
.flip_H{ transform: scale(-1, 1); color:red; }
.flip_V{ transform: scale(1, -1); color:green; }
*/

#col2{ 
    width:48%; 
    float:left;  
    margin-left: 2%; 
    padding-bottom:10px; 
}

@media screen and (max-width: 540px) 
{
    #onecolnarrow{ 
        width:400px; 
        float:left;  
        margin-left:20px; 
        padding-top:20px; 
        padding-bottom:20px; 
    }	
}

@media screen and (min-width: 541px) and (max-width 780px)
{
    #onecolnarrow{ 
        width:600px; 
        float:left;  
        margin-left:30px; 
        padding-top:30px; 
        padding-bottom:30px; 
    }	
}

@media screen and (min-width: 781px) and (max-width 1200px)
{
    #onecolnarrow{ 
        width:900px; 
        float:left;  
        margin-left:40px; 
        padding-top:40px; 
        padding-bottom:40px; 
    }	
}


@media screen and (min-width: 1201px) and (max-width 1600px)
{
    #onecolnarrow{ 
        width:1000px; 
        float:left;  
        margin-left:40px; 
        padding-top:40px; 
        padding-bottom:40px; 
    }	
}

@media screen and (min-width: 1601px) and (max-width 1920)
{
    #onecolnarrow{ 
        width:1200px; 
        float:left;  
        margin-left:10px; 
        padding-top:50px; 
        padding-bottom:50px; 
    }	
}

@media screen and (min-width: 1921)
{
    #onecolnarrow{ 
        width:1500px; 
        float:left;  
        margin-left:60px; 
        padding-top:60px; 
        padding-bottom:60px; 
    }	
}

div.cellwidener {
    margin: 4px 15px 4px 15px;
}


#col3narrow{ 
    width:30%; 
    float:left;  
    margin-left: 3%; 
    padding-bottom:10px; 
    padding-top:40px; 
}

#col3{ 
    width:31%; 
    float:left;  
    margin-left: 2%; 
    padding-bottom:10px; 
}

#col3nav  { 
    width:25%; 
    float:left; 
    margin-left: 2%; 
    padding-bottom:10px;
}

#col3navDouble  { 
    width:55%; 
    float:left; 
    margin-left: 2%; 
    padding-bottom:10px;
}

#col4 { 
    width:23%; 
    float:left; 
    margin-left: 2%; 
    padding-bottom:10px; 
}

#one8th { 
    width:11%; 
    float:left; 
    margin-left: 2%; 
    padding-bottom:10px; 
    font-size: 13px;
}

#col4nav { 
    width:19%; 
    float:left; 
    margin-left: 2%; 
    padding-bottom:10px; 
}

#bootlist { 
    width:25%; 
    float:left; 
    margin-left: 2%; 
    padding-bottom:10px; 
}

#bootlist li {
    list-style-type: none;
}

img.hbpic1 {
    height:200px;
}

div.indent1 {
    margin-left: 1.4em;
}

div.feature_bottomnav {
    text-align: center;
}

ul.hbdatalinks {
    list-style: none;
    margin: 0;
    padding: 0;
    border: none;
    font-family: Helvetica, Sans-serif;
}

ul.hbdatalinks li {
    list-style-type: none;
    padding-top:    5px;
    padding-bottom: 5px;
}

ul.hbdatalinks a:link {
    color: #113399;
}

ul.hbdatalinks a:hover {
    color: black;
    background: #eeffee;
}

ul.hbdatalinks a:visited {
    color: #113399;
}

ul.hbdatalinks a:active {
    color: #113399;
}

.tpbrow{
    background-color: white;
    color: black;	
}

.treasuryrow{
    background-color: #ee6666;
    color: white;	
}
.treasuryrow a:link,
.treasuryrow a:visited
{
	color: #ffffff;
}


.topborder{		
	border-bottom: none;	
}

.noborder{		
	border-top: none;	
	border-bottom: none;
}


.storypage{
    margin: 0;
    margin-left: 8px;
    font-family: system-ui; 
    font-size: 14; 
}

.conanchrono{
    margin: 0;
    margin-left: 10px;    
    font-family: system-ui; 
    font-size: 14; 
}

.reprint{
    margin: 0;
    margin-left: 10px;
    margin-top: 5px;
    font-family: system-ui; 
    font-size: 14; 
}

.section0{    
    font-size: 8;    
}

.section1{
    font-weight: bold;
    font-size: 18;    
}

.section6{
    font-family: "Lucida Console", Monospace;   
    font-size: 20;    
}

.treasury9{
    background-color: #ee6666;
    color: white;	
}
.treasury9 a:link,
.treasury9 a:visited
{
	color: #ffffff;
}

.magazine1{
    background-color: #d0f4de;
    color: black;	
}

.magazine2{
    background-color: #a9def9;
    color: black;	
}

.reprintrules{
    background-color: #fff2a8;
    color: #222266;
    margin-top: 6px;
    padding: 6px;
    font-family: Sans-serif;
    font-size: 14px;
}

.comic3{
    background-color: #fffce1;
    color: #11289d;
}

.comic6{
    background-color: #f0e9cf;
    color: black;	
}

.comic4{
    background-color: #f4d9bd;
    color: black;	
}

.comic1{
    background-color: #ffe590;
    color: black;
}

.comic2{
    background-color: #ffffbf;
    color: black;
}

.magazine3{
    background-color: #ddbea9;
    color: black;	
}

.magazine4{
    background-color: #bc987e;
    color: black;	
}

.Imagecomic1{
    background-color: #f9f9a5;
    color: black;	
}

.Imagecomic2{
    background-color: #decaff;
    color: black;	
}

.DarkHorsecomic1{
    background-color: #f9f9a5;
    color: black;	
}

.DarkHorsecomic2{
    background-color: #decaff;
    color: black;	
}

.PacificComicscomic1{
    background-color: #f9f9a5;
    color: black;	
}

.PacificComicscomic2{
    background-color: #decaff;
    color: black;	
}

.Eclipsecomic1{
    background-color: #f9f9a5;
    color: black;	
}

.Eclipsecomic2{
    background-color: #decaff;
    color: black;	
}

.IDWcomic1{
    background-color: #f9f9a5;
    color: black;	
}

.IDWcomic2{
    background-color: #decaff;
    color: black;	
}

.Wildstormcomic1{
    background-color: #f9f9a5;
    color: black;	
}

.Wildstormcomic2{
    background-color: #decaff;
    color: black;	
}

.xxxDCcomic1{
    background-color: #dedcfc;
    color: black;	
}

.xxxDCcomic2{
    background-color: #f0f4ff;
    color: black;	
}

.xxxMarvelcomic1{
    background-color: #dafcda;
    color: black;	
}

.xxxMarvelcomic2{
    background-color: #f5ffee;
    color: black;	
}

.DCcomic1{
    background-color: #f9f9a5;
    color: black;	
}

.DCcomic2{
    background-color: #decaff;
    color: black;	
}

.Marvelcomic1{
    background-color: #f9f9a5;
    color: black;	
}

.Marvelcomic2{
    background-color: #decaff;
    color: black;	
}

.Epiccomic1{
    background-color: #f9f9a5;
    color: black;	
}

.Epiccomic2{
    background-color: #decaff;
    color: black;	
}

.ECcomic1{
    background-color: #f9f9a5;
    color: black;	
}

.ECcomic2{
    background-color: #decaff;
    color: black;	
}

.variouscomic1{
    background-color: #f9f9a5;
    color: black;	
}

.variouscomic2{
    background-color: #decaff;
    color: black;	
}

.Rebellioncomic1{
    background-color: #f9f9a5;
    color: black;	
}

.Rebellioncomic2{
    background-color: #decaff;
    color: black;	
}

.mag1{
    background-color: #ffe590;
    color: black;
}

.mag2{
    background-color: #ffffbf;
    color: black;
}

.marvel1{
    background-color: #deb887;
    color: black;
}

.marvel2{
    background-color: #bc987e;
    color: black;
}

.darkhorse1{
    background-color: #7fffd4;
    color: black;
}

.darkhorse2{
    background-color: #40e0d0;
    color: black;
}

.cimmerean1{
    background-color: #565688;
    color: white;
}

.cimmerean2{
    background-color: #708095;
    color: white;
}

.codeheading{
    font-size: 18px;
    font-weight: bold;
}

.hbline{
    margin-top: 7px;
    margin-bottom: 7px;
}

.code{
    background-color: #f9fdf4;
    color: #121212; 
    font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", "Liberation Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
    font-size: 16px;
    padding: 3px;
}

.codeblock{
    background-color: #f9fdf4;
    color: #121212; 
    font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", "Liberation Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
    padding: 15px;
    font-size: 16px;
}

.codeinaction{
    background-color: #fdf2f7;
    padding-top: 10px;
    padding-left: 18px;
    padding-bottom: 10px;
}
.codenotes{
    margin-left: 30px;
    margin-top: 11px;
    padding-left: 12px;
    padding-top: 4px;
    padding-bottom: 4px;
    background-color: #fafaff;
    font-size: 16px;
}

.hbindent{
    margin-left: 25px;
}

.hbindent2{
    margin-left: 50px;
}


.attention{
    font-family: Helvetica, Sans-serif;
    color: red;
}

.T1R1{
    background-color: ddffdd;
}

.T1R2{
    background-color: eeffee;
}

.T2R1{
    background-color: e0e0ff;
}

.T2R2{
    background-color: f0f0ff;
}

#subsection{
    font-family: Helvetica, Sans-serif;
    color: red;
    font-size: larger;
    margin-top: 45px;
}

#comment{
    font-style: oblique;
}

#prompt{
    color: blue;
    font-family: monospace;
}

#input{
    font-family: monospace;
}

/*   TOOLTIP   */
a.tooltip {
    position:relative;
    cursor:help;
}
a.tooltip span {
    display:none;
    position:absolute;
    top:1.5em;
    left:0;
    width:15em;
    padding:0 2px;
}
a.tooltip:hover {
    display:inline;
}
a.tooltip:hover span {
    display:block;
    border:1px solid gray;
    background-color:white;
}

/*a span {display: none;}
a:hover {background-color: #dbe4f2;}
a {position: relative;}
a:hover span{
    position: absolute;
    top: 30px;
    left: -11px;
    display: block;
    background: #fdd;
    border: 1px solid red;
    text-decoration: none;
    padding: 5px
    margin: 10px;
}*/

div.summary{
    margin-left: 10px;
    padding-top: 2px;
    font-family: Sans-serif;
}

div.mod{
    background: rgb(244,244,255);
    padding: 15px;
}

span.mod2{
    background: rgb(244,244,255);
}

span.hblabel-med{
    color: rgb(0,70,0); 
    font-weight: bold;
}

span.hblabel-big{
    color: rgb(0,0,100); 
    font-weight: bold;
    font-size: 1.3em;
}

.punctuation{
    font-size: 1.0em;
    font-weight: bold;
}

#vertsurfbar {
/*width: 12em;*/
width: 16%;
float: left;
margin-left: 2% 
border-right: 1px solid #000;
padding: 0 0 1em 0;
/*padding: 10px*/
margin-bottom: 1em;
font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif;
background-color: #90bade;
color: #333;
}

#vertsurfbar ul {
list-style: none;
margin: 0;
padding: 0;
border: none;
}

#vertsurfbar li {
border-bottom: 1px solid #90bade;
margin: 0;
}

#vertsurfbar li a {
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 10px solid #1958b7;
border-right: 10px solid #508fc4;
background-color: #2175bc;
color: #fff;
text-decoration: none;
width: 80%;
}

html.body #vertsurfbar li a {
width: auto;
}

#vertsurfbar li a:hover {
border-left: 10px solid #1c64d1;
border-right: 10px solid #5ba3e0;
background-color: #2586d7;
color: #fff;
}

div#navbar {
    height: 30px;
    width: 100%;
    clear: both;
    border-top: solid #000 1px;
    border-bottom: solid #000 1px;
    background-color: #336699;
}
div#navbar ul {
    margin: 0px;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    color: #FFF;
    line-height: 30px;
    white-space: nowrap;
}
div#navbar li {
    list-style-type: none;
    display: inline;
}
div#navbar li a {
    text-decoration: none;
    padding: 7px 10px;
    color: #FFF;
}
div#navbar li a:link {
    color: #FFF:
}
div#navbar li a:visited {
    /*color: #CCC;*/
    color: #FFF:
}
div#navbar li a:hover {
    font-weight: bold;
    color: #FFF;
    background-color: #3366FF;
}