<div class="align">
        <div class="align-item">
             <img src="http://lorempixel.com/150/150/">
        </div>
     </div>
html,body {
  width:100%;
  height:100%;
  margin:0;
}

.align {
  width:100%;
  height:100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.align-item {
  max-width: 50%;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.