@charset 'utf-8';

/*
GENERAL LAYOUT STYLE SHEET  J-A-B.NET

________________________________________________________________________________
author: Jens Brueckmann
        http://www.j-a-b.net/

      created: 2004-05-15
last modified: 2009-12-04
________________________________________________________________________________
This CSS may contain some selectors and attributes from CSS3 which are not yet advanced
beyond Working Draft or Candidate Recommendation and should therefore be regarded 
as experimental.
________________________________________________________________________________
Validation:
http://jigsaw.w3.org/css-validator/validator?uri=http://www.j-a-b.net/css/general.css.php&warning=2&profile=css3&usermedium=all
________________________________________________________________________________
This style sheet is published under a Creative Commons License. For more information 
about this license visit http://creativecommons.org/licenses/by-sa/2.0/
________________________________________________________________________________
Comments are welcome :-) Use contact form or mail me at jens[at]j-a-b.net
________________________________________________________________________________
*/

/*__ DEFAULT ELEMENTS __*/



* {
	padding: 0;
	border: 0;
	margin: 0;
	color: #000;
	font-size-adjust: 0.55 !important;
	font-family: 'Arial Unicode MS', Arial, 'Lucida Sans Unicode', Lucida, Tahoma, Helvetica, Verdana, sans-serif;

	}

html, body {
	width: 100%;
	height: auto;
	}

body {
	background: #f8f8f8;
	font-size: 90%;
	line-height: 1.5em;
	}

table, caption, th, td, h1, h2, h3, h4, h5, h6, div, p, blockquote, a, span {
	font-size: 1em;
	}

pre, code, kbd, tt, input, textarea, select, optgroup, option {
	/* white-space: pre; */
	font-family: 'Lucida Console', 'Lucida Sans Typewriter Regular', 'Courier New', Courier, monospace;
	font-size: 1em;
	letter-spacing: 0;
	}

br {
	display: block;
	}


body {
	background: #f8f8f8 url(../graf/bg/fabric-i.png) repeat;
	}

img[longdesc]:hover {
	cursor: help;
	}

/*__ anchors _________________________________________________________________*/



a {
	background: transparent;
	text-decoration: none;
	}

a:link {
	color: #33b;
	}

a:visited {
	color: #434d57;
	font-style: italic;
	}

a:visited::after {
	margin-left: 0.5em;
	margin-right: 0.5em;
	content : "\002713";
	}

a:active, a:hover, a:focus {
	color: #c36;
	text-decoration: underline;
	}

a code {
	color: inherit;
	text-decoration: inherit;
	}


/*__ VISIBLE ANCHORS _________________________________________________________*/

.PageRefA::after,
.PageRefB::before,
h2[id]::after,
h3[id]::after,
h4[id]::after,
h5[id]::after,
h6[id]::after,
p[id]::before,
p.mainText[id]::after,
ol[id]::before,
ul[id]::before,
dt[id]::before,
dt[id].subHead::after,
#linkList dt[id]::after,
#siteLog dt[id]::after,
dl#cssTests dt[id]::after,
form[id]::after,
table[id]::after {
	padding: 0 1em;
	text-align: left;
	vertical-align: 10%;
	background: inherit;
	color: #666;
	font-size: 13px;
	font-weight: normal;
	font-variant: normal;
	content: '\203B  link: #' attr(id);
	}

form[id]::after,
table[id]::after {
	display: table-caption !important;
	caption-side: top;
	}

#unicodeRanges::after, 
#customRanges::after {
	margin-left: 1em;
	}

p.mainText[id]::before,
.noAddOn::before,
.noAddOn::after,
.noAddOn:visited::after,
.noAddAll a::before,
.noAddAll a::after,
.noAddAll a:visited::after,
dt.subHead::before,
#note::before {
	display: none;
	}

a[href*='contact']:visited::after {
	display: none !important;
	}

a[hreflang]::before {
	margin: 0 0.5em;
	vertical-align: -5%;
	}

* a[hreflang='x-de_en']::before {
	display: inline;
	content: url(../graf/bul/de_en);
	}

* a[hreflang='en']::before {
	display: inline;
	content: url(../graf/bul/en);
	}

* a[hreflang='de']::before {
	display: inline;
	content: url(../graf/bul/de);
	}

a[rel='license']::before {
	margin: 0;
	content: '';
	}

/*__ block ___________________________________________________________________*/

h1, h2, h3, h4 {
	clear: both;
	font-weight: bold;
	line-height: 2em;
	}

h1, h2 {
	text-align: center;
	}

h2[id], h3, h4 {
	text-align: left;
	}

h1 {
	margin: 0 0 2em;
	font-size: 2.2em;
	}

h2, h3, h4 {
	margin-top: 2.5em;
	margin-bottom: 0.75em;
	}

h2 {
	margin-left: 16%;
	margin-right: 18%;
	font-size: 1.5em;
	}

h2[id] {
	margin: 2.5em 0 0.75em;
	}

h3 {
	font-size: 1.35em;
	}

h4 {
	font-size: 1.2em;
	}

h5 {
	font-size: 1.1em;
	}

/*__ table ___________________________________________________________________*/

table {
	clear: both;
	table-layout: fixed;
	width: 100%;
	border: 1px solid #999;
	border-collapse: collapse;
	margin: 2.5em auto;
	background: #fff;
	}

caption {
	caption-side: top;
	padding: 0.5em;
	margin: 2em auto 0;
	font-size: 1.2em;
	font-weight: bold;
	}

th {
	background: #d0d0d0;
	}

.topHead {
	background: #d0d0d0 !important;
	text-align: center !important;
	}

/*__ forms ___________________________________________________________________*/

legend {
	padding: 0 1em;
	margin: auto;
	}

input, select {
	height: 2em;
	border: 1px solid #999;
	margin: 0.8em 0.6em;
	background: f8f8f8;
	vertical-align: middle;
	}

optgroup {
	padding: 0.2em;
	background: #bdc6bd;
	text-align: right;
	}

option {
	padding: 0.2em 0.5em;
	background: #f8f8f8;
	text-align: left;
	}

.alternate {
	background: #e0e0e0;
	color: #000;
	}



input[type='text'] {
	padding: 0.1em;
	border: 1px inset #fff;
	background: #e4e4d8;
	color: #000;
	vertical-align: middle;
	}

input[type='radio'],
input[type='checkbox'] {   
	width: 1em; 
	height: 1em;
	vertical-align: middle;
	background: transparent;
	color: #000;
	}

input[type='checkbox'] {
	border: 1px solid #666;
	}

input[type='radio'] {
	border: 0;
	}

input[type='text']:focus, 
input[type='radio']:focus, 
input[type='checkbox']:focus,
textarea:focus {
	background: #fff;
	}

textarea {
	padding: 0.5em;
	border: 1px inset #eee;
	background: #e4e4d8;
	}

input[type='button'],
input[type='submit'],
input[type='reset'] {
	font-size: 0px !important;
	}

input[type='submit'] {
	background: url(../graf/but/send) no-repeat center center;
	color: #f8f8f8;
	}

input[type='reset'] {
	background: url(../graf/but/clear) no-repeat center center !important;
	color: #900;
	}

.reset {
	background: url(../graf/but/clear) no-repeat center center !important;
	color: #900;
	}

.calculate {
	background: url(../graf/but/calc) no-repeat center center;
	color: #e0e0e0;
	}

.button {
	width: 34px !important;
	height: 34px !important;
	margin: 0.2em auto;
	border: 1px solid #ccc;
	vertical-align: middle !important;
	cursor: pointer !important;
	}


/*__ lists ___________________________________________________________________*/

ul {
	list-style: none;
	line-height: 1.5;
	}

ol {
	margin: 0 1em 1em;
	list-style-position: outside;
	}

dt {
	font-weight: bold;
	}

dd {
	margin-bottom: 1em;
	}

/*__ semantics _______________________________________________________________*/

dfn {
	margin: auto 0.5em;
	font: bold 1em 'Palatino', 'Palatino Linotype', 'Goudy Old Style', 'Clarendon Light', Georgia, 'Times New Roman', Batang, 'MS Mincho', Modern, Roman, serif;
	}

em, cite, quote, q {
	margin-right: 0.4em;
	font-style: italic;
	}

quote, q {
	quotes:  '\201C' '\201D';
	}

abbr, acronym {
	padding: 0.1em;
	border: 1px dotted transparent;
	border-bottom: 1px dotted #666;
	cursor: help;
	}

abbr:hover, acronym:hover {
	border: 1px dotted #bbb;
	background: #eec;
	color: inherit;
	}

sup, sub {
	margin-left: 0.2em;
	font-size: 0.75em;
	line-height: 0.75em;
	}

sup {
	vertical-align: super;
	}

sub {
	vertical-align: sub;
	}

del {
	border-right: 1px dotted #b30;
	border-bottom: 1px dotted #b30;
	border-left: 1px dotted #b30;
	text-decoration: none;
	color: #999 !important;
	}

del * {
	text-decoration: none;
	color: #999 !important;
	}

del::before {
	padding: 0 0.5em;
	color: #b30;
	font-size: 1.2em;
	content: '\2326';
	}

del::after {
	padding: 0 0.5em;
	color: #b30;
	font-size: 1.2em;
	content: '\232B';
	}

ins {
	padding: 0 0.5em;
	border-right: 1px dotted #06c;
	border-bottom: 1px dotted #06c;
	border-left: 1px dotted #06c;
	text-decoration: none;
	}

ins::before {
	padding: 0 0.5em;
	color: #06c;
	font-size: 1.2em;
	content: '\2380';
	}

/*__ button graphics __*/

/*__ page text content __*/
p, *.mainText {
	clear: both;
	margin: 0 0 1em 0;
	font-size: 1em;
	}

dd p {
	margin: 0 0 1em 0;
	}

.mainText::first-letter {
	margin: 0em 0.1em 0em 0.25em;
	vertical-align: middle;
	font-size: 1.75em;
	font-weight: bold;
	text-transform: uppercase;
	}

*.subHead {
	clear: both;
	margin: 2em 0;
	text-align: left;
	font-size: 1.3em;
	font-variant: small-caps;
	}

*.subHead::first-letter {
	font-size: 1.2em;
	font-weight: bold;
	text-transform: uppercase;
	}

*.subHead+dl {
	width: 80%;
	padding: 1%;
	border: 0;
	margin: auto;
	}

h2.subHead {
	font-size: 1.5em;
	}

/*__ MISCELLANEOUS IN-PAGE ELEMENTS __________________________________________*/

/* navigation pics */
img.promptMisc {
	width: 14px;
	height: 14px;
	margin: 0 3px;
	vertical-align: middle !important;
	cursor: pointer;
	}

/* main logo size */
img.defaultLogo {
	width: 70px;
	height: 70px;
	}

/*__ two-column layout for images with description __*/

.twoColsLeft,
.twoColsRight {
	width: 40%;
	padding: 0;
	margin: 0 auto 2em;
	}

.twoColsLeft,
.twoColsLeft,
.twoColsRight dt,
.twoColsRight dd {
	padding: 0;
	margin: 0;
	}

.twoColsLeft {
	float: left;
	}

.twoColsRight {
	float: right;
	}

.twoColsLeft dt,
.twoColsRight dt {
	text-align: center;
	}

/*__ MISCELLANEOUS IN-PAGE SEMANTICS _________________________________________*/

/* footnote */
*.note {
	clear: both;
	margin: 2em 0 0 2em;
	font-size: 0.85em;
	font-weight: normal;
	}

ul.note {
	list-style: none !important;
	}

p#note, .memo {
	padding: 0.5em;
	border: 1px solid #c8c8c8;
	margin: 1em 0;
	background: #d8d8d8;
	color: #222;
	font-size: 0.85em;
	}

p#note * {
	background: #d8d8d8;
	color: #222;
	}

#note::first-line {
	text-decoration: overline;
	}

/*___ example codes ___*/

/* example code block */
.exampleCode {
	display: block;
	padding: 0.5em 1em;
	border: 1px solid #c8c8c8;
	margin: 2em auto;
	background: #f0f0f0;
	color: inherit;
	font-family: 'Lucida Console', 'Lucida Sans Typewriter Regular', 'Courier New', Courier, monospace;	}

.exampleCode::before {
	content: '';
	}

.exampleCode * {
	font-family: 'Lucida Console', 'Lucida Sans Typewriter Regular', 'Courier New', Courier, monospace;	}

/* entities */
*.entityCode {
	display: inline !important;
	margin: 0 0.1em !important;
	background: inherit;
	color: #008000 !important;
	font-family: inherit;
	font-weight: normal;
	font-style: italic;
	}

/* attributes */
*.attributeCode {
	background: transparent;
	color: #508 !important;
	font-family: inherit;
	font-weight: normal;
	}

/* attribute values */
*.valueCode {
	background: transparent;
	color: #075 !important;
	font-family: inherit;
	font-weight: normal;
	}

/* selectors and functions */
*.functionCode {
	background: transparent;
	color: #000080 !important;
	font-family: inherit;
	font-weight: bold;
	}

/* red text for e.g. errors */
.alert {
	background: transparent;
	color: #c00;
	}

/* highlighted text passages (orange bold) */
.highlight {
	background: #fe3;
	color: #000;
	}

/* hidden Texts */

.hiddenContext {
	display: none !important;
	}

.reOrder {
	clear: both !important;
	}

/*__ GENERAL PAGE LAYOUT _____________________________________________________*/

/*__ header and footer _______________________________________________________*/

ul.mainMenu {
	clear: both;
	width: 100%;
	height: 90px;
	background: #3f3f3a url(../graf/bg/mmenu_back) repeat-y;
	text-align: center;
	}

ul.mainMenu li {
	display: inline;
	padding: 0 1.5%;
	background: transparent;
	line-height: 90px;
	}

ul.mainMenu a, 
ul.mainMenu a:link, 
ul.mainMenu a:visited {
	background: transparent;
	color: #ffd;
	font-size: 1.1em;
	font-weight: bold;
	font-style: normal;
	font-variant: small-caps;
	letter-spacing: 0.05em;
	}

ul.mainMenu a:hover, 
ul.mainMenu a:active, 
ul.mainMenu a:focus {
	background: transparent;
	color: #ff6;
	text-decoration: none;
	}

/*__ page settings block _____________________________________________________*/

dl#settings {
	position: absolute;
	top: 90px;
	left: 1%;
	width: 13%;
	list-style: none;
	}

dl#settings dt {
	text-align: center;
	font-size: 0.75em;
	font-weight: normal;
	}

dl#settings dt#titleSettings {
	font-size: 1em;
	font-weight: bold;
	font-variant: small-caps;
	}

dl#settings dd {
	margin: 0;
	text-align: center;
	color: #000;
	}

dl#settings dd a {
	display: block;
	border: 1px solid #e0e0e0;
	color: #000;
	font-size: 0.75em;
	font-weight: bold;
	font-style: normal;
	text-decoration: none;
	}

dl#settings dd a:hover {
	border: 1px inset #eee;
	background: #fff;
	color: #000;
	font-size: 0.75em;
	font-weight: bold;
	text-decoration: none;
	}

dl#settings dd:first-child a,
dl#settings dd:first-child a:hover {
	border: 0;
	background: transparent;
	}

/* inactive javascript */
dl#settings div {
	border: 1px solid #336;
	background: #990;
	font-size: 0.8em;
	font-weight: bold;
	}

dl#settings div:hover {
	cursor: help;
	}

dl#settings div span {
	display: none;
	padding: 1em;
	text-align: left;
	background: #fff;
	font-size: 0.9em;
	font-weight: normal;
	line-height: 1.2em;
	white-space: normal !important;
	}

dl#settings div:hover span {
	display: block;
	}

dl#settings dd#settingLogo {
	margin: 1em auto;
	}

/*__ fixed arrows ____________________________________________________________*/
div#quickJump {
	width: 1px;
	height: 1px;
	}

div#quickJump a {
	position: fixed;
	bottom: 0;
	right: 0;
	display: block;
	width: 20px;
	height: 20px;
	}

div#quickJump a:first-child {
	top: 0;
	}

.quickJump {
	width: 20px;
	height: 20px;
	vertical-align: middle;
	}

/*__ page data block _________________________________________________________*/

p.pageData {
	padding: 0 1em 0 0;
	color: #666;
	text-align: right;
	font-size: 0.75em;
	font-weight: normal;
	line-height: 1.2em;
	}

p.pageData * {
	color: #666 !important; /* important rule for IE */
	font-style: normal;
	}

p.pageData a {
	text-decoration: underline;
	}

/*__ page listing header and footer __________________________________________*/

div#pageIndex {
	position: absolute;
	top: 200px;
	right: 2px;
	width: 14.7%;
	border: 1px solid #669;
	text-align: center;
	}

div#pageIndex h6 {
	background: #ccc;
	text-align: center;
	font-size: 1em;
	font-weight: bold;
	font-variant: small-caps;
	}

div#pageIndex:hover h6 {
	background: #990;
	}

ul#pageListTop {
	display: none;
	height: 100%;
	background: url(../graf/bg/semi_white);
	}

div#pageIndex:hover ul#pageListTop {
	display: block;
	}

ul#pageListTop li {
	display: block;
	height: 100%;
	border-top: 1px solid #e0e0e0;
	background: url(../graf/bg/semi_white);
	text-align: left;

	}

ul#pageListTop li a {
	height: 100%;
	padding: 0.2em;
	text-decoration: none !important;
	}

ul#pageListTop a, 
ul#pageListBottom a {
	display: block;
	color: #006;
	font-size: 0.75em;
	}


ul#pageListTop a:hover, 
ul#pageListBottom a:hover {
	background: #006;
	color: #ffd;
	}

dl#pageIndexBottom {
	clear: both;
	width: 68%;
	margin: 6em auto 1em;
	}

dl#pageIndexBottom dt {
	padding-left: 0.5em;
	background: #999;
	}

dl#pageIndexBottom dd {
	margin: 2px 0 0 0;
	}

ul#pageListBottom li {
	float: left;
	display: block;
	width: 50%;
	}

ul#pageListBottom li a {
	width: 96.5%;
	padding-left: 0.65em;
	margin: 1px auto;
	border: 1px solid #e0e0e0;
	text-decoration: none;
	}

a.currentPage {
	background: transparent;
	color: #646456 !important;
	font-weight: bold;
	text-decoration: none;
	}

/*__ validation ______________________________________________________________*/

hr#bottom {
	clear: both;
	visibility: hidden;
	width: 0;
	height: 0;
	}

ul#validation {
	clear: both;
	float: left;
	width: 80%;
	}

ul#validation li {
	float: left;
	margin: 35px 1em 0;
	list-style: none;
	font-size: 0.7em;
	}

ul#validation img {
	width: 80px;
	height: 15px;
	}

/*__ creative commons license ________________________________________________*/

dl#creativeCommons {
	float: right !important;
	width: 150px;
	/*height: 55px;*/
	margin: 0 0 1.3em 0;
	text-align: center;
	font-size: 9px;
	line-height: 11px;
	}

dl#creativeCommons dt img {
	width: 88px;
	height: 31px;
	}

/*__ main heading ____________________________________________________________*/

h1#pageTitle {
	clear: both;
	width: 70%;
	margin: 0 auto 1.5em;
	font-family: 'Arial Rounded MT Bold', Verdana, 'Arial Black', 'Arial Unicode MS', sans-serif;
	font-size: 1.5em;
	font-variant: small-caps;
	letter-spacing: 0.1em;
	line-height: 1.3em;
	}

h1#pageTitle::first-letter {
	vertical-align: bottom;
	color: #880;
	font-size: 2em;
	letter-spacing: 0.1em;
	}

/*__ body content ____________________________________________________________*/

div#top {
    background: url(../graf/bg/dew.jpg) no-repeat 100% 95%;
	}

div#pageBody {
	width: 66%;
	padding: 1em;
	border: 1px solid;
	border-color: #669 #f0f0f0 #f0f0f0 #669;
	margin: auto;
	background: #fff;
	}

div#pageContent {
	padding: 1em;
	min-height: 220px;
	border: 1px solid;
	border-color: #f0f0f0 #336 #336 #f0f0f0;
	margin: auto;
	background: #f8f8f8;
	}

/*__ LINK LISTINGS ___________________________________________________________*/

ul#linkSubjects {
	margin-bottom: 2em;
	}

ul#linkSubjects::before {
	display: none;
	}

ul#linkSubjects li {
	display: inline;
	}

ul#linkSubjects li::before {
	content: '\25A0  ';
	color: #336;
	}

dl#linkList {
	padding: 0 1em 1em;
	}

dl#linkList dt {
	padding: 0.2em;
	border: 1px solid #aaa;
	margin: 2em auto 1em;
	background: #ccc;
	font-size: 1.5em;
	}

#linkList dt[id]::before {
	display: none;
	}

dl#linkList dd {
	margin: 2em 0;
	}

dl#linkList dd h5 {
	display: inline;
	}

dl#linkList h5::before {
	vertical-align: -0.1em;
	font-size: 1.5em;
	font-weight: bold;
	content: '\2023  ';
	}

dl#linkList dd:hover h5::before {
	color: #f00;
	}

dl#linkList p,
dl#linkList blockquote {
	padding: 0.5em; 
	border: 1px solid #336;
	margin: 0.2em 0;
	background: #fff;
	color: #000;
	line-height: 0;
	}

dl#linkList p {
	font-size: 0.75em;
	line-height: 1.4em;
	}


dl#linkList blockquote p {
	display: inline;
	padding: 0;
	border: 0;
	margin: 0;
	}

dl#linkList blockquote::before {
	font-size: 1.2em;
	content: '\201C';
	}

dl#linkList blockquote::after {
	font-size: 1.2em;
	content: '\201D';
	}

dl#linkList dd.linkAbstract {
	padding: 0 1em;
	border-right: 1.2em solid #c0d0e0;
	border-left: 1.2em solid #c0d0e0;
	}

dl#linkList dd.linkAbstract::before {
	content: '';
	}

dl#linkList dd.linkAbstract p {
	margin: 0;
	border: 0;
	background: transparent;
	font-size: 1em;
	font-style: italic;
	}

dl#linkList dd a {
	display: block;
	margin-left: 2.5em;
	}

dl#linkList dd p a {
	display: inline;
	margin: 0;
	}

dl#linkList dd samp {
	margin: 0 0.5em;
	font-family: 'Lucida Console', 'Lucida Sans Typewriter Regular', 'Courier New', Courier, monospace;	letter-spacing: -0.05em;
	}

dl#linkList dd img {
	width: 88px;
	height: 31px;
	vertical-align: middle;
	}