Gallery Slide CSS

gistfile1.css

.gallerySlide {
    display: inline-block;
    float: left;
    position: relative;
    vertical-align: top;

    /* Calculated via LESS based on parent .gallerySlides max capacity width
     * 5000% = 50 slides. 1 slide width = (100%/50) = 2%
     */
    width: 2%;
    margin-right: -0.3%; /* Similarly relative to parent. Represents a 15% margin to accommodate the peek */
    max-height: 100%;
    height: 100%;

    line-height: 0;
    white-space: normal; /* Revert to normal white-space for children */
    opacity: 0.5; /* Peek faded out */
}
.gallerySlide.selected {
    /* Active slide */
    opacity: 1;
    z-index: 10; /* Make sure active slide is infront of peek */
}