<?xml version="1.0"?>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:svg="http://www.w3.org/2000/svg" >
<head>
<style>
polygon[selectable='1']:hover {stroke:red; stroke-width:10; fill-opacity:0.2;}
</style>
</head>
<body>
<svg:svg xmlns="http://www.w3.org/2000/svg">

<svg:g transform="rotate(20)">
  <svg:polygon transform="scale(1 0.6)" points="50,60 500,60 500,200 50,200" style="fill:yellow;" />
  <svg:g transform="scale(0.5) translate(-100)">
    <svg:polygon selectable='1' style="fill:blue; stroke-width:10"
           points="350, 75 379,161 469,161 397,215
                   423,301 350,250 277,301 303,215
                   231,161 321,161" />
    <svg:polygon selectable='1' style="fill:lime; stroke-width:10"
           points="850,75  958,137.5 958,262.5
                   850,325 742,262.6 742,137.5"/>
  </svg:g>
</svg:g>
</svg:svg> 
</body>
</html>