* {
	margin: 0;
	padding: 0;
	font-family: Arial, sans-serif;
}
@font-face {
    font-family: 'MyCustomHead';
    src: url('grafics/SheepSansBold.eot'); /* IE9 */
    src: url('grafics/SheepSansBold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('grafics/SheepSansBold.woff') format('woff'), /* Moderne Browser */
        url('grafics/SheepSansBold.ttf') format('truetype'), /* Safari, Android, iOS */
        url('grafics/SheepSansBold.svg#abril_fatfaceregular') format('svg'); /* Legacy iOS */
}

@font-face {
    font-family: 'MyCustomFont';
    src: url('grafics/Orienta-Regular.eot'); /* IE9 */
    src: url('grafics/Orienta-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('grafics/Orienta-Regular.woff') format('woff'), /* Moderne Browser */
        url('grafics/Orienta-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('grafics/Orienta-Regular.svg#abril_fatfaceregular') format('svg'); /* Legacy iOS */
}


body{
	background: #FFFFFF;
	margin: 0 auto;
	color:#000000;
	text-decoration: none; 
	max-width:1600px;
	scroll-behavior: smooth;
	font-family:MyCustomFont, Garamond, Georgia, serif;  font-size:calc(18px + 1vw);
	/*background-image: url(../images/background.jpg);background-size:cover;background-position: right center;*/
}

a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:active {text-decoration:none;}
a:hover {color:#FF8800;}





/*HEADER*/

#headcontainer
{
position:relative; width:100%;height:auto;z-index:0;
}

.header_pic{
	width:100%;height:auto;max-height:800px;;
}



.header_blend{

	width:100%;height:60px;
	text-align:right;
	background: linear-gradient(to left, rgba(220,220,220,1),  rgba(220,220,220,0));
}

.header_logobox{
	position:absolute;top:2%;left:1%;z-index:5;
	width:30%;height:90%;
	background: linear-gradient(to right, rgba(255,255,255,1),  rgba(255,255,255,0));
}

.header_left_text{
	color:#FFFFFF; width:100%; text-align:center;
	font-size:2vw; font-family:MyCustomFont, Garamond, Georgia, serif; 
	text-shadow: 1px 1px 2px #000000;
}

@media screen and (min-width: 750px) 
{
	.header_navbox{
	position:absolute;
	top:0px;right:10px; width:95%;height:60px;z-index:50;text-align:center;
	}
	.nav_top_mobile{
	display:none;
	}
	
}
@media screen and (max-width: 749px) 
{
	.header_navbox{
	display:none;
	}

	.nav_top_mobile{
	position:absolute; top:10px;right:10px; width:300px;z-index:5000;
	}
	
}

	.nav_top_button{
	height:40px;width:auto;
	}

	.nav_top_mobile_button{
	height:40px;width:auto;
	float:right;
	}
	.moblie_navi_top_inner{
	padding:2%;
	background-color:#404040;
	}

	.tab_height40{
	width:100%;background-color:#404040;height:40px;
	border-top:1px solid #AAAAAA;margin-top:10px;
	}
	a.tab_href40{
	color:#FFFFFF;text-decoration:none;line-height:30px;font-size:24px;
	transition: 1s;
	}
	a.tab_href40akt{
	color:#FF9900;text-decoration:none;line-height:30px;font-size:24px;
	}

	.tab_height30{
	padding-left:20px;width:80%;background-color:#404040;min-height:30px;
	transition: 1s;
	}
	a.tab_href30{
	color:#EEEEEE;text-decoration:none;line-height:30px;font-size:20px;
	}
	a.tab_href30akt{
	color:#FF9900;text-decoration:none;line-height:30px;font-size:20px;
	}


.topnavi a{ 
	font-family:MyCustomFont, Garamond, Georgia, serif; font-size:calc(17px + 0.7vw); color: #000000;
	width:16%;
	line-height:45px;
	padding:1px;
	padding-top:3px;padding-bottom:1px;
	margin:1px;
	text-align:center;
	float:right;
	text-shadow: 1px 1px 5px #FFFFFF;
}
.topnavi a:hover{ 
	color: #000000;

	width:16%;
	line-height:45px;
	border-bottom:1px solid #27336C;
	border-top:1px solid #27336C;
	padding:1px;
	padding-top:3px;padding-bottom:1px;
	margin:1px;
	text-align:center;
	text-shadow: 1px 1px 5px #FFFFFF;
}
.topnavi_active a{ 
	font-family:MyCustomFont, Garamond, Georgia, serif; font-size:calc(17px + 0.7vw); color: #27336C;

	width:16%;
	line-height:45px;
	padding:1px;
	padding-top:3px;padding-bottom:1px;
	margin:1px;
	text-align:center;
	float:right;
	border-bottom:1px solid #27336C;
	text-shadow: 1px 1px 5px #FFFFFF;
}

.header_searchbox{
	position:absolute; top:80%;right:2%;width:20%;min-width:230px;height:auto;
}

.searchInput{
	font-size:0.9em;color: #FFFFFF;
	width:180px;height:30px;padding-left:3px;border:0px;border-bottom: 1px solid #FFFFFF;margin-top:5px;
	background-color:transparent;
}

.searchBut{
	height:42px;width:auto;float:right;
}

#maincontainer{
position:static;margin:2%; width:96%;z-index:100;height:100%;
}

#article{
width:100%;background:#FFFFFF;
}





h1 {
	font-family:MyCustomHead, Garamond, Georgia, serif; 
	font-size: calc(35px + 1vw);
	text-decoration: none; 
	color:#431209;
	line-height:1.3em;   
}

h2 {
	font-family:MyCustomFont, Garamond, Georgia, serif; 
	font-size: calc(25px + 1vw);
	text-decoration: none; 
	color:#303030;
	line-height:1.3em;
}

h3 {
	font-family:MyCustomFont, Garamond, Georgia, serif; 
	font-size: calc(25px + 1vw);
	text-decoration: none; 
	color:#000000;
	
}

h4 {
	font-family:MyCustomFont, Garamond, Georgia, serif; 
	font-size: calc(20px + 1vw);
	text-decoration: none; 
	color:#000000;
}

h5 {
	font-family:MyCustomFont, Garamond, Georgia, serif; 
	font-size: calc(18px + 0.5vw);
	text-decoration: none; 
	color:#000000;
}

h6 {
	font-family:MyCustomFont, Garamond, Georgia, serif; 
	font-size: calc(16px + 0.5vw);
	text-decoration: none; 
	color:#000000;
}



#footer{
width: 100%;
height:auto;
min-height:190px;
background: #27336C;
color:#FFFFFF;
}

@media screen and (min-width: 750px) 
{
.footer_box {
	width:29%;
	min-height:100px;
	height:auto;
	float:left;
	padding:2%;
	font-family:MyCustomFont, Garamond, Georgia, serif; font-size:calc(15px + 0.8vw);text-decoration: none;line-height:1em;color:#FFFFFF;
	}
}
@media screen and (max-width: 749px) 
{
.footer_box {
	width:100%;
	min-height:100px;
	height:auto;
	padding:15px;
	text-align:center;
	font-family:MyCustomFont, Garamond, Georgia, serif; font-size:calc(19px + 0.8vw);
	}
}

.footer_txt {font-family:MyCustomFont, Garamond, Georgia, serif; ;font-size: calc(19px + 0.3vw);text-decoration:none;color:#FFFFFF;}
.footertext {
font-family:MyCustomFont, Garamond, Georgia, serif; ; font-size: 19px; font-style: normal; font-weight: normal; text-decoration: none;line-height:1.4em;color:#FFFFFF;
}

.footerFB {
width:100px;height:40px;
}

.foottext{
font-family:MyCustomFont, Garamond, Georgia, serif;  font-size: 14px; font-style: normal; font-weight: normal; text-decoration: none;line-height:12px;color:#FFFFFF;
}



.w3-modal{
z-index:3;display:none;
padding-top:180px;position:fixed;left:80px;top:0;
width:100%;height:100%;overflow:auto;
background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)
}

.w3-modal-content{
margin:auto;
background-color:#FF0000;
position:relative;padding:0;
outline:0;width:800px
}

.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,
.loginbox{
width:215px;height:26px;background:#FFFFFF;
border:1px #DDDDDD solid; font-family:MyCustomFont, Garamond, Georgia, serif; font-weight:normal;font-size:18px;
}

.loginbox{width:215px;height:30px;background:#CCCCCC;border:1px #DDDDDD solid; font-family:MyCustomFont, Garamond, Georgia, serif; font-size:18px;float:left;margin:4px;}
.input_save{width:100px;height:32px;background:#0096E1;border:1px #DDDDDD solid;color:#FFFFFF;font-size:18px;float:left;margin:4px;}
.admin_but{background-color:transparent;width:80px;color:#CCCCCC;border:0;text-align:left;font-size:18px;}




@media screen and (min-width: 750px) 
{
.listbox{
	width:26%;margin:1%;padding:1%;float:left;height:18vw;
	background-size:cover;
	background-position: right center; 
	color:#FFFFFF; font-family:MyCustomFont, Garamond, Georgia, serif;  font-size:calc(14px + 0.7vw); 
	text-shadow: 1px 1px 2px #000000; 
	overflow:hidden;
	border-left:15px #505050 dotted;
	border-right:15px #505050 dotted;
	}

.listbox2{
	width:44%;margin:2%;float:left;height:33vw;
	background-size:cover;
	background-position: right center; 
	font-family:MyCustomFont, Garamond, Georgia, serif;  font-size:calc(14px + 0.7vw);
	text-shadow: 1px 1px 2px #000000;overflow: hidden; 
	display: flex;  align-items: top;  justify-content: center; padding:1%;
	}
}


@media screen and (max-width: 749px) 
{
.listbox{
	width:90%;
	background-size:cover;
	background-position: right center; 
	color:#FFFFFF; font-family:MyCustomFont, Garamond, Georgia, serif;  font-size:calc(18px + 0.7vw); 
	text-shadow: 1px 1px 2px #000000; 
	overflow:hidden;
	margin:5%;padding:2%;
	text-align:center;
	}
.listbox2{
	width:95%;
	background-size:cover;
	background-position: right center; 
	font-family:MyCustomFont, Garamond, Georgia, serif;  font-size:calc(14px + 0.7vw);
	text-shadow: 1px 1px 2px #000000;overflow: hidden; 
	overflow:hidden;
	margin:5%;padding:2%;
	text-align:center;
	}
}

.subthema_box
{
float:left;
width:23%;
margin:6px;
padding:3px;
background:#CCCCCF;
color:#FFFFFF;
font-family:MyCustomFont, Garamond, Georgia, serif; 
font-size:25px;
text-shadow: 0.1em 0.1em 0.1em #000000;
}

.startpageblock{
width:100%;height:auto;background-color:#FFFFFF;height:100%;
}

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

.startpageblock_dark{
width:100%;height:auto;background-color:#404040;height:100%;
background-image:url(grafics/network.jpg);background-size:100% auto; 
}

.bildrotee{
transition:1s; 
}

.bildrotee:hover{
transform:rotate(360deg);
}

@media screen and (min-width: 600px) 
{
	.startpageblock{
	width:100%;height:auto;background-color:#FFFFFF;height:100%;
	}

	.startpageblock_dark{
	width:100%;height:auto;background-color:#404040;height:100%;
	background-image:url(grafics/network.jpg);background-size:100% auto; 
	}

	a.startpagebox4er{
	float:left;width:20%;margin:2%;min-width:240px;max-height:260px;
	overflow:hidden;
	background-color:#303030;
	text-align:center;
	transition:1s;
	border: 1px solid #DDDDDD;
	}
	a.startpagebox4er:hover{
	background-color:#FF8800;
	border: 1px solid #FFFFFF;
	}

	a.startpagebox3er{
	float:left;width:29%;margin:2%;min-width:280px;max-height:300px;
	overflow:hidden;
	background-color:#AAAAAA;
	text-align:center;
	transition:1s;
	border-radius: 20px;
	}
	a.startpagebox3er:hover{
	background-color:#FF8800;
	}
}

@media screen and (max-width: 599px) 
{
	.startpageblock{
	width:100%;height:auto;background-color:#FFFFFF;height:100%;
	}

	.startpageblock_dark{
	width:100%;height:auto;background-color:#404040;height:100%;
	background-image:url(grafics/network.jpg);background-size:100% auto; 
	}

	a.startpagebox4er{
	float:left;width:96%;margin:2%;min-width:260px;max-height:260px;
	overflow:hidden;
	background-color:#303030;
	text-align:center;
	transition:1s;
	border: 1px solid #DDDDDD;
	}
	a.startpagebox4er:hover{
	background-color:#FF8800;
	border: 1px solid #FFFFFF;
	}

	a.startpagebox3er{
	float:left;width:96%;margin:2%;min-width:300px;max-height:300px;
	overflow:hidden;
	background-color:#AAAAAA;
	text-align:center;
	transition:1s;
	border-radius: 20px;
	}
	a.startpagebox3er:hover{
	background-color:#FF8800;
	}
}



.subthema_txt
{
color:#FFFFFF;
font-family:MyCustomFont, Garamond, Georgia, serif; 
font-size: calc(12px + 1vw) ;
text-shadow: 0.1em 0.1em 0.1em #000000;
line-height:16px;
}

	a.minibox{
	width:100%;margin:2%;min-width:250px;max-height:300px;
	overflow:hidden;
	background-color:#AAAAAA;
	text-align:center;
	transition:1s;
	border-radius: 20px;
	}
	a.minibox:hover{
	background-color:#FF8800;
	}


.alb2er{width:47%;padding:1%;}
.alb3er{width:30%;padding:1%;}
.alb4er{width:22%;padding:1%;}
.alb5er{width:17%;padding:1%;}

.text {  font-family:MyCustomFont, Garamond, Georgia, serif;  font-size:calc(18px + 1vw); text-decoration: none;line-height:1em;color:#202020;}
.linktext {  font-family:MyCustomFont, Garamond, Georgia, serif; font-size:calc(15px + 0.8vw);text-decoration: none;line-height:1.3em;color:#202020;}
.smalltextW {  font-family:MyCustomFont, Garamond, Georgia, serif; font-size:calc(12px + 0.5vw);font-style: normal; font-weight: normal; text-decoration: none;line-height:1.1em;color:#202020;}



.textAZ {  font-family:MyCustomFont, Garamond, Georgia, serif;  font-size: 15px; font-style: normal; font-weight: normal; text-decoration: none;line-height:1.5em;color:#FFFFFF;}
.text_big {  font-family:MyCustomFont, Garamond, Georgia, serif;  font-size: 20px; font-style: normal; font-weight: normal; text-decoration: none;line-height:1.5em;color:#202020;}
.smalltext {  font-family:MyCustomFont, Garamond, Georgia, serif;  font-size: 14px; font-style: normal; font-weight: normal; text-decoration: none;line-height:1.1em;color:#202020;}
.vsmalltext {  font-family:MyCustomFont, Garamond, Georgia, serif;  font-size: 11px; font-style: normal; font-weight: normal; text-decoration: none;color:#202020;}
.preis_big { font-family:MyCustomFont, "Arial Narrow", sans-serif; font-size: 25px; font-style: normal; font-weight: bold; text-decoration: none;line-height:1.5em;}


.mail_small {font-size:28px;font-family:MyCustomFont, Garamond, Georgia, serif;color: #000000;width:30%;height:33px;padding:1%;border: 1px solid #AAAAAA;background-color: #FFFFFF;}
.mail_small2 {font-size:28px;font-family:MyCustomFont, Garamond, Georgia, serif;color: #000000;width:18%;height:33px;padding:1%;border: 1px solid #AAAAAA;background-color: #FFFFFF;}
.mail_med {font-size:28px;font-family:MyCustomFont, Garamond, Georgia, serif;color: #000000;width:76%;height:33px;padding:1%;border: 1px solid #AAAAAA;background-color: #FFFFFF;}
.mail_big {font-size:28px;font-family:MyCustomFont, Garamond, Georgia, serif;color: #000000;width:98%;height:33px;padding:1%;border: 1px solid #AAAAAA;background-color: #FFFFFF;}
.mail_area {font-size:28px;font-family:MyCustomFont, Garamond, Georgia, serif;color: #000000;width:98%;height:230px;padding:1%;border: 1px solid #AAAAAA;background-color: #FFFFFF;}
.submitbut {font-size:33px;font-family:MyCustomFont, Garamond, Georgia, serif;color: #FFFFFF;padding:10px;border: 1px solid #000000;background-color: #999933;}

.key {font-size:13px;font-family:Arial, Helvetica, sans-serif;color: #000000;width:100%;height:22px;padding:0;border: 1px solid #202020;background-color: #FFFFFF;}

ul.knopf { 
   list-style-image: url(grafics/quadrat.png);
   margin-left:60px;line-height:40px;
   font-size: calc(16px + 0.5vw); font-family:Arial, Helvetica; text-decoration:none; 
}

.link_adm {font-family:"Arial Narrow", sans-serif; font-size: 16px; font-style: normal; font-weight: bold; text-decoration: none; color:#202020;background-color: #FF8800;margin:3px;width:65px;height:26px;border: 1px solid #AAAAAA;}
.naviL_big {font-family:MyCustomFont, "Arial Narrow", sans-serif; font-size: 25px;line-height: 22px;font-weight: normal; text-decoration: none; color:#202025;}



.login {font-size:14px;font-family:Arial, Helvetica, sans-serif;color: #FFFFFF;width:120px;height:16px;padding:0;border: 0px;background-color: #505055;float:left;margin:2px;padding:2px;opacity: 0.6;}


a.page_cnt{ 
font-family: Verdana, sans-serif;font-size: 15pt; font-weight: bolder; color: #FFFFFF;
padding:3px;margin:2px;
text-decoration: none;
background-color:#9A0000;
border: 1px solid #303030;
	}
a.page_cnt:hover{ 
font-family: Verdana, sans-serif;font-size: 15pt; font-weight: bolder; color: #000000;
background-color:#9A0000;
text-decoration: none;
border: 1px solid #303030;
	}
a.page_cnt_akt{ 
font-family: Verdana, sans-serif;font-size: 15pt; font-weight: bolder; color: #FF8800;
padding:3px;margin:2px;
background-color:#202020;
border: 1px solid #000000;
	}





.link_akt_box{
font-family:MyCustomFont, Garamond, Georgia, serif; 
font-size: 17px; 
text-decoration: none;
line-height:1.1em;
color:#FFFFFF;
margin:5px;padding:5px;
border:1px solid #FFFFFF;
background-color:#990000;
}

.link_pass_box{
font-family:MyCustomFont, Garamond, Georgia, serif; 
font-size: 17px; 
text-decoration: none;
line-height:1.1em;
color:#990000;
margin:5px;padding:5px;
border:1px solid #990000;
background-color:#DDDDDD;
}

.linkboxasussen{
float:left;
}



#bereichlogo {
	color: white;
	display: block;
	padding: 0.5em;
	text-decoration: none;
	float: left;
margin-top:-10px;	
}
#bereichlogo {
	width: auto;
}

#steuerung li {
	list-style: none;
	float: left;
}
#steuerung a {
	display: block;
	height: 25px;
	width: 100%;
	padding: 0.5em;
	text-decoration: none;
	color: white;
	color: #303035;
}	
.menue-button {
	display: none;
}		
#steuerung {
	float: right; 
	margin-right:18px;
}
#steuerung a:hover {
	color: #FF9900;
	
}	
/* CSS erweitern um MENÜ-Button und entsprechende Steuerung */
/*	Menü-Button oben rechts einblenden bei kleiner als 600px */
@media only screen and (max-width:600px) {
	.menue-button {
		display: block;
	}
	.menue-button {
		background-color: #FF9900;
		display: block;
		position: absolute;
		right: 0;
		padding-top:20px;
		padding: 0.5em;
		color: white;
		cursor: pointer;
		text-decoration: none;
	}	

	#steuerung {
		float: left;
		width: 100%;
		display: none;
	}	
	#steuerung li {
		width: 100%;
		border-bottom: 2px solid silver;
	}	
	.menue-button:hover {
		color: black;
		background: orange;
	}
}
/* die Magie, um die Steuerung einzublenden (auch auf mobile Devices) */
#nav-menue:target #steuerung {
	display: block;
}
/* ausblenden des Menü-Buttons zum öffnen - somit wird der zum Schließen sichtbar */
#nav-menue:target .menue-button-beschr-open {
	display: none ; 
}

.clear0{clear:both;}
.clear10{clear:both;height:10px;}
.clear20{clear:both;height:20px;}
.clear30{clear:both;height:30px;}
.clear40{clear:both;height:40px;}
.clear50{clear:both;height:50px;}
.clear60{clear:both;height:60px;}
.clear70{clear:both;height:70px;}
.clear80{clear:both;height:80px;}
.clear90{clear:both;height:90px;}
.clear100{clear:both;height:100px;}
.clear150{clear:both;height:150px;}


.picboxRbig{
width:40%;min-width:220px;height:auto;float:right;margin:2%;margin-right:0px;clear:right;
}

.pic100{
width:100%;height:auto;margin-bottom:1%;
}
.pic50L{
width:46%;height:auto;float:left;margin-right:2%;margin-top:2%;clear:left;
}
.pic50R{
width:46%;height:auto;float:right;margin-left:2%;margin-top:2%;clear:right;
}

.bild_boxRbig{
width:48%;min-width:220px;height:auto;float:right;margin:2%;margin-right:0px;margin-top:0px;clear:right;
}


