/*
*
* !DO NOT EDIT THE CSS FILES, THEY ARE BUILT WITH THE LESS CSS!
* less/content/images.less
*
* ---------------------------
* Styles associated with the images and captions
* ---------------------------
*/
@import "../_mixins/all.less";

.figure() {
    border:1px solid #DDD;
    border-radius:3px;
    background: #f7f7f7;
    padding:4px;
    margin: 0 0 10px 0;
    white-space:normal;
    line-height:0.8em;
    .box-sizing(border-box);
}
.caption() {
    line-height: normal;
    text-align: left;
    color: #444;
    font-size: 80%;
}

#maincontent, #footer, #colorbox {
    .frame {
        .figure();
        
        figcaption {
            .caption();
            
            ~ img, ~ video, ~ audio {
                margin-top: 5px;
            }
        }
        
        img ~ figcaption, video ~ figcaption, audio ~ figcaption {
            margin-top: 5px;
        }
    }
    
    p.caption {
        background: #f7f7f7;
        border: 1px solid #DDD;
        border-radius: 3px;
        border-top: none;
        padding: 2px 4px 5px;
        position: relative;
        margin-top: -16px;
        z-index: 2;
        .caption();   
    }
    
    .wdn_image_swap {
        width: 100%;
    }
}