Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

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

+ add another resource

JavaScript

Babel is required to process package imports. If you need a different preprocessor remove all packages first.

Add External Scripts/Pens

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

+ add another resource

Behavior

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.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML Settings

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

HTML

            
              <svg width="90%" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 804 340" xml:space="preserve">
<style type="text/css">
  path {display:inline;fill-rule:evenodd;clip-rule:evenodd;}
	.st2{fill-rule:evenodd;clip-rule:evenodd;fill:#88CE02;stroke:#000000;stroke-linejoin:round;stroke-miterlimit:10;}
	.st3{opacity:0.4;fill-rule:evenodd;clip-rule:evenodd;}
	.st5{fill-rule:evenodd;clip-rule:evenodd;}
	.st6{fill-rule:evenodd;clip-rule:evenodd;fill:#EFEFEF;}
	.st7{fill-rule:evenodd;clip-rule:evenodd;fill:#001423;}
	.st8{opacity:0.3;fill-rule:evenodd;clip-rule:evenodd;}
	.st9{opacity:0;fill-rule:evenodd;clip-rule:evenodd;}
	.st10{fill-rule:evenodd;clip-rule:evenodd;fill:#88CE02;stroke:#000000;stroke-width:2.6415;stroke-linejoin:round;stroke-miterlimit:10;}
	#capeTop1 {stroke-width: 5px; stroke: black; }
  #capeBottom1 {stroke-width:5px;}
</style>
<g id="capeFlow1">
  <clipPath id="myClip">
	<path id="capeBottom1" class="st2" d="M188.04,77.86c-11.57,3.84-18.65,6.64-42.21,17.31c-13.1,5.93-49.09,20.5-57.83,36.55
		c29.14-16.88,35.59,4.6,37.88,28.49c2.14,22.31,13.4,34.04,41.95,33.33c29.56-0.74,38.42,16.45,46.62,36.58
		c15.76-77.17,13.98-89.36,17.81-99.91C230.07,100.26,203.92,72.13,188.04,77.86z"/>
  </clipPath>
  <use href="#capeBottom1"/>
  <path id="shadowTop1" class="st3" clip-path="url(#myClip)" d="M175.4,95.18c-14.91,6.06-55.2,22.35-65.98,28.15c-2,0.83-26.42,14.29-26.42,14.3
		c2.33,6.84,28.5,46.39,30.67,46.2c2-0.17,10.42-10.08,13.28-16.68c9.78-26.76,44.93-55.12,46.31-57.32
		c0.6-0.96-0.86-5.33,1.51-9.45C177.83,95.08,183.8,91.77,175.4,95.18z"/>
  <path id="capeTop1" class="st2" d="M248.13,52.76c-43.89,15.31-87.51,19.08-138.64,50.62c-12.23,7.54-37.78,24.51-42.76,56.92
		c18.71-20.72,61.75-46.59,114.61-63.13c26.6-8.33,46.13-13.77,69.8-22.97C249.47,63.6,249.53,59.41,248.13,52.76z"/>
	<path id="shadowBottom1" class="st3" clip-path="url(#myClip)" d="M210.16,226.76c12.34-15.51,8.53-34.84,8.41-52c-0.05-7.22,5.16-17.37,2.56-14.46
		c-10.02,11.2-35.23,31.88-53.29,33.24c-40.84,3.08-44.09,13.51-41.77,18.45C131.36,223.31,207.94,238.18,210.16,226.76z"/>
</g>
<g id="GUY" style="opacity: 1; visibility: visible;">
<path d="M223.87,290.68c1.54,9.06,0.23,9.64-9.08,10.74s-16.2-2.29-18.72-4.65s-3-7.55-0.55-12.18c1.58-2.99,3.07-4.07,3.9-7.64
		c0.83-3.57,1.58-4.4,2.24-5.65s0.8-2.38,1.05-10.52c0.25-8.14,0.07-23.55,0.87-29.9c0.83-6.6,29.56,2.96,29.56,2.96
		s-6.81,16.95-8.64,21.1s-1.66,12.21-1.66,13.87c0,1.66-0.66,4.98-1.16,5.23c-0.5,0.25,1.74,4.49,0.75,6.98
		S223.65,289.38,223.87,290.68z"></path>
<path d="M234.78,36.18c-1.01-6.39-0.06-18.85,1.4-20.8c4.23-5.69,26.2-6.39,30.83,0.4c1.99,2.92,1.84,9.99,1.46,14.42
		s-1.46,14.12-1.73,17.28c-0.2,2.36-24.25,5.93-29.62-0.33C235.63,45.41,234.78,36.18,234.78,36.18z"></path>
<path d="M283.73,274.62c10.09,7.25,17.96,8.72,23.09,11.38c5.14,2.66,3.76,7.76-4.82,9.3c-7.02,1.26-18.02-1.36-25.25-1.33
		s-23.67,0.87-27.99-2.16c-4.98-3.49-2.82-9.97-2.82-9.97c1.33-3.74,4.73-11.8,3.65-18.52c-1.08-6.73-2.35-10.39-4.87-16.41
		c-2.52-6.02-4.35-21.39-1.94-22.22s1.74-0.08,4.65,0.75c2.91,0.83,6.4,1.66,12.88,1.66s13.71-1.08,16.2-1.58s4.52-0.92,3.65,4.24
		c-0.86,5.15-3.32,14.79-3.49,22.26c-0.17,7.48-0.17,16.11,0.42,17.69S281.07,272.71,283.73,274.62z"></path>
<path class="st5" d="M304.21,143.96c0,0-3.22,10.84-9.46,14.26c0.07-0.06-4.71,1.69-14.01-3.54c-2.67-1.5-4.61-6.68-4.55-8.27
		c0.16-4.03,2.58-5.86,2.58-5.86s2.65-4.46,5.84-4.28c3.19,0.18,8.45,0.66,10.13-0.87C296.44,133.89,304.64,138.61,304.21,143.96z"></path>
<path class="st5" d="M236.32,39.3c0,0-0.64,8.46-1.82,13.9c-0.2,0.95-5.16,1.49-8.87,3.04c6.99,19.98,49.19,19.74,54.62,9.96
		c-2.62-1.79-8-4.65-10.54-5.73c-2.55-1.07-2.4-0.78-2.55-5.49c-0.15-4.71-0.51-13.24-0.8-15.63
		C266.07,36.97,240.39,36.97,236.32,39.3z"></path>
<path class="st6" d="M237.92,39.3c0,0-0.07,4.83-0.45,9.57c-0.17,2.15-0.4,3.44-0.72,5.09c-0.19,0.98,5.68,4.94,7.29,13.85
		c8.07,17.87,26.48,8.97,34.11,0.49c-2.68-1.89-6.97-4.29-11.95-6.39c-2.54-1.07-1.38-3.16-1.53-7.88
		c-0.15-4.71-0.8-11.57-1.09-13.96C263.3,37.69,241.99,36.97,237.92,39.3z"></path>
<path class="st5" d="M236.32,39.3c0,0-0.23,2.98-0.66,6.55c2.22,2.21,5.02,5.15,7.16,6.98c1.53,1.3,5.24,1.11,8.5,1.12
		c3.06,0.01,5.69,0.3,6.89-0.3c2.74-1.37,6.53-4.74,8.6-7.21c-0.15-3.08-0.31-5.87-0.46-7.08C266.07,36.97,240.39,36.97,236.32,39.3
		z"></path>
<path class="st5" d="M251.51,51.95c-1.94,0-4.36-0.12-6.22-0.54c-0.86-0.2-1.6-0.62-2.29-1.07c-1.14-0.75-2.34-1.77-3.73-2.81
		c-2.61-1.96-2.83-3.14-2.77-3.7c1.16-10.55-0.41-19.39-0.41-19.39s-1.11-4.53,5.19-5.73c6.29-1.19,10.16-1.25,10.16-1.25
		s3.92,0.06,10.22,1.25c6.3,1.19,5.19,5.73,5.19,5.73s-1.57,8.84-0.41,19.39c0.06,0.56-0.15,1.74-2.77,3.7
		c-2.33,1.75-4.15,3.46-6.02,3.88C255.78,51.83,253.45,51.95,251.51,51.95z"></path>
<path class="st5" d="M251.51,13.35c-11.02,0.06-13.24,3.03-16.31,6.4c-0.72,0.79-0.11,5.84,0.96,16.51h1.54
		c0,0-0.98-3.04-0.84-6.56c0.14-3.52,0.91-3.28,0.28-4.24c-0.63-0.95-1.95-2.63,0.98-4.3c2.93-1.67,7.67,1.31,13.26,1.49
		c5.59-0.18,10.5-3.16,13.43-1.49c2.93,1.67,1.61,3.34,0.98,4.3c-0.63,0.95,0.14,0.72,0.28,4.24c0.14,3.52-0.84,6.56-0.84,6.56h1.54
		c1.04-10.67,1.64-15.38,1.1-16.15C265.24,16.37,262.54,13.41,251.51,13.35z"></path>
<path class="st5" d="M304.28,144.56c0,0-3.12,10.18-9.36,13.6c-1.38-0.62-1.12-1.72-2.32-3.19c-0.42-0.51-1.47-0.75-1.97-1.34
		c-0.43-0.51-0.39-1.37-1.14-1.99c-0.75-0.62-1.24-0.2-1.83-0.74c-0.68-0.62-0.76-1.47-1.35-2c-0.35-0.32-1.61-0.46-1.98-0.82
		c-0.8-0.78-8.18-2.39-7.8-3.95c0.64-2.56,2.04-4.36,2.04-4.36s3.14-4.66,6.33-4.48c3.19,0.18,6.12,0.82,7.8-0.7
		C294.4,133.08,304.71,139.21,304.28,144.56z"></path>
<path class="st5" d="M282.65,70.98c0,0,10.57-2.55,17.7,4.37c7.13,6.92,6.74,15.67,4.56,21.04c1.82,2.09,5.16,8.11,2.62,15.39
		c11.04,9.33,6.13,23.68-3.61,33.1c0,0-2.32-8.67-11.61-9.18c0.26-3.33-8.59-6.06-4.52-14.7c-6.4-1.58-6.18-5.82-7.2-11.19
		C279.55,104.45,282.65,70.98,282.65,70.98z"></path>
<path class="st6" d="M278.86,75.56c0,0,12.19-6.11,19.31,0.81c7.13,6.92,5.12,14.65,2.94,20.02c1.82,2.09,6.14,8.37,3.53,15.64
		c-0.58,1.61-4.11,1.64-6.77,6.05c6.72-3.82,10.85-2.91,12.39,2.08c2.33,7.55-2.84,16.56-7.32,21.52c-0.08-0.17-0.16-0.34-0.25-0.51
		c-0.59,2.45-1.54,7.39-6.48,12.71c-2.46,2.65-4.52,2.39-7.3,1.69c-3.34-0.84-4.52-2.3-9.23-4.88c-2.68-1.47-1.24-3.25-1.17-4.84
		c0.01-0.3,0.33-0.84,0.81-1.48c0.31-0.9,1.29-2.14,2.85-3.59c0,0,2.18-2.99,5.38-2.89c3.13,0.1,6.43-0.5,7.37-1.38v-0.06
		c0.03-5.85-6.64-5.98-4.37-16c0.11-0.49,0.96-1.37,3.64-1.59c-4.02-0.76-5.84-1.07-8.71-3.75c-1.95-1.81-3.5-4.14-4.06-7.09
		C280.39,102.66,278.86,75.56,278.86,75.56z"></path>
<path class="st5" d="M243.66,65.07c-0.95-1.37-6.09-7.97-15.99-10.68c-2.85-0.78-4.58,1.49-7.42,3.1c-0.8-0.48-4.51-2.15-6.47-1.01
		c-1.96,1.13-3.27,2.33-5.38,3.16c-1.05-0.43-2.52-1.1-4.72-0.32c-2.1,0.74-6.69,2.77-9.82,7.2c-2.04,7.22,35.27,1.83,35.27,1.83
		L243.66,65.07z"></path>
<path class="st2" d="M244.03,65.07c-5.4-1.83-4.43-8.02-16.4-9.07c-2.26-0.2-3.78,1.69-5.54,2.91c0.86,0.86,1.68,2.15,2.08,3.54
		c-1.44-1.74-4.16-3.86-6.82-4.37c-2.42-0.47-4.15,1.35-6.88,2.74c0.52,0.56,1.07,1.29,1.65,2.27c-2.4-1.54-4.01-1.92-7.12-0.82
		c-2.1,0.74-6.34,2.54-9.47,6.97c-2.04,7.22,33.58-0.89,33.58-0.89L244.03,65.07z"></path>
<path class="st5" d="M275.33,67.76c0,0,0-1.9-0.1-3.47c-0.02-0.4-1.29-1.22-1.33-1.55l-0.27-0.36c0,0,2.61-1.42,4.72-0.71
		c2.11,0.72,3.35,3.46,3.35,3.46c3.81-1.3,4.19,0.17,5.93,2.24c3.93-0.89,4.45,0.64,6.94,4.38c0,0-2.98-0.42-8.8,0.42
		C279.96,73.01,275.23,67.58,275.33,67.76z"></path>
<path class="st2" d="M274.63,66.86c0,0,1.02-0.88,0.68-1.07c1.83-0.94,4.27-2.1,5.51,0.95c3.81-1.3,4.4,0.5,6.14,2.56
		c4.64-2.18,4.94,0.44,5.39,1.72c-1.47,0-3.67,0.1-6.58,0.52C279.96,72.38,274.53,66.68,274.63,66.86z"></path>
<path class="st5" d="M217.92,62.75c0,0,9.49,3.4,17.49,2.8c8-0.6,21.64-1.25,29.06,3.04c0,0,7.56-2.62,14.54-0.84
		c6.98,1.79,19.87,13.89,16,26.49c-0.28,0.91-2.55,2.09-4.95,2.98c0,0,1.31,5.73-1.02,10.26c-2.28,4.44-7.54,13.13-7.64,25.12l0,0
		c-0.23,1.94-0.52,6.15-0.75,8.12c-12.94-0.48-33.04-5.25-52.62-4.95c0.17-2.19,0.27-3.48,0.58-5.67l0.48,0
		c-1.02-5.43-1.38-8.33-2.35-12.41c-6.4-4.06-13.05-8.67-18.72-17.5C202.36,91.36,217.92,62.75,217.92,62.75z"></path>
<path class="st5" d="M282.36,152.65c0,0,10.32,36.91-1.89,52.42c0,0,1.89,7.09-2.33,14.84c-0.65,3.32-1.54,6.3-2.07,9.67
		c-2.18,13.88-5.83,19.63-6.8,41.74l-10.04-0.24c0,0-1.16-15.99-4.65-24.46c-1.96-4.76-9.87-11.35-9.47-17.85
		c0.31-5.06,1.41-9.22,9.76-15.8c0.68-9.72-9.04-18.8-7.56-54.77L282.36,152.65z"></path>
<path class="st6" d="M279.24,151.19c2.67,17,8.84,42.13-2.26,54.44c0.51,2.4,0.76,5.64,0.1,9.45c-0.34,2-0.94,4.15-1.87,6.43
		c-1.6,3.92-2.25,9.87-2.78,13.24c-2.18,13.88-2.19,14.46-3.16,36.58l-10.04-0.24c0,0-1.16-15.99-4.65-24.46
		c-1.96-4.76-6.09-9.03-6.48-15.53c-0.3-5.02,3.13-14.91,11.45-14.74c-0.54-20.23-9.84-16.09-12.24-58.15L279.24,151.19z"></path>
<path class="st6" d="M217.92,62.75c0,0,3.59,1.16,7.71,1.58c3.93,0.4,8.31,0.05,12.22-0.24c8-0.6,19.32-1.52,26.74,2.78
		c0,0,4.2-1.34,8.66-1.03c2.04,0.14,4.04,1.86,6.33,2.46c7.28,1.91,14.4,13.99,11.09,25.04c-0.27,0.91-2.66,0.08-5.28,0.79
		c0.45,2.29,0.86,7.74-1.91,13.37c-2.77,5.63-6.44,12.93-5.85,26.99c-17.41-0.8-25.27-1.96-42.68-2.75
		c-1.5-6.1-2.42-12.34-2.7-15.48c2.39-1.25,3.71-2.15,5.57-4.09c-5.03,0.8-6.97,0.49-10.06-1.21c-3.06-1.69-8.32-6.96-10.98-10.56
		c-0.27-0.37-2.19,5.18-6.3,5.34c-1.44-2.16,4.75-8.34,3.68-10.61C210.17,86.65,217.92,62.75,217.92,62.75z"></path>
<path class="st5" d="M280.68,137.38c0,0,0.36,5.97,0.36,7.58c0,1.61,1.33,6.6,1.55,9.04c-1.89,3.1-9.84,10.29-24.24,12.91
		c-14.25,2.98-33.31-19.57-33.31-19.57c0.58-2.21,2.1-8.57,3.32-11.81c0.15-0.41,0.45-1.21,0.58-1.46
		C230.11,131.81,280.68,137.38,280.68,137.38z"></path>
<path class="st6" d="M277.01,137.86c0.08,4.13,0.74,7.2,1.19,9.89c0.82,4.89,2.13,8.05,2.13,11.1c0,9.69-12.72,8.02-23.31,8.34
		c-14.25,2.98-26.4-19.57-26.4-19.57c1.01-3.83,1.65-8.11,3.25-11.87l-0.02,0c0.18-1.97,0.53-4.5,0.72-5.66
		c20.28,0.06,34.64,1.11,43,2.04C277.55,134.03,277.27,137.24,277.01,137.86L277.01,137.86z"></path>
<path class="st5" d="M261.05,159.3c0,0-8.88-19.6-35.35-13.75c-6.4,17.78-14.75,38.3-9.37,60.38
		c-5.53,7.52-11.78,11.69-11.78,25.54c0,13.84,0.73,16.23,0.73,16.23l19.49,1.07c0,0,6.38-8.1,8.91-16.99
		c0.73-2.58,1.25-7.07,0.91-12.19c0.61-0.92,3.42-3.4,3.78-7.88c0,0,9.45-5.02,15.01-17.23
		C258.38,183.49,257.05,174.02,261.05,159.3z"></path>
<path class="st6" d="M261.05,159.3c-0.45-1.77-7.24-19.89-31.75-14.41c-14.53,38.61-9.15,54.56-6.99,61.62
		c-9.83,12.48-14.29,15.12-12.37,40.45l13.03-0.02c5.92-9.46,7.31-12.94,7.65-25.42c0.01-0.47-1.91,0.96-3.14,2.69
		c1.02-5.21,3.8-6.17,5.99-9.33c0.97-1.4,1.81-3.34,1.88-5.95c11.58-7.9,15.91-17.69,18.46-27.84
		C255.61,173.95,258.02,162.49,261.05,159.3z"></path>
<path class="st5" d="M219.79,132.48c0,0,4.56,0.1,8.41,1.5c3.86,1.41,3.87,2.17,5.35,3.86c1.53,1.75,5.15,4.21,4.49,6.65
		c-0.36,1.33-1.21,1.61-2.4,2.89c-0.53,0.57-4.17,4.47-4.98,4.98c-0.56,0.35-1.11,0.82-1.72,1.16c-0.48,0.26-1.96,1.41-2.48,1.66
		c-1.73,0.84-2.82,1.27-4.65,1.16c0,0-4.14-0.14-6.76-2.94c0,0-0.28-1.38,0.39-2.04c0,0-3.56-3-4.51-5.03
		c-0.95-2.03-0.96-4.77-0.42-6.31C211.07,138.49,217.51,134.3,219.79,132.48z"></path>
<path class="st5" d="M224.01,294.56l-0.5,4.15c0,0-1.44,1.9-12.71,1.66c-11.27-0.24-14.34-3.66-15.28-5.57l-0.66-4.32
		c0,0,2.15-3.14,2.71-3.09c3.66,0.33,16.21,5.27,24.86,6.6C223.17,294.12,223.35,294.45,224.01,294.56z"></path>
<path class="st5" d="M248.17,286.06c-0.01,1.91-0.17,1.79-0.18,3.7c2,1.57,6.94,2.36,16.54,2.09c13.88-0.39,26.64,4.22,42.25,1.49
		l0.14-2.98l-1.45-0.24l-55.41-4.48L248.17,286.06z"></path>
<path class="st5" d="M260.3,291.9c1.3,0.01,2.71-0.01,4.23-0.05c9-0.25,17.53,1.6,26.67,2.18c4.85-0.23,10.91-1.25,10.26-4.79
		l-47.24-3.94C251.26,288.41,253.45,291.02,260.3,291.9z"></path>
<path class="st5" d="M206.06,221.8c1.53,0.94,11.64,6.98,28.08,6.15c-0.33,3.14-0.12,9.4-7.49,20.17
		c-3.63,5.31-6.84,14.62-7.42,26.43c0.12,2.71,1.73,4.96-0.36,8.41c0.62,2.1,3.27,6.5,4.58,9.13s2.04,5.61-6.91,5.79
		c-8.94,0.18-23.43-0.87-21.53-7.76c1.03-3.73,3.77-7.46,4.14-9.01c0.36-1.55,0.29-5.97,3.2-9.07c2.47-8.29,1.71-16.36,1.09-23.86
		C202.82,240.71,202.69,228.09,206.06,221.8z"></path>
<path class="st5" d="M221.49,86.01c11.84-15.78,1.9-28.46-17.12-24.64c-7.66,1.54-15.36,6.76-15.86,16.42
		c-2.47,0.41-8.18,0.7-11.02,10.97c-2.21,7.98-3.29,9.49-7.11,13.54c-2.44,2.88,0.21,8.66,1.95,12.78
		c6.08,14.33,25.19,15.67,37.95,26.56c4.35-1.19,8.79-5.92,10.18-9.12c-10.75-12.89-8.49-17.87-12.76-24.41
		C212.35,106.37,223.01,99.91,221.49,86.01z"></path>
<path class="st6" d="M219.19,85.07c0.71-0.94,1.83-3.08,2.41-3.98c0.14-0.22,2.05,3.03,2.19,2.81c4.58-7.33,5.64-18,0.54-19
		c-1.12-0.22-3.3-0.69-5.14-1.34c-3.28-1.15-6.41-1.17-11.71-0.19c-7.4,1.37-14.61,6.7-14.7,14.34c-0.01,0.49,5.1,2.04,6.67,8.14
		c-2.47-3.44-6.78-7.4-12.04-4.02c-5.41,3.48-2.63,11.52-10.06,19.85c-2.48,2.78-2.11,6.19,0.56,12.79
		c4.28,10.55,24.86,16.22,36.04,26.19c2.64-1.09,4.55-3.79,5.75-5.82c-7.48-7.86-10.46-15.16-12.72-20.49
		c-2.61-6.17-5.58-9.62-11.48-14.38c3.05,1.2,5.28,2.25,6.71,3.26c1.54,1.08,3.67,1.08,5.61,0.54
		C214.94,101.39,218.77,91.36,219.19,85.07z"></path>
<path class="st5" d="M291.62,87.75c-0.44,6.31-5.14,3.09-7.72,1.98c-4.92-2.12-10.02-3.61-15.9-3.67
		c-5.76-0.06-13.38,0.44-19.79,2.21c-8.91,2.47-11.59,2.38-15.6,0.27c-4.01-2.1-11.02-7.46-11.02-7.46s-0.22,1.73,1.5,3.82
		c2.17,2.65,6.93,5.98,13.54,8.21c3.09,1.05,5.71,0.38,8.52-0.32c14.74-3.69,30.48-4.39,43.63,3.7c0.58,0.36,3-0.59,4.02-2.24
		C294.12,92.13,291.62,87.75,291.62,87.75z"></path>
<path class="st7" d="M215.86,151.19c1.35,0.76,2.92,1.34,4.8,2.81c0,0-1.46-0.04-2.19-0.61c-0.72-0.57-2.44-1.96-2.76-2.09
		C215.77,151.25,215.82,151.22,215.86,151.19z"></path>
<path class="st6" d="M263.95,19.04c-0.44-1.55-4.11-4.24-12.72-4.23c-9.14,0.02-11.8,2.79-12,4.27c-0.07,0.5-0.68,5.85-0.76,7.98
		c-0.01,0.06-0.01,2.71,0.17,6.73c0.12,2.66,0.8,4.19,1.13,7.64c0.35,3.61,1.37,6.06,3.23,8.91c0.78,0.51,1.53,0.96,2.29,1.13
		c3.25,0.73,9.19,0.77,12.36-0.06c1.87-0.42,4.18-3.73,4.71-6.46c0.66-3.52,1.35-6.08,1.46-8.24c0.29-2.16,0.55-7.02,0.7-8.34
		C264.95,25.15,264.1,19.53,263.95,19.04z"></path>
<path d="M246.43,225.02c0,0,8.82,3.91,30.65,0.51c0,0-6.22,30.99-3.31,46.38c0,0,2.76,3.94,23.85,11.69c0,0,9.38,2.39,8.95,6.92
		c0,0,0.29,1.01-10.98,0.72c-11.27-0.3-22.04-2.27-29.53-2.27c-7.49,0-15.42,0.3-16.87-1.79c-1.44-2.07,0.29-7.23,2.47-10.14
		c2.33-3.1,1.67-5.43,1.53-11.22C252.83,250.98,241.48,235.64,246.43,225.02z"></path>
<path class="st2" d="M244.68,227.84c-1.17,1.6,0.14,7.92,1.85,14.09s5.39,9.9,6.25,19.91c0.85,10.01,0.99,11.3-1.85,17.23
		c-2.84,5.94-3.69,11.18,6.25,11.3c9.94,0.12,15.19-0.12,25.12,1.28c9.94,1.4,13.48,1.98,19.02,1.16c5.54-0.82,6.67-2.68,4.26-4.31
		c-2.41-1.63-11.92-3.49-16.18-6.75c-4.01-3.07-15.33-8.03-15.47-9.32c-0.5-4.53-0.71-20.84,0.14-26.2s1.99-12.93,2.41-15.02
		c0.43-2.1,1.99-4.08-0.85-3.38c-2.84,0.7-13.48,2.21-21.43,1.63C246.24,228.89,245.11,227.26,244.68,227.84z"></path>
<path class="st8" d="M250.36,279.31c2.84,1.28,6.95,2.33,10.22,2.33c0,0-1.14,5.47,0.71,8.85c1.85,3.38-13.34,1.28-13.34,1.28
		l-0.71-11.76L250.36,279.31z"></path>
<path class="st8" d="M294.5,293.52c2.7-0.82,4.54-3.84,2.27-6.64c-2.27-2.79-4.26-3.38-1.28-3.49s14.07,6.53,14.07,6.53l-5.7,5.11
		L294.5,293.52z"></path>
<path class="st8" d="M244.13,234.3c3.83,1.31,9.69,1.75,14.69,1.57c5-0.17,12.56-0.87,17.35-2.45c4.79-1.57,2.87,1.83,2.87,1.83
		l-2.69,2.47c0,0-6.39,2.45-16.61,2.27c-12.14-0.21-15.76-1.57-15.76-1.57L244.13,234.3z"></path>
<path class="st8" d="M244.5,242.68c3.83,1.31,9.69,1.75,14.69,1.57s11.71-0.24,16.46-1.92c1.93-0.68,0.85,2.1,0.85,2.1l-0.81,1.46
		c0,0-6.48,2.31-16.7,2.13c-12.14-0.21-14.27-1.1-14.27-1.1L244.5,242.68z"></path>
<path class="st9" d="M246.43,225.02c0,0,14.51,5.16,30.8,1.7c0,0-6.36,29.8-3.45,45.2c0,0,2.76,3.94,23.85,11.69
		c0,0,9.38,2.39,8.95,6.92c0,0,0.29,1.01-10.98,0.72c-11.27-0.3-22.04-2.27-29.53-2.27c-7.49,0-15.42,0.3-16.87-1.79
		c-1.44-2.07,0.29-7.23,2.47-10.14c2.33-3.1,1.67-5.43,1.53-11.22C252.83,250.98,241.48,235.64,246.43,225.02z"></path>
<path class="st9" d="M246.43,225.02c0,0,14.51,5.02,30.8,1.56c0,0-6.36,29.95-3.45,45.34c0,0,2.76,3.94,23.85,11.69
		c0,0,9.38,2.39,8.95,6.92c0,0,0.29,1.01-10.98,0.72c-11.27-0.3-22.14-3.51-29.53-2.27c-7.78,1.31-15.54,0.84-16.87-1.79
		c-1.14-2.25,0.29-7.23,2.47-10.14c2.33-3.1,1.67-5.43,1.53-11.22C252.83,250.98,241.48,235.64,246.43,225.02z"></path>
<path d="M233.47,125.8c0,1.25,13.06,7.69,20.16,9.07s22.14-0.06,24.56-0.47l-0.34,2.33c0,0-17.81,2.58-31.44-1.02
		c-13.63-3.61-12.22-4.58-12.22-4.58L233.47,125.8z"></path>
<g>
<path class="st6" d="M205.65,267.88c1.95,1,9.13,2.76,13.82,1.81c0.64-0.15,0.02-11.53,1.89-16.58c2.62-7.1,6.96-12.91,8.99-25.7
			c-7-0.71-15.05-2.43-19.21-3.9C205.8,239.98,207.73,254.03,205.65,267.88z"></path>
<path class="st6" d="M216.89,278.42c1.11,0.31,1.92,1.68,2.25,0.87c0.62-1.51-1.24-4.27-1.36-6.38c-0.01-0.23-0.01,0.01-0.01-0.23
			c-1.48-1.35-11.65-1.53-10.97-0.75c-1.16,2.25-3.03,1.76-3.74,6.09c-0.35,2.16,2.38,0.32,4.83,0.22
			c-4.47,2.99-9.65,6.85-10.43,10.2c-1.07,4.6,0.68,5.94,5.6,8.52c4.28,0.96,9.44,1.13,13.47,0.93c4.43-0.77,5.38-2.93,4.01-6.02
			C218.59,287.41,217.33,281.57,216.89,278.42z"></path>
</g>
<path class="st5" d="M218.7,62.03c5.42,3.15,13.09,2.3,15.96,2.1c0.62-0.04,7.3-1.15,7.66-1.06c0.6,0.14,0.61,0.67,0.61,0.67
		s-2.49,1.35-8.18,1.74c-5.34,0.36-11.6-0.08-15.21-1.63C215.5,62.11,218.7,62.03,218.7,62.03z"></path>
<path class="st5" d="M275.28,65.29c1.01,0.75,7.56,3.1,10.39,6.1c2.54,2.69,1.25,2.57,0.61,1.77c-0.64-0.8-5.88-4.34-7.82-5.15
		s-4.42-2.28-4.47-2.63C273.94,65.04,275.28,65.29,275.28,65.29z"></path>
<path class="st6" d="M217.84,134.45c4.84-0.27,9.8,0.8,13.04,4.1c1.68,1.71,4.35,3.44,3.97,5.16c-0.08,0.52-1.06,1.9-1.91,2.82
		c-0.51,0.59-1.92,2.17-2.57,2.7c-0.66,0.53-2.93,2.38-3.53,2.74c-0.47,0.28-1.22,1.11-1.73,1.38c-1.7,0.91-3.54,0.21-5.23-0.63
		c-1.6-0.79,0.41-0.94-1.48-2.26c-4.45-3.11-6.93-5.36-5.19-11.46C213.64,137.46,215.56,136.28,217.84,134.45z"></path>
<path class="st3" d="M236.63,93.11c-3.86-1.55-6.76,2.97-5.82,7.28c0.95,4.31,10.05,9.1,9.57,25.04
		c-0.39,13.01-3.18,18.35-3.18,18.35l-6.38-8.04c0,0-0.92-18.02-3.1-20.68s-8.93-7.43-11.61-10c-2.68-2.57,2.99-5.91,2.6-10.47
		c-0.39-4.55,2.9-13.52,2.9-13.52L236.63,93.11z"></path>
<path class="st3" d="M259.89,164.09c-0.41,12.52,2.5,31.03,3.6,39.83s2.68,9.49,0,13.48c-2.59,3.85-6.16,10.17-6.16,10.17
		l-11.48-1.01c0,0,9.19-11.59,9.72-13.82s-4.7-18.72-4.7-18.72L259.89,164.09z"></path>
<path class="st3" d="M237.72,47.37c2.26,5.14,5.19,7.42,9.58,9.05c2.7,1,13.23,2.36,17.38-2.38c1.87-2.13,0.65-7.96,0.65-7.96
		l-9.51,7.65l-12.89-2.34l-1.47-3.85L237.72,47.37z"></path>
<path class="st10" d="M238.7,58.98c4.32,2.86,15.11,5.43,18.14,6.05c3.03,0.62,7.76-3.18,10.19-4.21c2.57-1.09,6.81-1.83,11.8,2.74
		c0.57,0.53-1.21,2.65-1.21,2.65c-0.24-0.15-1.13-0.21-2.51-0.83c-1.35-0.6-2.54-1.23-4.42-1.01c-8.31,0.98-9.72,3.83-16.97,2.17
		c-7.24-1.65-9.17-2.97-16.28-2.72"></path>
<path class="st2" d="M237.22,59.47c5.55,2.39,16.15,4.88,19.17,5.5s7.79-2.27,10.15-3.75c4.15-2.6,9.56-0.42,11.99,2.35
		c1.62,1.85,2.27,3.05,2.27,3.49c0,0.6-1.95-0.02-1.95-0.02c-1.1-0.56-2.5-0.72-3.55-1.25c-1.32-0.67-2.74-1.64-4.62-1.42
		c-8.31,0.98-9.99,3.8-17.23,2.15c-7.24-1.65-9.06-3.24-16.71-2.69"></path>
<path class="st3" d="M288.55,107.83c0.44,2.55,1.88,7.31,4.43,9.64c1.22,1.11,1.38,1.5,0.39,1.5c-1.05,0-8.25-0.39-8.25-0.39
		l-1.99-3.43L288.55,107.83z"></path>
</g>
</svg>
            
          
!

CSS

            
              body,
html {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: black;
}
svg {
  width: 100%;
  max-height: 100%;
}
            
          
!

JS

            
              TweenLite.set("svg", {position:"absolute", left:"50%", xPercent:-50});
TweenLite.defaultEase = Power4.easeInOut;
var tl = new TimelineMax(),
		flap = new TimelineMax({repeat:10});

flap.add([
	waveSVG(document.getElementById("capeBottom1"), {taperEnd: 80, invertFlow:false, taperStart:2, loose:true, length:120, angle:-52, magnitude:10, phase:110, duration:2, start:6, end:14, repeat:10}),
	waveSVG(document.getElementById("shadowBottom1"), {taperEnd: 80, taperStart:2, loose:true, length:120, angle:-32, magnitude:10, phase:110, duration:2, start:7, end:12, repeat:10}),
	waveSVG(document.getElementById("shadowTop1"), {loose:true, length:120, angle:-16, magnitude:20, phase:-140, duration:2, start:10, end:13, repeat:10}),
	waveSVG(document.getElementById("capeTop1"), {loose:true, angle: 70, length:120, magnitude:10, phase:20, duration:2, start:2, end:9, repeat:10})
]);

tl.add(flap)




//the function below is a bit advanced and it handles the flapping cape. It leverages MorphSVGPlugin to do some heavy lifting, but ultimately relies on some custom trigonometry applied in an onUpdate to manipulate the points on a sine wave. 
function waveSVG(e, vars) {
	var _placeDot = function (x, y, vars) {
				var _createSVG = function(type, attributes) {
							var element = document.createElementNS("http://www.w3.org/2000/svg", type),
									reg = /([a-z])([A-Z])/g,
									p;
							for (p in attributes) {
								element.setAttributeNS(null, p.replace(reg, "$1-$2").toLowerCase(), attributes[p]);
							}
							return element;
						},
						dot = _createSVG("circle", {cx:x, cy:y, r:vars.size || 6, fill:vars.color || "red"}),
						container = vars.container || document.querySelector("svg");
				if (container) {
					container.appendChild(dot);
				}
				return dot;
			},
      _transformBezier = function(b, matrix) {
        var i, x, y;
        if (matrix && (matrix.a !== 1 || matrix.b || matrix.c || matrix.d !== 1 || matrix.e || matrix.f)) {
          for (var i = 0; i < b.length; i+=2) {
            x = b[i];
            y = b[i+1];
            b[i] = x * matrix.a + y * matrix.c + matrix.e;
            b[i+1] = x * matrix.b + y * matrix.d + matrix.f;
          }
        }
        return b;
      },
			_getLength = function(x, y, x2, y2) {
				x = x2 - x;
				y = y2 - y;
				return Math.sqrt(x * x + y * y);
			},
			_getTotalLength = function(bezier, start, end) {
				var x = bezier[start],
						y = bezier[start+1],
						length = 0,
						i;
				for (i = start; i < end; i += 2) {
					length += _getLength(x, y, x=bezier[i], bezier[i+1]);
				}
				return length;
			},
			_DEG2RAD = Math.PI / 180,
			_RAD2DEG = 180 / Math.PI,
			bezier = _transformBezier(MorphSVGPlugin.pathDataToRawBezier(e.getAttribute("d"))[0], (debug && e.transform.baseVal.length) ? e.transform.baseVal.consolidate().matrix : null),
			start = (vars.start || 0) * 2,
			end = (vars.end === 0) ? 0 : (vars.end * 2) || (bezier.length - 1),
			length = vars.length || 100,
			magnitude = vars.magnitude || 50,
			proxy = {a:0},
			debug = !!vars.debug,
			phase = (vars.phase || 0) * _DEG2RAD,
			taperStart = vars.taperStart || 0,
			taperEnd = vars.taperEnd || 0,
			startX = bezier[start],
			startY = bezier[start + 1],
			changes = [],
			bezierLength = 0,
			loose = !!vars.loose,//if true, we'll just make the points influence the current positions instead of forcing them strictly onto the wave.
			tl = new TimelineMax({repeat:vars.repeat}),
			bezierTotalLength, angle, i, x, y, dx, dy, sin, cos, sin2, cos2, m, pathStart, t, negCos, negSin, rotatedStartX;
	if (end >= bezier.length-1) {
		end = bezier.length - 2;
	}
	if (start >= bezier.length) {
		start = bezier.length - 1;
	}
	bezierTotalLength = _getTotalLength(bezier, start, end);

	dx = bezier[end] - startX;
	dy = bezier[end+1] - startY;
	if (vars.angle || vars.angle === 0) {
		angle = vars.angle * _DEG2RAD;
	} else {
		angle = Math.atan2(dy, dx) - Math.PI / 2;
	}
	sin = Math.sin(angle);
	cos = Math.cos(angle);
	sin2 = Math.sin(angle + Math.PI / 2);
	cos2 = Math.cos(angle + Math.PI / 2);
	negCos = Math.cos(-angle);
	negSin = Math.sin(-angle);
	rotatedStartX = startX * negCos + startY * negSin;

	if (debug) { //note: if debug is true, we drop a red dot at the beginning, yellow at the end, blue dots as control points, and purple as anchors.
		_placeDot(bezier[start], bezier[start + 1], {container: e.parentNode, color:"red"});
		_placeDot(bezier[end], bezier[end + 1], {container: e.parentNode, color:"yellow"});
		console.log("waveSVG() angle: ", angle * _RAD2DEG, "degrees. RED dot is start, YELLOW is end.");
	}

	x = startX;
	y = startY;
	for (i = start; i <= end; i += 2) {
		bezierLength += _getLength(x, y, x=bezier[i], y=bezier[i+1]);
		dx = x * negCos + y * negSin; //rotated in the opposite direction
		dy = x * negSin + y * negCos;
		t = (taperStart && bezierLength < taperStart) ? bezierLength / taperStart : (taperEnd && bezierLength > bezierTotalLength - taperEnd && bezierLength < bezierTotalLength) ? ((bezierTotalLength - bezierLength) / taperEnd) : 1; //taper
		m = Math.sin((dx / length) * Math.PI * 2 + phase) * magnitude;
		changes.push( {i: i - (start ? 2 : 0), p:dx, a: (dx / length) * Math.PI * 2 + phase, t:t, x: loose ? x - m * sin * t : startX + (dx - rotatedStartX) * cos2 * t, y: loose ? y - m * cos * t : startY + (dx - rotatedStartX) * sin2 * t, smooth: (i % 6 === 0 && i > start && i < end) ? Math.abs( Math.atan2(y - bezier[i-1], x - bezier[i-2]) - Math.atan2(bezier[i+3] - y, bezier[i+2] - x) ) < 0.01 : false} );
		if (debug) {
			changes[changes.length-1].dot = _placeDot(x, y, {container: e.parenNode, size:3, color: (i % 6) ? "blue" : "purple"});
		}
	}
	//when we're not animating the first point, optimize things by taking out the first x/y and treat them independently so we can merely bezier.join(",") on each update.
	if (start) {
		pathStart = "M" + bezier.shift() + "," + bezier.shift() + " C";
	}

	tl.to(proxy, vars.duration || 3, {a:Math.PI * (vars.invertFlow ? -2 : 2), ease:vars.ease || Linear.easeNone, onUpdate:function() {
		var l = changes.length,
				angle = proxy.a,
				node, i, m, x, y, x2, y2, x1, y1, cp, dx, dy, d, a, cpCos, cpSin;
		for (i = 0; i < l; i++) {
			node = changes[i];
			if (node.smooth || i === l - 1 || !changes[i + 1].smooth) {
				m = Math.sin(node.a + angle) * magnitude * node.t;
				bezier[node.i] = x = node.x + m * sin;
				bezier[node.i + 1] = y = node.y + m * cos;

				if (node.smooth) { //make sure smooth anchors stay smooth!
					cp = changes[i - 1];
					m = Math.sin(cp.a + angle) * magnitude * cp.t;
					x1 = cp.x + m * sin;
					y1 = cp.y + m * cos;

					cp = changes[i + 1];
					m = Math.sin(cp.a + angle) * magnitude * cp.t;
					x2 = cp.x + m * sin;
					y2 = cp.y + m * cos;

					a = Math.atan2(y2 - y1, x2 - x1);
					cpCos = Math.cos(a);
					cpSin = Math.sin(a);

					dx = x2 - x;
					dy = y2 - y;
					d = Math.sqrt(dx * dx + dy * dy);
					bezier[cp.i] = x + cpCos * d;
					bezier[cp.i + 1] = y + cpSin * d;

					cp = changes[i - 1];
					dx = x1 - x;
					dy = y1 - y;
					d = Math.sqrt(dx * dx + dy * dy);
					bezier[cp.i] = x - cpCos * d;
					bezier[cp.i + 1] = y - cpSin * d;
					i++;
				}
			}
		}
		if (debug) {
			for (i = 0; i < l; i++) {
				node = changes[i];
				node.dot.setAttribute("cx", bezier[node.i]);
				node.dot.setAttribute("cy", bezier[node.i + 1]);
			}
		} else if (start) {
			e.setAttribute("d", pathStart + bezier.join(","));
		} else {
			e.setAttribute("d", "M" + bezier[0] + "," + bezier[1] + " C" + bezier.slice(2).join(","));
		}
	}});
	return tl;
}
            
          
!
999px

Console