Les transitions

Color

#content_color{
background:#FFF;
-webkit-transition-property: background;
-webkit-transition-duration: 0.5s;
-moz-transition-property: background;
-moz-transition-duration: 0.5s;
transition-property: background;
transition-duration: 0.5s;
}

#content_color:hover{
background:#2C2C2C;
}

.transition_couleur a {
font-size: 3em;
font-weight: bold;
color: #F00;
text-decoration: none;
-webkit-transition-property: color;
-webkit-transition-duration: 2s;
-moz-transition-property: color;
-moz-transition-duration: 2s;
transition-property: color;
transition-duration: 2s;
-webkit-transition-delay: 1s
}

.transition_couleur a:hover {
color: #00F;
}

A noter, que les attributs de la transition sont sur la balise "a" et non sur le "a:hover"

Transform

#img_transition img {
-webkit-transition:-webkit-transform 0.5s;
-moz-transition: -moz-transform 0.5s;
transition: transform 0.5s;
}

#img_transition img:hover {
-webkit-transform-origin:top left;
-moz-transform-origin:top;
transform-origin:top;
-moz-transform:scale(2.0);
-webkit-transform:scale(2.0);
transform:scale(2.0);
-webkit-box-shadow:0px 0px 8px #2C2C2C;
-moz-box-shadow:0px 0px 8px #2C2C2C;
box-shadow:0px 0px 8px #2C2C2C;
cursor:help;
}

Il est également possible d'utiliser les sous valeurs pour agrandir qu'une seule valeur, hauteur ou largeur :

transform: scaleX(2) scaleY(1);
transform: scaleX(2);