#wrapper { 
    display:flex;
    flex-wrap: wrap; 
    min-height: 600px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin:auto; 
    width:90%;
    height: 100%;
    background-color:#ffefd5;
    padding: 10px;
    border-radius: 20px;
    box-shadow: 4px 4px 4px rgba(0,0,0,0.15);
}
body{
    background-color: powderblue;
}

header{
    flex: 1 1 100%;
    margin: 5px;
}
header h1{
    text-align: center;
    color: darkslategray;
}
header h2{
    text-align: center;
}
header table{
    flex: 1 1 100%;
}
p{
    text-align: justify;
}

nav{ 
    background-color:rgb(96, 177, 177); 
    box-shadow: 4px 4px 4px rgba(0,0,0,0.3); 
    border-radius: 20px; 
    margin: 5px; 
    width: 100%;
    padding: 2px; 
} 
nav ul{
    text-align: center;
}
nav ul li{     
    list-style: none; 
    margin: 2px; 

    display: inline-flex; 
} 

nav ul li a{ 
    background-color:darkcyan; 
    color:white ; 
    padding: 2px; 
    display: block; 
    border-radius: 5px; 
    border: 2px dotted rgb(1, 95, 95);  
} 
nav ul li a:hover{ 
    background-color: bisque; 
    color: darkcyan;
    transition: color 0.2s; 
} 

main{
    flex: 100%;
    height: auto;
    display: flex; 
    flex-wrap: wrap;
}
aside{
    flex:30%;
    flex-basis:300px;
    background-color:darkcyan;
    border-radius: 20px;
    margin: 5px;
    padding: 10px;
    box-shadow: 4px 4px 4px rgba(0,0,0,0.3);
}
aside h1, aside h2{
    color: bisque;
    text-align: center;
}
aside summary{
    font-size: large;
    font-weight: bold;
    text-align: left;
    color: white ;
    margin: 2px;
    padding: 2px;
    border-radius: 2px;
}
aside p{
    padding: 2px;
    text-align:center;
    color: white;
}
.quellen{
    font-size: small;
    color: white;
}
.img{
    width: 100%;
    border-radius: 5px;
    text-align: center;
    flex-basis: 200px;
    flex: inline;
    margin: 10px;
    flex-wrap: wrap;
}
article{
    flex:70%;
    flex-basis: 700px ;
    display: inline-block;
    flex-wrap: wrap;
    background-color:rgb(175, 238, 230);
    border-radius: 20px;
    margin: 5px;
    padding: 15px;
    box-shadow: 4px 4px 4px rgba(0,0,0,0.3);
}
article h2{
    text-align: center;
    color:darkslategray
}
article table tr{
    display: inline-block; 

}
.umimg{
    height: 20%;
}

summary{
    font-size: large;
    font-weight: bold;
    text-align: center;
    color: darkcyan ;
    margin: 2px;
    padding: 2px;
    border-radius: 2px;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

footer{
    text-align: center;
    width: 100%;
    height: 15%;
    background-color: rgb(96, 177, 177);
    box-shadow: 4px 4px 4px rgba(0,0,0,0.3);
    border-radius: 20px;
    margin: 5px;
    padding: 5px;
}
footer p{
    display: inline-block;
}


.icon{
    color: rgb(1, 95, 95);
    margin: 2px;
    font-size: large;

}
.icon:hover{
    color: aqua;
    transition: color 0.2s;
}
