grenlibre.fr

This is just css. There are no javascript or flash code !

For more CSS3 Transition demos, please go to this article from my blog.

This is the css code :

.container {
  text-align: center;
  padding: 10px;
  margin: 10px;
  background: #f9f9f9;
}

.container .letters {
  text-decoration: none;
  font-weight: bold;
  line-height: 100px;
}

.container .letters span {
  -moz-transition-duration: 1.5s;
  -webkit-transition-duration: 1.5s;
  -o-transition-duration: 1.5s;
  font-size: 50px;
}
.container .letters span:hover {
  font-size: 100px;
}

.container .letters span.green {
  color: #547659;
  text-shadow: 1px 1px 2px #8FC1A5;
}
.container .letters span.green:hover {
  color: #315637;
  text-shadow: 5px 5px 5px #99ADA2;
}

.container .letters span.red {
  color: #874031;
  text-shadow: 1px 1px 2px #C1998F;
}
.container .letters span.red:hover {
  color: #723B2F;
  text-shadow: 5px 5px 5px #B4A09B;
}

.container .letters span.blue {
  color: #314A87;
  text-shadow: 1px 1px 2px #8F9AC1;
}
.container .letters span.blue:hover {
  color: #2F3F72;
  text-shadow: 5px 5px 5px #9B9FB4;
}