/* Sizing */
.h-480{
    height: 480px;
}

.min-h-50vh{
    min-height: 50vh;
}


/* Brand Background Color */

.bg-dd-blue-a{
    background-color: #148FC7;
}

.bg-dd-blue-b{
    background-color: #0297D9;
}

.bg-dd-blue-c{
    background-color: #50849C;
}

.bg-dd-gray{
    background-color: #BEBFC1;
}

/* Brand Font Color */

.text-dd-blue-a{
    color: #148FC7;
}

.text-dd-blue-b{
    color: #0297D9;
}

.text-dd-blue-c{
    color: #50849C;
}

.text-dd-gray{
    color: #BEBFC1;
}

/* Animation */

.fade-in {
    opacity: 0;
    transition: opacity 2s ease-in-out;
}

.fade-in.show {
    opacity: 1;
}

.fade-in-up {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 0.5s ease-in-out , transform 0.5s ease-in-out;
}

.fade-in-up.show {
    opacity: 1;
    transform: translateY(0);
}

.fade-in-right {
    opacity: 0;
    transform: translateX(50px);
    transform-origin: right;
    transition: opacity 1s ease, transform 1s ease;
}

.fade-in-right.show {
    opacity: 1;
    transform: translateX(0);
}

/* Carousel */
.carousel-container {
    overflow: hidden;
    position: relative;
}

.carousel-track {
    display: flex;
    transition: transform 0.5s ease;
}

.carousel-slide {
    flex: 0 0 100%;
    margin-right: 10px; /* Gap between slides */
    display: flex;
    justify-content: center;
    align-items: center;
}

.carousel-slide img {
    max-width: 100%;
    max-height: 480px;
}

@media (min-width: 768px) {
    .carousel-slide {
        flex: 0 0 50%;
        margin-right: 0px;
    }
}