<?xml version="1.0" standalone="no"?>

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">

<!--
<text x='50' y='50' style='fill:black; stroke:none; font-size:150%;'>&#x6c34;</text>
-->

<defs>
      <marker id="endArrow" viewBox="0 0 10 10" refX="1" refY="5" markerUnits="strokeWidth" orient="auto" markerWidth="5" markerHeight="4">
         <polyline points="0,0 10,5 0,10 1,5" fill="darkblue" />
      </marker>

      <marker id="startArrow" viewBox="0 0 10 10" refX="1" refY="5" markerUnits="strokeWidth" orient="auto" markerWidth="5" markerHeight="4">
         <polyline points="10,0 0,5 10,10 9,5" fill="darkblue" />
      </marker>
  </defs>

<!-- Starting NW quadrant -->
<g id='NW' transform='translate(10, -60)' style='background-color:blue;'>

<!-- moon  -->
<g transform='rotate(315, 250, 340) scale(0.5, 0.5) translate(0, 10)' id='moon' stroke-width='3'>
<path d='M400 100 Q500 250, 600 100' style='fill:none; stroke:black; height:2px;' />
<path d='M400 100 Q500 350, 600 100' style='fill:none; stroke:black; height:2px;' />
</g>

<!-- tree -->
<g id='tree' stroke-width='2'>
<line x1='200' y1='100' x2='150' y2='180' style='stroke:black;' />

<line x1='200' y1='100' x2='250' y2='180' style='stroke:black;' />

<line x1='150' y1='180' x2='250' y2='180' style='stroke:black;' />

<line x1='190' y1='180' x2='190' y2='220' style='stroke:black;' />

<line x1='210' y1='180' x2='210' y2='220' style='stroke:black;' />
</g>

<!-- man -->
<g id='man' style='fill:none; stroke:black;' transform='translate(70, -150)' stroke-width='2'>
<circle cx='250' cy='250' r='20' /> <!--head-->
<line x1='250' y1='270' x2='250' y2='330' /> <!-- body -->
<line x1='250' y1='290' x2='220' y2='270' /> <!-- left arm -->
<line x1='250' y1='290' x2='280' y2='270' /> <!-- right arm -->
<line x1='250' y1='330' x2='220' y2='370' /> <!-- left arm -->
<line x1='250' y1='330' x2='280' y2='370' /> <!-- right arm -->
</g>

<!-- water -->
<g id='water' transform='translate(-380, 0)' stroke-width='2'>
<path d='M800 100 Q720 200 800 220' style='fill:none; stroke:black;' />

<path d='M800 100 Q880 200 800 220' style='fill:none; stroke:black;' />
</g>

<!-- arrow  and text for 1st  -->
<line x1="60" y1="230" x2="60" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='25' y='340' stroke='none' fill='black' stroke-width='1' style='font-size:220%;'>moon</text>

<!-- arrow  and text for 2nd  -->
<line x1="200" y1="230" x2="200" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='178' y='340' stroke='none' fill='black' stroke-width='1' style='font-size:220%;'>tree</text>

<!-- arrow  and text 3rd  -->
<line x1="320" y1="230" x2="320" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
     <text x='290' y='340' stroke='none' fill='black' stroke-width='1' style='font-size:220%;'>man</text>

<!-- arrow  and text for 4th -->
<line x1="420" y1="230" x2="420" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='380' y='340' stroke='none' fill='black' stroke-width='1' style='font-size:220%;'>water</text>
</g>
<!-- end of NW  -->

<!-- Start NE -->
<g id='NE' transform='translate(550, -60)'>

<!-- moon -->
<g id='moon' transform='rotate(315, 250, 340) scale(0.5, 0.5) translate(0, 10)' stroke-width='3'>
<path d='M400 100 Q500 250, 600 100' style='fill:none; stroke:black; height:2px;' />
<path d='M400 100 Q500 350, 600 100' style='fill:none; stroke:black; height:2px;' />
</g>

<g id='tree' stroke-width='2'>
<line x1='200' y1='100' x2='150' y2='180' style='stroke:black;' />

<line x1='200' y1='100' x2='250' y2='180' style='stroke:black;' />

<line x1='150' y1='180' x2='250' y2='180' style='stroke:black;' />

<line x1='190' y1='180' x2='190' y2='220' style='stroke:black;' />

<line x1='210' y1='180' x2='210' y2='220' style='stroke:black;' />
</g>

<g id='man' style='fill:none; stroke:black;' transform='translate(70, -150)' stroke-width='2'>
<circle cx='250' cy='250' r='20' /> <!--head-->
<line x1='250' y1='270' x2='250' y2='330' /> <!-- body -->
<line x1='250' y1='290' x2='220' y2='270' /> <!-- left arm -->
<line x1='250' y1='290' x2='280' y2='270' /> <!-- right arm -->
<line x1='250' y1='330' x2='220' y2='370' /> <!-- left arm -->
<line x1='250' y1='330' x2='280' y2='370' /> <!-- right arm -->
</g>

<g id='water' transform='translate(-380, 0)' stroke-width='2'>
<path d='M800 100 Q720 200 800 220' style='fill:none; stroke:black;' />

<path d='M800 100 Q880 200 800 220' style='fill:none; stroke:black;' />
</g>

<!-- arrow and text for 1st -->
<line x1="60" y1="230" x2="60" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='35' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>tree</text>

<!-- arrow  for 2nd-->
<line x1="200" y1="230" x2="200" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='175' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>man</text>

<!-- arrow  for 3rd-->
<line x1="320" y1="230" x2="320" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='290' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>water</text>

<!-- arrow  for 4th -->
<line x1="420" y1="230" x2="420" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='385' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>moon</text>
</g>
<!-- end of NE -->

<!-- Starting SW quadrant -->
<g id='SW' transform='translate(0, 230)' style='background-color:blue;'>
<!--
<rect x='0' y='60' width='500' height='300' style='fill:#fdebcf; stroke:none;' />
-->
<!-- moon  -->
<g transform='rotate(315, 250, 340) scale(0.5, 0.5) translate(0, 10)' id='moon' stroke-width='3'>
<path d='M400 100 Q500 250, 600 100' style='fill:none; stroke:black; height:2px;' />
<path d='M400 100 Q500 350, 600 100' style='fill:none; stroke:black; height:2px;' />
</g>

<!-- tree -->
<g id='tree' stroke-width='2'>
<line x1='200' y1='100' x2='150' y2='180' style='stroke:black;' />

<line x1='200' y1='100' x2='250' y2='180' style='stroke:black;' />

<line x1='150' y1='180' x2='250' y2='180' style='stroke:black;' />

<line x1='190' y1='180' x2='190' y2='220' style='stroke:black;' />

<line x1='210' y1='180' x2='210' y2='220' style='stroke:black;' />
</g>

<!-- man -->
<g id='man' style='fill:none; stroke:black;' transform='translate(70, -150)' stroke-width='2'>
<circle cx='250' cy='250' r='20' /> <!--head-->
<line x1='250' y1='270' x2='250' y2='330' /> <!-- body -->
<line x1='250' y1='290' x2='220' y2='270' /> <!-- left arm -->
<line x1='250' y1='290' x2='280' y2='270' /> <!-- right arm -->
<line x1='250' y1='330' x2='220' y2='370' /> <!-- left arm -->
<line x1='250' y1='330' x2='280' y2='370' /> <!-- right arm -->
</g>

<!-- water -->
<g id='water' transform='translate(-380, 0)' stroke-width='2'>
<path d='M800 100 Q720 200 800 220' style='fill:none; stroke:black;' />

<path d='M800 100 Q880 200 800 220' style='fill:none; stroke:black;' />
</g>

<!-- arrow  and text for 1st  -->
<line x1="60" y1="230" x2="60" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='30' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>man</text>

<!-- arrow  and text for 2nd  -->
<line x1="200" y1="230" x2="200" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='160' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>water</text>

<!-- arrow  and text 3rd  -->
<line x1="320" y1="230" x2="320" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
     <text x='280' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>moon</text>

<!-- arrow  and text for 4th -->
<line x1="420" y1="230" x2="420" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='395' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>tree</text>
</g>
<!-- end of SW  -->


<!-- Starting SE quadrant -->
<g id='SE' transform='translate(550, 230)' style='background-color:blue;'>
<!--
<rect x='0' y='60' width='500' height='300' style='fill:#fdebcf; stroke:none;' />
-->
<!-- moon  -->
<g transform='rotate(315, 250, 340) scale(0.5, 0.5) translate(0, 10)' id='moon' stroke-width='3'>
<path d='M400 100 Q500 250, 600 100' style='fill:none; stroke:black; height:2px;' />
<path d='M400 100 Q500 350, 600 100' style='fill:none; stroke:black; height:2px;' />
</g>

<!-- tree -->
<g id='tree' stroke-width='2'>
<line x1='200' y1='100' x2='150' y2='180' style='stroke:black;' />

<line x1='200' y1='100' x2='250' y2='180' style='stroke:black;' />

<line x1='150' y1='180' x2='250' y2='180' style='stroke:black;' />

<line x1='190' y1='180' x2='190' y2='220' style='stroke:black;' />

<line x1='210' y1='180' x2='210' y2='220' style='stroke:black;' />
</g>

<!-- man -->
<g id='man' style='fill:none; stroke:black;' transform='translate(70, -150)' stroke-width='2'>
<circle cx='250' cy='250' r='20' /> <!--head-->
<line x1='250' y1='270' x2='250' y2='330' /> <!-- body -->
<line x1='250' y1='290' x2='220' y2='270' /> <!-- left arm -->
<line x1='250' y1='290' x2='280' y2='270' /> <!-- right arm -->
<line x1='250' y1='330' x2='220' y2='370' /> <!-- left arm -->
<line x1='250' y1='330' x2='280' y2='370' /> <!-- right arm -->
</g>

<!-- water -->
<g id='water' transform='translate(-380, 0)' stroke-width='2'>
<path d='M800 100 Q720 200 800 220' style='fill:none; stroke:black;' />

<path d='M800 100 Q880 200 800 220' style='fill:none; stroke:black;' />
</g>

<!-- arrow  and text for 1st  -->
<line x1="60" y1="230" x2="60" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='30' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>water</text>

<!-- arrow  and text for 2nd  -->
<line x1="200" y1="230" x2="200" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='160' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>moon</text>

<!-- arrow  and text 3rd  -->
<line x1="320" y1="230" x2="320" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
     <text x='295' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>tree</text>

<!-- arrow  and text for 4th -->
<line x1="420" y1="230" x2="420" y2="320" stroke="lime" stroke-width="3" marker-start="url(#startArrow)" />
      <text x='395' y='340' stroke='none' fill='blue' stroke-width='1' style='font-size:220%;'>man</text>
</g>
<!-- end of SE  -->


</svg>