SVG动画低聚虎

下载代码

html

css

分享到微信朋友圈

html

<div class="layer"></div>

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
	 viewBox="-34 122.4 542 548.6" style="enable-background:new 0 0 542 548.6;" xml:space="preserve">
<g id="left-side">
	<path id="XMLID_418_" class="st0" d="M165.5,362.6c-0.4-1.6-1.4-3.1-2.7-4.1c-0.1-0.8-0.8-1.6-1.9-1.3c-0.1,0-0.2,0.1-0.3,0.1
		s-0.1-0.1-0.2-0.1c-1-0.3-1.6,0.3-1.8,1.1c-1.4,1.1-2.2,2.8-2.1,4.7c0.2,3,3,4.9,5.9,4.7C165.1,367.4,166,364.9,165.5,362.6z
		 M162.5,364.5c-1.3,0.4-2.7-0.6-3-1.8c-0.2-1,0.3-1.8,1.1-2.3c0.7,0.5,1.3,1.3,1.7,2.1C162.5,363,162.9,364.4,162.5,364.5z"/>
	<polygon id="XMLID_417_" class="st1" points="237,527.7 225,527.7 204,515.2 196.3,521.5 221.6,543.2 222.4,555.2 237,558.7 	"/>
	<polygon id="XMLID_416_" class="st2" points="196.3,521.5 184.3,505.3 184.3,517.3 204.3,541.8 211.3,541.8 218.1,553.8 232,563.1 
		230.6,575.9 191.6,584.6 237,580.8 237,558.7 221.5,554.8 221.6,543.2 	"/>
	<polygon id="XMLID_415_" class="st2" points="237,172.9 209.6,158.1 183.7,172.9 	"/>
	<polygon id="XMLID_414_" class="st2" points="220.3,244.2 190.1,264.8 147,252.8 	"/>
	<polygon id="XMLID_413_" class="st2" points="237,186.5 153.2,197.3 207.3,178.9 	"/>
	<polygon id="XMLID_412_" class="st2" points="220.3,244.2 237,219.2 237,253.1 	"/>
	<polygon id="XMLID_411_" class="st2" points="147,252.8 124.6,310.8 98.5,298.4 	"/>
	<polygon id="XMLID_410_" class="st2" points="98.2,247.2 71.4,232.6 68.4,261.7 	"/>
	<polygon id="XMLID_409_" class="st2" points="71.4,232.6 71.4,188.9 35.3,174.5 	"/>
	<polygon id="XMLID_408_" class="st2" points="124.6,310.8 124.6,347.8 101.7,347.8 	"/>
	<polygon id="XMLID_407_" class="st2" points="126.2,373.4 101.7,389.5 101.7,367.6 	"/>
	<polygon id="XMLID_406_" class="st2" points="87.7,347.8 80,317.5 65.3,368.2 	"/>
	<polygon id="XMLID_405_" class="st2" points="52.4,325.2 52.4,360.9 30.9,365 	"/>
	<polygon id="XMLID_404_" class="st2" points="135.7,410.5 114.4,401.7 120.5,426.2 	"/>
	<polygon id="XMLID_403_" class="st2" points="68.7,413.9 70,462.4 104,477.8 	"/>
	<polygon id="XMLID_402_" class="st2" points="40.6,449.1 71.7,484.5 52.4,542.5 	"/>
	<polygon id="XMLID_401_" class="st2" points="191.6,584.6 151.3,581.2 167,602.9 	"/>
	<polygon id="XMLID_400_" class="st3" points="237,172.9 225,166.4 237,152.1 	"/>
	<polygon id="XMLID_399_" class="st3" points="237,186.5 237,219.2 218.3,188.9 	"/>
	<polygon id="XMLID_398_" class="st3" points="147,252.8 152.7,224.8 113.1,254.5 	"/>
	<polygon id="XMLID_397_" class="st3" points="71.4,232.6 68.4,261.7 55.3,241.2 	"/>
	<polygon id="XMLID_396_" class="st3" points="52.4,325.2 64.8,321.8 52.4,360.9 	"/>
	<polygon id="XMLID_395_" class="st3" points="65.3,368.2 78.7,389.7 87.7,347.8 	"/>
	<polygon id="XMLID_394_" class="st3" points="126.2,373.4 114.4,401.7 101.7,389.5 	"/>
	<polygon id="XMLID_393_" class="st3" points="52.4,360.9 41.6,393.8 30.9,365 	"/>
	<polygon id="XMLID_392_" class="st3" points="78.7,389.7 68.7,413.9 90.7,453.8 	"/>
	<polygon id="XMLID_391_" class="st3" points="120,508.8 109.4,526.7 131.5,561.7 	"/>
	<polygon id="XMLID_390_" class="st3" points="219,206.5 194.5,203.2 147,252.8 	"/>
	<polygon id="XMLID_389_" class="st4" points="52.4,325.2 79.7,286.2 80,317.5 	"/>
	<polygon id="XMLID_388_" class="st4" points="41.6,393.8 40.6,449.1 26.3,440.8 	"/>
	<polygon id="XMLID_387_" class="st4" points="90.7,453.8 138.3,455.2 87,434.2 	"/>
	<polygon id="XMLID_386_" class="st4" points="71.7,484.5 81.2,513.2 52.4,542.5 	"/>
	<polygon id="XMLID_385_" class="st4" points="120,508.8 81.2,513.2 109.4,526.7 	"/>
	<polygon id="XMLID_384_" class="st4" points="124.6,310.8 161.1,338.1 147.6,313.2 	"/>
	<polygon id="XMLID_383_" class="st4" points="35.3,174.5 55.3,241.2 71.4,232.6 	"/>
	<polygon id="XMLID_382_" class="st5" points="55.3,241.2 43.9,262.1 36.2,235.7 	"/>
	<polygon id="XMLID_381_" class="st6" points="30.9,365 41.6,393.8 26.3,440.8 	"/>
	<polygon id="XMLID_380_" class="st6" points="65.3,368.2 68.7,413.9 78.7,389.7 	"/>
	<polygon id="XMLID_379_" class="st6" points="81.2,513.2 104,477.8 120,508.8 	"/>
	<polygon id="XMLID_378_" class="st6" points="104,477.8 167,436.2 133,484.5 	"/>
	<polygon id="XMLID_377_" class="st4" points="40.6,449.1 26.3,497.5 52.4,542.5 	"/>
	<polygon id="XMLID_376_" class="st6" points="113.1,254.5 98.5,298.4 79.7,286.2 	"/>
	<polygon id="XMLID_375_" class="st7" points="147,252.8 98.5,298.4 113.1,254.5 	"/>
	<polygon id="XMLID_374_" class="st7" points="237,219.2 218.3,188.9 220.3,244.2 	"/>
	<polygon id="XMLID_373_" class="st7" points="142.8,517.8 171.5,519.2 175.7,540.8 	"/>
	<polygon id="XMLID_372_" class="st8" points="192.6,386.6 189.3,429.2 168.3,405.5 	"/>
	<polygon id="XMLID_371_" class="st8" points="213,400.4 191.2,352.4 220.3,347.8 	"/>
	<polygon id="XMLID_370_" class="st8" points="213,400.4 213,475.5 198.1,453.9 	"/>
	<polygon id="XMLID_369_" class="st7" points="198.1,453.9 180.1,477.2 213,475.5 	"/>
	<polygon id="XMLID_368_" class="st8" points="180.1,477.2 184.3,505.3 213,475.5 	"/>
	<polygon id="XMLID_367_" class="st9" points="168.3,405.5 167,436.2 189.3,429.2 	"/>
	<polygon id="XMLID_366_" class="st10" points="237,317.5 220.3,347.8 237,383.5 	"/>
	<polygon id="XMLID_365_" class="st10" points="167,436.2 180.1,477.2 133,484.5 	"/>
	<polygon id="XMLID_364_" class="st10" points="189.3,429.2 198.1,453.9 167,436.2 	"/>
	<polygon id="XMLID_363_" class="st10" points="192.6,386.6 213,400.4 189.3,429.2 	"/>
	<polygon id="XMLID_362_" class="st11" points="213,400.4 191.2,352.4 192.6,386.6 	"/>
	<polygon id="XMLID_361_" class="st11" points="167,436.2 198.1,453.9 180.1,477.2 	"/>
	<polygon id="XMLID_360_" class="st11" points="135.7,410.5 153.3,391 168.3,405.5 	"/>
	<polygon id="XMLID_359_" class="st11" points="180.1,477.2 171.5,519.2 184.3,505.3 	"/>
	<polygon id="XMLID_358_" class="st12" points="153.3,391 126.2,373.4 135.7,410.5 	"/>
	<polygon id="XMLID_357_" class="st12" points="180.1,477.2 142.8,517.8 133,484.5 	"/>
	<polygon id="XMLID_356_" class="st12" points="220.3,347.8 205.8,301.8 191.2,352.4 	"/>
	<polygon id="XMLID_355_" class="st12" points="220.3,347.8 223,310.5 237,317.5 	"/>
	<polygon id="XMLID_354_" class="st12" points="168.3,405.5 167,436.2 135.7,410.5 	"/>
	<polygon id="XMLID_353_" class="st13" points="180.1,477.2 171.5,519.2 142.8,517.8 	"/>
	<polygon id="XMLID_352_" class="st13" points="167,436.2 135.7,410.5 138.3,455.1 	"/>
	<polygon id="XMLID_351_" class="st13" points="126.2,373.4 124.6,347.8 101.7,347.8 	"/>
	<polygon id="XMLID_350_" class="st13" points="205.8,301.8 237,317.5 237,253.1 	"/>
	<polygon id="XMLID_349_" class="st14" points="237,253.1 220.3,244.2 205.8,301.8 	"/>
	<polygon id="XMLID_348_" class="st14" points="213,475.5 204,515.2 196.3,521.5 184.3,505.3 	"/>
	<polygon id="XMLID_347_" class="st14" points="126.2,373.4 135.7,410.5 114.4,401.7 	"/>
	<polygon id="XMLID_346_" class="st14" points="194.5,203.2 152.7,224.8 147,252.8 	"/>
	<polygon id="XMLID_345_" class="st14" points="98.5,298.4 80,317.5 79.7,286.2 	"/>
	<polygon id="XMLID_344_" class="st15" points="220.3,244.2 205.8,301.8 190.1,264.8 	"/>
	<polygon id="XMLID_343_" class="st15" points="98.5,298.4 124.6,310.8 80,317.5 	"/>
	<polygon id="XMLID_342_" class="st15" points="101.7,347.8 101.7,389.5 87.7,347.8 	"/>
	<polygon id="XMLID_341_" class="st15" points="80,317.5 52,362.3 64.8,321.8 	"/>
	<polygon id="XMLID_340_" class="st15" points="147,252.8 219,206.5 220.3,244.2 	"/>
	<path id="XMLID_339_" class="st15" d="M142.8,517.8"/>
	<polygon id="XMLID_338_" class="st15" points="131.5,561.7 175.7,540.8 142.8,517.8 	"/>
	<polygon id="XMLID_337_" class="st15" points="79.7,286.2 42.2,296.3 52.4,325.2 	"/>
	<polygon id="XMLID_336_" class="st15" points="98.2,247.2 113.1,254.5 68.4,261.7 	"/>
	<polygon id="XMLID_335_" class="st16" points="101.7,347.8 80,317.5 87.7,347.8 	"/>
	<polygon id="XMLID_334_" class="st16" points="189.3,291.8 191.2,352.4 171.3,358 	"/>
	<polygon id="XMLID_333_" class="st16" points="101.7,389.5 78.7,389.7 87.7,347.8 	"/>
	<polygon id="XMLID_332_" class="st16" points="135.7,410.5 138.3,455.1 120.5,426.2 	"/>
	<polygon id="XMLID_331_" class="st16" points="-6,550.2 52.4,542.5 26.3,497.5 	"/>
	<polygon id="XMLID_330_" class="st16" points="109.4,526.7 78.5,560.9 81.2,513.2 	"/>
	<polygon id="XMLID_329_" class="st16" points="79.7,286.2 79.4,285.6 68.4,261.7 42.2,296.3 	"/>
	<polygon id="XMLID_328_" class="st16" points="52.4,325.2 8.8,340 30.9,365 	"/>
	<polygon id="XMLID_327_" class="st17" points="42.2,296.3 52.4,325.2 8.8,340 	"/>
	<polygon id="XMLID_326_" class="st17" points="101.7,347.8 80,317.5 124.6,310.8 	"/>
	<polygon id="XMLID_325_" class="st17" points="136.1,357 126.2,373.4 124.6,347.8 	"/>
	<polygon id="XMLID_324_" class="st17" points="171.3,358 191.2,352.4 192.6,386.6 	"/>
	<polygon id="XMLID_323_" class="st17" points="171.3,358 161.1,338.1 149.8,345.1 	"/>
	<polygon id="XMLID_322_" class="st17" points="189.3,291.8 190.1,264.8 205.8,301.8 	"/>
	<polygon id="XMLID_321_" class="st17" points="147,252.8 147.6,313.2 124.6,310.8 	"/>
	<polygon id="XMLID_320_" class="st17" points="219,206.5 153.2,197.3 218.3,188.9 	"/>
	<polygon id="XMLID_319_" class="st17" points="133,484.5 142.8,517.8 120,508.8 	"/>
	<polygon id="XMLID_318_" class="st17" points="26.3,440.8 26.3,497.5 -34,487.7 	"/>
	<polygon id="XMLID_317_" class="st18" points="147,252.8 177.9,283.3 147.6,313.2 	"/>
	<polygon id="XMLID_316_" class="st18" points="190.1,264.8 177.9,283.3 189.3,291.8 	"/>
	<polygon id="XMLID_315_" class="st18" points="189.3,291.8 205.8,301.8 191.2,352.4 	"/>
	<polygon id="XMLID_314_" class="st18" points="161.1,299.9 161.1,338.1 173.1,314.9 	"/>
	<polygon id="XMLID_313_" class="st18" points="8.8,340 30.9,365 -6.6,382.5 	"/>
	<polygon id="XMLID_312_" class="st18" points="-6.6,382.5 26.3,440.8 -24.7,444 	"/>
	<polygon id="XMLID_311_" class="st18" points="101.7,389.5 87,434.2 78.7,389.7 	"/>
	<polygon id="XMLID_310_" class="st18" points="87,434.2 114.4,401.7 120.5,426.2 	"/>
	<polygon id="XMLID_309_" class="st18" points="68.7,413.9 41.6,393.8 40.6,449.1 	"/>
	<polygon id="XMLID_308_" class="st18" points="133,484.5 104,477.8 120,508.8 	"/>
	<polygon id="XMLID_307_" class="st19" points="120,508.8 142.8,517.8 131.5,561.7 	"/>
	<polygon id="XMLID_306_" class="st20" points="30.9,365 26.3,440.8 -6.6,382.5 	"/>
	<polygon id="XMLID_305_" class="st20" points="41.6,393.8 65.3,368.2 68.7,413.9 	"/>
	<polygon id="XMLID_304_" class="st20" points="68.7,413.9 70,462.4 40.6,449.1 	"/>
	<polygon id="XMLID_303_" class="st20" points="114.4,401.7 101.7,389.5 87,434.2 	"/>
	<polygon id="XMLID_302_" class="st20" points="120.5,426.2 138.3,455.1 87,434.2 	"/>
	<polygon id="XMLID_301_" class="st20" points="153.3,391 171.8,383.9 168.3,405.5 	"/>
	<polygon id="XMLID_300_" class="st20" points="124.6,310.8 138.3,335.8 124.6,347.8 	"/>
	<polygon id="XMLID_299_" class="st20" points="190.1,264.8 147,252.8 177.9,283.3 	"/>
	<polygon id="XMLID_298_" class="st20" points="-14.6,443.4 -6.6,466.4 26.3,440.8 	"/>
	<polygon id="XMLID_297_" class="st20" points="184.3,505.3 184.3,517.3 204.3,541.8 175.7,540.8 171.5,519.2 	"/>
	<polygon id="XMLID_296_" class="st21" points="138.3,455.1 104,477.8 90.7,453.8 	"/>
	<polygon id="XMLID_295_" class="st21" points="104,477.8 71.7,484.5 40.6,449.1 	"/>
	<polygon id="XMLID_294_" class="st21" points="26.3,497.5 -6,550.2 -14.6,490.8 	"/>
	<polygon id="XMLID_293_" class="st21" points="65.3,368.2 52,362.3 80,317.5 	"/>
	<polygon id="XMLID_292_" class="st21" points="161.1,338.1 173.1,314.9 171.3,358 	"/>
	<polygon id="XMLID_291_" class="st21" points="149.8,345.1 138.3,335.8 124.6,347.8 	"/>
	<polygon id="XMLID_290_" class="st21" points="173.1,314.9 189.3,291.8 161.1,299.9 	"/>
	<polygon id="XMLID_289_" class="st21" points="40.6,449.1 26.3,440.8 26.3,497.5 	"/>
	<polygon id="XMLID_288_" class="st21" points="81.2,513.2 78.5,560.9 52.4,542.5 	"/>
	<polygon id="XMLID_287_" class="st21" points="52.4,542.5 9,584.6 9,548.2 	"/>
	<polygon id="XMLID_286_" class="st21" points="175.7,540.8 151.3,581.2 191.6,584.6 	"/>
	<polygon id="XMLID_285_" class="st21" points="204.3,541.8 191.6,584.6 218.1,553.8 211.3,541.8 	"/>
	<polygon id="XMLID_284_" class="st21" points="192.2,596.7 185.5,642.5 237,611.3 	"/>
	<polygon id="XMLID_283_" class="st21" points="237,611.3 237,671 219.4,647.8 	"/>
	<polygon id="XMLID_282_" class="st22" points="189.3,291.8 171.3,358 173.1,314.9 	"/>
	<polygon id="XMLID_281_" class="st22" points="101.7,347.8 126.2,373.4 101.7,367.6 	"/>
	<polygon id="XMLID_280_" class="st22" points="52,362.3 41.6,393.8 65.3,368.2 	"/>
	<polygon id="XMLID_279_" class="st22" points="104,477.8 81.2,513.2 71.7,484.5 	"/>
	<polygon id="XMLID_278_" class="st22" points="218.1,553.8 232,563.1 230.6,575.9 191.6,584.6 	"/>
	<polygon id="XMLID_277_" class="st22" points="237,611.3 210.7,665.8 198.1,634.9 	"/>
	<polygon id="XMLID_276_" class="st22" points="192.2,596.7 185.5,642.5 163.6,611.3 	"/>
	<polygon id="XMLID_275_" class="st22" points="109.4,526.7 131.5,561.7 78.5,560.9 	"/>
	<polygon id="XMLID_274_" class="st22" points="52.4,542.5 43.2,584.2 78.5,560.9 	"/>
	<polygon id="XMLID_273_" class="st23" points="175.7,540.8 151.3,581.2 131.5,561.7 	"/>
	<polygon id="XMLID_272_" class="st23" points="175.7,540.8 204.3,541.8 191.6,584.6 	"/>
	<polygon id="XMLID_271_" class="st24" points="192.2,596.7 237,580.8 237,611.3 	"/>
	<polygon id="XMLID_270_" class="st24" points="192.2,596.7 191.6,584.6 138.8,623.9 	"/>
	<polygon id="XMLID_269_" class="st24" points="131.5,561.7 70.7,602.4 78.5,560.9 	"/>
	<polygon id="XMLID_268_" class="st24" points="52.4,542.5 46.8,568.2 9,584.6 	"/>
	<polygon id="XMLID_267_" class="st25" points="192.2,596.7 191.6,584.6 237,580.8 	"/>
	<polygon id="XMLID_266_" class="st25" points="167,602.9 151.3,581.2 138.8,623.9 	"/>
	<polygon id="XMLID_265_" class="st25" points="131.5,561.7 135.6,596.1 70.7,602.4 	"/>
	<polygon id="XMLID_264_" class="st25" points="68.4,261.7 43.9,262.1 55.2,279.2 	"/>
	<polygon id="XMLID_263_" class="st25" points="55.3,241.2 4.7,206.5 35.3,174.5 	"/>
	<polygon id="XMLID_262_" class="st25" points="35.3,174.5 50.4,122.4 71.4,188.9 	"/>
	<polygon id="XMLID_261_" class="st25" points="50.4,122.4 101.7,148.2 76.5,128.2 	"/>
	<polygon id="XMLID_260_" class="st18" points="42.2,296.3 -3.8,335.8 8.8,340 	"/>
	<polygon id="XMLID_259_" class="st26" points="151.3,581.2 131.5,561.7 138.8,623.9 	"/>
	<polygon id="XMLID_258_" class="st27" points="124.6,310.8 138.3,335.8 161.1,338.1 	"/>
	<polygon id="XMLID_257_" class="st27" points="161.1,299.9 161.1,338.1 147.6,313.2 	"/>
	<polygon id="XMLID_256_" class="st27" points="189.3,291.8 177.9,283.3 161.1,299.9 	"/>
	<polygon id="XMLID_255_" class="st27" points="55.3,241.2 68.4,261.7 43.9,262.1 	"/>
	<polygon id="XMLID_254_" class="st27" points="71.4,188.9 98.2,247.2 71.4,232.6 	"/>
	<polygon id="XMLID_253_" class="st21" points="136.1,357 153.3,391 126.2,373.4 	"/>
	<polygon id="XMLID_252_" class="st24" points="153.3,391 171.8,383.9 149.6,383.6 	"/>
	<polygon id="XMLID_251_" class="st24" points="171.8,383.9 177.9,398 168.3,405.5 	"/>
	<polygon id="XMLID_250_" class="st16" points="161.1,338.1 138.3,335.8 149.8,345.1 	"/>
	<polygon id="XMLID_243_" class="st11" points="223,310.5 205.8,301.8 220.3,347.8 	"/>
	<polygon id="XMLID_242_" class="st22" points="204,515.2 237,501.1 225,527.7 	"/>
	<polygon id="XMLID_241_" class="st24" points="225,527.7 237,501.1 237,527.7 	"/>
	<polygon id="XMLID_240_" class="st13" points="237,501.1 213,475.5 204,515.2 	"/>
	<polygon id="XMLID_239_" class="st28" points="213,475.5 237,436.2 237,501.1 	"/>
	<polygon id="XMLID_238_" class="st29" points="213,475.5 213,400.4 237,436.2 	"/>
	<polygon id="XMLID_237_" class="st29" points="213,400.4 198.1,453.9 189.3,429.2 	"/>
	<polygon id="XMLID_236_" class="st9" points="213,400.4 237,383.5 237,417.1 	"/>
	<polygon id="XMLID_235_" class="st30" points="213,400.4 220.3,347.8 237,383.5 	"/>
	<polygon id="XMLID_234_" class="st28" points="213,400.4 237,436.2 237,417.1 	"/>
	<polygon id="XMLID_233_" class="st13" points="153.2,197.3 136.9,174 124.6,207.8 	"/>
	<polygon id="XMLID_232_" class="st31" points="153.2,197.3 183.7,172.9 136.9,174 	"/>
	<polygon id="XMLID_231_" class="st31" points="183.7,172.9 237,186.5 237,172.9 	"/>
	<polygon id="XMLID_230_" class="st13" points="153.2,197.3 207.3,178.9 183.7,172.9 	"/>
	<polygon id="XMLID_229_" class="st32" points="183.7,172.9 209.6,158.1 136.9,174 	"/>
	<polygon id="XMLID_228_" class="st32" points="209.6,158.1 237,152.1 225,166.4 	"/>
	<polygon id="XMLID_227_" class="st8" points="237,152.1 177.9,144.8 237,134.9 	"/>
	<polygon id="XMLID_226_" class="st7" points="237,152.1 136.9,174 177.9,144.8 	"/>
	<polygon id="XMLID_225_" class="st20" points="152.7,224.8 153.2,197.3 194.5,203.2 	"/>
	<polygon id="XMLID_224_" class="st32" points="113.1,254.5 79.7,286.2 68.4,261.7 	"/>
	<polygon id="XMLID_223_" class="st32" points="113.1,254.5 124.6,207.8 98.2,247.2 	"/>
	<polygon id="XMLID_222_" class="st17" points="153.2,197.3 113.1,254.5 124.6,207.8 	"/>
	<polygon id="XMLID_221_" class="st18" points="152.7,224.8 142,213.3 153.2,197.3 	"/>
	<polygon id="XMLID_220_" class="st18" points="152.7,224.8 133.9,224.8 113.1,254.5 	"/>
	<polygon id="XMLID_219_" class="st6" points="152.7,224.8 142,213.3 133.9,224.8 	"/>
	<polygon id="XMLID_218_" class="st32" points="124.6,207.8 101.7,148.2 136.9,174 	"/>
	<polygon id="XMLID_217_" class="st29" points="35.3,174.5 14.7,140.8 50.4,122.4 	"/>
	<polygon id="XMLID_216_" class="st9" points="35.3,174.5 14.7,140.8 4.7,206.5 	"/>
	<polygon id="XMLID_215_" class="st16" points="101.7,148.2 71.4,188.9 50.4,122.4 	"/>
	<polygon id="XMLID_214_" class="st17" points="101.7,148.2 124.6,207.8 71.4,188.9 	"/>
	<polygon id="XMLID_213_" class="st21" points="124.6,207.8 98.2,247.2 71.4,188.9 	"/>
	<path id="XMLID_249_" class="st2" d="M165.6,353.1l-15.8-8l-25.2,2.8l11.5,9.1c0,0-8.2,34.5,35.7,27l6.2,14.1l14.7-11.5L170.6,357
		L165.6,353.1z"/>
	<path id="XMLID_248_" class="st6" d="M157.5,361.1c7,0,12.9,4,15.2,9.7c0.6-1.6,1-3.2,1-5c0-8.1-7.2-14.7-16.2-14.7
		c-8.9,0-16.2,6.6-16.2,14.7c0,1.8,0.4,3.4,1,5C144.6,365.1,150.5,361.1,157.5,361.1z"/>
	<path id="XMLID_247_" class="st33" d="M157.5,380.4c7,0,12.9-4,15.2-9.7c-2.3-5.6-8.2-9.7-15.2-9.7s-12.9,4-15.2,9.7
		C144.6,376.4,150.5,380.4,157.5,380.4z"/>
	<ellipse id="XMLID_245_" class="st34" cx="161.1" cy="362.3" rx="4.6" ry="5.3"/>
</g>
<g id="right-side">
	<path id="XMLID_209_" class="st0" d="M311.6,367.6c2.9,0.2,5.7-1.7,5.9-4.7c0.1-1.9-0.7-3.6-2.1-4.7c-0.2-0.8-0.8-1.4-1.8-1.1
		c-0.1,0-0.1,0.1-0.2,0.1s-0.2-0.1-0.3-0.1c-1-0.2-1.7,0.5-1.9,1.3c-1.3,1.1-2.3,2.5-2.7,4.1C308,364.9,308.9,367.4,311.6,367.6z
		 M311.7,362.5c0.4-0.8,1-1.5,1.7-2.1c0.7,0.5,1.3,1.3,1.1,2.3c-0.3,1.2-1.7,2.3-3,1.8C311,364.4,311.5,363,311.7,362.5z"/>
	<polygon id="XMLID_208_" class="st1" points="237,527.7 249,527.7 270,515.2 277.6,521.5 252.4,543.2 251.6,555.2 237,558.7 	"/>
	<polygon id="XMLID_207_" class="st2" points="277.6,521.5 289.6,505.3 289.6,517.3 269.6,541.8 262.6,541.8 255.9,553.8 242,563.1 
		243.3,575.9 282.4,584.6 237,580.8 237,558.7 252.5,554.8 252.4,543.2 	"/>
	<polygon id="XMLID_206_" class="st2" points="237,172.9 264.4,158.1 290.3,172.9 	"/>
	<polygon id="XMLID_205_" class="st2" points="253.6,244.2 283.9,264.8 327,252.8 	"/>
	<polygon id="XMLID_204_" class="st2" points="237,186.5 320.8,197.3 266.7,178.9 	"/>
	<polygon id="XMLID_203_" class="st2" points="253.6,244.2 237,219.2 237,253.1 	"/>
	<polygon id="XMLID_202_" class="st2" points="327,252.8 349.4,310.8 375.5,298.4 	"/>
	<polygon id="XMLID_201_" class="st2" points="375.8,247.2 402.6,232.6 405.6,261.7 	"/>
	<polygon id="XMLID_200_" class="st2" points="402.6,232.6 402.6,188.9 438.6,174.5 	"/>
	<polygon id="XMLID_199_" class="st2" points="349.4,310.8 349.4,347.8 372.3,347.8 	"/>
	<polygon id="XMLID_198_" class="st2" points="347.8,373.4 372.3,389.5 372.3,367.6 	"/>
	<polygon id="XMLID_197_" class="st2" points="386.3,347.8 394,317.5 408.7,368.2 	"/>
	<polygon id="XMLID_196_" class="st2" points="421.5,325.2 421.5,360.9 443.1,365 	"/>
	<polygon id="XMLID_195_" class="st2" points="338.3,410.5 359.5,401.7 353.5,426.2 	"/>
	<polygon id="XMLID_194_" class="st2" points="405.3,413.9 404,462.4 370,477.8 	"/>
	<polygon id="XMLID_193_" class="st2" points="433.4,449.1 402.3,484.5 421.5,542.5 	"/>
	<polygon id="XMLID_192_" class="st2" points="282.4,584.6 322.6,581.2 307,602.9 	"/>
	<polygon id="XMLID_191_" class="st3" points="237,172.9 248.9,166.4 237,152.1 	"/>
	<polygon id="XMLID_190_" class="st3" points="237,186.5 237,219.2 255.7,188.9 	"/>
	<polygon id="XMLID_189_" class="st3" points="327,252.8 321.3,224.8 360.9,254.5 	"/>
	<polygon id="XMLID_188_" class="st3" points="402.6,232.6 405.6,261.7 418.6,241.2 	"/>
	<polygon id="XMLID_187_" class="st3" points="421.5,325.2 409.2,321.8 421.5,360.9 	"/>
	<polygon id="XMLID_186_" class="st3" points="408.7,368.2 395.3,389.7 386.3,347.8 	"/>
	<polygon id="XMLID_185_" class="st3" points="347.8,373.4 359.5,401.7 372.3,389.5 	"/>
	<polygon id="XMLID_184_" class="st3" points="421.5,360.9 432.3,393.8 443.1,365 	"/>
	<polygon id="XMLID_183_" class="st3" points="395.3,389.7 405.3,413.9 383.3,453.8 	"/>
	<polygon id="XMLID_182_" class="st3" points="354,508.8 364.6,526.7 342.4,561.7 	"/>
	<polygon id="XMLID_181_" class="st3" points="255,206.5 279.5,203.2 327,252.8 	"/>
	<polygon id="XMLID_180_" class="st4" points="421.5,325.2 394.3,286.2 394,317.5 	"/>
	<polygon id="XMLID_179_" class="st4" points="432.3,393.8 433.4,449.1 447.6,440.8 	"/>
	<polygon id="XMLID_178_" class="st4" points="383.3,453.8 335.6,455.2 386.9,434.2 	"/>
	<polygon id="XMLID_177_" class="st4" points="402.3,484.5 392.8,513.2 421.5,542.5 	"/>
	<polygon id="XMLID_176_" class="st4" points="354,508.8 392.8,513.2 364.6,526.7 	"/>
	<polygon id="XMLID_175_" class="st4" points="349.4,310.8 312.9,338.1 326.4,313.2 	"/>
	<polygon id="XMLID_174_" class="st4" points="438.6,174.5 418.6,241.2 402.6,232.6 	"/>
	<polygon id="XMLID_173_" class="st5" points="418.6,241.2 430.1,262.1 437.7,235.7 	"/>
	<polygon id="XMLID_172_" class="st6" points="443.1,365 432.3,393.8 447.6,440.8 	"/>
	<polygon id="XMLID_171_" class="st6" points="408.7,368.2 405.3,413.9 395.3,389.7 	"/>
	<polygon id="XMLID_170_" class="st6" points="392.8,513.2 370,477.8 354,508.8 	"/>
	<polygon id="XMLID_169_" class="st6" points="370,477.8 307,436.2 341,484.5 	"/>
	<polygon id="XMLID_168_" class="st4" points="433.4,449.1 447.6,497.5 421.5,542.5 	"/>
	<polygon id="XMLID_167_" class="st6" points="360.9,254.5 375.5,298.4 394.3,286.2 	"/>
	<polygon id="XMLID_166_" class="st7" points="327,252.8 375.5,298.4 360.9,254.5 	"/>
	<polygon id="XMLID_165_" class="st7" points="237,219.2 255.7,188.9 253.6,244.2 	"/>
	<polygon id="XMLID_164_" class="st7" points="331.2,517.8 302.5,519.2 298.3,540.8 	"/>
	<polygon id="XMLID_163_" class="st8" points="281.4,386.6 284.6,429.2 305.6,405.5 	"/>
	<polygon id="XMLID_162_" class="st8" points="261,400.4 282.8,352.4 253.6,347.8 	"/>
	<polygon id="XMLID_161_" class="st8" points="261,400.4 261,475.5 275.9,453.9 	"/>
	<polygon id="XMLID_160_" class="st7" points="275.9,453.9 293.9,477.2 261,475.5 	"/>
	<polygon id="XMLID_159_" class="st8" points="293.9,477.2 289.6,505.3 261,475.5 	"/>
	<polygon id="XMLID_158_" class="st9" points="305.6,405.5 307,436.2 284.6,429.2 	"/>
	<polygon id="XMLID_157_" class="st10" points="237,317.5 253.6,347.8 237,383.5 	"/>
	<polygon id="XMLID_156_" class="st10" points="307,436.2 293.9,477.2 341,484.5 	"/>
	<polygon id="XMLID_155_" class="st10" points="284.6,429.2 275.9,453.9 307,436.2 	"/>
	<polygon id="XMLID_154_" class="st10" points="281.4,386.6 261,400.4 284.6,429.2 	"/>
	<polygon id="XMLID_153_" class="st11" points="261,400.4 282.8,352.4 281.4,386.6 	"/>
	<polygon id="XMLID_152_" class="st11" points="307,436.2 275.9,453.9 293.9,477.2 	"/>
	<polygon id="XMLID_151_" class="st11" points="338.3,410.5 320.6,391 305.6,405.5 	"/>
	<polygon id="XMLID_150_" class="st11" points="293.9,477.2 302.5,519.2 289.6,505.3 	"/>
	<polygon id="XMLID_149_" class="st12" points="320.6,391 347.8,373.4 338.3,410.5 	"/>
	<polygon id="XMLID_148_" class="st12" points="293.9,477.2 331.2,517.8 341,484.5 	"/>
	<polygon id="XMLID_147_" class="st12" points="253.6,347.8 268.2,301.8 282.8,352.4 	"/>
	<polygon id="XMLID_146_" class="st12" points="253.6,347.8 251,310.5 237,317.5 	"/>
	<polygon id="XMLID_145_" class="st12" points="305.6,405.5 307,436.2 338.3,410.5 	"/>
	<polygon id="XMLID_144_" class="st13" points="293.9,477.2 302.5,519.2 331.2,517.8 	"/>
	<polygon id="XMLID_143_" class="st13" points="307,436.2 338.3,410.5 335.6,455.1 	"/>
	<polygon id="XMLID_142_" class="st13" points="347.8,373.4 349.4,347.8 372.3,347.8 	"/>
	<polygon id="XMLID_141_" class="st13" points="268.2,301.8 237,317.5 237,253.1 	"/>
	<polygon id="XMLID_140_" class="st14" points="237,253.1 253.6,244.2 268.2,301.8 	"/>
	<polygon id="XMLID_139_" class="st14" points="261,475.5 270,515.2 277.6,521.5 289.6,505.3 	"/>
	<polygon id="XMLID_138_" class="st14" points="347.8,373.4 338.3,410.5 359.5,401.7 	"/>
	<polygon id="XMLID_137_" class="st14" points="279.5,203.2 321.3,224.8 327,252.8 	"/>
	<polygon id="XMLID_136_" class="st14" points="375.5,298.4 394,317.5 394.3,286.2 	"/>
	<polygon id="XMLID_135_" class="st15" points="253.6,244.2 268.2,301.8 283.9,264.8 	"/>
	<polygon id="XMLID_134_" class="st15" points="375.5,298.4 349.4,310.8 394,317.5 	"/>
	<polygon id="XMLID_133_" class="st15" points="372.3,347.8 372.3,389.5 386.3,347.8 	"/>
	<polygon id="XMLID_132_" class="st15" points="394,317.5 422,362.3 409.2,321.8 	"/>
	<polygon id="XMLID_131_" class="st15" points="327,252.8 255,206.5 253.6,244.2 	"/>
	<path id="XMLID_130_" class="st15" d="M331.2,517.8"/>
	<polygon id="XMLID_129_" class="st15" points="342.4,561.7 298.3,540.8 331.2,517.8 	"/>
	<polygon id="XMLID_128_" class="st15" points="394.3,286.2 431.8,296.3 421.5,325.2 	"/>
	<polygon id="XMLID_127_" class="st15" points="375.8,247.2 360.9,254.5 405.6,261.7 	"/>
	<polygon id="XMLID_126_" class="st16" points="372.3,347.8 394,317.5 386.3,347.8 	"/>
	<polygon id="XMLID_125_" class="st16" points="284.6,291.8 282.8,352.4 302.7,358 	"/>
	<polygon id="XMLID_124_" class="st16" points="372.3,389.5 395.3,389.7 386.3,347.8 	"/>
	<polygon id="XMLID_123_" class="st16" points="338.3,410.5 335.6,455.1 353.5,426.2 	"/>
	<polygon id="XMLID_122_" class="st16" points="480,550.2 421.5,542.5 447.6,497.5 	"/>
	<polygon id="XMLID_121_" class="st16" points="364.6,526.7 395.5,560.9 392.8,513.2 	"/>
	<polygon id="XMLID_120_" class="st16" points="394.3,286.2 394.6,285.6 405.6,261.7 431.8,296.3 	"/>
	<polygon id="XMLID_119_" class="st16" points="421.5,325.2 465.1,340 443.1,365 	"/>
	<polygon id="XMLID_118_" class="st17" points="431.8,296.3 421.5,325.2 465.1,340 	"/>
	<polygon id="XMLID_117_" class="st17" points="372.3,347.8 394,317.5 349.4,310.8 	"/>
	<polygon id="XMLID_116_" class="st17" points="337.9,357 347.8,373.4 349.4,347.8 	"/>
	<polygon id="XMLID_115_" class="st17" points="302.7,358 282.8,352.4 281.4,386.6 	"/>
	<polygon id="XMLID_114_" class="st17" points="302.7,358 312.9,338.1 324.1,345.1 	"/>
	<polygon id="XMLID_113_" class="st17" points="284.6,291.8 283.9,264.8 268.2,301.8 	"/>
	<polygon id="XMLID_112_" class="st17" points="327,252.8 326.4,313.2 349.4,310.8 	"/>
	<polygon id="XMLID_111_" class="st17" points="255,206.5 320.8,197.3 255.7,188.9 	"/>
	<polygon id="XMLID_110_" class="st17" points="341,484.5 331.2,517.8 354,508.8 	"/>
	<polygon id="XMLID_109_" class="st17" points="447.6,440.8 447.6,497.5 508,487.7 	"/>
	<polygon id="XMLID_108_" class="st18" points="327,252.8 296.1,283.3 326.4,313.2 	"/>
	<polygon id="XMLID_107_" class="st18" points="283.9,264.8 296.1,283.3 284.6,291.8 	"/>
	<polygon id="XMLID_106_" class="st18" points="284.6,291.8 268.2,301.8 282.8,352.4 	"/>
	<polygon id="XMLID_105_" class="st18" points="312.9,299.9 312.9,338.1 300.9,314.9 	"/>
	<polygon id="XMLID_104_" class="st18" points="465.1,340 443.1,365 480.6,382.5 	"/>
	<polygon id="XMLID_103_" class="st18" points="480.6,382.5 447.6,440.8 498.6,444 	"/>
	<polygon id="XMLID_102_" class="st18" points="372.3,389.5 386.9,434.2 395.3,389.7 	"/>
	<polygon id="XMLID_101_" class="st18" points="386.9,434.2 359.5,401.7 353.5,426.2 	"/>
	<polygon id="XMLID_100_" class="st18" points="405.3,413.9 432.3,393.8 433.4,449.1 	"/>
	<polygon id="XMLID_99_" class="st18" points="341,484.5 370,477.8 354,508.8 	"/>
	<polygon id="XMLID_98_" class="st19" points="354,508.8 331.2,517.8 342.4,561.7 	"/>
	<polygon id="XMLID_97_" class="st20" points="443.1,365 447.6,440.8 480.6,382.5 	"/>
	<polygon id="XMLID_96_" class="st20" points="432.3,393.8 408.7,368.2 405.3,413.9 	"/>
	<polygon id="XMLID_95_" class="st20" points="405.3,413.9 404,462.4 433.4,449.1 	"/>
	<polygon id="XMLID_94_" class="st20" points="359.5,401.7 372.3,389.5 386.9,434.2 	"/>
	<polygon id="XMLID_93_" class="st20" points="353.5,426.2 335.6,455.1 386.9,434.2 	"/>
	<polygon id="XMLID_92_" class="st20" points="320.6,391 302.2,383.9 305.6,405.5 	"/>
	<polygon id="XMLID_91_" class="st20" points="349.4,310.8 335.6,335.8 349.4,347.8 	"/>
	<polygon id="XMLID_90_" class="st20" points="283.9,264.8 327,252.8 296.1,283.3 	"/>
	<polygon id="XMLID_89_" class="st20" points="488.6,443.4 480.6,466.4 447.6,440.8 	"/>
	<polygon id="XMLID_88_" class="st20" points="289.6,505.3 289.6,517.3 269.6,541.8 298.3,540.8 302.5,519.2 	"/>
	<polygon id="XMLID_87_" class="st21" points="335.6,455.1 370,477.8 383.3,453.8 	"/>
	<polygon id="XMLID_86_" class="st21" points="370,477.8 402.3,484.5 433.4,449.1 	"/>
	<polygon id="XMLID_85_" class="st21" points="447.6,497.5 480,550.2 488.6,490.8 	"/>
	<polygon id="XMLID_84_" class="st21" points="408.7,368.2 422,362.3 394,317.5 	"/>
	<polygon id="XMLID_83_" class="st21" points="312.9,338.1 300.9,314.9 302.7,358 	"/>
	<polygon id="XMLID_82_" class="st21" points="324.1,345.1 335.6,335.8 349.4,347.8 	"/>
	<polygon id="XMLID_81_" class="st21" points="300.9,314.9 284.6,291.8 312.9,299.9 	"/>
	<polygon id="XMLID_80_" class="st21" points="433.4,449.1 447.6,440.8 447.6,497.5 	"/>
	<polygon id="XMLID_79_" class="st21" points="392.8,513.2 395.5,560.9 421.5,542.5 	"/>
	<polygon id="XMLID_78_" class="st21" points="421.5,542.5 465,584.6 465,548.2 	"/>
	<polygon id="XMLID_77_" class="st21" points="298.3,540.8 322.6,581.2 282.4,584.6 	"/>
	<polygon id="XMLID_76_" class="st21" points="269.6,541.8 282.4,584.6 255.9,553.8 262.6,541.8 	"/>
	<polygon id="XMLID_75_" class="st21" points="281.8,596.7 288.5,642.5 237,611.3 	"/>
	<polygon id="XMLID_74_" class="st21" points="237,611.3 237,671 254.6,647.8 	"/>
	<polygon id="XMLID_73_" class="st22" points="284.6,291.8 302.7,358 300.9,314.9 	"/>
	<polygon id="XMLID_72_" class="st22" points="372.3,347.8 347.8,373.4 372.3,367.6 	"/>
	<polygon id="XMLID_71_" class="st22" points="422,362.3 432.3,393.8 408.7,368.2 	"/>
	<polygon id="XMLID_70_" class="st22" points="370,477.8 392.8,513.2 402.3,484.5 	"/>
	<polygon id="XMLID_69_" class="st22" points="255.9,553.8 242,563.1 243.3,575.9 282.4,584.6 	"/>
	<polygon id="XMLID_68_" class="st22" points="237,611.3 263.3,665.8 275.9,634.9 	"/>
	<polygon id="XMLID_67_" class="st22" points="281.8,596.7 288.5,642.5 310.4,611.3 	"/>
	<polygon id="XMLID_66_" class="st22" points="364.6,526.7 342.4,561.7 395.5,560.9 	"/>
	<polygon id="XMLID_65_" class="st22" points="421.5,542.5 430.8,584.2 395.5,560.9 	"/>
	<polygon id="XMLID_64_" class="st23" points="298.3,540.8 322.6,581.2 342.4,561.7 	"/>
	<polygon id="XMLID_63_" class="st23" points="298.3,540.8 269.6,541.8 282.4,584.6 	"/>
	<polygon id="XMLID_62_" class="st24" points="281.8,596.7 237,580.8 237,611.3 	"/>
	<polygon id="XMLID_61_" class="st24" points="281.8,596.7 282.4,584.6 335.1,623.9 	"/>
	<polygon id="XMLID_60_" class="st24" points="342.4,561.7 403.2,602.4 395.5,560.9 	"/>
	<polygon id="XMLID_59_" class="st24" points="421.5,542.5 427.2,568.2 465,584.6 	"/>
	<polygon id="XMLID_58_" class="st25" points="281.8,596.7 282.4,584.6 237,580.8 	"/>
	<polygon id="XMLID_57_" class="st25" points="307,602.9 322.6,581.2 335.1,623.9 	"/>
	<polygon id="XMLID_56_" class="st25" points="342.4,561.7 338.4,596.1 403.2,602.4 	"/>
	<polygon id="XMLID_55_" class="st25" points="405.6,261.7 430.1,262.1 418.8,279.2 	"/>
	<polygon id="XMLID_54_" class="st25" points="418.6,241.2 469.3,206.5 438.6,174.5 	"/>
	<polygon id="XMLID_53_" class="st25" points="438.6,174.5 423.6,122.4 402.6,188.9 	"/>
	<polygon id="XMLID_52_" class="st25" points="423.6,122.4 372.3,148.2 397.5,128.2 	"/>
	<polygon id="XMLID_51_" class="st18" points="431.8,296.3 477.8,335.8 465.1,340 	"/>
	<polygon id="XMLID_50_" class="st26" points="322.6,581.2 342.4,561.7 335.1,623.9 	"/>
	<polygon id="XMLID_49_" class="st27" points="349.4,310.8 335.6,335.8 312.9,338.1 	"/>
	<polygon id="XMLID_48_" class="st27" points="312.9,299.9 312.9,338.1 326.4,313.2 	"/>
	<polygon id="XMLID_47_" class="st27" points="284.6,291.8 296.1,283.3 312.9,299.9 	"/>
	<polygon id="XMLID_46_" class="st27" points="418.6,241.2 405.6,261.7 430.1,262.1 	"/>
	<polygon id="XMLID_45_" class="st27" points="402.6,188.9 375.8,247.2 402.6,232.6 	"/>
	<polygon id="XMLID_44_" class="st21" points="337.9,357 320.6,391 347.8,373.4 	"/>
	<polygon id="XMLID_43_" class="st24" points="320.6,391 302.2,383.9 324.4,383.6 	"/>
	<polygon id="XMLID_42_" class="st24" points="302.2,383.9 296.1,398 305.6,405.5 	"/>
	<polygon id="XMLID_41_" class="st16" points="312.9,338.1 335.6,335.8 324.1,345.1 	"/>
	<polygon id="XMLID_34_" class="st11" points="251,310.5 268.2,301.8 253.6,347.8 	"/>
	<polygon id="XMLID_33_" class="st22" points="270,515.2 237,501.1 249,527.7 	"/>
	<polygon id="XMLID_32_" class="st24" points="249,527.7 237,501.1 237,527.7 	"/>
	<polygon id="XMLID_31_" class="st13" points="237,501.1 261,475.5 270,515.2 	"/>
	<polygon id="XMLID_30_" class="st28" points="261,475.5 237,436.2 237,501.1 	"/>
	<polygon id="XMLID_29_" class="st29" points="261,475.5 261,400.4 237,436.2 	"/>
	<polygon id="XMLID_28_" class="st29" points="261,400.4 275.9,453.9 284.6,429.2 	"/>
	<polygon id="XMLID_27_" class="st9" points="261,400.4 237,383.5 237,417.1 	"/>
	<polygon id="XMLID_26_" class="st30" points="261,400.4 253.6,347.8 237,383.5 	"/>
	<polygon id="XMLID_25_" class="st28" points="261,400.4 237,436.2 237,417.1 	"/>
	<polygon id="XMLID_24_" class="st13" points="320.8,197.3 337.1,174 349.4,207.8 	"/>
	<polygon id="XMLID_23_" class="st31" points="320.8,197.3 290.3,172.9 337.1,174 	"/>
	<polygon id="XMLID_22_" class="st31" points="290.3,172.9 237,186.5 237,172.9 	"/>
	<polygon id="XMLID_21_" class="st13" points="320.8,197.3 266.7,178.9 290.3,172.9 	"/>
	<polygon id="XMLID_20_" class="st32" points="290.3,172.9 264.4,158.1 337.1,174 	"/>
	<polygon id="XMLID_19_" class="st32" points="264.4,158.1 237,152.1 248.9,166.4 	"/>
	<polygon id="XMLID_18_" class="st8" points="237,152.1 296.1,144.8 237,134.9 	"/>
	<polygon id="XMLID_17_" class="st7" points="237,152.1 337.1,174 296.1,144.8 	"/>
	<polygon id="XMLID_16_" class="st20" points="321.3,224.8 320.8,197.3 279.5,203.2 	"/>
	<polygon id="XMLID_15_" class="st32" points="360.9,254.5 394.3,286.2 405.6,261.7 	"/>
	<polygon id="XMLID_14_" class="st32" points="360.9,254.5 349.4,207.8 375.8,247.2 	"/>
	<polygon id="XMLID_13_" class="st17" points="320.8,197.3 360.9,254.5 349.4,207.8 	"/>
	<polygon id="XMLID_12_" class="st18" points="321.3,224.8 331.9,213.3 320.8,197.3 	"/>
	<polygon id="XMLID_11_" class="st18" points="321.3,224.8 340,224.8 360.9,254.5 	"/>
	<polygon id="XMLID_10_" class="st6" points="321.3,224.8 331.9,213.3 340,224.8 	"/>
	<polygon id="XMLID_9_" class="st32" points="349.4,207.8 372.3,148.2 337.1,174 	"/>
	<polygon id="XMLID_8_" class="st29" points="438.6,174.5 459.3,140.8 423.6,122.4 	"/>
	<polygon id="XMLID_7_" class="st9" points="438.6,174.5 459.3,140.8 469.3,206.5 	"/>
	<polygon id="XMLID_6_" class="st16" points="372.3,148.2 402.6,188.9 423.6,122.4 	"/>
	<polygon id="XMLID_5_" class="st17" points="372.3,148.2 349.4,207.8 402.6,188.9 	"/>
	<polygon id="XMLID_4_" class="st21" points="349.4,207.8 375.8,247.2 402.6,188.9 	"/>
	<path id="XMLID_40_" class="st2" d="M308.4,353.1l15.8-8l25.3,2.8L338,357c0,0,8.2,34.5-35.7,27l-6.2,14.1l-14.7-11.5l22.1-29.6
		L308.4,353.1z"/>
	<path id="XMLID_39_" class="st6" d="M316.5,361.1c-7,0-12.9,4-15.2,9.7c-0.6-1.6-1-3.2-1-5c0-8.1,7.2-14.7,16.2-14.7
		c8.9,0,16.2,6.6,16.2,14.7c0,1.8-0.4,3.4-1,5C329.4,365.1,323.5,361.1,316.5,361.1z"/>
	<path id="XMLID_38_" class="st33" d="M316.5,380.4c-7,0-12.9-4-15.2-9.7c2.3-5.6,8.2-9.7,15.2-9.7s12.9,4,15.2,9.7
		C329.4,376.4,323.5,380.4,316.5,380.4z"/>
	<ellipse id="XMLID_36_" class="st34" cx="312.9" cy="362.3" rx="4.6" ry="5.3"/>
</g>
</svg>

<div class="myName">
	<img src="http://s16.postimg.org/5pkq5jm3l/avatar1.jpg">
	<a href="https://www.facebook.com/profile.php?id=100001865665027" target="_blank"> Eslam nasser</a>
</div>

css

/* Colors */

.st0 {
  fill: #FFE475;
}

.st1 {
  fill: #C26C47;
}

.st2 {
  fill: #49312D;
}

.st3 {
  fill: #604219;
}

.st4 {
  fill: #554D4D;
}

.st5 {
  fill: #635723;
}

.st6 {
  fill: #84712C;
}

.st7 {
  fill: #947158;
}

.st8 {
  fill: #C07E48;
}

.st9 {
  fill: #C98777;
}

.st10 {
  fill: #DF9126;
}

.st11 {
  fill: #F68C47;
}

.st12 {
  fill: #FBAD23;
}

.st13 {
  fill: #F8B26C;
}

.st14 {
  fill: #EEC075;
}

.st15 {
  fill: #F6DC8F;
}

.st16 {
  fill: #EAD4B5;
}

.st17 {
  fill: #EADDCE;
}

.st18 {
  fill: #FEF8CC;
}

.st19 {
  fill: #FEFDF4;
}

.st20 {
  fill: #E9E9EA;
}

.st21 {
  fill: #BBBCAC;
}

.st22 {
  fill: #C9C0AD;
}

.st23 {
  fill: #D3C8C2;
}

.st24 {
  fill: #AFA49F;
}

.st25 {
  fill: #8D7D71;
}

.st26 {
  fill: #B5AD6E;
}

.st27 {
  fill: #787FA0;
}

.st28 {
  fill: #E1AFA3;
}

.st29 {
  fill: #D69385;
}

.st30 {
  fill: #C69849;
}

.st31 {
  fill: #FAA64C;
}

.st32 {
  fill: #FFD386;
}

.st33 {
  fill: #D1C76D;
}

.st34 {
  fill: #56481C;
}

/* Reset */

body,
html {
  height: 100%;
  background-color: red;
  background: -webkit-linear-gradient(335deg, #3498db, #2c3e50) no-repeat fixed;
  background: linear-gradient(115deg, #3498db, #2c3e50) no-repeat fixed;
  margin: 0;
  padding: 0
}

.myName {
  position: absolute;
  top: 1em;
  left: 1em;
  padding: 5px 15px;
  color: #FFF;
  font-family: arial;
  width: 30%;
}

.myName a {
  color: #FFF;
  text-decoration: none;
  font-size: 1.3em;
  font-weight: normal;
  float: left;
  margin-top: 3%;
  margin-left: 3%;
}

.myName a:hover {
  text-decoration: underline;
}

.myName img {
  width: 50px;
  border-radius: 50%;
  float: left;
}

.layer {
  position: absolute;
  width: 40vw;
  height: 41vw;
  top: 50%;
  left: 50%;
  margin-left: -20vw;
  margin-top: -18vw;
  z-index: 2;
  cursor: pointer
}

svg {
  position: absolute;
  top: 15%;
  right: 0;
  left: 50%;
  bottom: 0;
  margin-left: -20vw;
  width: 40vw;
  overflow: visible;
  z-index: 1;
}

polygon,
path,
ellipse {
  fill-opacity: 1;
  -webkit-transform: translate(0);
  transform: translate(0);
  -webkit-transition: all 1s ease;
  transition: all 1s ease;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  stroke-dasharray: 500;
  stroke-dashoffset: 500;
}

/*=========================
	 Right Side Stuff
/*=======================*/

#right-side polygon:nth-of-type(5n+1),
#right-side path:nth-of-type(5n+1),
#right-side ellipse {
  -webkit-animation: backToPlace1 8s ease-in-out 1;
  animation: backToPlace1 8s ease-in-out 1;
}

@-webkit-keyframes backToPlace1 {
  0% {
    -webkit-transform: translate(300%, 300%) scale(1) rotate(180deg);
    transform: translate(300%, 300%) scale(1) rotate(180deg);
    fill-opacity: 0;
    stroke-width: .15px;
  }
  100% {
    -webkit-transform: translate(0) scale(1) rotate(0);
    transform: translate(0) scale(1) rotate(0);
    fill-opacity: 1;
    stroke-width: 0;
    stroke-dashoffset: 0;
  }
}

@keyframes backToPlace1 {
  0% {
    -webkit-transform: translate(300%, 300%) scale(1) rotate(180deg);
    transform: translate(300%, 300%) scale(1) rotate(180deg);
    fill-opacity: 0;
    stroke-width: .15px;
  }
  100% {
    -webkit-transform: translate(0) scale(1) rotate(0);
    transform: translate(0) scale(1) rotate(0);
    fill-opacity: 1;
    stroke-width: 0;
    stroke-dashoffset: 0;
  }
}

#right-side polygon:nth-of-type(5n+2),
#right-side path:nth-of-type(5n+2) {
  -webkit-animation: backToPlace2 8s ease-in-out 1;
  animation: backToPlace2 8s ease-in-out 1;
}

@-webkit-keyframes backToPlace2 {
  0% {
    -webkit-transform: translate(-300%, -300%) scale(1) rotate(180deg) translateZ(-400px);
    transform: translate(-300%, -300%) scale(1) rotate(180deg) translateZ(-400px);
    fill-opacity: 0;
    stroke-width: .15px;
  }
  100% {
    -webkit-transform: translate(0) scale(1) rotate(0);
    transform: translate(0) scale(1) rotate(0);
    fill-opacity: 1;
    stroke-width: 0;
    stroke-dashoffset: 0;
  }
}

@keyframes backToPlace2 {
  0% {
    -webkit-transform: translate(-300%, -300%) scale(1) rotate(180deg) translateZ(-400px);
    transform: translate(-300%, -300%) scale(1) rotate(180deg) translateZ(-400px);
    fill-opacity: 0;
    stroke-width: .15px;
  }
  100% {
    -webkit-transform: translate(0) scale(1) rotate(0);
    transform: translate(0) scale(1) rotate(0);
    fill-opacity: 1;
    stroke-width: 0;
    stroke-dashoffset: 0;
  }
}

#right-side polygon:nth-of-type(5n+3),
#right-side path:nth-of-type(5n+3) {
  -webkit-animation: backToPlace3 8s ease-in-out 1;
  animation: backToPlace3 8s ease-in-out 1;
}

@-webkit-keyframes backToPlace3 {
  0% {
    -webkit-transform: translate(200%, -400%) scale(1.5) rotate(50deg) translateZ(400px);
    transform: translate(200%, -400%) scale(1.5) rotate(50deg) translateZ(400px);
    fill-opacity: 0;
    stroke-width: .15px;
  }
  100% {
    -webkit-transform: translate(0) scale(1) rotate(0);
    transform: translate(0) scale(1) rotate(0);
    fill-opacity: 1;
    stroke-width: 0;
    stroke-dashoffset: 0;
  }
}

@keyframes backToPlace3 {
  0% {
    -webkit-transform: translate(200%, -400%) scale(1.5) rotate(50deg) translateZ(400px);
    transform: translate(200%, -400%) scale(1.5) rotate(50deg) translateZ(400px);
    fill-opacity: 0;
    stroke-width: .15px;
  }
  100% {
    -webkit-transform: translate(0) scale(1) rotate(0);
    transform: translate(0) scale(1) rotate(0);
    fill-opacity: 1;
    stroke-width: 0;
    stroke-dashoffset: 0;
  }
}

#right-side polygon:nth-of-type(5n+4),
#right-side path:nth-of-type(5n+4),
#right-side polygon:nth-of-type(5n+5),
#right-side path:nth-of-type(5n+5) {
  -webkit-animation: backToPlace4 8s ease-in-out 1;
  animation: backToPlace4 8s ease-in-out 1;
}

@-webkit-keyframes backToPlace4 {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0
  }
  10% {
    -webkit-transform: scale(.1);
    transform: scale(.1);
  }
  20% {
    -webkit-transform: scale(.2);
    transform: scale(.2);
  }
  30% {
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }
  40% {
    -webkit-transform: scale(.4);
    transform: scale(.4);
  }
  50% {
    -webkit-transform: scale(.5);
    transform: scale(.5);
  }
  60% {
    -webkit-transform: scale(.6);
    transform: scale(.6);
  }
  70% {
    -webkit-transform: scale(.7);
    transform: scale(.7);
  }
  80% {
    -webkit-transform: scale(.8);
    transform: scale(.8);
  }
  90% {
    -webkit-transform: scale(.9);
    transform: scale(.9);
  }
  100% {
    -webkit-transform: translate(0) scale(1);
    transform: translate(0) scale(1);
    fill-opacity: 1;
    stroke-width: 0;
    stroke-dashoffset: 0;
  }
}

@keyframes backToPlace4 {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0
  }
  10% {
    -webkit-transform: scale(.1);
    transform: scale(.1);
  }
  20% {
    -webkit-transform: scale(.2);
    transform: scale(.2);
  }
  30% {
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }
  40% {
    -webkit-transform: scale(.4);
    transform: scale(.4);
  }
  50% {
    -webkit-transform: scale(.5);
    transform: scale(.5);
  }
  60% {
    -webkit-transform: scale(.6);
    transform: scale(.6);
  }
  70% {
    -webkit-transform: scale(.7);
    transform: scale(.7);
  }
  80% {
    -webkit-transform: scale(.8);
    transform: scale(.8);
  }
  90% {
    -webkit-transform: scale(.9);
    transform: scale(.9);
  }
  100% {
    -webkit-transform: translate(0) scale(1);
    transform: translate(0) scale(1);
    fill-opacity: 1;
    stroke-width: 0;
    stroke-dashoffset: 0;
  }
}

/* Hover Animation */

/**/

.layer:hover + svg #right-side polygon:nth-of-type(5n+1),
.layer:hover + svg #right-side path:nth-of-type(5n+1) {
  -webkit-transform: translate(200%, -600%) scale(1.5) rotate(100deg) translateZ(0);
  transform: translate(200%, -600%) scale(1.5) rotate(100deg) translateZ(0);
  opacity: .3;
}

/**/

.layer:hover + svg #right-side polygon:nth-of-type(5n+2),
.layer:hover + svg #right-side path:nth-of-type(5n+2) {
  -webkit-transform: translate(800%, -600%) scale(.5) rotate(100deg) translateZ(0);
  transform: translate(800%, -600%) scale(.5) rotate(100deg) translateZ(0);
  opacity: .3;
  fill-opacity: 0;
  stroke-width: .5px;
  stroke: #FFF;
  stroke-dashoffset: 0;
}

/**/

.layer:hover + svg #right-side polygon:nth-of-type(5n+3),
.layer:hover + svg #right-side path:nth-of-type(5n+3) {
  -webkit-transform: translate(1000%, 0) scale(1.5) rotate(100deg) translateZ(0);
  transform: translate(1000%, 0) scale(1.5) rotate(100deg) translateZ(0);
  opacity: .3;
}

/**/

.layer:hover + svg #right-side polygon:nth-of-type(5n+4),
.layer:hover + svg #right-side path:nth-of-type(5n+4) {
  -webkit-transform: translate(1000%, 600%) scale(1) rotate(100deg) translateZ(0);
  transform: translate(1000%, 600%) scale(1) rotate(100deg) translateZ(0);
  opacity: .3;
  fill-opacity: 0;
  stroke-width: .5px;
  stroke: #FFF;
  stroke-dashoffset: 0;
}

/**/

.layer:hover + svg #right-side polygon:nth-of-type(5n+5),
.layer:hover + svg #right-side path:nth-of-type(5n+5),
.layer:hover + svg #right-side ellipse {
  -webkit-transform: translate(0, 1000%) scale(.5) rotate(100deg) translateZ(0);
  transform: translate(0, 1000%) scale(.5) rotate(100deg) translateZ(0);
  opacity: .3;
}

/*=========================
	 Left Side Stuff
/*=======================*/

/* Animate Stroke  */

svg #left-side polygon:nth-of-type(n+1),
svg #left-side path:nth-of-type(n+1),
svg #left-side ellipse {
  fill-opacity: 0;
  stroke: #fafafa;
  stroke-width: .5px;
  stroke-dasharray: 600;
  stroke-dashoffset: 600;
  -webkit-animation: dash 8s ease-in-out 1;
  animation: dash 8s ease-in-out 1;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes dash {
  to {
    stroke-dashoffset: 600;
    fill-opacity: 0;
  }
  to {
    stroke-dashoffset: 0;
    fill-opacity: 1;
    stroke-width: 0;
  }
}

@keyframes dash {
  to {
    stroke-dashoffset: 600;
    fill-opacity: 0;
  }
  to {
    stroke-dashoffset: 0;
    fill-opacity: 1;
    stroke-width: 0;
  }
}

/* Hover Animation*/

.layer:hover + svg #left-side polygon:nth-of-type(5n+1),
.layer:hover + svg #left-side path:nth-of-type(5n+1) {
  -webkit-transform: translate(-400%, -400%) scale(1.5) rotate(200deg) translateZ(0);
  transform: translate(-400%, -400%) scale(1.5) rotate(200deg) translateZ(0);
  opacity: .3
}

/**/

.layer:hover + svg #left-side polygon:nth-of-type(5n+2),
.layer:hover + svg #left-side path:nth-of-type(5n+2) {
  -webkit-transform: translate(-800%, -100%) scale(1) rotate(100deg) translateZ(0);
  transform: translate(-800%, -100%) scale(1) rotate(100deg) translateZ(0);
  opacity: .3;
  fill-opacity: 0;
  stroke-width: .5px;
  stroke: #FFF;
  stroke-dashoffset: 0;
}

/**/

.layer:hover + svg #left-side polygon:nth-of-type(5n+3),
.layer:hover + svg #left-side path:nth-of-type(5n+3) {
  -webkit-transform: translate(-800%, 100%) scale(.5) rotate(0) translateZ(0);
  transform: translate(-800%, 100%) scale(.5) rotate(0) translateZ(0);
  opacity: .3;
  fill-opacity: 0;
  stroke-width: .5px;
  stroke: #FFF;
  stroke-dashoffset: 0;
}

/**/

.layer:hover + svg #left-side polygon:nth-of-type(5n+4),
.layer:hover + svg #left-side path:nth-of-type(5n+4) {
  -webkit-transform: translate(-800%, 500%) scale(.9) rotate(300deg) translateZ(0);
  transform: translate(-800%, 500%) scale(.9) rotate(300deg) translateZ(0);
  opacity: .5
}

/**/

.layer:hover + svg #left-side polygon:nth-of-type(5n+5),
.layer:hover + svg #left-side path:nth-of-type(5n+5),
.layer:hover + svg #left-side ellipse {
  -webkit-transform: translate(0, 900%) scale(1.3) rotate(300deg) translateZ(0);
  transform: translate(0, 900%) scale(1.3) rotate(300deg) translateZ(0);
  opacity: .3
}

JavaScript

粒子时间文字 hover canvas 3d 游戏音乐火焰水波轮播图鼠标跟随动画 css 加载动画导航菜单按钮滑块 tab 弹出层统计图 svg