/* @import url('normalize') "bin mir nixht sicher obso richtig! SN */

/* die Klasse Cons ist für die Konstruktionsphase und wird auf den underConstruktion Butten angewendet. Sie kann entvernt werden, wenn nicht mehr gebraucht!! */
.cons	{
		position: absolute;
		top: 10px;
		right: 100px;
		z-index: 15;
}

/* --------------------------------------------------
        Allgemeine Grundeinstellungen                              
 ----------------------------------------------------*/
html {
  box-sizing: border-box;
}
*, *::before, *::after {
  box-sizing: inherit; 
}


h1	{
	color:grey;
			}
h2 {
	text:align center;
	color:grey;
	
}
			
main	{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	width: 100%;
	padding: 2rem;
		}
		

.box-ausbildung {
	width: 1000px;
	flex-flow: row wrap;
	padding: 10px;
	border: 0px solid black;
	background-color: rgb(255, 47, 148, 0.0);
	}
	
article	{
	width: 400px;
	padding: 10px;
	border: 0px solid black;
	background-color: rgb(255, 47, 148, 0.0);
	}



.aside	{
	position: -webkit-sticky;
	position: sticky;
	display: table-cell;
	padding: 0 1rem 0 1rem;
	}
	
	
	
			
.header   {
			background-color:rgb(0,252,255);
			text-align: center;
			}

.wrapper {
			background-color:rgb(255,255,255, 0.3); /* transparent */
			}


.container {
			display: block;
			overflow: auto;
			}
			
.footer 	{
			text-align: center;
			}

.kasten {
			display: flex;
			flex-direction: row;
			align: center;
			border: 1px;
		}


.box-sn	{
	padding: 20px;
	margin: 20px 10px;
	border: 0;
	border-radius: 10px/10px;
	box-shadow: 0px 10px 10px rgb(94,94,94, 0.9);
	background-color: rgb(255,255,255, 0.94);
	}
			
			
.nav-ul {
	background-color: #75d5ff;
	margin:0;
	}
	
.box-sn-top	{
	padding: 20px;
	margin: 10px;
	border: 10px;
	border-radius: 0px 0px 10px 10px;
	box-shadow: 0px 20px 20px rgb(33,33,33, 0.6);
	background-color: rgb(255,255,255, 0.96);
	}
	
.box-struktur	{
	padding: 20px;
	margin: 10px;
	border: 0;
	display: flex
	flex-flow: row wrap;
	justify-content: center;
	width: 100%;
	border-radius: 0px 0px 10px 10px;
	

	}

.cont_color	{
	padding-top: 10px;
	padding: 2 em;
	margin: 25px;
	background-color: rgb(254,255,255, 0.6);
	text-align: center;
	border-radius: 10px/10px;
	box-shadow: 0px 20px 20px rgb(33,33,33, 0.6);
	}
	
	
.nav-ul a:hover, .nav-ul a:focus {
   background-color:#011892; /* Mitternacht */
   color:#c0c0c0; /* Ocean */
	}
	
.nav-li {
	list-style: none;
	margin-left: 0;
	border-bottom: 1px solid black;
	}
	
.nav-st	{
	position: -webkit-sticky;
	position: sticky;
	top: 3em;
	z-index: 10;
	}
	
.nav-li-a {
	padding: 0.6em 2rem;
    display: block; 
	}
	
.img-art {
	float: right;
	margin: 0.2em 1em 1.2em 0.2em;
	max-width: 40%;
	height: auto;
	}
	
.autor	{
	width: 80%;	
	}	
	
	/* Media Abfrage 680 px/ 4em */
@media screen and (min-width: 680px)	{

.main_bg	{
	background-image: url('../content/bg_imgage/bg_wirbelsäule.png');
	background-attachment: fixed;
	}
	
.nav_st	{
	position: -webkit-sticky;
	position: sticky;
	top: 30px;
	box-shadow: 0px 20px 20px rgb(70,87,235, 0.5);
	box-shadow: 0px 10px 10px rgb(66,66,66, 0.5);
	z-index: 11;
	}
	
.nav-ul {
    padding: 0 2rem;
    overflow: hidden;	
	}
  
.nav-li {
	float: left;
	display: inline-block;
	border: none;
	width: auto; 
	}
.nav-li-a {
	padding: 0.7em 1.2rem;
	display: inline-block;
    }
    
    
@media screen and (min-width: 85em) {
	.wrapper {
		margin: 0 auto;
		padding: 0px;
		max-width: 85em;
		border: 0;
		border-radius: 10px 10px 10px 10px;
		box-shadow: 12px 12px 20px rgb(33,33,33,0.6);
	}