Pen Settings

HTML

About HTML Preprocessors

HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug.

Learn more · Versions

Adding Classes

In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. So you don't have access to higher-up elements like the <html> tag. If you want to add classes there that can affect the whole document, this is the place to do it.

About the <head>

In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. If you need things in the <head> of the document, put that code here.

!
Insecure Resource

The resource you are linking to is using the 'http' protocol, which may not work when the browser is using https.

CSS

About CSS Preprocessors

CSS preprocessors help make authoring CSS easier. All of them offer things like variables and mixins to provide convenient abstractions.

Learn more · Versions

CSS Base

About CSS Base

It's a common practice to apply CSS to a page that styles elements such that they are consistent across all browsers. We offer two of the most popular choices: normalize.css and a reset. Or, choose Neither and nothing will be applied.

Vendor Prefixing

About Vendor Prefixing

To get the best cross-browser support, it is a common practice to apply vendor prefixes to CSS properties and values that require them to work. For instance -webkit- or -moz-.

We offer two popular choices: Autoprefixer (which processes your CSS server-side) and -prefix-free (which applies prefixes via a script, client-side).

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.

Powered by Algolia
About External Resources

You can apply CSS to your Pen from any stylesheet on the web. Just put a URL to it here and we'll apply it, in the order you have them, before the CSS in the Pen itself.

You can also link to another Pen here (use the .css URL Extension) and we'll pull the CSS from that Pen and include it. If it's using a matching preprocessor, use the appropriate URL Extension and we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.

Learn more

+ add another resource

JavaScript

About JavaScript Preprocessors

JavaScript preprocessors can help make authoring JavaScript easier and more convenient.

Learn more · Versions

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.

Powered by Algolia
About External Resources

You can apply a script from anywhere on the web to your Pen. Just put a URL to it here and we'll add it, in the order you have them, before the JavaScript in the Pen itself.

If the script you link to has the file extension of a preprocessor, we'll attempt to process it before applying.

You can also link to another Pen here, and we'll pull the JavaScript from that Pen and include it. If it's using a matching preprocessor, we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.

Learn more

+ 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.

Powered by Algolia
About Packages

Using packages here is powered by Skypack, which makes packages from npm not only available on a CDN, but prepares them for native JavaScript ES6 import usage.

All packages are different, so refer to their docs for how they work.

If you're using React / ReactDOM, make sure to turn on Babel for the JSX processing.

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 

              
                <svg xmlns="http://www.w3.org/2000/svg" viewBox=" 0 0 132.29167 132.29167" height="600" width="600">
	<defs id="morphs">
		<g id="char-morphs">
			<g id="p">
				<path transform="scale(0.26458334)" d="m 160.76367,91.58984 -3.36914,4.87305 c -2.78461,-0.23123 -5.66937,-0.33487 -8.46484,-0.39062 h -22.00977 v 317.69726 h -12 l 12,10 h 21.75391 V 270.91797 c 8.4459,0 16.89111,-0.63221 21.7539,-3.63867 6.91028,-4.27234 5.63086,-12.97514 5.63086,-20.09571 V 119.9668 c 0,-7.06389 1.18239,-15.45641 -5.0625,-19.85157 z m -12.08984,21.77539 h 2.04687 c 4.35092,0 3.83985,2.8475 3.83985,3.63868 v 132.98242 c 0,0.79117 0.51107,3.64062 -3.83985,3.64062 h -2.04687 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#b337ff;fill-opacity:1;stroke:#000000;stroke-width:0.999999;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="path1060" />
				<path id="path1062" d="m 39.336619,71.680381 -3.175067,-2.645764 0.884013,-1.385427 4.532244,-0.824 3.884136,3.590527 c -0.585004,0.650574 -2.035274,0.996014 -3.119202,1.130045 -1.009926,0.12488 -3.006124,0.134619 -3.006124,0.134619 z" style="fill:#58008dff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
				<path id="path1066" d="m 36.161552,109.47631 3.175067,2.64605 h -5.755723 l -3.175243,-2.64605 z" style="fill:#58008dff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
				<path d="M 36.161553,64.459512 V 27.348614 h 0.541732 c 1.151181,0 1.015748,0.753594 1.015748,0.962926 v 35.185047 c 0,0.209332 0.135433,0.962925 -1.015748,0.962925 z m 0,4.575105 c 2.234645,0 4.469288,-0.167465 5.755902,-0.962926 1.828344,-1.13039 1.489762,-3.433039 1.489762,-5.317023 V 29.095326 c 0,-1.925852 0.338582,-4.2285 -1.489762,-5.358891 -1.286614,-0.795459 -3.588974,-0.921059 -5.688184,-0.962925 h -5.823619 v 86.7028 h 5.755901 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#fffdff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="path1068" />
			</g>
			<g id="r">
				<path transform="scale(0.26458334)" d="m 214.93945,91.125 -3.61523,5.22852 c -3.56241,-0.27513 -7.27237,-0.33984 -10.73047,-0.33399 -2.91927,0.0049 -6.84651,-1.965312 -7.95703,0.05274 h -11.00586 v 317.69726 h -12 l 12,10 h 21.5 v -5.11719 l 6.14062,5.11719 h 21.5 V 284.68555 c -0.25595,-9.0194 1.02338,-12.81882 -11.77343,-20.25586 13.05275,-7.27881 11.77343,-11.23455 11.77343,-20.09571 V 119.9668 c 0,-6.71851 0.85843,-14.64257 -4.24023,-19.1836 l -0.01,-0.01 c -0.15687,-0.13935 -0.32188,-0.27344 -0.49023,-0.40625 z m -11.80859,22.24023 h 2.30273 c 4.35092,0 3.83789,2.8475 3.83789,3.63868 v 132.98242 c 0,1.26588 0.25707,3.64062 -3.83789,3.64062 h -2.30273 z m 0,156.76172 h 2.30273 c 4.09498,0 3.83789,2.37281 3.83789,3.63867 v 140.00391 h -6.14062 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#b337ff;fill-opacity:1;stroke:#000000;stroke-width:0.999999;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="path1054" />
				<path id="path1056" d="m 57.943236,69.963691 -3.175006,-2.645593 -0.443611,-2.998052 2.592234,-0.758709 4.117695,2.872066 c -0.08966,1.020458 -0.46755,1.493271 -1.025298,2.095555 -0.569687,0.615176 -2.066014,1.434733 -2.066014,1.434733 z" style="fill:#58008dff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
				<path d="M 50.569808,64.459512 V 27.348614 h 0.609448 c 1.15118,0 1.015747,0.753594 1.015747,0.962926 v 35.185047 c 0,0.334931 0.06771,0.962925 -1.015747,0.962925 z m 0,4.365773 h 0.609448 c 1.083463,0 1.015747,0.627996 1.015747,0.962926 v 39.688099 h 5.688185 V 72.676988 c -0.06772,-2.386381 0.270866,-3.391173 -3.114958,-5.35889 3.45354,-1.925851 3.114958,-2.972509 3.114958,-5.317024 V 29.095326 c 0,-1.925852 0.270866,-4.2285 -1.489763,-5.358891 -1.896061,-1.172256 -6.1622,-0.962925 -8.599993,-0.962925 h -2.911808 v 86.7028 h 5.688184 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#fffdff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="path1064" />
				<path id="path1070" d="m 44.8815,109.47652 3.175,2.64584 h 5.688541 l -3.175233,-2.64605 z" style="fill:#58008dff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
				<path id="path1072" d="m 52.195004,109.47631 3.174743,2.64605 h 5.688542 l -3.175101,-2.64605 z" style="fill:#58008dff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
			</g>
			<g id="o">
				<path transform="scale(0.26458334)" d="m 270.125,91.13281 -2.91406,4.2168 c -1.87251,-0.24301 -3.81516,-0.38477 -5.82227,-0.38477 -14.07649,0 -25.08203,6.17214 -25.08203,14.5586 v 296.54883 l -8.32226,2.16406 12.07031,10.07226 c 0.48797,0.4587 1.0111,0.9008 1.58203,1.32032 l 0.18555,0.15429 0.0117,-0.002 c 4.55979,3.25769 11.55832,5.25391 19.55469,5.25391 13.82056,0 25.08203,-6.0139 25.08203,-14.5586 V 109.52344 c 0,-3.37819 -1.78098,-6.35087 -4.76367,-8.72266 l 0.01,-0.01 z m -8.73633,20.8086 c 1.79156,0 3.58399,0.79073 3.58399,2.21484 v 291.6875 c 0,1.42413 -1.79243,2.21484 -3.58399,2.21484 -2.04749,0 -3.58398,-1.10718 -3.58398,-2.21484 v -291.6875 c 0,-1.10764 1.53649,-2.21484 3.58398,-2.21484 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#b337ff;fill-opacity:1;stroke:#000000;stroke-width:0.999999;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="path1040" />
				<path style="fill:#58008dff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 60.320869,108.01253 3.925314,3.24341 c 1.156025,0.76272 3.299772,1.20211 5.244716,1.20272 1.86979,5.8e-4 3.947985,-0.72038 5.190015,-1.70255 l -3.208085,-2.9849 z" id="path1052" />
				<path d="m 59.347857,26.332148 v 79.627382 c 0,2.21892 2.911808,3.85171 6.636214,3.85171 3.65669,0 6.636216,-1.59092 6.636216,-3.85171 V 26.332148 c 0,-2.260782 -2.979526,-3.851703 -6.636216,-3.851703 -3.724406,0 -6.636214,1.632787 -6.636214,3.851703 z m 5.688184,78.401592 V 27.557946 c 0,-0.293064 0.406298,-0.586129 0.94803,-0.586129 0.474016,0 0.948032,0.209332 0.948032,0.586129 v 77.175794 c 0,0.3768 -0.474016,0.58612 -0.948032,0.58612 -0.541732,0 -0.94803,-0.29306 -0.94803,-0.58612 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#fffdff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="path1058" />
			</g>
			<g id="u">
				<path transform="scale(0.26458334)" d="m 301.70312,86.07227 -6.33398,10 h -3.41992 v 309.44921 l -9.56445,2.34766 13.66796,11.60352 h 0.004 c 4.48664,3.58289 12.20976,5.5625 20.97461,5.5625 13.82056,0 25.33789,-4.74827 25.33789,-13.29297 V 96.07227 l -12,-10 -6.33594,10 h -3.41797 v 309.77148 c 0,1.42413 -1.53649,2.21484 -3.58398,2.21484 -2.04749,0 -3.32812,-1.10718 -3.32813,-2.21484 V 96.07227 Z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#b337ff;fill-opacity:1;stroke:#000000;stroke-width:0.999999;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="path1038" />
				<path id="path1042" d="m 74.714306,107.91538 3.616314,3.0701 c 1.482692,1.25874 3.696656,1.48856 5.6416,1.48917 1.86979,5.8e-4 4.182465,-0.44608 5.424495,-1.42824 l -3.530449,-3.37235 z" style="fill:#58008dff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
				<path d="m 74.069962,22.77351 v 83.52095 c 0,2.21892 2.979525,3.51678 6.636214,3.51678 3.656691,0 6.703932,-1.25599 6.703932,-3.51678 V 22.77351 h -5.7559 v 81.96023 c 0,0.3768 -0.4063,0.58612 -0.948032,0.58612 -0.541731,0 -0.880314,-0.29306 -0.880314,-0.58612 V 22.77351 Z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#fffdff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="path1044" />
			</g>
			<g id="d">
				<path transform="scale(0.26458334)" d="m 380.26172,90.35352 c 0,0 -1.15384,3.30458 -2.12305,6.0371 -6.69856,-0.56737 -16.55945,-4.704614 -19.02929,-0.31835 h -11.26172 v 317.71875 l -12,-0.0215 12,10 h 11.26172 c 9.05984,0 25.08183,0.63173 32.24804,-3.64062 6.91026,-4.27235 5.63086,-12.9751 5.63086,-20.25391 v -279.9082 c 0,-6.67285 1.05519,-14.53214 -4.08984,-19.08789 l 0.0137,-0.0117 -0.25977,-0.21485 c -0.0558,-0.0463 -0.10885,-0.095 -0.16601,-0.14062 z m -10.66016,23.01171 h 2.04883 c 4.35089,0 3.83789,2.8475 3.83789,3.63868 v 285.67578 c 0,0.94941 0.513,3.79687 -3.83789,3.79687 h -2.04883 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#b337ff;fill-opacity:1;stroke:#000000;stroke-width:0.999999;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="path1046" />
				<path id="path1048" d="m 92.034696,112.12236 2.879637,0.008 c 1.426397,0.004 7.829707,0.46176 9.396667,-1.64994 l -4.03074,-3.31666 -9.912172,1.16845 -1.508308,1.144 z" style="fill:#58008dff;fill-opacity:1;stroke:#000000;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" />
				<path d="M 101.86129,103.15449 V 29.095326 c 0,-1.925852 0.33858,-4.2285 -1.48976,-5.358891 -1.896054,-1.172256 -6.16217,-0.962925 -8.532225,-0.962925 h -2.979526 v 86.7028 h 2.979526 c 2.370055,0 6.636171,0.16746 8.532225,-0.96293 1.82834,-1.13039 1.48976,-3.43304 1.48976,-5.35889 z M 96.173131,28.31154 v 75.58487 c 0,0.2512 -0.0032,0.99332 -1.015744,1.00479 H 94.61566 V 27.348614 h 0.541727 c 1.151171,0 1.015744,0.753594 1.015744,0.962926 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#fffdff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="path1050" />
			</g>
		</g>

		<g id="shadow-morphs">
			<path id="path64" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#d0ced0;fill-opacity:1;stroke:#d0ced0;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 35.697566,28.064958 v 86.703232 l 3.175,2.64584 h 5.755723 V 76.972051 c 2.234644,0 4.469108,-0.167272 5.755719,-0.962731 1.828345,-1.13039 1.489832,-3.433006 1.489832,-5.31699 V 37.032886 c 0,-1.868987 0.31284,-4.089508 -1.339453,-5.252394 l -2.707328,-2.255677 -0.0052,0.0078 C 47.650666,29.346928 47.449427,29.176914 47.208976,29.028253 45.922363,28.232794 43.620162,28.10687 41.520953,28.065005 Z" />
			<path id="path66" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#d0ced0;fill-opacity:1;stroke:#d0ced0;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 55.190434,28.051004 c -0.77239,0.0013 -1.495848,0.01395 -2.105297,0.01395 H 50.17317 v 86.703236 l 3.175,2.64583 h 5.688541 v -1.35392 l 1.624706,1.35392 h 5.688542 V 80.614723 c -0.06772,-2.386383 0.270767,-3.391646 -3.115053,-5.359363 3.45354,-1.925852 3.115053,-2.972475 3.115053,-5.31699 V 37.032886 c 0,-1.777606 0.227126,-3.87418 -1.121894,-5.075661 l -0.0026,-0.0026 c -0.04151,-0.03687 -0.08516,-0.07235 -0.129707,-0.107487 l -2.934705,-2.445329 -0.0052,0.0078 c -0.139166,-0.13724 -0.29209,-0.266712 -0.470726,-0.381403 -1.422045,-0.879192 -4.177519,-0.981126 -6.494693,-0.977202 z" />
			<path id="path68" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#d0ced0;fill-opacity:1;stroke:#d0ced0;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 71.275757,27.771951 c -2.513472,0 -6.636287,1.633045 -6.636287,3.851963 V 111.2511 c 0,0.96237 0.549098,1.81366 1.473295,2.47013 l 2.693377,2.24792 c 0.129106,0.12137 0.26752,0.23834 0.418578,0.34934 l 0.04909,0.0408 0.0031,-5.2e-4 c 1.206445,0.86193 3.058139,1.3901 5.173845,1.3901 3.65669,0 6.636288,-1.59118 6.636288,-3.85196 V 34.269747 c 0,-0.893813 -0.471218,-1.680334 -1.260388,-2.30787 l 0.0026,-0.0026 -3.020489,-2.516642 C 75.619165,28.406847 72.610025,27.771934 71.27577,27.771934 Z" />
			<path id="path70" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#d0ced0;fill-opacity:1;stroke:#d0ced0;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 79.36157,28.064958 v 83.521002 c 0,0.94639 0.545687,1.72375 1.451073,2.3058 l 2.809647,2.38539 h 10e-4 c 1.18709,0.94797 3.230499,1.47174 5.549532,1.47174 3.65669,0 6.703984,-1.25631 6.703984,-3.5171 V 30.710792 L 92.70184,28.064958 h -5.755722 v 1.523937 l -1.828829,-1.523937 z" />
			<path id="path72" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#d0ced0;fill-opacity:1;stroke:#d0ced0;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 99.197568,28.051004 c 0,0 -1.474026,0.01394 -2.066539,0.01394 h -2.979663 v 86.703236 c 0,0 3.175,2.64584 3.175,2.64583 h 2.979664 c 2.3971,0 6.63626,0.16714 8.53232,-0.96324 1.82834,-1.1304 1.48984,-3.433 1.48984,-5.35885 V 37.032876 c 0,-1.765525 0.27918,-3.844962 -1.08211,-5.050338 l 0.004,-0.0031 -0.0687,-0.05684 c -0.0148,-0.01225 -0.0288,-0.02514 -0.0439,-0.03721 l -3.05666,-2.539381 c -0.0565,-0.0505 -0.1149,-0.09991 -0.17725,-0.147278 -2.6e-4,-2.64e-4 -5.3e-4,-7.93e-4 -0.001,-0.0011 -0.0767,-0.0582 -0.15325,-0.116324 -0.23926,-0.1695 -1.42205,-0.879192 -6.465784,-0.977202 -6.465784,-0.977202 z" />
		</g>
	</defs>

	<g id="original">
		<g id="shadows">
			<path d="M 35.697566,54.523292 V 88.30986 l 3.175,2.645833 h 5.755723 V 76.972051 c 2.234644,0 4.469108,-0.167272 5.755719,-0.962731 1.828345,-1.13039 1.489832,-3.433006 1.489832,-5.31699 v -7.20111 c 0,-1.868987 0.31284,-4.089508 -1.339453,-5.252394 l -2.707328,-2.255677 -0.0052,0.0078 c -0.171193,-0.185687 -0.372432,-0.355701 -0.612883,-0.504362 -1.286613,-0.795459 -3.588814,-0.921383 -5.688023,-0.963248 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#d0ced0;fill-opacity:1;stroke:#d0ced0;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="p" />
			<path d="m 55.190434,54.509338 c -0.77239,0.0013 -1.495848,0.01395 -2.105297,0.01395 H 50.17317 v 33.786568 l 3.175,2.645833 h 5.688541 v -1.353923 l 1.624706,1.353923 h 5.688542 V 80.614723 c -0.06772,-2.386383 0.270767,-3.391646 -3.115053,-5.359363 3.45354,-1.925852 3.115053,-2.972475 3.115053,-5.31699 v -6.44715 c 0,-1.777606 0.227126,-3.87418 -1.121894,-5.075661 l -0.0026,-0.0026 c -0.04151,-0.03687 -0.08516,-0.07235 -0.129707,-0.107487 l -2.934705,-2.445329 -0.0052,0.0078 c -0.139166,-0.13724 -0.29209,-0.266712 -0.470726,-0.381403 -1.422045,-0.879192 -4.177519,-0.981126 -6.494693,-0.977202 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#d0ced0;fill-opacity:1;stroke:#d0ced0;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="r" />
			<path d="m 71.275757,54.230285 c -3.724404,0 -6.636287,1.633045 -6.636287,3.851963 v 26.710514 c 0,0.962371 0.549098,1.813663 1.473295,2.470134 l 2.693377,2.247924 c 0.129106,0.121364 0.26752,0.238336 0.418578,0.349334 l 0.04909,0.04082 0.0031,-5.16e-4 c 1.206445,0.86193 3.058139,1.390097 5.173845,1.390097 3.65669,0 6.636288,-1.591178 6.636288,-3.851963 V 60.728081 c 0,-0.893813 -0.471218,-1.680334 -1.260388,-2.30787 l 0.0026,-0.0026 -3.020489,-2.516642 C 75.619165,54.865181 73.58353,54.230268 71.27577,54.230268 Z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#d0ced0;fill-opacity:1;stroke:#d0ced0;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="o" />
			<path d="m 79.36157,54.523292 v 30.604334 c 0,0.946391 0.545687,1.723747 1.451073,2.305802 l 2.809647,2.385385 h 10e-4 c 1.18709,0.947973 3.230499,1.471745 5.549532,1.471745 3.65669,0 6.703984,-1.256313 6.703984,-3.517098 V 57.169126 L 92.70184,54.523292 h -5.755722 v 1.523937 l -1.828829,-1.523937 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#d0ced0;fill-opacity:1;stroke:#d0ced0;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="u" />
			<path d="m 99.197568,54.509338 c -0.762863,0.0013 -1.474026,0.01394 -2.066539,0.01394 h -2.979663 v 33.786567 c 0,0 3.175,2.645844 3.175,2.645834 h 2.979664 c 2.3971,0 6.63626,0.167142 8.53232,-0.963248 1.82834,-1.130395 1.48984,-3.432995 1.48984,-5.358847 V 63.49121 c 0,-1.765525 0.27918,-3.844962 -1.08211,-5.050338 l 0.004,-0.0031 -0.0687,-0.05684 c -0.0148,-0.01225 -0.0288,-0.02514 -0.0439,-0.03721 l -3.05666,-2.539381 c -0.0565,-0.0505 -0.1149,-0.09991 -0.17725,-0.147278 -2.6e-4,-2.64e-4 -5.3e-4,-7.93e-4 -0.001,-0.0011 -0.0767,-0.0582 -0.15325,-0.116324 -0.23926,-0.1695 -1.42205,-0.879192 -4.17719,-0.981125 -6.465784,-0.977202 z" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#d0ced0;fill-opacity:1;stroke:#d0ced0;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="d" />
		</g>
		<g id="chars">
			<g id="p">
				<path id="path911" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#b337ff;fill-opacity:1;stroke:#000000;stroke-width:0.999999;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="M 160.76367 191.58984 L 157.39453 196.46289 C 154.60992 196.23166 151.72516 196.12802 148.92969 196.07227 L 126.91992 196.07227 L 126.91992 313.76953 L 114.91992 313.76953 L 126.91992 323.76953 L 148.67383 323.76953 L 148.67383 270.91797 C 157.11973 270.91797 165.56494 270.28576 170.42773 267.2793 C 177.33801 263.00696 176.05859 254.30416 176.05859 247.18359 L 176.05859 219.9668 C 176.05859 212.90291 177.24098 204.51039 170.99609 200.11523 L 160.76367 191.58984 z M 148.67383 213.36523 L 150.7207 213.36523 C 155.07162 213.36523 154.56055 216.21273 154.56055 217.00391 L 154.56055 249.98633 C 154.56055 250.7775 155.07162 253.62695 150.7207 253.62695 L 148.67383 253.62695 L 148.67383 213.36523 z " transform="scale(0.26458334)" />
				<path style="fill:#58008dff;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;fill-opacity:1" d="m 39.336619,71.680381 -3.175067,-2.645764 0.884013,-1.385427 4.532244,-0.824 3.884136,3.590527 c -0.585004,0.650574 -2.035274,0.996014 -3.119202,1.130045 -1.009926,0.12488 -3.006124,0.134619 -3.006124,0.134619 z" id="path994" />
				<path style="fill:#58008dff;stroke:#000000;stroke-width:0.26458334;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;fill-opacity:1" d="m 36.161552,83.017973 3.175067,2.646051 h -5.755723 l -3.175243,-2.646051 z" id="path990" />
				<path id="path21" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;stroke-width:0.26458334;stroke-miterlimit:4;stroke-dasharray:none;stroke:#000000;stroke-opacity:1;fill:#fffdff;fill-opacity:1;stroke-linejoin:round;stroke-linecap:round" d="M 36.161553,64.459512 V 53.806948 h 0.541732 c 1.151181,0 1.015748,0.753594 1.015748,0.962926 v 8.726713 c 0,0.209332 0.135433,0.962925 -1.015748,0.962925 z m 0,4.575105 c 2.234645,0 4.469288,-0.167465 5.755902,-0.962926 1.828344,-1.13039 1.489762,-3.433039 1.489762,-5.317023 V 55.55366 c 0,-1.925852 0.338582,-4.2285 -1.489762,-5.358891 -1.286614,-0.795459 -3.588974,-0.921059 -5.688184,-0.962925 h -5.823619 v 33.786128 h 5.755901 z" />
			</g>
			<g id="r">
				<path id="path913" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#b337ff;fill-opacity:1;stroke:#000000;stroke-width:0.999999;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="M 214.93945 191.125 L 211.32422 196.35352 C 207.76181 196.07839 204.05185 196.01368 200.59375 196.01953 C 197.67448 196.02448 194.94015 196.07227 192.63672 196.07227 L 181.63086 196.07227 L 181.63086 313.76953 L 169.63086 313.76953 L 181.63086 323.76953 L 203.13086 323.76953 L 203.13086 318.65234 L 209.27148 323.76953 L 230.77148 323.76953 L 230.77148 284.68555 C 230.51553 275.66615 231.79486 271.86673 218.99805 264.42969 C 232.0508 257.15088 230.77148 253.19514 230.77148 244.33398 L 230.77148 219.9668 C 230.77148 213.24829 231.62991 205.32423 226.53125 200.7832 L 226.52148 200.77344 C 226.36461 200.63409 226.1996 200.5 226.03125 200.36719 L 214.93945 191.125 z M 203.13086 213.36523 L 205.43359 213.36523 C 209.78451 213.36523 209.27148 216.21273 209.27148 217.00391 L 209.27148 249.98633 C 209.27148 251.25221 209.52855 253.62695 205.43359 253.62695 L 203.13086 253.62695 L 203.13086 213.36523 z M 203.13086 270.12695 L 205.43359 270.12695 C 209.52857 270.12695 209.27148 272.49976 209.27148 273.76562 L 209.27148 313.76953 L 203.13086 313.76953 L 203.13086 270.12695 z " transform="scale(0.26458334)" />
				<path style="fill:#58008dff;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;fill-opacity:1" d="m 57.943236,69.963691 -3.175006,-2.645593 -0.443611,-2.998052 2.592234,-0.758709 4.117695,2.872066 c -0.08966,1.020458 -0.46755,1.493271 -1.025298,2.095555 -0.569687,0.615176 -2.066014,1.434733 -2.066014,1.434733 z" id="path996" />
				<path id="path23" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;stroke-width:0.26458334;stroke-miterlimit:4;stroke-dasharray:none;stroke:#000000;stroke-opacity:1;fill:#fffdff;fill-opacity:1;stroke-linejoin:round;stroke-linecap:round" d="M 50.569808,64.459512 V 53.806948 h 0.609448 c 1.15118,0 1.015747,0.753594 1.015747,0.962926 v 8.726713 c 0,0.334931 0.06771,0.962925 -1.015747,0.962925 z m 0,4.365773 h 0.609448 c 1.083463,0 1.015747,0.627996 1.015747,0.962926 v 13.229761 h 5.688185 V 72.676988 c -0.06772,-2.386381 0.270866,-3.391173 -3.114958,-5.35889 3.45354,-1.925851 3.114958,-2.972509 3.114958,-5.317024 V 55.55366 c 0,-1.925852 0.270866,-4.2285 -1.489763,-5.358891 -1.896061,-1.172256 -6.1622,-0.962925 -8.599993,-0.962925 h -2.911808 v 33.786128 h 5.688184 z" />
				<path style="fill:#58008dff;stroke:#000000;stroke-width:0.26458334;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;fill-opacity:1" d="m 44.8815,83.01819 3.175,2.645834 h 5.688541 l -3.175233,-2.646051 z" id="path986" />
				<path style="fill:#58008dff;stroke:#000000;stroke-width:0.26458334;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;fill-opacity:1" d="m 52.195004,83.017973 3.174743,2.646051 h 5.688542 l -3.175101,-2.646051 z" id="path988" />
			</g>
			<g id="o">
				<path id="path915" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#b337ff;fill-opacity:1;stroke:#000000;stroke-width:0.999999;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="M 270.125 191.13281 L 267.21094 195.34961 C 265.33843 195.1066 263.39578 194.96484 261.38867 194.96484 C 247.31218 194.96484 236.30664 201.13698 236.30664 209.52344 L 236.30664 306.07227 L 227.98438 308.23633 L 240.05469 318.30859 C 240.54266 318.76729 241.06579 319.20939 241.63672 319.62891 L 241.82227 319.7832 L 241.83398 319.78125 C 246.39377 323.03894 253.3923 325.03516 261.38867 325.03516 C 275.20923 325.03516 286.4707 319.02126 286.4707 310.47656 L 286.4707 209.52344 C 286.4707 206.14525 284.68972 203.17257 281.70703 200.80078 L 281.7168 200.79102 L 270.125 191.13281 z M 261.38867 211.94141 C 263.18023 211.94141 264.97266 212.73214 264.97266 214.15625 L 264.97266 305.84375 C 264.97266 307.26788 263.18023 308.05859 261.38867 308.05859 C 259.34118 308.05859 257.80469 306.95141 257.80469 305.84375 L 257.80469 214.15625 C 257.80469 213.04861 259.34118 211.94141 261.38867 211.94141 z " transform="scale(0.26458334)" />
				<path id="path992" d="m 60.320869,81.554198 3.925314,3.243407 c 1.156025,0.762725 3.299772,1.202113 5.244716,1.20272 1.86979,5.84e-4 3.947985,-0.720382 5.190015,-1.702549 l -3.208085,-2.984901 z" style="fill:#58008dff;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
				<path id="path25" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;stroke-width:0.26458334;stroke-miterlimit:4;stroke-dasharray:none;stroke:#000000;stroke-opacity:1;fill:#fffdff;fill-opacity:1;stroke-linejoin:round;stroke-linecap:round" d="m 59.347857,52.790482 v 26.710717 c 0,2.218915 2.911808,3.851703 6.636214,3.851703 3.65669,0 6.636216,-1.590918 6.636216,-3.851703 V 52.790482 c 0,-2.260782 -2.979526,-3.851703 -6.636216,-3.851703 -3.724406,0 -6.636214,1.632787 -6.636214,3.851703 z m 5.688184,25.484919 V 54.01628 c 0,-0.293064 0.406298,-0.586129 0.94803,-0.586129 0.474016,0 0.948032,0.209332 0.948032,0.586129 v 24.259121 c 0,0.3768 -0.474016,0.586127 -0.948032,0.586127 -0.541732,0 -0.94803,-0.293059 -0.94803,-0.586127 z" />
			</g>
			<g id="u">
				<path id="path917" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#b337ff;fill-opacity:1;stroke:#000000;stroke-width:0.999999;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="M 301.70312 186.07227 L 295.36914 196.07227 L 291.94922 196.07227 L 291.94922 305.52148 L 282.38477 307.86914 L 296.05273 319.47266 L 296.05664 319.47266 C 300.54328 323.05555 308.2664 325.03516 317.03125 325.03516 C 330.85181 325.03516 342.36914 320.28689 342.36914 311.74219 L 342.36914 196.07227 L 330.36914 186.07227 L 324.0332 196.07227 L 320.61523 196.07227 L 320.61523 305.84375 C 320.61523 307.26788 319.07874 308.05859 317.03125 308.05859 C 314.98376 308.05859 313.70313 306.95141 313.70312 305.84375 L 313.70312 196.07227 L 301.70312 186.07227 z " transform="scale(0.26458334)" />
				<path style="fill:#58008dff;stroke:#000000;stroke-width:0.26458334;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;fill-opacity:1" d="m 74.714306,81.457045 3.616314,3.070098 c 1.482692,1.258743 3.696656,1.488564 5.6416,1.489171 1.86979,5.84e-4 4.182465,-0.446075 5.424495,-1.428242 l -3.530449,-3.37235 z" id="path978" />
				<path id="path27" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;stroke-width:0.26458334;stroke-miterlimit:4;stroke-dasharray:none;stroke:#000000;stroke-opacity:1;fill:#fffdff;fill-opacity:1;stroke-linejoin:round;stroke-linecap:round" d="m 74.069962,49.231844 v 30.604285 c 0,2.218915 2.979525,3.516773 6.636214,3.516773 3.656691,0 6.703932,-1.255988 6.703932,-3.516773 V 49.231844 h -5.7559 v 29.043557 c 0,0.3768 -0.4063,0.586127 -0.948032,0.586127 -0.541731,0 -0.880314,-0.293059 -0.880314,-0.586127 V 49.231844 Z" />
			</g>
			<g id="d">
				<path id="path919" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;fill:#b337ff;fill-opacity:1;stroke:#000000;stroke-width:0.999999;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 380.26172,190.35352 c 0,0 -1.15384,3.30458 -2.12305,6.0371 -6.69856,-0.56737 -13.99546,-0.31835 -19.02929,-0.31835 h -11.26172 v 117.71875 l -12,-0.0215 12,10 h 11.26172 c 9.05984,0 25.08183,0.63173 32.24804,-3.64062 6.91026,-4.27235 5.63086,-12.9751 5.63086,-20.25391 v -79.9082 c 0,-6.67285 1.05519,-14.53214 -4.08984,-19.08789 l 0.0137,-0.0117 -0.25977,-0.21485 c -0.0558,-0.0463 -0.10885,-0.095 -0.16601,-0.14062 z m -10.66016,23.01171 h 2.04883 c 4.35089,0 3.83789,2.8475 3.83789,3.63868 v 85.67578 c 0,0.94941 0.513,3.79687 -3.83789,3.79687 h -2.04883 z" transform="scale(0.26458334)" />
				<path style="fill:#58008dff;fill-opacity:1;stroke:#000000;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" d="m 92.034696,85.664024 2.879637,0.0081 c 1.426397,0.004 7.829707,0.461766 9.396667,-1.649943 l -4.03074,-3.316653 -9.912172,1.168449 -1.508308,1.143995 z" id="path976" />
				<path id="path29" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.2451px;line-height:1.25;font-family:OPTIGamma;-inkscape-font-specification:'OPTIGamma, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;stroke-width:0.26458334;stroke-miterlimit:4;stroke-dasharray:none;stroke:#000000;stroke-opacity:1;fill:#fffdff;fill-opacity:1;stroke-linejoin:round;stroke-linecap:round" d="M 101.86129,76.696155 V 55.55366 c 0,-1.925852 0.33858,-4.2285 -1.48976,-5.358891 -1.896054,-1.172256 -6.16217,-0.962925 -8.532225,-0.962925 h -2.979526 v 33.786128 h 2.979526 c 2.370055,0 6.636171,0.167465 8.532225,-0.962928 1.82834,-1.130392 1.48976,-3.433038 1.48976,-5.358889 z M 96.173131,54.769874 v 22.6682 c 0,0.251199 0.135427,1.004792 -1.015744,1.004792 H 94.61566 V 53.806948 h 0.541727 c 1.151171,0 1.015744,0.753594 1.015744,0.962926 z" />
			</g>
		</g>
	</g>
</svg>

<div class="support">
	<a href="https://twitter.com/DevLoop01" target="_blank"><i class="fab fa-twitter-square"></i></a>
	<a href="https://dribbble.com/devloop01" target="_blank"><i class="fab fa-dribbble"></i></a>
</div>
!

CSS 

              
                * {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

body {
	width: 100%;
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #fffdff;
}


.support{
	position: absolute;
	right: 10px;
	bottom: 10px;
	padding: 10px;
	display: flex;
	a{
		margin: 0 10px;
		color: #333333;
		font-size: 1.8rem;
		backface-visibility: hidden;
		transition: all 150ms ease;
		&:hover{
			transform: scale(1.1);
		}
	}

}
!

JS 

              
                console.clear();

gsap.registerPlugin(MorphSVGPlugin);

const chars = [
	returnPathArray("#original #p"),
	returnPathArray("#original #r"),
	returnPathArray("#original #o"),
	returnPathArray("#original #u"),
	returnPathArray("#original #d")
];
const charMorphs = [
	returnPathArray("#morphs #p"),
	returnPathArray("#morphs #r"),
	returnPathArray("#morphs #o"),
	returnPathArray("#morphs #u"),
	returnPathArray("#morphs #d")
];

const shadows = gsap.utils.toArray("#shadows path");
const shadowMorphs = gsap.utils.toArray("#shadow-morphs path");

const TL_DEFAULTS = {
	duration: 0.8,
	repeat: 1,
	repeatDelay: 0.25,
	ease: "elastic.inOut",
	yoyo: true
};

function stretchStagger() {
	let charStaggerTl = gsap.timeline({ defaults: TL_DEFAULTS });
	let shadowStaggerTl = gsap.timeline({ defaults: TL_DEFAULTS });
	charStaggerTl
		.to(chars[2],{morphSVG: (i) => charMorphs[2][i]},0)
		.to(chars[1],{morphSVG: (i) => charMorphs[1][i]},0.1)
		.to(chars[3],{morphSVG: (i) => charMorphs[3][i]},0.1)
		.to(chars[0],{morphSVG: (i) => charMorphs[0][i]},0.2)
		.to(chars[4],{morphSVG: (i) => charMorphs[4][i]},0.2)
		.call(() => stretch());
	shadowStaggerTl
		.to(shadows[2],{morphSVG: shadowMorphs[2]},0)
		.to(shadows[1],{morphSVG: shadowMorphs[1]},0.1)
		.to(shadows[3],{morphSVG: shadowMorphs[3]},0.1)
		.to(shadows[0],{morphSVG: shadowMorphs[0]},0.2)
		.to(shadows[4],{morphSVG: shadowMorphs[4]},0.2)
}

function stretch() {
	let charTl = gsap.timeline({ defaults: TL_DEFAULTS });
	let shadowTl = gsap.timeline({ defaults: TL_DEFAULTS });
	charTl
		.to(chars[2],{morphSVG: (i) => charMorphs[2][i]},0)
		.to(chars[1],{morphSVG: (i) => charMorphs[1][i]},0)
		.to(chars[3],{morphSVG: (i) => charMorphs[3][i]},0)
		.to(chars[0],{morphSVG: (i) => charMorphs[0][i]},0)
		.to(chars[4],{morphSVG: (i) => charMorphs[4][i]},0)
		.call(() => stretchStagger())
	shadowTl
		.to(shadows[2],{morphSVG: shadowMorphs[2]},0)
		.to(shadows[1],{morphSVG: shadowMorphs[1]},0)
		.to(shadows[3],{morphSVG: shadowMorphs[3]},0)
		.to(shadows[0],{morphSVG: shadowMorphs[0]},0)
		.to(shadows[4],{morphSVG: shadowMorphs[4]},0)
}

stretchStagger()

function returnPathArray(selectorString) {
	return gsap.utils.toArray(`${selectorString} path`);
}
!
999px

Console