CSS

    section.row.sectionHighlightDirektoratTelekomunikasi {
        background-color: #808dab;
    }

    #galeriCarousel img.img-fluid {
        width: 400px;
        height: 250px;
    }

    section.sectionHighlightDirektoratTelekomunikasi h4.pb-4.mb-4.text-center {
        margin: 30px 0px 30px 0px;
    }

PHP & HTML

<div id="galeriCarousel" class="carousel slide" data-bs-ride="carousel" data-interval="0">
	<!-- Wrapper for carousel items -->
    <div class="carousel-inner">
        <div class="carousel-item active">
            <div class="row">
                <?php $i = 0; ?>
                <?php foreach ($galeri as $key => $value) : ?>
                    <!-- //if we can divide $key by 4 without remainder -->
                    <?php if ($key % 4 == 0 && $i > 0) : ?>
            </div>
        </div>
        <div class="carousel-item">
            <div class="row">
            <?php endif; ?>
            <div class="col-md-3">
                <div class="img-box"><img src="<?= base_url('images/widget/' . $value->image) ?>" class="img-fluid" alt="Image" style="max-width:100%;"></div>
            </div>
            <?php $i++; ?>
        <?php endforeach; ?>
            </div>
        </div>
    </div>
</div>