<?xml version="1.0"?>
<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <style type="text/css">
      polygon:hover {stroke:red; stroke-width:5; fill-opacity:0.2;}
    </style>
  </head>
  <body>
    <h1>Move the mouse over the shapes!</h1>
    <svg xmlns="http://www.w3.org/2000/svg" height="300">
      <g transform="scale(0.8) translate(-200)">
        <polygon fill="blue"
                 points="350, 75 379,161 469,161 397,215
                         423,301 350,250 277,301 303,215
                         231,161 321,161" />
        <polygon fill="lime"
                 points="850,75  958,137.5 958,262.5
                         850,325 742,262.6 742,137.5"/>
      </g>
    </svg> 
  </body>
</html>
