@charset "utf-8";

/* Fonts */

/* open-sans-300 - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 300;
	src: url('/fonts/open-sans/open-sans-v34-latin-300.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-300.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: url('/fonts/open-sans/open-sans-v34-latin-regular.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-regular.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-500 - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 500;
	src: url('/fonts/open-sans/open-sans-v34-latin-500.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-500.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-500.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600 - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 600;
	src: url('/fonts/open-sans/open-sans-v34-latin-600.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-600.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-700 - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 700;
	src: url('/fonts/open-sans/open-sans-v34-latin-700.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-700.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800 - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 800;
	src: url('/fonts/open-sans/open-sans-v34-latin-800.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-800.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-300italic - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 300;
	src: url('/fonts/open-sans/open-sans-v34-latin-300italic.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-300italic.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-300italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-italic - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 400;
	src: url('/fonts/open-sans/open-sans-v34-latin-italic.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-italic.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-500italic - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 500;
	src: url('/fonts/open-sans/open-sans-v34-latin-500italic.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-500italic.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-500italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600italic - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 600;
	src: url('/fonts/open-sans/open-sans-v34-latin-600italic.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-600italic.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-600italic.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-600italic.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-600italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-700italic - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 700;
	src: url('/fonts/open-sans/open-sans-v34-latin-700italic.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-700italic.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-700italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800italic - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 800;
	src: url('/fonts/open-sans/open-sans-v34-latin-800italic.eot'); /* IE9 Compat Modes */
	src: local(''),
	url('/fonts/open-sans/open-sans-v34-latin-800italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/fonts/open-sans/open-sans-v34-latin-800italic.woff2') format('woff2'), /* Super Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-800italic.woff') format('woff'), /* Modern Browsers */
	url('/fonts/open-sans/open-sans-v34-latin-800italic.ttf') format('truetype'), /* Safari, Android, iOS */
	url('/fonts/open-sans/open-sans-v34-latin-800italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}


/* gültig für alle Elemente */
* {
	box-sizing: border-box; /* Boxmaßen ohne Berücksichtungung von padding, marging, border */
	font-family: Open Sans, sans-serif;
	border:0;
	margin:0;
	padding: 0;
}

html {
	font-size: 62.5%;
	font-weight:400;

}

body {
	background-image: url("/images/background/schmutz-tastatur.jpg");
	background-attachment: fixed;
	background-size: cover;
	background-repeat: no-repeat, repeat;
	overflow-anchor: none;
	text-align: left;
	margin: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
}

.ps {
  overflow: hidden !important;
  overflow-anchor: none;
  -ms-overflow-style: none;
  touch-action: auto;
  -ms-touch-action: auto;
}

.elementsVert{
	display:flex;
	align-items:center;
}

/* Bilder */

img {
	width: 100%;
	height: auto;
}

figure img {
  display: block;
}

/* Überschriften */

h1{
	font-size: 2.5rem;
}

h2{
	font-size: 1.9rem;
}

h3{
	font-size: 1.4rem;
}

h4{
	font-size: 1.3rem;
}

h5{
	font-size: 1.2rem;
}

h6{
	font-size: 1.1rem;
}

/* TEXT */

/* Standardgröße, die zunächst mal überall verwendet wird */
.pfTypoStd{
	font-size: 1.3rem;
}

/* für Artikel, längere Texte etc. */
.pfTypoContent{
	font-size: 1rem;
}

/* für Hinweise, Wichtiges etc. */
.pfTypoAttention{
	font-size: 1.6rem;
}

/* Heraushebungen */
.att {
	color:#bf0131;
	font-weight: bold;
}



.firstline-noindent {
	text-indent: 0;
	text-align: justify;
	line-height: 115%;
	margin-top: 0.1rem;
	margin-bottom: 0;
}

.firstline-indent {
	text-indent: 15px;
	text-align: justify;
	line-height: 115%;
	margin-top: 0.1rem;
	margin-bottom: 0;
}

.headlineBlock{
	width: 100%;
	background-color:black;
	padding: 0.5rem;
	color: white;
	font-weight: bold;
	margin: 0.4rem 0 0.4rem 0;
}

.headlinePage{
	width: 100%;
	background-color:#ccc;
	padding: 0.4rem;
	font-weight: bold;
	font-size: 1.4rem;
	text-align: center;
	text-transform:uppercase;
	margin: 0.4rem 0 0rem 0;
}


.missingInfo {
	color: #F00;
}




/* Links */

a {
	color: black;
}

a:hover{
	color: #dd3233;
}

.whiteLinks{
	color: white;
	text-decoration:underline;
}

.grayLinks{
	color: #ccc;
	text-decoration:underline;
}

/* anderes */

.clear{
	clear: both;
}

.hide {
	display: none;
}
.showFlex {
	display: flex;
}

/* Youtube-Videos */

.video-container {
	margin-top:2rem;
	display:flex;
}

.youtube-video-container {
	position: relative;
	overflow: hidden;
	width: 100%;
}

.youtube-video-container::after {
	display: block;
	content: "";
	padding-top: 56.25%;
}

.youtube-video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.video-box-1 {
	margin-right:2rem;
}

.video-box-2 {
}


/* Audio-Player */
/* https://codeconvey.com/customize-html5-audio-player-css/ */

.audio-player {
	height: 50px;
	width: 100%;
	background: #444;
	box-shadow: 0 0 20px 0 #000a;
	font-family: arial;
	color: white;
	font-size: 1.3rem;
	overflow: hidden;
	display: grid;
	grid-template-rows: 6px auto;
	margin-bottom:1.9rem;
}

.audio-player .timeline {
	background: white;
	width: 100%;
	position: relative;
	cursor: pointer;
	box-shadow: 0 2px 10px 0 #0008;
}

.audio-player .timeline .progress {
	background: coral;
	width: 0%;
	height: 100%;
	transition: 0.25s;
}

.audio-player .controls {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	padding: 0 20px;
}
.audio-player .controls > * {
	display: flex;
	justify-content: center;
	align-items: center;
}

.audio-player .controls .toggle-play.play {
	cursor: pointer;
	position: relative;
	left: 0;
	height: 0;
	width: 0;
	border: 7px solid #0000;
	border-left: 13px solid white;
}
.audio-player .controls .toggle-play.play:hover {
	transform: scale(1.1);
}
.audio-player .controls .toggle-play.pause {
	height: 15px;
	width: 20px;
	cursor: pointer;
	position: relative;
}
.audio-player .controls .toggle-play.pause:before {
	position: absolute;
	top: 0;
	left: 0px;
	background: white;
	content: "";
	height: 15px;
	width: 3px;
}
.audio-player .controls .toggle-play.pause:after {
	position: absolute;
	top: 0;
	right: 8px;
	background: white;
	content: "";
	height: 15px;
	width: 3px;
}
.audio-player .controls .toggle-play.pause:hover {
	transform: scale(1.1);
}

.audio-player .controls .time {
	display: flex;
}
.audio-player .controls .time > * {
	padding: 2px;
}

.audio-player .controls .volume-container {
	cursor: pointer;
	position: relative;
	z-index: 2;
}
.audio-player .controls .volume-container .volume-button {
	height: 26px;
	display: flex;
	align-items: center;
}
.audio-player .controls .volume-container .volume-button .volume {
	transform: scale(0.7);
}

.audio-player .controls .volume-container .volume-slider {
	position: absolute;
	top: 15px;
	left: -3px;
	z-index: -1;
	width: 0;
	height: 15px;
	background: white;
	box-shadow: 0 0 20px #000a;
	transition: 0.25s;
}
.audio-player .controls .volume-container .volume-slider .volume-percentage {
	background: coral;
	height: 100%;
	width: 75%;
}
.audio-player .controls .volume-container:hover .volume-slider {
	left: -123px;
	width: 120px;
}




/* Tabellen */

div.table {
	display: table;
	border-collapse:collapse;
}
div.tr {
	display:table-row;
	margin: 50px;

}
div.td {
	display:table-cell;
}

div.th{
	background-color: #aaa;
	color: white;
	font-weight:bold;
	text-transform: uppercase;
}

.first-col{
	font-weight: bold;
	color:red;
	padding-right:0.8rem;
}

/* Formulare */

.form{
	width:100%;
	display:flex;
	flex-direction: column;
}

.formRow{
	border-bottom:0.4rem solid transparent;
}
.formTopic{
	width:25%;
}
.formData{
	width:75%;
}

input[type=text], input[type=password]{
	border: 1px solid #909090;
	padding: 0.5rem;
}

input[type=text], input[type=password]{
	background-color: #D5FFDD;
}

textarea{
	border: 1px solid #909090;
	padding: 0.5rem;
}

select{
	background-color: white;
	font-size: 1.4rem;
}

input[type=radio]{
	margin-right: 0.5rem;
}

.multiRadio{
	display:flex;
	align-items: center;
}

input[type=checkbox] {
	float: left;
	min-height:12px;
	min-width:12px;
}

input[type=checkbox] {
	/* All browsers except webkit*/
	transform: scale(1.2);
	/* Webkit browsers*/
	-webkit-transform: scale(1.2);
}

.checkboxGroup{
	display: flex;
	gap:1rem;
}

.checkboxWithLabelPair{
	display: flex;
	align-items:center;
	vertical-align: middle;
}

.checkboxLabel{
	padding-left: 0.5rem;
}

.checkbox{
	width:auto;
	height:auto;
}

.label {
	display: block;
	font-size: 1.1rem;
	font-weight: bold;
	padding-top: 12px;
	padding-bottom: 5px;
}


input[type=submit]{
	font-weight: 700;
	color: yellow;
	padding: 0.2rem 0.7rem 0.2rem 0.7rem;
	margin-right: 1rem;
	background-color:black;
	border: 1px solid black;
	text-transform: uppercase;
	font-size: 1.4rem;

}

input[type=submit]:hover{
	background:#dd3233;
	border: 1px solid #dd3233;
	cursor:pointer;
}

.formFieldWarning{
	background-color:#F2BCBD!important;
}

.multiCols{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
}



.mustfieldNotOk {
	border: 2px solid #dc8b92;
}

.mustfield {
	background-color: #f7e741;
}

.formfield-pair{
	padding-top: 0.5rem;
	width:100%;
}

.formfield-topic{
	font-weight: bold;
	display:flex;
	align-items:center;
}

.formfield-content{
	display:flex;
	width:100%;
}

.formfield-data{
}

.formfield-content .formfield-topic{
	padding-left:1rem;
}

/* für Absatand zwischen Topic und Content */
.formfield-content.formfield-data{
	padding-top:0.3rem
}

.formfield-data .cpl-row{
	width:100%;
}



/* ActionMsg */

#actionMsg {
	width: 100%;
	margin-top:3rem;
	margin-bottom: 2%;
}

#actionMsgIntro {
	width: 100%;
	margin-bottom: 0%;
	font-size: 1.3rem;
}

#actionMsg:empty {
	display:none;
}

.actionMsgText {
	font-weight: bold;
	text-align: center;
	color: #000000;
	padding: 1.5%;
	font-size: 1.4rem;
}

.actionMsgOk {
	background-color: #65c507;
}

.actionMsgNotOk {
	background-color: #dd3233;
	color: white;
}

a.actionMsgLinks{
	color:yellow;
	text-decoration: underline;
}

a.actionMsgLinks:hover{
	color: white;
}



/* Listen in Blöcken */

.listInfo{
	width:100%;
	padding:6px;
	text-align:center;
	font-size: 1.6rem;
}

.recordList{
	width: 100%;
}
.recordList .td{
	padding: 0.2rem;
}

.recordList .tb:nth-child(odd) {
	background-color: rgba(175, 175, 175, 0.4);
}

.recordListHeadWithCB{
	background-color:#ddd;
	width:100%;
	padding: 0.3rem 0.4rem 0.3rem 0.4rem;
}

.recordListHeadWithCBEdit{
	width:2rem;
}

.recordListHeadWithCBText{
	color: black;
	font-weight: bold;
	text-transform: uppercase;
	font-size:1.3rem;
}

/* Paginierung */

.pagination{
	width:100%;
	text-align: center;
	padding: 0.4rem 0 1.4rem 0;
}

.pagination p{
	font-weight: bold;
	padding-bottom: 0.3rem;
}

.navOnly p {
	display: none;
}

.pagination input{
	width: 3rem;
	height: 1.3rem;
	margin-left: 0.4rem;
}

.paginationNav{
	display:flex;
	width: 100%;
	align-items:center;
	justify-content: center;
}

.paginationPages{
	padding: 0 0.2rem 0 0.2rem;
}

.pagination input{
	width: 3rem;
	height: 1.5rem;
}




/* Suche */

.searchArea{
	display: flex;
	align-items:flex-start;
}

.searchSimple input{
	width:100%;
	height: 35px;
	font-size: 1.7rem;
	border:1px solid black;
}

.searchGlass {
	background: url("/images/etc/search-glass-41x30.png") no-repeat center ;
	text-indent: -9999em;
}


input[type=submit].searchGlass:hover{
	background: url("/images/etc/search-glass-41x30-hover.png") no-repeat center ;
	background-color:#dd3233;
}

.searchArea{
	width: 100%;
}

.searchSimple .searchInput {
	width:85%;
}
.searchSimple .searchSubmit{
	width:15%;
}

#searchLayer .searchInput{
	width:70%;
}
#searchLayer .searchSubmit{
	width:30%;
}

.multiSearch{
	flex-direction: column;
	width: 100%;
}

.multiSearch input[type=text]{
	width:100%;
	height: 20px;
}

.multiSearch input[type=submit]{
	height: 25px;
	width: 100px;
	margin-top: 0.7rem;
}

.searchRow{
	display:flex;
	width: 100%;
	justify-content: space-between;
	margin-bottom: 0.8rem;
}

.searchElement{
	width:31%;
}

.searchElementLabel{
	margin-bottom:0.3rem;
	font-weight:600;
}
.searchElementInput{
	width:100%;
}

.searchOptions{
	font-size: 1.2rem;
	padding-top:0.5rem;
	padding-bottom:0.5rem;
	margin-right:3rem;
}

.searchOptions a{
	margin-right:1.5rem;
}

/* Seitensuche */

#pageSearch{
	width: 100%;
}

#pageSearch input[type=submit]{
	font-size:1.4rem;
}




/* Kategorien */

.categoryArea{
	display: flex;
	flex-direction: column;
	align-items:flex-start;
	justify-content:left;
	margin-top: 3rem;
	width: 100%;
}

.categoryHead{
	font-size:1.5rem;
	font-weight: 800;
	color: white;
	padding-left: 1.3rem;
	padding-top: 0.7rem;
	padding-right: 1.5rem;
	padding-bottom: 0.6rem;
	text-transform: uppercase;
	background-color: #666;
}

.categoryHeadLine{
	height: 2px;
	width:100%;
	margin-bottom: 2rem;
	background-color: #666;
}

A.categoryHeadLink {
	color: white;
	text-decoration: none;
}

A.categoryHeadLink:hover {
	color: red;
	text-decoration: none;
}

.archive .categoryHead {
	background-color: #65c507;
}

.archive .categoryHeadLine {
	background-color: #65c507;
}

.closeup .categoryHead {
	background-color: #dd3233;
}

.closeup .categoryHeadLine {
	background-color: #dd3233;
}

.editorial .categoryHead {
	background-color: #0c63e4;
}

.editorial .categoryHeadLine {
	background-color: #0c63e4;
}

.feed .categoryHead {
	background-color: blue;
}

.files .categoryHead {
	background-color: #C906E4;
}

.files .categoryHeadLine {
	background-color: #C906E4;
}

.feed .categoryHeadLine {
	background-color: blue;
}

.magazine .categoryHead {
	background-color: #dd3233;
}

.magazine .categoryHeadLine {
	background-color: #dd3233;
}

.on-the-road .categoryHead {
	background-color: #dd3233;
}

.on-the-road .categoryHeadLine {
	background-color: #dd3233;
}

.punksplitter .categoryHead {
	background-color: #dd3233;
}

.punksplitter .categoryHeadLine {
	background-color: #dd3233;
}

.universe .categoryHead {
	background-color:darkmagenta;
}

.universe .categoryHeadLine {
	background-color:darkmagenta;
}

.video .categoryHead {
	background-color: orange;
}

.video .categoryHeadLine {
	background-color: orange;
}




/* TEMPLATE  GENERAL */

/* umschließt alle Seiten-Elemente */
#pageWrapper{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	max-width: 1164px;
	min-width: 300px;
}


/* Top-Bar */
#topBar {
	display: flex;
	align-items: center;
	font-size:1.4rem;
	color: white;
	background-color: #222222;
	height: 36px;
	width:100%;
	justify-content:center;
}

#topBarCore{
	display: flex;
	align-items: center;
	justify-content:space-between;
	width: 91.752577%;
	text-transform: uppercase;
	font-weight: bold;
}

#topBarCore .whiteLinks{
	text-decoration: none;
}

#topBarGuest {
	display: flex;
	align-items: center;
}

#topBarLogin {
	margin-right: 15px;
}

#topBarRegister {
	margin-right: 15px;
}

.topBarCrowdfunding {
	margin-right: 15px;
}

.avatarPreview {
	width: auto;
	height: 100%;
}

#topBarMember {
	display: flex;
	align-items: center;
}

.avatarPreview {
	width: auto;
	height: 100%;
}

#topBarMember .avatarPreview {
	width: 30px;
	height: 30px;
	margin-right: 15px;
}

#topBarMemberName {
	margin-right: 15px;
}

#topBarLogout {
	margin-right: 15px;
}

#topBarSocialMedia {
	display: flex;
	align-items: center;
	width: 160px;
	height: 30px;
}

.smIcons {
	background-color: #B42C2E;
	width: 33px;
	height: 30px;
}

/* Header */

#header{
	display: flex;
	align-items: center;
	background-color:#424242;
	width:100%;
	justify-content:center;
}

#headerCore{
	display: flex;
	width: 91.752577%;
	align-items: center;
	justify-content: space-between;
}

#startLogo{
	width: 40%;
	padding-top: 10px;
	padding-bottom: 12px;
	margin-left: 2%;
	margin-right: 2%;
}

.headerGalleryWrap{
	display: flex;
    justify-content: center;
	width: 25%;
}

/* Linie zwischen Header und Navigation */

#archiveSeparateToNav{
	height: 3px;
	width: 100%;
	background-color: #65c507;
}

#magazineSeparateToNav{
	height: 3px;
	width: 100%;
	background-color: #c50719;
}

/* Navigation */

input#responsive-nav,
label.responsive-nav-label {
	display: none;
}

#nav{
	display: flex;
	align-items: center;
	background-color: #222222;
	width:100%;
	justify-content:center;
	font-size: 1.2rem;
}

#navCore{
	display: flex;
	width: 91.752577%;
	justify-content:space-between;
	z-index: 50;
}

#navMain {
	box-sizing: border-box;
	float: left;
	width: auto;
	background: #222222;
}

#navMain ul {
	margin: 0;
	padding: 0;
	background-color: white;
}

#navMain a {
	display: block;
	color: #fff;
	text-decoration: none;
	font-weight:700;
}

#navMain ul li {
	position: relative;
	float: left;
	list-style: none;
	text-transform: uppercase;
}

/* hover über subelemente */
#navMain ul li:hover {
	background: #666666;
}

#navMain ul li a {
	padding: 16px;
}

#navMain ul ul {
	position: absolute;
	top: -9999px;
	left: -9999px;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
}

#navMainBAK ul ul {
	position: absolute;
	top: -9999px;
	left: -9999px;
	background: #333;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
}

/* 1. Subebene*/

#navMain ul ul li {
	float: none;
	width: 200px;
	text-transform:uppercase;
}

#navMain ul ul li a {
	padding: 10px 20px;
	color:black;
}

#navMain ul li:hover > ul {
	top: 100%;
	left: 0;
}

#navMain ul ul li:hover > ul {
	top: 0;
	left: 200px;
}

#navMain ul li.submenu > a:after {
	position: relative;
	float: right;
	content: '';
	margin-left: 10px;
	margin-top: 5px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #fff;
	border-bottom: 5px solid transparent;
}

#navMain ul ul li.submenu a:after {
	margin-left: auto;
	margin-right: -10px;
	border-left: 5px solid #fff;
	border-right: 5px solid transparent;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
}

#navMain ul ul li:last-child {
	border-bottom: none;
}

.navMainMenu{
	font-weight:800;
	font-size: 1.4rem;
}

.navMainShowMagazine{
	color:yellow;
}

.navMainShowArchive{
	color:yellow;
}

#navSearch {
	width: 36px;
	height: 47px;
}

/* Such-Layer */

#search{
	display: flex;
	background-color: rgba(255, 255, 255, 0.9);
	width:100%;
	justify-content:center;
}

#searchCore{
	position: relative;
	top: 0;
	width: 91.752577%;
	margin:0;
}

#searchLayer{
	position: absolute;
	z-index: 5000;
	top: 3px;
	right:0;
	width: 500px;
	padding: 20px;
	background-color: white;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
	display: none;
}


/* Hauptaufmerksamkeitsbereich */

#attention{
	display: flex;
	background-color: rgba(255, 255, 255, 0.9);
	width:100%;
	justify-content:center;
}

#attentionCore{
	width: 91.752577%;
	margin:0;
}

#areaHeadline{
	font-size:3rem;
	font-weight:bold;
	margin-top:2.7rem;
	margin-bottom:2rem;
	text-transform: uppercase;
	letter-spacing: -0.09rem;
}

/* AnzeigenBanner Top */

#adsTopAds{
	width: 100%;
	justify-content:center;
	background-color: rgba(255, 255, 255, 0.9);
	padding-left: 4.1237115%;
	padding-right: 4.1237115%;
	padding-top: 3px;
}

/* Hauptinhaltsbereich */

#content{
	display: flex;
	flex-wrap:nowrap;
	align-items:flex-start;
	background-color: rgba(255, 255, 255, 0.9);
	padding-bottom: 0px;
	width:100%;
	justify-content:center;

}

#contentCore{
	display: flex;
	width: 91.752577%;
	align-items: flex-start;
	justify-content:center;

}

#main{
	display: flex;
	flex-direction: column;
	align-items:flex-start;
	justify-content:left;
	width: 65.5430712%;

}

#vertSpace{
	width: 4.49438202%;
}

#margin {
	display: flex;
	flex-direction: column;
	align-items:flex-start;
	justify-content:left;
	width: 29.9625468%;
}

/* Fuß */

#footer{
	display: flex;
	align-items: center;
	background-color:#424242;
	width:100%;
	justify-content: center;
	font-size: 1.3rem;
}

#footerCore{
	display: flex;
	width: 91.752577%;
	color: white;
	padding-top: 1rem;
	padding-bottom: 1.5rem;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
}

#footerLogo{
	width:23%;
}

#footerLogo img{
	width:100%;
	height: auto;
}


#footerAbout{
	width:77%;
	padding-left: 4%;
	padding-right: 4%;
}

#footerBar{
	display: flex;
	align-items: center;
	background-color: #222222;
	width:100%;
	justify-content: center;
	font-size: 1.3rem;

}

#footerBarCore{
	display: flex;
	width: 91.752577%;
	align-items: center;
	justify-content:space-between;
	color: white;
	padding-top: 10px;
	padding-bottom: 10px;
}

#footerBarCopyright{
	width: 65%;
}

.footerBarItem{
	text-transform: uppercase;
	font-weight: bold;
	margin-left: 15px;
}

a.footerBarItem{
	color:white;
	text-decoration: none;
}



a.footerLinks{
	color:white;
	text-decoration: none;
}

a.footerLinks:hover{
	color: #65c507;
}

a.footerLinksKN{
	color:white;
	text-decoration:underline;
}
a.footerLinksKN:hover{
	color: #65c507;
}

/* TEMPLATE MASTER_MID_BOX */


#pageWrapper.intro{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	max-width: 480px;
	min-width: 480px;
}

/* umschließt alle Box-Elemente */
#contentWrapperMidBox{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	max-width: 450px;
	min-width: 320px;
}

#contentMidBox{
	display: flex;
	flex-direction: column;
	width: 91.752577%;
	align-items: flex-start;
	justify-content:center;
}

#contentMidBox p.postFirstParagraph {
	font-size: 1.4rem;
	margin-bottom:0.3rem;
}
#contentMidBox p.postParagraph {
	font-size: 1.4rem;
	text-indent: 0;
	margin-bottom:0.3rem;
}

#midBox {
	padding:1.2rem;
}

.headerMidBox{
	background-color:#424242;
}

.logoMidBox{
	background-color:#424242;
	padding: 1rem 1.5rem;
}

#archiveStatsMidBox {
	font-size:1.6rem;
	font-weight: bold;
	color: white;
	text-align: center;
	background-color: #222222;
	padding: 1rem 0.7rem;
}


/* TEMPLATE MASTER_SMALL_BOX */

#contentSmallBox{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	padding:0px;
	max-width: 350px;
	min-width: 350px;
	background-color: rgba(255, 255, 255, 0.9);
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}

#smallBox {
	padding:1.2rem;
}

.headerSmallBox{
	background-color:#424242;
}

.logoSmallBox{
	background-color:#424242;
	padding: 1rem 1.5rem;
}

.textSmallBox {
	font-size: 1.4rem;
}

.formSmallBox input {
	font-family: "Roboto", sans-serif;
	outline: 0;
	background: #ffffff;
	width: 100%;
	border: 0;
	margin: 0 0 1.5rem;
	padding: 1.3rem;
	box-sizing: border-box;
	font-size: 1.5rem;
}

.formSmallBox textarea {
	font-family: "Roboto", sans-serif;
	outline: 0;
	background: #ffffff;
	width: 100%;
	border: 0;
	margin: 0 0 15px;
	padding: 1.3rem;
	box-sizing: border-box;
	font-size: 1.4rem;
}

#archiveStatsSmallBox {
	font-size:1.4rem;
	font-weight: bold;
	color: white;
	text-align: center;
	background-color: #222222;
	padding: 0.6rem 0.2rem;
}



/* SEITENELEMENTE */

#pageHeadline{
	font-weight: 600;
	text-transform: uppercase;
	padding-bottom: 10px;
}

/* Nutzer-Kopf */

#memberHeadSmall{
	display:flex;
	width:100%;
	background-image: url("/images/etc/block_verlauf.jpg");
	border-bottom: 4px solid #ccc;
}

#memberHeadAvatar{
	width: 16%;
	height: auto;
	padding: 2%;
}

.memberHeadAvatarImg{
	border: 5px solid white;
	height: auto;
}

#memberHeadData{
	width: 84%;
	height: auto;
	padding: 3%;
}


#memberHeadData div.td{
	padding-right: 0.4rem;
	padding-bottom: 0.2rem;
}

#memberHeadData div.th{
	text-align: right;
}

#memberHeadName {
	padding-bottom: 0.2rem;
}

#memberHeadInfo {
	font-weight:normal;
	text-transform: uppercase;
	color: #656565;
	padding-bottom: 0.6rem;
}

#memberHeadLinks{
	font-size: 1.2rem;
	margin-top:0.5rem;
}

/* Alben */

#userGalleries{
	display:flex;
	margin-top:10px;
	align-items: center;
}

#userGalleriesCHECK{
	flex-direction: column;
	align-items:flex-start;
}


#userGalleriesHeadline{
	font-weight: bold;
	align-items: center;
	padding-right: 0.5rem;
}

#userGalleriesHeadlineCHECK{
	padding-bottom: 0.3rem;
}

.galleryHead {
	background-color: #ccc;
	margin-top: 20px;
	margin-bottom: 3px;
	margin-left: 2px;
	width:99.5%;
	padding: 5px;
	text-align: center;
	text-transform: uppercase;
}

.galleryContainer{
	width:100%;
	align-content:center;
}

.gallery, .themeGallery, .supporterGallery, .userGallery, .postGallery {
	width: 100%;
	display:flex;
	flex-wrap: wrap;
	justify-content:left;
}

.galleryCell, .supporterGalleryCell, .userGalleryCell, .postGalleryCell{
	flex-basis: 20%;
	height: 20%;
	padding: 0.3%;

}

.galleryImg, .supporterGalleryImg, .userGalleryImg, .postGalleryImg {
	margin-bottom:-0.4rem;
}

.themeGalleryCell{
	flex-basis: 10%;
	height: auto;
	padding: 0;
}

.supporterGalleryCellCaption, .userGalleryCellCaption {
	text-align: center;
	font-size: 1.1rem;
}


/* die Vorschau aufs: Punk-Universum */
.universeGallery {
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
	align-content:stretch;
	width:100%;
}

.universeGalleryImg{
	margin-bottom:-0.4rem;
}

.universeGalleryCell {
	flex-basis: 20%;
	height: 20%;
	padding: 0;
}

/* Das Random-RechercheAlbum */
.rechercheGallery {
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
	align-content:stretch;
	width:100%;
}

.rechercheGalleryImg {
	margin-bottom:0px;
}

.rechercheGalleryCell {
	float:left;
	padding-bottom:0px;
	width: 20%;
}

/* Banner */

.banImgContentImg{

}



/* Kommentare */

/* Block zu Beginn der Kommentarliste */

.headlineBlockWithCB{
	display:inline-block;
	width: 100%;
	background-color:black;
	padding: 0.5rem;
	margin: 1rem 0 1rem 0;
}

.headlineBlockWithCBText{
	color: white;
	font-weight: bold;
}

.headlineBlockWithCBEditAll{
	width: 20px;
}

/* KOMMENTARE */

.commentsArea{
	display: flex;
	flex-direction: column;
	align-items:flex-start;
	justify-content:left;
	width: 100%;
	margin-top: 3rem;
}

/* Checkbox in Kommentarliste */

.td.commentEdit{
	width:20px;
	vertical-align: top;
	padding-top: 5px;
	padding-left: 5px;
}

/* Kommentar-Schreiber in Kommentarliste */

.td.commentCreatorDisplay{
	width:15%;
	padding:0.5rem;
	vertical-align: top;
}

.commentAvatar{
	border: 5px solid white;
	width: 85%;
	height: auto;
}

/* Kommentar-Inhalt in Kommentarliste */

.td.commentContent{
	padding: 1rem;
	vertical-align: top;
}

.commentContentType{
	font-style: italic;
	padding-bottom: 0.4rem;
}

.commentContentText{

}

.commentContentWriter{
	padding-top: 0.5rem;
	font-weight: bold;
}

/* ggf. Bild in Kommentarliste */

.td.commentImgDisplay{
	width:15%;
	padding:0.5rem;
	vertical-align: top;
}

.commentImg{
	border: 5px solid white;
	width: 85%;
	height: auto;
	float:right;
}

/* Kommentar schreiben */

#commentHeadlineWrite{
	width: 100%;
	background-color: black;
	padding: 4px;
	color: white;
	text-align:center;
	font-weight: bold;
	margin-bottom: 10px;
}

.commentTextInput {
	width: 100%;
}




/* BILDLISTE */

.imgList{
	width: 100%;
	font-size: 1.2rem;
}

.imgList input{
	font-size: 1.2rem;
	padding: 0.1rem;
}

.imgList textarea{
	font-size: 1.2rem;
	padding :0.1rem;
}

.imgList select{
	font-size: 1.2rem;
}


.td.imgListImgCell{
	width:128px;
	height:128px;
	vertical-align: top;
}

.imgListImgCell img{
	width: 128px;
	height: 128px;
	margin-right: 6px;
}

.imgListData{
	width: 100%;
}

.td.imgListDataCell{
	display:flex;
	vertical-align: top;
	margin-top:0.2rem;
	margin-bottom:0.3rem;
	margin-left:0.3rem;
}

.cellRow{
	display:flex;
	width:100%;
	margin-bottom:0.3rem;
}

.imgListDataCellSub1 .cellRow{
	display:block;
	width:100%;
}

.imgListDataCellSub1 .rowTopic{
	width: 100%;
}

.imgListDataCellSub1 .rowData{
	padding-left:0rem;
	width: 100%;
}


.imgListDataCellSub1{
	width:35%;
	padding-right:1rem
}

.imgListDataCellSub2{
	width:65%;
}



.rowTopic{
	font-weight:bold;
	width: 28%;
}

.rowData{
	padding-left:0.4rem;
	width: 82%;
}

.tr.imgListDataRow {
	vertical-align:top;
}

.td.imgListDataTopic{
	width:90px;
	font-weight: bold;
	background-color:#ccc;
	vertical-align: top;
	padding:1px 4px 1px 4px;
}

.td.imgListDataContent{
	width:120px;
	vertical-align: top;
	padding:1px 4px 1px 4px;
}

.td.imgListTextCell{
	vertical-align: top;
}

.imgListText{
	width: 100%;
}

.tr.imgListTextRow {
	vertical-align:top;
}

.td.imgListTextTopic{
	width:100%;
	font-weight: bold;
	background-color:#ccc;
	vertical-align: top;
	padding:1px 4px 1px 4px;
}

.td.imgListTextContent{
	width:100%;
	vertical-align: top;
	padding:1px 0px 1px 4px;
}

.tr.imgListRow {
	vertical-align:top;
}

.imgListRowSeparator{
	height:1px;
	background-color:black;
	width:100%;
}

.imgListRowSeparatorSpace{
	height:4px;
	width:100%;
}


/* MARGIN-SPALTE RECHTS */

#archiveStats{
	font-size:1.2rem;
	padding: 10px;
	background-color:#222222;
	color: white;
}

#adMembership{
	width: 100%;
}

#adsMarginMain, #adsMargin1, #adsMargin2{
	width: 100%;
	margin-top: 0.7rem;
}

/* uploadifive */

#uploadBox {
	background-color:#F1AFF8;
	padding: 10px;
	width: 100%;
	}

.uploadifive-button {
	background-color: #7c0e0e;
	background-image: linear-gradient(bottom, #7c0e0e 0%, #707070 100%);
	background-image: -o-linear-gradient(bottom, #7c0e0e 0%, #707070 100%);
	background-image: -moz-linear-gradient(bottom, #7c0e0e 0%, #707070 100%);
	background-image: -webkit-linear-gradient(bottom, #7c0e0e 0%, #707070 100%);
	background-image: -ms-linear-gradient(bottom, #7c0e0e 0%, #707070 100%);
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #7c0e0e), color-stop(1, #707070) );
	background-position: center top;
	background-repeat: no-repeat;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	border: 2px solid #808080;
	color: #FFF;
	text-align: center;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	text-transform: uppercase;
	width: 100%;
}

.uploadifive-button:hover {
	background-color: #000000;
	background-image: linear-gradient(top, #000000 0%, #808080 100%);
	background-image: -o-linear-gradient(top, #000000 0%, #808080 100%);
	background-image: -moz-linear-gradient(top, #000000 0%, #808080 100%);
	background-image: -webkit-linear-gradient(top, #000000 0%, #808080 100%);
	background-image: -ms-linear-gradient(top, #000000 0%, #808080 100%);
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #000000), color-stop(1, #808080) );
	background-position: center bottom;
}

.uploadifive-queue-item {
	background-color: #F5F5F5;
	border-bottom: 1px dotted #D5D5D5;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin-top: 3px;
	padding: 15px;
}

.uploadifive-queue-item .close {
	background: url("/images/uploadifive/uploadifive-cancel.png") 0 0 no-repeat;
	display: block;
	float: right;
	height: 16px;
	text-indent: -9999px;
	width: 16px;
}

.uploadifive-queue-item .progress {
	border: 1px solid #D0D0D0;
	height: 3px;
	margin-top: 5px;
	width: 100%;
}

.uploadifive-queue-item .progress-bar {
	background-color: #0072BC;
	height: 3px;
	width: 0;
}

#postsMargin{
	display:flex;
	flex-direction: column;
	background-color: #ddd;
	padding-left: 5%;
	padding-right: 5%;
	padding-top: 7px;
	padding-bottom: 9px;
}

.postsMarginTopic{
	display: flex;
	flex-direction: column;
}

.postsMarginImg{
	width: 100%;
}

.postsMarginContent{
	padding-top: 0.4rem;
}

.postsMarginHeadline h3{
	text-transform: uppercase;
	font-weight:700;
	line-height: 130%;
	font-size: 1.6rem;
}

.postsMarginHeadline a{
	text-decoration: none;
}

.postsMarginInfo{
	padding-top: 0.5rem;
	font-size: 1.2rem;
}

.postsMarginAuthor{
	font-weight: bold;
}

.postsMarginDate{
	padding-left: 0.9rem;
}


.postsMarginText {
	padding-top: 0.5rem;
	padding-bottom: 1rem;
	font-size: 1.4rem;
	font-weight:300;
}


/* BEARBEITEN-BEREICH */

#editArea{
	width: 100%;
	margin-bottom: 10px;
}

#editArea .headlinePage{
	background-color: yellow;
}

.editInfo{
	width: 100%;
	text-align:center;
	background-color: #FEFEDD;
	padding-top: 1.5%;
	font-style: italic;
	font-size: 1.3rem;
}

.editContent{
	width: 100%;
	background-color: #FEFEDD;
	padding: 1.5%;
}

.editContent select{
	font-size: 1.3rem;
}
.editContent .formRow{
	border-top:0.4rem solid transparent;
}

/* RECHERCHE-SEITE */

.rechercheImg{
	position: relative;
	margin: 0;
	padding: 0px;
	width: 100%;
}

.rechercheCaption{
	position: absolute;
	bottom:0;
	margin: 0;
	padding: 0px;
}

.rechercheTextIntro{
	display: inline-block;
	z-index:14;
	background-color: rgba(50, 50, 50, 0.75);
	padding-top: 0.05em;
	padding-left: 0.5em;
	padding-right: 0.5em;
	padding-bottom: 0.1em;
	margin:0;
	font-size:1.6rem;
	font-weight: 7å00;
	text-transform: uppercase;
	letter-spacing: -0.05rem;
	color: white;
}

.rechercheTextHeadline{
	display: inline-block;
	background-color: rgba(50, 50, 50, 0.75);
	padding-left: 0.8rem;
	padding-right: 0.8rem;
	padding-top: 0.25rem;
	padding-bottom: 0.6rem;
	margin:0;
	font-size:2.5rem;
	font-weight: 800;
	letter-spacing: -0.05rem;
	text-transform: uppercase;
	color: #FF99FF;
}

.rechercheTextSubHead{
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.6);
	padding-left: 0.7em;
	padding-right: 0.5em;
	padding-top: 0.27em;
	padding-bottom: 0.3em;
	margin:0;
	font-size:1.3rem;
	font-weight: 700;
	color: white;
	text-shadow: #1a1e21;
}

/* STARTSEITE */

/* StartTeaser */

#startTeaser{
	display:flex;
}

#startTeaserLeft{
	width: 49.8127341%;
	margin:0;
}

#startTeaserRight{
	display: flex;
	flex-wrap:wrap;
	align-content: space-between;
	width: 50.1872659%;
}

.teaserBoxLinks{
	color: white;
	text-decoration: none;
}

.teaserBox1{
	display:flex;
	margin-bottom: 0.2%;
}

.teaserBox1Img{
	position: relative;
	margin: 0;
	padding: 0px;
	width: 100%;
}

.teaserBox1Caption{
	position: absolute;
	bottom:0;
	margin: 0;
	padding: 0px;

}

.teaserBox1TextIntro{
	display: inline-block;
	z-index:14;
	background-color:#dd3333;
	padding-top: 0.05em;
	padding-left: 0.5em;
	padding-right: 0.5em;
	padding-bottom: 0.1em;
	margin:0;
	font-size:1.2rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: -0.05rem;
	color: white;
}

.teaserBox1TextHeadline{
	display: inline-block;
	background-color: rgba(50, 50, 50, 0.75);
	padding-left: 0.8rem;
	padding-right: 0.8rem;
	padding-top: 0.25rem;
	padding-bottom: 0.6rem;
	margin:0;
	font-size:1.8rem;
	font-weight: 800;
	letter-spacing: -0.05rem;
	text-transform: uppercase;
	color: white;
}

.teaserBox1TextSubHead{
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.6);
	padding-left: 0.7em;
	padding-right: 0.5em;
	padding-top: 0.27em;
	padding-bottom: 0.3em;
	margin:0;
	font-size:1.3rem;
	font-weight: 700;
	color: white;
	text-shadow: #1a1e21;
}

.teaserBox2{
	width:49.30%;
	height:50.5%;
	margin-left: 0.7%;
}

.teaserBox2Img{
	position: relative;
	margin: 0;
	padding: 0px;
	width: 100%;
}

.teaserBox2Caption{
	position: absolute;
	bottom:0;
	margin: 0;
	padding: 0px;
	width: 100%;

}

.teaserBox2TextIntro{
	display: inline-block;
	z-index:12;
	background-color:#dd3333;
	padding-top: 0.1em;
	padding-left: 0.5em;
	padding-right: 0.5em;
	padding-bottom: 0.1em;
	margin:0;
	font-size:1.2rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: -0.05rem;
	color: white;
}

.teaserBox2TextHeadline{
	display: block;
	z-index:11;
	background-color: rgba(0, 0, 0, 0.7);
	padding-left: 0.45em;
	padding-right: 0.45em;
	padding-top: 0.2em;
	padding-bottom: 0.22em;
	margin:0;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: -0.05rem;
	color: white;
	font-size: 1.35rem;
}

/* Der Archivar berichtet */


.landingMore{
	width: 100%;
	text-align:center;
}




/* BILDSEITE */

#imgDisplay{
	padding-bottom: 0.1%;
	width:100%;
}

#imgCaption{
	width: 100%;
	color: white;
	background-color: black;
	text-align:center;
	padding: 0.5rem;
	font-size: 1.5rem;
}

#navi{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 1.5%;
	background-color: white;
}

.naviArrow{
	margin: 3%;
}

#naviInfo{
	margin: 0 2.5% 0 0;
	text-align: center;
}

#naviInfoLine1{
	font-size: 1.45rem;
	padding-bottom: 1%;
}

#naviInfoLine2{
}


#imgInfo{
	width: 100%;
	background-color: white;
	text-align: center;
	padding: 0 1.5% 1.5% 1.5%;
}

#imgInfoGalleries{
	width: 100%;
	background-color: white;
	text-align: center;
	padding: 0 1.5% 1.5% 1.5%;
}

#imgInfoStory{
	width: 100%;
	background-color: white;
	text-align: center;
	padding: 0 1.5% 1.5% 1.5%;
}

#imgInfoStoryInside{
	width: 60%;
	background-color: white;
	text-align: left;
	padding: 1.5%;
	border: 1px solid black;
	display: inline-block
}

#imgInfoDownload{
	width: 100%;
	background-color: white;
	text-align: center;
	padding: 0 1.5% 1.5% 1.5%;
}

#imgInfoDownloadInside{
	width: 60%;
	background-color: white;
	text-align: left;
	padding: 1.5%;
	margin-top:1rem;
	border: 1px solid black;
	display: inline-block
}


#imgInfoDetail{
	width: 100%;
	background-color: white;
	text-align: center;
	padding: 0 1.5% 1.5% 1.5%;
}




#imgGalleryEdit{
	width: 100%;
	margin-bottom: 10px;
	background-color: #C5C5C5;
}

#imgGalleryEditHeadline{
	width: 100%;
	background-color: #828282;
	padding: 4px;
	color: black;
	text-align:center;
	font-weight: bold;
}

#imgGalleryEditInfo{
	width: 100%;
	text-align:center;
	background-color: #C5C5C5;
	padding-top: 1.5%;
	padding-bottom: 1.5%;
	font-style: italic;
	font-size: 1.3rem;
}

#imgGalleryEditContent{
	background-color: #D1D1D1;
	padding: 1.5%;
	margin-top: 5px;
	margin-left:  auto;
	margin-right:  auto;
}

#imgGalleryEditContent select{
	font-size: 1.3rem;
}



#naviInfoLine2 a{
	padding-top: 3%;
}

.imgAction{
	font-style: italic;
	padding-top: 2%;
}



/* Kontaktformulare */

#sendoutForm label{
	font-size: 1.7rem;
	padding-top: 2rem;
}

#sendoutForm input{
	font-size: 1.4rem;
	padding: 1rem;
	margin-top: 0.5rem;
	width:100%
}

#sendoutForm textarea{
	font-size: 1.4rem;
	padding: 1rem;
	margin-top: 0.5rem;
	width:100%
}


/* POSTS */

/* Post-Liste */

.tb.postListRec {
	margin-bottom: 1.9rem;
	background-color: unset;
	vertical-align:top;
}

.tb:nth-child(odd).postListRec {
	background-color: unset;
}

.td.postImgListRec{
	width:29%;
	padding-bottom:1.9rem;
	padding-right:2.5rem;
	vertical-align:top;
}


.td.postContentListRec {
	padding-bottom: 1.9rem;
	vertical-align:top;
}

.postContentTitleListRec {
	font-size: 1.7rem;
	font-weight: bold;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
	margin-bottom: 0.3rem;
	vertical-align:top;
}

.postContentTitleListRec a{
	text-decoration: none;
}


.postInfoListRec{
	font-size: 1.2rem;
	margin-top: 0.7rem;
	vertical-align:top;
}

.postCategoryListRec{
	background-color: black;
	color:white;
	font-size:1.2rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: -0.05rem;
	padding:0.2rem 0.8rem;
}

.postAuthorListRec{
	font-weight: bold;
	padding:0.2rem 1rem;
}

.postDateListRec{
	line-height: 180%;
}

.postContentTextListRec {
	margin-top: 0.7rem;
	vertical-align:top;
	color: #555555;
	line-height: 170%;
}

.postCommentCountListRec {
	width:5%;
	text-align:right;
	white-space: nowrap;
}

#postInfoDownload {
	font-size:1.4rem;
	margin-top:2rem;
	margin-bottom:1rem;
}

/* einzelner Post */

.postTitle{
	text-transform: uppercase;
	font-size:3rem;
}

.postSubTitle{
	margin-top:0.5rem;
}

.postCredits{
	font-size: 1.4rem;
	margin-top: 2rem;
}

.postAuthor{
	font-weight: bold;
}

.postDate{
	font-style: italic;
}

.fn {
	font-size: 1.2rem;
}

/* Haupttext, Dedault-Einstellungen */
.composedPostContent{
	margin-top:1.5rem;
	margin-bottom:1rem;
	text-align: justify;
	font-size: 1.6rem;
	line-height: 150%;
	text-indent: 0;
	width:100%;
}

.postParagraphFirst {
	margin-top: 0;
	margin-bottom: 0;
}

.postParagraph {
	margin-top: 0.9rem;
	margin-bottom: 0;
}

.postParagraphSpace {
	margin-top: 0rem;
}

/* Storys */

.post-story .postParagraph{
	text-indent: 15px;
	margin-top: 0rem;
}


/* ===========================================
   EMBEDDED IMAGES - Basis-Klasse
   =========================================== */

.embeddedImage {
    margin: 1.5rem 0;
    background: transparent;
}

.embeddedImage::after {
    content: "";
    display: table;
    clear: both;
}

/* Bild-Zelle */
.embeddedImgCell {
    width: 100%;
    line-height: 0;
}

.embeddedImgCell a {
    display: block;
}

.embeddedImgCell img {
    display: block;
    width: 100%;
    height: auto;
    margin-top: 1rem;
    margin-bottom: 0;
}

/* Bildunterschrift */
.embeddedImgCaptionCell {
    padding: 0.5rem 0.75rem;
    background: #ffffcc;
    font-family: 'League Spartan';
    text-align: center;
    font-size: 0.9em;
    line-height: 1.4;
    color: #333;
    border-top: 1px solid #ccc;
}


/* ===========================================
   VARIANTE: Zentriert
   =========================================== */

.embeddedImage--center {
    width: 100%;  /* Default, kann durch inline-style überschrieben werden */
    margin-left: auto;
    margin-right: auto;
}


/* ===========================================
   VARIANTE: Links mit Textumfluß
   =========================================== */

.embeddedImage--left {
    float: left;
    width: 45%;  /* Default, kann durch inline-style überschrieben werden */
    margin-right: 1.5rem;
    margin-bottom: 0.5rem;
}


/* ===========================================
   VARIANTE: Rechts mit Textumfluß
   =========================================== */

.embeddedImage--right {
    float: right;
    width: 45%;  /* Default, kann durch inline-style überschrieben werden */
    margin-left: 1.5rem;
    margin-bottom: 0.5rem;
}


/* ===========================================
   Responsive Anpassungen
   =========================================== */

@media (max-width: 600px) {
    .embeddedImage--left,
    .embeddedImage--right {
        float: none;
        width: 100% !important;  /* Überschreibt auch inline-styles */
        margin-left: 0;
        margin-right: 0;
    }
}



.postImgCaption {
	background-color: #333333;
	margin-top:-0.4rem;
	padding: 0.5rem 0.8rem 0.7rem 0.8rem;
	font-size:1.5rem;
	color:white;
	width:100%;
}

/* rechtliche u.a. Infos zum Text */
.postInfoCopyright{
	padding-top: 1rem;
	padding-left:6rem;
	padding-right:2rem;
	text-align: left;
}


/* Kommentar des Autors zum Text */
.postInfoComment{
	padding-top: 1rem;
	padding-left:6rem;
	padding-right:2rem;
	text-align: left;
	line-height: 1.6rem;
}

/* Infos zur Rubrik */
.postInfoCategory{
	padding-top: 2.5rem;
	text-align: left;
	font-size:1.6rem;
	font-weight: bold;
	font-style: italic;
}

.assetPlacementBefore {
	width:100%;
	margin-bottom: 2rem;}

.assetPlacementAfter {
	width:100%;
}

.faqTopicList{
	font-size:1.7rem;
	font-weight: bold;
}

.callToAction{
	margin-top: 2.5rem;
	padding:0.5rem;
	text-align: left;
	font-size:1.7rem;
	background-color:yellow;
	font-weight:bold;
}

.attentionMsg{
	margin-top: 2.5rem;
	padding:0.5rem;
	text-align: left;
	font-size:1.7rem;
	background-color: #0c4128;
	color:yellow;
	font-weight:bold;
}



/* no script hinweis, von Ainstain */

div#att {
	background: transparent url("/images/etc/att_bg.png") repeat;
	border-bottom: 1px solid;
	height: 10em;
	line-height: 5em;
	font-size: 1.6em;
	position: absolute;
	top:0;
	width: 100%;
	text-align: center;
}

div#att p{
	background: transparent url("/images/etc/att.png") no-repeat 0 46%;
	margin: 0;
	display: inline;
	padding: 16px 0 16px 26px;
	font-weight: bold;
}


/* ============================================
   COOKIE-HINWEIS: Basis-Styles für Desktop
   ============================================ */

#hinweisLayer {
    background-color: rgba(255, 255, 255, 0.8);
    left: 0;
    top: 0;
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 100;
}

#hinweisAussen {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    max-width: 95%;
    max-height: 95vh;
    overflow-y: auto;
}

#hinweisInnen {
    border: 7px solid darkred;
    width: 700px;
    max-width: 100%;
    background: yellow;
    text-align: center;
    font-weight: bold;
    font-size: 5rem;
    padding: 3rem;
    opacity: 0.94;
    box-sizing: border-box;
}

/* ACHTUNG!-Überschrift */
#hinweisTitle {
    font-size: 3rem;
    font-weight: 900;
    line-height: 100%;
}

/* Warntext */
#hinweisInnenBoxW {
    font-size: 2.6rem;
    font-weight: 300;
    text-align: center;
    margin: 2rem;
    line-height: 1.2;
}

/* Fragen-Block */
#hinweisInnenBoxQ {
    font-size: 2.6rem;
    font-weight: 700;
    margin: 2rem;
    line-height: 1.2;
}

#hinweisInnenBoxQ p {
    margin: 1rem 0;
}

#hinweisInnenBoxQ em {
    font-style: italic;
}

/* Button-Container */
#hinweisInnenBoxA {
    font-size: 1.9rem;
    font-weight: 600;
    margin: 2rem;
    display: flex;
    justify-content: center;
}

/* Button */
.cookie-warning {
    padding: 0.6rem 1.4rem;
    background-color: darkred;
    border: 4px solid darkred;
    display: inline-block;
    max-width: 100%;
    white-space: normal;
}

.cookie-warning:hover {
    background-color: rgb(96, 0, 0);
    border-color: rgb(96, 0, 0);
}

.cookie-warning a {
    color: white;
    text-decoration: none;
    display: block;
    line-height: 1.3;
}


@media (max-width: 1050px) {
	.imgListDataCell .checkboxGroup{
		display: block;
	}
	.imgListDataCell .checkboxWithLabelPair{
		margin-bottom:0.4rem;
	}

}

@media (max-width: 900px) {
	/* Kategorien */

	/*MASTER TEMPLATE */

	#content{
		padding-top: 25px;
		padding-bottom: 25px;
	}

	/* SEITENELEMENTE */

	#pageHeadline{
		padding-bottom: 8px;
	}


	/* Footer */

	#footerLogo{
		width:100%;
		display:flex;
		align-items: center;
		margin-bottom: 1rem;
	}

	#footerLogo img{
		width:30%;
		height: auto;
		margin-right: auto;
		margin-left: auto;

	}

	#footerCore{
		display: unset;
	}

	#footerAbout{
		width:100%;
		padding-left: 0%;
		padding-right: 0%;
		text-align: justify;
	}


	/* Nutzer-Kopf */

	#memberHeadAvatar{
		width: 22%;
		height: auto;
		padding: 1.8%;
	}

	.memberHeadAvatarImg{
		border: 3px solid white;
	}

	#memberHeadData{
		width: 78%;
		height: auto;
		padding: 3%;
	}

	/* Kommentar-Schreiber in Kommentarliste */

	.td.commentCreatorDisplay{
		width:15%;
		padding:0.5rem;
		vertical-align: top;
	}

	.commentAvatar{
		border: 4px solid white;
		width: 85%;
		height: auto;
	}

	/* Kommentar-Inhalt in Kommentarliste */

	.td.commentContent{
		padding: 1rem;
		vertical-align: top;
	}

	.commentContentType{
		font-style: italic;
		padding-bottom: 0.4rem;
	}

	.commentContentText{

	}

	.commentContentWriter{
		padding-top: 0.5rem;
		font-weight: bold;
	}

	/* ggf. Bild in Kommentarliste */

	.td.commentImgDisplay{
		width:15%;
		padding:0.5rem;
		vertical-align: top;
	}

	.commentImg{
		border: 4px solid white;
		width: 85%;
		height: auto;
		float:right;
	}


	/* Margin */

	#adsMargin1, #adsMargin2{
		margin-bottom: 23px;
	}

	#magazineBox{
		padding-left: 4%;
		padding-right: 4%;
		padding-top: 5px;
		padding-bottom: 7px;
	}

	/* Bildliste */

	.recordListHeadWithCBText{
		font-size:1em;
	}

	.td.imgListDataCell {
		display: block;
	}

	.imgListDataCellSub1{
		width:100%;
	}

	.imgListDataCellSub1 .cellRow{
		display:flex;
	}

	.imgListDataCellSub2{
		width:100%;
	}

	.imgListDataCellSub1 .rowTopic{
		font-weight:bold;
		width: 28%;
	}

	.imgListDataCellSub1 .rowData{
		padding-left:0.4rem;
		width: 82%;
	}

}