:root {
    font-size: 18px;
}

.grid {
    grid-template-columns: repeat(6, 1fr);
}

.grid.family>div:nth-child(1) {
    grid-column: 1/3;
    grid-row: 1/2;
}

.grid.family>div:nth-child(2) {
    grid-column: 3/5;
    grid-row: 1/3;
}

.grid.family>div:nth-child(3) {
    grid-column: 5/6;
    grid-row: 1/2;
}

.grid.family>div:nth-child(4) {
    grid-column: 6/7;
    grid-row: 1/2;
}

.grid.family>div:nth-child(5) {
    grid-column: 5/6;
    grid-row: 2/3;
}

.grid.family>div:nth-child(6) {
    grid-column: 6/7;
    grid-row: 2/3;
}

.grid.family>div:nth-child(7) {
    grid-column: 1/3;
    grid-row: 2/4;
}

.grid.family>div:nth-child(8) {
    grid-column: 3/4;
    grid-row: 3/4;
}

.grid.family>div:nth-child(9) {
    grid-column: 4/6;
    grid-row: 3/4;
}

.grid.family>div:nth-child(10) {
    grid-column: 6/7;
    grid-row: 3/4;
}

.grid.family>div:nth-child(11) {
    display: none;
}

.grid.concert>div:nth-child(1) {
    grid-column: 5/7;
    grid-row: 1/2;
}

.grid.concert>div:nth-child(2) {
    grid-column: 3/5;
    grid-row: 1/3;
}

.grid.concert>div:nth-child(3) {
    grid-column: 1/2;
    grid-row: 1/2;
}

.grid.concert>div:nth-child(4) {
    grid-column: 2/3;
    grid-row: 1/2;
}

.grid.concert>div:nth-child(5) {
    grid-column: 1/2;
    grid-row: 2/3;
}

.grid.concert>div:nth-child(6) {
    grid-column: 2/3;
    grid-row: 2/3;
}

.grid.concert>div:nth-child(7) {
    grid-column: 5/7;
    grid-row: 2/4;
}

.grid.concert>div:nth-child(8) {
    grid-column: 4/5;
    grid-row: 3/4;
}

.grid.concert>div:nth-child(9) {
    grid-column: 2/4;
    grid-row: 3/4;
}

.grid.concert>div:nth-child(10) {
    grid-column: 1/2;
    grid-row: 3/4;
}

.grid.concert>div:nth-child(11) {
    display: none;
}

}

.grid>div:nth-child(odd) {
    transition: opacity 0.5s ease;
}

.grid>div:nth-child(even) {
    transition: opacity 1s ease;
}

.grid>div.visible {
    opacity: 1 !important;
}

.grid img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.grid>div:nth-child(1) {
    grid-column: 1/3;
    grid-row: 1/2;
    background-color: rgb(52, 56, 65);
    /* aspect-ratio: 2/3; */
}

.grid>div:nth-child(2) {
    grid-column: 3/5;
    grid-row: 1/3;
}

.grid>div:nth-child(3) {
    grid-column: 5/6;
}

.grid>div:nth-child(4) {
    grid-column: 6/7;
}

.grid>div:nth-child(5) {
    grid-column: 5/6;
    grid-row: 2/3;
}

.grid.family>div:nth-child(6) {
    grid-column: 6/7;
    grid-row: 2/3;
}

.grid>div:nth-child(7) {
    grid-column: 1/3;
    grid-row: 2/4;
}

.grid>div:nth-child(8) {
    grid-column: 3/4;
    grid-row: 3/4;
}

.grid>div:nth-child(9) {
    grid-column: 4/6;
    grid-row: 3/4;
}

.grid>div:nth-child(10) {
    grid-column: 6/7;
    grid-row: 3/4;
}

.grid>div:nth-child(11) {
    display: none;
}

.grid.event>div:nth-child(1) {
    grid-column: 1/3;
    grid-row: 1/2;
}

.grid.event>div:nth-child(2) {
    grid-column: 3/5;
    grid-row: 1/2;
}

.grid.event>div:nth-child(3) {
    grid-column: 5/7;
    grid-row: 1/2;
}

.grid.event>div:nth-child(4) {
    grid-column: 1/3;
    grid-row: 2/3;
}

.grid.event>div:nth-child(5) {
    grid-column: 3/5;
    grid-row: 2/3;
}

.grid.event>div:nth-child(6) {
    grid-column: 5/7;
    grid-row: 2/3;
}

.grid.street>div:nth-child(1) {
    grid-column: 5/7;
    grid-row: 1/2;
}

.grid.street>div:nth-child(2) {
    grid-column: 3/5;
    grid-row: 1/3;
}

.grid.street>div:nth-child(3) {
    grid-column: 1/3;
    grid-row: 1/3;
}

.grid.street>div:nth-child(4) {
    grid-column: 5/7;
    grid-row: 2/4;
}

.grid.street>div:nth-child(5) {
    grid-column: 3/5;
    grid-row: 3/4;
}

.grid.street>div:nth-child(6) {
    grid-column: 1/3;
    grid-row: 3/4;
}

.grid.boudoir>div:nth-child(1) {
    grid-column: 1/3;
    grid-row: 1/2;
}

.grid.boudoir>div:nth-child(2) {
    grid-column: 3/5;
    grid-row: 1/3;
}

.grid.boudoir>div:nth-child(3) {
    grid-column: 5/7;
    grid-row: 1/3;
}

.grid.boudoir>div:nth-child(4) {
    grid-column: 1/3;
    grid-row: 2/4;
}

.grid.boudoir>div:nth-child(5) {
    grid-column: 3/5;
    grid-row: 3/4;
}

.grid.boudoir>div:nth-child(6) {
    grid-column: 5/7;
    grid-row: 3/4;
}