body{
	margin: 10px auto;
	max-width: 75em;
	font-family: sans-serif;
	font-size: 1em;
	line-height: 1.5;
	color: #333333;
	display: grid;
    grid-template-columns: repeat(7, 1fr);
			
    grid-template-areas: 
	"head head head head head head head"
	"nav  nav  nav  nav  nav  nav  nav"
        "main main main main main main main" 
	"foot foot foot foot foot foot foot";
	}

header, footer {
	padding: 10px;
	margin: 10px;
	}

header {
	background: rgba(255,245,233,0.3);		
	height:160px;
	text-align: center;
	grid-area: head;	
	/*box-shadow:2px 0px 2px 0px #666, -2px 0px 2px 0px #666;*/
	box-shadow: -7px 0px 6px -8px rgba(0,0,0,1), 7px 0px 6px -8px rgba(0,0,0,1);
	}

nav {	
	padding: 0px 10px 0px 10px;
	margin: 0px 10px 0px 10px;
	/*background: rgba(255,245,233,1);	*/
	grid-area: nav;				
	box-shadow: 0px 6px 6px -6px rgba(0,0,0,1);
	}

nav>ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	/*background: rgba(255,245,233,1);*/
	}

nav li {
	float: left;
	}

nav li a {
	font-weight: bold;
	display: block;
	color: rgba(0,0,0,1);
	text-align: center;
	padding: .5em 1em .5em 1em;
	margin: 0;
	text-decoration: none;
	}
	
/*====SubNav===*/
/*===Navigation innerhalb einer Seite/Unterseite===*/
.subnav {	
	padding: 0px 10px 0px 10px;
	margin: 0px 10px 0px 10px;			
	/*box-shadow: 0px 6px 6px -6px rgba(255,0,0,1);*/
	}

.subnav>ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.subnav li {
	float: left;
	}

.subnav li a {
	font-weight: bold;
	display: block;
	color: rgba(0,0,0,1);
	text-align: center;
	padding: .5em 1em .5em 1em;
	margin: 0;
	text-decoration: none;
	}
/*=== ENDE: Navigation innerhalb einer Seite/Unterseite===*/



main {
	padding: 10px 10px 10px 0px;
	margin: 10px;
	text-align: justify;
	/*background: rgba(255,245,233,1);*/
	grid-area: main;		
	/*box-shadow:2px 0px 2px 0px #666, -2px 0px 2px 0px #666;	*/
	}

footer {
	/*background: rgba(255,245,233,1);*/
    text-align: center;		
    grid-area: foot;			
	}

/* ####################################################### */
/* ### ANFANG: Links ################################## */

a{
	text-decoration: none;
	color: rgba(0,0,0,1);
	}

.textlink{
font-weight: bold;
font-style:italic;
border: solid rgba(0,0,0,0.4);
border-width: 0 0 2px 2px;
	}

.textlink::before{
content:"\0000A0";
}	

/*
.textlink::after{
content: "\002193";
}*/

a:hover {
	background: rgba(221,196,168,1);
	}

/*DownLoadLink*/	
.dll::after {
    content: " " url("/assets/images/icons/icon_download_pdf.png");
    }

/* ### ENDE: Links#################################### */
/* ####################################################### */	


img{
        loading:lazy;
        }
	
#toplogo{
	height: 90%;
        loading: eager;
	}		
.imgfullwidth{
        width: 100%;
        }

.imgleft{
	width: 200px; 
	height: auto;
	float: left;
	margin: 2px 20px 2px 0px;
	}

.imgleft100{
	width: 100px; 
	height: auto;
	float: left;
	margin: 2px 10px 2px 0px;
	}
	
.imgleftaside {
	width:80px;
	float:left;
	}



.imgrightaside {
	width:80px;
	float:right;
	}
	


article{
    padding: 1px 10px 1px 10px;
	margin: 5px 0px 20px 0px;
	/*box-shadow:2px 0px 2px 0px #666, -2px 0px 2px 0px #666;*/
	}


article.kachel{
	margin-right: 20px;
	width: 44%;
	height: 170px;
	float: left;
	box-shadow: -6px 0px 6px -6px rgba(0,0,0,1);
	}


svg {

    -webkit-filter: drop-shadow(12px 12px 7px rgba(0,0,0,0.5));      
    filter: drop-shadow(12px 12px 7px rgba(0,0,0,0.5));  

}





/* ####################################################### */
/* ### ANFANG: Tabellen ################################## */

table, tr,td{
	border:solid 1px rgba(255,245,233,1);
	}

table{  
border-collapse: separate;
  border-spacing: 10px 10px;
background-color: rgba(255,255,255,1);
text-align: center;
}


th{
background-color: rgba(255,245,233,1);
padding: 10px 10px 10px 10px;
}

td{
padding: 10px 10px 10px 10px;
background-color: rgba(255,245,233,0.3);
}

.cell_orange{
background-color: rgba(242,150,63,0.5);
}

.cell_blue{
background-color: rgba(55,92,163,0.5);
}

.cell_red{
background-color: rgba(180,11,26,0.5);
}

.cell_green{
background-color: rgba(37,124,72,0.5);
}

.cell_yellow{
background-color: rgba(255,165,0,0.5);
}

/* ### ENDE: Tabellen #################################### */
/* ####################################################### */	


/* ##### Start: Akkordeon #######################*/
/* ############################################# */	
details {border: 1px solid rgb(0,0,0,1); border-radius: 5px; margin-bottom: .5rem;}
summary {font-weight:bold; cursor: pointer; padding: 1rem;}
.akkordeon-inhalt {padding: .5rem 2rem 4px 2rem;}

/* Der verzögerungseffekt */
details[open] summary ~ * {animation: sweep .7s ease-in-out;}

@keyframes sweep {
  0%    {opacity: 0; margin-left: -20px}
  100%  {opacity: 1; margin-left: 0px}
}
/* ##### Ende: Akkordeon #######################*/
/* ############################################ */	


/* ####################################################### */
/* ### ANFANG: Sections ################### */

section{
    padding:25px;
	margin:0em 0em 0em 3em;
	border-radius:2em;
	border-width:0 0 0 6px;
	border-style: double;
	}

.chamo100{
    background: rgba(255,245,233,1);
    border-color: rgba(242,150,63);
        color: rgba(0,0,0,1);
	}

.chamo80{
    background: rgba(255,245,233,0.8);
    border-color: rgba(255,245,233);
    color: rgba(0,0,0,1);
	}

.chamo50{
    background: rgba(255,245,233,0.5);
    border-color: rgba(255,245,233);

	}

.chamo20{
    background: rgba(255,245,233,0.2);
    border-color: rgba(255,245,233);

	}

.orange100{
        background: rgba(242,150,63,1);
	border-color:rgba(242,150,63);
        color: rgba(255,255,255,1);
    }

.orange80{
    background: rgba(242,150,63,0.8);
	border-color:rgba(242,150,63);
    }

.orange50{
    background: rgba(242,150,63,0.5);
	border-color:rgba(242,150,63);
    }

.orange20{
    background: rgba(242,150,63,0.2);
	border-color:rgba(242,150,63);
    }

.red100{
    background: rgba(180,11,26,1);
	/*background: linear-gradient(95deg, rgba(180,11,26,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,1) 100%);*/
        color: rgba(255,255,255,1);
	}

.red80{
    background: rgba(180,11,26,0.8);
	/*background: linear-gradient(95deg, rgba(180,11,26,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.8) 100%);*/
color: rgba(255,255,255,1);
	}
	
.red50{
    background: rgba(180,11,26,0.5);
	/*background: linear-gradient(95deg, rgba(180,11,26,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.5) 100%);*/
	}
	
.red20{
    background: rgba(180,11,26,0.2);
	/*background: linear-gradient(95deg, rgba(180,11,26,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.2) 100%);*/
	}
		
.green100{
    background: rgba(37,124,72,1);
    /*background: linear-gradient(95deg, rgba(37,124,72,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.2) 100%);*/
        color: rgba(255,255,255,1);
	}

.green80{
    background: rgba(37,124,72,0.8);
    /*background: linear-gradient(95deg, rgba(37,124,72,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.2) 100%);*/
color: rgba(255,255,255,1);
	}

.green50{
    background: rgba(37,124,72,0.5);
    /*background: linear-gradient(95deg, rgba(37,124,72,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.2) 100%);*/
	}

.green20{
    background: rgba(37,124,72,0.2);
    /*background: linear-gradient(95deg, rgba(37,124,72,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.2) 100%);*/
	}

.blue100{
    background: rgba(55,92,163,1);
	/*background: linear-gradient(95deg, rgba(55,92,163,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.2) 100%);*/
        color: rgba(255,255,255,1);
	}

.blue80{
    background: rgba(55,92,163,0.8);
	/*background: linear-gradient(95deg, rgba(55,92,163,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.2) 100%);*/
color: rgba(255,255,255,1);
	}

.blue60{
    background: rgba(55,92,163,0.6);
	/*background: linear-gradient(95deg, rgba(55,92,163,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.2) 100%);*/
	}

.blue20{
    background: rgba(55,92,163,0.2);
	/*background: linear-gradient(95deg, rgba(55,92,163,0.5) 2%, rgba(255,233,210,0.2) 6%, rgba(255,233,210,0.2) 100%);*/
	}
	
/* ### ENDE: Farben für die Sections ############### */
/* ################################################# */	

.white{
        color: rgba(255,255,255,1);
font-weight:bold;
} /*SPAMSCHUTZ*/


.team{background: rgba(255,235,220,0.7);padding:5px;height:250px;}
.team:before, .team:after { content: "";  display: table;}
.team:after{
    clear: both;
    }
.m-bild{
	float: left;
	margin: 2px 20px 2px 0px; 
        border-width:5px;
        border-color:rgba(255,255,255,1);
        border-style:solid;
        border-radius:40%; }
.m-name{font-size:1.2em;font-weight:bold;}
.m-bereich{font-size:0.8em;}

/* #### Anpassung Viewport #### */
@media screen and (max-width: 760px) {

body{
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-template-areas: 
	"head"
	"nav"
        "aside"
        "main" 
	"foot";
	}
}