#p5-root {
    position: relative;
    display: inline-block;
    touch-action: none;
}

#p5-root canvas {
    touch-action: none;
    display: block;
}

#p5-root .button {
    opacity: 80%;
    background-size: contain !important;
    border: none;
}
#p5-root .button:hover {
    opacity: 100%;
}

#p5-root .button.addRow {
    width: 25px;
    height: 25px;
    background: url('Buttons/AddRowButton.png');
}

#p5-root .button.subtractRow {
    width: 25px;
    height: 25px;
    background: url('Buttons/SubtractRowButton.png');
}

#p5-root .button.zoomOut {
    width: 35px;
    height: 35px;
    background: url('Buttons/ZoomOutButton.png');
}

#p5-root .button.zoomIn {
    width: 35px;
    height: 35px;
    background: url('Buttons/ZoomInButton.png');
}

#p5-root .button.addColumn {
    width: 25px;
    height: 25px;
    background: url('Buttons/AddRowButton.png');
}

#p5-root .button.subtractColumn {
    width: 25px;
    height: 25px;
    background: url('Buttons/SubtractRowButton.png');
}

#p5-root .button.export {
    width: 35px;
    height: 35px;
    background: url('Buttons/ExportButton.png');
}

#p5-root .button.circularBase {
    width: 35px;
    height: 35px;
    background: url('Buttons/CircularBaseButton.png');
}

#p5-root .button.quadrilateralBase {
    width: 35px;
    height: 35px;
    background: url('Buttons/QuadrilateralBaseButton.png');
}
