/* from https://niklasfasching.de/posts/just-enough-css/ */
html {
    overflow-y: scroll;
    height: 100%;
    font: 100%/1.5 sans-serif;
    word-wrap: break-word;
    margin: 0 auto;
    padding: 1.5em;
}
body{
    margin-bottom: 15%;
    background-color: rgb(253,251,249);
}

.canvascontainer {
    align-items: center;
    display: flex;
    flex-direction: column;
}

canvas {
    margin: 0;
    border: 2px solid black;
}

img { border:  ridge lightgray 20px; }

.greenbtn {
    margin: 0;
    background-color: #4CAF50;
    border: 2px solid black;
    border-top: none;
    color: white;
    padding: 15px 0;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}
.greenbtn:active {
transform: translateY(2px);
}

@media (min-width: 768px) {
html {
    font-size: 125%;
    max-width: 42em;
} }