#main {
    color: white;
    height: 97.5vh;
    width: 99.2vw;
    display: flex;
    flex-flow: row;
}

#left {
    float: left;
    flex: 0 0 300px;
    height: 100%;
    background-color: black;
    border: 2px solid white;
    display: flex;
    flex-flow: column;
}

#right {
    flex: 1 1 auto;
    display: flex;
    flex-flow: row;
    width: 100%;
    height: 100%;
    background-color: black;
    border: 2px solid white;
}

#turtleCommandDiv {
    flex: 0 1 25px;
    display: flex;
    flex-flow: row;
}

#turtleCommandInput
{
    flex: 1 1 100%;
}

#turtleCommandButton
{
    flex: 0 0 200px;
}

#turtle3DView
{
    flex: 1 1 auto;
}

#turtleDiv
{
    display: flex;
    flex-flow: column;
    flex: 1 1 auto;
}

.commandButton
{
    border: none;
    background: darkred;
    padding: 0;
    cursor: pointer;
    outline-offset: 4px;
    margin-top: 15px;
    width: 100%;
}

.front {
    display: block;
    padding: 12px 42px;
    font-size: 1.25rem;
    background: red;
    color: white;
    transform: translateY(-6px);
}

.commandButton:hover .front {
    transform: translateY(-10px)
}

.commandButton:active .front {
    transform: translateY(-2px);
}

#removeAddButtonsWindow {
    background-color: gray;
    flex: 0 1 20px;
    display: flex;
    flex-flow: row;
}

#plusButton {
    flex: 1 1 50%;
}

#minusButton {
    flex: 0 1 50%;
}

#addCommandView {
    flex: 0 1 100%;
    display: none;
    flex-flow: column;
}

#commandNameInput {
    flex: 0 1 20px;
}

#addCommandTextArea {
    flex: 1 1 100%;
    overflow-y: auto;
    background-color: black;
    color: gray;
    border-radius: 0;
    border-style: none;
}

#addCommandButton {
    flex: 2 1 20px;
}

#commandButtonContainer {
    flex: 1 1 auto;
    overflow-y: auto;
    background-color: gray;
}