@charset "UTF-8"; 
@import url("/Bilder/qbullets/qbullets.css");
/**
 *	Christoph Päper <webdesign@crissov.de> <http://crissov.de>
 *	@media screen projection [tv handheld]
 *	url("http://crissov.de/screen.css")
 *	Stand: 2003-11-14
 */

/*
 *	Schriftfamilien
 *	Eher ein Test. da praktisch noch nirgends implementiert.
 */
@font-face
{
	font-family: unicode;
	src: local("Lucida Sans Unicode"), local("Arial Unicode MS"), local("TITUS Cyberbit Basic"), local("TITUS Cyberbit"), local("Bitstream Cyberbit");
}

/*
 *	Generell
 */
html
{
	margin:           0;
	padding:          0;
	background-color:               maroon;
	color:                          #111;
}
body
{
	margin:           2em;
		/*Mit den vorher verwendeten Prozentangaben hat der IE Probleme: wird ein Link erstmalig gehovert, kommt es zu einer Neuberechnung scheinbar mit anderem Ergebnis, wodurch der gesamte Text springt. Deswegen pauschal '%' durch 'em' ohne Werteänderung ersetzt.*/
	border:           0.1em  solid  black;
	padding:          0 2em 2em 2em;
	line-height:      1.5;
	font:             100.1%  "Trebuchet MS", "Minion Web", sans-serif;
		/*IE hat ohne 100% Probleme mit dem Skalieren von 'em'-Angaben; Opera 6 zieht bei 100% ein zusätzliche Pixel ab.*/
	font-size-adjust: 0.53;
		/*0,53 ist der von mir ermittelte Wert für Trebuchet MS, während es im Beispiel der CSS-Spec als 0,47 angegeben wird.*/
	background-color:               white;
	color:                          #111;
}

/*
 *	Blocklevel, Absätze
 */
p, blockquote
{
	max-width:        100ex;
		/*Das sollte in der Praxis nur bei unvernünftig breit eingestellten Browserfenstern greifen. Im IE funktioniert es sowieso nicht.*/
}
p, blockquote, address, dl, ol, ul, pre
{
	margin:           1em;
	padding:          0.2em;
}
blockquote, pre
{
	border-left:      0.5em  solid;
		/*Die Farben werden weiter unten angegeben, da verschieden.*/
	margin-left:      1.3em;
}
blockquote
{
	border-color:                   #CCC;
}
blockquote p
{
	margin-top:       0;
	margin-bottom:    0;
}

/*
 *	Hervorhebungen (müssen verbessert werden.)
 */
em
{
	font-weight:             inherit;
	font-style:              inherit;
	background-color:               white;
	color:                          maroon;
}
strong, em em
{
	font-weight:             bolder;
	font-style:              inherit;
	background-color:               white;
	color:                          brown;
}
h1 em, h2 em, h3 em, h4 em, h5 em, h6 em,
h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong
{
	color:                          silver
}

/*
 *	Beispiele und Codeschnippsel
 */
.samp
{
	font-family:             unicode, sans-serif;
}
pre
{
	border-color:                   navy;
	white-space:             pre-wrap;
		/*CSS 2.1 & 3. Opera 6 unterstützt '-pre-wrap', Version 7 benennt es korrekterweise in '-o-pre-wrap' um.*/
	font-family:             monospace;
}
code
{
	color:                          navy;
	font-family:             monospace;
}
h1 code, h2 code, h3 code, h4 code, h5 code, h6 code, caption code
{
	background-color:               white;
}
/*	code-Farben sind verbesserungswürdig. */
code.html
{
	background-color:               #CEF;
}
code.css
{
	background-color:               #FDC;
}
code.c
{
	background-color:               #DFE;
}
code.js
{
	background-color:               #CFD;
}
samp
{
	border:           thin   dotted maroon;
	padding-left:     0.2em;
	padding-right:    0.2em;
	font-size:        1em;
	font-family:             inherit;
	background-color:               #FFD;
	color:                          maroon;
}
var
{
	font-style:              normal;
	color:                          green;
	white-space:             nowrap;
		/*Offiziell ist 'white-space' nur für Blcklevelelemente gültig, ab CSS 2.1 allerdings nicht mehr.*/
}
kbd
{
	background-color:               #EEE;
	color:                          black;
	border:           medium outset gray;
}

/*
 *	Abkürzungen
 *	Für mich sind im Deutschen Abkürzungen, die man i.d.R. ohne Punkt schreibt Initialworte und Initialworte, die man als ein Wort ausspricht Akronyme und zeichne beide mit dem HTML-Element 'acronym' aus. Für @media aural sollte man verschiedene Styles benutzen.
 */
acronym
{
	font-size:        95%;
}
abbr
{
	word-spacing:    -0.33ex;
	white-space:             nowrap;
}
@media screen {abbr[title], acronym[title]
{
	cursor:                  help;
}}

/*
 *	Produkt- und Personennamen
 */
cite, cite.person, cite.name
{
	font-style:              normal;
	font-variant:            small-caps;
	font-stretch:            narrower;
	letter-spacing:   0.1ex;
}
cite.tm, cite.reg, cite.copy
{
	font-style:              italic;
	font-variant:            normal;
	letter-spacing:   0;
}
cite.tm:after     {content: "™"}
cite.reg:after    {content: "®"}
cite.copy:after   {content: "©"}

/*
 *	Kontakt-Footer
 */
address, address+p
{
	border:           0.1em  solid  maroon;
	margin-right:    -2.1em;
	margin-left:     -2.1em;
	text-align:              center;
	background-color:               maroon;
	color:                          white;
}
address
{
	padding-top:      1.8em;
	border-top-color:               black;
	margin-top:       2em;
	margin-bottom:   -1.0em;
}
address+p
{
	max-width: 120%;
	margin-bottom:   -2.1em;
}
img
{
	vertical-align:          text-bottom;
}

/*
 *	Listen
 */
dl, ol, ul
{
	border:           thin   inset  #CCC;
}
li    {margin-left:   2em; padding-left: 0.5em;}
	/*Somit sollte es in allen Browser etwa gleich aussehen. url("http://www.subotnik.net/style/list-box-test.html")*/
dt    {margin-left:   0;   padding-left: 0.5em;}
dd    {margin-left:   4em; padding-left: 0.5em;}
dl dl {margin-left:   0;}
li dl {margin-left:  -1em;}
ul    {list-style-type:      square;}

/*
 *	Tabellen
 */
table
{
	margin:           2em auto;
	border:           thin   solid  black;
	border-collapse:         collapse;
	empty-cells:             show;
	background-color:               white;
	color:                          black;
}
tbody, thead, tfoot
{
	border:           thin   solid  black;
}
caption                                         /*verbesserungswürdig*/
{
	width:            100%;
	font-size:        1.4em;
		/*vgl. h4*/
	text-align:              left;
}
thead, th
{
	font-weight:             bold;
	text-align:              center;
	background-color:               silver;
}
th
{
	border:           thin   solid  black;
	border-width:     0 thin;
	padding:          0.1em 0.25em;
}
tbody th
{
	text-align:              left;
	vertical-align:          top;
}
td
{
	border:           thin   solid  black;
	border-width:     0 thin;
	padding:          0.1em 0.25em;
	text-align:              left;
	vertical-align:          top;
}
tbody tr:hover, tbody tr:hover>td, tbody tr:hover>th /*, col:hover*/
{
	background-color:               silver;
}

/*
 *	Überschriften
 */
h1, h2, h3, h4, h5, h6, caption
{
	border:           thin   solid  black;
	border-color:                   black maroon;
	padding:          0.7em 0 0.1em 0;
	line-height:      1.6;
	font-family:             Garamond, serif;
	font-weight:             bold;
	background-color:               maroon;
	color:                          white;
}
h1 {font-size:        2.00em; margin: 1.00em -1.05em 0.50em; border-width: 0.05em;}
h2 {font-size:        1.75em; margin: 1.14em -1.20em 0.57em; border-width: 0.06em;}
h3 {font-size:        1.50em; margin: 1.33em -1.40em 0.67em; border-width: 0.07em;}
h4 {font-size:        1.25em; margin: 1.60em -1.68em 0.80em; border-width: 0.08em;}
h5 {font-size:        1.10em; margin: 1.82em -1.90em 0.91em; border-width: 0.09em;}
h6 {font-size:        1.00em; margin: 2.00em -2.10em 1.00em; border-width: 0.10em;}
	/*	margin-left/-right <= -(margin[body]+border-width[body])/(font-size*font-size[body])
		 = (2em+0.1em)/(x*1.001) = -2.1em/1.001x;
		margin-top ~= 2rem; margin-bottom ~= 1rem;
		border-width = border-width[body]/(font-size*font-size[body]);
	*/

h1:first-child, h1+h2, h2+h3, h3+h4, h4+h5, h5+h6, div>map>h1
{
	margin-top:      /*-0.775em*/-1.1em;/*-border-width*/
	border-top-color:               maroon;
}

/*
 *	Zitate, automagische Anführungszeichen
 *
 *	Eigentlich sollten UAs das selbst machen, aber ohne Hilfe kann es lediglich MacIE5+ (angeblich).
 */
[lang|="de"]>*    {quotes: "»"  "«"  "›"  "‹"}
[lang ="de-de"]>* {quotes: "„"  "“"  "‚"  "‘"}
[lang|="de-ch"]>* {quotes: "«"  "»"  "‹"  "›"}
[lang|="fr"]>*    {quotes: "«\2009" "\2009»" "‹\2009" "\2009›"}	/*thin space*/
[lang|="en"]>*    {quotes: "“"  "”"  "‘"  "’"}
q:lang(de)        {quotes: "»"  "«"  "›"  "‹"}
q:lang(de-de)     {quotes: "„"  "“"  "‚"  "‘"}
q:lang(de-ch)     {quotes: "«"  "»"  "‹"  "›"}
q:lang(fr)        {quotes: "«\2009" "\2009»" "‹\2009" "\2009›"}
q:lang(en)        {quotes: "“"  "”"  "‘"  "’"}
q:before          {content:  open-quote}
q:after           {content: close-quote}
dfn:before        {content: "›"}
dfn:after         {content: "‹"}

/*
 *	Links
 *	Das meiste bleibt auf Benutzereinstellungen.
 */
a
{
	border:           thin   solid  white;
/*	border-color:                   transparent;
*/	background-color:               white;
}
a:hover
{
	border:           thin   solid  green;
	color:                          green;
}
a:active
{
	background-color:               green;
	color:                          white;
}
a img
{
	margin:           0;
	padding:          0;
	border:           thin   solid  white;
/*	border-color:                   transparent;
*/}
a:hover img
{
	border:           thin   solid  green;
	background-color:               green;
}
a.skipnav
{
	visibility:              hidden;
}
a.skipnav:hover
{
	visibility:              visible;
}

/*
 *	Behelfsmäßige Javascript-<link/>-Navigation
 *	url("http://webdesign.crissov.de/Scripting/link.js")
 */
h1
{
	clear:                   both;
}
#linknav
{
	background-color:               menu;
/*	float:                   left;*/
	clear:                   both;
	margin:           0;
	padding:          2px;
	border:           2px    groove;
}
#linknav a
{
	display:                 inline-block;
	height:           16px;
	border:           2px    groove;
	margin:           2px;
	padding:          0 4px;
	color:                          buttontext;
	background:                     buttonface;
	font:                    button;
	font-size:        12px;
	text-decoration:         none;
}
#linknav a:hover  {border-style: outset}
#linknav a:active {border-style:  inset}
#linknav img
{
	border:           0;
	vertical-align:          middle;
}
