body {
    display: flex;
    margin: 0;
}

p {
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
}

canvas { 
    width: 100%; 
    height: 100% 
}

#canvas {
    width: 80%;
    height: 100%;
}

#options {
    width: 20%;
    text-align: center
}

#options ul {
    list-style-type: none;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
    padding-inline-start: 0;
}

#options li {
    background-color: red;
    padding: 0.5em 0;
}

#options li:not(:last-child){
    border-bottom: 1px solid black
}

#options li:hover {
    background-color: darkred;
}

#options ul li.selected {
    background-color: green;
}

#options li:after {
    content: 'DISABLED';
}
#options li.selected:after {
    content: 'ENABLED';
}

div.dg { 
    font-size: 16px; 
}

div.dg.main.a {
    float:left;
}