Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URLs added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using its URL and the proper URL extension.

+ add another resource

JavaScript

Babel includes JSX processing.

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

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

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.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

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

Visit your global Editor Settings.

HTML

              
                <div id="headwrap">
 
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="267 -253.7 549.3 522.7" enable-background="new 267 -253.7 549.3 522.7" xml:space="preserve"><pattern x="267" y="269" width="72" height="72" patternUnits="userSpaceOnUse" id="SVGID_1_" viewBox="0 -72 72 72" overflow="visible"><polygon fill="none" points="0 0 72 0 72 -72 0 -72 "/><polygon fill="none" points="0 0 72 0 72 -72 0 -72 "/></pattern><pattern x="267" y="269" width="72" height="72" patternUnits="userSpaceOnUse" id="SVGID_2_" viewBox="0 -72 72 72" overflow="visible"><polygon fill="none" points="0 0 72 0 72 -72 0 -72 "/><polygon fill="none" points="0 0 72 0 72 -72 0 -72 "/></pattern><pattern x="267" y="269" width="72" height="72" patternUnits="userSpaceOnUse" id="SVGID_3_" viewBox="0 -72 72 72" overflow="visible"><polygon fill="none" points="0 0 72 0 72 -72 0 -72 "/><polygon fill="none" points="0 0 72 0 72 -72 0 -72 "/></pattern><g id="head"><path id="left-face" fill="#FFC8B4" d="M677 129c-10 46-22 70-55.3 93.3 -36.3 25.4-58.4 31.6-79.9 31.6 -20.5 0-41.4-7.2-79.5-30 -38.8-23.2-54.2-46.3-63.6-73 -6.7-19-13.1-58.9-14.9-79 -1.2-13.8-2.4-55.3-2.4-55.3 -0.2-4.5-3.1-27-3.1-31.6 0-127.6-2-206 152.1-206 32.4 0 55.5 1 75.7 14.3 56.3 37.3 78.3 101.4 81.2 191.6 0 0 2.9 54.8 2.8 73C689.9 75.2 680.7 112.1 677 129z"/><defs><path id="SVGID_4_" d="M677 129c-10 46-22 70-55.3 93.3 -36.3 25.4-58.4 31.6-79.9 31.6 -20.5 0-41.4-7.2-79.5-30 -38.8-23.2-54.2-46.3-63.6-73 -6.7-19-13.1-58.9-14.9-79 -1.2-13.8-2.4-55.3-2.4-55.3 -0.2-4.5-3.1-27-3.1-31.6 0-127.6-2-206 152.1-206 32.4 0 55.5 1 75.7 14.3 56.3 37.3 78.3 101.4 81.2 191.6 0 0 2.9 54.8 2.8 73C689.9 75.2 680.7 112.1 677 129z"/></defs><clipPath id="SVGID_5_"><use xlink:href="#SVGID_4_" overflow="visible"/></clipPath><path id="right-face" clip-path="url(#SVGID_5_)" fill="#DBB0A5" d="M680.8 129c-16.4 54.2-29.2 74.7-49 91.5C592.3 254 540 254 540 254v-500.1l69 26.7c0 0 75.3 114 78.2 204.3C688-15.7 680.8 129 680.8 129z"/></g><path id="lEar" fill="#FFC8B4" d="M380.7-3.4c-1-0.5-2.7-7.8-11.6-7.1 -5.2 0.4-6.8 12.7-5.4 18.7 3.1 13-0.7 26.6 3.3 36.3 5.8 13.9 8.9 39.9 9.1 46.2 0.1 4.7 4.1 25.3 6 30.6 3.2 8.7 4.1 8.7 7.8 11.5 3.8 2.8 7.2 0.6 7.8-0.9 0 0-10.3-55.7-12.3-74.7C383.7 42.2 380.7-3.4 380.7-3.4z"/><path id="rEar" fill="#DBB0A5" d="M677 120c1.7 3.6 10.6 8.5 13.3-2 2.2-8.5 2.4-17.1 1.7-21.7 -0.6-4.4-4.5-50.5-0.6-61.3 3.5-9.7 1.5-23.4 2.5-36.8 0.5-6.2 4.5-17.4-2.5-17.7 -7.8-0.3-8.6 2.6-9.3 3.3 -5.8 4.6-2.9 47.4-2.3 63.2C680.7 66.5 667.7 100.7 677 120z"/><g id="mouth"><path id="XMLID_3_" fill="#E00B44" d="M483.2 131.7c21.4-0.2 33.8-4 39.9-4.2 6.8-0.2 13.3 1.7 21.9 1.7s10.2-1.4 18.4-2.1c7.8-0.7 21.5 3.4 46.5 1.7 -13.3 25.5-48.9 27.6-48.9 27.6s-8.8 5.8-16.2 5.8c-7.2 0-18.2-6.3-18.2-6.3S492.8 147 483.2 131.7z"/><defs><path id="SVGID_6_" d="M483.2 131.7c21.4-0.2 33.8-4 39.9-4.2 6.8-0.2 13.3 1.7 21.9 1.7s10.2-1.4 18.4-2.1c7.8-0.7 21.5 3.4 46.5 1.7 -13.3 25.5-48.9 27.6-48.9 27.6s-8.8 5.8-16.2 5.8c-7.2 0-18.2-6.3-18.2-6.3S492.8 147 483.2 131.7z"/></defs><clipPath id="SVGID_7_"><use xlink:href="#SVGID_6_" overflow="visible"/></clipPath><path clip-path="url(#SVGID_7_)" fill="#0F0F0E" d="M483.5 131.9c3.5 0 51.5 6.9 59.9 6.6 12.3-0.6 55.8-5.8 66.6-8.9 -14.1 7.2-51.7 21.1-64 20.9C524.7 150.1 483.5 131.9 483.5 131.9z"/><defs><path id="SVGID_8_" d="M483.2 131.7c21.4-0.2 33.8-4 39.9-4.2 6.8-0.2 13.3 1.7 21.9 1.7s10.2-1.4 18.4-2.1c7.8-0.7 21.5 3.4 46.5 1.7 -13.3 25.5-48.9 27.6-48.9 27.6s-8.8 5.8-16.2 5.8c-7.2 0-18.2-6.3-18.2-6.3S492.8 147 483.2 131.7z"/></defs><clipPath id="SVGID_9_"><use xlink:href="#SVGID_8_" overflow="visible"/></clipPath><path clip-path="url(#SVGID_9_)" fill="#FFFFFF" d="M587.8 133.3c0 0-17.7 7.6-28.6 9.3 -3.1 0.5-8.4 1.8-13.5 2 -7.8 0.3-17.5-2.4-20.3-3 -10.1-2-15.7-6.6-15.7-6.6s9.2 1.2 16.7 1.9c3.6 0.3 11.9 1 19.6 0.9 7.9-0.1 9.8-0.4 14.5-1C581.6 134.2 587.8 133.3 587.8 133.3z"/></g><g id="nose"><polygon fill="#EFEDED" points="512.7 78.7 539.4 -25.6 539.4 107 "/><polygon fill="#C6A26D" points="565.5 77.5 538.9 -26.7 538.9 105.9 "/></g><circle id="lEye" cx="477.8" cy="5.5" r="14.5"/><circle id="rEye" cx="600.8" cy="5.5" r="14.5"/><g id="lBrow"><path fill="#DD6B31" d="M525.2-14.3c-5.3-11.9-19.2-20.2-50.1-20.2 -13.9 0-31.8 1.3-35.9 5.4 -4.1 4.1-12 19.8-13.6 23.9s8.2 23.4 13.1 24.2c3.7-15.6-0.1-26.1 11.8-30.2 11.9-4.1 31.6-6.5 37.1-5.9C500.8-15.7 510-13 521.4-5c1.5 1.1 2.8 0.8 3.3-0.8C525.7-8.5 526-12.7 525.2-14.3z"/><pattern id="SVGID_10_" xlink:href="#SVGID_1_" patternTransform="matrix(5.1731 0 0 -5.1731 65206.8398 -84410.4531)"/><path fill="url(#SVGID_10_)" d="M525.2-14.3c-5.3-11.9-19.2-20.2-50.1-20.2 -13.9 0-31.8 1.3-35.9 5.4 -4.1 4.1-12 19.8-13.6 23.9s8.2 23.4 13.1 24.2c3.7-15.6-0.1-26.1 11.8-30.2 11.9-4.1 31.6-6.5 37.1-5.9C500.8-15.7 510-13 521.4-5c1.5 1.1 2.8 0.8 3.3-0.8C525.7-8.5 526-12.7 525.2-14.3z"/></g><g id="rBrow"><path fill="#DD6B31" d="M550.8-17.4c7.3-14.5 36.4-19.8 50.1-22.7 13.8-2.9 19.3-4.7 35.9 7.4 4.7 3.4 9.5 13.9 11.1 18 1.6 4.1-5.2 18.9-10.2 19.7 -3.7-15.6-0.4-17.2-12.3-21.3 -11.9-4.1-31.6-6.9-37.1-5.9 -9.8 1.7-26.9 14.1-31.8 14.1 -1.8 0-4.8 0.8-5.3-0.8C550.3-11.5 550-15.8 550.8-17.4z"/><pattern id="SVGID_11_" xlink:href="#SVGID_2_" patternTransform="matrix(5.1731 0 0 -5.1731 65184.8398 -84412.4531)"/><path fill="url(#SVGID_11_)" d="M550.8-17.4c7.3-14.5 36.4-19.8 50.1-22.7 13.8-2.9 19.3-4.7 35.9 7.4 4.7 3.4 9.5 13.9 11.1 18 1.6 4.1-5.2 18.9-10.2 19.7 -3.7-15.6-0.4-17.2-12.3-21.3 -11.9-4.1-31.6-6.9-37.1-5.9 -9.8 1.7-26.9 14.1-31.8 14.1 -1.8 0-4.8 0.8-5.3-0.8C550.3-11.5 550-15.8 550.8-17.4z"/></g><g id="hair"><path fill="#DD6B31" d="M680.6-15.7l-7.7-1c0 0 1.8-23.9 0-30.3 -1.8-6.5-8.1-20.7-8.5-32 -0.4-11.3-8.6-50.9-13.5-61.3 -1.7-3.5-4.8-8.7-9-14.4 -1.2-1.7-1 7.7-1 7.7s-8-15.3-9.1-16.6c-3.2-3.6-3.7-7.2-7.4-10.3 -2.2-1.9-0.8 8.2-0.8 8.2s-11.1-13-13.7-15.1c-5.3-4.1-13.6-5.1-22.7-4.5 -3 0.2-23.5 8.5-23.5 8.5s4.9-10 2-9c-15.5 5.5-30.1 13.5-37.7 15.1 -1.5 0.3 10.1-15.5 8.2-15.1 -1.4 0.3-21.6 14.4-24 15.8 -7.7 4.4-16.2 10.7-16.2 10.7s6.1-23.5 1.7-20.8c-2.2 1.4-5.9 4.4-9.5 7.5 -5.6 4.6-19.5 16.6-25.1 17.7 -4 0.8 10.3-21.3 5.5-19.1 -10.6 4.9-14.3 9.6-19.1 13.3 -2.9 2.2-13.2 11.5-15.9 13.1 -3.5 2.1 4.7-17.9 1.9-15.6 -2 1.7-6.7 6-9.6 10.1 -3 4.1-5.2 13.6-8.4 16.6 -3.3 3.2-3.1-7.6-5.9-5.6 -3.2 2.3-10.7 11.8-12.1 15.5 -10.8 29.5-11.3 59.6-9.9 70.8 1.3 11.2-2.7 19.6-1.9 32.5 0.4 6.7 6.9 29.1 6.9 29.1L386.5 8c-6.2-16.4-12.4-17.2-12.4-17.2 -1.3-10.6-7-54.8-7-54.8 -4.1-13.1 4.4-77.4 12.9-94.8 10-20.5 18.2-28.3 47.2-45.8 35.8-21.8 106-26.2 133.5-24.8 27.5 1.4 47.6 21.4 53 21.9s22.2 4.1 32.7 15.6c13.9 15.3 19.3 13.7 25.3 39 5.4 23 19.3 13.9 14.8 120.1C686.5-32.8 680.3-29.5 680.6-15.7z"/><pattern id="SVGID_12_" xlink:href="#SVGID_3_" patternTransform="matrix(5.1731 0 0 -5.1731 65198.5703 -84400.9063)"/><path fill="url(#SVGID_12_)" d="M680.6-15.7l-7.7-1c0 0 1.8-23.9 0-30.3 -1.8-6.5-8.1-20.7-8.5-32 -0.4-11.3-8.6-50.9-13.5-61.3 -1.7-3.5-4.8-8.7-9-14.4 -1.2-1.7-1 7.7-1 7.7s-8-15.3-9.1-16.6c-3.2-3.6-3.7-7.2-7.4-10.3 -2.2-1.9-0.8 8.2-0.8 8.2s-11.1-13-13.7-15.1c-5.3-4.1-13.6-5.1-22.7-4.5 -3 0.2-23.5 8.5-23.5 8.5s4.9-10 2-9c-15.5 5.5-30.1 13.5-37.7 15.1 -1.5 0.3 10.1-15.5 8.2-15.1 -1.4 0.3-21.6 14.4-24 15.8 -7.7 4.4-16.2 10.7-16.2 10.7s6.1-23.5 1.7-20.8c-2.2 1.4-5.9 4.4-9.5 7.5 -5.6 4.6-19.5 16.6-25.1 17.7 -4 0.8 10.3-21.3 5.5-19.1 -10.6 4.9-14.3 9.6-19.1 13.3 -2.9 2.2-13.2 11.5-15.9 13.1 -3.5 2.1 4.7-17.9 1.9-15.6 -2 1.7-6.7 6-9.6 10.1 -3 4.1-5.2 13.6-8.4 16.6 -3.3 3.2-3.1-7.6-5.9-5.6 -3.2 2.3-10.7 11.8-12.1 15.5 -10.8 29.5-11.3 59.6-9.9 70.8 1.3 11.2-2.7 19.6-1.9 32.5 0.4 6.7 6.9 29.1 6.9 29.1L386.5 8c-6.2-16.4-12.4-17.2-12.4-17.2 -1.3-10.6-7-54.8-7-54.8 -4.1-13.1 4.4-77.4 12.9-94.8 10-20.5 18.2-28.3 47.2-45.8 35.8-21.8 106-26.2 133.5-24.8 27.5 1.4 47.6 21.4 53 21.9s22.2 4.1 32.7 15.6c13.9 15.3 19.3 13.7 25.3 39 5.4 23 19.3 13.9 14.8 120.1C686.5-32.8 680.3-29.5 680.6-15.7z"/></g><g id="hat"><path fill="#2B6608" d="M369.3-104.5c0 0-13-138.1 172.5-135.5 142.5 2 143.5 135.5 143.5 135.5l-41 15.5 -104.8-3.1L430.2-90 369.3-104.5z"/><path display="none" fill="#FFFFFF" d="M532-183.2c-2.3 1.2-4.1 2.8-5.1 5.1 -0.8 1.8-0.2 2.7 1.8 2.9 0.2 0 0.4 0 0.7 0 -0.3 1.8-0.8 3.5-1.7 5 -0.6 1-1.3 1.9-2.2 2.7 -1.5 1.3-3.3 1.7-5.2 1.3 -3.6-0.6-6.3-3.1-6.6-6.5 -0.3-2.8 0-5.5 1.3-8.1 3.3-6.8 8.6-11.1 15.7-13.2 2.3-0.7 4.6-1.2 7-1.4 5.7-0.5 11.4-0.1 16.7 2.5 3.7 1.8 6.7 4.3 8.4 8.1 1.3 2.9 1.5 5.9 1.1 9 -0.8 6.3-4.4 10.7-9.7 13.9 -3 1.8-6.3 3.2-9.6 4.3 -0.6 0.2-0.8 0.5-0.8 1.1 0 6.4 0 12.7 0 19.1 0 1.9-0.3 3.8-1.3 5.5 -2.1 3.7-6.8 6-11 5.3 -3.3-0.5-5.1-3.1-4.5-6.5 0.5-2.8 1.8-5.3 3.6-7.4 1.2-1.3 1.6-2.6 1.5-4.3 -0.1-12.4 0-24.9 0-37.3C532-182.4 532-182.7 532-183.2zM544-167.5c1.6-0.5 3.1-0.8 4.6-1.4 4.1-1.6 6.3-5.4 5.6-9.7 -0.4-2.8-1.6-5.1-4.4-6.1 -1.9-0.7-3.8-0.7-5.8-0.4C544-179.3 544-173.5 544-167.5z"/><path fill="#204905" d="M685.3-106.3c0 3.6-9.3 29.8-42.3 39.5 -24.5 7.2-66.6-13.9-104-13.9 -35.5 0-76.4 23.6-105.2 16.7 -42.4-10.1-65.2-39.4-65.2-43.1 0-3.5 25.3 9.8 63.7 14 30.1 3.3 67.7-8.5 106.3-9 40.3-0.6 74.5 10.2 99.7 8.5C668.1-95.5 685.3-109.6 685.3-106.3z"/><path fill="#BACAD3" d="M544-175.7l-4.4 4.6c7.3-3.2 23.2-8.9 23.2-8.9l-5.1 4.9c13.9-4.6 24.5-6.9 24.5-6.9s-3 6.9-7.5 13.8c0.9-0.1 6.6-1.1 6.6-1.1s-5.1 8.4-11.1 14.5l3.4 0.6c0 0-5.2 7.4-12.1 13.5 -9.9 8.8-15 7.8-15 7.8 -7.4 5.4-13.3 3.1-13.3 3.1s2.5-6.2-0.1-6.7c-2.4-0.5-6 1.5-6.5 2.2 -0.4 1.6-2.4 5.5-4.4 8 -3.9 4.7-8.3 6.8-8.3 6.8s-3.5-2.6-3.5-7.3c0 0-2.3 2.4-6.2 3.4 -2.7 0.7-6.4 0.4-10.1-2.3 -2.6-1.9-3.1-8.5-3.1-8.5s2.3-4.4 6.9-8.3c-1-0.8-1.7-1.8-1.8-2.4 12.1-5.6 12.1-10.3 21.7-16.6C527.1-167.5 533.1-170.4 544-175.7"/><path fill="#004D55" d="M538.1-171.4l-3.8 3.9c7.5-3.5 23.4-9.4 23.4-9.4l-4.6 4.5c16.3-5.5 26.7-7.7 26.7-7.7s-3.3 7.2-7.8 13.5c2.2-0.3 6.7-1 6.7-1s-4.5 7.4-11.2 13.8c0.7 0.1 3.8 0.6 3.8 0.6s-4 5.9-11 12c-8.9 7.8-13 7.1-13 7.1s0.1-0.3 0.1-0.7c0-0.2 0-0.5 0-0.5 -6.9 6.5-12.7 4.7-12.7 4.7s2.5-5.9-1.4-6.9c-3-0.8-7.7 1.8-8 3.1 -0.4 1.4-2.3 5.3-4.2 7.6 -3.3 4-7 6-7 6s-3.3-2.3-2.2-9.4c0.2-1.6-0.1-2.1-0.3-2.4 -0.6-0.8-4.8 0.3-5.9 2.6 -0.7 1.6 3.5 2.7 3.5 2.7s-2 2.1-5.4 3c-2.2 0.5-5.5 0.5-9-2.1 -2.1-1.6-2.6-7.3-2.6-7.3s2.5-4.5 7.5-8.6c-1-0.6-1.7-1.6-1.9-1.9 10-4.6 11.4-10.4 22.7-17.4C525.7-165 531.3-168.3 538.1-171.4"/><path fill="#000114" d="M565-152.9c0.4 0.1 2 0.2 3 0.6 -3.4 5.4-13.7 16.3-19.5 17 -0.1-0.9-0.4-1.7-0.9-2.2 -2.1 3.8-8.7 6.4-11.5 6 3.3-11.7-10.9-6.6-11.9-3.4 -2.7 8.3-9.9 12.5-9.9 12.5s-2.3-2.3-1.4-7.9c0.7-4.1-2-3.8-2-3.8 -1.1 0-5.2 0.7-6.5 3.4 -1 2.2 2.7 3.6 2.7 3.6s-5.3 4.2-11.5-0.4c-1.5-1.2-2.1-6.2-2.1-6.2 2.9-4.8 6.8-7.9 8.4-9 -1.7-0.5-2.3-1.3-2.3-1.3 8.2-4 11.4-10.1 18.4-14.8 7.7-5.2 13.6-7.9 13.6-7.9l-2.2 2.8c0 0 1.9-0.8 2.7-1.3 7.4-3.8 19.9-8.1 19.9-8.1l-3.9 3.7c0 0 6.4-2.4 14.6-4.4 4.3-1.1 13.4-3.3 13.4-3.3s-2.1 6-6.6 12.2c2.7-0.3 5.7-0.6 5.7-0.6S572.1-159.6 565-152.9"/><path fill="#000114" d="M531.3-159.2c-0.1 0-0.2 0.1-0.3 0.1C531.1-159.1 531.2-159.1 531.3-159.2L531.3-159.2"/><path fill="#000114" d="M530.9-159.1C531-159.1 531-159.1 530.9-159.1 531-159.1 531-159.1 530.9-159.1"/><path fill="#FFFFFF" d="M540.8-145.8c0 0-4-1.6-10.2 0.6 0 0 8.6-5.2 19.5-3.7 -7.1-1.8-13.4-0.5-17.2 0.9 -2.2 0.9-3.5 1.6-3.5 1.6s0.6-0.4 1.6-1c2.5-1.9 6-4 9.5-5.5 2.4-1 7.2-2.5 9.1-2.7 0 0-5-0.5-9.6 0.8 0 0 7.2-3 14.2-3.5 2.4-0.1 7.7-0.2 7.7-0.2 -7.8-1.8-15.8-1.8-21.3-0.7 -3.1 0.9-5.6 1.7-5.6 1.7s0.4-0.2 1.3-0.6c2-1.2 10.1-5.7 25.1-8.7 0 0-1.9-0.1-4.3 0 -2.4 0.1-7.2 1.1-7.2 1.1 3.4-1.6 9.9-3.4 17.9-4.5 0 0-12.3-0.8-27.1 4.3 -0.1 0.1-0.2 0.1-0.2 0.1s1.5-1.1 3.3-2.3c1.3-0.9 3.2-2.2 3.2-2.2s-7.6 2.1-17.9 7.2c-2.9 1.4-4.4 2.3-4.4 2.3 0.4-0.5 2.5-2.3 3-2.9 -7.6 3.9-10.4 6.4-14.9 11.1 -4 4.2-3.8 4.9-10 8.4 0 0 4.5 1.5 9.1-1.5 0.8-0.5 1.5-1.3 2.2-2 1.6-1.8 1.1-3.6 3.2-5 -0.3 0.7-0.8 1.6-0.9 2.4 1-1.4 3-3.3 5.3-4.7 5.8-3.5 9.6-4.3 9.6-4.3 -0.2 0-0.3 0.1-0.4 0.2 -7.9 3.5-9.2 7.6-9.2 8 -0.1 0.9 2.9-1.3 5.2-1.7 -2.5 1-4.7 3.1-5.7 5.5 -0.4 1-0.6 2.1-1.8 3.1 -0.4 0.3-0.8 0.7-1.4 0.9 -1.6 0.8-2.8 0.5-3.2 0.3 -0.2-0.1-0.4-0.4-0.4-0.4 0.8 0.2 1.9-0.1 2.9-0.7 0.7-0.5 1.3-1.1 1.6-1.7 0.2-0.3 0.5-1 0-1.7 -0.2-0.4-0.7-0.6-1.2-0.6 0-0.1 0.3-0.8 1.2-1.8 -1.2 0.9-1.9 1.9-2.3 2.3 0.5 0 1 0.2 1.3 0.6 0.5 0.8 0 2.1-1.1 2.7 -1.1 0.7-2.5 0.6-3-0.2 -0.1-0.1-0.1-0.2-0.2-0.3 0 0-0.1 0.1-0.2 0.1 -0.3 0.2-1.1 0.5-1.1 0.5 0.3 0.1 0.8 0.1 1.1 0 0.1 1.2 0.9 3 5.3 1.8 -1.3 1.2-4.3 1.3-6.1 0.5 0.3 0.2 0.5 0.3 0.9 0.5 5.6 3 11.9-0.4 13.5-1.3 0.4-0.2 0.8-0.5 1.2-0.7 0 0-1.6 1.4-2.7 3.5C527.6-142.3 533.2-146.3 540.8-145.8"/><path fill="#BACAD3" d="M520.5-149.9c0.2 0.8 1.6-0.1 1.6-0.1s-1.9 1.6-2.6 3.3c0 0.1 0 0.4-0.3 0.9 0.2 0 0.4 0 0.5 0 0.5-0.1 1.1-0.4 1.1-0.4s0 1-1.1 2c1.3-0.9 1.4-2.1 1.8-3.1 1-2.4 3.2-4.5 5.7-5.5 -2.4 0.4-5.3 2.6-5.2 1.7 0-0.4 1.3-4.5 9.2-8 -0.1 0-0.3 0.1-0.3 0.1C523.7-156.2 519.9-151.9 520.5-149.9"/><path fill="#004D55" d="M517.5-146.7c0.4 0.6 0 1.5-0.8 2 -0.8 0.5-1.8 0.5-2.2-0.1 -0.1-0.1-0.1-0.2-0.1-0.3 -0.2 0.1-0.3 0.2-0.5 0.3 0 0.1 0.1 0.2 0.2 0.3 0.5 0.8 1.9 0.9 3 0.2 1.1-0.7 1.6-1.9 1.1-2.7 -0.3-0.4-0.8-0.6-1.3-0.6 -0.1 0.2-0.3 0.3-0.4 0.5C516.9-147.1 517.3-147 517.5-146.7"/><path fill="#000114" d="M516.7-144.7c0.8-0.5 1.2-1.4 0.8-2 -0.2-0.3-0.6-0.5-1.1-0.5 -0.3 0.4-0.7 0.8-1.1 1.2 0 0.4 0.1 0.8 0.5 1 0 0-0.5 0.1-0.8-0.1 -0.2-0.1-0.3-0.3-0.3-0.4 -0.1 0.1-0.2 0.2-0.3 0.2 0 0.1 0 0.2 0.1 0.3C514.9-144.2 515.9-144.2 516.7-144.7"/><path fill="#FFFFFF" d="M515-145c0.3 0.2 0.8 0.1 0.8 0.1 -0.5-0.3-0.5-0.7-0.5-1 -0.2 0.2-0.4 0.4-0.6 0.5C514.7-145.2 514.8-145.1 515-145"/><path fill="#BACAD3" d="M562-158.5c0 0-5.4 0-7.7 0.2 -7 0.5-14.2 3.5-14.2 3.5 4.6-1.3 9.6-0.8 9.6-0.8 -1.9 0.2-6.7 1.6-9.1 2.7 -3.4 1.5-6.9 3.6-9.5 5.5 4.1-2.5 15.6-8.4 30.4-6.2 0 0 1-0.7 3.5-3.5 2.7-2.9 3.2-4.7 3.2-4.7s-12.5-0.7-21.6 1.1c-2 0.4-4.1 0.9-5.9 1.5C546.2-160.3 554.2-160.3 562-158.5"/><path fill="#BACAD3" d="M533.2-143.1c10.2-2.9 17.3-0.4 18.2 2.7 0 0 0 0 0.1-0.1 0.4-0.2 2-0.9 4.4-3.2 2.5-2.5 4-4.4 4.7-5.7 -10.5-4.4-22-0.9-27.7 1.5 3.7-1.4 10.1-2.7 17.2-0.9 -10.9-1.5-19.5 3.7-19.5 3.7 6.2-2.2 10.2-0.6 10.2-0.6 -7.6-0.5-13.2 3.5-15.1 5.9 -0.2 0.3-0.3 0.6-0.4 0.9C527-140.6 528.9-141.9 533.2-143.1"/><path fill="#BACAD3" d="M568-170.2c-8 1.1-14.5 2.9-17.9 4.5 0 0 4.8-1 7.2-1.1 2.4-0.1 4.3 0 4.3 0 -15.1 2.9-23.2 7.5-25.1 8.7 2-0.9 6.3-2.7 12.6-4.1 5.8-1.4 12.7-2 15.4-2.4 3.9-3.7 5.4-8.3 5.4-8.3s-6.8 0.9-14.5 2.6c-8 1.8-13.2 4.1-14.3 4.5C555.7-170.9 568-170.2 568-170.2"/><path fill="#BACAD3" d="M527.5-139c0 0 2.6-2 6.9-1.5 6.5 0.7 6.3 4.5 6.3 4.5s2.9-1.3 4.4-3.8c0 0-1.8-1.5-5.2-1.9C531.3-142.8 527.5-139 527.5-139"/><path fill="#BACAD3" d="M509.9-140.5c-1.3 0-1.8-0.3-2.3-0.6 -1.1 0.6-1.9 1-1.9 1 -0.6 0.9 0.7 0.7 1.4 0.5C507.6-139.7 509.9-140.5 509.9-140.5M524.3-139.9c-0.4 0.7-0.6 1.4-0.9 2.4 -2 9.1-8.9 13.4-8.9 13.4 -1.3-2.7-0.6-5.3-0.4-6.3 0.5-2.2-0.7-3.9-0.7-3.9 4.6 0 0.1 5.5 1.8 7.8 3-1.8 4.9-7.8 5.3-10 0-0.1-0.4-0.4-0.8-0.5 -4.4-1.1-11.8 0.4-14.5 2 -8.4 5.2-0.5 8.1-0.5 8.1s-5.1 1.9-8.1-2.4c-0.8-1.1-0.9-3.2-1.1-4.9 3-5 7.9-7.2 9.2-8.1 1.2 0.3 3.3 0.3 4.9-0.3C509.8-142.6 515.4-136.2 524.3-139.9z"/><path fill="#000114" d="M505.7-140.1c-0.6 0.9 0.7 0.7 1.4 0.5 0.5-0.2 2.9-0.9 2.9-0.9 -1.3 0-1.8-0.3-2.3-0.6C506.6-140.5 505.7-140.1 505.7-140.1"/></g><g id="sunglasses"><path d="M688.4-40c-33.7-5.3-92.8-6.3-139.1 6.3h-20C483-46.3 418.9-45.3 385.2-40c-4.2 1-4.2 18.9-1 20 6.3 3.1 9.5 9.5 9.5 9.5s2.1 6.3 7.4 29.4C406.3 42 420 46.3 420 46.3s16.8 4.2 35.7 4.2c18.9 0 30.5-1 43.1-7.4 12.6-6.3 17.9-23.2 17.9-23.2S523 5.2 527.2-8.5c1-4.2 22.1-4.2 23.2 0 4.2 13.7 10.5 28.4 10.5 28.4s5.3 16.8 17.9 23.2c12.6 6.3 24.2 7.4 43.1 7.4 18.9 0 35.7-4.2 35.7-4.2s13.7-3.1 18.9-27.3c5.3-24.2 7.4-29.4 7.4-29.4s0.5-6.4 3.3-8.2c3.7-2.4 4.5-21.3 0.2-21.3h1V-40z"/><polygon points="383.3 -22.5 372.8 -12.5 371.8 -23 383.3 -37 "/></g><g id="logo"><path d="M569 52.6h-73.4c-1.8 0-3.3-1.5-3.3-3.3V32.6c0-1.8 1.5-3.3 3.3-3.3H569c1.8 0 3.3 1.5 3.3 3.3v16.7C572.3 51.2 570.8 52.6 569 52.6z"/><ellipse cx="494.3" cy="17.5" rx="33.7" ry="35.2"/><ellipse cx="535.8" cy="-4" rx="34.1" ry="35.6"/><ellipse cx="571.4" cy="17.4" rx="33.8" ry="35.2"/><path fill="#FFFFFF" d="M479.3 27.8c-1.3 1.3-2.3 2-3.3 2 -2.4 0-3.6-2.1-3.6-5.5v-15c0-3.3 1.3-5.7 4-5.7 1.2 0 1.9 0.4 2.9 1.4V3.8h3v26.4c0 4.8-1.5 7.1-5.4 7.1 -1.1 0-1.6-0.1-2.6-0.5l0.5-2.3c0.6 0.1 1.2 0.1 1.5 0.1 2.1 0 3-1.2 3-4V27.8zM479.3 24.8V8.7c-0.8-1.4-1.5-2.2-2.4-2.2 -0.9 0-1.4 0.9-1.4 2.7v15c0 1.5 0.2 2.6 1.5 2.6C477.8 26.8 478.6 25.9 479.3 24.8z"/><path fill="#FFFFFF" d="M486.9 21.9V11.3c0-4.7 0.9-8 4.8-8s4.8 3.2 4.8 8v10.5c0 4.9-0.8 7.9-4.8 7.9C487.7 29.7 486.9 26.6 486.9 21.9zM493.3 24.1V9c0-1.9-0.5-2.9-1.6-2.9 -1.1 0-1.7 1-1.7 2.9v15c0 2 0.6 3.1 1.7 3.1C492.8 27 493.3 26 493.3 24.1z"/><path fill="#FFFFFF" d="M499.4 6.5V3.8h2.1v-8.1h3.1v8.1h2.1v2.6h-2.1v22.8h-3.1V6.5H499.4z"/><path fill="#FFFFFF" d="M518.5 3.8h3.1v19.9c0 2 0.3 3.4 1.5 3.4 1.1 0 1.9-1.7 1.9-3.2V3.8h3.1v20c0 1.6 0.9 3.4 1.9 3.4 1.2 0 1.6-1.3 1.6-3.2V3.8h3.1v18c0 4.9-0.3 8-4.3 8 -1.6 0-2.8-0.8-3.7-2.1 -1.1 1.3-2.1 2.1-3.7 2.1 -4.2 0-4.6-2.4-4.6-8.1V3.8z"/><path fill="#FFFFFF" d="M546 28c-1 1.1-1.6 1.5-2.9 1.5 -2.5 0-3.9-2.3-3.9-6.6 0-5.5 1.7-7.8 6.7-10.3V9.1c0-1.8-0.3-3-1.3-3 -1.1 0-1.4 1-1.4 3.2v2.5h-3.1V9.7c0-3.9 1.2-6.3 4.5-6.3 3.6 0 4.5 2.9 4.5 7.9v13.2c0 1.7 0.2 2.8 0.7 4.8h-3.1L546 28zM545.8 24v-8.3c-3 2.1-3.5 3.5-3.5 7.8 0 2.2 0.6 3.6 1.9 3.6C545.5 27 545.8 25.6 545.8 24z"/><path fill="#FFFFFF" d="M560.2 29.3v-1.6c-1.4 1.3-2.4 2-3.3 2 -2.2 0-3.5-2.3-3.5-5.6V9.3c0-3.7 1.7-5.8 3.9-5.8 1.2 0 1.9 0.4 2.9 1.5V-6.3h3v35.6H560.2zM560.3 24.6V8.5c-0.8-1.3-1.5-2.1-2.3-2.1 -0.8 0-1.4 1.1-1.4 2.6v15.1c0 1.4 0.3 2.4 1.4 2.4C558.7 26.6 559.5 25.8 560.3 24.6z"/><path fill="#FFFFFF" d="M571.1 17.3v6.6c0 2 0.3 3.1 1.5 3.1 1.3 0 1.7-1.1 1.7-3.6v-3h3.1v2.1c0 4.5-1.2 7.2-4.8 7.2 -3.9 0-4.7-3.2-4.7-7.9V11.3c0-4.7 0.8-8 4.8-8 3.4 0 4.8 2.7 4.8 6.6v7.4H571.1zM571.1 14.4h3.3V9.6c0-2.4-0.3-3.5-1.8-3.5 -1.2 0-1.5 1.2-1.5 3.2V14.4z"/><path fill="#FFFFFF" d="M587.1 19.7h-2.4c-0.1-1.6-0.1-2.5-0.1-3 0-2.6 0.3-5.5 0.9-7l2.5-7.1c0.2-0.6 0.3-1.2 0.3-2.5 0-3-0.9-4.4-2.4-4.4 -2 0-2.2 1.8-2.2 5.4H581c0-5.4 0.8-8 5-8 3.5 0 5.3 2.2 5.3 6.3 0 1.6-0.2 2.8-0.5 3.6l-2.4 6.7C587.2 12.9 587.2 13.9 587.1 19.7zM584 25h3.4v4.3H584V25z"/></g><g id="nd"><path d="M485.1-97.9l-0.6-4.8h-0.2c-2.1 3-6.3 5.7-11.7 5.7 -7.8 0-11.7-5.5-11.7-11 0-9.3 8.2-14.4 23.1-14.3v-0.8c0-3.2-0.9-8.9-8.7-8.9 -3.6 0-7.3 1.1-10 2.9l-1.6-4.6c3.2-2.1 7.8-3.4 12.6-3.4 11.7 0 14.6 8 14.6 15.7v14.4c0 3.3 0.2 6.6 0.6 9.2H485.1zM484-117.4c-7.6-0.2-16.3 1.2-16.3 8.6 0 4.5 3 6.7 6.6 6.7 5 0 8.2-3.2 9.3-6.4 0.2-0.7 0.4-1.5 0.4-2.2V-117.4z"/><path d="M502-125.9c0-4-0.1-7.2-0.3-10.4h6.2l0.4 6.3h0.2c1.9-3.6 6.3-7.2 12.7-7.2 5.3 0 13.6 3.2 13.6 16.3v22.9h-7V-120c0-6.2-2.3-11.3-8.9-11.3 -4.6 0-8.2 3.3-9.4 7.1 -0.3 0.9-0.5 2.1-0.5 3.3v23.1h-7V-125.9z"/><path d="M579.2-154.2v46.4c0 3.4 0.1 7.3 0.3 9.9h-6.3l-0.3-6.7h-0.2c-2.1 4.3-6.8 7.5-13.1 7.5 -9.3 0-16.4-7.9-16.4-19.5 -0.1-12.8 7.9-20.6 17.2-20.6 5.9 0 9.8 2.8 11.6 5.9h0.2v-22.9H579.2zM572.2-120.6c0-0.9-0.1-2.1-0.3-2.9 -1-4.4-4.8-8.1-10.1-8.1 -7.2 0-11.5 6.3-11.5 14.8 0 7.8 3.8 14.2 11.3 14.2 4.7 0 9-3.1 10.2-8.3 0.2-1 0.3-1.9 0.3-3V-120.6z"/><path d="M614.8-151.3v53.5h-6.9v-53.5H614.8z"/><path d="M451.8-53.1c0-4-0.1-7.2-0.3-10.4h6.2l0.4 6.3h0.2c1.9-3.6 6.3-7.2 12.7-7.2 5.3 0 13.6 3.2 13.6 16.3v22.9h-7v-22.1c0-6.2-2.3-11.3-8.9-11.3 -4.6 0-8.2 3.3-9.4 7.1 -0.3 0.9-0.5 2.1-0.5 3.3v23.1h-7V-53.1z"/><path d="M499.7-43.1c0.2 9.4 6.2 13.3 13.2 13.3 5 0 8-0.9 10.6-2l1.2 5c-2.5 1.1-6.7 2.4-12.8 2.4 -11.8 0-18.9-7.8-18.9-19.4s6.8-20.7 18-20.7c12.5 0 15.9 11 15.9 18.1 0 1.4-0.2 2.5-0.2 3.3H499.7zM520.2-48.1c0.1-4.4-1.8-11.3-9.7-11.3 -7.1 0-10.2 6.5-10.7 11.3H520.2z"/><path d="M538.3-63.5l7.5 21.6c1.3 3.5 2.3 6.7 3.1 9.8h0.2c0.9-3.2 2-6.3 3.3-9.8l7.5-21.6h7.3l-15.1 38.4h-6.7l-14.6-38.4H538.3z"/><path d="M576.8-43.1c0.2 9.4 6.2 13.3 13.2 13.3 5 0 8-0.9 10.6-2l1.2 5c-2.5 1.1-6.7 2.4-12.8 2.4 -11.8 0-18.9-7.8-18.9-19.4s6.8-20.7 18-20.7c12.5 0 15.9 11 15.9 18.1 0 1.4-0.2 2.5-0.2 3.3H576.8zM597.3-48.1c0.1-4.4-1.8-11.3-9.7-11.3 -7.1 0-10.2 6.5-10.7 11.3H597.3z"/><path d="M612.7-51.6c0-4.5-0.1-8.4-0.3-12h6.1l0.2 7.5h0.3c1.7-5.2 5.9-8.4 10.6-8.4 0.8 0 1.3 0.1 2 0.2v6.6c-0.7-0.2-1.4-0.2-2.4-0.2 -4.9 0-8.4 3.7-9.4 9 -0.2 1-0.3 2.1-0.3 3.3v20.5h-6.9V-51.6z"/><path d="M391.6-8.7v46.4c0 3.4 0.1 7.3 0.3 9.9h-6.3l-0.3-6.7h-0.2c-2.1 4.3-6.8 7.5-13.1 7.5 -9.3 0-16.4-7.9-16.4-19.5 -0.1-12.8 7.9-20.6 17.2-20.6 5.9 0 9.8 2.8 11.6 5.9h0.2V-8.7H391.6zM384.6 24.8c0-0.9-0.1-2.1-0.3-2.9 -1-4.4-4.8-8.1-10.1-8.1 -7.2 0-11.5 6.3-11.5 14.8 0 7.8 3.8 14.2 11.3 14.2 4.7 0 9-3.1 10.2-8.3 0.2-1 0.3-1.9 0.3-3V24.8z"/><path d="M410.9-1.6c0.1 2.4-1.7 4.3-4.4 4.3 -2.5 0-4.2-1.9-4.2-4.3 0-2.5 1.8-4.4 4.4-4.4C409.3-6 410.9-4.1 410.9-1.6zM403.2 47.6V9.2h7v38.4H403.2z"/><path d="M420.8 40.4c2.1 1.3 5.7 2.8 9.2 2.8 5.1 0 7.5-2.5 7.5-5.7 0-3.3-2-5.2-7.1-7.1 -6.9-2.5-10.2-6.3-10.2-10.9 0-6.2 5-11.3 13.2-11.3 3.9 0 7.3 1.1 9.4 2.4l-1.7 5.1c-1.5-1-4.3-2.2-7.9-2.2 -4.1 0-6.4 2.4-6.4 5.2 0 3.2 2.3 4.6 7.3 6.5 6.7 2.5 10.1 5.9 10.1 11.6 0 6.7-5.2 11.5-14.4 11.5 -4.2 0-8.1-1-10.8-2.6L420.8 40.4z"/><path d="M474.4 47.6l-0.6-4.8h-0.2c-2.1 3-6.3 5.7-11.7 5.7 -7.8 0-11.7-5.5-11.7-11 0-9.3 8.2-14.4 23.1-14.3v-0.8c0-3.2-0.9-8.9-8.7-8.9 -3.6 0-7.3 1.1-10 2.9l-1.6-4.6c3.2-2.1 7.8-3.4 12.6-3.4 11.7 0 14.6 8 14.6 15.7v14.4c0 3.3 0.2 6.6 0.6 9.2H474.4zM473.4 28c-7.6-0.2-16.3 1.2-16.3 8.6 0 4.5 3 6.7 6.6 6.7 5 0 8.2-3.2 9.3-6.4 0.2-0.7 0.4-1.5 0.4-2.2V28z"/><path d="M491.4 21.7c0-4.9-0.2-8.9-0.3-12.5h6.3l0.3 6.6h0.2c2.9-4.7 7.4-7.5 13.6-7.5 9.3 0 16.3 7.9 16.3 19.5 0 13.8-8.4 20.6-17.4 20.6 -5.1 0-9.5-2.2-11.8-6h-0.2v20.9h-6.9V21.7zM498.3 31.9c0 1 0.2 2 0.3 2.9 1.3 4.8 5.5 8.2 10.5 8.2 7.4 0 11.7-6 11.7-14.8 0-7.7-4-14.3-11.4-14.3 -4.8 0-9.2 3.4-10.5 8.6 -0.2 0.9-0.5 1.9-0.5 2.9V31.9z"/><path d="M536.5 21.7c0-4.9-0.2-8.9-0.3-12.5h6.3l0.3 6.6h0.2c2.9-4.7 7.4-7.5 13.6-7.5 9.3 0 16.3 7.9 16.3 19.5 0 13.8-8.4 20.6-17.4 20.6 -5.1 0-9.5-2.2-11.8-6h-0.2v20.9h-6.9V21.7zM543.4 31.9c0 1 0.2 2 0.3 2.9 1.3 4.8 5.5 8.2 10.5 8.2 7.4 0 11.7-6 11.7-14.8 0-7.7-4-14.3-11.4-14.3 -4.8 0-9.2 3.4-10.5 8.6 -0.2 0.9-0.5 1.9-0.5 2.9V31.9z"/><path d="M616.4 28.1c0 14.2-9.8 20.4-19.1 20.4 -10.4 0-18.4-7.6-18.4-19.7 0-12.8 8.4-20.4 19-20.4C608.9 8.3 616.4 16.3 616.4 28.1zM585.9 28.5c0 8.4 4.8 14.8 11.7 14.8 6.7 0 11.7-6.3 11.7-14.9 0-6.5-3.3-14.8-11.5-14.8C589.5 13.5 585.9 21.2 585.9 28.5z"/><path d="M633-1.6c0.1 2.4-1.7 4.3-4.4 4.3 -2.5 0-4.2-1.9-4.2-4.3 0-2.5 1.8-4.4 4.4-4.4C631.3-6 633-4.1 633-1.6zM625.2 47.6V9.2h7v38.4H625.2z"/><path d="M643.7 19.6c0-4-0.1-7.2-0.3-10.4h6.2l0.4 6.3h0.2c1.9-3.6 6.3-7.2 12.7-7.2 5.3 0 13.6 3.2 13.6 16.3v22.9h-7V25.4c0-6.2-2.3-11.3-8.9-11.3 -4.6 0-8.2 3.3-9.4 7.1 -0.3 0.9-0.5 2.1-0.5 3.3v23.1h-7V19.6z"/><path d="M695.9-1.8v11h10v5.3h-10v20.7c0 4.8 1.3 7.5 5.2 7.5 1.8 0 3.2-0.2 4-0.5l0.3 5.2c-1.3 0.6-3.5 1-6.2 1 -3.3 0-5.9-1-7.5-2.9 -2-2.1-2.7-5.5-2.7-10V14.5h-5.9V9.2h5.9V0L695.9-1.8z"/><path d="M712.4 43.5c0-2.9 2-4.9 4.7-4.9 2.9 0 4.7 2.1 4.7 4.9 0 2.8-1.8 4.9-4.7 4.9C714.3 48.4 712.4 46.3 712.4 43.5zM714.3 32.2l-1.1-38.1h7.6l-1.1 38.1H714.3z"/></g><g id="philly" display="none"><path display="inline" d="M801 145c0 33-35.7 59.8-79.8 59.8 -33.2 0-61.7-15.2-73.7-36.8l-43.1-15.7 37-7.7c0.3-32.8 35.9-59.3 79.7-59.3C765.3 85.3 801 112 801 145z"/><g display="inline"><path fill="#FFFFFF" d="M673.5 155.3v-31.4h2.9v31.4H673.5z"/><path fill="#FFFFFF" d="M682.1 133.2h-1.2l1-5.7h-1.3v-3.7h3.2v3.3L682.1 133.2z"/><path fill="#FFFFFF" d="M696.4 135c1.2-1.6 2-2.1 3.2-2.1 2.4 0 2.9 1.9 2.9 4.8v17.6h-2.7v-17.7c0-1.4-0.3-2.1-1-2.1 -0.8 0-1.4 0.6-2.1 1.6v18.1H694v-17.7c0-1.4-0.3-2.1-1-2.1 -0.6 0-1.1 0.5-2.1 1.6v18.2h-2.7V133h2.7v1.6c1-1.2 1.7-1.7 2.9-1.7C695.1 132.8 695.8 133.4 696.4 135z"/><path fill="#FFFFFF" d="M717.2 141.2v14.1h-2.9v-31.4h4.6c2.9 0 5.4 1.5 5.4 5.8v5.6c0 3.1-1.8 5.8-5.7 5.8L717.2 141.2zM717.2 126.1v12.6l1.2 0c2-0.3 3.1-1.4 3.1-3.8v-5.5c0-2.4-1-3.4-2.7-3.4H717.2z"/><path fill="#FFFFFF" d="M730.9 155.3h-2.7v-31.2h2.7v10.4c0.9-1.2 1.6-1.7 2.8-1.7 2.4 0 2.9 2.1 2.9 4.8v17.7h-2.7v-17.7c0-1.5-0.3-2.1-1-2.1 -0.6 0-1 0.4-1.9 1.3V155.3z"/><path fill="#FFFFFF" d="M740.5 124.1h2.7v2.9h-2.7V124.1zM740.5 155.3V133h2.7v22.3H740.5z"/><path fill="#FFFFFF" d="M747.3 155.3v-31.2h2.7v31.2H747.3z"/><path fill="#FFFFFF" d="M754 155.3v-31.2h2.7v31.2H754z"/><path fill="#FFFFFF" d="M763.5 133v17.8c0 1.3 0 2.2 1 2.2 0.8 0 1.5-0.5 2.1-1.6V133h2.7v23.1c0 3.9-1.3 6.2-4.7 6.2 -0.8 0-1.2-0.1-2.1-0.4l0.4-2c0.5 0.1 1 0.1 1.3 0.1 1.8 0 2.4-1.1 2.4-3.5V154c-1.2 1.2-1.8 1.7-2.7 1.7 -2.1 0-3.2-1.8-3.2-4.8V133H763.5z"/><path fill="#FFFFFF" d="M773.8 123.9h3l-0.6 23h-1.8L773.8 123.9zM773.8 151.6h3v3.7h-3V151.6z"/></g></g></svg>
</div>

 
              
            
!

CSS

              
                #headwrap {
width: 600px;
height: 600px;
margin: 0 auto;
}

 
#logo,
#nd,
#nose,
#hat,
#sunglasses,
#hair,
#head,
#mouth,
#rBrow, #lBrow,
#rEye, #lEye,
#rEar, #lEar,
#philly,
#passion {
  opacity:0;
}

 
              
            
!

JS

              
                var logo = $('#logo'),
    nd = $('#nd'),
    nose = $('#nose'),
    hat = $('#hat'),
    sunglasses = $('#sunglasses'),
    hair = $('#hair'),
    head = $('#head'),
    mouth = $('#mouth'),
    rBrow = $('#rBrow'),
    lBrow = $('#lBrow'),
    rEar = $('#rEar'),
    lEar = $('#lEar'),
    rEye = $('#rEye'),
    lEye = $('#lEye'),
    philly = $('#philly'),
    passion = $('#passion'),
    rightFace = $('#right-face'),
    leftFace = $('#left-face');

var tl1 = new TimelineMax();
  //animate in
 tl1.fromTo(hair,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut})

  tl1.fromTo(head,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl1.fromTo(hair,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl1.fromTo(mouth, 1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl1.fromTo(nose,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl1.fromTo(rEar,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl1.fromTo(lEar,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl1.fromTo(rEye,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl1.fromTo(lEye,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl1.fromTo(rBrow, 1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl1.fromTo(lBrow, 1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
    tl1.fromTo(philly, 1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  //animate out - start with 5s pause
  tl1.to(head,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"+=2")
  tl1.to(hair,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl1.to(mouth, .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl1.to(nose,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl1.to(rEar,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl1.to(lEar,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl1.to(rEye,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl1.to(lEye,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl1.to(rBrow, .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl1.to(lBrow, .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl1.to(philly, .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")

var tl2 = new TimelineMax();

 //animate in
  tl2.fromTo(hat,   1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut})
  tl2.set( leftFace,  {fill: 'green', immediateRender:false},0)
  tl2.set( rightFace,  {fill: 'silver', immediateRender:false},0)
  tl2.fromTo(head,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(sunglasses,   1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(hair,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(mouth, 1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(nose,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(rEar,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(lEar,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(rEye,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(lEye,  1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(rBrow, 1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(lBrow, 1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
  tl2.fromTo(passion, 1,  {scale:0.05, opacity:0, transformOrigin:"50% 50%"}, {scale:1, opacity:1, rotation:360, ease:Quad.easeInOut}, "-=1")
   
  //animate out - start with 5s pause
  tl2.to(head,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"+=2")
  tl2.to(hat,   .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl2.to(sunglasses,   .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl2.to(hair,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl2.to(mouth, .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl2.to(nose,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl2.to(rEar,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl2.to(lEar,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl2.to(rEye,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl2.to(lEye,  .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl2.to(rBrow, .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
  tl2.to(lBrow, .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")
    tl2.to(passion, .5,  {scale:0.05, opacity:0, rotation:-360, transformOrigin:"50% 50%", ease:Quad.easeInOut},"-=.5")





  
var mastertimeline = new TimelineMax({repeat: -1});

mastertimeline.add(tl1)
mastertimeline.add(tl2)

              
            
!
999px

Console