.carousel {
    @carousel-height: 500px;
    
    height: @carousel-height;
    margin-bottom: @line-height-computed;

    /* Since positioning the image, we need to help out the caption */
    &-caption {
        z-index: 10;
    }

    /* Declare heights because of positioning of img element */
    .item {
        height: @carousel-height;
        background-color: @gray-light;
    }

    &-inner > .item > img {
        position: absolute;
        min-width: 100%;
        height: @carousel-height;
        top: 0;
        left: 0;
    }

    @media (min-width: @grid-float-breakpoint) {
        /* Bump up size of carousel content */
        &-caption p {
            margin-bottom: @line-height-computed;
            font-size: ceil((@font-size-base * 1.5));
            line-height: @line-height-base;
        }
    }
}
