main {
    padding-bottom: 20px;
}

section {
    margin: 20px 0 0 0;
}

.heading {
    padding: 20px;
}

article {
    h2 {
        margin-top: 0;
    }
}

figure.art {
    display: block;
    margin: 20px 0 0 0;
    border-radius: 10px;
    box-sizing: border-box;
    border: 1px solid var(--glass-surface);
    contain: paint;

    img {
        max-width: 100%;
        display: block;
        margin: 0 auto;
    }
}

article.browse-listing-folder,
article.browse-listing-image {
    display: block;
    margin: 20px 0 0 0;
    border-radius: 10px;
    box-sizing: border-box;
    border: 1px solid var(--glass-surface);

    img.thumbnail {
        max-width: 100%;
        max-height: 200px;
        border-radius: 4px;
        display: block;
        margin: 0 auto;
        align-self: center;
    }

    @media (min-width: 800px) {
        display: flex;

        img.thumbnail {
            margin: 8px;
            max-width: 25%;
        }
    }

    .folder-info,
    .image-info {
        flex-grow: 1;
    }
}
