Продолжаем CSS

http://jsbin.com/vehijuz/edit?html,css,output 

@keyframes magic {
0% {transform:rotate(0deg)}
100% {transform:rotate(360deg)}
}
.shadow {
font-size:2.0em;
font-family:Arial;
}
.shadow1 {
text-shadow:2px 2px #FF0000;
}
.shadow2 {
text-shadow:4px 2px #FF9944;
}

.el {
cursor:pointer;
float:center;
border:2px #000000 solid;
padding:10px;
width:500px;
height:300px;
margin-left:200px;
margin-top:200px;
background-color:#808991;
color:#ffffff;
font-weight:bold;
border-radius:15px;
}
p {
text-align:center;
}
.el:hover {
background-color:#d0d940;
color:#000000;
width:400px;
box-shadow:2px 2px 50px #000000;
animation-name:magic;
animation-duration:4s;
}