/* CSS-Stile für egg-bayern.de, verfasst von Gerhard Großmann, 🐊019 */

/* Farben: #278 – d-türkis
           #29a – türkis
           #dee – blass-türkis,
  Akzente: #74b (lila), #d31 (rot)
     Grau: #888 (mittel, für Linien), #ccc (hell), #eee (weißgrau)
     Text: #222 (fett/kursiv #111), #444 (H1+H2) */

/* Stile aus pm-core.css überschreiben */
.createlink.createlink { display: none; }
	/* fügte ein Bild hinter speziellen Links ein */
.createlinktext.createlinktext { border: 0; }
	/* unterpunktete spezielle Links */


/* SCHRIFTEN -------------------------------------------------------- */

@font-face { font-family: 'Muli'; font-display: fallback;
	font-style: normal; font-weight: 400;
	src: url('../schriften/muli-rg.woff2') format('woff2'),
	url('../schriften/muli-rg.woff') format('woff'); }
@font-face { font-family: 'Muli'; font-display: fallback;
	font-style: italic; font-weight: 400;
	src: url('../schriften/muli-it.woff2') format('woff2'),
	url('../schriften/muli-it.woff') format('woff'); }
@font-face { font-family: 'Muli'; font-display: fallback;
	font-style: normal; font-weight: 700;
	src: url('../schriften/muli-xb.woff2') format('woff2'),
	url('../schriften/muli-xb.woff') format('woff'); }
@font-face { font-family: 'Muli'; font-display: fallback;
	font-style: italic; font-weight: 700;
	src: url('../schriften/muli-xbi.woff2') format('woff2'),
	url('../schriften/muli-xbi.woff') format('woff'); }

/* ALLGEMEINES ------------------------------------------------------ */

html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;
font-size: 100.01%; }
body { margin: 0; padding: 0; text-align:left; color: #222;
	font: 1.05em/1.5 Muli,'Segoe UI',Myriad,Calibri,Arial,sans-serif;
	font-weight: 400; background-color: #fff; }
*, *:before, *:after { box-sizing: border-box; }
main { max-width:70em; margin:0 auto; padding: .7em 3% 3em; }
/* main { background: linear-gradient(#29a 1px, transparent 0) 0 10px / auto 1.5em; } /* Zeilenlinien (nur zum Test) */

@media (min-width: 45em) { /* breite Ränder */
main { padding-left: 12.5%; padding-right: 27%; } }

@media (min-width: 76em) {
main { padding-left: 9.5em; padding-right: 20.5em; } }

::selection { background-color: #dee; text-shadow: none; }

/* HTML5-Elemente: Anzeigebox für ältere Browser nachdefinieren */
nav, main, section, aside, footer, article { display: block; }
video { display: inline-block; }

@media (max-width: 34em) { .nur-breitbild { display: none; } }
/* Um „EGG“ im Header zu verlängern, für Textgröße-Kasten */

#headerbild { width:100%; position: relative; height:7em; height:23vmin;
	overflow:hidden; background-color: #fff;
	background-image: repeating-linear-gradient(58deg, transparent,
	hsla(195, 29%, 53%, .3) 246px, hsla(195, 29%, 53%, .3) 366px),
	repeating-linear-gradient(156deg, transparent, hsla(287, 28%, 47%, .2) 130px, hsla(287, 28%, 47%, .3) 274px),
	repeating-linear-gradient(300deg, transparent -12px, hsla(287, 28%, 47%, .2) 236px, hsla(195, 29%, 53%, .1) 378px); }
#headerbild img { width: 100%; height: auto; position:absolute;
	top:50%; transform: translateY(-50%); }
#headerbild div:nth-child(n+2) img { display: none; } /* zweites bis letztes Bild zunächst ausblenden, macht dann das Animations-Skript */


/* FOKUS-LINKS & MENÜ ----------------------------------------------- */

a.tastaturfokus { position: absolute; top: -3.8em; display: block;
	width:100%; padding:.2em .4em; background-color:#dee;
	box-shadow: 0 0 .4em rgba(0,0,0,.4);
	z-index: 20; text-align: center; transition: top .3s; }
a.tastaturfokus:focus { top: 0; }

/* Logo */

.logo { display:block; margin: 0; padding: 0 3% .2em 0; font-size: 1.6em; line-height: 1.15; }
.logo.logo a { color: #74b; background-color: transparent;
	padding: 0; display: inline; font-weight: normal; }
.logo img { display:block; float: left; width: 2.3em; height: auto;
	margin-right: 3%; }

@media (min-width: 45em) { .logo img { width: 9%; margin-right:2%; margin-top:.3%; } }

@media (min-width: 76em) { .logo img { width: 4em; margin-top: 0; margin-right: .9em; } }

/* Grundsätzliches Styling */

nav { padding: 1.6em 3%; padding-left: calc(3% - .4em); }
nav ul { margin:0 auto; padding: 0; max-width:75em; list-style:none; }
nav ul ul, nav ul ul ul { list-style:none; }

/* Navigation: Menüpunkte */

nav li { display: inline-block; position:relative; }
nav li a { display: block; padding: .15em .4em .16em; color: #444;
	background-color:inherit; cursor: pointer; transition: background-color .1s; }
nav a:visited { color: inherit; }
nav a:hover, nav a:focus { background-color:#dee; color:inherit; }

#klappmenue > ul { display:inline; } /* Nur oberste Menüebene */
#klappmenue > ul > li { margin: .3em .6em 0 0; vertical-align: middle; }
@media (min-width: 45em) { #klappmenue > ul > li { left:-.35em; } }

#klappmenue .ausgewaehlt, #klappmenue .selflink { box-shadow: inset 0 0 0 2px #29a; }

/* Untermenüs
 * Bezüglich Unterpunkt-Pfeile siehe Abschnitt „Icons“ unten */

nav li ul { position: absolute; margin:0; z-index: 10; min-width: 100%;
	box-shadow: 0 .4em .4em rgba(0,0,0,.2); }
nav li li { border-bottom: 1px solid #278; display: block;
	position:relative; }
nav li li a { white-space: nowrap; background-color: #eee; }
nav li li ul { left: 3em; top:1em; margin-top:0; z-index:11;
	min-width: calc(100% - 3.5em);
	box-shadow: .2em 0 .4em rgba(0,0,0,.2); }
nav li li li ul { z-index:12; }

/* Bei Mouse-Over direkte Untermenüs einblenden */
nav li ul, nav li:hover ul ul, nav li li:hover ul ul { display: none; }
nav li:hover ul, nav li li:hover ul, nav li li li:hover ul {
	display: block; }

/* Ebenso bei Tastatur focus-within (extra aufgeführt, weil :hover sonst ungültig wird für nicht unterstützende Browser, z.B. Edge18 */
nav li:focus-within ul ul, nav li li:focus-within ul ul {
	display: none; }
nav li:focus-within ul, nav li li:focus-within ul,
nav li li li:focus-within ul { display: block; }


/* Ausnahme für besonders lange Untermenüs: Zweispaltigkeit */

nav:not(:target) ul.zweispaltig { width: 18.2em; } /* doppelte Länge vom längsten betroffenen Menübegriff („Ewigkeitssonntag“ bei Religion & Bibel > Kirchenfeste im Jahreskreis) */
nav:not(:target) ul.zweispaltig > li { width: 50%; display: inline-block; float:left;}
nav:not(:target) ul.zweispaltig > li:nth-child(2n) {
	border-left:1px solid #278; float:right;}
nav:not(:target) ul.zweispaltig > li:nth-child(2n+1):last-child {
	width: 100% }

/* Komplett eingeblendetes Menü */

nav:target .logo {display: block; min-height: 2.5em; }
nav:target .logo img { width: auto; height: 2.3em; }
nav:target .suchfeld input[type='search'] { width: 100%; }

nav:target ul, nav:target li ul ul { display:block;
	position: relative; top: 0; box-shadow: none; }
nav:target > div > ul > li { display: block; margin-right: 0; }
nav:target li ul, nav:target li li ul { left:0; padding-left:1.5em;}
nav:target li li { border:0; }
nav:target .ausgewaehlt:not(:hover) {box-shadow: inset 0 0 0 1px #29a;}
nav:target a:focus { background-color: #dee; display:block; }

/* Klapp-Menü bei schmaleren Bildschirmen */

.menueklapper { display:none; margin-left:.15em; font-weight:bold;
	cursor: pointer; position:relative; top:-.2em;
	padding:.1em .4em .25em; background-color: #dee; color:#278; }
.menueklapper:hover, .menueklapper:focus {
	background-color: #29a; color: #fff; }
#show-menu { display:none; position: relative; left: -5.2em; top:.2em;
	height: 1.6em; width: 4.9em; opacity:0; cursor: pointer;
	pointer-events:none; } /* Opera-Mini reagiert nur bei Klick auf die Checkbox, nicht aufs Label. Deshalb diese unsichtbar übers Label gelegt und mit pointer-events für alle anderen Browser wieder deaktiviert, damit der Hover-Effekt funktioniert */
#klappmenue { display:inline; }

@media (max-width: 34em) {
	.menueklapper, #show-menu { display:inline-block; }
	nav:not(:target) #klappmenue { display:none; }
	#show-menu:checked ~ #klappmenue { display: inline-block;}
}

/* Größe der Social-Media-Icons in Menüs */
nav img { height: 1.1em; }
nav a[target="_blank"]:after { width: 0; }

/* Ausnahmen für das Suchfeld */
.suchfeld { display:inline-block; margin-top: .3em; }
.suchfeld label { position: absolute; clip: rect(1px, 1px, 1px, 1px);
	padding: 0; height: 1px; width: 1px; overflow: hidden; }
.suchfeld input[type='search'] { width:10em; color: #444;
	border: 1px solid #bbb; box-shadow:inset 1px 1px 5px rgba(0,0,0,.2);
	padding: .05em .3em; }
.suchfeld input[type='search']:focus { border-color: #29a;}

@media (max-width: 34em) { /* Bei schmalem Header: Suchfeld nach oben */
	.suchfeld {position:absolute; right:3%; top:1.5em; font-size:.9em;} }
@media (max-width: 23em) { .suchfeld { top:0; } }


/* PAGE-ACTIONS für angemeldete Nutzer ------------------------------ */

#pageactions { display:block; margin: .8em -3% -1em;
	padding: .6em 1em .7em; background-color: #eee; font-size:.75em; }
#pageactions:after { clear:both; }
#pageactions:empty { display: none; }

#pageactions a { display: inline-block; padding: .2em; color:#278;
	line-height:1; }

/* ARTIKEL ---------------------------------------------------------- */

/* Menü innerhalb eines Artikels */

nav.artikel-menue.artikel-menue { margin: .8em 0 .9em; padding:0; }
nav.artikel-menue.artikel-menue ul { margin:0; background-color:#dee; }
nav.artikel-menue > ul { padding: .6em 2.5% .7em; }
nav.artikel-menue a:hover { background-color: #ccc; }
nav.artikel-menue.artikel-menue ul li { margin:0; padding:0; left:0;}

/* Brotkrumen */

.brotkrumen { display:block; margin-bottom: -.7em; text-align: left; }
.brotkrumen a { font-size: .75em; font-weight: bold;
	line-height:1; display: inline-block; padding:0;
	background-color:#eee; white-space: nowrap;}

.brotkrumen :before, .brotkrumen :after {
	content: ''; display: inline-block; vertical-align:-.4em; }
.brotkrumen :first-child:before, .brotkrumen :last-child:after {
	margin-left: .4em; }

.brotkrumen :nth-child(n+2):before {
	border-top: .8em solid #eee; border-bottom: .8em solid #eee;
	border-left: .5em solid #fff; margin-right:.3em; }
.brotkrumen :after {
	border-top: .8em solid #fff; border-bottom: .8em solid #fff;
	border-left: .5em solid #eee; margin-left:.3em; }

/* ARTIKEL: RANDSPALTE */

aside { font-size: .9em; width:100%; clear:left; margin:.8em 0 .9em;
	padding: .6em 2.5% .7em; background-color: #eee;
	-webkit-column-width:12em; column-width:12em;
	-webkit-column-gap: 1em; column-gap: 1em;}
aside:after { content: ''; display: table; clear: both; }
aside:empty { display: none; }

@media (min-width: 45em) { /* Aside ausgerückt */
aside { position:relative; background-color: inherit;
	float:right; clear:none; width: 37.5%;
	left: 42%; margin:0; margin-left: -40%; padding: 0; } }


/* FUẞZEILE --------------------------------------------------------- */

footer { padding: .5em 3%; text-align: center; clear: left;
	font-size:.9em; color: #000; text-shadow: 0 0 .5em #fff; background-color: #f7f7f7;
	background-image: repeating-linear-gradient(58deg, transparent,
	hsla(195, 29%, 53%, .15) 246px, hsla(195, 29%, 53%, .15) 366px),
	repeating-linear-gradient(156deg, transparent, hsla(287, 28%, 47%, .1) 130px, hsla(287, 28%, 47%, .15) 274px),
	repeating-linear-gradient(300deg, transparent -12px, hsla(287, 28%, 47%, .1) 236px, hsla(195, 29%, 53%, .05) 378px); }
footer:after { clear: both; }


/* TYPOGRAFIE ------------------------------------------------------- */

/* Überschriften */

h1,h2,h3,h4 { font-feature-settings: "liga", "kern"; }
h1,h2 { color: #444; }
h1 { font-size: 2em; line-height: 1.125; font-weight: 400;
	margin: .7em 0 .5em -.04em; }
h2 { font-size: 1.7em; line-height: 1.32; font-weight: 400;
	margin: 1.37em 0 .4em -.04em; }
.hinterlegt h2 {margin-top:.91em;}
.hinterlegt h2:first-child {margin-top:.05em}

/* In der Randspalte sieht eine H2 wie eine H3 aus */
h3, aside h2 {
	font-size: 1.4em; line-height: 1.07; font-weight: bold;
	margin: 1.1em 0 .5em; }
aside h2 { margin-top: 1.65em; }
.hinterlegt h3:first-child, aside h2:first-child {
	margin-top:.05em; }

h4, aside h3 {
	font-size: 1.1em; line-height: 1.36; font-weight: bold;
	margin: .9em 0 .5em; }
.hinterlegt h4:first-child, aside h3:first-child {
	margin-top:.15em }
h5 { font-size: .9em; line-height: 1.67; font-weight: bold;
	margin: 1em 0 .67em; }
h6 { font-size: .75em; line-height: 2; font-weight: bold;
	margin: 1.2em 0 .8em; }

/* Formatierungen für Absätze und Lesetexte */

p, ul, ol { margin: 0; text-align: left;
	-webkit-font-feature-settings: "onum", "liga", "kern"; font-feature-settings: "onum", "liga", "kern";
	-webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
code,pre,samp,kbd,var,abbr,acronym,sub,sup,textarea,label,a {
	hyphens: none; }
p + p { margin-top:.75em; }

@media (min-width: 34em) {
	main p { text-align: justify; }
	aside p { text-align: inherit; }
}

.eingezogen, .ausgerueckt, .indent, .outdent { margin-left:1.5em; }
.ausgerueckt, .outdent { text-indent:-1.5em; } /* Vermeiden! Klassennamen .indent und .outdent aus Syntax übernommen */

.mehrspaltig { -webkit-columns:12.5em; columns:12.5em; margin:1em 0 -0.3em; }

.hinterlegt { margin: .8em 0 .9em; padding: .6em 2.5% .7em;
	background-color: #dee; }
.hinterlegt:after { clear:both; }
.hinterlegt *::selection, .hinterlegt::selection {
	background-color: #29a; }

i, em { font-style: italic; }
b, strong { font-weight: bold; }
b a, strong a { text-decoration:underline; }
i b, i strong, em b, em strong {
	font-style: normal; font-weight: bold; }
b i, b em, strong i, strong em {
	font-style: italic; font-weight: normal; }

.wichtig { color:#d31; font-weight:bold; }
.wichtig a { text-decoration:underline; } /* Link beim umgebenden roten, fetten Text zusätzlich unterstreichen (für Farbenblinde) */

sup, sub { font-size: .75em; line-height: 0; position: relative;
	vertical-align: baseline; }
sup { top: -.5em; }
sub { bottom: -.25em; }

kbd { font: .9em/1 Monaco,Consolas,'Source Code Pro','DejaVu Sans Mono',monospace;
	display: inline-block; border: 1px solid #888; border-radius: .2em;
	padding: .2em .4em; margin: 0 .2em;
	box-shadow: .05em .1em 0px rgba(0,0,0,.2), .1em .15em 0 #fff inset;
	background-color: #eee;
}

big { font-size:120%; } /* unschön, besser nicht verwenden */
small { font-size: 83%; }

hr { box-sizing: content-box; display: block; margin: 1.45em 0;
	padding: 0; height: 1px; border: 0; border-top: 1px solid #888; }
.hr-double { border-top-width: 3px; border-style: double;
	margin:1.37em 0}

/* LINKS ------------------------------------------------------------ */

a { text-decoration: none; color: #29a; font-weight: bold;
	background-color: transparent; } /* IE10 sonst grauer Hintergrund */
a:visited { color: #74b; }
a:hover, a:active { color: #d31; }
a:focus { outline: 1px dotted #444; }
main .selflink { padding:0 .2em .05em; color: #fff;
	background-color: #29a; }

main :target { background-color: transparent;
	-webkit-animation: target-fade 1.4s; animation: target-fade 1.4s; }
@-webkit-keyframes target-fade { 0% { background-color: #dee; } }
@keyframes target-fade { 0% { background-color: #dee; } }

/* SHARER-FÄHNCHEN -------------------------------------------------- */

#sharer { margin: .8em 0 .9em; padding: .6em 2.5% .7em; background-color: #eee; background-color: hsla(0,0%,92%,.8); }
#sharer h3 { margin-top:.05em; }
#sharer a { display: inline-block; margin: 0 .4em ; }

@media (min-width: 45em) { /* Sharer klein nach rechts unten */
#sharer { position: fixed; bottom: 2.5em; left: 0; z-index: 1;
	padding:.2em .3em .2em .6em; box-shadow: 0 0 3px #aaa; }
#sharer a { display: block; margin: 0; width: 1.5em; }
#sharer h3, #sharer a span { display: none; } }

/* ICONS ------------------------------------------------------------ */

nav li a:not(:only-child):after,
a[class^="icon"]:before, a[class^="icon"]:after,
a[href^='mailto:']:before, a[target='_blank']:after,
a[href$='?action=edit']:after, a[href*='?action=upload']:after {
	display: inline-block; margin:0 0 -.2em .2em;
	vertical-align:-9%; width:1em; }

nav li a:not(:only-child):after, nav:target li li a:not(:only-child):after { width:.75em; margin-left:.4em; vertical-align:0; content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2014%2014%22%20preserveAspectRatio%3D%22xMinYMin%20meet%22%3E%3Cpath%20style%3D%22fill%3Anone%3Bstroke%3A%23888%3Bstroke-width%3A3%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%22%20d%3D%22m%201%2C5%206%2C6%206%2C-6%22%20%2F%3E%3C%2Fsvg%3E"); } /* Icon: ⮟ */
nav li li a:not(:only-child):after { vertical-align:-3%; content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2014%2014%22%20preserveAspectRatio%3D%22xMinYMin%20meet%22%3E%3Cpath%20style%3D%22fill%3Anone%3Bstroke%3A%23888%3Bstroke-width%3A3%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%22%20d%3D%22M%201%2C12%206%2C7%201%2C2%22%20%2F%3E%3C%2Fsvg%3E"); } /* Icon: ⮞ */

a[class^="icon"]:before, a[href^='mailto:']:before {
	margin-right:.3em; }
a[target='_blank']:after, a[href$='?action=edit']:after,
	a[href*='?action=upload']:after { margin-left:.3em; }

a[href^='mailto:']:before { content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2014%2014%22%20preserveAspectRatio%3D%22xMinYMin%20meet%22%3E%3Cpath%20style%3D%22fill%3Anone%3Bstroke%3A%2329a%3Bstroke-width%3A1.5%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%22%20d%3D%22M%2013%2C4%2013%2C12%201%2C12%201%2C4%207%2C9%2013%2C4%201%2C4%22%20%2F%3E%3C%2Fsvg%3E"); } /* Icon: ✉ */
a[target='_blank']:after { content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2014%2014%22%20preserveAspectRatio%3D%22xMinYMin%20meet%22%3E%3Cg%20style%3D%22fill%3Anone%3Bstroke%3A%2329a%3Bstroke-width%3A1.5%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%22%20%3E%0A%09%09%3Cpath%20d%3D%22m%203%2C4%20-2%2C0%200%2C7%207%2C0%200%2C-2%22%20%2F%3E%0A%09%09%3Cpath%20d%3D%22M%204%2C8%2010%2C2%206%2C2%22%20%2F%3E%0A%09%09%3Cpath%20d%3D%22M%2010%2C6%2010%2C2%22%20%2F%3E%0A%09%3C%2Fg%3E%3C%2Fsvg%3E"); } /* Icon: ➚ */
/* Icon nicht für externe Links in oberster Ebene im Klappmenü */
#klappmenue > ul > li > a[target='_blank']:after { margin:0; content:'';}

a[href$='?action=edit']:after { content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2014%2014%22%20preserveAspectRatio%3D%22xMinYMin%20meet%22%3E%3Cg%20style%3D%22fill%3Anone%3Bstroke%3A%23d31%3Bstroke-width%3A1.5%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%22%3E%0A%09%09%3Cpath%20d%3D%22M%201%2C11%201%2C8%207%2C2%2010%2C5%204%2C11%20z%22%20%2F%3E%0A%09%09%3Cpath%20d%3D%22m%202%2C7%203%2C3%22%20%2F%3E%0A%09%3C%2Fg%3E%3C%2Fsvg%3E"); } /* Icon: ✎ */

/* Stile überschreiben für Upload-Links, die auf Bilder verweisen */
a[href*='?action=upload'] { display:inline !important; }
a[href*='?action=upload']:after { content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2014%2014%22%20preserveAspectRatio%3D%22xMinYMin%20meet%22%3E%3Cpath%20d%3D%22M1.03%207.82v2.025h8v-2m-3.97-.827v-5l-2%202m2-2l2%202%22%20stroke-linejoin%3D%22round%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20fill%3D%22none%22%20stroke%3D%22%23d31%22%2F%3E%3C%2Fsvg%3E") !important; position:relative !important; top: 0 !important; left: 0 !important; width: 1.1em !important; } /* Icon 📤 */

/* Maillinks und Links mit Icon ohne zusätzliches Symbol danach */
a[class^="icon"]:after, a[href^='mailto:']:after {
	content: ''; width:0; margin-left:0; }

a.icon-facebook:before { content: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill-rule%3D%22evenodd%22%20fill%3D%22%233B5998%22%20clip-rule%3D%22evenodd%22%20stroke-linejoin%3D%22round%22%20stroke-miterlimit%3D%221.414%22%3E%3Cpath%20d%3D%22M15.117%200H.883C.395%200%200%20.395%200%20.883v14.234c0%20.488.395.883.883.883h7.663V9.804H6.46V7.39h2.086V5.607c0-2.066%201.262-3.19%203.106-3.19.883%200%201.642.064%201.863.094v2.16h-1.28c-1%200-1.195.48-1.195%201.18v1.54h2.39l-.31%202.42h-2.08V16h4.077c.488%200%20.883-.395.883-.883V.883C16%20.395%2015.605%200%2015.117%200%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E"); }
a.icon-whatsapp:before { content: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill-rule%3D%22evenodd%22%20fill%3D%22%2325D366%22%20clip-rule%3D%22evenodd%22%20stroke-linejoin%3D%22round%22%20stroke-miterlimit%3D%221.414%22%3E%3Cpath%20d%3D%22M11.665%209.588c-.2-.1-1.177-.578-1.36-.644-.182-.067-.315-.1-.448.1-.132.197-.514.643-.63.775-.116.13-.232.14-.43.05-.2-.1-.842-.31-1.602-.99-.592-.53-.99-1.18-1.107-1.38-.116-.2-.013-.31.087-.41.09-.09.2-.23.3-.35.098-.12.13-.2.198-.33.066-.14.033-.25-.017-.35-.05-.1-.448-1.08-.614-1.47-.16-.39-.325-.34-.448-.34-.115-.01-.248-.01-.38-.01-.134%200-.35.05-.532.24-.182.2-.696.68-.696%201.65s.713%201.91.812%202.05c.1.13%201.404%202.13%203.4%202.99.476.2.846.32%201.136.42.476.15.91.13%201.253.08.383-.06%201.178-.48%201.344-.95.17-.47.17-.86.12-.95-.05-.09-.18-.14-.38-.23M8.04%2014.5h-.01c-1.18%200-2.35-.32-3.37-.92l-.24-.143-2.5.65.67-2.43-.16-.25c-.66-1.05-1.01-2.26-1.01-3.506%200-3.63%202.97-6.59%206.628-6.59%201.77%200%203.43.69%204.68%201.94%201.25%201.24%201.94%202.9%201.94%204.66-.003%203.63-2.973%206.59-6.623%206.59M13.68%202.3C12.16.83%2010.16%200%208.03%200%203.642%200%20.07%203.556.067%207.928c0%201.397.366%202.76%201.063%203.964L0%2016l4.223-1.102c1.164.63%202.474.964%203.807.965h.004c4.39%200%207.964-3.557%207.966-7.93%200-2.117-.827-4.11-2.33-5.608%22%2F%3E%3C%2Fsvg%3E"); }
a.icon-twitter:before { content: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill-rule%3D%22evenodd%22%20fill%3D%22%231DA1F2%22%20clip-rule%3D%22evenodd%22%20stroke-linejoin%3D%22round%22%20stroke-miterlimit%3D%221.414%22%3E%3Cpath%20d%3D%22M16%203.038c-.59.26-1.22.437-1.885.517.677-.407%201.198-1.05%201.443-1.816-.634.37-1.337.64-2.085.79-.598-.64-1.45-1.04-2.396-1.04-1.812%200-3.282%201.47-3.282%203.28%200%20.26.03.51.085.75-2.728-.13-5.147-1.44-6.766-3.42C.83%202.58.67%203.14.67%203.75c0%201.14.58%202.143%201.46%202.732-.538-.017-1.045-.165-1.487-.41v.04c0%201.59%201.13%202.918%202.633%203.22-.276.074-.566.114-.865.114-.21%200-.41-.02-.61-.058.42%201.304%201.63%202.253%203.07%202.28-1.12.88-2.54%201.404-4.07%201.404-.26%200-.52-.015-.78-.045%201.46.93%203.18%201.474%205.04%201.474%206.04%200%209.34-5%209.34-9.33%200-.14%200-.28-.01-.42.64-.46%201.2-1.04%201.64-1.7z%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E"); }


/* BILDER ----------------------------------------------------------- */

img { border: 0; max-width: 100%; }
p + img, img + p, p + .imgonly, .imgonly + p  { margin-top:.75em; }
aside img { max-width: 96.5% }
.lfloat > img, .rfloat > img { max-width: 100%; }

.lfloat, .rfloat, .halblinks, .halbrechts {
	width: 100%; margin: .7em 0; line-height: inherit; position:relative; }

.lfloat, .halblinks { float: left; }
.rfloat, .halbrechts { float: right; }
.lfloat h1, .lfloat h2, .lfloat h3, .lfloat h4, .lfloat h5, .lfloat h6,
.rfloat h1, .rfloat h2, .rfloat h3, .rfloat h4, .rfloat h5, .rfloat h6
	{ margin-top: -.4em; }
.halblinks h2, .halbrechts h2 { margin-top: .4em; }

@media (min-width: 23em) {
	.lfloat, .rfloat { max-width: 50%; width: auto; margin: .5em 0 .2em; }
	.lfloat.lfloat { margin-right:1em; }
	.rfloat.rfloat { margin-left:1em; } }
@media (min-width: 38em) {
	.halblinks, .halbrechts
		{ width: 100%; max-width: 47%; margin: .5em 0 .2em; }
	.halblinks p, .halbrechts p { text-align: left; } }
@media (min-width: 45em) {
	.lfloat, .rfloat:not(.innerhalb) { max-width: 66%; }
	.lfloat.lfloat { left:-10%; margin-right:-7%; }
	.rfloat.rfloat { right:-16%; margin-left: -13%; }
	.rfloat.rfloat.innerhalb { right:0; margin-left: 3%; }
	.hinterlegt .lfloat, .hinterlegt .lfloat { max-width: 40%; }
	.hinterlegt .lfloat.lfloat { margin-right:.7em; left:0; }
	.hinterlegt .rfloat.rfloat { margin-left:.7em; right:0; } }

.frame.frame { border: 1px solid #888; padding: .7em .7em .45em;
	background-color: #eee; }

/* Bilderblock */

.bilderblock { padding: .5em 0 .1em; display:block; clear:left; }
.bilderblock:after { content: ""; clear: both; }
.bilderblock img { width:32%; margin: 0 1% 1% 0; float:left;
	height:100px; -o-object-fit:cover; object-fit:cover; }
	/* evtl. besser mit background-size: cover? Als Hintergrundbild im Link? */
.vollbildlink { background-color: #dee; display: inline-block;
	position: relative; left: -1.7em; float: left; margin-right: -1.7em;
	width: 1em; text-align: center; }

@media (min-width: 28em) { /* 4 Bilder nebeneinander */
.bilderblock img { width:24%; } }

@media (min-width: 34em) { /* 5 Bilder nebeneinander */
.bilderblock img { width:19%; } }

/* Wenn Bilder in Randspalte ausgerückt, dann zwei nebeneinander */
aside .bilderblock img { width:47%; margin: 0 2.5% 3% 0; }

/* BaguetteBox (unsere Lightbox) */

a[href$=".jpg"] img, a[href$=".jpeg"] img, a[href$=".gif"] img, a[href$=".png"] img { cursor: zoom-in; }
/* Lupen-Symbol in der Ecke eines vergrößerbaren Bildes
 * erzeugt eine fehlerhafte Anzeige bei Textlinks, die auf ein Bild verlinken */
a[href$=".jpg"]:not(.ohne-lupe), a[href$=".jpeg"]:not(.ohne-lupe), a[href$=".gif"]:not(.ohne-lupe), a[href$=".png"]:not(.ohne-lupe) {
	position: relative; display: block; }
a[href$=".jpg"]:not(.ohne-lupe):after, a[href$=".jpeg"]:not(.ohne-lupe):after, a[href$=".gif"]:not(.ohne-lupe):after, a[href$=".png"]:not(.ohne-lupe):after { /* SVG-Lupe */
	position:absolute; top: 5px; left:5px; width:1.5em; height:auto;
	border-radius:.15em; pointer-events:none; content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%22-1%20-1%2016%2014%22%20preserveAspectRatio%3D%22xMinYMin%20meet%22%3E%3Ccircle%20r%3D%223.802%22%20cx%3D%227.752%22%20cy%3D%225.492%22%20fill%3D%22none%22%20stroke%3D%22%23444%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M4.502%208.742l-3%203%22%20stroke%3D%22%23444%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E"); background-color: #ccc; background-color: hsla(0,0%,100%,.7); }
.bilderblock a[href$=".jpg"]:nth-child(n+2):after, .bilderblock a[href$=".jpeg"]:nth-child(n+2):after, .bilderblock a[href$=".gif"]:nth-child(n+2):after, .bilderblock a[href$=".png"]:nth-child(n+2):after {content:''; padding: 0;}

/* Lightbox schließt auch bei Klick auf das Bild */
[id^="baguetteBox-figure"] img { pointer-events: none; }

/* baguetteBox.js Version 1.6.1, github.com/feimosi/baguetteBox.js */

#baguetteBox-overlay { display: none; opacity: 0; overflow: hidden;
	position: fixed; top: 0; left: 0; width: 100%; height: 100%;
	z-index: 30;
	background-color: #222; background-color: rgba(0, 0, 0, .8);
	transition: opacity .5s ease; }
#baguetteBox-overlay.visible { opacity: 1; }
#baguetteBox-overlay .full-image { display: inline-block;
	position: relative; width: 100%; height: 100%; text-align: center; }
#baguetteBox-overlay .full-image figure {
	display: inline; margin: 0; height: 100%; }
#baguetteBox-overlay .full-image img { display: inline-block;
	width: auto; height: auto; max-height: 100%; max-width: 100%;
	vertical-align: middle; box-shadow: 0 0 8px rgba(0, 0, 0, .6); }
#baguetteBox-overlay .full-image figcaption { display: block;
	position: absolute; bottom: 0; width: 100%; text-align: center;
	line-height: 1.8; white-space: normal; color: #eee;
	background-color: #444; background-color: rgba(0, 0, 0, .8);
	padding: .3em 5% .6em; }
#baguetteBox-overlay .full-image:before {	content: "";
	display: inline-block; height: 50%; width: 1px; margin-right: -1px; }
#baguetteBox-slider { position: absolute; left: 0; top: 0;
	height: 100%; width: 100%; white-space: nowrap;
	transition: left .4s, transform .4s; }
#baguetteBox-slider.bounce-from-right {
	-webkit-animation: bounceFromRight .4s ease-out;
	animation: bounceFromRight .4s ease-out; }
#baguetteBox-slider.bounce-from-left {
	-webkit-animation: bounceFromLeft .4s ease-out;
	animation: bounceFromLeft .4s ease-out; }

@-webkit-keyframes bounceFromRight {
	0%, 100% { margin-left: 0; }
	50% { margin-left: -30px; } }

@keyframes bounceFromRight {
	0%, 100% { margin-left: 0; }
	50% { margin-left: -30px; } }

@-webkit-keyframes bounceFromLeft {
	0%, 100% { margin-left: 0; }
	50% { margin-left: 30px; } }

@keyframes bounceFromLeft {
	0%, 100% { margin-left: 0; }
	50% { margin-left: 30px; } }

.baguetteBox-button#next-button, .baguetteBox-button#previous-button {
	top: 50%; top: calc(50% - 30px); width: 44px; height: 60px; }

.baguetteBox-button { position: absolute; cursor: pointer; padding: 0;
	margin: 0; border: 0; border-radius: 15%; background-color: #333;
	background-color: rgba(0,0,0,.2); color: #eee;
	transition: background-color .4s; }
.baguetteBox-button:hover,.baguetteBox-button:focus { background-color: hsla(190,33%,60%,.8); }
.baguetteBox-button#next-button { right: 2%; }
.baguetteBox-button#previous-button { left: 2%; }
.baguetteBox-button#close-button { width: 30px; height: 30px;
	top: 20px; right: 2%; right: calc(2% + 6px); }
.baguetteBox-button svg { position: absolute; left: 0; top: 0; }

/* Preloader, borrowed from http://tobiasahlin.com/spinkit/ */
.baguetteBox-spinner { width: 40px; height: 40px; display: inline-block;
	position: absolute; top: 50%; left: 50%; background-color:#278;
	margin-top: -20px; margin-left: -20px;
	-webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;animation: sk-rotateplane 1.2s infinite ease-in-out; }

@-webkit-keyframes sk-rotateplane {
	0% { -webkit-transform: perspective(120px) }
	50% { -webkit-transform: perspective(120px) rotateY(180deg) }
	100% { -webkit-transform: perspective(120px) rotateY(180deg)	rotateX(180deg) } }

@keyframes sk-rotateplane {
	0% {-webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg); transform: perspective(120px) rotateX(0deg) rotateY(0deg); }
	50% {-webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) }
	100% {-webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } }

/* VIDEOS */

video, .video-extern { margin:1.1em 0 .8em; width:100%;
	background-color: #888; }

/* div bei mp4-Videos mit Upload-Links für angemeldete Editoren */
.video-upload { position: absolute; margin-top: 2.1em; padding: .2em;
	background-color: hsla(0, 0%, 100%, .7); font-size:.75em;
	z-index: 1;}
.video-upload a { display: inline-block; padding: 0 .5em; }

/* Zusätzlichens für externe Videos im iframe */
.video-extern { position: relative; height:0; padding-bottom:56.2%;
	/* 16:9-Format → Höhe = Breite × 0,5625 */ }
.video-extern iframe, .video-extern object { position: absolute;
	top: 0; left: 0; width: 100%; height: 100%; border: 0; }

@media (min-width: 54em) {
	/* Artikel-Video kann ausgerückt werden */
	.artikel-video { position:relative; float:left; left:-20%; margin:-.7em -17.5% -.7em 0; width:67.5%; }
	.artikel-video:empty { display: none; } }


/* NACHRICHTEN ------------------------------------------------------ */

.nachricht { clear:left; display:block; }
.nachricht:after { clear:both; }
.nachricht + .nachricht { border: 1px solid transparent; }
	/* Hack, damit die Nachricht in einer Nachrichtenliste auch genug Abstand hält, wenn der vorangehende Nachrichtentext kürzer als das zugehörige gefloatete Foto ist. */

aside .nachricht { border:none; border-bottom: 1px solid #bbb;
	margin-bottom:.75em;
	/* Spaltenumbruch verhindern */
	break-inside: avoid-column; /* IE 11 */ display:table; /* FF 20+ */
	-webkit-column-break-inside: avoid; /* Chrome, Safari */
	page-break-inside: avoid; /* Theoretisch für FF 20+ */}
aside .nachricht img { position: relative; top:.75em; }

.nachricht-datum { font-weight: bold; position:relative; top:-.9em; }
aside .nachricht-datum { text-align:right; padding-right:3%;
	top:-.7em;}

/* Toggle-Button */

[aria-hidden="true"] { display: none; }

button[data-a11y-toggle] { display: inline-block; font-weight:bold;
	margin-left: .2em; padding: 0 .4em; border: 0; cursor:pointer;
	background-color: #dee; color:#278; transition: .2s; }

button[data-a11y-toggle][aria-expanded="true"] {
	background-color: #dee; color:#888; margin-bottom:.8em; }

/* Toggle-Button bei Nachrichten: dynamische Beschriftung */
button.weiterlesen[data-a11y-toggle]:after {
	position:relative; top:-.05em; content:"mehr »"; }
button.weiterlesen[data-a11y-toggle][aria-expanded="true"]:after {
	content:"« weniger" }

/* Kommentare*/

.kommentar-socialmedia { background-color: #eee; clear:left; }
	/* restliche Stile erreicht man mit .hinterlegt */
.kommentar-socialmedia:after { clear: both; }

#kommentare { margin-top: 1.45em; border-top: 1px solid #888;
	padding: 1.45em 0 .75em; }
#kommentare:target { -webkit-animation: none; animation: none; }
[id^="comment"] { margin-top:1.5em; background-color: #eee; }
[id^="comment"]:target { background-color: #dee; }

.kommentar-datum { padding-left:.2em; font-size: 83%;
	font-weight: normal; font-style: italic; }
.kommentar-datum:before { content:'\2014'; margin-right:.75ch }

.kommentar-formular { margin-top: 2.25em; }
/* Für das Kommentar-Formular siehe auch Abschnitt „Formulare“ unten */

/* LISTEN, CODE, ZITATBLÖCKE ---------------------------------------- */

main ul, main ol {
	margin: .75em 0 .75em -2.5em; list-style-position: outside; }
main ul li, main ol li { position: relative; left: 1.2em;
	margin-right: 1.2em; pointer-events: none; }
/* Listenpunkt mit position und left damit er auch Abstand bei links daneben gefloateten Elementen hält (wäre mit margin-left nicht so). Dadurch überdeckt das li aber benachbarte Floats, die sich nicht mehr klicken lassen. Also mit pointer-events: none „durchlässig“ machen und die Inhalte in diesem li wieder auf pointer-events: normal */
main ul li *, main ol li * { pointer-events: auto; }

main ul ul, main ol ul { margin:0 0 0 -2.5em; }
main ul ol, main ol ol { margin:0 0 0 -1.75em; }

main ul { list-style-type: square; }
main ul ul { list-style-type: circle; }
main ul ul ul { list-style-type: disc; }

main ol { list-style-type: decimal; }
main ol ol { list-style-type: lower-alpha; }
main ol ol ol { list-style-type: decimal; }

main li p { margin: .75em 0; }

/* Korrekturen für IE und Edge:
 1. list-style: inside, damit die Aufzählungspunkte einer Liste neben einem linksgefloateten Bild nicht über selbigen liegen
 2. pointer-events für main ul li komplett rückgängig, weil der Selektor main ul li * im IE/Edge nicht funktioniert
 * Hacks laut https://browserstrangeness.github.io/css_hacks.html */

/* Edge */
@supports (-ms-ime-align:auto) {
	main ul, main ol { list-style-position: inside; }
	main ul ul, main ol ul, main ul ol, main ol ol { margin-left: 0; }
	main ul li, main ol li { position: static; margin-right: 0; pointer-events: auto; }
	main li p { padding-left:.9em; }
	main li p:first-child { margin-top: -1.5em; }
}

/* IE11- (ohne IE8) */
@media screen and (min-width:0\0) and (min-resolution:+72dpi), \0screen\,screen\9 {
	main ul, main ol { list-style-position: inside; }
	main ul ul, main ol ul, main ul ol, main ol ol { margin-left: 0; }
	main ul li, main ol li { position: static; margin-right: 0; pointer-events: auto; }
	main li p { padding-left:.9em; }
	main li p:first-child { margin-top: -1.5em; }
}


/* für Liste von Gemeindebriefen */
.gemeindebriefe { margin: .75em 0 0 -4.5em; }
.gemeindebriefe li { list-style: none; display: inline-block;
	text-align: center; margin: 0 .55em 2.25em; }
.gemeindebriefe.gemeindebriefe a:after{ content: '' }

code, pre, samp { padding:.05em .2em; font: .9em/1 Monaco,Consolas,'Source Code Pro','DejaVu Sans Mono',monospace; background-color:#eee; box-decoration-break: clone; }
pre { overflow: auto; }
code { white-space: normal; }
pre > code { white-space: pre; font-size: 1em; line-height: 1.556; }

blockquote { margin: .8em 0 .9em; padding: .6em 2.5% .7em;
	border-left: .7em solid #dee; background-color: #eee; }
blockquote + blockquote { margin-top: 1.7em; }

@media (max-width: 23em) {
blockquote { padding-left: .3em; border-width: .4em; }
}

/* TABELLEN --------------------------------------------------------- */

table { table-layout:fixed; width:100%; display: inline-block;
	margin: 1.3em 0em; border-collapse: collapse; border-spacing: 0;
   border-width: .2em 0; border-style: solid; border-color: #ccc;
   overflow-x: auto;	-webkit-overflow-scrolling: touch; }

td, th { padding: .375em .5em; vertical-align: top;
	border-width: 0 .2em; border-style: solid; border-color: #ccc;}
th { font-weight:bold; background-color: #ccc; }

tr:nth-child(2n+1) { background-color: #eee; }
tr:hover { background-color: #dee; }

@media (min-width: 28em) {
table { table-layout: auto; width: auto; } }

/* FORMULARE -------------------------------------------------------- */

/* Einige Resets für konsistenten Stil in verschiedenen Browsern,
Vorlage: http://necolas.github.io/normalize.css/ Version 4.1.1 */

button, input, optgroup, select, textarea { color: inherit;
	font: inherit; margin: 0; }
button, input { overflow: visible;}
button, select { text-transform: none; }
button, html [type="button"], [type="reset"], [type="submit"] {
	-webkit-appearance: button; font-size:.9em; padding: .083em .4em; }

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
	border-style: none; padding: 0; }
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText; }

textarea { padding: .1em 0 .1em .2em; overflow: auto;
	resize: vertical; }

input[type="checkbox"], input[type="radio"] {
	box-sizing: border-box; padding: 0; }

input[type="search"] { -webkit-appearance: textfield; }
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-input-placeholder { color: inherit; opacity: .6; }
::-ms-input-placeholder { color: inherit; opacity: .6; }
::placeholder { color: inherit; opacity: .6; }
::-webkit-file-upload-button {-webkit-appearance:button; font:inherit; }

[type="text"], [type="search"], [type="password"], [type="email"], [type="url"], [type="tel"], textarea {
	border: 1px solid #bbb; }
[type="text"]:focus, [type="search"]:focus, [type="password"]:focus, [type="email"]:focus, [type="url"]:focus, [type="tel"]:focus, textarea:focus {
	border-color: #29a; }


/* Eigene Anpassungen */

button { border-radius:.2em; }
button:focus { background-color: #fff; }


/* Kommentar-Formular */

form.kommentar-formular label { font-weight: bold; display: block; }
form.kommentar-formular label:after { content: ': '; }
form.kommentar-formular input, form.kommentar-formular textarea {
	margin:.3em 0 .7em; width: 100%; }
form.kommentar-formular input { max-width: 15em; }
form.kommentar-formular input[type="submit"] { float:right;
	margin-left:1.5em; width: auto;}

/* ANPASSUNGEN FÜR DEN AUSDRUCK */

@media print {
*, *:before, *:after { background: transparent !important;
	color: #000 !important; box-shadow: none !important;
	text-shadow: none !important; }
html { background: #fff !important;}

.logo img { width: 2.3em; margin-top: 0; margin-right: 3%; }

.textgroesse, #headerbild, #klappmenue, .menueklapper, #show-menu,
	.suchfeld, #pageactions, nav.artikel-menue, .brotkrumen, footer,
	#baguetteBox-overlay, button[data-a11y-toggle] { display: none; }

main { padding: .7em 3% 3em; }
aside { position:relative; float: none; width: 100%; left: 0; margin:.8em 0 .9em; padding: .6em 2.5% .7em; }

.artikel-video { position:relative; float:none; left:0; margin:-.7em 0; width:100%; }

aside, pre, blockquote, .hinterlegt { border: 2px solid #888; }
pre, blockquote { page-break-inside: avoid; }
blockquote { border-left: .7em solid #ccc;}

.wichtig { text-decoration: underline; }

p, h2, h3 { orphans: 2; widows: 3; }
h2, h3 { page-break-after: avoid; }
abbr[title]:after { content: " (" attr(title) ")"; }

a, a:visited { text-decoration: underline; }
main .selflink { padding:0; }
main a[href]:after, main a[target='_blank']:after {
	font-weight: normal; font-style: italic; font-size: 83%;
	content: " (" attr(href) ")"; width: auto; margin-left:.5em; }
main a[href^="#"]:after, main a[href^="javascript:"]:after, main a[href*="?action=upload"]:after {
	content: ''; }

a[href$=".jpg"]:not(.ohne-lupe):after, a[href$=".jpeg"]:not(.ohne-lupe):after, a[href$=".gif"]:not(.ohne-lupe):after, a[href$=".png"]:not(.ohne-lupe):after { content: ''; } /* kein Lupensymbol */

.lfloat, .rfloat { max-width: 40%; width: auto; margin: .5em 0 .2em; }
.lfloat.lfloat { margin-right: 1em; left: 0; }
.rfloat.rfloat { margin-left: 1em; right: 0; }

thead { display: table-header-group; }
tr, img { page-break-inside: avoid; }
img { max-width: 100% !important; }
}