DIV.transition {border:1px solid black;background:#808080;-o-transition:all 3s ease-in;-webkit-transition:all 3s ease-in;-moz-transition:all 3s ease-in;-ms-transition:all 3s ease-in;transition:all 3s ease-in}
DIV.transitionhover {border:1px solid block;background:#fff}
DIV.transitionhover:hover {border:5px solid red;background-color:#c0c0c0;-o-transition:border 1s linear, background-color 1s linear .1s;-webkit-transition:border 1s linear, background-color 1s linear .1s;-moz-transition:border 1s linear, background-color 1s linear .1s;-ms-transition:border 1s linear, background-color 1s linear .1s;transition:border 1s linear, background-color 1s linear .1s}
DIV.transitionpadding {border:1px solid block;background:#fff;padding-left:20px;opacity:1;filter:alpha(opacity=100)}
DIV.transitionpadding:hover {opacity:0.5;filter:alpha(opacity=50);padding-left:200px;background-color:#c0c0c0;-o-transition:padding-left 2s ease-out, opacity 2s ease-out;-webkit-transition:padding-left 2s ease-out, opacity 2s ease-out;-moz-transition:padding-left 2s ease-out, opacity 2s ease-out;-ms-transition:padding-left 2s ease-out, opacity 2s ease-out;transition:padding-left 2s ease-out, opacity 2s ease-out}
DIV.translate {border:1px solid blue;-o-transform:translate(100px,20px);-webkit-transform:translate(100px,20px);-moz-transform:translate(100px,20px);-ms-transform:translate(100px,20px);transform:translate(100px,20px)}
DIV.rotate {border:1px solid green;-o-transform:translate(100px,70px) rotate(70deg);-webkit-transform:translate(100px,70px) rotate(70deg);-moz-transform:translate(100px,70px) rotate(70deg);-ms-transform:translate(100px,70px) rotate(70deg);transform:translate(100px,70px) rotate(70deg);display:block;width:300px;height:30px}
DIV.transitionrotate {display:block;width:300px;height:30px;border:1px solid black;background:#ccc}
DIV.transitionrotate:hover {background:#c0c0c0;-o-transform:translate(30px,40px) rotate(10deg);-webkit-transform:translate(30px,40px) rotate(10deg);-moz-transform:translate(30px,40px) rotate(10deg);-ms-transform:translate(30px,40px) rotate(10deg);transform:translate(30px,40px) rotate(10deg);-o-transition:-webkit-transform 1s linear;-webkit-transition:-webkit-transform 1s linear;-moz-transition:-webkit-transform 1s linear;-ms-transition:-webkit-transform 1s linear;transition:-webkit-transform 1s linear}
DIV.transitionrotate:hover {-o-transition:-moz-transform 1s linear;-webkit-transition:-moz-transform 1s linear;-moz-transition:-moz-transform 1s linear;-ms-transition:-moz-transform 1s linear;transition:-moz-transform 1s linear}
DIV.matrix {-o-transform:matrix(1,-0.2,0,1,0,0);-webkit-transform:matrix(1,-0.2,0,1,0,0);-moz-transform:matrix(1,-0.2,0,1,0,0);-ms-transform:matrix(1,-0.2,0,1,0,0);transform:matrix(1,-0.2,0,1,0,0)}
DIV.scale {-o-transform-origin:top left;-webkit-transform-origin:top left;-moz-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-o-transform:scale(4,2);-webkit-transform:scale(4,2);-moz-transform:scale(4,2);-ms-transform:scale(4,2);transform:scale(4,2)}
DIV.transitionproperties {-o-transform-origin:bottom left;-webkit-transform-origin:bottom left;-moz-transform-origin:bottom left;-ms-transform-origin:bottom left;transform-origin:bottom left;-webkit-transition-property:left, top, background, -webkit-transform;-webkit-transition-duration:2s, 2s, 1s, 1s;-webkit-transition-timing-function:ease-out, ease-in, linear, ease-in-out;-webkit-transition-delay:0s, 0s, 0s, 1s}