body {
	font-family: Verdana,Geneva,sans-serif;
	font-size: 14px;
	padding-bottom: 200px;
	text-transform: none !important;
}
.kontaktformular{
	width: 100%;
	max-width: 800px;
	margin: auto;
}

.text {margin: 20px 0px;}
.hinweis {display: inline-block; padding: 10px 20px; background-color: #efefef;}

.errorText,.syntaxerrorText {position: absolute; right: 10px; top: 100%; font-size: 14px; color: #f00; padding-top: 5px;}
.message {font-family: Verdana, Geneva, sans-serif; font-size: 14px; display: inline-block; padding-right: 5px; font-weight: bold;}

.abschnitt {position: relative; margin: 0px 0px 40px 0px;}
.abschnitt .headline {display: block; font-size: 28px;  color: #00305e; font-family: 'Passion One'; margin: 0px 0px 20px 0px; padding-right: 30px;}

.selectbox {position: relative; border-left: 30px solid #00305e; box-shadow: 6px 6px 6px #ccc; margin: 0px 0px 10px 0px;}
.selectbox .suche {padding: 10px 30px;font-size: 21px;}
.selectbox input {font-size: 21px; padding: 5px;}
.selectbox .delete{cursor: pointer;}
.selectbox .header,
.selectbox .body {border-left: 1px solid #fff;}
.selectbox.simple .body {max-height: 300px; overflow-y: auto;}
.selectbox .header {position: relative;font-size: 28px; font-family: 'Passion One'; background-color: #00305e; padding: 10px 30px; color: #fff; cursor: pointer;}
.selectbox .header.normal{font-family: Verdana,Geneva,sans-serif; font-size: 21px;}
.selectbox .header.positiv{font-family: Verdana,Geneva,sans-serif; font-size: 21px; background-color: #fff; color: #666;}
.selectbox .header .icon {position: absolute; right: 30px; top: 10px;}
.selectbox.simple .header.active{background-color: #CFE09B; color: #00305d;}
.selectbox .header.active.label {padding: 18px 30px 2px 30px;}
.selectbox .header.active label {position: absolute; left: 30px; top: 2px; font-size: 10px;}
.selectbox .header.positiv .text,
.selectbox .header.normal .text {text-transform: none;}
.selectbox .header.positiv .text {color: #00305d;}
.selectbox .body {display: none; }
.selectbox .body .eintrag {position: relative; padding: 10px 30px 10px 70px; background-color: #fff; border-bottom: 1px solid #666; font-size: 21px; cursor: pointer; color: #00305d; font-weight: bold;}
.selectbox .body .eintrag.checked {background-color:#CFE09B;}
.selectbox .body .eintrag .icon{position: absolute; top: 12px; left: 30px;}
.selectbox .body .eintrag .icon .far{background-color: #fff; border-radius: 50%;}
.selectbox .body .eintrag.checked .icon{color:#95C11F; font-size: 21px; top: 10px; left: 27px;}
.selectbox .sub {display: none; margin: 0px 0px 0px 40px;}

.selectbox .sub .subline {padding: 20px 0px 10px 0px;font-size: 21px;}
.selectbox .sub .eintrag {color: #666;}
.selectbox .bildungsform {font-weight: normal; font-style: italic;}
.selectbox.error {margin-bottom: 30px;}

.input {position: relative; border-left: 30px solid #00305e; box-shadow: 6px 6px 6px #ccc; margin: 0px 0px 10px 0px; position: relative;color: #666; }
.input input {display: block;padding: 10px 30px; width: 100%; box-sizing: border-box; border: none; font-size: 21px;}
.input label {display: block; position: absolute; top: 10px; left: 30px;  font-size: 21px;}
.input.active input {display: block;padding: 18px 30px 2px 30px; font-size: 21px; color: #00305d;}
.input.active label {top: 2px;font-size: 10px;}
.input.error {margin-bottom: 30px;}

.textarea {border-left: 30px solid #00305e; box-shadow: 6px 6px 6px #ccc; margin: 0px 0px 10px 0px; position: relative; }
.textarea textarea {font-family: Arial; display: block; width:100%; padding: 10px 30px; box-sizing: border-box; font-size: 21px; color: #00305d; height: 200px; border: none;}

.datenschutz {border-left: 30px solid #00305e; box-shadow: 6px 6px 6px #ccc; margin: 0px 0px 10px 0px; position: relative; background-color: #efefef;}
.datenschutz .content {border-left: 1px solid #fff; padding: 10px 30px;}
.datenschutz .content .text {color: #666;}

.checkbox{position: relative; font-size: 21px; color: #666; cursor: pointer; margin: 0px 0px 10px 0px;}
.checkbox .icon {position: absolute; top: 4px; left: 0px; }
.checkbox .icon .far{background-color: #fff; border-radius: 50%;}
.checkbox label {display: block; cursor: pointer; padding: 0px 0px 0px 30px;}
.checkbox.checked .icon {color:#95C11F;}

.upload{border-left: 30px solid #00305d;box-shadow: 6px 6px 6px #ccc;background-color: #00305d; color: #fff; }
.upload input {
	display: block;
	width: 100%;
	padding: 10px 20px;
    border-left: 1px solid #fff;
	overflow: hidden;
	box-sizing: border-box;
}

#senden {width: 100%; text-decoration: none; display: block;padding: 10px 20px; margin: auto; font-size: 21px; border: 1px solid #00305d; color: #fff; background-color: #00305d; box-shadow: 6px 6px 6px #ccc; border-radius: 10px; text-align: center;}
#senden:hover{background-color: #fff; color: #00305d;}

.message-zeichenanzahl {position: absolute; bottom: 5px; right: 5px;}

.error .selectbox,
.error .input,
.error .textarea,
.error .datenschutz,
.selectbox.error,
.input.error,
.textarea.error {border-left: 30px solid #f00; border-top: 1px solid #f00; border-right: 1px solid #f00; border-bottom: 1px solid #f00;}

.check_ok{position: absolute; color: #95C11F; font-size: 21px; top: 10px; right: 5px;}
.abschnitt > .check_ok {top: 0px;}


.flyer-download {display: block;position: relative; border-left: 30px solid #00305d; box-shadow: 6px 6px 6px #ccc; color: #00305d; text-decoration: none; margin: 0px 0px 20px 0px;}
.flyer-download:hover {background-color: #00305d; color: #fff;}
.flyer-download.active {background-color: #CFE09B;}
.flyer-download .bezeichnung {display: block;padding: 10px 50px 10px 30px; font-size: 14px; }
.flyer-download .icon {position: absolute; right:30px; top: 10px; font-size: 21px;}

.pagination {position: relative; padding: 10px 20px; margin: auto; font-size: 21px; border: 1px solid #00305d; color: #fff; background-color: #00305d; box-shadow: 6px 6px 6px #ccc;  text-align: center;}
.pagination a.button {color: #fff; text-decoration: none; display: inline-block; margin:0px 10px; padding: 5px;}
.pagination a.button.active {color: #00305d; background-color: #fff;}
.pagination a.button .icon {display: none; margin: 0px 5px; font-size: 28px;}
.pagination a#next {position: absolute; top:10px; right: 30px;}
.pagination a#prev {position: absolute; top:10px; left: 30px;}

.buttonzeile {text-align: right;}
.buttonzeile .button {display: block; border-radius: 10px; background-color: #00305d; color: #fff; text-decoration: none; padding: 10px 20px; box-shadow: 6px 6px 6px #ccc; font-size: 21px; border: 1px solid #00305d; margin: 0px 0px 10px 0px; text-align: center;}
.buttonzeile .button#speichern {background-color: #fff; color: #00305d;}


@media (max-width: 600px) {
	.abschnitt.error {margin-bottom: 60px;}
	.input.error{margin-bottom: 60px;}
	
	.pagination a.button .text {display: none;}
	.pagination a.button .icon {display: block;}
	.pagination a#next {right: 5px;}
	.pagination a#prev {left: 5px;}
	
	
	.input.active input,
	.input label,
	.selectbox label,
	.selectbox .header.positiv,
	.selectbox .body .eintrag,
	.checkbox,
	.textarea,
	.pagination,
	.buttonzeile .button	{font-size: 16px;}
	
	
	.input,
	.selectbox,
	.textarea,
	.datenschutz,
	.upload,
	.flyer-download{border-left: 10px solid #00305d;}
	
	.input.active input {padding-left: 10px;}
	.input label {left: 10px;}
	
	.selectbox .header {padding: 10px;}
	.selectbox .body .eintrag {padding-left: 35px;}
	.selectbox .body .eintrag  .icon,
	.selectbox .body .eintrag.checked .icon,
	.selectbox .header.active label{left: 10px;}
	.selectbox .header.active.label {padding: 18px 20px 2px 10px;}
	.selectbox .header .icon {right: 10px;}
	.selectbox input.suche {display: inline-block; width: 80%; box-sizing: border-box; padding: 5px 10px;}
	
	.flyer-download .bezeichnung {padding-left: 10px;}
	.flyer-download .icon {right: 10px;}
	
	.error .selectbox,
	.error .input,
	.error .textarea,
	.error .datenschutz,
	.selectbox.error,
	.input.error,
	.textarea.error {border-left: 10px solid #f00;}
	
	.datenschutz .content {padding: 10px;}
	
	.textarea textarea {padding: 10px;}
}


.syntaxerrorText{
	display: none;
	color: red;
}

.errorText{
	display: none;
	color: red;
}