/* General Style */
body {
	background:#FFF;
	font-size:100%;
	margin:0em;
	padding:0em;
	font-family: 'Raleway', sans-serif;
}

h1 {
	font-size:1.7em;
	line-height:1.8em;
	font-family: 'Raleway', sans-serif;
	font-weight:300;
	color:#099;
	margin:0em;
	padding:1.25em;
	text-align:left;
}

h2 {
	font-size:1.4em;
	line-height:1.8em;
	font-family: 'Raleway', sans-serif;
	font-weight:300;
	color:#099;
	margin:0em;
	padding:1.25em;
	text-align:left;
}

h3 {
	font-size:1.25em;
	line-height:1.563em;
	font-family: 'Raleway', sans-serif;
	font-weight:300;
	color:#099;
	margin:0em;
	padding:0 0 0 1em;
	text-align:left;
}

p {
	line-height:1.25em;
	font-family: 'Raleway', sans-serif;
	font-weight:300;
	color:#2F2D2C;
	margin:0em;
	padding: 1em 0 1em 0;
	text-align:justify;
	font-size: 100%;
	font-size: 1.25em;
}

.rma {
	font-family:  Arial;
	padding: 0 0 0 0;
}

b {
	color:#099;
	font-weight:500;
}

ul {
	margin:0px;
	padding:0px;
}

li {
	list-style:square;
	font-family: 'Raleway', sans-serif;
	font-weight:400;
	color:#2F2D2C;
	line-height:1.25em;
	margin:0em;
	padding:0em;

}

a {
	text-decoration: none;
	color: #099;
}

a:hover {
	text-decoration: none;
	font-weight:500;
}

a.invers{
	text-decoration: underline;
	color: #FFF;
}

a.invers:hover  {
	color: #000;
}

a.footer{
	color: #FFF;
	padding: 0 0.05em 0 0.01em;
}

a.footer:hover  {
	color: #099;
	font-weight:500;
	padding: 0;
}

.gruen	{
	color:#099;
	font-weight:bold;
	}

/* On Top Bar */
#menubar {
	display:block;
	background:#FFFFFF;
	display:none;
}
#menubar ul {
	display:block;
	width:2em;
	padding:0.9em;
}
#menubar ul li {
	display:inline;
}
#menubar ul li a.menubutton {
	display:none;
}
/* Header */
header {
	display:inline-block;
	background:#FFF;
	vertical-align: top;
	padding:0em;
	text-align:center;
}
#main_header {
	background:#FFF;
	display:block;
	width:100%;
	max-width:980px;
	margin:0.5em auto;
	padding:0em;
}

/* Navigation */
#nav_wrapper {
	background:#099;
	display:block;
	height: 3.5em;
	width:100%;
	
	padding:0em;
	text-align:center;
}

nav {
	display:inline-block;
	height:3.5em;
	background:#099;

}

nav ul {
	display:block;
}
nav ul li a {
	color:#FFF;
	font-size: 1.125em;
	line-height:3.1em;
	padding:0.94em 0.938em;
	transition:background 0.2s;
	-webkit-transition:background 0.2s;
}
nav ul li {
	list-style: none;
	float: left;
	position: relative;
}
nav ul li a:hover {
	background:#00888a;
	font-weight:400;
}
nav ul li a.active {
	background:#00888a;
}

/* Navigation 2. Ebene*/
nav ul li ul{
	display:none;
	opacity:0;
	position:absolute;
	padding:0;
	background:#099;
	width: 14em;
}
nav ul li:hover ul,
nav ul li ul li:hover{
	opacity:0.9;
	display:block;
	z-index: 100;
	font-weight:400;
}
nav ul li ul li{
	width:100%;
	text-align: left;
}
nav ul li ul li a {
	color:#FFF;
	font-size: 1.125em;
	padding:0.563em 0.938em 0.375em 0.983em;
	vertical-align: middle;
	display: block;
	line-height: normal;

}
nav ul li ul li a:hover {
	color:#FFF;
	border:0;
	background:#00888a;
	font-weight:400;
}
/* Image Slider */
#img_slider {
	display:block;
	width:100%;
	max-width:1920px;
	margin:0em auto;
	padding:0em;
}
#img_slider article {
	display:inline-block;
	background:#FFFFFF;
	vertical-align: top;
	padding:0em;
	text-align:center;
}
#img_slider article img {
	max-width:1920px;
	box-shadow:0px;
	border-radius:0px;
}
.sliderElements,
.sliderElements figure,
.sliderControls {
    margin: 0;
}
.sliderElements:after {
    content: ".";
    display: block;
    height: .1px;
    clear: both;
    visibility: hidden;
    font-size: 0;
    overflow: hidden;
}

.cssSlider {
    overflow-x: hidden;
}

.sliderElements {
    list-style: none;
    position: relative;
    left: 0;
    width: 800%;
    margin-bottom: .8em;
    -webkit-transition: left .8s ease-in-out;
    -moz-transition: left .8s ease-in-out;
    -o-transition: left .8s ease-in-out;
    transition: left .8s ease-in-out;
}

.sliderElements > li {
    float: left;
    width: 12.5%;
    position: relative;
}
#slide02:checked ~ .sliderElements {
    left: -100%;
}
#slide03:checked ~ .sliderElements {
    left: -200%;
}
#slide04:checked ~ .sliderElements {
    left: -300%;
}
#slide05:checked ~ .sliderElements {
    left: -400%;
}
#slide06:checked ~ .sliderElements {
    left: -500%;
}
#slide07:checked ~ .sliderElements {
    left: -600%;
}
/* Bildunterschrift auf dem Bild positionieren */
.sliderElements figcaption {
	line-height:1.25em;
	font-family: 'Raleway', sans-serif;
	font-weight:400;
	font-size:1.8em;
	color:#FFF;
    display: block;
    position: absolute;
    left: 0;
    bottom: 1em;
    padding: .4em;
    background: rgba(0,0,0,.5);
}

/* Bilder responsive */
.sliderElements img {
    width: 100%;
    height: auto;
}


/* inputs aus dem Blickfeld schieben */
.cssSlider input {
    position: absolute;
    left: -99999px;
}

/* mittige Ausrichtung der Controls - funktioniert im Zusammenspiel mit inline-block */
.sliderControls {
    text-align: center;
}

/* Controls nebeneinander bringen */
.sliderControls li {
    display: inline-block;
}

/* Controls auf einheitliche Ma�e bringen und die Ecken abrunden */
.sliderControls label {
	
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    border-radius: 50%;
    display: block;
    cursor: pointer;
    background: #099;
    color: #099;
}

/* Attributselektor und indirekter Nachfahrkombinator zum ansteuern der labels */
.sliderControls label:hover,
#slide01:checked ~ .sliderControls label[for="slide01"],
#slide02:checked ~ .sliderControls label[for="slide02"],
#slide03:checked ~ .sliderControls label[for="slide03"],
#slide04:checked ~ .sliderControls label[for="slide04"],
#slide05:checked ~ .sliderControls label[for="slide05"],
#slide06:checked ~ .sliderControls label[for="slide06"],
#slide07:checked ~ .sliderControls label[for="slide07"] {
    background: #ddd;
    color: #ddd;
}

/* Formular */
#main form div {
	
}
#main form span{
	padding: 0.4em 0.4em 0.4em 0;
	
	color: #000;
	display: inline-block;
	margin-right: 1em;
	font-size:1em;
	text-align: right;
	font-family: 'Raleway', sans-serif;
	font-weight:300;
}
#main form h2 {
    background: #099;
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    color: #000;
    font-size:1em;
    font-weight: 300;
    padding: 1em;
    margin: -30px -30px 10px 0px;
		width: 81%;
}
#main form span:hover{
	color: #000;
}
fieldset, label,input, textarea {
	font-family: 'Raleway', sans-serif;
}

input[type="text"], input[type="email"], input[type="date"] {
    font-size:1em; outline: 0;
    transition: border-bottom-color 1s;
}
input[type="text"]:focus, input[type="email"]:focus, input[type="date"]:focus {
    border-bottom-color: #099;
}

label{
	cursor: pointer;
	font-family: 'Raleway', sans-serif;
}
fieldset {
	border:0;
	max-width: 1050px;
}
input[type="button"],
input[type="submit"]{
    -moz-box-shadow: inset 0px 1px 0px 0px #45D6D6;
    -webkit-box-shadow: inset 0px 1px 0px 0px #45D6D6;
    box-shadow: inset 0px 1px 0px 0px #45D6D6;
    background-color: #099;
    border: 0px solid #27A0A0;
    display: inline-block;
    cursor: pointer;
    color: #FFFFFF;
    font-family: 'Raleway', sans-serif;
    font-size: 14px;
    padding: 8px 18px;
    text-decoration: none;
    text-transform: uppercase;
		margin-top: 0.5em;
}

input[type="button"]:hover,
input[type="submit"]:hover {
    background:linear-gradient(to bottom, #00888a 5%, #30C9C9 100%);
    background-color:#00888a;
}
input:invalid { background-color: #ff8484;}
input:required:valid { background-color: #8bef80;}

/* Datenbank */
#main .DBAusgabeThrue{
	color: #009906;
	font-size:1em;
	line-height:1.1em;
	font-family: 'Raleway', sans-serif;
	font-weight:300;
}
#main .DBAusgabeFalse{
	color: #c80b0b;
	font-size:1em;
	line-height:1.1em;
	font-family: 'Raleway', sans-serif;
	font-weight:300;
}

/* Content Area */
#main {
	display:block;
	width:100%;
	max-width:980px;
	margin:1.25em auto;
	padding:0em;
}

#main article {
	display:inline-block;
	background:#FFFFFF;
	vertical-align: top;
	padding:0em;
	text-align:center;
}
.sn-input {	max-width:150px; }

.rma-flex-container {
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 0px;
	flex-wrap: wrap;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.rma-flex-item1 {
	width: 49%;
	text-align: right;
}
.rma-flex-item2{
	width: 49%;
	text-align: left;
}
.rma-label {
	line-height:1.25em;
	font-family: 'Raleway', sans-serif;
	font-weight:300;
	color:#2F2D2C;
	margin:0em;
	text-align:right;
}

.flexbox2 {
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-right: 0.7em;
}

.box1{
	max-width: 20em;
	margin: 1.25em 0 1% 1.25em;
	padding: 1.25em;
}
.box1 h2 {
    background: #099;
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    color: #fff;
    font-size:1.25em;
    font-weight: 300;
    margin: 0;

}
.form1{
	margin: 0;
	padding: 0;
}
.box1 div {
    background: #099;
    font-family: 'Raleway', sans-serif;
    color: #fff;
    font-size:1em;
    font-weight: 300;
    padding: 0 0 1em 1em;
    margin: 0;

}

.box1 a{color: #fff;}
.box1 a:hover{color: #000;}

.ram_box1 {
	background-color: #eee; padding:1em; margin-bottom:1em;
}


#main  section {
	margin-bottom:1.563em;
	background:#FFFFFF;
	
}

/* FAQ */

#faq1, #faq2, #faq3, #faq4, #faq5, #faq6, #faq7, #faq8, #faq9, #faq10, #faq11, #faq12 {
	width: 48%;
	margin: 0 0 1% 0;
	padding: 0 0 0.4em 0;
}
.flexbox {
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-right: 0.7em;
}

#faq1:not(:target) .inhalt, #faq2:not(:target) .inhalt, #faq3:not(:target) .inhalt, #faq4:not(:target) .inhalt, #faq5:not(:target) .inhalt, #faq6:not(:target) .inhalt, #faq7:not(:target) .inhalt, #faq8:not(:target) .inhalt, #faq9:not(:target) .inhalt, #faq10:not(:target) .inhalt, #faq11:not(:target) .inhalt, #faq12:not(:target) .inhalt {display: none;}
#faq1:target .inhalt, #faq2:target .inhalt, #faq3:target .inhalt, #faq4:target .inhalt, #faq5:target .inhalt, #faq6:target .inhalt, #faq7:target .inhalt, #faq8:target .inhalt, #faq9:target .inhalt, #faq10:target .inhalt, #faq11:target .inhalt, #faq12:target .inhalt {display: block;}
#faq1:target .show, #faq2:target .show, #faq3:target .show, #faq4:target .show, #faq5:target .show, #faq6:target .show, #faq7:target .show, #faq8:target .show, #faq9:target .show, #faq10:target .show, #faq11:target .show, #faq12:target .show {display: none;}
#faq1:not(:target) .hide, #faq2:not(:target) .hide, #faq3:not(:target) .hide, #faq4:not(:target) .hide, #faq5:not(:target) .hide, #faq6:not(:target) .hide, #faq7:not(:target) .hide, #faq8:not(:target) .hide, #faq9:not(:target) .hide, #faq10:not(:target) .hide, #faq11:not(:target) .hide, #faq12:not(:target) .hide {display: none;}

.inhalt {
border-left:solid 1px #099;
border-right:solid 1px #099;
border-bottom:solid 1px #099;
width:100%;
padding: 0.7em 0 0.7em 0.7em;
}
.inhalt p {
	padding:0 0.7em 0 0;

}

.show {
	border:solid 1px #099;
	padding: 0.7em 0 0.7em 0.7em;
	background: #eee;
	background-image: url("./pix/tropfen-klein.png");
	background-repeat: no-repeat!important;
	background-origin: content-box!important;
	box-shadow:none!important;
	color:#099!important;
	line-height:1.25em;
	font-family: 'Raleway', sans-serif;
	font-weight:400;
	font-size:1em;
	transition:0.2s all ease-in-out!important;
	display: inline-block;
    width: 100%;
}
.hide {
	border:solid 1px #099;
	padding: 0.7em 0 0.7em 0.7em;
	background: #099!important;
	background-image: url("./pix/tropfen-weiss-klein.png")!important;
	background-repeat: no-repeat!important;
	background-origin: content-box!important;
	box-shadow:none!important;
	color:#eee!important;
	line-height:1.25em;
	font-family: 'Raleway', sans-serif;
	font-weight:400;
	font-size:1em;
	transition:0.2s all ease-in-out!important;
	display: inline-block;
    width: 100%;
}

.show:hover{
	border:solid 1px #099;
	padding: 0.7em 0 0.7em 0.7em;
	background: #099;
	background-image: url("./pix/tropfen-weiss-klein.png");
	background-repeat: no-repeat!important;
	background-origin: content-box!important;
	box-shadow:none!important;
	color:#eee!important;
	line-height:1.25em;
	font-family: 'Raleway', sans-serif;
	font-weight:400;
	font-size:1em;
	transition:0.2s all ease-in-out!important;
	display: inline-block;
    width: 100%;
}
.hide:hover {
	border:solid 1px #099;
	background: #eee!important;
	background-image: url("./pix/tropfen-klein.png")!important;
	background-repeat: no-repeat!important;
	background-origin: content-box!important;
	color:#099!important;
	transition:0.2s all ease-in-out!important;
	display: inline-block;
    width: 100%;
}

#figura area:nth-of-type(1):hover ~ #capaRecorte {
-webkit-clip-path: polygon(443px 388px,630px 390px,631px 497px,441px 499px);
clip-path: url(#A1);
}

/* Ende FAQ*/

/* Footer */
footer {
	display:block;
	background:#2F2C2C;
	text-align:center;
}

footer ul {
	display:block;
	width:100%;
	max-width:980px;
	text-align:left;
	margin:0px auto;
}

footer ul li {
	display:inline;
	font-size:0.8em;
	line-height:2.8em;
	color:#E2DBDB;
	padding:0em 0.625em 0em 0.625em;
}
footer ul li a {
	color:#E2DBDB;
}

/* Mobile Style */
@media screen and (max-width:800px) {
	body {
		font-size:90%;
	}
}
@media screen and (max-width:600px) {
	#main , #main article {
		width:100%;
		display:block;
		margin:0.625em 0em 0.625em 0em;
	}
	
	p {	text-align: center;	}
	
	.rma-flex-container {
	padding: 1em;
	flex-wrap: wrap;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
	font-size: 2em;
}

.rma-flex-item1 {
	width: 99%;
	text-align: left;
	padding: 0 0 0.25em 0;
}
.rma-flex-item2{
	width: 99%;
	text-align: left;
	padding: 0 0 0.25em 0;
}
.rma-label { text-align:left; }
.sn-input {	max-width:265px; }
}
@media screen and (min-width:550px) {
	nav.nav {
		/* display:block; */
	}
}
@media screen and (max-width:550px) {
	body {
		font-size:86%;
	}
	#menubar ul li a.menubutton {
		display:block;
	}
	nav {
		display:block;
		/* height:auto; */
	}
	/* nav ul li {
		display:block;
		margin:0.3em 0em 0.3em 0em;
	}
	*/
}