
#slideShow {
    position:static;
    width:100%;     /* of its container, which will be a Bootstrap column */
    display: table;
    margin: 0 auto;
    borderXXX: 1px solid red;
    visibility: hidden;       /* visible - still takes space up */
}

/* The slideAndCaption containers have to be absolute so they can be positioned over one another
 at various z-indexes and faded */
.slideAndCaption {
    position: absolute;
    /* The left:0, right:0 is a big deal because
        it allows the centering of a position: absolute elements */
    left: 0;
    right: 0;
    margin: 0 auto;
    float:left;
    borderXXX: 1px solid red;
}

/* note: the image has been made img-responsive so it scales with its Bootstrap container */
.slideImage{
    position: static;
    display: table;
    margin: 0 auto;
    max-height: 90vh; //520 + 30 for caption = 550 */
}

.slideCaption{
    position:static;
    background-color: white;
    height: 30px;
    padding-top:4px;
    padding-left:5px;
    padding-right:5px;
    overflow: auto;
    border-bottom: 1px solid rgba(86,61,124,.2);
    color: black;
    text-decoration: none;
    margin-left:15px;
    margin-right:15px;
    font-size: 12px;
    line-height: 100%;
}