body {
    background: #000;
    color: #eee;
}

#container {
    width: 36em;
    height: 48em;
    margin: auto auto;
    display: flex;
    flex-wrap: wrap;
    /* border: 1px solid green; */
}

#leftpane, #rightpane {
    margin: auto auto;
    /* border: 1px solid red; */
}

#rightpane {
    width: 12em;
}

#grid {
    width: 20em;
    height: 40em;
    display: flex;
    flex-wrap: wrap;
    background: #333;
}

#grid div {
    width: 2em;
    height: 2em;
}

#preview {
    margin: 0 auto;
    width: 8em;
    height: 8em;
    display: flex;
    flex-wrap: wrap;
}

#preview div {
    width: 2em;
    height: 2em;
}

#start {
    font-size: 2em;
}

#controls {
    margin: 20% 0 0 0;
}

#controls button {
    width: 2em;
    height: 2em;
    font-size: 2em;
}

#controls .row {
    margin: 0 auto;
    width: 4em;
    dispaly: flex;
    flex-wrap: frap;
    /* border: 1px solid blue; */
}

#controls .row-2 {
    width: 8.4em !important;
}


.tetro {
    background: #eee;
}

.frozen {
    background: cyan;
}