* {
    touch-action: none;
}

main {
    display: grid;
    justify-content: center;
    align-content: center;
    height: 80vh;
    width: 100%;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    -webkit-touch-callout: none;
    user-select: none;
}

section {
    height: 75vh;
    width: 50vw;
    background-image: url("cranberry.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transition: filter 100ms ease;
}

section.not-started {
    filter: grayscale(100);
}