* {
    margin:0;
    padding:0;
}

#kreis {
    position:absolute;
    top:185px;
    left:35%;
    opacity: 1;
    transition: opacity 4s, visibility 4s;
}

@media only screen and (max-width:1200px) {
    #kreis {
       /* top:-700px;
       display:none;*/
       opacity: 0;
       transition: opacity 4s, visibility 4s;
    }
} 

nav {
    background-color:rgba(247, 252, 105);
    height:28px;
    max-width:700px;
    top:0;
    text-transform:uppercase;
    font-family:Arial, Helvetica, sans-serif;
    position:sticky;
    padding: 0 30px;
}


nav li {
    line-height:140%;
    display:inline-block;
    list-style-type:none;
    margin:3px 20px 0 0;
}

li a {
    color:rgb(13, 13, 13);
    text-decoration:none;
}

li a:hover {
    color:rgb(49, 49, 49);
    text-decoration:none;
    font-weight:bold;
}

#herum {
    position: absolute;
    top:60px;
    left: 0;
    right:0;
    margin: 0 auto;
    background-color:rgb(229, 172, 13); 
    max-width: 700px;
    min-height: 450px;
    padding:15px;
    text-align:center;
}

.mittig {
    display: table-cell;
    vertical-align: middle;
    padding:5%;
}

.rechtecke {
    width:48.93%;
    height: 200px;
    margin-top: 15px;
    float:left;
}

#trotzdem {
    background-color: white !important;
}

@media only screen and (min-width: 200px) and (max-width:750px){
    #herum {
        min-width:550px;
    }
    .rechtecke {
        width:100%;
        min-width:500px;
    }

    li {
        margin:3px 5px 0 0;
    }
    nav {
        padding: 0; 
        min-width:500px; 
    }
}

#drunter {
    background: rgb(228, 228, 228);
    max-width: 800px;
    margin-top:20px;
    padding:20px;
    color:rgb(44, 43, 43);
    text-align:justify;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    line-height:140%;
    columns: 2;
    column-gap:25px;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}

h2 {
    font-family: Teko, sans-serif;
    letter-spacing:.05em;
    font-optical-sizing: auto;
    font-size:36px;
    text-align:left;
}

#textbild {
    width:100%;
}

p {
    margin-bottom:0.35em;
}

@font-face {
    font-family: Teko;
    src: url(../fonts/Teko-Regular.woff2) format(woff2);
    font-weight: 300;
    font-style: normal;
    /*font-display:swap;*/
}