<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-EN-Compatible" content="IE=EDGE"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" sizes="57x57" href="img/favicon/x-icon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="img/favicon/x-icon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="img/favicon/x-icon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="img/favicon/x-icon/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="img/favicon/x-icon/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="img/favicon/x-icon/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="img/favicon/x-icon/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="img/favicon/x-icon/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="img/favicon/x-icon/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="img/favicon/x-icon/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon/x-icon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="img/favicon/x-icon/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon/x-icon/favicon-16x16.png">
<meta name="msapplication-TileImage" content="img/favicon/x-icon/ms-icon-144x144.png">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-navbutton-color" content="#ffffff">
<meta name="apple-mobile-web-app-status-bar-style" content="#ffffff">
<meta name="theme-color" content="#ffffff">
<title>Title</title>
<meta name="description" content="description">
<meta name="keywords" content="keywords">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/jquery.formstyler.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/animate.css">
</head>
<body>
<header class="header">
<div class="wrapper">
<div class="header-top">
<a href="#" class="logo">
<div class="logo-image"><img src="img/logo.png" alt=""></div>
<div class="logo-text"><img src="img/logo-text.png" alt="WOW making"></div>
</a>
<button class="menu-toggle"><span></span><span></span><span></span></button>
</div>
<ul class="list-unstyled menu">
<li class="menu-item current-menu-item"><a href="#">Apps</a></li>
<li class="menu-item" ><a href="#">Partners</a></li>
<li class="menu-item" ><a href="#">About</a></li>
<li class="menu-item" ><a href="#">Careers</a></li>
<li class="menu-item" ><a href="#">Contact us</a></li>
</ul>
</div>
</header>
<div class="top-block">
<div class="wrapper">
<div class="for-chat text-center">
<div>
<div class="layer-chat message-site">
Hello my friend!
</div>
</div>
<div>
<div class="layer-chat message-user">
Lorem ipsum dolor sit amet, consectetur adipiscing elit
</div>
</div>
<div>
<div class="layer-chat message-site-with-button">
<a href="#" class="button-join-our-team" data-toggle="scroll" data-target="#team"><span>Join our team</span></a>
</div>
</div>
</div>
<div class="for-dragon-center">
<div class="title-dragon-center">
One second<span>...</span><i class="fa fa-pencil" aria-hidden="true"></i>
</div>
<div class="dragon-hello"></div>
</div>
</div>
</div>
<section id="what-we-do" class="what-we-do">
<div class="wrapper">
<h1 class="title-section">What we do</h1>
<div class="description-section description-what-we-do text-center">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet.
Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar
sic tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus pronin
sapien nunc accuan eget.
</div>
</div>
</section>
<div class="join">
<div class="slider-what-we-do owl-carousel">
<div class="item" data-item="0">
<div class="wwd-item ">
<div class="slide-wrap">
<div class="image-wwd wwd-element1"><img data-src="img/apps/wwd1.png" class="lazyload" alt="img"></div>
<div class="icon-service wwdicon1"><div><img data-src="img/apps/wwd1icon.png" class="lazyload" alt="img"></div></div>
<div class="wwd-item-text">
<div class="short-name-service">Bugger</div>
<div class="description-service">Short app description will be placed here</div>
</div>
<div class="links-download-app">
<a href="#" class="iphone"><img data-src="img/iphone.png" class="lazyload" alt="img"></a>
<a href="#" class="android"><img data-src="img/android.png" class="lazyload" alt="img"></a>
</div>
</div>
</div>
</div>
<div class="item" data-item="1">
<div class="wwd-item">
<div class="slide-wrap">
<div class="image-wwd wwd-element2"><img data-src="img/apps/wwd2.png" class="lazyload" alt="img"></div>
<div class="icon-service wwdicon2"><div><img data-src="img/apps/wwd2icon.png" class="lazyload" alt="img"></div></div>
<div class="wwd-item-text">
<div class="short-name-service">Frontera</div>
<div class="description-service">Short app description will be placed here</div>
</div>
<div class="links-download-app">
<a href="#" class="iphone"><img data-src="img/iphone.png" class="lazyload" alt="img"></a>
<a href="#" class="android"><img data-src="img/android.png" class="lazyload" alt="img"></a>
</div>
</div>
</div>
</div>
<div class="item" data-item="2">
<div class="wwd-item">
<div class="slide-wrap">
<div class="image-wwd wwd-element3"><img data-src="img/apps/wwd3.png" class="lazyload" alt="img"></div>
<div class="icon-service wwdicon3"><div><img data-src="img/apps/wwd3icon.png" class="lazyload" alt="img"></div></div>
<div class="wwd-item-text">
<div class="short-name-service">Pixel Arena</div>
<div class="description-service">Short app description will be placed here</div>
</div>
<div class="links-download-app">
<a href="#" class="iphone"><img data-src="img/iphone.png" class="lazyload" alt="img"></a>
<a href="#" class="android"><img data-src="img/android.png" class="lazyload" alt="img"></a>
</div>
</div>
</div>
</div>
<div class="item" data-item="3">
<div class="wwd-item">
<div class="slide-wrap">
<div class="image-wwd wwd-element4"><img data-src="img/apps/wwd4.png" class="lazyload" alt="img"></div>
<div class="icon-service wwdicon4"><div><img data-src="img/apps/wwd4icon.png" class="lazyload" alt="img"></div></div>
<div class="wwd-item-text">
<div class="short-name-service">Iscanner</div>
<div class="description-service">Short app description will be placed here</div>
</div>
<div class="links-download-app">
<a href="#" class="iphone"><img data-src="img/iphone.png" class="lazyload" alt="img"></a>
<a href="#" class="android"><img data-src="img/android.png" class="lazyload" alt="img"></a>
</div>
</div>
</div>
</div>
<div class="item" data-item="4">
<div class="wwd-item">
<div class="slide-wrap">
<div class="image-wwd wwd-element5"><img data-src="img/apps/wwd5.png" class="lazyload" alt="img"></div>
<div class="icon-service wwdicon5"><div><img data-src="img/apps/wwd5icon.png" class="lazyload" alt="img"></div></div>
<div class="wwd-item-text">
<div class="short-name-service">Aliexpress</div>
<div class="description-service">Short app description will be placed here</div>
</div>
<div class="links-download-app">
<a href="#" class="iphone"><img data-src="img/iphone.png" class="lazyload" alt="img"></a>
<a href="#" class="android"><img data-src="img/android.png" class="lazyload" alt="img"></a>
</div>
</div>
</div>
</div>
<div class="item" data-item="5">
<div class="wwd-item">
<div class="slide-wrap">
<div class="image-wwd wwd-element6"><img data-src="img/apps/wwd6.png" class="lazyload" alt="img"></div>
<div class="icon-service wwdicon6"><div><img data-src="img/apps/wwd6icon.png" class="lazyload" alt="img"></div></div>
<div class="wwd-item-text">
<div class="short-name-service">Global Job</div>
<div class="description-service">Short app description will be placed here</div>
</div>
<div class="links-download-app">
<a href="#" class="iphone"><img data-src="img/iphone.png" class="lazyload" alt="img"></a>
<a href="#" class="android"><img data-src="img/android.png" class="lazyload" alt="img"></a>
</div>
</div>
</div>
</div>
<div class="item" data-item="6">
<div class="wwd-item">
<div class="slide-wrap">
<div class="image-wwd wwd-element7"><img data-src="img/apps/wwd7.png" class="lazyload" alt="img"></div>
<div class="icon-service wwdicon7"><div><img data-src="img/apps/wwd7icon.png" class="lazyload" alt="img"></div></div>
<div class="wwd-item-text">
<div class="short-name-service">WiFi Bell</div>
<div class="description-service">Short app description will be placed here</div>
</div>
<div class="links-download-app">
<a href="#" class="iphone"><img data-src="img/iphone.png" class="lazyload" alt="img"></a>
<a href="#" class="android"><img data-src="img/android.png" class="lazyload" alt="img"></a>
</div>
</div>
</div>
</div>
<div class="item" data-item="7">
<div class="wwd-item">
<div class="slide-wrap">
<div class="image-wwd wwd-element6"><img data-src="img/apps/wwd6.png" class="lazyload" alt="img"></div>
<div class="icon-service wwdicon6"><div><img data-src="img/apps/wwd6icon.png" class="lazyload" alt="img"></div></div>
<div class="wwd-item-text">
<div class="short-name-service">Global Job</div>
<div class="description-service">Short app description will be placed here</div>
</div>
<div class="links-download-app">
<a href="#" class="iphone"><img data-src="img/iphone.png" class="lazyload" alt="img"></a>
<a href="#" class="android"><img data-src="img/android.png" class="lazyload" alt="img"></a>
</div>
</div>
</div>
</div>
<div class="item" data-item="8">
<div class="wwd-item">
<div class="slide-wrap">
<div class="image-wwd wwd-element7"><img data-src="img/apps/wwd7.png" class="lazyload" alt="img"></div>
<div class="icon-service wwdicon7"><div><img data-src="img/apps/wwd7icon.png" class="lazyload" alt="img"></div></div>
<div class="wwd-item-text">
<div class="short-name-service">WiFi Bell</div>
<div class="description-service">Short app description will be placed here</div>
</div>
<div class="links-download-app">
<a href="#" class="iphone"><img data-src="img/iphone.png" class="lazyload" alt="img"></a>
<a href="#" class="android"><img data-src="img/android.png" class="lazyload" alt="img"></a>
</div>
</div>
</div>
</div>
</div>
<div class="wrapper">
<div class="want-to-join-us">
<h3>Want to make these apps with us? Become part of the team!</h3>
<a href="#" data-toggle="scroll" data-target="#team" class="btn btn-with-icon">Join us<i class="fa fa-check" aria-hidden="true"></i></a>
</div>
</div>
</div>
<section id="about-our-company" class="about">
<div class="wrapper">
<h1 class="title-section">about our company</h1>
<div class="description-section description-company">
Vivamus condimentum justo nulla, sit amet malesuada augue tincidunt sagittis. Fusce pretium dignissim tortor, tempor sollicitudin lacus molestie tristique. Nulla bibendum sapien neque, at vehicula elit consectetur nec.
</div>
<ul class="about-list list-untyled">
<li class="about-item">
<div class="about-list-image">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
<style type="text/css">
.st0{fill:url(#SVGID_1_4);}
.st2{fill:#E56565;}
.st1{fill:#3F3A34;}
#st-circle{
-webkit-transform-origin: 31.5px 47.5px;
transform-origin: 31.5px 47.5px;
-webkit-animation: 3s st-circle linear infinite;
animation: 3s st-circle linear infinite;
}
@-webkit-keyframes st-circle {
0%{-webkit-transform: rotate(0deg);}
100%{-webkit-transform: rotate(360deg);}
}
@keyframes st-circle {
0%{transform: rotate(0deg);}
100%{transform: rotate(360deg);}
}
#st-col1, #st-col2, #st-col3, #st-col4{
-webkit-transform-origin: 10.5px 63.5px;
transform-origin: 10.5px 63.5px ;
-webkit-animation: 3s st-columns linear infinite;
animation: 3s st-columns linear infinite;
}
#st-col2{
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s;
}
#st-col3{
-webkit-animation-delay: 0.4s;
animation-delay: 0.4s;
}
#st-col4{
-webkit-animation-delay: 0.6s;
animation-delay: 0.6s;
}
@-webkit-keyframes st-columns {
0%{-webkit-transform: scale(1, 0); opacity: 1;}
12%{-webkit-transform: scale(1, 1); opacity: 1;}
15%{-webkit-transform: scale(1, 1.05); opacity: 1;}
18%{-webkit-transform: scale(1, 1); opacity: 1;}
50%{-webkit-transform: scale(1, 1); opacity: 1;}
65%, 100%{-webkit-transform: scale(1, 1); opacity: 0;}
}
@keyframes st-columns {
0%{transform: scale(1, 0); opacity: 1;}
12%{transform: scale(1, 1); opacity: 1;}
15%{transform: scale(1, 1.05); opacity: 1;}
18%{transform: scale(1, 1); opacity: 1;}
50%{transform: scale(1, 1); opacity: 1;}
65%, 100%{transform: scale(1, 1); opacity: 0;}
}
</style>
<linearGradient id="SVGID_1_4" gradientUnits="userSpaceOnUse" x1="20.2923" y1="238.6078" x2="42.7368" y2="216.1633" gradientTransform="matrix(1 0 0 1 0 -180)">
<stop offset="0" style="stop-color:#FCCA29"></stop>
<stop offset="1" style="stop-color:#88FF73"></stop>
</linearGradient>
<path class="st0" d="M31.5,31.5c-8.8,0-15.9,7.1-15.9,15.9s7.1,15.9,15.9,15.9s15.9-7.1,15.9-15.9S40.2,31.5,31.5,31.5z M31.5,54
c-3.7,0-6.6-3-6.6-6.6c0-3.7,3-6.6,6.6-6.6s6.6,3,6.6,6.6S35.1,54,31.5,54z"></path>
<g>
<rect x="71.2" y="72.5" class="st1" width="2.6" height="2.6"></rect>
<path class="st1" d="M28.8,19.6h42.3v2.6h2.6v-6.6c0-3.6-3-6.6-6.6-6.6H32.8c-3.6,0-6.6,3-6.6,6.6v6.6h2.6V19.6z M32.8,11.6h34.4
c2.2,0,4,1.8,4,4v1.3H28.8v-1.3C28.8,13.4,30.6,11.6,32.8,11.6z"></path>
<rect x="26.2" y="72.5" class="st1" width="2.6" height="2.6"></rect>
<path class="st1" d="M26.2,84.4c0,3.6,3,6.6,6.6,6.6h34.4c3.6,0,6.6-3,6.6-6.6v-6.6H26.2V84.4z M28.8,80.4h42.3v4c0,2.2-1.8,4-4,4
H32.8c-2.2,0-4-1.8-4-4V80.4z"></path>
<rect x="43.4" y="83.1" class="st1" width="13.2" height="2.6"></rect>
<path class="st1" d="M9,24.9v45h82v-45C91,24.9,9,24.9,9,24.9z M88.4,67.2H11.6V27.5h76.7v39.7H88.4z"></path>
<path id="st-circle" class="st1" d="M31.5,64.5c9.5,0,17.2-7.7,17.2-17.2S41,30.2,31.5,30.2s-17.2,7.7-17.2,17.2S22,64.5,31.5,64.5
z M31.5,61.9c-2.6,0-5.1-0.7-7.2-1.9l3.8-5.5c1,0.5,2.2,0.8,3.4,0.8c3.9,0,7.2-2.9,7.8-6.6H46C45.3,56.1,39.1,61.9,31.5,61.9z
M31.5,42.1c2.9,0,5.3,2.4,5.3,5.3s-2.4,5.3-5.3,5.3s-5.3-2.4-5.3-5.3S28.6,42.1,31.5,42.1z M46,46h-6.7c-0.6-3.3-3.2-5.9-6.5-6.5
v-6.7C39.8,33.5,45.3,39.1,46,46z M30.2,32.9v6.7c-3.7,0.6-6.6,3.9-6.6,7.8c0,2.2,0.9,4.2,2.4,5.6l-3.8,5.5
C19,55.8,17,51.8,17,47.4C16.9,39.8,22.8,33.5,30.2,32.9z"></path>
</g>
<g id="asd">
<path class="st2" id="st-col1" d="M59.3,40.8h-7.9v23.8h7.9h2.6v-2.7V40.8H59.3z M59.3,61.9H54V43.4h5.3V61.9z"></path>
<path class="st2" id="st-col2" d="M69.8,61.9V46v-2.6v-7.9H59.3v5.3h0v2.6h0v18.5h0v2.7h0h2.6h5.3h2.6V61.9z M67.2,43.4v18.5h-5.3V40.7v-2.6h5.3
V43.4z"></path>
<path class="st2" id="st-col3" d="M67.2,43.5v18.4v2.7h2.6h5.3h2.6h0.1v-2.7V43.5H67.2z M75.1,61.9h-5.3V46h5.3V61.9z"></path>
<path class="st2" id="st-col4" d="M75.1,30.2v13.2V46v15.9v2.7h2.6h7.9V30.2H75.1z M83.1,61.9h-5.3V43.4V32.8h5.3V61.9z"></path>
</g>
</svg>
</div>
<div class="about-item-title">
Donec aliquet nibh neque
</div>
<div class="about-item-text">
Suspendisse pharetra sapien quis tellus lobortis facilisis. Quisque id ornare ligula.
</div>
</li>
<li class="about-item">
<div class="about-list-image">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
<style type="text/css">
.st10{fill:#E56565;}
.st11{fill:#3F3A34;}
.st12{fill:url(#SVGID_1_6);}
.st13{fill:url(#SVGID_2_6);}
#settings-gear1, #settings-gear2, #settings-gear3{
-webkit-transform-origin: 31.5px 39.5px;
transform-origin: 31.5px 39.5px;
-webkit-animation: 2.4s settings-gear linear infinite;
animation: 2.4s settings-gear linear infinite;
}
#settings-gear4, #settings-gear5, #settings-gear6{
-webkit-transform-origin: 68px 58px;
transform-origin: 68px 58px;
-webkit-animation: 2.4s settings-gear linear infinite reverse;
animation: 2.4s settings-gear linear infinite reverse;
}
@-webkit-keyframes settings-gear {
0%{-webkit-transform: rotate(0deg);}
100%{-webkit-transform: rotate(360deg);}
}
@keyframes settings-gear {
0%{transform: rotate(0deg);}
100%{transform: rotate(360deg);}
}
@-webkit-keyframes settings-dot {
0%, 10%{opacity: 0;}
30%, 50%{opacity: 1;}
65%, 100%{opacity: 0;}
}
@keyframes settings-dot {
0%, 10%{opacity: 0;}
30%, 50%{opacity: 1;}
65%, 100%{opacity: 0;}
}
#settings-dot1, #settings-dot2, #settings-dot3, #settings-dot4, #settings-dot5, #settings-dot6{
-webkit-animation: 3.6s settings-dot -0.6s linear infinite;
animation: 3.6s settings-dot -0.6s linear infinite;
}
#settings-dot2, #settings-dot5{
-webkit-animation-delay: -0.3s;
animation-delay: -0.3s;
}
#settings-dot3, #settings-dot6{
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
</style>
<g>
<rect id="settings-dot1" x="30.2" y="59.3" class="st10" width="2.6" height="2.6"></rect>
<rect id="settings-dot2" x="30.2" y="64.5" class="st10" width="2.6" height="2.6"></rect>
<rect id="settings-dot3" x="30.2" y="69.8" class="st10" width="2.6" height="2.6"></rect>
<rect id="settings-dot4" x="67.2" y="30.2" class="st10" width="2.6" height="2.6"></rect>
<rect id="settings-dot5" x="67.2" y="24.9" class="st10" width="2.6" height="2.6"></rect>
<rect id="settings-dot6" x="67.2" y="19.6" class="st10" width="2.6" height="2.6"></rect>
</g>
<path class="st11" d="M11.6,19.6H54v2.6h2.6v-6.6c0-3.6-3-6.6-6.6-6.6H15.6C12,9,9,12,9,15.6v59.5h2.6V19.6z M15.6,11.6H50
c2.2,0,4,1.8,4,4v1.3H11.6v-1.3C11.6,13.4,13.4,11.6,15.6,11.6z"></path>
<path class="st11" d="M9,84.4C9,88,12,91,15.6,91H50c3.6,0,6.6-3,6.6-6.6v-6.6H9V84.4z M11.6,80.4H54v4c0,2.2-1.8,4-4,4H15.6
c-2.2,0-4-1.8-4-4V80.4z"></path>
<rect x="26.2" y="83.1" class="st11" width="13.2" height="2.6"></rect>
<g>
<g>
<linearGradient id="SVGID_1_6" gradientUnits="userSpaceOnUse" x1="53.5531" y1="27.1015" x2="83.4791" y2="57.0275" gradientTransform="matrix(1 0 0 -1 0 100)">
<stop offset="0" style="stop-color:#FCCA29"></stop>
<stop offset="1" style="stop-color:#88FF73"></stop>
</linearGradient>
<path class="st12" id="settings-gear6" d="M89.7,61.9V54l-6.2-1.2c-0.2-0.6-0.4-1.2-0.7-1.7l3.5-5.2l-5.6-5.6l-5.2,3.5c-0.6-0.3-1.1-0.5-1.7-0.7
l-1.2-6.2h-7.9L63.3,43c-0.6,0.2-1.2,0.4-1.7,0.7l-5.2-3.5l-5.6,5.6l3.5,5.2c-0.3,0.6-0.5,1.1-0.7,1.7L47.4,54v7.9l6.2,1.2
c0.2,0.6,0.4,1.2,0.7,1.7l-3.5,5.2l5.6,5.6l5.2-3.5c0.6,0.3,1.1,0.5,1.7,0.7l1.2,6.2h7.9l1.2-6.2c0.6-0.2,1.2-0.4,1.7-0.7l5.2,3.5
l5.6-5.6l-3.5-5.2c0.3-0.6,0.5-1.1,0.7-1.7L89.7,61.9z M68.5,64.5c-3.7,0-6.6-3-6.6-6.6c0-3.7,3-6.6,6.6-6.6s6.6,3,6.6,6.6
C75.1,61.6,72.2,64.5,68.5,64.5z"></path>
<path class="st11" id="settings-gear5" d="M91,63V52.9l-6.5-1.3c-0.2-0.4-0.3-0.8-0.5-1.1l-2.4,1.2c0.2,0.5,0.5,1,0.6,1.6l0.2,0.7l5.9,1.2v5.8L82.5,62
l-0.2,0.7c-0.2,0.5-0.4,1-0.6,1.6l-0.3,0.7l3.3,5L80.5,74l-5-3.3L74.8,71c-0.5,0.2-1,0.5-1.6,0.6l-0.7,0.2l-1.2,5.9h-5.8l-1.2-5.9
l-0.7-0.2c-0.5-0.2-1-0.4-1.6-0.6l-0.7-0.3l-5,3.3l-4.8-4.8L49.8,71l6.4,6.4l5.5-3.7c0.1,0.1,0.3,0.1,0.4,0.2l1.3,6.5h10.1
l1.3-6.5c0.1-0.1,0.3-0.1,0.4-0.2l5.5,3.7l7.1-7.1l-3.7-5.5c0.1-0.1,0.1-0.3,0.2-0.4L91,63z"></path>
<path class="st11" id="settings-gear4" d="M49,45.6l3.7,5.5c-0.1,0.1-0.1,0.3-0.2,0.4L46,52.9V63l6.5,1.3c0.2,0.4,0.3,0.8,0.5,1.1l2.4-1.2
c-0.2-0.5-0.5-1-0.6-1.6L54.5,62l-5.9-1.2v-5.8l5.9-1.2l0.2-0.7c0.2-0.5,0.4-1,0.6-1.6l0.3-0.7l-3.3-5l4.1-4.1l5,3.3l0.7-0.3
c0.5-0.2,1-0.5,1.6-0.7l0.7-0.2l1.2-5.9h5.8l1.2,5.9l0.7,0.2c0.5,0.2,1.1,0.4,1.6,0.7l0.7,0.3l5-3.3l4.8,4.8l1.9-1.9l-6.4-6.4
l-5.5,3.7C75.2,42.1,75,42,74.9,42l-1.3-6.5H63.5L62.2,42c-0.1,0.1-0.3,0.1-0.4,0.2l-5.5-3.7L49,45.6z"></path>
</g>
<path class="st11" d="M68.5,50c-4.4,0-7.9,3.6-7.9,7.9s3.6,7.9,7.9,7.9s7.9-3.6,7.9-7.9S72.9,50,68.5,50z M68.5,63.2
c-2.9,0-5.3-2.4-5.3-5.3c0-2.9,2.4-5.3,5.3-5.3s5.3,2.4,5.3,5.3C73.8,60.9,71.4,63.2,68.5,63.2z"></path>
</g>
<g>
<linearGradient id="SVGID_2_6" gradientUnits="userSpaceOnUse" x1="20.2614" y1="49.3589" x2="42.7063" y2="71.8037" gradientTransform="matrix(1 0 0 -1 0 100)">
<stop offset="0" style="stop-color:#FCCA29"></stop>
<stop offset="1" style="stop-color:#88FF73"></stop>
</linearGradient>
<path id="settings-gear3" class="st13" d="M47.4,42.1v-5.3l-4.5-0.9c-0.2-0.7-0.5-1.3-0.8-2l2.6-3.8l-3.7-3.7L37,28.9c-0.6-0.3-1.3-0.6-2-0.8l-0.9-4.5
h-5.3l-0.9,4.5c-0.7,0.2-1.3,0.5-2,0.8l-3.8-2.6l-3.7,3.7l2.6,3.8c-0.3,0.6-0.6,1.3-0.8,2l-4.5,0.9v5.3l4.5,0.9
c0.2,0.7,0.5,1.3,0.8,2l-2.6,3.8l3.7,3.7L26,50c0.6,0.3,1.3,0.6,2,0.8l0.9,4.5h5.3l0.9-4.5c0.7-0.2,1.3-0.5,2-0.8l3.8,2.6l3.7-3.7
L42,44.9c0.3-0.6,0.6-1.3,0.8-2L47.4,42.1z M31.5,44.7c-2.9,0-5.3-2.4-5.3-5.3c0-2.9,2.4-5.3,5.3-5.3s5.3,2.4,5.3,5.3
C36.8,42.3,34.4,44.7,31.5,44.7z"></path>
<path class="st11" d="M31.5,32.8c-3.6,0-6.6,3-6.6,6.6s3,6.6,6.6,6.6s6.6-3,6.6-6.6S35.1,32.8,31.5,32.8z M31.5,43.4
c-2.2,0-4-1.8-4-4c0-2.2,1.8-4,4-4s4,1.8,4,4C35.5,41.6,33.7,43.4,31.5,43.4z"></path>
<path class="st11" id="settings-gear1" d="M26.1,51.5c0.2,0.1,0.5,0.2,0.7,0.3l1,4.8h7.5l1-4.8c0.2-0.1,0.5-0.2,0.7-0.3l4.1,2.7l5.3-5.3l-2.7-4.1
c0.1-0.2,0.2-0.5,0.3-0.7l4.8-1v-7.5l-4.8-1c-0.2-0.5-0.4-1-0.7-1.4l-2.3,1.2c0.3,0.6,0.6,1.2,0.7,1.8l0.2,0.7l4.2,0.8V41l-4.2,0.8
l-0.2,0.7c-0.2,0.6-0.4,1.2-0.7,1.8L40.5,45l2.4,3.6l-2.2,2.2l-3.6-2.4l-0.7,0.4c-0.6,0.3-1.2,0.6-1.8,0.7l-0.7,0.2L33,54h-3.1
l-0.8-4.2l-0.7-0.2c-0.6-0.2-1.2-0.4-1.8-0.7l-0.7-0.4l-3.6,2.4l-3-3l-1.9,1.9l4.5,4.5L26.1,51.5z"></path>
<path class="st11" id="settings-gear2" d="M14.3,35.7v7.5l4.8,1c0.2,0.5,0.4,1,0.7,1.4l2.3-1.2c-0.3-0.6-0.6-1.2-0.7-1.8l-0.2-0.7L16.9,41v-3.1l4.2-0.8
l0.2-0.7c0.2-0.6,0.4-1.2,0.7-1.8l0.4-0.7l-2.4-3.6l2.2-2.2l3.6,2.4l0.7-0.4c0.6-0.3,1.2-0.6,1.8-0.7l0.7-0.2l0.8-4.2H33l0.8,4.2
l0.7,0.2c0.6,0.2,1.2,0.4,1.8,0.7l0.7,0.4l3.6-2.4l3,3l1.9-1.9L41,24.6l-4.1,2.7c-0.2-0.1-0.5-0.2-0.7-0.3l-1-4.8h-7.5l-1,4.8
c-0.2,0.1-0.5,0.2-0.7,0.3L22,24.6l-5.3,5.3l2.7,4.1c-0.1,0.2-0.2,0.5-0.3,0.7L14.3,35.7z"></path>
</g>
</svg>
</div>
<div class="about-item-title">
Donec aliquet nibh neque
</div>
<div class="about-item-text">
Suspendisse pharetra sapien quis tellus lobortis facilisis. Quisque id ornare ligula.
</div>
</li>
<li class="about-item center ">
<div class="about-list-image about-icon">
<img data-src="img/dragon-hello.png" class="lazyload" alt="Hello">
<span class="eye eye1"></span>
<span class="eye eye2"></span>
<span class="icon icon-code-open"></span>
<span class="icon icon-code-close"></span>
</div>
<div class="about-item-text">
<p>You want to see my team?</p>
<a href="#" data-toggle="scroll" data-target="#team" class="btn">Scroll to team</a>
<div class="line-start"></div>
</div>
</li>
<li class="about-item">
<div class="about-list-image">
<div class="qr-scaner">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
<style type="text/css">
.st20{fill:#FFFFFF;}
.st21{fill:url(#SVGID_1_5);}
.st22{fill:#E56565;}
.st23{fill:#3F3A34;}
@-webkit-keyframes scanner-hor {
0%{-webkit-transform: scale(0,1);}
10%{-webkit-transform: scale(1,1);}
12%{-webkit-transform: scale(1.2,1);}
14%, 60%{-webkit-transform: scale(1,1);}
70%, 100%{-webkit-transform: scale(0));}
}
@keyframes scanner-hor {
0%{transform: scale(0,1);}
10%{transform: scale(1,1);}
12%{transform: scale(1.2,1);}
14%, 60%{transform: scale(1,1);}
70%, 100%{transform: scale(0);}
}
@-webkit-keyframes scanner-vert {
0%{-webkit-transform: scale(1,0);}
10%{-webkit-transform: scale(1,1);}
12%{-webkit-transform: scale(1,1.2);}
14%, 60%{-webkit-transform: scale(1,1);}
70%, 100%{-webkit-transform: scale(0);}
}
@keyframes scanner-vert {
0%{transform: scale(1,0);}
10%{transform: scale(1,1);}
12%{transform: scale(1,1.2);}
14%, 60%{transform: scale(1,1);}
70%, 100%{transform: scale(0);}
}
#scanner-line1{
-webkit-transform-origin: 45px 30px;
transform-origin: 45px 30px;
-webkit-animation: 3.4s scanner-vert linear infinite;
animation: 3.4s scanner-vert linear infinite;
}
#scanner-line2{
-webkit-transform-origin: 52px 31px;
transform-origin: 52px 31px;
-webkit-animation: 3.4s scanner-vert 0.4s linear infinite;
animation: 3.4s scanner-vert 0.4s linear infinite;
}
#scanner-line5{
-webkit-transform-origin: 71px 64px;
transform-origin: 71px 64px;
-webkit-animation: 3.4s scanner-hor 0.03s linear infinite;
animation: 3.4s scanner-hor 0.03s linear infinite;
}
#scanner-line5{
-webkit-transform-origin: 71px 64px;
transform-origin: 71px 64px;
-webkit-animation: 3.4s scanner-hor 0.03s linear infinite;
animation: 3.4s scanner-hor 0.03s linear infinite;
}
#scanner-line10{
-webkit-transform-origin: 29px 50px;
transform-origin: 29px 50px;
-webkit-animation: 3.4s scanner-hor 0.06s linear infinite;
animation: 3.4s scanner-hor 0.06s linear infinite;
}
#scanner-line7{
-webkit-transform-origin: 46px 69px;
transform-origin: 46px 69px;
-webkit-animation: 3.4s scanner-hor 0.09s linear infinite;
animation: 3.4s scanner-hor 0.09s linear infinite;
}
#scanner-line12{
-webkit-transform-origin: 74px 50px;
transform-origin: 74px 50px;
-webkit-animation: 3.4s scanner-hor 0.12s linear infinite;
animation: 3.4s scanner-hor 0.12s linear infinite;
}
#scanner-line8{
-webkit-transform-origin: 59px 65px;
transform-origin: 59px 65px;
-webkit-animation: 3.4s scanner-vert 0.15s linear infinite;
animation: 3.4s scanner-vert 0.15s linear infinite;
}
#scanner-line6{
-webkit-transform-origin: 74px 57px;
transform-origin: 74px 57px;
-webkit-animation: 3.4s scanner-hor 0.18s linear infinite;
animation: 3.4s scanner-hor 0.18s linear infinite;
}
#scanner-line3{
-webkit-transform-origin: 49px 44px;
transform-origin: 49px 44px;
-webkit-animation: 3.4s scanner-vert 0.21s linear infinite;
animation: 3.4s scanner-vert 0.21s linear infinite;
}
#scanner-line9{
-webkit-transform-origin: 64px 70px;
transform-origin: 64px 70px;
-webkit-animation: 3.4s scanner-vert 0.24s linear infinite;
animation: 3.4s scanner-vert 0.24s linear infinite;
}
#scanner-line11{
-webkit-transform-origin: 70px 51px;
transform-origin: 70px 51px;
-webkit-animation: 3.4s scanner-hor 0.27s linear infinite;
animation: 3.4s scanner-hor 0.27s linear infinite;
}
#scanner-line13{
-webkit-transform-origin: 48px 65px;
transform-origin: 48px 65px;
-webkit-animation: 3.4s scanner-vert 0.30s linear infinite;
animation: 3.4s scanner-vert 0.30s linear infinite;
}
#scanner-line4{
-webkit-transform-origin: 55px 55px;
transform-origin: 55px 55px;
-webkit-animation: 3.4s scanner-hor 0.33s linear infinite;
animation: 3.4s scanner-hor 0.33s linear infinite;
}
#scanner-dot1, #scanner-dot2, #scanner-dot3{
-webkit-animation: 3.4s scanner-dot -0.3s linear infinite;
animation: 3.4s scanner-dot -0.3s linear infinite;
-webkit-transform-origin: 33px 65px;
transform-origin: 33px 65px;
}
#scanner-dot2{
-webkit-animation-delay: -0.1s;
animation-delay: -0.1s;
-webkit-transform-origin: 32px 36px;
transform-origin: 32px 36px;
}
#scanner-dot3{
-webkit-animation-delay: 0.1s;
animation-delay: 0.1s;
-webkit-transform-origin: 70px 36px;
transform-origin: 70px 36px;
}
@-webkit-keyframes scanner-dot {
0%, 60%, 100%{-webkit-transform: scale(1);}
65%, 85%{-webkit-transform: scale(0);}
}
@keyframes scanner-dot {
0%, 60%, 100%{transform: scale(1);}
65%, 85%{transform: scale(0);}
}
</style>
<g>
<rect x="22.8" y="26.2" class="st20" width="18.5" height="18.5"></rect>
<rect x="59.9" y="26.3" class="st20" width="18.5" height="18.5"></rect>
<rect x="22.8" y="55.3" class="st20" width="18.5" height="18.5"></rect>
</g>
<linearGradient id="SVGID_1_5" gradientUnits="userSpaceOnUse" x1="38.6774" y1="28.8387" x2="71.7419" y2="61.9032" gradientTransform="matrix(1 0 0 -1 0 100)">
<stop offset="0" style="stop-color:#FCCA29"></stop>
<stop offset="1" style="stop-color:#88FF73"></stop>
</linearGradient>
<polygon class="st21" points="78.4,44.7 59.8,44.7 59.8,26.2 41.3,26.2 41.3,44.7 22.8,44.7 22.8,55.3 41.3,55.3 41.3,73.8
78.4,73.8 "></polygon>
<g>
<path class="st22" id="scanner-dot2" d="M37.4,40.7H26.8V30.2h10.6V40.7z M29.4,38.1h5.3v-5.3h-5.3V38.1z"></path>
<path class="st22" id="scanner-dot1" d="M37.4,69.8H26.8V59.3h10.6V69.8z M29.4,67.2h5.3v-5.3h-5.3V67.2z"></path>
<path class="st22" id="scanner-dot3" d="M74.4,40.7H63.8V30.2h10.6V40.7z M66.5,38.1h5.3v-5.3h-5.3V38.1z"></path>
</g>
<g>
<path class="st23" d="M29.4,19.6h42.3v2.6h2.6v-6.6c0-3.6-3-6.6-6.6-6.6H33.4c-3.6,0-6.6,3-6.6,6.6v6.6h2.6V19.6z M33.4,11.6h34.4
c2.2,0,4,1.8,4,4v1.3H29.4v-1.3C29.4,13.4,31.2,11.6,33.4,11.6z"></path>
<path class="st23" d="M26.8,84.4c0,3.6,3,6.6,6.6,6.6h34.4c3.6,0,6.6-3,6.6-6.6v-6.6H26.8V84.4z M29.4,80.4h42.3v4c0,2.2-1.8,4-4,4
H33.4c-2.2,0-4-1.8-4-4V80.4z"></path>
<rect x="44" y="83.1" class="st23" width="13.2" height="2.6"></rect>
<path class="st23" d="M21.5,24.9v50.3h58.2V24.9H21.5z M77,43.4H61.2V27.5H77V43.4z M40,27.5v15.9H24.1V27.5H40z M24.1,56.6H40v15.9
H24.1V56.6z M42.6,72.5V54H24.1V46h18.5V27.5h15.9V46H77v26.5H42.6z"></path>
<polygon class="st23" id="scanner-line1" points="50.6,38.1 47.9,38.1 47.9,30.2 45.3,30.2 45.3,40.7 50.6,40.7 "></polygon>
<polygon class="st23" id="scanner-line2" points="53.2,40.7 55.9,40.7 55.9,30.2 50.6,30.2 50.6,32.8 53.2,32.8 "></polygon>
<polygon class="st23" id="scanner-line3" points="47.9,51.3 50.6,51.3 50.6,43.4 45.3,43.4 45.3,46 47.9,46 "></polygon>
<polygon class="st23" id="scanner-line4" points="55.9,43.4 53.2,43.4 53.2,56.6 63.8,56.6 63.8,54 55.9,54 "></polygon>
<polygon class="st23" id="scanner-line5" points="69.1,59.3 66.5,59.3 66.5,64.5 71.7,64.5 71.7,69.8 74.4,69.8 74.4,61.9 69.1,61.9 "></polygon>
<rect x="66.5" y="54" id="scanner-line6" class="st23" width="7.9" height="2.6"></rect>
<polygon class="st23" id="scanner-line7" points="50.6,67.2 45.3,67.2 45.3,69.8 53.2,69.8 53.2,64.5 50.6,64.5 "></polygon>
<polygon class="st23" id="scanner-line8" points="50.6,61.9 55.9,61.9 55.9,69.8 58.5,69.8 58.5,59.3 50.6,59.3 "></polygon>
<rect x="61.2" y="59.3" id="scanner-line9" class="st23" width="2.6" height="10.6"></rect>
<rect x="26.8" y="48.7" id="scanner-line10" class="st23" width="15.9" height="2.6"></rect>
<rect x="58.5" y="48.7" id="scanner-line11" class="st23" width="10.6" height="2.6"></rect>
<rect x="71.7" y="48.7" id="scanner-line12" class="st23" width="2.6" height="2.6"></rect>
<rect x="45.3" y="54" id="scanner-line13" class="st23" width="2.6" height="10.6"></rect>
</g>
</svg>
</div>
</div>
<div class="about-item-title">
Donec aliquet nibh neque
</div>
<div class="about-item-text">
Suspendisse pharetra sapien quis tellus lobortis facilisis. Quisque id ornare ligula.
</div>
</li>
<li class="about-item">
<div class="about-list-image">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
<style type="text/css">
.st30{fill:url(#SVGID_1_2);}
.st31{fill:url(#SVGID_2_2);}
.st32{fill:#E56565;}
.st33{fill:#3F3A34;}
#phone-p{
-webkit-transform-origin: 32px 48px;
transform-origin: 32px 48px;
-webkit-animation: 2.4s phone-p linear infinite;
animation: 2.4s phone-p linear infinite;
}
#phone-circle, #phone-circle2, #phone-circle3{
-webkit-transform-origin: 31px 47px;
transform-origin: 31px 47px;
-webkit-animation: 2.4s phone-circle -0.8s linear infinite;
animation: 2.4s phone-circle -0.8s linear infinite;
fill: #e565654d;
}
#phone-circle2{
-webkit-animation-delay: -0.4s;
animation-delay: -0.4s;
}
#phone-circle3{
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
@-webkit-keyframes phone-p {
0% {-webkit-transform:rotate(0deg);}
5% {-webkit-transform:rotate(35deg);}
10% {-webkit-transform:rotate(-35deg);}
15% {-webkit-transform:rotate(20deg);}
20% {-webkit-transform:rotate(-20deg);}
25% {-webkit-transform:rotate(10deg);}
30% {-webkit-transform:rotate(-10deg);}
35%, 100% {-webkit-transform:rotate(0deg);}
}
@keyframes phone-p {
0% {transform:rotate(0deg);}
5% {transform:rotate(35deg);}
10% {transform:rotate(-35deg);}
15% {transform:rotate(20deg);}
20% {transform:rotate(-20deg);}
25% {transform:rotate(10deg);}
30% {transform:rotate(-10deg);}
35%, 100% {transform:rotate(0deg);}
}
@-webkit-keyframes phone-circle {
0% {-webkit-transform: scale(0);}
70%, 100% {-webkit-transform: scale(1);}
}
@keyframes phone-circle {
0% {transform: scale(0);}
70%, 100% {transform: scale(1);}
}
</style>
<path id="phone-circle" d="M53.7,47.4c0-12.4-10.1-22.5-22.5-22.5S8.7,35,8.7,47.4s10.1,22.5,22.5,22.5S53.7,59.8,53.7,47.4z M11.4,47.4
c0-10.9,8.9-19.8,19.8-19.8S51,36.4,51,47.4s-8.9,19.8-19.8,19.8S11.4,58.3,11.4,47.4z"></path>
<path id="phone-circle2" d="M53.7,47.4c0-12.4-10.1-22.5-22.5-22.5S8.7,35,8.7,47.4s10.1,22.5,22.5,22.5S53.7,59.8,53.7,47.4z M11.4,47.4
c0-10.9,8.9-19.8,19.8-19.8S51,36.4,51,47.4s-8.9,19.8-19.8,19.8S11.4,58.3,11.4,47.4z"></path>
<path id="phone-circle3" d="M53.7,47.4c0-12.4-10.1-22.5-22.5-22.5S8.7,35,8.7,47.4s10.1,22.5,22.5,22.5S53.7,59.8,53.7,47.4z M11.4,47.4
c0-10.9,8.9-19.8,19.8-19.8S51,36.4,51,47.4s-8.9,19.8-19.8,19.8S11.4,58.3,11.4,47.4z"></path>
<g>
<linearGradient id="SVGID_1_2" gradientUnits="userSpaceOnUse" x1="62.2278" y1="24.2707" x2="82.251" y2="44.2939" gradientTransform="matrix(1 0 0 -1 0 100)">
<stop offset="0" style="stop-color:#FCCA29"></stop>
<stop offset="1" style="stop-color:#88FF73"></stop>
</linearGradient>
<path class="st30" d="M87.5,61.9c-0.5-1.7-1.8-3-3.4-3.5l-5.2-1.7c-1.7,1.7-4,2.6-6.4,2.6H72c-2.4,0-4.7-1-6.4-2.6l-5.3,1.8
c-1.7,0.6-2.9,1.9-3.4,3.6L55,68.5h34.5L87.5,61.9z"></path>
<linearGradient id="SVGID_2_2" gradientUnits="userSpaceOnUse" x1="63.7528" y1="53.2166" x2="80.7664" y2="70.2302" gradientTransform="matrix(1 0 0 -1 0 100)">
<stop offset="0" style="stop-color:#FCCA29"></stop>
<stop offset="1" style="stop-color:#88FF73"></stop>
</linearGradient>
<path class="st31" d="M72.3,26.2c-6.6,0-11.9,5.3-11.9,11.9v5.3c0-1.5,1.2-2.6,2.6-2.6c3.4,0,6.6-1.3,8.9-3.7l0.3-0.3l0.3,0.3
c2.4,2.4,5.6,3.7,8.9,3.7h0.1c1.5,0,2.6,1.2,2.6,2.6v-5.3C84.2,31.5,78.8,26.2,72.3,26.2z"></path>
</g>
<path class="st32" id="phone-p" d="M37.8,60.6h-6.6c-3.6,0-6.6-3-6.6-6.6V40.7c0-3.6,3-6.6,6.6-6.6h6.6v10.6h-5.3V50h5.3V60.6z M31.2,36.8
c-2.2,0-4,1.8-4,4V54c0,2.2,1.8,4,4,4h4v-5.3h-5.3V42.1h5.3v-5.3H31.2z"></path>
<g>
<rect x="25.9" y="72.5" class="st33" width="2.6" height="2.6"></rect>
<path class="st33" d="M28.6,19.6h42.3v2.6h2.6v-6.6c0-3.6-3-6.6-6.6-6.6H32.5c-3.6,0-6.6,3-6.6,6.6v6.6h2.6V19.6z M32.5,11.6h34.4
c2.2,0,4,1.8,4,4v1.3H28.6v-1.3C28.6,13.4,30.3,11.6,32.5,11.6z"></path>
<rect x="70.9" y="72.5" class="st33" width="2.6" height="2.6"></rect>
<path class="st33" d="M25.9,84.4c0,3.6,3,6.6,6.6,6.6h34.4c3.6,0,6.6-3,6.6-6.6v-6.6H25.9V84.4z M28.6,80.4h42.3v4c0,2.2-1.8,4-4,4
H32.5c-2.2,0-4-1.8-4-4V80.4z"></path>
<rect x="43.1" y="83.1" class="st33" width="13.2" height="2.6"></rect>
<path class="st33" d="M53.7,47.4c0-12.4-10.1-22.5-22.5-22.5S8.7,35,8.7,47.4s10.1,22.5,22.5,22.5S53.7,59.8,53.7,47.4z M11.4,47.4
c0-10.9,8.9-19.8,19.8-19.8S51,36.4,51,47.4s-8.9,19.8-19.8,19.8S11.4,58.3,11.4,47.4z"></path>
<path class="st33" d="M59,38.1v5.3c0,2.2,1.8,4,4,4c0,2.1,1,4,2.6,5.3l2.5,1.9c0.7,0.5,1.5,0.8,2.4,0.8H74c0.9,0,1.7-0.3,2.4-0.8
l2.5-1.9c1.7-1.2,2.6-3.2,2.6-5.3c2.2,0,4-1.8,4-4v-5.3c0-7.3-5.9-13.2-13.2-13.2S59,30.8,59,38.1z M61.7,43.4
c0-0.7,0.6-1.3,1.3-1.3v2.6C62.3,44.7,61.7,44.1,61.7,43.4z M77.3,50.5l-2.5,1.9c-0.2,0.2-0.5,0.3-0.8,0.3h-3.5
c-0.3,0-0.6-0.1-0.8-0.3l-2.5-1.9c-1-0.7-1.6-1.9-1.6-3.2v-5.5c2.4-0.5,4.7-1.6,6.6-3.2c1.9,1.7,4.2,2.8,6.7,3.2v5.5
C78.9,48.6,78.3,49.8,77.3,50.5z M81.5,44.7v-2.6c0.7,0,1.3,0.6,1.3,1.3S82.2,44.7,81.5,44.7z M82.8,38.1v1.6
c-0.4-0.1-0.9-0.2-1.3-0.2h-0.1c-3,0-5.9-1.2-8-3.3l-1.2-1.2L71,36.1c-2.1,2.1-5,3.3-8,3.3c-0.5,0-0.9,0.1-1.3,0.2v-1.6
c0-5.8,4.7-10.6,10.6-10.6S82.8,32.3,82.8,38.1z"></path>
<path class="st33" d="M80.1,55.7V54h-2.6v2.2c-1.4,1.2-3.1,1.8-5,1.8H72c-1.9,0-3.7-0.7-5.1-1.9V54h-2.6v1.7l-4.4,1.5
c-2.1,0.7-3.7,2.4-4.3,4.5l-2.4,8.3h38l-2.5-8.3c-0.6-2.1-2.2-3.7-4.2-4.4L80.1,55.7z M86.3,62.3l1.5,4.9h-31l1.4-4.9
c0.4-1.3,1.3-2.3,2.6-2.7l4.6-1.5c1.9,1.6,4.3,2.5,6.7,2.5h0.6c2.5,0,4.8-0.9,6.7-2.4l4.5,1.5C85,60.1,85.9,61,86.3,62.3z"></path>
</g>
</svg>
</div>
<div class="about-item-title">
Donec aliquet nibh neque
</div>
<div class="about-item-text">
Suspendisse pharetra sapien quis tellus lobortis facilisis. Quisque id ornare ligula.
</div>
</li>
</ul>
</div>
</section>
<section class="careers" id="careers">
<div class="wrapper">
<h1 class="title-section">careers</h1>
<div class="description-section description-careers">
Fusce pretium libero nec dolor bibendum, nec egestas arcu aliquet. Quisque dictum vitae mi vitae iaculis. Praesent hendrerit ut sem non volutpat. Proin non sapien sit amet erat dapibus elementum. Vestibulum lectus velit, tristique eget hendrerit in, scelerisque a diam.
</div>
<ul class="career-list list-unstyled">
<li class="career-item">
<div class="block-for-image">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 80 80" style="enable-background:new 0 0 80 80;" xml:space="preserve">
<style type="text/css">
.gt0{fill:#333333;}
.gt1{fill:#E56565;}
.gt2{fill:#FFFFFF;}
.gt3{fill:#CCFF00;}
@-webkit-keyframes team-left {
0%, 15%{-webkit-transform: translateX(-18px); fill: transparent;}
30%, 75%{-webkit-transform: translateX(0px); fill: #333;}
90%, 100%{-webkit-transform: translateX(8px); fill: transparent;}
}
@keyframes team-left {
0%, 15%{transform: translateX(-18px); fill: transparent;}
30%, 75%{transform: translateX(0px); fill: #333;}
90%, 100%{transform: translateX(8px); fill: transparent;}
}
@-webkit-keyframes team-leftbg {
0%, 15%{-webkit-transform: translateX(-18px); fill: transparent;}
30%, 75%{-webkit-transform: translateX(0px); fill: #FFF; }
90%, 100%{-webkit-transform: translateX(8px); fill: transparent;}
}
@keyframes team-leftbg {
0%, 15%{transform: translateX(-18px); fill: transparent;}
30%, 75%{transform: translateX(0px); fill: #FFFFFF;}
90%, 100%{transform: translateX(8px); fill: transparent;}
}
#team-left-1-1, #team-left-1-2{
-webkit-transform-origin: 40px 40px;
transform-origin: 40px 40px;
-webkit-animation: 4s team-left linear infinite;
animation: 4s team-left linear infinite;
}
#team-left-1bg-1, #team-left-1bg-2{
-webkit-transform-origin: 40px 40px;
transform-origin: 40px 40px;
-webkit-animation: 4s team-leftbg linear infinite;
animation: 4s team-leftbg linear infinite;
}
@-webkit-keyframes team-left2 {
0%, 25%{-webkit-transform: translateX(-18px); fill: transparent;}
40%, 75%{-webkit-transform: translateX(0px); fill: #E56565;}
90%, 100%{-webkit-transform: translateX(15px); fill: transparent;}
}
@keyframes team-left2 {
0%, 25%{transform: translateX(-18px); fill: transparent;}
40%, 75%{transform: translateX(0px); fill: #E56565;}
90%, 100%{transform: translateX(15px); fill: transparent;}
}
@-webkit-keyframes team-left2bg {
0%, 25%{-webkit-transform: translateX(-18px); fill: transparent;}
40%, 75%{-webkit-transform: translateX(0px); fill: #FFF;}
90%, 100%{-webkit-transform: translateX(15px); fill: transparent;}
}
@keyframes team-left2bg {
0%, 25%{transform: translateX(-18px); fill: transparent;}
40%, 75%{transform: translateX(0px); fill: #FFF;}
90%, 100%{transform: translateX(15px); fill: transparent;}
}
#team-left-2-1, #team-left-2-2{
-webkit-transform-origin: 40px 40px;
transform-origin: 40px 40px;
-webkit-animation: 4s team-left2 linear infinite;
animation: 4s team-left2 linear infinite;
}
#team-left-2bg-1, #team-left-2bg-2{
-webkit-transform-origin: 40px 40px;
transform-origin: 40px 40px;
-webkit-animation: 4s team-left2bg linear infinite;
animation: 4s team-left2bg linear infinite;
}
@-webkit-keyframes team-right {
0%, 15%{-webkit-transform: translateX(18px); fill: transparent;}
30%, 75%{-webkit-transform: translateX(0px); fill: #333;}
90%, 100%{-webkit-transform: translateX(-8px); fill: transparent;}
}
@keyframes team-right {
0%, 15%{transform: translateX(18px); fill: transparent;}
30%, 75%{transform: translateX(0px); fill: #333;}
90%, 100%{transform: translateX-(8px); fill: transparent;}
}
@-webkit-keyframes team-rightbg {
0%, 15%{-webkit-transform: translateX(18px); fill: transparent;}
30%, 75%{-webkit-transform: translateX(0px); fill: #FFF;}
90%, 100%{-webkit-transform: translateX(-8px); fill: transparent;}
}
@keyframes team-rightbg {
0%, 15%{transform: translateX(18px); fill: transparent;}
30%, 75%{transform: translateX(0px); fill: #FFF;}
90%, 100%{transform: translateX(-8px); fill: transparent;}
}
#team-right-1-1, #team-right-1-2{
-webkit-transform-origin: 40px 40px;
transform-origin: 40px 40px;
-webkit-animation: 4s team-right linear infinite;
animation: 4s team-right linear infinite;
}
#team-right-1bg-1, #team-right-1bg-2{
-webkit-transform-origin: 40px 40px;
transform-origin: 40px 40px;
-webkit-animation: 4s team-rightbg linear infinite;
animation: 4s team-rightbg linear infinite;
}
@-webkit-keyframes team-right2 {
0%, 25%{-webkit-transform: translateX(18px); fill: transparent;}
40%, 75%{-webkit-transform: translateX(0px); fill: #E56565;}
90%, 100%{-webkit-transform: translateX(-15px); fill: transparent;}
}
@keyframes team-right2 {
0%, 25%{transform: translateX(18px); fill: transparent;}
40%, 75%{transform: translateX(0px); fill: #E56565;}
90%, 100%{transform: translateX(-15px); fill: transparent;}
}
@-webkit-keyframes team-right2bg {
0%, 25%{-webkit-transform: translateX(18px); fill: transparent;}
40%, 75%{-webkit-transform: translateX(0px); fill: #FFF;}
90%, 100%{-webkit-transform: translateX(-15px); fill: transparent;}
}
@keyframes team-right2bg {
0%, 25%{transform: translateX(18px); fill: transparent;}
40%, 75%{transform: translateX(0px); fill: #FFF;}
90%, 100%{transform: translateX(-15px); fill: transparent;}
}
#team-right-2-1, #team-right-2-2{
-webkit-transform-origin: 40px 40px;
transform-origin: 40px 40px;
-webkit-animation: 4s team-right2 linear infinite;
animation: 4s team-right2 linear infinite;
}
#team-right-2bg-1, #team-right-2bg-2{
-webkit-transform-origin: 40px 40px;
transform-origin: 40px 40px;
-webkit-animation: 4s team-right2bg linear infinite;
animation: 4s team-right2bg linear infinite;
}
@-webkit-keyframes team-career-leftbg {
0%, 15%{-webkit-transform: translateX(-18px); fill: transparent;}
30%, 75%{-webkit-transform: translateX(0px); fill: #69df74 ; }
90%, 100%{-webkit-transform: translateX(8px); fill: transparent;}
}
@keyframes team-career-leftbg {
0%, 15%{transform: translateX(-18px); fill: transparent;}
30%, 75%{transform: translateX(0px); fill: #69df74 ;}
90%, 100%{transform: translateX(8px); fill: transparent;}
}
@-webkit-keyframes team-career-left2bg {
0%, 25%{-webkit-transform: translateX(-18px); fill: transparent;}
40%, 75%{-webkit-transform: translateX(0px); fill: #69df74 ;}
90%, 100%{-webkit-transform: translateX(15px); fill: transparent;}
}
@-webkit-keyframes team-career-rightbg {
0%, 15%{-webkit-transform: translateX(18px); fill: transparent;}
30%, 75%{-webkit-transform: translateX(0px); fill: #69df74 ;}
90%, 100%{-webkit-transform: translateX(-8px); fill: transparent;}
}
@keyframes team-career-rightbg {
0%, 15%{transform: translateX(18px); fill: transparent;}
30%, 75%{transform: translateX(0px); fill: #69df74 ;}
90%, 100%{transform: translateX(-8px); fill: transparent;}
}
@keyframes team-career-left2bg {
0%, 25%{transform: translateX(-18px); fill: transparent;}
40%, 75%{transform: translateX(0px); fill: #69df74 ;}
90%, 100%{transform: translateX(15px); fill: transparent;}
}
@-webkit-keyframes team-career-right2bg {
0%, 25%{-webkit-transform: translateX(18px); fill: transparent;}
40%, 75%{-webkit-transform: translateX(0px); fill: #69df74 ;}
90%, 100%{-webkit-transform: translateX(-15px); fill: transparent;}
}
@keyframes team-career-right2bg {
0%, 25%{transform: translateX(18px); fill: transparent;}
40%, 75%{transform: translateX(0px); fill: #69df74 ;}
90%, 100%{transform: translateX(-15px); fill: transparent;}
}
.careers #team-left-1bg-1, .careers #team-left-1bg-2{
-webkit-animation: 4s team-career-leftbg linear infinite;
animation: 4s team-career-leftbg linear infinite;
}
.careers #team-left-2bg-1, .careers #team-left-2bg-2{
-webkit-animation: 4s team-career-leftbg linear infinite;
animation: 4s team-career-leftbg linear infinite;
}
.careers #team-right-1bg-1, .careers #team-right-1bg-2{
-webkit-animation: 4s team-career-right2bg linear infinite;
animation: 4s team-career-right2bg linear infinite;
}
.careers #team-right-2bg-1, .careers #team-right-2bg-2{
-webkit-animation: 4s team-career-right2bg linear infinite;
animation: 4s team-career-right2bg linear infinite;
}
</style>
<g>
<g>
<path class="gt2" id="team-right-2bg-1" d="M71.9,9.3c0-4.1-3.3-7.4-7.4-7.4c-4.1,0-7.4,3.3-7.4,7.4s3.3,7.4,7.4,7.4C68.6,16.7,71.9,13.4,71.9,9.3z"></path>
<path class="gt2" id="team-right-2bg-2" d="M70.1,16.6h-5.8h-5.8c-4.2,0-7.7,3.4-7.7,7.7v10.1c0,2.4,1.9,4.3,4.3,4.3c0.7,0,1.3-0.2,1.8-0.4l0.1,18
c0,2.4,1.9,4.3,4.3,4.3c1.2,0,2.3-0.5,3.1-1.3c0.8,0.8,1.9,1.3,3.1,1.3c2.4,0,4.3-1.9,4.3-4.3l-0.1-18.1c0.6,0.3,1.2,0.4,1.8,0.4
c2.4,0,4.3-1.9,4.3-4.3V24.2C77.8,20,74.3,16.6,70.1,16.6z"></path>
</g>
<g>
<path class="gt1" id="team-right-2-1" d="M77.8,24.1c0-3.7-2.6-6.8-6.1-7.5l-1.3,0h-4.3c3.3-0.8,5.7-3.7,5.7-7.2c0-4.1-3.3-7.4-7.4-7.4
C60.3,2,57,5.3,57,9.4c0,3.5,2.4,6.4,5.7,7.2h-4.3l-1.3,0c-3.5,0.7-6.1,3.8-6.1,7.5l-0.1,10.2c0,2.2,1.7,4,3.8,4.2
c0.1,0,0.1,0,0.2,0c0.1,0,0.2,0,0.3,0c0.1,0,0.1,0,0.2,0c0.2,0,0.3,0,0.5,0c0.4-0.1,0.8-0.2,1.2-0.3c0,0,0,0,0,0v2.3v7.3l0.1,8.7
c0,0.7,0.2,1.3,0.5,1.9c0.6,1.4,1.9,2.3,3.6,2.3c0,0,0,0,0,0c0,0,0,0,0,0c0,0,0.1,0,0.1,0c0,0,0.1,0,0.1,0c0,0,0,0,0,0
c0,0,0,0,0,0c1.2,0,2.2-0.5,3-1.2c0.8,0.7,1.8,1.2,3,1.2c0,0,0,0,0,0c0,0,0,0,0,0c0,0,0,0,0.1,0c0,0-0.1,0-0.1,0
c0.3,0,0.6,0,0.9-0.1c0.2,0,0.4-0.1,0.6-0.2c0.1,0,0.2,0,0.2-0.1c0.2-0.1,0.4-0.2,0.6-0.3c0,0,0.1,0,0.1-0.1
c0.2-0.1,0.4-0.3,0.5-0.4c0,0,0.1-0.1,0.1-0.1c0.1-0.1,0.3-0.3,0.4-0.4c0-0.1,0.1-0.1,0.2-0.2c0.1-0.1,0.1-0.3,0.2-0.4
c0.1-0.1,0.1-0.2,0.2-0.3c0-0.1,0.1-0.2,0.1-0.3c0.1-0.2,0.1-0.3,0.2-0.5c0-0.1,0-0.1,0-0.2c0-0.2,0.1-0.4,0.1-0.6l0.1-8.7v-7.3
v-2.3c0,0,0,0,0,0c0.4,0.2,0.7,0.3,1.2,0.3c0.2,0,0.3,0,0.5,0c0.1,0,0.1,0,0.2,0c0.1,0,0.2,0,0.3,0c0.1,0,0.1,0,0.2,0
c2.2-0.2,3.8-2,3.8-4.2L77.8,24.1z M59.5,9.4c0-2.7,2.2-4.9,4.9-4.9c2.7,0,4.9,2.2,4.9,4.9c0,2.7-2.2,4.9-4.9,4.9
C61.7,14.3,59.5,12.1,59.5,9.4z M73.5,35.9c-1,0-1.8-0.8-1.8-1.8l-0.1-8.9v-2.6h-2.5v11v0.6v0.6v3.4v18c0,1-0.8,1.8-1.8,1.8
c-0.2,0-0.5,0-0.7-0.1c-0.6-0.2-0.8-0.8-0.8-1.6V39.7h-0.3h-2.2H63v16.6c0,1-0.7,1.7-1.7,1.7c-0.9-0.1-1.6-0.8-1.6-1.8v-18v-3.4
v-0.6v-0.6v-11h-2.5v2.6l-0.1,8.9c0,1-0.8,1.8-1.8,1.8s-1.8-0.8-1.8-1.8l0.1-10c0-2.9,2.3-5.2,5.2-5.2H70c2.9,0,5.2,2.3,5.2,5.2
l0.1,10C75.3,35.1,74.5,35.9,73.5,35.9z"></path>
<path class="gt1" id="team-right-2-2" d="M67.6,60.6C67.6,60.6,67.7,60.6,67.6,60.6C67.7,60.6,67.6,60.6,67.6,60.6z"></path>
</g>
</g>
<g>
<g>
<path class="gt2" id="team-right-1bg-1" d="M59.6,17.8c0-4.1-3.3-7.4-7.4-7.4s-7.4,3.3-7.4,7.4s3.3,7.4,7.4,7.4S59.6,21.9,59.6,17.8z"></path>
<path class="gt2" id="team-right-1bg-2" d="M58,25.2h-5.8h-5.8c-4.2,0-7.7,3.4-7.7,7.7V43c0,2.4,1.9,4.3,4.3,4.3c0.7,0,1.3-0.2,1.8-0.4l0.1,18
c0,2.4,1.9,4.3,4.3,4.3c1.2,0,2.3-0.5,3.1-1.3c0.8,0.8,1.9,1.3,3.1,1.3c2.4,0,4.2-1.8,4.2-4.2l0.1-18.3c0.6,0.3,1.2,0.4,1.8,0.4
c2.4,0,4.2-1.8,4.2-4.2V32.8C65.7,28.6,62.2,25.2,58,25.2z"></path>
</g>
<g>
<path class="gt0" id="team-right-1-1" d="M65.7,32.7c0-3.7-2.6-6.8-6.1-7.5l-1.3,0H54c3.3-0.8,5.7-3.7,5.7-7.2c0-4.1-3.3-7.4-7.4-7.4
c-4.1,0-7.4,3.3-7.4,7.4c0,3.5,2.4,6.4,5.7,7.2h-4.3l-1.3,0c-3.5,0.7-6.1,3.8-6.1,7.5l-0.1,10.2c0,2.2,1.7,4,3.8,4.2
c0.1,0,0.1,0,0.2,0c0.1,0,0.2,0,0.3,0c0.1,0,0.1,0,0.2,0c0.2,0,0.3,0,0.5,0c0.4-0.1,0.8-0.2,1.2-0.3c0,0,0,0,0,0V49v7.3L45,65
c0,0.7,0.2,1.3,0.5,1.9c0.6,1.4,1.9,2.3,3.6,2.3c0,0,0,0,0,0c0,0,0,0,0,0c0,0,0.1,0,0.1,0c0,0,0.1,0,0.1,0c0,0,0,0,0,0
c0,0,0,0,0,0c1.2,0,2.2-0.5,3-1.2c0.8,0.7,1.8,1.2,3,1.2c0,0,0,0,0,0c0,0,0,0,0,0c0,0,0,0,0.1,0c0,0-0.1,0-0.1,0
c0.3,0,0.6,0,0.9-0.1c0.2,0,0.4-0.1,0.6-0.2c0.1,0,0.2,0,0.2-0.1c0.2-0.1,0.4-0.2,0.6-0.3c0,0,0.1,0,0.1-0.1
c0.2-0.1,0.4-0.3,0.5-0.4c0,0,0.1-0.1,0.1-0.1c0.1-0.1,0.3-0.3,0.4-0.4c0-0.1,0.1-0.1,0.2-0.2c0.1-0.1,0.1-0.3,0.2-0.4
c0.1-0.1,0.1-0.2,0.2-0.3c0-0.1,0.1-0.2,0.1-0.3c0.1-0.2,0.1-0.3,0.2-0.5c0-0.1,0-0.1,0-0.2c0-0.2,0.1-0.4,0.1-0.6l0.1-8.7V49
v-2.3c0,0,0,0,0,0c0.4,0.2,0.7,0.3,1.2,0.3c0.2,0,0.3,0,0.5,0c0.1,0,0.1,0,0.2,0c0.1,0,0.2,0,0.3,0c0.1,0,0.1,0,0.2,0
c2.2-0.2,3.8-2,3.8-4.2L65.7,32.7z M47.4,18c0-2.7,2.2-4.9,4.9-4.9c2.7,0,4.9,2.2,4.9,4.9c0,2.7-2.2,4.9-4.9,4.9
C49.6,22.9,47.4,20.7,47.4,18z M61.4,44.5c-1,0-1.8-0.8-1.8-1.8l-0.1-8.9v-2.6H57v11v0.6v0.6v3.4v18c0,1-0.8,1.8-1.8,1.8
c-0.2,0-0.5,0-0.7-0.1c-0.6-0.2-0.8-0.8-0.8-1.6V48.3h-0.3h-2.2h-0.3v16.6c0,1-0.7,1.7-1.7,1.7c-0.9-0.1-1.6-0.8-1.6-1.8v-18v-3.4
v-0.6v-0.6v-11h-2.5v2.6L45,42.7c0,1-0.8,1.8-1.8,1.8s-1.8-0.8-1.8-1.8l0.1-10c0-2.9,2.3-5.2,5.2-5.2h11.2c2.9,0,5.2,2.3,5.2,5.2
l0.1,10C63.2,43.7,62.4,44.5,61.4,44.5z"></path>
<path class="gt0" id="team-right-1-2" d="M55.4,69.2C55.4,69.2,55.5,69.2,55.4,69.2C55.5,69.2,55.4,69.2,55.4,69.2z"></path>
</g>
</g>
<g>
<g>
<path class="gt2" id="team-left-2bg-1" d="M23,9.4C23,5.3,19.7,2,15.6,2S8.2,5.3,8.2,9.4s3.3,7.4,7.4,7.4S23,13.5,23,9.4z"></path>
<path class="gt2" id="team-left-2bg-2" d="M21.4,16.8h-5.8H9.8c-4.2,0-7.7,3.4-7.7,7.7v9.4c0,2.4,1.9,4.6,4.3,4.6c0.7,0,1.3-0.2,1.8-0.4l0,17.7
c0,2.4,1.9,4.3,4.3,4.3c1.2,0,2.3-0.5,3.1-1.3c0.8,0.8,1.9,1.3,3.1,1.3c2.4,0,4.3-1.9,4.3-4.3l0-17.5c0.6,0.3,1.2,0.4,1.8,0.4
c2.4,0,4.3-1.9,4.3-4.3V24.4C29.1,20.2,25.6,16.8,21.4,16.8z"></path>
</g>
<g>
<path class="gt1" id="team-left-2-1" d="M2.1,34.3c0,2.2,1.7,4,3.8,4.2c0.1,0,0.1,0,0.2,0c0.1,0,0.2,0,0.3,0c0.1,0,0.1,0,0.2,0c0.2,0,0.3,0,0.5,0
c0.4-0.1,0.8-0.2,1.2-0.3c0,0,0,0,0,0v2.3v7.3l0.1,8.7c0,0.2,0,0.4,0.1,0.6c0,0.1,0,0.1,0,0.2c0,0.2,0.1,0.3,0.2,0.5
c0,0.1,0.1,0.2,0.1,0.3c0,0.1,0.1,0.2,0.2,0.3c0.1,0.1,0.1,0.3,0.2,0.4c0,0.1,0.1,0.1,0.2,0.2c0.1,0.2,0.2,0.3,0.4,0.4
c0,0,0.1,0.1,0.1,0.1c0.2,0.2,0.3,0.3,0.5,0.4c0,0,0.1,0,0.1,0.1c0.2,0.1,0.4,0.2,0.6,0.3c0.1,0,0.2,0,0.2,0.1
c0.2,0.1,0.4,0.1,0.6,0.2c0.3,0.1,0.6,0.1,0.9,0.1c0,0,0,0-0.1,0c0,0,0.1,0,0.1,0c0,0,0,0,0,0c0,0,0,0,0,0c1.2,0,2.2-0.5,3-1.2
c0.8,0.7,1.8,1.2,3,1.2c0,0,0,0,0,0c0,0,0,0,0,0c0,0,0.1,0,0.1,0c0,0,0.1,0,0.1,0c0,0,0,0,0,0c0,0,0,0,0,0c1.7,0,3-0.9,3.6-2.3
c0.3-0.6,0.5-1.2,0.5-1.9l0.1-8.7v-7.3v-2.3c0,0,0,0,0,0c0.4,0.2,0.7,0.3,1.2,0.3c0.2,0,0.3,0,0.5,0c0.1,0,0.1,0,0.2,0
c0.1,0,0.2,0,0.3,0c0.1,0,0.1,0,0.2,0c2.2-0.2,3.8-2,3.8-4.2L29,24.1c0-3.7-2.6-6.8-6.1-7.5l-1.3,0h-4.3c3.3-0.8,5.7-3.7,5.7-7.2
C23,5.3,19.6,2,15.6,2c-4.1,0-7.4,3.3-7.4,7.4c0,3.5,2.4,6.4,5.7,7.2H9.6l-1.3,0c-3.5,0.7-6.1,3.8-6.1,7.5L2.1,34.3z M15.6,14.3
c-2.7,0-4.9-2.2-4.9-4.9c0-2.7,2.2-4.9,4.9-4.9c2.7,0,4.9,2.2,4.9,4.9C20.5,12.1,18.3,14.3,15.6,14.3z M4.7,34.1l0.1-10
c0-2.9,2.3-5.2,5.2-5.2h11.2c2.9,0,5.2,2.3,5.2,5.2l0.1,10c0,1-0.8,1.8-1.8,1.8s-1.8-0.8-1.8-1.8l-0.1-8.9v-2.6h-2.5v11v0.6v0.6
v3.4v18c0,0.9-0.7,1.7-1.6,1.8c-1,0-1.7-0.7-1.7-1.7V39.7h-0.3h-2.2h-0.3v16.6c0,0.7-0.3,1.3-0.8,1.6C13.1,58,12.9,58,12.7,58
c-1,0-1.8-0.8-1.8-1.8v-18v-3.4v-0.6v-0.6v-11H8.4v2.6l-0.1,8.9c0,1-0.8,1.8-1.8,1.8S4.7,35.1,4.7,34.1z"></path>
<path class="gt1" id="team-left-2-2" d="M12.5,60.6C12.4,60.6,12.4,60.6,12.5,60.6C12.4,60.6,12.4,60.6,12.5,60.6z"></path>
</g>
</g>
<g>
<path class="gt2" id="team-left-1bg-1" d="M35.2,17.8c0-4.1-3.3-7.4-7.4-7.4s-7.4,3.3-7.4,7.4s3.3,7.4,7.4,7.4S35.2,21.9,35.2,17.8z"></path>
<path class="gt2" id="team-left-1bg-2" d="M33.6,25.2h-5.8H22c-4.2,0-7.7,3.4-7.7,7.7v9.8c0,2.4,1.9,4.3,4.3,4.3c0.7,0,1.3-0.2,1.8-0.4l0,18.3
c0,2.4,1.9,4.3,4.3,4.3c1.2,0,2.3-0.5,3.1-1.3c0.8,0.8,1.9,1.3,3.1,1.3c2.4,0,4.3-1.9,4.3-4.3l0-18.2c0.6,0.3,1.2,0.4,1.8,0.4
c2.4,0,4.3-1.9,4.3-4.3V32.8C41.3,28.6,37.8,25.2,33.6,25.2z"></path>
</g>
<g>
<path class="gt0" id="team-left-1-1" d="M14.3,42.9c0,2.2,1.7,4,3.8,4.2c0.1,0,0.1,0,0.2,0c0.1,0,0.2,0,0.3,0c0.1,0,0.1,0,0.2,0c0.2,0,0.3,0,0.5,0
c0.4-0.1,0.8-0.2,1.2-0.3c0,0,0,0,0,0V49v7.3l0.1,8.7c0,0.2,0,0.4,0.1,0.6c0,0.1,0,0.1,0,0.2c0,0.2,0.1,0.3,0.2,0.5
c0,0.1,0.1,0.2,0.1,0.3c0,0.1,0.1,0.2,0.2,0.3c0.1,0.1,0.1,0.3,0.2,0.4c0,0.1,0.1,0.1,0.2,0.2c0.1,0.2,0.2,0.3,0.4,0.4
c0,0,0.1,0.1,0.1,0.1c0.2,0.2,0.3,0.3,0.5,0.4c0,0,0.1,0,0.1,0.1c0.2,0.1,0.4,0.2,0.6,0.3c0.1,0,0.2,0,0.2,0.1
c0.2,0.1,0.4,0.1,0.6,0.2c0.3,0.1,0.6,0.1,0.9,0.1c0,0,0,0-0.1,0c0,0,0.1,0,0.1,0c0,0,0,0,0,0c0,0,0,0,0,0c1.2,0,2.2-0.5,3-1.2
c0.8,0.7,1.8,1.2,3,1.2c0,0,0,0,0,0c0,0,0,0,0,0c0,0,0.1,0,0.1,0c0,0,0.1,0,0.1,0c0,0,0,0,0,0c0,0,0,0,0,0c1.7,0,3-0.9,3.6-2.3
c0.3-0.6,0.5-1.2,0.5-1.9l0.1-8.7V49v-2.3c0,0,0,0,0,0c0.4,0.2,0.7,0.3,1.2,0.3c0.2,0,0.3,0,0.5,0c0.1,0,0.1,0,0.2,0
c0.1,0,0.2,0,0.3,0c0.1,0,0.1,0,0.2,0c2.2-0.2,3.8-2,3.8-4.2l-0.1-10.2c0-3.7-2.6-6.8-6.1-7.5l-1.3,0h-4.3c3.3-0.8,5.7-3.7,5.7-7.2
c0-4.1-3.3-7.4-7.4-7.4c-4.1,0-7.4,3.3-7.4,7.4c0,3.5,2.4,6.4,5.7,7.2h-4.3l-1.3,0c-3.5,0.7-6.1,3.8-6.1,7.5L14.3,42.9z M27.8,22.9
c-2.7,0-4.9-2.2-4.9-4.9c0-2.7,2.2-4.9,4.9-4.9c2.7,0,4.9,2.2,4.9,4.9C32.7,20.7,30.5,22.9,27.8,22.9z M16.9,42.7l0.1-10
c0-2.9,2.3-5.2,5.2-5.2h11.2c2.9,0,5.2,2.3,5.2,5.2l0.1,10c0,1-0.8,1.8-1.8,1.8s-1.8-0.8-1.8-1.8L35,33.8v-2.6h-2.5v11v0.6v0.6v3.4
v18c0,0.9-0.7,1.7-1.6,1.8c-1,0-1.7-0.7-1.7-1.7V48.3h-0.3h-2.2h-0.3v16.6c0,0.7-0.3,1.3-0.8,1.6c-0.2,0.1-0.4,0.1-0.7,0.1
c-1,0-1.8-0.8-1.8-1.8v-18v-3.4v-0.6v-0.6v-11h-2.5v2.6l-0.1,8.9c0,1-0.8,1.8-1.8,1.8S16.9,43.7,16.9,42.7z"></path>
<path class="gt0" id="team-left-1-2" d="M24.7,69.2C24.6,69.2,24.6,69.2,24.7,69.2C24.6,69.2,24.6,69.2,24.7,69.2z"></path>
</g>
<path class="gt3" id="team-mid" d="M45.9,33.5h-4.3c3.4-0.7,6-3.7,6-7.4c0-4.2-3.4-7.6-7.6-7.6s-7.6,3.4-7.6,7.6c0,3.6,2.6,6.7,6,7.4h-4.3
c-4.3,0-7.9,3.5-7.9,7.9v10.3c0,2.5,1.9,4.4,4.4,4.4c0.7,0,1.3-0.2,1.8-0.4v18.6c0,2.5,1.9,4.4,4.4,4.4c1.2,0,2.3-0.5,3.2-1.3
c0.8,0.8,1.9,1.3,3.2,1.3c2.5,0,4.4-1.9,4.4-4.4l0.1-18.6c0.6,0.3,1.1,0.4,1.7,0.4c2.5,0,4.4-1.9,4.4-4.4V41.3
C53.8,37,50.2,33.5,45.9,33.5z"></path>
</svg>
</div>
<div class="career-item-title">Friendly team</div>
</li>
<li class="career-item">
<div class="block-for-image">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 80 80" style="enable-background:new 0 0 80 80;" xml:space="preserve">
<style type="text/css">
.gt10{fill:#333333;}
.gt11{fill:#E56565;}
.gt12{fill:#CCFF00;}
@-webkit-keyframes work-rotate {
0%{-webkit-transform: rotate(0deg);}
100%{-webkit-transform: rotate(360deg);}
}
@keyframes work-rotate {
0%{transform: rotate(0deg);}
100%{transform: rotate(360deg);}
}
#work-gear-1, #work-gear-2, #work-gear-3{
-webkit-transform-origin: 60.9px 18.8px;
transform-origin: 60.9px 18.8px;
-webkit-animation: 3s work-rotate linear infinite;
animation: 3s work-rotate linear infinite;
}
#work-gear-2{
-webkit-transform-origin: 25px 40px;
transform-origin: 25px 40px;
-webkit-animation-direction: reverse;
animation-direction: reverse;
}
#work-gear-3{
-webkit-transform-origin: 60.5px 60.5px;
transform-origin: 60.5px 60.5px;
}
</style>
<g>
<path class="gt10" id="work-gear-1" d="M65.7,36.3h-9.8v-4.6c-0.2-0.1-0.3-0.1-0.5-0.2l-3.3,3.3l-6.9-6.9l3.3-3.3c-0.1-0.2-0.1-0.3-0.2-0.5h-4.6v-9.8
h4.6c0.1-0.2,0.1-0.3,0.2-0.5l-3.3-3.3l6.9-6.9l3.3,3.3c0.2-0.1,0.3-0.1,0.5-0.2V2h9.8v4.6c0.2,0.1,0.3,0.1,0.5,0.2l3.3-3.3
l6.9,6.9l-3.3,3.3c0.1,0.2,0.1,0.3,0.2,0.5H78v9.8h-4.6c-0.1,0.2-0.1,0.3-0.2,0.5l3.3,3.3l-6.9,6.9l-3.3-3.3
c-0.2,0.1-0.3,0.1-0.5,0.2V36.3z M58.4,33.9h4.9V30l0.9-0.3c0.6-0.2,1.2-0.4,1.8-0.7l0.8-0.4l2.8,2.8l3.5-3.5l-2.8-2.8l0.4-0.8
c0.3-0.6,0.6-1.2,0.7-1.8l0.3-0.9h3.9v-4.9h-3.9l-0.3-0.9c-0.2-0.6-0.4-1.2-0.7-1.8l-0.4-0.8l2.8-2.8L69.5,7l-2.8,2.8l-0.8-0.4
c-0.6-0.3-1.2-0.6-1.8-0.7l-0.9-0.3V4.5h-4.9v3.9l-0.9,0.3c-0.6,0.2-1.2,0.4-1.8,0.7l-0.8,0.4L52.2,7l-3.5,3.5l2.8,2.8l-0.4,0.8
c-0.3,0.6-0.6,1.2-0.7,1.8L50,16.7h-3.9v4.9H50l0.3,0.9c0.2,0.6,0.4,1.2,0.7,1.8l0.4,0.8l-2.8,2.8l3.5,3.5l2.8-2.8l0.8,0.4
c0.6,0.3,1.2,0.6,1.8,0.7l0.9,0.3V33.9z"></path>
<path class="gt10" id="work-gear-3" d="M65.7,78h-9.8v-4.6c-0.2-0.1-0.3-0.1-0.5-0.2l-3.3,3.3l-6.9-6.9l3.3-3.3c-0.1-0.2-0.1-0.3-0.2-0.5h-4.6v-9.8
h4.6c0.1-0.2,0.1-0.3,0.2-0.5l-3.3-3.3l6.9-6.9l3.3,3.3c0.2-0.1,0.3-0.1,0.5-0.2v-4.6h9.8v4.6c0.2,0.1,0.3,0.1,0.5,0.2l3.3-3.3
l6.9,6.9l-3.3,3.3c0.1,0.2,0.1,0.3,0.2,0.5H78v9.8h-4.6c-0.1,0.2-0.1,0.3-0.2,0.5l3.3,3.3l-6.9,6.9l-3.3-3.3
c-0.2,0.1-0.3,0.1-0.5,0.2V78z M58.4,75.5h4.9v-3.9l0.9-0.3c0.6-0.2,1.2-0.4,1.8-0.7l0.8-0.4l2.8,2.8l3.5-3.5l-2.8-2.8l0.4-0.8
c0.3-0.6,0.6-1.2,0.7-1.8l0.3-0.9h3.9v-4.9h-3.9l-0.3-0.9c-0.2-0.6-0.4-1.2-0.7-1.8l-0.4-0.8l2.8-2.8l-3.5-3.5l-2.8,2.8l-0.8-0.4
c-0.6-0.3-1.2-0.6-1.8-0.7L63.3,50v-3.9h-4.9V50l-0.9,0.3c-0.6,0.2-1.2,0.4-1.8,0.7l-0.8,0.4l-2.8-2.8l-3.5,3.5l2.8,2.8l-0.4,0.8
c-0.3,0.6-0.6,1.2-0.7,1.8L50,58.4h-3.9v4.9H50l0.3,0.9c0.2,0.6,0.4,1.2,0.7,1.8l0.4,0.8l-2.8,2.8l3.5,3.5l2.8-2.8l0.8,0.4
c0.6,0.3,1.2,0.6,1.8,0.7l0.9,0.3V75.5z"></path>
<path class="gt10" id="work-gear-2" d="M29,62.1h-9.8v-5.6c-1.1-0.3-2.2-0.8-3.2-1.3l-4,4L5,52.1l4-4c-0.6-1-1-2.1-1.3-3.2H2v-9.8h5.6
C8,34,8.4,32.9,9,31.8l-4-4l6.9-6.9l4,4c1-0.6,2.1-1,3.2-1.3v-5.6H29v5.6c1.1,0.3,2.2,0.8,3.2,1.3l4-4l6.9,6.9l-4,4
c0.6,1,1,2.1,1.3,3.2h5.6v9.8h-5.6c-0.3,1.1-0.8,2.2-1.3,3.2l4,4l-6.9,6.9l-4-4c-1,0.6-2.1,1-3.2,1.3V62.1z M21.6,59.6h4.9v-5.1
l0.9-0.2c1.5-0.4,3-1,4.3-1.8l0.8-0.5l3.6,3.6l3.5-3.5l-3.6-3.6l0.5-0.8c0.8-1.3,1.4-2.8,1.8-4.3l0.2-0.9h5.1v-4.9h-5.1l-0.2-0.9
c-0.4-1.5-1-3-1.8-4.3l-0.5-0.8l3.6-3.6l-3.5-3.5L32.6,28l-0.8-0.5c-1.3-0.8-2.8-1.4-4.3-1.8l-0.9-0.2v-5.1h-4.9v5.1l-0.9,0.2
c-1.5,0.4-3,1-4.3,1.8L15.5,28l-3.6-3.6l-3.5,3.5l3.6,3.6l-0.5,0.8c-0.8,1.3-1.4,2.8-1.8,4.3l-0.2,0.9H4.5v4.9h5.1l0.2,0.9
c0.4,1.5,1,3,1.8,4.3l0.5,0.8l-3.6,3.6l3.5,3.5l3.6-3.6l0.8,0.5c1.3,0.8,2.8,1.4,4.3,1.8l0.9,0.2V59.6z"></path>
</g>
<path class="gt11" d="M60.8,19.2c-2.7,0-4.9-2.2-4.9-4.9s2.2-4.9,4.9-4.9c2.7,0,4.9,2.2,4.9,4.9S63.5,19.2,60.8,19.2z"></path>
<path class="gt11" d="M67,27.7H54.7v-2.5c0-3.4,2.7-6.1,6.1-6.1s6.1,2.7,6.1,6.1V27.7z"></path>
<path class="gt12" d="M60.8,60.8c-2.7,0-4.9-2.2-4.9-4.9c0-2.7,2.2-4.9,4.9-4.9c2.7,0,4.9,2.2,4.9,4.9C65.7,58.6,63.5,60.8,60.8,60.8
z"></path>
<path class="gt12" d="M67,69.4H54.7V67c0-3.4,2.7-6.1,6.1-6.1S67,63.6,67,67V69.4z"></path>
<path class="gt12" d="M24.1,40c-2.7,0-4.9-2.2-4.9-4.9c0-2.7,2.2-4.9,4.9-4.9s4.9,2.2,4.9,4.9C29,37.8,26.8,40,24.1,40z"></path>
<path class="gt12" d="M30.2,48.6H17.9v-2.5c0-3.4,2.7-6.1,6.1-6.1s6.1,2.7,6.1,6.1V48.6z"></path>
<g>
<circle class="gt11" cx="14.3" cy="40" r="1.2"></circle>
<circle class="gt11" cx="33.9" cy="40" r="1.2"></circle>
</g>
</svg>
</div>
<div class="career-item-title">Interesting work</div>
</li>
<li class="career-item special">
<div class="number-vacancies">8</div>
<div class="career-item-title">vacancies</div>
</li>
<li class="career-item">
<div class="block-for-image">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 80 80" style="enable-background:new 0 0 80 80;" xml:space="preserve">
<style type="text/css">
.ct0{fill:#333333;}
.ct1{fill:#CCFF00;}
.ct2{fill:#E56565;}
@-webkit-keyframes money-rotate {
0%{-webkit-transform: rotateY(0deg);}
30%, 100%{-webkit-transform: rotateY(720deg);}
}
@keyframes money-rotate {
0%{transform: rotateY(0deg);}
30%, 100%{transform: rotateY(720deg);}
}
#money-main, #money-s{
-webkit-transform-origin: 40px 9px;
transform-origin: 40px 9px;
-webkit-animation: 3s money-rotate linear infinite;
animation: 3s money-rotate linear infinite;
}
@-webkit-keyframes money-dot1 {
0%{-webkit-transform: scale(0);}
20%, 50%{-webkit-transform: scale(1); fill: #e56565}
60%{-webkit-transform: scale(1.5); fill: transparent;}
100%{-webkit-transform: scale(1);; fill: transparent;}
}
@keyframes money-dot1 {
0%{transform: scale(0);}
20%, 50%{transform: scale(1); fill: #e56565}
60%{transform: scale(1.5); fill: transparent;}
100%{transform: scale(1);; fill: transparent;}
}
#money-dot1, #money-dot2, #money-dot3, #money-dot4, #money-dot5{
-webkit-transform-origin: 40px 9px;
transform-origin: 40px 9px;
-webkit-animation: 3s money-dot1 0.34s infinite;
animation: 3s money-dot1 0.34s infinite;
}
</style>
<path class="ct0" d="M75.9,56.4c-1.3-1.2-3.1-1.8-4.9-1.6l-21.2,2.2c0.1-0.7,0-1.4-0.2-2.1c-0.8-2.8-3.7-4.4-6.5-3.6l-1.9,0.5v-7.4
l6.5-4.4c5.9-0.2,10.6-5.1,10.6-11v-1.2h-1.2c-5.9,0-10.6,4.6-11,10.4l-4.9,3.3V22.9h-2.5v12.4L33.8,32c-0.4-5.8-5.1-10.4-11-10.4
h-1.2v1.2c0,5.9,4.7,10.8,10.6,11l6.5,4.4v14.3l-16.1,4.6H13v-2.5H2v22.1h11v-1.1L30,78l17.6,0l26.5-11c2.4-1,3.9-3.3,3.9-5.9
C78,59.3,77.2,57.6,75.9,56.4z M55.8,30.3c-0.6,3.7-3.5,6.6-7.1,7.1C49.3,33.8,52.2,30.9,55.8,30.3z M24.2,24.2
c3.7,0.6,6.6,3.5,7.1,7.1C27.6,30.8,24.7,27.8,24.2,24.2z M10.6,74.3H4.5V57.1h6.1V74.3z M73.1,64.7l-26,10.8H30.3L13,73.2V59.6h9.8
l20.9-6c1.5-0.4,3,0.4,3.5,1.9c0.4,1.3-0.2,2.7-1.5,3.3l-14.9,7l1,2.2l14.9-7c0.8-0.4,1.4-0.9,1.9-1.6l22.5-2.3c1.1-0.1,2.2,0.2,3,1
c0.8,0.8,1.3,1.8,1.3,2.9C75.5,62.7,74.6,64.1,73.1,64.7z"></path>
<path class="ct1" id="money-main" d="M40,24.1c-6.1,0-11-4.9-11-11S33.9,2,40,2S51,7,51,13S46.1,24.1,40,24.1z"></path>
<polygon class="ct2" id="money-dot4" points="69.4,14.3 69.4,16.7 71.9,16.7 71.9,19.2 74.3,19.2 74.3,16.7 76.8,16.7 76.8,14.3 74.3,14.3
74.3,11.8 71.9,11.8 71.9,14.3 "></polygon>
<path class="ct0" id="money-s" d="M41.2,16.7h-2.5c-0.7,0-1.2-0.5-1.2-1.2h-2.5c0,2,1.6,3.7,3.7,3.7v1.2h2.5v-1.2c2,0,3.7-1.6,3.7-3.7
c0-2-1.6-3.7-3.7-3.7h-2.5c-0.7,0-1.2-0.5-1.2-1.2c0-0.7,0.5-1.2,1.2-1.2h2.5c0.7,0,1.2,0.5,1.2,1.2h2.5c0-2-1.6-3.7-3.7-3.7V5.7
h-2.5v1.2c-2,0-3.7,1.6-3.7,3.7c0,2,1.6,3.7,3.7,3.7h2.5c0.7,0,1.2,0.5,1.2,1.2C42.5,16.2,41.9,16.7,41.2,16.7z"></path>
<polygon class="ct2" id="money-dot3" points="63.3,13 65.7,13 65.7,9.4 69.4,9.4 69.4,6.9 65.7,6.9 65.7,3.2 63.3,3.2 63.3,6.9 59.6,6.9 59.6,9.4
63.3,9.4 "></polygon>
<polygon class="ct2" id="money-dot5" points="67,26.5 67,24.1 69.4,24.1 69.4,21.6 67,21.6 67,19.2 64.5,19.2 64.5,21.6 62.1,21.6 62.1,24.1
64.5,24.1 64.5,26.5 "></polygon>
<polygon class="ct2" id="money-dot1" points="15.5,16.7 17.9,16.7 17.9,14.3 20.4,14.3 20.4,11.8 17.9,11.8 17.9,9.4 15.5,9.4 15.5,11.8 13,11.8
13,14.3 15.5,14.3 "></polygon>
<polygon class="ct2" id="money-dot2" points="6.9,26.5 9.4,26.5 9.4,22.9 13,22.9 13,20.4 9.4,20.4 9.4,16.7 6.9,16.7 6.9,20.4 3.2,20.4 3.2,22.9
6.9,22.9 "></polygon>
</svg>
</div>
<div class="career-item-title">High payment</div>
</li>
<li class="career-item">
<div class="block-for-image">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 80 80" style="enable-background:new 0 0 80 80;" xml:space="preserve">
<style type="text/css">
.st40{fill:#CCFF00;}
.st41{fill:#FFFFFF;}
.st42{fill:#333333;}
.st43{fill:#E56565;}
@-webkit-keyframes money-s {
0%, 100%{-webkit-transform: skew(0deg);}
20%{-webkit-transform: skew(20deg);}
40%{-webkit-transform: skew(-10deg);}
60%{-webkit-transform: skew(10deg);}
80%{-webkit-transform: skew(-15deg);}
90%{-webkit-transform: skew(13deg);}
}
@keyframes money-s {
0%, 100%{transform: skew(0deg);}
20%{transform: skew(20deg);}
40%{transform: skew(-10deg);}
60%{transform: skew(10deg);}
80%{transform: skew(-15deg);}
90%{transform: skew(13deg);}
}
#super-cloud-1{
}
#super-1, #super-2{
-webkit-transform-origin: 28px 18px;
transform-origin: 28px 18px;
-webkit-animation: 5s money-s infinite;
animation: 5s money-s infinite;
}
@-webkit-keyframes super-cloud {
0%{-webkit-transform: translate(0px, 2px); fill: transparent}
30%{-webkit-transform: translate(0px, -2px); fill: #e56565}
45%{-webkit-transform: translate(-2px, 2px); fill: #e56565}
75%, 100%{-webkit-transform: translate(0px, -22px); fill: transparent}
}
@keyframes super-cloud {
0%{transform: translate(0px, 2px); fill: transparent}
30%{transform: translate(0px, -2px); fill: #e56565}
45%{transform: translate(-2px, 2px); fill: #e56565}
75%, 100%{transform: translate(0px, -22px); fill: transparent}
}
#super-cloud-1{
-webkit-transform-origin: 14px 55px;
transform-origin: 14px 55px;
-webkit-animation: 5s super-cloud infinite reverse cubic-bezier(0.620, -0.180, 0.605, 1.190);
animation: 5s super-cloud infinite reverse cubic-bezier(0.620, -0.180, 0.605, 1.190);
}
@-webkit-keyframes super-man {
0%{-webkit-transform: translateY(2px);}
30%{-webkit-transform: translateY(-2px);}
60%{-webkit-transform: translateY( 2px);}
80%, 100%{-webkit-transform: translateY(0);}
}
@keyframes super-man {
0%{transform: translateY(2px);}
30%{transform: translateY(-2px);}
60%{transform: translateY( 2px);}
80%, 100%{transform: translateY(0);}
}
#super-man1, #super-man2{
-webkit-animation: 3s super-man infinite cubic-bezier(0.620, -0.180, 0.605, 1.190);
animation: 3s super-man infinite cubic-bezier(0.620, -0.180, 0.605, 1.190);
}
.careers .st41{fill: #69df74;}
</style>
<path id="super-2" class="st40" d="M44.8,55c2.5,0,5-0.3,7.4-0.8c4.6-1.1,6.9-2.5,7-2.5l0.9-0.5L49.7,23.7l-18.8,0L20.4,51.2l0.8,0.5
c0.1,0.1,1.7,1,5,2c3.2,1,6.6,1.4,10,1.3L44.8,55z"></path>
<rect x="32.6" y="22.9" class="st41" width="14.8" height="33"></rect>
<path class="st42" id="super-man1" d="M47.4,9.4C47.4,5.3,44.1,2,40,2s-7.4,3.3-7.4,7.4s3.3,7.4,7.4,7.4S47.4,13.4,47.4,9.4z M40,14.3
c-2.7,0-4.9-2.2-4.9-4.9s2.2-4.9,4.9-4.9s4.9,2.2,4.9,4.9S42.7,14.3,40,14.3z"></path>
<path class="st42" id="super-man2" d="M70.6,18c-1.7-3.1-5-5-8.5-5c-1.3,0-2.5,0.3-3.7,0.7V10c0-2.4-1.9-4.3-4.3-4.3s-4.3,1.9-4.3,4.3v6.7H40h-9.8V10
c0-2.4-1.9-4.3-4.3-4.3s-4.3,1.9-4.3,4.3v11c0,2.4,1.9,4.3,4.3,4.3h6.7v31.3c0,2.4,1.9,4.3,4.3,4.3c1.2,0,2.3-0.5,3.1-1.3
c0.8,0.8,1.9,1.3,3.1,1.3c2.4,0,4.3-1.9,4.3-4.3V25.3h6.7c2.4,0,4.3-1.9,4.3-4.3v-4.5c1.1-0.7,2.4-1,3.7-1c2.8,0,5.4,1.7,6.6,4.2
l0.3,0.7h0.7c3.2,0.2,5.8,2.9,5.8,6.1c0,3.4-2.7,6.1-6.1,6.1H53.2l0.9,2.5h15.3c4.7,0,8.6-3.9,8.6-8.6C78,22.2,74.8,18.6,70.6,18z
M54.1,8.1c1,0,1.8,0.8,1.8,1.8v1.8h-3.7V10C52.3,9,53.1,8.1,54.1,8.1z M40.7,19.2L40,19.9l-0.7-0.7C39.3,19.2,40.7,19.2,40.7,19.2z
M25.9,8.1c1,0,1.8,0.8,1.8,1.8v1.8H24V10C24.1,9,24.9,8.1,25.9,8.1z M44.9,36.9L40,39.8l-4.9-2.9v-1.8h9.8
C44.9,35.1,44.9,36.9,44.9,36.9z M36.9,58.4c-1,0-1.8-0.8-1.8-1.8V39.7l3.7,2.2v14.6C38.8,57.6,37.9,58.4,36.9,58.4z M43.1,58.4
c-1,0-1.8-0.8-1.8-1.8V41.9l3.7-2.2v16.8C44.9,57.6,44.1,58.4,43.1,58.4z M44.9,22.8v9.8h-9.8v-9.8h-9.2c-1,0-1.8-0.8-1.8-1.8v-6.7
h3.7v4.9h6.1c0,0.7,0.5,1.2,1.2,1.2c0.5,0,1-0.3,1.1-0.8l3.8,3.8l3.8-3.8c0.2,0.5,0.6,0.8,1.1,0.8c0.7,0,1.2-0.5,1.2-1.2h6.1v-4.9
h3.7V21c0,1-0.8,1.8-1.8,1.8"></path>
<path id="super-cloud-1" class="st43" d="M27.7,60.9c-1.7-3.1-5-5-8.5-5s-6.7,1.9-8.5,4.9h-0.1c-4.7,0-8.6,3.9-8.6,8.6
S5.9,78,10.6,78h15.9c4.7,0,8.6-3.9,8.6-8.6C35.1,65.1,31.9,61.5,27.7,60.9z M26.5,75.5H10.6c-3.4,0-6.1-2.7-6.1-6.1
s2.7-6.1,6.1-6.1c0.2,0,0.5,0,0.7,0l0.9,0.1l0.4-0.8c1.2-2.6,3.8-4.2,6.7-4.2c2.8,0,5.4,1.7,6.6,4.2l0.3,0.7h0.7
c3.2,0.2,5.8,2.9,5.8,6.1C32.6,72.8,29.9,75.5,26.5,75.5z"></path>
</svg>
</div>
<div class="career-item-title">Collective rest</div>
</li>
</ul>
</div>
</section>
<div class="career-nav-wrap">
<div class="left-grad"></div>
<div class="right-grad"></div>
<div class="career-nav owl-carousel">
<div class="item"><div class="career-nav-item"><button data-slide="0" class="dashed">User Acquisition Manager</button></div></div>
<div class="item"><div class="career-nav-item"><button data-slide="1" class="dashed">User Acquisition User Acquisition Tehnologist</button></div></div>
<div class="item"><div class="career-nav-item"><button data-slide="2" class="dashed">Junior PHP Developer</button></div></div>
<div class="item"><div class="career-nav-item"><button data-slide="3" class="dashed">JavaScript (middle-senior)</button></div></div>
<div class="item"><div class="career-nav-item"><button data-slide="4" class="dashed">Developer middle</button></div></div>
<div class="item"><div class="career-nav-item"><button data-slide="5" class="dashed">Middle-senior</button></div></div>
</div>
</div>
<div class="vacancies-slider-wrap">
<div class="wrapper">
<div class="vacancies-overlay">
<div class="arrow-left">
<span class="circle circle1"></span>
<span class="circle circle2"></span>
<span class="circle circle3"></span>
<span class="title">prev vacancy</span>
</div>
<div class="arrow-right">
<span class="circle circle1"></span>
<span class="circle circle2"></span>
<span class="circle circle3"></span>
<span class="title">next vacancy</span>
</div>
<div class="vacancies-slider owl-carousel">
<div>
<div class="vacancies-item">
<div class="vacancy-text-wrap" data-more-text="See details">
<div class="vacancy-text">
<p>Etiam consequat ligula in erat rhoncus, ut bibendum purus auctor. Proin vel nisi velit. Vestibulum tincidunt ullamcorper elementum. Quisque finibus elementum tincidunt. Ut elementum tempor neque a pharetra. Integer eleifend tellus augue, nec luctus tortor laoreet vitae. Pellentesque libero elit, porta eget efficitur nec, dapibus ut risus. Mauris ac tempor urna.</p>
</div>
</div>
</div>
<div class="text-center vacancies-btn"><a href="#" data-toggle="scroll" class="btn btn-with-icon">Send resume<i class="fa fa-check" aria-hidden="true"></i></a></div>
</div>
<div>
<div class="vacancies-item">
<div class="vacancy-text-wrap" data-more-text="See details">
<div class="vacancy-text">
<p>Etiam consequat ligula in erat rhoncus, ut bibendum purus auctor. Proin vel nisi velit. Vestibulum tincidunt ullamcorper elementum. Quisque finibus elementum tincidunt. Ut elementum tempor neque a pharetra. Integer eleifend tellus augue, nec luctus tortor laoreet vitae. Pellentesque libero elit, porta eget efficitur nec, dapibus ut risus. Mauris ac tempor urna.</p>
</div>
</div>
</div>
<div class="text-center vacancies-btn"><a href="#" data-toggle="scroll" class="btn btn-with-icon">Send resume<i class="fa fa-check" aria-hidden="true"></i></a></div>
</div>
<div>
<div class="vacancies-item">
<div class="vacancy-text-wrap" data-more-text="See details">
<div class="vacancy-text">
<p>Etiam consequat ligula in erat rhoncus, ut bibendum purus auctor. Proin vel nisi velit. Vestibulum tincidunt ullamcorper elementum. Quisque finibus elementum tincidunt. Ut elementum tempor neque a pharetra. Integer eleifend tellus augue, nec luctus tortor laoreet vitae. Pellentesque libero elit, porta eget efficitur nec, dapibus ut risus. Mauris ac tempor urna.</p>
</div>
</div>
</div>
<div class="text-center vacancies-btn"><a href="#" data-toggle="scroll" class="btn btn-with-icon">Send resume<i class="fa fa-check" aria-hidden="true"></i></a></div>
</div>
<div>
<div class="vacancies-item">
<div class="vacancy-text-wrap" data-more-text="See details">
<div class="vacancy-text">
<p>Etiam consequat ligula in erat rhoncus, ut bibendum purus auctor. Proin vel nisi velit. Vestibulum tincidunt ullamcorper elementum. Quisque finibus elementum tincidunt. Ut elementum tempor neque a pharetra. Integer eleifend tellus augue, nec luctus tortor laoreet vitae. Pellentesque libero elit, porta eget efficitur nec, dapibus ut risus. Mauris ac tempor urna.</p>
</div>
</div>
</div>
<div class="text-center vacancies-btn"><a href="#" data-toggle="scroll" class="btn btn-with-icon">Send resume<i class="fa fa-check" aria-hidden="true"></i></a></div>
</div>
<div>
<div class="vacancies-item">
<div class="vacancy-text-wrap" data-more-text="See details">
<div class="vacancy-text">
<p>Etiam consequat ligula in erat rhoncus, ut bibendum purus auctor. Proin vel nisi velit. Vestibulum tincidunt ullamcorper elementum. Quisque finibus elementum tincidunt. Ut elementum tempor neque a pharetra. Integer eleifend tellus augue, nec luctus tortor laoreet vitae. Pellentesque libero elit, porta eget efficitur nec, dapibus ut risus. Mauris ac tempor urna.</p>
</div>
</div>
</div>
<div class="text-center vacancies-btn"><a href="#" data-toggle="scroll" class="btn btn-with-icon">Send resume<i class="fa fa-check" aria-hidden="true"></i></a></div>
</div>
<div>
<div class="vacancies-item">
<div class="vacancy-text-wrap" data-more-text="See details">
<div class="vacancy-text">
<p>Etiam consequat ligula in erat rhoncus, ut bibendum purus auctor. Proin vel nisi velit. Vestibulum tincidunt ullamcorper elementum. Quisque finibus elementum tincidunt. Ut elementum tempor neque a pharetra. Integer eleifend tellus augue, nec luctus tortor laoreet vitae. Pellentesque libero elit, porta eget efficitur nec, dapibus ut risus. Mauris ac tempor urna.</p>
</div>
</div>
</div>
<div class="text-center vacancies-btn"><a href="#" data-toggle="scroll" class="btn btn-with-icon">Send resume<i class="fa fa-check" aria-hidden="true"></i></a></div>
</div>
</div>
</div>
</div>
</div>
<section id="team" class="team">
<div class="team-dragon"><div class="team-dragon-eyes"></div></div>
<div class="wrapper">
<h2 class="title-section">Team</h2>
<div class="description-section">
Ut eleifend nisl efficitur diam aliquet, finibus tristique ipsum sodales. Sed vitae leo quam. Quisque tincidunt lorem sit amet augue dictum, suscipit volutpat leo auctor. Nunc rutrum ullamcorper bibendum. Nam efficitur bibendum mi sit amet imperdiet.
</div>
<div class="team-slider-wrap">
<div class="team-slider owl-carousel">
<div class="team-item animated">
<div class="team-item-image ">
<img data-src="img/background/team-boss.png" class="lazyload" alt="Team">
<div class="hearts">
<div class="heart heart1"></div>
<div class="heart heart2"></div>
<div class="heart heart3"></div>
<div class="heart heart4"></div>
<div class="heart heart5"></div>
</div>
</div>
<div class="team-item-name">Here I'm the boss!</div>
</div>
<div class="team-item">
<div class="team-item-image"><img data-src="img/team/1.png" class="lazyload" alt="img"></div>
<div class="team-item-post">designer</div>
<div class="team-item-name">Lorem ipsum</div>
</div>
<div class="team-item">
<div class="team-item-image"><img data-src="img/team/1.png" class="lazyload" alt="img"></div>
<div class="team-item-post">designer</div>
<div class="team-item-name">Lorem ipsum</div>
</div>
<div class="team-item">
<div class="team-item-image"><img data-src="img/team/2.png" class="lazyload" alt="img"></div>
<div class="team-item-post">designer</div>
<div class="team-item-name">Lorem ipsum</div>
</div>
<div class="team-item">
<div class="team-item-image"><img data-src="img/team/1.png" class="lazyload" alt="img"></div>
<div class="team-item-post">designer</div>
<div class="team-item-name">Lorem ipsum</div>
</div>
<div class="team-item">
<div class="team-item-image"><img data-src="img/team/2.png" class="lazyload" alt="img"></div>
<div class="team-item-post">designer</div>
<div class="team-item-name">Lorem ipsum</div>
</div>
<div class="team-item">
<div class="team-item-image"><img data-src="img/team/1.png" class="lazyload" alt="img"></div>
<div class="team-item-post">designer</div>
<div class="team-item-name">Lorem ipsum</div>
</div>
<div class="team-item">
<div class="team-item-image"><img data-src="img/team/2.png" class="lazyload" alt="img"></div>
<div class="team-item-post">designer</div>
<div class="team-item-name">Lorem ipsum</div>
</div>
</div>
</div>
<div class="for-question-team text-center">
<div class="question-team">Want to work with</div>
<div class="question-team">Wowmaking's crew?</div>
<div class="sugestion-team">Follow me I'll show you our vacancies</div>
<a href="#" class="btn btn-bordered">Interested? join us</a>
</div>
</div>
</section>
<section class="next-step">
<div class="wrapper">
<h2 class="title-next-step">Duis lectus nibh, ornare eu lorem ac</h2>
<ul class="links-steps list-unstyled">
<li>
<a href="#" id="footer-careeer">
<span class="image-block-step">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 51 51" style="enable-background:new 0 0 51 51;" xml:space="preserve">
<style type="text/css">
.nt0{fill:url(#SVGID_1_);}
.nt1{fill:#E56565;}
.nt2{fill:#3F3A34;}
@-webkit-keyframes career-hor {
0%{-webkit-transform: scale(0,1);}
10%{-webkit-transform: scale(1,1);}
12%{-webkit-transform: scale(1.2,1);}
14%, 60%{-webkit-transform: scale(1,1);}
70%, 100%{-webkit-transform: scale(0));}
}
@keyframes career-hor {
0%{transform: scale(0,1);}
10%{transform: scale(1,1);}
12%{transform: scale(1.2,1);}
14%, 60%{transform: scale(1,1);}
70%, 100%{transform: scale(0);}
}
@-webkit-keyframes career-dot {
0%, 85%, 100%{-webkit-transform: scale(0);}
10%{-webkit-transform: scale(1);}
12%{-webkit-transform: scale(1.2);}
14%, 60%{-webkit-transform: scale(1);}
}
@keyframes career-dot {
0%, 85%, 100%{transform: scale(0);}
10%{transform: scale(1);}
12%{transform: scale(1.2);}
14%, 60%{transform: scale(1);}
}
#career-line1, #career-line2{
-webkit-transform-origin: 19px 19px;
transform-origin: 19px 19px;
-webkit-animation: 2.4s career-hor linear infinite;
animation: 2.4s career-hor linear infinite;
}
#career-line2{
-webkit-transform-origin: 19px 30px;
transform-origin: 19px 30px;
-webkit-animation-delay: 0.24s;
animation-delay: 0.24s;
}
#career-line31, #career-line32, #career-line33, #career-line34{
-webkit-transform-origin: 19px 25px;
transform-origin: 19px 25px;
-webkit-animation: 2.4s career-hor 0.15s linear infinite;
animation: 2.4s career-hor 0.15s linear infinite;
}
#career-dot1, #career-dot2{
-webkit-transform-origin: 6px 18px;
transform-origin: 6px 18px;
-webkit-animation: 2.4s career-dot 0.34s linear infinite;
animation: 2.4s career-dot 0.34s linear infinite;
}
#career-dot2{
-webkit-transform-origin: 6px 34px;
transform-origin: 6px 34px;
-webkit-animation-delay: 0.54s;
animation-delay: 0.54s;
}
@-webkit-keyframes career-lock {
0% {-webkit-transform:rotate(0deg);}
5% {-webkit-transform:rotate(25deg);}
10% {-webkit-transform:rotate(-25deg);}
15% {-webkit-transform:rotate(13deg);}
20% {-webkit-transform:rotate(-13deg);}
25% {-webkit-transform:rotate(7deg);}
30% {-webkit-transform:rotate(-7deg);}
35%, 100% {-webkit-transform:rotate(0deg);}
}
@keyframes career-lock {
0% {transform:rotate(0deg);}
5% {transform:rotate(25deg);}
10% {transform:rotate(-25deg);}
15% {transform:rotate(13deg);}
20% {transform:rotate(-13deg);}
25% {transform:rotate(7deg);}
30% {transform:rotate(-7deg);}
35%, 100% {transform:rotate(0deg);}
}
#career-lock1, #career-lock2{
-webkit-transform-origin: 35px 28px;
transform-origin: 35px 28px;
-webkit-animation: 3.6s career-lock linear infinite;
animation: 3.6s career-lock linear infinite;
}
</style>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="28.4495" y1="17.2882" x2="40.6473" y2="29.486" gradientTransform="matrix(1 0 0 -1 0 53)">
<stop offset="0" style="stop-color:#3CD595"></stop>
<stop offset="1" style="stop-color:#88FF73"></stop>
</linearGradient>
<path class="nt0" id="career-lock2" d="M40.3,35.4H28.8c-0.9,0-1.6-0.7-1.6-1.6v-8.2c0-0.9,0.7-1.6,1.6-1.6h11.5c0.9,0,1.6,0.7,1.6,1.6v8.2
C42,34.6,41.2,35.4,40.3,35.4z"></path>
<g>
<path class="nt1" id="career-dot1" d="M5.8,18.1c-1.4,0-2.5-1.1-2.5-2.5s1.1-2.5,2.5-2.5s2.5,1.1,2.5,2.5S7.1,18.1,5.8,18.1z M5.8,14.8
c-0.5,0-0.8,0.4-0.8,0.8c0,0.5,0.4,0.8,0.8,0.8c0.5,0,0.8-0.4,0.8-0.8C6.6,15.2,6.2,14.8,5.8,14.8z"></path>
<path class="nt1" id="career-dot2" d="M5.8,36.2c-1.4,0-2.5-1.1-2.5-2.5c0-1.4,1.1-2.5,2.5-2.5s2.5,1.1,2.5,2.5C8.2,35.1,7.1,36.2,5.8,36.2z
M5.8,32.9c-0.5,0-0.8,0.4-0.8,0.8c0,0.5,0.4,0.8,0.8,0.8c0.5,0,0.8-0.4,0.8-0.8C6.6,33.3,6.2,32.9,5.8,32.9z"></path>
</g>
<g>
<path class="nt2" d="M0,46.9C0,49.2,1.8,51,4.1,51h21.4c2.3,0,4.1-1.8,4.1-4.1v-4.1H0V46.9z M1.6,44.4H28v2.5
c0,1.4-1.1,2.5-2.5,2.5H4.1c-1.4,0-2.5-1.1-2.5-2.5V44.4z"></path>
<path class="nt2" d="M1.6,6.6H28h0.8h0.8V4.1c0-2.3-1.8-4.1-4.1-4.1H4.1C1.8,0,0,1.8,0,4.1v37h1.6V6.6z M4.1,1.6h21.4
c1.4,0,2.5,1.1,2.5,2.5v0.8H1.6V4.1C1.6,2.8,2.8,1.6,4.1,1.6z"></path>
<rect x="10.7" y="46.1" class="nt2" width="8.2" height="1.6"></rect>
<path class="nt2" d="M34.5,8.2c-6.1,0-11.6,3.3-14.5,8.7l1.4,0.8c2.6-4.8,7.6-7.8,13-7.8c8.2,0,14.8,6.6,14.8,14.8
s-6.6,14.8-14.8,14.8c-5.5,0-10.5-3-13-7.8l-1.4,0.8c2.9,5.3,8.4,8.7,14.5,8.7c9.1,0,16.5-7.4,16.5-16.5S43.6,8.2,34.5,8.2z"></path>
<path id="career-lock1" class="nt2" d="M34.5,13.2c-3.6,0-6.6,3-6.6,6.6v3.4c-1,0.3-1.6,1.2-1.6,2.3v8.2c0,1.4,1.1,2.5,2.5,2.5h11.5
c1.4,0,2.5-1.1,2.5-2.5v-8.2c0-1.1-0.7-2-1.6-2.3v-3.4C41.1,16.1,38.2,13.2,34.5,13.2z M34.5,14.8c2.7,0,4.9,2.2,4.9,4.9V23h-1.6
v-3.3c0-1.8-1.5-3.3-3.3-3.3c-1.8,0-3.3,1.5-3.3,3.3V23h-1.6v-3.3C29.6,17,31.8,14.8,34.5,14.8z M36.2,23h-3.3v-3.3
c0-0.9,0.7-1.6,1.6-1.6s1.6,0.7,1.6,1.6V23z M41.1,33.7c0,0.5-0.4,0.8-0.8,0.8H28.8c-0.5,0-0.8-0.4-0.8-0.8v-8.2
c0-0.5,0.4-0.8,0.8-0.8h11.5c0.5,0,0.8,0.4,0.8,0.8V33.7z"></path>
<path class="nt2" d="M34.5,25.5c-1.4,0-2.5,1.1-2.5,2.5c0,1.1,0.7,2,1.6,2.3v3.4h1.6v-3.4c1-0.3,1.6-1.2,1.6-2.3
C37,26.6,35.9,25.5,34.5,25.5z M34.5,28.8c-0.5,0-0.8-0.4-0.8-0.8c0-0.5,0.4-0.8,0.8-0.8s0.8,0.4,0.8,0.8
C35.4,28.4,35,28.8,34.5,28.8z"></path>
<polygon class="nt2" id="career-line1" points="22.2,18.9 15.4,18.9 13.7,14.8 9.9,14.8 9.9,16.5 12.6,16.5 14.2,20.6 22.2,20.6 "></polygon>
<polygon class="nt2" id="career-line2" points="12.6,32.9 9.9,32.9 9.9,34.5 13.7,34.5 15.4,30.4 22.2,30.4 22.2,28.8 14.2,28.8 "></polygon>
</g>
<g>
<rect id="career-line31" x="13.5" y="22.2" class="nt1" width="10.7" height="1.6"></rect>
<rect id="career-line32" x="10.2" y="22.2" class="nt1" width="1.6" height="1.6"></rect>
<rect id="career-line33" x="15.2" y="25.5" class="nt1" width="9" height="1.6"></rect>
<rect id="career-line34" x="11.9" y="25.5" class="nt1" width="1.6" height="1.6"></rect>
</g>
</svg>
</span>
<span class="step-name">Careers</span>
</a>
</li>
<li>
<a href="#" id="footer-partners">
<span class="image-block-step">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 51 51" style="enable-background:new 0 0 51 51;" xml:space="preserve">
<style type="text/css">
.nt10{fill:url(#SVGID_1_3);}
.nt11{fill:url(#SVGID_2_3);}
.nt12{fill:#E56565;}
.nt13{fill:#3F3A34;}
@-webkit-keyframes partners-rotate {
0%{-webkit-transform: rotate(0deg);}
100%{-webkit-transform: rotate(360deg);}
}
@keyframes partners-rotate {
0%{transform: rotate(0deg);}
100%{transform: rotate(360deg);}
}
#partner-arrow1, #partner-arrow2{
-webkit-transform-origin: 16.6px 24.5px;
transform-origin: 16.6px 24.5px;
-webkit-animation: 3s partners-rotate linear infinite;
animation: 3s partners-rotate linear infinite;
}
#partner-arrow2{
-webkit-animation-duration: 1.4s;
animation-duration: 1.4s;
}
#partner-bell1, #partner-bell2, #partner-bell3, #partner-bell4{
}
</style>
<linearGradient id="SVGID_1_3" gradientUnits="userSpaceOnUse" x1="5.4002" y1="17.2712" x2="27.503" y2="39.374" gradientTransform="matrix(1 0 0 -1 0 53)">
<stop offset="0" style="stop-color:#3CD595"></stop>
<stop offset="1" style="stop-color:#88FF73"></stop>
</linearGradient>
<circle class="nt10" cx="16.5" cy="24.7" r="15.6"></circle>
<linearGradient id="SVGID_2_3" gradientUnits="userSpaceOnUse" x1="37.2218" y1="39.6331" x2="46.6814" y2="49.0927" gradientTransform="matrix(1 0 0 -1 0 53)">
<stop offset="0" style="stop-color:#3CD595"></stop>
<stop offset="1" style="stop-color:#88FF73"></stop>
</linearGradient>
<rect id="partner-bell4" x="41.1" class="st1" width="1.6" height="17.3"></rect>
<g>
<path class="st2" id="partner-bell1" d="M45.2,20.5v-0.8c0-1.8-1.5-3.3-3.3-3.3s-3.3,1.5-3.3,3.3v0.8c-2.4,1.2-4.1,3.7-4.1,6.6v4.1h1.6v-4.1
c0-3.2,2.6-5.8,5.8-5.8s5.8,2.6,5.8,5.8v4.1h1.6v-4.1C49.4,24.2,47.7,21.7,45.2,20.5z M40.3,19.9v-0.2c0-0.9,0.7-1.6,1.6-1.6
s1.6,0.7,1.6,1.6v0.2c-0.5-0.1-1.1-0.2-1.6-0.2C41.4,19.7,40.8,19.8,40.3,19.9z"></path>
<path class="st2" id="partner-bell2" d="M42,39.5c-1.4,0-2.5-1.1-2.5-2.5h-1.6c0,2.3,1.8,4.1,4.1,4.1s4.1-1.8,4.1-4.1h-1.6
C44.4,38.4,43.3,39.5,42,39.5z"></path>
</g>
<g>
<rect x="1.6" y="36.2" class="st3" width="1.6" height="4.9"></rect>
<path class="st3" d="M3.3,6.6h26.3v6.6h1.6v-9c0-2.3-1.8-4.1-4.1-4.1H5.8C3.5,0,1.6,1.8,1.6,4.1v9h1.6L3.3,6.6L3.3,6.6z M5.8,1.6
h21.4c1.4,0,2.5,1.1,2.5,2.5v0.8H3.3V4.1C3.3,2.8,4.4,1.6,5.8,1.6z"></path>
<rect x="29.6" y="36.2" class="st3" width="1.6" height="4.9"></rect>
<path class="st3" d="M1.6,46.9c0,2.3,1.8,4.1,4.1,4.1h21.4c2.3,0,4.1-1.8,4.1-4.1v-4.1H1.6V46.9z M3.3,44.4h26.3v2.5
c0,1.4-1.1,2.5-2.5,2.5H5.8c-1.4,0-2.5-1.1-2.5-2.5C3.3,46.9,3.3,44.4,3.3,44.4z"></path>
<rect x="12.3" y="46.1" class="st3" width="8.2" height="1.6"></rect>
<rect id="partner-arrow2" x="15.6" y="15.4" class="st3" width="1.7" height="10.1"></rect>
<rect id="partner-arrow1" x="15.6" y="17.4" class="st3" width="1.7" height="8.1"></rect>
<path class="st3" d="M16.5,41.1c9.1,0,16.5-7.4,16.5-16.5S25.5,8.2,16.5,8.2S0,15.6,0,24.7S7.4,41.1,16.5,41.1z M8.4,12.3l1.6,2.8
l1.4-0.8l-1.6-2.8c1.8-0.9,3.8-1.4,5.8-1.6v3.2h1.6V9.9c2.1,0.1,4.1,0.7,5.8,1.6l-1.6,2.8l1.4,0.8l1.6-2.8c1.7,1.1,3.2,2.6,4.3,4.3
L26,18.2l0.8,1.4l2.8-1.6c0.9,1.8,1.4,3.8,1.6,5.8H28v1.6h3.2c-0.1,2.1-0.7,4.1-1.6,5.8l-2.8-1.6L26,31.1l2.8,1.6
c-1.1,1.7-2.6,3.2-4.3,4.3l-1.6-2.8L21.5,35l1.6,2.8c-1.8,0.9-3.8,1.4-5.8,1.6v-3.2h-1.6v3.2c-2.1-0.1-4.1-0.7-5.8-1.6l1.6-2.8
L10,34.2L8.4,37c-1.7-1.1-3.2-2.6-4.3-4.3l2.8-1.6l-0.8-1.4l-2.8,1.6c-0.9-1.8-1.4-3.8-1.6-5.8h3.2v-1.6H1.7
c0.1-2.1,0.7-4.1,1.6-5.8l2.8,1.6l0.8-1.4l-2.8-1.6C5.2,14.9,6.6,13.4,8.4,12.3z"></path>
<path class="st3" id="partner-bell3" d="M48.5,32.9H35.4c-1.4,0-2.5,1.1-2.5,2.5s1.1,2.5,2.5,2.5h13.2c1.4,0,2.5-1.1,2.5-2.5S49.9,32.9,48.5,32.9z
M48.5,36.2H35.4c-0.5,0-0.8-0.4-0.8-0.8s0.4-0.8,0.8-0.8h13.2c0.5,0,0.8,0.4,0.8,0.8S49,36.2,48.5,36.2z"></path>
</g>
</svg>
</span>
<span class="step-name">Partners</span>
</a>
</li>
<li>
<a href="#" id="footer-contacts">
<span class="image-block-step">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 51 51" style="enable-background:new 0 0 51 51;" xml:space="preserve">
<style type="text/css">
.nt20{fill:url(#SVGID_1_1);}
.nt21{fill:#3F3A34;}
.nt22{fill:#E56565;}
.nt23{fill:none;stroke:#3F3A34;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:10;}
@-webkit-keyframes contacts-rotate {
0%, 20%, 40%, 100%{-webkit-transform: rotateX(0deg);}
10%{-webkit-transform: rotateX(45deg);}
30%{-webkit-transform: rotateX(30deg);}
}
@keyframes contacts-rotate {
0%, 20%, 40%, 100%{transform: rotateX(0deg);}
10%{transform: rotateX(45deg);}
30%{transform: rotateX(30deg);}
}
#contacts-top1, #contacts-top2{
-webkit-transform-origin: 24px 10px;
transform-origin: 24px 10px;
-webkit-animation: 3s contacts-rotate linear infinite;
animation: 3s contacts-rotate linear infinite;
}
@-webkit-keyframes contacts-hor {
0%{-webkit-transform: scale(0,1);}
10%{-webkit-transform: scale(1,1);}
12%{-webkit-transform: scale(1.2,1);}
14%, 60%{-webkit-transform: scale(1,1);}
70%, 100%{-webkit-transform: scale(0); -webkit-transform-origin: 57px 22px;);}
}
@keyframes contacts-hor {
0%{transform: scale(0,1);}
10%{transform: scale(1,1);}
12%{transform: scale(1.2,1);}
14%, 60%{transform: scale(1,1);}
70%, 100%{transform: scale(0); transform-origin: 57px 22px;}
}
@-webkit-keyframes contacts-hor2 {
0%{-webkit-transform: scale(0,1);}
10%{-webkit-transform: scale(1,1);}
12%{-webkit-transform: scale(1.2,1);}
14%, 60%{-webkit-transform: scale(1,1);}
70%, 100%{-webkit-transform: scale(0); -webkit-transform-origin: 37px 30px;);}
}
@keyframes contacts-hor2 {
0%{transform: scale(0,1);}
10%{transform: scale(1,1);}
12%{transform: scale(1.2,1);}
14%, 60%{transform: scale(1,1);}
70%, 100%{transform: scale(0); transform-origin: 37px 30px;}
}
#contacts-arrow1{
-webkit-transform-origin: 37px 22px;
transform-origin: 37px 22px;
-webkit-animation: 2.4s contacts-hor linear infinite;
animation: 2.4s contacts-hor linear infinite;
}
#contacts-arrow2{
-webkit-transform-origin: 52px 29px;
transform-origin: 52px 29px;
-webkit-animation: 2.4s contacts-hor2 0.1s linear infinite;
animation: 2.4s contacts-hor2 0.1s linear infinite;
}
</style>
<g>
<path class="nt21" d="M1.6,6.6H28v1.6h1.6V4.1c0-2.3-1.8-4.1-4.1-4.1H4.1C1.8,0,0,1.8,0,4.1v37h1.6V6.6z M4.1,1.6h21.4
c1.4,0,2.5,1.1,2.5,2.5v0.8H1.6V4.1C1.6,2.8,2.8,1.6,4.1,1.6z"></path>
<path class="nt21" d="M0,46.9C0,49.2,1.8,51,4.1,51h21.4c2.3,0,4.1-1.8,4.1-4.1v-4.1H0V46.9z M1.6,44.4H28v2.5
c0,1.4-1.1,2.5-2.5,2.5H4.1c-1.4,0-2.5-1.1-2.5-2.5C1.6,46.9,1.6,44.4,1.6,44.4z"></path>
<rect x="10.7" y="46.1" class="nt21" width="8.2" height="1.6"></rect>
<g>
<polygon class="nt21" points="42.7,9.9 42.7,12.7 42.8,12.6 42.8,18.9 44.4,18.9 44.4,9.9 "></polygon>
<polygon class="nt21" points="42.8,38.5 30.1,26.5 29,27.5 41.6,39.4 6.2,39.4 18.8,27.5 17.7,26.3 5,38.3 5,25.5 5,25.5 5,9.9
3.3,9.9 3.3,41.2 44.4,41.2 44.4,32.2 42.8,32.2 "></polygon>
</g>
</g>
<g>
<polygon class="nt22" id="contacts-arrow1" points="45.5,24.1 46.6,25.3 50.5,21.4 46.6,17.5 45.5,18.7 47.4,20.6 37,20.6 37,22.2 47.4,22.2 "></polygon>
<polygon class="nt22" id="contacts-arrow2" points="51,28.8 39.8,28.8 41.7,26.9 40.5,25.7 36.7,29.6 40.5,33.5 41.7,32.3 39.8,30.4 51,30.4 "></polygon>
</g>
<linearGradient id="SVGID_1_1" gradientUnits="userSpaceOnUse" x1="13.8625" y1="247.6" x2="33.6044" y2="227.8581" gradientTransform="matrix(1 0 0 1 0 -227)">
<stop offset="0" style="stop-color:#3CD595"></stop>
<stop offset="1" style="stop-color:#88FF73"></stop>
</linearGradient>
<path class="nt20" id="contacts-top1" d="M4,10.7l14.1,13.4c1.5,1.5,3.6,2.3,5.7,2.3s4.1-0.8,5.7-2.3l14.1-13.4C43.6,10.7,4,10.7,4,10.7z"></path>
<path class="nt23" id="contacts-top2" d="M4.1,10.7l14.1,13.4c1.5,1.5,3.6,2.3,5.7,2.3s4.1-0.8,5.7-2.3l14.1-13.4C43.7,10.7,4.1,10.7,4.1,10.7z"></path>
</svg>
</span>
<span class="step-name">Contacts</span>
</a>
</li>
</ul>
<div class="ask-dragon">
<a href="#" class="dragon-ask-your-step">Want to join us</a>
<div class="ask-dragon-image"></div>
<div class="ask-dragon-shadow"></div>
</div>
</div>
</section>
<footer id="point-us" class="footer">
<div class="wrapper">
<a href="#" class="footer-logo"><img data-src="img/logo-footer.png" class="lazyload" alt="img"></a>
<div class="footer-text">
<div class="footer-title">2018 All Rights Reserved.</div>
<div class="footer-description">
APraesent sit amet viverra mi, eget semper velit. Duis augue tortor, pretium id neque nec, dictum ornare massa. Aliquam eget efficitur diam, non molestie enim.
</div>
</div>
<div class="footer-content">
<div class="footer-col">
<div class="footer-title">Our address</div>
<div class="description-footer">Ut lacus purus, pulvinar ut mi at</div>
</div><div class="footer-col">
<div class="footer-title">Email us</div>
<div class="description-footer">
<a href="mailto:Lorem@ipsum.net">Lorem@ipsum.net</a>
</div>
</div>
</div>
</div>
</footer>
<button id="toTop" data-toggle="scroll" data-target="body" class="btn">
scroll top
</button>
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/jquery.formstyler.min.js"></script>
<script src="js/lazysizes.min.js" async></script>
<script src="js/script.js"></script>
</body>
</html>