/* 
"Ausführliche" Selektoren:
1 Regeln, die sich nur auf einzelne Seiten beziehen. Das Voranstellen von "body" erleichtert den Überblick.
2 Bei Klassen, die in verschiedenen Elementen eingesetzt werden. 
Beispiele: "pic" wird in a und table verwendet. "archive" in body und table. "li" in div und a. "author" in p und span. "formula" in img und span.
*/

@media all {

body,
.nozebra .even { background-color: rgb(255, 255, 244) }

.data thead th { background-color: rgb(222,222,222) }

.data tfoot th,
.data tfoot td,
.data tbody th.tbody-column-head { background-color: rgb(230,230,230) }

.data .even,
.submit { background-color: rgb(242,242,242) }

body .column-layout { background-image: url(/css/bilder/logo-linie.png) } /* 2. Selektorteil wg. EPUB-Skript*/

body .column-layout { background-repeat: repeat-x } /* 2. Selektorteil wg. EPUB-Skript*/

table { border-collapse: collapse }

.missing { border-color: red !important /*Damit der Selektor mit höherer Spezifität für border-color: gray überschrieben wird */ }

.toc,
.data th,
.data td,
.emphasized,
.announcement,
body.hohlspeiche .text,
img,
#search-field,
.search .submit,
#registration textarea,
#registration input { border-color: rgb(190,190,190) }

.data th,
.data td,
.missing,
.toc,
.emphasized,
.announcement,
body.hohlspeiche .text,
body.home table.pic.fr img,
body.editorial table.pic.fr img,
#search-field,
.search .submit,
#registration textarea,
#registration input { border-style:  solid }

fieldset,
img,
/*table.pic.fr img,
.logo-td img,
.data img,
img.formula,*/
body.registration #registration fieldset { border-style: none }

img,
.toc,
.emphasized,
.announcement,
.missing,
.data th,
.data td,
body.hohlspeiche .text,
#search-field,
.search .submit,
#registration textarea,
#registration input { border-width: 1px }

.data { caption-side: bottom }

div.li dt { clear: left; }

body { color: black }

a:link,.submit { color: rgb(222,16,16) /*rot*/ }

a:visited { color: /*rgb(200,155,112)rgb(207, 147, 88)*/rgb(153,0,0) /*dunkelrot*/ }

div.li dt:before { content: "[" }

div.li dt:after { content: "]" }

.publication-date:before,
.versions:before { content: " · " }

.submit { cursor: pointer }

.about img,
div.li img,
table.pic .missing /*Damit in FF die CSS-Regel für width und height bei fehlendem Bild umgesetzt wird */,
body.impressum h2,
body.error h2,
body.registration h2,
body.archive h2,
body.faq h2,
body.registration #registration label,
body.registration #registration legend,
body.registration #registration #submit { display: block }

h2,
.publication-date,
.versions { display: inline }

table { empty-cells: show }

.about img,
div.li img,
div.li dt,
body.registration #registration label { float: left } /* Margins beachten */

table.pic.fr { float: right } /* Margins beachten */

body { font-family: Verdana, sans-serif }

body.hohlspeiche .text { font-family: monospace }

sub,
sup,
table.pic td,
table.pic th, /* Damit relative Angaben, z.B. Padding, denselben Wert wie bei TD ergeben */
.data caption,
body.hohlspeiche .reference,
body.registration #registration div label span { font-size: 0.80em }
 body, dt, body.home .content strong [href^="/pdf/"], body.home .content strong [href^="/epub/"], body.home .content strong [href^="http://fz-print"] {
font-size: 0.85em
}

blockquote p,
.data.big td,
.toc * { font-size: 0.90em } /* Nur Kindelemente von blockquote und .toc kleiner, da sich der Außenabstand daraus ableitet. Er soll dem Außenabstand anderer Elemente mit Außenabstand 0.80em entsprechen */

div.li dt /* Weil keine Lösung zur Ausrichtung von dt und dd auf einer Linie bei kleinerer Schriftgröße von dt gefunden wurde*/,
body.impressum h3,
h2,
h5 { font-size: 1.00em }

h4,
.search .submit,
.search input,
body.registration #registration #submit,
body.error h3,
body.archive h3,
body.faq h3,
body.registration h3 { font-size: 1.20em }

h3,
body.impressum h2,
body.error h2,
body.registration h2,
body.archive h2,
body.faq h2,
body.home .content .actual strong,
body.home .content .alternatives strong { font-size: 1.70em }

h1 { font-size: 2.00em }

address,
.manifestations em,
p.author span,
.interview .answer,
body.hohlspeiche th.text,
body.letter-to-editor p.author { font-style: normal }

.publication-date,
.manifestations,
.subtitle,
.interview .question,
body.impressum .town,
body.letter-to-editor .reply p.author,
body.letter-to-editor .reply,
body.letter-to-editor .answer { font-style: italic }

div.li strong { font-variant: small-caps }

h1,
h3,
h4,
h5,
h6,
dt,
 body.impressum h2,
body.error h2,
body.registration h2,
body.archive h2,
body.faq h2,
body.faq .faq-question,
body.registration .faq-question,
body.archive table.archive .issue th,
body.registration #registration label,
body.registration #registration legend { font-weight: bold }

h2,
div.li strong,
body.archive table.archive tr th,
body.registration #registration div label span { font-weight: normal }

.logo-td { height: 100px }

.about .missing { height: 140px }

body.editorial table.pic.fr .missing,
body.home table.pic.fr .missing { height: 283px }

.missing { height: 300px }

table.pic th,
.service-nav,
.nav,
.toc,
blockquote p { line-height: 1 }

table.pic td,
.data.big td,
table.archive,
body.hohlspeiche .text { line-height: 1.2 }

body { line-height: 1.4 }

body.impressum .editorial-staff li,
.nav li,
.service-nav li,
.toc li { list-style-type: none }

*/*Reset*/,
table.pic.fr,
div.li dt,
body.hohlspeiche .reference p,
.content p.first,
.service-nav ol,
.service-nav li { margin-top: 0 } /* Die beiden anderen floatenden Bilder ".about img" und "div.li img" benötigen keine Regel, weil das img bisher keinen oberen Rand besitzt */

.subtitle { margin-top: 0.10em } /* Verdeutlicht die Zugehörigkeit zur Überschrift */

.about img,
ul ul,
ul ul ul,
ol ol,
ol ol ol,
li,
dt,
.service-nav { margin-top: 0.30em } /* "service-nav" hat Zeilenhöhe 1. In content-td hat jedoch der Text in den obersten Elementen eine Zeilenhöhe von 1.4. Dieser hier zusätzlich eingefügte Abstand kompensiert das */


p,
address,
blockquote,
ul,
ol,
dl,
h5,
table.pic,
table.archive,
table.data,
.toc,
.emphasized,
.announcement,
.manifestations,
.about,
div.li,
body.registration #registration #submit,
body.registration #registration legend,
.toc li,
.toc ol{ margin-top: 0.80em }


.nav li,
.nav ol,
.nav ol ol,
.nav ol ol ol { margin-top: 1.00em } /* ".service-nav ol" ".service-nav li" nicht, weil am Seitenkopf kein Abstand sein soll. */

h3,
h4 { margin-top: 1.60em }

.interview .q-and-a,
.manifestations,
body.registration #registration fieldset,
body.home .announcement { margin-top: 2.30em }

*/*Reset*/ { margin-right: 0 }

.about img,
div.li img { margin-right: 0.60em }

*/*Reset*/,
body.hohlspeiche .reference p,
body.hohlspeiche table.pic /*Workaround wg. Mozilla Bug zu nicht zusammenfallenden vertikalen Außenabständen bei Table */{ margin-bottom: 0 }

ul ul,
ul ul ul,
ol ol,
ol ol ol,
li,
div.li dd { margin-bottom: 0.30em }

.about img,
div.li img,
p,
address,
blockquote,
ul,
ol,
dl,
table.pic,
table.archive,
table.data,
.toc,
.emphasized,
.announcement,
.about,
div.li,
body.letter-to-editor .reply p.author,
body.letter-to-editor .letter p.author,
body.registration #registration div,
body.registration#registration #submit,
.toc li,
.toc ol { margin-bottom: 0.80em }

.nav li,
.service-nav li,
.nav ol,
.nav ol ol,
.nav ol ol ol,
.service-nav ol { margin-bottom: 1.00em }

p.author,
body,
body.hohlspeiche h3,
body.registration #registration fieldset { margin-bottom: 2.00em }

.service-nav { margin-bottom: 3.00em }

body.hohlspeiche div.hohlspeiche { margin-bottom: 4.00em }

*/*Reset*/,
div.li dl,
body.impressum .editorial-staff,
.toc ol { margin-left: 0 }

table.pic.fr { margin-left: 0.60em }

dd,
blockquote { margin-left: 0.80em }

ul,
ol,
dl,
.toc ol ol,
.toc ol ol ol { margin-left: 1.50em }

body.registration #submit { margin-left: 14.10em } /* 17em/1.2em = 14.1em */

.column-layout .content { max-width: 40.00em } /* Erster Selektorteil wg. EPUB-Skript */

*/*Reset*/,
.nav-td,
.content-td,
table.pic tr:first-child th{ padding-top: 0 }

table.pic td, .reference { padding-top: 0.20em }

.pre,
.data th,
.data td,
.data caption{ padding-top: 0.30em }

.search-td,
table.pic th,
table.pic.fr tr:first-child th /* Hat höhere Spezifität als "table.pic tr:first-child th"*/    { padding-top: 0.80em } 



body.archive table.archive tr.issue th,
tr.issue td { padding-top: 2.00em }

*/*Reset*/ { padding-right: 0 }

.pre,
.data th,
.data td,
table.pic th /* Solange es nebeneinanderstehende Bilder gibt */,
table.pic td /* Solange es nebeneinanderstehende Bilder gibt */,
body.hohlspeiche .text,
#search-field { padding-right: 0.30em }

.search-td,
.content-td,
.toc,
.emphasized,
.announcement,
.submit,
body.registration #registration label { padding-right: 0.60em }

div.li dt { padding-right: 1em }

* /*Reset*/ { padding-bottom: 0 }

.data th,
.data td,
table.archive td,
table.archive th { padding-bottom: 0.30em }

.content-td { padding-bottom: 1.20em }

*/*Reset*/,
body.archive table.archive tr.issue th { padding-left: 0 }

.data th,
.data td,
body.hohlspeiche .text,
#search-field { padding-left: 0.30em }

.toc,
.emphasized,
.announcement,
.submit { padding-left: 0.60em }

.toc { padding-left: 1.00em }

.content-td,
body.archive table.archive td { padding-left: 1.20em }

body.archive table.archive tr th { padding-left: 2.00em }

body.registration #registration legend { padding-left: 17.00em }

td,
th,
.data caption { text-align: left }

.search-td,
body.registration #registration label { text-align: right }

a { text-decoration: none }

td,
th { vertical-align: top }

table.pic img,
.data img { vertical-align: bottom } /* Sonst kleiner Abstand unter Bild, z.B. in table.pic th */

.search { white-space: nowrap }

table.pic /*Damit die Bildunterschriften nicht über die Breite des Bildes hinauslaufen*/ { width: 1px }

body.registration #registration label { width: 16.00em }

.column-layout { width: 100% }

.about .missing { width: 100px }

body.editorial table.pic.fr .missing,
body.home table.pic.fr .missing { width: 200px }

.missing { width: 400px }

.nav-td { width: 224px } /* Breite des Logos */

body.faq .account { white-space: nowrap }

.nnbsp { word-spacing: -0.35ex }
}
@media all { /* Hack: Kompensation von Reset-Regeln */

select { padding: 1px  }/* Das Zurücksetzen des Innenabstands auf Null verursacht zu kleine Selectboxen. */
option  { padding-left: 0.30em }/* Durch das Zurücksetzen der Innenabstände auf Null fehlt ein Padding in Option. */
}
@media all { /* Hack: Runde Ecken */
.announcement,
.emphasized,
.toc,
#search-field,
.search .submit,
#registration textarea,
#registration input { border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; behavior: url(/css/pie.htc); /* "border-radius-..." ist eine CSS3-Eigenschaft. Die Eigenschaften "-moz-..." and "-webkit-..." gewährleisten die Unterstützung in den Browsern der Mozilla- und Webkit-Familie. Die letzte Eigenschaft sorgt für eine Darstellung der Eigenschaft in IE 6-8. Achtung! Für IE 6-8 nur Shorthand-Properties und nicht die Langform verwenden. */ }
}
@media all { /*Hack: Easyclearing*/
/* Easyclearing für drei Fälle eines links floatenden Elementes: 1) "img" in "div.about p"; 2) "img" in "div.li p"; 3) "label" in "body.registration #registration fieldset div" */
.about p:after,
div.li p:after,
body.registration #registration fieldset div:after { content: "."; display: block; clear: left; height: 0; visibility:hidden; }

.about p,
div.li p,
body.registration #registration fieldset div { display: inline-block; }

/* Beginn ohne IE Mac\*/
* html .about p,
* html div.li p,
* html body.registration #registration fieldset div { height: 1%; }

.about p,
div.li p,
body.registration #registration fieldset div { display: block; }

/* Ende ohne IE Mac */
}
@media all { /* Hack:  Zugänglichkeit */
/* Für Sehende verbergen. Für Blinde ausgeben. */ 
.skip,
#toc-manifestations,
body.home h2,
form.search label { position: absolute; left: -1000px; top: -1000px; width: 0; max-height: 0; overflow: hidden; display: inline; } /* Der Selektor ".crap" wird hier nicht aufgeführt, weil das Skript ihn als interne Stilregel im HEAD einfügt*/

/* Skip-Links für Tab-Navigation sichtbar schalten */
.skip:focus,
.skip:active { position: static; left: 0; top: 0; }

}
@media all { /* Hack: Diverse */
/* Leere Regeln. Nur für Prüftools. Die entsprechenden Klassen kommen nur in generiertem Code vor. */
.letter,
.l-and-r,
.read { }

/* In Entwicklung befindliche Codeteile ausblenden, die der Programmierer nicht ohne weiteres deaktivieren kann */
td.title-pic { display: none; }

blockquote:before,
blockquote:after,
q:before,
q:after { content: ""; }

/* Sichtbarkeit von "FZ-Elementen" im Editor*/
fz_note,fz_literature,fz_email,fz_literature_listing,fz_note_listing { background-color: #FFA }
}
 @media print {

* { background-color: white !important }

a:link,
a:visited { border-bottom-style: dotted }

a.pic /* Klasse "pic" kann im Markup entfernt und es kann der Selektor a[href^="/bilder"] verwendet werden*/,
a.an,
a.li { border-bottom-style: none !important }

a:link,
a:visited { border-bottom-width: 1px }

a:link,
a:visited { border-bottom-color: black }

*,
a:link,
a:visited { color: black !important }

h1:before { content: "Fahrradzukunft" }

td.nav-td,
td.search-td,
td.logo-td img,
.versions,
.skip,
table.archive td.pdf,
table.archive td.online,
table.archive td.epub,
.toc,
img.deco { display: none }

body { font-size: 10pt }

.column-layout .content { max-width: 100% } /* Erster Selektorteil wg. EPUB-Skript */

body { margin: 0 }

h1 { margin-bottom: 0.50em }

p { orphans: 2 }

td.content-td,
body { padding: 0 }

h1,
h2,
h3,
h4,
h5 { page-break-after: avoid }

table.pic td { page-break-before: avoid }

p { widows: 2 }
}