/* 
	Table of Contents
	update on Thu Oct 25 2018 09:35:28 GMT+0300 (FLE Daylight Time)

	I.   Generic --------------------------------------
	     01. Reset ------------------------------------
	     02. Base -------------------------------------
	     03. animation --------------------------------
	     04. Fonts ------------------------------------
	     05. Helpers ----------------------------------
	         Clear ------------------------------------
	         Notext -----------------------------------
	         Hidden -----------------------------------
	         Alignleft --------------------------------
	         Alignright -------------------------------
	         Disabled ---------------------------------
	II.  Regions --------------------------------------
	     01. Container --------------------------------
	     02. Content ----------------------------------
	     03. Footer -----------------------------------
	     04. Header -----------------------------------
	     05. Main -------------------------------------
	     06. Shell ------------------------------------
	     07. Sidebar ----------------------------------
	     08. Wrapper ----------------------------------
	III. Modules --------------------------------------
	     01. Button -----------------------------------
	         Button Block -----------------------------
	     02. Form Elements ----------------------------
	     03. services ---------------------------------
	         Form -------------------------------------
	     04. section contact --------------------------
	     05. Divery god work here ---------------------
	     06.  -----------------------------------------
	     07. List -------------------------------------
	     08. Logo -------------------------------------
	     09. Nav --------------------------------------
	     10. Section  ---------------------------------
	     11. section secondary ------------------------
	     12. section about ----------------------------
	     13. section-team -----------------------------
	     14. services ---------------------------------
	     15. Slider -----------------------------------
 */

/* ------------------------------------------------------------ *\
	I.   Generic
\* ------------------------------------------------------------ */
/* ------------------------------------------------------------ *\
	Reset
\* ------------------------------------------------------------ */
*,
*:before,
*:after { padding: 0; margin: 0; outline: 0; box-sizing: border-box; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, main { display: block; }
html,
body { height: 100%; }
html { tap-highlight-color: rgba(0,0,0,0); scroll-behavior: smooth; }
body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; }
img, iframe, video, audio, object { max-width: 100%; }
img, iframe { border: 0 none; }
img { height: auto; display: inline-block; vertical-align: middle; }
b,
strong { font-weight: bold; }
address { font-style: normal; }
svg:not(:root) { overflow: hidden; }
a,
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
input[type="file"],
input[type="image"],
label[for] { cursor: pointer; }
a[href^="tel"],
button[disabled],
input[disabled],
textarea[disabled],
select[disabled] { cursor: default; }
button::-moz-focus-inner,
input::-moz-focus-inner { padding: 0; border: 0; }
input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
input[type="color"],
textarea,
a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { display: none; -webkit-appearance: none; }
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
textarea { overflow: auto; resize: none; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; }
button,
input,
optgroup,
select,
textarea { font-family: inherit; font-size: inherit; color: inherit; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; }
button,
select { text-transform: none; }
table { width: 100%; border-collapse: collapse; border-spacing: 0; }
nav ul,
nav ol { list-style: none outside none; }
/* ------------------------------------------------------------ *\
	Base
\* ------------------------------------------------------------ */
html, body { overflow-x: hidden; }
body { min-width: 330px; width: 100%; background: #fff; font-family: 'Open Sans', sans-serif; font-size: 14px; line-height: 1.3; color: #000; }
body  { background: #000; color: #fff; background-image: url(images/dot-grey.png); }
a { color: inherit; text-decoration: underline; }
a:hover { text-decoration: none; cursor: pointer; }
h1 { }
h2 { }
h3 { }
h4 { }
h5 { }
h6 { }
h3, h4 { font-size: 25px; text-transform: uppercase; text-align: center; margin: 100px 0 10px; color: #fff; opacity: 0.9; font-family: 'Gotham-Medium', sans-serif; }
h1,
h2,
h3,
h4,
h5,
h6 { margin-bottom: 0.65em; }
p,
ul,
ol,
dl,
table,
blockquote { margin-bottom: 1.3em; }
h1[class],
h2[class],
h3[class],
h4[class],
h5[class],
h6[class],
h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
h5:last-child,
h6:last-child,
p:last-child,
ul:last-child,
ol:last-child,
dl:last-child,
table:last-child,
blockquote:last-child { margin-bottom: 0; }
::-moz-selection { color: #000; background: #fffd37; }
::selection { color: #000; background: #fffd37; }
/* ------------------------------------------------------------ *\
	animation
\* ------------------------------------------------------------ */
@keyframes lab-supportMove {
    0% { opacity: 0.2; top: -50px; left: 240px; transform: scale(0.1); animation-duration: 0.1s}
    20% { opacity: 0.2; top: -60px; left: 220px; transform: scale(0.1); animation-duration: 0.1s}
    40% { opacity: 0.3; top: -95px; left: 220px; transform: scale(0.1); animation-duration: 0.1s}
    60% { opacity: 0.4; top: -85px; left: 175px; transform: scale(0.1); animation-duration: 0.2s}
    80% { opacity: 0.4; top: 160px; left: 130px; transform: scale(0.1); animation-duration: 0.2s}
    100% { opacity: 0.6; top: 175px; left: 95px; transform: scale(0.1); animation-duration: 0.1s}
    100% { opacity: 1; top: 75px; left: -5px; transform: scale(1); animation-duration: 0.4s}
}
@keyframes lab-formEffectMarketing {
    0% {transform: rotate(0) scale(1); }
    25% {transform: rotate(2deg) scale(1.05); }
    50% {transform: rotate(0deg) scale(1); }
    75% {transform: rotate(-2deg) scale(1.05); }
    100% {transform: rotate(0) scale(1); }
}
@keyframes lab-marketingMove {
    0% { opacity: 0.1; top: -80px; left: -90px; transform: scale(0.1); animation-duration: 0.1s}
    25% { opacity: 0.1; top: -95px; left: -90px; transform: scale(0.1); animation-duration: 0.2s}
    50% { opacity: 0.2; top: -25px; left: 80px; transform: scale(0.1); animation-duration: 0.1s}
    75% { opacity: 0.3; top: -55px; left: 100px; transform: scale(0.1); animation-duration: 0.1s}
    100% { opacity: 1; top: 25px; left: 200px; transform: scale(1); animation-duration: 0.4s}
}
@keyframes lab-paperScale {
    from {transform: scale(0); opacity: 0;}
    to {transform: scale(1); opacity: 1;}
}
@keyframes lab-dash {
    to {stroke-dashoffset: 0; }
}
@keyframes lab-dots {
    from {opacity: 0; }
    to {opacity: 1; }
}
@keyframes lab-promoVideosMove {
	0% { opacity: 0.4; top: 30px; left: 205px; transform: scale(0.1); animation-duration: 0.1s}
	20% { opacity: 0.4; top: 10px; left: 215px; transform: scale(0.1); animation-duration: 0.1s}
	50% { opacity: 0.5; top: 5px; left: 25px; transform: scale(0.1); animation-duration: 0.1s}
	75% { opacity: 0.6; top: -20px; left: 10px; transform: scale(0.1); animation-duration: 0.2s}
	100% { opacity: 1; top: 0; left: 0; transform: scale(1); animation-duration: 0.4s}
}
@keyframes lab-formEffectPromoVideos {
	0% {transform: rotate(0) scale(1); } 
	24% {transform: rotate(2deg) scale(1.05); }
	50% {transform: rotate(0deg) scale(1); }
	75% {transform: rotate(-2deg) scale(1.05); }
	100% {transform: rotate(0) scale(1); }
}
@keyframes lab-formEffectSupport {
    0% {transform: rotate(0) scale(1); }
    25% {transform: rotate(2deg) scale(1.05); }
    50% {transform: rotate(0deg) scale(1); }
    75% {transform: rotate(2deg) scale(1.05); }
    100% {transform: rotate(0) scale(1); }
}
@keyframes lab-formEffectWhitePaper {
	0% {transform: rotate(0) scale(1); }
	25% {transform: rotate(2deg) scale(1.05); }
	50% {transform: rotate(4deg) scale(1); }
	75% {transform: rotate(2deg) scale(1.05); }
	100% {transform: rotate(0) scale(1); }
}
@keyframes lab-clockwise {
    from { transform: rotate(360deg); }
    to { transform: rotate(0deg); }
}
@keyframes lab-rotating {
  from {-ms-transform: rotate(0deg); transform: rotate(0deg); }
  to {-ms-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes lab-whitePaperMove {
    0% { opacity: 0.4; top: 50px; left: -150px; transform: scale(0.1); animation-duration: 0.1s}
    10% { opacity: 0.5; top: 55px; left: -130px; transform: scale(0.1); animation-duration: 0.2s}
    60% { opacity: 0.6; top: -115px; left: -68px; transform: scale(0.1); animation-duration: 0.1s}
    80% { opacity: 0.8; top: -80px; left: -35px; transform: scale(0.1); animation-duration: 0.3s}
    100% { opacity: 1; top: 0; left: 160px; transform: scale(1); animation-duration: 0.4s}
}
@keyframes lab_float {
	from {transform: rotate(0deg) scale(1); }
	to {transform: rotate(90deg) scale(1.6); }
}
@keyframes lab_rotate {
	from {transform: rotate(0deg) scale(1); }
	to {transform: rotate(90deg) scale(1.6); }
}
@keyframes lab_rotateBack {
	from {transform: rotate(90deg) scale(1.6); }
	to {transform: rotate(0deg) scale(1); }
}
@keyframes about_icoRotate {
    from {transform: rotate(0deg) scale(0.8); } 
    to {transform: rotate(60deg) scale(1); }
}
@keyframes about_icoRotateBack {
	from {transform: rotate(60deg) scale(1); }
	to {transform: rotate(0deg) scale(0.8); }
}
@keyframes abput_companies {
    from {opacity: 0; }
    to {opacity: 1; }
}
@keyframes about_motionRotate {
	from {transform: rotate(0deg) scale(1); }
	to {transform: rotate(80deg) scale(1.7); }
}
@keyframes about_motionRotateBack {
	from {transform: rotate(80deg) scale(1.7); }
	to {transform: rotate(0deg) scale(1); }
}
@keyframes about_logo {
    to {transform: scale(10); }
}
@keyframes about_animationlogo {
    0% {transform: scale(1); }
    50% {transform: scale(1.5); }
    100% {transform: scale(1); }
}
@keyframes about_rubikRotateBack {
    from {transform: rotate(80deg) scale(1.7); }

    to {transform: rotate(0deg) scale(1); }
}
@keyframes about_rubikRotate {
    from {transform: rotate(0deg) scale(1); }
    to {transform: rotate(80deg) scale(1.7); }
}
@keyframes service_rotate {
	from {transform: rotate(0deg) scale(1); }
	to {transform: rotate(90deg) scale(1.4); }
}
@keyframes service_rotateBack {
	from {transform: rotate(90deg) scale(1.4); }
	to {transform: rotate(0deg) scale(1); }
}
@keyframes team_formRotate {
    to {transform: rotate(360deg); }
}
@keyframes team_teamPulse {
    0% {transform: scale(1); }
    70% {transform: scale(0.98); }
    80% {transform: scale(1); }
    90% {transform: scale(0.98); }
    100% {transform: scale(1); }
}
@keyframes itemDot {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes itemLines {
    to {
        stroke-dashoffset: 0;
    }
}
@keyframes infiniteRotate {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}
/* ------------------------------------------------------------ *\
	Fonts
\* ------------------------------------------------------------ */
@font-face {
    font-family: 'Gotham';
    src:  
        url('fonts/Gotham-Bold.eot?#iefix') format('embedded-opentype'),  
        url('fonts/Gotham-Bold.otf')  format('opentype'),
        url('fosnts/Gotham-Bold.woff') format('woff'), 
        url('fonts/Gotham-Bold.ttf')  format('truetype'), 
        url('fonts/Gotham-Bold.svg#Gotham-Bold') format('svg');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Gotham';
    src: 
    url('fonts/Gotham-Book.eot?#iefix') format('embedded-opentype'),  
        url('fonts/Gotham-Book.otf')  format('opentype'),
        url('fonts/Gotham-Book.woff') format('woff'), 
        url('fonts/Gotham-Book.ttf')  format('truetype'), 
        url('fonts/Gotham-Book.svg#Gotham-Book') format('svg');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Gotham';
    src: 
        url('fonts/Gotham-Medium.eot?#iefix') format('embedded-opentype'),  
        url('fonts/Gotham-Medium.otf')  format('opentype'),
        url('fonts/Gotham-Medium.woff') format('woff'), 
        url('fonts/Gotham-Medium.ttf')  format('truetype'), 
        url('fonts/Gotham-Medium.svg#Gotham-Medium') format('svg');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Gotham';
    src: 
        url('fonts/Gotham-Light.eot?#iefix') format('embedded-opentype'),  
        url('fonts/Gotham-Light.otf')  format('opentype'),
        url('fonts/Gotham-Light.woff') format('woff'), 
        url('fonts/Gotham-Light.ttf')  format('truetype'), 
        url('fonts/Gotham-Light.svg#Gotham-Light') format('svg');
    font-weight: 300;
    font-style: normal;
}
/* ------------------------------------------------------------ *\
	Helpers
\* ------------------------------------------------------------ */
/*  Clear  */
.clear:after { content: ''; line-height: 0; display: table; clear: both; }
/*  Notext  */
.notext { white-space: nowrap; text-indent: 100%; text-shadow: none; overflow: hidden; }
.notext-old { font-size: 0; line-height: 0; text-indent: -4000px; }
/*  Hidden  */
[hidden],
.hidden { display: none; }
/*  Alignleft  */
.alignleft { float: left; }
/*  Alignright  */
.alignright { float: right; }
/*  Disabled  */
[disabled],
.disabled { cursor: default; }
.visible {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.3 linear;
}
.half-visible {
    visibility: visible;
    opacity: 0.6;
    transition: opacity 0.3 linear;
}
.hidden {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s 0.3s, opacity 0.3s linear;
}
/* ------------------------------------------------------------ *\
	II.  Regions
\* ------------------------------------------------------------ */
/* ------------------------------------------------------------ *\
	Container
\* ------------------------------------------------------------ */
/* ------------------------------------------------------------ *\
	Content
\* ------------------------------------------------------------ */
/* ------------------------------------------------------------ *\
	Footer
\* ------------------------------------------------------------ */
/* ------------------------------------------------------------ *\
	Header
\* ------------------------------------------------------------ */
/* ------------------------------------------------------------ *\
	Main
\* ------------------------------------------------------------ */
/* ------------------------------------------------------------ *\
	Shell
\* ------------------------------------------------------------ */
.shell { max-width: 900px; margin: auto;  padding: 0 20px; }

@media(max-width: 1024px) {
    .shell { max-width: 380px; }
}
/* ------------------------------------------------------------ *\
	Wrapper
\* ------------------------------------------------------------ */
.wrapper { position: relative; min-height: 100%; overflow: hidden; }
/* ------------------------------------------------------------ *\
	Preloader
\* ------------------------------------------------------------ */
.wrapper { display: none; }
.preload { width: 200px; height: 200px; position: fixed; top: 30%; left: 40%; animation: infiniteRotate 4s infinite; animation-delay: 0s; }
.preload .logo { width: 100px; position: absolute; top: 25px; left: 50px; }

@media(max-width: 1024px) {
    .preload { width: 150px; height: 150px; left: 30%; }
    .preload .logo { width: 70px; left: 40px; }
}
/* ------------------------------------------------------------ *\
	III. Modules
\* ------------------------------------------------------------ */
/* ------------------------------------------------------------ *\
	Button
\* ------------------------------------------------------------ */
.btn { display: inline-block; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
/*  Button Block  */
.btn-block { display: block; padding-left: 0; padding-right: 0; }
.btn-burger  {  display: inline-block; width: 40px; height: 34px; position: relative; -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .5s ease-in-out; cursor: pointer; }
.btn-burger span {display: block; position: absolute; height: 4px; width: 100%; background: #000; opacity: 1; left: 0; -ms-transform: rotate(0deg); transform: rotate(0deg); transition: .25s ease-in-out; }
.btn-burger span:nth-child(1) {top: 0px; }
.btn-burger span:nth-child(2),
.btn-burger span:nth-child(3) {top: 15px; }
.btn-burger span:nth-child(4) {top: 30px; }
.btn-burger.open span:nth-child(1) {top: 18px; width: 0%; left: 50%; }
.btn-burger.open span:nth-child(2) { -ms-transform: rotate(45deg); transform: rotate(45deg); }
.btn-burger.open span:nth-child(3) { -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
.btn-burger.open span:nth-child(4) {top: 18px; width: 0%; left: 50%; }
/* ------------------------------------------------------------ *\
	Form Elements
\* ------------------------------------------------------------ */
input:-ms-input-placeholder { color: inherit; opacity: 1; }
input::placeholder { color: inherit; opacity: 1; }
textarea:-ms-input-placeholder { color: inherit; opacity: 1; }
textarea::placeholder { color: inherit; opacity: 1; }
input:-webkit-autofill { -webkit-text-fill-color: inherit !important; -webkit-box-shadow: 0 0 0 1000px #fff inset; }
/* ------------------------------------------------------------ *\
	services
\* ------------------------------------------------------------ */
.services { font-family: 'Gotham', sans-serif; padding-bottom: 100px; z-index: 99; }
.services-content { position: relative; z-index: 20; }
.services h4 { margin: 100px auto 50px; }
.services .services-info { font-size: 16px; line-height: 30px; font-family: 'Gotham-Light', sans-serif; margin: 30px auto 0; width: 40%; text-align: center; color: #fff; opacity: 0.9; }

@media(max-width: 1024px) {
    .services { padding: 30px 0; }
    .services .background { background: url(images/form-center-white.svg) no-repeat center center; width: 480px; height: 480px; position: absolute; transform: rotate(20deg); margin-left: -15%; }
    .services .container { max-width: 380px; margin: auto; }
    .services h3 { margin: 0; padding-top: 75px; color: #000; }
    .services h4 { margin: 150px auto 50px; }
    .services .services-info { width: 80%; margin: 0 auto; padding: 40px 0 80px; opacity: 0.9; line-height: 24px; letter-spacing: 0.2px; text-align: center; color: #000; }
}
/* ------------------------------------------------------------ *\
	services-list, pack-list
\* ------------------------------------------------------------ */
.pack-list { max-width: 1000px; width: 100%; margin: 0 auto; position: relative; z-index: 15; }
.packages-tabs-nav { list-style: none; margin: 0; }
.packages-tabs-nav a { text-decoration: none; display: inline-block; font-weight: 600; padding: 0 10px;  }
.packages-tabs-nav:after { content: ''; display: block; clear: both; }
.packages-tabs-nav li { width: 15%; height: 170px; background: url(images/form-general-white.svg) no-repeat center center; float: left; margin: 0 2.5%; position: relative; }
.packages-tabs-nav li a { text-align: center; color: #000; text-transform: uppercase; background-size: contain; font-size: 12px; line-height: 22px; margin: auto; position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 140px; }
.packages-tabs-info { margin-top: -20px; }
.packages-tabs-info:after { content: ''; display: block; clear: both; }
.tabs-item-info { display: none; width: 100%; }
.tabs-item-info.visible { display: block; }
.tabs-item-info .bottom-lines { position: relative; width: 100px; height: 100px; top: 0; }
.tabs-item-info .bottom-lines .line1 { position: absolute; top: 0; left: 40px; height: 50px; width: 50px; -ms-transform: rotate(20deg); transform: rotate(20deg); }
.tabs-item-info .bottom-lines .dot1 { position: absolute; top: 50px; right: 15px; height: 10px; width: 10px; opacity: 0; }
.tabs-item-info:first-child .bottom-lines .dot1 { opacity: 1; }
.tabs-item-info .bottom-lines .line2 { position: absolute; top: 60px; width: 50px; height: 50px; -ms-transform: rotate(85deg); transform: rotate(85deg); right: 20px; }
.tabs-item-info .bottom-lines.active .line1, .tabs-item-info:first-child .bottom-lines.active .line1 { stroke-dasharray: 100px; stroke-dashoffset: 100px; animation: itemLines 0.3s linear forwards; }
.tabs-item-info .bottom-lines.active .dot1, .tabs-item-info:first-child .bottom-lines.active .dot1 { animation: itemDot 0.2s forwards; animation-delay: 0.3s; }
.tabs-item-info .bottom-lines.active .line2, .tabs-item-info:first-child .bottom-lines.active .line2 { stroke-dasharray: 100px; stroke-dashoffset: 100px; animation: itemLines 0.3s linear forwards; animation-delay: 0.5s; }
@keyframes itemDot {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes itemLines {
    to { stroke-dashoffset: 0; }
}
#item-tab-list2 .bottom-lines.active { margin-left: 7%; }
#item-tab-list2 .bottom-lines.active { margin-left: 28%; }
#item-tab-list3 .bottom-lines.active { margin-left: 48%; }
#item-tab-list4 .bottom-lines.active { margin-left: 68%; }
#item-tab-list5 .bottom-lines.active { margin-left: 88%; }
.pack-item-inner-list { overflow: hidden; border-radius: 10px; position: relative; opacity: 0; margin-top: 10px; }
#item-tab-list1 .pack-item-inner-list { margin-left: 0; }
#item-tab-list2 .pack-item-inner-list { margin-left: 20%; }
#item-tab-list3 .pack-item-inner-list { margin-left: 40%; }
#item-tab-list4 .pack-item-inner-list { margin-left: 60%; }
#item-tab-list5 .pack-item-inner-list { margin-left: 75%; }
#item-tab-list1 .pack-item-inner-list.full { margin-left: 0; }
#item-tab-list2 .pack-item-inner-list.full { margin-left: 0; }
#item-tab-list3 .pack-item-inner-list.full { margin-left: 0; }
#item-tab-list4 .pack-item-inner-list.full { margin-left: 0; }
#item-tab-list5 .pack-item-inner-list.full { margin-left: 0; }
.pack-item-inner-list:first-child { opacity: 1; }
.tabs-item-info.visible .pack-item-inner-list { animation: itemFadeIn 1s forwards; animation-delay: 0.8s; }
@keyframes itemFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
.pack-item-inner-list.full { width: 100%; display: -ms-flexbox; display: flex; transition: 0.5s ease-in-out; }
.tabs-item-info:first-child .bottom-lines { margin-left: 7%; }
.left-side-nav { width: 400px; background: #fff url(images/shadow2.svg) no-repeat top right; background-size: 200% 200%; background-position: -20% 80%; padding-top: 15px; padding-bottom: 15px; position: relative; border-radius: 10px; z-index: 99; }
.pack-item-inner-list.full .left-side-nav { -ms-flex: 1; flex: 1; border-radius: 0; }
.packages-tabs2-nav li { margin: 15px 0; }
.packages-tabs2-nav li:hover, .packages-tabs2-nav li.active { background: #eaeaea; }
.packages-tabs2-nav li a { font-weight: 600;  text-decoration: none; width: 80%; margin: 0 auto; display: block; background: none; color: #000; text-transform: uppercase; font-size: 14px; padding: 20px 50px; position: relative; }
.packages-tabs2-nav li a:before { content: ''; width: 20px; height: 20px; background: url('images/dot-black.svg') no-repeat center center; position: absolute; top: 18px; left: 0; }
.pack-item-inner-list .btn {display: none;background: #3e3e3e; padding: 30px 0; position: absolute; bottom: 0; width: 100%; left: 0; }
.pack-item-inner-list .btn a { text-decoration: none; font-weight: 600; padding: 10px 50px; background: #fff; color: #000; font-family: 'Gotham-Medium', sans-serif; border-radius: 10px; text-transform: uppercase; margin-left: 10%; display: inline-block; transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; }
fieldset { border: 0; border-radius: 0; outline: 0; }
.pack-item-inner-list .btn a:before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: 5px solid #fff; border-radius: 10px; animation-duration: 1s; }
.pack-item-inner-list .btn a:hover:before, .pack-item-inner-list .btn a:focus:before, .pack-item-inner-list .btn a:active:before { animation-name: hvr-ripple-out; }
@keyframes hvr-ripple-out { 
    100% { top: -12px; right: -12px; bottom: -12px; left: -12px; opacity: 0; }
}
.pack-item-inner-list.full .pack-item-tab-info { -ms-flex: 2; flex: 2; padding: 50px 80px 50px; background: #eaeaea; }
.tabs2-item-info { display: none; opacity: 0; }
@keyframes opacity { 
    0% { opacity: 0; display: none; }
    100% { opacity: 1; display: block; }
}
.tabs2-item-info.visible ul { list-style: none; }
.tabs2-item-info.visible { display: block; animation: opacity forwards; animation-delay: 0.3s; }
.tabs2-item-info ul li { margin: 40px 0; }
.tabs2-item-info ul li p { color: #000; font-size: 14px; font-family: 'Gotham-Light', sans-serif; margin: 10px 0; }
.tab-title { font-weight: 600; }
.tabs2-item-info ul li p:first-child { font-family: 'Gotham-Bold', sans-serif; font-size: 16px; }
.services-contact-form { width: 80%; margin: 0 auto; position: relative; display: none; }
.services-contact-form .bottom-lines { position: relative; top: 0; left: 0; width: 75px; height: 160px; }
.services-contact-form .bottom-lines .line1 { position: absolute; right: 4px; top: 0; width: 50px; height: 50px; }
.services-contact-form .bottom-lines .dot1 { position: absolute; right: 0; top: 45px; width: 10px; height: 10px; opacity: 0; }
.services-contact-form .bottom-lines .line2 { position: absolute; right: 0; top: 50px; width: 40px; height: 50px; -ms-transform: rotate(70deg); transform: rotate(70deg); }
.services-contact-form .bottom-lines .dot2 { position: absolute; right: 24px; top: 95px; width: 10px; height: 10px; opacity: 0; }
.services-contact-form .bottom-lines .line3 { position: absolute; right: 35px; top: 95px; width: 30px; height: 30px; -ms-transform: rotate(110deg); transform: rotate(110deg);  }
.services-contact-form .bottom-lines .dot3 { position: absolute; left: 0; top: 115px; width: 10px; height: 10px; opacity: 0;  }
.services-contact-form .bottom-lines .line4 { position: absolute; left: 0; bottom: 0; width: 40px; height: 40px; -ms-transform: rotate(10deg); transform: rotate(10deg);  }
.services-contact-form .bottom-lines.visible .line1 { stroke-dasharray: 100px; stroke-dashoffset: 100px; animation: formLines 0.1s linear forwards;  }
.services-contact-form .bottom-lines.visible .dot1 { animation: formDot 0.1s forwards; animation-delay: 0.1s;  }
.services-contact-form .bottom-lines.visible .line2 { stroke-dasharray: 100px; stroke-dashoffset: 100px; animation: formLines 0.1s linear forwards; animation-delay: 0.2s;  }
.services-contact-form .bottom-lines.visible .dot2 { animation: formDot 0.1s forwards; animation-delay: 0.3s;  }
.services-contact-form .bottom-lines.visible .line3 { stroke-dasharray: 100px; stroke-dashoffset: 100px; animation: formLines 0.1s linear forwards; animation-delay: 0.4s;  }
.services-contact-form .bottom-lines.visible .dot3 { animation: formDot 0.1s forwards; animation-delay: 0.5s;  }
.services-contact-form .bottom-lines.visible .line4 { stroke-dasharray: 100px; stroke-dashoffset: 100px; animation: formLines 0.1s linear forwards; animation-delay: 0.6s;  }
@keyframes formLines { 
    to { stroke-dashoffset: 0;  }
}
@keyframes formDot { 
    from { opacity: 0;  } to { opacity: 1;  }
}
.services-contact-form .form-text { position: absolute; top: 50px; text-align: center; width: 100%; }
.services-contact-form .form-text p:first-child { color: #fff; font-family: 'Gotham-Bold', sans-serif; font-size: 16px; margin: 0 0 20px; }
.services-contact-form .form-text p:nth-child(2) { font-size: 14px; font-family: 'Gotham-Light', sans-serif; margin: 0 20px; color: #fff; }
.service-form { width: 100%; background: #eaeaea; border-radius: 10px; overflow: hidden; display: none; position: relative; transition: 0.3s ease-in-out; }
.service-form .form-shadow { position: absolute; bottom: 0; left: -10%; width: 130%; height: 130%; }
.service-form form { width: 80%; margin: 0 auto; padding: 50px 0; position: relative; z-index: 20; }
.service-form .user-info:after { content: ''; display: block; clear: both; }
.service-form input { background: #fff; width: 45%; color: #000; height: 50px; border: 0; outline: 0; border-radius: 5px; padding-left: 20px; float: left; }
.service-form input:nth-child(2) { float: right; }
.service-form label { color: #000; font-size: 14px; font-family: 'Gotham-Medium', sans-serif; margin: 20px 0; display: block; }
.service-form textarea { width: 100%; height: 300px; background: #fff; resize: none; border: 0; outline: 0; border-radius: 5px; }
.service-form .form-send-btn { background: #000; border: 2px solid #000; width: 200px; height: 50px; padding: 10px 0; margin: 30px auto 0; position: relative; display: block; }
.service-form .form-send-btn button { width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; color: #fff; background: transparent; outline: none; border: 0; font-size: 16px; font-family: 'Gotham-Bold', sans-serif; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); cursor: pointer; z-index: 30; }
.service-form .form-send-btn:after { content: ''; position: absolute; top: 0; left: 0; width: 0; height: 100%; background: #fff; transition: 0.3s ease-in-out; z-index: 20; }
.service-form .form-send-btn:hover button { color: #000; transition: 0.3s ease-in-out; }
.service-form .form-send-btn:hover:after { width: 100%; transition: 0.3s ease-in-out; }
.services-list { display: none; }

@media(max-width: 1024px) {
    .pack-list { display: none; }
    .services-list { display: block; }
    .services-list { padding: 15px; }
    .services-list .service {width: 180px; height: 180px; position: relative; z-index: 15; margin: 30px auto 0; margin-top: 40px; list-style: none; animation: team_teamPulse infinite ease-in-out; animation-duration: 3s; }
    .services-list .service.left { margin-left: 40px; animation-delay: 1s; }
    .services-list .service.right { margin-right: 40px; animation-delay: 3s; }
    .services-list .service .general-bgr {width: 100%; height: 100%; animation: service_rotateBack 0.5s forwards ease-in-out; }
    .services-list .service.effect .general-bgr {animation: service_rotate 0.5s forwards ease-in-out; }
    .services-list .service .title {width: 50%; position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: 0.5s ease-in-out; color: #000; letter-spacing: 1px; font-size: 13px; font-weight: normal; }
    .services-list .service.effect .title { margin-left: 30px; width: 100%; top: -30%; color: #fff; transition: 0.5s ease-in-out; }
    .services-list .service ul {opacity: 0; position: absolute; margin-left: 30px; top: 0; width: 100%; height: 100%; list-style: none; transition: 0.5s ease-in-out; display: flex; flex-direction: column; justify-content: center; }
    .services-list .service:hover ul {opacity: 1; transition: 0.5s ease-in-out;}
    .services-list .service ul li {text-align: left; font-size: 14px; color: #000; font-weight: 300; margin: 10px 0; line-height: 20px; animation: team_teamPulse infinite ease-in-out; animation-duration: 4s; }
    .services-list .service, .services-list .service ul li:nth-child(1) { animation-delay: 1s; }
    .services-list .service, .services-list .service ul li:nth-child(2) { animation-delay: 2s; }
    .services-list .service, .services-list .service ul li:nth-child(3) { animation-delay: 3s; }
    .services-list .service, .services-list .service ul li:nth-child(4) { animation-delay: 4s; }
    .services-list .service.effect { animation: none !important; }
    .services-list .dots { height: 100px; position: relative; list-style: none; }
    .services-list .dots .dot1 { width: 15px; position: absolute; top: 55px; }
    .services-list .dots .line1 { position: absolute; height: 100%; width: 25%;  }
    .services-list .dots .line2 { position: absolute; height: 110%; width: 35%; }
    .services-list .dots.right .dot1 { right: 55px; }
    .services-list .dots.right .line1 { right: 58px; top: -30px; transform: rotate(10deg); }
    .services-list .dots.right .line2 { right: 60px; top: 55px; transform: rotate(95deg); }
    .services-list .dots.left .dot1 { left: 50px }
    .services-list .dots.left .line1 { left: 38px; top: -35px; transform: rotate(75deg); }
    .services-list .dots.left .line2 { left: 65px; top: 50px; transform: rotate(350deg); }
    .services-list .dots.last .line2 { width: 236px; height: 236px; right: 60px; top: 10px; transform: rotate(109deg); }
    .services-list .more { width: 5px; height: 5px; border-radius: 10px; position: absolute; top: 55px; left: 50px; background: #fff; opacity: 1; list-style: none; transform: scaleY(0); transform-origin: top; transition: transform 0.3s ease; }
    .services-list .more.visible { transform: scaleY(1); width: 260px; height: auto; padding: 25px 15px 25px 25px; z-index: 100; }
    .services-list .dots.right .more { left: auto; right: 55px; }
    .services-list .more li { margin-bottom: 20px; }
    .services-list .more p { color: #000; font-weight: 100; }
    .services-list .more .tab-title { font-weight: bold; }
    .services-list .service a { text-decoration: underline !important; font-weight: 100; }
    .services-list .service a.bold { font-weight: bold; }
}

/* ------------------------------------------------------------ *\
	section contact
\* ------------------------------------------------------------ */
.contacts .shell { max-width: 1200px; }
.contacts { padding-bottom: 100px; z-index: 99; }
.contacts .container { position: relative; }
.contacts .container:after { content: ''; display: block; clear: both; }
.contacts h3 { margin: 50px 100px; }
.map { float: left; width: 40%; height: 500px; margin-top: 45px; margin-left: -50px; overflow: hidden; z-index: 999; -webkit-mask-image: url('images/form-general-white.svg'); -webkit-mask-repeat: no-repeat; -webkit-mask-size: 100% 100%; mask-image: url('images/form-general-white.svg'); mask-repeat: no-repeat; mask-size: 100% 100%; }
.contacts-info { position: absolute; z-index: 99; width: 720px; height: 300px; left: 20%; }
.contacts-info .adress { position: relative; z-index: 100; width: 20%; margin: 0 auto; }
.contacts-info .adress span { display: none; }
.contacts-info .adress p, .contacts-info .adress a { color: #fff; opacity: 0.9; text-decoration: none; font-size: 16px; font-family: 'Gotham-Light', sans-serif; }
.contacts-info .adress img { display: none; }
.contacts-info .path { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.contacts-info .path .line1 { width: 150px; height: 150px; right: 0; top: 25px; -ms-transform: rotate(200deg); transform: rotate(200deg); position: absolute; }
.contacts-info .path .img1 { left: 595px; top: 2px; }
.contacts-info .path .line2 { width: 130px; height: 130px; left: 480px; position: absolute; top: 20px; -ms-transform: rotate(80deg); transform: rotate(80deg); }
.contacts-info .path .img2 { top: 155px; left: 485px; }
.contacts-info .path .line3 { position: absolute; width: 100px; height: 100px; top: 110px; -ms-transform: rotate(135deg); transform: rotate(135deg); left: 370px; }
.contacts-info .path .img3 { top: 155px; left: 340px; }
.contacts-info .path .line4 { position: absolute; top: 160px; width: 70px; height: 70px; left: 275px; -ms-transform: rotate(90deg); transform: rotate(90deg); }
.contacts-info .path .img4 { top: 225px; left: 270px; }
.contacts-info .path .line5 { width: 250px; height: 250px; position: absolute; left: 75px; top: 30px; }
.contacts-info .path .img5 { top: 25px; left: 70px; }
.contacts-info .path .line6 { position: absolute; top: 30px; width: 70px; height: 70px; -ms-transform: rotate(95deg); transform: rotate(95deg); left: 0; }
.contacts-info .path img { width: 10px; height: 10px; position: absolute; }
.contacts .form { padding-right: 50px; width: 40%; float: right; position: relative; margin-top: 165px; }
.contacts form { width: 60%; position: absolute; right: 22%; bottom: 18%; z-index: 99; }
.contacts form h6 { color: #000; font-size: 22px; margin: 0 0 20px; font-family: 'Gotham-Bold', sans-serif; text-align: center; width: 90%; }
.contacts input { width: 45%; float: left; margin-right: 5%; border: 0; outline: 0; padding: 20px 0; border-bottom: 1px solid #000; color: #000; font-family: 'Gotham-Light', sans-serif; font-size: 14px; background: transparent; }
.contacts input: last-child { margin-right: 0; }
.contacts textarea { resize: none; border: 0; border-bottom: 1px solid #000; padding: 20px 0; color: #000; font-family: 'Gotham-Light', sans-serif; font-size: 14px; background: transparent; width: 100%; height: 100px; }
.contacts form .send-btn { width: 100%; height: 40px; padding: 10px 0; margin: 30px 0 0; position: relative; }
.contacts form .send-btn button { width: 75%; height: 100%; position: absolute; top: 50%; left: 50%; outline: none; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); cursor: pointer; z-index: 30; text-transform: uppercase; font-size: 12px; letter-spacing: 1.5px; color: #fff; background: #000; border: 1px solid #000; border-radius: 5px; transition: 0.3s all; }
.contacts form .send-btn:hover { }
.contacts form .send-btn:hover button { background: #fff; color: #000; }
.contact-bottom-right { width: 40%; -ms-transform: rotate(90deg); transform: rotate(90deg); }
.contact-bottom-right.form-bgr { width: 100%; transition: 0.8s ease-in-out; }
.contact-info-bgr { display: none; }

@media(max-width: 1024px){
    .contacts { padding: 80px 0; }
    .contacts .shell { max-width: 380px; }
    .contacts h3 { margin: 50px 0 10px;}
    .map { display: none; }
    .contact-bottom-right.form-bgr { display: none; }
    .contacts .container { height: 1042px; }
    .contacts-info { width: 80%; top: 600px; left: auto; right: 8%; }
    .contacts-info .adress { width: 70%; position: absolute; top: 20%; left: 20%; }
    .contacts-info .adress img { display: block; margin-bottom: 35px; }
    .contacts-info .adress p { margin: 25px 0; animation: lab-formEffectSupport 6s infinite; }
    .contacts-info .adress p:nth-child(2) { animation-delay: 2s; }
    .contacts-info .adress p:nth-child(3) { animation-delay: 1s; }
    .contacts-info .adress p:nth-child(4) { animation-delay: 3s; }
    .contacts-info span.medium { display: none; }
    .contacts-info .path { display: none; }
    .contact-info-bgr { display: block; width: 100%; transition: 0.8s ease-in-out; }
    .contacts .form { width: 80%; position: absolute; top: 260px; right: 8%; }
    .contacts form { width: 100%; right: 0; }
    .contacts form h6 { color: #fff; font-weight: normal; }
    .contacts input, .contacts textarea { width: 100%; border-color: #fff; color: #fff; }
    .contacts form .send-btn { width: 50%; background: transparent; border: 1px solid #fff; color: #fff; }
}

/* ------------------------------------------------------------ *\
	 Divery god work here
\* ------------------------------------------------------------ */
.contact-form-title { font-size: 15px !important; }
/* ------------------------------------------------------------ *\
	lab
\* ------------------------------------------------------------ */
.lab-form {position: relative; width: 600px; height: 600px; margin: 80px auto 0; z-index: 12; }
.lab-form.mobile { display: none; }
.lab-form .back-form {width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 13; animation: lab-rotating 70s linear infinite; }
.lab-form .front-form {position: absolute; width: 100%; height: 100%; z-index: 14; animation: lab-clockwise 30s linear infinite; }
.lab-form .wrapper-form {position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 75%; z-index: 16; }
.lab-logo {background: url(images/form-general-white.svg) no-repeat center center; background-size: contain; position: absolute; width: 28%; height: 28%; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: auto; z-index: 99; }
.lab-logo .logo {position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: auto; width: 45%; }
.lab-type {position: relative; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 75%; height: 80%; z-index: 100; }
.lab-type .info-form {z-index: 99; }
.lab-type div p {font-size: 10px; letter-spacing: 1px; text-transform: uppercase; font-weight: bold; min-width: 100px; text-align: center; position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.lab-type .buble {cursor: pointer; }
.lab-type .hover-buble {display: none; }
.lab-type .hover-buble.visible {display: block; }
.lab-type .hover-buble .long-path img {z-index: 99; }
.lab-type .hover-buble .info {background: url('images/form-center-black-2.svg') no-repeat center center; position: absolute; top: 0; right: 0; width: 100%; height: 100%; }
.lab-type .hover-buble .info h5 {color: #fff; text-transform: uppercase; font-size: 13px; text-align: center; font-family: 'Gotham-Medium', sans-serif; margin: 30px 0; }
.lab-type .hover-buble .info p {color: #fff; opacity: 0.9; text-align: center; font-size: 12px; line-height: 16px; letter-spacing: 1px; font-weight: normal; text-transform: inherit; margin: 10px 0 0; }
.lab-type .paper {position: absolute; top: 30px; left: 170px; width: 100px; height: 140px; }
.lab-type .paper .buble {width: 100px; height: 100px; position: absolute; top: 0; left: 0; -ms-transform: scale(0); transform: scale(0); background: url(images/form-center-white.svg) no-repeat center center; animation: lab-paperScale 0.4s ease-out forwards; animation-delay: 0.3s; -ms-transform-origin: 80% 100%; transform-origin: 80% 100%; }
.lab-type .paper .buble.effect {animation: lab-formEffectWhitePaper 6s infinite; animation-delay: 0.3s; }
.lab-type .paper p {font-family: 'Gotham-Bold', sans-serif; margin: auto; }
.lab-type .paper .path {position: absolute; bottom: 0; right: 5px; width: 35px; height: 50px; }
.lab-type .paper .path .line1 {-ms-transform: rotate(-75deg);transform: rotate(-75deg); position: absolute; bottom: 5px; left: 0; stroke-dasharray: 35px; stroke-dashoffset: 35px; animation: lab-dash 0.1s linear forwards; }
.lab-type .paper .path img {width: 15px; position: absolute; right: 5px; top: 17px; opacity: 0; animation: lab-dots 0.2s ease-out forwards; animation-delay: 0.1s; }
.lab-type .paper .path .line2 {-ms-transform: rotate(180deg);transform: rotate(180deg); position: absolute; top: 0; stroke-dasharray:35px; stroke-dashoffset:35px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.3s; }
.lab-type .paper .hover-buble {width: 360px; height: 270px; position: relative; top: -180px; left: 100px; }
.lab-type .paper .hover-buble .black-buble {position: absolute; top: 0; right: 0; width: 200px; height: 200px; }
.lab-type .paper .hover-buble .long-path {position: absolute; bottom: 0; left: 0; width: 160px; height: 210px; }
.lab-type .paper .hover-buble .long-path .line1 {position: absolute; bottom: 15px; left: 0; -ms-transform: rotate(-40deg); transform: rotate(-40deg); }
.lab-type .paper .hover-buble .long-path .img1 {position: absolute; bottom: 20px; left: 22px; width: 10px; }
.lab-type .paper .hover-buble .long-path .line2 {position: absolute; bottom: 37px; left: 2px; -ms-transform: rotate(244deg); transform: rotate(244deg); width: 130px; }
.lab-type .paper .hover-buble .long-path .img2 {position: absolute; top: 10px; left: 82px; width: 10px; }
.lab-type .paper .hover-buble .long-path .line3 {position: absolute; top: 17px; left: 87px; -ms-transform: rotate(0deg); transform: rotate(0deg); }
.lab-type .paper .hover-buble .long-path .img3 {position: absolute; top: 42px; left: 112px; width: 12px; }
.lab-type .paper .hover-buble .long-path .line4 {position: absolute; top: 37px; left: 120px; -ms-transform: rotate(330deg); transform: rotate(330deg); }
.lab-type .paper .hover-buble.visible .long-path .line1 {stroke-dasharray:35px; stroke-dashoffset:35px; animation: lab-dash 0.1s linear forwards; }
.lab-type .paper .hover-buble.visible .long-path .img1 {opacity: 0; animation: lab-dots 0.2s ease-out forwards; animation-delay: 0.1s; }
.lab-type .paper .hover-buble.visible .long-path .line2 {stroke-dasharray: 1000px; stroke-dashoffset: 1000px; animation: lab-dash 0.2s linear forwards; animation-delay: 0.2s; }
.lab-type .paper .hover-buble.visible .long-path .img2 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.4s; }
.lab-type .paper .hover-buble.visible .long-path .line3 {stroke-dasharray:45px; stroke-dashoffset:45px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.5s; }
.lab-type .paper .hover-buble.visible .long-path .img3 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.6s; }
.lab-type .paper .hover-buble.visible .long-path .line4 {stroke-dasharray:50px; stroke-dashoffset:50px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.7s; }
.lab-type .paper .hover-buble.visible .black-buble {position: absolute; -ms-transform: scale(0.1); transform: scale(0.1); animation: lab-whitePaperMove 0.8s ease-out forwards; -ms-transform-origin : 80% 100%; transform-origin : 80% 100%; }
.lab-type .videos {position: absolute; top: 205px; left: 30px; width: 150px; height: 105px; }
.lab-type .videos .buble {width: 100px; height: 100px; position: absolute; top: 0; left: 0; -ms-transform: scale(0); transform: scale(0); background: url(images/videos.svg) no-repeat center center; animation: lab-paperScale 0.4s ease-out forwards; -ms-transform-origin: 100% 100%; transform-origin: 100% 100%; animation-delay: 0.3s; }
.lab-type .videos .buble.effect {animation: lab-formEffectPromoVideos 4s infinite; animation-delay: 0.3s; }
.lab-type .videos p {font-family: 'Gotham-Bold', sans-serif; margin: auto; }
.lab-type .videos .path {position: absolute; right: 20px; width: 60px; height: 31px; bottom: 0px; }
.lab-type .videos .path .line1 {-ms-transform: rotate(85deg);transform: rotate(85deg); position: absolute; bottom: 6px; right: 3px; stroke-dasharray: 35px; stroke-dashoffset: 35px; animation: lab-dash 0.1s linear forwards; }
.lab-type .videos .path img {width: 12px; position: absolute; right: 22px; bottom: 0px; opacity: 0; animation: lab-dots 0.2s ease-out forwards; animation-delay: 0.1s; }
.lab-type .videos .path .line2 {-ms-transform: rotate(170deg);transform: rotate(170deg); position: absolute; top: 4px; left: 5px; stroke-dasharray: 35px; stroke-dashoffset: 35px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.3s; }
.lab-type .videos .hover-buble {position: absolute; width: 390px; height: 230px; left: -300px; top: -230px; }
.lab-type .videos .hover-buble .black-buble {position: absolute; width: 200px; height: 200px; }
.lab-type .videos .hover-buble .long-path {position: absolute; bottom: 0; right: 0; width: 230px; height: 100px; }
.lab-type .videos .hover-buble .long-path .line1 {position: absolute; bottom: 2px; right: 8px; -ms-transform: rotate(250deg); transform: rotate(250deg); }
.lab-type .videos .hover-buble .long-path .img1 {position: absolute; bottom: 25px; right: 10px; width: 10px; }
.lab-type .videos .hover-buble .long-path .line2 {position: absolute; bottom: -30px; right: 45px; -ms-transform: rotate(137deg); transform: rotate(137deg); width: 130px; }
.lab-type .videos .hover-buble .long-path .img2 {position: absolute; bottom: 31px; left: 22px; width: 10px; }
.lab-type .videos .hover-buble .long-path .line3 {position: absolute; left: 6px; top: 40px; -ms-transform: rotate(185deg); transform: rotate(185deg); }
.lab-type .videos .hover-buble.visible .long-path .line1 {stroke-dasharray:35px; stroke-dashoffset:35px; animation: lab-dash 0.1s linear forwards; }
.lab-type .videos .hover-buble.visible .long-path .img1 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.1s; }
.lab-type .videos .hover-buble.visible .long-path .line2 {stroke-dasharray:1000px; stroke-dashoffset:1000px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.2s; }
.lab-type .videos .hover-buble.visible .long-path .img2 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.3s; }
.lab-type .videos .hover-buble.visible .long-path .line3 {stroke-dasharray:45px; stroke-dashoffset:45px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.4s; }
.lab-type .videos .hover-buble.visible .black-buble {position: absolute; -ms-transform: scale(0.1); transform: scale(0.1); animation: lab-promoVideosMove 0.8s ease-out forwards; -ms-transform-origin: 80% 100%; transform-origin: 80% 100%; }
.lab-type .support {position: absolute; bottom: 22px; right: 150px; width: 130px; height: 140px; }
.lab-type .support .buble {width: 110px; height: 110px; position: absolute; bottom: 0px; right: 20px; -ms-transform: scale(0); transform: scale(0); background: url(images/form-center-white.svg) no-repeat center center; animation: lab-paperScale 0.4s ease-out forwards; animation-delay: 0.6s; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }
.lab-type .support .buble.effect {animation: lab-formEffectSupport 7s infinite; animation-delay: 0.6s; }
.lab-type .support p {margin: auto; font-family: 'Gotham-Bold', sans-serif; }
.lab-type .support .path {position: absolute; top: 0; right: 20px; width: 60px; height: 50px; }
.lab-type .support .path .line1 {-ms-transform: rotate(40deg);transform: rotate(40deg); position: absolute; top: 5px; left: 0; stroke-dasharray: 35px; stroke-dashoffset: 35px; animation: lab-dash 0.1s linear forwards; }
.lab-type .support .path .img1 {width: 10px; position: absolute; left: 0; top: 12px; opacity: 0; animation: lab-dots 0.2s ease-out forwards; animation-delay: 0.1s; }
.lab-type .support .path .line2 {-ms-transform: rotate(320deg);transform: rotate(320deg); position: absolute; top: 2px; right: 10px; stroke-dasharray: 50px; stroke-dashoffset: 50px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.3s; }
.lab-type .support .path .img2 {width: 15px; position: absolute; right: 0; top: 15px; opacity: 0; animation: lab-dots 0.2s ease-out forwards; animation-delay: 0.4s; }
.lab-type .support .path .line3 {-ms-transform: rotate(70deg);transform: rotate(70deg); position: absolute; top: 28px; right: 5px; stroke-dasharray: 35px; stroke-dashoffset: 35px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.6s; }
.lab-type .support .hover-buble {position: absolute; width: 360px; height: 300px; left: -360px; top: 5px; }
.lab-type .support .hover-buble .black-buble {position: absolute; bottom: 0; left: 0; width: 220px; height: 220px; }
.lab-type .support .hover-buble .long-path {position: absolute; top: 0px; right: 0; width: 200px; height: 300px; }
.lab-type .support .hover-buble .long-path .line1 {position: absolute; top: 46px; right: 0px; -ms-transform: rotate(165deg); transform: rotate(165deg); }
.lab-type .support .hover-buble .long-path .img1 {position: absolute; top: 45px; right: 22px; width: 10px; }
.lab-type .support .hover-buble .long-path .line2 {position: absolute; right: 17px; top: 20px; -ms-transform: rotate(218deg); transform: rotate(218deg); }
.lab-type .support .hover-buble .long-path .img2 {position: absolute; top: 10px; right: 27px; width: 10px; }
.lab-type .support .hover-buble .long-path .line3 {position: absolute; right: 38px; top: 6px; -ms-transform: rotate(120deg); transform: rotate(120deg); }
.lab-type .support .hover-buble .long-path .img3 {position: absolute; top: 17px; right: 65px; width: 15px; }
.lab-type .support .hover-buble .long-path .line4 {position: absolute; width: 180px; -ms-transform: rotate(415deg); transform: rotate(415deg); top: 55px; right: 6px; }
.lab-type .support .hover-buble .long-path .img4 {position: absolute; bottom: 20px; right: 110px; width: 15px; }
.lab-type .support .hover-buble .long-path .line5 {position: absolute; bottom: 7px; right: 125px; -ms-transform: rotate(110deg); transform: rotate(110deg); }
.lab-type .support .hover-buble .long-path .img5 {position: absolute; bottom: 6px; right: 150px; width: 10px; }
.lab-type .support .hover-buble .long-path .line6 {position: absolute; bottom: 10px; left: 22px; -ms-transform: rotate(180deg); transform: rotate(180deg); }
.lab-type .support .hover-buble.visible .long-path .line1 {stroke-dasharray:35px; stroke-dashoffset:35px; animation: lab-dash 0.1s linear forwards; }
.lab-type .support .hover-buble.visible .long-path .img1 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.1s; }
.lab-type .support .hover-buble.visible .long-path .line2 {stroke-dasharray:35px; stroke-dashoffset:35px; animation: lab-dash 0.2s linear forwards; animation-delay: 0.2s; }
.lab-type .support .hover-buble.visible .long-path .img2 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.4s; }
.lab-type .support .hover-buble.visible .long-path .line3 {stroke-dasharray:45px; stroke-dashoffset:45px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.5s; }
.lab-type .support .hover-buble.visible .long-path .img3 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.6s; }
.lab-type .support .hover-buble.visible .long-path .line4 {stroke-dasharray:1000px; stroke-dashoffset:1000px; animation: lab-dash 0.2s linear forwards; animation-delay: 0.7s; }
.lab-type .support .hover-buble.visible .long-path .img4 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.9s; }
.lab-type .support .hover-buble.visible .long-path .line5 {stroke-dasharray:45px; stroke-dashoffset:45px; animation: lab-dash 0.1s linear forwards; animation-delay: 1.0s; }
.lab-type .support .hover-buble.visible .long-path .img5 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 1.1s; }
.lab-type .support .hover-buble.visible .long-path .line6 {stroke-dasharray:45px; stroke-dashoffset:45px; animation: lab-dash 0.1s linear forwards; animation-delay: 1.2s; }
.lab-type .support .hover-buble.visible .black-buble {position: absolute; -ms-transform: scale(0.1); transform: scale(0.1); animation: lab-supportMove 1.3s ease-out forwards; }
.lab-type .marketing {position: absolute; top: 220px; right: 30px; width: 125px; height: 100px; }
.lab-type .marketing .buble {width: 100px; height: 100px; position: absolute; top: 0; right: 0; -ms-transform: scale(0); transform: scale(0); background: url(images/videos.svg) no-repeat center center; animation: lab-paperScale 1s ease-out forwards; animation-delay: 0.4s; -ms-transform-origin: 30% 70%; transform-origin: 30% 70%; z-index: 20; }
.lab-type .marketing .buble.effect {animation: lab-formEffectMarketing 5s infinite; animation-delay: 0.4s; }
.lab-type .marketing p {margin: auto; font-family: 'Gotham-Bold', sans-serif; }
.lab-type .marketing .path {position: absolute; bottom: 18px; left: 0; width: 30px; height: 24px; }
.lab-type .marketing .path .line1 {-ms-transform: rotate(15deg);transform: rotate(15deg); position: absolute; top: 0; left: 0; stroke-dasharray: 35px; stroke-dashoffset: 35px; animation: lab-dash 0.1s linear forwards; }
.lab-type .marketing .path img {width: 10px; position: absolute; left: 8px; top: 12px; opacity: 0; animation: lab-dots 0.2s ease-out forwards; animation-delay: 0.1s; }
.lab-type .marketing .path .line2 {-ms-transform: rotate(270deg);transform: rotate(270deg); position: absolute; top: 0; right: 0; stroke-dasharray: 35px; stroke-dashoffset: 35px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.3s; }
.lab-type .marketing .hover-buble {width: 400px; height: 230px; position: absolute; top: -33px; left: 65px; }
.lab-type .marketing .hover-buble .black-buble {position: absolute; bottom: 12px; right: 0; width: 200px; height: 200px; }
.lab-type .marketing .hover-buble .long-path {position: absolute; top: 0; left: 0; width: 270px; height: 130px; }
.lab-type .marketing .hover-buble .long-path .line1 {position: absolute; top: 8px; left: 0px; -ms-transform: rotate(197deg); transform: rotate(197deg); }
.lab-type .marketing .hover-buble .long-path .img1 {position: absolute; top: 0px; left: 0; width: 10px; }
.lab-type .marketing .hover-buble .long-path .line2 {position: absolute; bottom: 28px; left: 28px; -ms-transform: rotate(337deg); transform: rotate(337deg); width: 150px; }
.lab-type .marketing .hover-buble .long-path .img2 {position: absolute; bottom: 50px; left: 175px; width: 12px; }
.lab-type .marketing .hover-buble .long-path .line3 {position: absolute; right: 65px; top: 45px; -ms-transform: rotate(260deg); transform: rotate(260deg); }
.lab-type .marketing .hover-buble .long-path .img3 {position: absolute; top: 33px; width: 12px; right: 60px; }
.lab-type .marketing .hover-buble .long-path .line4 {position: absolute; top: 35px; -ms-transform: rotate(-5deg); transform: rotate(-5deg); right: 45px; }
.lab-type .marketing .hover-buble.visible .long-path .line1 {stroke-dasharray:35px; stroke-dashoffset:35px; animation: lab-dash 0.1s linear forwards; }
.lab-type .marketing .hover-buble.visible .long-path .img1 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.1s; }
.lab-type .marketing .hover-buble.visible .long-path .line2 {stroke-dasharray:1000px; stroke-dashoffset:1000px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.2s; }
.lab-type .marketing .hover-buble.visible .long-path .img2 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.3s; }
.lab-type .marketing .hover-buble.visible .long-path .line3 {stroke-dasharray:45px; stroke-dashoffset:45px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.4s; }
.lab-type .marketing .hover-buble.visible .long-path .img3 {opacity: 0; animation: lab-dots 0.1s ease-out forwards; animation-delay: 0.5s; }
.lab-type .marketing .hover-buble.visible .long-path .line4 {stroke-dasharray:45px; stroke-dashoffset:45px; animation: lab-dash 0.1s linear forwards; animation-delay: 0.6s; }
.lab-type .marketing .hover-buble.visible .black-buble {position: absolute; -ms-transform: scale(0.1); transform: scale(0.1); animation: lab-marketingMove 1.3s ease-out forwards; }

@media(max-width: 1024px) {
    .lab-form { display: none; }
    .lab-form.mobile { display: block; width: 340px; height: 340px; margin-top: 30px;}
    .lab-form.mobile .back-form, .lab-form.mobile .front-form { width: 80%; height: 80%; left: 10%; }
    .lab-form.mobile .wrapper-form, .lab-form.mobile .lab-logo { width: 55%; top: 40%; }
    .lab-form.mobile .lab-logo { background: none; }
    .lab-form.mobile .lab-logo .logo { width: 80px; }
    .lab-form.mobile .lab-type { top: 360px; z-index: 9; }
    .lab-form.mobile .lab-type .info-form { position: relative !important; top: 0 !important; left: 0 !important; right: 0 !important; height: 120px !important; width: 200px !important; animation: team_teamPulse infinite ease-in-out; animation-duration: 3s; }
    .lab-form.mobile .lab-type .buble { position: relative !important; top: 0 !important; left: 0 !important; right: 0 !important; height: 150px !important; width: 150px !important; }
    .lab-form.mobile .lab-type .buble { background-image: url(images/dot-black.svg); }
    .lab-form.mobile .lab-type .paper, .lab-form.mobile .lab-type .support { left: 33% !important; animation-delay: 2s; }
    .lab-form.mobile .lab-type .videos, .lab-form.mobile .lab-type .marketing { left: 20% !important; animation-delay: 3s; }
    .lab-form.mobile .lab-type .paper { animation-delay: 1s; }
    .lab-form.mobile .lab-type div p { color: #fff; text-transform: uppercase; letter-spacing: 1px; }
    .lab-form.mobile .lab-type .buble { animation: none; }
    .lab-form.mobile .lab-type .buble { width: 40%; height: 100%; position: absolute; top: 0; left: 0; }
    .lab-form.mobile .lab-type .buble { animation: lab_rotateBack 0.5s forwards ease-in-out; transform-origin: unset !important; }
    .lab-form.mobile .lab-type .buble.effect {animation: lab_rotate 0.5s forwards ease-in-out; }
    .lab-form.mobile .lab-type .buble p {opacity: 1; transition: 0.5s ease-in-out; }
    .lab-form.mobile .lab-type .buble.effect p { opacity: 0; }
    .lab-form.mobile .lab-type .text {opacity: 0; position: absolute; height: 20%; top: 5%; width: 100%; z-index: 99; transition: 0.5s ease-in-out; }
    .lab-form.mobile .lab-type .text.effect {opacity: 1; transition: 0.5s ease-in-out; }
    .lab-form.mobile .lab-type .text h5 { padding-left: 15%; font-size: 14px; font-weight: normal; text-transform: uppercase; color: #fff; }
    .lab-form.mobile .lab-type .text p { width: 80%; left: 40%; top: 80px; font-size: 12px; line-height: 20px; letter-spacing: 1px; text-transform: capitalize; }

    .lab-form.mobile .lab-type .dots { height: 100px; position: relative; }
    .lab-form.mobile .lab-type .dots .dot1 { width: 15px; position: absolute; top: 50%; }
    .lab-form.mobile .lab-type .dots .line1 { position: absolute; height: 100%; width: 25%;  }
    .lab-form.mobile .lab-type .dots .line2 { position: absolute; height: 100%; width: 20%; }
    .lab-form.mobile .lab-type .dots.right .dot1 { right: 10%; }
    .lab-form.mobile .lab-type .dots.right .line1 { right: 35px; top: 5px; transform: rotate(340deg); }
    .lab-form.mobile .lab-type .dots.right .line2 { right: 50px; top: 50px; transform: rotate(75deg); }
    .lab-form.mobile .lab-type .dots.left .dot1 { left: 20%; }
    .lab-form.mobile .lab-type .dots.left .line1 { left: 18%; top: -18%; transform: rotate(100deg); }
    .lab-form.mobile .lab-type .dots.left .line2 { left: 18%; top: 65%; transform: rotate(375deg); }
    .lab-form.mobile .lab-type .dots.last .line2 { width: 236px; height: 236px; right: 60px; top: 10px; transform: rotate(109deg); }
}

/* ------------------------------------------------------------ *\
	List
\* ------------------------------------------------------------ */
[class^="list-"] { list-style: none outside none; }
/* ------------------------------------------------------------ *\
	Logo
\* ------------------------------------------------------------ */
/* ------------------------------------------------------------ *\
	Nav
\* ------------------------------------------------------------ */
.nav { position: absolute; top: 30px; left: calc(50% - 240px); z-index: 100; width: 480px; transition: 0.5s ease-in-out;}
.nav ul { position: relative; bottom: 0; font-size: 20px; display: flex; justify-content: space-between; }
.nav li { display: block; padding: 4px 0; }
.nav a { text-decoration: none; display: inline-block; letter-spacing: 1px; font-size: 16px; }
.nav a:hover { opacity: 0.7; transition: all .3s; }
.nav .btn-ham { display: none; }

.nav.burger-mode { position: fixed; top: 20px; right: 50px; left: auto; width: auto; }
.nav.burger-mode a { text-transform: uppercase; font-size: 14px; font-weight: bold; }
.nav.burger-mode ul { display: block; position: absolute; bottom: 50px; left: 0px; z-index: 2; text-align: center; width: 100%; color: #000; }
.nav.burger-mode ul { opacity: 0; visibility: hidden; transition: all .15s; }
.nav.burger-mode svg { overflow: visible; width: 100%; }
.nav.burger-mode .btn-ham { display: inline-block; position: relative; width: 70px; height: 70px; transition: all .3s; }
.nav.burger-mode .btn-ham .btn-burger { position: absolute; width: 35px; right: 55%; top: 32px; margin-right: -21px; }
.nav.burger-mode .btn-ham.open { width: 300px; height: 300px; }
.nav.burger-mode .btn-ham.open .btn-burger { position: absolute; top: 40px; right: 55%; margin-right: -21px; }
.nav.burger-mode .btn-ham.open + ul { opacity: 1; visibility: visible; transition: all .3s;  }
.btn-burger span { height: 3px; }
.btn-burger span:nth-child(1) { top: -10px; }
.btn-burger span:nth-child(2), .btn-burger span:nth-child(3) { top: 0; }
.btn-burger span:nth-child(4) { top: 10px; }

@media(max-width: 1024px){
    .nav.burger-mode { right: 20px; }
}

/* ------------------------------------------------------------ *\
	Section-hero
\* ------------------------------------------------------------ */
.section-hero { font-family: 'Gotham', sans-serif; padding-top: 200px; position: relative; background-image: url(images/form-hole-white.png); background-position: bottom; background-size: cover; }
.section-hero .shell { position: relative; z-index: 3; }
.section-hero .section-hero-center-bg { width: 520px; height: 500px; margin: 0 auto; background-size: 100%; background-repeat: no-repeat; display: block; position: relative; animation: lab-formEffectPromoVideos 9s infinite; }
.section-hero .lines { width: 100%;  height: 100%; position: absolute; top: 0; left: 0; }
.section-hero .lines .dot { width: 10px; position: absolute; top: 50%; left: 50%; }
.section-hero .lines .line { width: 150px; height: 150px; position: absolute; top: 36%; left: 36.5%; }
.section-hero .section-hero-logo { position: absolute; top: 0; left: 0; width: 50%; height: 50%; }
.section-hero .section-hero-logo { display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; }
.section-hero .section-hero-logo img { width: 100%; height: auto; max-width: 120px; position: relative; top: 30px; left: 30px; }
.section-hero .section-slogan { position: absolute; bottom: 0; left: 50%; width: 50%; height: 55%; z-index: 1; color: #000; padding: 20px; max-width: 200px; font-size: 20px; }
.section-hero .section-slogan { display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; }
.section-hero .section-slogan strong { font-weight: 400; line-height: 1.2; letter-spacing: 1px; }
.section-hero .section-slogan small { display: block; font-size: 12px; letter-spacing: 0.5px; margin-top: 10px; }
.section-hero .left-dots { position: absolute; top: 50%; right: 100%; margin-right: 40px; width: 260px; height: 50px; z-index: 15; }
.section-hero .left-dots .dot1 { position: absolute; bottom: -20px; right: 20px; width: 20px; }
.section-hero .left-dots .dot2 { position: absolute; top: 0; right: 100px; width: 15px; }
.section-hero .left-dots .dot3 { position: absolute; bottom: 0; right: 180px; width: 8px; }
.section-hero .right-dots { position: absolute; top: 50%; left: 100%; margin-left: 30px; width: 260px; height: 50px; z-index: 15; }
.section-hero .right-dots .dot1 {position: absolute; top: -40px; left: 170px; width: 20px; }
.section-hero .right-dots .dot2 {position: absolute; bottom: 20px; left: 100px; width: 15px; }
.section-hero .right-dots .dot3 {position: absolute; top: -25px; left: 30px; width: 8px; }
.section-hero .bottom-dots { max-width: 500px; margin: 0 auto; position: relative; height: 70px; animation: lab-formEffectPromoVideos 9s infinite; }
.section-hero .bottom-dots .dot1 { width: 25px; position: absolute; top: 40px; left: 45%; margin-left: -100px; }
.section-hero .bottom-dots .dot2 { width: 15px; position: absolute; top: 90px; left: 45%; margin-left: -50px; }
.section-hero .slogan-secondary { width: 200px; height: 200px; background-size: 100%; background-repeat: no-repeat; margin: 60px auto 10px; margin-right: 46%; }
.section-hero .slogan-secondary { display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; animation: lab-formEffectPromoVideos 9s infinite; }
.section-hero .slogan-secondary span { position: relative; z-index: 2; color: #000; max-width: 100px; text-align: center; text-transform: uppercase; font-size: 16px; line-height: 30px; letter-spacing: 1px; margin-left: -10px; }
.section-hero .section-foot { display: block; margin: 0 auto; margin-right: 45%; max-width: 200px; min-height: 260px; text-align: center; font-weight: 300; font-size: 15px; animation: lab-formEffectPromoVideos 9s infinite; }
.section-hero .section-foot .bottom-dots { max-width: 500px; margin: 0 auto; position: relative; height: 80px; margin-bottom: 20px; }
.section-hero .section-foot .bottom-dots .dot1 { width: 15px; position: absolute; top: 10px; left: 20%; margin-left: 50px; }
.section-hero .section-foot .bottom-dots .dot2 { width: 6px; position: absolute; top: 50px; left: 50%; margin-left: 20px; }
.section-hero .section-foot .down-arrow { position: relative; top: -30px; }
.section-hero .section-foot p { width: 280px; font-size: 14px; line-height: 22px; text-transform: uppercase; margin-left: -30px; }
/* .section-hero .form-left-black { background: url(images/form-center-black.svg) no-repeat; background-size: contain; transform: rotate(95deg); height: 800px; width: 800px; position: absolute; bottom: -800px; left: -600px; z-index: 2; }
.section-hero .form-right-black { background: url(images/form-center-black.svg) no-repeat; background-size: contain; transform: rotate(95deg); height: 800px; width: 800px; position: absolute; bottom: -800px; right: -600px; z-index: 2; } */

@media(max-width: 1024px){
	.section-hero { padding-top: 110px; background-position-x: 45%; } 
	.section-hero .section-hero-center-bg { width: 300px; height: 300px; } 
    .section-hero .section-hero-logo img { max-width: 70px; top: 10px; left: 25px; }
    .section-hero .lines .dot { width: 8px; top: 48%; }
    .section-hero .lines .line { width: 80px; height: 80px; top: 36%; left: 38%; }
    .section-hero .lines:before { width: 100px; left: -39px; }
    .section-hero .section-slogan { height: 50%; font-size: 13px; left: 30%; opacity: .8; }
	.section-hero .section-slogan small { margin-top: 5px; font-size: 8px; letter-spacing: 0; }
    .section-hero .slogan-secondary { margin-right: auto; margin-top: 20px; width: 140px; height: 140px; font-size: 13px; }
    .section-hero .slogan-secondary span { font-size: 12px; line-height: 20px; margin-left: 0; }
    .section-hero .left-dots .dot1, .section-hero .right-dots { display: none; }
	.section-hero .bottom-dots { height: 40px; }
    .section-hero .bottom-dots .dot1 { display: none; }
    .section-hero .bottom-dots .dot2 { top: 20px; left: 50%; }
    .section-hero .section-foot { margin-right: auto; }
    .section-hero .section-foot .bottom-dots .dot2 { top: 30px; }
    .section-hero .section-foot .down-arrow { display: none; }
    .section-hero .section-foot p { font-size: 12px; }
}

/* ------------------------------------------------------------ *\
	section secondary
\* ------------------------------------------------------------ */
.section-secondary { background: none; color: #000; padding-top: 50px; padding-bottom: 50px; font-family: 'Gotham', sans-serif; position: relative; }
.section-secondary .section-head .dots { display: none; }
.section-secondary .process-info { max-width: 220px; padding: 20px 0; position: relative; margin-left: 33%; z-index: 2; }
.section-secondary .process-info p { font-size: 16px; line-height: 22px; color: #000; display: inline-block; margin: 0 0 0 -100px; opacity: 0; padding: 0 0 5px; }
.section-secondary .process-info p span { font-size: 20px; }
.section-secondary .process-info .dot1 {position: absolute; top: -10px; right: 50px; width: 20px; }
.section-secondary .process-info .dot2 {position: absolute; bottom: 20px; left: 0; width: 10px; }
.section-secondary .secton-body { margin-top: -50px; }
.section-secondary .section-foot { position: relative; z-index: 9; }
.section-secondary .section-foot .bottom-text { max-width: 450px; margin: 100px auto 50px; position: relative; left: 80px; text-transform: uppercase; }
.section-secondary .section-foot .bottom-text p {margin: 0; padding-bottom: 30px; }
.section-secondary .section-foot .bold { font-weight: 700; }
.section-secondary .section-foot .light { font-weight: 300; }
.section-secondary .section-foot .book { font-weight: 300; }
.section-secondary .section-foot .medium { font-weight: 400; }
.section-secondary .section-foot .bottom-text-dots {width: 405px; height: 360px; position: absolute; bottom: 20px; left: 50%; margin-left: -150px; overflow-y: hidden; }
.section-secondary .section-foot .bottom-text-dots .dot1 { position: absolute; top: 0; right: 250px; width: 10px; }
.section-secondary .section-foot .bottom-text-dots .dot2 { position: absolute; top: 80px; left: 20px; width: 20px; }
.section-secondary .section-foot .bottom-text-dots .dot3 { position: absolute; top: 200px; left: -60px; width: 7px; }
.section-secondary .section-foot .bottom-text-dots .dot4 { position: absolute; top: 170px; right: 120px; width: 10px; }
.section-secondary .section-foot .bottom-text-dots .dot5 { position: absolute; bottom: 50px; left: 120px; width: 12px; }
.section-secondary .section-foot .bottom-text-dots .dot6 { position: absolute; bottom: 40px; left: 90px; width: 8px; display: block; }
.section-secondary .section-foot .bottom-text-dots .dot7 { position: absolute; bottom: 0; left: 200px; width: 6px; }
.section-secondary .section-foot .bottom-text-dots .line1 { position: absolute; top: -3px; width: 100px; height: 100px; -ms-transform: rotate(100deg); transform: rotate(100deg); left: 40px; }
.section-secondary .section-foot .bottom-text-dots .line2 { position: absolute; top: 142px; width: 55px; height: 55px; right: 140px; -ms-transform: rotate(143deg); transform: rotate(143deg); }
.section-secondary .section-foot .bottom-text-dots .line3 { position: absolute; width: 145px; height: 145px; top: 166px; -ms-transform: rotate(95deg); transform: rotate(95deg); right: 127px; }
.section-secondary .section-foot .bottom-text-dots .line4 { position: absolute; bottom: -2px; right: 209px; width: 66px; height: 65px; -ms-transform: rotate(170deg); transform: rotate(170deg); }
.section-secondary .section-foot .bottom-text-dots .line5 { display: none; }
.section-secondary .rectangle-white { background: url(images/rectangle-white.png) repeat center center; background-size: cover; background-position: top; height: 680px; width: 100%; position: absolute; top: 0; z-index: 1; }
.section-secondary .form-white { background: url(images/form-general-white.svg) no-repeat center center; background-size: cover; background-position: bottom; height: 820px; width: 105%; position: absolute; bottom: 0; right: -50px; z-index: 1; }

@media(max-width: 1024px) {
    .section-secondary .section-head .dots { position: absolute; }
    .section-secondary .section-head .dots .dot1 { width: 15px; margin-top: 21px; left: 5px; }
    .section-secondary .section-head .dots .line1 { width: 100px; height: 100px; position: absolute; top: -67px; left: 20px; transform: rotate(95deg); }
    .section-secondary .section-head .dots .line2 { width: 150px; height: 150px; position: absolute; top: 35px; left: 5px; transform: rotate(5deg); }
    .section-secondary .secton-body { margin-top: 0; }
    .section-secondary .process-info { margin: 0 auto; }
    .section-secondary .process-info .dot1 { display: none }
    .section-secondary .process-info .dot2 { display: none }
    .section-secondary .section-foot { margin-top: 980px; }
    .section-secondary .section-foot .bold { font-weight: normal !important; margin-left: 40px !important; }
    .section-secondary .section-foot .bold span { font-size: 24px !important; }
    .section-secondary .section-foot .bold span.light { font-size: 15px !important; }
    .section-secondary .section-foot .light { font-size: 14px !important; }
    .section-secondary .section-foot .bottom-text { left: 0 !important; }
    .section-secondary .section-foot .bottom-text p { margin-left: 60px; margin-right: -10px; }
    .section-secondary .section-foot .bottom-text p span:nth-child(4) { margin-left: 5px !important; font-size: 16px !important; }
    .section-secondary .section-foot .bottom-text p .bold span:nth-child(3) { margin-left: -80px !important; }
    .section-secondary .section-foot .bottom-text p:nth-child(2) { margin-left: 0px; }
    .section-secondary .section-foot .bottom-text p:nth-child(2) .bold { margin-left: 20px !important; font-size: 24px !important; }
    .section-secondary .section-foot .bottom-text p:nth-child(2) .light { margin-left: 115px !important; font-size: 40px !important; }

    .section-secondary .section-foot .bottom-text-dots {width: 330px; height: 500px; position: absolute; top:-145px; bottom: 20px; left: 0; margin-left: 0; }
    .section-secondary .section-foot .bottom-text-dots .dot1 { position: absolute; top: 103px; right: 312px; width: 10px; }
    .section-secondary .section-foot .bottom-text-dots .dot2 { position: absolute; top: 195px; left: 75px; width: 14px; }
    .section-secondary .section-foot .bottom-text-dots .dot3 { position: absolute; top: 200px; left: -60px; width: 7px; }
    .section-secondary .section-foot .bottom-text-dots .dot4 { position: absolute; top: 310px; right: 0px; width: 10px; }
    .section-secondary .section-foot .bottom-text-dots .dot5 { position: absolute; bottom: 75px; left: 94px; width: 14px; }
    .section-secondary .section-foot .bottom-text-dots .dot6 { display: none; }
    .section-secondary .section-foot .bottom-text-dots .dot7 { position: absolute; bottom: 18px; left: 167px; width: 8px; }
    .section-secondary .section-foot .bottom-text-dots .line1 { position: absolute; top: 17px; width: 110px; left: 15px; display: none; }
    .section-secondary .section-foot .bottom-text-dots .line2 { position: absolute; top: 260px; width: 31px; height: 55px; right: 8px; -ms-transform: rotate(175deg); transform: rotate(175deg); }
    .section-secondary .section-foot .bottom-text-dots .line3 { position: absolute; width: 90px; height: 145px; top: 252px; -ms-transform: rotate(117deg); transform: rotate(117deg); right: 45px; }
    .section-secondary .section-foot .bottom-text-dots .line4 { position: absolute; bottom: 20px; right: 163px; width: 66px; height: 65px; -ms-transform: rotate(175deg); transform: rotate(175deg); }
    .section-secondary .section-foot .bottom-text-dots .line5 { position: absolute; top: 108px; right: 242px; width: 130px; height: 85px; -ms-transform: rotate(188deg); transform: rotate(188deg); display: block; }
    .section-secondary .rectangle-white { height: 1220px; }
    .section-secondary .form-white { right: 0; }
}
/* ------------------------------------------------------------ *\
	section about
\* ------------------------------------------------------------ */
.section-about { padding: 0 0 100px 0; }
.section-about .section-head > .dot1 { width: 10px; height: 10px; margin-top: 50px; margin-left: 60%; }
.section-about .section-head > .dot2 { width: 20px; height: 20px; margin-top: 50px; margin-left: 62%; }
.section-about .section-head .title {width: 200px; height: 200px; background: url('images/form-center-white.svg') no-repeat center center; margin-top: 30px; margin-left: 52%; position: relative; z-index: 15; }
.section-about .section-head .title { display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; }
.section-about .section-head .title p { text-align: center; font-size: 26px; font-weight: 600; color: #000; }
.section-about .section-head .dot3 {width: 20px; height: 20px; margin-top: 30px; margin-left: 50%; }
.section-about .ico-general {width: 450px; height: 450px; position: relative; z-index: 15; margin: 30px auto 0; animation: lab-formEffectWhitePaper 6s infinite; animation-delay: 1s; }
.section-about .ico-general.effect { animation: none; }
.section-about .ico-general .general-bgr {width: 100%; height: 100%; animation: about_icoRotateBack 0.5s forwards ease-in-out; }
.section-about .ico-general.effect .general-bgr {animation: about_icoRotate 0.5s forwards ease-in-out; }
.section-about .ico-general.effect .logo {width: 30%; height: 30%; top: 100px; transition: 0.5s ease-in-out; }
.section-about .ico-general:hover .text {opacity: 1; transition: 0.5s ease-in-out; }
.section-about .ico-general .logo {width: 40%; height: 40%; position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: 0.5s ease-in-out; }
.section-about .ico-general .text {opacity: 0; position: absolute; height: 20%; top: 40%; width: 100%; text-align: center; transition: 0.5s ease-in-out; }
.section-about .ico-general .text p {text-align: center; font-size: 14px; color: #000; font-weight: 300; margin: 20px 0; line-height: 20px; }
.section-about .bottom-lines {position: relative; height: 250px; width: 600px; margin: -60px auto 0; left: 60px; }
.section-about .bottom-lines .path {margin: 0 auto; width: 100%; height: 100%; position: relative; }
.section-about .bottom-lines .path .line1 {width: 70px; height: 70px; -ms-transform: rotate(100deg); transform: rotate(100deg); position: absolute; top: -40px; left: 40px; }
.section-about .bottom-lines .path .dot1 {width: 15px; height: 15px; left: 30px; top: 15px; position: absolute; }
.section-about .bottom-lines .path .line2 {width: 170px; height: 170px; -ms-transform: rotate(330deg); transform: rotate(330deg); position: absolute; top: -30px; left: 65px; }
.section-about .bottom-lines .path .dot2 {width: 20px; height: 20px; left: 255px; top: 75px; position: absolute; }
.section-about .bottom-lines .path .line3 {width: 130px; height: 130px; position: absolute; top: 60px; left: 110px; -ms-transform: rotate(110deg); transform: rotate(110deg); }
.section-about .bottom-lines .path .dot3 {width: 15px; height: 15px; left: 85px; top: 155px; position: absolute; }
.section-about .bottom-lines .path .line4 {width: 100px; height: 100px; position: absolute; top: 180px; left: 30px; -ms-transform: rotate(55deg); transform: rotate(55deg); }
.section-about .bottom-lines .path .line5 {width: 60px; height: 60px; position: absolute; top: 100px; left: 220px; -ms-transform: rotate(65deg); transform: rotate(65deg); }
.section-about .bottom-lines .path .dot4 {width: 15px; height: 15px; left: 225px; top: 168px; position: absolute; }
.section-about .bottom-lines .path .line6 {width: 240px; height: 240px; position: absolute; top: 155px; left: 255px; -ms-transform: rotate(350deg); transform: rotate(350deg); }
.section-about .bottom-lines.visible .path .line1 {stroke-dasharray: 500px; stroke-dashoffset: 500px; animation: itemLines 0.3s linear forwards; }
.section-about .bottom-lines.visible .path .dot1 {animation: itemDot 0.2s forwards; animation-delay: 0.3s; }
.section-about .bottom-lines.visible .path .line2 {stroke-dasharray: 500px; stroke-dashoffset: 500px; animation: itemLines 0.6s linear forwards; animation-delay: 0.5s; }
.section-about .bottom-lines.visible .path .dot2 {animation: itemDot 0.2s forwards; animation-delay: 1.1s; }
.section-about .bottom-lines.visible .path .line3 {stroke-dasharray: 500px; stroke-dashoffset: 500px; animation: itemLines 0.3s linear forwards; animation-delay: 1.3s; }
.section-about .bottom-lines.visible .path .dot3 {animation: itemDot 0.2s forwards; animation-delay: 1.6s; }
.section-about .bottom-lines.visible .path .line4 {stroke-dasharray: 500px; stroke-dashoffset: 500px; animation: itemLines 0.4s linear forwards; animation-delay: 1.8s; }
.section-about .bottom-lines.visible .path .line5 {stroke-dasharray: 500px; stroke-dashoffset: 500px; animation: itemLines 0.1s linear forwards; animation-delay: 1.3s; }
.section-about .bottom-lines.visible .path .dot4 {animation: itemDot 0.2s forwards; animation-delay: 1.4s; }
.section-about .bottom-lines.visible .path .line6 {stroke-dasharray: 500px; stroke-dashoffset: 500px; animation: itemLines 0.5s linear forwards; animation-delay: 1.6s; }
.section-about .companies {height: 500px; position: relative; z-index: 15; }
.section-about .motion-buble {width: 40%; height: 100%; position: absolute; top: 0; left: 0; }
.section-about .motion-buble.visible,
.section-about .rubik-buble.visible {animation: abput_companies 0.5s ease-in-out forwards; animation-delay: 1.6s; }
.section-about .motion-buble .general {width: 300px; height: 300px; position: absolute; right: 0; z-index: 9; animation: lab-formEffectWhitePaper 6s infinite; animation-delay: 2s; }
.section-about .motion-buble.effect .general { animation: none; }
.section-about .motion-buble .general .general-bgr {width: 100%; height: 100%; animation: about_motionRotateBack 0.5s forwards ease-in-out; }
.section-about .motion-buble.effect .general-bgr {animation: about_motionRotate 0.5s forwards ease-in-out; }
.section-about .motion-buble .general .motion-logo {position: absolute; width: 70%; margin: auto; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: 0.5s ease-in-out; }
.section-about .motion-buble.effect .general .motion-logo {width: 30%; top: -30px; transition: 0.5s ease-in-out; }
.section-about .motion-buble .general .text,
.section-about .rubik-buble .general .text {opacity: 0; }
.section-about .motion-buble .general .text {opacity: 0; position: absolute; height: 20%; top: 5%; width: 100%; transition: 0.5s ease-in-out; }
.section-about .motion-buble.effect .general .text {opacity: 1; transition: 0.5s ease-in-out; }
.section-about .motion-buble .text p {text-align: left; font-size: 14px; color: #000; font-weight: 300; margin: 20px 0; line-height: 20px; }
.section-about .motion-buble .text h5 { color: #000; text-transform: uppercase; text-align: center; letter-spacing: 1px; margin-top: 30px; margin-left: -30px; animation: lab-formEffectSupport 6s infinite; }
.section-about .rubik-buble .text h5 { color: #000; text-transform: uppercase; text-align: center; letter-spacing: 1px; margin-top: 25px; margin-left: 0px; animation: lab-formEffectSupport 6s infinite; }
.section-about .motion-logos .logo,
.section-about .rubik-logos .logo {background: url('images/form-center-white.svg') no-repeat center center; }
.section-about .motion-buble.effect .motion-logos .logo { animation: about_logo 1s forwards ease-in-out; }
.section-about .motion-logos {width: 100%; height: 100%; position: absolute; top: 0; }
.section-about .motion-logos .logo img,
.section-about .rubik-logos .logo img {opacity: 0; }
.section-about .motion-buble.effect .motion-logos div img {opacity: 1; position: absolute; width: 80%; margin: auto; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: 0.5s ease-in-out; }
.section-about .motion-logos .logo1 {width: 10px; height: 10px; position: absolute; top: 100px; left: 0; margin-left: -130px; animation: about_animationlogo 2s infinite ease-in-out; animation-delay: 1s; }
.section-about .motion-logos .logo2 {width: 10px; height: 10px; position: absolute; bottom: 70px; left: 0; animation: about_animationlogo 2s infinite ease-in-out; animation-delay: 2s; }
.section-about .motion-logos .logo3 {width: 10px; height: 10px; position: absolute; bottom: 0; right: 0; margin-right: 0px; animation: about_animationlogo 0.5s infinite linear; animation-delay: 1.5s; }
.section-about .motion-logos .logo2 img { width: 88% !important; }
.section-about .rubik-buble {position: absolute; left: 60%; top: 0; width: 50%; height: 100%; }
.section-about .rubik-buble .general {width: 300px; height: 300px; position: absolute; left: 0; z-index: 9; animation: lab-formEffectWhitePaper 6s infinite; animation-delay: 3s; }
.section-about .rubik-buble.effect .general { animation: none; }
.section-about .rubik-buble .general .general-bgr {width: 100%; height: 100%; animation: about_rubikRotateBack 0.5s forwards ease-in-out; }
.section-about .rubik-buble.effect .general-bgr {animation: about_rubikRotate 0.5s forwards ease-in-out; }
.section-about .rubik-buble .general .rubik-logo {position: absolute; width: 80%; margin: auto; top: 50%; left: 50%; }
.section-about .rubik-buble .general .rubik-logo { -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: 0.5s ease-in-out; }
.section-about .rubik-buble.effect .general .rubik-logo {width: 30%; top: -30px; transition: 0.5s ease-in-out; }
.section-about .rubik-buble .general .text {opacity: 0; position: absolute; height: 20%; top: 5%; width: 100%; transition: 0.5s ease-in-out; }
.section-about .rubik-buble:hover .general .text {opacity: 1; transition: 0.5s ease-in-out; }
.section-about .rubik-buble .text p {text-align: left; font-size: 14px; color: #000; font-weight: 300; margin: 20px 0; line-height: 20px; }
.section-about .rubik-buble.effect .rubik-logos .logo { animation: about_logo 1s forwards ease-in-out; }
.section-about .rubik-logos {width: 60%; height: 100%; position: absolute; top: 0; left: 0%; }
.section-about .rubik-buble.effect .rubik-logos div img {opacity: 1; position: absolute; width: 80%; margin: auto; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: 0.5s ease-in-out; }
.section-about .rubik-logos .logo1 {width: 10px; height: 10px; position: absolute; top: 420px; right: -40px; animation: about_animationlogo 2s infinite ease-in-out; animation-delay: 1s; }
.section-about .rubik-logos .logo2 { width: 10px; height: 10px; position: absolute; top: 400px; left: -50px; animation: about_animationlogo 2s infinite ease-in-out; animation-delay: 3s; }
.section-about .rubik-logos .logo3 {width: 10px; height: 10px; position: absolute; bottom: 0; left: 80px; animation: about_animationlogo 2s infinite ease-in-out; animation-delay: 1.5s; }
.section-about .rubik-logos .logo4 {width: 10px; height: 10px; position: absolute; top: -100px; right: -60px; animation: about_animationlogo 2s infinite ease-in-out; animation-delay: 2s; }
.section-about .rubik-logos .logo2 a { display: inline-block; }
.section-about .rubik-logos .logo2 a img { width: 72% !important; height: auto; }

@media(max-width: 1024px) {
    .section-about .section-head .title { width: 180px; height: 180px; margin-left: 45%; margin-top: 100px; }
    .section-about .section-head .title p { font-size: 24px; font-family: 'Gotham', sans-serif; }
    .section-about .section-head .dot1, .section-about .section-head .dot2, .section-about .section-head .dot3 { display: none; }
    .section-about .ico-general { width: 330px; height: 330px; }
    .section-about .ico-general.effect .logo { top: 80px; }
    .section-about .ico-general .text p { margin: 10px 0; font-size: 13px; line-height: 18px; }
    .section-about .motion-buble { width: 40%; top: -60px; left: 120px; }
    .section-about .motion-buble .general { width: 240px; height: 240px; }
    .section-about .motion-buble .general .text { top: -15px; width: 120%; }
    .section-about .motion-buble.effect .general .text { top: 0; width: 110%; }
    .section-about .motion-buble .text p { font-size: 13px; line-height: 18px; text-align: center; }
    .section-about .motion-logos { display: none; }
    .section-about .rubik-buble { left: 25%; top: 280px; width: 50%; }
    .section-about .rubik-buble .general { width: 240px; height: 240px; }
    .section-about .rubik-buble .general .text { margin-left: -10px; top: -5px; }
    .section-about .rubik-buble .text p { font-size: 13px; line-height: 16px; margin: 10px 0; text-align: center; }
    .section-about .rubik-buble.effect .general .rubik-logo { top: -40px; }
    .section-about .rubik-logos { display: none; }
    .section-about .bottom-lines .path .line1 {width: 150px; height: 150px; -ms-transform: rotate(80deg); transform: rotate(80deg); top: 400px; left: 125px; }
    .section-about .bottom-lines .path .dot1 { left: 200px; top: 165px; }
    .section-about .bottom-lines .path .line2 {width: 100px; height: 100px; -ms-transform: rotate(10deg); transform: rotate(10deg); position: absolute; top: -20px; left: 175px; }
    .section-about .bottom-lines .path .dot2 {width: 20px; height: 20px; left: 255px; top: 75px; position: absolute; }
    .section-about .bottom-lines .path .line3 {width: 130px; height: 130px; position: absolute; top: 60px; left: 110px; -ms-transform: rotate(110deg); transform: rotate(110deg); }
    .section-about .bottom-lines .path .dot3 {width: 15px; height: 15px; left: 85px; top: 155px; position: absolute; }
    .section-about .bottom-lines .path .line4 {width: 100px; height: 100px; position: absolute; top: 180px; left: 30px; -ms-transform: rotate(55deg); transform: rotate(55deg); }
    .section-about .bottom-lines .path .line5 {width: 70px; height: 70px; left: 198px; -ms-transform: rotate(80deg); transform: rotate(80deg); }
    .section-about .bottom-lines .path .dot4 { left: 255px; top: 375px; }
    .section-about .bottom-lines .path .line6 {width: 150px; height: 150px; top: 200px; left: 158px; -ms-transform: rotate(210deg); transform: rotate(210deg); }
    }

/* ------------------------------------------------------------ *\
	section-team
\* ------------------------------------------------------------ */
.section-team { padding: 50px 0; }
.section-team .section-head { text-align: center; }
.section-team .section-sub-title { text-transform: uppercase; font-size: 12px; opacity: 0.9; }
.section-team .background-forms .form1 {position: fixed; background: url('/images/form-center-white.svg') no-repeat center center; width: 150px; height: 200px; top: 300px; right: -70px; animation: team_formRotate 30s linear infinite; }
.section-team .background-forms .form2 {position: fixed; background: url('images/form-center-white.svg') no-repeat center center; width: 200px; height: 200px; top: 200px; left: -100px; animation: team_formRotate 25s linear infinite; }
.section-team .background-forms .form3 {position: fixed; background: url('/images/form-center-white.svg') no-repeat center center; width: 100px; height: 100px; top: 80%; right: 100px; animation: team_formRotate 32s linear infinite; }
.section-team .background-forms .form4 {position: fixed; background: url('/images/form-center-white.svg') no-repeat center center; width: 150px; height: 150px; top: 900px; left: -20px; animation: team_formRotate 28s linear infinite; }
.section-team h3 { margin: 50px 0 10px; }
.section-team p {color: #fff; margin: 0; text-align: center; text-transform: uppercase; font-size: 14px; font-family: 'Gotham-Light', sans-serif; }
.section-team .left-dots { position: absolute; top: 50%; right: 90%; margin-top: -70px; width: 260px; height: 50px; z-index: 15; }
.section-team .left-dots .dot1 { position: absolute; bottom: 0; right: 0; width: 25px; }
.section-team .left-dots .dot2 { position: absolute; top: 0; right: 90px; width: 15px; }
.section-team .left-dots .dot3 { position: absolute; bottom: 0; right: 160px; width: 10px; }
.section-team .right-dots { position: absolute; top: 50%; left: 90%; margin-top: -70px; width: 260px; height: 50px; z-index: 15; }
.section-team .right-dots .dot1 {position: absolute; top: 0; left: 140px; width: 25px; }
.section-team .right-dots .dot2 {position: absolute; bottom: 0; left: 70px; width: 15px; }
.section-team .right-dots .dot3 {position: absolute; top: 0; left: 0; width: 10px; }
.section-team .home-logo { max-width: 550px; margin: 0 auto; position: relative; transition: 2s ease-in-out; }
.section-team .home-logo .slider {-webkit-mask-image: url('images/form-general-white.svg'); -webkit-mask-repeat: no-repeat; -webkit-mask-size: 100% 100%; mask-image: url('images/form-general-white.svg'); mask-repeat: no-repeat; mask-size: 100% 100%; width: 100%; height: 100%; }
.section-team .team-img {width: 100%; height: 100%; }
.section-team .owl-dots {position: absolute; bottom: 50px; z-index: 99999; text-align: center; left: 0; right: 0; }
.section-team .owl-dot {width: 10px; height: 10px; background: url('images/form-general-white.svg') no-repeat center center; background-size: contain; margin: 0 10px; outline: none; border: 0; }
.section-team .owl-dot.active,
.section-team .owl-dot:hover {width: 12px; height: 12px; transition: 0.3s ease; }
/*.section-team .left-dots,
.section-team .right-dots {-webkit-transition: 1s ease-in-out; -moz-transition: 1s ease-in-out; transition: 1s ease-in-out; }*/
.section-team .team-form {position: relative; margin-top: 100px; }
.section-team .team-form .bottom-lines {height: 190px; width: 100px; margin: 0 auto; position: relative; }
.section-team .team-form .bottom-lines .line1 {position: absolute; top: 0px; left: 40px; height: 100px; width: 100px; -ms-transform: rotate(10deg); transform: rotate(10deg); }
.section-team .team-form .bottom-lines .dot1 {position: absolute; top: 100px; left: 120px; height: 20px; width: 20px; }
.section-team .team-form .bottom-lines .line2 {position: absolute; bottom: -10px; width: 100px; height: 100px; -ms-transform: rotate(98deg); transform: rotate(98deg); left: 30px; }
.section-team .team-form.visible .bottom-lines .line1 {stroke-dasharray: 500px; stroke-dashoffset: 500px; animation: itemLines 0.5s linear forwards; }
.section-team .team-form.visible .bottom-lines .dot1 {animation: itemDot 0.2s forwards; animation-delay: 0.5s; }
.section-team .team-form.visible .bottom-lines .line2 {stroke-dasharray: 500px; stroke-dashoffset: 500px; animation: itemLines 0.5s linear forwards; animation-delay: 0.5s; }
.section-team .team-list { margin: -80px auto 0; padding-bottom: 100px; position: relative; z-index: 20; opacity: 0; left: -60px; }
.section-team .team-list.visible {opacity: 1; transition: 0.3s ease-in-out; }
.section-team .team-item {position: relative; }
.section-team .team-item:after {content: ''; display: block; clear: both; }
.section-team .team-item .team-item-img {width: 150px; height: 150px; overflow: hidden; position: relative; animation: team_teamPulse infinite ease-in-out; }
.section-team .team-item.center.left-text .team-item-img {animation-delay: 1s; animation-duration: 3s; }
.section-team .team-item.right.right-text .team-item-img {animation-delay: 5s; animation-duration: 5s; }
.section-team .team-item.center.right-text .team-item-img {animation-delay: 7s; animation-duration: 4s; }
.section-team .team-item.left.left-text .team-item-img {animation-delay: 3s; animation-duration: 8s; }
.section-team .team-item .team-item-img img {position: absolute; z-index: 5; width: 100%; height: 100%; -webkit-mask-image: url('images/form-center-white.svg'); -webkit-mask-repeat: no-repeat; -webkit-mask-size: 100% 100%; mask-image: url('images/form-center-white.svg'); mask-repeat: no-repeat; mask-size: 100% 100%; }
.section-team .team-item .team-item-img .back-form { opacity: 0.8; }
.section-team .team-item.center .team-item-img img {-webkit-mask-image: url('images/form-general-white.svg'); -webkit-mask-repeat: no-repeat; -webkit-mask-size: 100% 100%; mask-image: url('images/form-general-white.svg'); mask-repeat: no-repeat; mask-size: 100% 100%; }
.section-team .team-item .team-item-info p:first-child {font-size: 15px; font-family: 'Gotham-Medium', sans-serif; }
.section-team .team-item .team-item-info p {font-size: 12px; text-align: left; text-transform: none; line-height: 17px; font-family: 'Gotham-Light', sans-serif; margin-top: 10px; }
.section-team .team-item .team-item-social { display: none; }
.section-team .team-item .team-item-info { margin-top: 40px !important; }
/* .section-team .team-item .team-item-social { margin-top: 10px; }
.section-team .team-item .team-item-social a {margin-right: 5px; }
.section-team .team-item .team-item-social a.linkedin {width: 20px; height: 20px; background: url('images/linkedin-icon.png') no-repeat center center; background-size: contain; display: inline-block; }
.section-team .team-item .team-item-social a.facebook {width: 20px; height: 20px; background: url('images/icons/facebook-icon.png') no-repeat center center; background-size: contain; display: inline-block; } */
.section-team .team-item.center.left-text {margin-left: 250px; height: 250px; width: 300px; margin-top: 70px; }
.section-team .team-item.center.left-text .team-item-img {width: 150px; float: right; }
.section-team .team-item.center.left-text .team-item-info {width: 150px; float: left; margin: 20px 0 0 0; }
.section-team .team-item.center.left-text .bottom-lines {width: 50px; height: 110px; position: absolute; top: 144px; right: 20px; }
.section-team .team-item.center.left-text .bottom-lines .line1 {height: 50px; width: 50px; position: absolute; top: 3px; right: 6px; -ms-transform: rotate(0deg); transform: rotate(0deg); }
.section-team .team-item.center.left-text .bottom-lines .dot1 {width: 10px; height: 10px; right: 0; top: 50px; position: absolute; }
.section-team .team-item.center.left-text .bottom-lines .line2 {position: absolute; bottom: 0; right: 0; width: 50px; height: 50px; -ms-transform: rotate(80deg); transform: rotate(80deg); }
.section-team .team-item.right {margin-left: 540px; width: 430px; height: 200px; margin-top: -180px; }
.section-team .team-item.right .team-item-img {width: 150px; position: absolute; left: 100px; top: 0; }
.section-team .team-item.right.right-text .bottom-lines {width: 105px; height: 55px; position: absolute; left: 0; top: 0; }
.section-team .team-item.right.right-text .bottom-lines .line1 {position: absolute; left: 0; top: 0; width: 50px; height: 50px; -ms-transform: rotate(100deg); transform: rotate(100deg); }
.section-team .team-item.right.right-text .bottom-lines .dot1 {position: absolute; top: 0; left: 50px; width: 10px; height: 10px; }
.section-team .team-item.right.right-text .bottom-lines .line2 {position: absolute; right: 0; bottom: 0; width: 50px; height: 50px; }
.section-team .team-item.right.right-text .team-item-info {width: 150px; position: absolute; right: 0; margin: 20px 0 0 20px; }
.section-team .team-item.center.right-text {margin-left: 410px; height: 250px; width: 320px; margin-top: -15px; }
.section-team .team-item.center.right-text .team-item-img {width: 150px; float: left; }
.section-team .team-item.center.right-text .team-item-info {width: 150px; float: right; margin-top: 20px; }
.section-team .team-item.center.right-text .bottom-lines {width: 50px; height: 120px; position: absolute; bottom: -20px; left: 40px; }
.section-team .team-item.center.right-text .bottom-lines .line1 {height: 50px; width: 50px; position: absolute; top: 3px; right: 6px; -ms-transform: rotate(70deg); transform: rotate(70deg); }
.section-team .team-item.center.right-text .bottom-lines .dot1 {width: 10px; height: 10px; left: 0; top: 50px; position: absolute; }
.section-team .team-item.center.right-text .bottom-lines .line2 {position: absolute; bottom: 0; right: 4px; width: 55px; height: 55px; -ms-transform: rotate(25deg); transform: rotate(25deg); }
.section-team .team-item.left {margin-left: 0; width: 430px; height: 200px; margin-top: -265px; }
.section-team .team-item.left .team-item-img {width: 150px; position: absolute; right: 100px; top: 0; }
.section-team .team-item.left.left-text .team-item-info { width: 150px; position: absolute; left: 0; margin: 20px 0 0 20px; }
.section-team .team-item.left.left-text .bottom-lines {width: 105px; height: 55px; position: absolute; right: 10px; top: 0; }
.section-team .team-item.left.left-text .bottom-lines .line1 {position: absolute; left: 0; top: 0; width: 50px; height: 50px; -ms-transform: rotate(100deg); transform: rotate(100deg); }
.section-team .team-item.left.left-text .bottom-lines .dot1 {position: absolute; top: 0; left: 50px; width: 10px; height: 10px; }
.section-team .team-item.left.left-text .bottom-lines .line2 {position: absolute; right: 0; bottom: 0; width: 50px; height: 50px; }
.section-team .team-item .back-form { display: none; }
.section-team .team-item .team-item-info { display: block; }
.section-team .team-item .team-item-info.mobile { display: none; }

@media(max-width: 1024px) {
    .section-team { padding-bottom: 0; }
    .section-team h3 { margin: 30px 0 15px; }
    .section-team .section-sub-title { font-size: 12px; opacity: 0.9; }
    .section-team .team-form { margin-top: 80px; }
    .section-team .bottom-lines, .section-team .left-dots, .section-team .right-dots { display: none; }
    .section-team .team-list { margin: 0 auto; left: 0; top: -25px; }
    .section-team .team-item { position: relative; display: flex; margin: 0 !important; height: 120px !important; width: 380px !important; }
    .section-team .team-item .back-form { display: block; }
    .section-team .team-item .team-item-info { display: none; }
    .section-team .team-item .team-item-info.mobile { display: block; position: absolute; left: 15% !important; top: 20%; margin: 0 !important; opacity: 1 !important; z-index: 9; }
    .section-team .team-item .team-item-img img {-webkit-mask-image: url('images/form-general-white.svg'); -webkit-mask-repeat: no-repeat; -webkit-mask-size: 100% 100%; mask-image: url('images/form-general-white.svg'); }
    .section-team .team-item.left-mobile .team-item-img { left: 5%; }
    .section-team .team-item.center-mobile .team-item-img { left: 25%; }
    .section-team .team-item.right-mobile .team-item-img { left: 45%; }
}
