.b-error {
    opacity: 1 !important;
    transform: scale(1) !important;
    background-position: 50% 0%;
    background-repeat: no-repeat;
    background-image: url("default.jpg");
}
.b-lazy {
        -webkit-transition: opacity 500ms ease-in-out;
        -moz-transition: opacity 500ms ease-in-out;
        -o-transition: opacity 500ms ease-in-out;
        transition: opacity 500ms ease-in-out;
        max-width: 100%;
        opacity: 0;
}
.b-lazy.b-loaded { opacity: 1; }

.image-wrapper {
        background: #ddd url('loader.gif') center center no-repeat;
        width: 100%
}
.ratio_16-9 {
        /*
         The image has a 16/9 ratio. Until the image has loaded
        // we need to reserve some space so the page won't reflow.
        // How to calculate the space (padding-bottom): 9/16*100 = 56.25
        // Another example: you have an image 400x250.
        // So if you want to calculate the space you do: 250/400*100 = 62.5
        */
        padding-bottom: 110%; 
        height: 0;
}
.b-lazy {
        max-width: 100%;
}