@charset "utf-8";
/* CSS Document */
.list-group {
    display: flex;
    flex-wrap: wrap;
    list-style: none; /* Remove list-style (bullets) */
    padding: 0; /* Remove default padding */
}

.list-group-item {
    flex: 0 0 calc(25% - 10px); /* Adjust the width as needed */
    margin-right: 5px;
    margin-bottom: 5px;
    box-sizing: border-box;
}

.post-content {
    flex: 1;
}

.post-image {
    max-width: 100px;
    max-height: 100px;
    object-fit: cover;
}

.post-caption {
    font-size: 10px;
    color: #666;
    margin-bottom: 0; /* Remove margin-bottom */
}
        .back-to-top {
            display: none;
            position: fixed;
            bottom: 20px;
            right: 20px;
            width: 40px;
            height: 40px;
            background-color: #333;
            color: #fff;
            text-align: center;
            line-height: 40px;
            border-radius: 50%;
            cursor: pointer;
        }

        .back-to-top.show {
            display: block;
            animation: fadeIn 0.3s;
        }
        footer {
            margin-top: 20px;
            font-size: 12px;
            color: #777;
        }
@media (max-width: 767px) { /* Adjust the max-width as needed for your design */
    .list-group-item {
        flex: 0 0 calc(25% - 10px); /* Two columns on smaller screens */
    }
}