Scale on Hover with Transition & img hover zoom

HTML

 <div class="item">
  <img src="hemant.jpg" alt="hemant" width="540" height="548">
  
  <div class="item-overlay top"></div>
</div>

CSS

* {

-moz-box-sizing: border-box;

-webkit-box-sizing: border-box;

box-sizing: border-box;

margin: 0;

padding: 0;

}




.item {

position: relative;



border: 1px solid #333;

margin: 2%;

overflow: hidden;

width: 540px;

}

.item img {

max-width: 100%;



-moz-transition: all 0.3s;

-webkit-transition: all 0.3s;

transition: all 0.3s;

}

.item:hover img {

-moz-transform: scale(1.1);

-webkit-transform: scale(1.1);

transform: scale(1.1);



}

Scale on Hover with Transition & img hover zoom