/* custom-col

row-cols-custom-5 → nicht in Bootstrap enthalten (vermutlich ein eigener Breakpoint für 5 Spalten)

bsb-overlay-hover

bsb-scale

bsb-hover-scale-up

bsb-hover-fadeInLeft

bsb-hover-fadeInRight

custom-border

custom-text 

kategorien-row-cols-custom-5
*/



.row-cols-custom-5 > * {
    flex: 0 0 auto;
    width: calc(20% - 3px);
}

.bsb-overlay-hover {
    --bsb-overlay-hover-opacity: 0.5;
    --bsb-overlay-hover-bg-color: var(--bs-black-rgb);
    position: relative;
}

.bsb-overlay-hover>a {
    bottom: 0;
    display: block;
    left: 0;
    position: relative;
    right: 0;
    top: 0;
}

.bsb-overlay-hover>figcaption {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    pointer-events: none;
    z-index: 1;
}

.bsb-overlay-hover>a>img.bsb-scale, .bsb-overlay-hover>a>img.bsb-scale-up {
    transform: scale3d(var(--bsb-scale), var(--bsb-scale), var(--bsb-scale));
    transform-style: preserve-3d;
    transition: transform .5s;
}
.bsb-overlay-hover>a>img.bsb-scale {
    --bsb-scale: 1;
}


.bsb-overlay-hover>a:after, .bsb-overlay-hover>figcaption {
    bottom: 0;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.bsb-overlay-hover>figcaption>* {
    opacity: 0;
}
.custom-border {
    border: 2px solid #fff;
    padding: 10px;
    margin: 5px;
    display: inline-block;
}

.custom-col {
    margin: 1px;
}