* {
    margin: 0px;
    padding: 0px;
    overflow: auto;
}

header {
    background-color: #00FFFF;
    width: 100%;
    position: fixed;
}

#seiteninhalt {
    height: calc(100vh - 175px);
    animation: blur 0.7s ease-out forwards;
    margin-top: 175px;
    background: url(images/matrix.gif);
}

#seiteninhalt-schulischerweg {
    margin-top: 175px;
    background: url(images/matrix.gif);
}

@keyframes blur {
    0% {
        opacity: 0.5;
        filter: blur(10px);
        background-color: black;
    }

    100% {
        opacity: 1;
        filter: blur(0);
        background-color: black;
    }
}

nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 90px;
}

h1 {
    display: inline-block;
    position: fixed;
    margin-top: 55px;
    margin-left: 50px;

    font-family: Protest Guerrilla, Arial;
    font-size: 30px;
    color: white;
    text-decoration: underline;
}

.schulischer-weg-inherit {
    position: inherit;
}

ul {
    display: inline-block;
    margin-top: 175px;
    margin-left: 130px;
    position: absolute;
    max-width: 700px;

    font-family: Archivo Black, Arial;
    font-size: 17.5px;
}

ul li {
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
}

.p1 {
    display: inline-block;
    margin-top: 125px;
    margin-left: 100px;
    position: absolute;
    max-width: 700px;

    font-family: Archivo Black, Arial;
    font-size: 17.5px;
    color: white;
}

.p2 {
    position: absolute;
    display: inline-block;
    margin-left: 100px;
    margin-top: 10px;
    max-width: 700px;
    max-height: 200px;

    font-family: Archivo Black, Arial;
    font-size: 17.5px;
    color: white;
}

#p1_index {
    max-width: 450px;
    margin-left: 200px;
    margin-top: 200px;
}

#p1_hobbies {
    max-width: 700px;
    max-height: 200px;
    margin-left: 200px;
}

img {
    max-width: 400px;
    max-height: 400px;
    border-radius: 30px;
    border: 20px solid #000;
}

.schulischer-weg-p1 {
    position: inherit;
    align-self: auto;
    margin-top: 0;
    display: inline-block;
    margin-left: 100px;
    max-width: 700px;
    font-family: Archivo Black, Arial;
    font-size: 17.5px;
    color: white;
}

#bwdbern {
    display: inline-block;
    margin-left: 100px;
    max-width: 700px;

    font-family: Archivo Black, Arial;
    font-size: 17.5px;
    color: white;
}

.arrow {
    width: 100px;
    margin-left: 140px;
}

.school {
    display: flex;
    align-items: center;
}

.schoolimg {
    width: 300px;
    margin: 50px;
    margin-right: 0px;
}

.logo {
    font-size: 130px;
    font-family: Archivo black, Arial;
    text-decoration: none;
    color: black;
    transition-duration: 0.2s;
}

.logo:hover {
    text-decoration: underline;
}

.logo:active {
    color: white;
}

#active {
    text-decoration: underline;
}

.navs {
    font-family: Protest Guerrilla, Arial;
    font-size: 30px;
    color: black;
    text-decoration: none;
    transition-duration: 0.2s;
}

.navs:hover {
    text-decoration: underline;
    transform: scale(1.1);
}

.navs:active {
    color: white;
}


::-webkit-scrollbar {
    background: #00FFFF;
    width: 12px;
}

::-webkit-scrollbar-thumb {
    background: #000;
    border-radius: 90px;
}

.username_p1 {
    margin-top: 200px;
    margin-left: 0px;
    transition-duration: 0.1s;
    color: white;
    display: inline-block;
    position: absolute;
    max-width: 700px;
    font-family: Archivo Black, Arial;
    font-size: 17.5px;
}

.username_p1:hover {
    text-decoration: underline;
    color: rgb(0, 115, 255);
}

.username_p1:active {
    color: #00FFFF;
}

.image_index {
    margin-left: 900px;
    margin-top: 100px;
    border: none;
}

.image_uber_mich {
    margin-left: 900px;
    margin-top: 100px;
}

.image_hobby_gaming {
    margin-left: 1000px;
    margin-top: 125px;
    max-height: 200px;
    margin-right: 50px;
    border: none;
}

.image_hobby_music {
    margin-left: 200px;
    margin-top: 10px;
    max-height: 200px;
    border: none;
}

#image_dc_logo {
    margin-top: 225px;
    max-width: 200px;
    border: none;
}

#dc_link {
    margin-left: 400px;
    max-width: 200px;
    color: rgba(0,0,0,0)
}

#image_insta_logo {
    margin-top: 225px;
    max-width: 200px;
    border: none;
}

#insta_link {
    max-width: 200px;
    margin-left: 250px;
}