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

Pen Settings

CSS Base

Vendor Prefixing

Add External CSS

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

Quick-add: + add another resource

Add External JavaScript

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

Quick-add: + add another resource

Code Indentation

     

Save Automatically?

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

Auto-Updating Preview

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

            
              <h1>"elephant by wall allure 2013" Recreated in CSS</h1>
<div class="images">
<div class="canvas">
	<div class="el" id="el-001"></div>
	<div class="el" id="el-002"></div>
	<div class="el" id="el-003"></div>
	<div class="el" id="el-004"></div>
	<div class="el" id="el-005"></div>
	<div class="el" id="el-006"></div>
	<div class="el" id="el-007"></div>
	<div class="el" id="el-008"></div>
	<div class="el" id="el-009"></div>
	<div class="el" id="el-010"></div>
	<div class="el" id="el-011"></div>
	<div class="el" id="el-012"></div>
	<div class="el" id="el-013"></div>
	<div class="el" id="el-014"></div>
	<div class="el" id="el-015"></div>
	<div class="el" id="el-016"></div>
	<div class="el" id="el-017"></div>
	<div class="el" id="el-018"></div>
	<div class="el" id="el-019"></div>
	<div class="el" id="el-020"></div>
	<div class="el" id="el-021"></div>
	<div class="el" id="el-022"></div>
	<div class="el" id="el-023"></div>
	<div class="el" id="el-024"></div>
	<div class="el" id="el-025"></div>
	<div class="el" id="el-026"></div>
	<div class="el" id="el-027"></div>
	<div class="el" id="el-028"></div>
	<div class="el" id="el-029"></div>
	<div class="el" id="el-030"></div>
	<div class="el" id="el-031"></div>
	<div class="el" id="el-032"></div>
	<div class="el" id="el-033"></div>
	<div class="el" id="el-034"></div>
	<div class="el" id="el-035"></div>
	<div class="el" id="el-036"></div>
	<div class="el" id="el-037"></div>
	<div class="el" id="el-038"></div>
	<div class="el" id="el-039"></div>
	<div class="el" id="el-040"></div>
	<div class="el" id="el-041"></div>
	<div class="el" id="el-042"></div>
	<div class="el" id="el-043"></div>
	<div class="el" id="el-044"></div>
	<div class="el" id="el-045"></div>
	<div class="el" id="el-046"></div>
	<div class="el" id="el-047"></div>
	<div class="el" id="el-048"></div>
	<div class="el" id="el-049"></div>
	<div class="el" id="el-050"></div>
	<div class="el" id="el-051"></div>
	<div class="el" id="el-052"></div>
	<div class="el" id="el-053"></div>
	<div class="el" id="el-054"></div>
	<div class="el" id="el-055"></div>
	<div class="el" id="el-056"></div>
	<div class="el" id="el-057"></div>
	<div class="el" id="el-058"></div>
	<div class="el" id="el-059"></div>
	<div class="el" id="el-060"></div>
	<div class="el" id="el-061"></div>
	<div class="el" id="el-062"></div>
	<div class="el" id="el-063"></div>
	<div class="el" id="el-064"></div>
	<div class="el" id="el-065"></div>
	<div class="el" id="el-066"></div>
	<div class="el" id="el-067"></div>
	<div class="el" id="el-068"></div>
	<div class="el" id="el-069"></div>
	<div class="el" id="el-070"></div>
	<div class="el" id="el-071"></div>
	<div class="el" id="el-072"></div>
	<div class="el" id="el-073"></div>
	<div class="el" id="el-074"></div>
	<div class="el" id="el-075"></div>
	<div class="el" id="el-076"></div>
	<div class="el" id="el-077"></div>
	<div class="el" id="el-078"></div>
	<div class="el" id="el-079"></div>
	<div class="el" id="el-080"></div>
	<div class="el" id="el-081"></div>
	<div class="el" id="el-082"></div>
	<div class="el" id="el-083"></div>
	<div class="el" id="el-084"></div>
	<div class="el" id="el-085"></div>
	<div class="el" id="el-086"></div>
	<div class="el" id="el-087"></div>
	<div class="el" id="el-088"></div>
	<div class="el" id="el-089"></div>
	<div class="el" id="el-090"></div>
	<div class="el" id="el-091"></div>
	<div class="el" id="el-092"></div>
	<div class="el" id="el-093"></div>
	<div class="el" id="el-094"></div>
	<div class="el" id="el-095"></div>
	<div class="el" id="el-096"></div>
	<div class="el" id="el-097"></div>
	<div class="el" id="el-098"></div>
	<div class="el" id="el-099"></div>
	<div class="el" id="el-100"></div>
	<div class="el" id="el-101"></div>
	<div class="el" id="el-102"></div>
	<div class="el" id="el-103"></div>
	<div class="el" id="el-104"></div>
	<div class="el" id="el-105"></div>
	<div class="el" id="el-106"></div>
	<div class="el" id="el-107"></div>
	<div class="el" id="el-108"></div>
	<div class="el" id="el-109"></div>
	<div class="el" id="el-110"></div>
	<div class="el" id="el-111"></div>
	<div class="el" id="el-112"></div>
	<div class="el" id="el-113"></div>
	<div class="el" id="el-114"></div>
	<div class="el" id="el-115"></div>
	<div class="el" id="el-116"></div>
	<div class="el" id="el-117"></div>
	<div class="el" id="el-118"></div>
	<div class="el" id="el-119"></div>
	<div class="el" id="el-120"></div>
	<div class="el" id="el-121"></div>
	<div class="el" id="el-122"></div>
	<div class="el" id="el-123"></div>
	<div class="el" id="el-124"></div>
	<div class="el" id="el-125"></div>
	<div class="el" id="el-126"></div>
	<div class="el" id="el-127"></div>
	<div class="el" id="el-128"></div>
	<div class="el" id="el-129"></div>
	<div class="el" id="el-130"></div>
	<div class="el" id="el-131"></div>
	<div class="el" id="el-132"></div>
	<div class="el" id="el-133"></div>
	<div class="el" id="el-134"></div>
	<div class="el" id="el-135"></div>
	<div class="el" id="el-136"></div>
	<div class="el" id="el-137"></div>
	<div class="el" id="el-138"></div>
	<div class="el" id="el-139"></div>
	<div class="el" id="el-140"></div>
	<div class="el" id="el-141"></div>
	<div class="el" id="el-142"></div>
	<div class="el" id="el-143"></div>
	<div class="el" id="el-144"></div>
	<div class="el" id="el-145"></div>
	<div class="el" id="el-146"></div>
	<div class="el" id="el-147"></div>
	<div class="el" id="el-148"></div>
	<div class="el" id="el-149"></div>
	<div class="el" id="el-150"></div>
	<div class="el" id="el-151"></div>
	<div class="el" id="el-152"></div>
	<div class="el" id="el-153"></div>
	<div class="el" id="el-154"></div>
	<div class="el" id="el-155"></div>
	<div class="el" id="el-156"></div>
	<div class="el" id="el-157"></div>
	<div class="el" id="el-158"></div>
	<div class="el" id="el-159"></div>
	<div class="el" id="el-160"></div>
	<div class="el" id="el-161"></div>
	<div class="el" id="el-162"></div>
	<div class="el" id="el-163"></div>
	<div class="el" id="el-164"></div>
	<div class="el" id="el-165"></div>
	<div class="el" id="el-166"></div>
	<div class="el" id="el-167"></div>
	<div class="el" id="el-168"></div>
	<div class="el" id="el-169"></div>
	<div class="el" id="el-170"></div>
	<div class="el" id="el-171"></div>
	<div class="el" id="el-172"></div>
	<div class="el" id="el-173"></div>
	<div class="el" id="el-174"></div>
	<div class="el" id="el-175"></div>
	<div class="el" id="el-176"></div>
	<div class="el" id="el-177"></div>
	<div class="el" id="el-178"></div>
	<div class="el" id="el-179"></div>
	<div class="el" id="el-180"></div>
	<div class="el" id="el-181"></div>
	<div class="el" id="el-182"></div>
	<div class="el" id="el-183"></div>
	<div class="el" id="el-184"></div>
	<div class="el" id="el-185"></div>
	<div class="el" id="el-186"></div>
	<div class="el" id="el-187"></div>
	<div class="el" id="el-188"></div>
	<div class="el" id="el-189"></div>
	<div class="el" id="el-190"></div>
	<div class="el" id="el-191"></div>
	<div class="el" id="el-192"></div>
	<div class="el" id="el-193"></div>
	<div class="el" id="el-194"></div>
	<div class="el" id="el-195"></div>
	<div class="el" id="el-196"></div>
	<div class="el" id="el-197"></div>
	<div class="el" id="el-198"></div>
	<div class="el" id="el-199"></div>
	<div class="el" id="el-200"></div>
	<div class="el" id="el-201"></div>
	<div class="el" id="el-202"></div>
	<div class="el" id="el-203"></div>
	<div class="el" id="el-204"></div>
	<div class="el" id="el-205"></div>
	<div class="el" id="el-206"></div>
	<div class="el" id="el-207"></div>
	<div class="el" id="el-208"></div>
	<div class="el" id="el-209"></div>
	<div class="el" id="el-210"></div>
	<div class="el" id="el-211"></div>
	<div class="el" id="el-212"></div>
	<div class="el" id="el-213"></div>
	<div class="el" id="el-214"></div>
	<div class="el" id="el-215"></div>
	<div class="el" id="el-216"></div>
	<div class="el" id="el-217"></div>
	<div class="el" id="el-218"></div>
	<div class="el" id="el-219"></div>
	<div class="el" id="el-220"></div>
	<div class="el" id="el-221"></div>
	<div class="el" id="el-222"></div>
	<div class="el" id="el-223"></div>
	<div class="el" id="el-224"></div>
	<div class="el" id="el-225"></div>
	<div class="el" id="el-226"></div>
	<div class="el" id="el-227"></div>
	<div class="el" id="el-228"></div>
	<div class="el" id="el-229"></div>
	<div class="el" id="el-230"></div>
	<div class="el" id="el-231"></div>
	<div class="el" id="el-232"></div>
	<div class="el" id="el-233"></div>
	<div class="el" id="el-234"></div>
	<div class="el" id="el-235"></div>
	<div class="el" id="el-236"></div>
	<div class="el" id="el-237"></div>
	<div class="el" id="el-238"></div>
	<div class="el" id="el-239"></div>
	<div class="el" id="el-240"></div>
	<div class="el" id="el-241"></div>
	<div class="el" id="el-242"></div>
	<div class="el" id="el-243"></div>
	<div class="el" id="el-244"></div>
	<div class="el" id="el-245"></div>
	<div class="el" id="el-246"></div>
	<div class="el" id="el-247"></div>
	<div class="el" id="el-248"></div>
	<div class="el" id="el-249"></div>
	<div class="el" id="el-250"></div>
	<div class="el" id="el-251"></div>
	<div class="el" id="el-252"></div>
	<div class="el" id="el-253"></div>
	<div class="el" id="el-254"></div>
	<div class="el" id="el-255"></div>
	<div class="el" id="el-256"></div>
	<div class="el" id="el-257"></div>
	<div class="el" id="el-258"></div>
	<div class="el" id="el-259"></div>
	<div class="el" id="el-260"></div>
	<div class="el" id="el-261"></div>
	<div class="el" id="el-262"></div>
	<div class="el" id="el-263"></div>
	<div class="el" id="el-264"></div>
	<div class="el" id="el-265"></div>
	<div class="el" id="el-266"></div>
	<div class="el" id="el-267"></div>
	<div class="el" id="el-268"></div>
	<div class="el" id="el-269"></div>
	<div class="el" id="el-270"></div>
	<div class="el" id="el-271"></div>
	<div class="el" id="el-272"></div>
	<div class="el" id="el-273"></div>
	<div class="el" id="el-274"></div>
	<div class="el" id="el-275"></div>
	<div class="el" id="el-276"></div>
	<div class="el" id="el-277"></div>
	<div class="el" id="el-278"></div>
	<div class="el" id="el-279"></div>
	<div class="el" id="el-280"></div>
	<div class="el" id="el-281"></div>
	<div class="el" id="el-282"></div>
	<div class="el" id="el-283"></div>
	<div class="el" id="el-284"></div>
	<div class="el" id="el-285"></div>
	<div class="el" id="el-286"></div>
	<div class="el" id="el-287"></div>
	<div class="el" id="el-288"></div>
	<div class="el" id="el-289"></div>
	<div class="el" id="el-290"></div>
	<div class="el" id="el-291"></div>
	<div class="el" id="el-292"></div>
	<div class="el" id="el-293"></div>
	<div class="el" id="el-294"></div>
	<div class="el" id="el-295"></div>
	<div class="el" id="el-296"></div>
	<div class="el" id="el-297"></div>
	<div class="el" id="el-298"></div>
	<div class="el" id="el-299"></div>
	<div class="el" id="el-300"></div>
	<div class="el" id="el-301"></div>
	<div class="el" id="el-302"></div>
	<div class="el" id="el-303"></div>
	<div class="el" id="el-304"></div>
	<div class="el" id="el-305"></div>
	<div class="el" id="el-306"></div>
	<div class="el" id="el-307"></div>
	<div class="el" id="el-308"></div>
	<div class="el" id="el-309"></div>
	<div class="el" id="el-310"></div>
	<div class="el" id="el-311"></div>
	<div class="el" id="el-312"></div>
	<div class="el" id="el-313"></div>
	<div class="el" id="el-314"></div>
	<div class="el" id="el-315"></div>
	<div class="el" id="el-316"></div>
	<div class="el" id="el-317"></div>
	<div class="el" id="el-318"></div>
	<div class="el" id="el-319"></div>
	<div class="el" id="el-320"></div>
	<div class="el" id="el-321"></div>
	<div class="el" id="el-322"></div>
	<div class="el" id="el-323"></div>
	<div class="el" id="el-324"></div>
	<div class="el" id="el-325"></div>
	<div class="el" id="el-326"></div>
	<div class="el" id="el-327"></div>
	<div class="el" id="el-328"></div>
	<div class="el" id="el-329"></div>
	<div class="el" id="el-330"></div>
	<div class="el" id="el-331"></div>
	<div class="el" id="el-332"></div>
	<div class="el" id="el-333"></div>
	<div class="el" id="el-334"></div>
	<div class="el" id="el-335"></div>
	<div class="el" id="el-336"></div>
	<div class="el" id="el-337"></div>
	<div class="el" id="el-338"></div>
	<div class="el" id="el-339"></div>
	<div class="el" id="el-340"></div>
	<div class="el" id="el-341"></div>
	<div class="el" id="el-342"></div>
	<div class="el" id="el-343"></div>
	<div class="el" id="el-344"></div>
	<div class="el" id="el-345"></div>
	<div class="el" id="el-346"></div>
	<div class="el" id="el-347"></div>
	<div class="el" id="el-348"></div>
	<div class="el" id="el-349"></div>
	<div class="el" id="el-350"></div>
  <div class="footer"></div>
</div>
<div class="original">	
</div>
</div>
            
          
!
            
              @import url('https://fonts.googleapis.com/css?family=Amatic+SC');

body {
	min-height: 100vh;
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
}

h1 {
  text-align: center;
  font-family: 'Amatic SC', cursive;
  margin: 20px 0 0 0;  
}

.images {
	display: flex;
}
.canvas {
	position: relative;
	width: 331px;
	height: 465px;
	margin: 10px;
	background-color: #C9E4DB;
	// filter: blur(1px);
}
.original {
	width: 331px;
	height: 465px;
	margin: 10px;
	// border: 1px solid black;
	background: url(https://s27.postimg.org/f8dc2vz77/elephant_clean.png);
	background-size: contain;
}

.el {
	position: absolute;
	width: 100%;
	height: 100%;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 3%;
  background-color: white;
}

#el-001 {
	background-color: #CAC2AE;
	clip-path: polygon(15.5% 28%, 8.7% 24.9%, 12.8% 22.7%);
}

#el-002 {
	background-color: #B5A898;
	clip-path: polygon(4.3% 21.7%, 8.7% 24.9%, 12.8% 22.7%);
}

#el-003 {
	background-color: #ADA28D;
	clip-path: polygon(4.3% 21.7%, 13.8% 17.9%, 12.8% 22.7%);
}

#el-004 {
	background-color: #A69985;
	clip-path: polygon(16.7% 20.9%, 13.8% 17.9%, 12.8% 22.7%);
}

#el-005 {
	background-color: #A1907D;
	clip-path: polygon(16.7% 20.9%, 15.5% 28%, 12.8% 22.7%);
}

#el-006 {
	background-color: #898271;
	clip-path: polygon(16.7% 20.9%, 13.8% 17.9%, 18.2% 16.4%);
}

#el-007 {
	background-color: #4A504C;
	clip-path: polygon(15.2% 15.3%, 13.8% 17.9%, 18.2% 16.4%);
}

#el-008 {
	background-color: #423A30;
	clip-path: polygon(15.2% 15.3%, 13.8% 17.9%, 12% 16.4%);
}

#el-009 {
	background-color: #9A8B77;
	clip-path: polygon(4.3% 21.7%, 13.8% 17.9%, 12% 16.4%);
}

#el-010 {
	background-color: #B6AB9A;
	clip-path: polygon(4.3% 21.7%, 5.5% 15.3%, 12% 16.4%);
}

#el-011 {
	background-color: #B5A994;
	clip-path: polygon(11.3% 10.2%, 5.5% 15.3%, 12% 16.4%);
}

#el-012 {
	background-color: #BEAD9D;
	clip-path: polygon(11.3% 10.2%, 15.2% 15.3%, 12% 16.4%);
}

#el-013 {
	background-color: #C5B4A1;
	clip-path: polygon(11.3% 10.2%, 15.2% 15.3%, 20.3% 10.7%);
}

#el-014 {
	background-color: #948069;
	clip-path: polygon(20.8% 14.6%, 15.2% 15.3%, 20.3% 10.7%);
}

#el-015 {
	background-color: #463F34;
	clip-path: polygon(20.8% 14.6%, 15.2% 15.3%, 18.2% 16.4%);
}

#el-016 {
	background-color: #9C8D79;
	clip-path: polygon(20.8% 14.6%, 29% 9.8%, 20.3% 10.7%);
}

#el-017 {
	background-color: #958672;
	clip-path: polygon(25.6% 7.9%, 29% 9.8%, 20.3% 10.7%);
}

#el-018 {
	background-color: #A6937C;
	clip-path: polygon(25.6% 7.9%, 18.2% 6.1%, 20.3% 10.7%);
}

#el-019 {
	background-color: #B5A993;
	clip-path: polygon(11.3% 10.2%, 18.2% 6.1%, 20.3% 10.7%);
}

#el-020 {
	background-color: #C4B39F;
	clip-path: polygon(25.6% 7.9%, 18.2% 6.1%, 24.1% 2.9%);
}

#el-021 {
	background-color: #A5947A;
	clip-path: polygon(25.6% 7.9%, 29% 6.4%, 24.1% 2.9%);
}

#el-022 {
	background-color: #786D5B;
	clip-path: polygon(25.6% 7.9%, 29% 6.4%, 29% 9.8%);
}

#el-023 {
	background-color: #615C4B;
	clip-path: polygon(34.1% 10.1%, 29% 6.4%, 29% 9.8%);
}

#el-024 {
	background-color: #48453B;
	clip-path: polygon(34.1% 10.1%, 29% 6.4%, 36.8% 6.3%);
}

#el-025 {
	background-color: #BDAC94;
	clip-path: polygon(35% 1.7%, 29% 6.4%, 36.8% 6.3%);
}

#el-026 {
	background-color: #C1AF9A;
	clip-path: polygon(35% 1.7%, 29% 6.4%, 24.1% 2.9%);
}

#el-027 {
	background-color: #E0D5C2;
	clip-path: polygon(35% 1.7%, 45.4% 2.1%, 36.8% 6.3%);
}

#el-028 {
	background-color: #BDAC94;
	clip-path: polygon(42.7% 8.6%, 45.4% 2.1%, 36.8% 6.3%);
}

#el-029 {
	background-color: #AA9E84;
	clip-path: polygon(42.7% 8.6%, 45.4% 2.1%, 52.1% 3.7%);
}

#el-030 {
	background-color: #DED3C4;
	clip-path: polygon(42.7% 8.6%, 53% 8.3%, 52.1% 3.7%);
}

#el-031 {
	background-color: #B0A084;
	clip-path: polygon(42.7% 8.6%, 53% 8.3%, 51.5% 12.3%, 46.8% 13.5%);
}

#el-032 {
	background-color: #CEBFAB;
	clip-path: polygon(46.8% 17.7%, 51.3% 20.1%, 51.5% 12.3%, 46.8% 13.5%);
}

#el-033 {
	background-color: #484337;
	clip-path: polygon(42.7% 8.6%, 38.9% 12%, 43.2% 16%, 46.8% 13.5%);
}

#el-034 {
	background-color: #756957;
	clip-path: polygon(46.8% 17.7%, 43.2% 16%, 46.8% 13.5%);
}

#el-035 {
	background-color: #625D51;
	clip-path: polygon(42.7% 8.6%, 38.9% 12%, 36.8% 6.3%);
}

#el-036 {
	background-color: #49443D;
	clip-path: polygon(34.1% 10.1%, 38.9% 12%, 36.8% 6.3%);
}

#el-037 {
	background-color: #C6B69C;
	clip-path: polygon(34.1% 10.1%, 38.9% 12%, 28.7% 20.4%);
}

#el-038 {
	background-color: #A89A7F;
	clip-path: polygon(34.1% 10.1%, 29% 9.8%, 28.7% 20.4%);
}

#el-039 {
	background-color: #938674;
	clip-path: polygon(20.8% 14.6%, 29% 9.8%, 28.7% 20.4%);
}

#el-040 {
	background-color: #A3967C;
	clip-path: polygon(20.8% 14.6%, 18.2% 16.4%, 28.7% 20.4%);
}

#el-041 {
	background-color: #D6C9B4;
	clip-path: polygon(16.7% 20.9%, 18.2% 16.4%, 28.7% 20.4%);
}

#el-042 {
	background-color: #7A7162;
	clip-path: polygon(16.7% 20.9%, 25.3% 26.6%, 28.7% 20.4%);
}

#el-043 {
	background-color: #A69989;
	clip-path: polygon(16.7% 20.9%, 25.3% 26.6%, 15.5% 28%);
}

#el-044 {
	background-color: #9D9380;
	clip-path: polygon(19.9% 32.1%, 25.3% 26.6%, 15.5% 28%);
}

#el-045 {
	background-color: #9D907B;
	clip-path: polygon(19.9% 32.1%, 25.3% 26.6%, 25.3% 33.4%);
}

#el-046 {
	background-color: #AAA08A;
	clip-path: polygon(36.1% 30.9%, 25.3% 26.6%, 25.3% 33.4%);
}

#el-047 {
	background-color: #A8997F;
	clip-path: polygon(36.1% 30.9%, 25.3% 26.6%, 38.8% 22.1%);
}

#el-048 {
	background-color: #B4AC9A;
	clip-path: polygon(28.7% 20.4%, 25.3% 26.6%, 38.8% 22.1%);
}

#el-049 {
	background-color: #D9CAB6;
	clip-path: polygon(28.7% 20.4%, 38.9% 12%, 38.8% 22.1%);
}

#el-050 {
	background-color: #BEAC90;
	clip-path: polygon(43.2% 16%, 38.9% 12%, 38.8% 22.1%);
}

#el-051 {
	background-color: #E7D6BC;
	clip-path: polygon(43.2% 16%, 44.4% 21.5%, 38.8% 22.1%);
}

#el-052 {
	background-color: #B8A278;
	clip-path: polygon(43.2% 16%, 44.4% 21.5%, 46.8% 17.7%);
}

#el-053 {
	background-color: #D1C7B1;
	clip-path: polygon(47.7% 21.9%, 44.4% 21.5%, 46.8% 17.7%);
}

#el-054 {
	background-color: #4B4742;
	clip-path: polygon(47.7% 21.9%, 51.3% 20.1%, 46.8% 17.7%);
}

#el-055 {
	background-color: #756B61;
	clip-path: polygon(47.7% 21.9%, 51.3% 20.1%, 50.5% 22.7%);
}

#el-056 {
	background-color: #655B4A;
	clip-path: polygon(53.1% 23.9%, 51.3% 20.1%, 50.5% 22.7%);
}

#el-057 {
	background-color: #3B352F;
	clip-path: polygon(53.1% 23.9%, 50.7% 24.7%, 50.5% 22.7%);
}

#el-058 {
	background-color: #545146;
	clip-path: polygon(53.1% 23.9%, 50.7% 24.7%, 52.2% 30%);
}

#el-059 {
	background-color: #423830;
	clip-path: polygon(48.6% 27.5%, 50.7% 24.7%, 52.2% 30%);
}

#el-060 {
	background-color: #37302E;
	clip-path: polygon(48.6% 27.5%, 50.7% 24.7%, 50.5% 22.7%, 47.1% 24.6%);
}

#el-061 {
	background-color: #34363A;
	clip-path: polygon(47.7% 21.9%, 50.5% 22.7%, 47.1% 24.6%);
}

#el-062 {
	background-color: #554C3D;
	clip-path: polygon(47.7% 21.9%, 44.4% 21.5%, 47.1% 24.6%);
}

#el-063 {
	background-color: #8E7D6A;
	clip-path: polygon(38.8% 22.1%, 44.4% 21.5%, 47.1% 24.6%);
}

#el-064 {
	background-color: #A6937C;
	clip-path: polygon(38.8% 22.1%, 36.1% 30.9%, 47.1% 24.6%);
}

#el-065 {
	background-color: #968468;
	clip-path: polygon(48.6% 27.5%, 36.1% 30.9%, 47.1% 24.6%);
}

#el-066 {
	background-color: #917F63;
	clip-path: polygon(48.6% 27.5%, 36.1% 30.9%, 48.3% 31.3%);
}

#el-067 {
	background-color: #4F4B44;
	clip-path: polygon(48.6% 27.5%, 52.2% 30%, 48.3% 31.3%);
}

#el-068 {
	background-color: #3A392F;
	clip-path: polygon(50.9% 31.3%, 52.2% 30%, 48.3% 31.3%);
}

#el-069 {
	background-color: #292728;
	clip-path: polygon(50.9% 31.3%, 46.6% 35.8%, 48.3% 31.3%);
}

#el-070 {
	background-color: #312D25;
	clip-path: polygon(41.8% 36.9%, 46.6% 35.8%, 48.3% 31.3%);
}

#el-071 {
	background-color: #322E27;
	clip-path: polygon(41.8% 36.9%, 46.6% 35.8%, 44.8% 39.7%);
}

#el-072 {
	background-color: #41382B;
	clip-path: polygon(41.8% 36.9%, 36.5% 41.8%, 44.8% 39.7%);
}

#el-073 {
	background-color: #50483D;
	clip-path: polygon(41.8% 44%, 36.5% 41.8%, 44.8% 39.7%);
}

#el-074 {
	background-color: #3B3328;
	clip-path: polygon(41.8% 44%, 36.5% 41.8%, 34.5% 47.6%);
}

#el-075 {
	background-color: #585143;
	clip-path: polygon(30.2% 42%, 36.5% 41.8%, 34.5% 47.6%);
}

#el-076 {
	background-color: #645C4F;
	clip-path: polygon(30.2% 42%, 36.5% 41.8%, 32% 39.2%);
}

#el-077 {
	background-color: #6C6459;
	clip-path: polygon(30.2% 42%, 27.7% 38.2%, 32% 39.2%);
}

#el-078 {
	background-color: #786D5C;
	clip-path: polygon(25.3% 33.4%, 27.7% 38.2%, 32% 39.2%);
}

#el-079 {
	background-color: #867C68;
	clip-path: polygon(25.3% 33.4%, 36.1% 30.9%, 32% 39.2%);
}

#el-080 {
	background-color: #837664;
	clip-path: polygon(36.5% 41.8%, 41.8% 36.9%, 36.1% 30.9%, 32% 39.2%);
}

#el-081 {
	background-color: #8D7C67;
	clip-path: polygon(48.3% 31.3%, 41.8% 36.9%, 36.1% 30.9%);
}

#el-082 {
	background-color: #CDC5B1;
	clip-path: polygon(50.9% 31.3%, 52.2% 30%, 52.8% 37.7%, 51.5% 37.3%);
}

#el-083 {
	background-color: #F5F9F5;
	clip-path: polygon(50.1% 40.5%, 52.2% 41.2%, 53% 40.2%, 54.3% 39.3%, 52.8% 37.7%, 51.5% 37.3%);
}

#el-084 {
	background-color: #B8B6A6;
	clip-path: polygon(52.2% 41.2%, 53% 40.2%, 54.3% 39.3%, 53.4% 40.6%);
}

#el-085 {
	background-color: #232623;
	clip-path: polygon(54% 41.2%, 54.3% 39.3%, 53.4% 40.6%);
}

#el-086 {
	background-color: #32302B;
	clip-path: polygon(54% 41.2%, 52.2% 41.2%, 53.4% 40.6%);
}

#el-087 {
	background-color: #252623;
	clip-path: polygon(54% 41.2%, 52.2% 41.2%, 51.3% 49.8%, 57.4% 45.1%);
}

#el-088 { 
	background-color: #202322;
	clip-path: polygon(60% 59%, 52.1% 56.4%, 51.3% 49.8%, 57.4% 45.1%, 59.3% 54.7%, 58.6% 51%);
}

#el-089 {
	background-color: #2A2925;
	clip-path: polygon(60% 59%, 52.1% 56.4%, 53.4% 66.2%);
}

#el-090 {
	background-color: #252623;
	clip-path: polygon(60% 59%, 61.7% 63.7%, 53.4% 66.2%);
}

#el-091 {
	background-color: #292A25;
	clip-path: polygon(61% 65.2%, 61.7% 63.7%, 53.4% 66.2%);
}

#el-092 {
	background-color: #2C2A26;
	clip-path: polygon(61% 65.2%, 54% 73.1%, 53.4% 66.2%);
}

#el-093 {
	background-color: #322F2C;
	clip-path: polygon(61% 65.2%, 54% 73.1%, 56.7% 78%);
}

#el-094 {
	background-color: #76634E;
	clip-path: polygon(43.3% 77.4%, 54% 73.1%, 56.7% 78%);
}

#el-095 {
	background-color: #443D32;
	clip-path: polygon(43.3% 77.4%, 44.5% 82.9%, 56.7% 78%);
}

#el-096 {
	background-color: #363331;
	clip-path: polygon(56.7% 82.3%, 44.5% 82.9%, 56.7% 78%);
}

#el-097 {
	background-color: #322C27;
	clip-path: polygon(56.7% 82.3%, 44.5% 82.9%, 53.9% 91%);
}

#el-098 {
	background-color: #504A46;
	clip-path: polygon(56.7% 82.3%, 53.9% 91%, 56.3% 91.6%, 59.2% 90%, 59.6% 87.2%);
}

#el-099 {
	background-color: #4D4C46;
	clip-path: polygon(56.3% 91.6%, 59.2% 90%, 56.9% 92.4%);
}

#el-100 {
	background-color: #484946;
	clip-path: polygon(59.2% 90%, 58.9% 93.2%, 56.9% 92.4%);
}

#el-101 {
	background-color: #69625C;
	clip-path: polygon(56.3% 91.6%, 56% 93%, 56.9% 92.4%);
}

#el-102 {
	background-color: #7B796F;
	clip-path: polygon(56.3% 91.6%, 56% 93%, 53.9% 91%);
}

#el-103 {
	background-color: #655B50;
	clip-path: polygon(52.4% 93.7%, 54.2% 93.6%, 56% 93%, 53.9% 91%);
}

#el-104 {
	background-color: #42443C;
	clip-path: polygon(52.4% 93.7%, 50% 91.9%, 53.9% 91%);
}

#el-105 {
	background-color: #36352D;
	clip-path: polygon(52.4% 93.7%, 50% 91.9%, 50.4% 93.4%);
}

#el-106 {
	background-color: #5F5744;
	clip-path: polygon(48% 94.4%, 46.6% 93%, 50% 91.9%, 50.4% 93.4%);
}

#el-107 {
	background-color: #6D6251;
	clip-path: polygon(48% 94.4%, 46.6% 93%, 43.3% 92.4%);
}

#el-108 {
	background-color: #564D3B;
	clip-path: polygon(47.7% 90.9%, 46.6% 93%, 43.3% 92.4%);
}

#el-109 {
	background-color: #746B60;
	clip-path: polygon(47.7% 90.9%, 46.6% 93%, 50% 91.9%);
}

#el-110 {
	background-color: #4F4C3F;
	clip-path: polygon(47.7% 90.9%, 53.9% 91%, 50% 91.9%);
}

#el-111 {
	background-color: #473D30;
	clip-path: polygon(47.7% 90.9%, 53.9% 91%, 44.5% 82.9%);
}

#el-112 {
	background-color: #584B3E;
	clip-path: polygon(47.7% 90.9%, 41.8% 84.7%, 44.5% 82.9%);
}

#el-113 {
	background-color: #A49073;
	clip-path: polygon(47.7% 90.9%, 41.8% 84.7%, 41.8% 89.4%);
}

#el-114 {
	background-color: #AC9B83;
	clip-path: polygon(47.7% 90.9%, 43.3% 92.4%, 41.8% 89.4%);
}

#el-115 {
	background-color: #CEBFA2;
	clip-path: polygon(43.3% 77.4%, 54% 73.1%, 42.5% 69.5%);
}

#el-116 {
	background-color: #C4AF94;
	clip-path: polygon(53.4% 66.2%, 54% 73.1%, 42.5% 69.5%);
}

#el-117 {
	background-color: #67665F;
	clip-path: polygon(53.4% 66.2%, 41.5% 63.3%, 42.5% 69.5%);
}

#el-118 {
	background-color: #403C36;
	clip-path: polygon(53.4% 66.2%, 41.5% 63.3%, 52.1% 56.4%);
}

#el-119 {
	background-color: #585954;
	clip-path: polygon(40.4% 58.6%, 41.5% 63.3%, 52.1% 56.4%);
}

#el-120 {
	background-color: #65615C;
	clip-path: polygon(40.4% 58.6%, 39.2% 54%, 52.1% 56.4%);
}

#el-121 {
	background-color: #4B4744;
	clip-path: polygon(51.3% 49.8%, 39.2% 54%, 52.1% 56.4%);
}

#el-122 {
	background-color: #4D453F;
	clip-path: polygon(51.3% 49.8%, 39.2% 54%, 38.6% 49.8%);
}

#el-123 {
	background-color: #504A46;
	clip-path: polygon(51.3% 49.8%, 41.8% 44%, 38.6% 49.8%);
}

#el-124 {
	background-color: #39352D;
	clip-path: polygon(51.3% 49.8%, 41.8% 44%, 52.2% 41.2%);
}

#el-125 {
	background-color: #2A2B26;
	clip-path: polygon(50.1% 40.5%, 41.8% 44%, 52.2% 41.2%);
}

#el-126 {
	background-color: #2A2B26;
	clip-path: polygon(50.1% 40.5%, 41.8% 44%, 44.8% 39.7%);
}

#el-127 {
	background-color: #272425;
	clip-path: polygon(50.1% 40.5%, 51.5% 37.3%, 46.6% 35.8%, 44.8% 39.7%);
}

#el-128 {
	background-color: #202322;
	clip-path: polygon(51.5% 37.3%, 46.6% 35.8%, 50.9% 31.3%);
}

#el-129 {
	background-color: #484133;
	clip-path: polygon(34.5% 47.6%, 41.8% 44%, 38.6% 49.8%);
}

#el-130 {
	background-color: #3B3830;
	clip-path: polygon(34.5% 47.6%, 30.2% 42%, 32.7% 48.6%, 38.6% 49.8%);
}

#el-131 {
	background-color: #403D32;
	clip-path: polygon(36.2% 54.1%, 32.7% 48.6%, 38.6% 49.8%);
}

#el-132 {
	background-color: #282828;
	clip-path: polygon(36.2% 54.1%, 39.2% 54%, 38.6% 49.8%);
}

#el-133 {
	background-color: #3A3631;
	clip-path: polygon(36.2% 54.1%, 39.2% 54%, 37% 58.2%);
}

#el-134 {
	background-color: #34302B;
	clip-path: polygon(40.4% 58.6%, 39.2% 54%, 37% 58.2%);
}

#el-135 {
	background-color: #3D3D39;
	clip-path: polygon(40.4% 58.6%, 41.5% 63.3%, 37% 58.2%);
}

#el-136 {
	background-color: #706A61;
	clip-path: polygon(42.5% 69.5%, 41.5% 63.3%, 37% 58.2%);
}

#el-137 {
	background-color: #CCBCA4;
	clip-path: polygon(53.1% 23.9%, 51.3% 20.1%, 64.6% 14.1%);
}

#el-138 {
	background-color: #D4CAB6;
	clip-path: polygon(51.5% 12.3%, 51.3% 20.1%, 64.6% 14.1%);
}

#el-139 {
	background-color: #D0BEA5;
	clip-path: polygon(51.5% 12.3%, 53% 8.3%, 64.6% 14.1%);
}

#el-140 {
	background-color: #B3A691;
	clip-path: polygon(56.7% 4.3%, 53% 8.3%, 64.6% 14.1%);
}

#el-141 {
	background-color: #C6BDAC;
	clip-path: polygon(56.7% 4.3%, 65.7% 3.5%, 64.6% 14.1%);
}

#el-142 {
	background-color: #C9BCA8;
	clip-path: polygon(70.2% 9%, 65.7% 3.5%, 64.6% 14.1%);
}

#el-143 {
	background-color: #D1C0AA;
	clip-path: polygon(70.2% 9%, 75.5% 12.9%, 64.6% 14.1%);
}

#el-144 {
	background-color: #C4B99D;
	clip-path: polygon(72.8% 21.1%, 75.5% 12.9%, 64.6% 14.1%);
}

#el-145 {
	background-color: #B8A890;
	clip-path: polygon(72.8% 21.1%, 65.5% 27%, 64.6% 14.1%);
}

#el-146 {
	background-color: #C3B29A;
	clip-path: polygon(53.1% 23.9%, 65.5% 27%, 64.6% 14.1%);
}

#el-147 {
	background-color: #D2C3AD;
	clip-path: polygon(53.1% 23.9%, 65.5% 27%, 52.2% 30%);
}

#el-148 {
	background-color: #B3A591;
	clip-path: polygon(64.8% 38.4%, 65.5% 27%, 52.2% 30%);
}

#el-149 {
	background-color: #AE9E81;
	clip-path: polygon(64.8% 38.4%, 52.8% 37.7%, 52.2% 30%);
}

#el-150 {
	background-color: #736555;
	clip-path: polygon(64.8% 38.4%, 52.8% 37.7%, 54.3% 39.3%);
}

#el-151 {
	background-color: #736555;
	clip-path: polygon(64.8% 38.4%, 54% 41.2%, 54.3% 39.3%);
}

#el-152 {
	background-color: #8A7965;
	clip-path: polygon(64.8% 38.4%, 54% 41.2%, 57.4% 45.1%);
}

#el-153 {
	background-color: #8A7965;
	clip-path: polygon(64.8% 38.4%, 63.7% 45%, 57.4% 45.1%);
}

#el-154 {
	background-color: #665949;
	clip-path: polygon(64.8% 38.4%, 63.7% 45%, 72.8% 43.3%);
}

#el-155 {
	background-color: #756F5C;
	clip-path: polygon(64.8% 38.4%, 72.8% 40.4%, 72.8% 43.3%);
}

#el-156 {
	background-color: #696351;
	clip-path: polygon(64.8% 38.4%, 72.8% 40.4%, 73.8% 37.9%);
}

#el-157 {
	background-color: #5D5544;
	clip-path: polygon(64.8% 38.4%, 74.9% 36.6%, 73.8% 37.9%);
}

#el-158 {
	background-color: #9B917D;
	clip-path: polygon(64.8% 38.4%, 75.2% 31.5%, 74.9% 36.6%);
}

#el-159 {
	background-color: #A2947B;
	clip-path: polygon(64.8% 38.4%, 75.2% 31.5%, 65.5% 27%);
}

#el-160 {
	background-color: #887B69;
	clip-path: polygon(74% 26.4%, 75.2% 31.5%, 65.5% 27%);
}

#el-161 {
	background-color: #5A5147;
	clip-path: polygon(74% 26.4%, 72.8% 21.1%, 65.5% 27%);
}

#el-162 {
	background-color: #67615C;
	clip-path: polygon(74% 26.4%, 72.8% 21.1%, 76.7% 21.8%);
}

#el-163 {
	background-color: #5A534F;
	clip-path: polygon(79.1% 20.4%, 72.8% 21.1%, 76.7% 21.8%);
}

#el-164 {
	background-color: #2C292A;
	clip-path: polygon(79.1% 20.4%, 78% 22.5%, 74% 26.4%, 76.7% 21.8%);
}

#el-165 {
	background-color: #403B33;
	clip-path: polygon(79.1% 20.4%, 78% 22.5%, 74% 26.4%, 80% 23.7%);
}

#el-166 {
	background-color: #574F46;
	clip-path: polygon(79.1% 20.4%, 82.3% 19.7%, 80% 23.7%);
}

#el-167 {
	background-color: #D8D1C5;
	clip-path: polygon(79.1% 20.4%, 82.3% 19.7%, 81.4% 14.8%, 79.1% 16.3%);
}

#el-168 {
	background-color: #737574;
	clip-path: polygon(79.1% 20.4%, 72.8% 21.1%, 79.1% 16.3%);
}

#el-169 {
	background-color: #BEAE96;
	clip-path: polygon(75.6% 12.9%, 72.8% 21.1%, 79.1% 16.3%);
}

#el-170 {
	background-color: #9C9890;
	clip-path: polygon(75.6% 12.9%, 78.2% 11.8%, 81.4% 14.8%, 79.1% 16.3%);
}

#el-171 {
	background-color: #B1A491;
	clip-path: polygon(75.6% 12.9%, 78.2% 11.8%, 73.8% 3.5%, 70.2% 9%);
}

#el-172 {
	background-color: #E4DAD2;
	clip-path: polygon(65.7% 3.5%, 68.5% 0.8%, 73.8% 3.5%, 70.2% 9%);
}

#el-173 {
	background-color: #CDCBC4;
	clip-path: polygon(68.5% 0.8%, 73.8% 3.5%, 73.5% 2.2%);
}

#el-174 {
	background-color: #BFB6A5;
	clip-path: polygon(73.8% 3.5%, 78.2% 11.8%, 84.2% 7.3%);
}

#el-175 {
	background-color: #C4BCAA;
	clip-path: polygon(73.8% 3.5%, 79.1% 1.2%, 84.2% 7.3%);
}

#el-176 {
	background-color: #BFB09A;
	clip-path: polygon(88.8% 4.3%, 79.1% 1.2%, 84.2% 7.3%);
}

#el-177 {
	background-color: #DBD5C7;
	clip-path: polygon(87% 0%, 84.2% 0%, 79.1% 1.2%, 88.8% 4.3%);
}

#el-178 {
	background-color: #AAA38F;
	clip-path: polygon(87% 0%, 92% 0%, 88.8% 4.3%);
}

#el-179 {
	background-color: #A69481;
	clip-path: polygon(92.9% 0%, 92% 0%, 88.8% 4.3%, 95.1% 3.1%);
}

#el-180 {
	background-color: #C0B5A5;
	clip-path: polygon(92.9% 0%, 98.9% 0%, 95.1% 3.1%);
}

#el-181 {
	background-color: #BAB19F;
	clip-path: polygon(98.9% 0%, 98.4% 3.5%, 95.1% 3.1%);
}

#el-182 {
	background-color: #74695B;
	clip-path: polygon(97.2% 7%, 98.4% 3.5%, 95.1% 3.1%);
}

#el-183 {
	background-color: #8D806D;
	clip-path: polygon(97.2% 7%, 98.4% 3.5%, 100% 7.6%);
}

#el-184 {
	background-color: #6E6656;
	clip-path: polygon(97.2% 7%, 93.2% 7%, 95.1% 3.1%);
}

#el-185 {
	background-color: #5A5552;
	clip-path: polygon(88.8% 4.3%, 93.2% 7%, 95.1% 3.1%);
}

#el-186 {
	background-color: #5E5854;
	clip-path: polygon(88.8% 4.3%, 93.2% 7%, 88.6% 9%);
}

#el-187 {
	background-color: #534E49;
	clip-path: polygon(88.8% 4.3%, 84.2% 7.3%, 88.6% 9%);
}

#el-188 {
	background-color: #77726A;
	clip-path: polygon(84.2% 14.5%, 84.2% 7.3%, 88.6% 9%);
}

#el-189 {
	background-color: #4A473F;
	clip-path: polygon(84.2% 14.5%, 84.2% 7.3%, 78.2% 11.8%);
}

#el-190 {
	background-color: #676458;
	clip-path: polygon(84.2% 14.5%, 81.4% 14.8%, 78.2% 11.8%);
}

#el-191 {
	background-color: #423E3D;
	clip-path: polygon(84.2% 14.5%, 81.4% 14.8%, 82.3% 19.7%);
}

#el-192 {
	background-color: #877E70;
	clip-path: polygon(84.2% 14.5%, 84.1% 20%, 82.3% 19.7%);
}

#el-193 {
	background-color: #F4F0DD;
	clip-path: polygon(84.2% 14.5%, 84.1% 20%, 87% 21%);
}

#el-194 {
	background-color: #EEE8D8;
	clip-path: polygon(84.2% 14.5%, 96.8% 19.8%, 87% 21%);
}

#el-195 {
	background-color: #E3D9C6;
	clip-path: polygon(84.2% 14.5%, 96.8% 19.8%, 88.6% 9%);
}

#el-196 {
	background-color: #E9E0CD;
	clip-path: polygon(97.2% 7%, 96.8% 19.8%, 88.6% 9%);
}

#el-197 {
	background-color: #8B806F;
	clip-path: polygon(97.2% 7%, 93.2% 7%, 88.6% 9%);
}

#el-198 {
	background-color: #D0C7B5;
	clip-path: polygon(97.2% 7%, 96.8% 19.8%, 100% 7.6%);
}

#el-199 {
	background-color: #C2B8A4;
	clip-path: polygon(98.1% 23.7%, 96.8% 19.8%, 100% 7.6%);
}

#el-200 {
	background-color: #B8AF9D;
	clip-path: polygon(98.1% 23.7%, 100% 36%, 100% 7.6%);
}

#el-201 {
	background-color: #B0A690;
	clip-path: polygon(98.1% 23.7%, 100% 36%, 94.5% 30.6%);
}

#el-202 {
	background-color: #988D78;
	clip-path: polygon(98.1% 23.7%, 88.3% 28.7%, 94.5% 30.6%);
}

#el-203 {
	background-color: #776E5E;
	clip-path: polygon(98.1% 23.7%, 88.3% 28.7%, 87% 21%);
}

#el-204 {
	background-color: #797264;
	clip-path: polygon(98.1% 23.7%, 96.8% 19.8%, 87% 21%);
}

#el-205 {
	background-color: #776C60;
	clip-path: polygon(84.1% 20%, 80% 23.7%, 87% 21%);
}

#el-206 {
	background-color: #4D4739;
	clip-path: polygon(84.1% 20%, 80% 23.7%, 82.3% 19.7%);
}

#el-207 {
	background-color: #908068;
	clip-path: polygon(88.3% 28.7%, 80% 23.7%, 87% 21%);
}

#el-208 {
	background-color: #3D3E36;
	clip-path: polygon(88.3% 28.7%, 80% 23.7%, 80.5% 27.7%);
}

#el-209 {
	background-color: #474439;
	clip-path: polygon(74% 26.4%, 80% 23.7%, 80.5% 27.7%);
}

#el-210 {
	background-color: #3D3A34;
	clip-path: polygon(74% 26.4%, 80.5% 27.7%, 80.8% 29%, 75.2% 31.5%);
}

#el-211 {
	background-color: #3E3731;
	clip-path: polygon(77.6% 32.1%, 80.8% 29%, 75.2% 31.5%);
}

#el-212 {
	background-color: #322C27;
	clip-path: polygon(77.6% 32.1%, 80.8% 29%, 83.9% 33.5%);
}

#el-213 {
	background-color: #413E32;
	clip-path: polygon(88.3% 28.7%, 80.8% 29%, 83.9% 33.5%);
}

#el-214 {
	background-color: #373630;
	clip-path: polygon(88.3% 28.7%, 80.8% 29%, 80.5% 27.7%);
}

#el-215 {
	background-color: #8E7F69;
	clip-path: polygon(88.3% 28.7%, 87.9% 36.5%, 83.9% 33.5%);
}

#el-216 {
	background-color: #7E7163;
	clip-path: polygon(88.3% 28.7%, 87.9% 36.5%, 94.5% 30.6%);
}

#el-217 {
	background-color: #A89985;
	clip-path: polygon(100% 36%, 87.9% 36.5%, 94.5% 30.6%);
}

#el-218 {
	background-color: #79705F;
	clip-path: polygon(100% 36%, 87.9% 36.5%, 98% 38.8%);
}

#el-219 {
	background-color: #534B41;
	clip-path: polygon(93.6% 40%, 87.9% 36.5%, 98% 38.8%);
}

#el-220 {
	background-color: #3F3B31;
	clip-path: polygon(93.6% 40%, 87.9% 36.5%, 90% 40.1%);
}

#el-221 {
	background-color: #4B443B;
	clip-path: polygon(93.6% 40%, 90.9% 41.3%, 90% 40.1%);
}

#el-222 {
	background-color: #3F3831;
	clip-path: polygon(88.8% 40.8%, 90.9% 41.3%, 90% 40.1%);
}

#el-223 {
	background-color: #322E2B;
	clip-path: polygon(88.8% 40.8%, 87.9% 36.5%, 90% 40.1%);
}

#el-224 {
	background-color: #605D55;
	clip-path: polygon(88.8% 40.8%, 87.9% 36.5%, 78.5% 38.8%);
}

#el-225 {
	background-color: #2C2A26;
	clip-path: polygon(83.9% 33.5%, 87.9% 36.5%, 78.5% 38.8%);
}

#el-226 {
	background-color: #322E2B;
	clip-path: polygon(83.9% 33.5%, 76.2% 35.8%, 77.4% 38%, 78.5% 38.8%);
}

#el-227 {
	background-color: #262924;
	clip-path: polygon(83.9% 33.5%, 76.2% 35.8%, 77.6% 32.1%);
}

#el-228 {
	background-color: #5E544A;
	clip-path: polygon(75.2% 31.5%, 76.2% 35.8%, 77.6% 32.1%);
}

#el-229 {
	background-color: #C1BBA6;
	clip-path: polygon(75.2% 31.5%, 76.2% 35.8%, 74.9% 36.6%);
}

#el-230 {
	background-color: #F4F9F5;
	clip-path: polygon(73.8% 37.9%, 74.6% 39.7%, 76.7% 41%, 77.4% 38%, 76.2% 35.8%, 74.9% 36.6%);
}

#el-231 {
	background-color: #41372D;
	clip-path: polygon(73.8% 37.9%, 74.6% 39.7%, 72.8% 40.4%);
}

#el-232 {
	background-color: #554735;
	clip-path: polygon(76.7% 41%, 74.6% 39.7%, 72.8% 40.4%);
}

#el-233 {
	background-color: #312D27;
	clip-path: polygon(76.7% 41%, 77.4% 38%, 78.5% 38.8%);
}

#el-234 {
	background-color: #453E35;
	clip-path: polygon(76.7% 41%, 85.8% 45.4%, 78.5% 38.8%);
}

#el-235 {
	background-color: #555149;
	clip-path: polygon(88.5% 41.8%, 85.8% 45.4%, 78.5% 38.8%);
}

#el-236 {
	background-color: #3C362F;
	clip-path: polygon(88.5% 41.8%, 88.8% 40.8%, 78.5% 38.8%);
}

#el-237 {
	background-color: #837B67;
	clip-path: polygon(72.8% 43.3%, 63.7% 45%, 71.4% 46.4%);
}

#el-238 {
	background-color: #7F776D;
	clip-path: polygon(71.9% 48.6%, 63.7% 45%, 71.4% 46.4%);
}

#el-239 {
	background-color: #3B3732;
	clip-path: polygon(71.9% 48.6%, 63.7% 45%, 66.1% 54.6%);
}

#el-240 {
	background-color: #403B3B;
	clip-path: polygon(58.6% 51%, 63.7% 45%, 66.1% 54.6%);
}

#el-241 {
	background-color: #847C75;
	clip-path: polygon(58.6% 51%, 63.7% 45%, 57.4% 45.1%);
}

#el-242 {
	background-color: #39352B;
	clip-path: polygon(58.6% 51%, 59.3% 54.7%, 66.1% 54.6%);
}

#el-243 {
	background-color: #9C8F7A;
	clip-path: polygon(60% 59%, 59.3% 54.7%, 66.1% 54.6%);
}

#el-244 {
	background-color: #453E33;
	clip-path: polygon(60% 59%, 67.8% 62.9%, 66.1% 54.6%);
}

#el-245 {
	background-color: #998872;
	clip-path: polygon(60% 59%, 67.8% 62.9%, 61.7% 63.7%);
}

#el-246 {
	background-color: #ACA693;
	clip-path: polygon(62.8% 67.4%, 67.8% 62.9%, 61.7% 63.7%);
}

#el-247 {
	background-color: #7E766C;
	clip-path: polygon(62.8% 67.4%, 61% 65.2%, 61.7% 63.7%);
}

#el-248 {
	background-color: #53493C;
	clip-path: polygon(62.8% 67.4%, 67.8% 62.9%, 68.5% 70.6%);
}

#el-249 {
	background-color: #453C2C;
	clip-path: polygon(62.8% 67.4%, 64.5% 73.4%, 68.5% 70.6%);
}

#el-250 {
	background-color: #857C68;
	clip-path: polygon(72.3% 73.3%, 64.5% 73.4%, 68.5% 70.6%);
}

#el-251 {
	background-color: #565248;
	clip-path: polygon(72.3% 73.3%, 72.8% 69.5%, 68.5% 70.6%);
}

#el-252 {
	background-color: #34322E;
	clip-path: polygon(72.9% 66%, 72.8% 69.5%, 68.5% 70.6%);
}

#el-253 {
	background-color: #37332F;
	clip-path: polygon(72.3% 73.3%, 72.8% 69.5%, 73.4% 72.7%);
}

#el-254 {
	background-color: #413E34;
	clip-path: polygon(75.6% 72.2%, 72.8% 69.5%, 73.4% 72.7%);
}

#el-255 {
	background-color: #474236;
	clip-path: polygon(75.6% 72.2%, 72.8% 69.5%, 76.4% 68.7%);
}

#el-256 {
	background-color: #4B493C;
	clip-path: polygon(72.9% 66%, 72.8% 69.5%, 76.4% 68.7%);
}

#el-257 {
	background-color: #5B564B;
	clip-path: polygon(72.9% 66%, 78.7% 63.4%, 76.4% 68.7%);
}

#el-258 {
	background-color: #48453D;
	clip-path: polygon(72.9% 66%, 78.7% 63.4%, 72.9% 61.6%);
}

#el-259 {
	background-color: #4A473D;
	clip-path: polygon(72.9% 66%, 67.8% 62.9%, 72.9% 61.6%);
}

#el-260 {
	background-color: #776B58;
	clip-path: polygon(72.9% 66%, 67.8% 62.9%, 68.5% 70.6%);
}

#el-261 {
	background-color: #959185;
	clip-path: polygon(72.3% 57.6%, 67.8% 62.9%, 72.9% 61.6%);
}

#el-262 {
	background-color: #484233;
	clip-path: polygon(72.3% 57.6%, 67.8% 62.9%, 66.1% 54.6%);
}

#el-263 {
	background-color: #72695C;
	clip-path: polygon(72.3% 57.6%, 72.5% 52.6%, 66.1% 54.6%);
}

#el-264 {
	background-color: #625A52;
	clip-path: polygon(71.9% 48.6%, 72.5% 52.6%, 66.1% 54.6%);
}

#el-265 {
	background-color: #433F36;
	clip-path: polygon(71.9% 48.6%, 72.5% 52.6%, 83.6% 50%);
}

#el-266 {
	background-color: #635F50;
	clip-path: polygon(80.6% 56.7%, 72.5% 52.6%, 83.6% 50%);
}

#el-267 {
	background-color: #4C4641;
	clip-path: polygon(80.6% 56.7%, 72.5% 52.6%, 72.3% 57.6%);
}

#el-268 {
	background-color: #4C4641;
	clip-path: polygon(80.6% 56.7%, 72.9% 61.6%, 72.3% 57.6%);
}

#el-269 {
	background-color: #5B5649;
	clip-path: polygon(80.6% 56.7%, 72.9% 61.6%, 78.7% 63.4%);
}

#el-270 {
	background-color: #39352D;
	clip-path: polygon(71.9% 48.6%, 71.4% 46.4%, 83.6% 50%);
}

#el-271 {
	background-color: #2E2C28;
	clip-path: polygon(76.7% 41%, 72.8% 40.4%, 72.8% 43.3%, 71.4% 46.4%, 83.6% 50%);
}

#el-272 {
	background-color: #4F4C42;
	clip-path: polygon(76.7% 41%, 85.8% 45.4%, 83.6% 50%);
}

#el-273 {
	background-color: #524B3E;
	clip-path: polygon(64.5% 73.4%, 65.9% 77.5%, 72.3% 73.3%);
}

#el-274 {
	background-color: #413C30;
	clip-path: polygon(73.5% 75.5%, 65.9% 77.5%, 72.3% 73.3%);
}

#el-275 {
	background-color: #554F4A;
	clip-path: polygon(64.5% 73.4%, 65.9% 77.5%, 63.2% 77%);
}

#el-276 {
	background-color: #40423C;
	clip-path: polygon(63.4% 81%, 65.9% 77.5%, 63.2% 77%);
}

#el-277 {
	background-color: #2F2D29;
	clip-path: polygon(63.4% 81%, 65.9% 77.5%, 67.3% 80.7%);
}

#el-278 {
	background-color: #38322B;
	clip-path: polygon(73.5% 75.5%, 65.9% 77.5%, 67.3% 80.7%, 74.6% 76.2%);
}

#el-279 {
	background-color: #3A342B;
	clip-path: polygon(74.3% 80.6%, 67.3% 80.7%, 74.6% 76.2%);
}

#el-280 {
	background-color: #313230;
	clip-path: polygon(74.3% 80.6%, 77.3% 74.9%, 74.6% 76.2%);
}

#el-281 {
	background-color: #323430;
	clip-path: polygon(75.3% 74.3%, 77.3% 74.9%, 74.6% 76.2%);
}

#el-282 {
	background-color: #48423D;
	clip-path: polygon(75.3% 74.3%, 77.3% 74.9%, 77.1% 73%);
}

#el-283 {
	background-color: #2E2C2A;
	clip-path: polygon(75.3% 74.3%, 75.6% 72.2%, 77.1% 73%);
}

#el-284 {
	background-color: #212321;
	clip-path: polygon(75.3% 74.3%, 75.6% 72.2%, 73.4% 73.6%);
}

#el-285 {
	background-color: #2C2F2B;
	clip-path: polygon(75.3% 74.3%, 73.5% 75.5%, 73.4% 73.6%);
}

#el-286 {
	background-color: #2E2D29;
	clip-path: polygon(75.3% 74.3%, 73.5% 75.5%, 74.6% 76.2%);
}

#el-287 {
	background-color: #3C3C38;
	clip-path: polygon(72.3% 73.3%, 73.5% 75.5%, 73.4% 73.6%);
}

#el-288 {
	background-color: #55564F;
	clip-path: polygon(72.3% 73.3%, 73.4% 72.7%, 73.4% 73.6%);
}

#el-289 {
	background-color: #2C2B29;
	clip-path: polygon(75.6% 72.2%, 73.4% 72.7%, 73.4% 73.6%);
}

#el-290 {
	background-color: #292A25;
	clip-path: polygon(63.4% 81%, 62.8% 84.8%, 67.3% 80.7%);
}

#el-291 {
	background-color: #2F2D29;
	clip-path: polygon(62.8% 84.8%, 67.3% 80.7%, 74.3% 80.6%, 74.3% 84.4%, 71.2% 82.3%);
}

#el-292 {
	background-color: #383934;
	clip-path: polygon(73.3% 87.7%, 74.3% 84.4%, 71.2% 82.3%);
}

#el-293 {
	background-color: #32332E;
	clip-path: polygon(73.3% 87.7%, 62.8% 84.8%, 71.2% 82.3%);
}

#el-294 {
	background-color: #39352D;
	clip-path: polygon(73.3% 87.7%, 62.8% 84.8%, 68.2% 91.9%);
}

#el-295 {
	background-color: #232323;
	clip-path: polygon(61.1% 87.6%, 62.8% 84.8%, 68.2% 91.9%);
}

#el-296 {
	background-color: #363432;
	clip-path: polygon(61.1% 87.6%, 62.8% 84.8%, 59.6% 87.2%);
}

#el-297 {
	background-color: #736350;
	clip-path: polygon(61.1% 87.6%, 61% 89.1%, 59.2% 90%, 59.6% 87.2%);
}

#el-298 {
	background-color: #725F44;
	clip-path: polygon(61% 89.1%, 59.2% 90%, 61.3% 93.5%);
}

#el-299 {
	background-color: #31312D;
	clip-path: polygon(58.9% 93.2%, 59.2% 90%, 61.3% 93.5%);
}

#el-300 {
	background-color: #675846;
	clip-path: polygon(58.9% 93.2%, 59.5% 94.8%, 61.3% 93.5%);
}

#el-301 {
	background-color: #353130;
	clip-path: polygon(58.9% 93.2%, 59.5% 94.8%, 58.1% 93.7%);
}

#el-302 {
	background-color: #CCB582;
	clip-path: polygon(63.2% 94.9%, 59.5% 94.8%, 61.3% 93.5%);
}

#el-303 {
	background-color: #3D3927;
	clip-path: polygon(63.2% 94.9%, 59.5% 94.8%, 65.8% 95.4%);
}

#el-304 {
	background-color: #736D66;
	clip-path: polygon(63.2% 94.9%, 65.1% 92.5%, 65.8% 95.4%);
}

#el-305 {
	background-color: #978865;
	clip-path: polygon(63.2% 94.9%, 65.1% 92.5%, 61.3% 93.5%);
}

#el-306 {
	background-color: #50514B;
	clip-path: polygon(61% 89.1%, 68.2% 91.9%, 65.1% 92.5%, 61.3% 93.5%);
}

#el-307 {
	background-color: #2D2D2D;
	clip-path: polygon(61% 89.1%, 68.2% 91.9%, 61.1% 87.6%);
}

#el-308 {
	background-color: #9A9A95;
	clip-path: polygon(68.2% 91.9%, 65.1% 92.5%, 68.7% 95%);
}

#el-309 {
	background-color: #787568;
	clip-path: polygon(65.8% 95.4%, 65.1% 92.5%, 68.7% 95%);
}

#el-310 {
	background-color: #555453;
	clip-path: polygon(68.2% 91.9%, 70.8% 94.7%, 68.7% 95%);
}

#el-311 {
	background-color: #46423D;
	clip-path: polygon(73.5% 95.4%, 70.8% 94.7%, 68.7% 95%);
}

#el-312 {
	background-color: #5B5C5C;
	clip-path: polygon(68.2% 91.9%, 70.8% 94.7%, 71.4% 92.4%);
}

#el-313 {
	background-color: #989A9E;
	clip-path: polygon(73.6% 92.6%, 70.8% 94.7%, 71.4% 92.4%);
}

#el-314 {
	background-color: #5B5952;
	clip-path: polygon(73.6% 92.6%, 70.8% 94.7%, 73.5% 95.4%);
}

#el-315 {
	background-color: #4C4946;
	clip-path: polygon(73.6% 92.6%, 75.9% 95.3%, 73.5% 95.4%);
}

#el-316 {
	background-color: #2A312F;
	clip-path: polygon(83.9% 96.5%, 75.9% 95.3%, 73.5% 95.4%, 81.1% 96.6%);
}

#el-317 {
	background-color: #434547;
	clip-path: polygon(73.6% 92.6%, 75.9% 95.3%, 78% 93.7%);
}

#el-318 {
	background-color: #55575B;
	clip-path: polygon(73.6% 92.6%, 75.6% 90.6%, 78% 93.7%);
}

#el-319 {
	background-color: #434247;
	clip-path: polygon(73.6% 92.6%, 75.6% 90.6%, 71.4% 92.4%);
}

#el-320 {
	background-color: #555557;
	clip-path: polygon(73.3% 87.7%, 75.6% 90.6%, 71.4% 92.4%);
}

#el-321 {
	background-color: #4B4A4B;
	clip-path: polygon(73.3% 87.7%, 68.2% 91.9%, 71.4% 92.4%);
}


            
          
!
999px
Close

Asset uploading is a PRO feature.

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

Go PRO

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

Console