:root {
    --gall-thumb-size: 160px;
}

.folders {
    background-color: var(--box-background-color);
    /* border-radius: 3px; */
    padding: 6px;
}

.folder-layer, .folder-layer-open {
    margin-left: 20px;
    position: relative;
}

.folder-layer::before, .file-name::before {
    content: "";
    width: 10px;
    height: 10px;
    position: absolute;
    left: -12px;
    border-bottom: 1px solid var(--box-border-color-2);
    border-left: 1px solid var(--box-border-color-2);
    border-radius: 0px 3px;
}


.gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    justify-content: center;
}

.gallery img {
    height: var(--gall-thumb-size);
    width: var(--gall-thumb-size);
    object-fit: cover;
    border-radius: 3px;
    border: 1px solid #00000000;

    filter: sepia(40%);
}

.gallery img:hover {
    cursor: pointer;
    border: 1px solid var(--box-border-color-2);
    filter: opacity(80%);
}

.gallery a {
    position: relative;
}

.solo-image-wide {
    border-radius: 3px;
    width: 90%;
    min-width: 300px;
    max-width: 500px;
    margin: 5px;
    filter: saturate(80%) contrast(90%);
}

@media only screen and (max-width: 700px) {

    :root {
        --gall-thumb-size: calc((100vw / 3) - 20px);
    }

}