.block-preview {
    /*border: black 1px solid;*/
    box-shadow: 0px 0px 2px 0px #000000;
    width: min(25em, calc(100vw - 2em));
    height: 20em;
    background-size: cover;
    background-repeat: no-repeat;
}

.block-preview:hover, .block-preview.toggled {
    box-shadow: 0px 0px 4px 0px #000000;
}

.block-preview .label {
    transition: max-height 0.15s ease-in;
    max-height: 20%;
    overflow: hidden;
    bottom: 0;
    background-color: #FFFFFFDD;
    padding: 0.5em;
    bottom: 0; 
}

.block-preview:hover .label, .block-preview.toggled .label {
    max-height: 100%;
    height: calc(100% - 1em);
}

.block-preview .label .show-on-hover {
    display: none;
    transition: opacity 0.15s;
    opacity: 0;
    max-height: 0;
    background: none;
}

.block-preview:hover .label .show-on-hover, .block-preview.toggled .label .show-on-hover {
    display: block;
    opacity: 1;
    max-height: 100%;
}