/* **************************************************** */
/* **************************************************** */
/* *                                                  * */
/* * This is the CSS stylesheet for www.hyperhero.com * */
/* *                                                  * */
/* *     Please contact Hyperhero if you have         * */
/* *     any suggestions, questions or comments.      * */
/* *                                                  * */
/* **************************************************** */
/* **************************************************** */


/* ******************************** */
/*                                  */
/* GENERAL HYPERHERO STYLE STUFF:   */
/*                                  */
/* ******************************** */


/* BODY: */
body { color:#000000; background:#BBBBBB;  margin:0; padding:0; font-family:serif; font-size:1em; }


/* NAVIGATION BLOCK: */
.hyperhero-nav { position:absolute; top:0; display:block; float:left; word-wrap:break-word; padding:0; margin:0; margin-left:0.5em; margin-top:0.5em; }
.hyperhero-nav { width:15em; }
.hyperhero-nav h1 { display:none; }
.hyperhero-nav .hyperhero-portrait-link img { width:9em; height:9em; display:block; margin-left:auto; margin-right:auto; }
.hyperhero-nav p { display:block; text-align:center; font-weight:bold; font-size:2em; margin:0.5em 0; padding:0.1em; text-shadow:0 0 0.05em #000000; }
.hyperhero-nav ul, .hyperhero-nav li { display:inline; padding:0; list-style-type:none; }
.hyperhero-nav ul a { display:block; background:#FFFFFF; margin:0.2em 0; padding:0.1em; border-style:solid; border-width:0.2em; font-weight:bold; font-family:sans-serif; }
.hyperhero-nav ul ul a { margin-left:1.5em; }
.hyperhero-nav ul .hyperhero-page-start { margin-top:1.5em; }


/* LANGUAGE SELECTION BLOCK: */
.hyperhero-lang { display:block; text-align:right; margin:0; margin-right:0.5em; margin-top:0.5em; padding:0; }
.hyperhero-lang { margin-left:16em; min-width:16em; }
.hyperhero-lang ul, .hyperhero-lang li { display:inline; padding:0; list-style-type:none; }
.hyperhero-lang a { display:inline-block; background:#FFFFFF; margin:0; margin-right:1em; margin-bottom:0.5em; padding:0.1em; border-style:solid; border-width:0.2em; border-color:#000000; font-weight:bold; font-family:sans-serif; }
.hyperhero-lang a img { width:1.5em; height:1em; border-style:solid; border-width:0.1em; padding:0; margin:0; }


/* ARTICLE (=MAIN-CONTENT) BLOCK: */
.hyperhero-article { display:block; text-align:justify; padding:0.5em; margin:0.5em; margin-top:0; background-color:#FFFFFF; border-width:0.5em; border-style:solid; border-color:#000000; }
.hyperhero-article { margin-left:16em; min-width:16em; min-height:65em; }


/* FOOTER 1 BLOCK: */
.hyperhero-footer1 { display:block; text-align:center; margin:0.5em; padding:0; }
.hyperhero-footer1 { margin-left:16em; min-width:16em; }
.hyperhero-footer1 a { display:inline-block; background-color:#FFFFFF; margin:0.5em; padding:0.2em; }


/* FOOTER 2 BLOCK: (was for valid HTML and CSS icons) */
/* .hyperhero-footer2 { display:block; text-align:right; margin:0.5em; padding:0; } */
/* .hyperhero-footer2 { margin-left:16em; min-width:16em; } */
/* .hyperhero-footer2 a { display:inline-block; background-image:url(something.png); } */


/* STYLE FOR BASIC HTML TAGS: */
p { margin:0.8em 0; }
h1 { display:block; font-size:2em; margin-left:0; margin-right:0; margin-top:0; margin-bottom:0.8em; }


/* STYLE FOR IMAGES WHICH ARE NOT USED AS LINKS */
img { border-style:none; padding:0; margin:0; }


/* STYLE FOR TEXT- AND IMAGE-LINKS: */
a { text-decoration:underline; color:#0000ff; }
a img { border-style:solid; border-width:0.2em; padding:0.3em; margin:0; }
a:visited { color:#660099; }
a:hover, .hyperhero-nav ul a:hover,  a:hover img {color:#000000; background-color:#FFFF00; background-image:url(http://www.hyperhero.com/images/blink.gif); }
a:active, .hyperhero-nav ul a:active, a img:active { color:#ff0000; background-color:#ffffcc; background-image:none; }


/* RAINBOW COLOR (ESPECIALLY FOR THE NAME HYPERHERO) */
.hyperhero-rainbow { color:#FF8080; }
.hyperhero-rainbow span { color:#FFFF80; }
.hyperhero-rainbow span span { color:#80FF80; }
.hyperhero-rainbow span span span { color:#00FF80; }
.hyperhero-rainbow span span span span { color:#80FFFF; }
.hyperhero-rainbow span span span span span { color:#0080FF; }
.hyperhero-rainbow span span span span span span { color:#FF80C0; }
.hyperhero-rainbow span span span span span span span { color:#FF80FF; }
.hyperhero-rainbow span span span span span span span span { color:#FF0000; }
.hyperhero-rainbow span span span span span span span span span { color:#FFFF00; }


/* WRAPPING OF FLOATING IMAGES TO THEXT, SO THAT A "CLEAR" NEW LINE STARTS AFTER IT */
.hyperhero-image-wrapper { display:table-cell; }
.hyperhero-image-wrapper img.hyperhero-image-left { float:left; margin-right:0.5em; }
.hyperhero-image-wrapper img.hyperhero-image-right { float:right; margin-left:0.5em; }

/* ********************************* */
/*                                   */
/* LANGUAGE AND PAGE SPECIFIC STUFF: */
/*                                   */
/* ********************************* */


/* USE ROMAN NUMBERS IN LATIN LISTS */
ol:lang(la) { list-style-type:upper-roman; }


/* HIGHLIGHT THE CURRENT LANGUAGE: */
html[lang=en] .hyperhero-lang a[lang=en] ,
html[lang=de] .hyperhero-lang a[lang=de] ,
html[lang=la] .hyperhero-lang a[lang=la] { margin-bottom:0; border-bottom-width:0.7em; color:#000000; }


/* HIGHLIGHT THE CURRENT PAGE: */
.hyperhero-page-hello .hyperhero-page-hello ,
.hyperhero-page-faq .hyperhero-page-faq ,
.hyperhero-page-pictures .hyperhero-page-pictures ,
.hyperhero-page-insults .hyperhero-page-insults ,
.hyperhero-page-parts .hyperhero-page-parts ,
.hyperhero-page-deeds .hyperhero-page-deeds ,
.hyperhero-page-dinosaur .hyperhero-page-dinosaur ,
.hyperhero-page-apollo .hyperhero-page-apollo ,
.hyperhero-page-eclipse .hyperhero-page-eclipse ,
.hyperhero-page-ytwok .hyperhero-page-ytwok ,
.hyperhero-page-fire  .hyperhero-page-fire ,
.hyperhero-page-inventor  .hyperhero-page-inventor ,
.hyperhero-page-wheel  .hyperhero-page-wheel ,
.hyperhero-page-letter  .hyperhero-page-letter ,
.hyperhero-page-couch  .hyperhero-page-couch ,
.hyperhero-page-tribute  .hyperhero-page-tribute ,
.hyperhero-page-poem  .hyperhero-page-poem ,
.hyperhero-page-recipe  .hyperhero-page-recipe ,
.hyperhero-page-links  .hyperhero-page-links ,
.hyperhero-page-camp .hyperhero-page-camp ,
.hyperhero-page-tips .hyperhero-page-tips ,
.hyperhero-page-media .hyperhero-page-media ,
.hyperhero-page-riddle .hyperhero-page-riddle ,
.hyperhero-page-contact .hyperhero-page-contact ,
.hyperhero-page-thxform .hyperhero-page-thxform { margin-right:-0.5em; border-right-width:0.7em; color:#000000; }


/* SET PAGE-SPECIFIC BORDER-COLOR AND BACKGROUND-COLOR (usually2/3) (both for page itself and its box in navigation menu): */
/* start: */
.hyperhero-page-start ,
.hyperhero-page-start .hyperhero-lang a ,
.hyperhero-page-start .hyperhero-article { border-color:#AAAA88; }
.hyperhero-page-start .hyperhero-article { background-color:#FFFFCC; }
/* hello: */
.hyperhero-page-hello ,
.hyperhero-page-hello .hyperhero-lang a ,
.hyperhero-page-hello .hyperhero-article { border-color:#999999; }
.hyperhero-page-hello .hyperhero-article { background-color:#000000; }
/* faq: */
.hyperhero-page-faq ,
.hyperhero-page-faq .hyperhero-lang a ,
.hyperhero-page-faq .hyperhero-article { border-color:#994C00; }
.hyperhero-page-faq .hyperhero-article { background-color:#CC6600; }
/* pictures: */
.hyperhero-page-pictures ,
.hyperhero-page-pictures .hyperhero-lang a ,
.hyperhero-page-pictures .hyperhero-article { border-color:#26BF26; }
.hyperhero-page-pictures .hyperhero-article { background-color:#33FF33; }
/* insults: */
.hyperhero-page-insults ,
.hyperhero-page-insults .hyperhero-lang a ,
.hyperhero-page-insults .hyperhero-article { border-color:#AAAA66; }
.hyperhero-page-insults .hyperhero-article { background-color:#FFCC99; }
/* parts: */
.hyperhero-page-parts ,
.hyperhero-page-parts .hyperhero-lang a ,
.hyperhero-page-parts .hyperhero-article { border-color:#660000; }
.hyperhero-page-parts .hyperhero-article { background-color:#990000; }
/* deeds: */
.hyperhero-page-deeds ,
.hyperhero-page-deeds .hyperhero-lang a ,
.hyperhero-page-deeds .hyperhero-article { border-color:#AA8888; }
.hyperhero-page-deeds .hyperhero-article { background-color:#FFCCCC; }
/* dinosaur: */
.hyperhero-page-dinosaur ,
.hyperhero-page-dinosaur .hyperhero-lang a ,
.hyperhero-page-dinosaur .hyperhero-article { border-color:#000000; }
.hyperhero-page-dinosaur .hyperhero-article { background-color:#FFFFFF; }
/* apollo: */
.hyperhero-page-apollo ,
.hyperhero-page-apollo .hyperhero-lang a ,
.hyperhero-page-apollo .hyperhero-article { border-color:#AAAA66; }
.hyperhero-page-apollo .hyperhero-article { background-color:#FFFF99; }
/* eclipse: */
.hyperhero-page-eclipse ,
.hyperhero-page-eclipse .hyperhero-lang a ,
.hyperhero-page-eclipse .hyperhero-article { border-color:#888888; }
.hyperhero-page-eclipse .hyperhero-article { background-color:#CCCCCC; }
/* ytwok: */
.hyperhero-page-ytwok ,
.hyperhero-page-ytwok .hyperhero-lang a ,
.hyperhero-page-ytwok .hyperhero-article { border-color:#88AAAA; }
.hyperhero-page-ytwok .hyperhero-article { background-color:#CCFFFF; }
/* fire: */
.hyperhero-page-fire ,
.hyperhero-page-fire .hyperhero-lang a ,
.hyperhero-page-fire .hyperhero-article { border-color:#008800; }
.hyperhero-page-fire .hyperhero-article { background-color:#00CC00; }
/* inventor: */
.hyperhero-page-inventor ,
.hyperhero-page-inventor .hyperhero-lang a ,
.hyperhero-page-inventor .hyperhero-article { border-color:#7171AA; }
.hyperhero-page-inventor .hyperhero-article { background-color:#AAAAFF; }
/* wheel: */
.hyperhero-page-wheel ,
.hyperhero-page-wheel .hyperhero-lang a ,
.hyperhero-page-wheel .hyperhero-article { border-color:#666666; }
.hyperhero-page-wheel .hyperhero-article { background-color:#FFFFFF; }
/* letter: */
.hyperhero-page-letter ,
.hyperhero-page-letter .hyperhero-lang a ,
.hyperhero-page-letter .hyperhero-article { border-color:#663300; }
.hyperhero-page-letter .hyperhero-article { background-color:#E57200; }
/* couch: */
.hyperhero-page-couch ,
.hyperhero-page-couch .hyperhero-lang a ,
.hyperhero-page-couch .hyperhero-article { border-color:#AA66AA; }
.hyperhero-page-couch .hyperhero-article { background-color:#FF99FF; }
/* tribute: */
.hyperhero-page-tribute ,
.hyperhero-page-tribute .hyperhero-lang a ,
.hyperhero-page-tribute .hyperhero-article { border-color:#AA4400; }
.hyperhero-page-tribute .hyperhero-article { background-color:#FF6600; }
/* poem: */
.hyperhero-page-poem ,
.hyperhero-page-poem .hyperhero-lang a ,
.hyperhero-page-poem .hyperhero-article { border-color:#00AAAA; }
.hyperhero-page-poem .hyperhero-article { background-color:#00FFFF; }
/* recipe: */
.hyperhero-page-recipe ,
.hyperhero-page-recipe .hyperhero-lang a ,
.hyperhero-page-recipe .hyperhero-article { border-color:#AA8822; }
.hyperhero-page-recipe .hyperhero-article { background-color:#FFCC33; }
/* links: */
.hyperhero-page-links ,
.hyperhero-page-links .hyperhero-lang a ,
.hyperhero-page-links .hyperhero-article { border-color:#66AA66; }
.hyperhero-page-links .hyperhero-article { background-color:#99FF99; }
/* camp: */
.hyperhero-page-camp ,
.hyperhero-page-camp .hyperhero-lang a ,
.hyperhero-page-camp .hyperhero-article { border-color:#8888AA; }
.hyperhero-page-camp .hyperhero-article { background-color:#CCCCFF; }
/* tips: */
.hyperhero-page-tips ,
.hyperhero-page-tips .hyperhero-lang a ,
.hyperhero-page-tips .hyperhero-article { border-color:#AAAA00; }
.hyperhero-page-tips .hyperhero-article { background-color:#FFFF00; }
/* media: */
.hyperhero-page-media ,
.hyperhero-page-media .hyperhero-lang a ,
.hyperhero-page-media .hyperhero-article { border-color:#AAAA88; }
.hyperhero-page-media .hyperhero-article { background-color:#FFFFCC; }
/* riddle: */
.hyperhero-page-riddle ,
.hyperhero-page-riddle .hyperhero-lang a ,
.hyperhero-page-riddle .hyperhero-article { border-color:#00FFFF; }
.hyperhero-page-riddle .hyperhero-article { background-color:#FFFFFF; }
/* contact: */
.hyperhero-page-contact ,
.hyperhero-page-contact .hyperhero-lang a ,
.hyperhero-page-contact .hyperhero-article { border-color:#2A2A55; }
.hyperhero-page-contact .hyperhero-article { background-color:#408080; }
/* thxform: */
.hyperhero-page-thxform ,
.hyperhero-page-thxform .hyperhero-lang a ,
.hyperhero-page-thxform .hyperhero-article { border-color:#666600; }
.hyperhero-page-thxform .hyperhero-article { background-color:#999900; }
/* thxinsul: */
.hyperhero-page-thxinsul ,
.hyperhero-page-thxinsul .hyperhero-lang a ,
.hyperhero-page-thxinsul .hyperhero-article { border-color:#666600; }
.hyperhero-page-thxinsul .hyperhero-article { background-color:#999900; }


/* SET OTHER PAGE-SPECIFIC STUFF (like background-images etc.): */
/* start */
body.hyperhero-page-start .hyperhero-article,
body.hyperhero-page-start .hyperhero-footer1,
body.hyperhero-page-start .hyperhero-footer2 { margin-left:0.5em; }
body.hyperhero-page-start .hyperhero-article { margin-top:0.5em; }
body.hyperhero-page-start .hyperhero-article { min-height:0; }
body.hyperhero-page-start .hyperhero-article h1 { text-align:center; font-size:3em; }
body.hyperhero-page-start .hyperhero-article p img{ display:block; margin-left:auto; margin-right:auto; }
body.hyperhero-page-start .hyperhero-article ul { margin:1.5em 0; padding:0; display:table; margin-left:auto; margin-right:auto;  }
body.hyperhero-page-start .hyperhero-article ul li { list-style-type:none; font-size:2em; display:table-row; }
body.hyperhero-page-start .hyperhero-article ul li a { display:block; margin:0.3em; }
body.hyperhero-page-start .hyperhero-article ul li a img { border-style:solid; border-width:0.05em; padding:0; margin:0; vertical-align:middle; }
/* hello: */
body.hyperhero-page-hello .hyperhero-article { color:#FFFF00; }
body.hyperhero-page-hello .hyperhero-article div { font-size:2em; text-align:center; margin-bottom:0.4em; }
body.hyperhero-page-hello .hyperhero-article .hyperhero-rainbow { font-size:4em; text-align:center;}
body.hyperhero-page-hello .hyperhero-article h1 { border:medium double #FFFF00; margin:0.8em; padding:0.2em; }
/* faq: */
body.hyperhero-page-faq .hyperhero-article .hyperhero-question { font-weight:bold; }
body.hyperhero-page-faq .hyperhero-article .hyperhero-rainbow { font-weight:bold; }
body.hyperhero-page-faq .hyperhero-article .hyperhero-furter-question { margin-top:1.6em; }
/* images */
body.hyperhero-page-pictures .hyperhero-article a img { display:inline-block; margin:0.2em; }
/* parts: */
body.hyperhero-page-parts .hyperhero-article { color:#FFFF00; }
body.hyperhero-page-parts .hyperhero-article dd { color:#00FF00; }
body.hyperhero-page-parts .hyperhero-article dt { margin-top:1em; margin-bottom:0.3em; font-weight:bold; }
/* deeds: */
body.hyperhero-page-deeds .hyperhero-article h1 { text-align:center; }
body.hyperhero-page-deeds .hyperhero-article table { margin-left:auto; margin-right:auto; }
/* eclipse: */
body.hyperhero-page-eclipse .hyperhero-article h1 { text-align:center; }
body.hyperhero-page-eclipse .hyperhero-article h1 span { font-size:0.6em; }
body.hyperhero-page-eclipse .hyperhero-article p { column-count:2; word-wrap:break-word; }
body.hyperhero-page-eclipse .hyperhero-article p span { font-weight:bold; }
/* fire: */
body.hyperhero-page-fire .hyperhero-article h1 { text-align:center; color:#FF0000; }
body.hyperhero-page-fire .hyperhero-article img.hyperhero-overview-animation { display:block; margin-left:auto; margin-right:auto; }
/* wheel: */
.hyperhero-page-wheel .hyperhero-article { color:#990000; background-image:url(http://www.hyperhero.com/images/wheel.gif); text-shadow:0.1em 0.1em 0.15em #00FF00; font-weight:bold; }
/* letter: */
body.hyperhero-page-letter .hyperhero-article { color:#003300; }
body.hyperhero-page-letter .hyperhero-article p:first-line { color:#000055; font-weight:bold; }
body.hyperhero-page-letter .hyperhero-article p:first-letter { color:#000055; font-weight:bold; display:table; float:left; font-size:2em; }
/* poem: */
body.hyperhero-page-poem .hyperhero-article { font-family:cursive; }
/* camp: */
body.hyperhero-page-camp .hyperhero-article h1 { text-align:center; }
body.hyperhero-page-camp .hyperhero-article img.hyperhero-overview-animation { display:block; margin-left:auto; margin-right:auto; }
/* media: */
body.hyperhero-page-media .hyperhero-article blockquote { font-family:monospace; }
/* riddle: */
.hyperhero-page-riddle .hyperhero-article { background-image:url(http://www.hyperhero.com/images/question.gif); }
body.hyperhero-page-riddle .hyperhero-article p { font-weight:bold; }
body.hyperhero-page-riddle .hyperhero-article th { padding:0.15em; text-align:left; background-color:#FEFEFE; font-weight:normal; }
body.hyperhero-page-riddle .hyperhero-article td { padding:0.15em; text-align:center; }
body.hyperhero-page-riddle .hyperhero-article td.hyperhero-solotion-line { background-color:#FF0000; }
/* contact: */
body.hyperhero-page-contact .hyperhero-article .hyperhero-emh-na { display:none; }
body.hyperhero-page-contact .hyperhero-article .hyperhero-emh-ia { display:inline; font-weight:bold; }
body.hyperhero-page-contact .hyperhero-article .hyperhero-emh-nb { display:none;  font-weight:bold; }
body.hyperhero-page-contact .hyperhero-article .hyperhero-emh-ib { display:inline; font-weight:bold; }
body.hyperhero-page-contact .hyperhero-article .hyperhero-emh-nc { display:none; }
body.hyperhero-page-contact .hyperhero-article .hyperhero-emh-ic { display:inline; font-weight:bold; }
body.hyperhero-page-contact .hyperhero-article form { display:table-cell; border:0.2em solid #000000; background:#DDDDDD; padding:0.5em; font-weight:bold; padding-bottom:0; }
body.hyperhero-page-contact .hyperhero-article form div { display:block; padding:0; padding-bottom:0.5em; }
/* thxform: */
body.hyperhero-page-thxform .hyperhero-article .hyperhero-message { border-color:#000000; border-style:solid; border-width:0.15em; font-weight:bold; }
body.hyperhero-page-thxform .hyperhero-article .hyperhero-message div { font-family:monospace; margin:0.5em; }
/* thxinsul: */
body.hyperhero-page-thxinsul .hyperhero-article .hyperhero-shame-statement { color:#FF0000; background-color:#FFFF00; font-weight:bold; font-size:1.5em; }
body.hyperhero-page-thxinsul .hyperhero-article .hyperhero-message { border-color:#000000; border-style:solid; border-width:0.15em; font-weight:bold; }
body.hyperhero-page-thxinsul .hyperhero-article .hyperhero-message div { font-family:monospace; margin:0.5em; }


/* ******************************** */
/*                                  */
/* SPECIAL STYLE FOR PRINTING:      */
/*                                  */
/* ******************************** */


/* SPECIAL SETTINGS FOR PRINTING: */
@media print {
 * { color:#000000 ! important; background-color:#FFFFFF ! important; background-image:none ! important; border-color:#000000 ! important; text-shadow:none ! important; }
 :first-letter, :first-line { color:#000000 ! important; }
 .hyperhero-lang, .hyperhero-footer2, .hyperhero-nav { display:none ! important; }
 .hyperhero-article, .hyperhero-footer1 { margin:0 ! important; padding:0 ! important; border-style:none ! important; min-width:0 ! important; min-height:0 ! important; }
 .hyperhero-image-wrapper { display:block ! important; }
 .hyperhero-image-wrapper:after { content:" " ! important; display:block ! important; clear:both ! important; }
}


/* ******************************** */
/*                                  */
/* STUFF FOR TESTING:               */
/*                                  */
/* ******************************** */


/* USEFUL FOR TESTING:
.hyperhero-nav { background:green;}
.hyperhero-lang { background-color:red; }
.hyperhero-footer1 { background-color:red; }
.hyperhero-footer2 { background-color:yellow; }
*/


/* ******************************** */
/*                                  */
/*              END                 */
/*                                  */
/* ******************************** */