/* FF Atzenbrugg :: abgeleitet von VS Atzenbrugg  */

/* TODO: Schriften einbinden */

@font-face {
	font-family: 'Barlow';
	src: url('/opmodule/_include/fonts/barlow-v5-latin-regular.woff2') format('woff2'),
	url('/opmodule/_include/fonts/barlow-v5-latin-regular.woff') format('woff'),
	url('/opmodule/_include/fonts/barlow-v5-latin-regular.ttf') format('truetype'),
	url('/opmodule/_include/fonts/barlow-v5-latin-regular.svg#Barlow') format('svg');
}

@font-face {
	font-family: 'Barlow-500';
	src: url('/opmodule/_include/fonts/barlow-v5-latin-500.woff2') format('woff2'),
	url('/opmodule/_include/fonts/barlow-v5-latin-500.woff') format('woff'),
	url('/opmodule/_include/fonts/barlow-v5-latin-500.ttf') format('truetype'),
	url('/opmodule/_include/fonts/barlow-v5-latin-500.svg#Barlow') format('svg');
}

@font-face {
	font-family: 'Barlow-700';
	src: url('/opmodule/_include/fonts/barlow-v5-latin-700.woff2') format('woff2'),
	url('/opmodule/_include/fonts/barlow-v5-latin-700.woff') format('woff'),
	url('/opmodule/_include/fonts/barlow-v5-latin-700.ttf') format('truetype'),
	url('/opmodule/_include/fonts/barlow-v5-latin-700.svg#Barlow') format('svg');
}

@font-face {
	font-family: 'Barlow-800';
	src: url('/opmodule/_include/fonts/barlow-v5-latin-800.woff2') format('woff2'),
	url('/opmodule/_include/fonts/barlow-v5-latin-800.woff') format('woff'),
	url('/opmodule/_include/fonts/barlow-v5-latin-800.ttf') format('truetype'),
	url('/opmodule/_include/fonts/barlow-v5-latin-800.svg#Barlow') format('svg');
}



:root {
	/* definierten Farben */
	--cd-rot: #C03E1D;
	--cd-rot-hover: #CCCCCC;
	--bg-greige: #F1F1F1;
}




body { background-color: var(--bg-greige) }

body, input {
	font-family: "Istok Web", Arial, Sans-Serif;
	color: #444444;
	font-size: 110%;
}


h1 {
	font-family: "Istok Web", Arial, Sans-Serif;
	font-weight: normal;
	font-size: 90%;
	text-transform: none;
	letter-spacing: 1px;
	color: #FFFFFF;
	background-color:#444444;
	padding-left: 0px;
	margin-top: 30px;
	padding-bottom: 0px;
	display: inline-block;
	padding: 7px;
}

h2 {
	font-family: "Istok Web", Arial, Sans-Serif;
	font-weight: normal;
	font-size: 140%;
	line-height: 115%;
	color: var(--cd-rot);
	margin-bottom: 12px;
	padding-top: 0px;
}

h3 {
	font-family: Barlow-500, Arial, Sans-Serif;
	font-weight: normal;
	font-size: 120%;
	color: #555555;
	margin-top: 0px;
	margin-bottom: 0px;
}




a            { text-decoration: none } 
a:link		 { color: var(--cd-rot) }
a:visited	 { color: var(--cd-rot) }
a:active	 { color: var(--cd-rot) }
a:hover		 { color: #444444; text-decoration: none }
a:focus		 { outline: none }
a:focus-visible { outline: 3px solid #000; outline-offset: 3px }



.nowrap { white-space: nowrap }

.news_text  img { max-width:100%; height:auto }

.reiter  { width:90px; text-align:center; font-family: "Istok Web", sans-serif; font-size: 15px; letter-spacing:0px; background-color:#F4F4F4;border-left:0px solid #888888;border-bottom:2px solid #023770; margin-right:1px; margin-bottom:5px; float:left; display:inline; padding:5px; padding-left:3px; padding-right:3px; }
.reiter a { text-decoration: none }
.reiter a:link     { color: #023770 }
.reiter a:visited	 { color: #023770 }
.reiter a:active	 { color: #023770 }
.reiter a:hover	 { color: #000000; background-color: #CCCCCC }

.reiter_akt  { width:90px; text-align:center; font-family: "Istok Web", sans-serif; font-size: 15px; letter-spacing:0px; background-color:#023770; border-left:0px solid #888888;border-bottom:2px solid #023770; margin-right:1px; margin-bottom:5px; float:left; display:inline; padding:5px; padding-left:3px; padding-right:3px; }
.reiter_akt a  { text-decoration:none }
.reiter_akt a:link { color: #FFFFFF }
.reiter_akt a:active { color: #FFFFFF }
.reiter_akt a:visited { color: #FFFFFF }


/* Zebra Tabelle mit Hover, Rauch */

.tabelle { width: 100%; border-collapse:collapse; }
.tabelle td, .tabelle th { padding: 5px 12px; border-bottom: 3px solid #FFFFFF; text-align:left; vertical-align: text-top }
/*.tabelle td a { display:block } */
.tabelle th { background-color: #A7CB19; color: #FFFFFF; font-weight:bold }
.tabelle tr:nth-child(1n+1) { background-color: #B0D8DE; color: #000000 }
.tabelle tr:nth-child(2n+2) { background-color: #E1F0F2; color: #000000 }
.tabelle tr:hover { background-color: #CCCCCC; color: #000000 }

.thead { background-color:#888888; color: #FFFFFF } 


/* Standard-Styling entfernen */
.news_text ul {
	list-style: none;
	padding-left: 0; /* Keine Einrückung der gesamten Liste */
	margin: 20px 0;
}

	.news_text ul li {
		position: relative;
		padding-left: 25px; /* Nur Platz für den Punkt selbst lassen */
		margin-bottom: 12px;
		line-height: 1.5;
	}

		/* Der große, runde orange Punkt */
		.news_text ul li::before {
			content: "";
			position: absolute;
			left: 0;
			top: 0.4em; /* Zentriert den Punkt optisch zur ersten Textzeile */
			width: 14px; /* Schön groß */
			height: 14px;
			background-color: var(--cd-rot);
			border-radius: 50%;
			display: inline-block;
		}













.footer { color: #FFFFFF; background-color: var(--cd-rot); font-size: 100%; padding-top: 20px }



/* FUNKTIONALE LINKS, NICHT UMBRECHEN */

.weblink:before { font-family: 'Font Awesome 5 Free'; content: "\f105";	display: inline-block; padding-right: 5px; margin-top: -5px; vertical-align: middle; font-weight: 900 }

.maillink:before { font-family: "Font Awesome 5 Free"; content: "\f0e0"; display: inline-block;	padding-right: 3px;	vertical-align: middle;	font-weight: 900 }

.pdf:before { font-family: 'Font Awesome 5 Free'; content: "\f1c1"; display: inline-block; padding-right: 7px; margin-top: -5px; vertical-align: middle; font-weight: 900; font-size:130% }
.xls:before, .xlsx:before { font-family: 'Font Awesome 5 Free'; content: "\f1c3"; display: inline-block; padding-right: 7px; margin-top: -5px; vertical-align: middle; font-weight: 900; font-size: 130% }
.doc:before { font-family: 'Font Awesome 5 Free'; content: "\f1c2"; display: inline-block; padding-right: 7px; margin-top: -5px; vertical-align: middle; font-weight: 900; font-size: 130% }

.weblink, .maillink, .pdf, .xls, .xlsx, .doc, .docx { white-space: nowrap }



/* BUTTONS / EIGENE */

.btn { background-color: var(--cd-rot); color:#FFFFFF; font-size:120%; font-family: "Istok Web"; text-transform: none;  border-radius:8px; transition: background-color 0.3s, transform 0.2s; }
.btn:hover { color: #F4F4F4; background-color:#888888; transform: translateY(-2px); }
.btn:link,.btn:visited { color: #FFFFFF }
.btn:hover { color: #F4F4F4 }


.weiter { color:#FFFFFF; background-color:var(--cd-rot); font-family: "Istok Web"; font-weight:bold; font-size:18px; text-transform:uppercase; letter-spacing:1px; border:0px; margin-top:0px; padding:5px; padding-left:7px; padding-right:7px; border-radius:3px }
a.weiter:link, a.weiter:visited { color:#FFFFFF }

.zurueck { color:#FFFFFF; background-color:var(--cd-rot); font-family: "Istok Web"; font-weight:bold; font-size:18px; text-transform:uppercase; letter-spacing:1px; border:0px; padding:5px; padding-left:7px; padding-right:7px; border-radius:3px; margin-left:0px }
a.zurueck:link, a.zurueck:visited { color:#FFFFFF }

.print { color:#FFFFFF; background-color:var(--cd-rot); font-family: "Istok Web"; font-weight:bold; font-size:18px; text-transform:uppercase; letter-spacing:1px; border:0px; padding:5px; padding-left:7px; padding-right:7px; border-radius:3px; margin-left:0px }
a.print:link, a.print:visited { color:#FFFFFF }