*																								{ box-sizing: border-box; font-family: font-family: 'Open Sans', sans-serif; }
header, nav, main, footer												{ display: block; font-family: font-family: 'Open Sans', sans-serif; }
body, button																		{ 
																									padding: 0; margin: 0; 
																									font-family: font-family: 'Open Sans', sans-serif;
																									font-size:1em; line-height:100%; background:#ffffff; color:#444444;
																								}

div, p, input, textarea													{ font-family: 'Open Sans', sans-serif; line-height:1.3em; }


/* LINK: */
a																								{ color:#ffffff; text-decoration:none; }
a.link																					{ color:#3183b5; text-decoration:none; }
a:hover																					{ opacity:0.7; }

/* HEADLINES: */
h1																							{ font-size:1.8em; font-family: 'Open Sans', sans-serif; color:#2d8834; margin-bottom:0.4em; margin-top:0; font-weight:bold; line-height:1; hyphens: auto; }
h1.black																				{ color:#000000; }
h1.headline																			{ text-align:center; font-size:2em; hyphens: none; font-weight:bold; }
h2																							{ font-size:1.6em; font-family: 'Open Sans', sans-serif; color:#2d8834; margin-bottom:0.4em; margin-top:0; font-weight:bold; line-height:1; hyphens: auto; }
h3																							{ font-size:1.4em; font-family: 'Open Sans', sans-serif; color:#2d8834; margin-bottom:0.4em; margin-top:0; font-weight:normal; line-height:1; hyphens: auto; }
h4																							{ font-size:1.2em; font-family: 'Open Sans', sans-serif; font-weight:bold; color:#3183b5; margin-bottom:0.4em; margin-top:0; font-weight:normal; line-height:1; hyphens: auto; }

#alertNo																				{ padding:0.5em; border:double 7px #ff0033; color:#ff0033; font-size:120%; background:#ffffff; }
#alertYa																				{ padding:0.5em; border:double 7px #1CAD33; color:#1CAD33; font-size:120%; background:#ffffff; }

.clear																					{ clear:both; }

/* HEADER */
#header																					{ position:relative; color:#ffffff; }
#header .header_title														{ position:absolute; top:15%; left:0.8em; font-weight:bold; font-size:1.5em; line-height:1.0em; }
#header .header_subtitle												{ font-size:0.5em; font-weight:normal; line-height:0.7em; }


/* CONTENT */
.CONTENT																				{ /* border:dotted 1px #f0f; */
																									display: block; margin:0 auto; margin-top:1em;
																									padding:0.5em;
																									/* hyphens - Silbentrennung */
																									/*
																									-moz-hyphens: auto;
																									-o-hyphens: auto;
																									-webkit-hyphens: auto;
																									-ms-hyphens: auto;
																									hyphens: auto;
																									*/
																								}

																								
.reframe-X 																			{ margin-left: auto; margin-right: auto; max-width: 94%; margin: 0.5em auto; }

/* TEASER @ home */
.teaser 																				{ 
																									overflow:hidden; 
																									/* margin-bottom:1ex; //ex = Höhe der Kleinbuchstaben des verwendeten Fonts. h-shadow v-shadow blur spread  */
																									display: block; margin-left: auto; margin-right: auto; 
																									border:dotted 1px #777777;
																									/* zentriert bilder */
																								}
.teaser																					{ position:relative; }
#TEASER h1																			{ color:#23a2a5; font-size:1.5em; font-weight:bold; margin-bottom:1em; }
#TEASER p																				{ color:#000000; }
.teaser .PLUS																		{ position:absolute; left:0; bottom:0; width:1.1em; height:1.1em; line-height:1.1em; background:#ffffff; color:#22a2a5; font-size:2em; }


																				

																				
.menu 																					{ 
																									overflow:hidden; margin-bottom:1ex; padding:1em;
																									/* ex = Höhe der Kleinbuchstaben des verwendeten Fonts. h-shadow v-shadow blur spread  */
																									display: block; margin-left: auto; margin-right: auto; 
																									/* zentriert bilder */
																								}

.customers																			{ 
																									overflow:hidden; margin-bottom:1ex; padding:1em;
																									/* ex = Höhe der Kleinbuchstaben des verwendeten Fonts. h-shadow v-shadow blur spread  */
																									display: block; margin-left: auto; margin-right: auto; 
																									/* zentriert bilder */
																									display: flex; justify-content: center; align-items: center;
																								}



.lines p 																				{ height: 16px; background-color: silver; border-radius: 8px; }
.largeblock																			{ height: 100px; background-color: hsl(145,50%,80%); margin-top: 1em; }



/* IMAGES: */
.img-responsive																	{ max-width:100%; height:auto; }
.img-teaser																			{ max-width:100%; height:auto; }
.img-customers																	{ max-width:100%; height:auto; }
.img-header																			{ display: block; margin-left: auto; margin-right: auto; display:block; z-index:-100; } /* zentriert bilder */
.img-icon																				{ max-width:4.4em; display: block; margin-left: auto; margin-right: auto; margin-bottom:1em; } /* zentriert bilder */
.logo																						{  }
.teaser-portale																	{ box-shadow:0px 7px 7px 0px #cccccc; }
.img-plakat																			{ box-shadow: 5px 5px 10px #888888; }

.puenktchen hr																	{ height:4px; border:0; background:transparent url('../images/puenktchen.png') repeat-x; }


/* FOOTER */
footer																					{ background-color:#EDEDED; color:#000000; font-family: 'Open Sans', sans-serif; }
footer .footCONTENT															{ margin:0 auto; max-width:1230px; }
footer a:link																		{ color: #000000; text-decoration: none; }
footer a:visited																{ color: #000000; text-decoration: none; }
footer a:hover																	{ opacity:0.7; text-decoration: underline; }
.footer																					{ overflow:hidden; font-size:1.2em; line-height:1.3em; text-align:center; margin:1em; }
.right																					{ text-align:right; }


/* ~~~~~~~~~~~~~ FORMS ~~~~~~~~~~~~~~~~ */
input[type=text], select, textarea, 
input[type=password]														{ width: 100%; padding: 12px; border: 1px solid #cccccc; border-radius: 4px; box-sizing: border-box; resize: vertical; font-size:1em; }
label																						{ padding: 6px 12px 12px 0; display: inline-block; } /* top right bottom left */
input[type=submit]															{ background-color: #2d8834; color: white; padding: 12px 20px; border: none; border-radius: 4px; cursor: pointer; float: left; font-size:1em; }
.container																			{ border-radius: 7px; border:solid 1px #cccccc; background-color: #f2f2f2; padding: 20px; }
.col-25																					{ float: left; width: 25%; margin-top: 6px; }
.col-75																					{ float: left; width: 75%; margin-top: 6px; }
.row:after																			{ content: ""; display: table; clear: both; } /* Clear floats after the columns */
.formLableLogin																	{ font-size:120%; color:#2d8834; font-weight:bold; }

input[type=submit].SubmitMitglied								{ margin:auto; width:50%; background-color:#ffffff; border:solid 1px #22a2a5; color:#22a2a5; font-size:2em; padding:1em; text-align:center; }
input[type=submit].SubmitMitglied:hover					{ margin:auto; width:50%; background-color:#22a2a5; color:#ffffff; font-size:2em; padding:1em; text-align:center; }



/* ~~~~~~~~~~~~~ TABLES ~~~~~~~~~~~~~~~~ */

.memberFrame																		{ border-bottom:solid 1px #aaaaaa; margin-bottom:10px; }
.memberLeft																			{ float: left; width: 40%; color:#22a2a5; }
.memberRight																		{ float: left; width: 59%; }
.memberLeft3																		{ float: left; width: 30%; color:#22a2a5; }
.memberMiddle3																	{ float: left; width: 30%; }
.memberRight3																		{ float: left; width: 39%; }

.memberLeft4																		{ float: left; width: 15%; color:#22a2a5; }
.memberMiddleL4																	{ float: left; width: 20%; }
.memberMiddleR4																	{ float: left; width: 49%; }
.memberRight4																		{ float: left; width: 15%; }

ul.table																				{ padding-left:-40px; }



.highlight																			{ background:#cb4313; color:#ffffff; padding:0.2em; line-height:1.3em; }
.likeH3																					{ font-size:1.4em; font-family: 'Open Sans', sans-serif; color:#22a2a5; line-height:1; hyphens: auto; }




/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px)						{ 
																									.col-25, .col-75, input[type=submit]			{ width: 100%; margin-top: 0; }
																								}


/* ~~~~~~~~~~~~~ NAVBAR  ~~~~~~~~~~~~~~ */
nav																							{ margin-top: 0; z-index:100; background-color:#2d8834; opacity:1.0; font-family: 'Open Sans', sans-serif; }
nav ul																					{ margin: 0; height: 0; max-height: 0; transition: max-height 1s; overflow: hidden; } /* oberflow: hidden; damit die <ul> bei schmalen screens unsichtbar ist */
nav ul																					{ text-align: center; margin: 0; line-height:4em; vertical-align:bottom; } /* line-heigt, damit logo und text bottom aligned sind */
nav ul li:hover																	{
																									-webkit-transition: all 500ms;
																									-moz-transition: all 500ms;
																									-o-transition: all 500ms;
																									-ms-transition: all 500ms;
																									transition: all 300ms;
																									/* color:#3183b5; */
																									color:#ffffff;
																								}
nav ul li.off																		{ display: inline-block; color:#ffffff; font-weight:bold; }
nav ul li.off:hover															{ display: inline-block; color:#ffffff; font-weight:bold; border-bottom: 2px solid #ffffff; }
nav ul li.on																		{ display: inline-block; color:#ffffff; font-weight:bold; border-bottom: 2px solid #ffffff; }

nav div.off																			{ display: inline-block; color:#ffffff; font-weight:bold; font-size: 1.3em; }
nav div.off:hover																{ display: inline-block; color:#ffffff; font-weight:bold; font-size: 1.3em; border-bottom: 2px solid #ffffff; }
nav div.on																			{ display: inline-block; color:#ffffff; font-weight:bold; font-size: 1.3em; border-bottom: 2px solid #ffffff; }

#navbar																					{ margin: 0 auto; width:100%; height:60px; z-index:120; }
.menu_icon																			{ width: 35px; height: 3px; background-color:#ffffff; margin: 6px 0; } /* top/bottom, right/left */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */


.ul-2																						{ margin-left:1em; }


/* SIDENAV */
.sidenav																				{
																								height: 100%; width: 0; position: fixed; z-index: 2000; top: 0; right: 0; background-color: #333333;
																								overflow-x: hidden; transition: 0.5s; padding-top: 60px; opacity:0.85; margin-left:4em;
																								line-height:100%; font-family: 'Open Sans', sans-serif;
																								}
.sidenav a																			{
																								/* padding: 8px 8px 8px 32px; */ text-decoration: none; font-size: 25px; color: #ffffff; display: block;
																								transition: 0.3s; font-size:0.8em; line-height:100%; margin:1em; 
																								}
.sidenav a:hover																{ color: #ffffff; opacity:0.6; }
.sidenav .closebtn															{ position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; }



/* ---------------- ACCORDION START ---------------- */
/*
p.accordions																		{ }
.accordion																			{ color:#ffffff; cursor: pointer; width: 100%; border: none;
																									text-align: left; outline: none; transition: 0.4s; font-size:1em;
																								}
.accordion_image																{ float:left; width:150px; }
.accordion_headline															{ float:left; line-height:100px; font-weight:bold; font-size:1.5em; margin-left:2em; }
.accordion_right																{ 
																									float:right; line-height:70px; font-weight:bold; font-size:1.5em; margin-left:1em; 
																									width: 2em;
																									-moz-transform: rotate(-30deg);
																									-ms-transform: rotate(-30deg);
																									-o-transform: rotate(-30deg);
																									-webkit-transform: rotate(-30deg);

																									transform: rotate(-30deg);
																								}
.active, .accordion:hover												{  }
.accordion:after																{ color: #ffffff; float: right; font-size:2em;  }
.active:after																		{ color: #ffffff; font-size:2em; }
.panel																					{ max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out; }

.accordion_ref																	{ color:#ffffff; cursor: pointer; width: 100%; border: none;
																									text-align: left; outline: none; transition: 0.4s; font-size:1.5em;
																								}
.active_ref, .accordion_ref:hover								{ color:#ffffff; }
.accordion_ref:after														{ color:#ffffff; }
.active_ref:after																{ color:#ffffff; }
.panel_ref																			{ border-bottom:solid 2px #23a2a5; }
*/
/* ---------------- ACCORDION END ---------------- */




/* --------------- ACCORDION EINZELN AUFKLAPPBAR START ------------------*/
.accordion, .accordion * {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
 
.accordion {
    overflow:hidden;
    box-shadow:0px 1px 3px rgba(0,0,0,0.25);
    border-radius:3px;
}
 
/*----- Section Titles -----*/
.accordion-section-title {
    width:100%;
    padding:15px;
    display:inline-block;
    border-bottom:1px solid #ffffff;

    transition:all linear 0.15s;
    /* Type */
    font-size:1.100em;
    /* text-shadow:0px 1px 0px #ffffff; */
    color:#ffffff;
}
 
.accordion-section-title.active, .accordion-section-title:hover {
    
    /* Type */
    text-decoration:none;
    /* text-shadow:0px 1px 0px #1a1a1a; */
    color:#555555;
		background: #2d8834;
}
 
.accordion-section:last-child .accordion-section-title {
    border-bottom:none;
}
 
/*----- Section Content -----*/
.accordion-section-content {
    padding:15px;
    display:none;
		background: #5fbb67;
}
.accordion-section-content-filter {
    padding:5px;
    display:none;
}

/* --------------- ACCORDION END ------------------*/
































.CONTENT p																			{ font-size:1.2em; line-height:1.5em; }




/* ALLES GRÖßER SMART-PHONE AUFLÖSUNG: */
@media screen and (max-height: 399px)						{ 
																									.sidenav {padding-top: 15px;}
																									.sidenav a {font-size: 18px;}
																								}

@media screen and (max-width: 499px)						{ 
																									footer {padding-top:0.5em; padding-bottom:0.5em; font-size:0.8em; } 
																								}

@media screen and (max-width: 1023px)						{ #BIGMENU								{ display:none; } }

@media (min-width: 1024px) 											{
																									#SMALLMENU							{ display:none; }
																									nav											{ margin-top: 0; font-size: 1.3em; margin-bottom: 1ex; }
																									nav ul									{ 
																																						margin: 0; height: auto; overflow: visible; 
																																						display: flex; flex-wrap: nowrap; justify-content: space-between; list-style-type: none; padding-left: 0;
																																						/* line-height:5.5em; */
																																					}
																									nav ul li								{ text-align: center; font-size:1.5em; line-height:1.8em; }
																									#navbar									{ padding-top:0.3em; }
																									.contacts								{ font-size:1.6em; }
																								}

@media (min-width: 300px)												{
																									.reframe-X							{ max-width: 100%; }
																									.CONTENT								{ max-width: 100%; }
																									.flex-2									{  }
																									.teaser									{ max-width: 100%; margin:1em; }
																									.lines p:nth-child(2)		{ width: 70%}
																									.largeblock							{ height: 90px; }
																									.sidenav a							{ font-size:120%; margin-left:30%; }
																									#navbar									{ max-width:90%; height:60px; }
																									p.description						{ font-size:0.9em; }
																									.CONTENT p							{ font-size:1em; }
																									.accordion_headline			{ line-height:100px; margin-left:1em; font-size:0.85em; }
																									.contacts								{ font-size:1.2em; }
																								}	
																								
@media (min-width: 400px)												{
																									.reframe-X							{ max-width: 100%; }
																									.CONTENT								{ max-width: 100%; }
																									.flex-2									{  }
																									.teaser									{ max-width: 100%; margin:1em; }
																									.lines p:nth-child(2)		{ width: 70%}
																									.largeblock							{ height: 90px; }
																									.sidenav a							{ font-size:120%; margin-left:30%; }
																									#navbar									{ max-width:90%; height:60px; }
																								}																								

@media (min-width: 500px) 											{
																									.flex-2									{ display: flex; justify-content: space-between; max-width: 100%; }
		 																							.flex-content-2					{ display: flex; }
																									.teaser									{ width: 48%; margin:0.5em; }
																									.menu										{ width: 48%; margin:0.5em; padding:1em; }
																									.customers							{ width: 48%; margin:0.5em; padding:1em; }
																									.lines p:nth-child(2)		{ width: 50%}
																									.CONTENT								{ /* text-align:justify; */ font-size:1em; line-height:130%; }
																									.CONTENT li							{ text-align:left; }
																									.footer									{ width: 48%; height: 250px; margin:0.5em; padding:1em; font-size:1em; line-height:1.3em; }
																									.sidenav a							{ font-size:100%; }
																									.ul-2-li								{ line-height:0.5em; }
																									.teaser h1							{ font-size:1em; }
																									.teaser p								{ font-size:0.8em; line-height:1.2em; }
																									.footer 								{ overflow:hidden; font-size:0.8em; line-height:1.3em; height:auto; }
																									.footerRight						{ text-align:right; }
																									.contacts								{ font-size:1.4em; }
																									#navbar									{ height:80px; }
																									#header .header_title		{ font-size:2.0em; line-height:1.3em; }
																								}
																								
@media (min-width: 620px) 											{
																									#header .header_title			{ font-size:2.4em; line-height:1.3em; }
																									#header .header_subtitle	{ font-size:0.5em; font-weight:normal; line-height:0.7em; }
																								}

@media (min-width: 768px) 											{
																									.teaser h1							{ font-size:1.2em; }
																									.teaser p								{ font-size:1em; line-height:1.4em; }
																									#navbar									{ height:100px; }
																									
																									#header .header_title		{ position:absolute; top:15%; left:4.5em; font-weight:bold; font-size:2.4em; line-height:1.3em; }

																								}
	
@media (min-width: 800px) 											{
																									.reframe-X 							{ max-width: 1100px; width: 90%; margin-left: auto; margin-right: auto; }

																									.footer 								{ /* width: 32%; font-size:1.1em; line-height:1.4em; */ }
																									/* .teaser 								{ height: 350px; margin:1em; padding:1.5em; overflow: hidden; } */
																									.menu 									{ margin:1em; padding:1.5em; overflow: hidden; }
																									.customers							{ margin:1em; padding:1.5em; overflow: hidden; }
																									.lines p:nth-child(2)		{ display: none } /* VORSICHT, DIESE ZEILE WIRD AUSGEBLENDET !!! */
																									.CONTENT								{ max-width: 1100px; width: 90%; /* text-align:justify; */ font-size:1.2em; line-height:150%; }
																									.sidenav a							{ font-size:120%; }
																									.teaser h1							{ font-size:1em; }
																									.teaser p								{ font-size:0.8em; line-height:1.2em; }

																								}

@media (min-width: 1024px) 											{
																									.teaser									{ height: 520px; margin:1em; overflow: hidden; }
																									.footer 								{ margin:1em; padding:1.5em; overflow: hidden; }
																									.teaser h1							{ font-size:1.5em; }
																									.teaser p								{ font-size:0.9em; line-height:1.4em; }
																									.footer 								{ font-size:1em; line-height:1.6em; }
																									.accordion_headline			{ line-height:100px; margin-left:2em; font-size:1.2em; }
																									#navbar									{ height:180px; }
																									#header .header_title			{ position:absolute; top:15%; left:4em; font-weight:bold; font-size:2.5em; line-height:1.3em; }
																									#header .header_subtitle	{ font-size:0.5em; font-weight:normal; line-height:0.8em; }
																								}

@media (min-width: 1230px) 											{
																									#navbar									{ width:90%; max-width:1920px; height:220px; }
																									.footer 								{ font-size:1em; line-height:1.6em; }
																									#header .header_title			{ position:absolute; top:15%; left:4em; font-weight:bold; font-size:3em; line-height:1.5em; }
																									#header .header_subtitle	{ font-size:0.7em; font-weight:normal; line-height:1em; }

																									.CONTENT								{ max-width: 1230px; /* text-align:justify; */ font-size:1.2em; line-height:150%; }
																								}










/* to top with jquery fading */
.back-to-top																		{ position:fixed; bottom:100px; right:20px; background:url(../images/arrows.svg) left top no-repeat; width:27px; height:50px; }
.back-to-top a																	{ text-indent:-9999px; display: block; }
.back-to-top:hover															{ background:url(../images/arrows.svg) left -24px no-repeat; }


.small																					{ font-size:60%; }

div.Button																			{ margin:auto; width:80%; border:solid 1px #22a2a5; font-size:2em; padding:1em; text-align:center; }
div.Button:hover																{ color:#ffffff; background:#22a2a5; }













#mailFrame				{ margin:15px; padding:20px; max-width:900px; border:solid 1px #dddddd; }





/* ---------------- TAB SLIDE ---------------- */

.tablink																				{ background:#f3f3f3; padding:15px; border:none; width:80%; margin-bottom:10px; border-radius: 4px; text-align:left; cursor: pointer; }
.tablink:hover																	{ opacity:0.8; }
.AdminOn																				{ background:#014d88; padding:15pxpx; border:none; width:80%; margin-bottom:10px; color:#ffffff; }

/* W3.CSS 4.13 June 2019 by Jan Egil and Borge Refsnes */
/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */
.w3-sidebar.w3-collapse{display:block!important}}
.w3-bar-block .w3-dropdown-hover,.w3-bar-block .w3-dropdown-click{width:100%}
.w3-card,.w3-card-2{box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)}

.w3-bar .w3-bar-item{padding:8px 16px;float:left;width:auto;border:none;display:block;outline:0}
.w3-bar .w3-button{white-space:normal}
.w3-padding-small{padding:4px 8px!important}.w3-padding{padding:8px 16px!important}.w3-padding-large{padding:12px 24px!important}
.w3-container:after,.w3-container:before,.w3-panel:after,.w3-panel:before,.w3-row:after,.w3-row:before,.w3-row-padding:after,.w3-row-padding:before, .w3-cell-row:before,.w3-cell-row:after,.w3-clear:after,.w3-clear:before,.w3-bar:before,.w3-bar:after{content:"";display:table;clear:both}

/* animations */
.w3-animate-opacity{animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}}
.w3-animate-left{position:relative;animation:animateleft 0.4s}@keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}}
.w3-animate-right{position:relative;animation:animateright 0.4s}@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
.w3-animate-top{position:relative;animation:animatetop 0.4s}@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.w3-animate-bottom{position:relative;animation:animatebottom 0.4s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.w3-animate-zoom {animation:animatezoom 0.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}



.REG_ROUBRIK																	{ font-size:18px; font-weight:bold; padding:10px; border: solid 1px #aaaaaa; background-color:#2d8834; color:#ffffff; }
#REG																					{ background-color:#dddddd; padding:1%; }
#REG .REGlable																	{ float:left; width:450px; height:50px; margin-right:10px; padding:10px; background:#ffffff; line-height:30px; }
#REG .REGform																	{ float:left; width:350px; min-height:50px; overflow:hidden; padding:10px; background:#ffffff; }
#REG .REGinput																	{ width:330px; padding:5px; background-color:#ededed; border:none; font-size:16px; color:#444444; }
#REG .REGtextarea															{ width:330px; height:100px; padding:5px; background-color:#ededed; border:none; font-size:16px; color:#444444; }
#REG select																			{ height:33px; }
.clear																			{ clear:both; }
.CLEAR																			{ clear:both; }