@media (min-width: 992px) {

    #slide {
        margin-top: 0;
    }

    .img-carousel {
        height: 100vh;
        object-fit: cover;
    }

    .custom-caption {
        bottom: 25%;
        left: 10%;
        right: auto;
        text-align: left;
        max-width: 500px;
    }

    .custom-caption h5 {
        font-size: 48px;
        font-family: 'Kaushan Script', cursive;
        font-weight: 900;
        line-height: 1.2;
        letter-spacing: 1px;
        color: #fff;
        text-shadow: 2px 2px 10px rgba(0,0,0,0.5);
    }


    .caption-title,
    .caption-btn {
        opacity: 0;
        transform: translateY(30px) translateX(-20px);
        transition: all 0.8s ease;
    }


    .carousel-item.active .caption-title {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 0.3s;
    }

    .carousel-item.active .caption-btn {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 0.6s;
    }

    .carousel-item img {
        transform: scale(1);
        transition: transform 6s ease;
    }

    .carousel-item.active img {
        transform: scale(1.05);
    }
}


@media (max-width: 991px) {

    .img-carousel {
        height: 70vh;
        object-fit: cover;
    }

    .custom-caption {
        bottom: 15%;
        text-align: center;
    }

    .custom-caption h5 {
        font-size: 32px;
        font-family: 'Kaushan Script', cursive;
        font-weight: 900;
        line-height: 1.2;
        letter-spacing: 1px;
        color: #fff;
        text-shadow: 2px 2px 10px rgba(0,0,0,0.5);
    }

    .caption-title,
    .caption-btn {
        opacity: 0;
        transform: translateY(30px) translateX(-20px);
        transition: all 0.8s ease;
    }

    .carousel-item.active .caption-title {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 0.3s;
    }

    .carousel-item.active .caption-btn {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 0.6s;
    }

    .carousel-item img {
        transform: scale(1);
        transition: transform 6s ease;
    }

    .carousel-item.active img {
        transform: scale(1.05);
    }
}

@media (max-width: 576px) {

    #slide {
        margin-top: 60px;
    }

    .img-carousel {
        height: 60vh;
        object-fit: cover;
    }

    .custom-caption {
        bottom: 10%;
        padding: 0 15px;
    }

    .custom-caption h5 {
        font-size: 22px;
        font-family: 'Kaushan Script', cursive;
        font-weight: 900;
        line-height: 1.2;
        letter-spacing: 1px;
        color: #fff;
        text-shadow: 2px 2px 10px rgba(0,0,0,0.5);
    }

    .custom-caption p a {
        font-size: 14px;
    }


    .caption-title,
    .caption-btn {
        opacity: 0;
        transform: translateY(30px) translateX(-20px);
        transition: all 0.8s ease;
    }

    .carousel-item.active .caption-title {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 0.3s;
    }

    .carousel-item.active .caption-btn {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 0.6s;
    }

    .carousel-item img {
        transform: scale(1);
        transition: transform 6s ease;
    }

    .carousel-item.active img {
        transform: scale(1.05);
    }
}


.carousel-item {
    position: relative;
}

.carousel-item::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0.2));
}

.carousel-caption {
    z-index: 2;
}

/*#jdl {*/
/*	font-family: 'Kaushan Script', cursive;  text-transform: capitalize;*/
/*}*/

/*#fml {*/
/*	width: 85px; height: 82px; border-radius: 50%;*/
/*}*/

/*#btn1 {*/
/*	background-color: #01582d;*/
/*}*/

/*#p1 {*/
/*	text-align: justify;*/
/*}*/

/*#km {*/
/*	color:#fff;*/
/*}*/

/*#tms {*/
/*	font-size: 50px;*/
/*}*/

/*#tms_teks {*/
/*	color: #d2dcdb; font-size: 18px;*/
/*}*/

/*@media screen and (min-width: 601px) {*/
/*  	h1.example {*/
/*    font-size: 45px;*/
/*  }*/

/*@media screen and (max-width: 667px) {*/
/*    h1.example {*/
/*    font-size: 30px;*/
/*    }*/

/*    @media screen and (min-width: 601px) {*/
/*  	p.deskripsi {*/
/*    font-size: 10px;*/
/*  }*/

/*@media screen and (max-width: 667px) {*/
/*    p.deskripsi {*/
/*    font-size: 10px;*/
/*    }*/