/* OUTPUT */
#html_output,
#html_examples {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

#html_output>img {
    align-self: center;
    height: 200px;
    border: 2px solid;
    border-color: var(--block-border-color);
    border-radius: var(--block-radius);
    margin: 1.5em;
}

/* EXAMPLE */
#html_examples>figure>img {
    align-self: center;
    height: 100px;
    border: 2px solid;
    border-color: var(--block-border-color);
    border-radius: var(--block-radius);
    margin: .7em;
}

#html_examples>figure {
    transition-duration: 0.2s;
}

#html_examples>figure:hover {
    transform: scale(1.2);
    cursor: pointer;
}

#html_examples>figure>figcaption {
    text-align: center;
}

#preset_examples {
    display: none;
}