<style>
#homeSlider .carousel-control-prev-icon,
#homeSlider .carousel-control-next-icon {
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 50%;
    padding: 20px;
    background-size: 60% 60%;
}

#homeSlider .carousel-control-prev,
#homeSlider .carousel-control-next {
    width: 6%;
    opacity: 1;
}

#homeSlider .carousel-control-prev:hover,
#homeSlider .carousel-control-next:hover {
    opacity: 1;
}

/* DOT indikator */
#homeSlider .carousel-indicators button {
    background-color: #000;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

#homeSlider .carousel-indicators .active {
    background-color: #0d6efd; /* biru bootstrap */
}
 .media-box{
            width:100%;
            height:430px;
            overflow:hidden;
            border-radius:15px;
            background:#fff;
            box-shadow:0 .5rem 1rem rgba(0,0,0,.15);
        }

        .media-box img{
            width:100%;
            height:100%;
            object-fit:cover;
        }

        .media-box iframe{
            width:100%;
            height:100%;
            border:0;
        }

        .carousel-item{
            padding:40px 0;
        }

        .carousel-item h2{
            font-size:2.2rem;
            font-weight:700;
            margin-bottom:20px;
        }

        .carousel-item p{
            font-size:17px;
            line-height:1.8;
            text-align:justify;
            margin-bottom:35px;
        }

        @media(max-width:991px){

            .media-box{
                height:280px;
                margin-bottom:20px;
            }

            .carousel-item h2{
                font-size:30px;
            }

        }
</style>