cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - Activehtmlicon-personicon-teamoctocatpop-outspinnerstartv

Pen Settings

CSS Base

Vendor Prefixing

Add External CSS

These stylesheets will be added in this order and before the code you write in the CSS editor. You can also add another Pen here, and it will pull the CSS from it. Try typing "font" or "ribbon" below.

Quick-add: + add another resource

Add External JavaScript

These scripts will run in this order and before the code in the JavaScript editor. You can also link to another Pen here, and it will run the JavaScript from it. Also try typing the name of any popular library.

Quick-add: + add another resource

Code Indentation

     

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

            
              <h2>Play with the Controls</h2>
<svg xmlns="http://www.w3.org/2000/svg" width="1007.4" height="395.5" viewBox="0 0 1007.4 395.5">
  <g id="pull">
    <path fill="#6B847F" d="M100.2 340.6c0 3.2-2.6 5.8-5.9 5.8-3.2 0-5.9-2.6-5.9-5.8 0-3.2 2.6-5.9 5.9-5.9 3.3.1 5.9 2.7 5.9 5.9z" />
    <path fill="#E7FFCC" d="M97.3 340.6c0 1.6-1.3 3-3 3s-3-1.3-3-3 1.3-3 3-3 3 1.4 3 3z" />
    <path fill="none" d="M206.4 347.4c3.6 0 6.5-2.9 6.5-6.5s-2.9-6.5-6.5-6.5h-11.7v13h11.7zM87.6 340.9c0 3.6 2.9 6.5 6.5 6.5h100.6v-13H94.1c-3.6 0-6.5 3-6.5 6.5z" />
    <path fill="#6B847F" d="M998.7 332.4h-12v2h12c3.7 0 6.6 2.8 6.6 6.5s-3 6.5-6.6 6.5h-12v2h12c4.8 0 8.7-3.7 8.7-8.5s-3.9-8.5-8.7-8.5zM94.6 334.4h106.1v-2H94.6c-5 0-9.1 3.5-9.1 8.5s4.1 8.5 9.1 8.5h106.1v-2H94.6c-3.8 0-6.9-2.7-6.9-6.5s3.1-6.5 6.9-6.5z"
    />
    <path fill="#6B847F" d="M126.2 347.4h862.6v2H126.2z" id="line" />
    <path fill="#6B847F" d="M134 332.5h862.6v2H134z" id="line_2_" />
    <path fill="#6B847F" d="M1003.9 340.6c0 3.2-2.6 5.8-5.9 5.8-3.2 0-5.9-2.6-5.9-5.8 0-3.2 2.6-5.9 5.9-5.9 3.3.1 5.9 2.7 5.9 5.9z" />
    <path fill="#E7FFCC" d="M1001.1 340.6c0 1.6-1.3 3-3 3s-3-1.3-3-3 1.3-3 3-3 3 1.4 3 3z" />
    <path fill="#6B847F" d="M292.6 340.6c0 3.2-2.6 5.8-5.9 5.8-3.2 0-5.9-2.6-5.9-5.8 0-3.2 2.6-5.9 5.9-5.9 3.3.1 5.9 2.7 5.9 5.9z" />
    <path fill="#E7FFCC" d="M289.8 340.6c0 1.6-1.3 3-3 3s-3-1.3-3-3 1.3-3 3-3 3 1.4 3 3z" />
    <g>
      <path fill="#6B847F" d="M827.6 340.6c0 3.2-2.6 5.8-5.9 5.8-3.2 0-5.9-2.6-5.9-5.8 0-3.2 2.6-5.9 5.9-5.9 3.3.1 5.9 2.7 5.9 5.9z" />
      <path fill="#E7FFCC" d="M824.8 340.6c0 1.6-1.3 3-3 3s-3-1.3-3-3 1.3-3 3-3 3 1.4 3 3z" />
    </g>
    <g>
      <path fill="#6B847F" d="M646.6 340.6c0 3.2-2.6 5.8-5.9 5.8-3.2 0-5.9-2.6-5.9-5.8 0-3.2 2.6-5.9 5.9-5.9 3.3.1 5.9 2.7 5.9 5.9z" />
      <path fill="#E7FFCC" d="M643.8 340.6c0 1.6-1.3 3-3 3s-3-1.3-3-3 1.3-3 3-3 3 1.4 3 3z" />
    </g>
    <g>
      <path fill="#6B847F" d="M469.6 340.6c0 3.2-2.6 5.8-5.9 5.8-3.2 0-5.9-2.6-5.9-5.8 0-3.2 2.6-5.9 5.9-5.9 3.3.1 5.9 2.7 5.9 5.9z" />
      <path fill="#E7FFCC" d="M466.8 340.6c0 1.6-1.3 3-3 3s-3-1.3-3-3 1.3-3 3-3c1.6 0 3 1.4 3 3z" />
    </g>
    <path fill="#9DDCA0" d="M55.9 350h940v45.5h-940z" />
  </g>
  <path fill="#DBFCBA" d="M806.3 182v-72.3h5.8V99.5h-9v-5.4h-18v5.4h-20.6v10.2h5.8V158l-26.9-21.9-28 22.7v54.7L697.6 203v-13.2H695c-.8-3-3.3-5.3-6.4-5.8v-11.8H686V184c-3.1.5-5.6 2.8-6.4 5.8H677v13.8L649.4 220v34H637v-15.8h5.8l-6.3-10.2h-19v-16.8h9l-38.6-28-13.2 9.6V187h-8.8v12.2l-16.6 12h9v9.4l-25.8-6.5v-14.4h6.6l-27.2-45.9v-5.4h2.6v-2h-2.6v-3.1h-2v3.1h-2.6v2h2.6v5.4l-27.2 45.9h6.6v18.5l-28.4-41.1v-64.9H457V98.9l-7.9-7.4-5.2-81.5V4.6h2.3V2.8h-2.3V0h-1.8v2.8h-2.3v1.8h2.3V10L437 91.5l-7.9 7.4v13.3h-3.9v67.6l-23.6 32v-47.7h4.8l-4.2-10.2h-25.5v-16.2h4.6l-19.1-32.2v-3.8h1.8v-1.4h-1.8v-2.1h-1.4v2.1H359v1.4h1.8v3.8l-19.1 32.2h4.6V154h-25.5l-4.2 10.2h4.8v50.1l-68.2 9.9v5.1l5.8-.8v41.8h-5.6l.5 34.8 574.5 6-13.6-126.3-8.5-2.8z"
  id="bk-far" />
  <path fill="#AACEB0" d="M953 285.9v-20.5h2.9l-2.6-7.4h-40.6v-72.8h6l-10.9-7.6v-9h-5.1v5.4l-9.6-6.7-25.7 17.9h6v51.7h-23.9V202h6l-25.9-18-25.7 18h6v104.7h-13.3V290h4.6l-5.1-9.6h-14.6l-26-22.3v-47.3h7.2l-11.7-10v-12.9h-7v6.9l-12.2-10.5-30.9 26.6h7.2V240h-13l-4.5-3.9v-14.7h-8.1v7.7L669 217.2l-35.4 30.5h8.2V275h-24.2v-26.8h5.6l-3.7-7H614v-4h-10.2c-.5-3.8-3.3-6.6-6.6-6.6s-6.1 2.9-6.6 6.6h-10.2v4h-5.5l-3.7 7h5.6V264h-15v16.4h-12.3v-7.5H543v-11.8h7.2l-30.9-26.6-10.6 9.1v-5.5h-7v11.6l-13.2 11.4h7.2v12.3h-27.1l-4.5-3.9v-14.7H456v7.7l-13.7-11.8-35.4 30.5h8.2v27.3h-15.7v-60.6h9.3l-39.8-34.3-13.6 11.7v-7.1H346v14.9l-17.1 14.7h9.3V261h-5.4v11.8h-19.5v6.7h-16.1l-4.5-3.9V261h-8.1v7.7L270.8 257l-21.1 18.1-34.4-29.6-13.5 11.6v-7h-9v14.8l-16.9 14.6h9.2v16.6l-29.4-25.3-13.5 11.6v-7h-9v14.8l-16.9 14.6h9.2v17.6h-4.9v11.1h845v-40.7l-12.6-6.9z"
  id="bk-mid" />
  <g class="city">
  <g id="house1">
    <path fill="#C68B7B" d="M348 134.5H168l-20 39h220z" id="roof" />
    <path fill="#7B908C" d="M368 172.4l-20-39H168l-20 39h-1.3v2h222v-2h-.7zm-217.8 0l19-37h177.6l19 37H150.2z" />
    <path fill="#99C0A2" d="M149 254.5h218v68H149z" id="bottom" />
    <path fill="#7B908C" d="M147.7 253.4v70h220v-70h-220zm218 68h-216v-66h216v66z" />
    <path fill="#99C0A2" d="M149 176.5h218v68H149z" id="top" />
    <path fill="#7B908C" d="M147.7 175.4v70h220v-70h-220zm218 68h-216v-66h216v66z" />
    <path fill="#AD937F" d="M157 322.5h77v10h-77z" id="Rectangle_145_70_" />
    <path fill="#7B908C" d="M155.7 321.4v12h79v-12h-79zm77 10h-75v-8h75v8z" />
    <path fill="#DD8C80" d="M244 274.5h28v48h-28z" id="Rectangle_83_27_" />
    <path fill="#E7FFCC" d="M249.7 293.9l-.2-12s1.5-3 5-3.4c0 0 6.6-.6 7.7.2 0 0 3.8.8 3.9 2.9l.1 12-16.5.3z" />
    <path fill="#7B908C" d="M242.7 273.4v50h30v-50h-30zm28 48h-26v-46h26v46zm-12-2h8v-8h-8v8zm1-7h6v6h-6v-6zm-1-3h8v-8h-8v8zm1-7h6v6h-6v-6zm6.3-4.5c0 .8.7 1.5 1.5 1.5h1c.8 0 1.5-.7 1.5-1.5s-.7-1.5-1.5-1.5h-1c-.9 0-1.5.7-1.5 1.5zm.7-.5h2v1h-2v-1zm-18-3h18v-11.9c0-2.8-4-5-9-5s-9 2.2-9 5v11.9zm13-15.3c3 .7 4 1.9 4 3.4v.9h-4v-4.3zm0 5.3h4v9h-4v-9zm-7-5.5c1-.2 2-.3 3-.3s2 .1 3 .3v4.6h-6v-4.6zm0 5.5h6v9h-6v-9zm-5-1.9c0-1.5 2-2.7 4-3.4v4.3h-4v-.9zm0 1.9h4v9h-4v-9zm7 27h-8v8h8v-8zm-1 7h-6v-6h6v6zm1-17h-8v8h8v-8zm-1 7h-6v-6h6v6z"
    />
    <path fill="#C9B189" d="M234 322.5h10v-48h-10v48zm38-48v48h10v-48h-10z" id="Rectangle_83_24_" />
    <path fill="#7B908C" d="M270.7 273.4v50h12v-50h-12zm10 48h-8v-46h8v46zm-42-37.9c-1.7 0-3 1.3-3 3v24c0 1.7 1.3 3 3 3s3-1.3 3-3v-24c0-1.6-1.3-3-3-3zm2 27c0 1.1-.9 2-2 2s-2-.9-2-2v-24c0-1.1.9-2 2-2s2 .9 2 2v24zm-5 9.9h6v-6h-6v6zm1-5h4v4h-4v-4zm43-39h-6v6h6v-6zm-1 5h-4v-4h4v4zm-43 1h6v-6h-6v6zm1-5h4v4h-4v-4zm40 36.1c1.7 0 3-1.3 3-3v-24c0-1.7-1.3-3-3-3s-3 1.3-3 3v24c0 1.7 1.3 3 3 3zm-2-27c0-1.1.9-2 2-2s2 .9 2 2v24c0 1.1-.9 2-2 2s-2-.9-2-2v-24zm-42 36.9h12v-50h-12v50zm2-48h8v46h-8v-46zm45 39h-6v6h6v-6zm-1 5h-4v-4h4v4z"
    />
    <path fill="#C9B189" d="M260.2 264.6H255.6c-12.2.4-21.7 4.3-21.7 9v1h48v-1c.1-4.8-9.5-8.6-21.7-9z" id="Ellipse_32_2_" />
    <path fill="#7B908C" d="M261.4 263.6c-.2-.1-.3-.1-.5-.1H255c-.2 0-.6.1-.8.1-12.1.7-21.6 4.9-21.6 9.9v1.9h50v-1.9c.1-5-9.1-9.2-21.2-9.9zm-.5 1.8l-.9 3h-4.1l-.9-3h5.9zM254 269c.3.9 1.1 1.4 2 1.4h4.1c.9 0 1.7-.6 2-1.4l.4-1.3c4.4.4 9 1.3 12.3 2.6-.4-.1 1.1.4 2 1 .1.1.2.1.2.1h-37.7c.7 0 1.7-.9 1.7-.9 3.5-1.5 8.3-2.5 12.7-2.9l.3 1.4zm-19 4.4c0-3 6.7-6.8 18-7.8 0 .1 0 .3.1.4l.2.7c-4.1.4-8.4 1.2-11.7 2.5-4.9 1.8-4.6 3.2-4.6 3.2h42l-.5-.8c-1.1-1.7-5.7-3.2-3.5-2.3-3.4-1.3-7.9-2.2-12.2-2.6l.2-.7c0-.1 0-.3.1-.4 11.3.9 18.1 4.8 18.1 7.8H235z"
    />
    <path fill="#DDC9AC" d="M234 322.5h48v9h-48z" id="Rectangle_86_10_" />
    <path fill="#7B908C" d="M232.7 321.4v12h50v-12h-50zm10 10h-8v-8h8v8zm28 0h-26v-2h26v2zm0-3h-26v-1h26v1zm0-2h-26v-1h26v1zm0-2h-26v-1h26v1zm10 7h-8v-8h8v8z" />
    <path fill="#B792A1" d="M185 153c0-4.5-3.5-8.2-8-8.5v17h8v-8-.5zm17 0v8.5h8v-17c-4.5.3-8 4-8 8.5z" id="Ellipse_30_23_" />
    <path fill="#7B908C" d="M167 153.1c0-.1 0-.1 0 0 0-.1 0-.1 0 0zm9.7-9.5v10-10.1h-1v19h10v-10h.2c-.2-5.1-4.2-8.7-9.2-8.9zm1 2.1c1 .2 1.7.7 2.4.7h-2.4v-.7zm0 1.7h3.8c.3 0 .6 1 .9 1h-4.7v-1zm0 2h5.4c.2 0 .3 1 .5 1h-5.8v-1zm0 2h6.1c.1 0 .1 1 .1 1h-6.2v-1zm6 9h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm26-11v.1c-5 .3-8.4 3.9-8.7 8.9h-.3v10h10v-19h-1zm-1 17h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-3v1h-6v-1h6v-1H203l.1-1h5.6v-1h-5.3c.1 0 .3-1 .5-1h4.8v-1h-4.2c.3 0 .6-1 .9-1h3.3v-1h-1.9c.7 0 1.9-.5 1.9-.7v7.7z"
    />
    <path fill="#B792A1" d="M249 153c0-4.5-3.5-8.2-8-8.5v17h8v-8-.5zm17 0v8.5h8v-17c-4.5.3-8 4-8 8.5z" id="Ellipse_30_20_" />
    <path fill="#7B908C" d="M240.7 143.6v10-10.1h-1v19h10v-10h.2c-.2-5.1-4.2-8.7-9.2-8.9zm1 2.1c1 .2 1.7.7 2.4.7h-2.4v-.7zm0 1.7h3.8c.3 0 .6 1 .9 1h-4.7v-1zm0 2h5.4c.2 0 .3 1 .5 1h-5.8v-1zm0 2h6.1c.1 0 .1 1 .1 1h-6.2v-1zm6 9h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm-16.7-1.3c0-.1 0-.1 0 0 0-.1 0-.1 0 0zm42.7-9.7v.1c-5 .3-8.4 3.9-8.7 8.9h-.3v10h10v-19h-1zm-1 17h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-3v1h-6v-1h6v-1H267l.1-1h5.6v-1h-5.3c.1 0 .3-1 .5-1h4.8v-1h-4.2c.3 0 .6-1 .9-1h3.3v-1h-1.9c.7 0 1.9-.5 1.9-.7v7.7z"
    />
    <path fill="#B792A1" d="M314 153c0-4.5-3.5-8.2-8-8.5v17h8v-8-.5zm17 0v8.5h8v-17c-4.5.3-8 4-8 8.5z" id="Ellipse_30_17_" />
    <path fill="#7B908C" d="M305.7 143.6v10-10.1h-1v19h10v-10h.2c-.2-5.1-4.2-8.7-9.2-8.9zm1 2.1c1 .2 1.7.7 2.4.7h-2.4v-.7zm0 1.7h3.8c.3 0 .6 1 .9 1h-4.7v-1zm0 2h5.4c.2 0 .3 1 .5 1h-5.8v-1zm0 2h6.1c.1 0 .1 1 .1 1h-6.2v-1zm6 9h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm-16.7-1.3c0-.1 0-.1 0 0 0-.1 0-.1 0 0zm42.7-9.7v.1c-5 .3-8.4 3.9-8.7 8.9h-.3v10h10v-19h-1zm-1 17h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-3v1h-6v-1h6v-1H332l.1-1h5.6v-1h-5.3c.1 0 .3-1 .5-1h4.8v-1h-4.2c.3 0 .6-1 .9-1h3.3v-1h-1.9c.7 0 1.9-.5 1.9-.7v7.7z"
    />
    <path fill="#E7FFCC" d="M202 153.5v-.5c0-4.7-3.8-8.5-8.5-8.5s-8.5 3.8-8.5 8.5v8.5h17v-8z" id="Ellipse_30_14_" />
    <path fill="#7B908C" d="M202.7 160.4v-7h.2v-.5c0-5.2-4.3-9.5-9.5-9.5s-9.5 4.2-9.5 9.5v.5h-.3v7h-1v2h21v-2h-.9zm-9-14.8c4 .2 7 2.9 7.2 6.9h-7.2v-6.9zm-1 0v6.9H186c.2-4.1 3.7-6.7 6.7-6.9zm-7 7.8h15v7h-15v-7z" />
    <path fill="#E7FFCC" d="M331 153.5v-.5c0-4.7-3.8-8.5-8.5-8.5s-8.5 3.8-8.5 8.5v8.5h17v-8z" id="Ellipse_30_11_" />
    <path fill="#7B908C" d="M331.7 160.4v-7h.2v-.5c0-5.2-4.3-9.5-9.5-9.5s-9.5 4.2-9.5 9.5v.5h-.3v7h-1v2h21v-2h-.9zm-9-14.8c4 .2 7 2.9 7.2 6.9h-7.2v-6.9zm-1 0v6.9H315c.2-4.1 3.7-6.7 6.7-6.9zm-7 7.8h15v7h-15v-7z" />
    <path fill="#E7FFCC" d="M266 153.5v-.5c0-4.7-3.8-8.5-8.5-8.5s-8.5 3.8-8.5 8.5v8.5h17v-8z" id="Ellipse_30_8_" />
    <path fill="#7B908C" d="M266.7 160.4v-7h.2v-.5c0-5.2-4.3-9.5-9.5-9.5s-9.5 4.2-9.5 9.5v.5h-.3v7h-1v2h21v-2h-.9zm-9-14.8c4 .2 7 2.9 7.2 6.9h-7.2v-6.9zm-1 0v6.9H250c.2-4.1 3.7-6.7 6.7-6.9zm-7 7.8h15v7h-15v-7z" />
    <path fill="#DDC9AC" d="M163 258.5v-4h-10v4h1v40h-1v4h10v-4h-1v-40z" id="Rectangle_77_70_" />
    <path fill="#7B908C" d="M156.2 294.5c.3 0 .5-.2.5-.5v-31c0-.3-.2-.5-.5-.5s-.5.2-.5.5v31c0 .3.2.5.5.5zm6.5-35.2c1-.3 1-1 1-1.7v-4.1h-12v4.1c0 .7 1 1.4 1 1.7v38.2h1.3c-1.1 0-2.3 1-2.3 2.1v3.9h12v-3.9c0-1.1-.6-2.1-1.7-2.1h.7v-38.2zm-1 42.1h-8v-2h8v2zm-1-40v34h-6v-34h6zm-6-1v-1h6v1h-6zm6 36v1h-6v-1h6zm1-39h-8v-2h8v2zm-2.5 37.1c.3 0 .5-.2.5-.5v-31c0-.3-.2-.5-.5-.5s-.5.2-.5.5v31c0 .3.2.5.5.5z"
    />
    <path fill="#DDC9AC" d="M228 258.5v-4h-10v4h1v60h-1v4h10v-4h-1v-60z" id="Rectangle_77_67_" />
    <path fill="#7B908C" d="M227.7 259.3c1-.4 1-1 1-1.7v-4.1h-12v4.1c0 .7 1 1.4 1 1.7v59.1h1.3c-1.1 0-2.3.8-2.3 1.9v4.1h12v-4.1c0-1.1-.6-1.9-1.7-1.9h.7v-59.1zm-1 63.1h-8v-2h8v2zm-1-61v55h-6v-55h6zm-6-1v-1h6v1h-6zm6 57v1h-6v-1h6zm1-60h-8v-2h8v2zm-5.5 57.9c.3 0 .5-.2.5-.5v-51.6c0-.3-.2-.5-.5-.5s-.5.2-.5.5v51.6c0 .3.2.5.5.5zm3 0c.3 0 .5-.2.5-.5v-51.6c0-.3-.2-.5-.5-.5s-.5.2-.5.5v51.6c0 .3.2.5.5.5z"
    />
    <path fill="#DBFCBA" d="M149 173.5h218v3H149z" id="Rectangle_145_66_" />
    <path fill="#7B908C" d="M147.7 172.4v5h220v-5h-220zm218 3h-216v-1h216v1z" />
    <path fill="#E7FFCC" d="M312 194.5h22v37h-22z" id="Rectangle_92_35_" />
    <path fill="#7B908C" d="M334.7 230.4v-37h-24v37h-1v2h26v-2h-1zm-15-35h6v7h-6v-7zm0 8h6v6h-6v-6zm0 7h6v6h-6v-6zm0 7h6v6h-6v-6zm-1 13h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-7h6v7zm1 28v-6h6v6h-6zm13 0h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-7h6v7z"
    />
    <path fill="#EDBC80" d="M301 231.5h11v-37h-11v37zm33-37v37h11v-37h-11z" id="Rectangle_106_11_" />
    <path fill="#7B908C" d="M299.7 232.4h13v-39h-13v39zm2-37h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm31-36v39h13v-39h-13zm11 37h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1z"
    />
    <path fill="#E7FFCC" d="M247 194.5h22v37h-22z" id="Rectangle_92_32_" />
    <path fill="#7B908C" d="M269.7 230.4v-37h-24v37h-1v2h26v-2h-1zm-15-35h6v7h-6v-7zm0 8h6v6h-6v-6zm0 7h6v6h-6v-6zm0 7h6v6h-6v-6zm-1 13h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-7h6v7zm1 28v-6h6v6h-6zm13 0h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-7h6v7z"
    />
    <path fill="#EDBC80" d="M236 231.5h11v-37h-11v37zm33-37v37h11v-37h-11z" id="Rectangle_106_8_" />
    <path fill="#7B908C" d="M234.7 232.4h13v-39h-13v39zm2-37h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm31-36v39h13v-39h-13zm11 37h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1z"
    />
    <path fill="#E7FFCC" d="M182 274.5h22v37h-22z" id="Rectangle_92_29_" />
    <path fill="#7B908C" d="M204.7 310.4v-37h-24v37h-1v2h26v-2h-1zm-2-35v17h-20v-17h20zm-20 35v-17h20v17h-20z" />
    <path fill="#AD937F" d="M149 302.5h18v30h-18z" id="Rectangle_145_63_" />
    <path fill="#7B908C" d="M163.7 305.4h-12v24h12v-24zm-1 23h-10v-22h10v22zm-15-27v32h20v-32h-20zm18 30h-16v-28h16v28z" />
    <path fill="#AD937F" d="M282 322.5h77v10h-77z" id="Rectangle_145_60_" />
    <path fill="#7B908C" d="M280.7 321.4v12h79v-12h-79zm77 10h-75v-8h75v8z" />
    <path fill="#DDC9AC" d="M363 258.5v-4h-10v4h1v40h-1v4h10v-4h-1v-40z" id="Rectangle_77_64_" />
    <path fill="#7B908C" d="M359.2 294.5c.3 0 .5-.2.5-.5v-31c0-.3-.2-.5-.5-.5s-.5.2-.5.5v31c0 .3.2.5.5.5zm3.5-35.2c1-.3 1-1 1-1.7v-4.1h-12v4.1c0 .7 1 1.4 1 1.7v38.2h1.3c-1.1 0-2.3 1-2.3 2.1v3.9h12v-3.9c0-1.1-.6-2.1-1.7-2.1h.7v-38.2zm-1 40.1v2h-8v-2h8zm-1-38v34h-6v-34h6zm-6-1v-1h6v1h-6zm6 36v1h-6v-1h6zm1-39h-8v-2h8v2zm-5.5 37.1c.3 0 .5-.2.5-.5v-31c0-.3-.2-.5-.5-.5s-.5.2-.5.5v31c0 .3.2.5.5.5z"
    />
    <path fill="#DDC9AC" d="M298 258.5v-4h-10v4h1v60h-1v4h10v-4h-1v-60z" id="Rectangle_77_60_" />
    <path fill="#7B908C" d="M294.2 314.5c.3 0 .5-.2.5-.5v-51c0-.3-.2-.5-.5-.5s-.5.2-.5.5v51c0 .3.2.5.5.5zm3.5-55.2c1-.3 1-1 1-1.7v-4.1h-12v4.1c0 .7 1 1.4 1 1.7v58.2h1.3c-1.1 0-2.3 1-2.3 2.1v3.9h12v-3.9c0-1.1-.6-2.1-1.7-2.1h.7v-58.2zm-1 60.1v2h-8v-2h8zm-1-58v54h-6v-54h6zm-6-1v-1h6v1h-6zm6 56v1h-6v-1h6zm1-59h-8v-2h8v2zm-5.5 57.1c.3 0 .5-.2.5-.5v-51c0-.3-.2-.5-.5-.5s-.5.2-.5.5v51c0 .3.2.5.5.5z"
    />
    <path fill="#E7FFCC" d="M312 274.5h22v37h-22z" id="Rectangle_92_26_" />
    <path fill="#7B908C" d="M334.7 310.4v-37h-24v37h-1v2h26v-2h-1zm-2-35v17h-20v-17h20zm-20 35v-17h20v17h-20z" />
    <path fill="#AD937F" d="M349 302.5h18v30h-18z" id="Rectangle_145_57_" />
    <path fill="#7B908C" d="M363.7 305.4h-12v24h12v-24zm-1 23h-10v-22h10v22zm-15-27v32h20v-32h-20zm18 30h-16v-28h16v28z" />
    <path fill="#7B908C" d="M149 248.5h218v6H149z" id="Rectangle_145_54_" />
    <path fill="#7B908C" d="M147.7 247.4v8h220v-8h-220zm218 6h-216v-4h216v4z" />
    <path fill="#C9B189" d="M147 244.5h222v4H147z" id="Rectangle_145_51_" />
    <path fill="#7B908C" d="M145.7 243.4v6h224v-6h-224zm222 4h-220v-2h220v2z" />
    <path fill="#E7FFCC" d="M182 194.5h22v37h-22z" id="Rectangle_92_23_" />
    <path fill="#7B908C" d="M204.7 230.4v-37h-24v37h-1v2h26v-2h-1zm-15-35h6v7h-6v-7zm0 8h6v6h-6v-6zm0 7h6v6h-6v-6zm0 7h6v6h-6v-6zm-1 13h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-7h6v7zm1 28v-6h6v6h-6zm13 0h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-6h6v6zm0-7h-6v-7h6v7z"
    />
    <path fill="#EDBC80" d="M171 231.5h11v-37h-11v37zm33-37v37h11v-37h-11z" id="Rectangle_106_5_" />
    <path fill="#7B908C" d="M169.7 232.4h13v-39h-13v39zm2-37h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm0 2h9v1h-9v-1zm31-36v39h13v-39h-13zm11 37h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1zm0-2h-9v-1h9v1z"
    />
  </g>
  <g id="house2">
    <path fill="#C5EBAE" d="M399.9 254.3h194v78h-194z" id="Rectangle_145_105_" />
    <path fill="#7B908C" d="M398.9 253.3h196v80h-196z" id="Rectangle_145_102_" />
    <path id="bottom_1_" fill-rule="evenodd" clip-rule="evenodd" fill="#8AA29A" d="M400.9 255.3h192v76h-192z" />
    <path fill="#F1F9BB" d="M429.9 274.3h22v37h-22z" id="Rectangle_92_20_" />
    <path fill="#7B908C" d="M452.7 310.4v-37h-24v37h-1v2h26v-2h-1zm-2-35v17h-20v-17h20zm-20 35v-17h20v17h-20z" />
    <path fill="#F1F9BB" d="M549.9 274.3h15v17h-15z" id="Rectangle_96_10_" />
    <path fill="#7B908C" d="M565.7 290.4v-17h-17v17h-1v2h19v-2h-1zm-2-15v7h-13v-7h13zm-13 15v-7h13v7h-13z" />
    <path fill="#C9B189" d="M487.9 274.3h28v48h-28z" id="Rectangle_83_21_" />
    <path fill="#F1F9BB" d="M492.7 277.4h17.7v17.3h-17.7z" />
    <path fill="#7B908C" d="M502.7 319.4h8v-18h-8v18zm1-17h6v16h-6v-16zm-11-7h18v-18h-18v18zm13-17h4v5h-4v-5zm0 6h4v10h-4v-10zm-7-6h6v5h-6v-5zm0 6h6v10h-6v-10zm-5-6h4v5h-4v-5zm0 6h4v10h-4v-10zm-7-11v50h30v-50h-30zm28 48h-26v-46h26v46zm-4.8-23.5c0 .8.7 1.5 1.5 1.5h1c.8 0 1.5-.7 1.5-1.5s-.7-1.5-1.5-1.5h-1c-.8 0-1.5.7-1.5 1.5zm.8-.5h2v1h-2v-1zm-10 4h-8v18h8v-18zm-1 17h-6v-16h6v16z"
    />
    <path fill="#C5EBAE" d="M477.9 322.3h48v9h-48z" id="Rectangle_86_9_" />
    <path fill="#7B908C" d="M476.7 321.4v12h50v-12h-50zm48 10h-46v-8h46v8z" />
    <path fill="#7B908C" d="M526.9 333.4h-7.2v-3c-2-1.8-3-4.3-3-7.1v-1.8h-30v1.8c0 2.8-1 5.3-3 7.1v3h-6.8 50zm-38-10h26v1h-26.1c.1 0 .1-1 .1-1zm-.2 2h26.4c.1 0 .1 1 .2 1h-26.8c.1 0 .2-1 .2-1zm-.5 2h27.4c.1 0 .3 1 .4 1h-28.2c.2 0 .3-1 .4-1zm-2.3 4c.5-1 1-1 1.4-2h29.3c.4 1 .9 1 1.4 2h-32.1z"
    />
    <path fill="#96D8C2" d="M475.9 258.3v-4h-8v4h1v60h-1v4h8v-4h-1v-60z" id="Rectangle_77_62_" />
    <path fill="#7B908C" d="M475.7 259c1-.3 1-1 1-1.7v-3.8h-10v3.8c0 .7 1 1.4 1 1.7v58.4h1.2c-1.1 0-2.2.7-2.2 1.8v4.2h10v-4.2c0-1.1-.7-1.8-1.8-1.8h.8V259zm-6 57.4h4v1h-4v-1zm4-56h-4v-1h4v1zm0 1v54h-4v-54h4zm1 60h-6v-2h6v2zm0-64h-6v-2h6v2z" />
    <path fill="#96D8C2" d="M415.9 322.3h62v10h-62z" id="Rectangle_145_99_" />
    <path fill="#7B908C" d="M414.7 321.4v12h64v-12h-64zm62 10h-60v-8h60v8z" />
    <path fill="#C9B189" d="M397.9 302.3h18v30h-18z" id="Rectangle_145_93_" />
    <path fill="#7B908C" d="M412.7 305.4h-12v24h12v-24zm-1 23h-10v-22h10v22zm-15-27v32h20v-32h-20zm18 30h-16v-28h16v28z" />
    <path fill="#96D8C2" d="M397.9 299.3v3h8v-3h-8zm2 0h4v-42h1v-3h-6v3h1v42z" id="Rectangle_77_59_" />
    <path fill="#7B908C" d="M405.7 256.3v-2.8h-8v2.8c0 .7 1 1.4 1 1.7v40.6c0 .3-1 1-1 1.7v3.2h8v-3.2c0-.7 0-1.4-1-1.7V258c1-.3 1-1 1-1.7zm-2 45.1h-4v-1h4v1zm-3-3v-40h2v40h-2zm3-42h-4v-1h4v1z" />
    <path fill="#96D8C2" d="M407.9 299.3v3h8v-3h-8zm2 0h4v-42h1v-3h-6v3h1v42z" id="Rectangle_77_56_" />
    <path fill="#AD937F" d="M567.9 194.3v4h1v46h16v-46h1v-4z" id="Rectangle_157_2_" />
    <path fill="#99C0A2" d="M567.9 205.3h-142l-31 39h204z" id="roof_1_" />
    <path fill="#7B908C" d="M598.9 243.4l-30-39h-144l-30 39h-1.2v2h206v-2h-.8zm-201.5 0l28.5-37h142l28.5 37h-199zM415.7 256.3v-2.8h-8v2.8c0 .7 1 1.4 1 1.7v40.6c0 .3-1 1-1 1.7v3.2h8v-3.2c0-.7 0-1.4-1-1.7V258c1-.3 1-1 1-1.7zm-2 45.1h-4v-1h4v1zm-3-3v-40h2v40h-2zm3-42h-4v-1h4v1z"
    />
    <path fill="#96D8C2" d="M525.9 322.3h62v10h-62z" id="Rectangle_145_87_" />
    <path fill="#7B908C" d="M524.7 321.4v12h64v-12h-64zm62 10h-60v-8h60v8z" />
    <path fill="#C9B189" d="M577.9 302.3h18v30h-18z" id="Rectangle_145_81_" />
    <path fill="#7B908C" d="M576.7 301.4v32h20v-32h-20zm18 30h-16v-28h16v28zm-2-26h-12v24h12v-24zm-1 23h-10v-22h10v22z" />
    <path fill="#96D8C2" d="M587.9 299.3v3h8v-3h-8zm2 0h4v-42h1v-3h-6v3h1v42z" id="Rectangle_77_53_" />
    <path fill="#7B908C" d="M595.7 256.3v-2.8h-8v2.8c0 .7 1 1.4 1 1.7v40.6c0 .3-1 1-1 1.7v3.2h8v-3.2c0-.7 0-1.4-1-1.7V258c1-.3 1-1 1-1.7zm-2 45.1h-4v-1h4v1zm-3-3v-40h2v40h-2zm3-42h-4v-1h4v1z" />
    <path fill="#96D8C2" d="M577.9 299.3v3h8v-3h-8zm2 0h4v-42h1v-3h-6v3h1v42z" id="Rectangle_77_48_" />
    <path fill="#7B908C" d="M585.7 256.3v-2.8h-8v2.8c0 .7 1 1.4 1 1.7v40.6c0 .3-1 1-1 1.7v3.2h8v-3.2c0-.7 0-1.4-1-1.7V258c1-.3 1-1 1-1.7zm-2 45.1h-4v-1h4v1zm-3-3v-40h2v40h-2zm3-42h-4v-1h4v1z" />
    <path fill="#96D8C2" d="M535.9 258.3v-4h-8v4h1v60h-1v4h8v-4h-1v-60z" id="Rectangle_77_42_" />
    <path fill="#7B908C" d="M535.7 259c1-.3 1-1 1-1.7v-3.8h-10v3.8c0 .7 1 1.4 1 1.7v58.4h1.2c-1.1 0-2.2.7-2.2 1.8v4.2h10v-4.2c0-1.1-.7-1.8-1.8-1.8h.8V259zm-2 1.4h-4v-1h4v1zm0 1v54h-4v-54h4zm-4 55h4v1h-4v-1zm5 3v2h-6v-2h6zm0-62h-6v-2h6v2z" />
    <path fill="#EDBC80" d="M397.9 248.3h198v6h-198z" id="Rectangle_145_75_" />
    <path fill="#7B908C" d="M396.7 247.4v8h200v-8h-200zm198 6h-196v-4h196v4z" />
    <path fill="#C68B7B" d="M395.9 244.3h202v4h-202z" id="Rectangle_145_69_" />
    <path fill="#7B908C" d="M394.7 243.4v6h204v-6h-204zm202 4h-200v-2h200v2z" />
    <path fill="none" d="M569.7 235.4h4v2h-4zM569.7 232.4h1v2h-1zM571.7 234.4h4v-2h-4zM576.7 222.4h4v-2h-4zM569.7 238.4h1v2h-1zM574.7 217.4h4v2h-4zM569.7 241.4h4v2h-4zM571.7 240.4h4v-2h-4zM571.7 222.4h4v-2h-4zM569.7 217.4h4v2h-4zM569.7 220.4h1v2h-1zM574.7 211.4h4v2h-4zM571.7 228.4h4v-2h-4zM569.7 223.4h4v2h-4zM569.7 226.4h1v2h-1zM576.7 210.4h4v-2h-4zM569.7 229.4h4v2h-4zM581.7 226.4h2v2h-2zM581.7 220.4h2v2h-2zM579.7 223.4h4v2h-4zM581.7 232.4h2v2h-2zM574.7 223.4h4v2h-4zM579.7 235.4h4v2h-4zM579.7 241.4h4v2h-4zM581.7 238.4h2v2h-2zM579.7 229.4h4v2h-4zM574.7 229.4h4v2h-4zM579.7 217.4h4v2h-4zM576.7 234.4h4v-2h-4zM576.7 228.4h4v-2h-4zM574.7 241.4h4v2h-4zM574.7 235.4h4v2h-4zM576.7 240.4h4v-2h-4zM581.7 202.4h2v2h-2zM581.7 214.4h2v2h-2zM579.7 205.4h4v2h-4zM581.7 208.4h2v2h-2zM569.7 214.4h1v2h-1zM573.7 214.4h-2v2h4v-2zM578.7 214.4h-2v2h4v-2zM579.7 211.4h4v2h-4zM573.7 201.4v-1.9l-4-.1v2zM583 199.7l-3.3-.1v1.8h4v-2h-4v.2zM568.7 195.4h16v2h-16zM573.7 199.4h-4l4 .1zM578.7 199.6v-.2h-4v.1z"
    />
    <path fill="none" d="M578.7 201.4v-1.8l-4-.1v1.9zM571.7 204.4h4v-2h-4zM569.7 208.4h1v2h-1zM574.7 205.4h4v2h-4zM571.7 210.4h4v-2h-4zM569.7 211.4h4v2h-4zM569.7 205.4h4v2h-4zM576.7 204.4h4v-2h-4zM569.7 202.4h1v2h-1z" />
    <path fill="#7B908C" d="M574.7 199.5v-.1h-1v.1zM579.7 199.6v-.2h-1v.2z" />
    <path fill="none" d="M583.7 200.8c0-.2.1-1.3 0-1.4-.2-.1-1.1 0-1.3 0h-8.6c-.8 0-3.7-.4-4 .2-.3.6 0 2.4 0 3v4.5l14.1 16.9v-1.1c-.2-7.3-.2-14.7-.2-22.1zM584 195.4h-13.8c-.6 0-1.3-.2-1.5.3-.1.1-.1 1.6 0 1.7.1.1.5 0 .6 0 2.9.3 5.9 0 8.8 0h6.6c0-.3.2-1.8 0-2h-.7z"
    />
    <path fill="#7B908C" d="M585.7 225.5v-16.6-6.1c0-.7-.3-2.5 0-3.1.2-.4.7.1 1-.2.3-.3 0-2.5 0-3s.3-2.6 0-3c-.1-.1-.8 0-1 0h-19v2.9c0 .5-.3 2.7 0 3.1.2.2.8-.1 1 .2.1.2 0 .8 0 1.1v4.2l1.9 2.3v-4.5c0-.7-.3-2.5 0-3 .3-.6 3.2-.2 4-.2h8.6c.2 0 1.1-.1 1.3 0 .2.1 0 1.1 0 1.4V224.2l2 2.4c.2-.4.2-.8.2-1.1zm-1-28.1h-6.6c-2.9 0-5.9.3-8.8 0-.1 0-.5.1-.6 0-.1-.1-.1-1.6 0-1.7.2-.5.9-.3 1.5-.3H584c.1 0 .6-.1.7 0 .2.3 0 1.7 0 2z"
    />
  </g>
  <g id="house3">
    <path fill="#8AA29A" d="M692.4 133.7l-20 39h191v-39z" id="roof_2_" />
    <path fill="#7B908C" d="M864.7 171.4v-39H692.4l-20 39h-.7v2h194v-2h-1zm-2 0H674.6l19-37h169.1v37z" />
    <path fill="#C9B189" d="M673.4 172.7h229v150h-229z" id="bottom_2_" />
    <path fill="#7B908C" d="M672.7 171.4v152h231v-152h-231zm229 150h-227v-148h227v148z" />
    <path fill="#E7FFCC" d="M719.4 194.7h15v17h-15z" id="Rectangle_96_8_" />
    <path fill="#7B908C" d="M735.7 210.4v-17h-17v17h-1v2h19v-2h-1zm-2-15v7h-6v-7h6zm-7 0v7h-6v-7h6zm-6 15v-7h13v7h-13z" />
    <path fill="#EDBC80" d="M711.4 211.7h8v-17h-8v17zm23-17v17h8v-17h-8z" id="Rectangle_94_6_" />
    <path fill="#7B908C" d="M710.7 212.4h10v-19h-10v19zm2-17h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm21-16v19h10v-19h-10zm8 17h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1z"
    />
    <path fill="#E7FFCC" d="M789.4 194.7h15v17h-15z" id="Rectangle_96_5_" />
    <path fill="#7B908C" d="M805.7 210.4v-17h-17v17h-1v2h19v-2h-1zm-2-15v7h-6v-7h6zm-7 0v7h-6v-7h6zm-6 15v-7h13v7h-13z" />
    <path fill="#EDBC80" d="M781.4 211.7h8v-17h-8v17zm23-17v17h8v-17h-8z" id="Rectangle_94_4_" />
    <path fill="#7B908C" d="M803.7 193.4v19h10v-19h-10zm8 17h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm0-2h-6v-1h6v1zm-31 16h10v-19h-10v19zm2-17h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1zm0 2h6v1h-6v-1z"
    />
    <path fill="#96D8C2" d="M783.4 274.7h28v48h-28z" id="Rectangle_83_17_" />
    <path fill="#E7FFCC" d="M788.7 277.4h18v17.5h-18z" />
    <path fill="#7B908C" d="M798.7 319.4h8v-18h-8v18zm1-17h6v16h-6v-16zm-11-7h18v-18h-18v18zm13-17h4v5h-4v-5zm0 6h4v10h-4v-10zm-7-6h6v5h-6v-5zm0 6h6v10h-6v-10zm-5-6h4v5h-4v-5zm0 6h4v10h-4v-10zm-7-11v50h30v-50h-30zm28 48h-26v-46h26v46zm-14-20h-8v18h8v-18zm-1 17h-6v-16h6v16zm9.7-20.5c0 .8.7 1.5 1.5 1.5h1c.8 0 1.5-.7 1.5-1.5s-.7-1.5-1.5-1.5h-1c-.9 0-1.5.7-1.5 1.5zm1.3-.5h2v1h-2v-1z"
    />
    <path fill="#8AA29A" d="M613.4 322.7h289v10h-289z" id="Rectangle_145_29_" />
    <path fill="#7B908C" d="M612.7 321.4v12h291v-12h-291zm289 10h-287v-8h287v8z" />
    <path fill="#BC9275" d="M613.4 261.7h228v3h-228z" id="Rectangle_145_26_" />
    <path fill="#7B908C" d="M612.7 260.4v5h230v-5h-230zm228 3h-226v-1h226v1z" />
    <path fill="#EDBC80" d="M673.4 172.7h150v3h-150z" id="Rectangle_145_23_" />
    <path fill="#7B908C" d="M672.7 171.4v5h152v-5h-152zm150 3h-148v-1h148v1z" />
    <path fill="#EDBC80" d="M783.4 322.7h28v9h-28z" id="Rectangle_86_5_" />
    <path fill="#7B908C" d="M782.7 321.4v12h30v-12h-30zm4 10h-2v-8h2v8zm20 0h-18v-2h18v2zm0-3h-18v-1h18v1zm0-2h-18v-1h18v1zm0-2h-18v-1h18v1zm4 7h-2v-8h2v8z" />
    <path fill="#B792A1" d="M823.4 319.7v3h8v-3h-8zm2 0h4v-52h1v-3h-6v3h1v52z" id="Rectangle_77_41_" />
    <path fill="#7B908C" d="M831.7 266.7v-3.2h-8v3.2c0 .7 0 1.4 1 1.7V319c-1 .3-1 1-1 1.7v2.8h8v-2.8c0-.7-1-1.4-1-1.7v-50.6c0-.4 1-1 1-1.7zm-2 54.7h-4v-1h4v1zm-3-3v-50h2v50h-2zm3-52h-4v-1h4v1z" />
    <path fill="#B792A1" d="M833.4 319.7v3h8v-3h-8zm2 0h4v-52h1v-3h-6v3h1v52z" id="Rectangle_77_38_" />
    <path fill="#7B908C" d="M841.7 266.7v-3.2h-8v3.2c0 .7 0 1.4 1 1.7V319c-1 .3-1 1-1 1.7v2.8h8v-2.8c0-.7-1-1.4-1-1.7v-50.6c0-.4 1-1 1-1.7zm-2 54.7h-4v-1h4v1zm-3-3v-50h2v50h-2zm3-52h-4v-1h4v1z" />
    <path fill="#B792A1" d="M753.4 319.7v3h8v-3h-8zm2 0h4v-52h1v-3h-6v3h1v52z" id="Rectangle_77_35_" />
    <path fill="#7B908C" d="M761.7 266.7v-3.2h-8v3.2c0 .7 0 1.4 1 1.7V319c-1 .3-1 1-1 1.7v2.8h8v-2.8c0-.7-1-1.4-1-1.7v-50.6c0-.4 1-1 1-1.7zm-2 54.7h-4v-1h4v1zm-3-3v-50h2v50h-2zm3-52h-4v-1h4v1z" />
    <path fill="#B792A1" d="M763.4 319.7v3h8v-3h-8zm2 0h4v-52h1v-3h-6v3h1v52z" id="Rectangle_77_32_" />
    <path fill="#7B908C" d="M771.7 266.7v-3.2h-8v3.2c0 .7 0 1.4 1 1.7V319c-1 .3-1 1-1 1.7v2.8h8v-2.8c0-.7-1-1.4-1-1.7v-50.6c0-.4 1-1 1-1.7zm-2 54.7h-4v-1h4v1zm-3-3v-50h2v50h-2zm3-52h-4v-1h4v1z" />
    <path fill="#B792A1" d="M683.4 319.7v3h8v-3h-8zm2 0h4v-52h1v-3h-6v3h1v52z" id="Rectangle_77_28_" />
    <path fill="#7B908C" d="M691.7 266.7v-3.2h-8v3.2c0 .7 0 1.4 1 1.7V319c-1 .3-1 1-1 1.7v2.8h8v-2.8c0-.7-1-1.4-1-1.7v-50.6c0-.4 1-1 1-1.7zm-2 54.7h-4v-1h4v1zm-3-3v-50h2v50h-2zm3-52h-4v-1h4v1z" />
    <path fill="#B792A1" d="M693.4 319.7v3h8v-3h-8zm2 0h4v-52h1v-3h-6v3h1v52z" id="Rectangle_77_25_" />
    <path fill="#7B908C" d="M701.7 266.7v-3.2h-8v3.2c0 .7 0 1.4 1 1.7V319c-1 .3-1 1-1 1.7v2.8h8v-2.8c0-.7-1-1.4-1-1.7v-50.6c0-.4 1-1 1-1.7zm-2 54.7h-4v-1h4v1zm-3-3v-50h2v50h-2zm3-52h-4v-1h4v1z" />
    <path fill="#B792A1" d="M613.4 319.7v3h8v-3h-8zm2 0h4v-52h1v-3h-6v3h1v52z" id="Rectangle_77_22_" />
    <path fill="#7B908C" d="M621.7 266.7v-3.2h-8v3.2c0 .7 0 1.4 1 1.7V319c-1 .3-1 1-1 1.7v2.8h8v-2.8c0-.7-1-1.4-1-1.7v-50.6c0-.4 1-1 1-1.7zm-2 54.7h-4v-1h4v1zm-3-3v-50h2v50h-2zm3-52h-4v-1h4v1z" />
    <path fill="#B792A1" d="M623.4 319.7v3h8v-3h-8zm2 0h4v-52h1v-3h-6v3h1v52z" id="Rectangle_77_20_" />
    <path fill="#7B908C" d="M631.7 266.7v-3.2h-8v3.2c0 .7 0 1.4 1 1.7V319c-1 .3-1 1-1 1.7v2.8h8v-2.8c0-.7-1-1.4-1-1.7v-50.6c0-.4 1-1 1-1.7zm-2 54.7h-4v-1h4v1zm-3-3v-50h2v50h-2zm3-52h-4v-1h4v1z" />
    <path fill="#E7FFCC" d="M712.4 274.7h29v27h-29z" id="Rectangle_92_16_" />
    <path fill="#7B908C" d="M742.7 300.4v-27h-31v27h-1v2h33v-2h-1zm-29-25h13v25h-13v-25zm27 25h-13v-25h13v25z" />
    <path fill="#E7FFCC" d="M852.4 274.7h29v27h-29z" id="Rectangle_92_13_" />
    <path fill="#7B908C" d="M882.7 300.4v-27h-31v27h-1v2h33v-2h-1zm-29-25h13v25h-13v-25zm27 25h-13v-25h13v25z" />
    <path fill="#CEB48E" d="M868.4 124.6l-45 45.1v5.9h1v.1h9v-.1 79h69v-79h11v-6z" id="side" />
    <path fill="#7B908C" d="M914.7 169.6l-46-46-46 46v6.8h10v79h71v-79h11v-6.8zm-13 83.8h-67v-85.8l34-34 33 33v86.8zm11-79h-9v-8.8l-35-35-36 36v7.8h-8v-3.9l44-44 44 44v3.9z" />
    <path fill="#E7FFCC" d="M852.4 194.7h29v27h-29z" id="Rectangle_92_10_" />
    <path fill="#7B908C" d="M882.7 220.4v-27h-31v27h-1v2h33v-2h-1zm-29-25h13v25h-13v-25zm27 25h-13v-25h13v25z" />
    <path fill="#C68B7B" d="M833.4 254.7v-22h-161l-60 29h229v-7z" id="porch-roof" />
    <path fill="#7B908C" d="M842.7 260.4v-7h-8v-22H672.4l-60 29h-.7v2h232v-2h-1zm-2 0H617l55.9-27h159.9v22h8v5z" />
    <path fill="#EDBC80" d="M711.4 269.7l1 5h29l1-5z" id="Rectangle_83_14_" />
    <path fill="#7B908C" d="M728.4 268.4h-19.1l2 7h31l2-7h-15.9zm.9 5h-4.8l.9-3h3.1l.8 3zm-16.9-3h10.8l-.7 2.5c-.1.2-.1.5-.1.5h-9l-1-3zm28 3h-9s0-.4-.1-.5l-.7-2.5h10.8l-1 3z" />
    <path fill="#EDBC80" d="M851.4 269.7l1 5h29l1-5z" id="Rectangle_83_11_" />
    <path fill="#7B908C" d="M868.4 268.4h-19.1l2 7h31l2-7h-15.9zm.9 5h-4.8l.9-3h3.1l.8 3zm-16.9-3h10.8l-.7 2.5c-.1.2-.1.5-.1.5h-9l-1-3zm28 3h-9s0-.4-.1-.5l-.7-2.5h10.8l-1 3z" />
    <path fill="#EDBC80" d="M851.4 189.7l1 5h29l1-5z" id="Rectangle_83_8_" />
    <path fill="#7B908C" d="M868.4 188.4h-19.1l2 7h31l2-7h-15.9zm.9 5h-4.8l.9-3h3.1l.8 3zm-16.9-3h10.8l-.7 2.5c-.1.2-.1.5-.1.5h-9l-1-3zm28 3h-9s0-.4-.1-.5l-.7-2.5h10.8l-1 3z" />
  </g>
    </g><!--city-->
    <g class="extras">
  <g id="tree">
    <g id="fence">
      <path fill="#EDBC80" d="M906.7 308.4v24h6v-24l-3-4-3 4zm10 0v24h6v-24l-3-4-3 4zm13-4l-3 4v24h6v-24l-3-4z" />
      <path fill="#7B908C" d="M934.7 313.4v-1h-1v-5l-4-4-4 4v5h-2v-5l-4-4-4 4v5h-2v-5l-4-4-4 4v5h-1v1h1v1h-1v1h1v7h-1v1h1v1h-1v1h1v8h8v-8h2v8h8v-8h2v8h8v-8h1v-1h-1v-1h1v-1h-1v-7h1v-1h-1v-1h1zm-9 0v1h-2v-1h2zm0 2v7h-2v-7h2zm-10-2v1h-2v-1h2zm0 2v7h-2v-7h2zm-4 16h-4v-23.2l2-2 2 2v23.2zm2-7v-1h2v1h-2zm8 7h-4v-23.2l2-2 2 2v23.2zm2-7v-1h2v1h-2zm8 7h-4v-23.2l2-2 2 2v23.2z"
      />
    </g>
    <g id="tree_1_">
      <path fill="#AD937F" d="M381.7 274.4h6v58h-6z" />
      <path fill="#7B908C" d="M388.7 289v-14.6h-2v57h-4v-57h-2v22.8l-9-5.1v2.2l9 5.2v33.9h8v-41.9l10-6V283z" />
      <path fill="#9DDCA0" d="M428.6 246.3c2.2-2.1 3.7-5 3.7-8.3 0-4-2.1-7.5-5.2-9.5.1-.6.1-1.2.1-1.8 0-9.1-7.4-16.5-16.5-16.5-1.7 0-3.4.3-5 .8-1.7-4.1-5.7-6.9-10.4-6.9-3.8 0-7.1 1.9-9.2 4.7-3.7-2.9-8.4-4.7-13.4-4.7-10.6 0-19.3 7.6-21.2 17.6-7.2.8-12.7 6.9-12.7 14.3 0 1.7.3 3.3.8 4.8-2.4 2.1-3.9 5.1-3.9 8.6 0 4.9 3.1 9 7.4 10.6 1.2 9.1 8.9 16.1 18.3 16.1 4.1 0 7.9-1.3 10.9-3.6 2.3 2.8 5.7 4.6 9.6 4.6 4.8 0 8.9-2.7 11-6.7 2.1 1.6 4.7 2.6 7.5 2.6 3.5 0 6.7-1.5 9-3.9 2.6 2.4 6.2 3.9 10 3.9 8.2 0 14.9-6.7 14.9-14.9 0-4.8-2.2-9.1-5.7-11.8zm-12.2 33.9c-.7-1.3-2-2.1-3.5-2.1-1.3 0-2.5.7-3.3 1.7-.4-.2-.9-.4-1.4-.5-.9-1.1-2.5-1.5-3.7-.8-.5-.2-1.1-.3-1.6-.3-1.9 0-3.4 1.3-3.9 3.1-2.2-.1-4.1 1.8-4.1 4.1 0 1.5.8 2.9 2 3.6v.5c0 1.7 1.3 3.1 3 3.1.7 0 1.3-.2 1.8-.7 1.5 1 3.5.8 4.8-.4h.4c1.8 1.3 4.3 1.3 6 0 .6.7 1.5 1.1 2.5 1.1 1.8 0 3.2-1.3 3.5-3.1 1.3-1 2-2.5 2-4.1 0-2.8-1.9-5-4.5-5.2zm-44.5 7.4c-.4 0-.8.1-1.2.2v-.2c0-1.9-1.6-3.5-3.5-3.5-.7 0-1.4.2-2 .6-.4-.4-.9-.6-1.5-.6-.9 0-1.7.5-2.1 1.3-2.2.3-3.9 1.9-4.6 3.9-1.6.8-2.7 2.3-2.7 4.2 0 2.6 2.1 4.7 4.7 4.7 1.2 0 2.3-.5 3.1-1.2h.4c.3 0 .6 0 .8-.1.6.8 1.6 1.3 2.7 1.3s2-.5 2.6-1.2c.4.7 1.2 1.2 2 1.2 1.3 0 2.3-1 2.3-2.3 0-.5-.1-.9-.4-1.3 1.6-.4 2.7-1.7 2.7-3.4.2-2.1-1.3-3.6-3.3-3.6zm-3.5 3.5v-.2c.1 0 0 .1 0 .2z"
      />
      <path fill="#7B908C" d="M366.1 288.2l-1.7.6c-.3.1-.5.5-.5.8.1.3.4.5.7.4l1.7-.6c.6-.2 1.1.1 1.2.7l.3 1.6c0 .2.1.3.2.3.1.1.3.1.4 0 .3-.1.5-.5.5-.8l-.3-1.6c-.1-1.2-1.3-1.8-2.5-1.4zm48.9-4.8l-.7 1.7c-.2.6-.8.8-1.3.4l-1.3-1c-.1-.1-.3-.1-.4-.1-.1 0-.2.1-.3.3-.1.3 0 .7.2.9l1.3 1c.9.8 2.1.4 2.7-.9l.7-1.7c.1-.3 0-.7-.2-.9-.3-.1-.6 0-.7.3zm15.2-37.4c1.8-2.3 2.7-5.1 2.7-7.9 0-4-1.9-7.8-5-10.2v-.8c0-9.9-8.1-18-18-18-1.3 0-2.5.1-3.8.4-2.3-3.9-6.5-6.4-11.2-6.4-3.5 0-6.8 1.4-9.2 3.9-3.8-2.5-8.2-3.9-12.8-3.9-10.6 0-19.7 7.2-22.3 17.3-7.3 1.5-12.7 8-12.7 15.7 0 1.4.2 2.7.5 4.1-2.3 2.4-3.5 5.6-3.5 8.9 0 5 2.9 9.6 7.4 11.7 1.8 9.4 10 16.3 19.6 16.3 3.7 0 7.2-1 10.3-2.9 2.6 2.5 6 3.9 9.7 3.9 4.5 0 8.7-2.1 11.3-5.7 2.1 1.1 4.3 1.7 6.7 1.7 3.3 0 6.3-1.1 8.8-3.1 2.8 2 6.2 3.2 9.7 3.2 9.1 0 16.5-7.4 16.5-16.5 0-4.5-1.7-8.6-4.7-11.7zm-11.7 26.1c-3.8 0-7.2-1.5-9.8-3.8-2.2 2.3-5.3 3.8-8.7 3.8-2.8 0-5.3-.9-7.3-2.5-2 3.9-6 6.5-10.7 6.5-3.8 0-7.2-1.8-9.4-4.5-3 2.2-6.7 3.5-10.6 3.5-9.2 0-16.7-6.8-17.8-15.7-4.2-1.6-7.2-5.6-7.2-10.3 0-3.3 1.5-6.3 3.8-8.3-.5-1.5-.8-3-.8-4.7 0-7.2 5.4-13.1 12.4-13.9 1.8-9.7 10.4-17.1 20.6-17.1 4.9 0 9.5 1.7 13.1 4.6 2-2.8 5.2-4.6 8.9-4.6 4.6 0 8.5 2.8 10.1 6.8 1.5-.5 3.2-.8 4.9-.8 8.8 0 16 7.2 16 16 0 .6 0 1.2-.1 1.7 3.1 2 5.1 5.4 5.1 9.3 0 3.2-1.4 6.1-3.6 8.1 3.4 2.7 5.6 6.8 5.6 11.4-.1 8-6.5 14.5-14.5 14.5zM403.4 234c.1 0 .3-.1.4-.2.2-.2.2-.6 0-.9l-1-1.2c-.7-.9-2-.9-2.7 0l-1 1.2c-.2.2-.2.6 0 .9.2.2.5.2.7 0l1-1.2c.3-.4.9-.4 1.3 0l1 1.2c.1.2.2.2.3.2zm-52.6-.1l1-1.2c.3-.4.9-.4 1.3 0l1 1.2c.1.1.2.2.4.2.1 0 .3-.1.4-.2.2-.2.2-.6 0-.9l-1-1.2c-.7-.9-2-.9-2.7 0l-1 1.2c-.2.2-.2.6 0 .9.1.2.4.2.6 0zm22.1-17.2l.8-1.7c.3-.6.9-.8 1.3-.5l1.2.9c.1.1.3.1.4.1.1 0 .2-.2.3-.3.2-.3.1-.7-.2-.9l-1.2-.9c-.9-.7-2.1-.2-2.7 1l-.8 1.6c-.2.3-.1.7.2.9.2.3.5.1.7-.2zm51.6 42.7c-.9-.7-2.1-.2-2.7 1l-.8 1.6c-.2.3-.1.7.2.9.2.2.5.1.7-.3l.8-1.7c.3-.6.9-.8 1.3-.5l1.2.9c.1.1.3.1.4.1.1 0 .2-.2.3-.3.2-.3.1-.7-.2-.9l-1.2-.8zm-9.1-39.1l-1.6-.3c-.3-.1-.7.1-.8.3-.1.2.1.5.4.5l1.6.3c.6.1.9.6.7 1l-.5 1.3c-.1.1 0 .2 0 .3.1.1.2.2.4.2.3.1.7-.1.8-.3l.5-1.3c.3-.8-.3-1.7-1.5-2zM384.3 266l-1.7.7c-.6.2-1.2-.1-1.2-.6l-.2-1.6c0-.2-.1-.3-.2-.3-.1-.1-.3-.1-.4 0-.3.1-.6.5-.5.8l.2 1.6c.1 1.2 1.3 1.8 2.6 1.3l1.7-.7c.3-.1.6-.5.5-.8-.2-.4-.5-.5-.8-.4zm-19.7-20.9l-1.7-.7c-.6-.2-.8-.8-.4-1.3l1-1.3c.1-.1.1-.3.1-.4 0-.1-.1-.2-.3-.3-.3-.1-.8-.1-.9.2l-1 1.3c-.8 1-.4 2.2.9 2.7l1.7.7c.3.1.8.1.9-.2.2-.3.1-.6-.3-.7zm43.5 1.9l1.7-.6c1.3-.4 1.5-1.6.6-2.7l-1.2-1.4c-.2-.3-.7-.4-1-.3-.3.1-.4.4-.2.7l1.2 1.4c.4.5.3 1.1-.3 1.3l-1.7.6c-.2.1-.3.2-.3.3 0 .1 0 .3.1.4.3.3.8.4 1.1.3zm-27.4-13l1.4-1.2c.5-.4 1.1-.3 1.3.3l.6 1.7c.1.2.2.3.3.3.1 0 .3 0 .4-.1.3-.2.4-.7.3-1l-.6-1.7c-.4-1.3-1.6-1.5-2.7-.6l-1.4 1.2c-.3.2-.4.7-.3 1 .1.2.4.3.7.1zm-18.4 30.2c-.4-1.3-1.6-1.5-2.7-.6l-1.4 1.2c-.3.2-.4.7-.3 1 .1.3.4.4.7.2l1.4-1.2c.5-.4 1.1-.3 1.3.3l.6 1.7c.1.2.2.3.3.3.1 0 .3 0 .4-.1.3-.2.4-.7.3-1l-.6-1.8zm13.6-13.8l-.6 1.7c-.2.6-.8.7-1.3.4l-1.4-1.1c-.1-.1-.3-.1-.4-.1-.1 0-.2.1-.3.3-.1.3 0 .8.3 1l1.4 1.1c1 .8 2.2.5 2.7-.7l.6-1.7c.1-.3 0-.8-.3-1-.2-.3-.5-.2-.7.1zm24.2-29.9c.2.2.5.2.7 0 .2-.2.2-.6 0-.8l-1-1.1c-.3-.4-.7-.5-1.2-.5-.6.1-1.2.6-1.6 1.3-.3.6-.8.6-1.1 0-.4-.8-1-1.3-1.6-1.3-.4-.1-.9.1-1.2.5l-1 1.1c-.2.2-.2.6 0 .8.2.2.5.2.7 0l1-1.1c.1-.1.2-.2.4-.1.2 0 .6.3.9.8.4.7.9 1.1 1.4 1.1.6 0 1.1-.4 1.4-1.1.3-.5.6-.8.9-.8.1 0 .3 0 .4.1l.9 1.1zm-3.9 30c-.2-.5-.6-.8-1.1-.9-.6-.1-1.3.3-1.9 1-.5.6-1 .5-1.1-.4-.2-1-.7-1.7-1.2-2-.4-.2-.9-.2-1.3.2l-1.3 1c-.2.2-.3.6-.2.9.1.3.5.4.7.2l1.3-1c.1-.1.3-.1.4 0 .2.1.5.5.6 1.2.2.9.6 1.5 1.1 1.6.5.2 1.2-.1 1.7-.7.4-.5.8-.7 1.1-.6.1 0 .3.1.3.3l.7 1.6c.1.3.5.4.7.2.3-.2.3-.6.2-.9l-.7-1.7zm-25.8-27.4l-1.6-.1c-.5 0-.9.2-1.2.5-.4.5-.4 1.3-.2 2.1.2.7-.1 1.1-.8.8-.8-.3-1.6-.2-2.1.2-.4.3-.6.7-.5 1.2l.1 1.6c0 .3.3.6.6.6s.5-.2.5-.5l-.1-1.6c0-.2 0-.3.2-.4.2-.1.6-.2 1.2 0 .7.2 1.4.1 1.8-.3.4-.4.5-1.1.3-1.8-.2-.6-.1-1 0-1.2.1-.1.2-.2.4-.2l1.6.1c.3 0 .5-.2.5-.5-.2-.2-.4-.4-.7-.5zm-16.1 30.2l-1.4.5c-.1.1-.3 0-.4-.1-.2-.2-.4-.5-.3-1.2 0-.8-.2-1.4-.7-1.7-.5-.3-1.1-.2-1.8.2-.5.3-.9.4-1.1.3-.1-.1-.2-.2-.2-.3l-.3-1.6c-.1-.3-.3-.5-.6-.4-.3.1-.5.4-.4.7l.3 1.6c.1.5.4.9.8 1.1.6.2 1.3.1 2.1-.4.6-.4 1-.2 1 .6 0 .9.2 1.7.7 2.1.4.3.8.4 1.3.2l1.4-.5c.3-.1.5-.4.4-.7-.2-.3-.5-.5-.8-.4zm67.5-11.5l.9-1.3c.3-.4.3-.9.2-1.3-.2-.6-.8-1-1.7-1.2-.7-.1-.8-.6-.3-1.1.6-.6 1-1.3.9-2 0-.5-.3-.8-.7-1l-1.3-.7c-.3-.1-.6 0-.8.2-.2.3-.1.6.2.7l1.3.7c.1.1.2.2.2.3 0 .2-.1.6-.6 1.1-.6.5-.8 1.2-.7 1.7.1.5.6 1 1.4 1.1.6.1.9.4 1 .6.1.1 0 .3-.1.4l-.9 1.3c-.2.3-.1.6.2.7.3.1.7 0 .8-.2zm-10.2 18.3c-.3-.2-.6-.1-.7.2l-.7 1.3c-.1.1-.2.2-.3.2-.2 0-.6-.1-1.1-.6-.6-.6-1.2-.8-1.7-.7-.6.1-1 .6-1.1 1.4-.1.6-.4.9-.6 1-.1.1-.3 0-.4-.1l-1.3-.9c-.3-.2-.6-.1-.7.2-.1.3 0 .6.2.8l1.3.9c.4.3.9.3 1.3.2.6-.2 1-.8 1.2-1.7.1-.7.6-.8 1.1-.3.6.6 1.3 1 2 .9.5 0 .8-.3 1-.7l.7-1.3c.2-.2.1-.6-.2-.8zm-3.4 25.8c-.2-.4-.6-.7-1.1-.7-.6-.1-1.3.2-1.9.9-.5.5-1 .4-1.1-.3-.2-.8-.6-1.4-1.2-1.6-.4-.2-.9-.1-1.3.1l-1.3.8c-.3.2-.4.5-.2.7.1.3.4.3.7.2l1.3-.8c.1-.1.3-.1.4 0 .2.1.5.4.6.9.2.7.6 1.2 1.1 1.3.5.1 1.2-.1 1.7-.6.4-.4.8-.6 1.1-.5.1 0 .3.1.3.2l.7 1.3c.1.3.4.3.7.2.3-.2.4-.5.2-.7l-.7-1.4zm-36.7.2c-.8-1.8-2.5-3-4.6-3-.5 0-1.1.1-1.6.3-.4-.2-.9-.3-1.4-.3-1.1 0-2.2.5-2.9 1.3-1.9.6-3.5 1.9-4.4 3.7-1.7 1.1-2.7 2.9-2.7 5 0 3.3 2.7 6 6 6 1.1 0 2.2-.3 3.1-.9.8.6 1.8.9 2.9.9.7 0 1.5-.2 2.1-.5.6.3 1.2.5 1.9.5 2.2 0 4-1.8 4-4 1.2-.9 2-2.4 2-4 0-2.6-1.9-4.7-4.4-5zm.1 7.9c.2.3.3.7.3 1.1 0 1.1-.9 2-2 2-.8 0-1.4-.4-1.7-1-.6.6-1.4 1-2.3 1-.9 0-1.7-.4-2.3-1.1-.2 0-.5.1-.7.1h-.3c-.7.6-1.6 1-2.7 1-2.2 0-4-1.8-4-4 0-1.6.9-2.9 2.3-3.6.6-1.7 2.1-3 4-3.3.3-.6 1-1.1 1.8-1.1.5 0 1 .2 1.3.5.5-.3 1.1-.5 1.7-.5 1.7 0 3 1.3 3 3v.2c.3-.1.7-.2 1-.2 1.7 0 3 1.3 3 3-.1 1.4-1 2.6-2.4 2.9zm45.4-14.9c-.9-1.3-2.4-2.1-4.1-2.1-1.4 0-2.6.5-3.5 1.5-.2-.1-.4-.1-.5-.2-.7-.8-1.8-1.3-2.9-1.3-.5 0-1 .1-1.4.3-.5-.2-1-.3-1.6-.3-2.1 0-3.8 1.3-4.6 3-2.5.3-4.4 2.4-4.4 5 0 1.6.8 3.1 2 4 0 2.2 1.8 4 4 4 .7 0 1.3-.2 1.9-.5.7.3 1.4.5 2.1.5 1 0 2-.3 2.9-.9.9.6 2 .9 3.1.9s2.1-.3 3-.8c.7.5 1.6.8 2.5.8 2.1 0 3.9-1.5 4.4-3.4 1.3-1.1 2.1-2.8 2.1-4.6-.1-2.9-2.2-5.4-5-5.9zm.9 9.4c0 1.4-1.1 2.6-2.5 2.6-1.1 0-2-.7-2.3-1.6-.7 1-1.9 1.6-3.2 1.6-1 0-2-.4-2.7-1h-.3c-.2 0-.5 0-.7-.1-.6.6-1.4 1.1-2.3 1.1-.9 0-1.7-.4-2.3-1-.3.6-1 1-1.7 1-1.1 0-2-.9-2-2 0-.4.1-.8.3-1.1-1.3-.3-2.3-1.5-2.3-2.9 0-1.7 1.3-3 3-3 .4 0 .7.1 1 .2v-.2c0-1.7 1.3-3 3-3 .6 0 1.2.2 1.7.5.4-.3.8-.5 1.3-.5.8 0 1.4.4 1.8 1.1.9.1 1.7.5 2.4 1.1.4-1.2 1.5-2.1 2.9-2.1 1.3 0 2.4.8 2.8 2h.2c2.2 0 4 1.8 4 4-.1 1.3-.9 2.6-2.1 3.3z"
      />
    </g>
    <g id="bush1_1_">
      <path id="bush" fill="#9DDCA0" d="M989 324c.5-1.1.7-2.3.7-3.5 0-3.2-1.7-6.2-4.4-7.8.3-.7.4-1.5.4-2.2 0-3.3-2.7-6-6-6-.5 0-1 .1-1.4.2-2.5-2.7-5.9-4.2-9.6-4.2-4.5 0-8.6 2.3-11 6.1-2.2.4-4 1.9-4.7 4-.4-.1-.9-.1-1.3-.1-4.4 0-8 3.6-8 8 0 .7.1 1.4.3 2-2.1.2-4.1 1.1-5.6 2.6-.8-.4-1.7-.6-2.7-.6-3.3 0-6 2.7-6 6 0 1.3.4 2.5 1.2 3.6.2.3.5.4.8.4h58.9c.5 0 .9-.4 1-.9.1-.4.1-.8.1-1.1 0-2.5-1-4.8-2.7-6.5z"
      />
      <path fill="#7B908C" d="M990.1 323.8c.4-1.1.6-2.2.6-3.3 0-3.3-1.6-6.3-4.2-8.2.2-.6.2-1.2.2-1.8 0-3.9-3.1-7-7-7-.4 0-.7 0-1.1.1-2.6-2.6-6.2-4.1-9.9-4.1-4.7 0-9 2.4-11.6 6.2-2.1.5-3.8 1.9-4.7 3.8h-.7c-5 0-9 4-9 9 0 .4 0 .8.1 1.2-1.7.3-3.3 1.1-4.6 2.3-.8-.3-1.6-.4-2.4-.4-3.9 0-7 3.1-7 7 0 1.5.5 3 1.4 4.2.4.5 1 .8 1.6.8h58.9c1 0 1.9-.8 2-1.8.1-.5.1-.9.1-1.2-.1-2.6-1-5-2.7-6.8zm.5 7.6h-58.9c-.6-1-1-1.9-1-3 0-2.8 2.2-5 5-5 1.1 0 2 .3 2.8.9 1.5-1.8 3.7-2.9 6.2-2.9h.7c-.4-.9-.7-1.9-.7-3 0-3.9 3.1-7 7-7 .7 0 1.4.1 2.1.3.3-2.3 2.2-4.1 4.5-4.3 2.1-3.6 6-6 10.4-6 3.7 0 7 1.7 9.2 4.3.6-.2 1.1-.3 1.8-.3 2.8 0 5 2.2 5 5 0 1-.3 1.9-.8 2.7 2.8 1.2 4.8 4.1 4.8 7.3 0 1.4-.3 2.7-1 3.8 1.8 1.5 3 3.7 3 6.2 0 .4 0 1-.1 1zm-51.4-4.2l-1.6-.6c-1.2-.4-2.4.2-2.6 1.4l-.3 1.6c-.1.3.2.7.5.8.3.1.6 0 .7-.4l.3-1.6c.1-.6.7-.9 1.2-.7l1.6.6c.2.1.3 0 .4 0 .1-.1.2-.2.2-.3.1-.3-.1-.7-.4-.8zm14.7-9.5c-.5-1.3-1.7-1.6-2.7-.9l-1.3 1c-.2.2-.3.6-.2 1 .1.3.4.4.7.2l1.3-1c.4-.4 1-.2 1.3.4l.7 1.7c.1.2.2.3.3.3.1 0 .3 0 .4-.1.2-.2.3-.6.2-1l-.7-1.6zm17.6-9.8c-.3-.4-.7-.5-1.2-.5-.6.1-1.2.6-1.6 1.3-.3.6-.8.6-1.1 0-.4-.8-1-1.3-1.6-1.3-.4-.1-.9.1-1.2.5l-1 1.1c-.2.2-.2.6 0 .8.2.2.5.2.7 0l1-1.1c.1-.1.2-.2.4-.1.2 0 .6.3.9.8.4.7.9 1.1 1.4 1.1s1.1-.4 1.4-1.1c.3-.5.6-.8.9-.8.1 0 .3 0 .4.1l1 1.1c.2.2.5.2.7 0 .2-.2.2-.6 0-.8l-1.1-1.1zm9.4 11.4c-.2-.4-.6-.7-1.1-.7-.6-.1-1.3.2-1.9.8-.5.5-1 .4-1.1-.3-.2-.8-.6-1.4-1.2-1.6-.4-.2-.9-.1-1.3.1l-1.3.8c-.3.2-.3.5-.2.7.1.3.4.3.7.2l1.3-.8c.1-.1.3-.1.4 0 .2.1.5.4.6.9.2.7.6 1.2 1.1 1.3.5.1 1.2-.1 1.7-.6.4-.4.8-.5 1.1-.5.1 0 .3.1.3.2l.7 1.3c.1.3.4.3.7.2.3-.2.3-.5.2-.7l-.7-1.3zm-13.4 4.2c-.2-.1-.6-.1-.7.2l-.8 1.3c-.1.1-.2.2-.3.2-.2 0-.6-.1-1-.5-.5-.5-1.1-.7-1.7-.5-.6.1-1 .6-1.2 1.3-.2.5-.4.8-.7.9-.1.1-.3 0-.4 0l-1.3-.7c-.2-.1-.6-.1-.7.2-.1.2-.1.6.2.7l1.3.7c.4.2.9.3 1.3.1.6-.2 1.1-.8 1.3-1.6.2-.6.6-.8 1.1-.3.6.6 1.3.8 1.9.7.5-.1.8-.3 1.1-.7l.7-1.3c.2-.2.1-.5-.1-.7z"
      />
    </g>
    <g id="lamp1">
      <path fill="#BC9275" d="M607.7 328.4v-12h-4v12h-2v4h8v-4z" />
      <path fill="#7B908C" d="M613.7 233.3c-3.5 0-6.5 1.9-8 4.8-1.5-2.9-4.5-4.8-8-4.8-5 0-9 4.1-9 9.1h2c0-4 3.1-7.2 7-7.2s7 3.1 7 6.9v-.1 13.3h-2v2h2V315c-1 0-2 .9-2 2v10c-1 0-2 .9-2 2v4.3h10V329c0-1.1-.9-2-2-2v-10c0-1.1-.9-2-2-2v-57.7h2v-2h-2v-13c0-4 3.1-7 7-7s7 3 7 7h2c0-4.9-4.1-9-9-9zm-9 84.1h2v10h-2v-10zm4 12v2h-6v-2h6z"
      />
      <path fill="#E7FFCC" d="M621.7 243.1c-3.3 0-6 2.8-6 6.2 0 .6.4 1.2 1 1.2h3.9c-.2 0-.4.5-.4.8 0 .8.7 1.4 1.5 1.4s1.5-.6 1.5-1.4c0-.4-.1-.9-.4-.9h3.9c.6 0 1-.6 1-1.2 0-3.2-2.7-6.1-6-6.1zm-32 0c-3.3 0-6 2.8-6 6.2 0 .6.4 1.2 1 1.2h3.9c-.2 0-.4.5-.4.8 0 .8.7 1.4 1.5 1.4s1.5-.6 1.5-1.4c0-.4-.1-.9-.4-.9h3.9c.6 0 1-.6 1-1.2 0-3.2-2.7-6.1-6-6.1z"
      />
      <path fill="#7B908C" d="M621.7 242.1c-3.9 0-7 3.3-7 7.2 0 1.1.9 2.2 2 2.2h3c0 1 .9 2 2 2s2-1 2-2h3c1.1 0 2-1.1 2-2.2 0-3.9-3.2-7.2-7-7.2zm0 10c-.6 0-1-.4-1-1h2c0 .6-.5 1-1 1zm-5-2.7c0-3 2.2-5 5-5s5 2 5 5h-10zm-27-7.3c-3.9 0-7 3.3-7 7.2 0 1.1.9 2.2 2 2.2h3c0 1 .9 2 2 2s2-1 2-2h3c1.1 0 2-1.1 2-2.2 0-3.9-3.2-7.2-7-7.2zm0 10.3c-.6 0-1-1-1-1h2s-.5 1-1 1zm-5-3c0-3 2.2-5 5-5s5 2 5 5h-10z"
      />
    </g>
    <g id="lamp2">
      <path fill="#BC9275" d="M915.7 328.4v-12h-4v12h-2v4h8v-4z" />
      <path fill="#7B908C" d="M921.7 233.4c-3.5 0-6.5 2-8 4.9-1.5-2.9-4.5-4.9-8-4.9-5 0-9 4-9 9h2c0-4 3.1-7 7-7s7 3.1 7 7v13h-2v2h2v58c-1 0-2 .9-2 2v10c-1.1 0-2 .9-2 2v4h10v-4c0-1.1-.9-2-2-2v-10c0-1.1-.9-2-2-2v-58h2v-2h-2v-13c0-3.9 3.1-7 7-7s7 3 7 7h2c0-5-4-9-9-9zm-9 84h2v10h-2v-10zm4 12v2h-6v-2h6z"
      />
      <path fill="#E7FFCC" d="M929.7 243.4c-3.3 0-6 2.7-6 6 0 .6.4 1 1 1h3.9c-.2.3-.4.6-.4 1 0 .8.7 1.5 1.5 1.5s1.5-.7 1.5-1.5c0-.4-.1-.7-.4-1h3.9c.6 0 1-.4 1-1 0-3.3-2.7-6-6-6zm-32 0c-3.3 0-6 2.7-6 6 0 .6.4 1 1 1h3.9c-.2.3-.4.6-.4 1 0 .8.7 1.5 1.5 1.5s1.5-.7 1.5-1.5c0-.4-.1-.7-.4-1h3.9c.6 0 1-.4 1-1 0-3.3-2.7-6-6-6z"
      />
      <path fill="#7B908C" d="M929.7 242.4c-3.9 0-7 3.1-7 7 0 1.1.9 2 2 2h3c0 1.1.9 2 2 2s2-.9 2-2h3c1.1 0 2-.9 2-2 0-3.8-3.1-7-7-7zm0 10c-.6 0-1-.4-1-1h2c0 .6-.4 1-1 1zm-5-3c0-3 2.2-5 5-5s5 2 5 5h-10zm-27-7c-3.9 0-7 3.1-7 7 0 1.1.9 2 2 2h3c0 1.1.9 2 2 2s2-.9 2-2h3c1.1 0 2-.9 2-2 0-3.8-3.1-7-7-7zm0 10c-.6 0-1-.4-1-1h2c0 .6-.4 1-1 1zm-5-3c0-3 2.2-5 5-5s5 2 5 5h-10z"
      />
    </g>
    <g id="bush2_1_">
      <path id="b2" fill="#9DDCA0" d="M153 324c.5-1.1.7-2.3.7-3.5 0-3.2-1.7-6.2-4.4-7.8.3-.7.4-1.5.4-2.2 0-3.3-2.7-6-6-6-.5 0-1 .1-1.4.2-2.5-2.7-5.9-4.2-9.6-4.2-4.5 0-8.6 2.3-11 6.1-2.2.4-4 1.9-4.7 4-.4-.1-.9-.1-1.3-.1-4.4 0-8 3.6-8 8 0 .7.1 1.4.3 2-2.1.2-4.1 1.1-5.6 2.6-.8-.4-1.7-.6-2.7-.6-3.3 0-6 2.7-6 6 0 1.3.4 2.5 1.2 3.6.2.3.5.4.8.4h58.9c.5 0 .9-.4 1-.9.1-.4.1-.8.1-1.1 0-2.5-1-4.8-2.7-6.5z"
      />
      <path fill="#7B908C" d="M154.1 323.8c.4-1.1.6-2.2.6-3.3 0-3.3-1.6-6.3-4.2-8.2.2-.6.2-1.2.2-1.8 0-3.9-3.1-7-7-7-.4 0-.7 0-1.1.1-2.6-2.6-6.2-4.1-9.9-4.1-4.7 0-9 2.4-11.6 6.2-2.1.5-3.8 1.9-4.7 3.8h-.7c-5 0-9 4-9 9 0 .4 0 .8.1 1.2-1.7.3-3.3 1.1-4.6 2.3-.8-.3-1.6-.4-2.4-.4-3.9 0-7 3.1-7 7 0 1.5.5 3 1.4 4.2.4.5 1 .8 1.6.8h58.9c1 0 1.9-.8 2-1.8.1-.5.1-.9.1-1.2-.1-2.6-1-5-2.7-6.8zm.5 7.6H95.7c-.6-1-1-1.9-1-3 0-2.8 2.2-5 5-5 1.1 0 2 .3 2.8.9 1.5-1.8 3.7-2.9 6.2-2.9h.7c-.4-.9-.7-1.9-.7-3 0-3.9 3.1-7 7-7 .7 0 1.4.1 2.1.3.3-2.3 2.2-4.1 4.5-4.3 2.1-3.6 6-6 10.4-6 3.7 0 7 1.7 9.2 4.3.6-.2 1.1-.3 1.8-.3 2.8 0 5 2.2 5 5 0 1-.3 1.9-.8 2.7 2.8 1.2 4.8 4.1 4.8 7.3 0 1.4-.3 2.7-1 3.8 1.8 1.5 3 3.7 3 6.2 0 .4 0 1-.1 1zm-51.4-4.2l-1.6-.6c-1.2-.4-2.4.2-2.6 1.4l-.3 1.6c-.1.3.2.7.5.8.3.1.6 0 .7-.4l.3-1.6c.1-.6.7-.9 1.2-.7l1.6.6c.2.1.3 0 .4 0 .1-.1.2-.2.2-.3.1-.3-.1-.7-.4-.8zm14.7-9.5c-.5-1.3-1.7-1.6-2.7-.9l-1.3 1c-.2.2-.3.6-.2 1 .1.3.4.4.7.2l1.3-1c.4-.4 1-.2 1.3.4l.7 1.7c.1.2.2.3.3.3.1 0 .3 0 .4-.1.2-.2.3-.6.2-1l-.7-1.6zm17.6-9.8c-.3-.4-.7-.5-1.2-.5-.6.1-1.2.6-1.6 1.3-.3.6-.8.6-1.1 0-.4-.8-1-1.3-1.6-1.3-.4-.1-.9.1-1.2.5l-1 1.1c-.2.2-.2.6 0 .8.2.2.5.2.7 0l1-1.1c.1-.1.2-.2.4-.1.2 0 .6.3.9.8.4.7.9 1.1 1.4 1.1s1.1-.4 1.4-1.1c.3-.5.6-.8.9-.8.1 0 .3 0 .4.1l1 1.1c.2.2.5.2.7 0 .2-.2.2-.6 0-.8l-1.1-1.1zm9.4 11.4c-.2-.4-.6-.7-1.1-.7-.6-.1-1.3.2-1.9.8-.5.5-1 .4-1.1-.3-.2-.8-.6-1.4-1.2-1.6-.4-.2-.9-.1-1.3.1l-1.3.8c-.3.2-.3.5-.2.7.1.3.4.3.7.2l1.3-.8c.1-.1.3-.1.4 0 .2.1.5.4.6.9.2.7.6 1.2 1.1 1.3.5.1 1.2-.1 1.7-.6.4-.4.8-.5 1.1-.5.1 0 .3.1.3.2l.7 1.3c.1.3.4.3.7.2.3-.2.3-.5.2-.7l-.7-1.3zm-13.4 4.2c-.2-.1-.6-.1-.7.2l-.8 1.3c-.1.1-.2.2-.3.2-.2 0-.6-.1-1-.5-.5-.5-1.1-.7-1.7-.5-.6.1-1 .6-1.2 1.3-.2.5-.4.8-.7.9-.1.1-.3 0-.4 0l-1.3-.7c-.2-.1-.6-.1-.7.2-.1.2-.1.6.2.7l1.3.7c.4.2.9.3 1.3.1.6-.2 1.1-.8 1.3-1.6.2-.6.6-.8 1.1-.3.6.6 1.3.8 1.9.7.5-.1.8-.3 1.1-.7l.7-1.3c.2-.2.1-.5-.1-.7z"
      />
    </g>
  </g>
  </g><!--city-->
  <g id="sky">
    <path fill="#9DDCA0" d="M766.7 70.4H726c-1-2.2-3.2-3.8-5.7-4 .3-.8.4-1.6.4-2.5 0-4.2-3.1-7.7-7.2-8.4.1-.5.2-1.1.2-1.6 0-4.7-3.8-8.5-8.5-8.5-3 0-5.6 1.5-7.1 3.9-2-2.4-5-3.9-8.4-3.9-6 0-10.9 4.8-11 10.8-.1 0-.1 0-.2.1-.2-.7-.5-1.3-.9-1.8v-.1c-.1-.1-.1-.2-.2-.3 0 0 0-.1-.1-.1-.1-.1-.1-.2-.2-.2l-.1-.1c-.1-.1-.2-.1-.2-.2 0 0-.1 0-.1-.1-.1-.1-.3-.2-.4-.3-.1 0-.1-.1-.2-.1s-.1-.1-.2-.1-.1-.1-.2-.1-.1-.1-.2-.1-.2-.1-.2-.1c-.1 0-.1 0-.2-.1-.1 0-.2 0-.3-.1h-2.4c-.1 0-.2 0-.2.1-.1 0-.2.1-.2.1-.1 0-.1 0-.2.1-.1 0-.2.1-.3.1-.1 0-.1 0-.2.1-.1 0-.2.1-.3.1 0 0-.1 0-.1.1-.1.1-.2.1-.3.2l-.1.1c-.1.1-.2.1-.3.2-2-2-4.7-3.2-7.8-3.2-4.7 0-8.7 2.9-10.3 7h-.7c-3.2 0-6 1.9-7.3 4.7-1.4-2.2-3.9-3.7-6.7-3.7-2.8 0-5.2 1.4-6.6 3.5-1.3-1.5-3.2-2.5-5.4-2.5-3.2 0-5.9 2.2-6.7 5.1-.4-.1-.8-.1-1.3-.1-3.7 0-6.8 2.6-7.7 6h-41.3c-.6 0-1 .4-1 1s.4 1 1 1h42c.6 0 1-.4 1-1h.1c.5-2.8 2.9-5 5.9-5 .3 0 .6 0 .9.1h.3c.9 0 1.7-.6 1.9-1.5.6-2.1 2.6-3.6 4.8-3.6 1.5 0 2.9.7 3.8 1.8.4.5.9.7 1.5.7h.1c.6 0 1.2-.4 1.6-.9 1.1-1.7 3-2.6 5-2.6s3.9 1 5 2.8c.4.6 1 .9 1.7.9h.1c.7-.1 1.4-.5 1.7-1.2 1-2.1 3.1-3.5 5.5-3.5h.8c.8 0 1.6-.5 1.9-1.3 1.4-3.5 4.6-5.8 8.4-5.8 2.4 0 4.6.9 6.3 2.6.4.4.9.6 1.4.6.5 0 .9-.2 1.3-.5.1 0 .1-.1.2-.1s.1-.1.2-.1.1-.1.2-.1h.1c.1 0 .1 0 .2-.1h2.1s.1 0 .2.1h.1s.1 0 .1.1H675.1c.1.1.2.1.3.2h.1l.1.1h.1l.1.1c0 .1.1.1.2.2.2.3.4.7.5 1.1.1.6.5 1.1 1.1 1.3.3.1.6.2.9.2.3 0 .6-.1.8-.2.1 0 .1 0 .2-.1.7-.3 1.2-1 1.2-1.8.1-4.9 4.1-8.8 9-8.8 2.6 0 5.1 1.2 6.8 3.2.4.4.9.7 1.5.7h.1c.6 0 1.2-.4 1.5-.9 1.2-1.9 3.2-3 5.5-3 3.6 0 6.5 2.9 6.5 6.5 0 .4 0 .8-.1 1.2-.1.5 0 1.1.3 1.5.3.4.8.7 1.3.8 3.2.5 5.5 3.2 5.5 6.4 0 .6-.1 1.3-.3 1.9-.2.6-.1 1.2.2 1.7.3.5.9.8 1.5.9 1.8.2 3.3 1.3 4.1 2.8v.1c0 .6.4 1 1 1h41.5c.6 0 1-.4 1-1s-.3-.5-.9-.5z"
    id="cloud3" />
    <path fill="#9DDCA0" d="M289.2 87.4h-9.1c-.3-2.6-1.9-4.7-4-6 0-.3.1-.7.1-1 0-4.4-3.6-8-8-8-2.4 0-4.6 1.1-6.1 2.8-.9-.5-1.9-.8-2.9-.8-3.3 0-6 2.7-6 6 0 .2 0 .4.1.6-2.7 1.1-4.6 3.5-5 6.4h-7.1c-.6 0-1 .4-1 1s.4 1 1 1h8c.6 0 1-.4 1-1 0-2.5 1.5-4.7 3.8-5.6.8-.3 1.3-1.2 1.3-2v-.3-.1c0-2.2 1.8-4 4-4 .7 0 1.3.2 1.9.5.3.2.6.3 1 .3.6 0 1.1-.2 1.5-.7 1.1-1.3 2.8-2.1 4.6-2.1 3.3 0 6 2.7 6 6 0 .2 0 .5-.1.8-.1.8.3 1.6 1 2 1.9 1.1 3.1 3.1 3.1 5.2 0 .6.4 1 1 1h10c.6 0 1-.4 1-1-.1-.5-.5-1-1.1-1z"
    id="cloud2" />
    <path fill="#9DDCA0" d="M525.7 42.4c-5.5 0-10 4.5-10 10s4.5 10 10 10 10-4.5 10-10c0-5.6-4.5-10-10-10zm.8-2l-.8-5-.8 5h1.6zm-8.7 3l-4.1-3 3 4.1c.3-.4.7-.8 1.1-1.1zm-2.9 3.7l-5-1.2 4.4 2.6c.2-.5.4-1 .6-1.4zm6.9-6.1l-2.6-4.4 1.2 5c.5-.2.9-.4 1.4-.6zm20.9 11.4l-5-.8v1.6l5-.8zm-10.5-15.7l-2.6 4.4c.5.2 1 .4 1.4.6l1.2-5zm4.9 11.8l4.4-2.6-5 1.2c.2.4.4.9.6 1.4zm.6-8.2l-4.1 3c.4.3.7.7 1.1 1.1l3-4.1zm-24 24.1l4.1-3c-.4-.3-.7-.7-1.1-1.1l-3 4.1zm19.9-3l4.1 3-3-4.1c-.3.4-.7.7-1.1 1.1zm-4 2.3l2.6 4.4-1.2-5c-.5.3-.9.4-1.4.6zm-15.9-11.3v-.8l-5 .8 5 .8v-.8zm22.8 5.3l5 1.2-4.4-2.6c-.2.4-.4.9-.6 1.4zm-22.1-1.5l-4.4 2.6 5-1.2c-.3-.4-.5-.9-.6-1.4zm4.8 11.9l2.6-4.4c-.5-.2-1-.4-1.4-.6l-1.2 5zm5.7-3.8l.8 5 .8-5h-.8c-.3.1-.5 0-.8 0z"
    id="sun_3_" />
    <circle id="sun-color" fill-rule="evenodd" clip-rule="evenodd" fill="#F1F9BB" cx="525.7" cy="52.4" r="8" />
    <path fill="#9DDCA0" d="M848.3 28.5h-9.1c-.3-2.6-1.9-4.7-4-6 0-.3.1-.7.1-1 0-4.4-3.6-8-8-8-2.4 0-4.6 1.1-6.1 2.8-.9-.5-1.9-.8-2.9-.8-3.3 0-6 2.7-6 6 0 .2 0 .4.1.6-2.7 1.1-4.6 3.5-5 6.4h-7.1c-.6 0-1 .4-1 1s.4 1 1 1h8c.6 0 1-.4 1-1 0-2.5 1.5-4.7 3.8-5.6.8-.3 1.3-1.2 1.3-2v-.3-.1c0-2.2 1.8-4 4-4 .7 0 1.3.2 1.9.5.3.2.6.3 1 .3.6 0 1.1-.2 1.5-.7 1.1-1.3 2.8-2.1 4.6-2.1 3.3 0 6 2.7 6 6 0 .2 0 .5-.1.8-.1.8.3 1.6 1 2 1.9 1.1 3.1 3.1 3.1 5.2 0 .6.4 1 1 1h10c.6 0 1-.4 1-1s-.6-1-1.1-1z"
    id="cloud1" />
  </g>
  <g id="controls">
    <path id="wheel-stem" fill="#8AA29A" stroke="#6B847F" stroke-miterlimit="10" d="M35.6 157.7c0-3.9 2.1-7.1 4.6-7.1 2.6 0 4.6 3.2 4.6 7.1v49.6c0 3.9-2.1 7.1-4.6 7.1-2.6 0-4.6-3.2-4.6-7.1v-49.6z" />
    <path id="stem" fill="#6B847F" d="M43.7 355.3c0 3.6 2.9 6.2 6.5 6.2h45.1c3.6 0 6.5-2.9 6.5-6.5s-2.9-6.5-6.5-6.5H65.7v-78.2c0-6.3-4.9-11.5-11-11.5s-11 5.1-11 11.5v80.2" />
    <g id="top-toggle" stroke="#6B847F" stroke-miterlimit="10">
      <path fill="#96D8C2" d="M101.86 177.558l3.55 2.05-7.948 13.77-3.55-2.05z" />
      <circle fill="#C68B7B" cx="104.4" cy="177.1" r="4.5" />
    </g>
    <path fill="#8AA29A" stroke="#6B847F" stroke-miterlimit="10" d="M95.6 190.5c-6.7 0-12.1 5.4-12.1 12.1h24.2c0-6.7-5.4-12.1-12.1-12.1z" />
    <path fill="#99C0A2" stroke="#6B847F" stroke-miterlimit="10" d="M13.7 263.6v-55c0-3.3 2.6-5.9 5.9-5.9h90.2c3.3 0 5.9 2.6 5.9 5.9v55c0 3.3-2.6 5.9-5.9 5.9H19.6c-3.2 0-5.9-2.6-5.9-5.9z" />
    <path fill="#AACEB0" stroke="#6B847F" stroke-miterlimit="10" d="M19.6 205.8h90.2c3.3 0 5.9 2.6 5.9 5.9v-2.8c0-3.3-2.6-5.9-5.9-5.9H19.6c-3.3 0-5.9 2.6-5.9 5.9v2.8c0-3.2 2.7-5.9 5.9-5.9z" />
    <path fill="#8AA29A" stroke="#6B847F" stroke-miterlimit="10" d="M19.6 269.5h90.2c3.3 0 5.9-2.6 5.9-5.9v-1.5c0 3.3-2.6 5.9-5.9 5.9H19.6c-3.3 0-5.9-2.6-5.9-5.9v1.5c0 3.3 2.7 5.9 5.9 5.9z" />
    <circle fill="#FFF" stroke="#6B847F" stroke-miterlimit="10" cx="36.4" cy="248.5" r="10.3" />
    <path fill="#F1F9BB" stroke="#6B847F" stroke-miterlimit="10" d="M47.1 245.6c-1.6-5.9-7.7-9.3-13.5-7.7-5.9 1.6-9.3 7.7-7.7 13.5 1.6 5.9 7.7 9.3 13.5 7.7 5.8-1.6 9.3-7.6 7.7-13.5zM27.4 251c-1.4-5 1.6-10.1 6.6-11.5 5-1.4 10.1 1.6 11.5 6.6 1.4 5-1.6 10.1-6.6 11.5-5 1.3-10.1-1.7-11.5-6.6z"
    />
    <g id="gauge" stroke="#6B847F" stroke-miterlimit="10">
      <path fill="#C68B7B" d="M36.1 249l.6-1 4.9 3.5z" />
      <path fill="#96D8C2" d="M36.7 248l-.6 1-4.8-3.5z" />
    </g>
    <circle id="button1" fill="#C68B7B" stroke="#6B847F" stroke-miterlimit="10" cx="80.7" cy="250.2" r="6.1" />
    <circle id="button2" fill="#C68B7B" stroke="#6B847F" stroke-miterlimit="10" cx="99" cy="250.2" r="6.1" />
    <g id="wheel" stroke="#6B847F" stroke-miterlimit="10">
      <path fill="#7B908C" d="M35.65 130.81l8.896-.214.703 28.99-8.9.217z" />
      <path fill="#7B908C" d="M40.94 163.95l4.2-7.848 25.57 13.685-4.2 7.847z" />
      <path fill="#7B908C" d="M15.232 176.505l-3.9-8 26.064-12.713 3.902 8z" />
      <path fill="#C68B7B" d="M40 127c-18 .4-32.2 15.4-31.8 33.4.4 18 15.4 32.2 33.4 31.8 18-.4 32.2-15.4 31.8-33.4-.5-18-15.4-32.2-33.4-31.8zm1.5 59.5c-14.8.4-27.2-11.4-27.5-26.2-.4-14.8 11.4-27.2 26.2-27.5 14.8-.4 27.2 11.4 27.5 26.2.3 14.8-11.4 27.1-26.2 27.5z"
      />
      <circle fill="#C68B7B" cx="40.8" cy="159.6" r="10.2" />
      <circle fill="#AD937F" cx="40.8" cy="159.6" r="6.2" />
    </g>
    <g id="side-toggle" stroke="#6B847F" stroke-miterlimit="10">
      <path fill="#96D8C2" d="M2.332 231.193l1-1.732L10 233.31l-1 1.732z" />
      <path fill="#C68B7B" d="M1.1 232.7c.5.2 1.1 0 1.4-.5l1.6-3.4c.2-.5 0-1.1-.5-1.4-.5-.2-1.1 0-1.4.5l-1.6 3.4c-.2.5 0 1.1.5 1.4z" />
    </g>
    <path fill="#8AA29A" stroke="#6B847F" stroke-miterlimit="10" d="M7.7 233.6c0 3.2 2.6 5.9 5.9 5.9v-11.8c-3.2 0-5.9 2.6-5.9 5.9z" />
  </g>
</svg>
            
          
!
            
              body {
  background: #c5ebae;
  width: 100vw;
  height: 100vh;
  font-family: 'Oswald', sans-serif;
  color: #8cb594;
}

h2 {
  font-weight: normal;
  width: 90%;
  margin-left: 5%;
  text-align: center;
}

svg {
  margin: -15px auto 0;
  display: table;
  width: 80%;
}

#wheel, #top-toggle, #side-toggle, #button1, #button2 {
	cursor: pointer;
}

.city path {
	visibility: hidden;
}
            
          
!
            
              var sun = $("#sun_3_"), 
    cloud1 = $("#cloud1"),
    cloud2 = $("#cloud2"),
    cloud3 = $("#cloud3"),
    gauge = $("#gauge"),
    wheel = $("#wheel"),
    city = $(".city path"),
    tTog = $("#top-toggle"),
    sTog = $("#side-toggle"),
    bkFar = $("#bk-far"),
    bkMid = $("#bk-mid"),
    but1 = $("#button1"),
    but2 = $("#button2"),
    controls = $("#controls path"),
    mult = [controls, bkFar, bkMid, city, extras],
    body = $("body"),
    extras = $(".extras path");

TweenMax.set(wheel, {
  transformOrigin: "50% 50%"
});

TweenMax.set(city, {
  visibility: "visible"
});

//animation that's repeated for all of the sections
function revolve() {
  var tl = new TimelineMax({
    repeat1: -1
  });

  tl.add("begin");
  tl.to(sun, 15, {
      transformOrigin: "50% 50%",
      rotation: 360,
      repeat: -1,
      ease: Linear.easeNone
    }, "begin");
  tl.to(cloud1, 10, {
      x: -110,
      repeat: -1,
      yoyo: true,
      ease: Linear.easeNone
    }, "begin");
  tl.to(cloud2, 10, {
      x: -70,
      repeat: -1,
      yoyo: true,
      ease: Linear.easeNone
    }, "begin");
  tl.to(cloud3, 10, {
      x: -50,
      repeat: -1,
      yoyo: true,
      ease: Linear.easeNone
    }, "begin");

  return tl;
}

var repeat = revolve();

//bring it in
function cityIn() {
  var tl = new TimelineMax({
    paused: true
  });

  tl.add("in");
  tl.from(tTog, 3, {
      rotation: -30,
      transformOrigin: "50% 100%",
      ease: Circ.easeInOut
    }, "in");
  tl.staggerFrom(city, 0.75, {
      y: -50,
      scale: 0,
      cycle:{
        x:[300, 100, 200],
        opacity:[0.5, 0.3, 0.2, 0.8],
        rotation:[50, 100, 150],
      }, 
      transformOrigin: "50% 50%",
      ease: Back.easeOut
    }, 0.02, "in");
  tl.staggerFrom(extras, 2.5, {
      x: 300,
      scale: 0,
      transformOrigin: "50% 50%",
      rotation: -30,
      ease: Elastic.easeOut
    }, 0.1, "in");
  tl.from(bkFar, 2.5, {
      scaleY: 0,
      opacity: 0.7,
      transformOrigin: "50% 100%",
      ease: Circ.easeOut
    }, "in");
  tl.from(bkMid, 2.5, {
      scaleY: 0,
      opacity: 0.7,
      transformOrigin: "50% 100%",
      ease: Circ.easeOut
    }, "in+=1");
  tl.from(gauge, 2, {
      rotation: 180,
      transformOrigin: "50% 50%",
      ease: Bounce.easeInOut
    }, "in");
  tl.from(gauge, 1, {
      rotation: 0,
      transformOrigin: "50% 50%",
      ease: Sine.easeIn
    }, "in+=3");

  return tl;
}

var fullIn = cityIn();

//side toggle perspective
function perspective() {
  var tl = new TimelineMax({
    paused: true
  });

  tl.add("per");
  tl.from(sTog, 1, {
      rotation: -30,
      transformOrigin: "100% 50%",
      ease: Circ.easeInOut
    }, "per");
  tl.to(bkFar, 1, {
      y: -30,
      scaleY: 0.8,
      opacity: 0.4,
      transformOrigin: "50% 100%",
      ease: Circ.easeInOut
    }, "per");
  tl.to(bkMid, 1, {
      scaleY: 1.6,
      transformOrigin: "50% 100%",
      ease: Circ.easeInOut
    }, "per");
  tl.from(gauge, 0.5, {
      rotation: 60,
      transformOrigin: "50% 50%",
      ease: Bounce.easeInOut
    }, "per");
  tl.from(gauge, 1, {
      rotation: 0,
      transformOrigin: "50% 50%",
      ease: Sine.easeIn
    }, "per+=0.5");

  return tl;
}

var side = perspective();

//button hue
function hued() {
  var ch1 = "hsl(+=110%, +=0%, +=0%)", 
  tl = new TimelineMax({
    paused: true
  });

  tl.add("hu");
  tl.to(mult, 1.25, {
      fill: ch1
    }, "hu");
  tl.from(gauge, 2, {
      rotation: "-=70",
      transformOrigin: "50% 50%",
      ease: Bounce.easeOut
    }, "hu");
  tl.to(body, 1.25, {
      backgroundColor: ch1
    }, "hu");

  return tl;
}

var hue = hued();

//button saturation
function saturation() {
  var ch2 = "hsl(+=5%, +=2%, -=10%)",
  tl = new TimelineMax({
    paused: true
  });

  tl.add("sated");
  tl.to(body, 1, {
      backgroundColor:ch2
    }, "sated");
  tl.from(gauge, 2, {
      rotation: "-=100",
      transformOrigin: "50% 50%",
      ease: Bounce.easeOut
    }, "sated");
  tl.to(mult, 2, {
      fill:ch2
    }, "sated");

  return tl;
}

var sat = saturation();

$(document).ready(function() {
  Draggable.create(wheel, {
    type: "rotation",
    bounds: {
      minRotation: 0,
      maxRotation: 360
    },
    onDrag: function() {
      fullIn.progress((this.rotation)/360 );
      fullIn.pause();
    }
  });

  $(tTog).on('click', function(e) {
    e.preventDefault();
    $(this).toggleClass('inTo');
    if ($(this).hasClass('inTo')) {
      fullIn.progress(0);
      fullIn.restart();
    } else {
      fullIn.reverse();
    }
  });

  $(sTog).on('click', function(e) {
    e.preventDefault();
    $(this).toggleClass('s-pers');
    if ($(this).hasClass('s-pers')) {
      side.restart();
    } else {
      side.reverse();
    }
  });

  $(but1).on('click', function(e) {
    e.preventDefault();
    $(this).toggleClass('a-s');
    if ($(this).hasClass('a-s')) {
      sat.restart();
    } else {
      sat.reverse();
    }
  });

  $(but2).on('click', function(e) {
    e.preventDefault();
    $(this).toggleClass('a-h');
    if ($(this).hasClass('a-h')) {
      hue.restart();
    } else {
      hue.reverse();
    }
  });
});

            
          
!
999px
Close

Asset uploading is a PRO feature.

As a PRO member, you can drag-and-drop upload files here to use as resources. Images, Libraries, JSON data... anything you want. You can even edit them anytime, like any other code on CodePen.

Go PRO

Loading ..................

Console