/* Das folgende CSS ist für alle Nutzer */
/* vi:set ts=3 sts=3 sw=3: */


body {
    font-size: 2vh;
    justify-self: center;
    margin-top: 0px;
    min-width: 90%;
    max-width: 90%;
    min-height: 100vh;
    display: grid;

    grid-template-areas:
        "header header header"
        "nav nav nav"
        "main main main"
        "empty footer empty1";

    grid-template-columns: 7vw 72vw 7vw;
    grid-auto-rows: 12vh min-content auto 2.5em;
    gap: 1vh;
    background-color: Ivory;
}

/* für logo und header */
body>img {
    grid-column-start: span 3;
    ;
    align-self: center;
    justify-self: center;
    max-height: 100%;
    min-width: 100%;
    object-fit: fill;
}


#logo {
    grid-column-start: span 3;
    ;
    grid-column-end: -1;
    width: 100%;
    max-height: 100%;
    font-size: 1vw;
    grid-area: logo;
    justify-self: center;
    object-fit: contain;
}

#hdr {
    grid-column-start: span 3;
    grid-column-end: -1;
    max-height: 100%;
    width: 100%;
    grid-area: header;
    object-fit: contain;
}

nav {
    max-width: 100%;
    grid-area: nav;
}

nav>ul {
    margin: 0.5em;
    padding: 0;
    list-style-type: none;
}

nav li {
    display: inline;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 10px 10px;
}

#SubMenue li {
    background-color: var(--goodcolor);
    color: rgb(244, 249, 242);
}

#SubSubMenue li a {
    padding-left: 10px;
    padding-right: 10px;
    justify-self: center;
    border-radius: 10px 10px;
    background-color: rgb(18, 84, 215);
    color: rgb(253, 253, 253);
}

nav a {
    text-decoration: none;
}

nav a:focus,
nav a:hover,
nav a:active {
    text-decoration: underline
}


main {
    margin-bottom: 2.5em;
    grid-area: main;
    max-width: 100%;
    min-height: 100%;
}

h1 {
    margin: 0;
}

#super {
    justify-self: center;
    align-self: center;
    max-width: 50vw;
}


/* CSS for show-Tables */
:root {
    --titlecolor: burlywood;
    --titlecolorS: wheat;
    --oddcolor: Cornsilk;
    --evencolor: Ivory;
    --oddcolorS: moccasin;
    --evencoloSr: Ivory;
    --goodcolor: greenyellow;
    --badcolor: rgba(241, 15, 38, 0.232);

}
table.MasterBlock {
    border-collapse: collapse;
    border-top: 0px;
    border-color: var(--titlecolor);
}
/* GRID Layout*/
table.Master,
table.Slave {
    width: 100%;
    font-size: 2vw;
    border-collapse: separate;
    border-spacing: 0px;
    border-top: 1em solid;
    border-radius: 30px;
}
table.Master {
    border-color: var(--titlecolor);
}
table.Slave {
    border-color: var(--titlecolorS);
}

table.Master thead * {
    background-color: var(--titlecolor);
    padding: 5px;
}
table.Slave thead * {
    background-color: var(--titlecolorS);
    padding: 5px;
}

table.Master tbody tr:nth-child(even) * {
    background-color: var(--oddcolor);
    border-color: var(--oddcolor);

}
table.Master tbody tr:nth-child(odd) * {
    background-color: var(--evencolor);
    border-color: var(--evencolor);

}

table.Slave tbody tr:nth-child(even) * {
    background-color: var(--oddcolorS);
    border-color: var(--oddcolorS);

}
table.Slave tbody tr:nth-child(odd) * {
    background-color: var(--evencolorS);
    border-color: var(--evencolorS);

}

table.Master tbody * {
    font-size: 1.5vw;
    padding: 0.3vh 0.2vw;
    margin: 0px;
    border: 0px;
}
table.Slave tbody * {
    font-size: 1.4vw;
    padding: 1px 3px;
    margin: 0px;
    border: 0px;
}

table.Master tbody tr td button {
    background-color: transparent;
    padding: 0px 3px;
    font-style:italic;
    font-size: 1.3vw;
    color: blue;
}
table.Master tfoot tr td button,
table.MasterBlock tfoot tr td button {
    background-color: transparent;
    border: none;
    padding: 0px 3px;
    font-size:1.3vw;
    font-style:italic;
    color: blue;
}

table.MasterBlock tbody tr td button {
    background-color: transparent;
    border: none;
    padding: 0px 3px;
    font-size:1.3vw;
    font-style:italic;
    color: blue;
}

    





table.Slave tbody tr td button {
    padding: 0px 3px;
    font-style:italic;
    color: blue;
}

table.Slave tbody tr:nth-child(even) * {
    background-color: var(--oddcolor);
    border-color: var(--oddcolor);

}
table.Slave tbody tr:nth-child(odd) * {
    background-color: var(--evencolor);
    border-color: var(--evencolor);

}

button:hover {
    filter: brightness(1.1);
    cursor: pointer;
    text-decoration: underline;
}
/*
.edt {
    border: none;
    margin: 0px;
    padding: 0px;
    background-color:  rgba(255,255,255,0.9);
    border-radius: 2vw;
}
.del {
    border: none;
    margin: 0px;
    padding: 0px;
    background-color: var(--badcolor);
    border-radius: 2vw;
}

.can {
    border: none;
    background-color: var(--badcolor);
    color: white;
    border-radius: 2vw;
}

.verbinden {
    min-height: 100%;
    border: none;
    background-color: var(--goodcolor);
    border-radius: 2vw;
}

.trennen {
    border: none;
    background-color: var(--badcolor);
    border-radius: 2vw;
}
*/
/* hier wieder toplevel */


footer {
    grid-area: footer;
    /*align-self: end;
    justify-self: end;*/
    /*height: 2em;*/

}

/* Anmeldung aus start.php */
#I_Anmeldung {
    align-self: center;
    justify-self: center;
    display: grid;
    grid-template-columns: repeat(2, 8fr);
    grid-template-rows: 10vh;
    max-width: 30em;
    gap: 2vh;

}

#I_Anmeldung>h1 {
    grid-column-start: 1;
    grid-column-end: -1;
}