#Header {
    position: fixed ;
    width: 100vw ; 
    color: #eeeeee ;
    text-align: center ;
}

/* Überschrift ---------------------------------------------------- */

h1 {
    display: flex ;
    align-items: center ;
    justify-content: center ;
    font-family: Header, Verdana, Arial ;
    font-size: 8vh ;
    margin: 0 auto ;
    background-image: url("../img/header.jpg") ;
    padding: 0 1vw 1.5vh 1vw ;
}

h1 a {
    text-decoration: none ;
    color: #eee ;
}

h1 a:hover {
    text-shadow: 4px 4px blue ;
}

/* Navigationsleiste ---------------------------------------------- */

nav {
    width: 100vw ;
    height: 5vh ;
    background-color: #eee ;
    z-index: 5;

}

nav ul {
    display: flex ;
    justify-content: center ;
}

nav ul li {
    list-style: none ;
    position: relative ;
}

nav ul li a {
    display: block ;
    font-size: 2vh ;
    color: black ;
    text-decoration: none ;
    padding: 1.5vh 2vw ;
    
}

nav ul li a:hover {
    color: blue ;
}

nav ul li ul {
    display: none ;
    position: absolute ;
    background-color: #0a004e ;
    padding: 0.5rem ;
    border-radius: 0px 0px 10px 10px ;
    z-index: 3;
}

nav ul li:hover ul {
    display: block ;
}

nav ul li ul li a {
    color: #eee ;
    padding: 0.5rem 1vw ;
    border-radius: 10px ;
    border-bottom: blue solid ;
}

nav ul li ul li a:hover {
    color: #eee ;
    background-color: #1900ba ;
}

/* Footer -------------------------------------------------------- */

#Footer {
    position: static ;
    width: 100vw ;
    height: 12vh ;
    background-image: url("../img/header.jpg") ;
}

#MadeBy {
    color: black ;
    background-color: #eee ;
    font-size: 2vh ;
    text-align: center ;
    padding: 0.5vh 0.5vw ;
}

#Impressum {
    font-family: Header, Verdana, Arial ;
    font-size: 5vh ;
    padding: 1vh 1vw 1.5vh 1vw ;
    text-align: center ;
}


/* Andere Screens ------------------------------------------------------------------------------ 

@media only screen and (max-width: 430px) {    /* Phone Portrait 
    
    h1 {
        padding: 0 1vw 0 1vw ;
    }

    h1 a {
        font-size: 5vh ;
        padding: 0 1vw 1vh 1vw ;
    }

    nav {
        height: 7.4vh ;
    }

    nav ul li a {
        font-size: 1.4vh ;
        padding: 0.5rem ;
    }

    nav ul {
        flex-wrap: wrap ;
    }

    nav ul li:hover ul { /* schaltet Dropdown aus 
        display: none ;
    }

    .inhalt {
        min-height: 93vh ;
    }

    #Footer {
        height: 7vh ;
    }

    #MadeBy {
        font-size: 1vh ;
    }

    #Impressum {
        font-size: 2vh ;
    }

}

/* @media only screen and (min-width: 431px) {    /* dazwischen 
    h1 a {
        color: purple ;
    }
} 

@media only screen and (min-width: 600px) {    /* Phone Landscape  
    
    h1 {
        padding: 0 1vw 0 1vw ;
    }

    h1 a {
        font-size: 7vh ;
        padding: 0 1vw 1.5vh 1vw ;
    }

    nav {
        height: 6vh ;
    }

    nav ul li a {
        font-size: 2vh ;
        padding: 0.5rem ;
    }

    nav ul li:hover ul { /* schaltet Dropdown aus 
        display: none ;
    }

    .inhalt {
        padding-top: 20vh ;
    }

    #Footer {
        height: 12vh ;
    }

    #MadeBy {
        font-size: 1vh ;
    }

    #Impressum {
        font-size: 4vh ;
    }
}

@media only screen and (min-width: 950px) {  
    
    .col_1, .col_1_2, .col_1_3, .col_2_3, .col_1_4, .col_3_4, .col_1_2 {
        width: 100% ;
    }

    .column{
        margin-left: 0 ;
    }
}

@media only screen and (min-width: 1100px) {    /* Tablet Portrait 
    h1 {
        padding: 0 1vw 0 1vw ;
    }

    h1 a {
        font-size: 5.5vh ;
        padding: 0 1vw 1.5vh 1vw ;
    }

    nav {
        height: 4vh ;
    }

    nav ul li a {
        font-size: 2vh ;
        padding: 0.7rem ;
    }

    nav ul li:hover ul { /* schaltet Dropdown aus 
        display: none ;
    }

    .inhalt {
        padding-top: 15vh ;
        min-height: 89vh ;
    }

    #Footer {
        height: 11vh ;
    }

    #MadeBy {
        font-size: 2vh ;
    }

    #Impressum {
        font-size: 4vh ;
    }
}

@media only screen and (min-width: 1400px) {    /* Desktops + Tablets - Landscape  
    h1 {
        padding: 0 1vw 0 1vw ;
    }

    h1 a {
        font-size: 8vh ;
        padding: 0 1vw 1.5vh 1vw ;
    }

    nav {
        height: 5vh ;
    }

    nav ul li a {
        font-size: 2vh ;
        padding: 1rem 2vw ;
    }

    nav ul li:hover ul { /* schaltet Dropdown wieder ein 
        display: block ;
    }

    .inhalt {
        padding-top: 20vh ;
        min-height: 88vh ;
    }

    #Footer {
        height: 12vh ;
    }

    #MadeBy {
        font-size: 2vh ;
    }

    #Impressum {
        font-size: 5vh ;
    }
}

*/