Cara buat gambar ditengah div pada css

Assalamu'alaikum wr wb
kali ini saya akan share bagaimana Cara buat gambar ditengah div pada css.
Berikut ini syntaxnya.

<style type="text/css">
div.horizontal
{
    display: flex;
    justify-content: center;
}

div.vertical
{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

div.div1
{
    background-color: darkgreen;
    width: 350px;
    height: 150px;
}

div.div2
{
    background-color: maroon;
    width: 600px;
    height: 400px;
}

div.div3
{
    background-color: darkblue;
    width: 300px;
    height: 500px;
}

img
{
width: 80px; height: 100px;
}
</style>

<div class="horizontal div1">
    <div class="vertical">
        <img src="https://s-media-cache-ak0.pinimg.com/originals/fa/ee/98/faee9834fc533077dd430be4ca2215be.jpg"/>
    </div>
</div>
<div class="horizontal div2">
    <div class="vertical">
        <img src="https://s-media-cache-ak0.pinimg.com/originals/fa/ee/98/faee9834fc533077dd430be4ca2215be.jpg"/>
    </div>
</div>
<div class="horizontal div3">
    <div class="vertical">
        <img src="https://s-media-cache-ak0.pinimg.com/originals/fa/ee/98/faee9834fc533077dd430be4ca2215be.jpg"/>
    </div>
</div>

Semoga bermanfaat.
http://pangeran-it.blogspot.sg/