/* One image */
.one-image .grid-item img {
    width: 400px;
    display: flex;
    flex-wrap: wrap;
}

/* Two images */
.two-images .grid-item img {
    width: 350px;
    display: flex;
    flex-wrap: wrap;
}

/* 3 images */
.three-images .grid-item img {
    width: 300px;
    display: flex;
    flex-wrap: wrap;
}

/* 4 images */
.four-images .grid-item img {
    width: 280px;
    display: flex;
    flex-wrap: wrap;
}

/* 5 images */
.five-images .grid-item img {
    width: 250px;
    display: flex;
    flex-wrap: wrap;
}

/* Five or more images */
.six-or-more-images {
     display: grid;
    /*justify-content: center;*/
    flex-direction: column;
    gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    /*row-gap: 100px;
    column-gap: 60px;*/
}

.six-or-more-images .grid-item img {
    width: 250px;
}

/* Center alignment */
.centered {
    display: flex;
    justify-content: center;
}

.grid-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Horizontalno centriranje */
    align-items: center; /* Vertikalno centriranje */
/*    min-height: 100vh; *//* Puni visinu ekrana */
    width: 100%; /**//*Puni širinu ekrana */
    flex-wrap: wrap;
    gap: 10px;
}

.grid-container {
    display: flex;
/*    display: grid;*/
    justify-content: center;
    /*flex-direction: column;*/
    flex-wrap: wrap;
    gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    /*row-gap: 100px;
    column-gap: 60px;*/
    /*min-width: 200px;*/
    /*max-width: 1400px; *//*Na primer, ograniči na 1200px ako želiš */
    margin-bottom: 6%;
}

.grid-item {
    /*width: 200px;*/
    display: flex;
    flex-direction: column;
    background-color: #f1f1f1;
    border: 1px solid #ccc;
    text-align: center;
    border-radius: 20px;
    margin: 10px;
}

    .grid-item a {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        text-decoration: none;
        color: inherit;
        height: 100%;
    }

    .grid-item img {
        /*width: 100%;*/
        /*max-width: 400px;*/
        width: 250px;
        height: auto;
        display: block;
        aspect-ratio: 1 / 1;
        object-fit: cover;
        border-radius: 20px;
        transition: width 0.3s ease;
    }

    .grid-item .txt {
        margin-top: 10px;
        padding: 10px;
        font-weight: bold;
        background-color: #f1f1f1;
        color:#444;
        border-radius: 20px;
    }