body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-family: sans-serif;
    margin: 0;
}

.container_div_border {
    border-top: 2px solid black;
}

#container_nav {
    display: flex;
    justify-content: space-evenly;
    flex: 2;
    background-color: #1c1c1c;
    height: 50px;
}

.a_nav {
    color: white;
}

a {
    text-decoration: none;
    padding: 14px 16px;
    color: black;
}

#container_nav a:hover {
    background-color: #2c2c2c;
}


#container_headline {
    display: flex;
    justify-content: center;
    height: 75px;
    background-color: #1d2a34;
}

#container_headline_font {
    font-size: 32px;
    padding: 18px 0px 18px 0px;
    color: white;

}

#container_content {
    display: flex;
    flex-direction: column;
    flex: 3;
    align-items: center;
    justify-content: center;
}

#myCanvas {
    z-index: 1;

}

#overlay_canvas {
    display: flex;
    flex-direction: column;
    color: white;
    position: absolute;
    z-index: 2;
    width: 100%;
    justify-content: center;
    height: auto;
}

.div_space {
    height: 15vh;
}

.font_style {
    font-family: 'Courier New', Courier, monospace;
    font-size: larger;
}

#container_asci {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 128px;
}

.container_flex_column {
    display: flex;
    flex-direction: column;
    align-items: center;

}

.container_flex_row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly
}

.timer_headline {
    font-size: x-large;
    font-weight: bold;
    text-decoration: underline;
}

.no-scroll {
    overflow: hidden;
}