style.css

body{
    font-family: Arial, serif;
    color: #11dd55;
    margin-left: 100px;
    margin-right: 100px;
    background: #222;
}

header,footer{
    background-color: #000;
}

h1{
    color: #11dd55;
}

#tg_text{
    padding-left: 37px;
}

#levels{
    text-align: center;
    border-radius: 12px;
    margin-left: 20%;
    margin-right: 20%;
    display: flex;
    flex-direction: column;
    background: #303030;
}

.level_button{
    justify-content: center;
    font-size: 24px;
    color: #0022aa;
    border-radius: 12px;
    border: none;
    padding: 10px 50px;
    margin: 4px 50px;
}

.common-level{
    background: linear-gradient(to bottom, #aaccff, #aaffcc);
}

.special-level{
    background: linear-gradient(to bottom, #eeeeaa, #ffccaa);
}

progress{
    width: 780px;
    background: #cc3333; /* don't work somehow */
    margin-bottom: 20px;
}

#effect_div{
    display: flex;
    flex-direction: column;
}

#game_board{
    display: flex;
    flex-direction: row;
}

#game_header{
    display: flex;
    flex-direction: row;
}

#game{
    display: flex;
    flex-direction: column;
}

#buttons{
    display: flex;
    flex-direction: column;
}

.menu_restart{
    background: linear-gradient(to bottom, #225533, #444444);
    padding: 5px;
    margin: 20px 5px;
    border-radius: 8px;
    font-size: 24px;
    color: #11dd55;
}

#buttons{
    display: flex;
    flex-direction: row;
}