Resize box and change color

CSS

.box{
width: 200px;
height:50px;
background:#CFCFCF;
-webkit-transition:all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}
.box:hover{
width:300px;background:#121212;
}

HTML

<div class='box'></div>

Hasil: