/* 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);
}

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

#preset_examples {
    display: none;
}