@charset "utf-8"; /* ================================================================================ */ /* Abschnitt: CSS Reset, Urheber dieses Abschnitts: Eric A. Meyer, www.meyerweb.com */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } /* remember to define focus styles! */ :focus { outline: 0; } body { line-height: 1; color: black; background: white; } ol, ul { list-style: none; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } /* Ende Abschnitt: CSS Reset */ /* ================================================================================ */ @font-face { font-family: "text"; src: url('/fonts/gabriela-regular.ttf'); /* see also preload in */ } @font-face { font-family: "head"; src: url('/fonts/fjallaone-regular.ttf'); /* see also preload in */ } @font-face { font-family: "narrow"; src: url('/fonts/abel-regular.ttf'); /* see also preload in */ } html { font-family: text; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-size: 100%; scroll-behavior: smooth; /* animation (e.g. animation:fadein 1.0s) causes scroll-to-anchor problems in some mobile devices! */ scroll-padding-top: 2em; } body { text-align: center; /* background-color: #F8F8F8; +++++ */ } /* div.content p, div.teaser p */ p { font-family: text; /* Silbentrennung */ hyphens: auto; -ms-hyphens: auto; -webkit-hyphens: auto; -moz-hyphens: auto; color: #777; margin: 0; margin-bottom: 0.7em; } p + ul { margin-top: -0.7em; } ul.limargins li { margin-bottom: 0.5em; } p.vers::before { content: url('/images/bibel.gif'); } p.small { font-family: narrow; font-size: 1em; line-height: 1.4em; } p.bordered { border: 1px dotted #e0e0e0; padding: 1.2em; padding-right: 1.5em; /*text-align: justify;*/ } p.highlighted { background-color: #D6E4FF; color: #515151; /*text-align: justify;*/ } p.quote { padding-left: 3em; background-image: url(/images/quotes.svg); background-repeat: no-repeat; background-position-x: 0.8em; background-position-y: 0.5em; } p#nav {font-size: 0.9em;} /* unused */ p.qr { font-size: 85%; line-height: 1.2em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } p.date { margin-top: -1em; margin-bottom: 2em; font-family: narrow; font-size: 1em; line-height: 1.4em; } p.date::before { content: url('/images/datesvgicon.svg') "\00a0"; opacity: 0.5; } p.dateheader { font-family: narrow; font-weight: bold; font-size: 1.1em; color: #616780; margin-top: -1em; margin-bottom: 2.5em; letter-spacing: 0.01em; line-height: 1.3em; } div.content p.stichworte { line-height: 1.8em; } h1 { font-family: head; font-size: 2.2em; font-weight: normal; color: #aa0000; margin: .67em 0; padding-bottom: 0.5em; margin-top: 1.5em; line-height: 1.3em; } h1 span::before, h1 span::after, p.h1style span::before, p.h1style span::after, h2 span::before, h2 span::after, p.h2style span::before, p.h2style span::after, h3 span::before, h3 span::after, p.h3style span::before, p.h3style span::after { /* enable spacing of slashes or middots in headlines */ content: " "; font-size: small; } p + h1, a + h1, /* unused */ span + h1 /* unused */ { /* move h1 away from preceding p and a; span only needed to hide during dev */ padding-top: 1em; } h2, p.h2style { font-family: head; font-size: 1.8em; font-weight: normal; color: #1f0072; margin: 0.30em 0 0.60em 0; /*.67em 0;*/ line-height: 1.3em; hyphens: none; -ms-hyphens: none; -webkit-hyphens: none; -moz-hyphens: none; } div.content div.flush + h2, div.content div.flush + p.h2style, div.content div.flush + a + h2, /* unused */ /* in case a tag is squeezed in */ div.content div.flush + a + p.h2style { /* move h3 away from preceding button */ padding-top: 0.8em; } p + h2, a + h2, /* unused */ span + h2 /* unused */ { /* move h2 away from preceding p and a */ padding-top: 1.5em; } h3, p.h3style { font-family: head; font-size: 1.3em; font-weight: normal; color: #cb5027; margin-top: 0.3em; margin-bottom: 0.67em; hyphens: none; -ms-hyphens: none; -webkit-hyphens: none; -moz-hyphens: none; } .content h3:not(.top), .content p.h3style:not(.top) { font-size: 1.5em; line-height: 1.3em; } h2 + h3, p.h2style + h3, h2 + p.h3style, p.h2style + p.h3style { margin-top: 1.2em; } div.content a + h3, div.content div.flush + h3, div.content div.flush + aside div.interessehinweis, div.content div.flush + p.h3style, div.content div.flush + p.trenner { /* move h3 away from preceding button */ padding-top: 1.5em; border-top: 0.05em solid #E8E8E8; } div.content div.separator + div.flush + h3, /* unused */ div.content div.separator + div.flush + aside div.interessehinweis, div.content div.separator + div.flush + p.h3style { /* no solid separator after dotted separator */ padding-top: 0; border-top: none; } div.teaser a + h3, /* unused */ div.teaser div.flush + h3, /* unused */ div.teaser div.flush + p.h3style { /* move h3 away from preceding button */ padding-top: 0.8em; } div.content a + h3, div.content div.flush + h3 { border-top: 0.05em solid #E8E8E8; } h3 a { color: #cb5027; /* no link underline */ text-decoration: none; } h3 a:hover { color: #DD8707; /* underline */ border-bottom: 0.12em solid; } p.h3style.top, p.h3style.top { color: #e3940a; } .content p.h3style.top { margin-bottom: 0.1em; } /* arrow after any link inside h3 */ div.content p.h3style a[href]::after { /* A0 is in unicode */ content: "\A0>"; letter-spacing: 0.1em; } h4, p.h4style /* unused */ { font-family: head; font-size: 1.05em; color: #616780; /* #5566AA; */ margin-top: 0.3em; margin-bottom: 0.67em; letter-spacing: 0.02em; /* font-family: text; font-size: 1em; font-weight: bold; color: #777; margin-top: 0.3em; margin-bottom: 0.67em; */ } div.content p.h4style, /* unused */ div.teaser p.h4style /* unused */ { font-weight: bold; } .content h5 { font-family: head; font-size: 1em; color: #cb5027; margin-top: 0.3em; margin-bottom: 0.67em; } .content h5:before { /* \2b1b ist gefülltes Rechteck, \00a0 ist geschütztes Leerzeichen */ /* content: "\2b1b\00a0\00a0"; */ /* \25c6 ist Raute, \00a0 ist geschütztes Leerzeichen */ /* content: "\25c6\00a0\00a0"; */ /* content: "-\00a0"; */ } ul { list-style: disc outside none; margin-left: 1em; margin-bottom: 0.7em; color: #777; } li { color: #777; } img { /* set color of image alt-text, shown until img has loaded */ color: #777; } a.topanchor { /* must always be above any div */ position: absolute; top: 0; } a.lupe img { /*xheight: 1em;*/ /*height: 16px;*/ /*width: 13px;*/ } a.lupe:hover img { /* force color of svg to link color */ -webkit-filter: brightness(0) saturate(100%) invert(86%) sepia(86%) saturate(483%) hue-rotate(325deg) brightness(97%) contrast(97%); filter: brightness(0) saturate(100%) invert(86%) sepia(86%) saturate(483%) hue-rotate(325deg) brightness(97%) contrast(97%); } /* #! dient als Dummy, um das Linksymbol zu demonstrieren (Datenschutzseite) */ /* ^http erfasst auch https */ /* \00a0 ist geschütztes Leerzeichen */ a[href="#!"]::after, a[href^="http"]::after { content: "\00a0" url('/images/extlink_painted.gif'); opacity:0.5 } /* Show Stichworte */ /* a[name][title] { border-bottom: none !important; } a[name][title]::before { content: "\00a0" attr(title) "\00a0\25B6"; background-color: black; color: white; text-decoration: none !important; */ /* Show bible text when hovered */ a[data-bibeltext] { display: inline-block; cursor: cell; } a[data-bibeltext]::after { content: "\00a0" url('/images/bible_painted.gif'); opacity:0.5; width:16px; height:12px; } a[data-bibeltext]::before { content: ""; opacity: 0; } /* \000a ist Zeilenumbruch; \201C und \201E sind Anführungszeichen */ /* \00a9 ist Copyright; \00a0 ist geschütztes Leerzeichen */ a[data-bibeltext]:hover::before { content: "Der Bibeltext im Wortlaut:\000a \201E" attr(data-bibeltext) "\201C \000a Lutherbibel 1984, \00a9\00a0 Deutsche Bibelgesellschaft, Stuttgart"; white-space: pre-wrap; background-color: #4e4f8c; color: white; display: block; position: absolute; padding: 1em; border-radius: 10px; margin-top: 40px; left: 5%; width: 85%; z-index: 1; opacity: 1; -webkit-transition: opacity 0.5s; -o-transition: opacity 0.5s; transition: opacity 0.5s; } @media (hover: none) { a[data-bibeltext]:hover::before { content: "Der Bibeltext im Wortlaut:\000a \201E" attr(data-bibeltext) "\201C \000a Lutherbibel 1984, \00a9\00a0 Deutsche Bibelgesellschaft, Stuttgart\000a\000a::\00a0Zum Schließen außerhalb tippen\00a0::"; font-size: 80%; line-height: 1.25em; } } p a:not(.stichwort), li a { /* sync this with p */ color: #EE8707; text-decoration: none; /* no link underline */ border-bottom: 0.12em dotted; } p#nav a /* unused */ { color: #777; font-size: 0.9em; } .footernav li a { border-bottom: unset; } p a:not(.linkbutton):hover, p#nav a:hover, li a:hover { color: #EE8707; border-bottom: 0.12em solid; /* replace dotted line by underline */ } img#logo1 { width: 10.875em; height: 3.15em; } img.lupe { height: 16px; width: 13px; } img.img50 { width: 50px; height: 50px; /*width: 3.12em;*/ float: left; margin-top: 0.4em; margin-right: 1em; margin-bottom: 0.5em; -webkit-filter: brightness(103%); filter: brightness(103%); -webkit-box-shadow: 3px 3px 3px #909090; box-shadow: 3px 3px 3px #909090; border-radius: 0.4em; } div.img100, img.img100, img.img100bordered, div.qr, img.qr { width: 6.25em; float: left; /* allow text to the right of the image */ margin-top: 0.4em; margin-right: 1em; margin-bottom: 0.5em; } img.h210 { height: 210px !important; } img.h510 { height: 510px !important; } img.img100, img.img100bordered { border-radius: 0.4em; -webkit-box-shadow: 3px 3px 5px #909090; box-shadow: 3px 3px 5px #909090; } div.qr, img.qr { width: unset; /* qr codes can be wider than 100 px */ min-width: 6.25em; float: unset; } img.img100 { width: 100px; height: 100px; } img.img100bordered { width: 101px; height: 101px; border:1px solid #d8d8d8; } div.img100 img.img100 { margin-top: 0; /* if the preceding div already cares about top margin no need any more */ } div.img100placeholder p /* unused */ { background-color: #B0B0B0; color: white; /* change padding here; height will auto-adjust */ --varPadding: 5px; padding: var(--varPadding); height: calc(100px - 2*var(--varPadding)); } div.img100 p { font-size: 0.75em; line-height: 1.2em } div.img100 p[title="Copyright"] { font-size: 0.6em; } div.teaser img.img100 { /* no text allowed alongside the image */ float: none; -webkit-box-shadow: 3px 3px 5px #404040d0; box-shadow: 3px 3px 5px #404040d0; } img.img175125 { /*width: 10.9375em;*/ width: 175px; height: 125px; float: left; /* allow text to the right of the image */ border: 1px solid #d0d0d0; margin-bottom: 0.5em; clear: both; } div.img175125 { width: 11em; height: 12.5em; /* needed for enough space for legend text, consistent across divs with different text length */ float: left; padding-right: 1.2em; padding-bottom: 0.7em; } div.img175125 p { /* Bildunterschriften mit kleinerer Schrift und engeren Zeilen */ font-size: 0.8em; line-height: 1.3em; } div#renderhelper { position: relative; width: 100%; /* this makes height a percentage of width! Emulates aspect-ratio */ height: 0; padding-bottom: 37.4%; margin-top: 2em; } img.intro { /*width: 457px;*/ /*height: 172px;*/ /*margin-top: 2em;*/ position: absolute; top: 0; left: 0; width: 100%; /*of its wrapper*/ height: 100%; /*of its wrapper*/ border-radius: 0.3em; } div.altersgruppe { margin-top: -0.25em; margin-bottom: 0.67em; } div.altersgruppe img { margin-right: 0.25em; /* some space between the icons */ } sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; top: -.5em; } .visitors { margin: 0 auto; padding: 0 6%; margin-top: 2em; } .visitors p { text-align: right; line-height: 1.3em; color: black; font-family: narrow; font-size: 0.95em; margin: 0; } .content { margin: 0 auto; padding: 0 7%; margin-bottom: 1.5em; line-height: 1.55em; float:left; margin-top: 1.3em; width: 55%; /* begrenzt die Reichweite von floats, die bei clear:both berücksichtigt werden */ overflow: auto; /* bewirkt 100%-Refernz für absolut positionierte Bibeltext-Hovers */ position: relative; } .teaser, .teasertop { float: left; width: 22%; margin: 0 auto; margin-top: 1.3em; margin-left: 0em; padding-top: 2%; padding-left: 2%; padding-right: 2%; line-height: 1.55em; background-color: #ffecb433; border-radius: 0.3em; } .teasertop { margin-bottom: 0; padding-top: 0; background-color: unset; } .achtung::before { content: url('/images/achtung21x18.png'); margin-right: 0.7em; position: relative; /* 3 following properties move the icon a bit lower */ vertical-align: baseline; top: 0.2em; } .rechtliches::before { content: url('/images/rechtliches21x18.png'); margin-right: 0.7em; position: relative; /* 3 following properties move the icon a bit lower */ vertical-align: baseline; top: 0.2em; } .info::before { content: url('/images/info18x18.png'); margin-right: 0.5em; position: relative; /* 3 following properties move the icon a bit lower */ vertical-align: baseline; top: 0.2em; } div#logocontainer { float: left; width: auto; padding: 1em 7% 0 7% /* +++++ */ } div.mottocontainer { width: auto; padding: 0 7% 0 7%; } div.mottocontainer p { font-family: narrow; font-size: 1em; color: #e0e0e4; } div#logo div.mottocontainer { text-align: right; padding-top: 1em; /* +++++ */ } div#logo div.mottocontainer p { font-weight: bold; line-height: 1.4em; } div#footer div.mottocontainer p { font-weight: normal; line-height: 0.8em; } div.menumain { font-family: head; font-size: 1.05em; background-color: #4e4f8c; padding: 0.6em 7% 0.5em 7%; color: #f0f0f8; line-height: 1.7em; text-align: center; } div#headermenu { z-index: 20; } @supports ( position: sticky ) { div#headermenu { position: sticky; /* js-based change to top:0 */ top: -5em; -webkit-box-shadow: 0px 4px 4px -1px #40404080; box-shadow: 0px 4px 4px -1px #40404080; opacity: 1; -webkit-transition: top 0.5s, opacity 0.5s; -o-transition: top 0.5s, opacity 0.5s; transition: top 0.5s, opacity 0.5s; } } div.menumain a, div.footernav a { color: #f0f0f8; text-decoration: none; /* no link underline */ margin: 0 0.3em 0 0.3em; } div.menumain a:hover, div.footernav a:hover { color: #f5d051; /*align with lupehover.jpg*/ border-bottom: 0.12em dotted #f5d051; } div.flush { /* Enforce the bottom to get flushed out */ clear: both; /* padding only needed to show this div in inspector */ padding-bottom: 0.05em; } h2 + div.flush, p.h2style + div.flush { margin-bottom: -1em; } div.separator { /* make sure no nesting happens if there's just few text right to an image */ clear: left; margin-top: 1em; margin-bottom: 1em; border-top: 0.5em dotted #E0E0E0; } div.separator.separatorh1 { margin-top: 1.75em; margin-bottom: 0em; border-top: 0.75em dotted #E0E0E0; } div.teaser div.separator { margin-top: 1em; margin-bottom: 0.2em; border-top: 0.5em dotted #84240F33; } div.footernav { float: left; width: 29%; padding: 1em 2% 0 2%; text-align: center; } div.footernav h5 { font-family: head; color: #f0f0f8; font-size: 1.1em; line-height: 2.0em; } div.footernav ul { font-family: narrow; font-size: 0.95em; line-height: 1.6em; list-style-type: none; margin-left: 0em; } div.debugfooter { display: none; /* made visible by showDebug() */ z-index: 40000; position: fixed !important; left:0; right: 0; bottom:0; background-color: #3b4045; padding: 1em; color: white; font: 1em 'Lucida Console'; text-align: center; } .random { /*display: none;*/ } span.zusammenhalten { white-space: nowrap; } p + h4, a + h4, span + h4, /* unused */ ul + h4, div.content div.flush + h4, div.content div.flush + p.h4style /* unused */ { /* move h4 away from preceding p and a; span only needed to hide during dev */ padding-top: 0.6em; } div.content a.linkbutton, div.teaser a.linkbutton, details summary { display: inline-block; margin-bottom: 0.625em; padding: .3em 0.7em; zoom: 1; font-family: inherit; font-size: 100%; text-align: left; text-decoration: none; line-height: normal; color: white; vertical-align: middle; cursor: pointer; -webkit-user-drag: none; user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; background-color: #8DAB60; /* erdiges grün */ border-radius: 0.3em; } details summary { background-color: #B286CE; /* lila */ } .linkbutton:focus { outline: 0; } .linkbutton::-moz-focus-inner { padding: 0; border: 0; } div.content a.linkbutton:not(.stichwort):nth-of-type(4n), div.content aside:nth-of-type(4n) div.modifiedelement a.linkbutton { background-color: #C66343; /* erdiges rot */ } div.content a.linkbutton:not(.stichwort):nth-of-type(4n+1), div.content aside:nth-of-type(4n+1) div.modifiedelement a.linkbutton { background-color: #8DAB60; /* erdiges grün */ } div.content a.linkbutton:not(.stichwort):nth-of-type(4n+2), div.content aside:nth-of-type(4n+2) div.modifiedelement a.linkbutton { background-color: #8787BC; /* erdiges violett */ } div.content a.linkbutton:not(.stichwort):nth-of-type(4n+3), div.content aside:nth-of-type(4n+3) div.modifiedelement a.linkbutton { background-color: #696969; /* anthrazit */ } div.teaser a.linkbutton:nth-of-type(4n+1) { background-color: #C66343; } div.teaser a.linkbutton:nth-of-type(4n+2) { background-color: #8DAB60; } div.teaser a.linkbutton:nth-of-type(4n+3) { background-color: #8787BC; } div.teaser a.linkbutton:nth-of-type(4n) { background-color: #696969; } div.content a.linkbutton:hover, div.content aside div.modifiedelement a.linkbutton:hover, div.content a.linkbutton:not(.stichwort):hover, div.teaser a.linkbutton:hover { background-color: #DD8707; } div.flush + a.linkbutton { margin-top: 0em; } div.content a.linkbutton::after, div.teaser a.linkbutton::after { /* A0 is in unicode */ content: "\A0>"; letter-spacing: 0.1em; } div.content a.linkbutton.back-button::after { content: unset; } div.content a.linkbutton.back-button::before { content: "<"; letter-spacing: 0.1em; } div.content a.linkbutton.stichwort::after{ /* no trailing stuff after label */ content: ""; } #centered { background-color: white; /* needed to actually show content centered */ display: inline-block; width: 100%; max-width: 52em; /* margin-top: 1.5em; +++++ */ padding: 0; text-align: left; } div#logo { height: 5em; /* +++++ */ background-color: #6768B8; } div#footer { background-color: #4e4f8c; float: left; width: 100%; } div.pagebuttons { padding: 1em; margin-top: -1em; margin-bottom: 1em; background-color: #f8f8ff; } div.pagebuttons a.linkbutton::after { content: "\A0\25BC"; opacity: 0.7; } div.homeh2bluebox { padding: 1em; background-color:#f0f0ff } div.homeh2bluebox h2 { font-size: 1.6em; } div.homegraybox { padding: 1em; background-color: #ececec; } div.interessehinweis { font-family: narrow; color: #969696; text-align: center; padding: 0.3em; padding-left: 0; padding-left: 1em; } div.modifiedelement { background-color: #fff3df; padding: 0.8em; margin-left: 1em; margin-right: 1em; margin-bottom: 1.5em; border-radius: 0.3em; } div.modifiedelement.random.nosidebar { display: none; } div.modifiedelement img.img100 { -webkit-filter: brightness(101%); filter: brightness(101%); -webkit-box-shadow: 3px 3px 5px #404040; box-shadow: 3px 3px 5px #404040; } .topbutton::after { content: url('/images/arrow-up-white.svg'); position: fixed; width: 40px; height: 40px; background: #6768B8; bottom: 10px; right: 1%; text-align: center; border-radius: 50%; opacity: 0.2; } .blinkindicator { animation: mykeyframes 2s infinite alternate; color: white; position: fixed; width: 40px; height: 25px; background: red; top: 10px; left: 1%; text-align: center; opacity: 0.3; } @keyframes mykeyframes {from {opacity:0;} to {opacity: 1;}} /* === Mobile ================================================================== */ @media (max-width: 63.999em) { #centered { margin-top: 0em; /* no top margin if side space is too small */ } } @media (max-width: 51.999em) { .teaser, .teasertop { display: none; /* no teaser column in small panels */ width: 0; } div.modifiedelement.random.nosidebar { display: block; } .content { width: auto; float: none; } .visitors { padding-right: 7%; } .random { /*display: inherit;*/ } div.content aside div.modifiedelement { /* make some space below image */ padding-bottom: 1.5em; /* see max-width 31.999 */ } } @media (min-width: 48em) { img#logo1 { float: left; } } @media (max-width: 39.999em) { div.footernav { width: 36%; padding: 1em 7% 0 7%; } } @media (max-width: 47.999em) { img#logo1 { float: left; } } @media (max-width: 34.999em) { img#logo1, img#logo1footer { display: block; float: none; margin-left: auto; margin-right: auto; padding: 0 !important; } img.lupe { height: 14px; width: 12px; } a#homelink, a#homelinkfooter { pointer-events: none; } div#logo div.mottocontainer { display: none; } div#footer div.mottocontainer p { line-height: 1.4em; font-size: 0.8em; } div#logocontainer { /* padding: 2.5em 7% 0 7% !important; +++++ */ /* width: inherit !important; +++++ */ float: none !important; } div.menumain { font-size: 1em; } div.footernav h5 { font-size: 1.25em; } div.footernav { font-size: 0.8em; } } @media (max-width: 31.999em) { div.content aside div.modifiedelement { /* make some space below image */ padding-bottom: 0.5em; /* see max-width 51.999 */ } div.content aside div.modifiedelement p::after { /* force link buttons below image uniformly */ content: ""; display: table; clear: both; } } @media (max-width: 29.999em) { div.content p::after, div.teaser p::after { /* force link buttons below image uniformly */ content: ""; display: table; clear: both; } } @media (max-width: 26.999em) { div#logo { /* +++++ */ height: 4em; } div#logocontainer { /* +++++ */ padding-top: 0.5em !important; } div.menumain { font-size: 0.9em; } img.lupe { height: 13px; width: 11px; } div.footernav { width: 86%; padding: 1em 7% 0 7%; font-size: 0.8em; } div.footernav h5 { font-size: 1.1em; } a.disappear { display: none; } h1, p.h1style /* unused */ { font-size: 1.9em; padding-bottom: 0.5em; -ms-hyphens: auto; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; } h2, p.h2style { font-size: 1.6em; margin: .67em 0; line-height: 1.2em; } .content h1, .content h2, .content p.h1style, /* unused */ .content p.h2style { line-height: 1.2em; } .teaser h1, .teaser h2 , .teaser p.h1style, .teaser p.h2style /* unused */ { line-height: 1.2em; color: #e3940a; } } @media (max-width: 20em) { img.img100.img175125 { width: 100px; height: 70px; } } @media print { #centered { display: block; /* Firefox prints only 1 page if we use inline-block like for screen */ } aside { display: none; } } /* end of @media print */