<div class="block"></div>
html,
body {
  height: 100px;
  width: 300px;
}

body {
  display: flex;
  justify-content: center;
  align-items: center;
}

.block{
    width:50px;
    height:50px;
    background:red;
    -webkit-transform: scale(1,1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 550ms;
    -moz-transform: scale(1,1);
    -moz-transition-timing-function: ease-out;
    -moz-transition-duration: 550ms;
}
.block:hover {
    -webkit-transform: scale(2,2);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 550ms;
    -moz-transform: scale(2,2);
    -moz-transition-timing-function: ease-out;
    -moz-transition-duration: 550ms;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.