Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

You're using npm packages, so we've auto-selected Babel for you here, which we require to process imports and make it all work. If you need to use a different JavaScript preprocessor, remove the packages in the npm tab.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Use npm Packages

We can make npm packages available for you to use in your JavaScript. We use webpack to prepare them and make them available to import. We'll also process your JavaScript with Babel.

⚠️ This feature can only be used by logged in users.

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.

HTML Settings

Here you can Sed posuere consectetur est at lobortis. Donec ullamcorper nulla non metus auctor fringilla. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

            
              <div class="center">
  <svg version="1.1" id="house" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 757.8 534.8" style="enable-background:new 0 0 757.8 534.8;" xml:space="preserve">
    <g>
      <g>
        <polygon style="fill:#F4CD7E;" points="295.3,217.1 689,218.5 689,205.7 737.6,202.2 545.3,7.2 243.5,202.2 284.6,207.1 		" />
        <g>
          <g>
            <rect x="543.3" y="15.6" width="1" height="55.8" />
            <path style="fill:#0F3452;" d="M543.8,69.3c-8.7,0-15.8,5.1-15.8,11.3h31.6C559.6,74.4,552.5,69.3,543.8,69.3z" />
          </g>
          <g>
            <g>
              <path style="fill:#76392D;" d="M637.4,189.5c0,1.3,1,2.3,2.3,2.3l0,0c1.3,0,2.3-1,2.3-2.3v-58.3c0-1.3-1-2.3-2.3-2.3l0,0
						c-1.3,0-2.3,1-2.3,2.3V189.5z" />
              <g>
                <g>
                  <path style="fill:#AAD5C8;" d="M524.8,144.8c0,4.1,4.9,7.5,11,7.5h90.6c6.1,0,11-3.4,11-7.5l0,0c0-4.1-4.9-7.5-11-7.5h-90.6
								C529.7,137.3,524.8,140.7,524.8,144.8L524.8,144.8z" />
                  <path style="fill:#0F3452;" d="M636.4,118.2c0,0,1.2,19.1-20,19.1C616.5,137.3,616.2,118.3,636.4,118.2z" />
                </g>
                <g>
                  <path style="fill:#AAD5C8;" d="M524.8,189.1c0,6.1,4.9,11,11,11h90.6c6.1,0,11-4.9,11-11l0,0c0-6.1-4.9-11-11-11h-90.6
								C529.7,178.1,524.8,183,524.8,189.1L524.8,189.1z" />
                  <path style="fill:#0F3452;" d="M636.4,158.9c0,0,1.2,19.1-20,19.1C616.5,178.1,616.2,159,636.4,158.9z" />
                </g>
                <g>
                  <g>
                    <rect x="545.7" y="131.2" style="fill:#76392D;" width="91.8" height="3.3" />
                    <g>
                      <rect x="545.7" y="131.2" style="fill:#76392D;" width="3.9" height="57.9" />
                      <path style="fill:#76392D;" d="M521.8,191.9c0,1.3,1,2.3,2.3,2.3l0,0c1.3,0,2.3-1,2.3-2.3v-58.4c0-1.3-1-2.3-2.3-2.3l0,0
										c-1.3,0-2.3,1-2.3,2.3V191.9z" />
                      <g>
                        <rect x="524.1" y="178.1" style="fill:#76392D;" width="23.5" height="3.6" />
                        <rect x="524.8" y="167.7" style="fill:#76392D;" width="22.8" height="3.6" />
                        <rect x="524.8" y="157.1" style="fill:#76392D;" width="22.8" height="3.6" />
                      </g>
                      <rect x="521.8" y="141.2" style="fill:#76392D;" width="117.9" height="12" />
                    </g>
                  </g>
                  <g>
                    <path style="fill:#76392D;" d="M578.8,186.5h6.2h57v25.3h-10c-2.7-7-9.7-5.5-9.7-5.5h-38.9h-2.8h-38.9c0,0-7-1.4-9.7,5.5
									h-10v-25.3H578.8z" />
                    <g>
                      <rect x="524.8" y="190.3" style="fill:#B3674A;" width="112.7" height="9.5" />
                      <g>
                        <circle style="fill:#0F3452;" cx="624.6" cy="195.1" r="1.6" />
                        <circle style="fill:#0F3452;" cx="537.6" cy="195.1" r="1.6" />
                      </g>
                    </g>
                  </g>
                </g>
              </g>
            </g>
            <g>
              <g>
                <g>
                  <g>
                    <g>
                      <rect x="360.2" y="176.2" style="fill:#A37750;" width="6.5" height="35.5" />
                      <rect x="429.8" y="176.2" style="fill:#A37750;" width="6.5" height="35.5" />
                    </g>
                    <rect x="360.2" y="167.5" style="fill:#513118;" width="76.1" height="9" />
                  </g>
                  <g>
                    <rect x="366.7" y="176.5" style="fill:#C7B6A6;" width="24" height="25.7" />
                    <g>
                      <g>
                        <rect x="368.4" y="177.8" style="fill:#A37750;" width="20.7" height="7.3" />
                        <rect x="374.2" y="181" style="fill:#FFFFFF;" width="9" height="1" />
                      </g>
                      <g>
                        <rect x="368.4" y="185.7" style="fill:#A37750;" width="20.7" height="7.3" />
                        <rect x="374.2" y="188.9" style="fill:#FFFFFF;" width="9" height="1" />
                      </g>
                      <g>
                        <rect x="368.4" y="193.6" style="fill:#A37750;" width="20.7" height="7.3" />
                        <rect x="374.2" y="196.7" style="fill:#FFFFFF;" width="9" height="1" />
                      </g>
                    </g>
                  </g>
                </g>
                <g>
                  <path style="fill:#F6F5F5;" d="M415,163.5c0,0.9-0.7,1.6-1.6,1.6h-30.1c-0.9,0-1.6-0.7-1.6-1.6v-19.6c0-0.9,0.7-1.6,1.6-1.6
								h30.1c0.9,0,1.6,0.7,1.6,1.6V163.5z" />
                  <rect x="383.1" y="143.6" style="fill:#CECBCB;" width="30.7" height="19.2" />
                  <rect x="393.9" y="165.1" style="fill:#F6F5F5;" width="9" height="1.7" />
                  <rect x="391.1" y="166.7" style="fill:#F6F5F5;" width="14.6" height="0.8" />
                </g>
              </g>
              <g>
                <g>
                  <polygon style="fill:#7B4032;" points="476.9,205.7 476.9,205.8 476.9,205.7 446,206.2 446,211.8 448.9,211.8 452.5,209.5 
								476.7,209.5 476.9,209.5 501.3,209.5 504.9,211.8 507.8,211.8 507.8,206.2 							" />
                  <rect x="446" y="104.9" style="fill:#B3674A;" width="61.8" height="102.3" />
                </g>
                <g>
                  <g>
                    <polygon style="fill:#51221B;" points="478,134.2 506.6,134.1 499.7,132.7 478,132.7 475.9,132.7 454.2,132.7 447.3,134.1 
									475.9,134.2 475.9,134.2 477,134.2 478,134.2 								" />
                    <polygon style="fill:#51221B;" points="478,192.2 506.6,192.2 499.7,190.7 478,190.7 475.9,190.7 454.2,190.7 447.3,192.2 
									475.9,192.2 475.9,192.2 477,192.2 478,192.2 								" />
                  </g>
                  <g>
                    <g>
                      <rect x="447.3" y="134.1" style="fill:#76392D;" width="59.2" height="5.1" />
                      <rect x="447.3" y="163.1" style="fill:#76392D;" width="59.2" height="5.1" />
                      <rect x="447.3" y="192.1" style="fill:#76392D;" width="59.2" height="5.1" />
                    </g>
                    <polygon style="fill:#51221B;" points="478,163.2 506.6,163.1 499.7,161.7 478,161.7 475.9,161.7 454.2,161.7 447.3,163.1 
									475.9,163.2 475.9,163.2 477,163.2 478,163.2 								" />
                  </g>
                </g>
                <g>
                  <rect x="447.3" y="168" style="fill:#2A120F;" width="59.2" height="24.1" />
                  <rect x="447.3" y="139" style="fill:#2A120F;" width="59.2" height="24.1" />
                  <rect x="447.3" y="110" style="fill:#2A120F;" width="59.2" height="24.1" />
                  <g>
                    <g>
                      <g>
                        <g>
                          <rect x="450.9" y="117.9" style="fill:#E34A70;" width="3.6" height="15.2" />
                          <rect x="454.5" y="113.6" style="fill:#F8D9AA;" width="6.2" height="19.6" />
                        </g>

                        <rect x="462.3" y="117.9" transform="matrix(0.9717 -0.2361 0.2361 0.9717 -16.5114 113.0956)" style="fill:#A4DAF2;" width="3.6" height="15.2" />
                        <rect x="472.1" y="111.1" style="fill:#C6C5C0;" width="3.8" height="22" />
                        <rect x="476.1" y="117.9" style="fill:#6F3B95;" width="3.8" height="15.2" />
                        <rect x="491.5" y="113.6" style="fill:#CBAE64;" width="4.8" height="19.6" />
                      </g>
                      <rect x="496.3" y="113.6" style="fill:#699DB1;" width="4.8" height="19.6" />
                    </g>
                    <g>
                      <g>
                        <rect x="489.5" y="147.2" style="fill:#EA7926;" width="3" height="15.2" />
                        <rect x="484.2" y="142.9" style="fill:#F8D9AA;" width="5.3" height="19.6" />
                      </g>
                      <rect x="456.6" y="140.2" style="fill:#C6C5C0;" width="7.7" height="22" />
                      <rect x="466.3" y="144.3" style="fill:#6F3B95;" width="5.9" height="17.8" />
                    </g>
                    <g>
                      <rect x="450.3" y="171.6" style="fill:#699DB1;" width="4.8" height="19.6" />
                      <g>
                        <rect x="462.3" y="176" style="fill:#8F6176;" width="3.6" height="15.2" />
                        <rect x="465.9" y="171.7" style="fill:#AAD2A8;" width="6.2" height="19.6" />
                      </g>

                      <rect x="474.7" y="176" transform="matrix(0.9718 -0.2359 0.2359 0.9718 -29.8789 117.6103)" style="fill:#699DB1;" width="3.6" height="15.2" />
                      <g>
                        <rect x="497" y="176" style="fill:#E34A70;" width="4.2" height="15.2" />
                        <rect x="489.8" y="171.7" style="fill:#C2A6B4;" width="7.3" height="19.6" />
                      </g>
                    </g>
                  </g>
                </g>
              </g>
            </g>
          </g>
        </g>
      </g>
      <g>
        <polygon style="fill:#F9DCE6;" points="78.7,356.9 78.7,375.6 291.4,375.6 291.4,253.2 260.8,265.1 50.1,354.7 		" />
        <g>
          <g>
            <g>
              <rect x="212" y="320.3" style="fill:#EC2890;" width="61.3" height="23.4" />
              <path style="fill:#FCFAFC;" d="M260.8,337.2c0,3.6-2.9,6.5-6.5,6.5h-23.7c-3.6,0-6.5-2.9-6.5-6.5l0,0c0-3.6,2.9-6.5,6.5-6.5
						h23.7C257.9,330.7,260.8,333.6,260.8,337.2L260.8,337.2z" />
              <path style="fill:#95D2BE;" d="M275.5,341.9c-0.8-0.4-29.4,0-33,0c-3.5,0-32.2-0.4-33,0c-0.8,0.4-2.7,18.3-1.8,18
						c0.9-0.3,3.7,0,3.7,0s15.7-0.4,31.1-0.7c15.4,0.3,31.1,0.7,31.1,0.7s2.8-0.3,3.7,0C278.2,360.2,276.3,342.3,275.5,341.9z" />
            </g>
            <g>
              <rect x="209.9" y="343.7" style="fill:#F2F1F0;" width="65" height="14.2" />
              <rect x="212" y="357.9" style="fill:#C3995B;" width="61.3" height="5.2" />
              <rect x="214.1" y="363.1" style="fill:#E6BF7F;" width="3" height="5.7" />
              <rect x="268.7" y="363.1" style="fill:#E6BF7F;" width="3" height="5.7" />
            </g>
          </g>
          <g>
            <g>
              <g>
                <rect x="179.1" y="348.1" style="fill:#C3995B;" width="21.9" height="12.3" />
                <rect x="179.7" y="349.1" style="fill:#E6BF7F;" width="20.7" height="10.2" />
              </g>
              <rect x="185.4" y="353.7" style="fill:#FFFFFF;" width="9.4" height="1" />
              <g>
                <path style="fill:#664A3C;" d="M181.9,360.3c0,0,0,3-2.2,8.5h-0.6v-8.5H181.9z" />
                <path style="fill:#664A3C;" d="M198.2,360.3c0,0,0,3,2.2,8.5h0.6v-8.5H198.2z" />
              </g>
            </g>
            <g>
              <path style="fill:#3E3023;" d="M192.2,347.1c-0.4-0.3-0.9-1.1-1.2-1.8v-10.2h-1.8v10.2c-0.3,0.7-0.8,1.5-1.2,1.8
						c-0.8,0.5-0.8,0.9-0.8,0.9h2.6h0.5h2.7C193,348.1,193,347.6,192.2,347.1z" />
              <polygon style="fill:#EC2890;" points="197.5,340.6 182.6,340.6 185.9,325.5 194.1,325.5 					" />
            </g>
          </g>
          <g>
            <g>
              <rect x="113.1" y="347.2" style="fill:#E6BF7F;" width="52.8" height="6.9" />
              <rect x="113.1" y="354.1" style="fill:#EC2890;" width="4.5" height="14.5" />
              <rect x="161.4" y="354.1" style="fill:#EC2890;" width="4.5" height="14.5" />
            </g>
            <g>
              <path d="M153.7,344.3c0,0.7-0.5,1.2-1.2,1.2h-22.8c-0.7,0-1.2-0.5-1.2-1.2v-14.8c0-0.7,0.5-1.2,1.2-1.2h22.8
						c0.7,0,1.2,0.5,1.2,1.2V344.3z" />
              <rect x="129.5" y="329.3" style="fill:#6B6B6B;" width="23.2" height="14.5" />
              <rect x="137.7" y="345.5" width="6.8" height="1.3" />
              <rect x="135.6" y="346.8" width="11" height="0.6" />
            </g>
          </g>
        </g>
      </g>
      <g>
        <rect x="78.7" y="375.6" style="fill:#E9E1CD;" width="212.7" height="152.5" />
        <g>
          <g>
            <g>
              <path style="fill:#E14227;" d="M220,450.4c0,0-3.9-17.3-5-18.5c-1-1.1-5.5-2-31.4-2v0c0,0-0.1,0-0.1,0s-0.1,0-0.1,0v0
						c-25.9,0-30.4,0.9-31.4,2c-1,1.1-5,18.5-5,18.5l0.1,0c7.4,0.1,26.7,0.9,36.4,1.1v0c0,0,0,0,0,0c0,0,0,0,0,0v0
						C193.3,451.3,212.5,450.5,220,450.4L220,450.4z M217.1,446.7c-0.1,0.6-1.1-1-9.4-2.1c-8.1-1.1-23.3-1.5-24.1-1.4
						c-0.8,0-16.1,0.3-24.1,1.4c-8.3,1.1-9.3,2.7-9.4,2.1c-0.1-0.6,3-13.1,4.1-14.2c1.1-1,27.4-1.1,29.5-1.1c2,0,28.4,0.1,29.5,1.1
						C214.1,433.6,217.2,446.1,217.1,446.7z" />
              <g>
                <path style="fill:#E85D4B;" d="M149.9,446.7l-0.8,4.5c0,0,8.1,0.3,15.2,0.5c7,0.2,15.7,0.3,19.2,0.3c0,0,11.8-0.4,15.2-0.4
							c3.5,0,15.2-0.5,16.1-0.5c1,0,3.7-0.1,3.7-0.1l-1.6-4.2l-6.7-1.1c0,0-16.3-1.3-16.5-1.3c-0.3,0.1-13.7-0.4-13.7-0.4l-13.7,1
							l-14.6,1.9L149.9,446.7z" />
                <path style="fill:#E14227;" d="M211.9,445.3c-4.1-0.8-8.6-1.2-14-1.6c-4.4-0.3-11.6-0.5-13.9-0.6v0c0,0-0.1,0-0.4,0
							c-0.3,0-0.4,0-0.4,0v0c-2.4,0.1-9.5,0.2-13.9,0.6c-5.4,0.4-9.8,0.7-14,1.6c-4.1,0.8-5.4,1.4-5.4,1.4s2.2,0.9,3.4,0.6
							c1.2-0.3,16-2.2,29.9-1.8v0c0.1,0,0.3,0,0.4,0c0.1,0,0.3,0,0.4,0v0c13.9-0.4,28.7,1.6,29.9,1.8c1.2,0.3,3.1-0.5,3.1-0.5
							S216.1,446.2,211.9,445.3z" />
              </g>
            </g>
            <g>
              <circle style="fill:#282525;" cx="166" cy="450.4" r="2.3" />
              <path style="fill:#282525;" d="M168.2,450L168.2,450l4.4-6.2l-1.1-0.9l-5.1,5.3l0,0C167.3,448.4,168,449.1,168.2,450z" />
              <path style="fill:#282525;" d="M163.7,450L163.7,450l-4.4-6.3l1.1-0.9l5,5.3l0,0C164.6,448.4,163.9,449.1,163.7,450z" />
              <path style="fill:#282525;" d="M166,439.8c-5.9,0-10.7,4.8-10.7,10.7c0,5.9,4.8,10.7,10.7,10.7c5.9,0,10.7-4.8,10.7-10.7
						C176.6,444.5,171.8,439.8,166,439.8z M166,459.7c-5.1,0-9.2-4.1-9.2-9.2c0-5.1,4.1-9.2,9.2-9.2c5.1,0,9.2,4.1,9.2,9.2
						C175.2,455.5,171.1,459.7,166,459.7z" />
            </g>
          </g>
          <g>
            <g>
              <g>
                <ellipse style="fill:#070808;" cx="217.9" cy="512.8" rx="4.1" ry="7.1" />
                <path style="fill:#3F3B3D;" d="M237.2,508.9c0,0-1.3,8.2-7.8,10.8c-6.5,2.6-9.1,0.9-12.3,0c0,0,3.5-0.7,3.4-6.9L237.2,508.9z" />
              </g>
              <g>
                <ellipse style="fill:#070808;" cx="148.9" cy="512.8" rx="4.1" ry="7.1" />
                <path style="fill:#3F3B3D;" d="M129.5,508.9c0,0,1.3,8.2,7.8,10.8c6.5,2.6,9.1,0.9,12.3,0c0,0-3.5-0.7-3.4-6.9L129.5,508.9z" />
              </g>
            </g>
            <g>
              <g>
                <path style="fill:#8D8D8D;" d="M224.1,513.3c0,0-0.1,4,0.2,4.6c0.4,0.9,1.5,1.6,3,1.1c1.2-0.4,2.8-1.9,2.8-1.9l-2.4-2.6
							l-0.8,0.5l-0.1-2L224.1,513.3z" />

                <ellipse transform="matrix(0.9848 0.1738 -0.1738 0.9848 93.0912 -31.9298)" style="fill:#333132;" cx="228.9" cy="515.7" rx="1.7" ry="2.1" />
                <g>
                  <path style="fill:#D5D6D5;" d="M225.3,516.8L225.3,516.8c0.1-0.8,1.4-1.7,1.4-1.8l0,0C226.8,515,225.5,516.1,225.3,516.8z" />
                </g>
              </g>
              <g>
                <path style="fill:#8D8D8D;" d="M218.1,514.1c0,0-0.1,3.2,0.2,3.9c0.4,0.9,1.5,1.6,3,1.1c1.2-0.4,2.8-1.9,2.8-1.9l-2.4-2.6
							l-0.8,0.5l-0.1-1.2L218.1,514.1z" />

                <ellipse transform="matrix(0.9848 0.1738 -0.1738 0.9848 93.0006 -30.895)" style="fill:#333132;" cx="222.9" cy="515.7" rx="1.7" ry="2.1" />
                <g>
                  <path style="fill:#D5D6D5;" d="M219.3,516.8L219.3,516.8c0.1-0.8,1.4-1.7,1.5-1.8l0,0C220.8,515,219.5,516.1,219.3,516.8z" />
                </g>
              </g>
            </g>
          </g>
          <path style="fill:#E85D4B;" d="M222.6,513.5c-4.5,0.6-9.5,1.2-13.6,1.6c-9.4,0.9-15.2,1.1-25.7,1.1v0c0,0,0,0-0.1,0v0
				c-10.5,0-16.3-0.2-25.7-1.1c-4.1-0.4-9.1-1-13.6-1.6l0,0c0,0,3.2,1.9,5.4,2.2c2.3,0.3,17.3,2.4,33.9,2.1
				c16.6,0.4,31.6-1.8,33.9-2.1C219.4,515.4,222.6,513.5,222.6,513.5L222.6,513.5z" />
          <path style="fill:#E14227;" d="M239.2,490.1c-1-12.6-3.3-21.1-5.6-28c-2.3-6.9-8.1-5.9-8.1-5.9c-12.2,2.4-40.5,2.7-42.3,2.7
				c-1.8,0-30.1-0.3-42.3-2.7c0,0-5.8-1-8.1,5.9c-2.3,6.9-4.6,15.4-5.6,28c-1,12.6,2.3,21.3,4.4,21.7c2.1,0.4,16.2,2.3,25.7,3.2
				c9.4,0.9,15.2,1.1,25.7,1.1v0c0,0,0.1,0,0.1,0s0.1,0,0.1,0v0c10.5,0,16.3-0.2,25.7-1.1c9.5-1,23.6-2.9,25.7-3.2
				C236.9,511.5,240.2,502.7,239.2,490.1z" />
          <g>
            <g>
              <g>
                <circle style="fill:#65150D;" cx="138.8" cy="497.6" r="3.8" />
                <circle style="fill:#F68F1E;" cx="138.6" cy="497.8" r="3.5" />
              </g>
              <circle style="fill:#8B3938;" cx="143.8" cy="503.9" r="2.5" />
              <g>
                <path style="fill:#BAD9DD;" d="M136.3,483c0,0,1.6-8,3.3-10c0,0,1-1.5,1.1,10.5L136.3,483z" />
                <g>
                  <circle style="fill:#BAD9DD;" cx="138.4" cy="483.5" r="2.2" />
                  <circle style="fill:#E37544;" cx="138.2" cy="483.5" r="1.7" />
                </g>
                <path style="fill:#E9F5F4;" d="M137.3,481c0,0,1.4-5.9,1.9-6.5c0,0-0.6,3.6-0.9,6.3C138.3,480.8,137.9,480.7,137.3,481z" />
                <path style="fill:#E9F5F4;" d="M139.5,474.6c0,0-0.4,5.8-0.5,6.3c0,0,0.8,0.2,1.2,0.9C140.2,481.8,140.1,473.8,139.5,474.6z" />
              </g>
            </g>
            <g>
              <g>
                <circle style="fill:#0BA0A0;" cx="227.9" cy="497.6" r="3.8" />
                <circle style="fill:#65150D;" cx="228.2" cy="497.8" r="3.5" />
              </g>
              <circle style="fill:#8B3938;" cx="223" cy="503.9" r="2.5" />
              <g>
                <path style="fill:#BAD9DD;" d="M230.5,483c0,0-1.6-8-3.3-10c0,0-1-1.5-1.1,10.5L230.5,483z" />
                <g>
                  <circle style="fill:#BAD9DD;" cx="228.3" cy="483.5" r="2.2" />
                  <circle style="fill:#E37544;" cx="228.5" cy="483.5" r="1.7" />
                </g>
                <path style="fill:#E9F5F4;" d="M229.5,481c0,0-1.4-5.9-1.9-6.5c0,0,0.6,3.6,0.9,6.3C228.5,480.8,228.9,480.7,229.5,481z" />
                <path style="fill:#E9F5F4;" d="M227.2,474.6c0,0,0.4,5.8,0.5,6.3c0,0-0.8,0.2-1.2,0.9C226.6,481.8,226.7,473.8,227.2,474.6z" />
              </g>
            </g>
          </g>
          <path style="fill:#E85D4B;" d="M162.6,511.9c0,0,22.5,1.9,39.5,0.6c0,0,1.8,2.6-8.4,2.5C183.5,515,162.6,516.8,162.6,511.9z" />
          <g>
            <g>
              <path style="fill:#65150D;" d="M135.9,512.5c-1.5-2.6-1.9-10.1-2-16c-0.1-6.9,0.2-15.7,0.9-23.5c0.6-7.4,1.7-11.6,2.5-13.8
						c0.9-2.4,1.5-2.8,1.6-2.8l0.4-0.1l0,0.1c0,0-2.9,2.7-4,16.6c-1.3,16.1-1.3,35.5,1.2,39.6L135.9,512.5z" />
            </g>
            <g>
              <path style="fill:#65150D;" d="M231.2,512.5l-0.3-0.2c2.3-4.5,1.7-31.5,0.5-42.9c-0.6-5.9-1.8-9.1-2.7-10.8
						c-0.9-1.8-2.1-2.5-2.1-2.5l0.6,0c0.1,0.1,3.4,1.7,4.7,13.2C232.9,480.8,233.5,507.9,231.2,512.5z" />
            </g>
            <path style="fill:#65150D;" d="M223.8,483c-0.1-1.2-0.1-2.5-0.2-3.9c-0.6-13.2-2.9-22-2.9-22.1h-0.4c0,0.1,2.3,9,2.9,22.1
					c0.1,1.4,0.1,2.6,0.2,3.9c0.6,10.8,0.9,16.2-5,17.6c-4,1-13,1.4-18,1.6c-6.7,0.3-13.7,0.3-16.9,0.1h-0.4
					c-3.2,0.2-10.1,0.1-16.9-0.1c-5-0.2-14.1-0.7-18-1.6c-5.9-1.4-5.6-6.9-5-17.6c0.1-1.2,0.1-2.5,0.2-3.9c0.6-13.2,2.9-22,3-22.1
					l-0.4-0.1c0,0.1-2.3,8.9-2.9,22.1c-0.1,1.4-0.1,2.6-0.2,3.9c-0.6,10.6-0.9,16.5,5.3,18c5.3,1.3,20.7,1.9,29.9,1.9
					c2.3,0,4.1,0,5.4-0.1c1.2,0.1,3.1,0.1,5.4,0.1c9.1,0,24.5-0.6,29.8-1.9C224.7,499.5,224.3,493.6,223.8,483z" />
            <path style="fill:#E85D4B;" d="M221.8,485.2c0,0,4.1,16.9-15,15C206.8,500.2,221,498.6,221.8,485.2z" />
            <path style="fill:#E85D4B;" d="M144.8,485.2c0,0-4.1,16.9,15,15C159.8,500.2,145.6,498.6,144.8,485.2z" />
          </g>
          <g>
            <path style="fill:#BBBFC0;" d="M240.4,500.6c-0.3,0.6-5.9,1.5-17.2,2.3c-11,0.7-39.4,1-40.6,1c-1.2,0-29.6-0.2-40.6-1
					c-11.3-0.8-16.9-1.7-17.2-2.3c-0.3-0.6-3.4,1.3-3.4,2.3c0,0,0,0.9,0,1.8c0,0.9,0.7,2.5,2.9,3.2c0,0,3.8,1.6,17.7,2.5
					c13.7,1,38,0.4,40.6,0.4c2.6,0.1,26.9,0.6,40.6-0.4c13.9-1,17.7-2.5,17.7-2.5c2.2-0.7,2.9-2.3,2.9-3.2c0-0.9,0-1.8,0-1.8
					C243.8,501.9,240.7,500,240.4,500.6z" />
            <g>
              <path style="fill:#F7F7F7;" d="M126.2,505.9c8.5,1.6,28.5,1.8,49.5,1.8c2.3,0,4.6,0,7,0c2.3,0,4.6,0,7,0c21,0,41-0.2,49.5-1.8
						c3.5-0.6,4.8-2.8,4.8-2.9l-0.2-0.1c0,0-1.3,2.2-4.7,2.8c-9.4,1.7-33,1.8-56.4,1.8l0,0c0,0,0,0,0,0c0,0,0,0,0,0l0,0
						c-23.4,0-46.9-0.1-56.4-1.8c-3.4-0.6-4.7-2.8-4.7-2.8l-0.2,0.1C121.4,503,122.7,505.2,126.2,505.9z" />
              <path style="fill:#F7F7F7;" d="M240.5,506.3c-8.8,1.9-27.1,2.7-57.6,2.5v0c-0.1,0-0.1,0-0.2,0c-0.1,0-0.1,0-0.2,0v0
						c-30.6,0.2-48.9-0.6-57.6-2.5c-2.1-0.5-3.2-2.1-3.3-2.1l-0.2,0.1c0,0.1,1.2,1.7,3.4,2.2c7.9,1.7,23.6,2.5,49,2.5
						c2.8,0,5.8,0,8.9,0c3.1,0,6.1,0,8.9,0c25.4,0,41.1-0.8,49-2.5c2.2-0.5,3.4-2.1,3.4-2.2l-0.2-0.1
						C243.7,504.2,242.6,505.8,240.5,506.3z" />
            </g>
          </g>
          <path style="fill:#FFFFFF;" d="M196.5,518.2c0,0.9-1,1.7-2.3,1.7H172c-1.3,0-2.3-0.7-2.3-1.7v-5.7c0-0.9,1-1.7,2.3-1.7h22.2
				c1.3,0,2.3,0.7,2.3,1.7V518.2z" />
          <g>
            <path style="fill:#DCCBC5;" d="M139.1,456.2C139.1,456.2,139.1,456.2,139.1,456.2c1.2-0.1,1.9,0,1.9,0
					c12.2,2.4,40.5,2.7,42.3,2.7c1.8,0,30.1-0.3,42.3-2.7c0,0,0.4-0.1,1,0l0.6,0c0,0,0.3-2,0-2.7c-0.3-0.7-6.2,0.9-9.8,1.2
					c-3.5,0.4-7.7-1.3-12.3-1.4c-4.6-0.1-8.6-0.4-11.7,0c-3.1,0.4-12.5,0.9-15.7,0.5c-3.2-0.5-8.6,0.3-14.4,0.4
					c-5.8,0.1-14.3,0.1-17.2-0.5c-3-0.6-7-2-7.7-1.3c-0.6,0.6,0.1,2.6,0.7,3.6C139,456.1,139,456.1,139.1,456.2z" />
            <g>
              <path style="fill:#B19892;" d="M197.3,457.5c-0.6,0-1.2,0-1.8-0.2c-3.7-0.7-7.5-1.4-9.6-0.3c-1.3,0.7-2.7,0-4.1-0.6
						c-1-0.4-1.9-0.9-2.7-0.8c-0.4,0-0.8,0.1-1.3,0.1c-2.2,0.3-5.6,0.6-7.6,0.3c-1.6-0.3-4.9-0.2-9,0c-1.8,0.1-3.8,0.1-6,0.2
						c-7.1,0.1-14.1-1.8-14.1-1.9l0.1-0.2c0.1,0,7,2,14.1,1.9c2.2,0,4.2-0.1,6-0.2c4.1-0.1,7.4-0.2,9.1,0c1.9,0.3,5.3-0.1,7.6-0.3
						c0.5-0.1,0.9-0.1,1.3-0.1c0.9-0.1,1.8,0.3,2.8,0.8c1.3,0.6,2.7,1.2,3.9,0.6c2.2-1.1,6.1-0.4,9.8,0.3c2.1,0.4,4.7-0.1,6.9-0.5
						c1.7-0.3,3.3-0.6,4.4-0.5c2.5,0.3,10.2,1,13.1,0l0.1,0.2c-3,1-10.5,0.3-13.2,0c-1.1-0.1-2.7,0.2-4.3,0.5
						C200.9,457.1,199,457.5,197.3,457.5z" />
            </g>
            <path style="fill:#BEA9A5;" d="M145.9,453.7c3,0.6,11.4,0.6,17.2,0.5c5.8-0.1,11.1-0.9,14.4-0.4c3.2,0.5,12.6-0.1,15.7-0.5
					c3.1-0.4,7.1-0.1,11.7,0c4.6,0.1,8.8,1.8,12.3,1.4c2.7-0.3,6.9-1.3,8.8-1.4l0,0c0,0,0.2-2.4-0.5-2.9c-0.6-0.5-29.8,0.9-40.9,1
					c-11-0.1-40.2-1.5-40.9-1c-0.5,0.4-0.5,2-0.5,2.6C144.2,453.4,145.1,453.6,145.9,453.7z" />
          </g>
        </g>
      </g>
      <g>
        <rect x="291.4" y="375.6" style="fill:#F8F2E5;" width="192.6" height="152.5" />
        <g>
          <rect x="436.3" y="474.5" style="fill:#C68F6F;" width="41" height="46.7" />
          <g>
            <g>
              <g>
                <g>
                  <g>
                    <rect x="391.5" y="517.7" style="fill:#63857B;" width="43" height="4.1" />
                    <g>
                      <rect x="393.9" y="519.5" style="fill:#395740;" width="18.2" height="0.9" />
                      <rect x="413.8" y="519.5" style="fill:#395740;" width="18.2" height="0.9" />
                    </g>
                  </g>
                  <path style="fill:#B8CFBF;" d="M412.4,517.7h-20.9c0,0-1.7,0.1-2.2-1.6V434c0,0,1-5.6,6.8-6.8h16.1h1.3h16.1
								c5.8,1.2,6.8,6.8,6.8,6.8v82.1c-0.5,1.6-2.2,1.6-2.2,1.6h-20.9H412.4z" />
                  <rect x="389.3" y="455.6" style="fill:#F3F1F1;" width="47.1" height="1.2" />
                  <g>
                    <rect x="391.5" y="458.8" style="fill:#39535C;" width="6.2" height="2.8" />
                    <path style="fill:#7B9C84;" d="M392.9,461.1c0,0,16.9-0.1,18-0.2c1.1-0.1,4.2-0.2,4.5-0.7c0,0,0,0,0,0c0,0,0,0,0,0
									c-0.3-0.5-3.3-0.6-4.5-0.7c-1.2-0.1-18-0.2-18-0.2c-0.5,0.1-0.6,0.6-0.6,0.8h0c0,0,0,0,0,0c0,0,0,0,0,0h0
									C392.3,460.4,392.4,460.9,392.9,461.1z" />
                  </g>
                </g>
                <g>
                  <g>
                    <g>
                      <g>
                        <rect x="298.1" y="470.7" style="fill:#995838;" width="51.9" height="50.5" />
                        <g>
                          <rect x="298.9" y="519.4" style="fill:#A98262;" width="50.2" height="0.2" />
                        </g>
                        <g>
                          <rect x="298.9" y="485" style="fill:#D7C09E;" width="24.6" height="32.9" />
                          <rect x="324.5" y="485" style="fill:#D7C09E;" width="24.6" height="32.9" />
                          <g>
                            <rect x="321.4" y="494.1" style="fill:#FFFFFF;" width="0.7" height="8.4" />
                            <rect x="325.8" y="494.1" style="fill:#FFFFFF;" width="0.7" height="8.4" />
                          </g>
                        </g>
                      </g>
                      <g>
                        <path style="fill:#737373;" d="M317.8,462.9v-0.5h1.7v0.5h-0.5v1l0.5,0.2v2.2c0,0,1.6,0,2.9,0h0.6v-1.5l0.4-1h0.1
											c0-1.2,0-7.1,0-9.3c0-2.4,1-3.8,1.8-3.9c0.6-0.1,1.3-0.1,2.1,1.3c0.8,1.5,0.6,5,0.6,5h0.4v1.9H327V457h0.3
											c0.1-2.9-0.6-5.3-1.5-5.3c-1.1,0.1-1.1,2.4-1.1,2.4v9.7l0.4,1v1.5h0.7c1.3,0,2.9,0,2.9,0v-2.2l0.5-0.2v-1h-0.5v-0.5h1.7
											v0.5h-0.5v1l0.5,0.4v6.5h-1.9v-3.5h-4.2h-0.3h-4.2v3.5h-1.9v-6.5l0.5-0.4v-1H317.8z" />
                        <g>
                          <rect x="298.1" y="470.7" style="fill:#C9C4C2;" width="51.9" height="13.5" />
                          <path style="fill:#F8F8F8;" d="M349.3,483c0,0,0-10.6,0-11c0-0.4-0.6-0.4-0.6-0.4h-24.2h-0.7h-24.2c0,0-0.6,0-0.6,0.4
												c0,0.4,0,11,0,11s-0.1,0.6,0.6,0.6c0.6,0,20.2,0,24.3,0c0.5,0,0.7,0,0.7,0c4.1,0,23.7,0,24.3,0
												C349.4,483.5,349.3,483,349.3,483z" />
                        </g>
                      </g>
                    </g>
                    <g>
                      <g>
                        <rect x="350" y="470.7" style="fill:#C3C3C3;" width="39.3" height="3.9" />
                        <g>
                          <rect x="350" y="474.5" style="fill:#C68F6F;" width="39.3" height="46.7" />
                          <g>
                            <g>
                              <rect x="353" y="488.6" style="fill:#995838;" width="33.5" height="12.3" />
                              <rect x="353.6" y="489.2" style="fill:#D7C09E;" width="32.3" height="11.1" />
                              <rect x="361.5" y="493.7" style="fill:#A98262;" width="16.5" height="2.1" />
                            </g>
                            <g>
                              <rect x="352.9" y="476.9" style="fill:#995838;" width="33.5" height="8.6" />
                              <g>
                                <rect x="353.6" y="477.5" style="fill:#D7C09E;" width="15.8" height="7.5" />
                                <rect x="370.1" y="477.5" style="fill:#D7C09E;" width="15.8" height="7.5" />
                                <g>
                                  <path style="fill:#A98262;" d="M361.5,482.3c1.6,0,1.7-2,1.7-2h-1.7h-1.7C359.8,480.3,359.9,482.3,361.5,482.3z" />
                                  <path style="fill:#A98262;" d="M378,482.3c1.6,0,1.7-2,1.7-2H378h-1.7C376.3,480.3,376.4,482.3,378,482.3z" />
                                </g>
                              </g>
                            </g>
                            <g>
                              <rect x="353" y="504.2" style="fill:#995838;" width="33.5" height="12.3" />
                              <rect x="353.6" y="504.8" style="fill:#D7C09E;" width="32.3" height="11.1" />
                              <rect x="361.5" y="509.3" style="fill:#A98262;" width="16.5" height="2.1" />
                            </g>
                          </g>
                        </g>
                      </g>
                      <g>
                        <rect x="350" y="517.9" style="fill:#995838;" width="39.2" height="3.3" />
                        <g>
                          <rect x="352.9" y="519.4" style="fill:#A98262;" width="33.7" height="0.2" />
                        </g>
                      </g>
                    </g>
                  </g>
                  <g>
                    <path style="fill:#F498AA;" d="M384.5,470c0,0.5-0.4,1-1,1h-29.1c-0.6,0-1-0.4-1-1v-15.4c0-0.5,0.4-1,1-1h29.1
									c0.6,0,1,0.4,1,1V470z" />
                    <path style="fill:#343433;" d="M375,467.6c0,0.6-0.4,1-1,1h-17.5c-0.6,0-1-0.4-1-1v-10.8c0-0.5,0.4-1,1-1H374
									c0.6,0,1,0.4,1,1V467.6z" />
                    <path style="fill:#C0C0C0;" d="M374.1,466.9c0,0.5-0.4,0.9-0.9,0.9h-15.6c-0.5,0-0.9-0.4-0.9-0.9v-9.4
									c0-0.5,0.4-0.9,0.9-0.9h15.6c0.5,0,0.9,0.4,0.9,0.9V466.9z" />
                    <rect x="377.6" y="453.6" style="fill:#343433;" width="0.3" height="17.4" />
                    <rect x="377.9" y="455.8" style="fill:#020202;" width="6.6" height="3.6" />
                    <circle style="fill:#EFEFEF;" cx="381.2" cy="462.8" r="1.3" />
                    <circle style="fill:#EFEFEF;" cx="381.2" cy="466.9" r="1.3" />
                    <polygon style="fill:#F498AA;" points="375.3,459.8 373.9,461.2 373.9,463.2 375.3,464.7 								" />
                    <rect x="380.9" y="461.6" style="fill:#136D6A;" width="0.5" height="2.3" />

                    <rect x="380.9" y="465.8" transform="matrix(0.7608 0.649 -0.649 0.7608 394.1915 -135.686)" style="fill:#136D6A;" width="0.5" height="2.3" />
                  </g>
                </g>
              </g>
              <g>
                <g>
                  <rect x="436.3" y="470.7" style="fill:#C3C3C3;" width="41" height="3.9" />
                  <g>
                    <g>
                      <rect x="436.3" y="517.9" style="fill:#995838;" width="40.9" height="3.3" />
                      <g>
                        <rect x="439.3" y="519.4" style="fill:#A98262;" width="35.1" height="0.2" />
                      </g>
                    </g>
                    <g>
                      <g>
                        <rect x="439.4" y="476.9" style="fill:#995838;" width="34.9" height="12.3" />
                        <rect x="440" y="477.5" style="fill:#D7C09E;" width="33.6" height="11.1" />
                        <rect x="448.2" y="482" style="fill:#A98262;" width="17.2" height="2.1" />
                      </g>
                      <g>
                        <rect x="439.4" y="490.4" style="fill:#995838;" width="34.9" height="12.3" />
                        <rect x="440" y="491" style="fill:#D7C09E;" width="33.6" height="11.1" />
                        <rect x="448.2" y="495.5" style="fill:#A98262;" width="17.2" height="2.1" />
                      </g>
                      <g>
                        <rect x="439.4" y="503.9" style="fill:#995838;" width="34.9" height="12.3" />
                        <rect x="440" y="504.5" style="fill:#D7C09E;" width="33.6" height="11.1" />
                        <rect x="448.2" y="509" style="fill:#A98262;" width="17.2" height="2.1" />
                      </g>
                    </g>
                  </g>
                </g>
                <g>
                  <rect x="445.9" y="460.1" style="fill:#E94A25;" width="6.2" height="1.1" />
                  <g style="opacity:0.2;">
                    <path style="fill:#C9D9D6;" d="M454.3,466c-0.1-2.9-2.7-3.7-2.8-3.9c-0.1-0.1,0-0.9,0-0.9H449h-0.2h-2.5c0,0,0.1,0.7,0,0.9
									c-0.1,0.1-2.7,1-2.8,3.9c-0.1,2.9,1.7,4,2.2,4.1h3.1h0.2h3.1C452.6,470,454.5,468.9,454.3,466z" />
                    <path style="fill:#4C646C;" d="M452.2,470.6l-6.5,0c-0.6-0.2-2.7-1.4-2.6-4.6c0.1-1.8,1-3.2,2.9-4.2c0-0.1,0-0.3,0-0.5
									l-0.1-0.6h6.2l-0.1,0.6c0,0.2,0,0.4,0,0.5c1.8,1,2.8,2.4,2.9,4.2C454.9,469.2,452.8,470.4,452.2,470.6L452.2,470.6z
									 M445.9,469.7h6.2c0.5-0.2,1.9-1.2,1.8-3.6c-0.1-2.2-1.8-3.1-2.4-3.4c-0.2-0.1-0.3-0.1-0.3-0.2c-0.1-0.1-0.2-0.2-0.2-0.7h-4
									c0,0.5-0.1,0.6-0.2,0.7c-0.1,0.1-0.2,0.1-0.3,0.2c-0.6,0.3-2.3,1.2-2.4,3.4C444,468.5,445.4,469.5,445.9,469.7z" />
                  </g>
                  <path style="fill:#CEB7B4;" d="M444.9,465.3c0,0-0.7,2.9,1.4,4h5.2c0,0,2.4-0.9,1.4-4.3c0,0-0.9-0.6-1.8-0.3
								c-0.9,0.4-1.9,0.6-3,0.3c-1-0.2-1.6,0.3-2.2,0.2C445.3,465.3,444.9,465.3,444.9,465.3z" />
                  <g style="opacity:0.2;">
                    <path style="fill:#C9D9D6;" d="M466.6,457.9c-0.5-1-3.2-0.9-3.9-0.9c-0.7,0-3.4-0.1-3.9,0.9c-0.5,1.1-0.7,7.7-0.6,9.5
									c0.1,1.8,1.2,3.1,4.5,2.9c3.3,0.2,4.3-1.1,4.5-2.9C467.3,465.7,467.2,459.1,466.6,457.9z" />
                    <path style="fill:#4C646C;" d="M463.4,470.8L463.4,470.8c-0.2,0-0.5,0-0.7,0c-0.2,0-0.4,0-0.7,0c-3.3,0-4.2-1.8-4.3-3.3
									c-0.1-1.7,0-8.4,0.6-9.7c0.4-0.8,1.6-1.2,3.6-1.2c0.3,0,0.6,0,0.8,0c0.1,0,0.4,0,0.7,0c2,0,3.2,0.4,3.6,1.2
									c0.6,1.3,0.8,8.1,0.6,9.7C467.6,469,466.7,470.8,463.4,470.8z M462.7,469.8c0.3,0,0.5,0,0.7,0c2.8,0,3.2-1.4,3.3-2.5
									c0.1-1.9-0.1-8.3-0.5-9.3c-0.1-0.3-0.9-0.6-2.7-0.6c-0.3,0-0.6,0-0.7,0c-0.2,0-0.5,0-0.8,0c-1.8,0-2.6,0.3-2.7,0.6
									c-0.5,1-0.7,7.4-0.5,9.3c0.1,1.1,0.5,2.5,3.3,2.5C462.2,469.8,462.5,469.8,462.7,469.8z" />
                  </g>
                  <path style="fill:#F1A99B;" d="M460.1,456.8c0,0-2,0.5-2.1,0.6c-0.1,0.1,0.1,0,0.4,0.3c0.3,0.2,0.1,0.5,0.8,0.6
								c0.7,0.1,0.7-0.4,1.2-0.2c0.5,0.2,1.3,0.7,1.9,0.2c0.5-0.5,0.7,0.1,1.2,0.1c0.5,0.1,0.9-0.2,1.4-0.3c0.5-0.1,1.2,0.5,1.4,0.2
								c0.2-0.3,0.3-0.3,0.8-0.2c0.5,0.1,1.1-0.4,1.1-0.4l-2.6-0.9L460.1,456.8z" />
                  <polygon style="fill:#E94A25;" points="460,456.8 460,455.6 465.5,455.6 465.5,456.8 							" />
                  <path style="fill:#DEBE8F;" d="M459.4,463.3c0,0-0.3,4.1,0.2,4.7c0.5,0.7,1.4,1.3,2.7,1.3c1.3,0,3.6,0,3.9-2.1
								c0.3-2.1,0-4.1,0-4.5c0-0.4-0.2,0.1-1.4,0.5c-1.2,0.4-1.4,0.1-2.4,0.1c-1,0-1.8,0.1-2.3,0
								C459.6,463.2,459.4,463.3,459.4,463.3z" />
                </g>
              </g>
            </g>
            <g>
              <g>
                <rect x="378" y="389.8" style="fill:#A98262;" width="94.3" height="29.2" />
                <rect x="382.8" y="392.9" style="fill:#D7C09E;" width="40.4" height="23" />
                <rect x="388.1" y="412.1" style="fill:#FFFFFF;" width="29.8" height="1.6" />
                <g>
                  <rect x="427.1" y="392.9" style="fill:#D7C09E;" width="40.4" height="23" />
                  <rect x="432.4" y="412.1" style="fill:#FFFFFF;" width="29.8" height="1.6" />
                </g>
              </g>
              <g>
                <g>
                  <g>
                    <rect x="302.9" y="389.8" style="fill:#A98262;" width="25.9" height="43.6" />
                    <rect x="305.4" y="392.8" style="fill:#D7C09E;" width="20.8" height="37.6" />
                  </g>
                  <rect x="307.3" y="424.9" style="fill:#FFFFFF;" width="17.1" height="1.5" />
                </g>
                <g>
                  <g>
                    <rect x="328.8" y="389.8" style="fill:#A98262;" width="25.9" height="43.6" />
                    <rect x="331.3" y="392.8" style="fill:#D7C09E;" width="20.8" height="37.6" />
                  </g>
                  <rect x="333.2" y="424.9" style="fill:#FFFFFF;" width="17.1" height="1.5" />
                </g>
                <g>
                  <g>
                    <rect x="354.6" y="389.8" style="fill:#A98262;" width="25.9" height="43.6" />
                    <rect x="357.1" y="392.8" style="fill:#D7C09E;" width="20.8" height="37.6" />
                  </g>
                  <rect x="359" y="424.9" style="fill:#FFFFFF;" width="17.1" height="1.5" />
                </g>
              </g>
            </g>
          </g>
        </g>
      </g>
      <g>
        <rect x="543.4" y="221.6" style="fill:#9CDAF1;" width="145.6" height="154" />
        <g>
          <g>
            <g>
              <rect x="638" y="323.8" style="fill:#A1B9E0;" width="1.4" height="7.9" />
              <g>
                <polygon style="fill:#A1B9E0;" points="635.1,324.2 642.4,324.2 642.4,319.9 641.5,319.9 641.5,323.3 636,323.3 636,319.9 
							635.1,319.9 						" />
              </g>
              <g>
                <rect x="636.8" y="320.4" style="fill:#EA6924;" width="3.8" height="1.6" />
                <path style="fill:#EA6924;" d="M643.4,320.8c0,0,6.3,0.3,5.4,5.8l-6.2-1.8L643.4,320.8z" />
                <path style="fill:#EA6924;" d="M634.4,322.7l-0.3-2.3c-0.8,0.2-1.2,0.6-1.5,1c-0.2,0-3.2,0.5-4.8,2.6
							c-1.9,2.5-1.9,7.2-1.9,7.4l1.8,0c0,0,0-4.2,1.6-6.3c1.1-1.5,3.6-2,3.6-2L634.4,322.7z" />
              </g>
            </g>
            <path style="fill:#508CCA;" d="M681.3,330.3h-87.9c-0.8,0-1.5,0.7-1.5,1.5c0,0.8,0.7,1.5,1.5,1.5h0.5c1,14.5,8.8,22,17.5,25.9
					l0,0c0,0-0.5,3.3-1.5,4.9c-0.6-0.6-1.4-1-2.2-1c-1.7,0-3.1,1.4-3.1,3.1c0,1.7,1.4,3.1,3.1,3.1c1.2,0,2.2-0.7,2.7-1.7
					c0,0,0.1,0,0.1,0l6.2-6.6l0,0c9.2,2.7,32.4,2.7,41.5,0l6.2,6.6c0,0,0,0,0.1,0c0.5,1,1.5,1.7,2.7,1.7c1.7,0,3.1-1.4,3.1-3.1
					c0-1.7-1.4-3.1-3.1-3.1c-0.9,0-1.7,0.4-2.2,1c-1-1.5-1.5-4.5-1.5-4.9c8.7-3.9,16.5-11.4,17.5-25.9h0.5c0.8,0,1.5-0.7,1.5-1.5
					C682.9,331,682.2,330.3,681.3,330.3z" />
          </g>
          <g>
            <rect x="598.4" y="288.7" style="fill:#FFFFFF;" width="74.5" height="3.4" />
            <g>
              <g>
                <path style="fill:#7289AF;" d="M609,274.3h-1.2h-2.6c0,1.7,1.3,10.7,1.3,10.7h1.3h1.2h1.3c0,0,1.3-9,1.3-10.7H609z" />
                <rect x="606.3" y="285.8" style="fill:#7289AF;" width="4.2" height="2.9" />
              </g>
              <g>
                <path style="fill:#EA6924;" d="M617.5,274.9h-0.9h-0.9c0,0-1.6,1-1.6,1.8c0,0.8,0,12,0,12h2.4h2.4c0,0,0-11.2,0-12
							C619,275.9,617.5,274.9,617.5,274.9z" />
                <rect x="615.3" y="272.7" style="fill:#EA6924;" width="2.5" height="1.7" />
              </g>
              <g>
                <path style="fill:#D86A9D;" d="M628,274.9h-1.3h-1.3c0,0-2.3,1-2.3,1.8c0,0.8,0,12,0,12h3.5h3.5c0,0,0-11.2,0-12
							C630.3,275.9,628,274.9,628,274.9z" />
                <rect x="624.8" y="271.6" style="fill:#D86A9D;" width="3.8" height="2.7" />
              </g>
            </g>
            <g>
              <path style="fill:#508CCA;" d="M670.1,284.8c0,2.2-1.8,3.9-3.9,3.9H642c-2.2,0-3.9-1.8-3.9-3.9l0,0c0-2.2,1.8-3.9,3.9-3.9h24.2
						C668.3,280.8,670.1,282.6,670.1,284.8L670.1,284.8z" />
              <path style="fill:#D86A9D;" d="M670.1,276.9c0,2.2-1.8,3.9-3.9,3.9H642c-2.2,0-3.9-1.8-3.9-3.9l0,0c0-2.2,1.8-3.9,3.9-3.9h24.2
						C668.3,273,670.1,274.8,670.1,276.9L670.1,276.9z" />
              <path style="fill:#E95725;" d="M670.1,269.1c0,2.2-1.8,3.9-3.9,3.9H642c-2.2,0-3.9-1.8-3.9-3.9l0,0c0-2.2,1.8-3.9,3.9-3.9h24.2
						C668.3,265.1,670.1,266.9,670.1,269.1L670.1,269.1z" />
            </g>
          </g>
          <g>
            <g>
              <g>
                <rect x="567.8" y="338.2" style="fill:#A1B9E0;" width="6.8" height="28.4" />
                <rect x="563.5" y="366.6" style="fill:#659CD3;" width="15.5" height="2.3" />
              </g>
              <g>
                <path style="fill:#508CCA;" d="M553.2,325.1c0,7.8,8.1,14.1,18,14.1c10,0,18-6.3,18-14.1c0-0.5,0-1-0.1-1.4h-35.9
							C553.3,324.1,553.2,324.6,553.2,325.1z" />
                <path style="fill:#A1B9E0;" d="M590.9,321.8c0,1-0.6,1.9-1.4,1.9H553c-0.8,0-1.4-0.8-1.4-1.9l0,0c0-1,0.6-1.9,1.4-1.9h36.4
							C590.2,319.9,590.9,320.7,590.9,321.8L590.9,321.8z" />
              </g>
            </g>
            <g>
              <ellipse style="fill:#508CCA;" cx="571.2" cy="290.3" rx="17.1" ry="21.7" />
              <g>
                <ellipse style="fill:#B9E4F1;" cx="571.2" cy="290.3" rx="14.5" ry="18.5" />
                <path style="fill:#FFFFFF;" d="M556.7,289.2l21.9-14.8c-0.6-0.5-1.3-0.9-1.9-1.3L557,286C556.8,287.1,556.7,288.2,556.7,289.2
							z" />
                <path style="fill:#FFFFFF;" d="M556.8,293.3c0.3,2.7,1.2,5.3,2.3,7.5l25.2-18.3c-0.8-2.2-1.9-4.1-3.3-5.7L556.8,293.3z" />
                <path style="fill:#FFFFFF;" d="M563.7,306.2l21.9-16.9c0-0.8-0.1-1.6-0.2-2.4l-23.3,17.9C562.6,305.3,563.2,305.7,563.7,306.2
							z" />
              </g>
            </g>
          </g>
        </g>
      </g>
      <g>
        <rect x="291.4" y="218.5" style="fill:#AAD5C8;" width="251.4" height="157.1" />
        <g>
          <g>
            <rect x="363.1" y="243.5" style="fill:#3E3023;" width="107" height="58.1" />
            <g>
              <rect x="366.1" y="246" style="fill:#E1AE24;" width="101" height="53" />
              <g>
                <rect x="368.6" y="248" style="fill:#FAE3DE;" width="95.9" height="49" />
                <path style="fill:#AFC7E7;" d="M464.5,297v-38.7c-1.7-2.2-17.2,14.9-18.7,14.2c-1.5-0.7-6.6-13.6-9.6-12.9
							c-3,0.8-9.7,9.2-11.6,7.8c-1.9-1.4-9.6-14.9-11.2-14.1s-13.3,19.5-14.1,18.4c-0.8-1.1-4.1-6-5.4-5.4s-7.3,6-8.6,4.1
							c-1.3-1.9-4.1-11.6-6.4-10.1c-2.2,1.5-10.2,7.2-10.2,7.2V297H464.5z" />
              </g>
            </g>
          </g>
          <g>
            <g>
              <g>
                <g>
                  <rect x="364.7" y="320.3" style="fill:#664A3C;" width="105.4" height="23.4" />
                  <g>
                    <path style="fill:#BFB1B8;" d="M410.3,337.2c0,3.6-2.9,6.5-6.5,6.5h-23.7c-3.6,0-6.5-2.9-6.5-6.5l0,0c0-3.6,2.9-6.5,6.5-6.5
									h23.7C407.4,330.7,410.3,333.6,410.3,337.2L410.3,337.2z" />
                    <path style="fill:#BFB1B8;" d="M460.3,337.2c0,3.6-2.9,6.5-6.5,6.5h-23.7c-3.6,0-6.5-2.9-6.5-6.5l0,0c0-3.6,2.9-6.5,6.5-6.5
									h23.7C457.4,330.7,460.3,333.6,460.3,337.2L460.3,337.2z" />
                  </g>
                </g>
                <path style="fill:#E94A25;" d="M473.9,341.9c-1.3-0.4-50.6,0-56.7,0c-6.1,0-55.4-0.4-56.7,0c-1.4,0.4-4.6,18.3-3.2,18
							c1.5-0.3,6.3,0,6.3,0s27.1-0.4,53.5-0.7c26.4,0.3,53.5,0.7,53.5,0.7s4.9-0.3,6.3,0C478.5,360.2,475.2,342.3,473.9,341.9z" />
              </g>
              <g>
                <rect x="361.2" y="343.7" style="fill:#F2F1F0;" width="111.7" height="14.2" />
                <rect x="364.7" y="357.9" style="fill:#C3995B;" width="105.4" height="5.2" />
                <rect x="368.4" y="363.1" style="fill:#E6BF7F;" width="5.2" height="5.7" />
                <rect x="462.2" y="363.1" style="fill:#E6BF7F;" width="5.2" height="5.7" />
              </g>
            </g>
            <g>
              <g>
                <g>
                  <rect x="483.9" y="342.7" style="fill:#C3995B;" width="43.6" height="15.4" />
                  <rect x="485.1" y="344" style="fill:#E6BF7F;" width="41" height="12.8" />
                </g>
                <rect x="496.4" y="349.8" style="fill:#FFFFFF;" width="18.6" height="1.3" />
                <g>
                  <path style="fill:#664A3C;" d="M489.4,358.1c0,0,0.1,3.8-4.3,10.7h-1.3v-10.7H489.4z" />
                  <path style="fill:#664A3C;" d="M521.9,358.1c0,0-0.1,3.8,4.3,10.7h1.3v-10.7H521.9z" />
                </g>
              </g>
              <g>
                <path style="fill:#3E3023;" d="M509.8,341.6c-0.9-0.3-1.8-1.4-2.4-2.2v-12.8h-3.6v12.8c-0.6,0.9-1.5,1.9-2.4,2.2
							c-1.6,0.6-1.6,1.2-1.6,1.2h5.3h1.1h5.3C511.4,342.7,511.4,342.1,509.8,341.6z" />
                <rect x="490.8" y="314.4" style="fill:#E94A25;" width="29.6" height="18.9" />
              </g>
            </g>
            <g>
              <g>
                <g>
                  <rect x="305.6" y="342.7" style="fill:#C3995B;" width="43.6" height="15.4" />
                  <rect x="306.8" y="344" style="fill:#E6BF7F;" width="41" height="12.8" />
                </g>
                <rect x="318.1" y="349.8" style="fill:#FFFFFF;" width="18.6" height="1.3" />
                <g>
                  <path style="fill:#664A3C;" d="M311.1,358.1c0,0,0.1,3.8-4.3,10.7h-1.3v-10.7H311.1z" />
                  <path style="fill:#664A3C;" d="M343.6,358.1c0,0-0.1,3.8,4.3,10.7h1.3v-10.7H343.6z" />
                </g>
              </g>
              <g>
                <path style="fill:#3E3023;" d="M331.5,341.6c-0.9-0.3-1.8-1.4-2.4-2.2v-12.8h-3.6v12.8c-0.6,0.9-1.5,1.9-2.4,2.2
							c-1.6,0.6-1.6,1.2-1.6,1.2h5.3h1.1h5.3C333.1,342.7,333.1,342.1,331.5,341.6z" />
                <rect x="312.5" y="314.4" style="fill:#E94A25;" width="29.6" height="18.9" />
              </g>
            </g>
          </g>
        </g>
      </g>
      <g>
        <rect x="484" y="375.6" style="fill:#F1E6B5;" width="205" height="152.5" />
        <g>
          <g>
            <g>
              <g>
                <g>
                  <g>
                    <path style="fill:#3DB44B;" d="M666.9,490.8c0,0-1.5-3.8-3.7-5.7l0.3-0.4c2.3,1.9,3.8,5.7,3.8,5.9L666.9,490.8z" />
                  </g>
                  <path style="fill:#EE4F99;" d="M662.5,483.3c0,0-1.4-3.2,0-3.9c1.4-0.7,0.8,3.9,0.8,3.9H662.5z" />
                  <path style="fill:#EE4F99;" d="M663.3,483.1c0,0,2.4-2.6,3.6-1.5c1.2,1.1-3.3,2.2-3.3,2.2L663.3,483.1z" />
                  <path style="fill:#EE4F99;" d="M663.9,484.1c0,0,3.5-0.4,3.7,1.2c0.2,1.6-4-0.4-4-0.4L663.9,484.1z" />
                  <path style="fill:#EE4F99;" d="M663.5,485.2c0,0,0.4,3.5-1.2,3.7c-1.6,0.2,0.5-4,0.5-4L663.5,485.2z" />
                  <path style="fill:#EE4F99;" d="M662.2,484.3c0,0-3.5,0-3.6-1.6c-0.1-1.6,3.9,0.9,3.9,0.9L662.2,484.3z" />
                  <path style="fill:#EE4F99;" d="M662.4,485.2c0,0-2.1,2.9-3.4,1.9s3-2.6,3-2.6L662.4,485.2z" />
                  <circle style="fill:#E1BE28;" cx="663.1" cy="484.1" r="1.4" />
                </g>
                <g>
                  <g>
                    <path style="fill:#3DB44B;" d="M669.8,490.8c0,0,1.5-3.8,3.7-5.7l-0.3-0.4c-2.3,1.9-3.8,5.7-3.8,5.9L669.8,490.8z" />
                  </g>
                  <path style="fill:#EE4F99;" d="M674.2,483.3c0,0,1.4-3.2,0-3.9c-1.4-0.7-0.8,3.9-0.8,3.9H674.2z" />
                  <path style="fill:#EE4F99;" d="M673.4,483.1c0,0-2.4-2.6-3.6-1.5c-1.2,1.1,3.3,2.2,3.3,2.2L673.4,483.1z" />
                  <path style="fill:#EE4F99;" d="M672.8,484.1c0,0-3.5-0.4-3.7,1.2c-0.2,1.6,4-0.4,4-0.4L672.8,484.1z" />
                  <path style="fill:#EE4F99;" d="M673.2,485.2c0,0-0.4,3.5,1.2,3.7c1.6,0.2-0.5-4-0.5-4L673.2,485.2z" />
                  <path style="fill:#EE4F99;" d="M674.5,484.3c0,0,3.5,0,3.6-1.6c0.1-1.6-3.9,0.9-3.9,0.9L674.5,484.3z" />
                  <path style="fill:#EE4F99;" d="M674.3,485.2c0,0,2.1,2.9,3.4,1.9s-3-2.6-3-2.6L674.3,485.2z" />
                  <circle style="fill:#E1BE28;" cx="673.6" cy="484.1" r="1.4" />
                </g>
              </g>
              <polygon style="fill:#52BFBC;" points="663.3,489.7 665.8,500.5 672.5,500.5 674.9,489.7 					" />
            </g>
            <g>
              <rect x="659.7" y="500.2" style="fill:#513118;" width="19.5" height="6.9" />
              <rect x="659.7" y="507.2" style="fill:#A37750;" width="1.7" height="14.5" />
              <rect x="677.5" y="507.2" style="fill:#A37750;" width="1.7" height="14.5" />
            </g>
          </g>
          <g>
            <g>
              <g>
                <g>
                  <rect x="496.6" y="500.2" style="fill:#513118;" width="52.8" height="6.9" />
                  <rect x="496.6" y="507.2" style="fill:#A37750;" width="4.5" height="14.5" />
                  <rect x="544.9" y="507.2" style="fill:#A37750;" width="4.5" height="14.5" />
                </g>
                <g>
                  <path d="M548.3,494.1c0,1.3-1.1,2.4-2.4,2.4h-45.8c-1.3,0-2.4-1.1-2.4-2.4v-29.8c0-1.3,1.1-2.4,2.4-2.4h45.8
								c1.3,0,2.4,1.1,2.4,2.4V494.1z" />
                  <rect x="499.7" y="463.9" style="fill:#6B6B6B;" width="46.6" height="29.2" />
                  <rect x="516.1" y="496.5" width="13.7" height="2.5" />
                  <rect x="511.9" y="499" width="22.1" height="1.2" />
                </g>
              </g>
              <g>
                <g>
                  <g>
                    <rect x="560.3" y="440.5" style="fill:#E94A25;" width="24.2" height="24.2" />
                    <g>
                      <rect x="563.3" y="443.4" style="fill:#E9E3DE;" width="18.3" height="18.3" />
                      <path style="fill:#9DC6E8;" d="M563.3,447.6c2.6-0.4,5.2-1.5,7.5-0.8c2.5,0.8,7.1,1.7,10.8,0.4v-3.7h-18.3V447.6z" />
                    </g>
                  </g>
                  <g>
                    <rect x="586.8" y="440.5" style="fill:#E94A25;" width="24.2" height="24.2" />
                    <g>
                      <rect x="589.7" y="443.4" style="fill:#E9E3DE;" width="18.3" height="18.3" />
                      <path style="fill:#9DC6E8;" d="M589.7,453.9c2.6-0.4,6.4-2.3,8.7-1.6c2.5,0.8,5.9,3,9.6,1.6v-10.4h-18.3V453.9z" />
                    </g>
                  </g>
                  <g>
                    <rect x="613.2" y="440.5" style="fill:#E94A25;" width="24.2" height="24.2" />
                    <g>
                      <rect x="616.2" y="443.4" style="fill:#E9E3DE;" width="18.3" height="18.3" />
                      <path style="fill:#9DC6E8;" d="M616.2,450.5c2.6-0.4,6.3-1,8.6-0.2c2.5,0.8,6,1.4,9.7,0v-6.9h-18.3V450.5z" />
                    </g>
                  </g>
                </g>
                <g>
                  <g>
                    <g>
                      <rect x="567.5" y="514.3" style="fill:#7D532C;" width="3.2" height="7" />
                      <rect x="627" y="514.3" style="fill:#7D532C;" width="3.2" height="7" />
                    </g>
                    <g>
                      <g>
                        <polygon style="fill:#EB7D65;" points="630.2,488 629,502.5 598.9,502.5 568.7,502.5 567.5,488 559.1,488 559.1,512.5 
											598.9,512.5 638.6,512.5 638.6,488 										" />
                        <g>
                          <path style="fill:#E94A25;" d="M630.2,497.5c0,4.7-0.3,5-5,5h-52.6c-4.7,0-5-0.3-5-5v-17.5c0-4.7,0.3-5,5-5h52.6
												c4.7,0,5,0.3,5,5V497.5z" />
                          <g>
                            <path style="fill:#BE3826;" d="M598.9,499.6c0,2.3-1.8,4.1-4.1,4.1h-23.1c-2.3,0-4.1-1.8-4.1-4.1l0,0
													c0-2.3,1.8-4.1,4.1-4.1h23.1C597,495.5,598.9,497.3,598.9,499.6L598.9,499.6z" />
                            <path style="fill:#BE3826;" d="M630.2,499.6c0,2.3-1.8,4.1-4.1,4.1H603c-2.3,0-4.1-1.8-4.1-4.1l0,0
													c0-2.3,1.8-4.1,4.1-4.1h23.1C628.4,495.5,630.2,497.3,630.2,499.6L630.2,499.6z" />
                          </g>
                        </g>
                      </g>
                      <rect x="561.1" y="512.5" style="fill:#BE3826;" width="75.5" height="1.8" />
                    </g>
                  </g>
                  <g>
                    <polygon points="651.4,519.5 651.4,427.8 649,427.8 649,519.5 643.2,519.5 643.2,521.3 657.3,521.3 657.3,519.5 								" />
                    <path style="fill:#EB7D65;" d="M650.2,429.5c7.1,0,12.8-4.1,12.8-9.2h-25.6C637.4,425.4,643.2,429.5,650.2,429.5z" />
                  </g>
                </g>
              </g>
            </g>
            <g>
              <g>
                <circle style="fill:#E94A25;" cx="523" cy="430.8" r="16.4" />
                <circle style="fill:#EFEFEF;" cx="523" cy="430.8" r="14" />
              </g>
              <g>
                <circle cx="522.9" cy="430.8" r="1.2" />
                <path d="M523.9,430.6c0,0,1.6-0.9,3.1-1.5c1.5-0.6,2.4-1.1,3.9-2c1.5-0.9,3.3-1.8,3.3-1.8L534,425c0,0-2.8,1.3-3.4,1.6
							c-0.6,0.2-2.7,1.3-3.9,2c-1.2,0.7-3,1.7-3,1.7L523.9,430.6z" />
                <path d="M517.2,426.8c-0.4,0-0.8-0.1-1.4-0.3c-0.6-0.2-1.4-0.7-1.4-0.7l-0.1,0.2l-0.1,0.2c0,0,0.8,0.4,1.3,0.8
							c0.5,0.4,0.8,0.7,1,1.1c0.2,0.4,0.5,0.8,0.9,0.8c0.5,0,0.7-0.3,0.7-0.3l3.6,2l0.4-0.7l-3.6-2c0,0,0.1-0.4-0.1-0.8
							C518.1,426.8,517.6,426.8,517.2,426.8z" />
              </g>
            </g>
          </g>
        </g>
      </g>
    </g>
    <path style="fill:#C7B6A6;" d="M546.3,0l-329,212.9h67.4v35.7L0,365.8h71.9l0.3,169h623.5V212.4h62L546.3,0z M298.1,225.3H536v143.6
	h-45.2h-13.5H298.1V257.7v-5.8V225.3z M682.3,225.3v143.6H549.5V225.3H682.3z M477.3,382.4v139H298.1v-139H477.3z M68.2,352.3
	l216.4-89.1v105.7H85.4l0-16.5H68.2z M85.5,382.4h199.1v139H85.7L85.5,382.4z M490.8,521.4v-139h191.5v139H490.8z M682.3,198.9v12.9
	H298.1v-12.4H263L544.4,17.3l180.8,181.6H682.3z" />
  </svg>
</div>
            
          
!
            
              html,body {
  height: 100%;
} 
.center {
  display: flex;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  height: 100%;
}
svg {
  width: 100%;
  max-width: 1000px;
  margin: auto;
  padding: 10px;
  border: 4px solid #333;
}
            
          
!
            
              var tl = new TimelineMax({repeat: -1});
var svg = document.getElementById("house");

TweenLite.defaultEase = Sine.easeInOut;
TweenLite.defaultOverwrite = false;

tl.to(svg, 2, {delay: 1, attr: {viewBox: "450 350 252 178"}})
.to(svg, 4, {attr: {viewBox: "60 350 252 178"}})
.to(svg, 2, {attr: {viewBox: "60 210 252 178"}}, "-=0.25")
.to(svg, 4, {attr: {viewBox: "444 210 252 178"}})
.to(svg, 2, {attr: {viewBox: "0 0 757.8 534.8"}})
            
          
!
999px
🕑 One or more of the npm packages you are using needs to be built. You're the first person to ever need it! We're building it right now and your preview will start updating again when it's ready.

Console