.link-pemprov {
    height: 6rem;
}

.nav-pills li {
    padding: 0px 5px;
}

.modal-transparant {
    background-color: rgba(0, 0, 0, .0001) !important;
}

.frame-fit {
    min-height: 100vh;
}

.img-kecil {
    max-width: 50%;
    height: auto;
}

.bg-white-500 {
    background: rgba($white, 0.5) !important;
}

.bg-dark-500 {
    background: rgba($black, 0.5) !important;
}

.container-spanduk {
    height: 120px;
}

.nav-barku {
    color: aliceblue;
}

.hero {
    width: 100%;
    height: 100vh;
    background-image: linear-gradient(rgba(12, 3, 51, 0, 3), rgba(12, 3, 51, 0, 3));
    position: relative;
    padding: 0 5%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.content {
    text-align: center;
}

.bg-video {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 0;
}

@media (min-aspect-ratio: 16/9) {
    .bg-video {
        width: 100%;
        height: auto;
    }
}

@media (max-aspect-ratio: 16/9) {
    .bg-video {
        width: auto;
        height: 100%;
    }
}

.modal-backdrop {
    opacity: 0.5 !important;
}

@keyframes up-down {
    0% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(-10px);
    }
    to {
      transform: translateY(0);
    }
}

.image-container {
	animation: up-down 2s infinite;
    display: inline-block;
    padding: 15px;
    border: 5px solid #25669E;
    border-radius: 15px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    background-color: #f9f9f9;
    transition: transform 0.3s, box-shadow 0.3s;
}