document.write('<link rel="stylesheet" href="http://flowcoder.com/stylesheets/pygment_trac.css" />');
document.write('<link rel="stylesheet" href="http://flowcoder.com/stylesheets/embed.css" />');
document.write('<div class="flowcoder_post flowcoder_clearfix">');
document.write('<div class="flowcoder_posttitle"><a href=\"http://flowcoder.com/81\">CSS Rotation Transform in Webkit<\/a></div>');
document.write('<div class="flowcoder_postbody flowcoder_syntax"><div class=\"highlight\"><pre><span class=\"c\">/* Nice little effect (webkit-only) from butterlabel.com */<\/span>\n\n<span class=\"nf\">#box<\/span> <span class=\"p\">{<\/span>\n  <span class=\"o\">-<\/span><span class=\"n\">webkit<\/span><span class=\"o\">-<\/span><span class=\"n\">box<\/span><span class=\"o\">-<\/span><span class=\"n\">shadow<\/span><span class=\"o\">:<\/span> <span class=\"m\">20px<\/span> <span class=\"m\">20px<\/span> <span class=\"m\">8px<\/span> <span class=\"n\">rgba<\/span><span class=\"p\">(<\/span><span class=\"m\">0<\/span><span class=\"o\">,<\/span><span class=\"m\">0<\/span><span class=\"o\">,<\/span><span class=\"m\">0<\/span><span class=\"o\">,<\/span><span class=\"m\">0<\/span><span class=\"o\">.<\/span><span class=\"m\">2<\/span><span class=\"p\">);<\/span>  \n  <span class=\"o\">-<\/span><span class=\"n\">webkit<\/span><span class=\"o\">-<\/span><span class=\"n\">transform<\/span><span class=\"o\">:<\/span> <span class=\"n\">rotate<\/span><span class=\"p\">(<\/span><span class=\"m\">-2<\/span><span class=\"n\">deg<\/span><span class=\"p\">);<\/span>\n  <span class=\"o\">-<\/span><span class=\"n\">webkit<\/span><span class=\"o\">-<\/span><span class=\"n\">transition<\/span><span class=\"o\">:<\/span> <span class=\"o\">-<\/span><span class=\"n\">webkit<\/span><span class=\"o\">-<\/span><span class=\"n\">transform<\/span> <span class=\"m\">0<\/span><span class=\"o\">.<\/span><span class=\"m\">3<\/span><span class=\"err\">s<\/span> <span class=\"n\">ease<\/span><span class=\"o\">,<\/span> <span class=\"o\">-<\/span><span class=\"n\">webkit<\/span><span class=\"o\">-<\/span><span class=\"n\">box<\/span><span class=\"o\">-<\/span><span class=\"n\">shadow<\/span> <span class=\"m\">0<\/span><span class=\"o\">.<\/span><span class=\"m\">3<\/span><span class=\"err\">s<\/span> <span class=\"n\">ease<\/span><span class=\"p\">;<\/span>\n<span class=\"p\">}<\/span>\n\n<span class=\"nf\">#box<\/span><span class=\"nd\">:hover<\/span> <span class=\"p\">{<\/span>\n  <span class=\"o\">-<\/span><span class=\"n\">webkit<\/span><span class=\"o\">-<\/span><span class=\"n\">transform<\/span><span class=\"o\">:<\/span> <span class=\"n\">rotate<\/span><span class=\"p\">(<\/span><span class=\"m\">0<\/span><span class=\"n\">deg<\/span><span class=\"p\">);<\/span>\n  <span class=\"o\">-<\/span><span class=\"n\">webkit<\/span><span class=\"o\">-<\/span><span class=\"n\">box<\/span><span class=\"o\">-<\/span><span class=\"n\">shadow<\/span><span class=\"o\">:<\/span> <span class=\"m\">1px<\/span> <span class=\"m\">1px<\/span> <span class=\"m\">1px<\/span> <span class=\"n\">rgba<\/span><span class=\"p\">(<\/span><span class=\"m\">0<\/span><span class=\"o\">,<\/span><span class=\"m\">0<\/span><span class=\"o\">,<\/span><span class=\"m\">0<\/span><span class=\"o\">,<\/span><span class=\"m\">0<\/span><span class=\"o\">.<\/span><span class=\"m\">8<\/span><span class=\"p\">);<\/span>\n<span class=\"p\">}<\/span>\n<\/pre><\/div>\n</div>');
document.write('<div class="flowcoder_bottombar flowcoder_clearfix">');
document.write('<div class="flowcoder_postedby">Posted by <a href=\"http://flowcoder.com/scottymac\">scottymac<\/a> on <a href=\"http://flowcoder.com/\">Flowcoder<\/a></div>');
document.write('<div class="flowcoder_viewraw"><a href=\"http://flowcoder.com/81.txt\">view raw<\/a></div>');
document.write('</div></div>');