@import "navigation.css";
@import "tabelle.css";

body {
    background-color: #FFF0BF;
    padding: 0px;
    margin: 0px;
    margin-top: 10px;
    height: 100vh; /* Viewport-Höhe */
    font-size: 1.1em;
}

.pagetitle {
    color: grey;
    font-size: 1em;


}

.verteckt {
    display: none;
}

body a {
    text-decoration: none;
}



.overGrid {
    min-width: 0;
    display: grid;
    gap: 20px;
    grid-template-areas:
        "h h h"
        "m m m "
        "f f f";
}

.header {
    grid-area: h;
    background-color: #E2A76F;
    padding: 10px;
    margin: 0;
    height: 100px;
    display: grid;
    grid-template-areas:
            "hc s s  mn";
}

.Seitentitel {
    grid-area: s;
    text-align: center;
}

.main-nav{
    grid-area: mn;
}

.header-content {
    grid-area: hc;
    margin: 0;
    padding: 0;
  
}

.header-content a {
    display: inline-block;
    /* oder block, je nach Layout */
    box-sizing: border-box;
    /* Border/Padding gehören zur Box-Größe */
}

.header-content a img {
    display: block;
    /* entfernt weiße Ränder unter Bildern */
    width: 100px;
    /* gewünschte Breite */
    height: auto;
    /* skaliert proportional */
}

.header h1 {
    font-size: 2.5em;
    color: white;
}



nav {
    background-color: #E2A76F;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0px;
    padding: 10px 0 0 0;
}

.main {
    grid-area: m;
    text-decoration: none;
    padding:0px;
    margin: 10px;
    min-width: 0;
    min-height: calc(100vh - 250px);
}

.footer {
    grid-area: f;
    background-color: #E2A76F;
    height: 150px;
    display: grid;
    grid-template-areas:
        "fn fs"
        "fc fc";
    }

.footerGrid-coockie{
    grid-area: fc;
    text-align: center;
    color: white;
    font-size: 1.3em;
    margin: auto;
    height: 25px;

}
.footerGrid-suche {
    grid-area: fs;
    text-align: center;
    padding: 15px;

}

.footerGrid-navi {
    grid-area: fn;
    text-align: center;
    padding: 1px;
    margin: 0px;
}



.footer-menu ul{
    width: 100%;
    display: block;
    list-style: none;
    padding: 0;
    margin: 0;

}

.footer-menu li {
    margin: 0;
    padding: 10px;
    height: 25px;
    width: 90%;;
}

.footer-menu a {
    height: 100%;
    width: 100%;
    color: white;
}


 @media (max-width: 768px) {

     /* Stile für kleine Bildschirme (z.B. Smartphones) */
.header-content {
display: none;
    }


.header {
        grid-template-areas:
            "s s  mn";
    }


.main {

        min-height: calc(100vh - 350px);
    }


.footer {
        grid-area: f;
        background-color: #E2A76F;
        height: 250px;
        display: grid;
        grid-template-areas:
            "fn"
            "fs"
            "fc";
    }



 }