.progressive {
    overflow: hidden;
    position: relative;
    background: #efefef
}

.progressive__img {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.progressive--not-loaded {
    filter: blur(30px);
    -webkit-filter: blur(30px)
}

.progressive--is-loaded {
    filter: blur(20px);
    -webkit-filter: blur(20px);
    -webkit-animation: sharpen .5s both;
    animation: sharpen .5s both
}

@-webkit-keyframes sharpen {
    from {
        filter: blur(20px);
        -webkit-filter: blur(20px)
    }
    to {
        filter: blur(0);
        -webkit-filter: blur(0)
    }
}

@keyframes sharpen {
    from {
        filter: blur(20px);
        -webkit-filter: blur(20px)
    }
    to {
        filter: blur(0);
        -webkit-filter: blur(0)
    }
}