body,
button,
h1,
h2,
h3,
h4,
h5,
h6,
i,
img,
li,
p,
ul,
h2,
h5,
h6 {
    margin: 0;
    padding: 0;
    border: 0;
}
html {
    scroll-behavior: smooth;
}
.std_box_sizing,
button,
div,
a,
input,
textarea,
table,
fieldset {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
    border: 0;
    padding: 0;
    margin: 0;
}
:focus {
    outline: 0;
}
* {
    transition: background-color 1s;
    font-size: 20px;
    font-family: Tahoma;
}

header {
    background-color: #9fcc9f;
    text-align: center;
    margin: 10px;
    padding: 5px 10px;
    color: black;
    font-weight: bold;
}

.span_big {
    color: black;
    font-size: 38px;
}

.span_small {
    color: black;
    font-size: 25px;
}

#wrapper {
    background-color: whitesmoke;
    max-width: 900px;
    margin: 0 auto;
    padding:5px;
}

main {

    margin-left: 10px;
    margin-right: 10px;
    color: black;
}

footer {
    background-color: #5f8c5f;
    text-align: center;
    margin: 10px;
    padding:10px;
    color: white;
}

.red { color: red; }
.green { color: green !important; }

#tab_header {
    width: 100%;
}

#tab_footer {
    width: 200px;
    margin: 0 auto;
    text-decoration: underline;
}

#tab_footer .right {
     text-align: right;
}
#tab_footer .left {
    text-align: left;
}

#div_login {
    // margin: 10px auto;
    // width: 320px;
    // padding: 20px;
    // border: 3px solid black;
    text-align: center;
    // background-color: white;
}

.but_ovt {
    width: 150px;
    padding: 8px;
    background-color: darkorange ;
    color: white;
    margin: 8px;
    border: 1px solid transparent;
    border-radius: 10px;
}

#jsback {
    padding: 8px;
    background-color: darkorange;
    color: white;
}

.but_ovt_disabled {
    width: 150px;
    padding: 8px;
    background-color: darkgrey;
    color: white;
    margin: 8px;
    border: 1px solid transparent;
    border-radius: 10px;
}

.but_ovt:hover {
    background-color: gold ;
    color: black;
    cursor: pointer;
}

.in_ovt {
    padding: 10px;
    width: 280px;
}

.flex_container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.flex_container_help {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.flex_element, .flex_element_help {
    flex: 0 0 auto;
}

.flex_element_help {
    margin: 5px;
    padding: 5px;
    max-width: 300px;
    border: 1px black solid;
}

.flex_element_fix {
    flex: 0 0 280px;
    padding: 12px;
    text-align: center;
    background-color: khaki;
}


h1 { text-align: center; margin-bottom: 5px; font-size: 28px; }
h2 { text-align: center; }
h3 { margin: 7px; }
.h4 { text-align: center; font-size: 16px; }

.liste, .zentriert {
    margin: 0 auto;
}

.zentriert_all {
    margin: 0 auto;
}
.zentriert_all th, .zentriert_all td {
    text-align: center;
    padding: 5px 10px;
}

.zentriert {
    padding: 5px;
}
.zentriert tr th, .zentriert tr td {
    text-align: left;
}

.liste tr th, .liste tr td {
    padding: 5px;
    text-align: left;
}

.liste tr td:first-of-type {background-color: khaki;  font-weight: bold; }

.div_menu {
    text-align: center;
}
#div_show {
    text-align: center;
    font-size: 24px;
    font-weight: bolder;
}
.div_appear {
    text-align: center;
    font-size: 24px;
    color: transparent;
}
.div_lesson {
    padding: 10px;
    margin: 10px;
}

.marked {
    background-color: lightgreen;
}

.richtig {
    background-color: lightgreen;
}
.falsch {
    background-color: lightpink;
}
.mc_lesson_hide {
    display: none;
}