﻿/* BEGIN image link carousel */
.joistCarousel .link-container img {
    padding: 0 .5em;
}

.joistCarousel .overlay {
    width: calc(100% - 1em);
    margin-left: .5em;
    margin-right: -.5em;
    height: 100%;
    /*margin-bottom: .5em;*/
}

/*.img-caption {
    padding-top: .35em;
}*/

.joistCarousel .link-title {
    text-align: center;
    font-weight: 300 !important;
}

.joistCarousel .carousel-control-next {
    margin-right: -3em;
}

.joistCarousel .carousel-control-prev {
    margin-left: -7em;
}

    .joistCarousel .carousel-control-next i, .joistCarousel .carousel-control-prev i {
        font-size: 1.3em;
        color: #006325;
        background: #ffffff;
        padding: 0.3em 0.5em;
        border-radius: 50%;
        opacity: 0.5;
    }

    .joistCarousel .carousel-control-next:hover i, .joistCarousel .carousel-control-prev:hover i {
        opacity: 1;
    }

@media (max-width: 767px) {
    .joistCarousel .carousel-inner .carousel-item > div {
        display: none;
    }

        .joistCarousel .carousel-inner .carousel-item > div:first-child {
            display: block;
        }
}

.joistCarousel .carousel-inner .carousel-item.active,
.joistCarousel .carousel-inner .carousel-item-next,
.joistCarousel .carousel-inner .carousel-item-prev {
    display: flex;
}

/* medium and up screens */
@media (min-width: 768px) {

    .joistCarousel .carousel-inner .carousel-item-end.active,
    .joistCarousel .carousel-inner .carousel-item-next {
        transform: translateX(25%);
    }

    .joistCarousel .carousel-inner .carousel-item-start.active,
    .joistCarousel .carousel-inner .carousel-item-prev {
        transform: translateX(-25%);
    }
}

.joistCarousel .carousel-inner .carousel-item-end,
.joistCarousel .carousel-inner .carousel-item-start {
    transform: translateX(0);
}
/* END image link carousel */
