For more CSS3 Transition demos, please go to this article from my blog.
.container {
padding: 10px;
display: inline-block;
overflow: auto;
}
.container .box1 {
width: 200px;
height: 200px;
margin: 10px;
-moz-transition-duration: 1s;
-webkit-transition-duration: 1s;
-o-transition-duration: 1s;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
background-color: #f00;
border: 2px solid #900;
line-height: 200px;
text-align: center;
font-size: 30px;
font-weight: bold;
color: white;
}
.container:hover .box1 {
-moz-border-radius: 200px;
-webkit-border-radius: 200px;
border-radius: 200px;
background-color: #fa0;
border: 5px solid #930;
font-size: 60px;
text-shadow: 0px 0px 4px black;
}