Responsive Image Cropping

Responsive Image Cropping

HTML

<div class="container">
    <div class="image-container"></div>
</div>

CSS

.container {
    width: 100%;
    height:400px;
}

.image-container {
    position:relative;
    margin:0 auto;
    background:url(http://i.imgur.com/H7cpsLK.jpg) no-repeat center center;
    background-size:cover;
    max-width:768px;
    width:100%;
    height:100%;
}