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

Pen Settings

CSS Base

Vendor Prefixing

Add External CSS

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

Quick-add: + add another resource

Add External JavaScript

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

Quick-add: + add another resource

Code Indentation

     

Save Automatically?

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

Auto-Updating Preview

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

            
              
         <div class="page-loading">
            <div class="svg-wrap">
               <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                      width="150.762px" height="150.76px" viewBox="145.118 99.284 101.762 101.76"
                      enable-background="new 145.118 99.284 101.762 101.76">
                                                                                                                  
                  <g id="XMLID_2_">
                     <g>
                        <path fill="none" d="M201.282,104.023l-0.503,4.405l-0.014-0.001c-3.732-0.426-7.411-0.354-10.968,0.194l-0.657-4.402
                           c3.93-0.588,7.992-0.67,12.128-0.198L201.282,104.023z"/>
                        <path fill="none" d="M201.785,99.618l-0.503,4.405l-0.014-0.001c-4.136-0.473-8.198-0.391-12.128,0.198l-0.646-4.386
                           c4.304-0.641,8.75-0.734,13.276-0.217L201.785,99.618z"/>
                        <path fill="none" d="M199.772,117.239l-0.503,4.405l-0.014-0.001c-2.56-0.292-5.063-0.237-7.493,0.127l-0.659-4.388
                           c2.805-0.417,5.705-0.481,8.655-0.144L199.772,117.239z"/>
                        <path fill="none" d="M200.275,112.834l-0.503,4.405l-0.014-0.001c-2.95-0.337-5.851-0.272-8.655,0.144l-0.646-4.386
                           c3.179-0.47,6.463-0.545,9.805-0.164L200.275,112.834z"/>
                        <path fill="none" d="M169.853,117.275l2.769,3.482c-2.567,2.041-4.87,4.398-6.823,7.041l-3.573-2.646
                           C164.432,122.197,166.999,119.556,169.853,117.275z"/>
                        <path fill="none" d="M179.26,111.621l1.76,4.077c-3.031,1.319-5.845,3.018-8.398,5.06l-2.769-3.482
                           C172.72,114.996,175.885,113.091,179.26,111.621z"/>
                        <path fill="none" d="M189.798,108.621l0.66,4.375c-3.29,0.484-6.466,1.404-9.438,2.702l-1.76-4.077
                           C182.59,110.186,186.12,109.156,189.798,108.621z"/>
                        <path fill="none" d="M172.621,120.757l2.757,3.468c-2.266,1.788-4.293,3.891-6.006,6.22l-3.574-2.646
                           C167.751,125.155,170.054,122.798,172.621,120.757z"/>
                        <path fill="none" d="M190.458,112.996l0.646,4.386c-2.901,0.433-5.682,1.234-8.312,2.395l-1.772-4.079
                           C183.992,114.399,187.168,113.479,190.458,112.996z"/>
                        <path fill="none" d="M181.02,115.698l1.772,4.079c-2.657,1.157-5.163,2.659-7.414,4.449l-2.757-3.468
                           C175.175,118.715,177.988,117.017,181.02,115.698z"/>
                        <path fill="none" d="M182.792,119.776l1.773,4.065c-2.311,0.992-4.479,2.3-6.432,3.851l-2.756-3.467
                           C177.629,122.435,180.135,120.933,182.792,119.776z"/>
                        <path fill="none" d="M178.134,127.692l2.757,3.467c-1.651,1.313-3.137,2.849-4.396,4.562l-3.562-2.631
                           C174.419,131.062,176.183,129.244,178.134,127.692z"/>
                        <path fill="none" d="M184.565,123.841l1.761,4.063c-1.952,0.841-3.784,1.941-5.436,3.255l-2.757-3.467
                           C180.086,126.141,182.255,124.833,184.565,123.841z"/>
                        <path fill="none" d="M169.372,130.445l3.561,2.645c-1.483,1.987-2.716,4.18-3.642,6.544l-4.126-1.631
                           C166.228,135.272,167.648,132.746,169.372,130.445z"/>
                        <path fill="none" d="M176.494,135.721l3.561,2.646c-1.03,1.37-1.872,2.884-2.509,4.518l-4.128-1.618
                           C174.192,139.266,175.237,137.406,176.494,135.721z"/>
                        <path fill="none" d="M183.659,134.643l2.757,3.467c-1.051,0.835-1.994,1.806-2.786,2.889l-3.575-2.633
                           c1.032-1.397,2.24-2.651,3.592-3.725L183.659,134.643z"/>
                        <path fill="none" d="M188.1,131.97l1.761,4.063c-1.235,0.541-2.394,1.241-3.444,2.077l-2.757-3.467
                           C185.012,133.555,186.506,132.661,188.1,131.97z"/>
                        <path fill="none" d="M193.726,134.932l0.659,4.388c-0.959,0.149-1.876,0.414-2.752,0.791l-1.772-4.078
                           C191.081,135.503,192.381,135.12,193.726,134.932z"/>
                        <path fill="none" d="M189.86,136.033l1.772,4.078c-0.875,0.378-1.711,0.883-2.448,1.481l-2.769-3.482
                           C187.467,137.274,188.625,136.574,189.86,136.033z"/>
                        <path fill="none" d="M183.63,140.999l3.56,2.645c-0.563,0.754-1.028,1.602-1.391,2.502l-4.127-1.631
                           C182.172,143.248,182.839,142.068,183.63,140.999z"/>
                        <path fill="none" d="M177.546,142.883l4.126,1.631c-0.481,1.228-0.82,2.527-0.978,3.901l-4.405-0.503
                           C176.49,146.147,176.915,144.463,177.546,142.883z"/>
                        <path fill="none" d="M181.672,144.515l4.127,1.631c-0.332,0.876-0.562,1.806-0.672,2.776l-4.433-0.506
                           C180.852,147.042,181.19,145.743,181.672,144.515z"/>
                        <path fill="none" d="M177.805,158.062l-4.064,1.772c-0.845-1.926-1.443-3.974-1.747-6.096l4.387-0.646
                           C176.632,154.83,177.11,156.495,177.805,158.062z"/>
                        <path fill="none" d="M173.74,159.836l-4.065,1.773c-0.996-2.271-1.701-4.697-2.069-7.209l4.388-0.66
                           C172.297,155.863,172.896,157.91,173.74,159.836z"/>
                        <path fill="none" d="M246.546,155.938l-4.405-0.504c0.473-4.137,0.391-8.199-0.198-12.127l4.387-0.646
                           C246.971,146.964,247.063,151.41,246.546,155.938z"/>
                        <path class="node node-1" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M242.141,155.434l4.405,0.504
                           c-0.517,4.525-1.609,8.836-3.205,12.886l-4.128-1.617C240.673,163.509,241.668,159.568,242.141,155.434z"/>
                        <path class="node node-2" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M246.329,142.66l-4.387,0.646
                           c-0.6-4.067-1.736-7.978-3.35-11.656l4.077-1.759C244.42,133.925,245.677,138.218,246.329,142.66z"/>
                        <path class="node node-3" fill="#00A1AD" d="M239.213,167.205l4.128,1.617c-1.637,4.181-3.829,8.078-6.444,11.615l-3.575-2.634
                           C235.723,174.585,237.712,171.032,239.213,167.205z"/>
                        <path class="node node-4" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M242.141,155.434l-4.405-0.504
                           c0.426-3.73,0.355-7.411-0.194-10.967l4.401-0.657C242.531,147.235,242.613,151.297,242.141,155.434z"/>
                        <path class="node node-5" fill="#00A1AD" d="M237.735,154.93l4.405,0.504c-0.473,4.137-1.468,8.075-2.928,11.771l-4.14-1.633
                           C236.41,162.23,237.31,158.662,237.735,154.93z"/>
                        <path fill="none" d="M241.942,143.305l-4.401,0.657c-0.535-3.678-1.563-7.221-2.998-10.551l4.05-1.762
                           C240.206,135.328,241.343,139.238,241.942,143.305z"/>
                        <path class="node node-6" fill="#4BC4D6" d="M235.073,165.572l4.14,1.633c-1.501,3.827-3.49,7.38-5.892,10.6l-3.548-2.63
                           C231.922,172.254,233.723,169.034,235.073,165.572z"/>
                        <path fill="none" d="M242.67,129.891l-4.077,1.759c-1.621-3.733-3.72-7.222-6.238-10.389l3.468-2.757
                           C238.579,121.972,240.886,125.797,242.67,129.891z"/>
                        <path fill="none" d="M233.321,177.805l3.575,2.633c-2.661,3.586-5.771,6.793-9.238,9.551l-2.757-3.469
                           C228.069,184.002,230.9,181.077,233.321,177.805z"/>
                        <path fill="none" d="M237.735,154.93l-4.392-0.501c0.381-3.341,0.308-6.639-0.177-9.806l4.374-0.661
                           C238.091,147.519,238.161,151.198,237.735,154.93z"/>
                        <path class="node node-7" fill="#B2E3E6" d="M233.344,154.429l4.392,0.501c-0.426,3.732-1.325,7.301-2.662,10.644l-4.113-1.632
                           C232.148,160.952,232.962,157.77,233.344,154.429z"/>
                        <path fill="none" d="M237.541,143.962l-4.374,0.661c-0.484-3.29-1.404-6.466-2.702-9.439l4.078-1.772
                           C235.978,136.742,237.006,140.285,237.541,143.962z"/>
                        <path fill="none" d="M230.96,163.941l4.113,1.631c-1.351,3.462-3.151,6.682-5.3,9.603l-3.574-2.646
                           C228.135,169.925,229.747,167.038,230.96,163.941z"/>
                        <path fill="none" d="M238.593,131.649l-4.05,1.762c-1.484-3.377-3.39-6.529-5.655-9.395l3.467-2.756
                           C234.873,124.428,236.972,127.916,238.593,131.649z"/>
                        <path fill="none" d="M229.773,175.175l3.548,2.63c-2.421,3.272-5.252,6.197-8.42,8.715l-2.757-3.468
                           C224.999,180.771,227.565,178.13,229.773,175.175z"/>
                        <path fill="none" d="M233.344,154.429l-4.419-0.505c0.337-2.949,0.272-5.851-0.145-8.655l4.387-0.646
                           C233.651,147.79,233.725,151.088,233.344,154.429z"/>
                        <path fill="none" d="M228.925,153.924l4.419,0.505c-0.382,3.341-1.195,6.523-2.384,9.513l-4.128-1.616
                           C227.871,159.686,228.588,156.875,228.925,153.924z"/>
                        <path class="node node-8" fill="#4BC4D6" d="M226.199,172.529l3.574,2.646c-2.208,2.955-4.774,5.597-7.629,7.877l-2.769-3.481
                           C221.941,177.543,224.232,175.17,226.199,172.529z"/>
                        <path fill="none" d="M234.543,133.412l-4.078,1.772c-1.308-3.016-3.02-5.832-5.06-8.398l3.481-2.769
                           C231.153,126.883,233.059,130.035,234.543,133.412z"/>
                        <path class="node node-9" fill="#4BC4D6" d="M233.167,144.623l-4.387,0.646c-0.433-2.902-1.234-5.682-2.396-8.312l4.079-1.772
                           C231.763,138.157,232.683,141.333,233.167,144.623z"/>
                        <path class="node node-10" fill="#00A1AD" d="M226.832,162.324l4.128,1.617c-1.213,3.097-2.825,5.982-4.761,8.588l-3.573-2.646
                           C224.349,167.582,225.757,165.054,226.832,162.324z"/>
                        <path fill="none" d="M235.822,118.504l-3.468,2.757c-2.518-3.167-5.454-6.014-8.727-8.435l2.646-3.56
                           C229.858,111.927,233.065,115.037,235.822,118.504z"/>
                        <path class="node node-11" fill="#CF3E57" d="M224.901,186.52l2.757,3.469c-3.468,2.757-7.293,5.062-11.387,6.848l-1.759-4.077
                           C218.246,191.137,221.734,189.038,224.901,186.52z"/>
                        <path class="node node-12" fill="#00A1AD" d="M228.925,153.924l-4.419-0.504c0.291-2.547,0.237-5.064-0.127-7.494l4.401-0.657
                           C229.197,148.073,229.262,150.975,228.925,153.924z"/>
                        <path class="node node-13" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M224.506,153.42l4.419,0.504
                           c-0.337,2.951-1.054,5.762-2.093,8.4l-4.14-1.633C223.595,158.406,224.215,155.965,224.506,153.42z"/>
                        <path fill="none" d="M232.354,121.261l-3.467,2.756c-2.279-2.867-4.935-5.436-7.891-7.629l2.631-3.562
                           C226.9,115.247,229.837,118.093,232.354,121.261z"/>
                        <path class="node node-14" fill="#4BC4D6" d="M222.145,183.052l2.757,3.468c-3.167,2.52-6.655,4.617-10.389,6.238l-1.775-4.052
                           C216.112,187.234,219.278,185.331,222.145,183.052z"/>
                        <path class="node node-15" fill="#B2E3E6" d="M222.626,169.883l3.573,2.646c-1.967,2.641-4.258,5.014-6.823,7.039l-2.756-3.467
                           C218.871,174.312,220.899,172.21,222.626,169.883z"/>
                        <path fill="none" d="M230.465,135.184l-4.079,1.772c-1.156-2.657-2.658-5.163-4.448-7.414l3.468-2.757
                           C227.445,129.353,229.157,132.168,230.465,135.184z"/>
                        <path fill="none" d="M228.78,145.269l-4.401,0.657c-0.368-2.512-1.075-4.927-2.071-7.197l4.078-1.772
                           C227.546,139.586,228.348,142.367,228.78,145.269z"/>
                        <path class="node node-16" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M222.692,160.691l4.14,1.633
                           c-1.075,2.729-2.483,5.258-4.206,7.559l-3.574-2.646C220.534,165.249,221.768,163.057,222.692,160.691z"/>
                        <path fill="none" d="M228.888,124.017l-3.482,2.769c-2.027-2.565-4.398-4.87-7.055-6.824l2.646-3.574
                           C223.953,118.582,226.608,121.15,228.888,124.017z"/>
                        <path fill="none" d="M219.376,179.568l2.769,3.482c-2.866,2.279-6.032,4.184-9.407,5.654l-1.759-4.077
                           C213.995,183.309,216.823,181.612,219.376,179.568z"/>
                        <path fill="none" d="M226.386,136.957l-4.078,1.772c-0.992-2.311-2.288-4.465-3.853-6.418l3.482-2.769
                           C223.728,131.794,225.229,134.299,226.386,136.957z"/>
                        <path class="node node-17" fill="#4BC4D6" d="M219.052,167.236l3.574,2.646c-1.727,2.327-3.755,4.431-6.006,6.22l-2.771-3.47l0.002-0.014
                           C215.816,171.07,217.564,169.264,219.052,167.236z"/>
                        <path fill="none" d="M224.506,153.42l-4.405-0.504c0.246-2.155,0.203-4.29-0.109-6.332l4.388-0.659
                           C224.743,148.356,224.797,150.873,224.506,153.42z"/>
                        <path fill="none" d="M220.101,152.916l4.405,0.504c-0.291,2.545-0.911,4.986-1.813,7.271l-4.126-1.631
                           C219.333,157.127,219.854,155.072,220.101,152.916z"/>
                        <path fill="none" d="M224.379,145.926l-4.388,0.659c-0.304-2.123-0.902-4.17-1.747-6.095l4.063-1.76
                           C223.304,140.999,224.011,143.414,224.379,145.926z"/>
                        <path fill="none" d="M218.566,159.061l4.126,1.631c-0.925,2.365-2.158,4.559-3.641,6.546l-3.562-2.632
                           C216.747,162.92,217.792,161.061,218.566,159.061z"/>
                        <path fill="none" d="M218.351,119.961c2.656,1.955,5.027,4.259,7.055,6.824l-3.468,2.757c-1.804-2.253-3.893-4.28-6.22-6.006
                           L218.351,119.961z"/>
                        <path class="node node-18" fill="#CF3E57" d="M216.62,176.104l2.756,3.467c-2.553,2.043-5.381,3.738-8.397,5.06l-1.772-4.078
                           C211.863,179.395,214.368,177.893,216.62,176.104z"/>
                        <path class="node node-19" fill="#4BC4D6" d="M214.513,192.758l1.759,4.077c-4.034,1.75-8.327,3.006-12.769,3.659l-0.646-4.387
                           C206.911,195.506,210.835,194.371,214.513,192.758z"/>
                        <path fill="none" d="M226.273,109.266l-2.646,3.56c-3.221-2.388-6.774-4.376-10.588-5.876l1.618-4.128
                           C218.838,104.458,222.736,106.651,226.273,109.266z"/>
                        <path class="node node-20" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M222.308,138.729l-4.063,1.76
                           c-0.842-1.952-1.931-3.77-3.257-5.421l3.468-2.757C220.02,134.264,221.315,136.418,222.308,138.729z"/>
                        <path fill="none" d="M215.49,164.604l3.562,2.633c-1.487,2.026-3.235,3.834-5.2,5.383l-2.757-3.467
                           C212.746,167.84,214.231,166.303,215.49,164.604z"/>
                        <path fill="none" d="M220.101,152.916l-4.405-0.503c0.201-1.765,0.166-3.489-0.093-5.169l4.389-0.659
                           C220.304,148.626,220.347,150.761,220.101,152.916z"/>
                        <path fill="none" d="M215.695,152.413l4.405,0.503c-0.246,2.156-0.768,4.211-1.534,6.145l-4.127-1.632
                           C215.07,155.85,215.493,154.178,215.695,152.413z"/>
                        <path fill="none" d="M221.938,129.542l-3.482,2.769c-1.536-1.963-3.356-3.713-5.383-5.214l2.646-3.561
                           C218.045,125.263,220.134,127.289,221.938,129.542z"/>
                        <path fill="none" d="M219.991,146.584l-4.389,0.659c-0.252-1.735-0.729-3.414-1.424-4.98l4.065-1.773
                           C219.089,142.415,219.688,144.462,219.991,146.584z"/>
                        <path fill="none" d="M214.439,157.429l4.127,1.632c-0.774,2-1.819,3.859-3.076,5.545l-3.562-2.646
                           C212.96,160.59,213.803,159.062,214.439,157.429z"/>
                        <path class="node node-21" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M213.85,172.633l2.771,3.471
                           c-2.252,1.789-4.757,3.291-7.414,4.447l-1.774-4.063C209.742,175.494,211.898,174.186,213.85,172.633z"/>
                        <path class="node node-22" fill="#4BC4D6" d="M212.737,188.706l1.775,4.052c-3.678,1.613-7.602,2.748-11.655,3.35l-0.658-4.4
                           C205.878,191.171,209.407,190.141,212.737,188.706z"/>
                        <path fill="none" d="M223.628,112.826l-2.631,3.562c-2.921-2.148-6.128-3.948-9.59-5.299l1.633-4.14
                           C216.854,108.449,220.407,110.438,223.628,112.826z"/>
                        <path class="node node-23" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M210.979,184.629l1.759,4.077
                           c-3.33,1.435-6.859,2.465-10.538,3l-0.66-4.374C204.829,186.848,208.005,185.928,210.979,184.629z"/>
                        <path class="node node-24" fill="#4BC4D6" d="M211.93,161.959l3.561,2.646c-1.259,1.697-2.744,3.234-4.396,4.547l-2.757-3.467
                           C209.688,164.611,210.896,163.355,211.93,161.959z"/>
                        <path fill="none" d="M218.244,140.489l-4.065,1.773c-0.691-1.594-1.585-3.088-2.659-4.438l3.468-2.756
                           C216.313,136.72,217.402,138.537,218.244,140.489z"/>
                        <path fill="none" d="M220.997,116.388l-2.646,3.574c-2.604-1.935-5.478-3.546-8.573-4.76l1.63-4.113
                           C214.869,112.439,218.076,114.239,220.997,116.388z"/>
                        <path class="node node-25" fill="#00A1AD" d="M213.852,172.619l-0.002,0.014c-1.951,1.553-4.107,2.861-6.418,3.854l-1.759-4.077
                           c1.952-0.842,3.771-1.944,5.422-3.257L213.852,172.619z"/>
                        <path fill="none" d="M213.072,127.097c2.026,1.5,3.847,3.25,5.383,5.214l-3.468,2.757c-1.299-1.65-2.834-3.149-4.546-4.409
                           L213.072,127.097z"/>
                        <path fill="none" d="M215.695,152.413l-4.405-0.503c0.156-1.375,0.132-2.715-0.073-4.021l4.386-0.646
                           C215.861,148.924,215.896,150.648,215.695,152.413z"/>
                        <path fill="none" d="M211.29,151.91l4.405,0.503c-0.202,1.765-0.625,3.437-1.256,5.016l-4.128-1.618
                           C210.807,154.584,211.133,153.284,211.29,151.91z"/>
                        <path fill="none" d="M215.603,147.244l-4.386,0.646c-0.188-1.345-0.571-2.645-1.101-3.865l4.062-1.761
                           C214.874,143.83,215.351,145.509,215.603,147.244z"/>
                        <path class="node node-26" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M210.312,155.811l4.128,1.618
                           c-0.637,1.634-1.479,3.161-2.51,4.53l-3.562-2.631C209.159,158.258,209.826,157.079,210.312,155.811z"/>
                        <path fill="none" d="M218.351,119.961l-2.633,3.575c-2.303-1.709-4.829-3.131-7.559-4.207l1.618-4.128
                           C212.873,116.415,215.746,118.026,218.351,119.961z"/>
                        <path fill="none" d="M214.179,142.263l-4.062,1.761c-0.528-1.234-1.229-2.392-2.063-3.443l3.467-2.757
                           C212.594,139.175,213.487,140.669,214.179,142.263z"/>
                        <path fill="none" d="M208.368,159.328l3.562,2.631c-1.033,1.396-2.241,2.652-3.592,3.727l-2.757-3.469
                           C206.632,161.382,207.562,160.41,208.368,159.328z"/>
                        <path fill="none" d="M210.441,130.659c1.712,1.26,3.247,2.759,4.546,4.409l-3.468,2.756c-1.073-1.351-2.326-2.572-3.725-3.592
                           L210.441,130.659z"/>
                        <path class="node node-27" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M208.338,165.686l2.757,3.467
                           c-1.651,1.312-3.47,2.416-5.422,3.258l-1.774-4.065C205.493,167.652,206.987,166.759,208.338,165.686z"/>
                        <path fill="none" d="M215.718,123.537l-2.646,3.561c-1.986-1.483-4.18-2.716-6.544-3.641l1.631-4.126
                           C210.889,120.406,213.415,121.827,215.718,123.537z"/>
                        <path class="node node-28" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M207.432,176.486l1.774,4.063
                           c-2.63,1.16-5.41,1.962-8.312,2.396l-0.658-4.389C202.747,178.189,205.162,177.482,207.432,176.486z"/>
                        <path fill="none" d="M211.29,151.91l-4.406-0.504c0.111-0.97,0.098-1.926-0.056-2.858l4.389-0.659
                           C211.422,149.195,211.446,150.536,211.29,151.91z"/>
                        <path fill="none" d="M206.884,151.406l4.406,0.504c-0.157,1.374-0.483,2.674-0.979,3.9l-4.126-1.632
                           C206.531,153.305,206.773,152.377,206.884,151.406z"/>
                        <path fill="none" d="M211.217,147.889l-4.389,0.659c-0.136-0.957-0.399-1.875-0.777-2.75l4.065-1.774
                           C210.646,145.244,211.029,146.544,211.217,147.889z"/>
                        <path fill="none" d="M206.186,154.18l4.126,1.631c-0.485,1.27-1.152,2.447-1.943,3.519l-3.574-2.646
                           C205.371,155.929,205.837,155.081,206.186,154.18z"/>
                        <path class="node node-29" fill="#4BC4D6" d="M205.673,172.409l1.759,4.077c-2.27,0.996-4.685,1.703-7.196,2.07l-0.659-4.389
                           C201.7,173.854,203.748,173.254,205.673,172.409z"/>
                        <path fill="none" d="M213.072,127.097l-2.631,3.562c-1.686-1.257-3.545-2.302-5.545-3.076l1.632-4.126
                           C208.893,124.381,211.086,125.614,213.072,127.097z"/>
                        <path fill="none" d="M211.52,137.824l-3.467,2.757c-0.836-1.051-1.807-1.994-2.888-2.8l2.63-3.548
                           C209.193,135.252,210.446,136.473,211.52,137.824z"/>
                        <path class="node node-30" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M205.581,162.217l2.757,3.469
                           c-1.351,1.073-2.845,1.967-4.439,2.658l-1.76-4.062C203.374,163.739,204.53,163.053,205.581,162.217z"/>
                        <path fill="none" d="M210.116,144.024l-4.065,1.774c-0.378-0.875-0.884-1.698-1.48-2.448l3.482-2.769
                           C208.888,141.632,209.588,142.79,210.116,144.024z"/>
                        <path fill="none" d="M204.794,156.682l3.574,2.646c-0.807,1.082-1.736,2.054-2.787,2.889l-2.769-3.482
                           C203.563,158.139,204.229,157.449,204.794,156.682z"/>
                        <path class="node node-31" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M202.857,196.107l0.646,4.387
                           c-4.305,0.642-8.751,0.732-13.277,0.217l0.503-4.404C194.865,196.777,198.928,196.696,202.857,196.107z"/>
                        <path fill="none" d="M214.658,102.821l-1.618,4.128c-3.696-1.459-7.636-2.456-11.758-2.926l0.503-4.405
                           C206.299,100.133,210.623,101.228,214.658,102.821z"/>
                        <path fill="none" d="M210.441,130.659l-2.646,3.574c-1.37-1.03-2.883-1.885-4.517-2.522l1.618-4.128
                           C206.896,128.357,208.756,129.402,210.441,130.659z"/>
                        <path class="node node-32" fill="#00A1AD" d="M203.898,168.344l1.774,4.065c-1.925,0.845-3.973,1.442-6.097,1.76l-0.657-4.401
                           C200.653,169.516,202.334,169.025,203.898,168.344z"/>
                        <path class="node node-33" fill="#00A1AD" d="M202.199,191.706l0.658,4.401c-3.93,0.589-7.992,0.67-12.129,0.197l0.504-4.404
                           C194.964,192.326,198.644,192.255,202.199,191.706z"/>
                        <path fill="none" d="M213.04,106.949l-1.633,4.14c-3.343-1.323-6.896-2.234-10.628-2.661l0.503-4.405
                           C205.404,104.494,209.344,105.49,213.04,106.949z"/>
                        <path fill="none" d="M206.884,151.406l-10.885-1.243l10.829-1.616C206.981,149.48,206.995,150.437,206.884,151.406z"/>
                        <path fill="none" d="M195.999,150.164l10.885,1.243c-0.11,0.971-0.353,1.897-0.698,2.772L195.999,150.164z"/>
                        <path fill="none" d="M208.053,140.581l-3.482,2.769c-0.584-0.749-1.271-1.415-2.052-1.995l2.646-3.574
                           C206.246,138.587,207.217,139.53,208.053,140.581z"/>
                        <path class="node node-34" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M202.812,158.734l2.769,3.481
                           c-1.051,0.836-2.207,1.522-3.442,2.064l-1.774-4.065C201.241,159.824,202.062,159.332,202.812,158.734z"/>
                        <path class="node node-35" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M201.539,187.332l0.66,4.374
                           c-3.556,0.549-7.235,0.62-10.967,0.194l0.503-4.405C195.076,187.876,198.36,187.801,201.539,187.332z"/>
                        <path fill="none" d="M211.407,111.089l-1.63,4.113c-2.978-1.172-6.16-1.986-9.502-2.368l0.504-4.406
                           C204.511,108.854,208.064,109.766,211.407,111.089z"/>
                        <path fill="none" d="M206.828,148.548l-10.829,1.616l10.052-4.366C206.429,146.673,206.692,147.591,206.828,148.548z"/>
                        <path fill="none" d="M195.999,150.164l10.187,4.016c-0.349,0.901-0.814,1.749-1.392,2.502L195.999,150.164z"/>
                        <path class="node node-36" fill="#00A1AD" d="M202.139,164.281l1.76,4.062c-1.564,0.683-3.245,1.173-4.979,1.425l-0.646-4.388
                           C199.618,165.193,200.918,164.811,202.139,164.281z"/>
                        <path fill="none" d="M207.795,134.232l-2.63,3.548c-1.07-0.791-2.249-1.458-3.518-1.944l1.631-4.126
                           C204.912,132.348,206.425,133.203,207.795,134.232z"/>
                        <g>
                           <path class="node node-37" fill="#4BC4D6" d="M209.206,180.551l0.886,2.039l0.886,2.039c-1.487,0.648-3.024,1.204-4.601,1.657
                              c-1.577,0.452-3.193,0.804-4.838,1.046l-0.323-2.193l-0.323-2.192c1.451-0.218,2.872-0.525,4.258-0.925
                              C206.539,181.621,207.891,181.131,209.206,180.551z"/>
                           <path class="node node-38" fill="#4BC4D6" d="M200.909,182.721c1.417-0.193,2.802-0.518,4.158-0.912l0.523,1.568l0.524,1.566
                              c-0.233,0.103-0.307,1.297-0.545,1.389c-1.315,0.32-2.658,0.552-4.015,0.738c-0.802,0.109-1.608,0.213-2.423,0.281
                              c-0.82,0.067-1.646,0.108-2.478,0.123l-0.098-1.647l-0.099-1.647c0.243-0.035,0.61-1.18,0.85-1.226
                              c0.001,0,0.01,0.001,0.012,0.001C198.53,182.946,199.73,182.882,200.909,182.721z"/>
                           <path class="node node-39" fill="#4BC4D6" d="M200.894,182.945l0.323,2.192l0.323,2.193c-1.589,0.233-3.205,0.37-4.841,0.399
                              c-0.818,0.016-1.641,0.004-2.469-0.035c-0.827-0.039-1.659-0.106-2.494-0.201l0.251-2.202l0.251-2.203l0.014,0.001
                              c1.475,0.169,2.938,0.236,4.38,0.21C198.075,183.275,199.498,183.154,200.894,182.945z"/>
                        </g>
                        <path fill="none" d="M209.777,115.202l-1.618,4.128c-2.638-1.038-5.437-1.753-8.387-2.09l0.503-4.405
                           C203.617,113.215,206.8,114.029,209.777,115.202z"/>
                        <path fill="none" d="M206.051,145.798l-10.052,4.366l8.571-6.814C205.167,144.1,205.673,144.922,206.051,145.798z"/>
                        <path fill="none" d="M195.999,150.164l8.795,6.518c-0.565,0.769-1.23,1.457-1.981,2.053L195.999,150.164z"/>
                        <path class="node node-40" fill="#4BC4D6" d="M200.235,178.559l0.658,4.388c-2.791,0.418-5.691,0.481-8.642,0.146l-0.014-0.001l0.503-4.405
                           C195.301,178.977,197.818,178.923,200.235,178.559z"/>
                        <path fill="none" d="M208.159,119.33l-1.631,4.126c-2.272-0.901-4.713-1.521-7.259-1.812l0.503-4.405
                           C202.723,117.576,205.521,118.292,208.159,119.33z"/>
                        <path fill="none" d="M202.519,141.354c0.78,0.581,1.468,1.246,2.052,1.995L196,150.163L202.519,141.354z"/>
                        <path fill="none" d="M195.999,150.164l6.813,8.57c-0.75,0.599-1.571,1.091-2.448,1.481L195.999,150.164z"/>
                        <path fill="none" d="M205.165,137.781l-2.646,3.574c-0.755-0.563-1.603-1.029-2.503-1.391l1.632-4.126
                           C202.916,136.323,204.095,136.99,205.165,137.781z"/>
                        <path class="node node-41" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M200.364,160.216l1.774,4.065
                           c-1.221,0.529-2.521,0.912-3.865,1.1l-0.661-4.374C198.571,160.857,199.502,160.595,200.364,160.216z"/>
                        <path class="node node-42" fill="#4BC4D6" d="M199.576,174.169l0.659,4.39c-2.417,0.364-4.935,0.418-7.494,0.125l0.505-4.418l0.014,0.002
                           C195.415,174.513,197.535,174.469,199.576,174.169z"/>
                        <path fill="none" d="M206.528,123.456l-1.632,4.126c-1.933-0.767-3.988-1.288-6.144-1.534l0.517-4.404
                           C201.815,121.936,204.256,122.555,206.528,123.456z"/>
                        <path fill="none" d="M204.896,127.583l-1.618,4.128c-1.579-0.631-3.264-1.055-5.028-1.257l0.503-4.405
                           C200.908,126.294,202.964,126.816,204.896,127.583z"/>
                        <path class="node node-43" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M198.919,169.768l0.657,4.401
                           c-2.041,0.3-4.161,0.344-6.316,0.099l-0.014-0.002l0.503-4.406C195.514,170.062,197.237,170.025,198.919,169.768z"/>
                        <path fill="none" d="M195.999,150.164l4.365,10.052c-0.862,0.379-1.793,0.642-2.752,0.791L195.999,150.164z"/>
                        <path fill="none" d="M202.519,141.354l-6.52,8.809l4.017-10.2C200.916,140.326,201.764,140.791,202.519,141.354z"/>
                        <path fill="none" d="M203.278,131.71l-1.631,4.126c-1.227-0.495-2.526-0.821-3.9-0.978l0.503-4.406
                           C200.015,130.655,201.699,131.08,203.278,131.71z"/>
                        <path class="node node-44" fill="#00A1AD" d="M198.273,165.381l0.646,4.387c-1.682,0.26-3.405,0.295-5.17,0.092l0.503-4.403
                           C195.627,165.611,196.967,165.587,198.273,165.381z"/>
                        <path fill="none" d="M201.647,135.837l-1.632,4.126c-0.874-0.346-1.804-0.575-2.773-0.686l0.505-4.418
                           C199.121,135.016,200.421,135.342,201.647,135.837z"/>
                        <path fill="none" d="M197.612,161.007l0.661,4.374c-1.307,0.206-2.646,0.23-4.021,0.074l0.504-4.406
                           C195.726,161.16,196.683,161.146,197.612,161.007z"/>
                        <path fill="none" d="M195.999,150.164l1.613,10.843c-0.93,0.14-1.887,0.153-2.856,0.042L195.999,150.164z"/>
                        <path fill="none" d="M200.016,139.963l-4.017,10.2l1.243-10.886C198.212,139.389,199.142,139.618,200.016,139.963z"/>
                        <path class="node node-45" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M200.779,108.428l-0.504,4.406l-0.013-0.002
                           c-3.342-0.381-6.626-0.306-9.805,0.164l-0.66-4.375c3.557-0.549,7.235-0.621,10.968-0.194L200.779,108.428z"/>
                        <path class="node node-46" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M199.27,121.645l-0.517,4.404
                           c-2.155-0.246-4.276-0.202-6.33,0.096l-0.66-4.375c2.43-0.364,4.934-0.419,7.493-0.127L199.27,121.645z"/>
                        <path fill="none" d="M198.753,126.048l-0.503,4.405c-1.765-0.201-3.502-0.168-5.184,0.091l-0.644-4.4
                           C194.477,125.847,196.598,125.802,198.753,126.048z"/>
                        <path fill="none" d="M198.25,130.454l-0.503,4.406c-1.375-0.157-2.715-0.133-4.021,0.073l-0.659-4.388
                           C194.748,130.286,196.485,130.252,198.25,130.454z"/>
                        <path fill="none" d="M197.747,134.859l-0.505,4.418c-0.971-0.11-1.927-0.097-2.857,0.042l-0.659-4.388
                           C195.032,134.727,196.372,134.702,197.747,134.859z"/>
                        <path fill="none" d="M197.242,139.278l-1.243,10.886l-1.614-10.843C195.315,139.181,196.271,139.167,197.242,139.278z"/>
                        <path class="node node-47" fill="#00A1AD" d="M190.729,196.307l-0.503,4.404c-4.526-0.518-8.837-1.609-12.886-3.205l1.617-4.128
                           C182.653,194.837,186.593,195.833,190.729,196.307z"/>
                        <path fill="none" d="M191.232,191.9l-0.504,4.404c-4.136-0.473-8.075-1.469-11.771-2.928l1.634-4.14
                           C183.932,190.575,187.5,191.475,191.232,191.9z"/>
                        <path class="node node-48" fill="#01838C" d="M191.735,187.495l-0.503,4.405c-3.732-0.428-7.301-1.325-10.642-2.662l1.629-4.113
                           C185.212,186.3,188.394,187.113,191.735,187.495z"/>
                        <path class="node node-49" fill="#00A1AD" d="M192.238,183.09l-0.503,4.405c-3.342-0.382-6.523-1.195-9.516-2.37l1.618-4.128
                           C186.477,182.035,189.288,182.753,192.238,183.09z"/>
                        <path class="node node-50" fill="#B2E3E6" d="M192.741,178.684l-0.503,4.406c-2.95-0.337-5.762-1.055-8.4-2.093l1.632-4.126
                           C187.755,177.773,190.182,178.393,192.741,178.684z"/>
                        <path class="node node-51" fill="#00A1AD" d="M193.246,174.266l-0.505,4.418c-2.56-0.291-4.986-0.91-7.271-1.812l1.633-4.142
                           C189.034,173.498,191.091,174.02,193.246,174.266z"/>
                        <path class="node node-52" fill="#00A1AD" d="M193.749,169.859l-0.503,4.406c-2.155-0.248-4.212-0.769-6.144-1.535l1.631-4.127
                           C190.313,169.234,191.984,169.658,193.749,169.859z"/>
                        <path class="node node-53" fill="#00A1AD" d="M194.252,165.455l-0.503,4.404c-1.765-0.201-3.436-0.625-5.016-1.256l1.618-4.127
                           C191.578,164.973,192.878,165.297,194.252,165.455z"/>
                        <path fill="none" d="M194.756,161.049l-0.504,4.406c-1.374-0.158-2.674-0.482-3.9-0.979l1.63-4.113
                           C192.856,160.709,193.785,160.938,194.756,161.049z"/>
                        <path fill="none" d="M195.999,150.164l-1.243,10.885c-0.971-0.111-1.899-0.34-2.774-0.686L195.999,150.164z"/>
                        <path fill="none" d="M194.385,139.32l1.614,10.843l-4.366-10.052C192.509,139.734,193.426,139.47,194.385,139.32z"/>
                        <path fill="none" d="M191.633,140.111l4.366,10.052l-6.814-8.571C189.922,140.994,190.758,140.489,191.633,140.111z"/>
                        <path fill="none" d="M195.999,150.164l-4.018,10.2c-0.9-0.361-1.734-0.826-2.503-1.392L195.999,150.164z"/>
                        <path fill="none" d="M195.999,150.164l-6.521,8.809c-0.768-0.564-1.454-1.244-2.053-1.98l0.002-0.014L195.999,150.164z"/>
                        <path fill="none" d="M195.999,150.164l-8.571,6.814c-0.597-0.752-1.09-1.571-1.468-2.446L195.999,150.164z"/>
                        <path fill="none" d="M195.999,150.164l-10.039,4.368c-0.379-0.863-0.654-1.795-0.791-2.752L195.999,150.164z"/>
                        <path fill="none" d="M195.999,150.164l-10.83,1.616c-0.14-0.931-0.153-1.888-0.042-2.857L195.999,150.164z"/>
                        <path fill="none" d="M195.999,150.164l-10.872-1.242c0.11-0.97,0.34-1.899,0.672-2.776L195.999,150.164z"/>
                        <path fill="none" d="M195.999,150.164l-10.2-4.018c0.362-0.9,0.827-1.748,1.391-2.502L195.999,150.164z"/>
                        <path fill="none" d="M195.999,150.164l-8.81-6.52c0.565-0.768,1.246-1.468,1.995-2.051L195.999,150.164z"/>
                        <path class="node node-54" fill="#00A1AD" d="M191.981,160.363l-1.63,4.113c-1.269-0.486-2.448-1.152-3.518-1.943l2.645-3.561
                           C190.247,159.537,191.081,160.002,191.981,160.363z"/>
                        <path class="node node-55" fill="#B2E3E6" d="M190.352,164.477l-1.618,4.129c-1.633-0.638-3.147-1.479-4.531-2.511l2.632-3.562
                           C187.903,163.324,189.083,163.99,190.352,164.477z"/>
                        <path fill="none" d="M193.066,130.544l0.659,4.388c-1.345,0.188-2.645,0.571-3.865,1.101l-1.761-4.063
                           C189.667,131.275,191.332,130.796,193.066,130.544z"/>
                        <path fill="none" d="M188.733,168.604l-1.631,4.127c-2-0.773-3.859-1.818-5.545-3.076l2.645-3.561
                           C185.586,167.126,187.101,167.968,188.733,168.604z"/>
                        <path fill="none" d="M192.423,126.145l0.644,4.4c-1.734,0.252-3.399,0.73-4.967,1.425l-1.773-4.064
                           C188.251,127.06,190.299,126.461,192.423,126.145z"/>
                        <path class="node node-56" fill="#B2E3E6" d="M189.479,158.973l-2.645,3.562c-1.082-0.808-2.054-1.736-2.889-2.787l3.48-2.755
                           C188.024,157.729,188.711,158.407,189.479,158.973z"/>
                        <path class="node node-57" fill="#01838C" d="M187.103,172.73l-1.633,4.141c-2.365-0.926-4.558-2.158-6.545-3.641l2.633-3.576
                           C183.243,170.912,185.103,171.957,187.103,172.73z"/>
                        <path class="node node-58" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M191.763,121.77l0.66,4.375
                           c-2.124,0.317-4.172,0.916-6.097,1.76l-1.761-4.063C186.836,122.845,189.25,122.138,191.763,121.77z"/>
                        <path class="node node-59" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M191.104,117.382l0.659,4.388
                           c-2.513,0.368-4.927,1.075-7.197,2.071l-1.773-4.065C185.422,118.616,188.202,117.814,191.104,117.382z"/>
                        <path class="node node-60" fill="#00A1AD" d="M185.47,176.871l-1.632,4.126c-2.729-1.076-5.257-2.483-7.558-4.207l2.645-3.56
                           C180.912,174.713,183.104,175.945,185.47,176.871z"/>
                        <path fill="none" d="M186.834,162.533l-2.632,3.562c-1.398-1.02-2.652-2.228-3.725-3.592l3.468-2.757
                           C184.78,160.797,185.752,161.727,186.834,162.533z"/>
                        <path class="node node-61" fill="#00A1AD" d="M187.428,156.979l-0.002,0.014l-3.48,2.755c-0.836-1.051-1.536-2.209-2.077-3.444l4.092-1.771
                           C186.338,155.406,186.831,156.227,187.428,156.979z"/>
                        <path class="node node-62" fill="#B2E3E6" d="M186.416,138.11l2.769,3.482c-0.749,0.583-1.43,1.284-1.995,2.051l-3.56-2.645
                           C184.422,139.916,185.365,138.945,186.416,138.11z"/>
                        <path class="node node-63" fill="#01838C" d="M183.838,180.997l-1.618,4.128c-3.096-1.213-5.982-2.826-8.586-4.761l2.646-3.574
                           C178.581,178.514,181.108,179.921,183.838,180.997z"/>
                        <path class="node node-64" fill="#CF3E57" d="M185.96,154.531l-4.092,1.771c-0.529-1.221-0.913-2.521-1.101-3.864l4.401-0.657
                           C185.306,152.736,185.581,153.668,185.96,154.531z"/>
                        <path class="node node-65" fill="#01838C" d="M182.22,185.125l-1.629,4.113c-3.463-1.352-6.669-3.15-9.59-5.299l2.633-3.575
                           C176.237,182.299,179.124,183.912,182.22,185.125z"/>
                        <path class="node node-66" fill="#B2E3E6" d="M184.202,166.095l-2.645,3.561c-1.712-1.261-3.236-2.73-4.548-4.396l3.468-2.757
                           C181.55,163.867,182.804,165.075,184.202,166.095z"/>
                        <path class="node node-67" fill="#B2E3E6" d="M186.326,127.905l1.773,4.064c-1.594,0.691-3.088,1.585-4.44,2.673l-0.013-0.002l-2.756-3.481
                           C182.542,129.847,184.374,128.746,186.326,127.905z"/>
                        <path class="node node-68" fill="#01838C" d="M185.169,151.779l-4.401,0.656c-0.206-1.307-0.23-2.646-0.073-4.021l4.433,0.506
                           C185.016,149.892,185.029,150.85,185.169,151.779z"/>
                        <path class="node node-69" fill="#00A1AD" d="M180.591,189.238l-1.634,4.14c-3.827-1.502-7.38-3.49-10.6-5.892l2.644-3.547
                           C173.922,186.088,177.128,187.888,180.591,189.238z"/>
                        <path class="node node-70" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M189.141,104.219l0.657,4.402
                           c-3.678,0.535-7.208,1.565-10.538,3l-1.775-4.052C181.163,105.956,185.073,104.819,189.141,104.219z"/>
                        <path class="node node-71" fill="#01838C" d="M183.945,159.746l-3.468,2.757c-1.075-1.338-1.981-2.847-2.673-4.44l4.063-1.761
                           C182.409,157.537,183.109,158.695,183.945,159.746z"/>
                        <path class="node node-72" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M178.957,193.378l-1.617,4.128
                           c-4.181-1.638-8.079-3.829-11.615-6.443l2.633-3.575C171.577,189.888,175.13,191.876,178.957,193.378z"/>
                        <path class="node node-73" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M188.495,99.833l0.646,4.386
                           c-4.067,0.6-7.978,1.737-11.656,3.35l-1.759-4.077C179.761,101.742,184.053,100.486,188.495,99.833z"/>
                        <path class="node node-74" fill="#4BC4D6" d="M181.558,169.654l-2.633,3.576c-2.027-1.488-3.846-3.252-5.397-5.203l3.482-2.769
                           C178.321,166.924,179.846,168.395,181.558,169.654z"/>
                        <path class="node node-75" fill="#00A1AD" d="M180.055,138.366l3.575,2.633c-0.791,1.069-1.458,2.249-1.958,3.516l-4.126-1.631
                           C178.183,141.25,179.024,139.736,180.055,138.366z"/>
                        <path class="node node-76" fill="#CF3E57" d="M181.868,156.302l-4.063,1.761c-0.694-1.566-1.173-3.231-1.425-4.967l4.388-0.658
                           C180.955,153.781,181.339,155.081,181.868,156.302z"/>
                        <path class="node node-77" fill="#4BC4D6" d="M180.478,162.503l-3.468,2.757c-1.313-1.639-2.429-3.471-3.27-5.424l4.064-1.773
                           C178.496,159.656,179.402,161.165,180.478,162.503z"/>
                        <path class="node node-78" fill="#01838C" d="M180.891,131.16l2.756,3.481c-1.352,1.074-2.56,2.328-3.592,3.725l-3.561-2.646
                           C177.754,134.009,179.239,132.473,180.891,131.16z"/>
                        <path class="node node-79" fill="#00A1AD" d="M178.925,173.23l-2.645,3.56c-2.342-1.728-4.431-3.754-6.221-6.005l3.468-2.758
                           C175.079,169.979,176.897,171.742,178.925,173.23z"/>
                        <path class="node node-80" fill="#01838C" d="M180.768,152.438l-4.388,0.658c-0.259-1.682-0.293-3.418-0.091-5.183l4.405,0.503
                           C180.537,149.79,180.562,151.13,180.768,152.438z"/>
                        <path class="node node-81" fill="#00A1AD" d="M176.28,176.79l-2.646,3.574c-2.642-1.968-5.014-4.259-7.041-6.823l3.467-2.756
                           C171.85,173.036,173.938,175.062,176.28,176.79z"/>
                        <path class="node node-82" fill="#01838C" d="M177.01,165.26l-3.482,2.768c-1.551-1.95-2.848-4.104-3.853-6.416l4.065-1.774
                           C174.581,161.789,175.696,163.621,177.01,165.26z"/>
                        <path class="node node-83" fill="#CF3E57" d="M173.634,180.364l-2.633,3.575c-2.957-2.194-5.611-4.764-7.891-7.631l3.482-2.769
                           C168.62,176.105,170.992,178.396,173.634,180.364z"/>
                        <path class="node node-84" fill="#00A1AD" d="M173.418,141.266l4.128,1.618c-0.631,1.58-1.056,3.264-1.257,5.029l-4.405-0.503
                           C172.13,145.254,172.652,143.185,173.418,141.266z"/>
                        <path class="node node-85" fill="#CF3E57" d="M176.38,153.096l-4.387,0.646c-0.312-2.056-0.355-4.175-0.109-6.331l4.405,0.503
                           C176.087,149.677,176.121,151.414,176.38,153.096z"/>
                        <path class="node node-86" fill="#CF3E57" d="M173.527,168.027l-3.468,2.758c-1.803-2.254-3.305-4.76-4.448-7.414l4.063-1.762
                           C170.68,163.922,171.977,166.076,173.527,168.027z"/>
                        <path class="node node-87" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M175.378,124.225l2.756,3.467
                           c-1.951,1.551-3.715,3.37-5.201,5.397l-3.561-2.645C171.085,128.116,173.112,126.013,175.378,124.225z"/>
                        <path class="node node-88" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M177.484,107.569l1.775,4.052
                           c-3.375,1.47-6.54,3.375-9.407,5.654l-2.757-3.467C170.263,111.29,173.751,109.19,177.484,107.569z"/>
                        <path class="node node-89" fill="#4BC4D6" d="M171.001,183.939l-2.644,3.547c-3.272-2.422-6.197-5.254-8.715-8.42l3.468-2.758
                           C165.39,179.177,168.044,181.745,171.001,183.939z"/>
                        <path class="node node-90" fill="#00A1AD" d="M172.933,133.09l3.562,2.631c-1.257,1.686-2.302,3.545-3.076,5.544l-4.127-1.631
                           C170.217,137.27,171.449,135.077,172.933,133.09z"/>
                        <path class="node node-91" fill="#00A1AD" d="M168.357,187.486l-2.633,3.574c-3.586-2.66-6.793-5.771-9.55-9.237l3.468-2.757
                           C162.16,182.232,165.085,185.064,168.357,187.486z"/>
                        <path class="node node-92" fill="#4BC4D6" d="M175.726,103.493l1.759,4.077c-3.733,1.621-7.222,3.72-10.389,6.238l-2.757-3.468
                           C167.807,107.583,171.632,105.277,175.726,103.493z"/>
                        <path class="node node-93" fill="#4BC4D6" d="M170.06,170.785l-3.467,2.756c-2.042-2.553-3.739-5.381-5.06-8.398l4.078-1.771
                           C166.755,166.025,168.257,168.531,170.06,170.785z"/>
                        <path class="node node-94" fill="#CF3E57" d="M169.291,139.634l4.127,1.631c-0.766,1.919-1.288,3.988-1.534,6.144l-4.405-0.503
                           C167.769,144.36,168.389,141.919,169.291,139.634z"/>
                        <path class="node node-95" fill="#00A1AD" d="M171.993,153.74l-4.388,0.66c-0.364-2.432-0.418-4.948-0.127-7.494l4.405,0.503
                           C171.638,149.565,171.682,151.686,171.993,153.74z"/>
                        <path class="node node-96" fill="#CF3E57" d="M169.675,161.609l-4.063,1.762c-1.16-2.631-1.975-5.412-2.395-8.312l4.389-0.658
                           C167.974,156.912,168.679,159.34,169.675,161.609z"/>
                        <path class="node node-97" fill="#CF3E57" d="M166.593,173.541l-3.482,2.77c-2.267-2.865-4.172-6.018-5.643-9.394l4.065-1.774
                           C162.854,168.16,164.551,170.988,166.593,173.541z"/>
                        <path class="node node-98" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M165.165,138.003l4.126,1.631
                           c-0.902,2.285-1.522,4.726-1.812,7.272l-4.405-0.503C163.41,143.453,164.127,140.641,165.165,138.003z"/>
                        <path class="node node-99" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M167.605,154.4l-4.389,0.658
                           c-0.416-2.806-0.481-5.706-0.144-8.657l4.405,0.503C167.188,149.453,167.241,151.97,167.605,154.4z"/>
                        <path class="node node-100" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M165.798,127.798l3.574,2.646
                           c-1.724,2.301-3.145,4.827-4.207,7.558l-4.128-1.618C162.25,133.289,163.863,130.402,165.798,127.798z"/>
                        <path class="node node-101" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M165.611,163.371l-4.078,1.771
                           c-1.299-2.974-2.219-6.148-2.703-9.438l4.387-0.646C163.637,157.959,164.451,160.74,165.611,163.371z"/>
                        <path class="node node-102" fill="#00A1AD" d="M163.11,176.311l-3.468,2.756c-2.518-3.166-4.617-6.654-6.238-10.389l4.063-1.761
                           C158.938,170.293,160.844,173.443,163.11,176.311z"/>
                        <path class="node node-103" fill="#4BC4D6" d="M167.096,113.808l2.757,3.467c-2.854,2.281-5.421,4.922-7.628,7.877l-3.549-2.63
                           C161.097,119.25,163.929,116.325,167.096,113.808z"/>
                        <path class="node node-104" fill="#01838C" d="M161.037,136.385l4.128,1.618c-1.038,2.638-1.755,5.45-2.092,8.4l-4.406-0.503
                           C159.049,142.559,159.864,139.363,161.037,136.385z"/>
                        <path class="node node-105" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M163.217,155.059l-4.387,0.646
                           c-0.469-3.18-0.544-6.463-0.163-9.804l4.406,0.503C162.735,149.354,162.801,152.254,163.217,155.059z"/>
                        <path class="node node-106" fill="#00A1AD" d="M162.225,125.152l3.573,2.646c-1.935,2.604-3.548,5.491-4.761,8.587l-4.113-1.63
                           C158.274,131.293,160.075,128.073,162.225,125.152z"/>
                        <path class="node node-107" fill="#CF3E57" d="M161.533,165.143l-4.065,1.774c-1.448-3.331-2.477-6.874-3.012-10.552l4.374-0.661
                           C159.314,158.994,160.234,162.17,161.533,165.143z"/>
                        <path fill="none" d="M159.643,179.066l-3.468,2.757c-2.757-3.468-5.062-7.293-6.849-11.373l4.078-1.772
                           C155.025,172.411,157.125,175.898,159.643,179.066z"/>
                        <path class="node node-108" fill="#CF3E57" d="M164.339,110.34l2.757,3.468c-3.167,2.518-5.999,5.442-8.42,8.714l-3.575-2.633
                           C157.762,116.304,160.872,113.097,164.339,110.34z"/>
                        <path class="node node-109" fill="#CF3E57" d="M158.83,155.704l-4.374,0.661c-0.549-3.557-0.62-7.237-0.194-10.968l4.405,0.503
                           C158.286,149.241,158.361,152.525,158.83,155.704z"/>
                        <path class="node node-110" fill="#4BC4D6" d="M156.924,134.755l4.113,1.63c-1.173,2.979-1.988,6.173-2.37,9.515l-4.405-0.503
                           C154.688,141.665,155.587,138.096,156.924,134.755z"/>
                        <path class="node node-111" fill="#4BC4D6" d="M157.468,166.917l-4.063,1.761c-1.613-3.678-2.75-7.588-3.35-11.656l4.401-0.655
                           C154.991,160.043,156.02,163.586,157.468,166.917z"/>
                        <path class="node node-112" fill="#4BC4D6" d="M158.676,122.522l3.549,2.63c-2.149,2.921-3.95,6.141-5.301,9.604l-4.14-1.633
                           C154.286,129.295,156.274,125.742,158.676,122.522z"/>
                        <path class="node node-113" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M155.101,119.889l3.575,2.633
                           c-2.401,3.22-4.39,6.773-5.892,10.601l-4.128-1.618C150.294,127.324,152.486,123.426,155.101,119.889z"/>
                        <path class="node node-114" fill="#00A1AD" d="M153.404,168.678l-4.078,1.772c-1.75-4.035-2.993-8.326-3.658-12.782l4.387-0.646
                           C150.654,161.09,151.791,165,153.404,168.678z"/>
                        <path class="node node-115" fill="#4BC4D6" d="M152.784,133.123l4.14,1.633c-1.337,3.341-2.235,6.91-2.662,10.642l-4.405-0.503
                           C150.329,140.758,151.325,136.818,152.784,133.123z"/>
                        <path class="node node-116" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M154.456,156.365l-4.401,0.656
                           c-0.589-3.931-0.671-7.992-0.198-12.128l4.405,0.503C153.836,149.128,153.907,152.809,154.456,156.365z"/>
                        <path class="node node-117" opacity="0.5" fill="#4BC4D6" enable-background="new    " d="M148.656,131.504l4.128,1.618
                           c-1.459,3.695-2.455,7.635-2.928,11.771l-4.405-0.503C145.968,139.864,147.062,135.553,148.656,131.504z"/>
                        <path class="node node-118" fill="#4BC4D6" d="M150.055,157.021l-4.387,0.646c-0.641-4.305-0.733-8.751-0.217-13.277l4.405,0.503
                           C149.384,149.03,149.466,153.092,150.055,157.021z"/>
                     </g>
                  </g>
                  </svg>
           </div>
</div>
            
          
!
            
              /* Page Loading
================================================== */

$white: #ffffff;
$hue-1: #b2e3e6;
$hue-2: #4bc4d6;
$hue-3: #00a1ad;
$hue-4: #01838c;
$hue-5: #cf3e57;

.page-loading {
   opacity: 1;
   position: fixed;
   top: 0;
   bottom: 0;
   width: 100%;
   transform: translateY(0);
   transition: all 0.6s ease;
   .svg-wrap {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      transition: all 1s ease;
   }
   svg {
      width: 165px;
      height: 165px;
      animation: rotate 3s linear infinite;
      .node {
         position: relative;
         animation: backgroundColor 1.5s linear infinite;
         @for $i from 1 through 118 {
            &.node-#{$i} {
               animation-delay: $i / 10 * .5s;
            }
         }
      }
   }
}

@keyframes backgroundColor {
   0% {
      fill: transparent;
   }
   5% {
      fill: $hue-1;
   }
   50% {
      fill: $hue-2;
   }
   70% {
      fill: $hue-3;
   }
   80% {
      fill: $hue-4;
   }
   100% {
      fill: $hue-5;
   }
}

@keyframes pulsate {
   from {
      transform: translate(0,0);
   }
   to {
      transform: translate(10px, 10px);
   }
}

@keyframes rotate {
   from {
      transform: rotate(0deg);
      transform-origin: center;
   }
   to {
      transform: rotate(360deg);
      transform-origin: center;
   }
}
            
          
!
999px
Close

Asset uploading is a PRO feature.

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

Go PRO

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

Console