"Mobile Animation"
Bootstrap 3.0.0 Snippet by naimansari

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html><html class=''> <head><script src='//production-assets.codepen.io/assets/editor/live/console_runner-079c09a0e3b9ff743e39ee2d5637b9216b3545af0de366d4b9aad9dc87e26bfd.js'></script><script src='//production-assets.codepen.io/assets/editor/live/events_runner-73716630c22bbc8cff4bd0f07b135f00a0bdc5d14629260c3ec49e5606f98fdd.js'></script><script src='//production-assets.codepen.io/assets/editor/live/css_live_reload_init-2c0dc5167d60a5af3ee189d570b1835129687ea2a61bee3513dee3a50c115a77.js'></script><meta charset='UTF-8'><meta name="robots" content="noindex"><link rel="shortcut icon" type="image/x-icon" href="//production-assets.codepen.io/assets/favicon/favicon-8ea04875e70c4b0bb41da869e81236e54394d63638a1ef12fa558a4a835f1164.ico" /><link rel="mask-icon" type="" href="//production-assets.codepen.io/assets/favicon/logo-pin-f2d2b6d2c61838f7e76325261b7195c27224080bc099486ddd6dccb469b8e8e6.svg" color="#111" /><link rel="canonical" href="https://codepen.io/smalinux/pen/bZaxJq?depth=everything&order=popularity&page=90&q=mobile&show_forks=false" /> <style class="cp-pen-styles">@import 'https://fonts.googleapis.com/css?family=Nova+Mono'; * { background-color: #41A4F4; margin: 0; padding: 0 } body { overflow: hidden } svg { visibility: hidden } .btnContainer { position: fixed; right: 5%; visibility: hidden; } .btnContainer p { border: 2px solid #FFF; color: #FFF; padding: 10px; margin: 10px; text-align: center; cursor: pointer; font-family: 'Nova Mono', monospace; } .FollowMe { position: fixed; bottom: 5%; right: 5%; background-image: url("https://smalinux.github.io/myImg.jpg"); height: 60px; width: 60px; border-radius: 50%; background-repeat:no-repeat; background-size:contain; background-position:center; cursor: pointer; } @media (min-width: 100px) and (max-width: 650px) { .btnContainer { display: none; } }</style></head><body> <div class="btnContainer"> <p id="restart">restart</p> <p id="reverse">reverse</p> <p id="pause">pause</p> <p id="resume">resume</p> </div> <a href="https://codepen.io/smalinux/" target="_blank" title="Just say Hello!"><div class="FollowMe"></div></a> <div class="container"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/" x="0px" y="0px" viewBox="0 0 800 800" enable-background="new 0 0 800 800" xml:space="preserve"> <rect id="Background_2_" y="0" fill="#41A4F4" width="800" height="800"/> <g id="Element_2_"> <g id="lineMekat3" opacity="0.5"> <circle fill="none" stroke="#FFFFFF" stroke-width="3" stroke-miterlimit="10" stroke-dasharray="12.0006,12.0006" cx="400" cy="400" r="309.4"/> </g> <g id="handAndMobile"> <path fill="#EFB378" d="M345.6,621.7l48.8-72.9c10.1-12.4,8.3-30.6-4.1-40.7l-36.4-29.7c-12.4-10.1-30.6-8.3-40.7,4.1L234.4,580 L345.6,621.7z"/> <path fill="#EFB378" d="M355.4,448.8c-23.1,2.3-39.9,22.9-37.5,46l6.9,67.8c2.3,23.1,22.9,39.9,46,37.5l91.1-9 c23.1-2.3,39.9-22.9,37.5-46l-6.9-67.8c-2.3-23.1-22.9-39.9-46-37.5L355.4,448.8z"/> <g id="Mobile"> <path fill="#383639" d="M502.3,565.2c0,6.4-5.2,11.6-11.6,11.6h-117c-6.4,0-11.6-5.2-11.6-11.6V325.6c0-6.4,5.2-11.6,11.6-11.6 h117c6.4,0,11.6,5.2,11.6,11.6V565.2z"/> <path fill="#0A0A0A" d="M490.8,314.1h-58.5v262.7h58.5c6.4,0,11.6-5.2,11.6-11.6V325.6C502.3,319.2,497.1,314.1,490.8,314.1z"/> <rect x="370.8" y="342.3" fill="#F1F2F2" width="122.8" height="193.8"/> <g> <rect x="370.8" y="342.3" fill="#2B5971" width="122.8" height="193.8"/> <g class="imgInMobile"> <circle fill="#FFFFFF" cx="432.2" cy="439.2" r="35.5"/> <g> <defs> <circle id="SVGID" cx="432.2" cy="439.2" r="35.5"/> </defs> <clipPath id="SVGID_2_"> <use xlink:href="#SVGID" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_2_)"> <path fill="#F1C9A5" d="M449.3,461.1c-2.3-4.3-17-7.1-17-7.1s-14.7,2.7-17,7.1c-1.7,6-3.1,13.7-3.1,13.7h20.1h20.1 C452.4,474.8,451.4,466.6,449.3,461.1z"/> <path fill="#E4B692" d="M432.2,454.1c0,0,14.7,2.7,17,7.1c2.2,5.5,3.1,13.7,3.1,13.7h-20.1V454.1z"/> <rect x="428.2" y="445.2" fill="#F1C9A5" width="8" height="13.4"/> <path opacity="0.1" fill="#DDAC8C" d="M428.2,451.5c0.7,2.1,3.6,3.3,5.8,3.3c0.8,0,1.5-0.1,2.3-0.4v-9.1h-8V451.5z"/> <path fill="#F1C9A5" d="M442.5,436.8c0-8.4-4.6-13.1-10.3-13.1c-5.7,0-10.3,4.8-10.3,13.1c0,11.3,4.6,15.2,10.3,15.2 C437.9,452,442.5,447.6,442.5,436.8z"/> <path fill="#F1C9A5" d="M441,442.6c-1.9-0.2-3.1-2.2-2.8-4.5c0.3-2.3,2.1-4,4-3.8c1.9,0.2,3.1,2.2,2.8,4.5 C444.6,441.1,442.8,442.8,441,442.6z"/> <path fill="#F1C9A5" d="M419.6,438.8c-0.3-2.3,0.9-4.3,2.8-4.5c1.9-0.2,3.6,1.5,4,3.8c0.3,2.3-0.9,4.3-2.8,4.5 C421.7,442.8,419.9,441.1,419.6,438.8z"/> <path fill="#163645" d="M422.3,439.6c0,0,1.4-2.7,2-8c4.3,4.1,9.3,4.7,16,0c0.2,3.8,1.3,6.2,2.6,8c0.8-6.6,2.6-9.8,2-13.3 c-4.4,0.7-6-2.9-12.7-2.9c-6.7,0-8.1,3.5-12.3,3.2C420,430.6,421.9,432.8,422.3,439.6z"/> <path fill="#FA582A" d="M449.3,461.1c-1.5-2.8-8-4.9-12.6-6.1c-0.2,2.3-2.1,4.1-4.4,4.1c-2.3,0-4.3-1.8-4.4-4.1 c-4.5,1.2-11.1,3.3-12.6,6.1c-1.7,6-3.1,13.7-3.1,13.7h20.1h20.1C452.4,474.8,451.4,466.6,449.3,461.1z"/> </g> </g> </g> <path class="rectInMobile" fill="#2C8FAC" d="M463.7,378.4c0,4-3.3,7.3-7.3,7.3H408c-4,0-7.3-3.3-7.3-7.3l0,0c0-4,3.3-7.3,7.3-7.3h48.4 C460.4,371.1,463.7,374.3,463.7,378.4L463.7,378.4z"/> <g class="iconInMobile"> <circle fill="#39B54A" cx="412.1" cy="496.2" r="10.9"/> <path fill="#FFFFFF" d="M418.9,500.1c0,0.2,0,0.4-0.2,0.6l-1.9,1.9c-0.1,0.1-0.2,0.2-0.3,0.2c-0.1,0.1-0.3,0.1-0.4,0.1 c0,0,0,0-0.1,0c0,0-0.1,0-0.2,0c-0.2,0-0.5,0-0.9-0.1c-0.4-0.1-0.9-0.2-1.5-0.5c-0.6-0.2-1.3-0.6-2-1.1c-0.7-0.5-1.5-1.2-2.4-2 c-0.7-0.7-1.2-1.3-1.7-1.9c-0.4-0.6-0.8-1.2-1.1-1.7c-0.3-0.5-0.5-1-0.6-1.4c-0.1-0.4-0.2-0.8-0.3-1.1c0-0.3-0.1-0.5-0.1-0.7 c0-0.2,0-0.3,0-0.3c0-0.1,0.1-0.3,0.1-0.4c0.1-0.1,0.1-0.3,0.2-0.3l1.9-1.9c0.1-0.1,0.3-0.2,0.5-0.2c0.1,0,0.2,0,0.3,0.1 c0.1,0.1,0.2,0.2,0.2,0.3l1.5,2.9c0.1,0.2,0.1,0.3,0.1,0.5c0,0.2-0.1,0.3-0.2,0.5l-0.7,0.7c0,0,0,0-0.1,0.1c0,0,0,0.1,0,0.1 c0,0.2,0.1,0.4,0.3,0.7c0.1,0.2,0.3,0.5,0.5,0.8c0.2,0.3,0.6,0.7,1,1.1c0.4,0.4,0.8,0.8,1.1,1c0.3,0.2,0.6,0.4,0.8,0.5 c0.2,0.1,0.4,0.2,0.5,0.2l0.2,0c0,0,0,0,0.1,0c0,0,0.1,0,0.1,0l0.8-0.8c0.2-0.2,0.4-0.2,0.6-0.2c0.2,0,0.3,0,0.4,0.1h0l2.8,1.6 C418.7,499.7,418.8,499.9,418.9,500.1L418.9,500.1z M418.9,500.1"/> </g> <g class="iconInMobile"> <circle fill="#FDC20E" cx="452.3" cy="496.2" r="10.9"/> <path fill="#FFFFFF" d="M455.7,490.8h1.7v0h0.1c0.8,0,1.5,0.5,1.5,1.5v0h0v7.6h0l0,0c0,0.7-0.7,1.5-1.4,1.5l0,0h-0.1h-0.1v0 h-1.7v-1.2l1.3,0l-1.3-1.3v-0.8l2,2v0l0,0l0,0l0,0l0,0l0,0c0,0,0-0.1,0-0.1V500l0,0l0,0v-7.6l0,0v0v-0.1l0,0l0,0c0,0,0,0,0,0 l0,0l0,0c0,0,0,0,0,0l0,0l0,0l0,0v0l0,0l0,0l0,0l0,0l0,0l0,0v0l0,0c0,0,0,0,0-0.1l0,0l0,0l0,0l0,0v0v0l0,0l0,0l0,0l0,0l0,0l0,0 l0,0l0,0l0,0l0,0l0,0l0,0h-0.1l-1.8,2V490.8z M449,490.8h6.7v3.2l-2,2.2l2,2v0.8l-2.4-2.4c-0.1,0.1-0.1,0.1-0.2,0.2l0,0 c-0.3,0.4-0.5,0.6-0.7,0.6c-0.2,0-0.4-0.2-0.7-0.5c-0.1-0.1-0.1-0.1-0.2-0.2L449,499v-0.7l2.1-2L449,494V490.8L449,490.8z M455.7,501.5H449v-1.2l6.7,0V501.5z M447.2,490.8h1.8v3.2l-1.9-2H447l0,0l0,0h0l0,0l0,0l0,0h0c0,0,0,0,0,0l0,0l0,0l0,0l0,0 l0,0l0,0l0,0l0,0l0,0c0,0,0,0.1,0,0.1v0l0,0l0,0v7.6l0,0l0,0v0v0c0,0,0,0,0,0c0,0,0,0,0,0v0c0,0,0,0,0,0v0v0l0,0l0,0l0,0l0,0 c0,0,0,0,0,0.1l2.1-2v0.7l-1.3,1.3l1.3,0v1.2h-1.8v0h-0.1c-0.9,0-1.5-0.7-1.5-1.5l0,0h0v-7.6h0l0,0v-0.1c0-0.3,0.1-0.7,0.4-1 c0.3-0.3,0.7-0.5,1.1-0.5l0,0L447.2,490.8L447.2,490.8L447.2,490.8z"/> </g> </g> <path fill="#54585B" d="M414.5,331.3c-2,0-3.6-1.6-3.6-3.6c0-2,1.6-3.6,3.6-3.6h35.4c2,0,3.6,1.6,3.6,3.6c0,2-1.6,3.6-3.6,3.6 H414.5z"/> <path fill="#BBBDBF" d="M445.2,563c0,3.2-2.6,5.8-5.8,5.8H425c-3.2,0-5.8-2.6-5.8-5.8v-14.4c0-3.2,2.6-5.8,5.8-5.8h14.4 c3.2,0,5.8,2.6,5.8,5.8V563z"/> <path fill="#333333" d="M425,545.1c-1.9,0-3.5,1.6-3.5,3.5V563c0,1.9,1.6,3.5,3.5,3.5h14.4c1.9,0,3.5-1.6,3.5-3.5v-14.4 c0-1.9-1.6-3.5-3.5-3.5H425z M425,545.1c-1.9,0-3.5,1.6-3.5,3.5V563c0,1.9,1.6,3.5,3.5,3.5h14.4c1.9,0,3.5-1.6,3.5-3.5v-14.4 c0-1.9-1.6-3.5-3.5-3.5H425z"/> <path fill="#0A0A0A" d="M439.5,545.1h-7.2v21.4h7.2c1.9,0,3.5-1.6,3.5-3.5v-14.4C442.9,546.7,441.4,545.1,439.5,545.1z"/> </g> <g> <g> <g> <g> <path fill="#EFB378" d="M381.1,438.1l18.3-47.1c4.7-12.5-1.2-26.6-13.2-31.4l-7.2-2.9c-0.3-0.1-0.6-0.2-0.9-0.3l-16.9,45.3 L381.1,438.1z"/> </g> </g> <g> <polygon fill="#EFB378" points="391.4,400.6 373,466.3 348.6,436.3 366.9,386.6"/> </g> <g> <path fill="#EFB378" d="M267.5,543.7L352.6,426c3.3,1.4,6.4,3.2,9.4,5.3c28.8,20.8,29.9,68.4,2.5,106.3 c-14.3,19.8-33.5,33-52.7,38.2L267.5,543.7z"/> </g> </g> </g> <g> <g> <polygon fill="#FFFFFF" points="322.3,650.7 239,538.4 284.2,498.3 369.3,612.4"/> <polygon fill="#2E416B" points="0,750.6 0,800 169.2,800 343.2,637.2 260,517.9"/> <polygon fill="#263658" points="331.3,645.4 248.1,526.2 260,517.9 343.2,637.2"/> </g> <path fill="#E6E7E8" d="M341.8,613c-3.1,1.8-7.1,0.7-8.8-2.4c-1.8-3.1-0.7-7.1,2.4-8.8c3.1-1.8,7.1-0.7,8.8,2.4 C346,607.2,344.9,611.2,341.8,613z"/> </g> <path fill="#EFB378" d="M532.6,546.1c0.8,8-5,15.1-13,16l-22.4,2.1c-8,0.8-15.1-5-15.9-13l0,0c-0.8-8,5-15.1,13-16l22.4-2.1 C524.7,532.3,531.8,538.1,532.6,546.1L532.6,546.1z"/> <path fill="#EFB378" d="M533.7,515.7c0.8,8-5,15.1-13,16l-22.4,2.1c-8,0.8-15.1-5-15.9-13l0,0c-0.8-8,5-15.1,13-16l22.4-2.1 C525.8,501.9,532.9,507.7,533.7,515.7L533.7,515.7z"/> <path fill="#EFB378" d="M535.3,485.4c0.8,8-5,15.1-13,15.9l-22.4,2.1c-8,0.8-15.1-5-15.9-13l0,0c-0.8-8,5-15.1,13-16l22.4-2.1 C527.4,471.6,534.5,477.4,535.3,485.4L535.3,485.4z"/> <path fill="#EFB378" d="M536.7,455.3c0.8,8-5,15.1-13,16l-22.4,2.1c-8,0.8-15.1-5-15.9-13l0,0c-0.8-8,5-15.1,13-16l22.4-2.1 C528.8,441.5,535.9,447.3,536.7,455.3L536.7,455.3z"/> </g> <g id="icons" opacity="0.5"> <path class="icon" id="icon14" fill="#FFFFFF" d="M530,177.3h-29.9c-0.8,0-1.4,0.7-1.4,1.5v18.3c0,0.8,0.6,1.5,1.4,1.5H530 c0.8,0,1.4-0.7,1.4-1.5v-18.3C531.4,178,530.7,177.3,530,177.3z M515.1,189.7c0,0-14.4-10.8-15.5-11.7c1.2,0.7,15.5,9.1,15.5,9.1 s14-8.3,15.3-9.1C529.2,179,515.1,189.7,515.1,189.7z"/> <path class="icon" id="icon13" fill="#FFFFFF" d="M37.1,299.9c-0.3,0.2-0.5,0.5-0.5,0.8c0,0.3,0.2,0.6,0.5,0.8l2.8,3.1 c0,9.6,6.3,15.5,15.6,15.5c8,0,14.2-8.5,14.2-14.2c0-2.7-1,0.3-3.1,1.6c-2.2,1.4-8.3,2.2-8.1-4.1c0.1-0.5,0.1-1,0.1-1.6 c0-5.2-3.3-9.8-8.4-9.8c-4.7,0-8.2,2.7-9,5.9L37.1,299.9 M45.2,301.5c-0.8,0-1.4-0.6-1.4-1.4c0-0.8,0.6-1.4,1.4-1.4 c0.8,0,1.4,0.6,1.4,1.4C46.5,300.9,45.9,301.5,45.2,301.5"/> <path class="icon" id="icon12" fill="#FFFFFF" d="M71.4,601.5h-2.9v27.9c-1.6-0.9-3.6-1.5-5.9-1.5c-4.9,0-8.8,2.6-8.8,5.9 c0,3.2,3.9,5.9,8.8,5.9c4.9,0,8.8-2.6,8.8-5.9v-23.5c7.3-1.2,11.7,7.3,14.7,11.7C84.2,601.5,71.4,601.5,71.4,601.5"/> <g class="icon" id="icon11"> <rect x="630.1" y="468.8" fill="#FFFFFF" width="6.7" height="2.9"/> <path fill="#FFFFFF" d="M605.4,498.8h35.5v-26.1h-35.5V498.8z M629.7,475.6h7.4v4.4h-7.4V475.6z M608.4,485.7c0-0.3,0-0.7,0.1-1 c0-0.3,0.1-0.7,0.2-1c0.1-0.7,0.3-1.3,0.6-1.9c0.1-0.3,0.3-0.6,0.4-0.9c0.2-0.3,0.3-0.6,0.5-0.8c0.2-0.3,0.4-0.5,0.6-0.8 c0.2-0.2,0.3-0.4,0.5-0.5c1.9-1.9,4.5-3.2,7.4-3.2c3,0,5.7,1.3,7.5,3.3c0.3,0.4,0.6,0.7,0.9,1.2c0.2,0.3,0.4,0.6,0.5,0.8 c0.2,0.3,0.3,0.6,0.4,0.9c0.3,0.6,0.5,1.2,0.6,1.9c0.1,0.3,0.1,0.7,0.2,1c0,0.3,0.1,0.7,0.1,1c0,1.2-0.2,2.4-0.6,3.5 c-0.3,0.8-0.7,1.5-1.1,2.2c-0.3,0.4-0.6,0.8-0.9,1.2c-1.9,2-4.5,3.3-7.5,3.3c-1.1,0-2.1-0.2-3-0.5c-0.8-0.2-1.6-0.6-2.3-1 c-0.3-0.2-0.6-0.4-0.8-0.5c-0.1-0.1-0.3-0.2-0.4-0.3c-0.3-0.2-0.5-0.4-0.7-0.7c-0.2-0.2-0.3-0.4-0.5-0.6 c-0.1-0.2-0.3-0.3-0.4-0.5c-0.1-0.2-0.2-0.3-0.3-0.5c-0.2-0.3-0.4-0.5-0.5-0.8c-0.2-0.4-0.4-0.9-0.6-1.3 C608.6,488.1,608.4,486.9,608.4,485.7"/> <path fill="#FFFFFF" d="M618.6,493.1c4.1,0,7.3-3.3,7.3-7.3c0-4-3.3-7.3-7.3-7.3c-4.1,0-7.3,3.3-7.3,7.3 C611.2,489.8,614.5,493.1,618.6,493.1"/> </g> <g class="icon" id="icon10"> <path fill="#FFFFFF" d="M197.7,344.7c6.8,0,12.9-3.2,16.8-8.2c1.2,0.5,2.5,0.8,3.8,0.8c5,0,9-4.1,9-9c0-4.9-3.8-8.8-8.7-9 c0,0,0,0,0,0h-42.1c-0.2,1.3-0.4,2.6-0.4,4C176.3,335.1,185.9,344.7,197.7,344.7 M219.2,323.3 C219.2,323.3,219.1,323.2,219.2,323.3c2.5,0.3,4.3,2.5,4.3,5c0,2.8-2.3,5.1-5.1,5.1c-0.6,0-1.1-0.1-1.6-0.3 C218.3,330.2,219.2,326.8,219.2,323.3"/> <path fill="#FFFFFF" d="M189.8,312.7c-2.7,0.9-1.5,5.1,1.2,4.2c3.2-1.1,4.2-4.3,3.5-7.3c-0.4-1.5-1.3-2.9-2-4.3 c-0.4-0.8-1.2-2.6-0.1-3.3c2.4-1.5,0.2-5.3-2.2-3.8c-2.6,1.6-3.1,4.7-2.2,7.5C188.1,306.7,191.8,312,189.8,312.7"/> <path fill="#FFFFFF" d="M201.8,312.7c-2.7,0.9-1.5,5.1,1.2,4.2c3.2-1.1,4.2-4.3,3.5-7.3c-0.4-1.5-1.3-2.9-2-4.3 c-0.4-0.8-1.2-2.6-0.1-3.3c2.4-1.5,0.2-5.3-2.2-3.8c-2.6,1.6-3.1,4.7-2.2,7.5C200.2,306.7,203.8,312,201.8,312.7"/> </g> <g class="icon" id="icon9"> <path fill="#FFFFFF" d="M718.6,190.3C718.6,190.3,718.6,190.3,718.6,190.3c-0.8-0.3-2.6-0.9-3.7-1.3c-0.1,0-0.1,0-0.1-0.4 c0-0.3,0.1-0.7,0.3-0.9c0.1-0.3,0.3-0.8,0.4-1.3c0.2-0.2,0.4-0.6,0.5-1.3c0.1-0.6,0.1-0.9,0-1.1c0,0,0,0,0-0.1 c0-0.2,0-0.9,0.1-1.6c0.1-0.4,0-1.3-0.6-2.1c-0.4-0.5-1.1-1-2.3-1.1l-0.7,0c-1.3,0.1-2,0.7-2.3,1.1c-0.6,0.7-0.7,1.6-0.6,2.1 c0.1,0.6,0.2,1.4,0.1,1.6c0,0,0,0,0,0.1c-0.1,0.2-0.1,0.5,0,1.1c0.1,0.7,0.4,1.1,0.5,1.3c0.1,0.5,0.2,1,0.4,1.3 c0.1,0.2,0.2,0.5,0.2,0.9c0,0.4,0,0.4-0.1,0.4c-1.1,0.3-3,1-3.7,1.3c0,0,0,0,0,0v2.9h5.8h5.9V190.3z"/> <path fill="#FFFFFF" d="M740.9,190.3c-0.8-0.3-2.6-0.9-3.7-1.3c-0.1,0-0.1,0-0.1-0.4c0-0.3,0.1-0.7,0.3-0.9 c0.1-0.3,0.3-0.8,0.4-1.3c0.2-0.2,0.4-0.6,0.5-1.3c0.1-0.6,0.1-0.9,0-1.1c0,0,0,0,0-0.1c0-0.2,0-0.9,0.1-1.6 c0.1-0.4,0-1.3-0.6-2.1c-0.4-0.5-1.1-1-2.3-1.1l-0.7,0c-1.3,0.1-2,0.7-2.3,1.1c-0.6,0.7-0.7,1.6-0.6,2.1c0.1,0.6,0.2,1.4,0.1,1.6 c0,0,0,0,0,0.1c-0.1,0.2-0.1,0.5,0,1.1c0.1,0.7,0.4,1.1,0.5,1.3c0.1,0.5,0.2,1,0.4,1.3c0.1,0.2,0.2,0.5,0.2,0.9 c0,0.4,0,0.4-0.1,0.4c-1.1,0.3-3,1-3.7,1.3c0,0,0,0,0,0v2.9h5.8h5.9L740.9,190.3C740.9,190.3,740.9,190.3,740.9,190.3z"/> <path fill="#FFFFFF" d="M726.9,192.5c-0.1,0-0.2,0-0.2-0.6c0-0.5,0.2-0.9,0.4-1.3c0.2-0.4,0.4-1.1,0.5-1.8 c0.2-0.3,0.6-0.8,0.8-1.9c0.2-0.9,0.1-1.2,0-1.6c0,0,0-0.1,0-0.1c0-0.2,0-1.3,0.2-2.2c0.1-0.6,0-1.8-0.8-2.9 c-0.5-0.7-1.5-1.5-3.3-1.6l-1,0c-1.8,0.1-2.8,0.9-3.3,1.6c-0.8,1-1,2.3-0.8,2.9c0.2,0.9,0.2,2,0.2,2.2c0,0,0,0.1,0,0.1 c-0.1,0.3-0.2,0.6,0,1.6c0.2,1,0.5,1.6,0.8,1.9c0.1,0.6,0.3,1.4,0.5,1.8c0.1,0.3,0.2,0.7,0.2,1.3c0,0.6,0,0.6-0.1,0.6 c-1.6,0.5-4.2,1.4-5.1,1.8c0,0,0,0,0,0v4.1h8.2h8.2v-4.1c0,0,0,0,0,0C731,193.9,728.4,193,726.9,192.5z"/> </g> <path class="icon" id="icon8" fill="#FFFFFF" d="M268.2,52.3h-23.6c-2,0-3.6,1.6-3.6,3.6v12.7c0,2,1.6,3.6,3.6,3.6h1.8v6.4 c0,0.2,0.1,0.5,0.3,0.6c0.4,0.4,0.9,0.4,1.3,0l7.5-7h12.7c2,0,3.6-1.6,3.6-3.6V55.9C271.8,53.9,270.2,52.3,268.2,52.3 M247.3,57.7 h14.5c0.5,0,0.9,0.4,0.9,0.9c0,0.5-0.4,0.9-0.9,0.9h-14.5c-0.5,0-0.9-0.4-0.9-0.9C246.4,58.1,246.8,57.7,247.3,57.7 M254.6,66.8 h-7.3c-0.5,0-0.9-0.4-0.9-0.9c0-0.5,0.4-0.9,0.9-0.9h7.3c0.5,0,0.9,0.4,0.9,0.9C255.5,66.4,255.1,66.8,254.6,66.8 M265.5,63.2 h-18.2c-0.5,0-0.9-0.4-0.9-0.9c0-0.5,0.4-0.9,0.9-0.9h18.2c0.5,0,0.9,0.4,0.9,0.9C266.4,62.8,266,63.2,265.5,63.2"/> <g class="icon" id="icon7"> <path fill="#FFFFFF" d="M130.3,180.7L118.7,168c0,0-0.1-0.1-0.1-0.1c1.8-3.2,2.3-7,1.2-10.8c-2.2-7.1-9.8-11.1-17-8.9 c-7.1,2.2-11.1,9.8-8.9,17c2.2,7.1,9.8,11.1,17,8.9c1.1-0.4,2.2-0.9,3.1-1.5l11.5,12.5c0.3,0.4,1.1,0.2,1.7-0.3l2.7-2.5 C130.5,181.9,130.7,181.1,130.3,180.7z M97.3,164.2c-1.6-5.2,1.3-10.8,6.5-12.4c5.2-1.6,10.8,1.3,12.4,6.5 c1.6,5.2-1.3,10.8-6.5,12.4C104.5,172.3,99,169.4,97.3,164.2z"/> <g> <path fill="#FFFFFF" d="M102.1,157.2c5.3-1.7,10.9,1.3,12.6,6.6c0,0.1,0.1,0.3,0.1,0.4c0.7-1.7,0.8-3.7,0.2-5.6 c-1.4-4.5-6.1-6.9-10.6-5.5c-2.9,0.9-4.9,3.2-5.6,5.9C99.7,158.2,100.8,157.6,102.1,157.2z"/> </g> </g> <path class="icon" id="icon6" fill="#FFFFFF" d="M189.6,462c0-2.7-2-5-4.6-5.4c0.2-1.2,0.3-2.3,0.3-3.6c0-12.5-10.1-22.6-22.6-22.6 c-12.5,0-22.6,10.1-22.6,22.6c0,1,0.1,2,0.2,3c-2.9,0.2-5.1,2.6-5.1,5.5c0,3,2.5,5.5,5.5,5.5c0.3,0,0.6,0,0.9-0.1v2.3 c0,1.3,1.1,2.4,2.4,2.4h3.9c1.3,0,2.4-1.1,2.4-2.4v-15c0-1.3-1.1-2.4-2.4-2.4H144c-0.4,0-0.8,0.1-1.2,0.3 c1.7-9.4,10-16.5,19.9-16.5c10.1,0,18.5,7.4,20,17.1c-0.4-0.6-1.1-0.9-1.9-0.9H177c-1.3,0-2.4,1.1-2.4,2.4v15 c0,1.3,1.1,2.4,2.4,2.4h3.9c0.4,0,0.7-0.1,1-0.2c-2.3,4.9-6.2,8.5-10.9,9.9c-0.5-1.8-2.5-3.2-4.8-3.2c-2.7,0-4.9,1.9-4.9,4.2 c0,2.3,2.2,4.2,4.9,4.2c2.1,0,3.9-1.1,4.6-2.7c7.2-1.4,12.9-8,14.4-16.5C187.7,467,189.6,464.7,189.6,462z M183.3,467.5 C183.3,467.5,183.3,467.5,183.3,467.5c0,0.1,0,0.1,0,0.2V467.5z"/> <g class="icon" id="icon5"> <path fill="#FFFFFF" d="M611.7,95.6l0-12.2c0-3.1-1.4-4.9-2.6-5.8c-1.2-1-2.5-1.2-2.7-1.3l-0.2,0l-6.5,0.1c0.1-3.2,0.1-6.7-0.3-8 c-0.4-1.5-1.6-2.4-3.1-2.4c-1.2,0-2.2,0.6-2.5,0.8l-0.3,0.2l-6.6,9.6l-10.6,3.8l-0.1,17.1l12.2,7.1l18.2-0.1l0.4-0.2 C611.8,102.2,611.7,96.5,611.7,95.6z M606.4,102.8L606.4,102.8l-17.5,0.1l-11-6.4l0.1-14.9l10-3.6l6.7-9.8l0.1,0 c0,0,0.8-0.5,1.6-0.5c0.7,0,1.2,0.4,1.4,1.2c0.4,1.5,0.2,7.6,0.1,9.3l8.2-0.1l0,0c0,0,1,0.2,2,0.9c0.9,0.7,1.9,2,1.9,4.5l0,12.3 C610,96,610.2,101.1,606.4,102.8z"/> <rect x="563.5" y="79.3" fill="#FFFFFF" width="10.6" height="20.1"/> </g> <g class="icon" id="icon4"> <path fill="#FFFFFF" d="M620.1,293.2h-3.5c2.4-0.7,4.1-3,4.1-5.6v-24.3c0-3.2-2.6-5.9-5.9-5.9h-31.2c-3.2,0-5.9,2.6-5.9,5.9v24.3 c0,2.6,1.7,4.9,4.1,5.6h-3.7c-1.7,0-3.1,1.4-3.1,3.1c0,1.7,1.4,3.1,3.1,3.1h41.8c1.7,0,3.1-1.4,3.1-3.1 C623.1,294.6,621.8,293.2,620.1,293.2z M603.1,297.7h-8.3c-0.4,0-0.8-0.4-0.8-0.8c0-0.4,0.4-0.8,0.8-0.8h8.3 c0.4,0,0.8,0.4,0.8,0.8C603.9,297.4,603.6,297.7,603.1,297.7z M583.7,290.8c-1.8,0-3.2-1.4-3.2-3.2v-24.3c0-1.8,1.4-3.2,3.2-3.2 h31.2c1.8,0,3.2,1.4,3.2,3.2v24.3c0,1.8-1.4,3.2-3.2,3.2H583.7z"/> <polygon fill="#FFFFFF" points="592.7,284.8 610,275.5 592.6,266.9 "/> </g> <g class="icon" id="icon3"> <path fill="#FFFFFF" d="M735.4,530.6c0-0.4,0.1-0.8,0.1-1.2c0-0.4,0-0.8-0.1-1.2l-1.5-0.4c-0.1-0.8-0.3-1.6-0.6-2.3l1.1-1.1 c-0.3-0.8-0.8-1.5-1.2-2.2l-1.5,0.4c-0.5-0.6-1.1-1.2-1.7-1.7l0.4-1.5c-0.7-0.5-1.4-0.9-2.2-1.2l-1.1,1.1 c-0.7-0.3-1.5-0.5-2.3-0.6l-0.4-1.5c-0.4,0-0.8-0.1-1.2-0.1v5.6c3.7,0,6.7,3,6.7,6.7c0,3.7-3,6.7-6.7,6.7v5.6 c0.4,0,0.8,0,1.2-0.1l0.4-1.5c0.8-0.1,1.6-0.3,2.3-0.6l1.1,1.1c0.8-0.3,1.5-0.8,2.2-1.2l-0.4-1.5c0.6-0.5,1.2-1.1,1.7-1.7 l1.5,0.4c0.5-0.7,0.9-1.4,1.2-2.2l-1.1-1.1c0.3-0.7,0.5-1.5,0.6-2.3L735.4,530.6z M723.2,517L723.2,517c-0.4,0-0.8,0-1.2,0.1 l-0.4,1.5c-0.8,0.1-1.6,0.3-2.3,0.6l-1.1-1.1c-0.8,0.3-1.5,0.8-2.2,1.2l0.4,1.5c-0.6,0.5-1.2,1.1-1.7,1.7l-1.5-0.4 c-0.5,0.7-0.9,1.4-1.2,2.2l1.1,1.1c-0.3,0.7-0.5,1.5-0.6,2.3l-1.5,0.4c0,0.4-0.1,0.8-0.1,1.3c0,0.4,0,0.8,0.1,1.2l1.5,0.4 c0.1,0.8,0.3,1.6,0.6,2.3l-1.1,1.1c0.3,0.8,0.8,1.5,1.2,2.2l1.5-0.4c0.5,0.6,1.1,1.2,1.7,1.7l-0.4,1.5c0.7,0.5,1.4,0.9,2.2,1.2 l1.1-1.1c0.7,0.3,1.5,0.5,2.3,0.6l0.4,1.5c0.4,0,0.8,0.1,1.3,0.1l0,0v-5.6c-3.7,0-6.7-3-6.7-6.7c0-3.7,3-6.7,6.7-6.7V517z"/> <path fill="#FFFFFF" d="M756,543c0.2,0.5,0.3,1,0.5,1.5c0.1,0.5,0.2,1,0.3,1.5l-1.6,0.9c0.1,1,0.1,2,0,2.9l1.6,1 c-0.2,1-0.5,2-0.8,2.9l-1.9,0c-0.4,0.9-0.9,1.7-1.5,2.5l0.9,1.7c-0.6,0.8-1.4,1.5-2.2,2.1l-1.6-0.9c-0.8,0.6-1.6,1-2.5,1.4l0,1.9 c-0.5,0.2-1,0.3-1.5,0.5c-0.5,0.1-1,0.2-1.5,0.3l-0.9-1.6c-0.4,0-0.9,0.1-1.3,0.1v-5.1c0.7,0,1.4-0.1,2-0.3 c4.4-1.1,7.1-5.6,6-10.1c-1-3.7-4.3-6.2-8-6.2v-5.1c0.5,0,1.1,0,1.6,0.1l1-1.6c1,0.2,2,0.5,2.9,0.8l0,1.9 c0.9,0.4,1.7,0.9,2.5,1.5l1.6-0.9c0.8,0.6,1.5,1.4,2.1,2.2l-0.9,1.6c0.6,0.8,1,1.6,1.4,2.5L756,543z M741.8,561.6 c-0.5,0-1.1,0-1.6-0.1l-1,1.6c-1-0.2-2-0.5-2.9-0.8l0-1.9c-0.9-0.4-1.7-0.9-2.5-1.5l-1.6,0.9c-0.8-0.7-1.5-1.4-2.1-2.2l0.9-1.6 c-0.6-0.8-1-1.6-1.4-2.5l-1.9-0.1c-0.2-0.5-0.3-1-0.5-1.5c-0.1-0.5-0.2-1-0.3-1.5l1.6-0.9c-0.1-1-0.1-2,0-2.9l-1.6-1 c0.2-1,0.5-2,0.8-2.9l1.9,0c0.4-0.9,0.9-1.7,1.5-2.5l-0.9-1.6c0.6-0.8,1.4-1.5,2.2-2.1l1.6,0.9c0.8-0.6,1.6-1,2.5-1.4l0-1.9 c0.5-0.2,1-0.3,1.5-0.5c0.5-0.1,1-0.2,1.5-0.3l0.9,1.6c0.4,0,0.9-0.1,1.3-0.1v5.1c-0.7,0-1.4,0.1-2,0.3c-4.4,1.1-7.1,5.6-6,10.1 c1,3.7,4.3,6.2,8,6.2V561.6z"/> </g> <g class="icon" id="icon2"> <path fill="#FFFFFF" d="M330.4,174.3c-0.1-0.1-2.8-3.2-7-6.2c-5.7-4.1-11.7-6.3-17.2-6.3c-5.5,0-11.5,2.2-17.2,6.3 c-4.3,3.1-6.9,6.1-7,6.2c-0.5,0.5-0.5,1.3,0,1.8c0.1,0.1,2.8,3.2,7,6.2c5.7,4.1,11.7,6.3,17.2,6.3c5.5,0,11.5-2.2,17.2-6.3 c4.3-3.1,6.9-6.1,7-6.2C330.8,175.6,330.8,174.8,330.4,174.3z M321.7,180.1c-3.7,2.6-9.3,5.7-15.5,5.7c-6.2,0-11.9-3.1-15.5-5.7 c-2.7-1.9-4.7-3.8-5.8-4.9c1.1-1.1,3.1-3,5.8-4.9c3.7-2.6,9.3-5.7,15.5-5.7c6.2,0,11.9,3.1,15.5,5.7c2.7,1.9,4.7,3.8,5.8,4.9 C326.3,176.3,324.3,178.2,321.7,180.1z"/> <path fill="#FFFFFF" d="M313.4,173.8c-0.8,0-1.4,0.6-1.4,1.4c0,3.2-2.6,5.8-5.8,5.8c-3.2,0-5.8-2.6-5.8-5.8 c0-3.2,2.6-5.8,5.8-5.8c1.4,0,2.8,0.5,3.8,1.4c0.6,0.5,1.5,0.4,2-0.1c0.5-0.6,0.4-1.5-0.1-2c-1.6-1.4-3.6-2.1-5.7-2.1 c-4.8,0-8.6,3.9-8.6,8.6c0,4.8,3.9,8.6,8.6,8.6c4.8,0,8.6-3.9,8.6-8.6C314.7,174.4,314.1,173.8,313.4,173.8z"/> <path fill="#FFFFFF" d="M303.3,175.2c0,1.5,1.2,2.8,2.8,2.8c1.5,0,2.8-1.2,2.8-2.8c0-1.5-1.2-2.8-2.8-2.8C304.6,172.4,303.3,173.6,303.3,175.2z"/> </g> <polygon class="icon" id="icon1" fill="#FFFFFF" points="644.3,661.1 628.5,676.9 622.5,670.9 616.3,677.1 622.3,683.1 628.5,689.3 634.7,683.1 650.5,667.3 "/> </g> <g id="users"> <g class="usr" id="usr11"> <circle fill="#FFFFFF" cx="534.3" cy="679" r="53.3"/> <g> <defs> <circle id="SVGID_3_" cx="534.3" cy="679" r="53.3"/> </defs> <clipPath id="SVGID_4_"> <use xlink:href="#SVGID_3_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_4_)"> <path fill="#F1C9A5" d="M560.2,711.8c-3.4-6.5-25.5-10.6-25.5-10.6s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2 C564.8,732.3,563.4,720,560.2,711.8z"/> <rect x="528.7" y="688" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M528.7,697.3c1.1,3.1,5.4,4.9,8.6,4.9c1.2,0,2.3-0.2,3.4-0.5V688h-12V697.3z"/> <path fill="#2B5971" d="M560.2,711.8c-2-3.8-10.4-6.8-17-8.6c-0.3,4.5-4,8.1-8.5,8.1c-4.6,0-8.3-3.6-8.5-8.1 c-6.6,1.8-15,4.8-17,8.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2C564.8,732.3,563.4,720,560.2,711.8z"/> <path fill="#F1C9A5" d="M550.1,675.3c0-12.6-6.9-19.7-15.5-19.7c-8.5,0-15.5,7.1-15.5,19.7c0,5.3,1.6,16.9,4.4,19.3 c1.9,1.7,8.1,4.6,11.1,4.6h0c0,0,0,0,0,0c0,0,0,0,0,0h0c3,0,9.2-2.9,11.1-4.6C548.6,691.6,550.1,680.1,550.1,675.3z"/> <path fill="#F1C9A5" d="M547.8,684c-2.8-0.3-4.7-3.3-4.2-6.7c0.5-3.4,3.1-6,5.9-5.7c2.8,0.3,4.7,3.3,4.2,6.7 C553.2,681.7,550.6,684.3,547.8,684z"/> <path fill="#F1C9A5" d="M515.8,678.3c-0.5-3.4,1.4-6.4,4.2-6.7c2.8-0.3,5.5,2.3,5.9,5.7c0.5,3.4-1.4,6.4-4.2,6.7 C518.9,684.3,516.2,681.7,515.8,678.3z"/> <g> <path fill="#262421" d="M519.5,664.2c-1.5,3.2-1.3,8-1.3,8s1.8,0.5,2.5,2.8c0-5.6,0.8-11.8,5.3-12.3c4.1-0.4,3.8,1.4,8.7,1.4 c0-6.6,0-10.2,0-10.2S524.4,653.9,519.5,664.2z"/> <path fill="#262421" d="M549.9,664.2c-4.3-10.3-15.2-10.3-15.2-10.3s0,3.6,0,10.2c4.9,0,4.6-1.8,8.7-1.4 c4.6,0.4,5.3,6.7,5.3,12.3c0.6-2.3,2.5-2.9,2.5-2.9S551.2,667.5,549.9,664.2z"/> </g> </g> </g> </g> <g class="usr" id="usr10"> <circle fill="#FFFFFF" cx="656.1" cy="574.2" r="53.3"/> <g> <defs> <circle id="SVGID_5_" cx="656.1" cy="574.2" r="53.3"/> </defs> <clipPath id="SVGID_6_"> <use xlink:href="#SVGID_5_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_6_)"> <ellipse fill="#EC9A1C" cx="656.1" cy="567.1" rx="21.8" ry="22"/> <path fill="#F1C9A5" d="M681.6,607c-3.4-6.5-25.5-10.6-25.5-10.6s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2 C686.3,627.5,684.9,615.2,681.6,607z"/> <rect x="650.1" y="583.2" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M650.1,592.5c1.1,3.1,5.4,4.9,8.7,4.9c1.2,0,2.3-0.2,3.4-0.5v-13.7h-12V592.5z"/> <path fill="#F1C9A5" d="M671.6,570.5c0-12.6-6.9-19.7-15.5-19.7c-8.5,0-15.5,7.1-15.5,19.7c0,12.6,6.9,22.8,15.5,22.8 C664.7,593.3,671.6,583.1,671.6,570.5z"/> <path fill="#F1C9A5" d="M669.2,579.2c-2.8-0.3-4.7-3.5-4.2-7.2c0.5-3.6,3.1-6.4,5.9-6c2.8,0.3,4.7,3.5,4.2,7.2 C674.7,576.8,672,579.5,669.2,579.2z"/> <path fill="#F1C9A5" d="M637.2,573.2c-0.5-3.6,1.4-6.9,4.2-7.2c2.8-0.3,5.5,2.4,5.9,6c0.5,3.6-1.4,6.9-4.2,7.2 C640.3,579.5,637.7,576.8,637.2,573.2z"/> <path fill="#C51C39" d="M681.6,607c-1.2-2.2-4.4-4.1-8.2-5.7c-1.9,7.8-8.9,13.5-17.3,13.5c-8.4,0-15.4-5.8-17.3-13.5 c-3.8,1.6-7.1,3.5-8.2,5.7c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2C686.3,627.5,684.9,615.2,681.6,607z"/> <path fill="#EC9A1C" d="M656.1,548.7c0,0-21.1,1.6-17.2,19.8c0,0,19.9-3.7,23-11.3c3.1,7.7,11.3,11.3,11.3,11.3 C677.2,550.3,656.1,548.7,656.1,548.7z"/> <path fill="#EC9A1C" d="M639.1,578.4c0,0-7.5,1.1-12.6,11c3,0.9,4.3,1.3,7.1,1.5c1,3,4.3,4.1,4.3,4.1s5.4-5.1,4.2-12.4"/> <path fill="#EC9A1C" d="M673.2,578.4c0,0,7.5,1.1,12.6,11c-3,0.9-4.3,1.3-7.1,1.5c-1,3-4.3,4.1-4.3,4.1s-5.4-5.1-4.2-12.4"/> </g> </g> </g> <g class="usr" id="usr9"> <defs> <path id="SVGID_7_" d="M762.7,435.6c0-29.4-23.9-53.3-53.3-53.3c-29.4,0-53.3,23.9-53.3,53.3c0,29.4,23.9,53.3,53.3,53.3 C738.8,488.9,762.7,465,762.7,435.6z"/> </defs> <use xlink:href="#SVGID_7_" overflow="visible" fill="#FFFFFF"/> <clipPath id="SVGID_8_"> <use xlink:href="#SVGID_7_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_8_)"> <path fill="#D68518" d="M699.7,455h18.6c0,0,9.5-9.4,9.2-21.6c-0.4-12.2-12-19.7-22.4-19.7C694.5,413.7,686.8,439.4,699.7,455z" /> <path fill="#F1C9A5" d="M734.9,468.4c-3.4-6.5-25.5-10.6-25.5-10.6s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2 C739.6,488.9,738.1,476.6,734.9,468.4z"/> <rect x="703.4" y="444.6" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M703.4,453.9c1.1,3.1,5.4,4.9,8.6,4.9c1.2,0,2.3-0.2,3.4-0.5v-13.7h-12V453.9z"/> <path fill="#F1C9A5" d="M724.9,431.9c0-12.6-6.9-19.7-15.5-19.7c-8.5,0-15.5,7.1-15.5,19.7c0,12.6,6.9,22.8,15.5,22.8 C717.9,454.6,724.9,444.4,724.9,431.9z"/> <path fill="#F1C9A5" d="M722.5,440.6c-2.8-0.3-4.7-3.5-4.2-7.2c0.5-3.6,3.1-6.4,5.9-6c2.8,0.3,4.7,3.5,4.2,7.2 C728,438.2,725.3,440.9,722.5,440.6z"/> <path fill="#F1C9A5" d="M690.5,434.5c-0.5-3.6,1.4-6.9,4.2-7.2c2.8-0.3,5.5,2.4,5.9,6c0.5,3.6-1.4,6.9-4.2,7.2 C693.6,440.9,691,438.2,690.5,434.5z"/> <path fill="#01561E" d="M734.9,468.4c-0.2-0.4-0.5-0.8-0.8-1.1c-3.7,4.9-13.4,8.4-24.7,8.4l0,0l0,0c0,0,0,0,0,0 c-11.3,0-21-3.5-24.7-8.4c-0.3,0.4-0.6,0.7-0.8,1.1c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2C739.6,488.9,738.1,476.6,734.9,468.4z" /> <path fill="#EC9A1C" d="M702.9,418.5c2.6,4.6,9,7.3,13.6,10.7c8.1,6.1,4.5,19.6,1.6,25.7c10.2-5.9,17.7-15.9,13.9-32 c-3.8-16.1-16.6-23-29.8-17.3c-10.9-2.9-22.1,13.7-20.8,28.7c1.3,15,18.2,20.6,18.2,20.6S689.6,432.7,702.9,418.5z"/> </g> </g> <g class="usr" id="usr8"> <defs> <path id="SVGID_9_" d="M743.2,290.7c0-29.4-23.9-53.3-53.3-53.3c-29.4,0-53.3,23.9-53.3,53.3c0,29.4,23.9,53.3,53.3,53.3 C719.3,344,743.2,320.2,743.2,290.7z"/> </defs> <use xlink:href="#SVGID_9_" overflow="visible" fill="#FFFFFF"/> <clipPath id="SVGID_10_"> <use xlink:href="#SVGID_9_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_10_)"> <g> <path fill="#F1C9A5" d="M715.4,323.5C712,317,689.9,313,689.9,313s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2 C720.1,344,718.6,331.7,715.4,323.5z"/> <rect x="683.9" y="299.7" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M683.9,309.1c1.1,3.1,5.4,4.9,8.6,4.9c1.2,0,2.3-0.2,3.4-0.5v-13.7h-12V309.1z"/> <path fill="#F1C9A5" d="M705.4,287c0-12.6-6.9-19.7-15.5-19.7c-8.5,0-15.5,7.1-15.5,19.7c0,16.9,6.9,22.8,15.5,22.8 C698.4,309.8,705.4,303.2,705.4,287z"/> <path fill="#F1C9A5" d="M703,295.7c-2.8-0.3-4.7-3.3-4.2-6.7c0.5-3.4,3.1-6,5.9-5.7c2.8,0.3,4.7,3.3,4.2,6.7 C708.5,293.5,705.8,296,703,295.7z"/> <path fill="#F1C9A5" d="M671,290.1c-0.5-3.4,1.4-6.4,4.2-6.7c2.8-0.3,5.5,2.3,5.9,5.7c0.5,3.4-1.4,6.4-4.2,6.7 C674.1,296,671.5,293.5,671,290.1z"/> </g> <path fill="#303030" d="M703.8,297.6c-0.8,2.3-2.2,5.1-4.8,5.1c-3.2,0-5.4-2.6-9.1-2.6c0,0,0,0,0,0c0,0,0,0,0,0 c-3.6,0-5.9,2.6-9.1,2.6c-2.5,0-3.9-2.8-4.8-5.1l-0.7-4.5v5.4c0,0,1.2,6.3,3.5,7.9c1.9,1.7,8.1,4.6,11.1,4.6h0c0,0,0,0,0,0 c0,0,0,0,0,0h0c3,0,9.2-2.9,11.1-4.6c2.3-1.5,3.5-7.9,3.5-7.9v-5.4L703.8,297.6z"/> <path fill="#303030" d="M682.4,269.7c0,0,2.9,11.6,18.9,17.5c-1.5-2.6-1.8-5.7-1.8-5.7s2.6,2.7,6.8,4.9 c2.3-4.6,5.1-11.6-1.1-15.4C699.1,267.1,684.5,260.3,682.4,269.7z"/> <path fill="#303030" d="M677.1,286.3c0,0,1.2-13.3,6.1-16.2c-4.2-1.8-10.6,3.8-10,7.2C673.9,280.7,677.1,286.3,677.1,286.3z"/> <path fill="#FB621E" d="M715.4,323.5c-2-3.8-10.4-6.8-17-8.6c-0.3,4.5-4,8.1-8.5,8.1c-4.6,0-8.3-3.6-8.5-8.1 c-6.6,1.8-15,4.8-17,8.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2C720.1,344,718.6,331.7,715.4,323.5z"/> <path opacity="0.2" fill="#E53D0C" d="M680.9,317.2c0.3,4.5,4.2,8.1,9,8.1c4.8,0,8.8-3.6,9-8.1c6.1,1.6,13.5,4,16.8,7.1 c-0.1-0.2-0.2-0.5-0.3-0.7c-2-3.8-10.4-6.8-17-8.6c-0.3,4.5-4,8.1-8.5,8.1c-4.6,0-8.3-3.6-8.5-8.1c-6.6,1.8-15,4.8-17,8.6 c-0.1,0.2-0.1,0.4-0.2,0.6C667.5,321.1,674.9,318.7,680.9,317.2z"/> <path fill="#E53D0C" d="M678.8,315.7c0.8,5.4,5.5,9.5,11.1,9.5c5.6,0,10.2-4.1,11.1-9.5c-0.9-0.3-1.7-0.5-2.5-0.7 c-0.3,4.5-4,8.1-8.5,8.1c-4.6,0-8.3-3.6-8.5-8.1C680.5,315.2,679.7,315.4,678.8,315.7z"/> <path fill="#FFFFFF" d="M692.4,304.2c0,0-0.4-1.6-2.5-1.6c-2,0-2.5,1.6-2.5,1.6H692.4z"/> </g> </g> <g class="usr" id="usr7"> <circle fill="#FFFFFF" cx="610.8" cy="175.2" r="53.3"/> <g> <defs> <circle id="SVGID_11_" cx="610.8" cy="175.2" r="53.3"/> </defs> <clipPath id="SVGID_12_"> <use xlink:href="#SVGID_11_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_12_)"> <g> <path fill="#F1C9A5" d="M636.3,208c-3.4-6.5-25.5-10.6-25.5-10.6s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5h30.2H641 C641,228.4,639.5,216.2,636.3,208z"/> <rect x="604.8" y="184.2" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M604.8,193.5c1.1,3.1,5.4,4.9,8.6,4.9c1.2,0,2.3-0.2,3.4-0.5v-13.7h-12V193.5z"/> <path fill="#FFFFFF" d="M636.3,208c-2-3.8-10.4-6.8-17-8.6c-0.3,4.5-4,8.1-8.5,8.1c-4.6,0-8.3-3.6-8.5-8.1 c-6.6,1.8-15,4.8-17,8.6c-2.5,9-4.7,20.5-4.7,20.5h30.2H641C641,228.4,639.5,216.2,636.3,208z"/> <path fill="#F1C9A5" d="M626.3,171.5c0-12.6-6.9-19.7-15.5-19.7c-8.5,0-15.5,7.1-15.5,19.7c0,5.3,1.6,16.9,4.4,19.3 c1.9,1.7,8.1,4.5,11.1,4.5h0c0,0,0,0,0,0c0,0,0,0,0,0h0c3,0,9.2-2.9,11.1-4.5C624.8,187.7,626.3,176.3,626.3,171.5z"/> <path fill="#F1C9A5" d="M623.9,180.2c-2.8-0.3-4.7-3.3-4.2-6.7c0.5-3.4,3.1-6,5.9-5.7c2.8,0.3,4.7,3.3,4.2,6.7 C629.4,177.9,626.7,180.5,623.9,180.2z"/> <path fill="#F1C9A5" d="M591.9,174.5c-0.5-3.4,1.4-6.4,4.2-6.7c2.8-0.3,5.5,2.3,5.9,5.7c0.5,3.4-1.4,6.4-4.2,6.7 C595,180.5,592.3,177.9,591.9,174.5z"/> <path fill="#2B5971" d="M585.3,208c-2.5,9-4.7,20.5-4.7,20.5h21.9c-3.7-16.4-3.9-28-3.9-28C592.9,202.3,586.9,204.8,585.3,208 z"/> <path fill="#2B5971" d="M636.3,208c3.4,8.5,4.7,20.5,4.7,20.5h-21.9c3.7-16.4,3.9-28,3.9-28 C628.7,202.3,634.7,204.8,636.3,208z"/> </g> <path fill="#915F2C" d="M596.3,179.8c0,0,2.3,7.6,4.7,8.9c1.1,0,2,0,2,0l2.4-3.5l5.4-1.5v11.5h-7l-7-6.2L596.3,179.8z"/> <path fill="#915F2C" d="M625.3,179.8c0,0-2.3,7.6-4.7,8.9c-1.1,0-2,0-2,0l-2.4-3.5l-5.4-1.5v11.5h7l7-6.2L625.3,179.8z"/> <path fill="#FFFFFF" d="M613.3,187.6c0,0-0.4-1.6-2.5-1.6c-2,0-2.5,1.6-2.5,1.6H613.3z"/> <path fill="#915F2C" d="M595.4,167.8c0,0,2,0.4,3.4,2c-0.2-2.7-0.8-11.6,2.5-13.9c3.3-2.2,4.8,0.1,9.5,0.1c0-3.5,0-6.5,0-6.5 s-5.7,0-7.7,0c-2,0-8.4,1-8.4,7C594.7,162.5,595.4,167.8,595.4,167.8z"/> <path fill="#915F2C" d="M626.2,167.8c0,0-2,0.4-3.4,2c0.2-2.7,0.8-11.6-2.5-13.9c-3.3-2.2-4.8,0.1-9.5,0.1c0-3.5,0-6.5,0-6.5 s5.7,0,7.7,0c2,0,8.4,1,8.4,7C626.9,162.5,626.2,167.8,626.2,167.8z"/> </g> </g> </g> <g class="usr" id="usr6"> <defs> <circle id="SVGID_13_" cx="492.2" cy="104.6" r="53.3"/> </defs> <use xlink:href="#SVGID_13_" overflow="visible" fill="#FFFFFF"/> <clipPath id="SVGID_14_"> <use xlink:href="#SVGID_13_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_14_)"> <g> <path fill="#F1C9A5" d="M517.7,137.3c-3.4-6.5-25.5-10.6-25.5-10.6s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2 C522.4,157.8,520.9,145.5,517.7,137.3z"/> <rect x="486.2" y="113.5" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M486.2,122.9c1.1,3.1,5.4,4.9,8.6,4.9c1.2,0,2.3-0.2,3.4-0.5v-13.7h-12V122.9z"/> <path fill="#F1C9A5" d="M507.7,100.9c0-12.6-6.9-19.7-15.5-19.7c-8.5,0-15.5,7.1-15.5,19.7c0,16.9,6.9,22.8,15.5,22.8 C500.7,123.6,507.7,117,507.7,100.9z"/> <path fill="#F1C9A5" d="M507.7,100.9c0-12.6-6.9-19.7-15.5-19.7c-8.5,0-15.5,7.1-15.5,19.7c0,16.9,6.9,22.8,15.5,22.8 C500.7,123.6,507.7,117,507.7,100.9z"/> <path fill="#F1C9A5" d="M505.3,109.6c-2.8-0.3-4.7-3.3-4.2-6.7c0.5-3.4,3.1-6,5.9-5.7c2.8,0.3,4.7,3.3,4.2,6.7 C510.8,107.3,508.1,109.9,505.3,109.6z"/> <path fill="#F1C9A5" d="M473.3,103.9c-0.5-3.4,1.4-6.4,4.2-6.7c2.8-0.3,5.5,2.3,5.9,5.7c0.5,3.4-1.4,6.4-4.2,6.7 C476.4,109.9,473.8,107.3,473.3,103.9z"/> <path fill="#102F41" d="M517.7,137.3c-2.2-4.2-12.1-7.3-18.8-9.1c-0.3,3.5-3.1,6.2-6.7,6.2c-3.5,0-6.4-2.7-6.7-6.2 c-6.8,1.7-16.6,4.9-18.9,9.1c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2C522.4,157.8,520.9,145.5,517.7,137.3z"/> </g> <path fill="#262421" d="M492.2,80.7c-8.3,0-16,7.3-15.4,19c0.1,0.7,0.1,1.5,0.2,2.4c0,0,2.1-4.1,3-11.9c6.4,6.1,14,7.1,24,0 c0.2,5.5,1.8,9.1,3.7,11.7c0-0.3,0-0.6,0-1C508.9,88,500.7,80.7,492.2,80.7z"/> </g> </g> <g class="usr" id="usr5"> <defs> <circle id="SVGID_15_" cx="359.4" cy="93.3" r="53.3"/> </defs> <use xlink:href="#SVGID_15_" overflow="visible" fill="#FFFFFF"/> <clipPath id="SVGID_16_"> <use xlink:href="#SVGID_15_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_16_)"> <g> <ellipse fill="#10303F" cx="359.5" cy="86.1" rx="21.8" ry="22"/> <path fill="#F1C9A5" d="M385,126c-3.4-6.5-25.5-10.6-25.5-10.6s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2 C389.7,146.5,388.2,134.2,385,126z"/> <rect x="353.5" y="102.2" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M353.5,111.6c1.1,3.1,5.4,4.9,8.6,4.9c1.2,0,2.3-0.2,3.4-0.5v-13.7h-12V111.6z"/> <path fill="#F1C9A5" d="M375,89.6c0-12.6-6.9-19.7-15.5-19.7C351,69.8,344,77,344,89.6c0,12.6,6.9,22.8,15.5,22.8 C368,112.3,375,102.1,375,89.6z"/> <path fill="#F1C9A5" d="M373.2,98.3c-2.8-0.3-4.7-3.3-4.2-6.6c0.5-3.4,3.1-5.9,5.9-5.6c2.8,0.3,4.7,3.3,4.2,6.6 C378.6,96,376,98.6,373.2,98.3z"/> <path fill="#F1C9A5" d="M340.1,92.7c-0.5-3.4,1.4-6.3,4.2-6.6c2.8-0.3,5.5,2.2,5.9,5.6c0.5,3.4-1.4,6.3-4.2,6.6 C343.2,98.6,340.5,96,340.1,92.7z"/> </g> <path fill="#10303F" d="M360.4,66c-9.2,0-17.6,10.3-17.6,20c0,0,0,0.1,0,0.1h8.7l0.8-6.5v6.5h8.8v-6.5l1.5,6.5h5.6v-5.4l1.3,5.4 h6.6c0,0,0-0.1,0-0.1C376.2,76.3,369.6,66,360.4,66z"/> <path fill="#10303F" d="M369.9,72.7c0,0,8.2-18,20-8.6c11.8,9.4-8.4,38.5,9.5,36.7c-6.4,6.7-15,3-15.8-11.8 c-0.7-14.8-7.4-9.6-7.4-9.6"/> <path fill="#10303F" d="M349.3,72.7c0,0-8.2-18-20-8.6c-11.8,9.4,8,38-9.9,36.2c6.4,6.7,15.4,3.6,16.1-11.2 c0.7-14.8,7.4-9.6,7.4-9.6"/> <path fill="#FAE43E" d="M359,73c8,0,14.6,4.6,16,10.7c0.2-0.7,0.3-1.5,0.3-2.3c0-7.1-7.3-12.9-16.2-12.9 c-9,0-16.2,5.8-16.2,12.9c0,0.8,0.1,1.5,0.3,2.3C344.4,77.6,351,73,359,73z"/> <path fill="#B3B10A" d="M385,126c-0.9-1.7-3.1-3.3-5.9-4.6c-4.3,0.8-11.5,1.3-19.6,1.3c-8.1,0-15.3-0.5-19.6-1.3 c-2.8,1.3-5,2.9-5.9,4.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2C389.7,146.5,388.2,134.2,385,126z"/> </g> </g> <g class="usr" id="usr4"> <circle fill="#FFFFFF" cx="216.7" cy="150.9" r="53.3"/> <g> <defs> <circle id="SVGID_17_" cx="216.7" cy="150.9" r="53.3"/> </defs> <clipPath id="SVGID_18_"> <use xlink:href="#SVGID_17_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_18_)"> <g> <ellipse fill="#10303F" cx="216.7" cy="143.8" rx="20.8" ry="22"/> <path fill="#F1C9A5" d="M242.2,183.7c-3.4-6.5-25.5-10.6-25.5-10.6s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2 C246.9,204.2,245.5,191.9,242.2,183.7z"/> <rect x="210.7" y="159.9" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M210.7,169.2c1.1,3.1,5.4,4.9,8.6,4.9c1.2,0,2.3-0.2,3.4-0.5v-13.7h-12V169.2z"/> <path fill="#F1C9A5" d="M232.2,147.2c0-12.6-6.9-19.7-15.5-19.7c-8.5,0-15.5,7.1-15.5,19.7c0,12.6,6.9,22.8,15.5,22.8 C225.3,169.9,232.2,159.7,232.2,147.2z"/> <path fill="#F1C9A5" d="M230.4,155.9c-2.8-0.3-4.7-3.5-4.2-7.2c0.5-3.6,3.1-6.4,5.9-6c2.8,0.3,4.7,3.5,4.2,7.2 C235.8,153.5,233.2,156.2,230.4,155.9z"/> <path fill="#F1C9A5" d="M197.1,149.9c-0.5-3.6,1.4-6.9,4.2-7.2c2.8-0.3,5.5,2.4,5.9,6c0.5,3.6-1.4,6.9-4.2,7.2 C200.2,156.2,197.5,153.5,197.1,149.9z"/> <path fill="#BF0020" d="M242.2,183.7c-1.2-2.2-4.4-4.1-8.2-5.7c-1.9,7.8-8.9,13.5-17.3,13.5c-8.4,0-15.4-5.8-17.3-13.5 c-3.8,1.6-7.1,3.5-8.2,5.7c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2C246.9,204.2,245.5,191.9,242.2,183.7z"/> <path fill="#10303F" d="M216.7,125.3c0,0-21.1,1.6-17.2,19.8c0,0,14-2.2,17.2-9.9c3.1,7.7,17.2,9.9,17.2,9.9 C237.8,126.9,216.7,125.3,216.7,125.3z"/> </g> <circle fill="#10303F" cx="216.7" cy="123.5" r="10.5"/> <g> <g> <path fill="none" stroke="#FFFFFF" stroke-width="1.8263" stroke-linecap="round" stroke-linejoin="round" d="M207.5,175.2 C207.5,175.2,207.5,175.2,207.5,175.2"/> <path fill="none" stroke="#FFFFFF" stroke-width="1.8263" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="6.005200e-002,2.4021" d=" M207.8,177.6c1.1,4,4.7,7,9.1,7c4.8,0,8.7-3.6,9.3-8.2"/> <path fill="none" stroke="#FFFFFF" stroke-width="1.8263" stroke-linecap="round" stroke-linejoin="round" d="M226.3,175.2 C226.3,175.2,226.3,175.2,226.3,175.2"/> </g> </g> </g> </g> </g> <g class="usr" id="usr3"> <circle fill="#FFFFFF" cx="123.2" cy="263.4" r="53.3"/> <g> <defs> <circle id="SVGID_19_" cx="123.2" cy="263.4" r="53.3"/> </defs> <clipPath id="SVGID_20_"> <use xlink:href="#SVGID_19_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_20_)"> <path fill="#2E576D" d="M103.2,265.4c0,8.7-4.8,8.9-4.4,14.7c0.4,6.4,5.4,6.4,5.4,10.8c0,4.4-4.6,9.3-0.5,14 c17.8,0,19.6,0,19.6,0v-53.1L103.2,265.4z"/> <path fill="#2E576D" d="M143.2,265.1c0,8.7,4.8,8.9,4.4,14.7c-0.4,6.4-5.4,6.4-5.4,10.8c0,4.4,4.6,9.3,0.5,14 c-17.8,0-19.6,0-19.6,0v-53.1L143.2,265.1z"/> <g> <ellipse fill="#2E576D" cx="123.2" cy="256.3" rx="21.8" ry="22"/> <path fill="#F1C9A5" d="M148.7,296.2c-3.4-6.5-25.5-10.6-25.5-10.6s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2 C153.4,316.7,152,304.4,148.7,296.2z"/> <rect x="117.2" y="272.4" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M117.2,281.8c1.1,3.1,5.4,4.9,8.6,4.9c1.2,0,2.3-0.2,3.4-0.5v-13.7h-12V281.8z"/> <path fill="#F1C9A5" d="M138.7,259.7c0-12.6-6.9-19.7-15.5-19.7c-8.5,0-15.5,7.1-15.5,19.7c0,12.6,6.9,22.8,15.5,22.8 C131.8,282.5,138.7,272.3,138.7,259.7z"/> <path fill="#F1C9A5" d="M136.3,268.5c-2.8-0.3-4.7-3.5-4.2-7.2c0.5-3.6,3.1-6.4,5.9-6c2.8,0.3,4.7,3.5,4.2,7.2 C141.8,266.1,139.1,268.8,136.3,268.5z"/> <path fill="#F1C9A5" d="M104.3,262.4c-0.5-3.6,1.4-6.9,4.2-7.2c2.8-0.3,5.5,2.4,5.9,6c0.5,3.6-1.4,6.9-4.2,7.2 C107.4,268.8,104.8,266.1,104.3,262.4z"/> </g> <path fill="#2E576D" d="M139.9,258.3c0,0,0-0.1,0-0.1c0-9.7-6.6-20-15.8-20c-9.2,0-17.6,10.3-17.6,20c0,0,0,0.1,0,0.1H139.9z" /> <path fill="#FA582A" d="M153.4,316.7c0,0-1.4-12.3-4.7-20.5c-1.9-3.6-9.4-6.4-15.8-8.2l-9.8,7.7l-10.2-7.6 c-6.3,1.8-13.5,4.6-15.3,8.1c-2.5,9-4.7,20.5-4.7,20.5h30.2H153.4z"/> </g> </g> </g> <g class="usr" id="usr2"> <path fill="#FFFFFF" d="M143.9,397.6c0-29.4-23.9-53.3-53.3-53.3s-53.3,23.9-53.3,53.3c0,29.4,23.9,53.3,53.3,53.3 S143.9,427.1,143.9,397.6z"/> <g> <defs> <path id="SVGID_21_" d="M143.9,397.6c0-29.4-23.9-53.3-53.3-53.3s-53.3,23.9-53.3,53.3c0,29.4,23.9,53.3,53.3,53.3 S143.9,427.1,143.9,397.6z"/> </defs> <clipPath id="SVGID_22_"> <use xlink:href="#SVGID_21_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_22_)"> <path fill="#F1C9A5" d="M116.1,430.4c-3.4-6.5-25.5-10.6-25.5-10.6s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2 C120.7,450.9,119.3,438.6,116.1,430.4z"/> <rect x="84.5" y="406.6" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M84.5,416c1.1,3.1,5.4,4.9,8.7,4.9c1.2,0,2.3-0.2,3.4-0.5v-13.7h-12V416z"/> <path fill="#F1C9A5" d="M106,393.9c0-12.6-6.9-19.7-15.5-19.7s-15.5,7.1-15.5,19.7c0,12.6,6.9,22.8,15.5,22.8 S106,406.5,106,393.9z"/> <path fill="#F1C9A5" d="M103.6,402.6c-2.8-0.3-4.7-3.5-4.2-7.2c0.5-3.6,3.1-6.4,5.9-6c2.8,0.3,4.7,3.5,4.2,7.2 C109.1,400.2,106.4,403,103.6,402.6z"/> <path fill="#F1C9A5" d="M71.6,396.6c-0.5-3.6,1.4-6.9,4.2-7.2c2.8-0.3,5.5,2.4,5.9,6c0.5,3.6-1.4,6.9-4.2,7.2 C74.7,403,72.1,400.2,71.6,396.6z"/> <path fill="#0F303F" d="M83.2,411.2c0,0-6.7-5.4-5.2-12.6c1.5-7.2,5.2-8.4,5.2-11.6c6.2,7.4,11.6,12.6,21.5,9.9 c3,1.7-0.7,10.6-5.2,15.3c12.6-6.9,27.2-32.3-3.2-42.2C65.9,360.1,57.3,409.7,83.2,411.2z"/> <path fill="#F3641E" d="M90.5,382c8,0,14.6,5.8,16,13.4c0.2-0.9,0.3-1.9,0.3-2.9c0-9-7.3-16.2-16.2-16.2 c-9,0-16.2,7.3-16.2,16.2c0,1,0.1,1.9,0.3,2.9C75.9,387.8,82.6,382,90.5,382z"/> <path fill="#FA582A" d="M78.8,422.8c2.2,1.2,7.2,3.6,11.8,3.6c6,0,13.9-2.9,13.9-2.9l-1.1-0.3c-2.5-0.8-4.9-1.5-7-2 c-6,3.6-11.8,0.1-11.8,0.1C82.8,421.6,80.8,422.2,78.8,422.8z"/> <path fill="#1594A3" d="M116.1,430.4c-1.2-2.2-4.5-4.1-8.3-5.7c-2.1,7.5-9,13-17.2,13c-8.2,0-15.1-5.5-17.2-13 c-3.9,1.6-7.1,3.5-8.3,5.7c-2.5,9-4.7,20.5-4.7,20.5h30.2h30.2C120.7,450.9,119.3,438.6,116.1,430.4z"/> </g> </g> </g> <g class="usr" id="usr1"> <g> <defs> <path id="SVGID_23_" d="M176.3,537.1c0-29.4-23.9-53.3-53.3-53.3s-53.3,23.9-53.3,53.3c0,29.4,23.9,53.3,53.3,53.3 S176.3,566.5,176.3,537.1z"/> </defs> <use xlink:href="#SVGID_23_" overflow="visible" fill="#FFFFFF"/> <clipPath id="SVGID_24_"> <use xlink:href="#SVGID_23_" overflow="visible"/> </clipPath> <g clip-path="url(#SVGID_24_)"> <g> <path fill="#F1C9A5" d="M148.6,569.8c-3.4-6.5-25.5-10.6-25.5-10.6s-22.1,4.1-25.5,10.6c-2.5,9-4.7,20.5-4.7,20.5H123h30.2 C153.2,590.3,151.8,578,148.6,569.8z"/> <rect x="117" y="546" fill="#F1C9A5" width="12" height="20.1"/> <path opacity="0.1" fill="#DDAC8C" d="M117,555.4c1.1,3.1,5.4,4.9,8.6,4.9c1.2,0,2.3-0.2,3.4-0.5V546h-12V555.4z"/> <path fill="#F1C9A5" d="M138.5,533.4c0-12.6-6.9-19.7-15.5-19.7s-15.5,7.1-15.5,19.7c0,16.9,6.9,22.8,15.5,22.8 S138.5,549.5,138.5,533.4z"/> <path fill="#F1C9A5" d="M136.1,542.1c-2.8-0.3-4.7-3.3-4.2-6.7c0.5-3.4,3.1-6,5.9-5.7c2.8,0.3,4.7,3.3,4.2,6.7 C141.6,539.8,138.9,542.4,136.1,542.1z"/> <path fill="#F1C9A5" d="M104.1,536.4c-0.5-3.4,1.4-6.4,4.2-6.7c2.8-0.3,5.5,2.3,5.9,5.7c0.5,3.4-1.4,6.4-4.2,6.7 C107.2,542.4,104.6,539.8,104.1,536.4z"/> </g> <path fill="#3595BB" d="M148.6,569.8c-2-3.8-10.4-6.8-17-8.6L123,571l-8.5-9.8c-6.6,1.8-15,4.8-17,8.6 c-2.5,9-4.7,20.5-4.7,20.5H123h30.2C153.2,590.3,151.8,578,148.6,569.8z"/> <path fill="#262421" d="M110.1,539.4c0,0,10.9-7.5,12.2-11.6c-0.1,3.7,0,7.1,0,7.1s10.7-10.5,9.6-19.1 c-12.1-6.4-21.5,1-23.6,4.5C106.1,523.7,105.6,533.3,110.1,539.4z"/> <path fill="#262421" d="M130.4,519.2c0,0,5,6,6,18.1c3.6-5.3,7.5-20.6-4.5-21.6C130.9,517.7,130.4,519.2,130.4,519.2z"/> <path fill="#FFFFFF" d="M134.1,573.1l-6.7-6.2L123,571l7.3-10.4c0,0,2.4,0.3,3.2,2.8C133.8,567.6,134.1,573.1,134.1,573.1z"/> <polygon fill="#27AAE1" points="120.7,590.3 123,590.3 123,571 120.7,568.8"/> <path fill="#FFFFFF" d="M112,573.1l6.7-6.2l4.4,4.2l-7.3-10.4c0,0-2.4,0.3-3.2,2.8C112.3,567.6,112,573.1,112,573.1z"/> </g> </g> </g> </g> </g> </svg> </div> <script src='//production-assets.codepen.io/assets/common/stopExecutionOnTimeout-b2a7b3fe212eaa732349046d8416e00a9dec26eb7fd347590fbced3ab38af52e.js'></script><script src='https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.5/TweenMax.min.js'></script><script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script> <script >$(document).ready(function(){ var screenHeight = window.innerHeight; TweenMax.set($("svg"), { visibility: "visible", height: screenHeight }); TweenMax.set($(".btnContainer"), { visibility: "visible", top: ( screenHeight / 2 - 110) }); var tl = new TimelineMax(); tl.from("#handAndMobile", 0.3, { y: "-200", opacity: 0, ease: Power4.easeOut }).from("#Mobile", 0.4 , { y: "-150", opacity: 0 }).staggerFrom(".usr", 0.6, { cycle: { x:[-100,100], y:[100,-100] }, opacity: 0, ease: Elastic.easeInOut.config(1, 0.6) }, 0.2).from("#lineMekat3", 0.2, { opacity: 0 }).to("#lineMekat3", 0.4, { rotation: 360 , transformOrigin: "50% 50%" }).staggerFrom(".icon", 0.2, { cycle: { y:[500,-500] }, opacity: 0, ease: Elastic.easeInOut.config(1, 0.4) }, 0.1).from(".rectInMobile", 0.2, { transformOrigin: "50% 50%", scale: 0 }).from(".imgInMobile", 0.2, { transformOrigin: "50% 50%", scale: 0 }).staggerFrom(".iconInMobile", 1, { cycle: { x:[-100,100] }, opacity: 0, ease: Elastic.easeInOut.config(1, 0.1) }, 0.2); // btns animation var tl2 = new TimelineMax(); tl2.staggerFrom(".btnContainer p", 0.5, { cycle: { y:[500,-500] }, opacity: 0 }, 0.3); // end document.getElementById('restart').addEventListener('click', function() { tl.restart(); }, false); document.getElementById('reverse').addEventListener('click', function() { tl.reverse(); }, false); document.getElementById('pause').addEventListener('click', function() { tl.pause(); }, false); document.getElementById('resume').addEventListener('click', function() { tl.resume(); }, false); }); //# sourceURL=pen.js </script> </body></html>

Related: See More


Questions / Comments: