/* style.min.css */

@import url(fonts/fonts.min.css);
@import url(fonts/font-awesome.min.css);
@import url(fonts/icomoon.min.css);
#menu li a,
.white_c {
    color: #fff
}

.menu-list-footer,
.services-list {
    list-style: none
}

#menu li a,
#menu li a.submenu-link,
.contact-us-link,
.footer-social-media .social-icon,
.learn-more-link,
.menu-list-footer li a,
.read-more-link,
.read-more-link-small {
    text-decoration: none
}

body,
html {
    overflow: hidden;
    height: 100%
}

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

img {
    width: 100%;
    height: auto;
    display: block
}

strong {
    font-weight: 700
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

input[type=text],
input[type=number],
input[type=tel],
input[type=password],
input[type=submit],
input[type=email],
input[type=search],
input[type=url],
textarea {
    appearance: none;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0
}

li {
    list-style-position: inside
}

.h3margin,
h3,
h4,
h5 {
    margin: 20px 0
}

.clearfix {
    clear: both
}

#fp-nav ul li a span,
#menu-line,
.fp-slidesNav ul li a span {
    background: #fff
}

#fp-nav ul li a span,
.fp-slidesNav ul li a span {
    border-radius: 50%;
    position: absolute;
    z-index: 1;
    height: 4px;
    width: 4px;
    border: 0;
    background: #fff;
    left: 50%;
    top: 50%;
    margin: -2px 0 0 -2px;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out
}

.yellow_c {
    color: #DDA83F
}

.lightblue_c {
    color: #00A2FF
}

.darkblue_c {
    color: #1E2A45
}

.black_c {
    color: #000
}

.blue_c {
    color: #006BFF
}

.white_bg {
    background-color: #fff
}

.yellow_bg {
    background-color: #DDA83F
}

.lightblue_bg {
    background-color: #00A2FF
}

.darkblue_bg {
    background-color: #1E2A45
}

.black_bg {
    background-color: #000
}

#loader-wrapper {
    position: absolute!important;
    top: 0!important;
    left: 0!important;
    right: 0!important;
    bottom: 0!important;
    width: 100%!important;
    height: 100%!important;
    background: #1E2A45;
    z-index: 1000!important;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    transition: opacity .5s ease-in-out
}

.loader-container {
    position: absolute!important;
    top: 50%!important;
    left: 50%!important;
    -webkit-transform: translate(-50%, -50%)!important;
    -moz-transform: translate(-50%, -50%)!important;
    -ms-transform: translate(-50%, -50%)!important;
    -o-transform: translate(-50%, -50%)!important;
    transform: translate(-50%, -50%)!important
}

.inspirenow-logo-loading {
    width: 250px;
    margin: 20px auto
}

.sk-wave {
    margin: 20px auto;
    width: 50px;
    height: 40px;
    text-align: center;
    font-size: 10px
}

.sk-wave .sk-rect {
    background-color: #fff;
    height: 100%;
    width: 6px;
    display: inline-block;
    -webkit-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
    -moz-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
    -ms-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
    -o-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
    animation: sk-waveStretchDelay 1.2s infinite ease-in-out
}

.sk-wave .sk-rect1 {
    -webkit-animation-delay: -1.2s;
    -moz-animation-delay: -1.2s;
    -ms-animation-delay: -1.2s;
    -o-animation-delay: -1.2s;
    animation-delay: -1.2s
}

.sk-wave .sk-rect2 {
    -webkit-animation-delay: -1.1s;
    -moz-animation-delay: -1.1s;
    -ms-animation-delay: -1.1s;
    -o-animation-delay: -1.1s;
    animation-delay: -1.1s
}

.sk-wave .sk-rect3 {
    -webkit-animation-delay: -1s;
    -moz-animation-delay: -1s;
    -ms-animation-delay: -1s;
    -o-animation-delay: -1s;
    animation-delay: -1s
}

.sk-wave .sk-rect4 {
    -webkit-animation-delay: -.9s;
    -moz-animation-delay: -.9s;
    -ms-animation-delay: -.9s;
    -o-animation-delay: -.9s;
    animation-delay: -.9s
}

.sk-wave .sk-rect5 {
    -webkit-animation-delay: -.8s;
    -moz-animation-delay: -.8s;
    -ms-animation-delay: -.8s;
    -o-animation-delay: -.8s;
    animation-delay: -.8s
}

@-webkit-keyframes sk-waveStretchDelay {
    0%,
    100%,
    40% {
        -webkit-transform: scaleY(.4);
        transform: scaleY(.4)
    }
    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1)
    }
}

@-moz-keyframes sk-waveStretchDelay {
    0%,
    100%,
    40% {
        -webkit-transform: scaleY(.4);
        transform: scaleY(.4)
    }
    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1)
    }
}

@-ms-keyframes sk-waveStretchDelay {
    0%,
    100%,
    40% {
        -webkit-transform: scaleY(.4);
        transform: scaleY(.4)
    }
    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1)
    }
}

@-o-keyframes sk-waveStretchDelay {
    0%,
    100%,
    40% {
        -webkit-transform: scaleY(.4);
        transform: scaleY(.4)
    }
    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1)
    }
}

@keyframes sk-waveStretchDelay {
    0%,
    100%,
    40% {
        -webkit-transform: scaleY(.4);
        transform: scaleY(.4)
    }
    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1)
    }
}

.mwa-ribbon {
    position: fixed;
    top: 50px;
    right: 0;
    z-index: 99999
}

.mwa-ribbon a.mwa-ribbon-link {
    display: block;
    width: 68px;
    height: 100px
}

body.slider-opened .mwa-ribbon,
body.slider-opened #fp-nav {
    display: none !important;
}

@media (max-width:768px) {
    .mwa-ribbon {
        position: fixed;
        top: 130px;
        right: 0;
        z-index: 99999
    }
    .mwa-ribbon a.mwa-ribbon-link {
        display: block;
        width: 68px;
        height: 100px
    }
}

@media (max-width:480px) {
    .mwa-ribbon {
        position: fixed;
        top: 110px;
        right: 0;
        z-index: 99999
    }
    .mwa-ribbon a.mwa-ribbon-link {
        display: block;
        width: 50px;
        height: 76px
    }
}

#fp-nav ul li a.active span,
#fp-nav ul li span {
    border: 2px solid #fff!important;
    height: 14px!important;
    width: 14px!important
}

#fp-nav.right {
    right: 50px!important
}

#fp-nav ul li {
    margin: 20px 0!important
}

#fp-nav ul li a.active span {
    background: #fff!important
}

#fp-nav ul li span {
    background: 0 0!important;
    margin: -6px 0 0 -6px!important;
    border-radius: 100%!important
}

#fp-nav.nav-white ul li a.active span,
#fp-nav.nav-white ul li span {
    border: 2px solid #fff!important;
    height: 14px!important;
    width: 14px!important
}

#fp-nav.nav-white ul li a.active span {
    background: #fff!important
}

#fp-nav.nav-white ul li span {
    background: 0 0!important;
    margin: -6px 0 0 -6px!important;
    border-radius: 100%!important
}

#fp-nav.nav-blue ul li a.active span,
#fp-nav.nav-blue ul li span {
    border: 2px solid #1D3869!important;
    height: 14px!important;
    width: 14px!important
}

#fp-nav.nav-blue ul li a.active span {
    background: #1D3869!important
}

#fp-nav.nav-blue ul li span {
    background: 0 0!important;
    margin: -6px 0 0 -6px!important;
    border-radius: 100%!important
}

.burger-container,
.menu-logo {
    width: 1400px;
    left: 50%;
    top: 60px
}

.burger-container {
    position: fixed;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 101
}

.footer-social-media,
.menu-logo {
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.menu-logo {
    position: absolute;
    transform: translateX(-50%);
    z-index: 73
}

#main-nav-wrap,
#main-nav-wrap #menu {
    position: fixed;
    top: 0;
    width: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    padding-left: 0
}

#main-nav-wrap {
    right: 0;
    z-index: 1;
    letter-spacing: 1px;
    font-size: 1.1em;
    height: 100%;
    display: none
}

#main-nav-wrap.is-showed {
    display: block
}

#main-nav-wrap #menu {
    right: auto;
    left: 0;
    z-index: 70;
    margin: 0;
    padding-top: 200px;
    background: #1E2A45;
    height: 100vh;
    display: none;
    overflow: auto
}

.menu-wrapper {
    width: 1400px;
    margin: 0 auto
}

.menu-container {
    width: 1000px;
    float: none;
    overflow: hidden
}

#menu li {
    display: block;
    margin: 0 150px 10px 0;
    padding: 10px 0;
    text-align: left;
    width: 300px;
    float: left
}

#menu li.menu-aboutus,
#menu li.menu-services {
    clear: left
}

#menu li.menu-our-work {
    margin-top: -176px
}

#menu li a {
    font-family: avenirheavy;
    font-size: 46px
}

#menu li a.main-link {
    display: block
}

#menu li.menu-our-work a.main-link,
#menu li.menu-services a.main-link {
    padding-bottom: 7px;
    border-bottom: 1px solid #fff
}

#menu li a.submenu-link {
    font-family: robotolight;
    font-size: 22px;
    color: #fff
}

#menu li .submenu-list-services li {
    margin: 7px 0;
    padding: 0
}

#menu li .submenu-list-services {
    margin-top: 10px
}

#menu li .submenu-list-work li {
    margin: 7px 0;
    padding: 0
}

#menu li .submenu-list-work {
    margin-top: 10px
}

#menu .submenu-link-disabled {
    opacity: .3;
    pointer-events: none
}

a.menu-toggle {
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    right: 0;
    margin-left: auto;
    transition: right 0.3s ease;
}

a.menu-toggle.menu-white span {
    background-color: #fff
}

a.menu-toggle.menu-blue span {
    background-color: #1E2A45
}

a.menu-toggle span {
    display: block;
    width: 35px;
    height: 5px;
    position: absolute;
    top: 50%;
    bottom: auto;
    left: auto;
    -moz-transition: background .2s ease-in-out;
    -o-transition: background .2s ease-in-out;
    -webkit-transition: background .2s ease-in-out;
    -ms-transition: background .2s ease-in-out;
    transition: background .2s ease-in-out;
    font: 0/0 a;
    text-shadow: none;
    color: transparent
}

a.menu-toggle span::after,
a.menu-toggle span::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: inherit;
    left: 0;
    -moz-transition-duration: .2s, .2s;
    -o-transition-duration: .2s, .2s;
    -webkit-transition-duration: .2s, .2s;
    -ms-transition-duration: .2s, .2s;
    transition-duration: .2s, .2s;
    -moz-transition-delay: .2s, 0s;
    -o-transition-delay: .2s, 0s;
    -webkit-transition-delay: .2s, 0s;
    -ms-transition-delay: .2s, 0s;
    transition-delay: .2s, 0s
}

.menu-toggle.is-clicked span::after,
.menu-toggle.is-clicked span::before {
    background-color: #fff;
    -moz-transition-delay: 0s, .2s;
    -o-transition-delay: 0s, .2s;
    -webkit-transition-delay: 0s, .2s;
    -ms-transition-delay: 0s, .2s;
    transition-delay: 0s, .2s
}

@media screen and (min-width: 640px) {
    .menu-toggle.slider-opened {
        right: -180px;
    }
}

a.menu-toggle span::before {
    top: -10px;
    -moz-transition-property: top, transform;
    -o-transition-property: top, transform;
    -webkit-transition-property: top, transform;
    -ms-transition-property: top, transform;
    transition-property: top, transform
}

a.menu-toggle span::after {
    bottom: -10px;
    -moz-transition-property: bottom, transform;
    -o-transition-property: bottom, transform;
    -webkit-transition-property: bottom, transform;
    -ms-transition-property: bottom, transform;
    transition-property: bottom, transform
}

.menu-toggle.is-clicked span {
    background-color: rgba(255, 255, 255, 0)!important
}

.menu-toggle.is-clicked span::before {
    top: 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.menu-toggle.is-clicked span::after {
    bottom: 0;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.footer-social-media {
    width: 1400px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    bottom: 80px;
    z-index: 70
}

.footer-social-media .social-icon {
    float: left;
    display: block;
    text-align: center;
    width: auto;
    line-height: 30px;
    margin-right: 20px;
    color: #fff;
    background-color: transparent
}

#home-about-us-learn-more,
#section_aboutus .section-title {
    color: #006BFF
}

.footer-social-media .social-icon i:hover,
.footer-social-media .social-icon.facebook:hover,
.footer-social-media .social-icon.linkedin:hover,
.footer-social-media .social-icon.twitter:hover {
    background-color: transparent!important
}

.footer-social-media .social-icon i {
    font-size: 22px;
    display: block
}

.container {
    width: 1400px;
    position: relative;
    margin: auto
}

.section {
    background-color: #fff
}

.hidden {
    display: none!important
}

.hide-overflow {
    overflow: hidden!important
}

#section_home {
    background: #1E2A45;
    background-size: cover;
    width: 100%;
    overflow: hidden
}

.logo-container {
    width: 1400px;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 60px;
    z-index: 10
}

.inspirenow-logo {
    width: 250px
}

.test-video-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 0;
    overflow: hidden
}

.test-video-container {
    position: relative;
    width: 100%;
    height: 100vh
}

.particle-js-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    display: block
}

.main-title {
    font-family: avenirheavy;
    font-size: 58px;
    font-weight: 400
}

.content-desc-light {
    font-family: robotolight;
    font-size: 23px;
    line-height: 33px;
    font-weight: 400
}

.learn-more-link,
.scroll-down-txt {
    font-size: 18px;
    font-family: robotomedium
}

.content-desc-medium {
    font-family: robotomedium
}

.slidingVertical {
    display: inline;
    text-indent: 8px
}

.slidingVertical span {
    animation: topToBottom 10s linear infinite;
    -o-animation: topToBottom 10s linear infinite;
    -ms-animation: topToBottom 10s linear infinite;
    -moz-animation: topToBottom 10s linear infinite;
    -webkit-animation: topToBottom 10s linear infinite;
    opacity: 0;
    overflow: hidden;
    position: absolute
}

.slidingVertical span.hr_slide {
    animation-delay: -10ms;
    -o-animation-delay: -10ms;
    -ms-animation-delay: -10ms;
    -moz-animation-delay: -10ms;
    -webkit-animation-delay: -10ms
}

.slidingVertical span.mkt_slide {
    animation-delay: -2.5s;
    -o-animation-delay: -2.5s;
    -ms-animation-delay: -2.5s;
    -moz-animation-delay: -2.5s;
    -webkit-animation-delay: -2.5s
}

.slidingVertical span.opt_slide {
    animation-delay: -5s;
    -o-animation-delay: -5s;
    -ms-animation-delay: -5s;
    -moz-animation-delay: -5s;
    -webkit-animation-delay: -5s
}

.slidingVertical span.sme_slide {
    animation-delay: -7.5s;
    -o-animation-delay: -7.5s;
    -ms-animation-delay: -7.5s;
    -moz-animation-delay: -7.5s;
    -webkit-animation-delay: -7.5s
}

@-webkit-keyframes topToBottom {
    0%,
    100%,
    80% {
        opacity: 0
    }
    5% {
        opacity: 0;
        -webkit-transform: translateY(10px)
    }
    10%,
    25% {
        opacity: 1;
        -webkit-transform: translateY(0)
    }
    30% {
        opacity: 0;
        -webkit-transform: translateY(-10px)
    }
}

@-moz-keyframes topToBottom {
    0%,
    100%,
    80% {
        opacity: 0
    }
    5% {
        opacity: 0;
        -moz-transform: translateY(10px)
    }
    10%,
    25% {
        opacity: 1;
        -moz-transform: translateY(0)
    }
    30% {
        opacity: 0;
        -moz-transform: translateY(-10px)
    }
}

@-ms-keyframes topToBottom {
    0%,
    100%,
    30%,
    5%,
    80% {
        opacity: 0
    }
    5% {
        -ms-transform: translateY(10px)
    }
    10%,
    25% {
        opacity: 1;
        -ms-transform: translateY(0)
    }
    30% {
        -ms-transform: translateY(-10px)
    }
}

@-o-keyframes topToBottom {
    0%,
    100%,
    80% {
        opacity: 0
    }
    5% {
        opacity: 0;
        -o-transform: translateY(10px)
    }
    10%,
    25% {
        opacity: 1;
        -o-transform: translateY(0)
    }
    30% {
        opacity: 0;
        -o-transform: translateY(-10px)
    }
}

@keyframes topToBottom {
    0%,
    100%,
    80% {
        opacity: 0
    }
    5% {
        opacity: 0;
        transform: translateY(10px)
    }
    10%,
    25% {
        opacity: 1;
        transform: translateY(0)
    }
    30% {
        opacity: 0;
        transform: translateY(-10px)
    }
}
#landingTestimonialsSwiper {
    position: relative;
    max-width: 650px;
    width: 100%;
    margin: 30px 0 0;
    height: auto;
}
#landingTestimonialsSwiper .swiper-wrapper {
    position: relative;
}
#landingTestimonials .swiper-slide {
    position: relative;
}
.landing-testimonials-container {
    max-width: 660px;
    width: 100%;
    margin-top: 30px;
}
.testimonials-txt {
    font-family: 'robotolight_italic';
    color: #fff;
    font-size: 17px;
    display: block;
    margin-bottom: 10px;
}
.testimonial-name {
    font-family: 'robotomedium';
    color: #fff;
    font-size: 17px;
    display: block;
    /* margin-bottom: 10px; */
}
.landing-read-more-link {
    font-family: 'robotomedium';
    color: #DDA83F;
    font-size: 17px;
    text-decoration: none;
    cursor: pointer;
    margin-top: 15px;
}
.scroll-down-container {
    width: 1400px;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: 7%
}

.scroll-down-svg-container {
    width: 440px;
    position: absolute;
    left: 50%;
    bottom: 8%;
    transform: translateX(-218.5%);
    pointer-events: none;
}

#section_aboutus {
    background: #e7e7e7;
    width: 100%;
    overflow: hidden
}

#section_aboutus .container {
    z-index: 2;
    margin-top: 180px
}

#section_aboutus .fp-tableCell {
    vertical-align: top!important
}

#section_aboutus .content-desc-light {
    margin-top: 20px
}

#section_aboutus .client-logo-container {
    width: 1400px;
    position: relative;
    margin: auto
}

.learn-more-link {
    font-weight: 400;
    display: inline-block;
    margin-top: 20px
}

.content-desc-bold,
.h1home,
.section-title,
.sub-title-medium {
    font-size: 23px;
    font-weight: 400
}

.aboutus-wrapper {
    position: relative;
    width: 100%
}

.aboutus-wrapper .inner-content-aboutus .main-title {
    width: 500px
}

.inner-content-aboutus {
    width: 550px;
    display: inline-block;
    vertical-align: top
}

#section_contact .fp-tableCell,
#section_services .fp-tableCell {
    vertical-align: top!important
}

.sub-title-medium {
    font-family: robotomedium;
    padding-bottom: 20px;
    border-bottom: 1px solid #939598
}
.client-group {
    position: relative;
    width: 100%;
    margin-top: 100px;
}

.client-slideshow-container {
  height: 110px;
  overflow: hidden;
  position: relative;
  width: calc(100% + 30px);
  margin: 40px auto 0 -15px;
}
.client-slideshow-container::before {
    content: '';
    background: rgb(231,231,231);
    background: -moz-linear-gradient(90deg, rgba(231,231,231,1) 10%, rgba(231,231,231,0) 100%);
    background: -webkit-linear-gradient(90deg, rgba(231,231,231,1) 10%, rgba(231,231,231,0) 100%);
    background: linear-gradient(90deg, rgba(231,231,231,1) 10%, rgba(231,231,231,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e7e7e7",endColorstr="#e7e7e7",GradientType=1);
    width: 200px;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
.client-slideshow-container::after {
    content: '';
    background: rgb(231,231,231);
    background: -moz-linear-gradient(90deg, rgba(231,231,231,0) 0%, rgba(231,231,231,1) 90%);
    background: -webkit-linear-gradient(90deg, rgba(231,231,231,0) 0%, rgba(231,231,231,1) 90%);
    background: linear-gradient(90deg, rgba(231,231,231,0) 0%, rgba(231,231,231,1) 90%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e7e7e7",endColorstr="#e7e7e7",GradientType=1);
    width: 200px;
    height: 100%;
    top: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}

.client-logo-group {
  -webkit-animation: slideshowscroll 30s linear infinite;
          animation: slideshowscroll 30s linear infinite;
  display: -webkit-box;
  display: flex;
  width: 1772px;
}



.client-logo-icon-img {
    width: auto;
    height: 110px;
    margin: 0 36px;
}
.client-logo-icon-img img {
    width: auto;
    height: 100%;
    pointer-events: none;
}
.client-logo-icon-img img::-moz-selection { /* Code for Firefox */
  background: #e7e7e7;
}

.client-logo-icon-img img::selection {
  background: #e7e7e7;
}

@-webkit-keyframes slideshowscroll {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-1772px);
            transform: translateX(-1772px);
  }
}

@keyframes slideshowscroll {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-1772px);
            transform: translateX(-1772px);
  }
}
.section-title-container {
    width: 1400px;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 60px
}

.section-title {
    font-family: robotomedium;
    margin: 0
}

.section-title:after {
    content: '';
    background: #DDA83F;
    width: 150px;
    height: 5px;
    position: absolute;
    left: 0;
    bottom: -15px
}

.about-us-illust-container {
    position: absolute;
    width: 1650px;
    top: 120px;
    left: 50%;
    transform: translateX(-59%)
}

.h1home {
    font-family: robotolight;
    line-height: 33px;
    display: inline
}

#section_services {
    background: #1E2A45;
    background-size: cover;
    width: 100%;
    overflow: hidden
}

#section_services .container {
    top: 180px
}

.services-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between
}

.services-wrapper.business {
    flex-direction: column;
    height: calc(100% - 180px);
    justify-content: space-between;
}

.services-wrapper.business .inner-content-services {
    width: 100%;
}

.inner-content-services {
    width: 500px
}

#section_services .content-desc-light {
    margin-top: 20px
}

.content-desc-bold {
    font-family: robotobold;
    line-height: 33px
}

.services-group {
    width: 605px;
    margin-top: 50px
}

.services-sub-group {
    width: 50%;
    float: left;
    margin-bottom: 50px
}

.services-sub-group.odd {
    padding-right: 30px
}

.services-sub-group.even {
    padding-left: 30px
}

.services-icon-img {
    width: 100px
}

.services-icon-img.hr-icon-img {
    width: 90px;
    margin-bottom: 15px
}

.services-icon-img.marketing-icon-img {
    width: 83px;
    margin-bottom: 15px
}

.services-icon-img.operations-icon-img {
    width: 82px;
    margin-bottom: 15px
}

.services-icon-img.sme-icon-img {
    width: 100px;
    margin-top: 5px;
    margin-bottom: 15px
}

.services-group-title {
    margin-top: 0;
    margin-bottom: 13px;
    max-width:234px;
}

.short-desc-services {
    font-family: robotoregular;
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 15px
}

.read-more-link {
    font-weight: 400;
    font-family: robotomedium;
    font-size: 18px;
    color: #00A2FF;
    display: block;
    max-width: 87px;
}

.services-top-arrow-svg-container {
    width: 500px;
    position: absolute;
    right: 50%;
    top: 0;
    -webkit-transform: translateX(135%);
    -moz-transform: translateX(135%);
    -ms-transform: translateX(135%);
    -o-transform: translateX(135%);
    transform: translateX(135%)
}

.services-bottom-arrow-svg-container {
    width: 1050px;
    position: absolute;
    left: 50%;
    bottom: 50%;
    -webkit-transform: translate(-103%, 120%);
    -moz-transform: translate(-103%, 120%);
    -ms-transform: translate(-103%, 120%);
    -o-transform: translate(-103%, 120%);
    transform: translate(-103%, 120%)
}

#section_works {
    background: #fff;
    width: 100%;
    overflow: hidden
}

.services-desc-container {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center
}

.client-container {
    width: 20%;
    padding-left: 6%;
    padding-right: 2%
}

.what-we-did-container {
    width: 20%;
    padding-right: 6%;
    padding-left: 2%
}

.services-title-regular {
    font-family: robotoregular;
    font-size: 23px;
    font-weight: 400;
    margin-top: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #1E2A45
}

.client-name,
.client-name-left {
    font-family: robotomedium;
    font-size: 20px;
    cursor: pointer;
    display: block
}

.client-name {
    margin-bottom: 15px
}

.client-name-left {
    margin-bottom: 14px
}

.client-desc,
.services-list {
    font-family: robotolight;
    margin-bottom: 15px;
    font-size: 18px
}

.client-name-disabled {
    opacity: .4;
    pointer-events: none
}

.client-desc {
    font-weight: 400;
    display: block;
    margin-top: 0
}

.services-list li {
    margin-bottom: 5px
}

.read-more-link-small {
    font-family: robotomedium;
    font-size: 18px
}

.contact-desc-heavy,
.contact-us-link {
    font-family: avenirheavy
}

.laptop-view-container {
    width: 60%;
    left: 50%;
    top: 50%;
    z-index: 0;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute
}

.inspirenow-logo-laptop-container {
    width: 200px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    -webkit-transform: translate(-50%, -52.3%);
    -moz-transform: translate(-50%, -52.3%);
    -ms-transform: translate(-50%, -52.3%);
    -o-transform: translate(-50%, -52.3%);
    transform: translate(-50%, -52.3%)
}

.client-slider-container {
    position: absolute;
    width: 49.8%;
    background: 0 0;
    left: 50%;
    top: 50%;
    z-index: 1;
    -webkit-transform: translate(-50%, -52.3%);
    -moz-transform: translate(-50%, -52.3%);
    -ms-transform: translate(-50%, -52.3%);
    -o-transform: translate(-50%, -52.3%);
    transform: translate(-50%, -52.3%)
}

/*.swiper-container {
    padding-bottom: 62%!important;
    cursor: grab
}

.swiper-container:active {
    cursor: grabbing
}

.swiper-wrapper {
    position: absolute!important
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: 0!important
}

.swiper-slide-client-1 {
    background: #C23B33
}

.swiper-slide-client-2 {
    background: #FFD301
}

.swiper-slide-client-3 {
    background: #071D3D
}

.client-1,
.client-2,
.client-3,
.client-4,
.client-5 {
    display: none
}

.client-active {
    display: block
}

.portfolio-img,
.portfolio-img img {
    height: 100%;
    width: auto
}

.swiper-pagination-bullets {
    bottom: -100px;
    left: 0;
    width: 100%;
    position: relative
}

.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 7px!important
}

.swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 12px!important;
    height: 12px!important;
    background: #006BFF!important;
    border: 1px solid #006BFF!important
}

.swiper-pagination-bullet {
    width: 12px!important;
    height: 12px!important;
    display: inline-block;
    border-radius: 100%;
    background: 0 0!important;
    border: 1px solid #006BFF!important;
    opacity: 1!important
}
*/
.works-left-arrow-svg-container {
    position: absolute;
    width: 800px;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-134%, -50%);
    -moz-transform: translate(-134%, -50%);
    -ms-transform: translate(-134%, -50%);
    -o-transform: translate(-134%, -50%);
    transform: translate(-134%, -50%)
}

.works-right-arrow-svg-container {
    position: absolute;
    width: 450px;
    left: 50%;
    bottom: 50%;
    -webkit-transform: translate(125%, 190%);
    -moz-transform: translate(125%, 190%);
    -ms-transform: translate(125%, 190%);
    -o-transform: translate(125%, 190%);
    transform: translate(125%, 190%)
}
.swiper-main-container {
    margin: 100px 0;
}
#opportunitiesImage.swiper-container {
    width: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
}
#opportunitiesImage .swiper-slide {
    background-position: center;
    background-size: cover;
    width: 35%;
    position: relative;
    padding: 18px 15px 0;/*
    -webkit-transition: all ease-in-out 0.5s;
    transition: all ease-in-out 0.5s;*/
}
#opportunitiesImage .swiper-slide.swiper-slide-active {
    width: 35%;
    padding: 0;
    margin: 0 15px;/*
    -webkit-transition: all ease-in-out 0.5s;
    transition: all ease-in-out 0.5s;*/
}
#opportunitiesImage .swiper-slide.swiper-slide-next .overlay-slide {
    -webkit-transition: all ease-in-out 0.5s;
    transition: all ease-in-out 0.5s;
}
#opportunitiesImage .swiper-slide.swiper-slide-prev .overlay-slide { 
    -webkit-transition: all ease-in-out 0.5s;
    transition: all ease-in-out 0.5s;
}
#opportunitiesImage .swiper-slide .overlay-slide {
    width: 100%;
    margin: 26px auto;
    position: relative;
}
#opportunitiesImage .swiper-slide .overlay-slide::before {
    content: '';
    position: absolute;
    background-color: rgba(9, 26, 49, 0.85);
    width: 100%;
    height: 100%;
    -webkit-transition: all ease-in-out 0.5s;
    transition: all ease-in-out 0.5s;
    z-index: 1;
    
}
#opportunitiesImage .swiper-slide.swiper-slide-active .overlay-slide::before {
    content: '';
    position: absolute;
    background-color: rgba(9, 26, 49, 0);
    width: 100%;
    height: 100%;
    -webkit-transition: all ease-in-out 0.5s;
    transition: all ease-in-out 0.5s;
}
#opportunitiesImage .flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d;
}
#opportunitiesImage .flip-card-front {
    position: relative;
}
#opportunitiesImage .flip-card-back {
    background-color: rgba(9, 26, 49, 0.85);
    font-family: 'robotolight_italic';
    color: #fff;
    font-size: 17px;
    line-height: 1.5;
    padding: 0 50px;
    display: flex;
    align-items: center;
    vertical-align: middle;
    text-align: center;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    transform: rotateY(180deg);
}
#opportunitiesImage .hover-testimonials {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 10px;
    text-align: center;
    font-family: 'robotolight';
    color: #fff;
    font-size: 15px;
    background-color: rgba(9, 26, 49, 0.85);
    -webkit-transition: all ease-in-out 0.5s;
    transition: all ease-in-out 0.5s;
    opacity: 0;
}
#opportunitiesImage .swiper-slide.swiper-slide-active .hover-testimonials {
    background-color: rgba(9, 26, 49, 0.85);
    -webkit-transition: all ease-in-out 0.5s;
    transition: all ease-in-out 0.5s;
    opacity: 1;
}
#opportunitiesImage .swiper-slide.swiper-slide-active .overlay-slide:hover .hover-testimonials {
    -webkit-transition: all ease-in-out 0.5s;
    transition: all ease-in-out 0.5s;
    opacity: 0;
}
.hover-testimonial-mobile {
    display: none;
}
/*.swiper-pagination {
    display: none;
}*/

#opportunitiesDesc.swiper-container {
    width: 760px;
    height: 100%;
    /* margin-top: -30px; */
}


.slick-desc-slide-container {
    width: 1080px;
    height: 100%;
    margin: 30px auto 0;
    
}

#opportunitiesDesc .swiper-slide-img-mobile {
    display: none;
}
#opportunitiesDesc .swiper-wrapper {
    width: 540px;  
    margin-bottom: 50px;
}
#opportunitiesDesc .swiper-slide {
    text-align: center;
    font-size: 18px;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    
    opacity: 0;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}
#opportunitiesDesc .swiper-slide.swiper-slide-active {
    opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}
#opportunitiesDesc .swiper-pagination-bullet {
    width: 12px!important;
    height: 12px!important;
    display: inline-block;
    border-radius: 100%;
    background: 0 0!important;
    border: 1px solid #006BFF!important;
    opacity: 1!important;
}
#opportunitiesDesc .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 12px!important;
    height: 12px!important;
    background: #006BFF!important;
    border: 1px solid #006BFF!important;
}
#opportunitiesDesc .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 7px!important;
}

#opportunitiesDesc .swiper-pagination {
    bottom: 0;
}


.slide-content {
    width: 540px;
    margin: 0 auto;
    opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
    text-align: center;
}
.slide-content {
    width: 500px;
    margin: 0 auto;
}
.slide-caption {
    font-family: 'Avenir-Black';
    color: #3196d2;
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.slide-header {
    font-family: 'Avenir-Light';
    color: #36454f;
    font-size: 42px;
    line-height: 1.2;
    letter-spacing: -1px;
    margin: 30px 0;
}
.slide-body {
    font-family: 'Avenir-Light';
    color: #36454f;
    font-size: 23px;
    line-height: 1.6;
    margin-bottom: 50px;
}
.slide-btn {
    background-color: #2692d0;
    border-radius: 10px;
    padding: 8px 18px;
    display: inline-block;
    font-family: 'Avenir-Light';
    font-size: 18px;
    color: #fff;
    text-decoration: none;
}
.slide-btn:hover {
    color: #fff;
}
#opportunitiesDesc .swiper-button-prev {
    left: 50px;
    right: auto;
    /* transform: translateY(-50%); */
}
#opportunitiesDesc .swiper-button-next {
    right: 50px;
    left: auto;
    /* transform: translateY(-50%); */
}





#section_testimonials {
    background: #1E2A45;
    width: 100%;
    overflow: hidden
}
#section_testimonials .section-testimonials-container {
    width: 100%;
    max-width: 980px;
    padding: 0 80px;
    margin: 0 auto;
}
#section_testimonials .section-testimonials-client_image {
    width: 220px;
    margin: 0 auto 28px;
}

#section_testimonials .section-testimonials-client_name {
    font-family: 'robotomedium';
    font-size: 20px;
    text-align: center;
    margin: 10px 0 0;
    color: #fff;
}
#section_testimonials .client_name_italic {
    font-family: 'robotolight_italic';
    font-size: 20px;
    color: #fff;
}
#section_testimonials .section-testimonials-client_desc {
    font-family: 'robotolight';
    font-size: 18px;
    line-height: 1.7;
    text-align: center;
    color: #fff;
}
#section_testimonials .section-testimonials-client_desc p {
    margin: 10px 0;
}
#section_testimonials .section-testimonials-client_pic {
    margin-top: 35px;
    font-family: 'robotomedium';
    font-size: 20px;
    line-height: 1;
    text-align: center;
}
#section_testimonials .section-testimonials-client_pic .section-testimonials-client_pic_name{
    display: block;
    margin-bottom: 8px;
    color: #DDA83F;
}
#section_testimonials .section-testimonials-client_pic .section-testimonials-client_pic_pos{
    font-family: 'robotolight';
    font-size: 18px;
    color: #fff;
}
#section_testimonials .slick-dots {
    list-style: none;
    text-align: center;
    margin-top: 50px;
}
#section_testimonials .slick-dots li {
    display: inline-block;
    vertical-align: middle;
    margin: 0 7px;
}
#section_testimonials .slick-dots li button {    
    width: 12px;
    height: 12px;
    display: inline-block;
    border-radius: 100%;
    background: transparent;
    border: 1px solid #006BFF;
    overflow: hidden;
    text-indent: -999px;
}
#section_testimonials .slick-dots li.slick-active button {    
    background: #006BFF;
    border: 1px solid #006BFF;
}
#section_testimonials .slick-prev-arrow {
    width: 22px;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    left: -80px;
    right: auto;
    cursor: pointer;
}
#section_testimonials .slick-next-arrow {
    width: 22px;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    right: -80px;
    left: auto;
    cursor: pointer;
}






#section_aboutus_contact {
    background: #fff;
    background-size: cover;
    width: 100%;
    overflow: hidden;
}

.video-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 0;
    display: block;
}

.video-container {
    position: relative;
    width: 100%;
    height: 100vh;
}

video {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

#section_aboutus_contact .inner-content {
    background-color: rgba(30, 42, 69, .9);
    padding: 48px;
    position: relative;
}

#section_aboutus_contact .inner-content .left-col {
    display: inline-block;
    width: 60%;
    position: relative;
    vertical-align: top;
}

#section_aboutus_contact .inner-content .right-col {
    display: inline-block;
    width: 40%;
    position: relative;
    margin-left: -4px;
    text-align: right;
    vertical-align: bottom;
}
.slide-services-desc{
    font-family: 'robotolight';
    font-size: 23px;
    line-height: 33px;
}
.slide-services-desc.unleash-text{
    margin-bottom: 20px;
}
.slide-services-desc.consult-text{
    margin-bottom: 60px;
}
.line {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 1px;
    background: rgb(255, 255, 255);
    z-index: 1;
}

.wordwrapper {
    text-align: center;
    height: 12px;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    margin-top: -12px;
    z-index: 2;
}

.word {
    position: absolute;
    color: rgb(255, 255, 255);
    right: 0;
    padding: 3px;
    background-color: rgba(30, 42, 69);
    text-align: right;
    transform: translateX(18px);
    width: 40px;
    text-align: center;
    border-radius: 35px;
    font-size: 23px;
    font-weight: 300;
    font-family: 'robotolight';
}
.cta-desc{
    font-family: 'robotobold';
    font-size: 25px;
    font-weight: bold;
    color: #dda83f;
    margin-bottom: 24px;
}
.cta-readmore{
    font-family:'robotobold';
    font-size: 20px;
    font-weight: bold;
    color: #00a2ff;
    text-decoration: none;
    max-width: 97px;
    display: block;
}
#section_aboutus_contact .inner-content .right-col .col-right-group{
    text-align: left;
    padding-left: 58px;
    font-size: 23px;
}
.slide-services-title{ 
    font-family: 'robotolight';
    font-size: 23px;
    line-height: 1;
    margin:0px 0px 21px 30px;

}
.col-left-group{
    display: flex;
    padding: 0px 60px 33px 30px;
    justify-content: space-between;
    flex-wrap: wrap;
}
.left-col-child{
    width: 180px;
    margin: 21px 15px 21px 0px;
}
.hori-line{
    display: none;
}


.contact-desc-heavy {
    font-size: 34px
}

.contact-desc-heavy.last_ln {
    margin-top: 40px
}

.contact-us-link {
    background-color: #DDA83F;
    padding: 10.5px 40px;
    font-size: 32px;
    margin-left: auto;
    display: inline-block;
    box-shadow: 0 0 0 0 rgba(221, 168, 63, .7);
    -webkit-animation: pulse 2s infinite;
    -moz-animation: pulse 2s infinite;
    -ms-animation: pulse 2s infinite;
    animation: pulse 2s infinite
}

.contact-us-link:hover {
    -webkit-animation: none;
    -moz-animation: none;
    -ms-animation: none;
    -o-animation: none;
    animation: none
}

@-webkit-keyframes pulse {
    to {
        box-shadow: 0 0 0 13px rgba(221, 168, 63, 0)
    }
}

@-moz-keyframes pulse {
    to {
        box-shadow: 0 0 0 13px rgba(221, 168, 63, 0)
    }
}

@-ms-keyframes pulse {
    to {
        box-shadow: 0 0 0 13px rgba(221, 168, 63, 0)
    }
}

@keyframes pulse {
    to {
        box-shadow: 0 0 0 13px rgba(221, 168, 63, 0)
    }
}

.contact-title {
    transition: color .25s
}

.contact-title::after,
.contact-title::before {
    border: 2px solid transparent;
    width: 0;
    height: 0;
    content: '';
    position: absolute
}

.contact-title::before {
    top: 0;
    left: 0
}

.contact-title::after {
    bottom: 0;
    right: 0
}

.contact-title:hover {
    color: #60daaa
}

.contact-title:hover::after,
.contact-title:hover::before {
    width: 100%;
    height: 100%
}

.contact-title:hover::before {
    border-top-color: #60daaa;
    border-right-color: #60daaa;
    transition: width .25s ease-out, height .25s ease-out .25s
}

.contact-title:hover::after {
    border-bottom-color: #60daaa;
    border-left-color: #60daaa;
    transition: border-color 0s ease-out .5s, width .25s ease-out .5s, height .25s ease-out .75s
}

#section_contact {
    background: #e7e7e7;
    background-size: cover;
    width: 100%;
    overflow: hidden
}

#section_contact .container {
    top: 180px
}

.contact-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between
}

.footer-menu-sub-container {
    width: 605px
}

.menu-dir-row-group.menu-dir-1,
.menu-dir-row-group.menu-dir-2,
.sub-company-container {
    width: 285px;
    display: inline-block
}

.menu-sub-title {
    font-family: robotomedium;
    font-size: 18px;
    margin: 0 0 10px;
    font-weight: 400;
    text-transform: uppercase
}

.company-desc-small-light,
.menu-list-footer {
    font-family: robotolight;
    font-size: 18px
}

.menu-list-footer li {
    margin-bottom: 10px
}

.menu-sub-title-last {
    margin-top: 40px
}

.menu-dir-container {
    padding-bottom: 40px;
    margin-bottom: 40px;
    border-bottom: 1px solid #939598
}

.menu-dir-row-group.menu-dir-2 {
    margin-left: 30px
}

.sub-company-group {
    margin-top: 30px
}

.sub-company-container:last-child {
    margin-left: 30px
}

.swift-company-logo {
    width: 250px;
    margin-left: -30px
}

.inka-company-logo {
    width: 250px;
    margin-left: -21px
}

.contact-social-media {
    position: absolute;
    left: 0;
    bottom: 0
}

.contact-social-media .social-icon {
    float: left;
    display: block;
    text-align: center;
    text-decoration: none;
    width: 40px;
    padding: 5px 0;
    margin-right: 0;
    color: #262626;
    background-color: #d1d3d4
}

.contact-social-media-new {
    position: relative;
    margin-top: 30px;
}

.contact-social-media-new .social-icon {
    float: left;
    display: block;
    text-align: center;
    text-decoration: none;
    width: 40px;
    padding: 5px 0;
    margin-right: 0;
    color: #262626;
    background-color: #d1d3d4
}

.contact-arrow-svg-container {
    position: absolute;
    width: 1600px;
    left: 50%;
    bottom: 50%;
    -webkit-transform: translate(-67%, 61.5%);
    -moz-transform: translate(-67%, 61.5%);
    -ms-transform: translate(-67%, 61.5%);
    -o-transform: translate(-67%, 61.5%);
    transform: translate(-67%, 61.5%)
}
.copyright {
    position: absolute;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    text-align: center;
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%);
    font-family: 'robotolight';
    color: #000000;
}

@media (max-height:750px) {
    .footer-social-media {
        width: 1400px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        position: relative;
        bottom: 0;
        z-index: 70;
        margin-top: 15px;
        padding-bottom: 80px
    }
}

@media (max-height:680px) {
    .particle-js-container,
    .test-video-wrapper {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        overflow: hidden;
        width: 100%
    }
    .inner-content-home {
        padding: 350px 0
    }
    .test-video-wrapper {
        z-index: 0
    }
    .particle-js-container {
        display: block
    }
    .client-group {
        position: relative;
        width: 100%;
        margin-bottom: 100px
    }
}

@media (max-width:1450px) {
    .burger-container,
    .menu-logo {
        width: 1100px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        top: 60px
    }
    .contact-desc-heavy,
    .contact-us-link {
        font-family: avenirheavy;
        font-size: 28px
    }
    .burger-container {
        position: fixed;
        transform: translateX(-50%);
        z-index: 101
    }
    .menu-logo {
        position: absolute;
        transform: translateX(-50%);
        z-index: 73
    }
    .footer-social-media,
    .logo-container {
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%)
    }
    #main-nav-wrap #menu {
        position: fixed;
        top: 0;
        right: auto;
        left: 0;
        width: 100%;
        z-index: 70;
        -webkit-font-smoothing: antialiased;
        -moz-font-smoothing: antialiased;
        margin: 0;
        padding-left: 0;
        padding-top: 185px;
        background: #1E2A45;
        height: 100vh;
        display: none;
        overflow: auto
    }
    .menu-wrapper {
        width: 1100px;
        margin: 0 auto
    }
    .footer-social-media {
        width: 1100px;
        left: 50%;
        transform: translateX(-50%);
        position: absolute;
        bottom: 80px;
        z-index: 70
    }
    .container {
        width: 1100px;
        position: relative;
        margin: auto
    }
    .logo-container {
        width: 1100px;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: 60px
    }
    .scroll-down-container {
        width: 1100px;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        bottom: 7%
    }
    .scroll-down-svg-container {
        width: 440px;
        position: absolute;
        left: 50%;
        bottom: 8%;
        transform: translateX(-183.5%)
    }
    .section-title-container {
        width: 1100px;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        top: 50px
    }
    #section_aboutus .container {
        z-index: 2;
        margin-top: 140px
    }
    #section_aboutus .client-logo-container {
        width: 1100px;
        position: relative;
        margin: auto
    }
    .about-us-illust-container {
        position: absolute;
        width: 1340px;
        top: 113px;
        left: 50%;
        transform: translateX(-59%)
    }
    .client-group {
        position: relative;
        width: 100%;
        margin-top: 60px
    }
    .client-logo-group {
        animation: 30s linear 0s infinite normal none running slideshowscroll;
        display: flex;
        width: 1541px; 
    }
    .client-logo-icon-img {
        width: auto;
        height: 90px
    }
    @-webkit-keyframes slideshowscroll { 
      0% { transform: translateX(0px); }
      100% { transform: translateX(-1541px); }
    }
    @keyframes slideshowscroll { 
      0% { transform: translateX(0px); }
      100% { transform: translateX(-1541px); }
    }
    .services-group {
        width: 480px;
        margin-top: 50px
    }
    .services-top-arrow-svg-container {
        width: 400px;
        position: absolute;
        right: 50%;
        top: 0;
        -webkit-transform: translateX(90%);
        -moz-transform: translateX(90%);
        -ms-transform: translateX(90%);
        -o-transform: translateX(90%);
        transform: translateX(90%)
    }
    .services-bottom-arrow-svg-container {
        width: 800px;
        position: absolute;
        left: 50%;
        bottom: 50%;
        -webkit-transform: translate(-99%, 140%);
        -moz-transform: translate(-99%, 140%);
        -ms-transform: translate(-99%, 140%);
        -o-transform: translate(-99%, 140%);
        transform: translate(-99%, 140%)
    }
    .works-left-arrow-svg-container {
        position: absolute;
        width: 675px;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-134%, -50%);
        -moz-transform: translate(-134%, -50%);
        -ms-transform: translate(-134%, -50%);
        -o-transform: translate(-134%, -50%);
        transform: translate(-120%, -58%)
    }
    .works-right-arrow-svg-container {
        position: absolute;
        width: 333px;
        left: 50%;
        bottom: 50%;
        -webkit-transform: translate(125%, 155%);
        -moz-transform: translate(125%, 155%);
        -ms-transform: translate(125%, 155%);
        -o-transform: translate(125%, 155%);
        transform: translate(125%, 155%)
    }
    #section_aboutus_contact .inner-content .left-col {
        display: inline-block;
        width: 56%;
        position: relative
    }
    #section_aboutus_contact .inner-content .right-col {
        display: inline-block;
        width: 44%;
        position: relative;
        margin-left: -4px;
        text-align: right
    }
    .contact-us-link {
        background-color: #DDA83F;
        padding: 10.5px 40px;
        text-decoration: none;
        margin-left: auto;
        display: inline-block;
        box-shadow: 0 0 0 0 rgba(221, 168, 63, .7);
        -webkit-animation: pulse 2s infinite;
        -moz-animation: pulse 2s infinite;
        -ms-animation: pulse 2s infinite;
        animation: pulse 2s infinite
    }
}

@media (max-width:1280px) {
    .burger-container {
        width: 1000px;
        position: fixed;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        top: 50px;
        z-index: 101
    }
    #main-nav-wrap #menu {
        position: fixed;
        top: 0;
        right: auto;
        left: 0;
        width: 100%;
        z-index: 70;
        -webkit-font-smoothing: antialiased;
        -moz-font-smoothing: antialiased;
        margin: 0;
        padding-left: 0;
        padding-top: 160px;
        background: #1E2A45;
        height: 100vh;
        display: none;
        overflow: auto
    }
    .footer-social-media,
    .menu-logo {
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        position: absolute
    }
    .menu-wrapper {
        width: 1000px;
        margin: 0 auto
    }
    .menu-logo {
        width: 1000px;
        transform: translateX(-50%);
        top: 50px;
        z-index: 73
    }
    #menu li {
        display: block;
        margin: 0 115px 10px 0;
        padding: 7px 0;
        text-align: left;
        width: 300px;
        float: left
    }
    #menu li.menu-our-work {
        margin-top: -150px
    }
    #menu li .submenu-list-services,
    #menu li .submenu-list-work {
        margin-top: 8px
    }
    #menu li a {
        text-decoration: none;
        font-family: avenirheavy;
        font-size: 42px;
        color: #fff
    }
    #menu li a.submenu-link {
        text-decoration: none;
        font-family: robotolight;
        font-size: 20px;
        color: #fff
    }
    .footer-social-media {
        width: 1000px;
        transform: translateX(-50%);
        bottom: 80px;
        z-index: 70
    }
    .logo-container,
    .section-title-container {
        width: 1000px;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        top: 50px;
        left: 50%
    }
    #fp-nav.right {
        right: 30px!important
    }
    .container {
        width: 1000px;
        position: relative;
        margin: auto
    }
    .main-title {
        font-family: avenirheavy;
        font-size: 48px;
        font-weight: 400
    }
    .content-desc-light {
        font-family: robotolight;
        font-size: 20px;
        line-height: 30px;
        font-weight: 400
    }
    .section-title-container {
        position: absolute;
        transform: translateX(-50%)
    }
    .inner-content-home {
        padding: 250px 0
    }
    .logo-container {
        position: absolute;
        transform: translateX(-50%)
    }
    .inspirenow-logo {
        width: 200px
    }
    .scroll-down-container {
        width: 1000px;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        bottom: 7%
    }
    .scroll-down-svg-container {
        width: 300px;
        position: absolute;
        left: 50%;
        bottom: 9%;
        transform: translateX(-211.5%)
    }
    .sd_st0 {
        stroke-width: 1!important
    }
    #section_aboutus .client-logo-container {
        width: 1000px;
        position: relative;
        margin: auto
    }
    .aboutus-wrapper .inner-content-aboutus .main-title {
        width: 430px
    }
    .inner-content-aboutus {
        width: 480px;
        display: inline-block;
        vertical-align: top
    }
    .about-us-illust-container {
        position: absolute;
        width: 1212px;
        top: 108px;
        left: 50%;
        transform: translateX(-59%)
    }
    .sub-title-medium {
        font-family: robotomedium;
        font-size: 22px;
        font-weight: 400;
        padding-bottom: 18px;
        border-bottom: 1px solid #939598;
        margin-bottom: 18px
    }
    .content-desc-bold,
    .h1home {
        font-size: 20px;
        font-weight: 400
    }
    .client-logo-group { 
        animation: 30s linear 0s infinite normal none running slideshowscroll; 
        display: flex; 
        width: 1426px; 
    }
    .client-logo-icon-img {
        width: auto;
        height: 80px
    }
    @-webkit-keyframes slideshowscroll { 
      0% { transform: translateX(0px); }
      100% { transform: translateX(-1426px); }
    }
    @keyframes slideshowscroll { 
      0% { transform: translateX(0px); }
      100% { transform: translateX(-1426px); }
    }
    .h1home {
        font-family: robotolight;
        line-height: 30px;
        display: inline
    }
    .inner-content-services {
        width: 420px
    }
    .content-desc-bold {
        font-family: robotobold;
        line-height: 33px
    }
    .services-group-title {
        margin-top: 0;
        margin-bottom: 7px
    }
    .read-more-link {
        font-weight: 400;
        font-family: robotomedium;
        font-size: 17px;
        text-decoration: none;
        max-width: 82px;
    }
    .services-group {
        width: 425px;
        margin-top: 50px
    }
    .services-icon-img.hr-icon-img {
        width: 70px;
        margin-bottom: 15px
    }
    .services-icon-img.marketing-icon-img,
    .services-icon-img.operations-icon-img {
        width: 65px;
        margin-bottom: 15px
    }
    .services-icon-img.sme-icon-img {
        width: 77px;
        margin-top: 5px;
        margin-bottom: 15px
    }
    .works-left-arrow-svg-container {
        position: absolute;
        width: 590px;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-130%, -57%);
        -moz-transform: translate(-130%, -57%);
        -ms-transform: translate(-130%, -57%);
        -o-transform: translate(-130%, -57%);
        transform: translate(-130%, -57%)
    }
    #section_aboutus_contact .inner-content .left-col {
        display: inline-block;
        width: 100%;
        position: relative
    }
    #section_aboutus_contact .inner-content .right-col {
        display: inline-block;
        width: 100%;
        position: relative;
        margin-left: -4px;
        text-align: right
    }
    .footer-menu-sub-container {
        width: 545px
    }
    .menu-dir-row-group.menu-dir-1 {
        width: 252px;
        display: inline-block
    }
    .menu-dir-row-group.menu-dir-2 {
        width: 259px;
        display: inline-block;
        margin-left: 30px
    }
    .menu-dir-container {
        padding-bottom: 30px;
        margin-bottom: 30px;
        border-bottom: 1px solid #939598
    }
    .sub-company-container {
        width: 228px;
        display: inline-block
    }
    .sub-company-container:last-child {
        margin-left: 54px
    }
    .swift-company-logo {
        width: 240px;
        margin-left: -30px
    }
    .inka-company-logo {
        width: 220px;
        margin-left: -19px
    }
    .sub-company-group {
        margin-top: 20px
    }
    .contact-arrow-svg-container {
        position: absolute;
        width: 1440px;
        left: 50%;
        bottom: 50%;
        -webkit-transform: translate(-67%, 61.5%);
        -moz-transform: translate(-67%, 61.5%);
        -ms-transform: translate(-67%, 61.5%);
        -o-transform: translate(-67%, 61.5%);
        transform: translate(-67%, 61.5%)
    }
    
    
    #opportunitiesDesc.swiper-container {
        width: 600px;
        height: 100%;
        /* margin-top: -30px; */
    }
    /*explore our Services 1024
    * --------------------------------------- */
    .slide-services-title{
        margin-left: 0px;
        }
        #section_aboutus_contact .inner-content .right-col .col-right-group{
            padding-left: 0px;
        }
        #section_aboutus_contact .inner-content .right-col .col-right-group{
            text-align : center;
        }
        #section_aboutus_contact .inner-content .right-col{
            margin-top: 50px;
        }
        .col-left-group{
            padding:30px;
            text-align: center;
            justify-content: space-evenly;
        }
        .cta-readmore {
            margin: 0 auto;
        }
        .line{
            display: none;
        }
        .wordwrapper{
            display: none;
        }
        .word{
            display: none;
        }
        .hori-line{
            display: block;
            color: rgb(255, 255, 255);
            padding: 3px; 
            text-align: center; 
            font-size: 20px;
            font-weight: 300;
            font-family: 'robotolight';
            position: relative;
            display: inline-block;
            width: 100%;
        }
        .hori-line:before{
            content: "";
            border: 1px solid rgb(255, 255, 255);
            position: absolute;
            width: 45%;
            top: 20px;
            left: -8px;
        }
        .hori-line:after {
            content: "";
            border: 1px solid rgb(255, 255, 255);
            width: 45%;
            position: absolute;
            top: 20px;
            right: -8px;
        }  
    
    
    
}

@media (max-width:1024px) {
    .burger-container {
        width: 880px;
        position: fixed;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        top: 45px;
        z-index: 101
    }
    .logo-container,
    .menu-logo,
    .section-title-container {
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%)
    }
    #main-nav-wrap {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 1;
        -webkit-font-smoothing: antialiased;
        -moz-font-smoothing: antialiased;
        letter-spacing: 1px;
        font-size: 1.1em;
        padding-left: 0;
        width: 100%;
        height: 100%;
        min-height: 660px;
        overflow: auto;
        display: none
    }
    .menu-logo {
        width: 880px;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: 50px;
        z-index: 73
    }
    .menu-container {
        width: 100%;
        float: none;
        overflow: hidden
    }
    .menu-wrapper {
        width: 880px;
        margin: 0 auto
    }
    .footer-social-media {
        width: 880px;
        position: relative;
        left: auto;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
        margin: 30px auto 0;
        bottom: auto;
        padding-bottom: 60px;
        z-index: 70
    }
    .container {
        width: 880px;
        position: relative;
        margin: auto
    }
    .logo-container,
    .section-title-container {
        width: 880px;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: 45px
    }
    .scroll-down-container {
        width: 880px;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        bottom: 7%
    }
    .scroll-down-svg-container {
        width: 300px;
        position: absolute;
        left: 50%;
        bottom: 9%;
        transform: translateX(-193.5%)
    }
    #section_aboutus,
    #section_aboutus .fp-tableCell {
        height: auto!important
    }
    .about-us-illust-container {
        position: absolute;
        width: 1075px;
        top: 150px;
        left: 50%;
        transform: translateX(-59%)
    }
    #section_aboutus .client-logo-container {
        width: 880px;
        position: relative;
        margin: auto;
        padding-bottom: 60px
    }
    .client-logo-group {
        animation: 30s linear 0s infinite normal none running slideshowscroll;
        display: flex;
        width: 1369px;
    }
    .client-logo-icon-img {
        width: auto;
        height: 75px
    }
    @-webkit-keyframes slideshowscroll { 
      0% { transform: translateX(0px); }
      100% { transform: translateX(-1369px); }
    }
      @keyframes slideshowscroll { 
      0% { transform: translateX(0px); }
      100% { transform: translateX(-1369px); }
    }
    .inner-content-services {
        width: 375px
    }
    .services-bottom-arrow-svg-container {
        width: 620px;
        position: absolute;
        left: 50%;
        bottom: 50%;
        -webkit-transform: translate(-105%, 140%);
        -moz-transform: translate(-105%, 140%);
        -ms-transform: translate(-105%, 140%);
        -o-transform: translate(-105%, 140%);
        transform: translate(-105%, 140%)
    }
    #section_works .client-name-left {
        font-family: robotomedium;
        font-size: 18px;
        margin-bottom: 14px;
        display: block;
        cursor: pointer
    }
    .services-title-regular {
        font-family: robotoregular;
        font-size: 20px;
        font-weight: 400;
        margin-top: 0;
        padding-bottom: 8px;
        border-bottom: 1px solid #1E2A45
    }
    .swiper-button-prev {
        left: 0!important
    }
    .swiper-button-next {
        right: 0!important
    }
    .client-container {
        width: 20%;
        padding-left: 5%;
        padding-right: 3%
    }
    .what-we-did-container {
        width: 20%;
        padding-right: 4%;
        padding-left: 2%
    }
    .works-left-arrow-svg-container {
        position: absolute;
        width: 450px;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-130%, -85%);
        -moz-transform: translate(-130%, -85%);
        -ms-transform: translate(-130%, -85%);
        -o-transform: translate(-130%, -85%);
        transform: translate(-130%, -85%)
    }
    .works-right-arrow-svg-container {
        position: absolute;
        width: 220px;
        left: 50%;
        bottom: 50%;
        -webkit-transform: translate(145%, 120%);
        -moz-transform: translate(145%, 120%);
        -ms-transform: translate(145%, 120%);
        -o-transform: translate(145%, 120%);
        transform: translate(145%, 120%)
    }
    #section_aboutus_contact .inner-content .right-col {
        display: inline-block;
        width: 100%;
        position: relative;
        margin-left: -4px;
        text-align: right;
        margin-top: 40px
    }
    #section_contact,
    #section_contact .fp-tableCell {
        height: auto!important
    }
    #section_contact .container {
        top: 0;
        margin: 160px auto 100px
    }
    .footer-menu-sub-container {
        width: 500px
    }
    .menu-dir-row-group.menu-dir-1,
    .menu-dir-row-group.menu-dir-2 {
        width: 233px;
        display: inline-block
    }
    .menu-dir-row-group.menu-dir-2 {
        margin-left: 30px
    }
    .sub-company-container {
        width: 210px;
        display: inline-block
    }
    .swift-company-logo {
        width: 213px;
        margin-left: -26px
    }
    .inka-company-logo {
        width: 190px;
        margin-left: -16px
    }
    .contact-arrow-svg-container {
        position: absolute;
        width: 1100px;
        left: 50%;
        bottom: 50%;
        -webkit-transform: translate(-67%, 68.5%);
        -moz-transform: translate(-67%, 68.5%);
        -ms-transform: translate(-67%, 68.5%);
        -o-transform: translate(-67%, 68.5%);
        transform: translate(-67%, 68.5%)
    }
    
    #opportunitiesImage .swiper-slide {
        background-position: center;
        background-size: cover;
        width: 40%;
        position: relative;
        padding: 18px 15px 0;
    }
    #opportunitiesImage .swiper-slide.swiper-slide-active {
        width: 40%;
        padding: 0;
        margin: 0 15px;/*
        -webkit-transition: all ease-in-out 0.5s;
        transition: all ease-in-out 0.5s;*/
    }
    #opportunitiesImage .flip-card-inner {
        position: relative;
        width: 100%;
        height: 100%;
        text-align: center;
        transition: transform 0.8s;
        transform-style: preserve-3d;
    }
    #opportunitiesImage .swiper-slide.swiper-slide-active .overlay-slide:hover .flip-card-inner {
        transform: rotateY(0);
    }
    #opportunitiesImage .flip-card-front {
        position: relative;
    }
    #opportunitiesImage .flip-card-back {
        display: none;
    }
    #opportunitiesImage .hover-testimonials {
        display: none;
    }
    #opportunitiesImage .swiper-slide.swiper-slide-active .hover-testimonials {
        display: none;
    }
    #opportunitiesImage .swiper-slide.swiper-slide-active .overlay-slide:hover .hover-testimonials {
        display: none;
    }
    
    #opportunitiesDesc.swiper-container {
        max-width: 800px;
        width: 100%;
        height: 100%;
        /* margin-top: -30px; */
    }
    .hover-testimonial-mobile {
        display: block;
        font-family: 'robotolight_italic';
        font-size: 17px;
        line-height: 1.5;
        padding: 0 50px;
        margin: 15px;
    }
     
    
}

@media (max-width:900px) {
    .burger-container,
    .menu-logo {
        -webkit-transform: translateX(-50%)
    }
    .burger-container {
        width: 100%!important;
        position: fixed;
        left: 50%;
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        top: 45px;
        z-index: 101
    }
    #main-nav-wrap #menu {
        position: fixed;
        top: 0;
        right: auto;
        left: 0;
        width: 100%;
        z-index: 70;
        -webkit-font-smoothing: antialiased;
        -moz-font-smoothing: antialiased;
        margin: 0;
        padding-left: 0;
        padding-top: 180px;
        background: #1E2A45;
        height: 100vh;
        display: none;
        overflow: auto;
        -webkit-overflow-scrolling: touch
    }
    .menu-logo,
    .menu-wrapper {
        padding: 0 50px;
        width: 100%
    }
    a.menu-toggle {
        display: block;
        width: 35px;
        height: 40px;
        position: absolute;
        right: 50px
    }
    .menu-logo {
        position: absolute;
        left: auto;
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(0);
        top: 50px;
        z-index: 73
    }
    .menu-wrapper {
        margin: 0 auto
    }
    #menu li {
        display: block;
        margin: 0;
        padding: 12px 0;
        text-align: left;
        width: 100%;
        float: none
    }
    #menu li.menu-our-work {
        margin-top: 0
    }
    #menu li .submenu-list-services,
    #menu li .submenu-list-work {
        display: none;
        margin: 0 auto;
        width: 240px
    }
    #menu li.menu-services a.main-link {
        padding-bottom: 0;
        border-bottom: 0
    }
    #menu li.menu-services.is-active a.main-link {
        padding-bottom: 7px;
        border-bottom: 1px solid #fff
    }
    #menu li.menu-our-work a.main-link {
        padding-bottom: 0;
        border-bottom: 0
    }
    #menu li.menu-our-work.is-active a.main-link {
        padding-bottom: 7px;
        border-bottom: 1px solid #fff
    }
    #menu li a.main-link {
        display: block;
        position: relative;
        width: 240px;
        margin: auto
    }
    .arrow-mobile,
    .arrow-mobile:after {
        display: inline-block;
        position: absolute
    }
    #menu li .submenu-list-services li,
    #menu li .submenu-list-work li {
        margin: 12px 0;
        padding: 0
    }
    .arrow-mobile {
        vertical-align: middle;
        margin-left: 20px;
        margin-top: 30px
    }
    .arrow-mobile:after {
        content: '';
        border: solid #fff;
        border-width: 0 5px 5px 0;
        padding: 5px;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
        transform-origin: center center;
        margin: -8px 0 0
    }
    .footer-social-media {
        width: 240px;
        position: relative;
        left: auto;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
        margin: 80px auto 0;
        bottom: auto;
        padding-bottom: 90px;
        z-index: 70;
        float: none;
        overflow: hidden
    }
    .logo-container,
    .section-title-container {
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        top: 50px
    }
    #fp-nav.right {
        display: none!important
    }
    .container {
        width: 100%!important;
        padding: 0 50px!important;
        position: relative;
        margin: auto
    }
    .section-title-container {
        width: 100%;
        position: absolute;
        left: 0;
        transform: translateX(0);
        padding: 0 50px
    }
    .section-title:after {
        content: '';
        background: #DDA83F;
        width: 150px;
        height: 5px;
        position: absolute;
        left: 50px;
        bottom: -15px
    }
    .logo-container {
        width: 100%!important;
        padding: 0 50px!important;
        position: absolute;
        left: 50%;
        transform: translateX(-50%)
    }
    .inspirenow-logo {
        width: 200px
    }
    .scroll-down-container {
        width: 100%;
        padding: 0 50px;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        bottom: 7%
    }
    .scroll-down-svg-container {
        width: 300px;
        position: absolute;
        left: 50%;
        bottom: 8%;
        transform: translateX(-157.5%)
    }
    .big-circle-container {
        width: 60%!important;
        position: absolute!important;
        top: 50%!important;
        transform: translateY(-50%);
        right: -20%!important
    }
    .small-circle-container {
        width: 35%!important;
        position: absolute!important;
        bottom: 50%!important;
        left: 50%!important;
        transform: translate(-30%, 220%)!important
    }
    .inner-content-aboutus {
        width: 100%;
        display: inline-block;
        vertical-align: top
    }
    .aboutus-wrapper .inner-content-aboutus .main-title {
        width: 100%
    }
    .about-us-illust-container {
        position: relative;
        width: 170%;
        top: 15px;
        left: 50%;
        transform: translateX(-75%)
    }
    #section_aboutus .client-logo-container {
        width: 100%;
        position: relative;
        margin: auto;
        padding: 0 50px 60px
    }
    .client-group {
        position: relative;
        width: 100%;
        margin-top: 40px;
        margin-bottom: 0
    }
    .sub-title-medium {
        font-family: robotomedium;
        font-size: 22px;
        font-weight: 400;
        padding-bottom: 18px;
        border-bottom: 1px solid #939598;
        margin-bottom: 20px
    }
    .client-logo-group { 
        animation: 30s linear 0s infinite normal none running slideshowscroll; 
        display: flex; 
        width: 1541px; 
    }
    .client-logo-icon-img { 
        width: auto; 
        height: 90px; 
    }
    @-webkit-keyframes slideshowscroll { 
      0% { transform: translateX(0px); }
      100% { transform: translateX(-1541px); }
    }
    @keyframes slideshowscroll { 
      0% { transform: translateX(0px); }
      100% { transform: translateX(-1541px); }
    }
    #section_services,
    #section_services .fp-tableCell {
        height: auto!important
    }
    #section_services .container {
        top: 0;
        margin-top: 180px
    }
    .services-wrapper {
        width: 100%;
        display: block;
        justify-content: space-between
    }
    .inner-content-services {
        width: 100%
    }
    .services-group {
        width: 460px;
        margin: 50px auto;
        float: none;
        overflow: hidden
    }
    .services-bottom-arrow-svg-container {
        width: 620px;
        position: absolute;
        left: 50%;
        bottom: 50%;
        -webkit-transform: translate(-140%, 115%);
        -moz-transform: translate(-140%, 115%);
        -ms-transform: translate(-140%, 115%);
        -o-transform: translate(-140%, 115%);
        transform: translate(-140%, 115%)
    }
    .client-container,
    .laptop-view-container {
        display: none
    }
    .client-slider-container {
        position: relative;
        width: 100%;
        padding: 0 50px;
        background: 0 0;
        left: 0;
        top: 0;
        z-index: 1;
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        transform: translate(0, 0);
        margin-top: 160px
    }
    /*.swiper-container {
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .16), 0 0 0 1px rgba(0, 0, 0, .08)
    }*/
    .swiper-button-next,
    .swiper-button-prev {
        position: absolute;
        top: 50%;
        width: 27px;
        height: 44px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        z-index: 10;
        cursor: pointer;
        background-size: 27px 44px;
        background-position: center;
        background-repeat: no-repeat
    }
    .swiper-pagination-bullets {
        bottom: 0!important;
        left: 0;
        width: 100%;
        position: relative!important;
        margin-top: 30px
    }
    .services-desc-container {
        width: 100%;
        display: block;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin-top: 30px;
        margin-bottom: 60px
    }
    .what-we-did-container {
        width: 100%;
        padding-right: 50px;
        padding-left: 50px
    }
    .client-name {
        font-family: robotomedium;
        font-size: 28px;
        margin-bottom: 15px;
        display: block;
        cursor: pointer
    }
    .inspirenow-logo-laptop-container,
    .works-left-arrow-svg-container {
        display: none
    }
    .swiper-button-next {
        right: 50px!important
    }
    .swiper-button-prev {
        left: 50px!important
    }
    .works-right-arrow-svg-container {
        position: absolute;
        width: 220px;
        left: 50%;
        top: 50%;
        bottom: auto;
        -webkit-transform: translate(110%, -10%);
        -moz-transform: translate(110%, -10%);
        -ms-transform: translate(110%, -10%);
        -o-transform: translate(110%, -10%);
        transform: translate(110%, -10%)
    }
    #section_aboutus_contact .container {
        margin: 100px auto
    }
    #section_aboutus_contact .inner-content .left-col {
        display: block;
        width: 100%;
        position: relative;
        text-align: center
    }
    #section_aboutus_contact .inner-content .right-col {
        display: block;
        width: 100%;
        position: relative;
        margin-left: 0;
        text-align: center;
        margin-top: 50px
    }
    .video-wrapper {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
        display: block
    }
    .video-container {
        position: relative;
        width: 100%;
        height: 100%
    }
    #section_contact,
    #section_contact .fp-tableCell {
        height: 100vh!important;
        min-height: auto!important
    }
    #section_contact .container {
        top: 0;
        margin-top: 160px
    }
    .contact-wrapper {
        width: 100%;
        display: block;
        justify-content: space-between
    }
    .footer-menu-sub-container {
        width: 100%;
        margin-top: 30px
    }
    .menu-dir-row-group.menu-dir-1 {
        width: 233px;
        display: inline-block;
        margin-right: 30px
    }
    .menu-dir-row-group.menu-dir-2 {
        width: 233px;
        display: inline-block;
        margin-left: 0
    }
    .sub-company-container {
        width: 210px;
        display: inline-block;
        margin-right: 55px;
        margin-bottom: 30px
    }
    .sub-company-container:last-child {
        margin-left: 0;
        margin-right: 0
    }
    .contact-social-media {
        position: relative;
        left: 0;
        bottom: 0;
        float: none;
        overflow: hidden;
        margin-top: 30px;
        margin-bottom: 60px
    }
    .contact-arrow-svg-container {
        display: none
    }
    .copyright {
        bottom: 24px;
        padding: 0 30px;
        font-size: 14px;
    }
    
    #opportunitiesImage .swiper-slide.swiper-slide-active {
        width: 50%;
        padding: 0;
        margin: 0 5px;
    }
    #opportunitiesImage .swiper-slide {
        background-position: center;
        background-size: cover;
        width: 50%;
        position: relative;
        padding: 6px 5px 0;
    }
    #opportunitiesDesc .swiper-slide-img-mobile {
        display: block;
    }
    #opportunitiesImage {
        display: none;
    }
    #opportunitiesDesc.swiper-container {
        margin: 70px 0 0;
    }
    #opportunitiesDesc .swiper-wrapper {
        margin-bottom: 20px;
    }
    #opportunitiesDesc .slide-content {
        width: 100%;
        margin: 0px auto;
    }
    #opportunitiesDesc .swiper-slide-img-mobile {
        margin-bottom: 20px;
        padding: 0 50px;
    }
    #opportunitiesDesc .swiper-button-prev {
        left: 50px !important;
        transform: translateY(-22px);
        top: 0;
        margin-top: 61%;
    }
    #opportunitiesDesc .swiper-button-next {
        right: 50px !important;
        transform: translateY(-22px);
        top: 0;
        margin-top: 61%;
    }
    #opportunitiesDesc .client-name {
        margin-bottom: 6px;
    }
    #opportunitiesDesc .client-desc {
        font-weight: 400;
        display: block;
        margin-top: 0;
        padding: 0 68px;
    }
    #opportunitiesDesc .hover-testimonial-mobile {
        display: block;
        font-family: robotolight_italic;
        font-size: 17px;
        line-height: 1.5;
        padding: 0px 100px;
        margin: 15px;
    }
    #opportunitiesDesc .swiper-wrapper {
        margin-bottom: 10px;
    }
    #opportunitiesDesc .swiper-pagination {
        bottom: 0px;
        margin-top: 30px;
    }
    
    
    #section_testimonials .section-testimonials-container {
        width: 100%;
        max-width: 100%;
        padding: 0px 120px;
        margin: 100px auto;
    }
    .contact-social-media-new {
        position: relative;
        margin: 30px auto 0;
        float: none;
        overflow: hidden;
        width: 120px;
    }
    
    
    .client-slideshow-container::before {
        content: "";
        background: linear-gradient(90deg, rgb(231, 231, 231) 10%, rgba(231, 231, 231, 0) 100%);
        width: 150px;
        height: 100%;
        top: 0px;
        left: -1px;
        position: absolute;
        z-index: 1;
        pointer-events: none;
    }
    .client-slideshow-container::after {
        content: "";
        background: linear-gradient(90deg, rgba(231, 231, 231, 0) 0%, rgb(231, 231, 231) 90%);
        width: 150px;
        height: 100%;
        top: 0px;
        right: -1px;
        position: absolute;
        z-index: 1;
        pointer-events: none;
    }
    
}

/* Section - Width 576
* --------------------------------------- */
@media (max-width: 576px){ 
    .left-col-child{
        width: 183px;
        margin: 21px 0px;
    }
    .col-left-group{
        padding: 30px 0px;
    }
}

@media (max-width:480px) {
    .burger-container {
        width: 100%!important;
        padding: 0 30px!important;
        position: fixed;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        top: 40px;
        z-index: 101
    }
    .menu-logo {
        width: 100%;
        position: absolute;
        left: auto;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(0);
        top: 40px;
        z-index: 73;
        padding: 0 30px
    }
    #menu li {
        display: block;
        margin: 0;
        padding: 7px 0;
        text-align: left;
        width: 100%;
        float: none
    }
    #menu li a {
        text-decoration: none;
        font-family: avenirheavy;
        font-size: 38px;
        color: #fff
    }
    #main-nav-wrap #menu {
        position: fixed;
        top: 0;
        right: auto;
        left: 0;
        width: 100%;
        z-index: 70;
        -webkit-font-smoothing: antialiased;
        -moz-font-smoothing: antialiased;
        margin: 0;
        padding-left: 0;
        padding-top: 150px;
        background: #1E2A45;
        height: 100vh;
        display: none;
        overflow: auto;
        -webkit-overflow-scrolling: touch
    }
    a.menu-toggle {
        display: block;
        width: 35px;
        height: 40px;
        position: absolute;
        right: 30px
    }
    a.menu-toggle span {
        display: block;
        width: 30px;
        height: 4px;
        position: absolute;
        top: 50%;
        bottom: auto;
        left: auto;
        -moz-transition: background .2s ease-in-out;
        -o-transition: background .2s ease-in-out;
        -webkit-transition: background .2s ease-in-out;
        -ms-transition: background .2s ease-in-out;
        transition: background .2s ease-in-out;
        font: 0/0 a;
        text-shadow: none;
        color: transparent
    }
    .arrow-mobile {
        display: inline-block;
        vertical-align: middle;
        margin-left: 20px;
        position: absolute;
        margin-top: 26px
    }
    .footer-social-media {
        width: 240px;
        position: relative;
        left: auto;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
        margin: 50px auto 0;
        bottom: auto;
        padding-bottom: 90px;
        z-index: 70;
        float: none;
        overflow: hidden
    }
    .logo-container,
    .section-title-container {
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%)
    }
    #section_home {
        min-height: 620px;
    }
    .landing-read-more-link {
        font-family: 'robotomedium';
        color: #DDA83F;
        font-size: 17px;
        text-decoration: none;
        cursor: pointer;
        margin-top: 0;
    }
    .container {
        width: 100%!important;
        padding: 0 30px!important;
        position: relative;
        margin: auto
    }
    .main-title {
        font-family: avenirheavy;
        font-size: 42px;
        font-weight: 400
    }
    .content-desc-light {
        font-family: robotolight;
        font-size: 18px;
        line-height: 26px;
        font-weight: 400
    }
    .section-title,
    .sub-title-medium {
        font-family: robotomedium;
        font-size: 18px;
        font-weight: 400
    }
    .section-title {
        width: 130px;
        margin-top: 50px;
        margin-bottom: 30px
    }
    .section-title:after {
        content: '';
        background: #DDA83F;
        width: 130px;
        height: 5px;
        position: absolute;
        left: 30px;
        bottom: -15px
    }
    .section-title-container {
        width: 100%;
        padding: 0 30px;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
        top: 0
    }
    .inner-content-home {
        padding: 0!important
    }
    .inspirenow-logo {
        width: 180px;
        margin-top: 0
    }
    .logo-container {
        width: 100%!important;
        padding: 0 30px!important;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: 40px;
        z-index: 3
    }
    .scroll-down-container {
        width: 100%;
        padding: 0 30px;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        bottom: 7%
    }
    .scroll-down-svg-container {
        width: 180px;
        position: absolute;
        left: 0;
        bottom: 8%;
        transform: translateX(0)
    }
    .slidingVertical {
        display: block;
        text-indent: 0;
    }
    .slidingVertical span {
        animation: topToBottom 10s linear infinite;
        -o-animation: topToBottom 10s linear infinite;
        -ms-animation: topToBottom 10s linear infinite;
        -moz-animation: topToBottom 10s linear infinite;
        -webkit-animation: topToBottom 10s linear infinite;
        opacity: 0;
        overflow: hidden;
        position: absolute
    }
    .slidingVertical span.hr_slide {
        animation-delay: -10ms;
        -o-animation-delay: -10ms;
        -ms-animation-delay: -10ms;
        -moz-animation-delay: -10ms;
        -webkit-animation-delay: -10ms
    }
    .slidingVertical span.mkt_slide {
        animation-delay: -2.5s;
        -o-animation-delay: -2.5s;
        -ms-animation-delay: -2.5s;
        -moz-animation-delay: -2.5s;
        -webkit-animation-delay: -2.5s
    }
    .slidingVertical span.opt_slide {
        animation-delay: -5s;
        -o-animation-delay: -5s;
        -ms-animation-delay: -5s;
        -moz-animation-delay: -5s;
        -webkit-animation-delay: -5s
    }
    .slidingVertical span.sme_slide {
        animation-delay: -7.5s;
        -o-animation-delay: -7.5s;
        -ms-animation-delay: -7.5s;
        -moz-animation-delay: -7.5s;
        -webkit-animation-delay: -7.5s
    }
    @-webkit-keyframes topToBottom {
        0%,
        100%,
        80% {
            opacity: 0
        }
        5% {
            opacity: 0;
            -webkit-transform: translateY(10px)
        }
        10%,
        25% {
            opacity: 1;
            -webkit-transform: translateY(0)
        }
        30% {
            opacity: 0;
            -webkit-transform: translateY(-10px)
        }
    }
    @-moz-keyframes topToBottom {
        0%,
        100%,
        80% {
            opacity: 0
        }
        5% {
            opacity: 0;
            -moz-transform: translateY(10px)
        }
        10%,
        25% {
            opacity: 1;
            -moz-transform: translateY(0)
        }
        30% {
            opacity: 0;
            -moz-transform: translateY(-10px)
        }
    }
    @-ms-keyframes topToBottom {
        0%,
        100%,
        30%,
        5%,
        80% {
            opacity: 0
        }
        5% {
            -ms-transform: translateY(10px)
        }
        10%,
        25% {
            opacity: 1;
            -ms-transform: translateY(0)
        }
        30% {
            -ms-transform: translateY(-10px)
        }
    }
    @-o-keyframes topToBottom {
        0%,
        100%,
        80% {
            opacity: 0
        }
        5% {
            opacity: 0;
            -o-transform: translateY(10px)
        }
        10%,
        25% {
            opacity: 1;
            -o-transform: translateY(0)
        }
        30% {
            opacity: 0;
            -o-transform: translateY(-10px)
        }
    }
    @keyframes topToBottom {
        0%,
        100%,
        80% {
            opacity: 0
        }
        5% {
            opacity: 0;
            transform: translateY(10px)
        }
        10%,
        25% {
            opacity: 1;
            transform: translateY(0)
        }
        30% {
            opacity: 0;
            transform: translateY(-10px)
        }
    }
    .landing-testimonials-container {
        margin-top: 40px;
    }
    .small-circle-container {
        width: 35%!important;
        position: absolute!important;
        bottom: 50%!important;
        left: 50%!important;
        -webkikt-transform: translate(-30%, 285%)!important;
        -moz-transform: translate(-30%, 285%)!important;
        -ms-transform: translate(-30%, 285%)!important;
        -o-transform: translate(-30%, 285%)!important;
        transform: translate(-30%, 285%)!important
    }
    #section_aboutus .container {
        height: unset;
        vertical-align: bottom;
        z-index: 2;
        margin-top: 50px
    }
    .inner-content-aboutus {
        padding: 0;
        width: 100%
    }
    .aboutus-artwork {
        position: relative;
        width: 100%;
        right: 0;
        top: 0
    }
    .client-group {
        margin-bottom: 0;
        bottom: inherit;
        position: relative;
        width: 100%
    }
    .sub-title-medium {
        padding-bottom: 10px;
        border-bottom: 1px solid #939598
    }
    #section_aboutus .client-logo-container {
        width: 100%;
        position: relative;
        margin: auto;
        padding: 0 30px 60px
    }
    .client-slideshow-container {
        height: auto;
        margin: 30px auto auto;
        overflow: hidden;
        position: relative;
        width: 100%;
    }
    .client-logo-group { 
        animation: 30s linear 0s infinite normal none running slideshowscroll; 
        display: flex; 
        width: 1201px; 
    }
    .client-logo-icon-img { 
        width: auto; 
        height: 75px; 
        margin: 0 24px;
    }
    @-webkit-keyframes slideshowscroll { 
      0% { transform: translateX(0px); }
      100% { transform: translateX(-1201px); }
    }
    @keyframes slideshowscroll { 
      0% { transform: translateX(0px); }
      100% { transform: translateX(-1201px); }
    }
    .client-slideshow-container::before {
        content: "";
        background: linear-gradient(90deg, rgb(231, 231, 231) 10%, rgba(231, 231, 231, 0) 100%);
        width: 70px;
        height: 100%;
        top: 0px;
        left: -1px;
        position: absolute;
        z-index: 1;
        pointer-events: none;
    }
    .client-slideshow-container::after {
        content: "";
        background: linear-gradient(90deg, rgba(231, 231, 231, 0) 0%, rgb(231, 231, 231) 90%);
        width: 70px;
        height: 100%;
        top: 0px;
        right: -1px;
        position: absolute;
        z-index: 1;
        pointer-events: none;
    }
    .h1home {
        font-family: robotolight;
        font-size: 18px;
        line-height: 26px;
        font-weight: 400;
        display: inline
    }
    #section_services .container {
        display: block;
        justify-content: space-between;
        margin-top: 50px
    }
    .services-wrapper {
        width: 100%;
        display: block
    }
    .inner-content-services {
        width: 100%
    }
    .services-group {
        width: 100%;
        float: none;
        overflow: hidden;
        margin-top: 50px;
        margin-bottom: 20px
    }
    .content-desc-bold {
        font-family: robotobold;
        font-size: 18px;
        line-height: 23px;
        font-weight: 400
    }
    .contact-desc-heavy,
    .contact-us-link {
        font-family: avenirheavy;
        font-size: 20px
    }
    .services-group-title {
        margin-top: 0;
        margin-bottom: 5px;
        margin-left:auto;
        margin-right:auto;
    }
    .services-icon-img.hr-icon-img {
        width: 70px;
        margin: 0 auto 15px
    }
    .services-icon-img.marketing-icon-img {
        width: 64px;
        margin: 0 auto 15px
    }
    .services-icon-img.operations-icon-img {
        width: 62px;
        margin: 0 auto 15px
    }
    .services-icon-img.sme-icon-img {
        width: 75px;
        margin: 6px auto 14px
    }
    .services-sub-group {
        width: 100%;
        float: left;
        margin-bottom: 30px;
        text-align: center
    }
    .services-sub-group.odd {
        padding-right: 0
    }
    .services-sub-group.even {
        padding-left: 0
    }
    .services-top-arrow-svg-container {
        width: 200px;
        position: absolute;
        right: 50%;
        top: 0;
        -webkit-transform: translateX(135%);
        -moz-transform: translateX(135%);
        -ms-transform: translateX(135%);
        -o-transform: translateX(135%);
        transform: translateX(75%)
    }
    .services-bottom-arrow-svg-container {
        width: 600px;
        position: absolute;
        left: 50%;
        bottom: 50%;
        -webkit-transform: translate(-103%, 120%);
        -moz-transform: translate(-103%, 120%);
        -ms-transform: translate(-103%, 120%);
        -o-transform: translate(-103%, 120%);
        transform: translate(-111%, 120%)
    }
    .read-more-link {
        margin: 10px auto 0;
    }
    #section_works,
    #section_works .fp-tableCell {
        height: auto!important
    }
    .inspirenow-logo-laptop-container,
    .laptop-view-container {
        display: none
    }
    .client-slider-container {
        position: relative;
        width: 100%;
        background: 0 0;
        left: unset;
        top: unset;
        z-index: 1;
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        transform: translate(0, 0);
        margin-top: 50px;
        padding: 0
    }
    .services-desc-container {
        padding: 0;
        width: 100%;
        display: block;
        flex-direction: row;
        justify-content: space-between
    }
    #js-next1,
    #js-prev1,
    .client-container {
        display: none;
    }
    
    #opportunitiesImage.swiper-container {
        width: 100%;
        padding-top: 30px;
        padding-bottom: 50px;
    }
    .swiper-main-container {
        margin: 0 0px 50px;
    }
     #opportunitiesDesc .hover-testimonial-mobile {
        display: block;
        font-family: 'robotolight_italic';
        font-size: 17px;
        line-height: 1.5;
        padding: 0 70px;
        margin: 20px 0 20px;
    }
    #opportunitiesImage {
        display: none;
    }
    #opportunitiesDesc.swiper-container {
        margin: 70px 0 0;
        position: relative;
    }
    #opportunitiesDesc .swiper-wrapper {
        width: 100%;
        margin-bottom: 20px;
    }
    #opportunitiesDesc .swiper-slide-img-mobile {
        margin-bottom: 20px;
        padding: 0;
    }
    #opportunitiesDesc .swiper-button-prev {
        left: 30px !important;
        transform: translateY(-22px);
        top: 0;
        margin-top: 75%;
    }
    #opportunitiesDesc .swiper-button-next {
        right: 30px !important;
        transform: translateY(-22px);
        top: 0;
        margin-top: 75%;
    }
    #opportunitiesDesc .client-name {
        margin-bottom: 6px;
        font-size: 24px;
        padding: 0 68px;
    }
    #opportunitiesDesc .client-desc {
        font-weight: 400;
        display: block;
        margin-top: 0;
        padding: 0 68px;
    }
    #opportunitiesDesc .swiper-wrapper {
        margin-bottom: 10px;
    }
    #opportunitiesDesc .swiper-pagination {
        bottom: 0px;
        margin-top: 30px;
    }
    .what-we-did-container {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        margin-top: 30px;
    }
    .portfolio-img img {
        height: auto;
        width: 100%;
    }
    .swiper-container {
        box-shadow: unset;
    }
    .swiper-slide-client-1,
    .swiper-slide-client-2,
    .swiper-slide-client-3 {
        background: #fff;
    }
    .swiper-pagination-bullets {
        bottom: 0!important;
        left: 0;
        width: 100%;
        position: relative!important;
        margin-top: 15px
    }
    .works-right-arrow-svg-container {
        position: absolute;
        width: 220px;
        left: 50%;
        top: 50%;
        bottom: auto;
        -webkit-transform: translate(50%,-60%);
        -moz-transform: translate(50%,-60%);
        -ms-transform: translate(50%,-60%);
        -o-transform: translate(50%,-60%);
        transform: translate(50%,-60%)
    }
    
    
    #section_testimonials .section-testimonials-container {
        width: 100%;
        max-width: 100%;
        padding: 0 60px;
        margin: 100px auto;
    }
    #section_testimonials .section-testimonials-client_image {
        width: 170px;
        margin: 0 auto 28px;
    }
    #section_testimonials .section-testimonials-client_desc {
        font-family: 'robotolight';
        font-size: 14px;
        line-height: 1.5;
        text-align: center;
        color: #fff;
    }
    #section_testimonials .section-testimonials-client_pic {
        margin-top: 35px;
        font-family: 'robotomedium';
        font-size: 18px;
        line-height: 1;
        text-align: center;
    }
    #section_testimonials .client_name_italic {
        font-family: 'robotolight_italic';
        font-size: 18px;
        color: #fff;
    }
    #section_testimonials .section-testimonials-client_name {
        font-family: 'robotomedium';
        font-size: 18px;
        text-align: center;
        margin: 10px 0 0;
        color: #fff;
    }
    .section-testimonials-container {
        width: 100%;
        max-width: 100%;
        padding: 0px 60px;
        margin: 100px auto;
        position: relative;
    }
    #section_testimonials .slick-prev-arrow {
        width: 22px;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        left: -40px;
        right: auto;
        cursor: pointer;
    }
    #section_testimonials .slick-next-arrow {
        width: 22px;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        right: -40px;
        left: auto;
        cursor: pointer;
    }
    #section_aboutus_contact .container {
        margin: 100px auto;
    }
    .contact-social-media-new {
        position: relative;
        margin: 30px auto 0;
        float: none;
        overflow: hidden;
        width: 120px;
    }
    .contact-us-link {
        background-color: #DDA83F;
        width: 100%;
        padding: 10.5px 10px;
        text-decoration: none;
        margin-left: auto;
        display: inline-block;
        box-shadow: 0 0 0 0 rgba(221, 168, 63, .7);
        -webkit-animation: pulse 2s infinite;
        -moz-animation: pulse 2s infinite;
        -ms-animation: pulse 2s infinite;
        animation: pulse 2s infinite
    }
    #section_aboutus_contact .inner-content {
        background-color: rgba(30, 42, 69, .9);
        padding: 40px 30px 30px;
        position: relative
    }
    #section_aboutus_contact .inner-content .right-col {
        display: block;
        width: 100%;
        position: relative;
        margin-left: 0;
        text-align: center;
        margin-top: 30px
    }
    .contact-desc-heavy.last_ln {
        margin-top: 20px
    }
    .video-wrapper {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
        display: block
    }
    .video-container {
        position: relative;
        width: 100%;
        height: 100%
    }
    #section_contact .container {
        display: block;
        flex-direction: row;
        justify-content: space-between;
        margin-top: 50px
    }
    .contact-wrapper {
        width: 100%;
        display: block
    }
    .footer-menu-sub-container {
        width: 100%;
        margin-top: 20px
    }
    .menu-dir-row-group.menu-dir-1 {
        width: 100%;
        display: block
    }
    .menu-dir-row-group.menu-dir-2 {
        width: 100%;
        display: block;
        margin-left: 0
    }
    .menu-dir-container {
        padding-bottom: 20px;
        margin-bottom: 30px;
        border-bottom: 1px solid #939598
    }
    .sub-company-container {
        width: 100%;
        display: block
    }
    .sub-company-container:last-child {
        margin-left: 0;
        margin-top: 30px
    }
    .sub-company-group {
        margin-top: 30px;
        margin-bottom: 50px
    }

    /* added later */
    .left-col-child{
        font-size: 20px;
     }
     .col-left-group {
        padding: 0px 0px;
    }
    .cta-desc{        
        font-size: 18px;
        margin-bottom: 12px;
    }
    .cta-readmore{
        font-size: 14px;
        max-width: 67px;
     }
     .hori-line{
        font-size:16px;
     }
     .hori-line:before{
        top: 13px;
        width: 40%;
        left: 0;
     }
     .hori-line:after{
        top: 13px;
        width: 40%;
        right: 0;
     }

     .slide-services-desc.unleash-text{
        font-size: 18px;
     }
     .slide-services-desc.consult-text{
        font-size: 18px;
     }
}

.loadbar,
.trackbar {
    overflow: hidden;
    height: 100%
}

.percentage,
.trackbar {
    color: #fff;
    text-align: center;
    line-height: 30px
}

.inspirenow-logo-progress {
    width: 250px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.preloader-wrap {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    bottom: 0;
    background: #1E2A45;
    z-index: 1000
}

.percentage {
    z-index: 100;
    border: 1px solid #DDA83F;
    font-size: 15px
}

.loader,
.percentage {
    height: 5px;
    max-width: 100%;
    font-weight: 300;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto
}

.loader:after,
.percentage:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.trackbar {
    width: 100%;
    position: relative;
    opacity: .99
}

.loadbar {
    width: 0%;
    background: #DDA83F;
    position: absolute;
    top: 0;
    left: 0;
    animation: flicker 5s infinite
}

@keyframes animation {
    10% {
        opacity: .9
    }
    30% {
        opacity: .86
    }
    60% {
        opacity: .8
    }
    80% {
        opacity: .75
    }
}


/* svg-animate.min.css */

.big-circle-container {
    width: 60%;
    position: absolute;
    top: -40%;
    right: -15%
}

.small-circle-container {
    width: 35%;
    position: absolute;
    bottom: -50%;
    left: 40%;
    transform: translate(-50%, -10%)
}

.sd_st0 {
    fill: none;
    stroke: #006BFF;
    stroke-width: .75;
    stroke-miterlimit: 10;
    stroke-dasharray: 315;
    stroke-dashoffset: 0;
    opacity: 1
}

.sd_st1 {
    fill: none;
    stroke: #006BFF;
    stroke-width: 2;
    stroke-miterlimit: 10;
    opacity: 0
}

.scroll-line-animate {
    -webkit-animation: scrollLineAnim 3s ease-in-out infinite forwards;
    -moz-animation: scrollLineAnim 3s ease-in-out infinite forwards;
    -ms-animation: scrollLineAnim 3s ease-in-out infinite forwards;
    -o-animation: scrollLineAnim 3s ease-in-out infinite forwards;
    animation: scrollLineAnim 3s ease-in-out infinite forwards
}

@-webkit-keyframes scrollLineAnim {
    0%,
    20% {
        opacity: 0;
        stroke-dashoffset: 315
    }
    21% {
        opacity: 1;
        stroke-dashoffset: 315
    }
    50%,
    80% {
        opacity: 1;
        stroke-dashoffset: 0
    }
    100% {
        opacity: 0;
        stroke-dashoffset: 0
    }
}

@-ms-keyframes scrollLineAnim {
    0%,
    20%,
    21% {
        stroke-dashoffset: 315
    }
    21%,
    50%,
    80% {
        opacity: 1
    }
    0%,
    100%,
    20% {
        opacity: 0
    }
    100%,
    50%,
    80% {
        stroke-dashoffset: 0
    }
}

@-moz-keyframes scrollLineAnim {
    0%,
    20% {
        opacity: 0;
        stroke-dashoffset: 315
    }
    21% {
        opacity: 1;
        stroke-dashoffset: 315
    }
    50%,
    80% {
        opacity: 1;
        stroke-dashoffset: 0
    }
    100% {
        opacity: 0;
        stroke-dashoffset: 0
    }
}

@keyframes scrollLineAnim {
    0%,
    20% {
        opacity: 0;
        stroke-dashoffset: 315
    }
    21% {
        opacity: 1;
        stroke-dashoffset: 315
    }
    50%,
    80% {
        opacity: 1;
        stroke-dashoffset: 0
    }
    100% {
        opacity: 0;
        stroke-dashoffset: 0
    }
}

.scroll-arrow-animate {
    -webkit-animation: scrollArrowAnim 3s ease-in-out infinite forwards;
    -moz-animation: scrollArrowAnim 3s ease-in-out infinite forwards;
    -ms-animation: scrollArrowAnim 3s ease-in-out infinite forwards;
    -o-animation: scrollArrowAnim 3s ease-in-out infinite forwards;
    animation: scrollArrowAnim 3s ease-in-out infinite forwards
}

@-webkit-keyframes scrollArrowAnim {
    0%,
    100%,
    48% {
        opacity: 0
    }
    53%,
    80% {
        opacity: 1
    }
}

@-moz-keyframes scrollArrowAnim {
    0%,
    100%,
    48% {
        opacity: 0
    }
    53%,
    80% {
        opacity: 1
    }
}

@-ms-keyframes scrollArrowAnim {
    0%,
    100%,
    48% {
        opacity: 0
    }
    53%,
    80% {
        opacity: 1
    }
}

@-o-keyframes scrollArrowAnim {
    0%,
    100%,
    48% {
        opacity: 0
    }
    53%,
    80% {
        opacity: 1
    }
}

@keyframes scrollArrowAnim {
    0%,
    100%,
    48% {
        opacity: 0
    }
    53%,
    80% {
        opacity: 1
    }
}

.big-circle {
    -webkit-animation: spinBig 25s ease-in-out infinite;
    -moz-animation: spinBig 25s ease-in-out infinite;
    -ms-animation: spinBig 25s ease-in-out infinite;
    -o-animation: spinBig 25s ease-in-out infinite;
    animation: spinBig 25s ease-in-out infinite
}

@-webkit-keyframes spinBig {
    0% {
        -webkit-transform: rotate(-30deg) scale(1.15);
        -moz-transform: rotate(-30deg) scale(1.15);
        -ms-transform: rotate(-30deg) scale(1.15);
        -o-transform: rotate(-30deg) scale(1.15);
        transform: rotate(-30deg) scale(1.15);
        transform-box: fill-box
    }
    50% {
        -webkit-transform: rotate(-13deg) scale(1);
        -moz-transform: rotate(-13deg) scale(1);
        -ms-transform: rotate(-13deg) scale(1);
        -o-transform: rotate(-13deg) scale(1);
        transform: rotate(-13deg) scale(1)
    }
    100% {
        -webkit-transform: rotate(-30deg) scale(1.15);
        -moz-transform: rotate(-30deg) scale(1.15);
        -ms-transform: rotate(-30deg) scale(1.15);
        -o-transform: rotate(-30deg) scale(1.15);
        transform: rotate(-30deg) scale(1.15)
    }
}

@-moz-keyframes spinBig {
    0%,
    100% {
        -webkit-transform: rotate(-30deg) scale(1.15);
        -moz-transform: rotate(-30deg) scale(1.15);
        -ms-transform: rotate(-30deg) scale(1.15);
        -o-transform: rotate(-30deg) scale(1.15);
        transform: rotate(-30deg) scale(1.15)
    }
    50% {
        -webkit-transform: rotate(-13deg) scale(1);
        -moz-transform: rotate(-13deg) scale(1);
        -ms-transform: rotate(-13deg) scale(1);
        -o-transform: rotate(-13deg) scale(1);
        transform: rotate(-13deg) scale(1)
    }
}

@-ms-keyframes spinBig {
    0%,
    100% {
        -webkit-transform: rotate(-30deg) scale(1.15);
        -moz-transform: rotate(-30deg) scale(1.15);
        -ms-transform: rotate(-30deg) scale(1.15);
        -o-transform: rotate(-30deg) scale(1.15);
        transform: rotate(-30deg) scale(1.15)
    }
    50% {
        -webkit-transform: rotate(-13deg) scale(1);
        -moz-transform: rotate(-13deg) scale(1);
        -ms-transform: rotate(-13deg) scale(1);
        -o-transform: rotate(-13deg) scale(1);
        transform: rotate(-13deg) scale(1)
    }
}

@-o-keyframes spinBig {
    0%,
    100% {
        -webkit-transform: rotate(-30deg) scale(1.15);
        -moz-transform: rotate(-30deg) scale(1.15);
        -ms-transform: rotate(-30deg) scale(1.15);
        -o-transform: rotate(-30deg) scale(1.15);
        transform: rotate(-30deg) scale(1.15)
    }
    50% {
        -webkit-transform: rotate(-13deg) scale(1);
        -moz-transform: rotate(-13deg) scale(1);
        -ms-transform: rotate(-13deg) scale(1);
        -o-transform: rotate(-13deg) scale(1);
        transform: rotate(-13deg) scale(1)
    }
}

@keyframes spinBig {
    0%,
    100% {
        -webkit-transform: rotate(-30deg) scale(1.15);
        -moz-transform: rotate(-30deg) scale(1.15);
        -ms-transform: rotate(-30deg) scale(1.15);
        -o-transform: rotate(-30deg) scale(1.15);
        transform: rotate(-30deg) scale(1.15)
    }
    50% {
        -webkit-transform: rotate(-13deg) scale(1);
        -moz-transform: rotate(-13deg) scale(1);
        -ms-transform: rotate(-13deg) scale(1);
        -o-transform: rotate(-13deg) scale(1);
        transform: rotate(-13deg) scale(1)
    }
}

@media not all and (min-resolution:.001dpcm) {
        .big-circle {
            -webkit-animation: spinBig 25s ease-in-out infinite;
            -moz-animation: spinBig 25s ease-in-out infinite;
            -ms-animation: spinBig 25s ease-in-out infinite;
            -o-animation: spinBig 25s ease-in-out infinite;
            animation: spinBig 25s ease-in-out infinite
        }
        @-webkit-keyframes spinBig {
            0%,
            100% {
                -webkit-transform: rotate(-19deg) scale(1.05);
                -moz-transform: rotate(-19deg) scale(1.05);
                -ms-transform: rotate(-19deg) scale(1.05);
                -o-transform: rotate(-19deg) scale(1.05);
                transform: rotate(-19deg) scale(1.05)
            }
            50% {
                -webkit-transform: rotate(-19deg) scale(1);
                -moz-transform: rotate(-13deg) scale(1);
                -ms-transform: rotate(-13deg) scale(1);
                -o-transform: rotate(-13deg) scale(1);
                transform: rotate(-13deg) scale(1)
            }
        }
        @-moz-keyframes spinBig {
            0%,
            100% {
                -webkit-transform: rotate(-19deg) scale(1.05);
                -moz-transform: rotate(-19deg) scale(1.05);
                -ms-transform: rotate(-19deg) scale(1.05);
                -o-transform: rotate(-19deg) scale(1.05);
                transform: rotate(-19deg) scale(1.05)
            }
            50% {
                -webkit-transform: rotate(-19deg) scale(1);
                -moz-transform: rotate(-13deg) scale(1);
                -ms-transform: rotate(-13deg) scale(1);
                -o-transform: rotate(-13deg) scale(1);
                transform: rotate(-13deg) scale(1)
            }
        }
        @-ms-keyframes spinBig {
            0%,
            100% {
                -webkit-transform: rotate(-19deg) scale(1.05);
                -moz-transform: rotate(-19deg) scale(1.05);
                -ms-transform: rotate(-19deg) scale(1.05);
                -o-transform: rotate(-19deg) scale(1.05);
                transform: rotate(-19deg) scale(1.05)
            }
            50% {
                -webkit-transform: rotate(-19deg) scale(1);
                -moz-transform: rotate(-13deg) scale(1);
                -ms-transform: rotate(-13deg) scale(1);
                -o-transform: rotate(-13deg) scale(1);
                transform: rotate(-13deg) scale(1)
            }
        }
        @-o-keyframes spinBig {
            0%,
            100% {
                -webkit-transform: rotate(-19deg) scale(1.05);
                -moz-transform: rotate(-19deg) scale(1.05);
                -ms-transform: rotate(-19deg) scale(1.05);
                -o-transform: rotate(-19deg) scale(1.05);
                transform: rotate(-19deg) scale(1.05)
            }
            50% {
                -webkit-transform: rotate(-19deg) scale(1);
                -moz-transform: rotate(-13deg) scale(1);
                -ms-transform: rotate(-13deg) scale(1);
                -o-transform: rotate(-13deg) scale(1);
                transform: rotate(-13deg) scale(1)
            }
        }
        .small-circle {
            -webkit-animation: spinSmall 20s ease-in-out infinite;
            -moz-animation: spinSmall 20s ease-in-out infinite;
            -ms-animation: spinSmall 20s ease-in-out infinite;
            -o-animation: spinSmall 20s ease-in-out infinite;
            animation: spinSmall 20s ease-in-out infinite
        }
        @-webkit-keyframes spinSmall {
            0%,
            100%,
            50% {
                -webkit-transform: rotate(-30deg);
                -moz-transform: rotate(-30deg);
                -ms-transform: rotate(-30deg);
                -o-transform: rotate(-30deg);
                transform: rotate(-30deg)
            }
        }
        @-moz-keyframes spinSmall {
            0%,
            100%,
            50% {
                -webkit-transform: rotate(-30deg);
                -moz-transform: rotate(-30deg);
                -ms-transform: rotate(-30deg);
                -o-transform: rotate(-30deg);
                transform: rotate(-30deg)
            }
        }
        @-ms-keyframes spinSmall {
            0%,
            100%,
            50% {
                -webkit-transform: rotate(-30deg);
                -moz-transform: rotate(-30deg);
                -ms-transform: rotate(-30deg);
                -o-transform: rotate(-30deg);
                transform: rotate(-30deg)
            }
        }
        @-o-keyframes spinSmall {
            0%,
            100%,
            50% {
                -webkit-transform: rotate(-30deg);
                -moz-transform: rotate(-30deg);
                -ms-transform: rotate(-30deg);
                -o-transform: rotate(-30deg);
                transform: rotate(-30deg)
            }
        }
        @keyframes spinSmall {
            0%,
            100%,
            50% {
                -webkit-transform: rotate(-30deg);
                -moz-transform: rotate(-30deg);
                -ms-transform: rotate(-30deg);
                -o-transform: rotate(-30deg);
                transform: rotate(-30deg)
            }
        }
    
}

.small-circle {
    -webkit-animation: spinSmall 20s ease-in-out infinite;
    -moz-animation: spinSmall 20s ease-in-out infinite;
    -ms-animation: spinSmall 20s ease-in-out infinite;
    -o-animation: spinSmall 20s ease-in-out infinite;
    animation: spinSmall 20s ease-in-out infinite
}

@-webkit-keyframes spinSmall {
    0%,
    100% {
        -webkit-transform: rotate(-30deg);
        -moz-transform: rotate(-30deg);
        -ms-transform: rotate(-30deg);
        -o-transform: rotate(-30deg);
        transform: rotate(-30deg)
    }
    50% {
        -webkit-transform: rotate(-13deg);
        -moz-transform: rotate(-13deg);
        -ms-transform: rotate(-13deg);
        -o-transform: rotate(-13deg);
        transform: rotate(-13deg)
    }
}

@-moz-keyframes spinSmall {
    0%,
    100% {
        -webkit-transform: rotate(-30deg);
        -moz-transform: rotate(-30deg);
        -ms-transform: rotate(-30deg);
        -o-transform: rotate(-30deg);
        transform: rotate(-30deg)
    }
    50% {
        -webkit-transform: rotate(-13deg);
        -moz-transform: rotate(-13deg);
        -ms-transform: rotate(-13deg);
        -o-transform: rotate(-13deg);
        transform: rotate(-13deg)
    }
}

@-ms-keyframes spinSmall {
    0%,
    100% {
        -webkit-transform: rotate(-30deg);
        -moz-transform: rotate(-30deg);
        -ms-transform: rotate(-30deg);
        -o-transform: rotate(-30deg);
        transform: rotate(-30deg)
    }
    50% {
        -webkit-transform: rotate(-13deg);
        -moz-transform: rotate(-13deg);
        -ms-transform: rotate(-13deg);
        -o-transform: rotate(-13deg);
        transform: rotate(-13deg)
    }
}

@-o-keyframes spinSmall {
    0%,
    100% {
        -webkit-transform: rotate(-30deg);
        -moz-transform: rotate(-30deg);
        -ms-transform: rotate(-30deg);
        -o-transform: rotate(-30deg);
        transform: rotate(-30deg)
    }
    50% {
        -webkit-transform: rotate(-13deg);
        -moz-transform: rotate(-13deg);
        -ms-transform: rotate(-13deg);
        -o-transform: rotate(-13deg);
        transform: rotate(-13deg)
    }
}

@keyframes spinSmall {
    0%,
    100% {
        -webkit-transform: rotate(-30deg);
        -moz-transform: rotate(-30deg);
        -ms-transform: rotate(-30deg);
        -o-transform: rotate(-30deg);
        transform: rotate(-30deg)
    }
    50% {
        -webkit-transform: rotate(-13deg);
        -moz-transform: rotate(-13deg);
        -ms-transform: rotate(-13deg);
        -o-transform: rotate(-13deg);
        transform: rotate(-13deg)
    }
}

@media not all and (min-resolution:.001dpcm) {
        .small-circle {
            -webkit-animation: spinSmall 20s ease-in-out infinite;
            -moz-animation: spinSmall 20s ease-in-out infinite;
            -ms-animation: spinSmall 20s ease-in-out infinite;
            -o-animation: spinSmall 20s ease-in-out infinite;
            animation: spinSmall 20s ease-in-out infinite
        }
        @-webkit-keyframes spinSmall {
            0%,
            100%,
            50% {
                -webkit-transform: rotate(-30deg);
                -moz-transform: rotate(-30deg);
                -ms-transform: rotate(-30deg);
                -o-transform: rotate(-30deg);
                transform: rotate(-30deg)
            }
        }
        @-moz-keyframes spinSmall {
            0%,
            100%,
            50% {
                -webkit-transform: rotate(-30deg);
                -moz-transform: rotate(-30deg);
                -ms-transform: rotate(-30deg);
                -o-transform: rotate(-30deg);
                transform: rotate(-30deg)
            }
        }
        @-ms-keyframes spinSmall {
            0%,
            100%,
            50% {
                -webkit-transform: rotate(-30deg);
                -moz-transform: rotate(-30deg);
                -ms-transform: rotate(-30deg);
                -o-transform: rotate(-30deg);
                transform: rotate(-30deg)
            }
        }
        @-o-keyframes spinSmall {
            0%,
            100%,
            50% {
                -webkit-transform: rotate(-30deg);
                -moz-transform: rotate(-30deg);
                -ms-transform: rotate(-30deg);
                -o-transform: rotate(-30deg);
                transform: rotate(-30deg)
            }
        }
        @keyframes spinSmall {
            0%,
            100%,
            50% {
                -webkit-transform: rotate(-30deg);
                -moz-transform: rotate(-30deg);
                -ms-transform: rotate(-30deg);
                -o-transform: rotate(-30deg);
                transform: rotate(-30deg)
            }
        }
    
}

#Line_1 .aboutus_st39 {
    opacity: 0
}

.abt-line-1-animate {
    stroke-dasharray: 2115;
    stroke-dashoffset: 0;
    -webkit-animation: abtLine1Anim 4s ease-in-out forwards;
    -moz-animation: abtLine1Anim 4s ease-in-out forwards;
    -ms-animation: abtLine1Anim 4s ease-in-out forwards;
    -o-animation: abtLine1Anim 4s ease-in-out forwards;
    animation: abtLine1Anim 4s ease-in-out forwards
}

@-webkit-keyframes abtLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 2115
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

@-moz-keyframes abtLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 2115
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

@-ms-keyframes abtLine1Anim {
    0%,
    100% {
        opacity: 1
    }
    0% {
        stroke-dashoffset: 2115
    }
    100% {
        stroke-dashoffset: 0
    }
}

@-o-keyframes abtLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 2115
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

@keyframes abtLine1Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 2115
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

#Line_1 .aboutus_st27 {
    opacity: 0
}

.abt-arrow-1-animate {
    -webkit-animation: abtArr1Anim 2s ease-in-out forwards;
    -moz-animation: abtArr1Anim 2s ease-in-out forwards;
    -ms-animation: abtArr1Anim 2s ease-in-out forwards;
    -o-animation: abtArr1Anim 2s ease-in-out forwards;
    animation: abtArr1Anim 2.5s ease-in-out forwards
}

@keyframes abtArr1Anim {
    0%,
    85% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

#Line_2 .aboutus_line_2 {
    opacity: 0
}

.abt-line-2-animate {
    stroke-dasharray: 415;
    stroke-dashoffset: 0;
    -webkit-animation: abtLine2Anim 2s ease-in-out forwards;
    -moz-animation: abtLine2Anim 2s ease-in-out forwards;
    -ms-animation: abtLine2Anim 2s ease-in-out forwards;
    -o-animation: abtLine2Anim 2s ease-in-out forwards;
    animation: abtLine2Anim 2s ease-in-out forwards;
    animation-delay: 2.3s
}

@-webkit-keyframes abtLine2Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 415
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

#Line_2 .aboutus_dot_2 {
    opacity: 0
}

.abt-dot-2-animate {
    -webkit-animation: abtDot2Anim 2s ease-in-out forwards;
    -moz-animation: abtDot2Anim 2s ease-in-out forwards;
    -ms-animation: abtDot2Anim 2s ease-in-out forwards;
    -o-animation: abtDot2Anim 2s ease-in-out forwards;
    animation: abtDot2Anim 2s ease-in-out forwards;
    animation-delay: 2.3s
}

@-webkit-keyframes abtDot2Anim {
    0% {
        opacity: 0
    }
    100%,
    20% {
        opacity: 1
    }
}

#Line_2 .aboutus_arrow_2 {
    opacity: 0
}

.abt-arrow-2-animate {
    -webkit-animation: abtArr2Anim 2s ease-in-out forwards;
    -moz-animation: abtArr2Anim 2s ease-in-out forwards;
    -ms-animation: abtArr2Anim 2s ease-in-out forwards;
    -o-animation: abtArr2Anim 2s ease-in-out forwards;
    animation: abtArr2Anim 2s ease-in-out forwards;
    animation-delay: 2.3s
}

@-webkit-keyframes abtArr2Anim {
    0%,
    90% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

#Line_3 .aboutus_line_3 {
    opacity: 0
}

.abt-line-3-animate {
    stroke-dasharray: 320;
    stroke-dashoffset: 0;
    -webkit-animation: abtLine3Anim 1.7s ease-in-out forwards;
    -moz-animation: abtLine3Anim 1.7s ease-in-out forwards;
    -ms-animation: abtLine3Anim 1.7s ease-in-out forwards;
    -o-animation: abtLine3Anim 1.7s ease-in-out forwards;
    animation: abtLine3Anim 1.7s ease-in-out forwards;
    animation-delay: 2.3s
}

@-webkit-keyframes abtLine3Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 320
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

#Line_3 .aboutus_dot_3 {
    opacity: 0
}

.abt-dot-3-animate {
    -webkit-animation: abtDot3Anim 1.7s ease-in-out forwards;
    -moz-animation: abtDot3Anim 1.7s ease-in-out forwards;
    -ms-animation: abtDot3Anim 1.7s ease-in-out forwards;
    -o-animation: abtDot3Anim 1.7s ease-in-out forwards;
    animation: abtDot3Anim 1.7s ease-in-out forwards;
    animation-delay: 2.3s
}

@-webkit-keyframes abtDot3Anim {
    0% {
        opacity: 0
    }
    100%,
    20% {
        opacity: 1
    }
}

#Line_3 .aboutus_arrow_3 {
    opacity: 0
}

.abt-arrow-3-animate {
    -webkit-animation: abtArr3Anim 1.7s ease-in-out forwards;
    -moz-animation: abtArr3Anim 1.7s ease-in-out forwards;
    -ms-animation: abtArr3Anim 1.7s ease-in-out forwards;
    -o-animation: abtArr3Anim 1.7s ease-in-out forwards;
    animation: abtArr3Anim 1.7s ease-in-out forwards;
    animation-delay: 2.3s
}

@-webkit-keyframes abtArr3Anim {
    0%,
    90% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

#Line_4 .aboutus_line_4 {
    opacity: 0
}

.abt-line-4-animate {
    stroke-dasharray: 470;
    stroke-dashoffset: 0;
    -webkit-animation: abtLine4Anim 1.5s ease-in-out forwards;
    -moz-animation: abtLine4Anim 1.5s ease-in-out forwards;
    -ms-animation: abtLine4Anim 1.5s ease-in-out forwards;
    -o-animation: abtLine4Anim 1.5s ease-in-out forwards;
    animation: abtLine4Anim 1.5s ease-in-out forwards;
    animation-delay: 3.4s
}

@-webkit-keyframes abtLine4Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 470
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 940
    }
}

#Line_4 .aboutus_dot_4 {
    opacity: 0
}

.abt-dot-4-animate {
    -webkit-animation: abtDot4Anim 1.2s ease-in-out forwards;
    -moz-animation: abtDot4Anim 1.2s ease-in-out forwards;
    -ms-animation: abtDot4Anim 1.2s ease-in-out forwards;
    -o-animation: abtDot4Anim 1.2s ease-in-out forwards;
    animation: abtDot4Anim 1.2s ease-in-out forwards;
    animation-delay: 3.4s
}

@-webkit-keyframes abtDot4Anim {
    0%,
    40% {
        opacity: 0
    }
    100%,
    70% {
        opacity: 1
    }
}

#Line_4 .aboutus_arrow_4 {
    opacity: 0
}

.abt-arrow-4-animate {
    -webkit-animation: abtArr4Anim 1.7s ease-in-out forwards;
    -moz-animation: abtArr4Anim 1.7s ease-in-out forwards;
    -ms-animation: abtArr4Anim 1.7s ease-in-out forwards;
    -o-animation: abtArr4Anim 1.7s ease-in-out forwards;
    animation: abtArr4Anim 1.7s ease-in-out forwards;
    animation-delay: 3.4s
}

@-webkit-keyframes abtArr4Anim {
    0%,
    80% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

#Line_5 .aboutus_line_5 {
    opacity: 0
}

.abt-line-5-animate {
    stroke-dasharray: 105;
    stroke-dashoffset: 0;
    -webkit-animation: abtLine5Anim 1s ease-in-out forwards;
    -moz-animation: abtLine5Anim 1s ease-in-out forwards;
    -ms-animation: abtLine5Anim 1s ease-in-out forwards;
    -o-animation: abtLine5Anim 1s ease-in-out forwards;
    animation: abtLine5Anim 1s ease-in-out forwards;
    animation-delay: 2.3s
}

@-webkit-keyframes abtLine5Anim {
    0% {
        opacity: 1;
        stroke-dashoffset: 105
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 210
    }
}

#Line_5 .aboutus_dot_5 {
    opacity: 0
}

.abt-dot-5-animate {
    -webkit-animation: abtDot5Anim .7s ease-in-out forwards;
    -moz-animation: abtDot5Anim .7s ease-in-out forwards;
    -ms-animation: abtDot5Anim .7s ease-in-out forwards;
    -o-animation: abtDot5Anim .7s ease-in-out forwards;
    animation: abtDot5Anim .7s ease-in-out forwards;
    animation-delay: 2.3s
}

@-webkit-keyframes abtDot5Anim {
    0% {
        opacity: 0
    }
    100%,
    20% {
        opacity: 1
    }
}

#Line_5 .aboutus_arrow_5 {
    opacity: 0
}

.abt-arrow-5-animate {
    -webkit-animation: abtArr5Anim 1s ease-in-out forwards;
    -moz-animation: abtArr5Anim 1s ease-in-out forwards;
    -ms-animation: abtArr5Anim 1s ease-in-out forwards;
    -o-animation: abtArr5Anim 1s ease-in-out forwards;
    animation: abtArr5Anim 1s ease-in-out forwards;
    animation-delay: 2.3s
}

@-webkit-keyframes abtArr5Anim {
    0%,
    80% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

.abt-paper-1-animate {
    -webkit-animation: abtPaper1Anim 2s infinite alternate;
    animation: abtPaper1Anim 2s infinite alternate
}

@-webkit-keyframes abtPaper1Anim {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(-15px)
    }
}

@keyframes abtPaper1Anim {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(-15px)
    }
}

.abt-paper-2-animate {
    -webkit-animation: abtPaper2Anim 2s infinite alternate;
    animation: abtPaper2Anim 2s infinite alternate
}

@-webkit-keyframes abtPaper2Anim {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(25px)
    }
}

@keyframes abtPaper2Anim {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(25px)
    }
}

.abt-paper-3-animate {
    -webkit-animation: abtPaper3Anim 2s infinite alternate;
    animation: abtPaper3Anim 2s infinite alternate
}

@-webkit-keyframes abtPaper3Anim {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(-20px)
    }
}

@keyframes abtPaper3Anim {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(-20px)
    }
}

.abt-paper-4-animate {
    -webkit-animation: abtPaper4Anim 2s infinite alternate;
    animation: abtPaper4Anim 2s infinite alternate
}

@-webkit-keyframes abtPaper4Anim {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(15px)
    }
}

@keyframes abtPaper4Anim {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(15px)
    }
}

.abt-paper-5-animate {
    -webkit-animation: abtPaper5Anim 2s infinite alternate;
    animation: abtPaper5Anim 2s infinite alternate
}

@-webkit-keyframes abtPaper5Anim {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(-15px)
    }
}

@keyframes abtPaper5Anim {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(-15px)
    }
}

.services-top-line {
    fill: none;
    stroke: #006BFF;
    stroke-width: .75;
    stroke-miterlimit: 10;
    stroke-dasharray: 425;
    stroke-dashoffset: 0;
    opacity: 0
}

.services-top-dot {
    fill: #006BFF;
    opacity: 0
}

.services-top-arrow-animate {
    stroke-dasharray: 425;
    stroke-dashoffset: 0;
    -webkit-animation: servTopArrAnim 1s ease-in-out forwards;
    -moz-animation: servTopArrAnim 1s ease-in-out forwards;
    -ms-animation: servTopArrAnim 1s ease-in-out forwards;
    -o-animation: servTopArrAnim 1s ease-in-out forwards;
    animation: servTopArrAnim 1s ease-in-out forwards
}

@-webkit-keyframes servTopArrAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 425
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 425
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 850
    }
}

@-moz-keyframes servTopArrAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 425
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 425
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 850
    }
}

@-ms-keyframes servTopArrAnim {
    0%,
    14%,
    15% {
        stroke-dashoffset: 425
    }
    100%,
    15% {
        opacity: 1
    }
    0%,
    14% {
        opacity: 0
    }
    100% {
        stroke-dashoffset: 850
    }
}

@-o-keyframes servTopArrAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 425
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 425
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 850
    }
}

@keyframes servTopArrAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 425
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 425
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 850
    }
}

.services-top-dot-animate {
    -webkit-animation: servTopDotAnim 1.5s ease-in-out forwards;
    -moz-animation: servTopDotAnim 1.5s ease-in-out forwards;
    -ms-animation: servTopDotAnim 1.5s ease-in-out forwards;
    -o-animation: servTopDotAnim 1.5s ease-in-out forwards;
    animation: servTopDotAnim 1.5s ease-in-out forwards
}

@-webkit-keyframes servTopDotAnim {
    0%,
    10% {
        opacity: 0
    }
    100%,
    20% {
        opacity: 1
    }
}

@-moz-keyframes servTopDotAnim {
    0%,
    10% {
        opacity: 0
    }
    100%,
    20% {
        opacity: 1
    }
}

@-ms-keyframes servTopDotAnim {
    0%,
    10% {
        opacity: 0
    }
    100%,
    20% {
        opacity: 1
    }
}

@-o-keyframes servTopDotAnim {
    0%,
    10% {
        opacity: 0
    }
    100%,
    20% {
        opacity: 1
    }
}

@keyframes servTopDotAnim {
    0%,
    10% {
        opacity: 0
    }
    100%,
    20% {
        opacity: 1
    }
}

.services-bottom-line {
    fill: none;
    stroke: #006BFF;
    stroke-width: .75;
    stroke-miterlimit: 10;
    stroke-dasharray: 832;
    stroke-dashoffset: 0;
    opacity: 0
}

.services-bottom-arrow {
    fill: none;
    stroke: #006BFF;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke-dasharray: 30;
    stroke-dashoffset: 0;
    opacity: 0
}

.services-bottom-line-animate {
    stroke-dasharray: 832;
    stroke-dashoffset: 0;
    -webkit-animation: servBtmLineAnim 2s ease-in-out forwards;
    -moz-animation: servBtmLineAnim 2s ease-in-out forwards;
    -ms-animation: servBtmLineAnim 2s ease-in-out forwards;
    -o-animation: servBtmLineAnim 2s ease-in-out forwards;
    animation: servBtmLineAnim 2s ease-in-out forwards
}

@-webkit-keyframes servBtmLineAnim {
    0%,
    44% {
        opacity: 0;
        stroke-dashoffset: 0
    }
    45% {
        opacity: 1;
        stroke-dashoffset: 832
    }
    100% {
        opacity: 1
    }
}

@-moz-keyframes servBtmLineAnim {
    0%,
    44% {
        opacity: 0;
        stroke-dashoffset: 0
    }
    45% {
        opacity: 1;
        stroke-dashoffset: 832
    }
    100% {
        opacity: 1
    }
}

@-ms-keyframes servBtmLineAnim {
    100%,
    45% {
        opacity: 1
    }
    0%,
    44% {
        opacity: 0;
        stroke-dashoffset: 0
    }
    45% {
        stroke-dashoffset: 832
    }
}

@-o-keyframes servBtmLineAnim {
    0%,
    44% {
        opacity: 0;
        stroke-dashoffset: 0
    }
    45% {
        opacity: 1;
        stroke-dashoffset: 832
    }
    100% {
        opacity: 1
    }
}

@keyframes servBtmLineAnim {
    0%,
    44% {
        opacity: 0;
        stroke-dashoffset: 0
    }
    45% {
        opacity: 1;
        stroke-dashoffset: 832
    }
    100% {
        opacity: 1
    }
}

.services-bottom-arrow-animate {
    stroke-dasharray: 30;
    stroke-dashoffset: 0;
    -webkit-animation: servBtmArrAnim 2.5s ease-in-out forwards;
    -moz-animation: servBtmArrAnim 2.5s ease-in-out forwards;
    -ms-animation: servBtmArrAnim 2.5s ease-in-out forwards;
    -o-animation: servBtmArrAnim 2.5s ease-in-out forwards;
    animation: servBtmArrAnim 2.5s ease-in-out forwards
}

@-webkit-keyframes servBtmArrAnim {
    0%,
    85% {
        opacity: 0
    }
    100%,
    92% {
        opacity: 1
    }
}

@-moz-keyframes servBtmArrAnim {
    0%,
    85% {
        opacity: 0
    }
    100%,
    92% {
        opacity: 1
    }
}

@-ms-keyframes servBtmArrAnim {
    0%,
    85% {
        opacity: 0
    }
    100%,
    92% {
        opacity: 1
    }
}

@-o-keyframes servBtmArrAnim {
    0%,
    85% {
        opacity: 0
    }
    100%,
    92% {
        opacity: 1
    }
}

@keyframes servBtmArrAnim {
    0%,
    85% {
        opacity: 0
    }
    100%,
    92% {
        opacity: 1
    }
}

.l_works-st0 {
    fill: none;
    stroke: #006BFF;
    stroke-width: .75;
    stroke-miterlimit: 10;
    stroke-dasharray: 1260;
    stroke-dashoffset: 0;
    opacity: 0
}

.l_works-st1 {
    fill: #006BFF
}

.works-left-line-animate {
    stroke-dasharray: 1260;
    stroke-dashoffset: 0;
    -webkit-animation: worksLeftLineAnim 1.7s ease-in-out forwards;
    -moz-animation: worksLeftLineAnim 1.7s ease-in-out forwards;
    -ms-animation: worksLeftLineAnim 1.7s ease-in-out forwards;
    -o-animation: worksLeftLineAnim 1.7s ease-in-out forwards;
    animation: worksLeftLineAnim 1.7s ease-in-out forwards
}

@-webkit-keyframes worksLeftLineAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 1260
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 1260
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 2520
    }
}

@-moz-keyframes worksLeftLineAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 1260
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 1260
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 2520
    }
}

@-ms-keyframes worksLeftLineAnim {
    0%,
    14%,
    15% {
        stroke-dashoffset: 1260
    }
    100%,
    15% {
        opacity: 1
    }
    0%,
    14% {
        opacity: 0
    }
    100% {
        stroke-dashoffset: 2520
    }
}

@-o-keyframes worksLeftLineAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 1260
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 1260
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 2520
    }
}

@keyframes worksLeftLineAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 1260
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 1260
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 2520
    }
}

.works-left-dot-animate {
    -webkit-animation: worksLeftDotAnim 2s ease-in-out forwards;
    -moz-animation: worksLeftDotAnim 2s ease-in-out forwards;
    -ms-animation: worksLeftDotAnim 2s ease-in-out forwards;
    -o-animation: worksLeftDotAnim 2s ease-in-out forwards;
    animation: worksLeftDotAnim 2s ease-in-out forwards
}

@-webkit-keyframes worksLeftDotAnim {
    0%,
    5% {
        opacity: 0
    }
    100%,
    15% {
        opacity: 1
    }
}

@-moz-keyframes worksLeftDotAnim {
    0%,
    5% {
        opacity: 0
    }
    100%,
    15% {
        opacity: 1
    }
}

@-ms-keyframes worksLeftDotAnim {
    0%,
    5% {
        opacity: 0
    }
    100%,
    15% {
        opacity: 1
    }
}

@-o-keyframes worksLeftDotAnim {
    0%,
    5% {
        opacity: 0
    }
    100%,
    15% {
        opacity: 1
    }
}

@keyframes worksLeftDotAnim {
    0%,
    5% {
        opacity: 0
    }
    100%,
    15% {
        opacity: 1
    }
}

.r_works-st0 {
    fill: none;
    stroke: #006BFF;
    stroke-width: .75;
    stroke-miterlimit: 10;
    stroke-dasharray: 295;
    stroke-dashoffset: 0;
    opacity: 0
}

.r_works-st1 {
    fill: none;
    stroke: #006BFF;
    stroke-width: 2;
    stroke-miterlimit: 10
}

.works-right-line-animate {
    stroke-dasharray: 295;
    stroke-dashoffset: 0;
    -webkit-animation: worksRightLineAnim 2.5s ease-in-out forwards;
    -moz-animation: worksRightLineAnim 2.5s ease-in-out forwards;
    -ms-animation: worksRightLineAnim 2.5s ease-in-out forwards;
    -o-animation: worksRightLineAnim 2.5s ease-in-out forwards;
    animation: worksRightLineAnim 2.5s ease-in-out forwards
}

@-webkit-keyframes worksRightLineAnim {
    0%,
    64% {
        opacity: 0;
        stroke-dashoffset: 295
    }
    65% {
        opacity: 1;
        stroke-dashoffset: 295
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 590
    }
}

@-moz-keyframes worksRightLineAnim {
    0%,
    64% {
        opacity: 0;
        stroke-dashoffset: 295
    }
    65% {
        opacity: 1;
        stroke-dashoffset: 295
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 590
    }
}

@-ms-keyframes worksRightLineAnim {
    0%,
    64%,
    65% {
        stroke-dashoffset: 295
    }
    100%,
    65% {
        opacity: 1
    }
    0%,
    64% {
        opacity: 0
    }
    100% {
        stroke-dashoffset: 590
    }
}

@-o-keyframes worksRightLineAnim {
    0%,
    64% {
        opacity: 0;
        stroke-dashoffset: 295
    }
    65% {
        opacity: 1;
        stroke-dashoffset: 295
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 590
    }
}

@keyframes worksRightLineAnim {
    0%,
    64% {
        opacity: 0;
        stroke-dashoffset: 295
    }
    65% {
        opacity: 1;
        stroke-dashoffset: 295
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 590
    }
}

.works-right-arrow-animate {
    -webkit-animation: worksArrowRightAnim 2.5s ease-in-out forwards;
    -moz-animation: worksArrowRightAnim 2.5s ease-in-out forwards;
    -ms-animation: worksArrowRightAnim 2.5s ease-in-out forwards;
    -o-animation: worksArrowRightAnim 2.5s ease-in-out forwards;
    animation: worksArrowRightAnim 2.5s ease-in-out forwards
}

@-webkit-keyframes worksArrowRightAnim {
    0%,
    65% {
        opacity: 0
    }
    100%,
    75% {
        opacity: 1
    }
}

@-moz-keyframes worksArrowRightAnim {
    0%,
    65% {
        opacity: 0
    }
    100%,
    75% {
        opacity: 1
    }
}

@-ms-keyframes worksArrowRightAnim {
    0%,
    65% {
        opacity: 0
    }
    100%,
    75% {
        opacity: 1
    }
}

@-o-keyframes worksArrowRightAnim {
    0%,
    65% {
        opacity: 0
    }
    100%,
    75% {
        opacity: 1
    }
}

@keyframes worksArrowRightAnim {
    0%,
    65% {
        opacity: 0
    }
    100%,
    75% {
        opacity: 1
    }
}

.c_st1,
.c_top_st0 {
    fill: none;
    opacity: 0
}

.c_top_st0 {
    stroke: #006BFF;
    stroke-width: .75;
    stroke-miterlimit: 10;
    stroke-dasharray: 645;
    stroke-dashoffset: 0
}

.c_btm_st0 {
    fill: none;
    stroke: #006BFF;
    stroke-width: .75;
    stroke-miterlimit: 10;
    stroke-dasharray: 650;
    stroke-dashoffset: 0
}

.c_st1 {
    stroke: #006BFF;
    stroke-width: 2;
    stroke-miterlimit: 10
}

.c_st2 {
    fill: #006BFF
}

.contact-top-line-animate {
    stroke-dasharray: 645;
    stroke-dashoffset: 0;
    -webkit-animation: conTopLineAnim 1.5s ease-in-out forwards;
    -moz-animation: conTopLineAnim 1.5s ease-in-out forwards;
    -ms-animation: conTopLineAnim 1.5s ease-in-out forwards;
    -o-animation: conTopLineAnim 1.5s ease-in-out forwards;
    animation: conTopLineAnim 1.5s ease-in-out forwards
}

@-webkit-keyframes conTopLineAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 645
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 645
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

@-moz-keyframes conTopLineAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 645
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 645
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

@-ms-keyframes conTopLineAnim {
    0%,
    14%,
    15% {
        stroke-dashoffset: 645
    }
    100%,
    15% {
        opacity: 1
    }
    0%,
    14% {
        opacity: 0
    }
    100% {
        stroke-dashoffset: 0
    }
}

@-o-keyframes conTopLineAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 645
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 645
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

@keyframes conTopLineAnim {
    0%,
    14% {
        opacity: 0;
        stroke-dashoffset: 645
    }
    15% {
        opacity: 1;
        stroke-dashoffset: 645
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

.contact-top-arrow-animate {
    stroke-dasharray: 645;
    stroke-dashoffset: 0;
    -webkit-animation: conTopArrowAnim 2s ease-in-out forwards;
    -moz-animation: conTopArrowAnim 2s ease-in-out forwards;
    -ms-animation: conTopArrowAnim 2s ease-in-out forwards;
    -o-animation: conTopArrowAnim 2s ease-in-out forwards;
    animation: conTopArrowAnim 2s ease-in-out forwards
}

@-webkit-keyframes conTopArrowAnim {
    0%,
    75% {
        opacity: 0
    }
    100%,
    85% {
        opacity: 1
    }
}

@-moz-keyframes conTopArrowAnim {
    0%,
    75% {
        opacity: 0
    }
    100%,
    85% {
        opacity: 1
    }
}

@-ms-keyframes conTopArrowAnim {
    0%,
    75% {
        opacity: 0
    }
    100%,
    85% {
        opacity: 1
    }
}

@-o-keyframes conTopArrowAnim {
    0%,
    75% {
        opacity: 0
    }
    100%,
    85% {
        opacity: 1
    }
}

@keyframes conTopArrowAnim {
    0%,
    75% {
        opacity: 0
    }
    100%,
    85% {
        opacity: 1
    }
}

.contact-btm-line-animate {
    stroke-dasharray: 650;
    stroke-dashoffset: 0;
    -webkit-animation: conBtmLineAnim 3s ease-in-out forwards;
    -moz-animation: conBtmLineAnim 3s ease-in-out forwards;
    -ms-animation: conBtmLineAnim 3s ease-in-out forwards;
    -o-animation: conBtmLineAnim 3s ease-in-out forwards;
    animation: conBtmLineAnim 3s ease-in-out forwards
}

@-webkit-keyframes conBtmLineAnim {
    0%,
    59% {
        opacity: 0;
        stroke-dashoffset: 650
    }
    60% {
        opacity: 1;
        stroke-dashoffset: 650
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

@-moz-keyframes conBtmLineAnim {
    0%,
    59% {
        opacity: 0;
        stroke-dashoffset: 650
    }
    60% {
        opacity: 1;
        stroke-dashoffset: 650
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

@-ms-keyframes conBtmLineAnim {
    0%,
    59%,
    60% {
        stroke-dashoffset: 650
    }
    100%,
    60% {
        opacity: 1
    }
    0%,
    59% {
        opacity: 0
    }
    100% {
        stroke-dashoffset: 0
    }
}

@-o-keyframes conBtmLineAnim {
    0%,
    59% {
        opacity: 0;
        stroke-dashoffset: 650
    }
    60% {
        opacity: 1;
        stroke-dashoffset: 650
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

@keyframes conBtmLineAnim {
    0%,
    59% {
        opacity: 0;
        stroke-dashoffset: 650
    }
    60% {
        opacity: 1;
        stroke-dashoffset: 650
    }
    100% {
        opacity: 1;
        stroke-dashoffset: 0
    }
}

.contact-btm-dot-animate {
    -webkit-animation: conBtmDotAnim 2s ease-in-out forwards;
    -moz-animation: conBtmDotAnim 2s ease-in-out forwards;
    -ms-animation: conBtmDotAnim 2s ease-in-out forwards;
    -o-animation: conBtmDotAnim 2s ease-in-out forwards;
    animation: conBtmDotAnim 2s ease-in-out forwards
}

@-webkit-keyframes conBtmDotAnim {
    0%,
    85% {
        opacity: 0
    }
    100%,
    95% {
        opacity: 1
    }
}

@-moz-keyframes conBtmDotAnim {
    0%,
    85% {
        opacity: 0
    }
    100%,
    95% {
        opacity: 1
    }
}

@-ms-keyframes conBtmDotAnim {
    0%,
    85% {
        opacity: 0
    }
    100%,
    95% {
        opacity: 1
    }
}

@-o-keyframes conBtmDotAnim {
    0%,
    85% {
        opacity: 0
    }
    100%,
    95% {
        opacity: 1
    }
}

@keyframes conBtmDotAnim {
    0%,
    85% {
        opacity: 0
    }
    100%,
    95% {
        opacity: 1
    }
}


/* particle.min.css */

#particles-js {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: transparent;
    background-image: url();
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%
}

.count-particles {
    background: #002;
    position: absolute;
    top: 48px;
    left: 0;
    width: 80px;
    color: #13E8E9;
    font-size: .8em;
    text-align: left;
    text-indent: 4px;
    line-height: 14px;
    padding-bottom: 2px;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: 700
}

.js-count-particles {
    font-size: 1.1em
}

#stats,
.count-particles {
    -webkit-user-select: none;
    margin-top: 5px;
    margin-left: 5px
}

#stats {
    border-radius: 3px 3px 0 0;
    overflow: hidden
}

.count-particles {
    border-radius: 0 0 3px 3px
}

.slide-container {
    position: relative;
    z-index: 2000;
    width: auto;
    height: auto;
}

.slide-over {
    position: relative;
    z-index: 99;
}

.slide-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.3);
}

.slide-content {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}

.slide-inner {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}

.slide-panel {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    display: flex;
    max-width: 100%;
}

@media screen and (min-width: 640px) {
    .slide-content-inner {
        width: 100%;
        max-width: 100%;
     }
  }
  

.slide-content-inner {
 display: flex;
 flex-direction: row;
}

.slide-header {
    display: flex;
    justify-content: space-between;
    padding: 1rem; /* equivalent to Tailwind px-4 and sm:px-5 */
}

.slide-title {
    font-size: 1rem; /* equivalent to Tailwind text-base */
    font-weight: 600; /* equivalent to Tailwind font-semibold */
    color: #111827; /* equivalent to Tailwind text-gray-900 */
}

.close-button {
    position: absolute;
    right: 48px;
    align-items: center;
    justify-content: center;
}

.slide-body {
    display: flex;
    position: relative;
    flex-direction: column;
    height: 100%;
    padding: 48px;
    padding-left: 0;
    overflow-y: hidden;
    background: #1E2A45;
    border-left-width: 1px;
    border-color: rgba(64, 64, 64, 0.7);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.slide-content-placeholder {
    position: absolute;
    inset: 0;
    padding: 1rem; /* equivalent to Tailwind px-4 and sm:px-5 */
    border: 1px dashed #e5e7eb; /* equivalent to Tailwind border-dashed and border-neutral-300 */
    border-radius: 0.375rem; /* equivalent to Tailwind rounded-md */
}

/* Transition Classes */
.enter-from-right {
    transform: translateX(100%);
}

.enter-to-right {
    transform: translateX(0);
}

.leave-to-right {
    transform: translateX(100%);
}

.enter {
    transition: transform ease-in-out 500ms, opacity 500ms;
}

.leave {
    transition: transform ease-in-out 500ms, opacity 500ms;
}

.nav-content {
    display: flex;
    flex-direction: column;
    padding-top: 48px;
    justify-content: space-between;
    height: 100%;
    text-align: left;
}

.new-nav-links {
    display: flex;
    flex-direction: column;
}

.new-nav-links li {
    list-style-type: none;
    padding: 0;
    padding-left: 48px;
    margin: 0;
    max-width: max-content;
    padding-bottom: 15px;
}

.new-nav-links li a.active {
    color: #DEA93E;
}

.new-nav-links li:hover a {
    color: #DEA93E;
}

.new-nav-links > li:last-child {
    padding-bottom: 0;
}


.new-nav-links li a {
    text-decoration: none;
    font-family: 'avenirheavy';
    line-height: 1.18;
    color: white;
    font-weight: 500;
    font-size: 40px;
}

.new-nav-footer {
    border-top: 1px solid white;
    padding-top: 50px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 0.75rem;
}

.new-nav-icon-group .social-icon {
    float: left;
    display: block;
    text-align: center;
    width: auto;
    line-height: 30px;
    margin-right: 20px;
    color: #fff;
    background-color: transparent
}

#home-about-us-learn-more,
#section_aboutus .section-title {
    color: #006BFF
}

.new-nav-icon-group .social-icon i:hover,
.new-nav-icon-group .social-icon.facebook:hover,
.new-nav-icon-group .social-icon.linkedin:hover,
.new-nav-icon-group .social-icon.twitter:hover {
    background-color: transparent!important
}

.new-nav-footer .social-icon i {
    font-size: 22px;
    display: block
}

.new-nav-footer .submenu-link {
    text-decoration: none;
    font-weight: 400;
    color: white;
    font-size: 24px;
    font-family: 'avenir';
    line-height: 1.18;
}


.new-nav-footer .submenu.active {
    color: #DEA93E;
}

.new-nav-footer .submenu-link:hover {
    color: #DEA93E;
}

.extra-menu-content .heading {
    text-align: left;
}

.extra-menu-content .heading-para {
    text-align: left;
}

@media screen and (max-width: 640px) {
    .new-nav-links li a {
        font-size: 20px;
    }

    .new-nav-footer .submenu-link {
        color: white;
        font-size: 16px;
    }
  }

  .swiper-articles-heading {
    text-align: left;
  }

  .extra-menu-swiper .swiper-slide .article-title {
    text-align: left;
  }

.container.business-container {
    height: 100%;
}

.business-direction {
    position: relative;
    display: flex;
    flex-direction: row;
    gap: 40px
}

.business-direction #design {
    position: relative;
    bottom: 100px;
}

.business-direction #function {
    position: relative;
    bottom: 140px;
}

.business-direction #construct {
    position: relative;
    bottom: 180px;
}

.business-direction #engage {
    position: relative;
    bottom: 220px;
}

.business-direction #secure {
    position: relative;
    bottom: 260px;
}

.business-direction #track {
    position: relative;
    bottom: 300px;
}

.business-direction #sustain {
    position: relative;
    bottom: 340px;
}

.business-direction #host {
    position: relative;
    bottom: 380px;
}

.graph-image-temp {
    position: absolute;
    width: 100%;
    height: auto;
    top: 80%;
    left: 50%;
    -ms-transform: translate(-50%, -80%);
    transform: translate(-50%, -80%);
}

.graph-image-temp img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}