#developer-hire .mobileappdevCon,
#salesforceservices .section,
.about-greetingwrap .txtboxg,
.carousel-caption {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal
}

#header progress,
.select-wrapper select {
    -webkit-appearance: none;
    -moz-appearance: none
}

.appsectionwrap .appContent .approw a.appstore,
.appstlinksrw .stdsbx a,
.conblrow .phonebx .numbx a,
.discuss-project a:hover,
.footer_contact .social-link li a,
.hover01 .nmtxtbx,
.methodology a:hover,
.service-tabbtn-row .tabsConbtn a,
.services_nav ul li a:hover,
a,
a.contactbtnt,
a:focus,
a:hover {
    text-decoration: none
}

.footer_contact h2,
a.contactbtnt {
    letter-spacing: .5px
}

.nav.headermenu>li>a,
.navbar-default {
    -moz-transition: all .2s linear;
    -o-transition: all .2s linear;
    -ms-transition: all .2s linear
}

.navbar-brand,
body {
    padding: 0
}

#hbanner,
a.contactbtnt {
    position: absolute;
    display: block
}

.digital_se .home-services,
.homebox {
    min-height: 330px
}

.accordion a,
.hero {
    -webkit-box-orient: vertical
}

.contact ul,
.services_nav ul,
ul.ultick {
    list-style-type: none
}

@font-face {
    font-family: 'Gilmer';
    src: url(https://codologi.in/fonts/GilmerBold.woff2) format('woff2'), url(https://codologi.in/fonts/GilmerBold.woff) format('woff');
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: 'Gilmer';
    src: url(https://codologi.in/fonts/GilmerRegular.woff2) format('woff2'), url(https://codologi.in/fonts/GilmerRegular.woff) format('woff');
    font-weight: 400;
    font-style: normal
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 800
}

*,
body,
html,
p {
    font-weight: 300
}

@font-face {
    font-family: Flaticon;
    font-display: fallback;
    src: url(https://codologi.in/fonts/Flaticon.eot);
    src: url(https://codologi.in/fonts/Flaticon.eot?#iefix) format("embedded-opentype"), url(https://codologi.in/fonts/Flaticon.woff) format("woff"), url(https://codologi.in/fonts/Flaticon.ttf) format("truetype"), url(https://codologi.in/fonts/Flaticon.svg#Flaticon) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Flaticon;
    font-display: fallback;
    src: url(https://codologi.in/fonts/Flaticon.svg#Flaticon) format("svg")
}

[class*=" nsf-"]:after,
[class*=" nsf-"]:before,
[class^=nsf-]:after,
[class^=nsf-]:before {
    font-family: Flaticon;
    line-height: 0;
    font-style: normal!important
}

*,
body,
html {
    /*font-family: Gilmer*/
    font-family: sans-serif
}

.nsf-www:before {
    content: "\f100"
}

.nsf-smartphone:before {
    content: "\f101"
}

.nsf-software:before {
    content: "\f102"
}

.nsf-siren:before {
    content: "\f103"
}

.nsf-paint-palette:before {
    content: "\f104"
}

.nsf-joystick:before {
    content: "\f105"
}

.nsf-digital-marketing:before,
.select-block.focus .active-list:after {
    content: "\f106"
}

.nsf-checklist:before,
.select-block .active-list:after {
    content: "\f107"
}

.nsf-jigsaw:before {
    content: "\f108"
}

.nsf-diamond:before {
    content: "\f109"
}

.nsf-mobile-shopping:before {
    content: "\f10a"
}

.nsf-elearning:before {
    content: "\f10b"
}

.nsf-calendar:before {
    content: "\f10c"
}

.nsf-team:before {
    content: "\f10d"
}

.nsf-fork:before {
    content: "\f10e"
}

.nsf-darts:before {
    content: "\f10f"
}

.nsf-woman:before {
    content: "\f110"
}

.nsf-hospital:before {
    content: "\f111"
}

.nsf-job:before {
    content: "\f112"
}

.nsf-auction:before {
    content: "\f113"
}

.nsf-exercise:before {
    content: "\f114"
}

.nsf-track:before {
    content: "\f115"
}

.nsf-truck:before {
    content: "\f116"
}

.nsf-factory:before {
    content: "\f117"
}

.nsf-market-place:before {
    content: "\f118"
}

.nsf-shopping-bag:before {
    content: "\f119"
}

.nsf-watching-tv:before {
    content: "\f11a"
}

.nsf-smartphone-1:before {
    content: "\f11b"
}

.nsf-inventory:before {
    content: "\f11c"
}

.nsf-channel:before {
    content: "\f11d"
}

.nsf-newspaper:before {
    content: "\f11e"
}

.nsf-donation:before {
    content: "\f11f"
}

.nsf-pipe:before {
    content: "\f120"
}

.nsf-solution:before {
    content: "\f121"
}

.nsf-old-video-camera-outline-symbol:before {
    content: "\f122"
}

.nsf-shop:before {
    content: "\f123"
}

.nsf-house:before {
    content: "\f124"
}

.nsf-shopping-bag-1:before {
    content: "\f125"
}

.nsf-school:before {
    content: "\f126"
}

.nsf-network:before {
    content: "\f127"
}

.nsf-football:before {
    content: "\f128"
}

.nsf-phone-call:before {
    content: "\f129"
}

.nsf-notification:before {
    content: "\f12a"
}

.nsf-shipped:before {
    content: "\f12b"
}

.nsf-ecommerce:before {
    content: "\f12c"
}

.nsf-internet:before {
    content: "\f12d"
}

.nsf-rocket-ship:before {
    content: "\f12e"
}

.nsf-investment-insurance:before {
    content: "\f12f"
}

.nsf-makeup:before {
    content: "\f130"
}

.nsf-relationship:before {
    content: "\f131"
}

.nsf-care-about-environment:before {
    content: "\f132"
}

.nsf-execution:before {
    content: "\f133"
}

.nsf-modal-list:before {
    content: "\f134"
}

.nsf-creativity:before {
    content: "\f135"
}

.nsf-handshake:before {
    content: "\f136"
}

.nsf-promotion:before {
    content: "\f137"
}

.nsf-contact:before {
    content: "\f138"
}

.nsf-group:before {
    content: "\f139"
}

.nsf-conversation:before {
    content: "\f13a"
}

.nsf-qa:before {
    content: "\f13b"
}

.nsf-review:before {
    content: "\f13c"
}

.nsf-respect:before {
    content: "\f13d"
}

.nsf-insurance:before {
    content: "\f13e"
}

.nsf-buildings-near-the-sea-made-of-various-shapes:before {
    content: "\f13f"
}

.nsf-brokerage:before {
    content: "\f140"
}

.nsf-conversation-1:before {
    content: "\f141"
}

.nsf-shield:before {
    content: "\f142"
}

.nsf-research:before {
    content: "\f143"
}

.nsf-blogging:before {
    content: "\f144"
}

.nsf-document:before {
    content: "\f145"
}

.nsf-settings:before {
    content: "\f146"
}

.nsf-transparency:before {
    content: "\f147"
}

.nsf-help:before {
    content: "\f148"
}

.nsf-www-1:before {
    content: "\f149"
}

.nsf-support:before {
    content: "\f14a"
}

.nsf-online-shop:before {
    content: "\f14b"
}

.nsf-strategy:before {
    content: "\f14c"
}

.nsf-cogwheel:before {
    content: "\f14d"
}

.nsf-internet-1:before {
    content: "\f14e"
}

.nsf-worldwide:before {
    content: "\f14f"
}

.nsf-web-settings:before {
    content: "\f150"
}

.nsf-lens:before {
    content: "\f151"
}

.nsf-browser:before {
    content: "\f152"
}

.nsf-facebook:before {
    content: "\f153"
}

.nsf-twitter:before {
    content: "\f154"
}

.nsf-youtube:before {
    content: "\f155"
}

.nsf-linkedin:before {
    content: "\f156"
}

.nsf-pinterest:before {
    content: "\f157"
}

.nsf-google-plus:before {
    content: "\f158"
}

.nsf-support-1:before {
    content: "\f159"
}

.nsf-mysql:before {
    content: "\f15a"
}

.nsf-programming:before {
    content: "\f15b"
}

.nsf-php:before {
    content: "\f15c"
}

.nsf-php-1:before {
    content: "\f15d"
}

.nsf-support-2:before {
    content: "\f15e"
}

.nsf-question:before {
    content: "\f15f"
}

.nsf-conversation-2:before {
    content: "\f160"
}

.nsf-meeting:before {
    content: "\f161"
}

.nsf-nsf:before,
.nsf-icons:before {
    content: "\f162"
}

.nsf-close:before {
    content: "\f163"
}

.nsf-cancel-music:before {
    content: "\f164"
}

.nsf-error:before {
    content: "\f165"
}

.nsf-tick:before {
    content: "\f166"
}

body {
    margin: 0;
    font-size: 16px
}

.navbar-default {
    background-color: rgba(16, 7, 78, .81);
    height: auto;
    border-bottom: 0;
    width: 100%;
    margin-bottom: 0;
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder {
    opacity: 0
}

input:focus:-moz-placeholder,
textarea:focus:-moz-placeholder {
    opacity: 0;
    color: red
}

input:focus::-moz-placeholder,
textarea:focus::-moz-placeholder {
    opacity: 0
}

input:focus:-ms-input-placeholder,
textarea:focus:-ms-input-placeholder {
    opacity: 0
}

p {
    line-height: 1.8;
    color: #333;
    font-size: 17px
}

.navbar-brand>img {
    width: 130px;
    padding: 0
}

.slibg-ban {
    background: url(https://codologi.in/images/ban_bg-3.jpg) no-repeat;
    background-size: cover
}

#hbanner {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

a.contactbtnt {
    top: 17px;
    right: 115px;
    padding: 8px 20px 6px;
    font-weight: 700;
    font-size: 12px;
    border-radius: 40px;
    text-transform: uppercase;
    border: 2px solid #fff;
    color: #333;
    background: #fff
}

/*.homebox h3,
.nav.headermenu>li>a,
.servicewrap h2 {
    text-transform: capitalize
}*/

.navbar-right {
    margin-right: 260px
}

.nav.headermenu>li>a {
    padding: 0 14px;
    font-size: 14px;
    color: #fff;
    line-height: 40px!important;
    -webkit-transition: all .2s linear;
    transition: all .2s linear;
    margin-top: 18px
}

.banbtnrw .btn-primary.letsbtn,
.nav.headermenu>li>a>span.tooltips {
    -moz-transition: all .2s linear;
    -o-transition: all .2s linear;
    -ms-transition: all .2s linear
}

.nav.headermenu>li>a>.fa {
    position: relative;
    top: 3px;
    left: 6px;
    font-size: 13px;
    color: #fff
}

.nav.headermenu>li>a>span.tooltips {
    position: absolute;
    width: 16px;
    height: 15px;
    left: 50%;
    bottom: -6px;
    margin-left: -12px;
    background: url(https://codologi.in/images/menu-tooltip.png) no-repeat;
    background-size: 100%;
    opacity: 0;
    z-index: 99;
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.nav.headermenu>li:hover>a,
.navbar-default .navbar-nav.headermenu>.open>a,
.navbar-default .navbar-nav.headermenu>.open>a:focus,
.navbar-default .navbar-nav.headermenu>.open>a:hover {
    background: #6864ae;
    color: #fff
}

.nav.headermenu>li.dropdown:hover>a>span.tooltips,
.nav.headermenu>li.open>a>span.tooltips {
    opacity: 1
}

.nav li.right-sub-menu>a:after {
    content: "\f105";
    font-family: FontAwesome;
    position: absolute;
    right: 20px
}

#developer-hire .dev-title h1,
.form-control,
form {
    font-family: Gilmer
}

.nav.headermenu>li:hover>a {
    z-index: 9
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
    color: #fff
}

.mob-hand {
    position: absolute;
    width: 430px;
    height: 603px;
    right: 50px;
    bottom: 0;
    background: url(https://codologi.in/images/mob_hand.png) no-repeat;
    background-size: 430px 603px;
    display: block;
    z-index: 999
}

.mob-hand .mob-inner-slide {
    position: absolute;
    left: 73px;
    top: 61px;
    width: 216px;
    height: 383px
}

.owl-theme.tban .owl-nav .owl-next,
.owl-theme.tban .owl-nav .owl-prev {
    width: 20px;
    height: 38px;
    margin-top: -19px;
    display: block;
    position: absolute;
    top: 50%;
    text-indent: -9999px
}

.owl-theme.tban .owl-nav .owl-prev {
    left: 30px;
    background: url(https://codologi.in/images/sl_arrow.png) no-repeat;
    background-size: 40px 38px
}

.owl-theme.tban .owl-nav .owl-next {
    right: 30px;
    background: url(https://codologi.in/images/sl_arrow.png) -20px 0 no-repeat;
    background-size: 40px 38px
}

.bantxtbx {
    position: absolute;
    width: 60%;
    top: 50%;
    left: 8%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.homebox,
.ripenerswrap {
    position: relative
}

.bantxtbx .titleappheading {
    font-weight: 400;
    font-size: 44px;
    line-height: 72px;
    color: #fff;
    text-align: left
}

.bantxtbx .titleappheading span {
    font-size: 60px;
    color: #ffff54;
    display: inline-block
}

.bantxtbx .titleappheading span.firstsl {
    color: #f8904f
}

.bantxtbx .titleappheading span.secsl {
    color: #2594f0
}

.bantxtbx .titleappheading span.thirdsl {
    color: #15c8b2
}

.bantxtbx .titleappheading span.fourthsl {
    color: #eb4154
}

.banbtnrw {
    margin: 40px auto 0
}

.banbtnrw a {
    display: block
}

.nopadding {
    padding: 0!important
}

.banbtnrw .btn-primary.letsbtn {
    font-weight: 400;
    background-color: transparent;
    padding: 8px 30px;
    font-size: 20px;
    border: 3px solid #fff;
    border-radius: 8px;
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.banbtnrw .btn-primary.letsbtn:hover {
    background-color: #fff;
    color: #00208a
}

.nomore {
    display: table;
    margin: 0 auto
}

.nomore a {
    display: block
}

.nomore .btn-primary.nmore {
    font-weight: 400;
    background-color: transparent;
    padding: 9px 20px!important;
    font-size: 14px!important;
    border: 2px solid #00208a;
    color: #00208a;
    border-radius: 2px;
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.homebox,
section .aboutrip {
    -webkit-transition: all .5s;
    transition: all .5s
}

.nomore .btn-primary.nmore:hover {
    background-color: #00208a;
    color: #fff
}

.nomore .glyphicon {
    top: 0;
    font-size: 10px
}

.banbtnrw .glyphicon {
    top: 2px;
    left: 10px;
    font-size: 16px
}

.ripenerswrap h2 {
    font-size: 30px;
    color: #00208a;
    margin: 0;
    padding: 10px 0;
    text-align: center
}

.ripenerswrap .normal_txt {
    font-weight: 300;
    color: #333;
    font-size: 18px;
    line-height: 28px;
    max-width: 900px;
    margin: auto
}

.active,
.carousel,
.item {
    height: 100%
}

.carousel-inner {
    height: 100%;
    background: #000
}

.carousel-caption {
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 80%;
    text-shadow: none;
    bottom: 0;
    right: 0;
    height: 100vh;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    text-align: left;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    -o-background-size: cover;
    opacity: .2
}

.homebox,
.homebox a.expand {
    background: #fff;
    cursor: pointer
}

.animated {
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s
}

@-webkit-keyframes fadeInRight {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100px, 0, 0);
        transform: translate3d(100px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100px, 0, 0);
        transform: translate3d(100px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.homebox a.expand span.minus,
.homebox ul.hidden1,
.homebox.selected .addon {
    opacity: 0
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}

.homebox {
    width: 100%;
    margin: 40px 0 20px;
    padding: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    float: left;
    -webkit-box-shadow: 0 4px 3px #d7d7d7;
    box-shadow: 0 4px 3px #d7d7d7;
    border-radius: 20px
}

.homebox:hover {
    -webkit-box-shadow: 0 4px 20px #ababab;
    box-shadow: 0 4px 20px #ababab
}

.homebox .icon-cont {
    border: 2px solid #077af4;
    border-radius: 50%;
    width: 95px;
    height: 95px;
    margin: 20px auto;
    display: block;
    text-align: center;
    -webkit-transition: all .5s;
    transition: all .5s;
    position: absolute;
    top: 10px;
    left: 0;
    right: 0;
    z-index: 5;
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .5), 0 0 0 0 rgba(3, 108, 129, .5);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, .5), 0 0 0 0 rgba(3, 108, 129, .5)
}

.homebox .icon-cont i {
    color: #077af4;
    font-size: 2.5em;
    line-height: 88px;
    position: absolute;
    left: 0;
    right: 0;
    top: 0
}

.homebox:hover .icon-cont {
    -webkit-animation: shady 4s linear infinite;
    animation: shady 4s linear infinite
}

@-webkit-keyframes shady {
    0%,
    20.1%,
    50% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .5), 0 0 0 0 rgba(3, 108, 129, .5);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, .5), 0 0 0 0 rgba(3, 108, 129, .5)
    }
    20%,
    70% {
        -webkit-box-shadow: 0 0 0 100px rgba(255, 255, 255, 0), 0 0 0 0 rgba(3, 108, 129, 0);
        box-shadow: 0 0 0 100px rgba(255, 255, 255, 0), 0 0 0 0 rgba(3, 108, 129, 0)
    }
    100%,
    70.1% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .5), 0 0 0 0 rgba(3, 108, 129, .5);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, .5), 0 0 0 0 rgba(3, 108, 129, .5)
    }
}

@keyframes shady {
    0%,
    20.1%,
    50% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .5), 0 0 0 0 rgba(3, 108, 129, .5);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, .5), 0 0 0 0 rgba(3, 108, 129, .5)
    }
    20%,
    70% {
        -webkit-box-shadow: 0 0 0 100px rgba(255, 255, 255, 0), 0 0 0 0 rgba(3, 108, 129, 0);
        box-shadow: 0 0 0 100px rgba(255, 255, 255, 0), 0 0 0 0 rgba(3, 108, 129, 0)
    }
    100%,
    70.1% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .5), 0 0 0 0 rgba(3, 108, 129, .5);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, .5), 0 0 0 0 rgba(3, 108, 129, .5)
    }
}

.homebox .addon {
    -webkit-transition: .4s;
    transition: .4s;
    font-size: 1.4rem;
    color: #4d4d4d;
    letter-spacing: 0;
    margin-top: 10px
}

.homebox a.expand,
.homebox h3,
.homebox.selected a.expand,
.homebox.selected a.expand span {
    -webkit-transition: all .5s;
    transition: all .5s;
    position: absolute
}

.homebox.selected {
    overflow: hidden
}

.homebox h3 {
    color: #333;
    font-weight: 700;
    font-size: 24px;
    text-align: center;
    letter-spacing: 1px;
    padding: 35px 15px;
    border-bottom: 1px solid rgba(255, 255, 255, 0);
    top: 30%;
    width: 100%;
    left: 0;
    z-index: 4
}

.homebox ul {
    font-weight: 300;
    color: #000;
    line-height: 31px;
    cursor: pointer;
    text-align: left;
    font-size: 16px;
    padding-left: 50px
}

.homebox a.expand {
    width: 45px;
    height: 45px;
    font-weight: 700;
    color: #0328d2;
    display: block;
    margin: 15px auto 5px;
    line-height: 45px;
    left: 0;
    right: 0;
    bottom: -21px;
    border-radius: 50%;
    text-align: center;
    -webkit-box-shadow: 0 2px 0 1px #ccc;
    box-shadow: 0 2px 0 1px #ccc
}

.homebox a.expand span.plus {
    opacity: 1;
    padding-left: 5px
}

.homebox a.expand span {
    font-weight: 700
}

.homebox.selected a.expand {
    display: block;
    right: 0;
    bottom: -19px;
    width: 90px;
    height: 60px;
    background: #077af4;
    color: #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    border-radius: 200px;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    float: right;
    left: 80%
}

.homebox.selected a.expand span {
    display: block;
    top: -4px;
    left: 38px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    font-size: 24px
}

.btn-social-icon,
.hover01 figure .img_scale_bx {
    -moz-transition: all .2s linear;
    -o-transition: all .2s linear;
    -ms-transition: all .2s linear
}

.homebox.selected a.expand span.minus {
    opacity: 1
}

.homebox.selected a.expand span.plus {
    opacity: 0
}

.homebox.selected .icon-cont {
    -webkit-transform: scale(1.5, 1.5);
    transform: scale(1.5, 1.5);
    opacity: .1;
    position: absolute;
    top: -20px;
    left: -5px;
    right: 180px
}

.conblrow .phonebx i.skype-icon-mob,
.hcontactwrap,
.servicewrap,
.social {
    position: relative
}

.homebox.selected:hover .icon-cont {
    -webkit-animation: none;
    animation: none
}

.homebox.selected h3 {
    padding: 10px;
    width: 70%;
    top: 16px;
    left: 10%
}

.homebox.selected ul.hidden1 {
    opacity: 1;
    margin-top: 95px
}

.servicewrap h2 {
    font-size: 30px;
    margin: 0;
    padding: 10px 0;
    text-align: center
}

.servicesbg {
    background: #f9fafc;
    /*padding: 60px 0!important*/
}

.servicewrap .normal_txt {
    font-weight: 300;
    color: #fff;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    max-width: 900px;
    margin: auto
}

.service_line {
    width: 297px;
    height: 37px;
    margin: 20px auto;
    background: url(https://codologi.in/images/line_design.png) no-repeat;
    background-size: 100% 100%;
    display: block
}

.hcontactwrap .conblrow {
    background-color: #000
}

.hcontactwrap .fcontxtbx {
    background-color: #6864ad;
    padding: 20px 0;
    text-align: center
}

.hcontactwrap .fcontxtbx .txtCon {
    color: #fff;
    font-size: 22px;
    display: inline-block;
    text-transform: uppercase
}

.conblrow .phonebx {
    padding: 10px 0;
    text-align: center;
    line-height: 24px
}

.conblrow .phonebx .ph {
    color: #fff;
    display: inline-block;
    vertical-align: top
}

.conblrow .phonebx .ph .fa {
    font-size: 24px;
    color: #96d942;
    margin-right: 8px
}

.conblrow .phonebx .ph i.skype-icon {
    position: relative;
    width: 21px;
    height: 21px;
    top: 2px;
    background: url(https://codologi.in/images/skype-icon.png) no-repeat;
    background-size: 100% 100%;
    display: inline-block;
    margin-right: 10px
}

.conblrow .phonebx i.skype-icon-mob {
    width: 16px;
    height: 16px;
    top: 2px;
    background: url(https://codologi.in/images/skype-icon.png) no-repeat;
    background-size: 100% 100%;
    display: none;
    margin-right: 6px
}

.conblrow .phonebx i.skype-icon-mob.margin {
    margin-left: 20px
}

.conblrow .phonebx .ph .fa.skype {
    color: #01a8e6
}

.conblrow .phonebx .ph span {
    font-weight: 300;
    font-size: 20px;
    display: inline-block
}

.conblrow .phonebx .numbx {
    color: #7f7ac3;
    font-size: 20px;
    margin-left: 10px;
    display: inline-block;
    text-align: left
}

.conblrow .phonebx .numbx a {
    color: #7f7ac3
}

.nav.footermenu>li>a {
    padding: 8px 12px;
    color: #fff;
    font-size: 13px;
    display: inline-block
}

.nav.footermenu>li:first-child>a {
    padding-left: 0
}

.nav.footermenu>li>span {
    display: inline-block
}

.nav.footermenu>li>a:focus,
.nav.footermenu>li>a:hover {
    background-color: transparent
}

.footmenubx .ratedtxt {
    font-size: 13px;
    text-align: right
}

.social {
    height: 50px;
    padding: 0 10px;
    display: table;
    float: right;
    margin-top: 20px;
    overflow: hidden
}

.social span.bt-line {
    position: absolute;
    left: 0;
    bottom: 7px;
    width: 100%;
    height: 4px;
    z-index: 1
}

.social span.bt-line img {
    width: 100%;
    height: auto
}

.btn-social-icon {
    position: relative;
    width: 50px;
    height: 50px;
    top: 12px;
    background-color: #6864ad;
    border-radius: 50%;
    margin: 0 5px;
    border: 0;
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.btn-social-icon>:first-child {
    font-size: 18px;
    line-height: 50px;
    border: 0
}

.btn-social-icon:hover {
    top: 0
}

.section.testibg {
    background: url(https://codologi.in/images/testi-mon-bg.png) no-repeat #00208a;
    background-size: cover
}

#testimonials {
    width: 60%
}

.testimonialswrap {
    padding: 50px
}

.testibxCon h2 {
    position: relative;
    font-size: 36px;
    color: #fff;
    margin: 0;
    padding: 0 0 0 30px;
    text-transform: uppercase
}

.testibxCon .test_txt {
    font-weight: 300;
    width: 70%;
    color: #fff;
    font-size: 20px;
    padding: 30px 0 30px 30px;
    line-height: 24px
}

.testibxCon h2 .leftline {
    position: absolute;
    top: 0;
    left: 0;
    height: 90%
}

.testibxCon h2 .leftline .linewd5 {
    position: absolute;
    top: 0;
    left: 0;
    width: 5px;
    height: 100%;
    background-color: #fff
}

.testibxCon h2 .leftline .linewd2 {
    position: absolute;
    top: 0;
    left: 9px;
    width: 2px;
    height: 100%;
    background-color: #fff
}

.clientsays {
    padding: 30px 0
}

.clientsays .clientrow {
    margin-bottom: 20px;
    padding: 0 15px
}

.clientsays .clientrow .clientpic {
    float: left;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    padding: 7px;
    background: #6864ad
}

.clientsays .clientrow .clientpic .picbx {
    position: relative;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    overflow: hidden
}

.clientsays .clientrow .clientpic .picbx img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%)
}

.clientsays .clientrow .clsaystext {
    margin-left: 130px;
    padding-top: 10px
}

.clientsays .clientrow .clsaystext h3 {
    position: relative;
    font-size: 18px;
    color: #fff;
    margin: 0;
    padding: 0 0 10px
}

.clientsays .clientrow .clsaystext h4 {
    font-weight: 400;
    font-size: 18px;
    color: #fff;
    margin: 0;
    padding: 0
}

.clientsays .client-say-text {
    color: #fff;
    font-size: 18px;
    padding: 0 15px
}

.owl-carousel.testi .owl-dot {
    background-color: #8883af;
    width: 22px;
    height: 6px;
    display: inline-block;
    margin-right: 10px
}

.owl-carousel.testi .owl-dot.active {
    background-color: #fff
}

.eqWrap {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex
}

.equalHMWrap {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.test-video {
    position: absolute;
    width: 85%;
    height: 370px;
    outline: rgba(171, 170, 170, .71) solid 3px;
    outline-offset: -4px;
    left: 45%;
    top: 50%;
    background-color: #000;
    transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%)
}

.test-video span.icon {
    position: absolute;
    width: 60px;
    height: 60px;
    left: 50%;
    top: 50%;
    background: url(https://codologi.in/images/video-icon.png) top right no-repeat;
    background-size: 100% 100%;
    transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    cursor: pointer;
    z-index: 2
}

.test-video img,
.test-video span.vdbg {
    width: 100%;
    height: 100%
}

.test-video span.vdbg {
    position: absolute;
    right: 0;
    top: 0;
    background: url(https://codologi.in/images/video-bg.png) top right no-repeat;
    background-size: auto 100%;
    z-index: 1
}

.section.workprocess-bg {
    background: url(https://codologi.in/images/our_works_banner.jpg) no-repeat;
    background-size: cover;
    position: relative
}

.section.workprocess-bg:before {
    background: #101f2f;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    opacity: .9
}

.processboxwd .stepbx .step.st1,
.processboxwd .stepbx .step.st1 .innerbx {
    background-color: #077af4
}

.section.workprocess-bg .fp-tableCell {
    position: relative;
    z-index: 99
}

.workprocesswrap {
    padding: 30px 50px;
    position: relative
}

.workprocesswrap h2 {
    font-weight: 700;
    font-size: 30px;
    color: #fff;
    margin: 0;
    padding: 10px 0;
    text-align: center;
    text-transform: capitalize
}

.workprocesswrap .pro_txt {
    font-weight: 300;
    color: #fff;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    max-width: 900px;
    margin: auto
}

.workprocesswrap .minhewrap {
    position: relative;
    top: 20px
}

.workprocesswrap .processboxwd {
    display: table;
    margin: 190px auto auto;
    height: 340px;
    vertical-align: middle
}

.processboxwd .stepbx {
    width: 140px;
    display: inline-block;
    cursor: pointer;
    margin: 0 12px
}

.processboxwd .stepbx .step {
    position: relative;
    height: 140px;
    padding: 15px;
    border-radius: 50%;
    -webkit-transition: all .3s linear;
    transition: all .3s linear
}

.processboxwd .stepbx:hover .step {
    transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1)
}

.processboxwd .stepbx .step .innerbx {
    width: 110px;
    height: 110px;
    padding: 10px;
    border-radius: 50%;
    -webkit-transition: all .3s linear;
    transition: all .3s linear
}

.processboxwd .stepbx:hover .step.st1 .innerbx {
    background-color: #fff
}

.processboxwd .stepbx .step.st2,
.processboxwd .stepbx .step.st2 .innerbx {
    background-color: #077af4
}

.processboxwd .stepbx:hover .step.st2 .innerbx {
    background-color: #fff
}

.processboxwd .stepbx .step.st3,
.processboxwd .stepbx .step.st3 .innerbx {
    background-color: #077af4
}

.processboxwd .stepbx:hover .step.st3 .innerbx {
    background-color: #fff
}

.processboxwd .stepbx .step.st4,
.processboxwd .stepbx .step.st4 .innerbx {
    background-color: #077af4
}

.processboxwd .stepbx:hover .step.st4 .innerbx {
    background-color: #fff
}

.processboxwd .stepbx .step.st5,
.processboxwd .stepbx .step.st5 .innerbx {
    background-color: #077af4
}

.processboxwd .stepbx:hover .step.st5 .innerbx {
    background-color: #fff
}

.processboxwd .stepbx .step.st6,
.processboxwd .stepbx .step.st6 .innerbx {
    background-color: #077af4
}

.processboxwd .stepbx:hover .step.st6 .innerbx {
    background-color: #fff
}

.main-box {
    position: relative;
    width: 90px;
    height: 90px;
    border-radius: 50%
}

.main-box .iconbx {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-color: transparent!important;
    z-index: 1;
    -webkit-transition: all .15s linear;
    transition: all .15s linear
}

.processboxwd .stepbx .step.st1 .innerbx .main-box,
.processboxwd .stepbx .step.st2 .innerbx .main-box,
.processboxwd .stepbx .step.st3 .innerbx .main-box,
.processboxwd .stepbx .step.st4 .innerbx .main-box,
.processboxwd .stepbx .step.st5 .innerbx .main-box,
.processboxwd .stepbx .step.st6 .innerbx .main-box {
    background: url(https://codologi.in/images/bx-bg.png) no-repeat #077af4;
    background-size: cover;
    display: block
}

.processboxwd .stepbx .step.st2 .innerbx .main-box .iconbx,
.processboxwd .stepbx .step.st3 .innerbx .main-box .iconbx,
.processboxwd .stepbx .step.st4 .innerbx .main-box .iconbx,
.processboxwd .stepbx .step.st5 .innerbx .main-box .iconbx,
.processboxwd .stepbx .step.st6 .innerbx .main-box .iconbx,
.processboxwd .stepbx:hover .step.st1 .innerbx .main-box .iconbx,
.processboxwd .stepbx:hover .step.st2 .innerbx .main-box .iconbx {
    background-color: #077af4
}

.main-box .iconbx span {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 70px;
    height: 70px;
    margin: -35px 0 0 -35px;
    background: url(https://codologi.in/images/process-icons.png) no-repeat;
    background-size: 140px 420px;
    display: block
}

.main-box .iconbx span.dab {
    background-position: 0 0
}

.processboxwd .stepbx:hover .main-box .iconbx span.dab {
    background-position: -70px 0
}

.processboxwd .stepbx:hover .iconbx {
    background: #0070e6!important
}

.main-box .iconbx span.sap {
    background-position: 0 -70px
}

.processboxwd .stepbx:hover .main-box .iconbx span.sap {
    background-position: -70px -70px
}

.main-box .iconbx span.uiux {
    background-position: 0 -140px
}

.processboxwd .stepbx:hover .main-box .iconbx span.uiux {
    background-position: -70px -140px
}

.main-box .iconbx span.imple {
    background-position: 0 -210px
}

.processboxwd .stepbx:hover .main-box .iconbx span.imple {
    background-position: -70px -210px
}

.main-box .iconbx span.testing {
    background-position: 0 -280px
}

.processboxwd .stepbx:hover .main-box .iconbx span.testing {
    background-position: -70px -280px
}

.main-box .iconbx span.launch {
    background-position: 0 -350px
}

.processboxwd .stepbx:hover .main-box .iconbx span.launch {
    background-position: -70px -350px
}

.processboxwd .stepbx:hover .main-box .iconbx {
    top: 20px
}

.processboxwd .stepbx:hover .step.st2 .innerbx .main-box .iconbx,
.processboxwd .stepbx:hover .step.st4 .innerbx .main-box .iconbx,
.processboxwd .stepbx:hover .step.st6 .innerbx .main-box .iconbx {
    top: -20px
}

.dropstepline {
    position: absolute;
    width: 8px;
    height: 60px;
    top: 100%;
    left: 50%;
    margin-left: -4px
}

.dropstepline .stepwrtxt {
    position: absolute;
    width: 70px;
    top: 10px;
    color: #fff!important;
    right: -10px;
    font-size: 18px;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    display: none
}

.processboxwd .stepbx .step.st1 .dropstepline .stepwrtxt {
    color: #44649f
}

.processboxwd .stepbx:hover .step.st1 .dropstepline .stepwrtxt {
    color: #fff
}

.processboxwd .stepbx .step.st2 .dropstepline .stepwrtxt {
    color: #3c9174;
    right: auto;
    left: -10px;
    top: 7px;
    display: none
}

.processboxwd .stepbx:hover .step.st2 .dropstepline .stepwrtxt {
    color: #57dba9
}

.processboxwd .stepbx .step.st3 .dropstepline .stepwrtxt {
    color: #8a499c
}

.processboxwd .stepbx:hover .step.st3 .dropstepline .stepwrtxt {
    color: #d16ae7
}

.processboxwd .stepbx .step.st4 .dropstepline .stepwrtxt {
    color: #9b6946;
    right: auto;
    left: -10px;
    top: 7px
}

.processboxwd .stepbx:hover .step.st4 .dropstepline .stepwrtxt {
    color: #ec9e5c
}

.processboxwd .stepbx .step.st5 .dropstepline .stepwrtxt {
    color: #9a4449
}

.processboxwd .stepbx:hover .step.st5 .dropstepline .stepwrtxt {
    color: #eb6464
}

.processboxwd .stepbx .step.st6 .dropstepline .stepwrtxt {
    color: #348f91;
    right: auto;
    left: -10px;
    top: 7px
}

.processboxwd .stepbx:hover .step.st6 .dropstepline .stepwrtxt {
    color: #4bd9d7
}

.processboxwd .stepbx .step.st2 .dropstepline,
.processboxwd .stepbx .step.st4 .dropstepline,
.processboxwd .stepbx .step.st6 .dropstepline {
    top: -60px
}

.dropstepline span.circled {
    position: absolute;
    top: 99%;
    left: 50%;
    width: 30px;
    height: 30px;
    margin-left: -15px;
    background-color: #fff;
    border-radius: 50%
}

.processboxwd .stepbx .step.st2 .dropstepline span.circled,
.processboxwd .stepbx .step.st4 .dropstepline span.circled,
.processboxwd .stepbx .step.st6 .dropstepline span.circled {
    top: -30px
}

.processboxwd .stepbx .step.st2 .dropstepline span.circled,
.processboxwd .stepbx .step.st3 .dropstepline span.circled,
.processboxwd .stepbx .step.st4 .dropstepline span.circled,
.processboxwd .stepbx .step.st5 .dropstepline span.circled,
.processboxwd .stepbx .step.st6 .dropstepline span.circled {
    background-color: #fff
}

.dropstepline span.circled span.pointc {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12px;
    height: 12px;
    margin: -6px 0 0 -6px;
    background-color: #077af4;
    border-radius: 50%
}

.processboxwd .stepbx .step.st1 .dropstepline,
.processboxwd .stepbx .step.st2 .dropstepline,
.processboxwd .stepbx .step.st3 .dropstepline,
.processboxwd .stepbx .step.st4 .dropstepline,
.processboxwd .stepbx .step.st5 .dropstepline,
.processboxwd .stepbx .step.st6 .dropstepline {
    background-color: #077af4
}

.process-txt-box {
    position: absolute;
    left: 50%;
    width: 300px;
    margin-left: -150px;
    margin-top: 10px
}

.processboxwd .stepbx .step.st1 .dropstepline .process-txt-box,
.processboxwd .stepbx .step.st3 .dropstepline .process-txt-box,
.processboxwd .stepbx .step.st5 .dropstepline .process-txt-box {
    top: 115px
}

.processboxwd .stepbx .step.st2 .dropstepline .process-txt-box,
.processboxwd .stepbx .step.st4 .dropstepline .process-txt-box,
.processboxwd .stepbx .step.st6 .dropstepline .process-txt-box {
    top: -100px
}

.process-txt-box h3 {
    font-weight: 700;
    font-size: 18px;
    margin: 0;
    padding: 0;
    color: #fff!important;
    text-align: center
}

.processboxwd .stepbx .step.st1 .process-txt-box h3 {
    color: #44649f
}

.processboxwd .stepbx .step.st2 .process-txt-box h3,
.processboxwd .stepbx .step.st3 .process-txt-box h3,
.processboxwd .stepbx .step.st4 .process-txt-box h3,
.processboxwd .stepbx .step.st5 .process-txt-box h3,
.processboxwd .stepbx .step.st6 .process-txt-box h3,
.processboxwd .stepbx:hover .step.st1 .process-txt-box h3,
.processboxwd .stepbx:hover .step.st2 .process-txt-box h3,
.processboxwd .stepbx:hover .step.st3 .process-txt-box h3,
.processboxwd .stepbx:hover .step.st4 .process-txt-box h3,
.processboxwd .stepbx:hover .step.st5 .process-txt-box h3,
.processboxwd .stepbx:hover .step.st6 .process-txt-box h3 {
    color: #fff
}

.process-txt-box h5 {
    font-weight: 300;
    font-size: 16px;
    color: #a7a8ab;
    margin: 0;
    padding-top: 0;
    text-align: center;
    display: none
}

.processboxwd .stepbx:hover .process-txt-box h5 {
    color: #fff
}

#appban {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block
}

.appsectionwrap {
    position: absolute;
    width: 66%;
    left: 50%;
    top: 40%;
    transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%)
}

.appsectionwrap .left-mobile-sh {
    float: left;
    width: 300px;
    height: 504px;
    background: url(https://codologi.in/images/mid_sl_mbile_bg.png) no-repeat;
    background-size: 100% 100%;
    display: block
}

.appsectionwrap .appContent {
    margin-left: 330px
}

.appsectionwrap .appContent .appbxwr {
    margin-top: 50px
}

.appsectionwrap .appContent h2 {
    font-size: 40px;
    color: #000;
    margin: 0;
    padding: 30px 0;
    text-transform: capitalize;
    font-weight: 800
}

.brandslogobx,
.brandswrap h2 {
    padding: 10px 0
}

.locationbox h3,
.slide-item h3,
.whychooseusbox h2 {
    text-transform: uppercase
}

.appsectionwrap .appContent .app_txt {
    font-weight: 300;
    color: #333;
    font-size: 18px
}

.appsectionwrap .appContent .approw {
    margin-top: 30px
}

.appsectionwrap .appContent .approw a.appstore {
    width: 190px;
    height: 58px;
    background: url(https://codologi.in/images/app-store.png) no-repeat;
    background-size: 100% 100%;
    text-indent: -9999px;
    margin-right: 16px;
    display: inline-block
}

.appsectionwrap .appContent .approw a.appstore:hover {
    background: url(https://codologi.in/images/app-store_hover.png) no-repeat;
    background-size: 100% 100%
}

.appsectionwrap .appContent .approw a.appstore.playstore {
    background: url(https://codologi.in/images/play-store.png) no-repeat;
    background-size: 100% 100%
}

.appsectionwrap .appContent .approw a.appstore.playstore:hover {
    background: url(https://codologi.in/images/play-store_hover.png) no-repeat;
    background-size: 100% 100%
}

.brandswrap {
    position: relative
}

.brandswrap h2 {
    font-size: 30px;
    color: #fff;
    margin: 0;
    text-align: center
}

.brandslogobx ul {
    display: table;
    margin: auto;
    padding: 0
}

.brandslogobx ul li {
    padding: 30px;
    display: inline-block;
    list-style: none;
    text-align: center;
    -webkit-transition: all .3s linear;
    transition: all .3s linear
}

.brandslogobx ul li span {
    width: 160px;
    height: 160px;
    background: url(https://codologi.in/images/brands-logo.png) no-repeat;
    background-size: 320px 1280px;
    cursor: pointer;
    display: table;
    margin: auto
}

.numbershowrow ul li .counter,
.numbershowrow ul li span.plusicon {
    font-size: 36px;
    display: inline-block;
    color: #fff
}

.brandslogobx ul li:hover {
    transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1)
}

.brandslogobx ul li span.paushtik {
    background-position: -160px 0
}

.brandslogobx ul li span.paushtik:hover {
    background-position: 0 0
}

.brandslogobx ul li span.trainer {
    background-position: -160px -160px
}

.brandslogobx ul li span.trainer:hover {
    background-position: 0 -160px
}

.brandslogobx ul li span.sendy {
    background-position: -160px -320px
}

.brandslogobx ul li span.sendy:hover {
    background-position: 0 -320px
}

.brandslogobx ul li span.eventbook {
    background-position: -160px -480px
}

.brandslogobx ul li:hover span.eventbook {
    background-position: 0 -480px
}

.brandslogobx ul li span.hook {
    background-position: -160px -640px
}

.brandslogobx ul li span.hook:hover {
    background-position: 0 -640px
}

.brandslogobx ul li span.benett {
    background-position: -160px -800px
}

.brandslogobx ul li span.benett:hover {
    background-position: 0 -800px
}

.brandslogobx ul li span.hind {
    background-position: -160px -960px
}

.brandslogobx ul li span.hind:hover {
    background-position: 0 -960px
}

.brandslogobx ul li span.pod {
    background-position: -160px -1120px
}

.brandslogobx ul li span.pod:hover {
    background-position: 0 -1120px
}

.numbershowrow {
    margin: 10px auto;
    padding: 0 120px
}

.hover01 .nmtxtbx,
.numbershowrow ul {
    margin: 0;
    padding: 0
}

.numbershowrow ul li {
    width: 25%;
    float: left;
    list-style: none;
    text-align: center
}

.numbershowrow ul li .counter {
    min-width: 60px
}

.numbershowrow ul li .numtxt {
    font-weight: 300;
    font-size: 24px;
    color: #fff
}

.hover01 .nmtxtbx {
    position: absolute;
    bottom: -50px;
    left: 0;
    display: block;
    width: 100%;
    color: #fff;
    font-size: 20px;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    opacity: 0
}

#scroll-wrapper,
.slidewrap,
figure {
    position: relative
}

.hover01 .nmtxtbx span {
    font-weight: 300;
    font-size: 16px;
    display: block
}

figure {
    overflow: hidden
}

figure:hover .nmtxtbx {
    bottom: 0;
    opacity: 1;
    background: #39317a;
    padding: 8px
}

.hover01 figure .img_scale_bx {
    height: 330px;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.locationbox,
.locationbox .scalewd {
    -moz-transition: all .2s linear;
    -o-transition: all .2s linear;
    -ms-transition: all .2s linear
}

.hover01 figure:hover .img_scale_bx {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
}

.slide-bg-bx {
    position: absolute;
    left: 0;
    top: 150px;
    width: 100%;
    z-index: 999
}

.vision-bg img {
    width: 100%
}

.slidewrap .hslbxCon {
    position: relative;
    width: 50%;
    left: 43%;
    right: 7%
}

.slide-item {
    margin-top: 260px
}

.slide-item h3 {
    font-size: 26px;
    color: #fff
}

.slide-item p {
    font-weight: 300;
    color: #fff;
    font-size: 18px;
    line-height: 28px;
    text-align: left
}

#owl-example .owl-dots {
    top: 80px;
    left: 0;
    right: 0;
    margin: 0 auto;
    position: absolute;
    text-align: left;
    width: 275px
}

#owl-example .owl-dot {
    width: 100px;
    height: 100px;
    background: url(https://codologi.in/images/vision-icon1.png) no-repeat;
    background-size: 100% 100%;
    display: inline-block;
    margin-right: 40px
}

#owl-example .owl-dot:last-child {
    margin-right: 0
}

#owl-example .owl-dots>.owl-dot.active {
    background: url(https://codologi.in/images/vision-icon.png) no-repeat;
    background-size: 100% 100%
}

#owl-example .owl-dots>.owl-dot+div.owl-dot {
    background: url(https://codologi.in/images/mission-icon1.png) no-repeat;
    background-size: 100% 100%
}

#owl-example .owl-dot+div.owl-dot.active {
    background: url(https://codologi.in/images/mission-icon.png) no-repeat;
    background-size: 100% 100%
}

#owl-example .owl-dot:first-child span {
    position: absolute;
    top: 50%;
    left: 100px;
    width: 42px;
    height: 3px;
    background-color: #2f3050
}

#owl-example .owl-nav {
    z-index: 99
}

.fixed #owl-example {
    position: fixed;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    left: 0;
    top: 0
}

.fixed .concern {
    height: 100vh
}

.pagination-wrap {
    display: none
}

.contactformwrap {
    padding-top: 250px;
    background: url(https://codologi.in/images/contact-us-bg.png) no-repeat #383838;
    background-size: 100% auto;
    display: block
}

.contactformwrap .formsection {
    position: relative;
    background-color: #fff;
    border-radius: 4px;
    margin-top: 170px;
    -webkit-box-shadow: 0 0 16px rgba(0, 0, 0, .4);
    box-shadow: 0 0 16px rgba(0, 0, 0, .4);
    margin-bottom: 30px;
    z-index: 1
}

.contactformwrap .formsection .lnumsec {
    float: left;
    width: 35%;
    background: #5b5b5b;
    border-radius: 4px 0 0 4px
}

.contactformwrap .formsection .formbx {
    padding-bottom: 30px;
    float: right;
    width: 65%
}

.contactformwrap .formsection .formbx .forminputbx {
    padding: 40px
}

.contactformwrap .formsection .formbx .material-form .g-recaptcha {
    left: 0;
    -webkit-transform: none;
    transform: none
}

.contactformwrap .formsection .formbx .material-form p {
    width: 100%
}

.contactformwrap .formsection .formbx .material-form .square-button.material-btn {
    background: #383838;
    color: #fff;
    width: 100%;
    margin-top: 0px
}

,
.contactformwrap .formsection .formbx .forminputbx .form-group {
    margin-bottom: 20px
}

.contactformwrap .formsection .formbx .forminputbx .form-control,
.contactformwrap .formsection .formbx .forminputbx label {
    color: #333
}

.contactformwrap .material-form .input-block:before {
    background: #0162ca!important
}

.contactformwrap .material-form .input-block {
    border-bottom: 1px solid rgba(72, 72, 72, .2)
}

.contactformwrap .formsection .formbx .forminputbx .form-group textarea {
    resize: none
}

.contactformwrap .formsection .formbx .forminputbx .form-control::-webkit-input-placeholder {
    color: #676767
}

.contactformwrap .formsection .formbx .forminputbx .form-control::-moz-placeholder {
    color: #676767
}

.contactformwrap .formsection .formbx .forminputbx .form-control:-ms-input-placeholder {
    color: #676767
}

.contactformwrap .formsection .formbx .forminputbx .form-control:-moz-placeholder {
    color: #676767
}

div.select {
    position: relative
}

select.select {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.locationbox,
.row.w8,
span.select {
    position: relative
}

span.select {
    font-weight: 300;
    border: 1px solid #d4d4d4;
    padding: 12px 37px 12px 12px;
    font-size: 17px;
    color: #000;
    background: url(https://codologi.in/images/select-arrow.png) 98% 19px no-repeat #fff;
    background-size: 16px 9px;
    display: block;
    border-radius: 4px
}

.btn-primary.submit {
    font-weight: 400;
    background: #0328d2;
    display: table;
    margin: 20px auto auto;
    padding: 10px 35px 8px;
    font-size: 18px;
    border: 0;
    -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, .1);
    box-shadow: 1px 1px 1px rgba(0, 0, 0, .1)
}

.btn-primary.submit.focus,
.btn-primary.submit:focus,
.btn-primary.submit:hover {
    color: #fff;
    background-color: #332f7a;
    border-color: transparent
}

.contactformwrap h1 {
    font-weight: 400;
    font-size: 50px;
    color: #fff;
    margin: 0;
    padding: 0;
    text-align: center
}

.contactformwrap h4 {
    font-weight: 300;
    font-size: 24px;
    color: #fff;
    margin: 0;
    padding: 20px 0;
    text-align: center
}

.numbershowrow.contacts {
    padding: 20px 20px 0
}

.numbershowrow.contacts ul li {
    width: auto;
    float: none;
    margin-bottom: 20px
}

.numbershowrow.contacts ul li .counter {
    font-size: 42px
}

.numbershowrow.contacts ul li .numtxt {
    font-size: 14px
}

#testimonials.contact {
    width: auto;
    padding: 0 20px 30px
}

#testimonials.contact .clientsays .clientrow .clientpic {
    width: 80px;
    height: 80px;
    padding: 5px
}

#testimonials.contact .clientsays .clientrow .clientpic .picbx {
    width: 70px;
    height: 70px
}

#testimonials.contact .clientsays .clientrow .clsaystext {
    margin-left: 96px
}

#testimonials.contact .clientsays .clientrow {
    margin-bottom: 0
}

#testimonials.contact .clientsays .clientrow .clsaystext h3 {
    font-size: 18px
}

#testimonials.contact .clientsays .clientrow .clsaystext h4 {
    font-size: 14px;
    text-align: left
}

#testimonials.contact .clientsays .client-say-text {
    font-size: 14px;
    line-height: 20px;
    padding: 0 0 10px 10px
}

.owl-carousel.testi.size .owl-dot {
    width: 12px
}

.p_col {
    width: 20px!important;
    height: 17px!important;
    display: inline-block
}

.awardswrap {
    background-color: #f5f5f5;
    padding: 50px
}

.awardswrap .heading-title {
    font-size: 40px;
    color: #000;
    text-align: center
}

.awardswrap .awardslogo {
    padding: 30px 0 20px
}

.awardswrap .awardslogo .clutch {
    padding-top: 30px
}

.awardswrap .info-awards {
    font-weight: 300;
    max-width: 70%;
    margin: auto;
    font-size: 20px;
    line-height: 30px;
    color: #000;
    text-align: center;
    padding-top: 10px
}

.row.w8 {
    margin: 0 -8px
}

.w8p {
    padding: 0 8px
}

.addressboxwrap {
    padding: 235px 0 50px;
    background: url(https://codologi.in/images/address-box-bg.jpg) no-repeat;
    background-size: cover;
    display: block
}

.locationbox {
    background-color: #fff;
    padding: 25px;
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.locationbox .australia {
    text-align: center
}

.locationbox .australia img {
    margin-top: 40px;
    height: 60px
}

.locationbox:hover .australia img {
    -webkit-filter: grayscale(100%) brightness(3);
    filter: grayscale(100%) brightness(3)
}

.locationbox .scalewd {
    -webkit-transition: all .2s linear;
    transition: all .2s linear;
    overflow: hidden
}

.locationbox:hover .scalewd {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.locationbox:hover {
    background-color: #0328d2
}

.locationbox .flagbx {
    position: absolute;
    left: 50%;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -40px;
    border-radius: 50%;
    border: 3px solid #0328d2;
    padding: 2px;
    background: #fff;
    overflow: hidden
}

.locationbox .flagbx img {
    width: 41px;
    height: 41px;
    border-radius: 50%;
    vertical-align: middle
}

.locationbox .toplineS {
    position: absolute;
    width: 3px;
    height: 50px;
    left: 50%;
    top: -73px;
    margin-left: -2px;
    background-color: #0328d2
}

.locationbox .locateicon {
    width: 130px;
    height: 80px;
    margin: 30px auto auto;
    background: url(https://codologi.in/images/location-icon.png) no-repeat;
    background-size: 260px 320px;
    display: block
}

.locationbox .locateicon.newyork {
    background-position: 0 0
}

.locationbox:hover .locateicon.newyork {
    background-position: -130px 0
}

.locationbox .locateicon.india {
    background-position: 0 -80px
}

.locationbox:hover .locateicon.india {
    background-position: -130px -80px
}

.locationbox .locateicon.germany {
    background-position: 0 -160px
}

.locationbox:hover .locateicon.germany {
    background-position: -130px -160px
}

.locationbox .locateicon.uae {
    background-position: 0 -240px
}

.locationbox:hover .locateicon.uae {
    background-position: -130px -240px
}

.locationbox h3 {
    font-size: 20px;
    color: #010101;
    margin: 0;
    padding: 10px 0;
    text-align: center
}

.locationbox:hover h3 {
    color: #fff
}

.locationbox .addtxtboxs {
    font-weight: 400;
    padding-top: 10px
}

.locationbox .addtxtboxs p {
    position: relative;
    font-size: 13px;
    margin-bottom: 15px;
    padding-left: 25px
}

.locationbox .addtxtboxs p i {
    font-style: normal
}

.locationbox:hover .addtxtboxs p {
    color: #fff!important;
    -webkit-text-fill-color: #fff
}

.locationbox .addtxtboxs span {
    position: absolute;
    width: 20px;
    left: 0;
    color: #1d70e2
}

.locationbox:hover .addtxtboxs span {
    color: #fff
}

.locationbox .addtxtboxs span.map-icon {
    width: 14px;
    height: 20px;
    background: url(https://codologi.in/images/map_icon.png) no-repeat;
    background-size: 14px 40px;
    display: inline-block
}

.locationbox:hover .addtxtboxs span.map-icon {
    background-position: 0 -20px
}

.locationbox .addtxtboxs span.fa {
    font-size: 18px
}

.locationbox .addtxtboxs span.glyphicon {
    font-size: 15px
}

.topbaseline {
    position: absolute;
    width: 80.2%;
    height: 3px;
    left: 9.8%;
    background: #0328d2;
    top: -73px
}

.topbaseline .mainbaseline {
    position: absolute;
    top: -60px;
    left: 50%;
    margin-left: -2px;
    width: 3px;
    height: 60px;
    background: #0328d2
}

.topbaseline .mainbaseline .circlbasel {
    position: absolute;
    width: 20px;
    height: 20px;
    top: -20px;
    left: 50%;
    margin-left: -10px;
    border-radius: 50%;
    border: 3px solid #0328d2
}

.serviceHeadwrap {
    background-image: url(https://codologi.in/images/service-head-bg.jpg);
    background-repeat: repeat-y;
    background-position: 0 0;
    background-size: 100% auto;
    -webkit-animation: testing 20s linear forwards infinite;
    animation: testing 20s linear forwards infinite;
    height: 100vh!important
}

.mobileappdevCon {
    position: relative;
    padding-top: 120px
}

.mobileappdevCon .devleftCon {
    padding: 100px 0
}

.devleftCon .dev-title {
    font-size: 36px;
    color: #fff;
    margin: 0;
    padding: 20px 0
}

.devleftCon .dev_ntxt {
    font-weight: 300;
    color: #fff;
    font-size: 20px;
    line-height: 36px;
    margin-bottom: 50px
}

.technologybx {
    margin-top: 25px
}

.technologybx .techtxt {
    font-weight: 300;
    font-size: 21px;
    color: #fff;
    margin-bottom: 15px
}

.technologybx .techtxt .tick {
    width: 27px;
    height: 24px;
    background-size: 100% 100%;
    display: inline-block
}

.technologybx .techtxt .txt_t {
    display: inline-block;
    margin: 0 10px
}

.techiconbx {
    margin-top: 20px
}

.techiconbx.mobileapp {
    position: relative;
    top: -70px;
    left: 15px;
    padding: 0 50px
}

.techiconbx .iconbxn {
    width: 85px;
    height: 85px;
    padding: 4px;
    border-radius: 50%;
    border: 1px solid #6864ad;
    display: inline-block;
    margin-right: 20px
}

.techiconbx .innericonbx {
    position: relative;
    width: 75px;
    height: 75px;
    border-radius: 50%;
    background-color: #0328d2
}

.techiconbx .innericonbx span.ios {
    background-position: 0 0
}

.techiconbx .innericonbx span.android {
    background-position: 0 -50px
}

.techiconbx .innericonbx span.html5 {
    background-position: 0 -100px
}

.techiconbx .innericonbx span.cross-platfrom {
    background-position: 0 -150px
}

.techiconbx .innericonbx span.swift {
    background-position: 0 -200px
}

.techiconbx .innericonbx span.appletv {
    background-position: 0 -350px
}

.techiconbx .innericonbx span.androidtv {
    background-position: 0 -400px
}

.techiconbx .innericonbx span.iphone {
    background-position: 0 -250px
}

.techiconbx .innericonbx span.objective {
    background-position: 0 -300px
}

.techiconbx .innericonbx span.ipad {
    background-position: 0 -450px
}

.techiconbx .innericonbx span.health {
    background-position: 0 -500px
}

.techiconbx .innericonbx.android-technology span.java {
    background-position: 0 0
}

.techiconbx .innericonbx.android-technology span.kotlin {
    background-position: 0 -50px
}

.techiconbx .innericonbx.android-technology span.android-studio {
    background-position: 0 -100px
}

.techiconbx .innericonbx.android-technology span.android-mobile {
    background-position: 0 -150px
}

.techiconbx .innericonbx.android-technology span.android-tablet {
    background-position: 0 -200px
}

.techiconbx .innericonbx.wearable-technology span.apple-watch {
    background-position: 0 0
}

.techiconbx .innericonbx.wearable-technology span.android-wear {
    background-position: 0 -50px
}

.techiconbx .innericonbx.wearable-technology span.google-glass {
    background-position: 0 -100px
}

.techiconbx .innericonbx.wearable-technology span.gear {
    background-position: 0 -150px
}

.techiconbx .innericonbx.wearable-technology span.gps-watch {
    background-position: 0 -200px
}

.techiconbx .innericonbx.wearable-technology span.fitbit {
    background-position: 0 -250px
}

.techiconbx .innericonbx.wearable-technology span.ar {
    background-position: 0 -300px
}

.techiconbx .innericonbx.website-dev span.php {
    background-position: 0 0
}

.techiconbx .innericonbx.website-dev span.asp {
    background-position: 0 -50px
}

.techiconbx .innericonbx.website-dev span.opensource {
    background-position: 0 -100px
}

.techiconbx .innericonbx.website-dev span.js {
    background-position: 0 -150px
}

.techiconbx .innericonbx.iot-dev span.mqtt {
    background-position: 0 0
}

.techiconbx .innericonbx.iot-dev span.xmpp {
    background-position: 0 -50px
}

.techiconbx .innericonbx.iot-dev span.wireless {
    background-position: 0 -100px
}

.techiconbx .innericonbx.iot-dev span.rest {
    background-position: 0 -150px
}

.techiconbx .innericonbx.iot-dev span.sensors {
    background-position: 0 -200px
}

.techiconbx .innericonbx.iot-dev span.cloud-sync {
    background-position: 0 -250px
}

.techiconbx .innericonbx.iot-dev span.soap {
    background-position: 0 -300px
}

.techiconbx .innericonbx.ibeacon span.ibeacon {
    background-position: 0 0
}

.techiconbx .innericonbx.ibeacon span.eddystone {
    background-position: 0 -50px
}

.techiconbx .innericonbx.ibeacon span.location-based {
    background-position: 0 -100px
}

.techiconbx .innericonbx.ibeacon span.gps-traking {
    background-position: 0 -150px
}

.techiconbx .innericonbx.ibeacon span.geofencing {
    background-position: 0 -200px
}

.techn-pics-bx {
    padding: 0
}

.techn-pics-bx ul+img {
    position: absolute
}

.industriesserve {
    padding: 50px 0
}

.industriesserve h2 {
    font-size: 32px;
    color: #000;
    margin: 0;
    padding: 10px 0;
    text-align: center
}

.industriesserve .indus_info {
    font-weight: 300;
    color: #000;
    font-size: 20px;
    text-align: center;
    line-height: 32px;
    max-width: 900px;
    margin: auto
}

.indus-upper-bx .divide-indus h4,
.iosdevbx .iosdevinnerbx h4,
.nav-tabs.app>li>a {
    color: #000;
    font-size: 16px;
    text-align: center;
    font-weight: 300
}

.indus-graph-bx {
    padding: 20px 0
}

.indus-upper-bx {
    position: relative;
    width: 90%;
    margin: auto;
    left: 3.7%
}

.indus-upper-bx.downrow {
    position: relative;
    top: -15px;
    margin-left: -2.5%
}

.indus-base-line {
    background-color: #57585b;
    height: 2px;
    margin-top: -8px
}

.indus-upper-bx .divide-indus {
    float: left;
    width: 16.66%
}

.indus-upper-bx .divide-indus h4 {
    margin-bottom: 12px
}

.indus-upper-bx .divide-indus .indus-icon-bx {
    position: relative;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    margin: auto;
    -webkit-transition: all .2s linear;
    transition: all .2s linear;
    background-size: 0 0
}

.indus-upper-bx .divide-indus:hover .indus-icon-bx {
    background-size: 52px 52px
}

.indus-upper-bx .divide-indus.realestate .indus-icon-bx {
    border: 2px solid #f05a29
}

.indus-upper-bx .divide-indus.realestate:hover .indus-icon-bx {
    background-color: #f05a29
}

.indus-upper-bx .divide-indus.events .indus-icon-bx {
    border: 2px solid #8dc53e
}

.indus-upper-bx .divide-indus.events:hover .indus-icon-bx {
    background-color: #8dc53e
}

.indus-upper-bx .divide-indus.demand .indus-icon-bx {
    border: 2px solid #662c91
}

.indus-upper-bx .divide-indus.demand:hover .indus-icon-bx {
    background-color: #662c91
}

.indus-upper-bx .divide-indus.travel .indus-icon-bx {
    border: 2px solid #b5041a
}

.indus-upper-bx .divide-indus.travel:hover .indus-icon-bx {
    background-color: #b5041a
}

.indus-upper-bx .divide-indus.social-net .indus-icon-bx {
    border: 2px solid #27aae0
}

.indus-upper-bx .divide-indus.social-net:hover .indus-icon-bx {
    background-color: #27aae0
}

.indus-upper-bx .divide-indus.education .indus-icon-bx {
    border: 2px solid #fbbd1e
}

.indus-upper-bx .divide-indus.education:hover .indus-icon-bx {
    background-color: #fbbd1e
}

.indus-upper-bx .divide-indus.transport .indus-icon-bx {
    border: 2px solid #bc4a90
}

.indus-upper-bx .divide-indus.transport:hover .indus-icon-bx {
    background-color: #bc4a90
}

.indus-upper-bx .divide-indus.banking .indus-icon-bx {
    border: 2px solid #fc5353
}

.indus-upper-bx .divide-indus.banking:hover .indus-icon-bx {
    background-color: #fc5353
}

.indus-upper-bx .divide-indus.health .indus-icon-bx {
    border: 2px solid #27aae0
}

.indus-upper-bx .divide-indus.health:hover .indus-icon-bx {
    background-color: #27aae0
}

.indus-upper-bx .divide-indus.ecommerce .indus-icon-bx {
    border: 2px solid #2c3566
}

.indus-upper-bx .divide-indus.ecommerce:hover .indus-icon-bx {
    background-color: #2c3566
}

.indus-upper-bx .divide-indus.gaming .indus-icon-bx {
    border: 2px solid #6864ad
}

.indus-upper-bx .divide-indus.gaming:hover .indus-icon-bx {
    background-color: #6864ad
}

.indus-upper-bx .divide-indus.food .indus-icon-bx {
    border: 2px solid red
}

.indus-upper-bx .divide-indus.food:hover .indus-icon-bx {
    background-color: red
}

.indus-upper-bx .divide-indus .indus-icon-bx span,
.iosdevbx .iosdevinnerbx .ios-indust-icon span {
    position: absolute;
    width: 40px;
    height: 40px;
    top: 50%;
    left: 50%;
    margin: -20px 0 0 -20px;
    background-size: 80px 480px;
    display: block
}

.indus-upper-bx .divide-indus.realestate .indus-icon-bx span {
    background-position: 0 0
}

.indus-upper-bx .divide-indus.realestate:hover .indus-icon-bx span,
.iosdevbx.realestate .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px 0
}

.indus-upper-bx .divide-indus.events .indus-icon-bx span {
    background-position: 0 -40px
}

.indus-upper-bx .divide-indus.events:hover .indus-icon-bx span,
.iosdevbx.events .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -40px
}

.indus-upper-bx .divide-indus.demand .indus-icon-bx span {
    background-position: 0 -80px
}

.indus-upper-bx .divide-indus.demand:hover .indus-icon-bx span,
.iosdevbx.demand .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -80px
}

.indus-upper-bx .divide-indus.travel .indus-icon-bx span {
    background-position: 0 -120px
}

.indus-upper-bx .divide-indus.travel:hover .indus-icon-bx span,
.iosdevbx.travel .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -120px
}

.indus-upper-bx .divide-indus.social-net .indus-icon-bx span {
    background-position: 0 -160px
}

.indus-upper-bx .divide-indus.social-net:hover .indus-icon-bx span,
.iosdevbx.social-net .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -160px
}

.indus-upper-bx .divide-indus.education .indus-icon-bx span {
    background-position: 0 -200px
}

.indus-upper-bx .divide-indus.education:hover .indus-icon-bx span,
.iosdevbx.education .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -200px
}

.indus-upper-bx .divide-indus.transport .indus-icon-bx span {
    background-position: 0 -240px
}

.indus-upper-bx .divide-indus.transport:hover .indus-icon-bx span,
.iosdevbx.transport .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -240px
}

.indus-upper-bx .divide-indus.banking .indus-icon-bx span {
    background-position: 0 -280px
}

.indus-upper-bx .divide-indus.banking:hover .indus-icon-bx span,
.iosdevbx.banking .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -280px
}

.indus-upper-bx .divide-indus.health .indus-icon-bx span {
    background-position: 0 -320px
}

.indus-upper-bx .divide-indus.health:hover .indus-icon-bx span,
.iosdevbx.health .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -320px
}

.indus-upper-bx .divide-indus.ecommerce .indus-icon-bx span {
    background-position: 0 -360px
}

.indus-upper-bx .divide-indus.ecommerce:hover .indus-icon-bx span,
.iosdevbx.ecommerce .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -360px
}

.indus-upper-bx .divide-indus.gaming .indus-icon-bx span {
    background-position: 0 -400px
}

.indus-upper-bx .divide-indus.gaming:hover .indus-icon-bx span,
.iosdevbx.gaming .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -400px
}

.indus-upper-bx .divide-indus.food .indus-icon-bx span {
    background-position: 0 -440px
}

.indus-upper-bx .divide-indus.food:hover .indus-icon-bx span,
.iosdevbx.food .iosdevinnerbx .ios-indust-icon span {
    background-position: -40px -440px
}

.indus-upper-bx .divide-indus .sm-point {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #57585b;
    margin: 10px auto auto
}

.indus-upper-bx.downrow .divide-indus .sm-point {
    margin-top: 0;
    margin-bottom: 10px
}

.indus-upper-bx .divide-indus .indus-line {
    width: 2px;
    height: 70px;
    background-color: #8d8d8d;
    margin: auto
}

.indus-upper-bx .divide-indus .down-sm-cilcle {
    position: relative;
    width: 16px;
    height: 16px;
    background-color: #fff;
    border: 2px solid #57585b;
    border-radius: 50%;
    margin: -1px auto auto
}

.indus-upper-bx.downrow .divide-indus .down-sm-cilcle {
    margin-top: 0;
    margin-bottom: -1px
}

.indus-upper-bx .divide-indus .down-sm-inner-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    margin: -4px 0 0 -4px;
    background-color: #f05a29;
    border-radius: 50%
}

.indus-upper-bx .divide-indus.events .down-sm-inner-circle {
    background-color: #8dc53e
}

.indus-upper-bx .divide-indus.demand .down-sm-inner-circle {
    background-color: #662c91
}

.indus-upper-bx .divide-indus.travel .down-sm-inner-circle {
    background-color: #b5041a
}

.indus-upper-bx .divide-indus.social-net .down-sm-inner-circle {
    background-color: #27aae0
}

.indus-upper-bx .divide-indus.education .down-sm-inner-circle {
    background-color: #fbbd1e
}

.indus-upper-bx .divide-indus.transport .down-sm-inner-circle {
    background-color: #bc4a90
}

.indus-upper-bx .divide-indus.banking .down-sm-inner-circle {
    background-color: #fc5353
}

.indus-upper-bx .divide-indus.health .down-sm-inner-circle {
    background-color: #27aae0
}

.indus-upper-bx .divide-indus.ecommerce .down-sm-inner-circle {
    background-color: #2c3566
}

.indus-upper-bx .divide-indus.gaming .down-sm-inner-circle {
    background-color: #6864ad
}

.ios-app-dev-Con {
    padding: 80px
}

.ios-app-dev-Con .iosupperrw {
    position: relative
}

.ios-app-dev-Con .iosupperrw.downrow {
    padding-top: 20px
}

.iosdevbx {
    width: 16.66%;
    float: left
}

.iosdevbx .iosdevinnerbx {
    position: relative;
    padding: 50px 5px 5px;
    margin: 10px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 4px 0 rgba(0, 0, 0, .2);
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .2);
    cursor: pointer
}

.iosdevbx .iosdevinnerbx .midpassline {
    position: absolute;
    width: 20px;
    top: 50%;
    right: -20px;
    height: 2px;
    background-color: #6864ad
}

.iosdevbx .iosdevinnerbx .midpassline.left {
    left: -20px;
    right: auto
}

.iosdevbx .iosdevinnerbx .handbaseline {
    position: absolute;
    width: 20px;
    height: 20px;
    top: 50%;
    left: -25px;
    margin-top: -12px;
    border: 4px solid #00208a;
    border-radius: 50%;
    background-color: #6864ad
}

.ios-app-dev-Con .iosupperrw.downrow .iosdevbx .iosdevinnerbx .handbaseline {
    left: auto;
    right: -25px
}

.iosdevbx .iosdevinnerbx .handbaseline .nextlines {
    position: absolute;
    width: 10px;
    height: 2px;
    top: 50%;
    left: 11px;
    background-color: #6864ad
}

.ios-app-dev-Con .iosupperrw.downrow .iosdevbx .iosdevinnerbx .handbaseline .nextlines {
    left: auto;
    right: 11px
}

.iosdevbx .iosdevinnerbx .ios-indust-icon {
    position: absolute;
    width: 64px;
    height: 64px;
    top: -32px;
    left: 50%;
    margin-left: -32px;
    border-radius: 50%;
    border: 5px solid #00208a;
    background-color: #6864ad;
    -webkit-transition: -webkit-transform 1s;
    transition: -webkit-transform 1s;
    transition: transform 1s;
    transition: transform 1s, -webkit-transform 1s;
    transition: transform 1s, -webkit-transform 1s;
    transition: transform 1s, -webkit-transform 1s;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.appdevelopment-iconrow,
.nav-tabs.service>li>a span {
    -moz-transition: all .2s linear;
    -o-transition: all .2s linear;
    -ms-transition: all .2s linear
}

.iosdevbx .iosdevinnerbx:hover .ios-indust-icon {
    border-color: #6864ad;
    background-color: #00208a;
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.iosbasemidline {
    position: relative;
    height: 2px;
    margin: 30px -10px;
    background-color: #6864ad
}

.iosbasemidline .updrt-line {
    position: absolute;
    right: 0;
    top: -86px;
    bottom: 0;
    width: 2px;
    height: 88px;
    background-color: #6864ad
}

.iosbasemidline .updrt-line.left {
    right: auto;
    left: 0;
    top: 0;
    height: 110px
}

.appdevelopment-iconrow {
    position: fixed;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    width: 100%;
    left: 0;
    bottom: 0;
    background-color: #ebebeb;
    opacity: 1;
    -webkit-transition: all .2s linear;
    transition: all .2s linear;
    z-index: 99
}

.appdevelopment-iconrow.change {
    opacity: 0;
    visibility: hidden
}

.nav-tabs.app {
    border: 0
}

.nav-tabs.app>li {
    position: relative;
    width: 14.28%;
    margin-bottom: 0
}

.nav-tabs.app>li>a {
    margin-right: 0;
    border-radius: 0;
    border: 0;
    padding-top: 64px;
    padding-bottom: 10px;
    line-height: 20px
}

.nav-tabs.app>li:last-child>a {
    border-right: 0
}

.nav-tabs.app>li>a span.divideline {
    position: absolute;
    width: 1px;
    height: 80%;
    top: 10%;
    left: auto;
    right: 0;
    background-color: #a4a4a4
}

.nav-tabs.app>li>a span {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 8px;
    left: 50%;
    margin-left: -30px;
    background-size: 100px 350px
}

.nav-tabs.app>li>a span.mad {
    background-position: 0 -50px
}

.nav-tabs.app>li.active>a span.mad,
.nav-tabs.app>li:hover>a span.mad {
    background-position: -50px -50px
}

.nav-tabs.app>li>a span.iad {
    background-position: 0 0
}

.nav-tabs.app>li.active>a span.iad,
.nav-tabs.app>li:hover>a span.iad {
    background-position: -50px 0
}

.nav-tabs.app>li>a span.apd {
    background-position: 0 -100px
}

.nav-tabs.app>li.active>a span.apd,
.nav-tabs.app>li:hover>a span.apd {
    background-position: -50px -100px
}

.nav-tabs.app>li>a span.wad {
    background-position: 0 -150px
}

.nav-tabs.app>li.active>a span.wad,
.nav-tabs.app>li:hover>a span.wad {
    background-position: -50px -150px
}

.nav-tabs.app>li>a span.wd {
    background-position: 0 -200px
}

.nav-tabs.app>li.active>a span.wd,
.nav-tabs.app>li:hover>a span.wd {
    background-position: -50px -200px
}

.nav-tabs.app>li>a span.iot {
    background-position: 0 -250px
}

.nav-tabs.app>li.active>a span.iot,
.nav-tabs.app>li:hover>a span.iot {
    background-position: -50px -250px
}

.nav-tabs.app>li>a span.bad {
    background-position: 0 -300px
}

.nav-tabs.app>li.active>a span.bad,
.nav-tabs.app>li:hover>a span.bad {
    background-position: -50px -300px
}

.nav-tabs.app>li.mobile-app.active>a,
.nav-tabs.app>li.mobile-app.active>a:focus,
.nav-tabs.app>li.mobile-app.active>a:hover,
.nav-tabs.app>li.mobile-app>a:hover {
    background-color: #2c3566;
    color: #fff;
    border: 0
}

.nav-tabs.app>li.ios-app.active>a,
.nav-tabs.app>li.ios-app.active>a:focus,
.nav-tabs.app>li.ios-app.active>a:hover,
.nav-tabs.app>li.ios-app>a:hover {
    background-color: #1e5960;
    color: #fff;
    border: 0
}

.nav-tabs.app>li.android-app.active>a,
.nav-tabs.app>li.android-app.active>a:focus,
.nav-tabs.app>li.android-app.active>a:hover,
.nav-tabs.app>li.android-app>a:hover {
    background-color: #74306a;
    color: #fff;
    border: 0
}

.nav-tabs.app>li.wad-app.active>a,
.nav-tabs.app>li.wad-app.active>a:focus,
.nav-tabs.app>li.wad-app.active>a:hover,
.nav-tabs.app>li.wad-app>a:hover {
    background-color: #8d2d25;
    color: #fff;
    border: 0
}

.nav-tabs.app>li.wd.active>a,
.nav-tabs.app>li.wd.active>a:focus,
.nav-tabs.app>li.wd.active>a:hover,
.nav-tabs.app>li.wd>a:hover {
    background-color: #09668d;
    color: #fff;
    border: 0
}

.nav-tabs.app>li.iot.active>a,
.nav-tabs.app>li.iot.active>a:focus,
.nav-tabs.app>li.iot.active>a:hover,
.nav-tabs.app>li.iot>a:hover {
    background-color: #00208a;
    color: #fff;
    border: 0
}

.nav-tabs.app>li.beacon.active>a,
.nav-tabs.app>li.beacon.active>a:focus,
.nav-tabs.app>li.beacon.active>a:hover,
.nav-tabs.app>li.beacon>a:hover {
    background-color: #1f563d;
    color: #fff;
    border: 0
}

.phone-block-pva-trainer {
    width: 280px;
    height: 471px;
    background-size: cover;
    padding: 53px 39px 10px;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    margin: auto;
    display: none
}

.phone-block-pva-trainer img {
    width: 199px;
    height: 343px
}

.workproM {
    margin-top: 300px;
    display: none
}

.bg-test {
    height: 100%;
    width: 100%;
    background-position: 0 0;
    background-size: 100% auto;
    position: absolute;
    z-index: 0;
    top: 0
}

.bg-test h6 {
    position: absolute;
    left: -99999px
}

@-webkit-keyframes testing {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: 0 -100%
    }
}

@keyframes testing {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: 0 -100%
    }
}

.design-app-development {
    position: relative
}

.mouse-animations,
.scroll-down,
.scroll-down:before {
    position: absolute;
    right: 0
}

.design-app-development .appdevheading {
    font-size: 55px;
    line-height: 72px;
    color: #fff;
    text-align: center;
    font-weight: 600;
    text-transform: uppercase
}

.fitnessapp {
    background-size: cover
}

.portfolioappContentbx {
    padding: 0 30px
}

.portfolioappContentbx .applogorw {
    margin-bottom: 0
}

.portfolioappContentbx .applogorw .appnm {
    margin-left: 0;
    width: 100%;
    display: inline-block
}

.portfolioappContentbx .applogorw .appnm .appnm_title {
    display: none
}

.portfolioappContentbx .applogorw .appnm .appsubtitle.eventplan {
    color: #ff3f3f
}

.portfolioappContentbx .applogorw .appnm .appsubtitle.hook {
    color: #0183ff
}

.appsmtext {
    color: #fff;
    font-size: 20px;
    padding-right: 50px;
    float: left;
    margin-bottom: 30px
}

.appstlinksrw {
    margin-top: 20px;
    text-align: left
}

.appstlinksrw .casestudybtn {
    margin-bottom: 20px;
    text-align: left
}

.appstlinksrw .stdsbx {
    display: inline-block;
    margin-right: 20px
}

.appstlinksrw .stdsbx.playappstore a {
    width: 160px;
    height: 51px;
    background-size: 100% 100%;
    text-indent: -9999px;
    display: block
}

.appstlinksrw .stdsbx.playappstore:hover a {
    background-size: 100% 100%
}

.appstlinksrw .stdsbx.iosappstore a {
    width: 160px;
    height: 51px;
    background-size: 100% 100%;
    text-indent: -9999px;
    display: block
}

.appstlinksrw .stdsbx.iosappstore:hover a {
    background-size: 100% 100%
}

.appstlinksrw .stdsbx .comingsoon {
    font-weight: 300;
    width: 160px;
    height: 50px;
    line-height: 45px;
    text-align: center;
    font-size: 20px;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 2px;
    background-color: transparent
}

.customized-case-app {
    background-size: cover
}

.portfolioappContentbx .applogorw .custmozedapplogo {
    float: left;
    width: 100px;
    height: 100px;
    background-size: 100% 100%
}

.portfolioappContentbx.customized {
    max-width: 560px;
    display: table;
    margin: auto;
    padding: 0
}

.portfolioappContentbx.customized .appsmtext {
    padding-left: 50px;
    padding-right: 0
}

.portfolioappContentbx.customized .appstlinksrw {
    text-align: center
}

.eventbookapp {
    background-size: cover
}

.eventbxConfl {
    float: right
}

.portfolioappContentbx.eventbookappwd {
    padding: 0
}

.portfolioappContentbx .applogorw .eventbooklogo {
    float: left;
    width: 100px;
    height: 100px;
    background-size: 100% 100%
}

.tourapp {
    background-size: cover
}

.portfolioappContentbx .applogorw .tourapplogo {
    float: left;
    width: 100px;
    height: 100px;
    background-size: 100% 100%
}

.timerscreenapp {
    background-size: cover
}

.portfolioappContentbx .applogorw .timerapplogo {
    float: left;
    width: 100px;
    height: 100px;
    background-size: 100% 100%
}

.carscreenapp {
    background-size: cover
}

.portfolioappContentbx .applogorw .carapplogo {
    float: left;
    width: 100px;
    height: 100px;
    background-size: 100% 100%
}

.kestoneapp {
    background-size: cover
}

.portfolioappContentbx.dummyapp {
    padding-left: 20%;
    margin-top: -200px
}

.portfolioappContentbx .applogorw .kestoneapplogo {
    float: left;
    width: 100px;
    height: 100px;
    background-size: 100% 100%
}

.hookiotapps {
    background-size: cover
}

.portfolioappContentbx .applogorw .hookapplogo {
    float: left;
    width: 100px;
    height: 100px;
    background-size: 100% 100%
}

.cityeyeapps {
    background-size: cover
}

.portfolioappContentbx .applogorw .cityapplogo {
    float: left;
    width: 100px;
    height: 100px;
    background-size: 100% 100%
}

.footsoldierapp {
    background-size: cover
}

.portfolioappContentbx .applogorw .footsoldier-logo {
    float: left;
    width: 100px;
    height: 100px;
    background-size: 100% 100%
}

.shopperapp {
    background-size: cover
}

.portfolioappContentbx .applogorw .shopper-logo {
    float: left;
    width: 100px;
    height: 100px;
    background-size: 100% 100%
}

.portfolioappContentbx .applogorw .podemcapp-logo {
    float: left;
    width: 100px;
    height: 100px;
    background: url(https://codologi.in/images/podmce_logo.png) no-repeat;
    background-size: 100% 100%
}

.meltingpotapp {
    background: url(https://codologi.in/images/meltingpot_banner.jpg) no-repeat;
    background-size: cover
}

.portfolioappContentbx .applogorw .meltingpot-logo {
    float: left;
    width: 100px;
    height: 100px;
    background: url(https://codologi.in/images/meltingpot_logo.png) no-repeat;
    background-size: 100% 100%
}

.pausthikapp {
    background: url(https://codologi.in/images/paushtik-app.jpg) no-repeat;
    background-size: cover
}

.portfolioappContentbx .applogorw .paushtikapp-logo {
    float: left;
    width: 100px;
    height: 100px;
    background: url(https://codologi.in/images/paushtik-app-logo.png) no-repeat;
    background-size: 100% 100%
}

.scroll-down:before {
    background-color: #fff;
    left: 0
}

.scroll-down.homepg:before {
    background-color: #00208a
}

.scroll-down.homepg {
    border: 2px solid #00208a
}

.scroll-down {
    bottom: 25px;
    left: 0;
    color: #fff;
    cursor: pointer;
    margin: auto;
    display: inline-block;
    font-size: .9rem;
    width: 3.5em;
    height: 5.5em;
    border: 2px solid #fff;
    border-radius: 6em;
    z-index: 9
}

.scroll-down:before {
    content: "";
    margin: auto;
    top: 20%;
    height: 0;
    width: 18%;
    padding-top: 18%;
    border-radius: 50%;
    -webkit-transition: .4s;
    transition: .4s
}

.mouse-animations {
    left: 0;
    margin: auto;
    top: 22.5%
}

[class*=mouse-scroll] {
    opacity: 0;
    margin: auto;
    width: 0;
    height: 0;
    border-left: .35em solid transparent;
    border-right: .35em solid transparent;
    border-top: .4em solid #fff;
    -webkit-transition: .4s;
    transition: .4s
}

.scroll-down.homepg [class*=mouse-scroll] {
    border-top: .4em solid #00208a
}

.mouse-scroll-l {
    -webkit-animation: down3 1s infinite;
    animation: down3 1s infinite
}

.mouse-scroll-2 {
    -webkit-animation: down2 1s infinite;
    animation: down2 1s infinite
}

.mouse-scroll-3 {
    -webkit-animation: down 1s infinite;
    animation: down 1s infinite
}

@-webkit-keyframes down {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(2em);
        transform: translateY(2em)
    }
}

@keyframes down {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(2em);
        transform: translateY(2em)
    }
}

@-webkit-keyframes down2 {
    40% {
        opacity: 0
    }
    100% {
        opacity: .5;
        -webkit-transform: translateY(2em);
        transform: translateY(2em)
    }
}

@keyframes down2 {
    40% {
        opacity: 0
    }
    100% {
        opacity: .5;
        -webkit-transform: translateY(2em);
        transform: translateY(2em)
    }
}

@-webkit-keyframes down3 {
    60% {
        opacity: 0
    }
    100% {
        opacity: .2;
        -webkit-transform: translateY(2em);
        transform: translateY(2em)
    }
}

@keyframes down3 {
    60% {
        opacity: 0
    }
    100% {
        opacity: .2;
        -webkit-transform: translateY(2em);
        transform: translateY(2em)
    }
}

.serviceview_mob {
    position: relative;
    width: 100%;
    padding: 29px 0;
    overflow: hidden;
    margin: 0 9px;
    height: auto;
    display: none
}

.serviceview_mob .linebasemob {
    position: relative;
    background-color: #6864ad;
    height: 2px;
    margin-bottom: 30px
}

.iosdevbx .iosdevinnerbx .midpassline .updrt-line-mob {
    position: absolute;
    right: -1px;
    top: 0;
    bottom: 0;
    width: 2px;
    height: 97px;
    background-color: #6864ad;
    display: none
}

.iosdevbx .iosdevinnerbx .midpassline .updrt-line-mob.left {
    right: auto;
    left: 0;
    height: 126.5px;
    top: -126.5px
}

.iosdevbx .iosdevinnerbx .midpassline .updrt-line-mob.left .wdmn {
    position: absolute;
    border-top: 2.5px solid #6864ad;
    top: 0;
    left: 0;
    width: 20px;
    height: 2px
}

.iosdevbx .iosdevinnerbx .midpassline .updrt-line-mob.last {
    height: 96.5px
}

.iosdevbx .iosdevinnerbx .midpassline.left.mob {
    left: -21px;
    right: auto;
    display: none
}

#section4,
#section7 {
    background-color: #fff
}

.section #section3 {
    background: #eaf1f9
}

#section6 {
    background-color: #eaf1f9
}

.fa.showmob {
    color: #96d942;
    margin: 0 5px;
    display: none;
    font-size: 17px
}

.dropdown-menu.servicemenu {
    min-width: 760px;
    left: -210px;
    border: 3px solid rgba(182, 182, 183, .38);
    margin: 0;
    padding: 0;
    background: #fff;
    border-radius: 0;
    outline-offset: -4px
}

.nav.headermenu>li:hover ul.dropdown-menu {
    top: 100%
}

.dropdown.custom-dropdown .dropdown-menu {
    left: 0!important;
    width: 265px
}

.navbar-nav.serleft {
    float: none
}

.navbar-nav.serleft>li {
    float: none;
    position: relative
}

.navbar-nav.serleft>li>a {
    font-weight: 300;
    padding: 14px 10px 14px 45px;
    color: #333;
    font-size: 13px;
    position: relative;
    border-bottom: 1px solid #c9c9c9
}

.custom-dropdown li a {
    padding: 14px 10px 14px 20px!important
}

.navbar-nav.serleft>li:hover>a {
    background-color: #6864ae!important;
    color: #fff!important
}

.navbar-nav.serleft .navbar-default .navbar-nav>.active>a,
.navbar-nav.serleft .navbar-default .navbar-nav>.active>a:focus,
.navbar-nav.serleft .navbar-default .navbar-nav>.active>a:hover,
.navbar-nav.serleft>li.active:hover>a,
.navbar-nav.serleft>li.active>a {
    background-color: #6864ae
}

.navbar-nav.serleft>li>a>i.iconbox {
    position: absolute;
    left: 0;
    top: 0;
    width: 36px;
    height: 100%
}

.navbar-nav.serleft>li.active>a>i.iconbox,
.navbar-nav.serleft>li:hover>a>i.iconbox {
    background-color: #00208a
}

.navbar-nav.serleft>li>a>i>span {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 25px;
    height: 25px;
    margin-top: -13px;
    margin-left: -13px;
    background: url(https://codologi.in/images/service-menu-icon.png) no-repeat;
    background-size: 50px
}

.navbar-nav.serleft>li>a>i>span.madev {
    background-position: 0 0
}

.navbar-nav.serleft>li.active>a>i>span.madev,
.navbar-nav.serleft>li:hover>a>i>span.madev {
    background-position: -25px 0
}

.navbar-nav.serleft>li>a>i>span.ipadev {
    background-position: 0 -25px
}

.navbar-nav.serleft>li.active>a>i>span.ipadev,
.navbar-nav.serleft>li:hover>a>i>span.ipadev {
    background-position: -25px -25px
}

.navbar-nav.serleft>li>a>i>span.ipaddev {
    background-position: 0 -50px
}

.navbar-nav.serleft.dropdown-right-menu {
    -webkit-transition: .3s;
    transition: .3s;
    background: #fff;
    top: 0;
    position: absolute;
    left: 121%;
    opacity: 0;
    visibility: hidden;
    z-index: 11;
    width: 100%;
    -webkit-box-shadow: 4px 7px 26px -3px #989898;
    box-shadow: 4px 7px 26px -3px #989898
}

.navbar-nav.serleft.dropdown-right-menu.large-menu li {
    width: 50%!important;
    float: left
}

.navbar-nav.serleft.dropdown-right-menu.large-menu {
    width: 560px
}

.nav.navbar-nav.serleft .right-sub-menu:hover .dropdown-right-menu {
    left: 101%;
    opacity: 1;
    visibility: visible
}

.nav.navbar-nav.serleft .right-sub-menu a img {
    width: 25px;
    position: absolute;
    left: 10px
}

.nav.navbar-nav.serleft .right-sub-menu a:hover img {
    -webkit-filter: brightness(3);
    filter: brightness(3)
}

.navbar-nav>li.custom-dropdown a i {
    margin-right: 10px
}

.custom-dropdown .dropdown-menu {
    padding: 0
}

.contactdetailsbox:after {
    opacity: 0;
    top: 0;
    content: '';
    height: 100%;
    left: -5px;
    background: #fff;
    float: left;
    z-index: 1;
    position: absolute;
    width: 100%
}

.navbar-nav.serleft .right-sub-menu:hover .contactdetailsbox:after {
    opacity: .8
}

.navbar-nav.serleft li:nth-child(10) .dropdown-right-menu,
.navbar-nav.serleft li:nth-child(11) .dropdown-right-menu,
.navbar-nav.serleft li:nth-child(12) .dropdown-right-menu,
.navbar-nav.serleft li:nth-child(13) .dropdown-right-menu,
.navbar-nav.serleft li:nth-child(8) .dropdown-right-menu,
.navbar-nav.serleft li:nth-child(9) .dropdown-right-menu {
    bottom: 0;
    top: auto
}

.navbar-nav.serleft>li.active>a>i>span.ipaddev,
.navbar-nav.serleft>li:hover>a>i>span.ipaddev {
    background-position: -25px -50px
}

.navbar-nav.serleft>li>a>i>span.androiddev {
    background-position: 0 -75px
}

.navbar-nav.serleft>li.active>a>i>span.androiddev,
.navbar-nav.serleft>li:hover>a>i>span.androiddev {
    background-position: -25px -75px
}

.navbar-nav.serleft>li>a>i>span.wearabledev {
    background-position: 0 -100px
}

.navbar-nav.serleft>li.active>a>i>span.wearabledev,
.navbar-nav.serleft>li:hover>a>i>span.wearabledev {
    background-position: -25px -100px
}

.navbar-nav.serleft>li>a>i>span.webdev {
    background-position: 0 -125px
}

.navbar-nav.serleft>li.active>a>i>span.webdev,
.navbar-nav.serleft>li:hover>a>i>span.webdev {
    background-position: -25px -125px
}

.navbar-nav.serleft>li>a>i>span.iotdevapp {
    background-position: 0 -150px
}

.navbar-nav.serleft>li.active>a>i>span.iotdevapp,
.navbar-nav.serleft>li:hover>a>i>span.iotdevapp {
    background-position: -25px -150px
}

.navbar-nav.serleft>li>a>i>span.beaconappdev {
    background-position: 0 -175px
}

.navbar-nav.serleft>li.active>a>i>span.beaconappdev,
.navbar-nav.serleft>li:hover>a>i>span.beaconappdev {
    background-position: -25px -175px
}

.navbar-nav.serleft>li>a>i>span.uiuxappdev {
    background-position: 0 -200px
}

.navbar-nav.serleft>li.active>a>i>span.uiuxappdev,
.navbar-nav.serleft>li:hover>a>i>span.uiuxappdev {
    background-position: -25px -200px
}

.navbar-nav.serleft>li>a>i>span.digitalmark {
    background-position: 0 -224px
}

.navbar-nav.serleft>li.active>a>i>span.digitalmark,
.navbar-nav.serleft>li:hover>a>i>span.digitalmark {
    background-position: -25px -224px
}

.navbar-nav.serleft>li>a>i>span.menusoft {
    background-position: 0 -244px
}

.navbar-nav.serleft>li.active>a>i>span.menusoft,
.navbar-nav.serleft>li:hover>a>i>span.menusoft {
    background-position: -25px -244px
}

.navbar-nav.serleft>li>a>i>span.saleforceicnav {
    background-position: 0 -267px
}

.navbar-nav.serleft>li.active>a>i>span.saleforceicnav,
.navbar-nav.serleft>li:hover>a>i>span.saleforceicnav {
    background-position: -25px -267px
}

.navbar-nav.serleft>li>a>i>span.aidovelopmentnav {
    background-position: 0 -297px
}

.navbar-nav.serleft>li.active>a>i>span.aidovelopmentnav,
.navbar-nav.serleft>li:hover>a>i>span.aidovelopmentnav {
    background-position: -25px -297px
}

.navbar-nav.serleft>li>a>i>span.cryyptdovenav {
    background-position: 0 -324px
}

.navbar-nav.serleft>li.active>a>i>span.cryyptdovenav,
.navbar-nav.serleft>li:hover>a>i>span.cryyptdovenav {
    background-position: -25px -324px
}

.navbar-nav.serleft>li>a>i>span.machinenavic {
    background-position: 0 -348px
}

.navbar-nav.serleft>li.active>a>i>span.machinenavic,
.navbar-nav.serleft>li:hover>a>i>span.machinenavic {
    background-position: -25px -348px
}

.contactdetailsbox {
    padding: 10px
}

.contactdetailsbox h3 {
    font-weight: 400;
    font-size: 20px;
    color: #000;
    text-align: center
}

.contactdetailsbox h4 {
    font-weight: 300;
    font-size: 13px;
    color: #000;
    text-align: center
}

.contactdetailsbox h4.headings {
    font-weight: 400
}

.contactnumbx {
    margin: 15px 0
}

.phoneiconbox {
    background-color: #71af1a;
    position: relative;
    width: 40px;
    height: 40px;
    margin: auto;
    border-radius: 50%
}

.phoneiconbox .fa {
    position: absolute;
    left: 11px;
    top: 9px;
    font-size: 23px;
    color: #fff
}

.phoneiconbox .fa-envelope {
    font-size: 20px
}

.emailskyperow {
    margin: 20px 0
}

.phoneiconbox.email {
    background-color: #fca225
}

.phoneiconbox.skype {
    background-color: #019dd7
}

.phoneiconbox.achive {
    background-color: #e83c2e
}

.phoneiconbox .fa-skype {
    font-size: 21px;
    top: 10px;
    left: 12px
}

.awardsachievementsbx {
    position: relative
}

.achivementlogorow {
    display: table;
    margin: 0 auto;
    overflow: hidden;
    height: auto;
    padding: 10px 0
}

.achivementlogorow .clutch {
    margin-top: 14px
}

.mobileappdevwrap {
    width: 1170px;
    margin: 0 auto;
    padding: 30px 0 0;
    text-align: center
}

.mobileappdevwrap h2 {
    font-weight: 500;
    font-size: 30px;
    color: #333;
    margin: 0;
    text-align: center
}

.includenortxt,
.mob-dev-nor-txt {
    font-weight: 300;
    color: #333;
    font-size: 20px;
    line-height: 32px;
    margin-top: 30px
}

.mobileappdevwrap .contentdevbox {
    position: relative;
    margin-bottom: 60px
}

.mob-dev-nor-txt {
    margin-left: 0
}

.mob-dev-nor-txt p {
    margin-bottom: 20px
}

.includenortxt {
    text-align: center
}

.whychooseusbox {
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #000;
    padding: 60px
}

.whychooseusbox h2 {
    font-size: 30px;
    color: #fff;
    margin: 0 0 20px;
    text-align: center
}

.chooseboxes {
    margin-top: 30px
}

.chooseboxes ul {
    margin: 0;
    padding: 0
}

.chooseboxes ul li {
    float: left;
    width: 25%;
    list-style: none;
    text-align: center
}

.chooseheading {
    font-weight: 400;
    font-size: 18px;
    color: #b6d7f5;
    text-align: center;
    border-right: 1px dashed #8bbbe7;
    border-bottom: 1px dashed #8bbbe7;
    padding: 20px 0
}

.chooseboxes ul li:nth-child(4n) .choosebrandl,
.chooseboxes ul li:nth-child(4n) .chooseheading {
    border-right: 0 dashed #8bbbe7
}

.chooseheading span {
    display: block
}

.chooseboxes ul li i:before {
    color: #b6d7f5;
    font-size: 50px
}

.chooseheading.number {
    font-size: 34px
}

.chooseheading.number span.counter {
    font-size: 34px;
    min-width: 60px;
    display: inline-block
}

.chooseheading.number span,
.nav-tabs.service>li>a {
    font-weight: 400;
    font-size: 18px
}

.choosebrandl {
    padding: 25px 0;
    text-align: center;
    border-right: 1px dashed #8bbbe7
}

.choosebrandl.clt img {
    margin-top: 15px
}

.servicetabsrow {
    padding: 0 80px
}

.nav-tabs.service {
    border: 0
}

.nav-tabs.service>li {
    position: relative;
    width: 12.5%;
    margin-bottom: 0
}

.nav-tabs.service>li>a {
    color: #000;
    margin-right: 0;
    border-radius: 0;
    border: 0;
    text-align: center;
    padding: 108px 0 20px;
    line-height: 20px;
    outline: 0
}

.nav-tabs.service>li>a span {
    position: absolute;
    width: 80px;
    height: 80px;
    top: 0;
    left: 50%;
    margin-left: -40px;
    background-color: #6864ae;
    -webkit-border-top-left-radius: 0;
    -webkit-border-top-right-radius: 40px;
    -webkit-border-bottom-right-radius: 40px;
    -webkit-border-bottom-left-radius: 40px;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    display: block;
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.nav-tabs.service>li>a>span>i,
.nav-tabs.service>li>a>span>span {
    width: 50px;
    height: 50px;
    margin: -25px 0 0 -25px;
    left: 50%;
    position: absolute;
    top: 50%
}

.nav-tabs.service>li>a>span>i,
.service-tabbtn-row .tabsConbtn .buttontabs {
    -moz-transition: all .2s linear;
    -o-transition: all .2s linear;
    -ms-transition: all .2s linear
}

.nav-tabs.service>li>a>span>span {
    background: url(https://codologi.in/images/technology-icons.png) no-repeat;
    background-size: 50px 550px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.nav-tabs.service>li.wearable-technology>a>span>span {
    background: url(https://codologi.in/images/wearable-app-dev-icon.png) no-repeat;
    background-size: 50px 350px
}

.nav-tabs.service>li.wearable-technology>a>span>span.applewatchicon {
    background-position: 0 0
}

.nav-tabs.service>li.wearable-technology>a>span>span.android-wear-ser-icon {
    background-position: 0 -50px
}

.nav-tabs.service>li.active>a span>span,
.nav-tabs.service>li:hover>a span>span {
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg)
}

.nav-tabs.service>li>a span>span.ios-ser-icon {
    background-position: 0 0
}

.nav-tabs.service>li>a>span>span.android-ser-icon {
    background-position: 0 -50px
}

.nav-tabs.service>li>a>span>span.html5-ser-icon {
    background-position: 0 -100px
}

.nav-tabs.service>li>a>span>span.cross-platfrom-ser-icon {
    background-position: 0 -150px
}

.nav-tabs.service>li>a>span>i {
    background: url(https://codologi.in/images/technology-icons.png) no-repeat;
    background-size: 50px 550px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.nav-tabs.service>li.active>a>span>i,
.nav-tabs.service>li:hover>a>span>i {
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg)
}

.nav-tabs.service>li>a>span>i.appletv {
    background-position: 0 -350px
}

.nav-tabs.service>li>a>span>i.androidtvser {
    background-position: 0 -400px
}

.nav-tabs.service>li>a>i.tabtooltip {
    position: absolute;
    width: 28px;
    height: 17px;
    margin-left: -14px;
    left: 50%;
    bottom: 0;
    background: url(https://codologi.in/images/tabtooltip.png) no-repeat;
    background-size: 100% 100%;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    opacity: 0
}

.nav-tabs.service>li.active>a>i.tabtooltip {
    opacity: 1
}

.nav-tabs.service>li.active>a span,
.nav-tabs.service>li:hover>a span {
    background-color: #00208a;
    -webkit-transform: rotate(225deg);
    transform: rotate(225deg)
}

.nav-tabs.service>li:hover a {
    background-color: transparent
}

.nav-tabs.service>li.active>a,
.nav-tabs.service>li.active>a:focus,
.nav-tabs.service>li.active>a:hover {
    border: 0;
    background-color: transparent
}

.servicetabConboxShow {
    background-color: #00208a
}

.tabssertextbox {
    font-weight: 300;
    padding: 30px 80px;
    font-size: 20px;
    line-height: 32px;
    color: #fff
}

.service-tabbtn-row {
    margin: 20px 0;
    text-align: center
}

.service-tabbtn-row .tabsConbtn {
    display: inline-block;
    margin: 0 20px
}

.service-tabbtn-row .tabsConbtn .buttontabs {
    font-weight: 300;
    width: 180px;
    height: 50px;
    line-height: 46px;
    text-align: center;
    font-size: 20px;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 8px;
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.service-tabbtn-row .tabsConbtn .buttontabs:hover {
    background-color: #fff;
    color: #00208a
}

.service-tabbtn-row.servicemore {
    margin-top: 40px
}

.service-tabbtn-row.servicemore .tabsConbtn .buttontabs {
    color: #00208a;
    border: 2px solid #00208a
}

.service-tabbtn-row.servicemore .tabsConbtn .buttontabs:hover {
    background-color: #00208a;
    color: #fff
}

.ourworkservicebox {
    background-color: #f6f6f6;
    padding: 60px 0
}

.ourworkservicebox h2 {
    font-size: 30px;
    color: #00208a;
    margin: 0;
    text-align: center
}

.chooseheading.number br {
    display: none
}

.nav.headermenu>li>a>span.servicemobiconsh {
    position: absolute;
    width: 24px;
    height: 24px;
    right: 20px;
    top: 50%;
    margin-top: -12px;
    background: url(https://codologi.in/images/down-ser-iconsh.png) no-repeat;
    background-size: 100% 100%;
    -webkit-transition: all .2s linear;
    transition: all .2s linear;
    display: none
}

.client-logo-section {
    width: 100%;
    padding: 0;
    text-align: center;
    overflow: hidden
}

.client-logo-section h4 {
    margin-bottom: 30px;
    color: #000;
    margin-top: 0;
    text-transform: capitalize;
    font-weight: 300
}

.FOOTER-WRAPER {
    width: 100%
}

.client_logo_footer li a {
    cursor: inherit;
    display: inline-block;
    height: 78px
}

.fixed-foot {
    background-color: rgba(0, 0, 0, .5);
    border-bottom-color: #414141;
    border-bottom-width: 2px;
    bottom: 0;
    margin-bottom: 40px;
    display: none
}

.discuss-project a {
    color: #fff;
    font-size: 16px
}

.discuss-project a:hover {
    color: #d7f0ff;
    font-size: 16px
}

.fixed-foot i {
    margin: 0 5px
}

.discuss-project,
.methodology {
    border-left-color: #3f3f40;
    border-left-style: solid;
    border-left-width: 1px;
    border-right-color: #3f3f40;
    border-right-style: solid;
    border-right-width: 1px;
    color: #7c7c7c;
    float: left;
    padding: 11px 25px
}

.methodology a {
    color: #fff;
    font-size: 16px
}

.methodology a:hover {
    color: #d7f0ff
}

.footer {
    background: url(https://codologi.in/images/world-map.png) center 520px no-repeat #25272a;
    padding: 40px 0 0;
    position: relative;
    background-size: 510px
}

.contact .info_2 a,
.contact .local,
.contact .skype,
.line,
.newsSubmit li input[type=button],
.newsSubmit li input[type=text],
.socialIcon li a {
    background-attachment: scroll;
    background-clip: border-box;
    background-origin: padding-box
}

.contact .phone,
.copy_fotter,
.line,
.socialIcon li a {
    background-size: auto auto
}

.footer h5 {
    text-transform: capitalize;
    font-size: 18px;
    font-weight: 700
}

.contact h3,
.footer_heading {
    font-size: 16px;
    margin: 20px 0
}

.contact ul {
    margin: 0;
    padding: 0
}

.contact li a {
    color: #777;
    font-size: 14px;
    line-height: 25px
}

.contact .phone {
    background-position-x: left;
    background-position-y: center;
    margin: 14px 0 0 20px
}

.contact .info_2 a,
.contact .local,
.contact .skype {
    background-color: rgba(0, 0, 0, 0);
    background-position-x: left;
    background-position-y: center;
    background-size: auto auto;
    margin: 0 0 0 20px;
    background-repeat: no-repeat
}

.social_icon {
    font-size: 20px;
    text-align: left!important;
    margin: 20px!important;
    padding: 0
}

.FooterAward li,
.client-logos,
.copy_fotter,
.footer_nav_img,
.footer_profile_img,
.homebox,
.tt-animate i {
    text-align: center
}

.social_icon li {
    display: inline-block
}

.social_icon li a {
    color: #337ab7!important;
    font-size: 20px!important;
    padding: 2px
}

.social_icon li a:hover {
    color: #777!important
}

.line {
    background-color: transparent;
    background-image: url(https://codologi.in/images/aristotle_footer_hz-divider.png);
    background-position-x: center;
    background-position-y: 56px;
    background-repeat: no-repeat;
    padding-top: 5px;
    z-index: 3
}

.copy_fotter,
.socialIcon li a {
    background-repeat: repeat
}

.location1 {
    width: 260px
}

.location2 {
    width: 200px
}

.location3,
.location4 {
    width: 300px
}

.copy_fotter {
    color: #9fa4af;
    font-size: 14px;
    width: 100%;
    float: left;
    /*margin-top: 25px;*/
    padding: 10px 0
}

.services_nav address,
.services_nav ul li,
.services_nav ul li a {
    font-size: 14px;
    font-weight: 300
}

.newsSubmit li input[type=text],
.socialIcon li a {
    background-color: rgba(0, 0, 0, 0);
    background-position-x: 0
}

.services_nav address,
.services_nav h2,
.services_nav ul li,
.services_nav ul li a {
    color: #9fa4af;
    letter-spacing: .5px
}

.footer_contact h2,
.hdwd_thumb .hdwd_text h3,
.services_nav h2,
.services_nav ul li,
.services_nav ul li a,
.services_nav ul li a:hover,
.services_nav ul li:hover a {
    color: #0328d2
}

.services_nav h2 {
    display: block
}

.services_nav address {
    font-style: normal;
    margin: 0;
    line-height: 25px;
    padding: 3px 0
}

.services_nav ul {
    display: inline-block;
    padding: 0
}

.services_nav ul li {
    font-style: normal;
    margin: 5px 0 0;
    padding: 0
}

.services_nav ul li a:hover {
    color: #fff;
    font-weight: 300
}

.socialIcon {
    padding-left: 0;
    margin: 10px 0 20px
}

.socialIcon li {
    display: inline-block!important;
    margin-right: 10px
}

.socialIcon li a {
    cursor: pointer;
    display: block;
    height: 35px;
    -webkit-transition-property: all;
    transition-property: all;
    width: 35px;
    padding: 0
}

.newsSubmit li input[type=button],
.newsSubmit li input[type=text] {
    background-image: none;
    background-repeat: repeat;
    background-size: auto auto;
    -moz-border-bottom-colors: none;
    border-image-repeat: stretch stretch;
    border-image-source: none
}

.socialIcon li a.facebook {
    background-position-x: 0;
    background-position-y: -40px
}

.socialIcon li a.facebook:hover {
    background-position-x: 0;
    background-position-y: -80px
}

.socialIcon li a.twitter {
    background-position-x: -45px;
    background-position-y: -40px
}

.socialIcon li a.twitter:hover {
    background-position-x: -45px;
    background-position-y: -80px
}

.socialIcon li a.googlePlus {
    background-position-x: -90px;
    background-position-y: -40px
}

.socialIcon li a.googlePlus:hover {
    background-position-x: -90px;
    background-position-y: -80px
}

.socialIcon li a.linkedIn {
    background-position-x: -135px;
    background-position-y: -40px
}

.socialIcon li a.linkedIn:hover {
    background-position-x: -135px;
    background-position-y: -80px
}

.socialIcon li a.pinterst {
    background-position-x: -180px;
    background-position-y: -40px
}

.socialIcon li a.pinterst:hover {
    background-position-x: -180px;
    background-position-y: -80px
}

#newsletter_email {
    color: #020100!important;
    font-size: 13px!important;
    height: 29px!important;
    line-height: 24px!important;
    width: 160px;
    padding: 1px 0 0 5px!important
}

.newsSubmit li input[type=text] {
    background-position-y: center;
    border-radius: 0
}

.newsSubmit li input[type=button] {
    background-position-y: 0;
    background-position-x: 0;
    background-color: #636363;
    color: #fff;
    font-size: 13px;
    height: 29px;
    letter-spacing: normal;
    text-transform: uppercase;
    border: 0;
    width: 100%
}

.newsSubmit li {
    float: left;
    list-style: none;
    margin: 3px 0
}

.footer_profile_img {
    width: 100%;
    float: left
}

.footer_profile_img img {
    height: 95px;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    float: none
}

.footer_profile_img a img:hover {
    -webkit-animation: bounce .4s;
    animation: bounce .4s
}

@-webkit-keyframes bounce {
    0%,
    100%,
    20%,
    60%,
    80% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    40% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }
}

@keyframes bounce {
    0%,
    100%,
    20%,
    60%,
    80% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    40% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }
}

.footer_nav_img img {
    margin: 0 auto
}

.FooterAward,
.FooterAward li {
    display: inline-block;
    padding: 0;
    margin: 0;
    list-style: none
}

.FooterAward li {
    float: none;
    width: 150px
}

.width85 img {
    width: 85px!important
}

.FooterAward {
    width: 100%
}

.footer_contact h2:before,
.services_nav h2:before {
    background: #fff;
    bottom: -12px;
    content: "";
    height: 2px;
    width: 40px;
    left: 0
}

.footer_contact h2,
.services_nav h2 {
    margin-bottom: 40px;
    font-weight: 300;
    font-size: 20px;
    color: #fff;
    text-transform: capitalize
}

.footer .wpcf7-response-output {
    position: absolute;
    top: 30px
}

.services_nav h2 {
    position: relative
}

.services_nav h2:before {
    position: absolute
}

.footer_contact h2 {
    position: relative;
    display: inherit
}

.footer_contact h2:before {
    position: absolute
}

.border_line,
.border_line li {
    width: 100%;
    float: left
}

.services_nav ul li {
    color: #9fa4af
}

.services_nav ul li a {
    color: #9fa4af;
    -webkit-transition: .3s;
    transition: .3s
}

.border_line li {
    margin: 0!important;
    padding: 0!important
}

.border_line li a {
    display: block;
    padding: 11px 0
}

.border_line li a:hover {
    padding: 11px 5px;
    -webkit-transition: all .5s;
    transition: all .5s
}

.Newsletters_sec .form-control {
    height: 40px;
    border: 1px solid #fff;
    font-weight: 500;
    font-size: 14px;
    padding: 0 76px 0 15px
}

.Newsletters_sec form {
    position: relative;
    width: 400px;
    margin: 0 auto
}

.Newsletters_sec .form-group input[type=email] {
    color: #fff;
    background-color: transparent;
    width: 100%;
    float: left;
    border-radius: 3px
}

.Newsletters_sec .form-group input::-webkit-input-placeholder {
    color: #fff
}

.Newsletters_sec .form-group input::-moz-placeholder {
    color: #fff
}

.Newsletters_sec .form-group input:-ms-input-placeholder {
    color: #fff
}

.Newsletters_sec .input-field input::-webkit-input-placeholder {
    color: #626262
}

.Newsletters_sec .input-field input::-moz-placeholder {
    color: #626262
}

.Newsletters_sec .input-field input:-ms-input-placeholder {
    color: #626262
}

.Newsletters_sec .form-group button {
    float: left;
    width: 40px;
    background: #fff;
    border: 1px solid transparent;
    height: 40px;
    border-radius: 0;
    color: #171921;
    position: absolute;
    right: 0;
    top: 0
}

.Newsletters_sec .form-group button i {
    width: 100%;
    height: 100%;
    line-height: 36px
}

.tt-animate i {
    overflow: hidden;
    -webkit-transition: all .5s;
    transition: all .5s
}

.tt-animate i:before {
    speak: none;
    display: block;
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden
}

.tt-animate.ltr i:hover:before {
    -webkit-animation: LeftToRight .3s forwards;
    animation: LeftToRight .3s forwards
}

.tt-animate.ltr i:before {
    -webkit-animation: RightToLeft .3s forwards;
    animation: RightToLeft .3s forwards
}

.tt-animate.btt i:hover:before {
    -webkit-animation: BottomToTop .3s forwards;
    animation: BottomToTop .3s forwards
}

.tt-animate.btt i:before {
    -webkit-animation: TopToBottom .3s forwards;
    animation: TopToBottom .3s forwards
}

@-webkit-keyframes LeftToRight {
    49% {
        -webkit-transform: translate(100%)
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(-100%)
    }
    51% {
        opacity: 1
    }
}

@keyframes LeftToRight {
    49% {
        -webkit-transform: translate(100%);
        transform: translate(100%)
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(-100%);
        transform: translate(-100%)
    }
    51% {
        opacity: 1
    }
}

@-webkit-keyframes RightToLeft {
    49% {
        -webkit-transform: translate(100%)
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(-100%)
    }
    51% {
        opacity: 1
    }
}

@keyframes RightToLeft {
    49% {
        -webkit-transform: translate(100%)
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(-100%)
    }
    51% {
        opacity: 1
    }
}

@-webkit-keyframes BottomToTop {
    49% {
        -webkit-transform: translateY(-100%)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(100%)
    }
    51% {
        opacity: 1
    }
}

@keyframes BottomToTop {
    49% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
    51% {
        opacity: 1
    }
}

@-webkit-keyframes TopToBottom {
    49% {
        -webkit-transform: translateY(-100%)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(100%)
    }
    51% {
        opacity: 1
    }
}

@keyframes TopToBottom {
    49% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
    51% {
        opacity: 1
    }
}

.footer_contact .social-link {
    margin-bottom: 0
}

.footer_contact .social-link li {
    display: inline-block;
    background: 0 0;
    border-radius: 2px;
    margin-right: 3px;
    border: 1px solid;
    color: #fff
}

.footer_contact .social-link li a i {
    display: block;
    width: 35px;
    line-height: 37px;
    text-align: center;
    color: #fff
}

.footer_contact .social-link li a i:hover {
    color: #333;
    background: #fff
}

.menu-top ul li a,
.rounded-btn {
    text-decoration: none!important
}

.Newsletters_sec {
    margin-top: 15px
}

.table {
    display: table;
    width: 100%;
    height: 100%;
    table-layout: fixed;
    margin: 0
}

.table-cell {
    display: table-cell;
    vertical-align: middle;
    width: 50%
}

@media only screen and (max-width:991px) {
    #header .container-fluid {
        padding: 0 30px;
        border-bottom: none!important
    }
    .table,
    .table-cell {
        display: block;
        width: 100%
    }
    .linkContainer svg {
        width: 25px;
        float: left;
        margin-right: 15px
    }
    .mobilecompanyList {
        padding: 30px 30px 0
    }
    .globalNav .popup a {
        line-height: 30px
    }
    .globalNav .mobileSignIn,
    .globalNav li .mobilecompanyList {
        width: 100%;
        float: left
    }
    .globalNav .documentationArticles {
        display: inline-block!important
    }
    .globalNav .documentationArticles>ul {
        width: 100%!important
    }
    .mobilecompany h4 {
        padding: 10px 20px
    }
}

.software-development-txt {
    padding: 60px 20px!important
}

.purpleText {
    color: #3f51b5
}

.skyblueBg {
    background-color: #d4edff
}

.skyblueText {
    color: #19e1ff
}

.whiteBg {
    background-color: #3f51b5
}

.whiteText {
    color: #fff!important
}

.blackText {
    color: #000
}

.text111 {
    color: #111
}

.lightGreyBg {
    background-color: #f5f2fb
}

.rounded-btn {
    border-radius: 100px;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 500;
    padding: 10px 30px;
    display: inline-block;
    color: #444040
}

.rounded-btn:hover {
    background: #b7b929;
    color: #fff;
    -webkit-transition: all .3s;
    transition: all .3s
}

.btn-circle-icon {
    border-radius: 100px;
    width: 44px;
    height: 44px;
    padding: 0;
    font-size: 20px;
    line-height: 44px
}

.btn-circle-icon:hover,
.rounded-btn:hover {
    color: rgba(255, 255, 255, .8)
}

@media only screen and (max-width:991px) {
    .rounded-btn {
        font-size: 14px
    }
}

.header-nsf {
    margin: 0;
    border: none;
    height: 80px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.header-nsf .inquire-now {
    margin: 8px 0 7px
}

.header-nsf .inquire-now:hover {
    color: #fff
}

.menu-left ul li a.active,
.menu-top ul li a:hover {
    color: #19e1ff
}

.header-nsf .col-md-6 {
    padding-top: 10px;
    padding-bottom: 10px;
    height: 80px
}

.header-nsf .col-md-6:last-child {
    padding-right: 0
}

.navbar-fixed-top.header-nsf {
    top: -90px
}

.menu,
.navbar-fixed-top.header-nsf.active {
    top: 0
}

.header-nsf .menu-btn {
    width: 80px;
    height: 100%;
    font-size: 0;
    float: right;
    margin-left: 10px;
    -webkit-transition: .4s;
    transition: .4s
}

.header-nsf .menu-btn:hover:after {
    width: 100%
}

.header-nsf .menu-btn span {
    height: 3px;
    width: 27px;
    display: inline-block;
    margin: 3px;
    -webkit-transition: all .3s;
    transition: all .3s
}

.menu,
.menu-top {
    -webkit-transition: all .6s
}

.menu {
    position: fixed;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1029;
    -webkit-transition: all .6s;
    transition: all .6s;
    padding-top: 80px;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    background-color: #3f51b5!important
}

.menu.active {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.header-nsf .menu-btn.active span {
    opacity: 0
}

.header-nsf .menu-btn.active span:first-child {
    opacity: 1;
    -webkit-transform: rotate(45deg) translate(0, 13px);
    transform: rotate(45deg) translate(0, 13px)
}

.header-nsf .menu-btn.active span:last-child {
    opacity: 1;
    -webkit-transform: rotate(-45deg) translate(0, -13px);
    transform: rotate(-45deg) translate(0, -13px)
}

body.active-menu {
    overflow-y: hidden
}

.menu-left ul,
.menu-right>div {
    overflow: auto;
    max-height: calc(100vh - 160px)
}

.active-menu .header-nsf {
    background: 0 0
}

.menu-top {
    position: absolute;
    right: 390px;
    top: -100px;
    opacity: 0;
    -webkit-transition: all .6s;
    transition: all .6s
}

.active-menu .menu-top {
    top: 30px;
    opacity: 1
}

.menu-top ul {
    list-style: none;
    padding: 0;
    font-size: 0;
    margin: 0
}

.menu-top ul li {
    display: inline-block;
    border-right: 1px solid #fff
}

.menu-top ul li:last-child {
    border: none
}

.menu-top ul li a {
    padding: 0 30px;
    display: block;
    font-size: 18px
}

.menu-left ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.menu-left ul li {
    -webkit-transition: all .6s;
    transition: all .6s;
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
    opacity: 0
}

.menu-left ul li:nth-child(1) {
    -webkit-transition-delay: .6s;
    transition-delay: .6s
}

.menu-left ul li:nth-child(2) {
    -webkit-transition-delay: .8s;
    transition-delay: .8s
}

.menu-left ul li:nth-child(3) {
    -webkit-transition-delay: 1s;
    transition-delay: 1s
}

.menu-left ul li:nth-child(4) {
    -webkit-transition-delay: 1.2s;
    transition-delay: 1.2s
}

.menu-left ul li:nth-child(5) {
    -webkit-transition-delay: 1.4s;
    transition-delay: 1.4s
}

.menu-left ul li:nth-child(6) {
    -webkit-transition-delay: 1.6s;
    transition-delay: 1.6s
}

.menu-left ul li:nth-child(7) {
    -webkit-transition-delay: 1.8s;
    transition-delay: 1.8s
}

.menu-left ul li a {
    font-size: 30px;
    padding: 15px 45px 15px 15px;
    display: block;
    position: relative
}

.menu-left ul li a.active:after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    width: 0;
    height: 0;
    border-color: transparent #fff transparent transparent;
    border-width: 10px;
    border-style: solid;
    margin-top: -10px
}

.menu.active .menu-left ul li {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1
}

.menu-right {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    padding: 30px;
    background: #fff
}

.menu.active .menu-right {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.menu-right ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.menu-right ul li {
    width: 32%;
    display: inline-block
}

.menu-right ul li.title {
    width: 100%!important
}

.menu-right ul li.title a {
    font-size: 24px;
    text-decoration: underline
}

.menu-right ul li.title a i {
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    font-size: 24px
}

.menu-right .work-menu ul li {
    width: 49%
}

.menu-right ul li a {
    font-size: 18px;
    display: block;
    padding: 15px
}

.menu-right ul li a span {
    display: block
}

.menu-right ul .title .purpleText,
.menu-right ul .title .purpleText i {
    color: #3f51b5
}

.menu-right ul .title:hover .purpleText i {
    color: #333
}

.menu-right ul li a i {
    display: block;
    font-size: 50px;
    margin-bottom: 5px;
    color: #3f51b5
}

.menu-right ul li a {
    color: #333;
    text-decoration: none!important
}

.menu-right ul li a:hover {
    color: #5f5c5c
}

.menu-left ul li a:hover {
    color: rgba(255, 255, 255, .8);
    text-decoration: none
}

.menu-right ul li.responsive-appear:first-child,
.menu-right>div {
    display: none
}

@media only screen and (max-width:1024px) {
    .menu-right ul li {
        width: 49%
    }
    #Career-slide {
        background-attachment: scroll!important;
        background-size: cover!important
    }
}

@media only screen and (max-width:991px) {
    .menu-right {
        position: absolute;
        top: 80px;
        padding: 0;
        z-index: 1
    }
    .menu-top ul li {
        margin-bottom: 20px
    }
    .menu-left ul li a {
        font-size: 20px
    }
    .menu-right>div {
        height: calc(100vh - 80px)
    }
    .menu-right ul li.responsive-appear:first-child {
        width: 100%;
        padding: 15px;
        display: block
    }
}

.menu-responsive-bottom {
    display: none
}

.home-banner-text .banner-cryptocurrency-development {
    text-align: right
}

@media only screen and (max-width:1024px) {
    .menu {
        padding-bottom: 80px
    }
    .menu-top {
        display: none
    }
    .menu-responsive-bottom.menu-top {
        display: block;
        bottom: 28px;
        top: auto;
        right: auto;
        width: 100%;
        text-align: center;
        white-space: nowrap;
        overflow: auto
    }
    .menu-right {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
    .menu.active .menu-right {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@media only screen and (min-width:992px) and (max-width:1100px) {
    .navbar-fixed-top.header-nsf .rounded-btn {
        font-size: 16px
    }
}

@media only screen and (max-width:991px) {
    .inquire-now {
        display: none
    }
    .header-nsf .menu-btn {
        height: 80px
    }
    .header-nsf {
        background: #4500b7
    }
    .header-nsf .col-md-6.purpleBg {
        width: 170px
    }
    .header-nsf .col-md-6.col-xs-5 {
        width: calc(100% - 170px);
        padding-right: 75px;
        padding-top: 20px
    }
    .header-responsive {
        width: 40%!important;
        padding-right: 75px;
        padding-top: 20px
    }
}

nav#header {
    display: none
}

#header .navbar .dropdown-menu>li>a {
    -webkit-transition: .3s;
    transition: .3s
}

#header .navbar .dropdown-menu .tree-toggle:hover,
#header .navbar .dropdown-menu .tree-toggle:hover li a:hover:after,
#header .navbar .dropdown-menu li a:hover,
.mega-dropdown-menu ul .inner-menu>li:hover:after {
    color: #0879f4
}

.top_nav_icon .nav-btn {
    padding-top: 15px;
    padding-bottom: 15px;
    background: #d4edff;
    border-radius: 100%;
    width: 55px;
    height: 55px;
    margin-right: 10px;
    margin-top: 5px;
    display: inline-block;
    text-align: center
}

.top_nav_icon .nav-btn img {
    width: 29px!important
}

a.menu-btn.text-center.nav-btn.active {
    padding-left: 18px
}

.menu-right ul li.title a:hover {
    color: #333
}

.about-menu ul li a img {
    width: 70px
}

.industries_sec {
    padding: 40px 0
}

.industries_sec .heading_title {
    text-align: center;
    margin-bottom: 15px
}

.industries_sec .heading_title h2 {
    font-size: 36px;
    color: #186ca5;
    font-weight: 300
}

.industries_sec .heading_title p {
    font-size: 18px;
    color: #353535;
    font-weight: 300;
    margin: 14px 0 0
}

.industries_sec p {
    font-size: 18px;
    color: #353535;
    font-weight: 300;
    text-align: center;
    line-height: 30px
}

.industries_sec .container {
    height: 520px;
    max-width: inherit;
    padding: 0;
    position: relative;
    margin: 0 auto
}

.industries_sec .animation-slide-links {
    bottom: -370px;
    left: 0;
    position: absolute;
    right: 0
}

.animation-slide-links .ani-link:after {
    background-color: #ccc;
    border: 1px solid #ccc;
    bottom: 0;
    content: "";
    height: 300px;
    left: 100%;
    margin-left: -1px;
    position: absolute;
    width: 2px
}

.industries_sec .ani-link1,
.industries_sec .ani-link10,
.industries_sec .ani-link2,
.industries_sec .ani-link3,
.industries_sec .ani-link4,
.industries_sec .ani-link5,
.industries_sec .ani-link6,
.industries_sec .ani-link8,
.industries_sec .ani-link9 {
    height: 312px!important
}

.animation-slide-links .ani-link.ani-link2 {
    bottom: 177px;
    left: 135px;
    width: 100px
}

.animation-slide-links .ani-link.ani-link3 {
    bottom: 116px;
    left: 258px;
    width: 100px
}

.animation-slide-links .ani-link.ani-link4 {
    bottom: 77px;
    left: 415px;
    width: 100px
}

.animation-slide-links .ani-link.ani-link5 {
    bottom: 203px;
    left: 542px;
    width: 86px
}

.animation-slide-links .ani-link.ani-link6 {
    bottom: 82px;
    left: 675px;
    width: 137px
}

.industries_sec .ani-link7 {
    height: 312px!important;
    display: none
}

.animation-slide-links .ani-link.ani-link7 {
    bottom: 199px;
    left: 703px;
    width: 130px
}

.animation-slide-links .ani-link.ani-link8 {
    bottom: 70px;
    left: 855px;
    width: 114px
}

.animation-slide-links .ani-link.ani-link9 {
    bottom: 155px;
    left: 1010px;
    width: 130px
}

.animation-slide-links .ani-link.ani-link10 {
    bottom: 104px;
    right: 0;
    width: 100px
}

.animation-slide-links .ani-link.ani-link1 {
    bottom: 79px;
    left: 11px;
    width: 100px
}

.animation-slide-links .ani-link {
    height: 0;
    position: absolute;
    -webkit-transition: all .5s ease 0;
    transition: all .5s ease 0
}

.industries_sec .fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}

.industries_sec ani-link i {
    height: 15px;
    width: 15px
}

.animation-slide-links .ani-link i {
    border-radius: 100%;
    height: 0;
    left: 50%;
    margin-left: -7px;
    position: absolute;
    top: -14px;
    -webkit-transition: all .5s ease 0;
    transition: all .5s ease 0;
    width: 0
}

.industries_sec .zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn
}

.delay2 {
    -webkit-animation-delay: .5s;
    animation-delay: .5s
}

.industries_sec .ani-link a {
    opacity: 1
}

.animation-slide-links .ani-link a {
    bottom: 100%;
    font-weight: 500;
    margin-bottom: 25px;
    padding-bottom: 3px;
    position: absolute;
    text-align: center;
    color: #000;
    font-size: 18.5px!important;
    text-decoration: none
}

.delay3 {
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.animated3>img {
    margin-bottom: 1rem
}

.animation-slide-links .ani-link a:hover {
    color: #000
}

.animation-slide-links .ani-link>a:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #f26c4f;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all .3s ease-in-out 0;
    transition: all .3s ease-in-out 0
}

.animation-slide-links .ani-link>a:hover:before {
    visibility: visible;
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.mobile-device {
    text-align: center
}

.made-para {
    margin-bottom: 10rem;
    padding: 0 8rem
}

.bottom-industries-sec {
    position: absolute;
    bottom: -340px;
    left: 0;
    right: 0
}

.top-industries-sec span {
    margin-top: 6px;
    display: block;
    font-size: 14px;
    font-weight: 300
}

.animation-slide-links .ani-link1 i {
    background-color: #f26c4f;
    height: 15px;
    width: 15px;
    top: 107px
}

.animation-slide-links .ani-link.ani-link2 i {
    background-color: #4fc6f2;
    height: 15px;
    width: 15px;
    top: 105px
}

.animation-slide-links .ani-link.ani-link3 i {
    background-color: #4ff29c;
    height: 15px;
    width: 15px;
    top: 105px;
    left: 64px
}

.animation-slide-links .ani-link.ani-link4 i {
    background-color: #bef24f;
    height: 15px;
    width: 15px;
    top: 105px
}

.animation-slide-links .ani-link.ani-link5 i {
    background-color: #7d4ff2;
    height: 15px;
    width: 15px;
    top: 105px;
    left: 48px
}

.animation-slide-links .ani-link.ani-link6 i {
    background-color: #4ff2f0;
    height: 15px;
    width: 15px;
    top: 105px
}

.animation-slide-links .ani-link.ani-link7 i {
    background-color: #944ff2;
    height: 15px;
    width: 15px;
    top: 120px
}

.animation-slide-links .ani-link.ani-link8 i {
    background-color: #4ff289;
    height: 15px;
    width: 15px;
    top: 105px;
    left: 56px
}

.animation-slide-links .ani-link.ani-link9 i {
    background-color: #f2ab4f;
    height: 15px;
    width: 15px;
    top: 105px;
    left: 67px
}

.animation-slide-links .ani-link.ani-link10 i {
    background-color: #4f6af2;
    height: 15px;
    width: 15px;
    top: 105px
}

.animation-slide-links .ani-link.ani-link1>a:before {
    bottom: -4px;
    background-color: #f26c4f
}

.animation-slide-links .ani-link.ani-link2>a:before {
    bottom: -4px;
    background-color: #4fc6f2
}

.animation-slide-links .ani-link.ani-link3>a:before {
    bottom: -4px;
    background-color: #4ff29c;
    left: 15px
}

.animation-slide-links .ani-link.ani-link4>a:before {
    bottom: -4px;
    background-color: #bef24f
}

.animation-slide-links .ani-link.ani-link5>a:before {
    bottom: -4px;
    background-color: #7d4ff2
}

.animation-slide-links .ani-link.ani-link6>a:before {
    bottom: -4px;
    background-color: #4ff2f0
}

.animation-slide-links .ani-link.ani-link7>a:before {
    bottom: -2px;
    background-color: #944ff2
}

.animation-slide-links .ani-link.ani-link8>a:before {
    bottom: -4px;
    background-color: #4ff289
}

.animation-slide-links .ani-link.ani-link9>a:before {
    bottom: -4px;
    background-color: #f2ab4f;
    left: 18px
}

.animation-slide-links .ani-link.ani-link10>a:before {
    bottom: 7px;
    background-color: #4f6af2;
    left: 21px
}

.industries-image {
    background: url(https://codologi.in/images/industries-image-sprit.png) no-repeat;
    width: 100px;
    height: 70px;
    -webkit-transition: all .5s;
    transition: all .5s;
    margin: auto
}

#return-to-top,
.right-menu .contacts .contacts-item .content .title {
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease
}

.Marketplace_industries {
    background-position: -30px -18px
}

.ani-link:hover .Marketplace_industries {
    background-position: -30px -118px
}

.animation-slide-links .ani-link.ani-link1:hover:after {
    background-color: #f26c4f;
    border: 1px solid #f26c4f
}

.Education_industries {
    background-position: -130px -8px
}

.ani-link:hover .Education_industries {
    background-position: -130px -110px
}

.animation-slide-links .ani-link.ani-link2:hover:after {
    background-color: #4fc6f2;
    border: 1px solid #4fc6f2
}

.Restaurant_industries {
    background-position: -208px -15px
}

.ani-link:hover .Restaurant_industries {
    background-position: -208px -115px
}

.animation-slide-links .ani-link.ani-link3:hover:after {
    background-color: #4ff29c;
    border: 1px solid #4ff29c
}

.animation-slide-links .ani-link.ani-link3 .top-industries-sec span {
    position: relative;
    left: 14px
}

.Dating_industries {
    background-position: -324px -10px
}

.ani-link:hover .Dating_industries {
    background-position: -324px -110px
}

.animation-slide-links .ani-link.ani-link4:hover:after {
    background-color: #bef24f;
    border: 1px solid #bef24f
}

.News_industries {
    background-position: -424px -8px
}

.ani-link:hover .News_industries {
    background-position: -424px -110px
}

.animation-slide-links .ani-link.ani-link5:hover:after {
    background-color: #7d4ff2;
    border: 1px solid #7d4ff2
}

.Fitness_industries {
    background-position: -525px -10px
}

.ani-link:hover .Fitness_industries {
    background-position: -525px -110px
}

.animation-slide-links .ani-link.ani-link6:hover:after {
    background-color: #4ff2f0;
    border: 1px solid #4ff2f0
}

.Networking_industries {
    background-position: -625px -15px
}

.ani-link:hover .Networking_industries {
    background-position: -625px -117px
}

.animation-slide-links .ani-link.ani-link7:hover:after {
    background-color: #944ff2;
    border: 1px solid #944ff2
}

.E_Commerce_industries {
    background-position: -724px -10px
}

.ani-link:hover .E_Commerce_industries {
    background-position: -724px -110px
}

.animation-slide-links .ani-link.ani-link8:hover:after {
    background-color: #4ff289;
    border: 1px solid #4ff289
}

.Real_Estate_industries {
    background-position: -803px -15px
}

.ani-link:hover .Real_Estate_industries {
    background-position: -803px -120px
}

.animation-slide-links .ani-link.ani-link9:hover:after {
    background-color: #f2ab4f;
    border: 1px solid #f2ab4f
}

.Health_Care_industries {
    background-position: -920px -20px
}

.ani-link:hover .Health_Care_industries {
    background-position: -920px -120px
}

.animation-slide-links .ani-link.ani-link10:hover:after {
    background-color: #4f6af2;
    border: 1px solid #4f6af2
}

.animation-slide-links .ani-link.ani-link9 span {
    position: relative;
    left: 17px
}

.animation-slide-links .ani-link.ani-link1:after {
    height: 235px;
    top: 0;
    bottom: auto
}

.animation-slide-links .ani-link.ani-link3:after {
    left: 114px;
    top: 0;
    height: 240px
}

.animation-slide-links .ani-link.ani-link4:after {
    height: 240px;
    top: 0
}

.animation-slide-links .ani-link.ani-link5:after {
    left: 92px;
    top: 0;
    height: 230px
}

.animation-slide-links .ani-link.ani-link6:after {
    top: 0;
    height: 240px
}

.animation-slide-links .ani-link.ani-link7:after {
    top: 0;
    height: 250px
}

.animation-slide-links .ani-link.ani-link8:after {
    top: 0;
    left: 114px;
    height: 200px
}

.animation-slide-links .ani-link.ani-link9:after {
    left: 133px
}

.animation-slide-links .ani-link.ani-link10:after {
    top: 0;
    left: 120px;
    height: 240px
}

.bottom-industries-sec {
    background: url(https://codologi.in/images/industries-image-sprit.png) no-repeat;
    width: 130px;
    height: 110px;
    margin: auto;
    z-index: 9
}

.sports.sports-txt {
    position: relative;
    right: -19px
}

.bottom_market_industries {
    background-position: -55px -367px
}

.ani-link:hover .bottom_market_industries {
    background-position: -55px -687px
}

.bottom_Education_industries {
    background-position: -197px -267px;
    height: 220px;
    width: 100px;
    bottom: -444px
}

.ani-link:hover .bottom_Education_industries {
    background-position: -197px -587px
}

.bottom_Restaurant_industries {
    background-position: -325px -320px;
    height: 160px;
    width: 130px;
    bottom: -376px
}

.ani-link:hover .bottom_Restaurant_industries {
    background-position: -325px -640px
}

.bottom_Dating_industries {
    background-position: -483px -375px
}

.ani-link:hover .bottom_Dating_industries {
    background-position: -483px -695px
}

.bottom_News_industries {
    background-position: -622px -247px;
    height: 290px;
    bottom: -520px
}

.ani-link:hover .bottom_News_industries {
    background-position: -622px -567px
}

.bottom_Fitness_industries {
    background-position: -747px -369px
}

.ani-link:hover .bottom_Fitness_industries {
    background-position: -747px -689px
}

.bottom_Networking_industries {
    background-position: -882px -251px;
    height: 290px;
    bottom: -520px
}

.ani-link:hover .bottom_Networking_industries {
    background-position: -882px -571px
}

.bottom_E_Commerce_industries {
    background-position: -1047px -329px;
    height: 160px
}

.ani-link:hover .bottom_E_Commerce_industries {
    background-position: -1047px -648px;
    height: 160px
}

.bottom_Real_Estate_industries {
    background-position: -1210px -310px;
    height: 170px;
    width: 145px;
    bottom: -416px
}

.ani-link:hover .bottom_Real_Estate_industries {
    background-position: -1210px -630px
}

.bottom_Health_Care_industries {
    background-position: -1390px -310px;
    height: 170px;
    width: 145px;
    bottom: -366px
}

.ani-link:hover .bottom_Health_Care_industries {
    background-position: -1390px -630px
}

.animation-slide-links .ani-link.ani-link10 .top-industries-sec {
    position: relative;
    left: 20px;
    top: -10px
}

.industries_sec .ripenerswrap {
    position: relative;
    height: 100%;
    width: 100%
}

.side-social-icons a:hover:before {
    color: #fff
}

.side-social-icons a.Facebook:hover:before {
    background: #3a589b;
    border-color: #3a589b
}

.side-social-icons a.Twitter:hover:before {
    background: #598dca;
    border-color: #598dca
}

.side-social-icons a.LinkedIn:hover:before {
    background: #007ab9;
    border-color: #007ab9
}

.side-social-icons a.Google.Plus:hover:before {
    background: #d6492f;
    border-color: #d6492f
}

.side-social-icons a.behance:hover:before {
    background: #045cfc;
    border-color: #045cfc
}

.side-social-icons a.pinterest:hover:before {
    background: #d01d15;
    border-color: #d01d15
}

.side-social-icons a.skype:hover:before {
    background: #2dc6ff;
    border-color: #2dc6ff
}

.side-social-icons a.github:hover:before {
    background: #00405d;
    border-color: #00405d
}

.side-social-icons a.youtube:hover:before {
    background: #e64a41;
    border-color: #e64a41
}

.side-social-icons a.Facebook:before {
    content: "\f09a"
}

.side-social-icons a.Twitter:before {
    content: "\f099"
}

.side-social-icons a.LinkedIn:before {
    content: "\f0e1"
}

.side-social-icons a.Google.Plus:before {
    content: "\f0d5"
}

.side-social-icons a.pinterest:before {
    content: "\f0d2"
}

.side-social-icons a.behance:before {
    content: "\f1b4"
}

.side-social-icons a.skype:before {
    content: "\f17e"
}

.side-social-icons a.github:before {
    content: "\f113"
}

.side-social-icons a.youtube:before {
    content: "\f167"
}

.right-menu .logo {
    position: relative;
    overflow: hidden;
    margin-bottom: 35px;
    margin-top: 0
}

.right-menu .logo img {
    float: left;
    width: 150px;
    height: auto
}

.right-menu .contacts {
    padding: 10px 25px;
    background-color: #fff;
    display: block
}

.right-menu .contacts .contacts-title {
    font-size: 24px;
    margin-bottom: 20px;
    font-weight: 700;
    margin-top: 10px;
    color: #2f2c2c
}

.right-menu .contacts .contacts-item {
    margin-bottom: 20px;
    display: block
}

.right-menu .contacts .contacts-item img {
    float: left;
    margin: auto 30px auto auto
}

.right-menu .contacts .contacts-item .content {
    overflow: hidden
}

.right-menu .contacts .contacts-item .content .title {
    font-size: 18px;
    color: #4f4f50;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    font-weight: 500
}

.right-menu .contacts .contacts-item .content .sub-title {
    font-size: 14px;
    color: #333;
    margin-bottom: 0
}

.right-menu .contacts .contacts-item .content .title:focus,
.right-menu .contacts .contacts-item .content .title:hover {
    color: #4cc2c0;
    text-decoration: none
}

.right-menu .side_frm {
    padding: 10px 25px;
    background-color: #fff;
    display: block
}

.right-menu .side_frm .contacts-title {
    font-size: 24px;
    margin-bottom: 20px;
    font-weight: 700;
    margin-top: 10px
}

.side_frm form input[type=submit].btn-primary {
    box-shadow: 0 0 0 4px #00208a;
    -webkit-box-shadow: 0 0 0 4px #00208a;
    -moz-box-shadow: 0 0 0 4px #00208a;
    -ms-box-shadow: 0 0 0 4px #00208a;
    border: 1px solid #fff;
    background: #00208a;
    position: relative;
    overflow: hidden;
    color: #fff
}

.side_frm form input[type=submit].btn {
    display: inline-block;
    font-weight: 700;
    text-transform: uppercase;
    margin: 4px;
    padding: 15px 40px;
    text-decoration: none;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    -ms-border-radius: 0;
    transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out
}

.side_frm form input[type=submit] {
    border: none;
    display: inline-block
}

.side_frm form input,
.side_frm form textarea,
.side_frm from select {
    font-size: 13px;
    border: 1px solid #ccc;
    padding: 7px 10px;
    border-radius: 4px;
    width: 100%;
    margin-bottom: 20px;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    background: #fff;
    color: #333
}

.mobile-menu--open .overlay-right-menu {
    display: block
}

.overlay-right-menu {
    content: "";
    position: fixed;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    left: 0;
    right: 0;
    bottom: 0;
    opacity: .8;
    top: 0;
    z-index: 99;
    background: #290d51;
    width: 100%;
    height: 100%;
    display: none
}

.endf,
.right-menu {
    position: relative
}

.right-menu {
    z-index: 991;
    height: 100%;
    -webkit-overflow-scrolling: touch;
    overflow: scroll;
    background: #fff
}

.mobile-nav-button.color-change {
    border: 2px solid #333
}

.mobile-nav-button.color-change .mobile-nav-button__line {
    background: #333
}

.mobile-nav-button.color-change .width01 {
    width: 24px;
    right: 10px;
    top: 18px
}

.mobile-nav-button.color-change .width03 {
    width: 50%;
    right: 10px;
    top: 18px
}

.endf {
    text-align: center;
    top: -2px
}

.endf img {
    width: 23px
}

.servicewrap .nomore .btn-primary.nmore {
    font-weight: 400;
    background-color: transparent;
    padding: 10px 19px!important;
    font-size: 12px;
    border: 2px solid #fff;
    color: #fff;
    border-radius: 2px;
    -webkit-transition: all .2s linear;
    transition: all .2s linear;
    margin: 35px 0
}

.servicewrap .nomore .btn-primary.nmore:hover {
    border: 2px solid #5448c1;
    background-color: #5448c1;
    color: #fff
}

.nomore .btn-primary.nmore .glyphicon-menu-righ:before {
    font-size: 11px;
    position: relative;
    top: 3px!important
}

.swing {
    -webkit-animation: swing ease-in-out 1s infinite alternate;
    animation: swing ease-in-out 1s infinite alternate;
    -webkit-transform-origin: center -20px;
    transform-origin: center -20px;
    float: left;
    padding-top: 100px;
    position: absolute;
    right: 20px;
    top: 0;
    -webkit-transition: all .7s;
    transition: all .7s
}

.user-menu:hover .swing {
    display: block
}

.swing:after {
    content: '';
    width: 2px;
    height: 70px;
    background: #fff;
    top: 64px;
    left: 48%;
    position: absolute;
    z-index: 9
}

.contactHeadwrap:after,
.team2-img:before {
    content: ""
}

#ourTechnology #myTab li.active a,
.about-greetingwrap,
.swing a,
.team2-img {
    position: relative
}

.swing a {
    text-align: center;
    color: #fff;
    font-size: 15px;
    font-weight: 300;
    padding-top: 31px;
    width: 100px;
    height: 100px;
    border-radius: 100px;
    background: #77c157;
    -webkit-animation: colorchange 5s;
    animation: colorchange 5s;
    z-index: 99;
    display: inline-block;
    text-decoration: none
}

@-webkit-keyframes swing {
    0% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg)
    }
    100% {
        -webkit-transform: rotate(-3deg);
        transform: rotate(-3deg)
    }
}

@keyframes swing {
    0% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg)
    }
    100% {
        -webkit-transform: rotate(-3deg);
        transform: rotate(-3deg)
    }
}

@keyframes colorchange {
    0%,
    100% {
        background: red
    }
    25% {
        background: #00208a
    }
    50% {
        background: #00f
    }
    75% {
        background: green
    }
}

@-webkit-keyframes colorchange {
    0%,
    100% {
        background: red
    }
    25% {
        background: #00208a
    }
    50% {
        background: #00f
    }
    75% {
        background: green
    }
}

.owl-item:nth-child(2) {
    baclkground: url(https://codologi.in/images/ban_bg-4.jpg) no-repeat;
    background-size: cover
}

.owl-item:nth-child(3) {
    backgground: url(https://codologi.in/images/ban_bg-5.jpg) no-repeat;
    background-size: cover
}

.owl-item:nth-child(4) {
    backggound: url(https://codologi.in/images/ban_bg-6.jpg) no-repeat;
    backgrkound-size: cover
}

.owl-item:nth-child(5) {
    backgrougnd: url(https://codologi.in/images/ban_bg-7.jpg) no-repeat;
    bagckground-size: cover
}

.owl-item:nth-child(6) {
    backgroungd: url(https://codologi.in/images/ban_bg-8.jpg) no-repeat;
    background-size: cover
}

#scroll-wrapper .owl-carousel .owl-stage-outer {
    background: url(https://codologi.in/images/ban_bg-4.jpg) no-repeat;
    background-size: cover
}

#ourTechnology #myTab {
    width: 100%;
    margin: 0 auto;
    display: block;
    text-align: center;
    border-bottom: 0;
    z-index: 1;
    overflow: hidden;
    padding: 10px 0 0
}

#ourTechnology #myTab li,
#ourTechnology #myTab li.active a:before {
    margin-bottom: 0!important
}

#ourTechnology .tab-content {
    z-index: 999
}

#ourTechnology .nav>li>a {
    padding: 10px 3px!important
}

.livedemo_s .nav>li>a {
    background-color: transparent!important
}

#ourTechnology #myTab li {
    width: 20%;
    display: inline-block;
    text-align: center;
    border: none;
    float: none;
    vertical-align: top;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

#ourTechnology .techIcon,
#ourTechnology .techIcon i {
    color: #fff;
    width: 70px;
    height: 70px;
    line-height: 70px;
    text-align: center
}

#ourTechnology #myTab li a {
    border: none
}

#ourTechnology .techIcon {
    background: #333;
    border-radius: 999px 999px 999px 0;
    -moz-border-radius: 999px 999px 999px 0;
    -webkit-border-radius: 999px 999px 999px 0;
    display: inline-block;
    -webkit-transition-duration: .8s;
    transition-duration: .8s;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-property: transform, -webkit-transform;
    transition-property: transform, -webkit-transform
}

#ourTechnology .techIcon i {
    font-size: 30px;
    -webkit-transition-duration: .8s;
    transition-duration: .8s;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-property: transform, -webkit-transform;
    transition-property: transform, -webkit-transform
}

#ourTechnology #myTab li .techIcon:hover,
#ourTechnology #myTab li.active .techIcon {
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg)
}

#ourTechnology #myTab li .techIcon:hover i,
#ourTechnology #myTab li.active .techIcon i {
    -webkit-transform: rotate(-315deg);
    transform: rotate(-315deg)
}

#ourTechnology #myTab li .techTitle {
    text-align: center;
    color: #545050;
    padding: 15px 0 5px;
    font-size: 16px;
    font-weight: 500
}

#ourTechnology #collapse-myTab .techTitle {
    display: inline-block;
    font-size: 20px;
    padding-left: 20px;
    text-decoration: underline;
    text-decoration: none
}

#ourTechnology #myTab li.tabC1 a:before {
    border-bottom: 10px solid #02a4ca
}

#ourTechnology #myTab li.tabC2 a:before {
    border-bottom: 10px solid #74a52e
}

#ourTechnology #myTab li.tabC3 a:before {
    border-bottom: 10px solid #456cba
}

#ourTechnology #myTab li.tabC4 a:before {
    border-bottom: 10px solid #d24280
}

#ourTechnology #myTab li.tabC5 a:before {
    border-bottom: 10px solid #fc3c3c
}

#ourTechnology #myTab li.tabC6 a:before {
    border-bottom: 10px solid #e58a08
}

#ourTechnology #myTab li.tabC7 a:before {
    border-bottom: 10px solid #974f8d
}

#ourTechnology .tab-pane {
    text-align: center;
    padding: 30px 0
}

#collapse-myTab .panel-collapse h3,
#ourTechnology .tab-pane h3 {
    text-align: center;
    color: rgba(255, 255, 255, 1);
    font-size: 44px;
    margin: 0;
    font-weight: 300
}

#collapse-myTab .panel-collapse p,
#ourTechnology .tab-pane p {
    text-align: center;
    width: 72%;
    margin: 30px auto;
    color: #fff;
    display: block;
    font-size: 16px;
    height: 62px;
    line-height: 22px;
    font-weight: 300
}

#ourTechnology .thisTechno {
    text-align: center
}

#ourTechnology .thisTechno ul {
    display: block;
    list-style-type: none;
    padding: 0
}

#ourTechnology .thisTechno li {
    text-align: center;
    color: #fff;
    display: inline-block;
    margin: 0 10px;
    font-weight: 300
}

#ourTechnology .thisTechno li a {
    color: rgba(255, 255, 255, 1);
    font-size: 14px;
    margin-bottom: 20px;
    display: inherit;
    letter-spacing: .5px
}

#ourTechnology .thisTechno li a:focus,
#ourTechnology .thisTechno li a:hover {
    text-decoration: none;
    color: #ececec
}

#ourTechnology .thisTechno li a:hover .fa {
    color: rgba(255, 255, 255, 1)
}

#ourTechnology .thisTechno li a i.fa {
    display: block;
    font-size: 32px;
    text-align: center;
    margin-bottom: 15px
}

#ourTechnology .thisTechnoLink {
    padding: 10px 0 5px;
    text-align: center
}

#ourTechnology .thisTechnoLink .btn {
    border: 2px solid rgba(255, 255, 255, 1);
    padding: 15px 30px;
    line-height: 1;
    color: #fff;
    font-size: 21px;
    text-transform: capitalize;
    border-radius: 30px;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    margin: 20px 5px 0;
    font-weight: 300
}

#ourTechnology .thisTechnoLink .btn i {
    margin-right: 10px
}

#ourTechnology .thisTechnoLink .btn:hover {
    border-color: rgba(0, 0, 0, 5);
    color: rgba(0, 0, 0, 5);
    background: rgba(255, 255, 255, 1)
}

#ourTechnology .tabC1 .thisTechnoLink .btn:hover,
#ourTechnology .tabC2 .thisTechnoLink .btn:hover,
#ourTechnology .tabC3 .thisTechnoLink .btn:hover,
#ourTechnology .tabC4 .thisTechnoLink .btn:hover,
#ourTechnology .tabC5 .thisTechnoLink .btn:hover,
#ourTechnology .tabC6 .thisTechnoLink .btn:hover,
#ourTechnology .tabC7 .thisTechnoLink .btn:hover {
    border-color: rgba(255, 255, 255, .5);
    background: rgba(255, 255, 255, 1)
}

#ourTechnology .tabC1 .thisTechnoLink .btn:hover {
    color: #02a4ca
}

#ourTechnology .tabC2 .thisTechnoLink .btn:hover {
    color: #74a52e
}

#ourTechnology .tabC3 .thisTechnoLink .btn:hover {
    color: #456cba
}

#ourTechnology .tabC4 .thisTechnoLink .btn:hover {
    color: #d24280
}

#ourTechnology .tabC5 .thisTechnoLink .btn:hover {
    color: #fc3c3c
}

#ourTechnology .tabC6 .thisTechnoLink .btn:hover {
    color: #e58a08
}

#ourTechnology .tabC7 .thisTechnoLink .btn:hover {
    color: #974f8d
}

#ourTechnology #collapse-myTab .tabC1 .panel-collapse,
#ourTechnology .tab-pane.tabC1,
#ourTechnology .tabC1 .techIcon {
    background: #02a4ca
}

#ourTechnology #collapse-myTab .tabC2 .panel-collapse,
#ourTechnology .tab-pane.tabC2,
#ourTechnology .tabC2 .techIcon {
    background: #74a52e
}

#ourTechnology #collapse-myTab .tabC3 .panel-collapse,
#ourTechnology .tab-pane.tabC3,
#ourTechnology .tabC3 .techIcon {
    background: #456cba
}

#ourTechnology #collapse-myTab .tabC4 .panel-collapse,
#ourTechnology .tab-pane.tabC4,
#ourTechnology .tabC4 .techIcon {
    background: #d24280
}

#ourTechnology #collapse-myTab .tabC5 .panel-collapse,
#ourTechnology .tab-pane.tabC5,
#ourTechnology .tabC5 .techIcon {
    background: #fc3c3c
}

#ourTechnology #collapse-myTab .tabC6 .panel-collapse,
#ourTechnology .tab-pane.tabC6,
#ourTechnology .tabC6 .techIcon {
    background: #e58a08
}

#ourTechnology #collapse-myTab .tabC7 .panel-collapse,
#ourTechnology .tab-pane.tabC7,
#ourTechnology .tabC7 .techIcon {
    background: #974f8d
}

#ourTechnology #collapse-myTab .accordion-toggle .techIcon {
    float: left;
    margin-left: -60px
}

#ourTechnology #collapse-myTab .accordion-toggle .techTitle {
    display: block;
    line-height: 60px;
    font-weight: 700;
    color: rgba(162, 162, 162, 1)
}

#ourTechnology #collapse-myTab .panel-heading {
    padding: 0 30px 0 80px;
    text-align: right
}

#ourTechnology #collapse-myTab .techIcon,
#ourTechnology #collapse-myTab .techIcon i {
    line-height: 60px;
    height: 60px;
    width: 60px;
    border-radius: 999px
}

.btn.active,
.btn:active {
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, .125);
    box-shadow: inset 0 0 0 rgba(0, 0, 0, .125)
}

.faX {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    display: block;
    height: 40px;
    width: 40px;
    margin: 0 auto 12px
}

.about-greetingwrap {
    background: url(https://codologi.in/images/hiredeveloper.jpg) center center no-repeat fixed;
    background-clip: initial;
    background-color: rgba(0, 0, 0, 0);
    background-origin: initial;
    background-size: cover;
    z-index: 0;
    padding: 100px 0
}

.about-greetingwrap .txtboxg {
    padding: 50px;
    background: rgba(30, 11, 83, .88);
    border-radius: 2px;
    float: right;
    position: relative;
    z-index: 1;
    -webkit-transition: all .3s ease 0;
    transition: all .3s ease 0;
    height: 100vh;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column
}

.team2-content span,
.team2-text span {
    display: inline-block;
    font-weight: 300
}

.about-greetingwrap.greetingwrap .greetingCon .txtboxg .aboutripens-ntext,
.about-greetingwrap.greetingwrap .greetingCon .txtboxg h3 {
    color: #fff
}

.about-greetingwrap.greetingwrap .greetingCon .txtboxg h3 .leftline1 .linewd21,
.about-greetingwrap.greetingwrap .greetingCon .txtboxg h3 .leftline1 .linewd51,
.about-greetingwrap.greetingwrap .greetingCon .txtboxg span.drlinet {
    background-color: #fff
}

.team2-area {
    padding: 60px 0 30px;
    margin-bottom: 50px
}

.team2-area h2 {
    font-size: 30px;
    color: #00208a;
    margin: 0;
    padding: 10px 0;
    text-align: center;
    text-transform: capitalize
}

.team2-area .service_line_blue {
    margin: 10px auto 20px
}

.team2-wrapper {
    -webkit-box-shadow: 0 4px 9px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 4px 9px 0 rgba(0, 0, 0, .15);
    margin-bottom: 30px
}

.team2-img {
    border-bottom: 1px solid rgba(204, 204, 204, .45)
}

.team2-img:before,
.team2-text {
    position: absolute;
    opacity: 0;
    left: 0
}

.team2-img:before {
    background: #000;
    height: 100%;
    top: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all .3s ease 0;
    transition: all .3s ease 0;
    width: 100%
}

.team2-content,
.team2-inner,
.team2-text {
    -webkit-transition: .3s;
    transition: .3s
}

.team2-img>img {
    width: 100%;
    height: 260px;
    -o-object-fit: cover;
    object-fit: cover
}

.team2-text {
    right: 0;
    text-align: center;
    top: 20%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.team2-text h4 {
    color: #fff;
    font-size: 20px;
    font-weight: 300;
    line-height: 1;
    margin-bottom: 0
}

.team2-text span {
    color: #fff;
    font-size: 14px
}

.team2-inner {
    padding: 10px 0 15px;
    position: relative
}

.team2-content h4 {
    color: #222;
    font-size: 20px;
    font-weight: 300;
    line-height: 1;
    margin-bottom: 10px
}

.team2-content span {
    color: #666;
    font-size: 14px
}

.team2-wrapper:hover .team2-text {
    opacity: 1;
    top: 50%
}

.team2-wrapper:hover .team2-img:before {
    opacity: .7;
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.contactHeadwrap {
    background-repeat: no-repeat;
    background-size: cover;
    height: 50vh!important;
    position: relative
}

.contactHeadwrap:after {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    background: rgba(40, 36, 71, .65)
}

.contactHeadwrap .mobileappdevCon {
    position: relative;
    z-index: 99
}

.contactHeadwrap .text-center {
    padding: 90px 0 0
}

.contactHeadwrap .text-center h2 {
    color: #fff
}

.contactHeadwrap .text-center p {
    color: #fff;
    font-size: 17px;
    margin-top: 15px
}

.design-app-development .app_txt_info {
    font-weight: 300;
    color: #fff;
    font-size: 20px;
    line-height: 32px;
    text-align: center
}

.carsome {
    background: url(https://codologi.in/images/carsome.jpg) no-repeat;
    background-size: cover
}

.portfolioappContentbx .applogorw .applogo {
    float: left;
    height: 50px;
    background: url(https://codologi.in/images/carsome.png) no-repeat;
    background-size: 140px;
    width: 32%;
    vertical-align: middle
}

.portfolioappContentbx .applogorw .appnm .appnm_title {
    font-size: 38px;
    text-transform: uppercase;
    line-height: 60px;
    color: #fff
}

.portfolioappContentbx .applogorw .appnm .appnm_title.subtitle {
    margin-top: 8px;
    font-weight: 700;
    line-height: normal
}

.portfolioappContentbx .applogorw .appnm .appsubtitle {
    font-weight: 300;
    color: #9fe3f7;
    font-size: 20px;
    line-height: 32px;
    margin-top: 5px
}

.iwaboo {
    background: url(https://codologi.in/images/iwaboo.jpg) no-repeat;
    background-size: cover
}

.portfolioappContentbx .applogo-d {
    width: 240px;
    float: left;
    background-color: #fff;
    text-align: center;
    padding: 10px 20px;
    background-position: center;
    margin-right: 20px;
    border-radius: 5px
}

.portfolioappContentbx .applogo-d img {
    height: 60px;
    width: 180px;
    -o-object-fit: contain;
    object-fit: contain
}

.portfolioappContentbx .applogorw .iwaboologo {
    float: left;
    height: 50px;
    background: url(https://codologi.in/images/iwaboo.png) center no-repeat #fff;
    background-size: 140px;
    width: 24%;
    vertical-align: middle;
    text-align: center;
    margin-right: 20px;
    border-radius: 5px
}

.appstlinksrw .stdsbx .comingsoon:hover {
    background-color: transparent;
    color: #fff
}

.appstlinksrw .stdsbx .comingsoon.casewd {
    width: 190px
}

.home-banner-text {
    position: absolute;
    z-index: 999;
    bottom: 0;
    width: 90%;
    left: 0;
    right: 0;
    margin: auto;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.bs-slider .bs-slider-overlay.cryptocurrency-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .38)
}

.home-banner-text h1 {
    font-size: 48px;
    color: #fff;
    margin-bottom: 20px;
    letter-spacing: -2px;
    text-transform: capitalize
}

.home-banner-text h2 {
    font-size: 25px;
    color: #fff;
    padding: 20px 0;
    letter-spacing: -1px
}

.home-banner-text p {
    line-height: 34px;
    color: #ccc;
    font-size: 18px;
    margin-bottom: 50px
}

.banner-mobile-development {
    text-align: center
}

.banner-mobile-development img {
    width: auto;
    height: auto;
    max-width: 80%
}

.banner-cryptocurrency-development img {
    width: auto!important;
    height: auto;
    max-width: 100%
}

.home-banner-text .btn-default {
    color: #333;
    border-color: #f0f4f7;
    background-color: #f0f4f7;
    padding: 11px 40px;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: capitalize;
    font-weight: 700;
    border-radius: 40px
}

.home-banner-text .btn-default:hover:active {
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-box-shadow: 0 -15px 50px rgba(223, 232, 238, .1);
    box-shadow: 0 -15px 50px rgba(223, 232, 238, .1)
}

.mobile-sub .quote-btn a {
    background: #0b5ba0;
    border-radius: 50px!important;
    color: #fff;
    text-transform: capitalize;
    font-weight: 700;
    padding: 0 25px;
    letter-spacing: 1px
}

.mobile-sub .quote-btn a:hover {
    background: #f0f4f7;
    color: #6673d6;
    -webkit-transition: all .5s ease 0;
    transition: all .5s ease 0
}

.overflow_hid {
    overflow: hidden
}

.footer-sec .hcontactwrapx {
    background: #0b0e0f
}

.portfolio .footer {
    padding: 90px 0 20px
}

.portfolio .leftmenusl {
    display: none
}

.page-template-Contact .formbx .wpcf7-mail-sent-ok {
    width: 40%;
    position: relative;
    right: 0;
    margin: 0 auto;
    text-align: center;
    top: -50px
}

.right-menu .side_frm textarea {
    height: 50px
}

form .form-group .margin-auto div {
    margin: 0 auto;
    text-align: center
}

#developer-hire {
    position: relative;
    overflow: hidden;
    background: url(https://codologi.in/images/hire_developer.jpg) no-repeat fixed!important;
    background-size: cover!important;
    -moz-background-size: cover!important;
    -webkit-background-size: cover!important;
    -o-background-size: cover!important
}

#salesforceservices {
    position: relative;
    background: url(https://codologi.in/images/salesforce.jpg) fixed!important;
    background-size: cover!important;
    z-index: -1;
    overflow: hidden
}

#salesforceservices .section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100vh
}

#beauty-well:before,
#casestudy:before,
#salesforceservices:before,
.inner-slide:before {
    content: '';
    width: 100%;
    height: 100%;
    background: rgba(14, 81, 182, .8);
    position: absolute;
    top: 0;
    left: 0
}

#beauty-well .container,
#casestudy .container,
#salesforceservices .container,
.inner-slide .container,
.yoga-sec .container {
    z-index: 10;
    position: relative
}

#developer-hire .dev-title h1 span {
    color: #fff
}

#developer-hire .dev-title h1 {
    margin: 0;
    position: relative;
    font-weight: 700;
    font-size: 58px;
    text-transform: capitalize;
    color: #fff;
    padding-bottom: 0
}

#developer-hire .service-tabbtn-row {
    text-align: center
}

#developer-hire .devleftCon .dev_ntxt {
    font-size: 16px;
    width: 70%;
    margin: 0 auto
}

#developer-hire .service-tabbtn-row .buttontabs {
    width: 150px;
    height: 42px;
    line-height: 41px;
    text-align: center;
    font-size: 15px;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50px
}

#developer-hire .service-tabbtn-row .buttontabs:hover {
    color: #00208a
}

#developer-hire .techn-pics-bx .developer-icons {
    position: absolute;
    width: 100%;
    z-index: 99;
    bottom: 0;
    top: 20px;
    right: 0;
    left: 0;
    margin: 0 auto;
    text-align: center
}

#developer-hire .developer-icons li {
    width: 6%;
    display: inline-block
}

#developer-hire .techn-pics-bx {
    display: none;
    mix-blend-mode: hard-light
}

#developer-hire .developer-icons li img {
    -webkit-transition: .4s;
    transition: .4s;
    width: 70px;
    top: 100px
}

#developer-hire .mobileappdevCon .devleftCon {
    text-align: center
}

#developer-hire .mobileappdevCon {
    padding-top: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column
}

.developer-heading {
    -webkit-transition: .2s;
    transition: .2s;
    font-weight: 500!important;
    margin: 20px 0;
    border-bottom: 1px dashed;
    display: inline-block;
    padding-bottom: 9px;
    color: #333
}

.developer-heading:hover {
    border-bottom-style: solid
}

.contentdevbox .devleftdes.magento {
    background: url(https://codologi.in/images/icons/magento-bar.png)!important;
    background-size: cover!important
}

.developer-hire .mob-dev-nor-txt {
    font-weight: 300;
    font-size: 14px
}

ul.en-list {
    counter-reset: li;
    margin-left: 0;
    padding-left: 0
}

.dedicated-developer .developer-hire ul.en-list>li {
    width: 47%;
    float: left
}

.developer-hire ul.en-list {
    width: 100%;
    float: left
}

ul.en-list>li {
    position: relative;
    margin: 13px 0 2px 2em;
    padding: 10px 12px;
    list-style: none;
    line-height: 1.8;
    color: #39393b
}

ul.en-list>li:before {
    content: counter(li);
    counter-increment: li;
    position: absolute;
    top: 6px;
    left: -2em;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #fff;
    width: 35px;
    height: 35px;
    line-height: 31px;
    background: #31343b;
    text-align: center;
    -webkit-transition: .3s;
    transition: .3s;
    border: 2px solid transparent;
    font-size: 17px;
    border-radius: 50px
}

.select-block .active-list,
.sidebar-contact,
:after,
:before,
figure.snipbox * {
    -webkit-box-sizing: border-box
}

#salesforce-tabs .nav-tabs>li>a:before,
.cloud:after,
.cloud:before,
.yoga-sec:after {
    content: ''
}

.en-list li ul {
    margin-top: 6px
}

.en-list ul ul li:last-child {
    margin-bottom: 0
}

.paragraph>p {
    margin-top: 25px
}

.variety img {
    max-width: 100%
}

.variety .col-md-4 img {
    -webkit-transition: .3s;
    transition: .3s;
    margin-top: 40px;
    width: 150px;
    -webkit-filter: hue-rotate(-40deg);
    filter: hue-rotate(-40deg)
}

.variety {
    padding: 50px 0;
    width: 100%;
    clear: both
}

.variety .col-md-4 {
    margin-top: 30px;
    text-align: center
}

.variety .col-md-4 h4 {
    font-weight: 700;
    color: #333
}

.variety .col-md-4 ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.variety .col-md-4 ul li {
    line-height: 1.8;
    font-size: 14px;
    border-bottom: 1px solid #dcddde;
    margin: 0 20px;
    padding: 8px 0;
    color: #202020
}

.variety .row {
    text-align: center
}

.variety .row>.col-md-4>div:hover {
    background: #fff;
    -webkit-box-shadow: 2px 12px 38px -4px #877ebf;
    box-shadow: 2px 12px 38px -4px #877ebf
}

.variety .row .col-md-4 div:hover img {
    -webkit-transform: translateY(-20px)!important;
    transform: translateY(-20px)!important
}

.button1 {
    -webkit-transition: .3s;
    transition: .3s;
    border: 2px solid transparent;
    background: #00208a;
    margin: 0 auto;
    padding: 16px 25px;
    color: #fff;
    border-radius: 4px;
    text-decoration: none!important;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 1px
}

.button1:hover {
    border-color: #00208a;
    color: #00208a;
    background-color: transparent
}

.variety .row>.col-md-4>div {
    margin-bottom: 30px;
    -webkit-transition: .3s;
    transition: .3s;
    display: flow-root;
    background: #fff;
    width: 100%;
    border-radius: 4px;
    -webkit-box-shadow: 2px 12px 31px -11px #a79fd8;
    box-shadow: 2px 12px 31px -11px #a79fd8;
    padding-bottom: 30px
}

.cloud,
.cloud:after {
    border-radius: 100px
}

.tcolor {
    color: #000!important
}

.mt-40 {
    margin-top: 40px!important
}

.c-magento {
    color: #f0672f
}

.c-php {
    color: #6c7eb7
}

.c-salesforce {
    color: #009ddc
}

.c-web {
    color: #4292dd
}

.c-laravel {
    color: #d74865
}

.c-ci {
    color: #f45c10
}

.c-seo {
    color: #7db8f0
}

.c-ios {
    color: #2fbfbd
}

.c-android {
    color: #9db72e
}

#background-wrap {
    bottom: 0;
    left: 0;
    padding-top: 80px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    mix-blend-mode: overlay;
    width: 100%;
    height: 100%
}

@-webkit-keyframes animateCloud {
    0% {
        margin-left: -1000px
    }
    100% {
        margin-left: 100%
    }
}

@keyframes animateCloud {
    0% {
        margin-left: -1000px
    }
    100% {
        margin-left: 100%
    }
}

.x1 {
    -webkit-animation: animateCloud 35s linear infinite;
    animation: animateCloud 35s linear infinite;
    -webkit-transform: scale(.65);
    transform: scale(.65)
}

.x2 {
    -webkit-animation: animateCloud 20s linear infinite;
    animation: animateCloud 20s linear infinite;
    -webkit-transform: scale(.3);
    transform: scale(.3)
}

.x3 {
    -webkit-animation: animateCloud 30s linear infinite;
    animation: animateCloud 30s linear infinite;
    -webkit-transform: scale(.5);
    transform: scale(.5)
}

.x4 {
    -webkit-animation: animateCloud 18s linear infinite;
    animation: animateCloud 18s linear infinite;
    -webkit-transform: scale(.4);
    transform: scale(.4)
}

.x5 {
    -webkit-animation: animateCloud 25s linear infinite;
    animation: animateCloud 25s linear infinite;
    -webkit-transform: scale(.55);
    transform: scale(.55)
}

.cloud {
    font-size: 40px;
    background: #fff;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(5%, #fff), to(#f1f1f1));
    background: linear-gradient(to top, #fff 5%, #f1f1f1 100%);
    -webkit-box-shadow: 0 8px 5px rgba(0, 0, 0, .1);
    box-shadow: 0 8px 5px rgba(0, 0, 0, .1);
    text-align: center;
    height: 120px;
    position: relative;
    width: 350px
}

.cloud span {
    font-size: 50px;
    font-weight: 700;
    color: #696565;
    letter-spacing: .5px
}

.cloud:after,
.cloud:before {
    background: #fff;
    position: absolute;
    z-index: -1
}

.cloud:after {
    height: 100px;
    left: 50px;
    top: -50px;
    width: 100px
}

.cloud:before {
    border-radius: 200px;
    width: 180px;
    height: 180px;
    right: 50px;
    top: -90px
}

#beauty-well h1,
#casestudy h1,
#salesforceservices h1,
.inner-slide h1 {
    font-size: 50px;
    font-weight: 700;
    color: #fff
}

#casestudy .col-sm-12 span,
#salesforceservices .col-sm-12 span {
    font-size: 22px;
    color: #ced7f6;
    font-weight: 300
}

#beauty-well .col-sm-12 p,
#casestudy .col-sm-12 p,
#salesforceservices .col-sm-12 p,
.inner-slide .col-sm-12 p {
    font-size: 15px;
    color: #fff;
    font-weight: 300;
    line-height: 1.8;
    width: 80%;
    margin: 0 auto
}

.SalesForceKey,
.career-featurebox {
    padding: 100px 0;
    text-align: center;
    line-height: 1.8
}

.SalesForceKey h2,
.career-featurebox h2 {
    font-size: 36px;
    font-weight: 300;
    display: block;
    margin-bottom: 30px
}

.SalesForceKey h2 span,
.career-featurebox h2 span {
    font-weight: 100;
    display: block;
    font-size: 14px;
    margin-top: 10px
}

.SalesForceKey .col-sm-4 h3 {
    -webkit-transition: .4s;
    transition: .4s;
    font-weight: 300;
    color: #4b4790;
    letter-spacing: 1px
}

.SalesForceKey .col-sm-4:hover h3:before {
    width: 40%
}

.SalesForceKey .col-sm-4:hover h3 {
    font-weight: 700
}

.SalesForceKey .col-sm-4 p {
    font-weight: 300;
    color: #292929;
    font-size: 14px
}

#salesforce-tabs h2 {
    font-weight: 800
}

#salesforce-tabs .nav-tabs {
    border-bottom: none
}

#salesforce-tabs .nav-tabs>li {
    margin-top: 30px;
    float: none;
    display: inline-block;
    width: 19%
}

.salesforce-image-block,
.salesforce-image-block .row .col-md-6 {
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column
}

#salesforce-tabs .nav-tabs>li>a {
    -webkit-transition: .3s;
    transition: .3s;
    cursor: pointer;
    border: none;
    color: #3f3747;
    font-weight: 300;
    font-size: 12px;
    padding: 20px 10px
}

#salesforce-tabs .nav-tabs>li>a>.techIcon img {
    -webkit-filter: hue-rotate(33deg) brightness(1);
    filter: hue-rotate(33deg) brightness(1);
    width: 100px
}

#salesforce-tabs {
    overflow: hidden;
    padding: 30px 0 60px;
    min-height: 740px;
    background: #f4f4ff;
    margin-top: 40px
}

#salesforce-tabs .nav-tabs>li.active>a:after {
    -webkit-transition: .3s;
    transition: .3s;
    background: #9e83ba;
    height: 2px;
    width: 100%;
    content: '';
    float: left;
    position: relative;
    bottom: -20px
}

#salesforce-tabs .nav-tabs>li.active>a:before,
#salesforce-tabs .nav-tabs>li.active>a:hover:before {
    top: 100%;
    opacity: 1
}

#salesforce-tabs .nav-tabs>li.active>a {
    -webkit-box-shadow: 0 -4px 20px -4px #a29cc3;
    box-shadow: 0 -4px 20px -4px #a29cc3
}

#salesforce-tabs .nav-tabs>li>a:before {
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #9e83ba;
    -webkit-transition: .3s;
    transition: .3s;
    position: absolute;
    top: 90%;
    opacity: 0;
    left: 0;
    right: 0;
    margin: 0 auto
}

#salesforce-tabs .tab-content .container {
    text-align: center
}

#salesforce-tabs .tab-content .container p {
    max-width: 830px;
    margin: 0 auto;
    line-height: 40px
}

#salesforce-tabs .tab-content .container h3 {
    font-weight: 800;
    color: #322867;
    font-size: 30px;
    margin-top: 40px
}

.industies img,
.salesforce-image-block img {
    max-width: 100%
}

.salesforce-image-block {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.salesforce-image-block .row .col-md-6 {
    line-height: 1.8;
    padding: 95px 75px;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

#beauty-well,
#casestudy,
#casestudy.case-thumb {
    display: -webkit-box;
    display: -ms-flexbox;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    position: relative
}

#casestudy,
#casestudy.case-thumb {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    z-index: -22;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.salesforce-image-block .row .col-md-6 h2 {
    font-weight: 500;
    color: #333435;
    position: relative;
    background: #fff;
    font-size: 50px;
    letter-spacing: 1px;
    text-transform: capitalize
}

.salesforce-image-block .row .col-md-6 p {
    line-height: 31px;
    font-weight: 300
}

.SalesForceKey .hiresection h3 {
    font-weight: 700;
    font-size: 15px
}

.SalesForceKey .hiresection p {
    font-weight: 300;
    font-size: 12px
}

.SalesForceKey .hiresection {
    -webkit-transition: .3s;
    transition: .3s;
    padding: 30px 20px;
    -webkit-box-shadow: 1px 0 1px 0 #f2f2f2;
    box-shadow: 1px 0 1px 0 #f2f2f2;
    height: 350px
}

#beauty-well,
#casestudy,
#casestudy.case-thumb,
.inner-slide {
    height: 100vh!important
}

.SalesForceKey .hiresection img {
    -webkit-transition: .3s;
    transition: .3s;
    -webkit-filter: grayscale(50%);
    filter: grayscale(50%)
}

.SalesForceKey .hiresection:hover {
    -webkit-box-shadow: 0 0 84px -3px #c5c5c5;
    box-shadow: 0 0 84px -3px #c5c5c5
}

.SalesForceKey .hiresection:hover a,
.SalesForceKey .hiresection:hover img {
    opacity: 1;
    -webkit-filter: none;
    filter: none;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.SalesForceKey .hiresection a {
    -webkit-transition: .3s;
    transition: .3s;
    background: #00208a;
    opacity: 0;
    -webkit-transform: scale(.2);
    transform: scale(.2);
    padding: 7px 22px;
    color: #fff;
    letter-spacing: 1px;
    border-radius: 40px;
    font-size: 12px;
    text-transform: uppercase
}

.DedicatedDeveloper {
    background: url(https://codologi.in/images/salesforce_bg.jpg) bottom fixed;
    background-size: cover;
    padding: 170px 0
}

.DedicatedDeveloper h2 {
    color: #fff;
    font-size: 59px;
    font-weight: 800
}

.DedicatedDeveloper p {
    color: #e0dddd;
    max-width: 80%;
    margin: 0 auto;
    line-height: 3;
    font-size: 16px;
    font-weight: 300
}

.DedicatedDeveloper .btn {
    background: #1f1f65;
    padding: 17px 40px;
    color: #fff;
    letter-spacing: .5px;
    font-weight: 700
}

.DedicatedDeveloper .btn:hover {
    background: #3c3c89;
    color: #fff
}

#casestudy {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: url(https://codologi.in/images/casestudy.jpg) fixed!important;
    background-size: cover!important
}

#casestudy.case-thumb {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: url(https://codologi.in/images/casestudy-thumb2.jpg) fixed!important;
    background-size: cover!important
}

#beauty-well {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    background: url(https://codologi.in/images/fitness.jpg) fixed!important;
    background-size: cover!important
}

#Career-slide {
    background: url(https://codologi.in/images/career.gif) top center!important;
    z-index: -22;
    background-size: cover!important
}

.inner-slide,
.our-solution {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background-attachment: fixed!important;
    overflow: hidden;
    position: relative
}

.inner-slide {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.our-solution {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 170px 50px;
    background-size: cover!important;
    height: 100%;
    -webkit-animation-name: nsfbg;
    -webkit-animation-duration: 8s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    animation-name: nsfbg;
    animation-duration: 8s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running
}

@-webkit-keyframes nsfbg {
    0% {
        background-color: #c0d4fa
    }
    33.0% {
        background-color: #fff
    }
    66.0% {
        background-color: #aabad6
    }
    100.0% {
        background-color: #d8dfed
    }
}

@keyframes nsfbg {
    0% {
        background-color: #d8e5ff
    }
    33.0% {
        background-color: #fff
    }
    66.0% {
        background-color: #80a8f2
    }
    100.0% {
        background-color: #d8e5ff
    }
}

.our-solution .inner-box,
.our-solution .inner-box2 {
    margin-bottom: 40px;
    background: #fff;
    -webkit-box-shadow: 0 1px 38px -1px #cac7e6;
    box-shadow: 0 1px 38px -1px #cac7e6
}

.our-solution .inner-box {
    border-radius: 4px;
    width: 620px;
    padding: 39px
}

.our-solution .inner-box h2,
.our-solution .inner-box2 h2 {
    color: #272727;
    font-weight: 800;
    font-size: 33px;
    text-transform: capitalize
}

.our-solution .inner-box p {
    color: #5d5b5b;
    line-height: 1.8;
    text-align: justify;
    font-weight: 300
}

.en-list.en-list-2 li {
    width: 47%;
    float: left;
    display: block
}

.our-solution .inner-box2 {
    max-width: 100%;
    padding: 30px;
    width: 620px
}

.p-t-80 {
    padding-top: 80px!important
}

.p-b-80 {
    padding-bottom: 80px!important
}

.p-t-40 {
    padding-top: 40px!important
}

.p-b-40 {
    padding-bottom: 40px!important
}

h2.client-requirement {
    font-size: 48px;
    font-weight: 700;
    position: relative;
    top: 136px;
    left: -60px;
    color: #3b3b3b
}

.casestudy .en-list li {
    margin: 4px 0 2px 2em
}

.casestudy ul.en-list>li:before {
    width: 31px;
    font-size: 14px;
    top: 7px;
    background: #42414a;
    border-radius: 3px;
    height: 30px;
    line-height: 25px
}

.pl-0 {
    padding-left: 0!important
}

.casestudy ul.en-list>li:hover:before {
    background-color: transparent;
    color: #333;
    border-color: #333
}

.company-overview .overview-text {
    padding: 30px 15px
}

.company-overview .overview-text .review {
    border: 4px double #726aa7;
    text-align: justify;
    background: 0 0;
    padding: 20px;
    display: block;
    font-weight: 300;
    font-size: 17px;
    color: #000
}

.company-overview {
    background: #d5e6fc;
    padding: 70px 0
}

.ripple:focus {
    outline: 0
}

@keyframes ripple {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .3), 0 0 0 3px rgba(255, 255, 255, .3), 0 0 0 3px rgba(255, 255, 255, .3), 0 0 0 10px rgba(255, 255, 255, .3);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, .3), 0 0 0 3px rgba(255, 255, 255, .3), 0 0 0 3px rgba(255, 255, 255, .3), 0 0 0 10px rgba(255, 255, 255, .3)
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .3), 0 0 0 13px rgba(255, 255, 255, .3), 0 0 0 40px rgba(255, 255, 255, 0), 0 0 4px 100px rgba(255, 255, 255, 0);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, .3), 0 0 0 13px rgba(255, 255, 255, .3), 0 0 0 40px rgba(255, 255, 255, 0), 0 0 4px 100px rgba(255, 255, 255, 0)
    }
}

.review-sec {
    float: left;
    background: #00208a;
    padding: 140px 0;
    display: inline-block;
    width: 100%
}

.review-sec .quote-left .avtar {
    mix-blend-mode: luminosity;
    position: relative;
    -webkit-animation: ripple 1.4s linear infinite;
    animation: ripple 1.4s linear infinite;
    -webkit-transition: all .7s ease;
    transition: all .7s ease;
    border-radius: 100%
}

.review-sec .quote-left small {
    margin-bottom: 10px;
    display: inline-block
}

.review-sec .quote-left .quote-intro {
    width: 260px;
    text-align: center;
    background: #fff;
    padding: 30px 0;
    margin: 30px auto 0;
    border-radius: 4px
}

.review-sec .quote-left .quote-intro strong {
    display: block;
    font-size: 21px;
    text-transform: capitalize;
    font-weight: 800
}

.review-sec .quote-right {
    color: #fff;
    font-size: 20px;
    line-height: 43px;
    font-style: italic
}

.review-sec .quote-right img {
    width: 20px
}

.yoga-sec {
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    background-attachment: fixed;
    padding: 50px 0;
    background-size: cover;
    height: 100vh
}

.career-tab .tabcontent ul,
.industies-category ul,
.yoga-sec ul {
    padding: 0;
    list-style: none
}

.yoga-sec:after {
    background: rgba(28, 22, 75, .81);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0
}

.yoga-sec h3 {
    text-align: center;
    color: #fff;
    font-size: 50px;
    margin-bottom: 30px;
    font-weight: 300
}

.career-tab .tabcontent p {
    color: #333
}

.career-tab .tab_en {
    width: 30%;
    margin-top: 40px;
    float: right
}

.career-tab .tabcontent ul li,
.yoga-sec ul li {
    position: relative;
    text-align: justify;
    margin: 20px 35px;
    color: #333;
    font-weight: 300;
    letter-spacing: .3px
}

.career-tab .tabcontent ul li:before,
.yoga-sec ul li:before {
    -webkit-transition: .3s;
    transition: .3s;
    content: "\f101";
    position: absolute;
    left: -15px!important;
    top: 5px;
    font: normal normal normal 14px/1 FontAwesome
}

.career-tab .tabcontent ul li:before,
.yoga-sec ul li:hover:before {
    left: 15px
}

.yoga-sec .animation-3 {
    position: absolute;
    z-index: 9;
    mix-blend-mode: overlay;
    opacity: .5
}

.industies-category ul {
    margin: 50px 0 0
}

.industies-category ul li {
    border: 1px solid #eaeaea;
    -webkit-transition: .3s;
    transition: .3s;
    margin-bottom: 3px;
    cursor: pointer;
    display: inline-block;
    width: 19%;
    padding: 40px 8px
}

.industies-category ul li img {
    width: 40%
}

.industies-category h2 {
    font-weight: 300;
    font-size: 44px
}

.industies-category {
    width: 100%;
    float: left;
    text-align: center;
    padding: 100px 0
}

.industies-category ul li h4 {
    margin: 10px 0 0
}

.industies-category ul li h4 a {
    -webkit-transition: .3s;
    transition: .3s;
    font-weight: 700;
    font-size: 16px;
    color: #333;
    position: relative;
    top: -30px;
    opacity: 0
}

.industies-category ul li:hover h4 a {
    top: 0;
    opacity: 1
}

.industies-category ul li:hover {
    border-color: transparent;
    -webkit-box-shadow: 0 0 40px 0 #d7d1fc;
    box-shadow: 0 0 40px 0 #d7d1fc
}

.ourwork {
    background: #f3f1ff
}

.career-tab {
    float: left;
    width: 100%
}

.career-tab .tablinks {
    display: block;
    color: #333;
    padding: 22px 16px;
    width: 100%;
    outline: 0;
    background: #f2f2f2;
    text-align: left;
    cursor: pointer;
    -webkit-transition: .3s;
    transition: .3s;
    font-size: 16px;
    border: 1px solid #c1c1c1;
    font-weight: 300
}

.career-tab .tablinks:hover {
    background-color: #c1c1c1;
    color: #333
}

.career-tab .tablinks.active {
    /*background-color:#077af4;

    color:#fff;

    border-right:35px solid #2f94ff*/
    background-color: #FF8401;
    color: #fff;
    border-right: 35px solid #FF840
}

.career-tab .tabcontent.active.in {
    display: block
}

.career-tab .tabcontent {
    float: left;
    padding: 30px 50px;
    overflow: auto;
    -webkit-transition: .5s;
    transition: .5s;
    width: 70%;
    border-left: none;
    position: relative;
    color: #fff;
    display: none
}

.section,
.weare {
    overflow: hidden
}

.career-tab .tabcontent p strong {
    font-size: 18px
}

.career-featurebox {
    text-align: center
}

.career-tab .tabcontent h2 {
    color: #333;
    font-size: 40px
}

.career-tab .tabcontent .link a {
    -webkit-transition: .3s;
    transition: .3s;
    padding: 11px 30px;
    right: 20px;
    top: 70px;
    background: #0328d2;
    font-weight: 700;
    color: #fff;
    display: inline-block;
    text-decoration: none;
    border-radius: 2px;
    float: left
}

.career-tab .tabcontent .link a:hover {
    background: #333;
    color: #fff
}

.career-featurebox h6 {
    font-size: 13px;
    position: absolute;
    z-index: -1;
    font-weight: 300;
    padding: 0 30px;
    color: #333
}

.career-featurebox img {
    max-width: 100%;
    -webkit-transition: .2s;
    transition: .2s
}

.career-featurebox .col-sm-4:hover img {
    -webkit-transform: scale(.8) translateY(50px);
    transform: scale(.8) translateY(50px)
}

.career-featurebox .col-sm-4 h3 {
    border-bottom: 1px dashed #333;
    padding-bottom: 16px;
    font-weight: 300;
    letter-spacing: 1px
}

.Great-Place {
    background: #b6b1f7;
    height: 100%;
    float: left;
    width: 100%
}

.Great-Place .custom {
    line-height: 1.8;
    text-align: justify;
    color: #000
}

.aboutwrap.case-study,
.section__description--cta p {
    color: #fff
}

.aboutwrap.case-study,
.case-study-line h2,
.industries_sec .nsfwrap,
.weare {
    text-align: center
}

.Great-Place .custom h2 {
    font-weight: 700;
    margin-top: 25%
}

#Career-slide.inner-slide:before {
    mix-blend-mode: color!important
}

body.career.navbar-default {
    background-color: transparent
}

@media only screen and (min-width:1000px) and (max-width:1480px) {
    .company-overview .overview-text {
        padding: 10px 15px!important
    }
}

body.scrolled #header {
    position: fixed;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 9999;
    top: 0;
    width: 100%
}

.scrolled#header #maintoggle div {
    background: #333
}

.industries-sec img {
    width: 110px
}

.industries-sec h3 {
    padding-bottom: 10px
}

.industries-sec .col-md-4 {
    text-align: center;
    padding: 30px
}

.industries-sec .col-md-4:nth-child(odd) {
    background: #f9f9ff
}

.Hybrid-up-img {
    position: absolute;
    width: 210px;
    left: 50%;
    top: 70%;
    opacity: .6
}

.scrolled .mobile-nav-button {
    margin: 1rem
}

.scrolled a.contactbtnt {
    top: 12px
}

.weare {
    background: #fff;
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    position: relative;
    z-index: 9;
    /*padding: 60px 0*/
}

#portfolio .section .fp-tableCell:after {
    background: #261853;
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 1;
    left: 0;
    opacity: .5
}

#portfolio .section.footer-wrapper .fp-tableCell:after {
    display: none!important
}

.dedicated-developer+.container.paragraph,
.only-mobile,
a.mobile-cont {
    display: none
}

.home .aboutrip .nomore {
    margin-top: 40px
}

.navbar-collapse li.dubble-menu .dropdown-menu {
    width: 500px
}

.navbar-collapse li.dubble-menu .dropdown-menu ul.navbar-nav li {
    width: 50%;
    float: left;
    border-right: 7px solid #fff
}

.navbar-default .navbar-brand,
.user-menu .mobile-nav-button,
a.contactbtnt {
    -webkit-transition: .3s;
    transition: .3s
}

.scrolled .nav.headermenu>li>a {
    line-height: 41px;
    margin-top: 13px
}

.footer_contact .col-sm-6,
.footer_contact .social-link {
    padding: 0;
    float: left;
    width: 100%
}

.hire-new-section {
    padding: 20px 0 30px;
    background: #f2f2f2
}

.hire-new-section img {
    max-width: 100%
}

.hire-new-section .col-md-4 img {
    -webkit-transition: .2s;
    transition: .2s;
    padding: 18px;
    height: 100px;
    background: #f6f5ff;
    -webkit-filter: hue-rotate(-21deg);
    filter: hue-rotate(-21deg)
}

.hire-new-section .col-md-4 p {
    font-weight: 300;
    color: #6c6868
}

.hire-new-section .col-md-4 .box {
    margin-bottom: 40px;
    min-height: 370px;
    padding: 30px 10px;
    background: #fff
}

.hire-new-section .col-md-4 h4 {
    position: relative;
    color: #333;
    font-size: 18px
}

.hire-new-section .col-md-4 .box:hover img {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px)
}

.hire-new-section .col-md-4 .box:hover h4:before {
    opacity: 1;
    bottom: 50px
}

.dedicated-developer .developer-heading,
.dedicated-developer p,
.dedicated-developer ul.en-list>li,
.dedicated-developer ul.en-list>li:before {
    color: #fff
}

.dedicated-developer {
    background: #202026;
    margin: 0;
    padding: 30px 0 50px
}

.dedicated-developer ul.en-list>li {
    width: 47%;
    float: left
}

.client-logo-section .responsiveclient button {
    display: none!important
}

.client-logo-section img {
    height: 70px;
    margin: 0 auto;
    width: 120px;
    -o-object-fit: contain;
    object-fit: contain
}

.history-tl-container {
    margin: auto;
    display: block;
    position: relative
}

.history-tl-container ul.tl {
    margin: 20px 0;
    padding: 0;
    display: inline-block
}

.case-study-line .case-top-img:hover:after {
    -webkit-transform: scale(0);
    transform: scale(0)
}

.col-md-6.case-top-img {
    position: absolute;
    right: -15%;
    width: 67%;
    bottom: 0
}

.case-study-line h2 {
    font-weight: 700
}

.case-study-line {
    padding: 50px 0;
    float: left;
    width: 100%
}

.history-tl-container ul.tl li {
    list-style: none;
    min-height: 50px;
    border: 1px dashed #b0b0b0;
    padding: 20px;
    position: relative;
    display: inline-block;
    margin-bottom: 20px;
    text-align: right;
    margin-left: 15px;
    width: 31.5%;
    min-height: 130px;
    float: left
}

.our-solution .inner-box2 h6 {
    font-size: 16px;
    font-weight: 700
}

.our-solution .inner-box2 .col-md-12 {
    margin-bottom: 20px;
    padding: 0
}

.history-tl-container ul.tl li:nth-child(odd) {
    background: #f2f2f2
}

.history-tl-container ul.tl li:before {
    position: absolute;
    right: -15px;
    z-index: 9;
    top: -15px;
    content: " ";
    border: 8px solid #0328d2;
    border-radius: 50%;
    background: #7ca9ff;
    height: 30px;
    width: 30px;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out
}

.history-tl-container ul.tl li:hover:before {
    border-color: #0328d2;
    -webkit-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
    -webkit-transform: scale(1.5);
    transform: scale(1.5)
}

ul.tl li .item-detail {
    color: rgba(0, 0, 0, .5);
    font-size: 12px
}

ul.tl li .timestamp {
    color: #0328d2;
    text-align: right;
    font-size: 13px;
    font-weight: 700
}

.goals_Objective {
    margin-top: 20px
}

.Technology_Stack {
    padding: 50px 0;
    width: 100%;
    float: left
}

.Technology_Stack .heading {
    margin-bottom: 20px
}

.Technology_Stack .col-md-4 span {
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    display: inline-block;
    color: #00208a;
    font-weight: 500;
    font-size: 30px
}

#ourTechnology .thisTechnoLink,
.Feature-Insights .service-info-img,
.animation-slide-links .ani-link.ani-link10 .top-industries-sec,
.animation-slide-links .ani-link.ani-link10:after,
.animation-slide-links .ani-link.ani-link10>a:before,
.bottom_Health_Care_industries,
.designwrapsl_02,
.iotsection+.parallax,
.iotsection.background+.parallax,
.moneybt,
.pod_element_01,
.sendy_element_03 {
    display: none
}

.Technology_Stack .col-md-4:hover span {
    background: #00208a;
    color: #fff
}

.client-logo-section ul {
    list-style: none;
    margin-bottom: 0;
    padding: 0
}

.dedicated-developer+.container .developer-heading {
    margin-top: 0
}

.frm_style_formidable-style.with_frm_style .form-field {
    float: left;
    width: 47%
}

.software-development.banner p {
    font-size: 15px
}

.terms_banner {
    background: url(https://codologi.in/images/terms_condition.jpg);
    width: 100%;
    padding: 140px 0 80px;
    text-align: center;
    text-transform: capitalize;
    background-size: cover
}

.terms_banner h1 {
    color: #fff
}

.navbar-nav.serleft>li>a:focus {
    color: #333
}

.mobile-menu #mCSB_1_container {
    position: inherit!important;
    top: 0!important
}

.whychooseusbox .choosebrandl img {
    height: 78px;
    width: auto
}

.software-development {
    position: relative
}

.software-development:after {
    width: 100%;
    height: 100vh;
    background: rgba(41, 21, 90, .63);
    position: absolute;
    content: '';
    z-index: 1;
    top: 0;
    left: 0
}

.software-development .container {
    position: relative;
    z-index: 44
}

html.addfixnew {
    height: 100%!important;
    overflow: hidden!important;
    width: 100%!important;
    position: fixed!important;
    -webkit-transform: translate3d(0);
    transform: translate3d(0)
}

.mobile-menu .right-menu.mCustomScrollbar._mCS_1 {
    overflow-y: scroll
}

body.career .inner-slide .col-sm-12 p {
    background: #5e59a0;
    font-size: 16px;
    padding: 5px
}

.footer .services_nav ul li a {
    white-space: nowrap
}

section.case-study-thumb .container {
    margin-top: -140px;
    background: #fff;
    padding: 15px 30px
}

section.case-study-thumb .container .col-md-6 {
    padding: 0;
    border: 2px solid #fff;
    position: relative
}

section.case-study-thumb .container .col-md-6 .inner-box:after {
    opacity: 0;
    visibility: hidden;
    -webkit-transition: .2s;
    transition: .2s;
    width: 100%;
    height: 100%;
    content: '';
    position: absolute;
    top: 0;
    left: 0
}

section.case-study-thumb .container .col-md-6 .inner-box.pod:after {
    background: #f8b407
}

section.case-study-thumb .container .col-md-6 .inner-box.colorday:after {
    background: #d7002e
}

section.case-study-thumb .container .col-md-6 .inner-box:hover:after {
    visibility: visible;
    opacity: .9
}

section.case-study-thumb .container .col-md-6 .inner-box .sub-title {
    -webkit-transition: .4s;
    transition: .4s;
    position: absolute;
    opacity: 0;
    visibility: hidden;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 9;
    -webkit-transform: translate(0, 100px) scale(0);
    transform: translate(0, 100px) scale(0)
}

section.case-study-thumb .container .col-md-6 .inner-box:hover .sub-title {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translate(0, 80px) scale(1);
    transform: translate(0, 80px) scale(1)
}

section.case-study-thumb .container .col-md-6 .inner-box .sub-title h4 {
    font-size: 30px;
    color: transparent;
    -webkit-text-stroke-width: 1.2px;
    -webkit-text-stroke-color: #fff
}

section.case-study-thumb .container .col-md-6 .inner-box .sub-title a {
    color: #fff;
    border: 1px solid;
    border-radius: 2px;
    padding: 5px 12px;
    text-decoration: none;
    font-weight: 500;
    font-size: 12px
}

section.case-study-thumb .container .col-md-6 .inner-box .sub-title a.button,
section.case-study-thumb .container .col-md-6 .inner-box .sub-title a:hover {
    background: #fff;
    color: #333;
    border-color: transparent
}

.navbar-fixed-top.nav_bg_none {
    background: rgba(0, 0, 0, .3)
}

.home.fp-viewing-0 .navbar-fixed-top.nav_bg_none {
    background: 0 0
}

.home.fp-viewing-1 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-10 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-11 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-12 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-13 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-14 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-15 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-16 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-2 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-3 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-4 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-5 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-6 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-7 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-8 .navbar-fixed-top.nav_bg_none,
.home.fp-viewing-9 .navbar-fixed-top.nav_bg_none {
    background: rgba(0, 0, 0, 1)
}

.pos_rel {
    position: relative
}

.home_page_slider .item.web_top_slider:before,
.home_page_slider .item:before {
    position: absolute;
    height: 100%;
    content: "";
    left: 0;
    top: 0;
    width: 100%
}

.home_page_slider .item:before {
    background: rgba(0, 0, 0, .4)
}

.home_page_slider .item.web_top_slider:before {
    background: rgba(0, 0, 0, .7)
}

.home_page_slider .home-banner-text h1 {
    font-size: 75px;
    font-family: Gilmer;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase
}

.home_page_slider .home-banner-text p {
    font-size: 24px;
    font-family: Gilmer
}

.home_page_slider .home-banner-text .btn-default {
    font-size: 24px;
    position: relative;
    z-index: 999
}

.banner-ef,
.circleCenter {
    position: absolute;
    left: 0
}

.navbar-fixed-top.nav_bg_none .nav.headermenu>li>a {
    font-size: 17px
}

.navbar-fixed-top.nav_bg_none a.contactbtnt {
    font-size: 14px
}

.circleCenter {
    text-align: center;
    margin: 0 auto;
    top: 0;
    right: 0;
    z-index: 99
}

.circleCenter img {
    -webkit-animation: imageZoom 3s linear alternate infinite;
    animation: imageZoom 3s linear alternate infinite;
    opacity: .4
}

@-webkit-keyframes imageZoom {
    0% {
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -o-transform: scale(0);
        -ms-transform: scale(0);
        opacity: .3
    }
    100% {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -o-transform: scale(1.1);
        -ms-transform: scale(1.1);
        opacity: .3
    }
}

@keyframes imageZoom {
    0% {
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -o-transform: scale(0);
        -ms-transform: scale(0);
        opacity: .3
    }
    100% {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -o-transform: scale(1.1);
        -ms-transform: scale(1.1);
        opacity: .3
    }
}

.globringbx .serviceicon .txt p {
    font-size: 18px
}

.banner-ef svg path {
    stroke-dasharray: 2000;
    stroke-dashoffset: 0;
    -webkit-animation: dash 4s linear;
    animation: dash 4s linear
}

@-webkit-keyframes dash {
    from {
        stroke-dashoffset: 2000
    }
    to {
        stroke-dashoffset: 0
    }
}

@keyframes dash {
    from {
        stroke-dashoffset: 2000
    }
    to {
        stroke-dashoffset: 0
    }
}

.banner-ef {
    width: 100%;
    bottom: 0;
    -webkit-transform: rotate(405deg);
    transform: rotate(405deg);
    overflow: hidden;
    opacity: .4;
    mix-blend-mode: screen;
    top: 30%
}

.home_page_slider {
    overflow: hidden
}

.banner-ef-2 {
    opacity: .2;
    left: 50px
}

.home .normal_txt {
    font-size: 18px;
    font-weight: 300;
    line-height: 24px
}

.line-1 {
    position: relative;
    margin: 0 auto;
    border-right: 4px solid rgba(255, 255, 255, .75);
    text-align: center;
    white-space: nowrap;
    overflow: hidden
}

.owl-carousel.owl-loaded {
    position: relative!important
}

#scroll-wrapper .owl-carousel .owl-stage-outer {
    background-attachment: fixed
}

#scroll-wrapper {
    height: auto!important
}

.mega-dropdown {
    position: static!important
}

.mega-dropdown-menu {
    padding: 0;
    width: 98%;
    box-shadow: none;
    -webkit-box-shadow: none;
    margin: 0 auto;
    float: none;
    right: 0
}

.mega-dropdown-menu .side-menu {
    background: #e6efff;
    padding-top: 20px;
    padding-right: 0;
    padding-bottom: 20px
}

.mega-dropdown-menu>li>ul {
    padding: 0;
    margin: 0
}

.mega-dropdown-menu>li>ul>li {
    position: relative;
    list-style: none;
    float: left;
    width: 100%
}

.mega-dropdown-menu>li>ul>li>a {
    display: block;
    color: #222;
    padding: 3px 5px
}

.mega-dropdown-menu>li ul>li>a:focus,
.mega-dropdown-menu>li ul>li>a:hover {
    text-decoration: none
}

.mega-dropdown-menu .dropdown-header {
    font-size: 16px;
    color: #333;
    text-align: left;
    padding: 10px 60px 10px 5px;
    line-height: 30px
}

.carousel-control {
    width: 30px;
    height: 30px;
    top: -35px
}

.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right {
    font-size: 12px;
    background-color: #fff;
    line-height: 30px;
    text-shadow: none;
    color: #333;
    border: 1px solid #ddd
}

nav.navbar {
    margin: 0
}

#header {
    position: fixed;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    width: 100%;
    z-index: 9999;
    height: 70px;
    -webkit-transition: .3s;
    transition: .3s;
    top: 0
}

#header .container-fluid {
    position: relative;
    padding: 10px 30px
}

.navbar-nav {
    float: right
}

#header nav .tree {
    padding-left: 20px
}

#header nav .tree li a {
    border: none
}

.navbar #enmenutab li {
    display: block;
    float: left;
    margin: 0;
    width: 100%;
    -webkit-transition: .3s;
    transition: .3s;
    position: relative
}

.navbar #enmenutab.nav-pills>li>a {
    float: left;
    width: 100%;
    padding: 14px 20px;
    text-transform: uppercase;
    font-weight: 300;
    border-radius: 0;
    color: #221f50;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    border: none
}

.navbar #enmenutab.nav-pills>li>a:hover {
    background: #528eff
}

.navbar #enmenutab.nav-pills>li.active>a,
.navbar #enmenutab.nav-pills>li:hover>a {
    color: #fff
}

.mega-dropdown-menu ul {
    list-style: none;
    padding: 0
}

.mega-dropdown-menu .side-menu+.col-sm-6 {
    padding: 20px
}

.navbar #enmenutab.nav-pills>li>a i {
    background: linear-gradient(135deg, rgba(51, 86, 219, .17) 0, rgba(2, 126, 247, .33) 60%, rgba(32, 147, 231, .25) 100%);
    width: 50px;
    display: inline-block;
    text-align: center;
    font-weight: 300;
    height: 58px;
    line-height: 58px;
    margin: -15px 10px -14px -19px
}

.navbar #enmenutab.nav-pills>li>a i:before {
    font-size: 24px;
    position: relative;
    bottom: -6px
}

.mega-dropdown-menu .tab-pane ul li a,
.mega-dropdown-menu .tab-pane ul li label,
.mega-dropdown.Solutions .inner-menu ul>li>a,
.mega-dropdown.Solutions .inner-menu ul>li>label {
    position: relative;
    border-bottom: 1px solid #eaeaea;
    font-weight: 300;
    color: #000;
    text-transform: capitalize;
    font-size: 15px;
    padding: 10px 20px;
    float: left;
    width: 100%;
    margin: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.mega-dropdown-menu .tab-pane ul li a:hover,
.mega-dropdown-menu .tab-pane ul li label:hover,
.mega-dropdown.Solutions .inner-menu ul>li>a:hover,
.mega-dropdown.Solutions .inner-menu ul>li>label:hover {
    cursor: pointer;
    color: #077af4;
    text-decoration: none
}

.mega-dropdown-menu .tab-pane ul>li ul.tree li {
    width: 100%
}

.bg-1 .button {
    color: #333;
    border-color: #333
}

.bg-2 .button {
    color: #eceff1;
    border-color: #eceff1
}

.bg-3 .button {
    color: #fff;
    border-color: #fff
}

.button--size-s {
    font-size: 14px
}

.button--size-m {
    font-size: 16px
}

.button--size-l {
    font-size: 18px
}

.button--text-upper {
    letter-spacing: 2px;
    text-transform: uppercase
}

.button--text-thin {
    font-weight: 300
}

.button--text-medium {
    font-weight: 500
}

.button--text-thick {
    font-weight: 600
}

.button--round-s {
    border-radius: 5px
}

.button--round-m {
    border-radius: 15px
}

.button--round-l {
    border-radius: 40px
}

.button--border-thin {
    border: 1px solid;
    position: relative
}

.button--border-medium {
    border: 2px solid
}

.button--border-thick {
    border: 3px solid
}

.button--ujarak,
.button--ujarak.button--round-s:before {
    border-radius: 2px
}

.button--winona {
    overflow: hidden;
    padding: 0;
    -webkit-transition: border-color .3s, background-color .3s;
    transition: border-color .3s, background-color .3s;
    -webkit-transition-timing-function: cubic-bezier(.2, 1, .3, 1);
    transition-timing-function: cubic-bezier(.2, 1, .3, 1)
}

.button--winona:after {
    content: attr(data-text);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    color: #3f51b5;
    -webkit-transform: translate3d(0, 25%, 0);
    transform: translate3d(0, 25%, 0)
}

.button--ujarak:before,
.button--wayra:before {
    content: '';
    height: 100%;
    z-index: -1;
    top: 0;
    left: 0;
    position: absolute
}

.button--winona.button--inverted {
    color: #0328d2
}

.button--winona.button--inverted:after {
    color: #fff
}

.button--winona:after,
.button--winona>span {
    padding: 1em 2em;
    -webkit-transition: -webkit-transform .3s, opacity .3s;
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.2, 1, .3, 1);
    transition-timing-function: cubic-bezier(.2, 1, .3, 1)
}

.button--winona:hover {
    border-color: #3f51b5;
    background-color: rgba(63, 81, 181, .1)
}

.button--winona.button--inverted:hover {
    border-color: #21333c;
    background-color: #21333c
}

.button--winona:hover:after {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.button--winona:hover>span {
    opacity: 0;
    -webkit-transform: translate3d(0, -25%, 0);
    transform: translate3d(0, -25%, 0)
}

.button--ujarak {
    -webkit-transition: border-color .4s, color .4s;
    transition: border-color .4s, color .4s;
    padding: 10px 29px
}

.button--ujarak:before {
    width: 100%;
    background: #333;
    opacity: 0;
    -webkit-transform: scale3d(.7, 1, 1);
    transform: scale3d(.7, 1, 1);
    -webkit-transition: -webkit-transform .4s, opacity .4s;
    -webkit-transition: opacity .4s, -webkit-transform .4s;
    transition: opacity .4s, -webkit-transform .4s;
    transition: transform .4s, opacity .4s;
    transition: transform .4s, opacity .4s, -webkit-transform .4s
}

.button--ujarak.button--inverted:before {
    background: #7986cb
}

.button--ujarak,
.button--ujarak:before {
    -webkit-transition-timing-function: cubic-bezier(.2, 1, .3, 1);
    transition-timing-function: cubic-bezier(.2, 1, .3, 1)
}

.button--ujarak:hover {
    color: #fff;
    border-color: #333
}

.button--ujarak.button--inverted:hover {
    color: #333;
    border-color: #fff
}

.button--ujarak:hover:before {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.button--wayra {
    overflow: hidden;
    width: 245px;
    -webkit-transition: border-color .3s, color .3s;
    transition: border-color .3s, color .3s;
    -webkit-transition-timing-function: cubic-bezier(.2, 1, .3, 1);
    transition-timing-function: cubic-bezier(.2, 1, .3, 1)
}

.button--wayra:before {
    width: 150%;
    background: #333;
    -webkit-transform: rotate3d(0, 0, 1, -45deg) translate3d(0, -3em, 0);
    transform: rotate3d(0, 0, 1, -45deg) translate3d(0, -3em, 0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transition: -webkit-transform .3s, opacity .3s, background-color .3s;
    -webkit-transition: opacity .3s, background-color .3s, -webkit-transform .3s;
    transition: opacity .3s, background-color .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s, background-color .3s;
    transition: transform .3s, opacity .3s, background-color .3s, -webkit-transform .3s
}

.button--wayra:hover {
    color: #fff;
    border-color: #3f51b5
}

.button--wayra.button--inverted:hover {
    color: #3f51b5;
    border-color: #fff
}

.button--wayra:hover:before {
    opacity: 1;
    background-color: #3f51b5;
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
    -webkit-transition-timing-function: cubic-bezier(.2, 1, .3, 1);
    transition-timing-function: cubic-bezier(.2, 1, .3, 1)
}

.button--wayra.button--inverted:hover:before {
    background-color: #fff
}

.button--tamaya {
    overflow: hidden;
    color: #fff;
    padding: 10px
}

.button--tamaya.button--inverted {
    color: #333;
    border-color: #333
}

.button--tamaya:after,
.button--tamaya:before {
    content: attr(data-text);
    position: absolute;
    width: 100%;
    height: 50%;
    left: 0;
    background: #0328d2;
    color: #fff;
    overflow: hidden;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.2, 1, .3, 1);
    transition-timing-function: cubic-bezier(.2, 1, .3, 1)
}

.button--tamaya.button--inverted:after,
.button--tamaya.button--inverted:before {
    background: #fff;
    color: #333
}

.button--tamaya:before {
    top: 0;
    padding-top: 1em
}

.button--tamaya:after {
    bottom: 0;
    line-height: 0
}

.button--tamaya>span {
    display: block;
    -webkit-transform: scale3d(.2, .2, 1);
    transform: scale3d(.2, .2, 1);
    opacity: 0;
    -webkit-transition: -webkit-transform .3s, opacity .3s;
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.2, 1, .3, 1);
    transition-timing-function: cubic-bezier(.2, 1, .3, 1)
}

.button--tamaya:hover:before {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0)
}

.button--tamaya:hover:after {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
}

.button--tamaya:hover>span {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1)
}

.button--rayen {
    overflow: hidden;
    background: #0328d2;
    position: relative;
    border: none;
    padding: 10px;
    color: #fff;
    border-radius: 2px;
    line-height: 20px;
    cursor: pointer
}

.button--rayen.button--inverted {
    color: #fff
}

.button--rayen:before {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    letter-spacing: 1px;
    height: 100%;
    color: #0161c8;
    background: #fff;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0)
}

.menu-btn .button--rayen i:after {
    font-family: Flaticon;
    content: "\f138";
    width: 30px;
    height: 40px;
    position: absolute;
    color: #fff;
    font-size: 15px;
    left: 15px;
    -webkit-transition: .3s;
    transition: .3s;
    visibility: hidden;
    opacity: 0;
    top: 25px
}

.menu-btn .button--rayen:before {
    line-height: 29px
}

.news-and-media .menu-btn .button--rayen:hover:before,
.scrolled .menu-btn .button--rayen:hover:before {
    background: #3f80fc;
    color: #fff
}

.scrolled .menu-btn .button--rayen:hover i:after {
    color: #fff
}

.button--aylen:after,
.button--aylen:before,
.button--isi:before,
.button--moema:before,
.button--nuka:after,
.button--nuka:before,
.button--pipaluk:after,
.button--pipaluk:before,
.menu-btn .button--rayen:hover i:after {
    content: '';
    z-index: -1;
    border-radius: 2px
}

.button--rayen.button--inverted:before {
    background: #fff;
    color: #333;
    border-radius: 2px
}

.button--rayen:before,
.button--rayen>span {
    padding: 10px 0;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    font-size: 14px
}

.button--rayen:hover:before {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.button--rayen:hover>span {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
}

.button--pipaluk {
    width: 240px;
    padding: 1.5em 3em;
    color: #fff
}

.button--pipaluk.button--inverted {
    color: #0328d2
}

.button--pipaluk:after,
.button--pipaluk:before {
    border-radius: inherit;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: -webkit-transform .3s, background-color .3s;
    -webkit-transition: background-color .3s, -webkit-transform .3s;
    transition: background-color .3s, -webkit-transform .3s;
    transition: transform .3s, background-color .3s;
    transition: transform .3s, background-color .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.25, 0, .3, 1);
    transition-timing-function: cubic-bezier(.25, 0, .3, 1)
}

.button--pipaluk:before {
    border: 2px solid #0328d2
}

.button--pipaluk.button--inverted:before {
    border-color: #fff
}

.button--pipaluk:after {
    background: #0328d2
}

.button--pipaluk.button--inverted:after {
    background: #fff
}

.button--pipaluk:hover:before {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1)
}

.button--pipaluk:before,
.button--pipaluk:hover:after {
    -webkit-transform: scale3d(.7, .7, 1);
    transform: scale3d(.7, .7, 1)
}

.button--pipaluk:hover:after {
    background-color: #3f51b5
}

.button--pipaluk.button--inverted:hover:after {
    background-color: #fff
}

.button--nuka {
    margin: 1em 2em;
    -webkit-transition: color .3s;
    transition: color .3s;
    -webkit-transition-timing-function: cubic-bezier(.2, 1, .3, 1);
    transition-timing-function: cubic-bezier(.2, 1, .3, 1)
}

.button--nuka.button--inverted {
    color: #333
}

.button--nuka:before {
    top: -4px;
    bottom: -4px;
    left: -4px;
    right: -4px;
    opacity: .2;
    -webkit-transform: scale3d(.7, 1, 1);
    transform: scale3d(.7, 1, 1);
    -webkit-transition: -webkit-transform .3s, opacity .3s;
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s, -webkit-transform .3s
}

.button--nuka:after {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: scale3d(1.1, 1, 1);
    transform: scale3d(1.1, 1, 1);
    -webkit-transition: -webkit-transform .3s, background-color .3s;
    -webkit-transition: background-color .3s, -webkit-transform .3s;
    transition: background-color .3s, -webkit-transform .3s;
    transition: transform .3s, background-color .3s;
    transition: transform .3s, background-color .3s, -webkit-transform .3s
}

.button--nuka:after,
.button--nuka:before {
    position: absolute;
    border-radius: inherit;
    background: #0328d2;
    -webkit-transition-timing-function: cubic-bezier(.2, 1, .3, 1);
    transition-timing-function: cubic-bezier(.2, 1, .3, 1)
}

.button--nuka.button--inverted:after,
.button--nuka.button--inverted:before {
    background: #fff
}

.button--nuka:hover {
    color: #fff
}

.button--nuka:hover:before {
    opacity: 1
}

.button--nuka:hover:after {
    background-color: #333
}

.button--nuka.button--inverted:hover:after {
    background-color: #0328d2
}

.button--nuka:hover:after,
.button--nuka:hover:before {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1)
}

.button--moema {
    padding: 1.5em 3em;
    border-radius: 50px;
    background: #0328d2;
    color: #fff;
    -webkit-transition: background-color .3s, color .3s;
    transition: background-color .3s, color .3s
}

.button--moema.button--inverted {
    background: #eceff1;
    color: #333
}

.button--moema:before {
    position: absolute;
    top: -20px;
    left: -20px;
    bottom: -20px;
    right: -20px;
    background: inherit;
    border-radius: 50px;
    opacity: .4;
    -webkit-transform: scale3d(.8, .5, 1);
    transform: scale3d(.8, .5, 1)
}

.button--moema:hover {
    -webkit-transition: background-color .1s .3s, color .1s .3s;
    transition: background-color .1s .3s, color .1s .3s;
    color: #eceff1;
    background-color: #3f51b5;
    -webkit-animation: anim-moema-1 .3s forwards;
    animation: anim-moema-1 .3s forwards
}

.button--moema.button--inverted:hover {
    color: #eceff1;
    background-color: #0328d2
}

.button--moema:hover:before {
    -webkit-animation: anim-moema-2 .3s .3s forwards;
    animation: anim-moema-2 .3s .3s forwards
}

@-webkit-keyframes anim-moema-1 {
    60% {
        -webkit-transform: scale3d(.8, .8, 1);
        transform: scale3d(.8, .8, 1)
    }
    85% {
        -webkit-transform: scale3d(1.1, 1.1, 1);
        transform: scale3d(1.1, 1.1, 1)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

@keyframes anim-moema-1 {
    60% {
        -webkit-transform: scale3d(.8, .8, 1);
        transform: scale3d(.8, .8, 1)
    }
    85% {
        -webkit-transform: scale3d(1.1, 1.1, 1);
        transform: scale3d(1.1, 1.1, 1)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

@-webkit-keyframes anim-moema-2 {
    to {
        opacity: 0;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

@keyframes anim-moema-2 {
    to {
        opacity: 0;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

.button--isi {
    padding: 1.2em 2em;
    color: #fff;
    background: #0328d2;
    overflow: hidden
}

.button--isi:before {
    position: absolute;
    top: 50%;
    left: 100%;
    margin: -15px 0 0 1px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #3f51b5;
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-transform: scale3d(1, 2, 1);
    transform: scale3d(1, 2, 1);
    -webkit-transition: -webkit-transform .3s, opacity .3s;
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.7, 0, .9, 1);
    transition-timing-function: cubic-bezier(.7, 0, .9, 1)
}

.button--aylen:after,
.button--aylen:before,
.button--nina:before,
.button--saqui:after,
.button--wapasha:before {
    position: absolute;
    left: 0;
    height: 100%;
    width: 100%
}

.button--isi>span {
    padding-left: .75em
}

.button--isi:hover:before {
    -webkit-transform: scale3d(9, 9, 1);
    transform: scale3d(9, 9, 1)
}

.button.button--aylen {
    background: #fff;
    color: #333;
    overflow: hidden;
    -webkit-transition: color .3s;
    transition: color .3s
}

.button--aylen.button--inverted {
    background: 0 0;
    color: #fff
}

.button--aylen:after,
.button--aylen:before {
    bottom: 100%;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--aylen:before {
    background: #0328d2
}

.button--aylen:after {
    background: #3f51b5
}

.button--aylen:hover {
    color: #fff
}

.button--aylen:hover:after,
.button--aylen:hover:before {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
}

.button--aylen:hover:after {
    -webkit-transition-delay: .175s;
    transition-delay: .175s
}

.button.button--saqui {
    overflow: hidden;
    color: #fff;
    background: #333;
    -webkit-transition: background-color .3s ease-in, color .3s ease-in;
    transition: background-color .3s ease-in, color .3s ease-in
}

.button--saqui.button--inverted {
    background: #fff;
    color: #333
}

.button--saqui:after {
    content: attr(data-text);
    top: 0;
    padding: 1em 2em;
    color: #333;
    -webkit-transform-origin: -25% 50%;
    transform-origin: -25% 50%;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    -webkit-transition: -webkit-transform .3s ease-in;
    transition: -webkit-transform .3s ease-in;
    transition: transform .3s ease-in;
    transition: transform .3s ease-in, -webkit-transform .3s ease-in;
    transition: transform .3s ease-in, -webkit-transform .3s ease-in;
    transition: transform .3s ease-in, -webkit-transform .3s ease-in
}

.button--saqui.button--inverted:after {
    color: #fff
}

.button--saqui:hover,
.button--saqui:hover:after {
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.button--saqui:hover {
    background-color: #0328d2;
    color: #0328d2
}

.button--saqui.button--inverted:hover {
    background-color: #3f51b5;
    color: #3f51b5
}

.button--saqui:hover:after {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg)
}

.button.button--wapasha {
    background: #333;
    color: #fff;
    -webkit-transition: background-color .3s, color .3s;
    transition: background-color .3s, color .3s
}

.button--wapasha.button--inverted {
    background: #fff;
    color: #333
}

.button--wapasha:before {
    content: '';
    top: 0;
    border: 2px solid #3f51b5;
    z-index: -1;
    border-radius: inherit;
    opacity: 0;
    -webkit-transform: scale3d(.6, .6, 1);
    transform: scale3d(.6, .6, 1);
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--wapasha.button--inverted:before {
    border-color: #0328d2
}

.button--wapasha:hover {
    background-color: #fff;
    color: #3f51b5
}

.button--wapasha.button--inverted:hover {
    background-color: #333;
    color: #0328d2
}

.button--wapasha:hover:before {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    opacity: 1
}

.button--nina {
    padding: 0 2em;
    background: #0328d2;
    color: #fff;
    overflow: hidden;
    -webkit-transition: background-color .3s;
    transition: background-color .3s
}

.button--nina.button--inverted {
    background: #fff;
    color: #0328d2
}

.button--nina>span {
    display: inline-block;
    padding: 1em 0;
    opacity: 0;
    color: #fff;
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--nina:before {
    content: attr(data-text);
    top: 0;
    padding: 1em 0;
    -webkit-transition: -webkit-transform .3s, opacity .3s;
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--naira:before,
.button--quidel:after,
.button--quidel:before,
.button--sacnite:before {
    content: '';
    position: absolute
}

.button--nina:hover {
    background-color: #3f51b5
}

.button--nina:hover:before {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
}

.button--nina:hover>span {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.button--nina:hover>span:nth-child(1) {
    -webkit-transition-delay: 45ms;
    transition-delay: 45ms
}

.button--nina:hover>span:nth-child(2) {
    -webkit-transition-delay: 90ms;
    transition-delay: 90ms
}

.button--nina:hover>span:nth-child(3) {
    -webkit-transition-delay: .135s;
    transition-delay: .135s
}

.button--nina:hover>span:nth-child(4) {
    -webkit-transition-delay: .18s;
    transition-delay: .18s
}

.button--nina:hover>span:nth-child(5) {
    -webkit-transition-delay: .225s;
    transition-delay: .225s
}

.button--nina:hover>span:nth-child(6) {
    -webkit-transition-delay: .27s;
    transition-delay: .27s
}

.button--nina:hover>span:nth-child(7) {
    -webkit-transition-delay: .315s;
    transition-delay: .315s
}

.button--nina:hover>span:nth-child(8) {
    -webkit-transition-delay: .36s;
    transition-delay: .36s
}

.button--nina:hover>span:nth-child(9) {
    -webkit-transition-delay: .405s;
    transition-delay: .405s
}

.button--nina:hover>span:nth-child(10) {
    -webkit-transition-delay: .45s;
    transition-delay: .45s
}

.button--nanuk {
    padding: 0 2em;
    overflow: hidden;
    background: #0328d2;
    -webkit-transition: background-color .3s;
    transition: background-color .3s
}

.button--nanuk.button--inverted {
    background: #fff;
    color: #0328d2
}

.button--nanuk>span {
    display: inline-block;
    padding: 1em 0
}

.button--nanuk:hover {
    background-color: #3f51b5
}

.button--nanuk:hover>span:nth-child(odd) {
    -webkit-animation: anim-nanuk-1 .5s forwards;
    animation: anim-nanuk-1 .5s forwards
}

.button--nanuk:hover>span:nth-child(even) {
    -webkit-animation: anim-nanuk-2 .5s forwards;
    animation: anim-nanuk-2 .5s forwards
}

.button--nanuk:hover>span:nth-child(even),
.button--nanuk:hover>span:nth-child(odd) {
    -webkit-animation-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-animation-function: cubic-bezier(.75, 0, .125, 1)
}

@-webkit-keyframes anim-nanuk-1 {
    0%,
    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    49% {
        opacity: 1;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
    50% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        color: inherit
    }
    51% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        color: #fff
    }
    100% {
        color: #fff
    }
}

@keyframes anim-nanuk-1 {
    0%,
    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    49% {
        opacity: 1;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
    50% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        color: inherit
    }
    51% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        color: #fff
    }
    100% {
        color: #fff
    }
}

@-webkit-keyframes anim-nanuk-2 {
    0%,
    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    49% {
        opacity: 1;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    50% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        color: inherit
    }
    51% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        color: #fff
    }
    100% {
        color: #fff
    }
}

@keyframes anim-nanuk-2 {
    0%,
    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    49% {
        opacity: 1;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    50% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        color: inherit
    }
    51% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        color: #fff
    }
    100% {
        color: #fff
    }
}

.button--nanuk:hover>span:nth-child(1) {
    -webkit-animation-delay: 0;
    animation-delay: 0
}

.button--nanuk:hover>span:nth-child(2) {
    -webkit-animation-delay: 50ms;
    animation-delay: 50ms
}

.button--nanuk:hover>span:nth-child(3) {
    -webkit-animation-delay: .1s;
    animation-delay: .1s
}

.button--nanuk:hover>span:nth-child(4) {
    -webkit-animation-delay: .15s;
    animation-delay: .15s
}

.button--nanuk:hover>span:nth-child(5) {
    -webkit-animation-delay: .2s;
    animation-delay: .2s
}

.button--nanuk:hover>span:nth-child(6) {
    -webkit-animation-delay: .25s;
    animation-delay: .25s
}

.button--nanuk:hover>span:nth-child(7) {
    -webkit-animation-delay: .3s;
    animation-delay: .3s
}

.button--nanuk:hover>span:nth-child(8) {
    -webkit-animation-delay: .35s;
    animation-delay: .35s
}

.button--nanuk:hover>span:nth-child(9) {
    -webkit-animation-delay: .4s;
    animation-delay: .4s
}

.button--nanuk:hover>span:nth-child(10) {
    -webkit-animation-delay: .45s;
    animation-delay: .45s
}

.button--nanuk:hover>span:nth-child(11) {
    -webkit-animation-delay: .5s;
    animation-delay: .5s
}

.button--antiman {
    background: 0 0;
    border: none;
    height: 60px
}

.button--antiman:after,
.button--antiman:before,
.button--itzel:before {
    top: 0;
    left: 0;
    height: 100%;
    content: '';
    position: absolute
}

.button--antiman.button--inverted,
.button--antiman.button--inverted-alt {
    -webkit-transition: color .3s;
    transition: color .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--antiman>span {
    padding-left: .35em
}

.button--antiman:after,
.button--antiman:before {
    z-index: -1;
    border-radius: inherit;
    pointer-events: none;
    width: 100%;
    -webkit-backface-visibility: hidden;
    -webkit-transition: -webkit-transform .3s, opacity .3s;
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--antiman:before {
    border: 2px solid #333;
    opacity: 0;
    -webkit-transform: scale3d(1.2, 1.2, 1);
    transform: scale3d(1.2, 1.2, 1)
}

.button--antiman.button--border-thin:before {
    border-width: 1px
}

.button--antiman.button--border-medium:before {
    border-width: 2px
}

.button--antiman.button--border-thick:before {
    border-width: 3px
}

.button--antiman.button--inverted:before {
    border-color: #0328d2
}

.button--antiman.button--inverted-alt:before {
    border-color: #3f51b5
}

.button--antiman:after {
    background: #fff
}

.button--antiman.button--inverted:after {
    background: #0328d2
}

.button--antiman.button--inverted-alt:after {
    background: #3f51b5
}

.button--antiman.button--inverted:hover {
    color: #0328d2
}

.button--antiman.button--inverted-alt:hover {
    color: #3f51b5
}

.button--antiman:hover:before {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1)
}

.button--antiman:hover:after {
    opacity: 0;
    -webkit-transform: scale3d(.8, .8, 1);
    transform: scale3d(.8, .8, 1)
}

.button--itzel {
    border: none;
    padding: 0;
    overflow: hidden;
    width: 255px
}

.button--itzel:before {
    width: 100%;
    border: 2px solid;
    border-radius: inherit;
    -webkit-clip-path: polygon(0 0, 0 100%, 35% 100%, 35% 60%, 65% 60%, 65% 100%, 100% 100%, 100% 0);
    -webkit-transform: translate3d(0, 100%, 0) translate3d(0, -2px, 0);
    transform: translate3d(0, 100%, 0) translate3d(0, -2px, 0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

.button--itzel.button--border-thin:before {
    border: 1px solid;
    -webkit-transform: translate3d(0, 100%, 0) translate3d(0, -1px, 0);
    transform: translate3d(0, 100%, 0) translate3d(0, -1px, 0)
}

.button--itzel.button--border-thick:before {
    border: 3px solid;
    -webkit-transform: translate3d(0, 100%, 0) translate3d(0, -3px, 0);
    transform: translate3d(0, 100%, 0) translate3d(0, -3px, 0)
}

.button--itzel .button__icon,
.button--itzel:before {
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--itzel .button__icon {
    position: absolute;
    top: 100%;
    left: 50%;
    padding: 20px;
    font-size: 20px;
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate3d(-50%, 0, 0)
}

.button--itzel>span {
    display: block;
    padding: 20px;
    -webkit-transition: -webkit-transform .3s, opacity .3s;
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s, -webkit-transform .3s;
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

.button--itzel:hover:before {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.button--itzel:hover .button__icon {
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
    -webkit-transform: translate3d(-50%, -100%, 0);
    transform: translate3d(-50%, -100%, 0)
}

.button--itzel:hover>span {
    opacity: 0;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
    -webkit-transition-delay: 0;
    transition-delay: 0
}

.button--naira {
    padding: 0;
    overflow: hidden;
    -webkit-transition: background-color .3s;
    transition: background-color .3s
}

.button--naira:before {
    left: -50%;
    width: 200%;
    height: 200%;
    background: #333;
    top: -50%;
    z-index: -1;
    -webkit-transform: translate3d(0, -100%, 0) rotate3d(0, 0, 1, -10deg);
    transform: translate3d(0, -100%, 0) rotate3d(0, 0, 1, -10deg)
}

.button--naira.button--inverted:before {
    background: #0328d2
}

.button--naira-up:before {
    -webkit-transform: translate3d(0, 100%, 0) rotate3d(0, 0, 1, 10deg);
    transform: translate3d(0, 100%, 0) rotate3d(0, 0, 1, 10deg)
}

.button--naira>span {
    display: block
}

.button--naira .button__icon {
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    color: #fff;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0)
}

.button--naira-up .button__icon {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
}

.button--naira .button__icon,
.button--naira>span {
    padding: 1em 2em;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--naira:hover:before {
    -webkit-animation: anim-naira-1 .3s forwards ease-in;
    animation: anim-naira-1 .3s forwards ease-in
}

.button--naira-up:hover:before {
    -webkit-animation: anim-naira-2 .3s forwards ease-in;
    animation: anim-naira-2 .3s forwards ease-in
}

@-webkit-keyframes anim-naira-1 {
    50% {
        -webkit-transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, -10deg);
        transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, -10deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
        transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg)
    }
}

@keyframes anim-naira-1 {
    50% {
        -webkit-transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, -10deg);
        transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, -10deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
        transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg)
    }
}

@-webkit-keyframes anim-naira-2 {
    50% {
        -webkit-transform: translate3d(0, 50%, 0) rotate3d(0, 0, 1, 10deg);
        transform: translate3d(0, 50%, 0) rotate3d(0, 0, 1, 10deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
        transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg)
    }
}

@keyframes anim-naira-2 {
    50% {
        -webkit-transform: translate3d(0, 50%, 0) rotate3d(0, 0, 1, 10deg);
        transform: translate3d(0, 50%, 0) rotate3d(0, 0, 1, 10deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
        transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg)
    }
}

.button--naira:hover {
    background-color: #333;
    -webkit-transition: background-color 0 .3s;
    transition: background-color 0 .3s
}

.button--naira.button--inverted:hover {
    background-color: #0328d2
}

.button--naira:hover .button__icon {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.button--naira:hover>span {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
}

.button--naira-up:hover>span {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0)
}

.button--quidel {
    background: #0328d2;
    color: #0328d2;
    overflow: hidden;
    -webkit-transition: color .3s;
    transition: color .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--quidel.button--inverted {
    background: #fff;
    color: #fff
}

.button--quidel:after,
.button--quidel:before {
    z-index: -1;
    border-radius: inherit
}

.button--quidel:after {
    top: 2px;
    left: 2px;
    right: 2px;
    bottom: 2px;
    background: #fff
}

.button--quidel.button--inverted:after {
    background: #333
}

.button--quidel:before {
    background: #333;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--quidel.button--inverted:before {
    background: #0328d2
}

.button--round-s.button--quidel:after {
    border-radius: 3px
}

.button--round-m.button--quidel:after {
    border-radius: 13px
}

.button--round-l.button--quidel:after {
    border-radius: 40px
}

.button--quidel>span {
    padding-left: .35em
}

.button--quidel:hover {
    color: #333
}

.button--quidel.button--inverted:hover {
    color: #0328d2
}

.button--quidel:hover:before {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.button.button--sacnite {
    width: 70px;
    height: 70px;
    min-width: 0;
    padding: 0;
    color: #fff;
    -webkit-transition: color .3s;
    transition: color .3s
}

.button--sacnite.button--inverted,
.button--sacnite:hover {
    color: #333
}

.button--scanite.button--round-l {
    border-radius: 50%
}

.button--sacnite:before {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    z-index: -1;
    -webkit-box-shadow: inset 0 0 0 35px #333;
    box-shadow: inset 0 0 0 35px #333;
    -webkit-transform: scale3d(.9, .9, 1);
    transform: scale3d(.9, .9, 1);
    -webkit-transition: box-shadow .3s, -webkit-transform .3;
    -webkit-transition: -webkit-box-shadow .3s, -webkit-transform .3s;
    transition: -webkit-box-shadow .3s, -webkit-transform .3s;
    transition: box-shadow .3s, transform .3s;
    transition: box-shadow .3s, transform .3s, -webkit-box-shadow .3s, -webkit-transform .3s
}

.button--sacnite.button--inverted:before {
    -webkit-box-shadow: inset 0 0 0 35px #fff;
    box-shadow: inset 0 0 0 35px #fff
}

.button--sacnite .button__icon {
    font-size: 22px;
    width: 22px
}

.button--sacnite>span {
    position: absolute;
    opacity: 0;
    pointer-events: none
}

.button--sacnite.button--inverted:hover {
    color: #fff
}

.button--sacnite:hover:before {
    -webkit-box-shadow: inset 0 0 0 2px #333;
    box-shadow: inset 0 0 0 2px #333;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1)
}

.button--sacnite.button--inverted:hover:before {
    -webkit-box-shadow: inset 0 0 0 2px #fff;
    box-shadow: inset 0 0 0 2px #fff
}

.button.button--shikoba {
    padding: 1em 30px 1em 50px;
    overflow: hidden;
    background: #fff;
    color: #333;
    border-color: #333;
    -webkit-transition: background-color .3s, border-color .3s, color .3s;
    transition: background-color .3s, border-color .3s, color .3s
}

.button--shikoba.button--inverted {
    color: #fff;
    background: #0328d2
}

.button--shikoba>span {
    display: inline-block;
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--shikoba .button__icon {
    position: absolute;
    left: 20px;
    font-size: 18px;
    -webkit-transform: translate3d(-40px, 2.5em, 0);
    transform: translate3d(-40px, 2.5em, 0);
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    -webkit-transition-timing-function: cubic-bezier(.75, 0, .125, 1);
    transition-timing-function: cubic-bezier(.75, 0, .125, 1)
}

.button--shikoba:hover .button__icon,
.button--shikoba:hover>span {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.button--shikoba:hover {
    background: #3f51b5;
    border-color: #3f51b5;
    color: #fff
}

.mega-dropdown-menu .tab-pane ul .inner-menu>li,
.mega-dropdown-menu .tab-pane ul>li,
.mega-dropdown.Solutions .inner-menu ul>li {
    position: relative;
    float: left;
    width: 100%
}

.mega-dropdown-menu .inner-menu ul>li:after,
.mega-dropdown-menu ul .inner-menu>li:after {
    content: "\f101";
    font-family: FontAwesome;
    width: 30px;
    height: 30px;
    position: absolute;
    left: 4px;
    top: 8px;
    font-size: 16px
}

.navbar-collapse.collapse {
    padding-right: 0
}

.navbar-nav>li {
    -webkit-transition: .3s;
    transition: .3s;
    text-align: center
}

.navbar-nav>li.menu-btn {
    margin-left: 20px;
    margin-top: 10px;
    margin-right: 20px
}

.navbar-nav>li.menu-btn>a {
    -webkit-transition: .4s;
    transition: .4s;
    padding: 10px 20px
}

.mega-dropdown-menu .tab-pane .inner-menu li .caret,
.mega-dropdown.Solutions .inner-menu ul>li .caret {
    float: right;
    top: 10px;
    position: relative;
    right: -10px
}

.navbar-nav>li.menu-btn>a:hover {
    background: #fff;
    color: #000
}

.mega-dropdown-menu .left.carousel-control,
.mega-dropdown-menu .right.carousel-control {
    background-image: none!important;
    border-radius: 4px
}

.mega-dropdown-menu .left.carousel-control {
    width: 130px;
    margin-top: 40px
}

.mega-dropdown-menu .right.carousel-control {
    margin-top: 40px
}

.mega-dropdown-menu .carousel-control .glyphicon-chevron-left,
.mega-dropdown-menu .carousel-control .glyphicon-chevron-right {
    border: none;
    width: 49px;
    background: #423cb1;
    color: #fff
}

.menuslide {
    text-align: center;
    padding-bottom: 20px
}

.mega-dropdown-menu .menuslide .btn {
    -webkit-transition: .4s;
    transition: .4s;
    padding: 12px 30px;
    border: 1px solid #2d2a6c;
    border-radius: 0
}

.mega-dropdown-menu .menuslide h4 small {
    font-size: 18px;
    padding: 10px;
    font-weight: 700;
    color: #000;
    right: 0;
    margin: 0 auto
}

.mega-dropdown-menu .inner-menu {
    overflow-y: auto
}

.mega-dropdown-menu .item .btn-50 {
    width: 50%;
    float: left
}

.mega-dropdown-menu .item .btn-default {
    color: #2d2a6c
}

.mega-dropdown-menu .menuslide .btn:hover {
    background: #077af4;
    border-color: #077af4
}

.mega-dropdown.Solutions>.mega-dropdown-menu {
    padding: 10px 0 20px
}

.mega-dropdown.Solutions .inner-menu ul>li:after {
    display: none
}

.mega-dropdown.Solutions .inner-menu ul>li a,
.mega-dropdown.Solutions .inner-menu ul>li label {
    color: #535353;
    font-weight: 300;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.mega-dropdown.Solutions .inner-menu ul>li i:before {
    color: #28273b;
    font-size: 23px;
    margin-right: 4px;
    padding-right: 6px
}

.mega-dropdown.Solutions .inner-menu ul>li:hover i {
    color: #0328d2
}

.mega-dropdown.Solutions .inner-menu ul>li i {
    top: 5px;
    position: relative
}

.mega-dropdown.Solutions .inner-menu ul>li .caret {
    top: 20px;
    position: absolute
}

.navbar-nav>li.menu-btn i:before {
    font-size: 15px
}

.dropdown-menu.who-we-a {
    padding: 0;
    width: 580px
}

.dropdown-menu.who-we-a li {
    width: 50%;
    float: left
}

.dropdown-menu.who-we-a>li>a {
    border-right: 1px solid #e5e0e9;
    padding: 13px 20px;
    border-bottom: 1px solid #e5e0e9;
    white-space: nowrap
}

.dropdown-menu.who-we-a>li>a:hover {
    color: #077af4
}

.dropdown-menu>li>a i {
    font-size: 18px
}

.dropdown-menu.who-we-a>li>a i {
    margin-right: 10px;
    position: relative;
    bottom: -2px;
    font-size: 22px;
    line-height: 0
}

.dropdown-menu.who-we-a.Resources {
    width: 270px
}

.dropdown-menu.who-we-a.Resources li {
    width: 100%!important
}

.nav>li.result_hover>a {
    text-decoration: none;
    background-color: #077af4
}

.navbar-nav li>a.dropdown-toggle:after {
    width: 0;
    height: 0;
    content: '';
    position: relative;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #fff;
    left: 40%;
    bottom: -53px;
    float: left;
    -webkit-transition: .3s;
    transition: .3s;
    margin-bottom: -40px;
    visibility: hidden;
    opacity: 0
}

.nsf-slide .clients-top {
    position: absolute;
    z-index: 4;
    width: 100%;
    left: 0;
    right: 0;
    bottom: 30px
}

.nsf-slide .clients-top .slick-slide img {
    text-align: center;
    margin: 0 auto;
    height: 25px
}

.navbar-nav li:hover a.dropdown-toggle:after {
    bottom: -36px;
    visibility: visible;
    opacity: 1
}

.dropdown-menu {
    -webkit-transition: opacity .6s, visibility .6s;
    transition: opacity .6s, visibility .6s
}

.nsf-slide {
    padding: 150px 0;
    position: relative;
    width: 100%;
    display: inline-block;
    background-size: cover!important;
    background-repeat: no-repeat!important
}

.nsf-slide .container {
    z-index: 2;
    position: relative
}

.banner-overly {
    width: 100%;
    background: #000;
    float: left;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100vh;
    opacity: .7;
    -webkit-transition: .3s;
    transition: .3s
}

.nsf-slide h1 {
    color: #fff;
    margin-bottom: 0;
    font-size: 42px;
    font-weight: 700;
    letter-spacing: -.5px
}

.nsf-slide h1 span {
    font-weight: 700
}

.nsf-slide p {
    color: #fff;
    font-size: 22px
}

.nsf-slide .blist {
    margin: 0;
    padding: 0;
    width: 100%;
    display: inline-block
}

.nsf-slide ul.blist li:before {
    content: "\f111";
    color: #fff;
    font-family: FontAwesome;
    font-size: 9px;
    vertical-align: middle;
    margin-right: 9px
}

.hs-input,
.material-form {
    font-family: Gilmer
}

.nsf-slide ul.blist li {
    width: 100%;
    margin-bottom: 15px;
    padding-left: 0;
    list-style: none;
    color: #fff;
    text-shadow: 1px 0 1px #000;
    font-size: 20px
}

.nsf-slide ul.blist.parts_d li {
    width: 50%!important;
    float: left
}

.nsf-slide .banner-btn:hover {
    background: #1954c4;
    color: #fff;
    border-color: transparent;
    text-decoration: none
}

.nsf-slide .banner-btn {
    background: #0328d2;
    padding: 14px 30px;
    margin-top: 10px;
    cursor: pointer;
    display: inline-block;
    font-weight: 500;
    letter-spacing: 1px;
    -webkit-transition: .3s;
    transition: .3s;
    color: #fff;
    margin-right: 10px;
    border-radius: 3px;
    font-size: 13px;
    text-transform: uppercase
}

.nsf-slide .banner-btn-2.banner-btn {
    background: 0 0;
    border: 1px solid;
    color: #fff;
    -webkit-transition: .3s;
    transition: .3s;
    padding: 13px 30px
}

.nsf-slide .banner-btn-2.banner-btn:hover {
    background: #fff;
    color: #333;
    border-color: transparent
}

.nsf-slide.php-develop {
    background: url(https://codologi.in/images/banners/phpdevelopment.jpg)
}

.f_bold {
    font-weight: 700!important
}

.f_reg {
    font-weight: 600!important
}

span.bar-2 {
    height: 2px;
    width: 180px;
    background: #16113f;
    display: inherit;
    margin: 0 auto
}

.title-h2+p.sub {
    color: #16113f;
    font-size: 18px;
    font-weight: 700
}

.zig-zag .col-md-6 img {
    width: 500px
}

.zig-zag .col-md-6 .txt-sec {
    text-align: left;
    padding: 20px 60px
}

.zig-zag .col-md-6 .txt-sec p {
    font-size: 16px
}

.zig-zag .col-md-6 {
    text-align: center
}

.zig-zag .col-md-6 .txt-sec h3 span {
    color: #0993f6
}

.row.bg-fbox .col-md-4 {
    padding: 0
}

.zig-zag .col-md-6 .txt-sec h3 {
    margin-top: 60px
}

figure.snipbox {
    color: #fff;
    position: relative;
    overflow: hidden;
    width: 100%;
    background: #000;
    text-align: left
}

figure.snipbox * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

figure.snipbox img {
    max-width: 100%;
    opacity: 1;
    width: 100%;
    -webkit-transition: opacity .35s;
    transition: opacity .35s
}

figure.snipbox figcaption {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 20px 15px 20px 3em;
    width: 100%;
    height: 100%;
    background: rgba(45, 42, 108, .18)
}

figure.snipbox figcaption:before {
    position: absolute;
    top: 20px;
    right: 30px;
    bottom: 20px;
    left: 100%;
    border-left: 4px solid rgba(255, 255, 255, .8);
    content: '';
    opacity: 0;
    background-color: rgba(255, 255, 255, .5);
    -webkit-transition: all .5s;
    transition: all .5s;
    -webkit-transition-delay: .6s;
    transition-delay: .6s
}

figure.snipbox h2,
figure.snipbox p {
    margin: 0 0 5px;
    opacity: 0;
    -webkit-transition: opacity .35s, -webkit-transform .35s;
    transition: opacity .35s, -webkit-transform .35s, transform .35s
}

figure.snipbox h2 {
    font-weight: 300;
    text-transform: uppercase;
    -webkit-transform: translate3d(30%, 0, 0);
    transform: translate3d(30%, 0, 0);
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

figure.snipbox p {
    font-weight: 300;
    -webkit-transform: translate3d(0, 30%, 0);
    transform: translate3d(0, 30%, 0);
    -webkit-transition-delay: 0;
    transition-delay: 0
}

figure.snipbox a {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    color: #fff
}

figure.snipbox:hover img {
    opacity: .3
}

figure.snipbox:hover figcaption h2 {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition-delay: .4s;
    transition-delay: .4s
}

figure.snipbox:hover figcaption p {
    opacity: .9;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition-delay: .6s;
    transition-delay: .6s
}

figure.snipbox:hover figcaption:before {
    background: rgba(255, 255, 255, 0);
    left: 30px;
    opacity: 1;
    -webkit-transition-delay: 0;
    transition-delay: 0
}

.row.bg-fbox .col-md-4 h2 {
    margin: 0;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    white-space: nowrap
}

.row.bg-fbox .col-md-4 h3 {
    position: absolute;
    top: 0;
    font-size: 18px;
    font-weight: 500;
    background: 0 0;
    left: 0;
    color: #fff;
    padding: 30% 10px 4px;
    border-radius: 0;
    -webkit-transition: .3s;
    transition: .3s;
    right: 0;
    margin: 0 auto;
    text-align: center;
    bottom: 0
}

.row.bg-fbox .col-md-4:hover h3 {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -webkit-transition-delay: 0
}

.nsf-fbox div img {
    height: 80px
}

.nsf-fbox .col-md-3 {
    margin-top: 30px
}

.nsf-fbox {
    padding-bottom: 60px;
    text-align: center
}

.nsf-fbox h3 {
    font-size: 22px
}

.m-0-a {
    margin: 0 auto;
    text-align: center;
    float: none
}

.projects-bg {
    padding: 30px 0 60px;
    background: #fff
}

.projects-bg .box {
    -webkit-transition: .5s;
    transition: .5s;
    text-align: center;
    background: #fff;
    padding: 20px;
    border-radius: 2px;
    min-height: 430px;
    position: relative;
    border: 1px solid #ededed
}

.home_port.projects-bg .box {
    border: none
}

.projects-bg .box:hover {
    opacity: 1
}

.projects-bg .box h4 {
    text-transform: capitalize;
    color: #fff;
    font-size: 19px;
    margin: 0 0 30px;
    padding: 9px 20px;
    text-align: center;
    display: inline-table;
    border-radius: 2px;
    width: 100%;
    background: #2b3a60
}

.projects-bg .box .logo {
    margin: 0 auto;
    width: 190px;
    border-radius: 10px;
    -webkit-box-shadow: 2px 2px 2px #c1c1c1;
    box-shadow: 2px 2px 2px #c1c1c1;
    display: none;
    padding: 9px
}

.main-form .social-link li,
.star-rating i {
    display: inline-block
}

.projects-bg .box h4+.star-rating+span+img,
.projects-bg .box h4+img {
    height: 110px;
    width: 190px;
    -o-object-fit: contain;
    object-fit: contain;
    margin: 0 auto
}

.projects-bg .box p {
    font-size: 14px;
    color: #333;
    letter-spacing: .4px
}

.projects-bg .box h4+.star-rating+span+img {
    margin-top: 15px
}

.star-rating i {
    color: #ff711c;
    font-size: 18px
}

.projects-bg .box .button {
    -webkit-transition: .3s;
    transition: .3s;
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    right: 0;
    padding: 10px;
    font-weight: 700;
    border-radius: 0 0 2px 2px;
    background: #077af4;
    color: #fff
}

.projects-bg .box .button:hover {
    background: #0567d0
}

.projects-bg .arrow-p {
    left: -50px
}

.projects-bg .arrow-n {
    right: -50px!important;
    left: auto
}

.client-tesi .slick-initialized .slick-slide {
    padding: 10px;
    -webkit-transition: .4s!important;
    transition: .4s!important;
    opacity: .1
}

.client-tesi .slick-slide.slick-current.slick-active.slick-center {
    -webkit-transform: scale3d(1.5, 1.5, 1);
    transform: scale3d(1.5, 1.5, 1);
    position: relative;
    opacity: 1;
    z-index: 9;
    -webkit-box-shadow: 2px 1px 23px #c1c1c1;
    box-shadow: 2px 1px 23px #c1c1c1;
    border-radius: 13px;
    padding-bottom: 4px
}

.client-tesi {
    padding: 70px 0 110px;
    background-size: cover;
    position: relative;
    background-position: center center;
    background-repeat: no-repeat
}

.client-tesi .arrow-n,
.client-tesi .arrow-p {
    padding: 10px;
    background: #fff;
    width: 65px;
    top: 130%;
    position: absolute;
    text-align: center;
    cursor: pointer
}

.client-tesi iframe {
    height: 205px;
    border-radius: 5px
}

.client-tesi .slick-list {
    margin-top: 50px;
    overflow: inherit!important
}

.client-tesi .arrow-n {
    left: 50%;
    border-radius: 0 50px 50px 0;
    border: 1px solid #e3e3e3
}

.client-tesi .arrow-p {
    border-radius: 50px 0 0 50px;
    left: 45%;
    z-index: 9;
    border: 1px solid #e3e3e3
}

.main-form .wpcf7-form-control-wrap.files input[type=file] {
    font-size: 200px;
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0
}

.main-form .wpcf7-form-control-wrap input.wpcf7-form-control,
.main-form .wpcf7-form-control-wrap textarea,
.main-form .wpcf7-form-control-wrap.files {
    width: 100%;
    padding: 10px 50px;
    resize: none;
    border-radius: 4px;
    float: left;
    height: 58px;
    z-index: 9;
    position: relative;
    border: none;
    border-bottom: 1px solid #d7d7d7cc
}

.main-form .wpcf7-form-control-wrap textarea {
    height: 80px
}

.main-form .contact-info>.btn-file-input {
    display: inline-block;
    width: 200px;
    height: 40px
}

.main-form {
    position: relative
}

.main-form:after {
    content: "";
    width: 100%;
    height: 220px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #0328d2
}

.main-form .contact-info {
    padding-left: 30px
}

.main-form .form-sec p {
    float: left;
    width: 46.9%;
    position: relative;
    margin-right: 20px;
    margin-bottom: 20px
}

.main-form .contact-info .call-us {
    float: left;
    width: 100%;
    color: #fff;
    font-weight: 300;
    position: absolute;
    bottom: 20px;
    left: 31px;
    font-size: 17px
}

.main-form .form-sec h3 img {
    height: 67px
}

.main-form .form-sec h3 {
    font-weight: 300;
    font-size: 39px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #fff
}

.main-form .form-sec .icon {
    font-size: 18px;
    width: 23px;
    opacity: .5;
    position: absolute;
    left: 13px;
    top: 16px;
    z-index: 10
}

.main-form .form-sec span.cus-label {
    position: absolute;
    left: 42px;
    top: 17px;
    opacity: .5
}

.main-form .form-sec p.full {
    width: 96.5%;
    float: left
}

.main-form .form-sec .wpcf7-submit {
    width: 100%;
    background: #f2f2f2;
    padding: 15px;
    font-weight: 300;
    text-transform: uppercase;
    font-size: 19px;
    letter-spacing: 3px;
    color: #807474;
    border-radius: 3px;
    border: 1px solid #e6e6e6
}

.main-form .contact-info h3 {
    margin: 30px 0;
    color: #fff;
    font-weight: 500;
    font-size: 17px;
    letter-spacing: 1px;
    opacity: .8
}

.main-form .contact-info .contact-block {
    background: #fff;
    border-radius: 6px;
    font-weight: 700;
    line-height: 72px;
    padding-left: 20px;
    font-size: 20px;
    text-transform: capitalize;
    height: 72px;
    -webkit-box-shadow: 0 3px 12px -3px #2f29a7;
    box-shadow: 0 3px 12px -3px #2f29a7
}

.main-form .contact-info .contact-block i {
    font-size: 25px;
    margin-right: 10px
}

.main-form .contact-info img {
    float: left;
    position: relative;
    margin-right: 10px;
    height: 40px
}

.main-form .form-sec {
    padding-top: 40px;
    padding-bottom: 40px
}

.main-form .social-link li a {
    color: #028cf2;
    width: 40px;
    display: inherit;
    height: 40px;
    text-align: center;
    line-height: 40px;
    font-size: 20px;
    border-radius: 4px;
    background: #fff;
    margin: 0 4px;
    border: none
}

.bar-2,
.bg-fbox {
    display: none
}

.main-form .contact-info {
    padding-top: 40px;
    padding-bottom: 70px;
    margin-top: 180px
}

.file-up {
    background: #fff;
    border-radius: 4px
}

.zig-zag {
    padding-bottom: 0!important;
    padding-top: 0!important
}

.zig-zag .title-h2 {
    margin: 0
}

.client-tesi .slick-slider {
    margin-top: 50px
}

.client-tesi:after {
    content: '';
    width: 100%;
    height: 100%;
    background: #fff;
    position: absolute;
    top: 0;
    z-index: 9;
    float: left;
    opacity: .4
}

.client-tesi .container {
    position: relative;
    z-index: 99
}

.imgfit {
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100vh
}

.slider-meta .sub-txt {
    color: #fff;
    width: 100%;
    display: block;
    margin-bottom: 20px
}

.s-container {
    width: 1170px;
    margin: 0 auto;
    position: absolute;
    z-index: 99;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    float: left;
    height: 100vh;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column
}

#slider,
.list li {
    position: relative
}

#slider {
    display: inherit;
    overflow: hidden;
    height: 100%;
    width: 100%;
    clear: both
}

.slider-meta.about h1 {
    font-weight: 500;
    font-size: 50px;
    padding: 0 70px;
    margin-bottom: 20px
}

.slider-meta.about i:before {
    font-size: 160px;
    background: -webkit-gradient(linear, left top, right top, color-stop(20%, #fff), color-stop(40%, #0328d2), color-stop(60%, #4a86f7), color-stop(80%, #fff));
    background: linear-gradient(to right, #fff 20%, #0328d2 40%, #4a86f7 60%, #fff 80%);
    background-size: 200% auto;
    color: #000;
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: shine 2s linear infinite;
    animation: shine 2s linear infinite
}

@-webkit-keyframes shine {
    to {
        background-position: 200% center
    }
}

@keyframes shine {
    to {
        background-position: 200% center
    }
}

.about-box,
.about-sec .box {
    background: #fff;
    position: relative
}

.heading-block {
    color: #000;
    font-weight: 700;
    display: inline-table;
    /*margin: 0 0 20px;*/
    -webkit-transition: .4s all;
    transition: .4s all;
    font-size: 31px
}

.heading-block .color {
    color: #0692f6
}

h2 span {
    color: #0328d2
}

.about-box {
    -webkit-box-shadow: 1px 13px 22px #e6e6e6;
    box-shadow: 1px 13px 22px #e6e6e6;
    padding: 20px;
    z-index: 8;
    right: 10px
}

.about-sec .box {
    margin-top: 33px;
    -webkit-box-shadow: 9px 0 23px -20px silver;
    box-shadow: 9px 0 23px -20px silver;
    left: -50px;
    padding: 50px;
    width: 110%
}

.about-sec .cutre {
    margin-top: 50px;
    float: left;
    width: 100%
}

.proc-bg {
    padding: 40px 0;
    text-align: center
}

.quote-box {
    padding: 50px 0;
    background: #e6f2fc
}

.quote-box h3 {
    font-size: 30px;
    font-weight: 300
}

.quote-box .btn {
    background: linear-gradient(135deg, #3356db 0, #027ef7 60%, #2093e7 100%);
    color: #fff;
    font-weight: 500;
    padding: 13px 30px;
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: 1px
}

.mb-40 {
    margin-bottom: 40px!important
}

.intro-txt {
    background-color: #193b6f;
    padding: 40px 0;
    background-repeat: no-repeat;
    background-size: 470px;
    background-position: 15% 0
}

.hire-sec,
.row.engagement-sec {
    padding: 50px 0
}

.intro-txt span {
    color: #fff;
    opacity: .8;
    font-size: 18px
}

.popup-content .close-ic,
body.nsf-soft .navbar-nav>li {
    opacity: 0;
    visibility: hidden
}

.intro-txt h2 {
    color: #fff;
    font-size: 36px
}

.intro-txt .col-md-7 {
    border-left: 1px solid #5187d8
}

.intro-txt .col-md-5 span {
    display: none
}

.intro-txt p {
    color: #fff;
    font-weight: 300
}

.hire-sec {
    background: #2b61b1
}

.hire-sec h3,
.hire-sec p {
    color: #fff;
    text-align: center
}

.hire-sec .col-md-4 {
    text-align: center
}

.engagement-sec h2 {
    font-size: 60px
}

.bgfaded {
    background: #f2f2f2
}

.list {
    list-style: none;
    display: inline-block;
    width: 100%
}

.popup-content .close-ic span,
.this_footer .material-form .contact-block {
    display: none
}

.list li {
    font-size: 20px;
    color: #000;
    font-weight: 300;
    width: 30.6%;
    float: left;
    padding-left: 0;
    border-bottom: 1px solid #e1e1e1;
    padding-bottom: 10px;
    margin: 10px 15px
}

.list li i {
    margin-right: 15px;
    color: #c1c1c1
}

.enq-jombotron {
    position: fixed;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    top: 0;
    left: -1px;
    width: 100%;
    right: 0;
    bottom: 0;
    z-index: 99999999;
    display: none;
    overflow: hidden
}

.enq-jombotron .popup-content {
    position: absolute;
    left: 50%;
    width: 100%;
    top: 0;
    height: 100%;
    overflow: hidden;
    z-index: 9999;
    background: #171c2b;
    padding-top: 100px;
    -moz-transform: translatex(-50%);
    -webkit-transform: translatex(-50%);
    -ms-transform: translatex(-50%);
    -o-transform: translatex(-50%)
}

.enq-jombotron .material-form .contact-block {
    background: #1a42c8;
    width: 95%
}

.popup-content .close-ic {
    position: absolute;
    right: 80px;
    top: 8px;
    -webkit-transition: .3s;
    transition: .3s;
    text-transform: uppercase;
    padding: 10px 5px;
    line-height: 21px;
    text-align: center;
    border-radius: 2px;
    cursor: pointer
}

.popup-content .close-ic i:before {
    font-size: 13px
}

.popup-content .close-ic i {
    text-align: center;
    border-radius: 4px;
    z-index: 99;
    position: relative;
    margin-left: 8px;
    font-style: normal;
    font-size: 27px;
    color: #fff
}

.popup-content .close-ic:hover i,
.popup-content .close-ic:hover span {
    color: #000;
    border-color: #000
}

.enq-jombotron .material-form p {
    width: 47%
}

.this_footer .material-form p {
    width: 100%
}

.enq-popupSec:after,
.loc-block:after,
.location-sec:after {
    content: "";
    clear: both;
    display: table
}

.location-sec .loc-block {
    position: relative;
    padding-left: 60px;
    min-height: 40px;
    padding-top: 8px
}

.location-sec .loc-block .icon {
    position: absolute;
    top: 20px;
    left: 0;
    height: 50px;
    width: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 20px;
    color: #fff;
    border-radius: 2px;
    background: 0 0
}

#features-about {
    background: #222a4b;
    overflow: hidden
}

.location-sec .loc-block~.loc-block {
    margin-top: 20px
}

.location-sec .loc-block .loc-ttl {
    display: block;
    line-height: 1;
    font-weight: 500;
    color: #fff;
    margin-bottom: 5px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 15px;
    margin-top: 18px
}

.location-sec .loc-block .loc-info a,
.location-sec .loc-block .loc-info p,
.location-sec address {
    font-size: 18px;
    color: #eaf6ff
}

.shotBorder-ttl {
    position: relative;
    padding-bottom: 10px;
    color: #fff;
    font-weight: 500;
    font-size: 16px;
    display: block;
    line-height: 1;
    margin: 20px auto 10px
}

.enq-popupSec,
.enq-popupSec .head {
    margin-bottom: 30px
}

.shotBorder-ttl:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 2px;
    background: #fff
}

.enq-popupSec {
    position: relative;
    clear: both
}

.enq-popupSec .head h4 {
    display: block;
    line-height: 1;
    font-weight: 300;
    color: #fff;
    margin-bottom: 10px
}

.enq-popupSec .head p {
    font-size: 18px;
    color: #fff
}

body.nsf-soft #header {
    background-color: transparent!important
}

body.nsf-soft .popup-content .close-ic {
    visibility: visible;
    opacity: 1
}

.header.scrolled .logo-1,
.logo-lite,
.news-and-media logo-lite {
    visibility: hidden;
    opacity: 0
}

.popup-content .close-ic.button--rayen:before {
    top: 0;
    left: 0;
    letter-spacing: 3px
}

.enq-jombotron .popup-content .head h4 {
    font-weight: 300;
    color: #fff;
    font-size: 35px;
    line-height: 40px
}

.location-tab .head p {
    color: #fff
}

.enq-jombotron .nsficon-bg:before {
    float: left;
    color: #2681cf;
    background: -webkit-gradient(linear, left top, right top, color-stop(20%, #fff), color-stop(40%, #245ce6), color-stop(60%, #fff), color-stop(80%, #fff));
    background: linear-gradient(to right, #fff 20%, #245ce6 40%, #fff 60%, #fff 80%);
    background-size: 200% auto;
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: nsficon 5s linear infinite;
    animation: nsficon 5s linear infinite;
    font-size: 500px;
    line-height: 100%;
    position: absolute;
    bottom: 0;
    text-align: center;
    margin: 0 auto;
    left: 0;
    opacity: .2
}

@-webkit-keyframes nsficon {
    to {
        background-position: 200% center
    }
}

@keyframes nsficon {
    to {
        background-position: 200% center
    }
}

.material-form {
    position: relative
}

.material-form .input-block {
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    width: 100%;
    height: 0px;
    padding: 0;
    position: relative;
    margin-bottom: 0px;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.material-form .input-block:before,
.select-block .custom-select:before {
    content: '';
    -webkit-transition: all .3s ease-out
}

.material-form .icon img {
    width: 34px
}

.material-form p {
    margin-bottom: 0;
    width: 50%
}

.material-form .input-block.floating-field input[type=file] {
    opacity: 0;
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0
}

.material-form .input-block.fileupload {
    position: absolute;
    width: 24px;
    float: right;
    right: 10px;
    z-index: 9;
    opacity: .6;
    margin: 0;
    border: none
}

.material-form .input-block:before,
.select-block .custom-select:before {
    bottom: 0;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out
}

.material-form .input-block.error,
.material-form .input-block.focus {
    border-color: #fff
}

.material-form .contact-block {
    background: #397dfe;
    border-radius: 3px;
    font-size: 17px;
    float: right;
    padding: 15px 10px;
    color: #afdaff;
    font-weight: 500;
    text-align: center;
    letter-spacing: 1px;
    text-decoration: none
}

.material-form .input-block:before {
    position: absolute;
    left: 50%;
    width: 0;
    height: 1px;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
    background-color: #fff
}

.material-form .input-block.floating-field.textarea,
.material-form .input-block.textarea {
    height: auto
}

.material-form .input-block.focus label {
    color: #fff;
    top: 0;
    font-size: 13px
}

.material-form .input-block.focus:before {
    left: 0;
    width: 100%
}

.material-form .input-block.has-value label {
    top: 0;
    font-size: 13px
}

.material-form .input-block.error:before {
    left: 0;
    width: 100%;
    background-color: #d50000
}

.material-form .input-block.textarea .form-control {
    height: auto;
    resize: none;
    padding-top: 0px
}

.material-form .input-block.floating-field {
    padding: 2px 0 0
}

.material-form .input-block label {
    position: absolute;
    left: 0;
    padding-left: 5px;
    width: 100%;
    height: 20px;
    margin: 0;
    font-weight: 500;
    z-index: 1;
    font-size: 13px;
    -webkit-transition: all .1s ease-out;
    transition: all .1s ease-out;
    white-space: nowrap;
    letter-spacing: .5px;
    line-height: 21px!important
}

.material-form .square-button,
.select-block {
    -moz-transition: all .1s ease-out;
    -o-transition: all .1s ease-out;
    width: 100%
}

.material-form .input-block .form-control {
    background-color: transparent;
    padding: 4px 0 0;
    border: none;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    height: 100%;
    width: 100%;
    position: relative;
    z-index: 2;
    font-size: 14px
}

.material-form .input-block .form-control:focus {
    outline: 0
}

.material-form .input-block .form-control:focus label {
    top: 0
}

.material-form .error-label {
    color: #d50000;
    margin-top: -15px;
    font-size: 14px;
    margin-bottom: 10px
}

.material-form .form-note {
    font-size: 13px;
    color: #fff;
    opacity: .6;
    margin-top: -5px;
    margin-bottom: 25px
}

.material-form .square-button {
    background-color: #fff;
    color: #333;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 700;
    text-align: center;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    -webkit-transition: all .1s ease-out;
    transition: all .1s ease-out;
    padding: 0;
    height: 60px;
    border: none;
    cursor: pointer;
    letter-spacing: 2px;
    border-radius: 3px
}

.select-block .active-list,
.select-block label {
    width: 100%;
    font-weight: 500;
    overflow: hidden;
    white-space: nowrap
}

.material-form .square-button:focus,
.material-form .square-button:hover {
    background-color: #fff;
    color: #2183d9
}

.material-form .sub {
    width: 100%;
    float: left
}

.select-block {
    background-color: transparent;
    padding: 12px 0 0;
    position: relative;
    margin-bottom: 20px;
    -webkit-transition: all .1s ease-out;
    transition: all .1s ease-out
}

.select-block label {
    position: absolute;
    left: 6px;
    top: 32px;
    -webkit-transition: all .1s ease-out;
    transition: all .1s ease-out;
    margin: 0;
    z-index: 1;
    color: #a5d3f8;
    font-size: 12px
}

.select-block .active-list {
    height: 52px;
    padding: 0 20px 0 0;
    color: #c9c9c9;
    position: relative;
    z-index: 2;
    cursor: pointer;
    font-size: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.select-block .active-list:after {
    font-family: FontAwesome;
    position: absolute;
    top: 50%;
    width: 20px;
    padding-left: 5px;
    text-align: left;
    height: 52px;
    line-height: 52px;
    color: #c1c1c1;
    font-size: 14px;
    margin-top: -26px;
    right: 20px
}

.select-block.added label {
    top: 0;
    font-size: 13px
}

.select-block.added .active-list {
    color: #fff;
    font-size: 12px
}

.select-block.added.focus label {
    top: 0
}

.select-block.focus label {
    top: 0;
    font-size: 13px;
    color: #fff
}

.select-block.focus .active-list {
    font-size: 12px;
    padding: 0
}

.select-block.focus .custom-select {
    padding-left: 0;
    border-color: #fff
}

.select-block.focus .active-list:after {
    font-family: FontAwesome;
    color: #fff
}

.new_testi .arrow-n span,
.new_testi .arrow-p span,
.web-list ul li {
    font-family: Gilmer
}

.select-block.focus .custom-select:before {
    left: 0;
    width: 100%
}

.select-block .custom-select {
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    display: inline-block;
    height: 52px;
    position: relative;
    padding: 0;
    width: 100%;
    line-height: 52px
}

.select-block .custom-select:before {
    position: absolute;
    left: 50%;
    width: 0;
    height: 1px;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
    background-color: #fff
}

.select-block .custom-select .list-field {
    width: 100%;
    height: 52px;
    padding: 0 15px;
    position: absolute;
    top: 0;
    left: 0;
    display: none
}

.select-block .custom-select .drop-down-list {
    width: 100%;
    height: auto;
    max-height: 280px;
    overflow-x: auto;
    z-index: 99;
    padding: 0;
    position: absolute;
    top: 100%;
    margin-top: 0;
    left: 0;
    background-color: #2e559e;
    list-style: none;
    display: none;
    -webkit-box-shadow: rgba(0, 0, 0, .11765) 0 1px 6px, rgba(0, 0, 0, .11765) 0 1px 4px;
    box-shadow: rgba(0, 0, 0, .11765) 0 1px 6px, rgba(0, 0, 0, .11765) 0 1px 4px
}

.sidebar-contact .select-block .custom-select .drop-down-list {
    background: #fff
}

.sidebar-contact .select-block .custom-select .drop-down-list li,
.sidebar-contact .select-block .custom-select .drop-down-list li:hover {
    color: #333
}

.select-block .custom-select .drop-down-list li {
    padding: 13px 20px;
    cursor: pointer;
    font-size: 12px;
    line-height: normal;
    color: #fff;
    margin-bottom: 1px;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.select-block .custom-select .drop-down-list li input[type=checkbox] {
    margin: 0 8px 0 0;
    position: relative;
    top: 1px
}

.select-block .custom-select .drop-down-list li label {
    font-weight: 300;
    cursor: pointer;
    display: block
}

.select-block .custom-select .drop-down-list li:hover {
    color: #fff;
    background-color: rgba(0, 0, 0, .05)
}

.select-block .custom-select .drop-down-list .add-new {
    border-top: solid 1px #c8c8c8;
    padding: 15px;
    color: #3c3c3c
}

.select-block .custom-select .drop-down-list .add-new i {
    font-size: 16px;
    margin-top: 3px;
    color: #939393
}

.material-form div.wpcf7-mail-sent-ok {
    border: none;
    width: 100%;
    float: left;
    padding: 7px 20px
}

@media (min-width:768px) {
    .contact-wrap {
        max-width: 580px;
        background: #0328d2;
        margin-left: auto;
        margin-top: 50px;
        margin-right: auto;
        position: relative;
        z-index: 9;
        padding: 25px 30px 30px;
        width: 100%;
        display: inline-block
    }
    .material-form .input-block .form-control,
    .select-block.added .active-list {
        padding-left: 5px;
        font-size: 18px
    }
    .material-form .input-block label {
        font-size: 16px;
        line-height: 14px
    }
    .select-block label {
        font-size: 16px
    }
    .select-block.added .active-list {
        color: #fff
    }
    .select-block.focus .active-list {
        font-size: 18px
    }
    .select-block .custom-select .drop-down-list li {
        font-size: 15px
    }
}

.material-form h1 {
    color: #fff;
    padding: 40px 0 0;
    margin: 0;
    font-size: 30px;
    text-transform: uppercase;
    font-weight: 700;
    text-align: center
}

.material-form h1 small {
    font-size: 18px;
    display: block;
    text-transform: none;
    font-weight: 300;
    margin-top: 10px;
    color: #ff1631
}

.made-with-love {
    margin-top: 40px;
    padding: 10px;
    clear: left;
    text-align: center;
    font-size: 10px;
    color: #fff
}

.made-with-love i {
    font-style: normal;
    color: #fff;
    font-size: 14px;
    position: relative;
    top: 2px
}

.made-with-love a {
    color: #fff;
    text-decoration: none
}

.made-with-love a:hover {
    text-decoration: underline
}

.contact-wrap h3 {
    text-align: center;
    color: #fff;
    font-size: 35px;
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 500
}

.nsf-slide .slider-meta.left-services {
    text-align: left
}

.nsf-slide a.nsf-logo i {
    color: #7d7d7d;
    font-size: 223px;
    position: absolute;
    opacity: .1;
    left: 110px;
    z-index: -1
}

.sub-heading {
    font-size: 17px;
    width: 80%;
    margin: 0 auto
}

.color {
    color: #0328D2!important
}

.mobile-app-development-box .col-md-3 img,
.mobile-app-development-box .col-md-4 img,
.mobile-app-development-box .col-md-6 img {
    padding: 7px;
    height: 120px
}

.mobile-app-development-box .col-md-3,
.mobile-app-development-box .col-md-4,
.mobile-app-development-box .col-md-6 {
    -webkit-transition: .4s;
    transition: .4s;
    text-align: center;
    padding: 30px 20px;
    -webkit-box-shadow: 0 0 0 1px #e4ebf0;
    box-shadow: 0 0 0 1px #e4ebf0;
    background: #f2f2f2
}

.mobile-app-development-box .col-md-4:nth-child(even) {
    background: #fff;
    -webkit-box-shadow: 0 1px 17px 0 #ededed;
    box-shadow: 0 1px 17px 0 #ededed
}

.mobile-app-development-box .col-md-3:hover,
.mobile-app-development-box .col-md-4:hover,
.mobile-app-development-box .col-md-6:hover {
    -webkit-box-shadow: 1px 0 34px 1px rgba(0, 0, 0, .09), 0 15px 34px 1px rgba(0, 0, 0, .08);
    box-shadow: 1px 0 34px 1px rgba(0, 0, 0, .09), 0 15px 34px 1px rgba(0, 0, 0, .08);
    -webkit-transform: translateY(-20px) scale(1.01);
    transform: translateY(-20px) scale(1.01);
    position: relative;
    z-index: 77;
    background: #fff
}

.mobile-app-development-box .col-md-3 h4,
.mobile-app-development-box .col-md-4 h4,
.mobile-app-development-box .col-md-6 h4 {
    font-size: 22px;
    font-weight: 700;
    color: #0328d2
}

.mobile-app-development-box .col-md-6 {
    background: #fff
}

.industry_sec ul {
    margin: 50px 0 0;
    padding: 0;
    list-style: none;
    float: left;
    width: 100%;
    text-align: center
}

.industry_sec ul li {
    position: relative;
    padding: 20px 0;
    display: inline;
    width: 14%;
    float: left;
    border-bottom: 1px solid #cce4ff
}

.industry_sec ul li img {
    height: 50px
}

section.industry_sec {
    background: #fff;
    /*padding: 35px 0*/
}

.industry_sec ul li h5 {
    margin: 10px 0 0;
    color: #434b63;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .5px
}

.menu-btn .button--rayen:hover:before {
    letter-spacing: 2px
}

.industry_sec ul li:after {
    content: "";
    height: 0;
    left: 0;
    width: 100%;
    position: absolute;
    background: #f2f2f2;
    transition: all .1s ease 0;
    -webkit-transition: all .1s ease 0;
    z-index: 1;
    mix-blend-mode: multiply;
    right: 0;
    margin: 0 auto;
    bottom: 0
}

.industry_sec ul li:hover h5,
.industry_sec ul li:hover img {
    color: #077af4;
    -webkit-filter: none;
    filter: none
}

.industry_sec ul li a {
    color: #333;
    text-decoration: none!important;
    position: relative;
    z-index: 3;
    font-size: 14px
}

#return-to-top,
.common-Button,
.globalFooterNav a,
.globalNav a,
header .Contact_top {
    text-decoration: none
}

.industry_sec ul li:hover:after {
    height: 100%
}

.industry_sec ul li:nth-child(15),
.industry_sec ul li:nth-child(16),
.industry_sec ul li:nth-child(17),
.industry_sec ul li:nth-child(18),
.industry_sec ul li:nth-child(19),
.industry_sec ul li:nth-child(20),
.industry_sec ul li:nth-child(21),
.industry_sec ul li:nth-child(22) {
    border-bottom: none
}

.nsf-slide .slider-form input,
.nsf-slide .slider-form span,
.nsf-slide .slider-form textarea {
    resize: none
}

.nsf-slide .slider-form {
    margin-top: 20px;
    background: #fff;
    padding: 10px;
    border-radius: 3px;
    -webkit-box-shadow: 1px 0 11px -8px #003ac5;
    box-shadow: 1px 0 11px -8px #003ac5;
    float: left;
    width: 100%
}

.nsf-slide .slider-form .wpcf7-submit,
.nsf-slide .slider-form p {
    width: 100%
}

.nsf-slide .slider-form .material-form .input-block {
    margin-bottom: 15px
}

.nsf-slide .slider-form .material-form .input-block label {
    font-size: 14px;
    font-weight: 500
}

.nsf-slide .slider-form .material-form .input-block label.error {
    text-align: right;
    color: #bf1515
}

.six-feature-box .right,
.slider__title {
    text-align: center
}

.nsf-slide .slider-form .wpcf7-submit:hover {
    background: #286ef2;
    color: #fff
}

.nsf-slide .slider-form h3 {
    color: #2196f3;
    margin: 0;
    text-align: center;
    font-weight: 700;
    font-size: 25px;
    padding-top: 0
}

.nsf-slide .slider-form .wpcf7-submit {
    font-weight: 700;
    line-height: 0;
    height: 54px;
    font-size: 13px
}

.nsf-slide .slider-form div.wpcf7-response-output {
    font-size: 11px;
    margin: 0;
    padding: 0;
    color: #fff
}

.nsf-slide .slider-form p {
    margin-bottom: 0
}

div.wpcf7-acceptance-missing,
div.wpcf7-validation-errors {
    border: none!important
}

.font-20 {
    font-size: 20px!important
}

.pr-0 {
    padding-right: 0!important
}

.nsf-slide .slider-form.Become-Partner .wpcf7-form-control {
    margin: 10px 0
}

.nsf-slide .slider-form.Become-Partner .wpcf7-not-valid-tip {
    line-height: 0
}

.nsf-slide .slider-form.Become-Partner .select-wrapper:after {
    color: #fff
}

.nsf-slide .slider-form.Become-Partner .wpcf7-submit {
    border: none;
    background: linear-gradient(135deg, #3356db 0, #027ef7 60%, #2093e7 100%);
    color: #fff
}

.nsf-slide .slider-form select.wpcf7-form-control {
    color: #fff;
    padding: 15px
}

.nsf-slide .slider-form select.wpcf7-form-control option {
    color: #333!important
}

.nsf-slide .slider-form.Become-Partner .wpcf7-submit:focus,
.nsf-slide .slider-form.Become-Partner .wpcf7-submit:hover {
    background: #fff;
    color: #006ec6
}

.select-wrapper {
    position: relative;
    display: inline-block;
    width: 100%
}

.select-wrapper:after {
    color: #000;
    content: '▾';
    margin-right: 10px;
    pointer-events: none;
    position: absolute;
    right: 10px;
    top: 21px;
    font-size: 20px
}

.select-wrapper select {
    border: none;
    border-radius: 0;
    cursor: pointer;
    padding: 12px;
    width: 100%;
    font-size: 16px
}

.select-wrapper select:focus {
    color: #000
}

.select-wrapper select::-ms-expand {
    display: none
}

.page-title span:after {
    content: '';
    height: 3px;
    display: inline-block;
    width: 0;
    background: -webkit-gradient(linear, left top, right top, color-stop(13%, #1b8bf8), color-stop(88%, #23dfb8));
    background: linear-gradient(90deg, #1b8bf8 13%, #23dfb8 88%);
    -webkit-animation: underline 1s .5s;
    animation: underline 1s .5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1
}

@-webkit-keyframes underline {
    to {
        width: 100%
    }
}

@keyframes underline {
    to {
        width: 100%
    }
}

h1 span {
    font-weight: 300
}

@media (max-width:1200px) and (min-width:768px) {
    canvas#web-summit-canvas {
        height: calc(51.26vw - 30px)
    }
}

@media (max-width:767px) {
    canvas#web-summit-canvas {
        height: 580px
    }
}

body.menu-open {
    position: fixed;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    overflow-y: scroll
}

.slider__title h3 {
    font-size: 16px;
    font-weight: 300;
    display: inline-block;
    padding: 5px 20px;
    margin-top: 0;
    margin-bottom: 40px;
    background: #f2f2f2;
    margin-left: 10px;
    border-radius: 3px
}

#header progress {
    display: block;
    height: 4px;
    width: 100%;
    position: absolute;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent
}

#header progress::-moz-progress-bar {
    background-color: #cdd5e4
}

#header progress::-webkit-progress-bar {
    background-color: transparent
}

#header progress::-webkit-progress-value {
    background-color: #cdd5e4
}

.count-list {
    counter-reset: nsf-counter;
    padding: 0!important;
    margin: 0
}

.count-list li:before {
    counter-increment: nsf-counter;
    content: ""counter(nsf-counter) ": ";
    font-weight: 300;
    border-left: 2px solid;
    padding-left: 10px;
    border-radius: 50px
}

.soft_d_s h3 {
    color: #4c68a8;
    font-weight: 700;
    font-size: 24px;
    letter-spacing: -.4px
}

.nav>li>a,
.six-feature-box .right p {
    letter-spacing: .5px
}

.soft_d_s .col-md-4 {
    background: #fff;
    padding: 20px 15px;
    -webkit-transition: .4s;
    transition: .4s;
    min-height: 560px
}

.soft_d_s .col-md-4:nth-child(odd) {
    background: #dee7ff
}

.soft_d_s .col-md-4:hover {
    background: #000b62;
    color: #fff
}

.soft_d_s .col-md-4:hover p {
    color: #8a9ecc
}

.soft_d_s .col-md-4:hover img,
.soft_d_s .col-md-4:nth-child(2) img {
    -webkit-filter: brightness(2);
    filter: brightness(2)
}

.six-feature-box img {
    height: 68px;
    margin: 0 auto
}

.six-feature-box .right h4 {
    color: #212020;
    font-weight: 500;
    font-size: 20px
}

.six-feature-box .col-md-4 {
    -webkit-transition: .3s;
    transition: .3s;
    padding: 30px 20px;
    border: 1px solid #dedede;
    margin-left: -1px;
    margin-bottom: -1px
}

.six-feature-box .col-md-4:hover {
    border-color: transparent;
    background: #fff;
    -webkit-box-shadow: 0 9px 35px -7px #c1c1c1;
    box-shadow: 0 9px 35px -7px #c1c1c1;
    -webkit-transform: scale(.9);
    transform: scale(.9)
}

.McButton span {
    display: block;
    width: 33px;
    height: 2px;
    margin-bottom: 7px;
    position: relative;
    background: #fff;
    z-index: 1;
    -webkit-transform-origin: 30px 0;
    transform-origin: 30px 0;
    -webkit-transition: background .5s cubic-bezier(.77, .2, .05, 1), opacity .55s ease, -webkit-transform .5s cubic-bezier(.77, .2, .05, 1);
    transition: background .5s cubic-bezier(.77, .2, .05, 1), opacity .55s ease, -webkit-transform .5s cubic-bezier(.77, .2, .05, 1);
    transition: transform .5s cubic-bezier(.77, .2, .05, 1), background .5s cubic-bezier(.77, .2, .05, 1), opacity .55s ease;
    transition: transform .5s cubic-bezier(.77, .2, .05, 1), background .5s cubic-bezier(.77, .2, .05, 1), opacity .55s ease, -webkit-transform .5s cubic-bezier(.77, .2, .05, 1)
}

.McButton span:first-child {
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0
}

.McButton span:nth-last-child(2) {
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%
}

.McButton.active span {
    opacity: 1;
    -webkit-transform: rotate(45deg) translate(-2px, -1px);
    transform: rotate(45deg) translate(-2px, -1px);
    background: #fff
}

.McButton.active span:nth-last-child(3) {
    opacity: 0;
    -webkit-transform: rotate(0) scale(.2, .2);
    transform: rotate(0) scale(.2, .2)
}

.McButton.active span:nth-last-child(2) {
    -webkit-transform: rotate(-45deg) translate(0, 11px);
    transform: rotate(-45deg) translate(0, 11px)
}

.navbar-toggle {
    margin-top: 0;
    margin-bottom: 0
}

.nav-up {
    top: 0;
    background: #fff
}

header.header.nav-down {
    top: 0
}

.navbar-fixed-top.scrolled,
body.news-and-media .navbar-fixed-top {
    background-color: #fff!important;
    -webkit-transition: background-color .2s linear;
    transition: background-color .2s linear
}

.header.scrolled,
body.news-and-media {
    background: #fff;
    border-bottom: 1px solid #e4e4e4
}

.header.scrolled .navbar-nav li>a.dropdown-toggle:after {
    border-bottom-color: #e2e2e2!important
}

.header.scrolled .navbar-nav>li>a,
body.news-and-media .navbar-nav>li>a {
    color: #333
}

.logo-lite {
    position: absolute
}

.menu-btn .button--rayen:before {
    padding-left: 27px!important
}

.header.scrolled .logo-lite {
    opacity: 1;
    visibility: visible;
    position: relative
}

.nav>li>a {
    padding: 25px 10px;
    text-transform: capitalize
}

.header .nav>li>a {
    border-bottom: 2px solid;
    border-color: transparent;
    color: #fff
}

.header .nav>li>a:hover {
    color: #fff;
    border-bottom-color: transparent;
    background-color: transparent
}

.header.scrolled .nav>li>a:hover {
    color: #333
}

.header.scrolled .logo-1,
body.nsf-soft .logo-lite {
    display: none
}

body.nsf-soft .logo-1 {
    opacity: 1!important;
    visibility: visible!important;
    display: block!important
}

.bg-faded {
    background: #f8f8f8!important
}

.nsf_counters .number-percentage-count span {
    font-weight: 500;
    font-size: 30px;
    line-height: 80px
}

.nsf_counters.bg-1 {
    background: #7282a1;
    padding: 40px 0;
    color: #fff;
    overflow: hidden
}

.nsf_counters.bg-1 p {
    opacity: .6;
    color: #fff;
    padding: 0;
    margin: 10px 0 0;
    font-weight: 300;
    letter-spacing: 1px
}

.nsf_counters .row .col-md-2 {
    border-right: 1px dashed #889abf
}

.nsf_counters .row .col-md-2:last-child {
    border-right: none
}

.nsf_counters.bg-1 .row .single-funfact img {
    opacity: 1;
    -webkit-filter: invert(10);
    filter: invert(10);
    height: 50px;
    margin: 0 auto;
    display: block!important
}

.development-stages {
    padding: 70px 0 65px;
    background: #fff;
    position: relative;
    overflow: hidden
}

.development-items {
    margin-top: 70px
}

.development-item-wrap {
    position: relative
}

.development-item-wrap:nth-child(2n) {
    height: 90px!important
}

.development-item-wrap:nth-child(2n) .development-menu-item:before {
    left: -70px
}

.development-item-wrap:nth-child(2n) .development-menu-item:after {
    left: -87px
}

.development-item-wrap:nth-child(odd) .development-menu-item:before {
    right: -70px
}

.development-item-wrap:nth-child(odd) .development-menu-item:after {
    right: -87px
}

.development-item-wrap .development-menu-item:after {
    content: "";
    display: none;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    position: absolute;
    top: -27px;
    background: url(https://codologi.in/images/development-stages-menu-item.png) no-repeat
}

.development-item-wrap .development-menu-line {
    height: calc(100% - 58px);
    width: 1px;
    background: #dce2e9;
    position: absolute;
    top: 30px;
    left: 50%
}

.development-item-wrap:last-child .development-menu-line {
    display: none
}

.development-item-wrap:nth-child(2) {
    margin-top: 110px
}

.development-item-wrap .development-stages-item:hover .development-menu-item:after {
    display: block
}

.development-item-wrap .development-stages-item:hover:after,
.development-item-wrap.center .development-menu-item,
.development-item-wrap.hover-active .development-stages-item:after {
    display: none
}

.development-item-wrap .development-stages-item:hover .development-item-img {
    color: #fff
}

.development-item-wrap.center {
    margin-top: 0
}

.development-item-wrap.center .development-stages-item:before {
    content: "";
    width: 67px;
    height: 35px;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: -35px;
    background: url(https://codologi.in/images/bubbler-fix.png);
    border: none
}

.development-item-wrap.center .development-stages-item:hover:before {
    background: url(https://codologi.in/images/bubbler-hover.png);
    border: none
}

.development-item-wrap.right .col-lg-9 {
    float: right
}

.development-item-wrap.right .col-lg-9:before {
    opacity: 0;
    content: "";
    width: 541px;
    height: 541px;
    background: url(https://codologi.in/images/impulse.png) no-repeat;
    background-size: cover;
    position: absolute;
    right: -160px;
    top: -157px
}

.development-item-wrap.right .col-lg-9:hover:before {
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
    opacity: 1
}

.development-item-wrap.right .development-stages-item:before {
    border-width: 0 18px 18px 0;
    left: -18px;
    top: -1px
}

.development-item-wrap.right .development-stages-item:after {
    border-width: 0 16px 16px 0;
    left: -16px;
    top: 0
}

.development-item-wrap.left .col-lg-9:before {
    opacity: 0;
    content: "";
    width: 541px;
    height: 541px;
    background: url(https://codologi.in/images/impulse.png) no-repeat;
    background-size: cover;
    position: absolute;
    left: -160px;
    top: -132px
}

.development-item-wrap.left .col-lg-9:hover:before {
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
    opacity: 1
}

.development-item-wrap.left .development-stages-item:before {
    border-width: 0 0 18px 18px;
    right: -18px;
    top: -1px
}

.development-item-wrap.left .development-stages-item:after {
    border-width: 0 0 16px 16px;
    right: -16px;
    top: 0
}

.development-item-wrap.hover-active .col-lg-9:before {
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
    opacity: 1
}

.development-item-wrap.hover-active .development-stages-item {
    background: #006bde;
    color: #fff;
    border: 1px solid #006bde;
    text-align: left;
    -webkit-box-shadow: 0 5px 43px 3px rgba(0, 107, 222, .15);
    box-shadow: 0 5px 43px 3px rgba(0, 107, 222, .15)
}

.development-item-wrap.hover-active .development-stages-item:before {
    border-color: transparent #006bde
}

.development-item-wrap.hover-active .development-stages-item .development-item-img {
    color: #fff
}

.development-item-wrap.hover-active .development-menu-item:after {
    display: block
}

.development-stages-item {
    background: #f3f7fb;
    padding: 50px;
    position: relative;
    z-index: 3;
    border: 1px solid #dce2e9
}

.development-stages-item:hover {
    background: #006bde;
    color: #fff;
    border: 1px solid #006bde;
    -webkit-box-shadow: 0 5px 43px 3px rgba(0, 107, 222, .15);
    box-shadow: 0 5px 43px 3px rgba(0, 107, 222, .15)
}

.development-stages-item:hover .development-menu-item:before {
    background: #006bde
}

.development-stages-item:hover:after,
.development-stages-item:hover:before {
    border-color: transparent #006bde
}

.development-stages-item:after,
.development-stages-item:before {
    content: '';
    position: absolute;
    border-style: solid;
    border-color: transparent #dce2e9;
    display: block;
    width: 0;
    z-index: 0
}

.development-stages-item:after {
    border-color: transparent #f3f7fb;
    z-index: 1
}

.development-stages-item p {
    font-size: 16px;
    margin-bottom: 0;
    margin-top: 20px;
    overflow: hidden
}

.development-menu-item {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1
}

.development-menu-item:before {
    content: "";
    width: 20px;
    height: 20px;
    background: #dce2e9;
    border-radius: 50%;
    position: absolute;
    top: -10px
}

.hover-active .development-stages-item .development-menu-item:before {
    background: #006bde
}

.development-item-wrap.center.hover-active .development-stages-item:before {
    background: url(https://codologi.in/images/bubbler-hover.png);
    border: none
}

.development-item-img {
    background-repeat: no-repeat;
    margin-right: 25px;
    color: #006bde
}

.development-item-desc {
    width: calc(100% - 93px);
    display: inline-block;
    vertical-align: top
}

.development-stages-item-title {
    font-weight: 700;
    font-size: 21px;
    margin-bottom: -5px
}

.services-page .home-banner {
    height: 351px;
    padding-bottom: 90px
}

.services-page h1 {
    padding: 0 20px;
    margin-bottom: 0
}

.services-desc {
    padding-top: 75px
}

.services-page-wrap {
    text-align: center;
    padding-top: 50px;
    padding-bottom: 30px
}

.services-page-wrap p {
    color: #7b7b7b;
    margin-bottom: 75px
}

.development-item-wrap .development-item-img i {
    font-size: 40px;
    color: #333;
    line-height: 60px
}

.development-item-wrap:hover .development-item-img i {
    color: #fff
}

.bg-color {
    background-color: #f7f7fb
}

.bg-color-1 {
    background-color: #5247a5
}

.mg-tp-20 {
    margin-top: 20px
}

.mg-tp-30 {
    margin-top: 30px
}

.mg-tp-40 {
    margin-top: 40px
}

.mg-tp-80 {
    margin-top: 80px
}

.mg-bt-0 {
    margin-bottom: 0!important
}

.mg-bt-20 {
    margin-bottom: 20px
}

.mg-bt-30 {
    margin-bottom: 30px
}

.mg-bt-40 {
    margin-bottom: 40px
}

.mg-bt-60 {
    margin-bottom: 60px
}

.mg-tp-60 {
    margin-top: 60px
}

.pd-bt-40 {
    padding-bottom: 40px
}

.pd-bt-60 {
    padding-bottom: 60px
}

.pd-bt-80 {
    padding-bottom: 80px
}

.pd-bt-100 {
    padding-bottom: 100px
}

.pd-tp-20 {
    padding-top: 20px
}

.pd-tp-30 {
    padding-top: 30px
}

.pd-tp-50 {
    padding-top: 50px
}

.pd-tp-40 {
    padding-top: 40px
}

.pd-tp-60 {
    padding-top: 60px
}

.pd-tp-80 {
    padding-top: 80px
}

.padd-40 {
    padding-top: 40px;
    padding-bottom: 40px
}

.padd-60 {
    padding-top: 60px;
    padding-bottom: 60px
}

.padd-80 {
    padding-top: 80px;
    padding-bottom: 80px
}

.padd-100 {
    padding-top: 100px;
    padding-bottom: 100px
}

.padd-130 {
    padding-top: 130px;
    padding-bottom: 130px
}

.padd-150,
.padd-title {
    padding-top: 150px
}

.padd-150 {
    padding-bottom: 150px
}

.padd-bt-0 {
    padding-bottom: 0!important
}

.btn {
    padding: 10px 24px!important
}

.btn-white {
    background-color: #fff;
    color: #333;
    border-color: #fff
}

.btn-white:hover {
    background-color: transparent;
    color: #fff;
    border-color: #fff
}

.btn-color {
    background-color: #737afb;
    color: #fff
}

.btn-color:hover {
    background-color: #545dff;
    color: #fff
}

.btn-border.color-1 {
    color: #00208a;
    border: 1px solid #00208a
}

.hero,
.list-p li {
    position: relative!important
}

.hero {
    height: 100vh;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.hero-padd {
    padding-top: 150px
}

.hero-text {
    margin-top: 40px
}

.hero-text h1,
.hero-text h2 {
    font-size: 51px;
    color: #fff;
    margin-bottom: 20px;
    line-height: 66px;
    font-weight: 700
}

.hero-text p {
    color: #fff;
    margin-bottom: 30px;
    margin-top: 10px;
    font-size: 16px
}

.title-h2 {
    font-size: 32px;
    color: #16113f;
    font-weight: 900
}

p.font-p {
    color: #333;
    font-size: 16px;
    margin-top: 20px
}

.icon-block i,
.icon-block img {
    width: 80px;
    float: left;
    margin-bottom: 25px;
    height: auto
}

.icon-block i {
    font-size: 36px;
    margin: 0;
    background: #e0dbfb;
    line-height: 79px;
    border-radius: 50%;
    color: #514899;
    -webkit-transform: scale(.8);
    transform: scale(.8)
}

.icon-block h3 {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 18px;
    color: #4b456f
}

.icon-info {
    padding-left: 15px
}

.icon-block {
    margin-bottom: 35px
}

img.img-width {
    width: 400px
}

.features-text span {
    color: #171f3c;
    font-size: 24px;
    line-height: 30px;
    font-weight: 300
}

.tabs-section .tab-content p {
    font-size: 14px;
    font-weight: 400
}

.nav-tabs .nav-link:hover,
.tabs-section .nav-tabs .nav-link.active {
    border-color: transparent;
    color: #00208a;
    border-bottom: 2px solid #00208a
}

.nav-tabs .nav-link {
    font-size: 16px;
    font-weight: 600;
    color: #bcbed6
}

.list-p li {
    padding-left: 25px;
    color: #88889b;
    font-weight: 400
}

.list-p li:before {
    content: "\52";
    position: absolute;
    left: -5px;
    top: 0;
    color: #6d92ef;
    display: inline-block;
    font-size: 18px;
    font-weight: 300
}

.call-to-action-text h2 {
    color: #fff;
    font-size: 45px;
    line-height: 50px;
    font-weight: 300;
    margin-bottom: 10px
}

.call-to-action-text p {
    color: #fff;
    margin-bottom: 0
}

.call-to-action-btn {
    padding-top: 45px;
    position: relative
}

.title-h3 {
    font-size: 18px;
    font-weight: 600
}

.icon-app .icon img {
    width: 45px;
    position: relative;
    top: 0;
    float: left
}

.icon-app {
    padding: 20px;
    background-color: #fff;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    margin-bottom: 25px;
    border: 1px solid #d8d8d8
}

.icon-app:hover {
    background: #fff
}

.icon-app .icon {
    float: left;
    margin-bottom: 10px;
    line-height: 70px;
    width: 100%
}

.web_services_2 .icon-app:hover img {
    -webkit-filter: none;
    filter: none
}

.web_services_2 .icon-app:hover h3 {
    color: #0328d2
}

.icon-app p {
    font-size: 16px;
    letter-spacing: .4px
}

.icon-app h3 {
    color: #333;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    font-weight: 800;
    text-transform: capitalize;
    font-size: 17px;
    line-height: 28px;
    margin-top: 0
}

.author-bio span,
.meta ul li,
.sidebar-side h3 {
    text-transform: uppercase
}

.icon-header {
    min-height: 40px;
    margin-top: 4px;
    margin-bottom: 10px
}

.chart {
    position: relative;
    display: inline-block;
    margin: 10px;
    color: #c4e6ff;
    font-size: 18px;
    letter-spacing: 1.4px;
    font-weight: 500
}

.chart canvas {
    position: absolute;
    top: 0;
    left: 0
}

.table-price {
    margin-bottom: 20px
}

.prinicng-container {
    margin: 20px auto auto;
    border-radius: 30px;
    padding-top: 0;
    padding-bottom: 0
}

#features-about li a.nav-link {
    padding: 12px 25.3px;
    text-transform: uppercase;
    font-weight: 700;
    border-bottom: 2px solid;
    letter-spacing: 0;
    border-color: transparent
}

#features-about .nav-tabs>li {
    float: none;
    display: inline-block
}

.avatar-photo,
.meta ul li:first-child,
.website_dev_services .right_s .row-services .head img {
    float: left
}

#features-about .nav-tabs .nav-item a:hover {
    background-color: transparent
}

#features-about .nav-tabs .nav-item.active .nav-link {
    color: #fff!important;
    background-color: transparent;
    border-bottom: 2px solid
}

#features-about .title-h2 {
    color: #fff;
    font-weight: 300;
    margin-bottom: 30px
}

.content-table img {
    margin-top: 30px
}

.content-table h2 {
    font-size: 20px;
    margin-top: 20px;
    margin-bottom: 25px
}

.content-table h2.plan1 {
    color: #00208a
}

.content-table h2.plan2 {
    color: #737afc
}

.content-table h2.plan3 {
    color: #4b456f
}

.content-table ul {
    width: 100%;
    margin: 0 auto;
    padding: 0
}

.nav-tabs .nav-item.active .nav-link,
.nav-tabs .nav-item.show .nav-link {
    color: #4b456f!important;
    border: none
}

.nav-tabs .nav-item .nav-link {
    border: transparent;
    font-size: 16px;
    color: #fff;
    font-weight: 500
}

.content-table ul li {
    position: relative;
    vertical-align: top;
    color: #88889b;
    font-size: 16px;
    font-weight: 300;
    margin: 0 10px;
    line-height: 38px;
    width: 14%;
    display: inline-block
}

.content-table .price {
    position: relative;
    z-index: 1
}

.content-table .price .num {
    color: #4b456f;
    font-size: 52px;
    line-height: 38px;
    text-transform: uppercase;
    display: inline-block;
    vertical-align: bottom;
    margin-right: 4px;
    margin-top: 15px
}

.content-table .price .per {
    font-size: 10px;
    vertical-align: bottom;
    display: inline-block;
    color: #8a8e9d
}

.price-content-btn {
    margin-top: 25px
}

.table-price .nav-tabs,
.table-price .nav-tabs .nav-link {
    border: transparent;
    font-size: 16px;
    color: #fff
}

.table-price .nav-tabs {
    position: relative;
    width: 100%;
    margin: 0 auto;
    border-bottom: 2px solid #3a4162
}

#about-p:after,
.background-div,
.quote,
.rating {
    position: absolute
}

.avatar-info h4,
.blog-holder .meta {
    margin-bottom: 0
}

.background-div .overlay-top {
    background-color: #737afc;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    height: 40px
}

.background-div .overlay-top p {
    font-size: 16px;
    font-weight: 700;
    text-align: center;
    line-height: 40px;
    color: #fff
}

.background-div {
    top: -50px;
    bottom: -50px;
    right: 0;
    left: 0;
    background-color: #f2f3ff;
    -webkit-box-shadow: 0 8px 20px 0 rgba(0, 0, 0, .05);
    box-shadow: 0 8px 20px 0 rgba(0, 0, 0, .05);
    border-radius: 8px;
    z-index: 1
}

#testimonials {
    position: relative
}

.quote {
    display: block;
    right: 250px;
    top: 20px
}

.new_testi .favicon img,
.new_testi .puan {
    right: 0;
    margin: 0 auto;
    left: 0;
    position: absolute
}

.quote i {
    font-size: 220px;
    color: rgba(69, 78, 105, .3)
}

.rating {
    bottom: 15px;
    left: 55px;
    background-color: #fff;
    padding: 5px 12px;
    border-radius: 25px;
    -webkit-box-shadow: 0 3px 15px 2px rgba(61, 61, 61, .12);
    box-shadow: 0 3px 15px 2px rgba(61, 61, 61, .12)
}

.rating .icon_star {
    font-size: 13px;
    color: #ffdc66
}

#about-p:after {
    background: url(https://codologi.in/images/webdev.jpg) fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    mix-blend-mode: multiply;
    background-size: cover
}

#about-p .container,
.container,
.key_list li,
.web-list ul li,
.web_team_work {
    position: relative
}

#about-p .container {
    z-index: 12
}

#about-p .features-text {
    text-align: left
}

.web-list {
    background: #f1efff
}

.web-list ul li {
    width: 100%;
    font-size: 15px;
    line-height: 44px;
    margin: 2px;
    padding: 0 30px 0 60px;
    background: linear-gradient(50deg, #f1efff, #fff)
}

.development-stages-item:hover p {
    color: #fff
}

.website_dev_services {
    padding: 50px 0
}

.website_dev_services .col-md-6.right_s {
    border-right: none
}

.website_dev_services .row-services {
    margin-bottom: 20px;
    text-align: right;
    float: left;
    border-bottom: 1px solid #e9e9e9;
    min-height: 150px
}

.website_dev_services .right_s .row-services {
    text-align: left
}

.website_dev_services .row-services .head img {
    float: right;
    width: 40px
}

.website_dev_services .row-services .head h4 {
    display: inline-block;
    line-height: 40px;
    font-weight: 700;
    font-size: 20px;
    letter-spacing: 0;
    margin-right: 20px;
    margin-left: 20px;
    margin-top: 0;
    color: #2165e4
}

.website_dev_services .row-services p {
    width: 100%;
    float: left
}

.website_dev_services .right_s .row-services .head h4 {
    float: none;
    display: inline-block
}

.website_dev_services .bottom-txt {
    font-size: 19px;
    text-align: justify;
    font-weight: 300;
    width: 75%;
    margin: 30px auto;
    color: #000;
    letter-spacing: .5px
}

.web_services_2 {
    padding: 50px 0;
    background: #f2f2f2
}

.why_nsf_software {
    background: #fff;
    border-bottom: 1px dashed #e6e6e6;
    padding: 60px 0;
    text-align: center
}

.why_nsf_software div img {
    width: auto;
    margin-bottom: 10px;
    -webkit-transition: .3s;
    transition: .3s;
    height: 150px;
    opacity: 1!important
}

.why_nsf_software div h6 {
    font-size: 16px;
    color: #38597e;
    line-height: 50px;
    margin: 30px 0 0;
    padding: 0;
    border-radius: 3px;
    border: 1px solid #cfe4fb;
    letter-spacing: .5px
}

.why_nsf_software img:hover {
    -webkit-transform: translateY(10px);
    transform: translateY(10px)
}

.why_nsf_software .row {
    padding-top: 20px
}

.nsf_keyfeature {
    padding: 60px 0 20px
}

.why_nsf_software .col-md-3 p {
    color: #7796b9;
    font-size: 15px;
    margin-top: 10px;
    letter-spacing: .5px
}

.key_list {
    counter-reset: list;
    margin: 0;
    padding: 0;
    list-style: none
}

.web_services_2.idea_2 {
    background: #0328d2
}

.web_services_2.idea_2 .heading-block,
.web_services_2.idea_2 .icon-app h3,
.web_services_2.idea_2 .icon-app p,
.web_services_2.idea_2 .sub-heading {
    color: #fff!important
}

.web_services_2.idea_2 .icon-app .icon {
    float: none;
    margin: 0 auto;
    text-align: center
}

.web_services_2.idea_2 .icon-app {
    text-align: center;
    color: #fff;
    background-color: #286ff5;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: #558efb
}

.web_services_2.idea_2 .icon-app .icon img {
    float: none;
    width: 65px;
    position: relative;
    top: 0;
    margin: 0 auto;
    padding: 12px;
    background: #fff;
    border-radius: 4px
}

.salesforce-development-services .icon-app .icon img {
    width: 85px;
    -webkit-filter: saturate(2)!important;
    filter: saturate(2)!important
}

.emerging-area .imgfit,
.nsf-slide-half,
.nsf-slide-half .imgfit {
    -webkit-filter: none;
    filter: none
}

.web_services_2.idea_2 .icon-app:after,
.web_services_2.idea_2 .icon-app:before {
    background: #fff
}

.web_services_2.idea_2 .icon-app .icon-header {
    min-height: 0;
    margin-bottom: 0
}

.web_services_2.idea_2 .icon-app .icon-app p {
    margin-bottom: 0
}

.nsf_keyfeature.with_line h5 {
    font-weight: 700;
    color: #fff;
    font-size: 15px;
    font-size: 18px;
    letter-spacing: .5px
}

.key_list li {
    counter-increment: list;
    color: #fff;
    width: 33%;
    float: left;
    margin-bottom: 32px;
    padding-left: 50px;
    letter-spacing: .5px;
    line-height: 40px
}

.review_row .box_s .info span {
    font-weight: 700
}

.key_list li:before {
    content: counter(list, decimal-leading-zero);
    background: 0 0;
    color: #fff;
    font-size: 14px;
    text-align: center;
    border-radius: 50%;
    width: 2.9em;
    height: 2.9em;
    line-height: 3em;
    -webkit-transition: .1s;
    transition: .1s;
    display: inline-block;
    margin-right: 1em;
    font-weight: 500;
    border: 1px solid;
    position: absolute;
    left: 0
}

.key_list li:hover:before {
    border-color: transparent;
    background: #fff;
    color: #0328d2
}

.nsf_keyfeature .heading-block,
.nsf_keyfeature .heading-block span,
.nsf_keyfeature .sub-heading,
.web_services_2.idea_2 .heading-block span,
body.mean-stack-development .web_services_2 .heading-block,
body.mean-stack-development .web_services_2 .heading-block span,
body.mean-stack-development .web_services_2 .sub-heading {
    color: #fff!important
}

.nsf_keyfeature {
    background: #0328d2
}

.web_services_2 .icon-app {
    position: relative
}

.web_services_2 .icon-app:after,
.web_services_2 .icon-app:before {
    width: 0;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    float: left
}

.web_services_2 .icon-app:after {
    height: 1px;
    background: #0328d2;
    -webkit-transition: .3s;
    transition: .3s;
    display: none
}

.web_services_2 .icon-app:before {
    height: 5px;
    background: #0328d2;
    -webkit-transition: 1s;
    transition: 1s
}

.web_services_2 .icon-app:hover:after,
.web_services_2 .icon-app:hover:before {
    width: 100%
}

body.mean-stack-development .web_services_2 {
    background: #1551c3
}

.home_page_banner {
    height: 100vh;
    position: relative;
    float: left;
    background-size: cover;
    background-position: center center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.symfony-development-services .nsf_keyfeature .key_list li {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.python-web-development .web_services_2.idea_2 .icon-app p {
    margin-bottom: 0!important
}

.hometext {
    list-style: none;
    border-bottom: 0
}

.hometext.hidden2 {
    padding: 0
}

.hometext li {
    display: inline-block;
    font-weight: 500;
    font-size: 2em;
    color: #fff;
    opacity: 1;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    max-width: 2em
}

.hometext.hidden2 li.spaced {
    padding-left: 0
}

.hometext li.spaced {
    padding-left: .5em
}

.hometext.hidden2 li.ghost {
    opacity: 0;
    max-width: 0
}

.car .tyre img,
.car .tyre2 img,
.emerging-area img {
    max-width: 100%
}

.mainbanner_ef {
    width: 100%;
    text-align: center;
    margin: 0 auto;
    display: inline-block
}

.mainbanner_ef .hometext li {
    font-size: 40px;
    letter-spacing: 0
}

.content_wrap_home {
    padding: 0;
    text-align: center
}

.content_wrap_home h1 {
    margin: 0;
    color: #fff;
    font-size: 42px;
    font-weight: 700;
    line-height: 1.5
}

.content_wrap_home h5 {
    color: #fff;
    width: 80%;
    font-weight: 300;
    line-height: 2.2;
    font-size: 19px;
    opacity: .8;
    letter-spacing: .5px
}

.circle-btn:after,
.circle-btn:before,
.circle-btn:after {
    width: 20px;
    height: 20px;
    left: 18px;
    z-index: 2;
    pointer-events: none
}

.content_wrap_home .btn {
    color: #033085;
    background: #fff;
    border-radius: 50px;
    line-height: 20px!important;
    padding: 10px 30px!important;
    margin-top: 10px;
    font-weight: 700;
    position: relative
}

.circle-btn:before,
.circle-btn:after {
    position: absolute;
    display: block;
    content: ''
}

.circle-btn:after {
    top: 10px;
    background-color: transparent;
    border-radius: 50%;
    -webkit-box-shadow: inset 0 0 0 3px 5px #fff;
    box-shadow: inset 0 0 0 3px #fff
}

.circle-btn:after,
.circle-btn:before {
    top: 14px
}

.circle-btn:hover:before {
    -webkit-box-shadow: 0 0 0 30px transparent;
    box-shadow: 0 0 0 30px transparent;
    -webkit-transform: scale(10);
    transform: scale(10)
}

.content_wrap_home .circle-btn:hover:before {
    -webkit-box-shadow: 0 0 0 50px #fff!important;
    box-shadow: 0 0 0 50px #fff!important;
    opacity: .1;
    -webkit-transition: 1.3s;
    transition: 1.3s
}

.circle-btn:before {
    background-color: none;
    border-radius: 50%
}

.circle-btn:hover:after,
.content_wrap_home .circle-btn:hover:after {
    -webkit-box-shadow: inset 0 0 0 3px #fff;
    box-shadow: inset 0 0 0 3px #fff
}

.circle-btn {
    cursor: pointer;
    display: inline-block;
    background: #0328d2;
    border: none;
    color: #fff;
    padding: 12px 30px;
    font-size: 14px;
    -webkit-transition: all .2s;
    transition: all .2s;
    position: relative;
    overflow: hidden;
    letter-spacing: 1px;
    border-radius: 3px!important
}

.circle-btn:after,
.new_testi .card-yaz p:after {
    position: absolute;
    content: ''
}

.circle-btn:hover {
    background: #0328d2;
    color: #fff
}

.circle-btn:focus:before,
.circle-btn:hover:before {
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 70px #fff!important;
    box-shadow: 0 0 0 70px #fff!important;
    opacity: .1;
    -webkit-transition: 1s;
    transition: 1s
}

.circle-btn:focus {
    color: #fff
}

.circle-btn:after {
    background-color: transparent;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -webkit-transition: .3s;
    transition: .3s;
    border-radius: 50%;
    -webkit-box-shadow: inset 0 0 0 2px #fff;
    box-shadow: inset 0 0 0 2px #fff;
    display: none
}

.content_wrap_home .circle-btn {
    background: #fff;
    color: #033085;
    font-size: 18px;
    line-height: 25px;
    margin-top: 30px
}

.content_wrap_home .circle-btn.blue_btn {
    background: #0328d2;
    color: #fff
}

.content_wrap_home .circle-btn:after {
    -webkit-box-shadow: inset 0 0 0 3px #033085;
    box-shadow: inset 0 0 0 3px #033085
}

.content_wrap_home .circle-btn.blue_btn:after {
    -webkit-box-shadow: inset 0 0 0 3px #fff;
    box-shadow: inset 0 0 0 3px #fff
}

.content_wrap_home .circle-btn:nth-child(1) {
    border-radius: 0;
    margin-right: 10px
}

.content_wrap_home .circle-btn:nth-child(2) {
    border-radius: 0
}

.reviews_sec .section-subtitle span {
    font-size: 40px;
    font-weight: 700;
    color: #0328d2
}

.reviews_sec .col-md-2 {
    padding: 0
}

.reviews_sec .col-md-9 {
    padding-left: 0
}

.reviews_sec .col-md-3 {
    padding-right: 0
}

.new_testi .card {
    border: none;
    float: left;
    -webkit-box-shadow: 0 0 3px #0001a;
    box-shadow: 0 0 3px #0001a
}

.new_testi .card-yaz p {
    font-weight: 300;
    color: #fff;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    padding: 20px 10px 40px;
    font-size: 14px
}

.new_testi .card-yaz p:after {
    width: 40px;
    height: 40px;
    margin: 10px 0 0 20px
}

.new_testi .card-yaz p:before {
    content: '';
    width: 30px;
    height: 30px;
    position: relative;
    top: -10px;
    left: -18px
}

.new_testi .card-yaz {
    background: #2b2f38;
    position: relative;
    height: 230px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 3px 3px 0 0;
    padding: 20px 10px
}

.new_testi .puan,
.new_testi .puan.tm-btn2 {
    background: #077af4
}

.new_testi .favicon {
    width: 100%;
    height: auto
}

.new_testi .favicon img {
    height: 90px;
    width: 90px!important;
    bottom: -50px;
    border-radius: 100px;
    border: 5px solid #fff;
    -o-object-fit: cover;
    object-fit: cover
}

.new_testi .puan .yt-btn {
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
    font-size: 15px;
    padding: 10px;
    border-radius: 1px
}

.new_testi .puan {
    bottom: -40px;
    text-align: center;
    line-height: 39px
}

.new_testi .puan.tm-btn2 a {
    font-weight: 700;
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    width: 100%;
    display: inline-block
}

.new_testi .puan .yt-btn i {
    margin-right: 10px
}

.new_testi .arrow-n span {
    float: left;
    margin-right: 5px
}

.new_testi .arrow-n,
.new_testi .arrow-p,
.projects-bg .arrow-n,
.projects-bg .arrow-p {
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 19px;
    color: #333;
    display: block;
    border-radius: 100px;
    z-index: 3;
    background: #fff;
    right: -40px;
    top: 50%;
    position: absolute;
    cursor: pointer;
    -webkit-box-shadow: 0 2px 48px 0 rgba(0, 0, 0, .13);
    box-shadow: 0 2px 48px 0 rgba(0, 0, 0, .13);
    float: right;
    border: 1px solid #d3d3d3
}

.new_testi .puan img {
    height: 20px;
    width: 20px!important;
    margin: 30px 5px 0 0
}

.reviews_sec {
    padding: 40px 0;
    background: #ebeff8
}

.new_testi .arrow-n {
    right: -50px
}

.new_testi .arrow-p {
    left: -50px
}

.new_testi .isim h5 {
    font-size: 15px;
    font-weight: 700;
    margin-top: 50px
}

.new_testi .isim p i {
    font-size: 14px;
    font-style: normal
}

.new_testi .card {
    background: #fff;
    margin: 10px 10px 40px;
    position: relative
}

.new_testi .card-block {
    min-height: 340px;
    width: 100%
}

.nsf-slide.center-form .material-form .input-block {
    text-align: left;
    width: 26.6%;
    float: left;
    margin-bottom: 0;
    border: none
}

.nsf-slide.center-form .material-form .input-block .form-control,
.nsf-slide.center-form .material-form .input-block label,
.nsf-slide.center-form .material-form .input-block label.focus {
    padding-left: 0;
    font-weight: 500
}

.nsf-slide.center-form .slider-form {
    padding-top: 0;
    position: absolute;
    bottom: 20px;
    border-radius: 0;
    z-index: 99;
    padding-left: 20px;
    -webkit-box-shadow: 10px 8px 0 0 #3e5dc3;
    box-shadow: 10px 8px 0 0 #3e5dc3;
    background: #00208a
}

.nsf-slide.center-form .slider-form .input-block.textarea textarea {
    height: 59px;
    resize: none
}

.nsf-slide.center-form .material-form .input-block.focus label,
.nsf-slide.center-form .material-form .input-block.has-value label {
    top: -21px
}

.nsf-slide.center-form .slider-form p {
    width: 20%;
    float: left
}

.nsf-slide.center-form .material-form .square-button {
    background-color: transparent;
    color: #fff!important;
    margin-bottom: -7px;
    float: left;
    position: relative;
    bottom: -8px;
    border-radius: 0
}

.nsf-slide.center-form .material-form .square-button:focus,
.nsf-slide.center-form .material-form .square-button:hover {
    background: rgba(255, 255, 255, .1)
}

.center-services h1+p {
    font-size: 20px;
    width: 80%;
    margin: 0 auto;
    padding-bottom: 20px
}

.nsf-slide .center-services h1 {
    font-weight: 700
}

.counter-5 {
    position: relative
}

.counter-5:after,
.counter-5:before {
    position: absolute;
    width: 40px;
    height: 50px;
    background-color: transparent;
    content: ''
}

.counter-5:before {
    top: 0;
    left: 0;
    border-left: 8px solid #0328d2;
    border-top: 8px solid #0328d2
}

.counter-5:after {
    bottom: 0;
    right: 0;
    border-right: 8px solid #0328d2;
    border-bottom: 8px solid #0328d2
}

.mobilecompanyList ul:last-child li:last-child .tree-toggle,
body.nsf-soft .header.scrolled {
    border-bottom: none
}

.counter-part {
    padding: 30px 50px;
    text-align: center;
    display: inline-block;
    width: 100%
}

.counter-part .singel-counter {
    background-color: #fff;
    padding-top: 15px;
    padding-bottom: 30px;
    position: relative;
    -webkit-transition: all .4s linear;
    transition: all .4s linear;
    margin: 10px 0
}

.counter-part .singel-counter.active,
.counter-part .singel-counter:hover {
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, .1)
}

.counter-part .singel-counter sup {
    position: absolute;
    right: 30%;
    top: 20%;
    font-size: 39px;
    font-weight: 300;
    color: #0328d2
}

.counter-part .singel-counter p,
.counter-part .singel-counter span {
    font-size: 18px;
    color: #232323
}

.counter-part .singel-counter span b {
    font-size: 45px;
    font-weight: 700;
    color: #0328d2;
    display: block
}

.counter-part .singel-counter p {
    margin-top: -5px
}

.justify-content-center {
    -ms-flex-pack: center!important;
    -webkit-box-pack: center!important;
    justify-content: center!important
}

.bar {
    width: 100%;
    height: 100%;
    opacity: .3;
    position: absolute;
    z-index: 0;
    left: 0;
    top: 0
}

.hero22 {
    text-align: center;
    padding: 30px;
    float: left;
    width: 100%
}

.hero22 .heading-block {
    font-size: 51px!important;
    text-align: left
}

.hero22 p {
    font-size: 110%;
    text-align: justify
}

.custom_client_logos {
    overflow: hidden;
    position: relative;
    background: #0328d2;
    padding: 30px 0;
    margin: 40px 0;
    display: inline-block;
    width: 100%
}

.custom_client_logos .clientheading {
    color: #000;
    font-size: 92px;
    text-align: center;
    margin-bottom: 30px;
    position: absolute;
    right: 0;
    left: 0;
    top: -43px;
    opacity: .1;
    letter-spacing: -1px;
    font-weight: 700;
    display: none
}

.custom_client_logos .slick-slide img {
    height: 28px;
    margin: 0 auto
}

.mobileapp_development_icons span.f img {
    height: 50px
}

html.nsf-soft {
    overflow: hidden
}

body.nsf-soft .header.scrolled.globalNav .navSection.primary .rootLink {
    color: #fff
}

.mobileapp_development_icons span.f {
    width: 100%;
    display: inline-block;
    position: relative
}

.mobileapp_development_icons span.f:after {
    background: #e4edfd;
    -webkit-transition: .3s;
    transition: .3s;
    content: '';
    width: 90px;
    top: -8px;
    height: 67px;
    float: left;
    position: absolute;
    left: 0;
    z-index: -1;
    right: 0;
    margin: 0 auto
}

.mobileapp_development_icons div {
    text-align: center
}

.mobileapp_development_icons {
    padding: 50px 0
}

.mt-50 {
    margin-top: 50px!important
}

.mobileapp_development_icons .col-md-2 {
    -webkit-transition: .1s;
    transition: .1s;
    margin-bottom: 20px
}

.mobileapp_development_icons .col-md-2:hover span.f:after {
    height: 10px
}

.mobileapp_development_icons .col-md-2 h5 {
    margin-top: 30px
}

.center-services .nsficon {
    font-size: 100px;
    position: relative;
    z-index: 88;
    color: #fff;
    line-height: 0;
    bottom: -20px
}

.sidebar-contact {
    position: fixed;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    top: 0;
    right: -391px;
    width: 390px;
    padding: 15px;
    background: #fff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: .5s;
    transition: .5s;
    z-index: 99999;
    height: 100%
}

.sidebar-contact.active {
    right: 0;
    -webkit-box-shadow: 0 10px 21px -3px rgba(71, 71, 71, .29);
    box-shadow: 0 10px 21px -3px rgba(71, 71, 71, .29)
}

.sidebar-contact .sideformtoggle span {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    width: 142px;
    display: inline-block;
    right: 51px;
    position: relative;
    top: 46px;
    letter-spacing: -.1px;
    font-size: 15px;
    background: #0328d2;
    height: 40.4px;
    border-radius: 20px 0 0;
    color: #fff
}

.sidebar-contact .sideformtoggle {
    position: absolute;
    width: 40px;
    height: 40px;
    text-align: center;
    cursor: pointer;
    background: #244e9e;
    border-radius: 20px 0 0;
    top: 40%;
    left: -40px;
    line-height: 42px
}

.sidebar-contact .material-form p {
    width: 100%
}

.sidebar-contact .material-form .square-button {
    background-color: #0328d2;
    height: 52px;
    color: #fff
}

.sidebar-contact .material-form .input-block:before {
    background-color: #0328d2;
    bottom: -1px;
    height: 2px
}

.sidebar-contact .material-form .input-block label,
.sidebar-contact .material-form .select-block label,
.sidebar-contact .select-block.added .active-list {
    color: #333
}

.sidebar-contact .material-form .input-block.focus label {
    color: #c1c1c1
}

.sidebar-contact .material-form .input-block,
.sidebar-contact .material-form .select-block .active-list {
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(111, 106, 106, .24)
}

.sidebar-contact .select-block {
    margin-bottom: 0
}

.sidebar-contact .sideformtoggle:before {
    content: '\f003';
    font-family: fontAwesome;
    font-size: 18px;
    color: #fff
}

.sidebar-contact .sideformtoggle.active:before {
    content: '\f00d'
}

@media(max-width:768px) {
    .sidebar-contact {
        width: 100%;
        height: 100%;
        right: -100%
    }
    .sidebar-contact .sideformtoggle {
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        -webkit-transition: .5s;
        transition: .5s
    }
    .sidebar-contact.active .sideformtoggle {
        top: 0;
        left: 0;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    .sidebar-contact .scroll {
        width: 100%;
        height: 100%;
        overflow-y: auto
    }
    .sidebar-contact .content {
        padding: 50px
    }
}

.sidebar-contact .material-form .input-block .form-control,
.sidebar-contact .material-form .input-block.textarea .form-control {
    color: #333;
    font-size: 14px
}

.menu-btn .button:hover span i:after {
    color: #fff!important;
    opacity: 1;
    visibility: visible
}

body.banner-overly_active .banner-overly {
    z-index: 88888;
    height: 100%;
    position: fixed;
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.vliconservicei {
    background: url(https://codologi.in/images/splitvlitaxi.png);
    display: inline-block;
    position: relative
}

.vliconservicei.appfeat1 {
    background-position: 0 0;
    width: 70px;
    height: 70px
}

.vliconservicei.appfeat2 {
    background-position: -70px 0;
    width: 70px;
    height: 70px
}

.vliconservicei.appfeat3 {
    background-position: -140px 0;
    width: 70px;
    height: 70px
}

.vliconservicei.appfeat4 {
    background-position: -210px 0;
    width: 70px;
    height: 70px
}

.vliconservicei.appfeat5 {
    background-position: 0 -70px;
    width: 70px;
    height: 70px
}

.vliconservicei.appfeat6 {
    background-position: -70px -70px;
    width: 70px;
    height: 70px
}

.vliconservicei.appfeat7 {
    background-position: -140px -70px;
    width: 70px;
    height: 70px
}

.vliconservicei.appfeat8 {
    background-position: -210px -70px;
    width: 70px;
    height: 70px
}

.vliconservicei.driveric1 {
    background-position: 0 -140px;
    width: 140px;
    height: 140px
}

.vliconservicei.driveric2 {
    background-position: -140px -140px;
    width: 140px;
    height: 140px
}

.vliconservicei.driveric3 {
    background-position: 0 -280px;
    width: 140px;
    height: 140px
}

.vliconservicei.driveric4 {
    background-position: -140px -280px;
    width: 140px;
    height: 140px
}

.vliconservicei.driveric5 {
    background-position: -140px -420px;
    width: 140px;
    height: 140px
}

.vliconservicei.driveric6 {
    background-position: 0 -420px;
    width: 140px;
    height: 140px
}

.vliconservicei.driveric7 {
    background-position: 0 -560px;
    width: 140px;
    height: 140px
}

.vliconservicei.driveric8 {
    background-position: -140px -560px;
    width: 140px;
    height: 140px
}

.vliconservicei.driveric9 {
    background-position: -140px -700px;
    width: 140px;
    height: 140px
}

.driverspliti {
    background: url(https://codologi.in/images/driversplit.png)
}

.restaurantsetps {
    background: url(https://codologi.in/images/Restaurantsetps.png)
}

.driverspliti.vstep1 {
    background-position: 0 0;
    width: 137px;
    height: 41px;
    position: absolute;
    top: 0;
    left: 100%
}

.driverspliti.vstep2 {
    background-position: -155px 0;
    width: 145px;
    height: 260px;
    position: absolute;
    top: 50%;
    left: 60%
}

.driverspliti.vstep3 {
    background-position: 0 -290px;
    width: 260px;
    height: 50px;
    position: absolute;
    top: 0;
    right: 100%
}

.driverspliti.vstep3.rotateview {
    left: 100%;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
}

.driverspliti.vstep4 {
    background-position: 0 -40px;
    width: 135px;
    height: 248px;
    position: absolute;
    top: 50%;
    right: 100%
}

.commeniconsplit {
    display: inline-block;
    position: relative
}

.commeniconsplit.ticky {
    background-position: -5px -5px;
    width: 40px;
    height: 40px
}

ul.ultick {
    padding-left: 70px
}

ul.ultick li {
    margin-bottom: 15px;
    position: relative
}

ul.ultick li:before {
    content: '';
    top: 0;
    left: -50px;
    height: 30px;
    width: 30px;
    position: absolute
}

.driverproc {
    display: inline-block;
    position: relative
}

.car,
.car .tyre,
.car .tyre2,
.car>img,
.carriding,
.street-stripe {
    position: absolute
}

.driverproc span.badge {
    position: absolute;
    top: -15px;
    width: 35px;
    height: 35px;
    line-height: 30px;
    border-radius: 50%;
    background-color: #0328d2;
    color: #fff;
    font-weight: 300;
    z-index: 9;
    font-size: 21px
}

.hh4 {
    font-weight: 700;
    color: #0328d2;
    letter-spacing: .4px;
    font-size: 18px
}

.carriding {
    background-color: #1f1e22;
    padding: 25px 0;
    bottom: 0;
    z-index: 50;
    width: 100%;
    left: 0
}

.street-stripe {
    background: #d4d4d4;
    height: 2px;
    width: 40px;
    bottom: 25px;
    border-radius: 2px;
    -webkit-box-shadow: 200px 0 0 #d4d4d4, 400px 0 0 #d4d4d4, 600px 0 0 #d4d4d4, 800px 0 0 #d4d4d4, 1000px 0 0 #d4d4d4, 1200px 0 0 #d4d4d4, 1400px 0 0 #d4d4d4, 1600px 0 0 #d4d4d4, 1800px 0 0 #d4d4d4, 2000px 0 0 #d4d4d4;
    box-shadow: 200px 0 0 #d4d4d4, 400px 0 0 #d4d4d4, 600px 0 0 #d4d4d4, 800px 0 0 #d4d4d4, 1000px 0 0 #d4d4d4, 1200px 0 0 #d4d4d4, 1400px 0 0 #d4d4d4, 1600px 0 0 #d4d4d4, 1800px 0 0 #d4d4d4, 2000px 0 0 #d4d4d4
}

.car {
    height: 50px;
    width: 133px;
    top: -25%;
    z-index: 10;
    -moz-animation: myfirst 15s linear infinite;
    -webkit-animation: myfirst 15s linear infinite
}

.car>img {
    top: 0;
    left: 0
}

@-webkit-keyframes myfirst {
    0% {
        left: -25%
    }
    100% {
        left: 100%
    }
}

.car .tyre,
.car .tyre2 {
    border-radius: 50%;
    z-index: 2;
    left: 17px;
    top: 24px;
    -moz-animation: tyre-rotate 1s infinite linear;
    -webkit-animation: tyre-rotate 1s infinite linear
}

.car .tyre2 {
    left: 101px
}

@-webkit-keyframes tyre-rotate {
    from {
        -webkit-transform: rotate(-360deg)
    }
    to {
        -webkit-transform: rotate(0)
    }
}

.vdoonmobsec {
    position: relative;
    display: inline-block;
    z-index: 51
}

.vdoonmobsec video {
    position: absolute;
    top: 66px;
    left: 18px;
    width: 232px;
    height: 412px
}

.addonlist {
    margin-right: 40px;
    border-bottom: 1px solid #dcdde1
}

.addonlist li {
    position: relative
}

.addonlist li.active:before {
    content: '';
    position: absolute;
    right: -14px;
    top: 7px;
    width: 32px;
    height: 32px;
    background-color: #dcdde1;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    border-radius: 5px
}

.addonlist li a {
    padding: 10px 15px;
    text-transform: uppercase;
    display: block;
    font-weight: 500;
    font-size: .8em;
    border-top: 1px solid #dcdde1;
    color: #9fa3a7
}

.addonlist li.active+li a,
.addonlist li:first-child a {
    border-top: 0
}

.addonlist li.active a {
    background-color: #dcdde1;
    border-radius: 5px;
    color: #111
}

.addonlist li a span {
    margin-right: 10px;
    background-color: #e8e9ed;
    color: #999
}

.addonlist li.active a span {
    background-color: #ec4642;
    color: #fff
}

@media(max-width:992px) {
    .driverspliti {
        display: none
    }
}

@media(max-width:767px) {
    .topbannersec {
        padding: 20px 0
    }
    .owl-carousel .col-md-6 {
        padding: 0
    }
}

.header #maintoggle {
    width: 38px;
    height: 30px;
    float: right;
    position: absolute;
    right: 240px;
    top: 14px;
    cursor: pointer
}

#maintoggle div {
    width: 100%;
    border-radius: 70px;
    height: 3px;
    background: #fff;
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    margin-bottom: 10px;
    cursor: pointer
}

#maintoggle .two {
    width: 60%
}

#maintoggle.on .one {
    -webkit-transform: rotate(45deg) translate(5px, 5px);
    transform: rotate(45deg) translate(5px, 5px)
}

#maintoggle.on .two {
    opacity: 0
}

#maintoggle.on div {
    margin-bottom: 7px
}

#maintoggle.on .three {
    -webkit-transform: rotate(-45deg) translate(7px, -8px);
    transform: rotate(-45deg) translate(7px, -8px)
}

#main-menu {
    display: none
}

ul.nav li.dropdown:hover ul.dropdown-menu {
    display: block!important
}

.home_review {
    padding: 0;
    background: #f2f2f2
}

.home_review .heading-block {
    margin-bottom: 15px
}

.carousel-indicators {
    z-index: 100;
    position: absolute;
    bottom: 80px;
    width: 100%;
    padding-left: 0;
    list-style: none;
    float: right;
    right: 0;
    text-align: center;
    left: 0;
    margin: 0 auto
}

.carousel-indicators li.active {
    background: #fff;
    opacity: 1;
    width: 10px;
    height: 10px
}

.carousel-indicators li {
    margin: 2px;
    width: 8px;
    height: 8px;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 50px;
    background: #fff;
    opacity: .5
}

.carousel-inner>.item {
    z-index: 99
}

.intro-banner-vdo-play-btn {
    height: 60px;
    width: 60px;
    position: absolute;
    top: 40px;
    left: 0;
    text-align: center;
    border-radius: 100px;
    z-index: 1;
    right: 0;
    margin: 0 auto
}

.intro-banner-vdo-play-btn i {
    line-height: 60px;
    font-size: 30px;
    color: #fff
}

.pinkBg {
    background-color: #0328D2!important;
    background-image: -webkit-gradient(linear, left top, right top, from(#4a72f8), to(#7cbdff));
    background-image: linear-gradient(90deg, #4a72f8, #7cbdff)
}

.intro-banner-vdo-play-btn .ripple {
    position: absolute;
    width: 130px;
    height: 130px;
    z-index: -1;
    left: 50%;
    top: 50%;
    opacity: 0;
    margin: -65px 0 0 -65px;
    border-radius: 100px;
    -webkit-animation: ripple 1.8s infinite;
    animation: ripple 1.8s infinite
}

@-webkit-keyframes ripple {
    0% {
        opacity: 1;
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes ripple {
    0% {
        opacity: 1;
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.intro-banner-vdo-play-btn .ripple:nth-child(2) {
    animation-delay: .3s;
    -webkit-animation-delay: .3s
}

.intro-banner-vdo-play-btn .ripple:nth-child(3) {
    animation-delay: .6s;
    -webkit-animation-delay: .6s
}

.solution_process {
    border: 1px dashed #ccc;
    border-radius: 3px;
    text-align: center;
    padding: 120px 10px 20px;
    margin-top: 30px;
    position: relative;
    -webkit-transition: .3s;
    transition: .3s;
    min-height: 325px
}

.row .solution_process:hover {
    -webkit-box-shadow: 0 8px 50px -6px rgba(84, 84, 120, .26);
    box-shadow: 0 8px 50px -6px rgba(84, 84, 120, .26)
}

.bt_none:after {
    border-bottom: none!important;
    padding-left: 10px
}

.solution_process h4 {
    font-size: 18px;
    font-weight: 300;
    width: 100%;
    text-align: center;
    color: #6094fb;
    letter-spacing: 1px
}

.solution_process p {
    font-size: 14px
}

.iphone_bg {
    position: relative;
    overflow: hidden;
    border: 10px solid #000;
    background: #000;
    border-radius: 40px;
    margin: 0 auto;
    -webkit-transform: scale(.8) translateY(-5%);
    transform: scale(.8) translateY(-5%)
}

.iphone_bg:after {
    content: "";
    height: 30px;
    position: absolute;
    top: -1px;
    background-repeat: no-repeat;
    right: 0;
    margin: 0 auto;
    left: 0;
    text-align: center;
    background-size: 71px;
    background-position: center
}

.iphone_bg .mobile_wrap #frame {
    width: 100%!important;
    height: 633px
}

.livedemo_s .nav-tabs {
    margin: 0;
    border: 0
}

.livedemo_s+.ex .feature-box {
    margin-top: 0
}

.livedemo_s .nav-tabs>li>a {
    border-bottom: 3px solid;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: transparent;
    margin: 0;
    padding: 10px 0;
    text-transform: uppercase;
    font-weight: 800;
    color: #333
}

.livedemo_s .nav-tabs>li.active>a,
.livedemo_s .nav-tabs>li.active>a:focus,
.livedemo_s .nav-tabs>li.active>a:hover {
    color: #0328d2;
    border: none;
    border-bottom: 3px solid!important;
    display: inline;
    -webkit-box-shadow: none!important;
    box-shadow: none!important
}

.livedemo_s {
    margin-bottom: 0
}

.livedemo_s .col-md-4 img {
    height: 610px
}

.livedemo_s .tab-pane {
    background: #fff;
    border-radius: 0;
    text-align: center;
    padding: 0
}

.livedemo_s .fade,
.livedemo_s .fade.in {
    -webkit-transition: none!important;
    transition: none!important
}

.livedemo_s .tab-content {
    padding: 10px 0;
    float: left;
    width: 100%
}

.livedemo_s .nav-tabs {
    margin-top: 10px;
    text-align: left
}

.livedemo_s .nav-tabs>li {
    float: none;
    display: inline-block;
    margin-right: 40px
}

.livedemo_s .tab-content {
    display: none
}

.livedemo_s .tab-pane.fade.active.in .tab-content {
    display: block
}

.dropdown-menu {
    border: none;
    top: 69px;
    background: #fff
}

.content_wrap_home .clients-top {
    top: -50px
}

.livedemo_s .tab-content h2 {
    text-align: left;
    margin-bottom: 20px
}

.positive_list {
    width: 100%;
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left
}

.positive_list li {
    margin-bottom: 20px;
    padding-left: 40px;
    position: relative
}

.half.positive_list li {
    float: left;
    width: 49%;
    line-height: 1.5em
}

.positive_list li:before {
    content: "\f00c";
    width: 30px;
    height: 30px;
    position: absolute;
    font: normal normal normal 14px/1 FontAwesome;
    left: 0;
    top: 0;
    background: #c5ecd4;
    color: #338f21;
    text-align: center;
    line-height: 30px;
    border-radius: 23px
}

.livedemo_s .heading-block {
    width: 100%
}

.feature-box {
    border: 1px solid #eee;
    padding: 10%;
    -webkit-transition: ease all .3s;
    transition: ease all .3s
}

.feature-box:not(:hover) {
    background: #fff
}

.feature-box .icon i {
    font-size: 35px
}

.feature-box .icon {
    margin: 0
}

.feature-box .feature-content h4 {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 15px
}

.feature-box .feature-content p {
    margin: 0
}

.feature-box:hover {
    margin-top: -10px;
    background: #0328d2
}

.feature-box:hover .feature-content h4,
.feature-box:hover .icon i {
    color: #fff
}

.feature-box:hover .feature-content p {
    color: rgba(255, 255, 255, .8)
}

.livedemo_s .ex {
    margin: 0 0 50px;
    width: 100%;
    float: left
}

.ex .feature-box {
    min-height: 290px
}

.box-shadow {
    -webkit-box-shadow: 0 8px 50px -6px rgba(84, 84, 120, .26);
    box-shadow: 0 8px 50px -6px rgba(84, 84, 120, .26)
}

.solutions_top_s {
    text-align: left;
    padding: 70px 0
}

.solutions_top_s .container {
    border-left: 5px solid #0328d2;
    padding-left: 15px
}

.solutions_top_s p {
    font-size: 20px;
    color: #000;
    padding: 10px 0 0 40px;
    margin-bottom: 0;
    font-weight: 300
}

.solutions_top_s .heading-block {
    padding-left: 40px;
    font-size: 37px
}

.solutions_top_s .solutions_icon {
    font-size: 40px;
    position: absolute;
    left: -39px;
    display: inline-block;
    width: 70px;
    height: 70px;
    top: -10px;
    border: 3px solid #0328d2;
    text-align: center;
    color: #077af4;
    border-radius: 50%;
    background: #fff;
    line-height: 65px
}

.solutions_top_s .circle-btn {
    margin-top: 20px;
    margin-left: 40px
}

header .Contact_top {
    float: right;
    margin-right: 90px;
    margin-top: 17px;
    letter-spacing: 1px;
    font-weight: 700;
    text-transform: uppercase;
    border: 1px solid;
    padding: 5px 20px;
    line-height: 27px;
    font-size: 12px;
    color: #fff;
    -webkit-transition: .2s;
    transition: .2s
}

header.scrolled .Contact_top {
    color: #000
}

header .Contact_top:hover {
    background-color: #fff;
    color: #000
}

header.scrolled .Contact_top:hover {
    background-color: #000;
    color: #fff
}

#main-menu.nsfmenu+.Contact_top {
    opacity: 0
}

.heading-block .head_i {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    color: #0328d2;
    line-height: 50px;
    margin: 0 auto;
    font-size: 216px;
    opacity: .1;
    font-weight: lighter;
    z-index: -1;
    display: none
}

.accordion a {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    padding: 2rem 3rem 2rem 1rem;
    font-size: 18px;
    font-weight: 300;
    border-bottom: 1px solid #1212121a;
    color: #000;
    letter-spacing: .5px
}

.accordion a:hover,
.accordion a:hover:after {
    cursor: pointer;
    color: #0328d2
}

.accordion a.active {
    color: #0328d2;
    border-bottom: 1px solid #0328d2
}

.accordion a:after {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f105";
    position: absolute;
    float: right;
    right: 1rem;
    font-size: 2rem;
    padding: 5px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    -webkit-transition: .3s;
    transition: .3s;
    text-align: center;
    font-weight: 300;
    color: #333
}

.accordion a.active:after {
    color: #0328d2;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.accordion .content {
    opacity: 0;
    padding: 0 1rem;
    max-height: 0;
    overflow: hidden;
    clear: both;
    -webkit-transition: all .3s;
    transition: all .3s
}

.accordion .content p {
    font-size: 16px;
    font-weight: 300
}

.accordion .content.active {
    opacity: 1;
    padding: 1rem;
    max-height: 100%;
    -webkit-transition: all .3s;
    transition: all .3s
}

.web_services_3 {
    -webkit-transition: .3s;
    transition: .3s;
    background: #fff;
    position: relative;
    padding: 50px 0
}

.container p.bottom-txt:last-child {
    margin-bottom: 0
}

.working-process-group .count-icon span {
    width: 40px;
    height: 40px;
    display: inline-block;
    line-height: 38px;
    font-weight: 700;
    border-radius: 50%;
    border: 2px solid #333;
    color: #333;
    letter-spacing: 1px
}

.working-process-group h4 {
    font-weight: 700;
    margin-bottom: 0
}

.working-process-anim {
    text-align: center;
    padding: 20px 0
}

.working-process-anim .col-md-3,
.working-process-anim .col-md-4 {
    padding: 20px;
    border: 1px solid #eaeaea;
    min-height: 190px
}

.Full-Stack-Development-Services {
    padding: 40px 15px
}

.Full-Stack-Development-Services img {
    width: 90px
}

.full_stack_z h3:after {
    content: "";
    width: 60px;
    height: 3px;
    background: #000;
    float: left;
    position: absolute;
    bottom: 0;
    left: 0
}

.full_stack_z h3 {
    font-size: 33px;
    position: relative
}

.full_stack_z ul {
    margin: 0;
    padding: 0
}

.ex .feature-box,
.full_stack_z .row {
    margin-top: 40px
}

.full_stack_z ul li {
    padding: 9px 10px;
    display: inline-block;
    width: 46%;
    margin-bottom: 5px;
    float: left;
    border-radius: 3px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-right: 20px;
    border: 1px solid;
    text-align: center;
    letter-spacing: .5px;
    color: #077af4
}

.servicewrap .home-services {
    -webkit-transition: .3s;
    transition: .3s;
    background: #fff;
    padding: 20px;
    margin: -1px;
    border-radius: 0;
    border: 1px solid #dadee4
}

.servicewrap .home-services img {
    height: 85px;
    padding: 11px 15px;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 11px
}

.servicewrap .home-services:hover img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
}

.servicewrap .home-services h4 {
    color: #2c3033;
    font-weight: 700
}

.servicewrap .home-services:hover {
    -webkit-box-shadow: 0 20px 22px 0 #dbdbdb;
    box-shadow: 0 20px 22px 0 #dbdbdb;
    position: relative;
    z-index: 8;
    -webkit-transform: scale(1.01);
    transform: scale(1.01)
}

.servicewrap .col-md-4 {
    padding: 7px
}

.servicewrap .home-services i {
    font-size: 40px;
    color: #077af4
}

.servicewrap .home-services p {
    font-size: 15px
}

.home_abt {
    margin-bottom: 0;
    position: relative;
    width: 100%
}

.home_abt h2 {
    margin: 0
}

.home_abt .sub {
    text-transform: uppercase;
    letter-spacing: 1px;
    opacity: .6;
    font-weight: 700;
    display: inline-block;
    margin: 10px 0;
    font-size: 18px
}

.home_abt .abt_btn {
    top: 46%;
    height: 70px;
    line-height: 81px;
    width: 70px
}

.home_port {
    background: 0 0;
    position: relative
}

.home_port .heading-block {
    color: #fff!important
}

.home_port .slick-center .box {
    opacity: 1;
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

.home_port .slick-track {
    margin: 25px 0
}

.this_footer .footer_n_box {
    margin: 50px 0 0;
    padding: 0 0 40px;
    overflow: hidden
}

.home_services_list ul {
    margin-top: 30px;
    padding: 0 40px;
    list-style: none;
    text-align: center
}

.home_services_list ul li {
    margin-bottom: 0;
    padding: 15px;
    float: none;
    width: 100%;
    display: inline-block;
    vertical-align: top
}

.home_services_list ul li .service-box {
    background: #fff;
    width: 100%;
    padding: 25px 25px 10px;
    min-height: 321px;
    position: relative;
    -webkit-transition: all .6s cubic-bezier(.165, .84, .44, 1);
    transition: all .6s cubic-bezier(.165, .84, .44, 1);
    -webkit-box-shadow: 5px 5px 15px 0 rgba(46, 61, 73, .3);
    box-shadow: 5px 5px 15px 0 rgba(46, 61, 73, .3);
    border-radius: 0 20px 0 0
}

.home_services_list ul li .service-box:hover {
    background: #fff;
    -webkit-transform: translate(0, -8px);
    transform: translate(0, -8px)
}

.home_services_list ul li p {
    color: #333;
    font-weight: 300;
    font-size: 14px
}

.home-services:hover:after,
.home_services_list ul li .service-box:hover:after {
    width: 100%
}

.home-services:after {
    width: 0;
    height: 3px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #017bf4;
    transition: all .5s ease-in-out 0;
    -webkit-transition: all .5s ease-in-out 0;
    content: ''
}

.home_services_list ul li .service-box i {
    font-size: 50px
}

.home_services_list ul li .service-box img {
    height: 60px;
    -webkit-transition: .4s;
    transition: .4s
}

.home_services_list ul li .service-box .more_2 {
    position: absolute;
    left: 0;
    bottom: 15px;
    right: 0;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 12px;
    font-weight: 700;
    color: #333
}

.home_services_list ul li .service-box .more_2 i {
    font-size: 16px
}

.home_services_list ul li .service-box h3 {
    font-weight: 700;
    font-size: 20px;
    color: #333
}

.home_services_list ul li .service-box:hover .more_2,
.home_services_list ul li .service-box:hover img {
    -webkit-filter: none;
    filter: none;
    color: #017bf4
}

.home_services_list .icon_de {
    font-size: 680px;
    position: absolute;
    left: 30px;
    color: #93999e;
    top: 0;
    opacity: 0;
}

.home_services_list .service-box:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

.content_wrap_home .slick-slide img {
    height: 24px;
    margin: 0 auto;
    width: 100px;
    -o-object-fit: contain;
    object-fit: contain
}

.emerging-area .right-bg:before,
.emerging-area:after {
    content: '';
    height: 100%
}

.home_port .heading-block .color {
    color: #fff!important
}

.mt-20 {
    margin-top: 20px!important
}

.navbar-nav>li>a {
    font-size: 18px
}

body.nsf-soft #maintoggle div,
body.nsf-soft .scrolled#header #maintoggle div {
    background: #fff
}

.emerging-area .right-bg:before {
    position: absolute;
    width: 100%;
    z-index: 1;
    /*background-image:linear-gradient(135deg,#043c7b 0,#0030a5 100%);*/
    background-image: linear-gradient(135deg, #000 0, #000 100%);
    opacity: .83
}

.corporate-values .emerging-area .right-bg:before {
    background: #000
}

.emerging-area .right-bg {
    float: right;
    width: 100%;
    overflow: hidden;
    position: relative;
    z-index: 1;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.emerging-area .header-text {
    position: absolute;
    width: 100%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    margin: 0 auto;
    text-align: center;
    z-index: 9;
    left: 50%
}

.emerging-area:after {
    position: absolute;
    width: 100%;
    background: 0 0;
    z-index: 3;
    left: 0
}

.emerging-area .header-text h1 {
    color: #fff;
    margin: 0;
    font-weight: 700;
    font-size: 55px
}

.emerging-area .header-text p {
    color: #fff;
    font-size: 20px;
    margin-bottom: 40px
}

.emerging-area .header-text .buttons {
    margin-top: 20px
}

.emerging-area .header-text .buttons .circle-btn {
    text-transform: uppercase;
    margin: 0 10px;
    border-radius: 0;
    font-weight: 700;
    line-height: 21px
}

.emerging-area .header-text .buttons .circle-btn:hover {
    color: #fff
}

.emerging-area .play-button-wrapper .btn-play {
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 19px;
    color: #0328d2;
    margin: auto;
    left: 0;
    right: 0;
    display: block;
    border: 1px solid #fff;
    border-radius: 100px;
    position: absolute;
    overflow: hidden;
    top: 50%;
    -webkit-transform: perspective(1px) translateY(-50%);
    transform: perspective(1px) translateY(-50%);
    z-index: 3;
    background: #fff;
    -webkit-box-shadow: 0 2px 48px 0 #0328d2;
    box-shadow: 0 2px 48px 0 #0328d2
}

.emerging-area .header-bg {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 82px;
    z-index: 2
}

.emerging-area .play-button-wrapper {
    position: absolute;
    width: 100%;
    bottom: 80px;
    -webkit-transform: perspective(1px) translateY(-45%);
    transform: perspective(1px) translateY(-45%);
    z-index: 4;
    right: 0
}

body.nsf-soft .Contact_top {
    display: none
}

.emerging_sec_2 {
    background: #f9faff;
    padding-bottom: 70px;
    color: #000
}

.emerging_sec_2 p {
    line-height: 2;
    font-size: 18px;
    letter-spacing: .5px;
    border-left: 5px solid #333;
    padding-left: 15px
}

.emerging_featurebox .f-box {
    -webkit-transition: .3s;
    transition: .3s;
    padding: 20px;
    margin-top: 30px;
    min-height: 300px;
    -webkit-box-shadow: 0 2px 12px #ddd;
    box-shadow: 0 2px 12px #ddd;
    border-radius: 5px
}

.emerging_featurebox {
    margin: 10px 0 25px
}

.emerging_featurebox .f-box h4 {
    font-weight: 700;
    color: #0328d2
}

.emerging_featurebox .f-box p {
    color: #5f5d5d;
    font-size: 14px
}

.emerging_featurebox .f-box img {
    -webkit-transition: .3s;
    transition: .3s;
    height: 50px
}

.emerging_featurebox .f-box:hover img {
    -webkit-transform: scale(1.2) translate(0, -5px);
    transform: scale(1.2) translate(0, -5px)
}

.emerging_tech {
    background: #f9fafc;
    padding: 50px 0
}

.emerging_tech .f-box {
    -webkit-transition: .3s;
    transition: .3s;
    padding: 20px;
    border: 1px solid #d4d4d4;
    margin: 30px 10px 10px
}

.emerging_tech .f-box.slick-center,
.emerging_tech .f-box:hover {
    background: #fff
}

.emerging_tech .f-box h4 {
    font-weight: 700
}

.emerging_tech .arrow-n,
.emerging_tech .arrow-p {
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 19px;
    color: #333;
    display: block;
    border-radius: 100px;
    z-index: 3;
    background: #fff;
    right: -40px;
    top: 50%;
    position: absolute;
    cursor: pointer;
    -webkit-box-shadow: 0 2px 48px 0 rgba(0, 0, 0, .13);
    box-shadow: 0 2px 48px 0 rgba(0, 0, 0, .13);
    float: right;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px)
}

.emerging_tech .arrow-p {
    left: -40px
}

.work-timeline {
    max-width: 800px;
    margin: 0 auto;
    position: relative
}

.work-timeline .timeline-item:first-child {
    width: 450px;
    text-align: center;
    margin: 0 auto
}

.work-timeline .timeline-item:first-child .timeline-item-figure:before {
    left: 50%;
    top: calc(50% + 102px);
    height: calc(100% - 120px)
}

.work-timeline .timeline-item-figure {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative
}

.work-timeline .timeline-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 20px 0;
    background-repeat: no-repeat;
    background-size: 350px;
    background-position: bottom left
}

.work-timeline .timeline-item:nth-child(2n) .timeline-item-content:before {
    left: -55px;
    right: inherit
}

.work-timeline .timeline-item-content:before {
    content: "";
    position: absolute;
    right: -55px;
    top: calc(50% - 22px);
    z-index: 1;
    background-size: 100%;
    width: 32px;
    height: 32px;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%)
}

.work-timeline .timeline-item-figure:after {
    content: "";
    display: table;
    clear: both
}

:after,
:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.work-timeline .timeline-item-figure:before {
    content: "";
    height: calc(100% - 11px);
    position: absolute;
    left: -41px;
    top: calc(50% - 6px);
    width: 1px;
    background-color: #333
}

.work-timeline .timeline-item:last-child .timeline-item-content:before {
    left: 50%!important;
    right: inherit;
    top: calc(50% - 35px);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.work-timeline .timeline-item:last-child .timeline-item-content {
    margin-top: 5px;
    text-align: center!important
}

.work-timeline .timeline-item-content {
    text-align: right
}

.work-timeline .timeline-item:nth-child(2n) .timeline-item-content {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    margin-left: 80px;
    margin-right: 0;
    text-align: left
}

.work-timeline .timeline-item-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-right: 80px;
    position: relative
}

.work-timeline .timeline-item-figure>img {
    height: 300px
}

.work-timeline .timeline-item:nth-child(2n) .timeline-item-figure>img {
    float: right
}

.work-timeline .timeline-item:nth-child(2n) .timeline-item-figure:before {
    left: inherit;
    right: -41px
}

#cursor {
    border-left: .1em solid #0328d2;
    -webkit-animation: blink .7s steps(1) infinite;
    animation: blink .7s steps(1) infinite
}

@-webkit-keyframes blink {
    50% {
        border-color: transparent
    }
}

@keyframes blink {
    50% {
        border-color: transparent
    }
}

.material-form .g-recaptcha {
    -webkit-transform: scale(.8);
    transform: scale(.8);
    text-align: left;
    display: inherit;
    position: relative;
    left: -51px
}

.small-device-sltn {
    width: 100%;
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    padding-top: 105px;
    padding-bottom: 105px
}

.small-dvc-inside h6 {
    font-weight: 700;
    color: #1a56f0;
    font-size: 18px
}

.small-dvc-inside h2 {
    font-weight: 700;
    color: #000;
    font-size: 50px;
    padding-bottom: 16px;
    line-height: 1.3em
}

.small-dvc-inside p {
    font-weight: 300;
    color: #000;
    text-align: justify
}

.small-dvc-inside .btn {
    margin-top: 16px;
    color: #fff;
    text-transform: uppercase;
    outline: 0;
    padding: 13px 36px;
    font-weight: 700;
    font-size: 14px;
    background-color: #1a56f0;
    border: 1px solid #1a56f0;
    position: relative;
    z-index: 2;
    overflow: hidden;
    -webkit-box-shadow: 9px 10px 10px -6px rgba(26, 86, 240, .4);
    box-shadow: 9px 10px 10px -6px rgba(26, 86, 240, .4)
}

.small-dvc-inside .btn:hover {
    color: #1a56f0;
    border-color: #1a56f0
}

.small-dvc-inside .btn:after {
    content: '';
    width: 0;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: #fff;
    z-index: -2;
    -webkit-transition: .3s all ease;
    transition: .3s all ease
}

.parallaxxx:after,
.process_list li:after {
    content: ""
}

.small-dvc-inside .btn:hover:after {
    width: 100%
}

#readtext {
    display: none
}

.top_f {
    margin-top: -60px
}

.top_f .top-feature {
    position: relative;
    background: #fff;
    padding: 30px;
    -webkit-box-shadow: 0 10px 50px 1px rgba(0, 0, 0, .3);
    box-shadow: 0 10px 50px 1px rgba(0, 0, 0, .3)
}

.top_f .top-feature h4 {
    font-size: 24px;
    font-weight: 700;
    margin: 10px 0 5px
}

.top_f .top-feature i {
    font-size: 48px;
    color: #0328d2
}

.nsf-slide.digital_b h1 {
    font-size: 50px
}

.nsf-slide.digital_b .col-md-12 {
    width: 80%;
    margin: 0 auto;
    float: none
}

.digital_se .home-services i {
    font-size: 50px;
    color: #077af4
}

.process_list li:after {
    font-weight: 700;
    color: #077af4;
    background: #84c0ff;
    width: 60px;
    height: 60px;
    display: inline-block;
    line-height: 60px;
    border-radius: 50px;
    font-size: 20px;
    position: absolute;
    -webkit-animation: ripple 2s linear infinite;
    animation: ripple 2s linear infinite;
    top: 20px;
    left: 20px
}

.para_simple_list .parallax_design,
.text-reviews {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal
}

ul.process_list {
    margin-top: 20px
}

.process_list li:before {
    font-size: 20px;
    position: relative;
    color: #077af4;
    -webkit-transition: .4s;
    transition: .4s;
    font-weight: 700
}

.process_list li:hover:before {
    background-color: transparent;
    border-color: #077af4
}

.process_list li {
    width: 31.5%;
    padding: 20px;
    margin: 10px;
    border: 1px dashed #b7d7f0;
    border-radius: 4px
}

.process_list li h4 {
    margin-bottom: 0;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 14px;
    color: #4d4d4d
}

.process_list li p {
    color: #505050
}

html.banner-overly_active,
html.banner-overly_active #header {
    right: 0;
    overflow: hidden;
    margin-right: 390px
}

html {
    -webkit-transition: .3s;
    transition: .3s
}

.sidebar-contact .sparkLines ul {
    margin-top: 25px;
    float: left;
    width: 100%
}

.sidebar-contact .sparkLines ul li a {
    color: #333
}

.sidebar-contact .sparkLines ul li {
    color: #333;
    float: left;
    width: 100%;
    padding: 10px
}

.sidebar-contact .sparkLines ul li i,
.sidebar-contact .sparkLines ul li strong {
    color: #0328d2;
    margin-right: 5px
}

.simple_list h3 {
    font-weight: 700;
    color: #000;
    font-size: 30px
}

.simple_list ul {
    list-style: inside;
    padding: 0
}

.simple_list ul li {
    padding: 10px;
    font-size: 20px
}

.simple_list {
    padding: 30px 0
}

.para_simple_list .parallax_design {
    position: relative;
    width: 100%;
    padding: 120px 0;
    background-size: cover!important;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    background-repeat: no-repeat!important;
    background-attachment: fixed!important
}

.orly_black:after,
.orly_blue:after,
.orly_white:after {
    width: 100%;
    background: #0328d2;
    float: left;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    opacity: .8;
    -webkit-transition: .3s;
    transition: .3s;
    content: ""
}

.orly_black:after {
    background: #000
}

.orly_white:after {
    background: #fff
}

.para_simple_list .parallax_design .container {
    position: relative;
    z-index: 9
}

.text-white {
    color: #fff!important
}

.para_simple_list .parallax_design h3 {
    font-weight: 300;
    font-size: 44px
}

.para_simple_list .parallax_design ul {
    list-style: none
}

.para_simple_list .parallax_design ul li {
    padding: 10px;
    font-size: 20px;
    letter-spacing: 1px;
    border-bottom: 1px solid rgba(255, 255, 255, .33);
    display: inline-table
}

.about_bg {
    position: relative;
    width: 100%;
    display: inline-block
}

.about_bg .col-md-6 .box {
    background: #fff;
    padding: 10px 15px 15px 15px;
}

.about_bg .col-md-6 .box p {
    color: #000;
    letter-spacing: .5px
}

.abouticon .nsf-nsf {
    position: absolute;
    left: 30%;
    height: 100%;
    opacity: .1
}

.nsf-slide.alliances h1 {
    font-size: 50px;
    font-weight: 300!important
}

.nsf-slide.alliances h1+p {
    font-size: 22px
}

.nsf-slide.alliances .banner-overly {
    background: #073569
}

.alliance_logos {
    padding: 50px 0 0
}

.alliance_logos div img {
    height: 50px
}

.alliance_logos .row {
    margin-top: 20px
}

.alliance_logos .row .col-md-4 div {
    padding: 30px;
    background: #f2f2f2;
    margin-bottom: 30px
}

.alliance_logos .row .col-md-4 div img {
    height: 90px;
    width: 170px;
    -o-object-fit: contain;
    object-fit: contain
}

.alliance_logos .row .col-md-4 div h5 {
    -webkit-transition: .5s;
    transition: .5s;
    font-size: 11px;
    color: #333;
    padding: 5px;
    margin: 0;
    position: absolute;
    right: 20px
}

.nsf-slide-half h1 {
    color: #fff;
    font-weight: 700;
    font-size: 50px
}

.team_our {
    padding: 40px 0 0
}

.team_our .teamMamber {
    position: relative
}

.team_our .teamHover {
    top: 0;
    padding: 100px 10px;
    -webkit-transition: .3s;
    transition: .3s;
    position: absolute;
    background: rgba(0, 0, 0, .58);
    width: 100%;
    height: 100%;
    visibility: hidden;
    opacity: 0
}

.parallaxxx,
.teamImg {
    position: relative
}

.team_our .infoDetail {
    text-align: center;
    padding: 20px 5px 10px;
    background: #f2f2f2;
    min-height: 240px;
    -webkit-box-shadow: 0 0 2px #878787;
    box-shadow: 0 0 2px #878787
}

.team_our .infoDetail .manageName {
    font-weight: 700
}

.team_our .infoDetail p {
    font-size: 12px;
    letter-spacing: 1px
}

.team_our .teamImg img {
    -webkit-transition: .3s;
    transition: .3s;
    height: 280px;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.team_our .infoDetail .designation {
    text-transform: uppercase;
    font-size: 13px;
    color: #575555;
    margin-bottom: 20px
}

.team_our .teamMamber:hover .teamImg img {
    -o-object-position: bottom;
    object-position: bottom
}

.team_our .teamMamber:hover .teamHover {
    opacity: 1;
    visibility: visible;
    color: #fff
}

.main_team {
    margin: 40px auto
}

.parallaxxx {
    text-align: center;
    background-size: cover!important;
    background-repeat: no-repeat!important;
    padding: 130px 0;
    width: 100%
}

.parallaxxx:after {
    background: #000;
    width: 100%;
    position: absolute;
    top: 0;
    height: 100%;
    left: 0;
    opacity: .8
}

.parallaxxx .container {
    position: relative;
    z-index: 9
}

.parallaxxx .container h3 {
    font-size: 50px;
    color: #fff
}

.parallaxxx .container p {
    width: 80%;
    margin: 0 auto;
    color: #fff;
    font-size: 20px;
    padding-bottom: 20px
}

div.wpcf7 .ajax-loader {
    display: none
}

.corporate-values .orly_black h3,
.corporate-values .orly_black p,
.corporate-values .orly_blue p {
    color: #fff
}

.corporate-values .orly_black p,
.corporate-values .orly_blue p {
    font-size: 24px;
    width: 80%;
    margin: 0 auto
}

.corporate-values .orly_black:after {
    opacity: .6
}

.solutions_top_s.corporate .container {
    border-left: none!important
}

.solutions_top_s.corporate .heading-block,
.solutions_top_s.corporate p {
    padding-left: 0
}

.CorporateValuelist {
    list-style: none;
    padding: 0;
    display: inline-block;
    margin-top: 30px;
    margin-bottom: 30px
}

.CorporateValuelist li {
    padding: 20px;
    display: inline-block;
    text-align: center;
    background: rgba(255, 255, 255, .07);
    width: 147px
}

.CorporateValuelist li img {
    height: 40px
}

.CorporateValuelist li span {
    color: #fff;
    display: block!important;
    margin-top: 10px
}

.footTouch li,
.footTouch li a,
.quickMenu li,
.quickMenu li a {
    display: inline-block
}

.CorporateValuelist ul {
    padding: 0
}

.footLogo img {
    width: 100%;
    height: auto
}

.footAbout {
    overflow: hidden;
    text-align: left
}

.footAbout h3 {
    font-size: 16px;
    color: #fff;
    font-weight: 600;
    margin: 0 0 20px;
    text-transform: uppercase
}

.footAbout p {
    color: #fff;
    font-weight: 500;
    margin: 0;
    opacity: .6
}

.allAddress h3,
footer .footText h3,
footer .quickMenu h3 {
    font-size: 16px;
    color: #fff;
    font-weight: 600;
    text-transform: uppercase
}

.footText {
    margin-top: 70px;
    width: 220px;
    height: auto;
    margin-right: 30px;
    float: left
}

.footText h3 {
    margin: 0 0 20px
}

.footTouch {
    margin-top: 70px;
    overflow: hidden
}

.footTouch li {
    margin-right: 15px
}

.footTouch li a {
    color: #fff;
    opacity: .6
}

.footTouch li a:hover {
    opacity: 1
}

.footTouch li a img {
    width: 20px;
    height: auto
}

.quickMenu h3 {
    margin: 0 0 20px
}

.quickMenu li {
    margin-bottom: 7px
}

.quickMenu li a {
    color: #fff;
    opacity: .6
}

.quickMenu li a:hover {
    opacity: 1
}

.allAddress {
    background-color: rgba(0, 0, 0, .2);
    width: 100%;
    float: left;
    padding: 30px;
    margin: 35px 0;
    list-style: none
}

.allAddress h3 {
    margin: 0 0 15px
}

.allAddress p,
footer .copy a,
footer .copy p,
footer .copy span {
    font-weight: 400;
    color: #ababab
}

.allAddress p {
    font-size: 14px;
    margin: 0;
    color: #ababab
}

.footer_address li {
    width: 20%;
    float: left;
    list-style: none;
    padding-right: 10px
}

footer .copy span {
    opacity: .5;
    margin: 0 10px
}

.footer .hr_contact {
    float: left;
    width: 100%;
    text-align: center;
    color: #fff;
    letter-spacing: 1px;
    margin-top: 20px;
    padding-top: 19px;
    border-top: 1px solid #343434
}

.footer .textwidget img {
    height: 30px
}

.Newsletters_sec {
    text-align: center
}

.footer .dmca {
    float: rightposition:absolute;
    bottom: 10px;
    right: 15px
}

.contact-info {
    display: block;
    padding-top: 0;
    position: relative;
    z-index: 1
}

.cont-us-box .contact-info h3 {
    color: #000;
    font-size: 16px;
    font-weight: 300;
    margin: 0;
    padding-bottom: 40px;
    letter-spacing: 14px;
    text-transform: uppercase
}

.cont-us-box .contact-info .hf {
    font-size: 30px;
    color: #333;
    text-align: left;
    margin-bottom: 0;
    line-height: 56px
}

.cont-us-box .contact-info a.strt-project {
    width: 295px;
    height: 64px;
    background-color: #0a57f4;
    display: inline-block;
    letter-spacing: .2em;
    color: #fff;
    line-height: 64px;
    text-align: center;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 300;
    overflow: hidden;
    text-decoration: none;
    position: relative;
    z-index: 1;
    margin-top: 0
}

.cont-us-box .contact-info a.strt-project:before {
    z-index: -1;
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    color: #fff;
    background: #000;
    -webkit-transition: width .2s ease-in-out;
    transition: width .2s ease-in-out;
    height: 64px;
    line-height: 64px;
    content: ''
}

.cont-us-box .contact-info a.strt-project:hover:before {
    width: 100%
}

.cont-us-box .communi-info {
    display: inline-block;
    margin-top: 20px;
    position: relative;
    z-index: 9;
    bottom: -80px;
    width: 100%
}

.cont-us-box .communi-info li .cont-icn-blk {
    width: 100%;
    display: inline-block;
    color: #fff;
    margin-bottom: 0
}

.communi-info ul {
    list-style: none
}

.cont-us-box .communi-info ul {
    margin: 0
}

.cont-us-box .communi-info li {
    margin: 0 0 30px;
    color: #000;
    width: 33%;
    float: left;
    font-size: 18px;
    font-weight: 300;
    position: relative
}

.cont-us-box .communi-info li a {
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    float: left
}

.cont-us-box .communi-info li i {
    height: 38px;
    line-height: 38px;
    float: left;
    font-weight: 600
}

.cont-us-box .communi-info li span {
    display: block;
    width: 42px;
    height: 42px;
    background: #fff;
    text-align: center;
    line-height: 38px;
    float: left;
    margin: 0 10px 0 0;
    border-radius: 50px
}

.cont-us-box .communi-info li span i {
    color: #0328d2;
    font-size: 18px;
    line-height: 42px;
    display: block;
    text-align: center;
    width: 100%
}

.cont-us-box .communi-info li span.hangout {
    line-height: 40px
}

.induse-sec,
.induse-sec-lft,
.induse-sec:before {
    width: 100%;
    display: block
}

.induse-sec {
    background: #fff;
    padding: 50px 0;
    min-height: 100vh;
    overflow: hidden;
    position: relative
}

.this_footer .contact-wrap {
    margin-bottom: 40px;
    max-width: 450px;
    -webkit-box-shadow: 0 8px 28px rgba(0, 0, 0, .19);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .19);
    background: #fff
}

.this_footer .material-form .input-block label,
.this_footer .select-block.added .active-list {
    color: #333
}

.this_footer .material-form .input-block label.error,
.this_footer .select-block.added .active-list {
    text-align: right;
    color: #a70e0e
}

.this_footer .material-form .input-block .form-control {
    letter-spacing: .5px
}

.this_footer .contact-wrap h3 {
    color: #0328d2;
    font-weight: 700;
    margin-bottom: 15px
}

.this_footer .contact-wrap .material-form .input-block {
    bordger-bottom: 1px solid #c1c1c1
}

.this_footer .material-form .input-block:before {
    background: #333
}

.this_footer .material-form .square-button {
    background: #03a9f4;
    color: #fff;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 90%;
    margin-top: 10px
}

.footer_client li {
    width: 20%;
    float: left
}

#wh-widget-send-button.wh-widget-left {
    bottom: 35px!important
}

.Newsletters_sec h5 {
    letter-spacing: 1px;
    font-weight: 300;
    font-size: 22px
}

div.wpcf7-response-output {
    border: none!important;
    margin: 10px;
    padding: 0;
    float: left
}

.wpcf7-validation-errors {
    color: rgba(204, 40, 40, .9)
}

.wpcf7-mail-sent-ok {
    color: #398f14
}

.contact-wrap div.wpcf7-response-output {
    font-size: 14px;
    margin: 0
}

.text-reviews .inner_box:after {
    content: "";
    width: 150px;
    height: 480px;
    position: absolute;
    background: url(https://codologi.in/images/quoteicon.png) no-repeat;
    background-size: 83px;
    top: 0;
    -webkit-filter: invert(4);
    filter: invert(4);
    opacity: .1;
    z-index: -1;
    left: 0
}

.text-reviews {
    padding: 110px 60px 0 0;
    position: relative;
    float: left;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    width: 100%
}

.text-reviews p {
    font-size: 21px;
    color: #fff;
    font-style: italic
}

.text-reviews .slick-dots {
    top: 0;
    position: relative
}

.text-reviews .slick-dots li button:before {
    font-size: 11px;
    color: #fff
}

.text-reviews .slick-dots li.slick-active button:before {
    opacity: 1;
    color: #fff
}

.text-reviews .name {
    color: #fff;
    font-weight: 700
}

.hero-bkg-animated {
    background: url(https://codologi.in/images/geometry2.png) gray;
    width: 100%;
    margin: 0;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-animation: slide 20s linear infinite
}

.hero-bkg-animated h1 {
    font-family: sans-serif
}

@-webkit-keyframes slide {
    from {
        background-position: 0 0
    }
    to {
        background-position: 0 385px
    }
}

.testimonials_sec .row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    direction: ltr
}

.testimonials_sec .row:nth-child(odd) {
    background: #f2f2f2
}

.testimonials_sec .row:nth-child(odd) .col-md-3 {
    float: right
}

.slider_background {
    position: relative;
    float: left;
    width: 100%
}

.slider_background .background_bg .bg-slider_meta {
    position: relative;
    z-index: 1
}

.slider_background .background_bg .bg-slider_meta h1 {
    color: #fff;
    font-size: 45px;
    font-weight: 700
}

.slider_background .background_bg .bg-slider_meta big {
    color: #fff;
    font-size: 24px;
    text-transform: uppercase
}

.slider_background .background_bg {
    padding: 200px 0;
    text-align: center;
    background-size: cover!important;
    background-position: center;
    background-repeat: no-repeat!important
}

#portfolio .section:after,
.slider_background:after {
    background: #030d2f;
    content: "";
    width: 100%;
    left: 0;
    bottom: 0
}

.slider_background:after {
    height: 100%;
    position: absolute;
    opacity: .8
}

.testimonials_sec {
    float: left;
    width: 100%;
    padding: 50px 0
}

#portfolio .section {
    height: 70vh;
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    float: left
}

#portfolio .section:after {
    top: 0;
    height: 100%;
    position: absolute;
    opacity: .4
}

#portfolio .section .container,
#portfolio .section .container-fluid {
    position: relative;
    z-index: 2
}

.static_cont_Privacy ul {
    list-style: none;
    padding-left: 15px
}

.static_cont_Privacy ul li {
    position: relative;
    margin-bottom: 10px
}

.static_cont_Privacy ul li:before {
    content: "\f101";
    font: normal normal normal 14px/1 FontAwesome;
    left: -15px;
    position: absolute;
    width: 30px;
    height: 30px;
    line-height: 30px
}

.PaaS_Development h4,
.testimonials_sec .info h5 {
    font-weight: 700
}

.static_cont p {
    font-size: 16px;
    color: #333;
    margin-bottom: 20px
}

.static_cont_Privacy h3 {
    margin: 30px 0 20px;
    font-size: 25px;
    font-weight: 700
}

.quality_assurance .qa-box img {
    height: 70px;
    margin-top: 10px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%)
}

.quality_assurance .qa-box {
    -webkit-transition: .4s;
    transition: .4s;
    text-align: center;
    background: #f2f2f2;
    padding: 10px 0
}

.quality_assurance .qa-box h5 {
    margin: 15px 0 0;
    padding-bottom: 20px
}

.quality_assurance .col-md-2 {
    padding: 5px;
    border: 1px solid #e3e3e3
}

.quality_assurance .qa-box:hover img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0)
}

.PaaS_Development p {
    font-size: 15px;
    line-height: 1.9;
    text-align: justify
}

.notoppadding {
    padding-top: 0!important
}

#return-to-top {
    position: fixed;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    bottom: 10px;
    right: 11px;
    background: #000;
    background: rgba(0, 0, 0, .6);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: none;
    text-align: center;
    -webkit-transition: all .3s linear;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    line-height: 40px;
    z-index: 99999
}

#return-to-top i {
    color: #fff;
    margin: 0;
    position: relative;
    font-size: 19px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

#return-to-top:hover {
    background: rgba(0, 0, 0, .9)
}

.tybg {
    padding-top: 80px
}

body.thankyou header#header {
    background: #061a3f
}

body.thankyou header#header.scrolled {
    background: #fff
}

.port_btn button {
    margin-top: -78px;
    float: left
}

.projects-bg.home_port {
    padding: 30px 0 110px
}

body.career .background_bg {
    background-position: center!important
}

#nsfhslider .left.carousel-control,
#nsfhslider .right.carousel-control {
    height: 40px;
    text-align: center;
    background-image: none;
    line-height: 30px;
    opacity: 1;
    position: absolute;
    top: 50%;
    z-index: 99;
    width: 40px;
    background-color: transparent;
    font-size: 50px;
    font-weight: 300
}

.testimonials_sec .row {
    padding: 40px
}

.home_abt .text p {
    margin: 10px 0;
    letter-spacing: .5px;
    color: #000
}

.home_industry.section {
    /*padding: 20px 0*/
}

#nsfhslider .right.carousel-control {
    right: 20px;
    border-radius: 50px;
    -webkit-transform: scale(-1);
    transform: scale(-1);
    border: 1px solid rgba(255, 255, 255, .33)
}

#nsfhslider .left.carousel-control {
    left: 20px;
    right: auto;
    border-radius: 50px;
    border: 1px solid rgba(255, 255, 255, .33)
}

.common-AlignRight,
label.error {
    text-align: right
}

#nsfhslider .carousel-control img {
    height: 15px
}

#nsfhslider .carousel-control {
    -webkit-transition: .3s;
    transition: .3s
}

#nsfhslider .carousel-control:hover {
    background: #0328d2;
    border-color: transparent
}

.mega-dropdown-menu .glyphicon {
    opacity: .5
}

.counter-part.counter-5 {
    display: none!important
}

.quality-assurance .parallaxxx ol li {
    color: #fff;
    display: inline-block;
    padding: 10px 20px;
    background: 0 0;
    margin: 5px;
    border: 1px solid
}

.ngg-gallery-thumbnail img {
    height: 150px!important;
    width: 224px;
    -o-object-fit: cover;
    object-fit: cover
}

.development-item-img {
    display: none!important
}

.menuslide .carousel-control,
.whychooseusbox {
    display: none
}

.wpcf7-form label.error {
    color: #c82222;
    float: left
}

.allAddress a {
    color: #ababab
}

.allAddress a:hover {
    color: #fff
}

.theme_1.wpcf7-form input.error,
.theme_1.wpcf7-form select.error,
.theme_1.wpcf7-form textarea.error,
label.error {
    color: #c82222!important
}

label.error {
    font-weight: 400!important
}

.menuslide .carousel-inner {
    background-color: transparent
}

.menuslide .carousel-inner>.item>img {
    -webkit-filter: hue-rotate(-40deg);
    filter: hue-rotate(-40deg)
}

.working-process-anim ul li {
    display: inline-block;
    background: #f2f2f2;
    padding: 7px 14px;
    border-radius: 50px;
    margin: 3px;
    font-size: 14px
}

.globalNav,
.globalNav .popup {
    right: 0
}

.globalFooter,
.globalNav {
    -moz-osx-font-smoothing: grayscale
}

.globalFooterNav li,
.globalNav li {
    list-style: none
}


.container-wide,
.container-xl {
    max-width: 1160px
}

.common-SuperTitle {
    font-weight: 300;
    font-size: 45px;
    line-height: 60px;
    color: #0328d2;
    letter-spacing: -.01em
}

@media (min-width:991px) {
    .common-SuperTitle {
        font-size: 50px;
        line-height: 70px
    }
}

.common-PageTitle {
    font-weight: 400;
    font-size: 34px;
    line-height: 43px;
    color: #0328d2
}

@media (min-width:991px) {
    .common-PageTitle {
        font-size: 40px;
        line-height: 50px
    }
}

.common-PageSubtitle {
    font-weight: 300;
    font-size: 34px;
    line-height: 43px;
    color: #0328d2
}

@media (min-width:991px) {
    .common-PageSubtitle {
        font-size: 40px;
        line-height: 50px
    }
}

.common-IntroText {
    font-weight: 400;
    font-size: 21px;
    line-height: 31px;
    color: #525f7f
}

@media (min-width:991px) {
    .common-IntroText {
        font-size: 24px;
        line-height: 36px
    }
}

.common-BodyTitle {
    font-weight: 500;
    font-size: 19px;
    line-height: 28px;
    color: #0328d2
}

.common-BodyText {
    font-weight: 400;
    font-size: 17px;
    line-height: 26px;
    color: #6b7c93
}

.common-Uppercase,
.common-UppercaseTitle {
    font-weight: 600;
    text-transform: uppercase
}

.common-Link,
.common-Link:hover {
    color: #0328d2
}

.common-UppercaseTitle {
    font-size: 20px;
    line-height: 31px;
    letter-spacing: .025em
}

@media (min-width:991px) {
    .common-UppercaseTitle {
        font-size: 22px;
        line-height: 33px
    }
}

.common-Uppercase {
    font-size: 17px;
    line-height: 26px;
    letter-spacing: .025em
}

.common-NoWrap {
    white-space: nowrap
}

.common-ProductLockup,
.common-ProductLockupBack {
    font-size: 24px;
    line-height: 30px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.common-ProductLockup .icon,
.common-ProductLockupBack .icon {
    width: 64px;
    height: 64px;
    overflow: hidden;
    border-radius: 50%;
    -webkit-box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    margin-right: 20px
}

@media (min-width:991px) {
    .common-ProductLockup,
    .common-ProductLockupBack {
        font-size: 28px;
        line-height: 38px
    }
    .common-ProductLockup .icon,
    .common-ProductLockupBack .icon {
        width: 72px;
        height: 72px
    }
}

.common-ProductLockupBack {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 20px;
    -webkit-transition: color .1s;
    transition: color .1s
}

.common-ProductLockupBack:before {
    font: 400 48px/24px StripeIcons;
    content: '\279D';
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    width: 36px;
    text-align: right;
    position: relative;
    top: -6px;
    -webkit-transition: color .1s;
    transition: color .1s
}

.common-BetaBadge,
.globalNav .navSection.primary {
    text-align: center
}

.common-ProductLockupBack .icon {
    width: 48px;
    height: 48px
}

.common-ProductLockupBack .hover-fillDark,
.common-ProductLockupBack .hover-fillLight {
    -webkit-transition: fill .1s;
    transition: fill .1s
}

.common-ProductLockupBack .hover-strokeDark,
.common-ProductLockupBack .hover-strokeLight {
    -webkit-transition: stroke .1s;
    transition: stroke .1s
}

.common-ProductLockupBack:hover .hover-fillLight {
    fill: #8898aa
}

.common-ProductLockupBack:hover .hover-fillDark {
    fill: #0328d2
}

.common-ProductLockupBack:hover .hover-strokeLight {
    stroke: #8898aa
}

.common-ProductLockupBack:hover .hover-strokeDark {
    stroke: #0328d2
}

.globalNav .linkContainer:hover .hover-strokeLight,
a.globalFooterCard:hover svg .hover-strokeLight,
div.globalFooterCard:hover svg .hover-strokeLight {
    stroke: #8898aa
}

.common-Link {
    font-weight: 500;
    -webkit-transition: color .1s ease;
    transition: color .1s ease;
    cursor: pointer
}

.common-Link:active {
    color: #000
}

.common-Link--arrow:after {
    font: 400 16px StripeIcons;
    content: '\2192';
    padding-left: 5px
}

.common-BetaBadge,
.common-Button {
    font-weight: 600;
    text-transform: uppercase
}

.common-Uppercase.common-Link--arrow:after {
    content: "➜"
}

.common-InvertedText .common-BodyTitle,
.common-InvertedText .common-PageSubtitle,
.common-InvertedText .common-PageTitle,
.common-InvertedText .common-SuperTitle,
.common-InvertedText .common-Uppercase,
.common-InvertedText .common-UppercaseTitle {
    color: #fff
}

.common-InvertedText .common-IntroText {
    color: #c4f0ff
}

.common-InvertedText .common-BodyText {
    color: #9cdbff
}

.common-InvertedText .common-Link,
.common-Link--white {
    color: #fff
}

.common-InvertedText .common-Link:hover,
.common-Link--white:hover {
    color: #c4f0ff
}

.common-InvertedText .common-Link:active,
.common-Link--white:active {
    color: #87bbfd
}

.common-Button {
    white-space: nowrap;
    display: inline-block;
    height: 40px;
    line-height: 40px;
    padding: 0 14px;
    -webkit-box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
    box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
    background: #fff;
    border-radius: 4px;
    font-size: 15px;
    letter-spacing: .025em;
    color: #0328d2;
    -webkit-transition: all .15s ease;
    transition: all .15s ease
}

.common-Button:hover {
    color: #7795f8;
    -webkit-transform: translateY(-1px);
    transform: translateY(-1px);
    -webkit-box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08)
}

.common-Button:active {
    color: #555abf;
    background-color: #f6f9fc;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
    -webkit-box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
    box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08)
}

.common-Button--default {
    color: #fff;
    background: #0328d2
}

.common-Button--default:hover {
    color: #fff;
    background-color: #7795f8
}

.common-Button--default:active {
    color: #e6ebf1;
    background-color: #555abf
}

.common-Button--dark {
    color: #fff;
    background: #0328d2
}

.common-Button--dark:hover {
    color: #fff;
    background-color: #43458b
}

.common-Button--dark:active {
    color: #e6ebf1;
    background-color: #0328d2
}

.common-ButtonIcon {
    display: inline;
    margin: 0 5px 0 0;
    position: relative
}

.common-ButtonGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -10px
}

.common-ButtonGroup .common-Button {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin: 10px
}

.StripeBackground {
    position: absolute;
    left: 0;
    top: 50%;
    right: 0;
    -webkit-transform: skewY(-12deg);
    transform: skewY(-12deg);
    pointer-events: none
}

.StripeBackground .stripe {
    position: absolute;
    top: auto;
    left: 0;
    right: 0
}

.StripeBackground.accelerated .stripe {
    will-change: transform
}

.StripeBackground .stripe.pattern {
    overflow: hidden
}

.StripeBackground .stripe.pattern:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1000px;
    top: -1000px;
    -webkit-transform: skew(0, 12deg);
    transform: skew(0, 12deg)
}

.common-Card {
    position: relative;
    background-color: #fff;
    border-radius: 4px;
    padding: 30px;
    -webkit-box-shadow: 0 15px 35px rgba(50, 50, 93, .1), 0 5px 15px rgba(0, 0, 0, .07);
    box-shadow: 0 15px 35px rgba(50, 50, 93, .1), 0 5px 15px rgba(0, 0, 0, .07)
}

@media (min-width:880px) {
    .common-Card {
        padding: 50px
    }
}

.common-BetaBadge {
    display: inline;
    position: relative;
    height: 18px;
    margin-left: 11px;
    border-radius: 9px;
    font-size: 12px;
    padding: 2px 6px 2px 7px;
    color: #8898aa;
    background-color: rgba(136, 152, 170, .15)
}

.lg-cols,
.lg-grid,
.lg-rows,
.md-cols,
.md-grid,
.md-rows,
.sm-cols,
.sm-grid,
.sm-rows,
.xs-cols,
.xs-grid,
.xs-rows {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: -20px
}

.feature-block {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 20px;
    position: relative
}

.xs-cols {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

.xs-cols .feature-block {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%
}

.xs-rows {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.xs-rows .feature-block {
    -ms-flex-preferred-size: auto;
    flex-basis: auto
}

.xs-grid {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.xs-grid .feature-block {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%
}

.xs-icon-top .icon {
    margin: 10px 0 20px -3px
}

.xs-icon-left {
    padding-left: 50px
}

.xs-icon-left .icon {
    position: absolute;
    left: -24px;
    top: 7px
}

@media (min-width:991px) {
    .sm-cols,
    .sm-grid,
    .sm-rows {
        -webkit-box-direction: normal
    }
    .sm-cols {
        -webkit-box-orient: horizontal;
        -ms-flex-direction: row;
        flex-direction: row
    }
    .sm-cols .feature-block {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%
    }
    .sm-rows {
        -webkit-box-orient: vertical;
        -ms-flex-direction: column;
        flex-direction: column
    }
    .sm-rows .feature-block {
        -ms-flex-preferred-size: auto;
        flex-basis: auto
    }
    .sm-grid {
        -webkit-box-orient: horizontal;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
    .sm-grid .feature-block {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%
    }
    .sm-icon-top {
        padding-left: 0
    }
    .sm-icon-top .icon {
        position: static;
        margin: 10px 0 20px -3px
    }
    .sm-icon-left {
        padding-left: 50px
    }
    .sm-icon-left .icon {
        position: absolute;
        left: -24px;
        top: 7px
    }
}

@media (min-width:880px) {
    .md-cols,
    .md-grid,
    .md-rows {
        -webkit-box-direction: normal
    }
    .md-cols {
        -webkit-box-orient: horizontal;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
    .md-cols .feature-block {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%
    }
    .md-rows {
        -webkit-box-orient: vertical;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
    .md-rows .feature-block {
        -ms-flex-preferred-size: auto;
        flex-basis: auto
    }
    .md-grid {
        -webkit-box-orient: horizontal;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
    .md-grid .feature-block {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%
    }
    .md-icon-top {
        padding-left: 0
    }
    .md-icon-top .icon {
        position: static;
        margin: 10px 0 20px -3px
    }
    .md-icon-left {
        padding-left: 50px
    }
    .md-icon-left .icon {
        position: absolute;
        left: -24px;
        top: 7px
    }
}

@media (min-width:1040px) {
    .lg-cols,
    .lg-grid,
    .lg-rows {
        -webkit-box-direction: normal
    }
    .lg-cols {
        -webkit-box-orient: horizontal;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
    .lg-cols .feature-block {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%
    }
    .lg-rows {
        -webkit-box-orient: vertical;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
    .lg-rows .feature-block {
        -ms-flex-preferred-size: auto;
        flex-basis: auto
    }
    .lg-grid {
        -webkit-box-orient: horizontal;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
    .lg-grid .feature-block {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%
    }
    .lg-icon-top {
        padding-left: 0
    }
    .lg-icon-top .icon {
        position: static;
        margin: 10px 0 20px -3px
    }
    .lg-icon-left {
        padding-left: 50px
    }
    .lg-icon-left .icon {
        position: absolute;
        left: -24px;
        top: 7px
    }
}

.feature-block h3,
.feature-block p {
    margin-bottom: 10px
}

.feature-block h3:last-child,
.feature-block p:last-child {
    margin-bottom: 0
}

.feature-block .icon {
    width: 48px;
    height: 48px
}

.common-FlagIcon:before {
    content: '';
    display: inline-block;
    width: 21px;
    height: 15px;
    vertical-align: -2px;
    margin-right: 12px
}

.common-FlagIcon--at:before {
    background-position: -10px -10px
}

.common-FlagIcon--au:before {
    background-position: -41px -10px
}

.common-FlagIcon--be:before {
    background-position: -72px -10px
}

.common-FlagIcon--br:before {
    background-position: -103px -10px
}

.common-FlagIcon--ca:before {
    background-position: -134px -10px
}

.common-FlagIcon--ch:before {
    background-position: -165px -10px
}

.common-FlagIcon--de:before {
    background-position: -196px -10px
}

.common-FlagIcon--dk:before {
    background-position: -227px -10px
}

.common-FlagIcon--es:before {
    background-position: -258px -10px
}

.common-FlagIcon--fi:before {
    background-position: -289px -10px
}

.common-FlagIcon--fr:before {
    background-position: -320px -10px
}

.common-FlagIcon--gb:before {
    background-position: -351px -10px
}

.common-FlagIcon--hk:before {
    background-position: -382px -10px
}

.common-FlagIcon--ie:before {
    background-position: -413px -10px
}

.common-FlagIcon--it:before {
    background-position: -444px -10px
}

.common-FlagIcon--jp:before {
    background-position: -475px -10px
}

.common-FlagIcon--lu:before {
    background-position: -506px -10px
}

.common-FlagIcon--mx:before {
    background-position: -10px -35px
}

.common-FlagIcon--nl:before {
    background-position: -41px -35px
}

.common-FlagIcon--no:before {
    background-position: -72px -35px
}

.common-FlagIcon--nz:before {
    background-position: -103px -35px
}

.common-FlagIcon--pt:before {
    background-position: -134px -35px
}

.common-FlagIcon--se:before {
    background-position: -165px -35px
}

.common-FlagIcon--sg:before {
    background-position: -196px -35px
}

.common-FlagIcon--us:before {
    background-position: -227px -35px
}

.common-FlagIcon--xx:before {
    background-position: -258px -35px
}

.globalNav {
    -webkit-font-smoothing: antialiased;
    position: absolute;
    left: 0;
    top: 10px;
    z-index: 500;
    height: 50px;
    -webkit-perspective: 2000px;
    perspective: 2000px
}

.globalNav ul {
    padding: 0;
    margin: 0
}

.globalNav li {
    margin-bottom: 10px
}

.globalNav a {
    -webkit-tap-highlight-color: transparent;
    color: #000;
    -webkit-transition: color .1s;
    transition: color .1s;
    font-weight: 300
}

.industryGroupSecondary a svg {
    float: left;
    margin-right: 10px
}

.industryGroupSecondary .linkSub {
    margin-left: 22px!important
}

.globalNav a:hover {
    color: #0328d2
}

.globalNav>.container-lg {
    padding: 0
}

.globalNav .navRoot {
    position: relative
}

.globalNav .navSection.logo {
    position: absolute;
    top: 0;
    left: 0
}

.globalNav .navSection.primary,
.globalNav .navSection.secondary {
    display: none
}

.globalNav .navSection.secondary {
    position: absolute;
    top: 0;
    right: 0
}

.globalNav .navSection.mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

@media (min-width:991px) {
    .globalNav .navSection.primary,
    .globalNav .navSection.secondary {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
    .globalNav .navSection.mobile {
        display: none
    }
}

.globalNav.compact .navRoot {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.globalNav.compact .navSection.logo {
    position: static;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.globalNav.compact .navSection.secondary {
    position: static
}

.globalNav .rootLink {
    display: inline-block;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /*font-size:16px;*/
    font-size: 13px;
    line-height: 50px;
    font-weight: 400;
    margin: 0;
    padding: 0 10px
}

@media (min-width:991px) {
    .globalNav .rootLink {
        padding: 0
    }
}

@media (min-width:1040px) {
    .globalNav .rootLink {
        padding: 0 25px
    }
}

.globalNav .navSection.logo .rootLink {
    padding-left: 20px!important
}

.globalNav .navSection.primary .rootLink {
    /*font-weight: bold;*/
}

.globalNav .colorize {
    color: #fff;
    -webkit-transition: color .1s ease;
    transition: color .1s ease
}

.globalNav .colorize.active,
.globalNav .colorize:hover {
    color: #0328d2
}

.globalNav .hasDropdown {
    cursor: default
}

.globalNav .item-home h1 {
    line-height: 50px;
    font-size: 20px;
    margin: 0;
    color: inherit
}

.globalNav .item-home svg {
    vertical-align: -5px
}

.globalNav .item-home svg path {
    fill: currentColor
}

.globalNav .linkContainer:hover .hover-fillLight,
a.globalFooterCard:hover svg .hover-fillLight,
div.globalFooterCard:hover svg .hover-fillLight {
    fill: #8898aa
}

.globalNav .item-dashboard:after {
    font: 400 16px StripeIcons;
    content: '\279E';
    padding-left: 1px
}

.globalNav .dropdownRoot {
    position: absolute;
    z-index: 1000;
    left: 0;
    right: 0;
    top: 58px;
    pointer-events: none;
    -webkit-transform: rotateX(-15deg);
    transform: rotateX(-15deg);
    -webkit-transform-origin: 50% -50px;
    transform-origin: 50% -50px;
    opacity: 0;
    will-change: transform, opacity;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transition-duration: .25s;
    transition-duration: .25s;
    display: none
}

@media (min-width:991px) {
    .globalNav .dropdownRoot {
        display: block
    }
}

.globalNav.dropdownActive .dropdownRoot {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: none;
    transform: none
}

.globalNav .dropdownBackground {
    background: #fff;
    border-radius: 4px;
    overflow: hidden;
    -webkit-box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1);
    box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1);
    width: 520px;
    height: 400px;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0
}

.globalNav .alternateBackground,
.globalNav .dropdownBackground {
    position: absolute;
    top: 0;
    left: 0;
    will-change: transform;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-property: transform, -webkit-transform;
    transition-property: transform, -webkit-transform;
    -webkit-transition-duration: .25s;
    transition-duration: .25s
}

.globalNav .alternateBackground {
    right: 0;
    height: 1000px;
    background: #f6f9fc
}

.globalNav .dropdownArrow {
    top: -6px;
    margin: 0 0 0 -36px;
    width: 12px;
    height: 12px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    border-radius: 4px 0 0;
    background: #fff;
    -webkit-box-shadow: -3px -3px 5px rgba(82, 95, 127, .04);
    box-shadow: -3px -3px 5px rgba(82, 95, 127, .04);
    will-change: transform;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-property: transform, -webkit-transform;
    transition-property: transform, -webkit-transform
}

.globalNav .dropdownArrow,
.globalNav .dropdownContainer {
    position: absolute;
    left: 0;
    -webkit-transition-duration: .25s;
    transition-duration: .25s
}

.globalNav .dropdownContainer {
    overflow: hidden;
    top: 0;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    will-change: transform, width, height;
    -webkit-transition-property: width, height, -webkit-transform;
    transition-property: width, height, -webkit-transform;
    transition-property: transform, width, height;
    transition-property: transform, width, height, -webkit-transform
}

.globalNav .dropdownSection {
    opacity: 0;
    pointer-events: none;
    will-change: transform, opacity;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transition-duration: .25s;
    transition-duration: .25s;
    background: #fff;
    border-radius: 10px
}

.globalNav .dropdownSection.active {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.globalNav .dropdownSection.left {
    -webkit-transform: translateX(-150px);
    transform: translateX(-150px)
}

.globalNav .dropdownSection.right {
    -webkit-transform: translateX(150px);
    transform: translateX(150px)
}

.globalNav.dropdownActive .dropdownSection.active {
    pointer-events: auto
}

.globalNav.noDropdownTransition .alternateBackground,
.globalNav.noDropdownTransition .dropdownArrow,
.globalNav.noDropdownTransition .dropdownBackground,
.globalNav.noDropdownTransition .dropdownContainer,
.globalNav.noDropdownTransition .dropdownSection {
    -webkit-transition: none;
    transition: none
}

.globalNav .dropdownContent {
    position: absolute;
    top: 0;
    left: 0
}

.globalNav .linkGroup {
    padding: 15px 35px;
    float: left;
    width: 100%
}

.globalNav .linkContainer {
    display: block
}

.globalNav .linkTitle {
    margin: 0;
    color: #1848a1;
    font-size: 13px;
    line-height: 22px;
    text-transform: uppercase;
    letter-spacing: .025em
}

.globalNav .linkSub {
    font-size: 15px;
    line-height: 22px;
    color: #6b7c93;
    margin: 5px 0 0;
    display: block
}

.globalNav .linkSub,
.globalNav .linkTitle {
    -webkit-transition: color .1s;
    transition: color .1s
}

.globalNav .linkContainer:hover .linkTitle,
.globalNav .linkTitle:hover {
    color: #0328d2
}

.globalNav .linkContainer:hover .linkSub {
    color: #424770
}

.globalNav .hover-fillDark,
.globalNav .hover-fillLight {
    -webkit-transition: fill .1s;
    transition: fill .1s
}

.globalNav .hover-strokeDark,
.globalNav .hover-strokeLight {
    -webkit-transition: stroke .1s;
    transition: stroke .1s
}

.globalNav .linkContainer:hover .hover-fillDark,
a.globalFooterCard:hover svg .hover-fillDark,
div.globalFooterCard:hover svg .hover-fillDark {
    fill: #0328d2
}

.globalNav .linkContainer:hover .hover-strokeDark,
a.globalFooterCard:hover svg .hover-strokeDark,
div.globalFooterCard:hover svg .hover-strokeDark {
    stroke: #0328d2
}

.globalNav .linkIcon {
    white-space: nowrap
}

.globalNav .linkIcon svg {
    margin: 0 12px -3px -1px
}

.globalNav .withIcon {
    padding-left: 28px
}

.globalNav .withIcon .linkTitle {
    margin-left: -28px
}

.globalNav .new-badge {
    display: inline-block;
    margin-left: 5px;
    vertical-align: 2px;
    color: #fff;
    text-transform: uppercase;
    font-size: 10px;
    line-height: 14px;
    font-weight: 700;
    background: #0328d2;
    -webkit-transition: background .15s;
    transition: background .15s;
    border-radius: 10px;
    padding: 0 5px;
    height: auto;
    top: auto;
    -webkit-box-shadow: none;
    box-shadow: none
}

.globalNav .linkContainer:hover .new-badge {
    background: #0328d2
}

.globalNav .productsGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 640px;
    max-width: calc(100vw - 85px);
    margin: -5px -10px
}

.globalNav .productsGroup>li {
    -ms-flex: 1 0 50%;
    -webkit-box-flex: 1;
    flex: 1 0 50%
}

.globalNav .productsGroup .linkContainer,
.globalNav .productsGroup>li {
    -webkit-box-flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.globalNav .productsGroup .linkContainer {
    padding: 18px 10px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.globalNav .productsGroup svg {
    width: 48px;
    height: 48px
}

.globalNav .productLinkContent {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 71px
}

.globalNav .prodsubGroup,
.globalNav .productLinkContent {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.globalNav .prodsubGroup .linkContainer {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding: 13px 30px
}

.globalNav .prodsubGroup .linkSub {
    margin: 0 0 0 10px
}

.globalNav .item-subscriptions .linkTitle {
    color: #24b47e
}

.globalNav .item-connect .linkTitle {
    color: #3297d3
}

.globalNav .item-relay .linkTitle {
    color: #e25950
}

.globalNav .item-atlas .linkTitle {
    color: #e39f48
}

.globalNav .item-radar .linkTitle {
    color: #b76ac4
}

.globalNav .item-radar .new-badge {
    background: #b76ac4
}

.globalNav .documentationGroup .linkSub {
    max-width: 250px
}

.globalNav .documentationArticles {
    font-size: 15px;
    line-height: 26px;
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    white-space: nowrap
}

.globalNav .documentationArticles>ul {
    margin-right: 20px;
    width: 240px
}

.with100 {
    width: 100%!important;
    max-width: 100%!important
}

.globalNav .documentationArticles>ul:last-child {
    margin-right: 0
}

.globalNav .documentationArticles h4 {
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: .025em;
    margin: 0 0 9px;
    color: #0328d2
}

.globalNav .blogPosts {
    margin: 5px 10px 5px 28px
}

.globalNav .blogPosts a {
    display: block;
    white-space: nowrap;
    padding: 5px 0
}

.globalNav .blogPosts a:after {
    content: '\27A2';
    font: 400 16px StripeIcons;
    margin-left: 6px;
    vertical-align: -3px
}

.globalNav .blogPosts .title {
    font-size: 15px;
    line-height: 22px;
    display: inline-block;
    white-space: nowrap;
    max-width: 300px;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align: top
}

.globalNav .blogPosts .title.new {
    font-weight: 500
}

.globalNav .blogPosts .new-badge {
    vertical-align: -1px
}

.globalNav .blogPosts a:hover .new-badge {
    background: #0328d2
}

.globalNav .navSection.mobile .rootLink {
    cursor: pointer;
    width: 50px;
    height: 50px;
    position: relative
}

.globalNav .navSection.mobile .rootLink h2 {
    color: inherit;
    font-size: 0;
    left: 13px;
    top: 23px
}

.globalNav .navSection.mobile .rootLink h2,
.globalNav .navSection.mobile .rootLink h2:after,
.globalNav .navSection.mobile .rootLink h2:before {
    position: absolute;
    width: 24px;
    height: 2px;
    border-radius: 9px;
    background: currentColor
}

.globalNav .navSection.mobile .rootLink h2:after,
.globalNav .navSection.mobile .rootLink h2:before {
    content: '';
    left: 0
}

.globalNav .navSection.mobile .rootLink h2:before {
    top: -9px
}

.globalNav .navSection.mobile .rootLink h2:after {
    top: 9px
}

.globalNav .popup {
    position: absolute;
    left: 0;
    top: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    pointer-events: none;
    -webkit-perspective: 2000px;
    perspective: 2000px
}

.globalNav .popupContainer {
    background: #fff;
    -webkit-box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1);
    box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1);
    border-radius: 4px;
    overflow: hidden;
    position: relative;
    font-size: 17px;
    line-height: 40px;
    white-space: nowrap;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-transform: rotate3d(1, 1, 0, -15deg);
    transform: rotate3d(1, 1, 0, -15deg);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    opacity: 0;
    will-change: transform, opacity;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transition-duration: .25s;
    transition-duration: .25s
}

.globalNav .navSection.mobile.globalPopupActive .popupContainer {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
    pointer-events: auto
}

.globalNav .popup a {
    display: block
}

.globalNav .popupCloseButton {
    position: absolute;
    right: 0;
    top: 0;
    width: 51px;
    height: 51px;
    font-size: 0;
    cursor: pointer
}

.globalNav .popupCloseButton:after,
.globalNav .popupCloseButton:before {
    content: '';
    position: absolute;
    background: #0328d2;
    border-radius: 1px;
    left: 14px;
    right: 14px;
    top: 30px;
    height: 3px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: background .1s;
    transition: background .1s
}

.globalNav .popupCloseButton:after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.globalNav .popupCloseButton:hover:after,
.globalNav .popupCloseButton:hover:before {
    background: #0328d2
}

.globalNav .mobileSignIn {
    background: #0328d2;
    display: block;
    padding: 12px 30px;
    font-weight: 700;
    text-align: center;
    color: #fff;
    text-transform: uppercase
}

.globalNav .mobileSignIn:hover {
    background: #aac8ff
}

.globalNav .mobileSignIn:after {
    font: 400 16px StripeIcons;
    content: '\279C';
    margin-left: 6px
}

.globalNav .mobileProducts {
    padding: 20px 0 15px
}

.globalNav .mobileProducts h4 {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .025em;
    color: #8898aa;
    text-transform: uppercase;
    margin: -5px 0 0 30px
}

.globalNav .mobileProductsList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.globalNav .mobileProductsList>ul {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.globalNav .mobileProductsList>ul:last-child {
    -webkit-box-flex: 3;
    -ms-flex-positive: 3;
    flex-grow: 3
}

.globalNav .mobileProductsList a {
    padding: 0 30px;
    font-size: 20px;
    font-weight: 500;
    line-height: 50px
}

.globalNav .mobileProductsList a:hover {
    color: #0328d2
}

.globalNav .mobileProductsList a svg {
    display: inline-block;
    width: 26px;
    height: 26px;
    margin: 0 15px 0 -3px;
    vertical-align: -5px
}

.globalNav .mobileProductsList .item-subscriptions {
    color: #24b47e
}

.globalNav .mobileProductsList .item-connect {
    color: #3297d3
}

.globalNav .mobileProductsList .item-relay {
    color: #e25950
}

.globalNav .mobileProductsList .item-atlas {
    color: #e39f48
}

.globalNav .mobileProductsList .item-radar {
    color: #b76ac4
}

.globalNav .mobileSecondaryNav {
    border-top: 2px solid #f6f9fc;
    padding: 15px 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.globalNav .mobileSecondaryNav>ul {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.globalNav .mobileSecondaryNav>ul:last-child {
    -webkit-box-flex: 3;
    -ms-flex-positive: 3;
    flex-grow: 3
}

.globalNav .mobileSecondaryNav a {
    padding: 0 20px;
    min-width: 100px
}

.globalFooter {
    font--webkit-font-smoothing: antialiased;
    background: #f6f9fc;
    position: relative
}

.globalFooter.withCards {
    background: 0 0;
    overflow: hidden;
    padding-top: 500px;
    margin-top: -480px;
    pointer-events: none
}

.globalFooter.withCards>* {
    pointer-events: auto;
    position: relative
}

.globalFooter.withCards:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 600px;
    height: 2000px;
    background: #f6f9fc;
    -webkit-transform: skew(0, -12deg);
    transform: skew(0, -12deg)
}

.globalFooterCards .container-xl {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -15px auto;
    padding: 0 5px
}

.globalFooterCards .container-xl,
a.globalFooterCard,
div.globalFooterCard {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

a.globalFooterCard,
div.globalFooterCard {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
    margin: 15px;
    z-index: 501;
    position: relative;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    padding: 40px 40px 40px 120px;
    background-color: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 15px 35px rgba(50, 50, 93, .1), 0 5px 15px rgba(0, 0, 0, .07);
    box-shadow: 0 15px 35px rgba(50, 50, 93, .1), 0 5px 15px rgba(0, 0, 0, .07);
    -webkit-transition-property: color, background-color, -webkit-box-shadow, -webkit-transform;
    transition-property: color, background-color, -webkit-box-shadow, -webkit-transform;
    transition-property: color, background-color, box-shadow, transform;
    transition-property: color, background-color, box-shadow, transform, -webkit-box-shadow, -webkit-transform;
    transition-property: color, background-color, box-shadow, transform, -webkit-transform;
    -webkit-transition-duration: .15s;
    transition-duration: .15s
}

a.globalFooterCard:after,
div.globalFooterCard:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #aab7c4;
    pointer-events: none;
    opacity: 0;
    -webkit-transition: opacity .15s;
    transition: opacity .15s
}

a.globalFooterCard:hover,
div.globalFooterCard:hover {
    color: #0328D2!important;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
    -webkit-box-shadow: 0 18px 35px rgba(50, 50, 93, .1), 0 8px 15px rgba(0, 0, 0, .07);
    box-shadow: 0 18px 35px rgba(50, 50, 93, .1), 0 8px 15px rgba(0, 0, 0, .07)
}

a.globalFooterCard:active,
div.globalFooterCard:active {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
    -webkit-box-shadow: 0 11px 20px rgba(50, 50, 93, .1), 0 6px 11px rgba(0, 0, 0, .08);
    box-shadow: 0 11px 20px rgba(50, 50, 93, .1), 0 6px 11px rgba(0, 0, 0, .08)
}

a.globalFooterCard:active:after,
div.globalFooterCard:active:after {
    opacity: .15
}

a.globalFooterCard img,
a.globalFooterCard svg,
div.globalFooterCard img,
div.globalFooterCard svg {
    position: absolute;
    width: 130px;
    height: 130px;
    left: -35px;
    top: calc(50% - 65px)
}

@media (min-width:991px) {
    a.globalFooterCard,
    div.globalFooterCard {
        -ms-flex-preferred-size: 1%;
        flex-basis: 1%;
        padding-left: 100px
    }
    a.globalFooterCard img,
    a.globalFooterCard svg,
    div.globalFooterCard img,
    div.globalFooterCard svg {
        left: -50px
    }
    .globalFooterCTA .container-lg {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }
}

@media (min-width:880px) {
    a.globalFooterCard,
    div.globalFooterCard {
        padding-left: 120px
    }
    a.globalFooterCard img,
    a.globalFooterCard svg,
    div.globalFooterCard img,
    div.globalFooterCard svg {
        left: -35px
    }
}

a.globalFooterCard svg .hover-fillDark,
a.globalFooterCard svg .hover-fillLight,
div.globalFooterCard svg .hover-fillDark,
div.globalFooterCard svg .hover-fillLight {
    -webkit-transition: fill .15s;
    transition: fill .15s
}

a.globalFooterCard svg .hover-strokeDark,
a.globalFooterCard svg .hover-strokeLight,
div.globalFooterCard svg .hover-strokeDark,
div.globalFooterCard svg .hover-strokeLight {
    -webkit-transition: stroke .15s;
    transition: stroke .15s
}

a.globalFooterCard h2,
div.globalFooterCard h2 {
    margin: 0 0 5px;
    white-space: normal
}

a.globalFooterCard p,
div.globalFooterCard p {
    margin: 5px 0 0
}

a.globalFooterCard.card-pricing,
div.globalFooterCard.card-pricing {
    color: #24b47e
}

a.globalFooterCard.card-documentation,
div.globalFooterCard.card-documentation {
    color: #b76ac4
}

a.globalFooterCard.card-subscriptions,
div.globalFooterCard.card-subscriptions {
    color: #24b47e
}

a.globalFooterCard.card-connect,
div.globalFooterCard.card-connect {
    color: #3297d3
}

a.globalFooterCard.card-relay,
div.globalFooterCard.card-relay {
    color: #e25950
}

a.globalFooterCard.card-atlas,
div.globalFooterCard.card-atlas {
    color: #e39f48
}

a.globalFooterCard.card-radar,
div.globalFooterCard.card-radar {
    color: #b76ac4
}

.globalFooterCTA {
    padding: 50px 0;
    border-bottom: 2px solid rgba(207, 215, 223, .25)
}

.globalFooterCTA .buttons,
.globalFooterCTA .content {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 50%;
    flex: 1 0 50%
}

.globalFooterCTA .title {
    font-weight: 400;
    font-size: 30px;
    line-height: 45px;
    color: #0328d2;
    margin: .75em 0
}

.globalFooterCTA .subtitle {
    font-weight: 300;
    color: #0328d2;
    display: block
}

@media (min-width:991px) {
    .globalFooterCTA .common-ButtonGroup {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end
    }
}

.globalFooterNav {
    padding: 65px 0 55px;
    color: #8898aa;
    line-height: 30px;
    font-size: 15px;
    white-space: nowrap
}

.globalFooterNav ul {
    padding: 0;
    margin: 0
}

.globalFooterNav .container-lg {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media (min-width:880px) {
    .globalFooterNav .container-lg {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
}

.globalFooterNav a {
    color: inherit;
    -webkit-transition: color .1s;
    transition: color .1s
}

.globalFooterNav .metaNav .rootLink:hover,
.globalFooterNav .metaNav .select.globalPopupActive .rootLink,
.globalFooterNav a:hover {
    color: #0328d2
}

.globalFooterNav .metaNav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-flex: 2;
    -ms-flex-positive: 2;
    flex-grow: 2;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    margin-bottom: 20px
}

@media (min-width:880px) {
    .globalFooterNav .metaNav {
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        margin: 0 0 20px
    }
}

.globalFooterNav .metaNav>li {
    margin-right: 20px
}

.globalFooterNav .metaNav .select {
    position: relative;
    -webkit-perspective: 2000px;
    perspective: 2000px;
    z-index: 501
}

.globalFooterNav .metaNav .rootLink {
    color: #0328d2;
    font-weight: 600;
    cursor: pointer
}

.globalFooterNav .metaNav .rootLink svg {
    display: inline-block;
    vertical-align: -1px;
    margin: 0 7px 0 -2px
}

.globalFooterNav .metaNav .rootLink svg path {
    fill: currentColor
}

.globalFooterNav .metaNav .space {
    -webkit-box-flex: 2;
    -ms-flex-positive: 2;
    flex-grow: 2
}

.globalFooterNav .metaNav .copyright {
    margin-right: 0;
    color: #cfd7df
}

.globalFooterNav .siteNav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media (min-width:991px) {
    .globalFooterNav .siteNav {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
}

@media (min-width:880px) {
    .globalFooterNav .metaNav .country {
        margin-bottom: 5px
    }
    .globalFooterNav .siteNav {
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        flex-grow: 0
    }
}

.globalFooterNav .siteNav .column {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    margin-bottom: 20px
}

@media (min-width:991px) {
    .globalFooterNav .siteNav .column {
        -ms-flex-preferred-size: auto!important;
        flex-basis: auto!important;
        margin-right: 40px
    }
}

@media (min-width:880px) {
    .globalFooterNav .siteNav .column {
        margin-right: 30px
    }
}

@media (min-width:1040px) {
    .globalFooterNav .siteNav .column {
        margin-right: 40px
    }
}

.globalFooterNav .siteNav .column:last-child {
    margin-right: 0
}

.globalFooterNav .siteNav .splitColumn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.globalFooterNav .siteNav li {
    margin-right: 40px
}

.globalFooterNav .siteNav .column:last-child li {
    margin-right: 0
}

.globalFooterNav .siteNav h4 {
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .025em;
    margin: 0 0 5px
}

.globalFooterNav .siteNav strong {
    font-weight: 500
}

.globalFooterNav .popup {
    position: absolute;
    bottom: 40px;
    left: -5px;
    z-index: 1000;
    font-size: 15px;
    line-height: 26px;
    background: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1);
    box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1);
    pointer-events: none;
    -webkit-transform: rotate3d(1, 1, 0, 15deg);
    transform: rotate3d(1, 1, 0, 15deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
    will-change: transform, opacity;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transition-duration: .25s;
    transition-duration: .25s
}

@media (min-width:1160px) {
    .globalFooterNav .popup {
        left: -65px
    }
}

.globalFooterNav .popup:before {
    content: '';
    position: absolute;
    bottom: -6px;
    left: 30px;
    width: 20px;
    height: 20px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    border-radius: 20px 0 3px;
    background: #fff
}

@media (min-width:1160px) {
    .globalFooterNav .popup:before {
        left: 60px
    }
}

.globalFooterNav .globalPopupActive .popup {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
    pointer-events: auto
}

.globalFooterNav .optionList {
    color: #525f7f;
    white-space: nowrap
}

.globalFooterNav .optionList a {
    border-radius: 4px;
    display: block;
    line-height: 36px;
    padding: 0 15px;
    -webkit-transition: color .1s, background-color .1s;
    transition: color .1s, background-color .1s
}

.globalFooterNav .optionList a:hover {
    background-color: #f6f9fc;
    color: #0328d2
}

.globalFooterNav .optionList a:active {
    background-color: #e6ebf1
}

.globalFooterNav .optionList .selected {
    font-weight: 600;
    color: #0328d2
}

.globalFooterNav .optionList .selected>span:before {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    vertical-align: -2px;
    margin: 0 6px 0 -2px;
}

.globalFooterNav .badge {
    font-size: 10px;
    line-height: 10px;
    color: #aab7c4;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .025em;
    font-style: normal;
    padding: 2px 3px 1px;
    border-radius: 4px;
    border: 1px solid #e6ebf1;
    display: inline-block;
    vertical-align: 1px;
    margin-left: 8px
}

.globalFooterNav .languagePicker {
    padding: 10px 5px
}

.globalFooterNav .countryPicker {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.globalFooterNav .countryPicker:before {
    background: #f6f9fc
}

@media (min-width:991px) {
    .globalFooterNav .countryPicker {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
    .globalFooterNav .countryPicker:before {
        background: #fff
    }
}

.globalFooterNav .countryList,
.globalFooterNav .sidebar {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal
}

.globalFooterNav .columns,
.globalFooterNav .sidebar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.globalFooterNav .sidebar {
    background: #f6f9fc;
    border-radius: 0 0 5px 5px;
    overflow: hidden;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column
}

@media (min-width:991px) {
    .globalFooterNav .sidebar {
        border-radius: 0 5px 5px 0
    }
}

.globalFooterNav .sidebar .optionList a:hover {
    background-color: rgba(230, 235, 241, .5)
}

.globalFooterNav .sidebar .optionList a:active {
    background-color: rgba(207, 215, 223, .5)
}

.globalFooterNav .countryList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    padding: 25px;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: calc(100vw - 40px);
    overflow: auto;
    -webkit-overflow-scrolling: touch
}

.globalFooterNav .countryList h4 {
    margin: 0 0 5px
}

.globalFooterNav .countryList h4 a {
    line-height: 36px;
    padding: 0 15px;
    text-transform: uppercase;
    color: #0328d2;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .025em
}

.globalFooterNav .countryList h4 a:hover {
    color: #0328d2
}

.globalFooterNav .countryList h4 a:after {
    font: 400 16px StripeIcons;
    content: '\2192';
    margin-left: 6px
}

.globalFooterNav .globalLink {
    border-top: 2px solid #fff;
    padding: 30px 40px
}

.globalFooterNav .globalLink:hover {
    color: #424770
}

.globalFooterNav .globalLink:hover strong {
    color: #0328d2
}

.globalFooterNav .globalLink strong {
    display: block;
    color: #0328d2;
    font-weight: 500;
    -webkit-transition: color .1s;
    transition: color .1s
}

.globalFooterNav .globalLink strong:after {
    font: 400 16px StripeIcons;
    content: '\2192';
    margin-left: 6px
}

.header.scrolled.globalNav .navSection.primary .rootLink {
    color: #333
}

.globalNav .industryLinkContent {
    -ms-flex: 1;
    -webkit-box-flex: 1;
    flex: 1;
    margin-left: 15px;
    white-space: nowrap
}

.globalNav .linkTitle {
    display: inline;
    font-weight: 400
}

.globalNav .indsubGroup .linkSub {
    margin: 0 0 0 10px
}

.blur {
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px)
}

.menu-modal-wrapper {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, .96);
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
    border-radius: 10px
}

.menu-modal-wrapper.open {
    opacity: 1;
    visibility: visible
}

.menu-modal-wrapper.open .modal {
    display: block;
    opacity: 1
}

.menu-modal-wrapper .content .trendingtechnologies-list li:hover:before {
    color: #0328d2
}

.menu-modal-wrapper .content .trendingtechnologies-list li:before {
    content: "\f105";
    width: 30px;
    height: 40px;
    font-family: FontAwesome;
    margin-right: 5px;
    font-size: 13px;
    color: #484949
}

.menu-modal-wrapper .content .trendingtechnologies-list li a {
    font-size: 16px!important
}

.menu-modal-wrapper .content .trendingtechnologies-list li {
    margin-top: 10px;
    width: 50%;
    float: left
}

.menu-modal-wrapper .content {
    padding: 30px
}

.menu-modal-wrapper .btn-close {
    width: 32px;
    height: 32px;
    display: block;
    float: right;
    position: absolute;
    right: 0;
    top: 15px;
    font-size: 17px;
    color: #333
}

.services-section-two {
    position: relative;
    padding: 50px 0 20px;
    background: #f2f2f2
}

.services-section-two .inner-box .head img {
    height: 50px;
    width: 50px;
    -o-object-fit: contain;
    object-fit: contain
}

.services-section-two .inner-box .head a {
    font-weight: 700;
    color: #333;
    margin-top: 10px
}

.services-section-two .inner-box h4 {
    font-weight: 700
}

.services-section-two .title-column {
    position: relative;
    margin-bottom: 40px
}

.services-section-two .title-column .inner-column {
    position: relative
}

.services-section-two .title-column .inner-column p {
    font-weight: 300;
    text-align: left
}

.services-section-two .title-column .inner-column h2 {
    position: relative;
    font-size: 40px;
    color: #222;
    font-weight: 700;
    line-height: 1.4em
}

.services-block {
    position: relative;
    margin-bottom: 30px
}

.services-block .inner-box {
    position: relative;
    background: #fff;
    padding: 30px 15px;
    min-height: 230px;
    border-radius: 5px
}

.services-block .inner-box .icon-box,
.services-section-two .inner-box i {
    position: relative;
    font-size: 50px;
    line-height: 1em;
    color: #333;
    margin-bottom: 20px;
    transition: all .5s ease;
    -webkit-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease
}

.services-block .inner-box h3 {
    position: relative;
    color: #222;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3em;
    margin-bottom: 15px
}

.services-block .inner-box h3 a {
    position: relative;
    color: #222;
    transition: all .5s ease;
    -webkit-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    font-weight: 700
}

.services-block .inner-box:hover .icon-box {
    color: #222
}

.services-block .inner-box:hover h3 a {
    color: #538be7
}

.services-block .inner-box .text {
    position: relative;
    color: #333;
    font-size: 14px;
    line-height: 1.8em;
    font-weight: 300
}

.white-intro-txt h2 {
    font-weight: 800
}

.nsf-fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}

.animated3 {
    -webkit-animation-duration: 1.1s;
    animation-duration: 1.1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.animated2,
.animated3 {
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both
}

.webdevelopment_re {
    padding: 50px 0
}

.webdevelopment_re .webdevelopment_sidebar {
    border-left: 1px solid #dedede;
    list-style: none;
    padding-left: 20px
}

.webdevelopment_re .webdevelopment_sidebar li {
    margin-bottom: 30px;
    width: 100%;
    font-size: 14px;
    font-weight: 500
}

.webdevelopment_re .webdevelopment_sidebar li a {
    font-size: 14px;
    font-weight: 500;
    color: #333
}

.webdevelopment_re .webdevelopment_sidebar li i {
    font-size: 26px;
    line-height: 0;
    color: #077af4;
    margin-right: 10px
}

.webdevelopment_re .webdevelopment_sidebar li:hover a {
    color: #077af4
}

.webdevelopment_re .webdevelopment_sidebar li img {
    height: 25px;
    margin-right: 10px
}

#features-about .table-price {
    margin-top: 30px
}

#features-about .lead {
    color: #fff;
    font-weight: 300;
    font-size: 16px;
    width: 80%;
    margin: 0 auto;
    padding-top: 30px;
    line-height: 1.8;
    opacity: .7
}

#features-about .content-table ul li h5 {
    color: #fff;
    text-transform: capitalize;
    margin-top: 15px
}

.content-table ul li img {
    border: 3px solid #fff;
    border-radius: 18px;
    width: 80px;
    height: 80px;
    -o-object-fit: contain;
    object-fit: contain
}

.content-table ul li a h5:after {
    content: "";
    height: 2px;
    width: 50px;
    background: #fff;
    position: absolute;
    z-index: 3;
    bottom: 5px;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 50px
}

.content-table ul.custom_list li {
    width: 12%
}

.content-table ul li:hover img {
    -webkit-box-shadow: 0 0 52px -10px #c1c1c1;
    box-shadow: 0 0 52px -10px #c1c1c1
}

body .nsf_fbox {
    background: #fff
}

body .nsf_fbox .special {
    text-align: center
}

body .nsf_fbox .section {
    height: auto;
    padding: 2rem;
    background: #fff;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    cursor: pointer;
    will-change: transform
}

body .nsf_fbox .section:nth-child(2n-1) {
    border-right: solid 2px #e5e5e5
}

body .nsf_fbox.section:hover {
    -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23);
    box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23);
    -webkit-transform: translate(0, -15px);
    transform: translate(0, -15px);
    border-radius: 2px;
    z-index: 1
}

body .nsf_fbox .section p {
    margin-top: 2rem;
    text-align: justify
}

body .nsf_fbox .section:hover {
    background: #2f62e0;
    color: #fff
}

body .nsf_fbox .section:hover p {
    color: #fff
}

body .nsf_fbox .section i {
    font-size: 50px
}

body .nsf_fbox .section img {
    max-width: 20%
}

body .nsf_fbox .section h4 {
    margin-top: 2rem
}

body .nsf_fbox .fourth,
body .nsf_fbox .third {
    border-top: solid 2px #e5e5e5
}

@media (max-width:990px) {
    body .nsf_fbox .features-row .section {
        border: 0
    }
    body .nsf_fbox .features-row .section:nth-child(2n-2),
    body .nsf_fbox .features-row .third {
        border-top: solid 2px #e5e5e5
    }
}

.MobileApplicationDevelopment {
    padding: 50px 0
}

.MobileApplicationDevelopment img {
    margin: 60px auto 0;
    width: 280px
}

.MobileApplicationDevelopment ul.en-list>li {
    padding: 6px 12px;
    margin: 5px 0 2px 2em
}

#features-about .content-table .circle-btn {
    padding: 15px 30px;
    margin-top: 40px;
    text-transform: uppercase
}

.powered-list ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.powered-list ul li {
    display: inline-block;
    width: 17%;
    padding: 10px;
    vertical-align: top;
    margin: 0 14px
}

.powered-list ul li img {
    -webkit-filter: saturate(2);
    filter: saturate(2);
    height: 60px
}

.powered-list ul li .powered-name {
    color: #333;
    font-size: 14px;
    margin-top: 10px
}

.br_15 {
    border-radius: 35px
}

.solutions_top_s+.clearfix .row .col-md-3 {
    padding: 5px
}

body.mobile-application-development-services .MobileApplicationDevelopment h3 {
    font-size: 40px;
    font-weight: 700
}

.globalNav a {
    font-size: 18px
}

.mt-35 {
    margin-top: 35px
}

.padding-tb-30 {
    padding: 40px 0!important
}

.input-selectbtn label {
    color: #cee9ff;
    font-weight: 300
}

.input-selectbtn.select-wrapper:after {
    color: #fff
}

.input-selectbtn.select-wrapper select {
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    background-image: none;
    background-repeat: no-repeat;
    background-color: transparent;
    -webkit-appearance: none;
    outline: 0
}

.nsf-slide .slider-form .input-selectbtn.select-wrapper [include*="form-input-select()"] select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: 0 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    border: 1px solid transparent;
    font-size: 16px;
    outline: 0
}

.nsf-slide .input-selectbtn .wpcf7-form-control {
    padding-left: 0!important
}

.input-selectbtn label.error {
    font-size: 15px!important;
    text-align: right;
    width: 100%;
    position: absolute;
    right: 0
}

body.modal-open {
    padding: 0!important;
    overflow-x: hidden
}

.portfolio_modal {
    height: 100%;
    width: 100%;
    background: #0a1f6c;
    z-index: 999999999999;
    padding-right: 0!important
}

.portfolio_modal .bg-test {
    opacity: .2;
    position: fixed
}

.portfolio_modal .modal-dialog {
    margin: 0;
    width: 100%
}

.portfolio_modal .close {
    width: 40px;
    height: 40px;
    border-radius: 50px;
    opacity: .7;
    color: #fff;
    border: 3px solid transparent;
    position: relative;
    top: 2px
}

.portfolio_modal .close:hover {
    background: rgba(255, 255, 255, .43);
    color: #fff;
    border: 3px solid #f9f9f9
}

.portfolio_modal .companylogo {
    width: 110px
}

.portfolio_modal .modal-header {
    border-bottom-color: rgba(255, 255, 255, .19)
}

.portfolio_modal .pra-arrow {
    font-size: 240px;
    position: absolute;
    line-height: 0;
    z-index: -9;
    opacity: .2
}

.portfolio_modal .pra-rightarrow {
    right: -82px;
    bottom: 86px;
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg)
}

.portfolio_modal .pop_container {
    max-width: 840px;
    margin: 0 auto;
    text-align: center;
    color: #fff
}

.portfolio_modal .project-title {
    margin-top: 80px;
    font-weight: 800;
    font-size: 50px;
    color: #fff;
    text-transform: uppercase
}

.portfolio_modal .project-title h4.category {
    text-transform: uppercase;
    font-weight: 700
}

.portfolio_modal .Client_Testimonials p,
.portfolio_modal .main-text,
.portfolio_modal .project-overview+p {
    font-size: 22px;
    color: #fff;
    opacity: .7;
    line-height: 1.9
}

.portfolio_modal .category {
    text-transform: uppercase
}

.portfolio_modal .second_logo {
    margin: 10px 0;
    opacity: .3;
    -webkit-filter: invert(3);
    filter: invert(3)
}

.portfolio_modal .top_key {
    list-style: none;
    margin-bottom: 50px;
    padding: 0
}

.portfolio_modal .top_key li {
    display: inline-block;
    position: relative;
    text-transform: uppercase;
    font-size: 14px;
    color: #fff;
    letter-spacing: .2px;
    background: 0 0;
    border: 1px solid rgba(255, 255, 255, .2);
    height: auto;
    border-radius: 100px;
    -moz-border-radius: 100px;
    -webkit-border-radius: 110px;
    padding: 11px 33px 10px 15px;
    margin: 5px 7px
}

.portfolio_modal .top_key li:before {
    content: '';
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 100%;
    border: 1px solid #fff;
    top: 18px;
    right: 18px
}

.portfolio_modal .enquiry-form {
    text-align: left
}

.portfolio_modal .material-form .input-block {
    border-bottom: 2px solid rgba(255, 255, 255, .2)
}

.portfolio_modal .material-form {
    width: 70%;
    margin: 0 auto
}

.portfolio_modal .r_quote h2 {
    font-size: 30px;
    text-transform: uppercase;
    font-weight: 900
}

.portfolio_modal .r_quote h3 {
    font-size: 20px
}

.portfolio_modal .r_quote .second_logo {
    margin: 40px 0 0
}

.portfolio_modal .material-form .input-block.fileupload {
    border-bottom: none
}

.portfolio_modal .material-form .input-block {
    margin-bottom: 25px
}

.portfolio_modal .Client_Testimonials {
    position: relative;
    padding: 30px 0;
    margin: 30px 0
}

.portfolio_modal .Client_Testimonials .pra-leftarrow {
    left: 0
}

.portfolio_modal .project_logo {
    background: #fff;
    width: 120px;
    height: 120px;
    -o-object-fit: contain;
    object-fit: contain;
    border-radius: 50%;
    margin: 30px 0 0
}

.portfolio_modal .platform-names .item-img {
    min-height: 110px
}

.portfolio_modal .platform-names a {
    color: #fff
}

.Client_Testimonials h4,
.portfolio_modal .project-overview {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 30px;
    color: #fff
}

.portfolio_modal .material-form p {
    width: 100%
}

.portfolio_modal .client_n {
    font-weight: 700;
    color: #fff;
    text-transform: uppercase
}

.portfolio_modal .r_quote {
    margin-top: 60px
}

.portfolio_modal .platform-names {
    margin: 30px 0
}

.portfolio_modal .platform-names li {
    border: 1px solid rgba(255, 255, 255, .09);
    padding: 20px;
    display: inline-block;
    width: 32%
}

.portfolio_modal .platform-names li:hover {
    background: rgba(255, 255, 255, .09)
}

.portfolio_modal ul.platform-names {
    padding: 0;
    margin-top: 60px;
    list-style: none
}

#urbanallstars.portfolio_modal {
    background: #000
}

#podpop.portfolio_modal {
    background: #ce8f13
}

#azitpop.portfolio_modal {
    background: #ad0404
}

#colorday.portfolio_modal {
    background: #a50e2e
}

#Zonaviviendas.portfolio_modal {
    background: #7a0b17
}

#Genius-Kidz.portfolio_modal {
    background: #82b244
}

#Roommateswithkids.portfolio_modal {
    background: #146cc6
}

#Zezign.portfolio_modal {
    background: #000
}

#lingoo-ninja.portfolio_modal {
    background: #ff6d05
}

#Excurza.portfolio_modal {
    background: #0096ce
}

.review_row .box_s .name_e {
    position: absolute;
    width: 60px;
    border-radius: 50%;
    height: 60px;
    top: -49px;
    border: 5px solid #ccc;
    background: #fff;
    text-align: center;
    font-weight: 900;
    text-transform: uppercase;
    line-height: 50px;
    left: -50px
}

.review_row:nth-child(2n+1) .box_s .name_e {
    left: auto;
    right: -50px
}

.review_row .box_s img {
    -o-object-fit: cover;
    object-fit: cover
}

.projects-bg .slick-initialized .slick-slide {
    padding: 5px
}

body.nsf-soft #header {
    z-index: 9999999999999
}

.partner_full_img {
    padding: 40px 0;
    text-align: center
}

.partner_full_img p {
    font-size: 20px
}

.partner_full_img img {
    width: 60%
}

.servicesGroup li {
    display: inline-block;
    width: 32%
}

.servicesGroup li:last-child {
    text-align: right;
    position: relative;
    left: -30px
}

#cookie h2,
.blog_page .box,
.contactformwrap.get-quote .forminputbx h2,
.livedemo_s .col-md-12 .nav-tabs,
.mobile .media-body-2,
.single_industry_sec li,
.single_industry_sec li a {
    text-align: center
}

.linkGroup.linkList.servicesGroup {
    background: #e7eef6
}

.single_industry_sec li {
    display: inline-block;
    width: 25%;
    float: left;
    padding: 0;
    border: 1px solid #fff;
    margin: 0;
    background: #f2f2f2;
    position: relative;
    -webkit-transition: all .3s!important;
    transition: all .3s!important
}

.single_industry_sec figure {
    overflow: hidden;
    display: inline
}

.single_industry_sec .in_list {
    padding: 0
}

.single_industry_sec li a {
    color: #fff;
    font-weight: 500;
    z-index: 9;
    font-size: 20px
}

.single_industry_sec li i {
    display: block;
    font-size: 40px;
    color: #fff;
    margin: 0 auto 10px;
    border-radius: 50px;
    position: relative
}

.single_industry_sec li:hover,
.single_industry_sec li:hover a {
    color: #fff
}

.single_industry_sec li i:after {
    width: 50px;
    background: #fff;
    -webkit-transition: .3s;
    transition: .3s;
    content: "";
    position: absolute;
    height: 2px;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 0;
    top: auto
}

.single_industry_sec li:hover i:after {
    width: 110px;
    height: 1px
}

.single_industry_sec li:after {
    width: 100%;
    background: #000;
    content: "";
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    opacity: .7
}

.single_industry_sec {
    list-style: none;
    display: inline-block;
    width: 100%
}

.globalNav .linkGroup.linkList.servicesGroup {
    padding-bottom: 0;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px
}

.lg-hide {
    display: none
}

.single_industry_sec li div {
    overflow: hidden
}

.single_industry_sec li img {
    -webkit-transition: .3s;
    transition: .3s;
    width: 100%;
    height: 290px;
    -o-object-fit: cover;
    object-fit: cover
}

.single_industry_sec li a {
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    height: 100%;
    padding-top: 80px
}

.single_industry_sec li:hover img {
    -webkit-transform: scale(1.3);
    transform: scale(1.3)
}

.single_industry_sec li:hover:after {
    background: #00369d
}

.enq-jombotron .popup-content .close-ic {
    border: 1px solid #fff;
    text-align: center;
    width: 33px;
    height: 33px;
    line-height: 12px;
    border-radius: 40px;
    float: right;
    position: absolute;
    top: 64px;
    right: 20px;
}

.enq-jombotron .popup-content .close-ic:hover {
    background: #fff
}

.enq-jombotron .popup-content .close-ic i {
    top: 0;
    margin-left: 0
}

.contactformwrap.get-quote .minp {
    width: 730px
}

.contactformwrap.get-quote .formsection .formbx {
    width: 100%
}

.contactformwrap.get-quote .formsection {
    margin-top: 40px;
    margin-bottom: 60px
}

.contactformwrap.get-quote {
    background-color: #052156
}

body.get-quote .main-form.this_footer {
    display: none!important
}

.circle-btn .glyphicon {
    font-size: 10px
}

.circle_mobile_box {
    background: #162139;
    padding: 120px 0
}

.section_1.mobile,
.section_2.mobile,
.section_3.mobile {
    padding: 60px 0
}

.mobile .why-media h3 {
    font-size: 40px;
    color: #0c59e5;
    font-weight: 300
}

.mobile .media-body-2 .icon_list ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.mobile .media-body-2 .icon_list ul li {
    min-height: 160px;
    border-right: 1px solid #c1c1c1;
    display: inline-block;
    float: left;
    width: 25%;
    padding: 0 10px
}

.mobile .media-body-2 .icon_list ul li:last-child {
    border-right: none
}

.mobile .media-body-2 .icon_list ul li span {
    width: 50px;
    height: 50px;
    border-radius: 100%;
    background: #fff;
    color: #0328d2;
    border: 1px solid #dcdcdc;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 9;
    -webkit-transition: .3s;
    transition: .3s;
    line-height: 50px;
    font-size: 30px
}

.mobile .media-body-2 .icon_list ul li:hover span {
    background: #0328d2;
    color: #fff;
    border-color: transparent
}

.mobile .media-body-2 .icon_list ul li p {
    margin-top: 15px;
    font-size: 14px
}

.mobile .media-body-2 .icon_list ul li .media-heading {
    margin: 10px 0 0;
    font-size: 20px;
    font-weight: 300
}

.mobile .media-body-2 {
    display: inline-block;
    padding: 30px 0 0;
    border-radius: 10px;
    margin-top: 30px
}

#Zonaviviendas.portfolio_modal label.error,
#azitpop.portfolio_modal label.error,
#colorday label.error {
    color: #fff!important
}

.sidebar-contact .select-wrapper select {
    padding: 10px 0;
    width: 100%;
    font-size: 16px;
    font-weight: 500
}

.sidebar-contact .input-selectbtn.select-wrapper:after {
    top: 8px;
    color: #333
}

.sidebar-contact .input-selectbtn.select-wrapper {
    border-bottom: 1px solid rgba(111, 106, 106, .24);
    margin-bottom: 10px
}

.blog_page .blog-title {
    font-size: 16px;
    color: #000;
    font-weight: 700;
    margin: 0;
    line-height: 1.8
}

.blog_page .box {
    background: #fff;
    width: 95%;
    margin: -10px auto 0;
    position: relative;
    padding: 10px 10px 15px;
    border-radius: 3px;
    -webkit-box-shadow: 0 2px 3px #d0d0d0;
    box-shadow: 0 2px 3px #d0d0d0;
    line-height: 1.5
}

.blog_page .box .readmore {
    -webkit-box-shadow: 0 -38px 58px 40px #fff;
    box-shadow: 0 -38px 58px 40px #fff;
    padding: 10px;
    font-size: 12px;
    margin-top: 0;
    display: inline-block;
    width: 100%;
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
    background: #077af4;
    -webkit-transition: .2s;
    transition: .2s;
    position: absolute;
    bottom: 0;
    left: 0
}

.blog_page .box .readmore i {
    -webkit-transition: .3s;
    transition: .3s
}

.blog_page .box .readmore:hover i {
    -webkit-transform: translateX(10px);
    transform: translateX(10px)
}

.blog_page .box .readmore:hover {
    background: #f2f2f2;
    color: #333
}

.blog_page div .lazy {
    height: 180px;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.blog_page .col-md-4 {
    overflow: hidden;
    padding: 5px
}

.servicewrap .home-services .web_know {
    font-weight: 700;
    font-size: 14px;
    color: #333;
    -webkit-transition: all .3s;
    transition: all .3s;
    display: inline-block;
    position: absolute;
    bottom: 20px;
    margin: 0;
    left: 0;
    right: 0
}

body.web-development-services .servicewrap .home-services {
    padding-bottom: 40px
}

body.web-development-services .servicewrap .home-services:after {
    display: none
}

.servicewrap .home-services .web_know i {
    font-size: 16px;
    margin-left: 5px;
    color: #333
}

.servicewrap .home-services .web_know:hover,
.servicewrap .home-services .web_know:hover i {
    color: #0328d2
}

.case-study-pod-luxury .quote-right p,
.color-day-festival .quote-right p,
.enq-jombotron div.wpcf7-response-output {
    color: #fff
}

.blog_page .box p {
    overflow: hidden;
    margin: 0;
    text-overflow: ellipsis;
    font-size: 14px;
    white-space: unset
}

#cookie h2 {
    margin: 0
}

#cookie h2 img {
    width: 50px
}

.this_footer .contact-wrap label.error {
    font-size: 14px;
    top: 5px
}

form .phone_number_en .intl-tel-input {
    width: 100%;
    margin: 12px 0
}

form .phone_number_en label.error {
    top: 0
}

form .phone_number_en .intl-tel-input .form-control {
    padding: 10px
}

.intl-tel-input .flag-container {
    z-index: 9
}

.footer_address {
    padding: 0;
    width: 100%;
    display: inline-block
}

.locationbox .addtxtboxs span {
    top: 50%;
    -webkit-transform: translatey(-50%);
    transform: translatey(-50%)
}

.globalNav .linkContainer {
    padding: 5px 0
}

.flowchart .top-heading {
    margin-bottom: 40px
}

.flowchart .content-block {
    margin-bottom: 20px;
    position: relative;
    z-index: 1;
    height: 250px
}

.flowchart .content-block .hidden-content {
    height: 60px;
    overflow: hidden;
    margin-bottom: 40px;
    -webkit-transition: all .5s;
    transition: all .5s
}

.content-block h4 {
    text-transform: capitalize
}

.content-block .hidden-content p {
    opacity: 0
}

.flowchart .content-block:hover .hidden-content {
    position: absolute;
    background-color: #c5d7f9;
    width: 100%;
    left: 0;
    top: 0;
    height: 100%;
    z-index: 2;
    padding: 50px 15px 15px;
    -webkit-box-shadow: 0 0 5px #ccc;
    box-shadow: 0 0 5px #ccc
}

.flowchart .content-block:hover .hidden-content p {
    opacity: 1
}

.flowchart .content-block:hover .driverproc span.badge {
    top: 10px
}

.ex {
    clear: both;
    margin-bottom: 50px
}

.blog_page {
    padding-top: 40px
}

.livedemo_s {
    background-color: #f9fafc;
    margin-top: 40px
}

.container .livedemo_s {
    background-color: #fff;
    margin-top: 0
}

.light-bg {
    background: #f9fafc
}

.industry-short-info,
.our-solution-sec {
    padding: 50px 0
}

.hubspot-link__container.sproket {
    display: none!important
}

.wpcf7-form label.error {
    font-size: 17px
}

.web-development-services .inner_box .button[data-text="Our Team"] {
    float: left
}

.review_row {
    -webkit-box-shadow: 0 0 5px #ccc;
    box-shadow: 0 0 5px #ccc;
    border-radius: 0 40px
}

.review_row:nth-child(odd) {
    border-radius: 40px 0
}

.review_row .box_s {
    position: relative
}

.review_row .box_s img {
    position: absolute;
    width: 60px;
    border-radius: 50%;
    height: 60px;
    left: -50px;
    top: -49px;
    border: 5px solid #ccc
}

.review_row:nth-child(odd) .box_s img {
    left: auto;
    right: -50px
}

.review_row .box_s .info {
    position: absolute;
    border-radius: 50%;
    left: 20px;
    top: -19px;
    font-weight: 700
}

.review_row:nth-child(odd) .box_s .info {
    left: auto;
    right: 20px
}

.working-process-group ul {
    padding: 0;
    margin: 15px 0 0
}

select.wpcf7-form-control.wpcf7-select.form-control {
    padding: 0 3px
}

select.wpcf7-form-control.wpcf7-select.form-control option {
    color: #353535
}

.thankyou .jumbotron {
    width: 900px;
    max-width: 90%;
    margin: 150px auto 80px;
    background: #fff;
    padding: 40px;
    -webkit-box-shadow: 0 0 5px #ccc;
    box-shadow: 0 0 5px #ccc;
    border-radius: 30px;
    color: #353535
}

.thankyou .jumbotron p {
    color: #000;
    font-weight: 400
}

.thankyou .jumbotron p .btn.btn-primary.btn-sm {
    padding: 10px 18px;
    font-size: 18px;
    background: #0328d2
}

.CaseStudyCntnt img,
body.thankyou .cont-us-box {
    display: none
}

.CaseStudyCntnt {
    margin-top: 50px;
    margin-bottom: 50px
}

.CaseStudyCntnt ul li {
    margin-top: 8px;
    margin-bottom: 8px
}

.visit_site_btn {
    padding: 10px 30px;
    font-size: 18px;
    background: #0328d2;
    display: inline-block;
    color: #fff;
    margin-bottom: 30px
}

.visit_site_btn:hover {
    color: #fff
}

.mega-dropdown-menu .menuslide .btn:hover {
    color: #fff!important
}

.pricing-table table td {
    vertical-align: middle!important;
    text-align: center;
    border-color: #0328D2!important
}

.outsourcing-country .feature-box {
    padding: 30px 30px 0
}

.mb-20 {
    margin-bottom: 20px
}

.mb-0 {
    margin-bottom: 0
}

.py50 {
    padding: 50px 0
}

.large-text {
    font-size: 30px;
    color: #0328d2
}

.pricing-page .positive_list li {
    margin-bottom: 25px
}

.more-content .solutions-block {
    display: none
}

.more-content .solutions-block.active {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.material-form .input-block.floating-field {
    height: 50px
}

#Become-a-nsf-Partner .g-recaptcha,
#Lets-Connect .g-recaptcha {
    left: -30px
}

#Get-In-Touch .g-recaptcha {
    left: -40px
}

.material-form .input-block label {
    top: 20px
}

.enq-jombotron .popup-content {
    overflow-y: auto
}

.img-block img {
    display: inline-block
}

.contact-wrap .input-block:last-child,
.request-captcha {
    color: #fff;
    height: auto!important
}

.request-captcha .wpcf7-mathcaptcha,
.wpcf7-mathcaptcha {
    color: #333;
    text-align: center
}

#Contact-Us .request-captcha,
#Get-In-Touch .request-captcha,
.sidebar-contact .request-captcha {
    color: #333
}

.portfolio_modal {
    overflow-y: auto
}

.captcha-image {
    width: 100%;
    margin-bottom: 15px;
    color: #000
}

#nibora.portfolio_modal {
    background: #000 !important
}

.material-form .input-block .form-control {
    border-bottom: solid 1px #000 !important
}

.input-block.floating-field label {
    color: #000
}

.enq-popupSec .input-block.floating-field label {
    color: #fff
}

.nsf-slide .slider-form .wpcf7-submit {
    background-color: #03a9f4;
    border-radius: 50px;
    color: #fff;
    font-weight: 900;
    margin-top: 12px;
    margin: 0 auto;
    width: 70%;
    display: flex;
    justify-content: center;
    margin-top: 10px
}

.material-form .input-block .form-control {
    font-size: 16px
}

.mt150 {
    margin-top: 15rem
}

#wh-widget-send-button iframe {
    bottom: -50px !important;
    position: relative
}

.case-studies-app {
    margin: 20px 0
}

.case-studies-app span {
    font-size: 14px !important;
    margin: 0 3px 5px !important;
    padding: 5px 10px !important;
    background: #0328d2;
    color: #fff;
    border-radius: 20px
}

.portfolio_modal .modal-dialog .enquiry-form .captcha-image .cf7ic_instructions {
    font-size: 14px;
    color: #fff !important
}

.captcha-image label svg {
    width: 20px;
    height: 20px;
    margin-left: 5px
}

.slick-slide {
    height: auto !important
}

#nsfhslider .carousel-control span {
    position: absolute;
    left: 0;
    right: 0;
    top: -3px
}

#slider>p {
    display: none
}

.portfolio_modal .modal-dialog .enquiry-form .captcha-image label {
    color: #fff
}

.appstlinksrw .stdsbx .comingsoon.casewd {
    width: 140px;
    display: inline-block;
    float: left
}

.captcha-image .fa {
    font-size: 20px
}

.cf7ic_instructions {
    font-size: 14px;
    color: #999 !important;
    margin-bottom: 10px;
    display: block
}

.captcha-image label img {
    width: 16px !important
}

.captcha-image {
    border: none !important;
    padding: 3px;
    margin-bottom: 0
}

.enq-jombotron .popup-content .captcha-image .cf7ic_instructions,
.enq-jombotron .popup-content .captcha-image .fa {
    color: #fff !important
}

.enq-jombotron .popup-content .captcha-image label {
    margin-left: 10px;
    margin-bottom: 10px
}

.enq-jombotron .popup-content .captcha-image label svg {
    width: 20px !important;
    margin-left: 5px;
    height: 20px
}

.sidebar-contact .sideformtoggle {
    position: absolute;
    width: 170px;
    text-align: center;
    cursor: pointer;
    background: #244e9e;
    border-radius: 20px 20px 0 0;
    top: 40%;
    left: -107px;
    line-height: 42px;
    transform: rotate(-90deg);
    color: #fff;
    height: 45px
}

.sidebar-contact .sideformtoggle span {
    width: 130px;
    text-align: center;
    cursor: pointer;
    background: #244e9e;
    border-radius: 20px 20px 0 0;
    top: 0;
    left: 0;
    line-height: 40px;
    transform: rotate(0deg);
    color: #fff
}

.enq-jombotron .popup-content .captcha-image .cf7ic_instructions,
.enq-jombotron .popup-content .captcha-image .fa {
    display: block
}

.enq-jombotron .popup-content .captcha-image label .fa {
    margin-left: 5px
}

#dishpal.portfolio_modal {
    background: #e32337
}

.Client_Testimonials h4,
.portfolio_modal .project-overview,
.portfolio_modal .r_quote h2 {
    color: #fff
}

.anapp-btn {
    display: inline-block;
    margin-left: 5px
}

.appstlinksrw .stdsbx .comingsoon {
    font-weight: 300;
    width: 160px;
    height: 38px;
    line-height: 33px;
    text-align: center;
    font-size: 20px;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 6px;
    background-color: transparent
}

.livedemo_s .nav-tabs>li {
    float: none;
    display: inline-block;
    margin-right: 35px
}

.nsf-slide .slider-meta br {
    content: ""
}

.solution_process a br {
    content: ""
}

@keyframes animate {
    0% {
        opacity: 0;
        transform: rotate(45deg) translate(-20px, -20px)
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: 0;
        transform: rotate(45deg) translate(20px, 20px)
    }
}

.portfolio-grid .mt150 {
    margin-top: 150px
}

.contact-wrap.captcha-image.cf7ic_instructions {
    font-size: 14px;
    color: #333 !important
}

.casestudies-lp .casestudies {
    width: 100%;
    margin: 50px 0
}

.casestudies-lp .inner-cols {
    height: 310px;
    width: 100%;
    height: 65vh;
    background: #ccc;
    text-align: center;
    position: relative
}

.casestudies-lp .inner-cols:before {
    content: "";
    display: inline-block;
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .1);
    left: 0;
    right: 0
}

.casestudies-lp .banner-col-content {
    position: absolute;
    bottom: 25px;
    width: 100%
}

.casestudies-lp .col-logo {
    width: auto;
    display: inline-block;
    position: relative;
    margin: 0 auto 20px
}

.casestudies-lp .col-logo img {
    position: relative
}

.casestudies-lp .inner-cols .para {
    padding: 0 10px
}

.casestudies-lp .inner-cols .para {
    position: relative;
    color: #fff;
    display: none;
    opacity: 0;
    padding: 0 30px;
    line-height: 1.4;
    font-size: 16px
}

.casestudies-lp .banner-col-content .red-btn {
    display: none;
    background: #ef323a
}

.casestudies-lp .inner-cols:hover:before {
    background: #0328d2;
    transition: all .2s
}

.casestudies-lp .circle-btn,
.casestudies-lp .circle-btn:hover {
    margin: 19px auto 0
}

.casestudies-lp .circle-btn,
.casestudies-lp .circle-btn:hover {
    margin: 40px auto 0;
    display: inline-block;
    background: #023575;
    color: #fff;
    font-size: 15px;
    transition: all .2s
}

.casestudies-lp .inner-cols:hover .banner-col-content {
    width: 100%;
    top: 50%;
    bottom: auto;
    transform: translate(0, -50%)
}

.casestudies-lp .inner-cols:hover .para,
.inner-cols:hover .red-btn {
    display: inline-block;
    opacity: 1
}

.casestudies-lp .inner-cols:hover .para,
.inner-cols:hover .red-btn {
    display: inline-block;
    opacity: 1
}

.casestudies-lp .case-abt {
    background-color: #f7f7f7;
    background-repeat: repeat;
    padding-top: 30px;
    padding-right: 30px;
    padding-bottom: 80px;
    padding-left: 30px;
    border-top-width: 0;
    border-bottom-width: 0;
    border-color: #eae9e9;
    border-top-style: solid;
    border-bottom-style: solid;
    width: 100%
}

.casestudies-lp .title-case {
    position: relative
}

.title-case h2 {
    position: relative;
    z-index: 2
}

.case_nav {
    margin: 0;
    padding: 0;
    text-align: left
}

.case_nav .case_nav_in {
    margin-top: 30px
}

.case_nav strong {
    color: #fff;
    font-size: 17px
}

.case_nav span {
    display: block;
    color: #b8b8b8;
    font-size: 15px
}

.casestudies-lp .title-case .title-110px {
    font-size: 50px !important;
    line-height: 125px !important
}

.casestudies-lp .title-case .mar-top-30 {
    margin-top: 30px !important
}

.casestudies-lp .title-case .mar-bot-30 {
    margin-bottom: 30px !important
}

.title-case h3 {
    position: absolute;
    top: -50px;
    left: 0;
    color: rgba(241, 241, 241, .8);
    font-size: 133px;
    font-weight: 700 !important
}

.title-case .title-260px {
    font-size: 75px !important;
    line-height: 250px !important;
    font-weight: 700 !important
}

.fs-layout {
    width: 100%;
    text-align: center;
    padding: 30px 15px;
    box-shadow: 2px 2px 5px #ccc;
    background-color: #fff;
    border-radius: 3px;
    margin-top: 30px
}

.fs-layout h3 {
    font-size: 20px
}

.fs-layout h3 span {
    font-size: 14px;
    display: block
}

.section-sub {
    width: 100%;
    float: left;
    padding: 80px 0;
    background-size: cover;
    background-repeat: no-repeat;
    text-align: center;
    color: #fff
}

.width73 {
    width: 72% !important
}

.download_doc {
    width: 100%;
    display: inline-block;
    background: rgba(255, 255, 255, .1);
    border-radius: 10px;
    margin-top: 50px;
    padding: 25px 25px 36px
}

.download_doc h2 {
    font-weight: 300;
    font-size: 26px;
    color: #fff;
    letter-spacing: .2px;
    margin: 0
}

.download_doc .title-bar-doc {
    font-weight: 300;
    font-size: 12px;
    margin: 13px 0 0;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: #fff
}

.download_doc form {
    margin-top: 25px;
    width: 100%
}

.whitepapers-lp .download_doc .filed-doc {
    float: left;
    padding: 0 5px;
    width: 38%
}

.filed-doc .h45 {
    height: 45px
}

.download_doc .filed-doc {
    float: left;
    padding: 0 5px;
    width: 38%
}

#portfolio.section {
    height: auto !important;
    padding: 100px 0 !important
}

.portfolioappContentbx.eventbookappwd {
    padding: 50px 0 !important
}

.hire-new-section .col-md-4 .box {
    margin-bottom: 10px !important;
    margin-top: 20px !important
}

.testi-grid {
    background-position: bottom center;
    padding: 40px 0;
    margin-bottom: 0;
    width: 100%;
    clear: both
}

.testi-grid .review_row {
    padding: 25px 25px 0;
    text-align: center;
    border-radius: 0 !important;
    background: #fff;
    position: relative;
    min-height: 485px
}

.testi-grid .row {
    padding: 0 !important
}

.testi-grid .review_row img {
    padding-bottom: 0;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    border: 2px solid #ccc;
    margin-bottom: 20px
}

.testi-grid .review_row i {
    position: absolute;
    top: -15px;
    left: 10%;
    background: #f3b201;
    border-radius: 0;
    content: "";
    color: #fff !important;
    transition: all .3s ease;
    box-shadow: 0 5px 30px rgba(19, 47, 34, .15);
    padding: 15px;
    letter-spacing: 1px
}

.testi-grid .review_row:before {
    background: #f3b200
}

.testi-grid .review_row .info span {
    color: #0328d2;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: .5px
}

.testi-grid .review_row .name_e {
    width: 90px;
    border-radius: 50%;
    height: 90px;
    border: 5px solid #ccc;
    background: #fff;
    text-align: center;
    font-weight: 900;
    text-transform: uppercase;
    line-height: 80px;
    margin-bottom: 20px;
    display: inline-block
}

@media (320px) and (480px) {
    .hire-new-section .col-md-4 .box {
        min-height: auto !important;
        height: auto !important;
        margin-bottom: 30px
    }
    .solution_process {
        margin-top: 20px;
        min-height: auto !important
    }
}

@media (480px) and (767px) {
    .home-port .food-dishpal-det {
        width: 100%;
        height: 880px
    }
}

@media (max-width:991px) {
    .main-form .contact-info {
        margin-top: 0
    }
}

@media (max-width:767px) {
    .bg-test {
        height: 100%;
        width: 100%;
        background-position: 0 0;
        background-size: cover;
        position: absolute;
        z-index: 0;
        top: 0;
        background-repeat: no-repeat
    }
    .casestudies-lp .title-case .mar-bot-30 {
        margin-bottom: 0 !important
    }
    .casestudies-lp .title-case .mar-top-30 {
        margin-top: 0 !important
    }
    .title-case .title-260px {
        display: none
    }
    .casestudies-lp .case-abt {
        padding-right: 0;
        padding-bottom: 50px;
        padding-left: 0;
        width: 100%
    }
    .casestudies-lp .title-case .title-110px {
        font-size: 36px !important;
        line-height: 50px !important
    }
    .casestudies-lp .inner-cols {
        margin-top: 15px
    }
    .hire-new-section .col-md-4 .box {
        height: auto !important;
        min-height: auto !important
    }
    .livedemo_s .nav-tabs>li {
        margin-right: 0 !important
    }
    .sidebar-contact .sideformtoggle span {
        height: 33.5px;
        border-radius: 20px 0 0 !important;
        right: 54px !important;
        font-size: 12px
    }
    .sidebar-contact .sideformtoggle:before {
        font-size: 14px
    }
    .sidebar-contact .sideformtoggle span {
        width: 100px
    }
    .sidebar-contact .sideformtoggle {
        position: absolute;
        width: 140px;
        text-align: center;
        cursor: pointer;
        background: #244e9e !important;
        border-radius: 20px 20px 0 0;
        top: 40%;
        left: -90px;
        line-height: 42px;
        font-size: 12px
    }
}

@media (max-width:767px) {
    .appstlinksrw .stdsbx .comingsoon.casewd {
        display: block
    }
    .mt150 {
        margin-top: 0
    }
    .casestudies-lp .casestudies {
        float: left;
        margin: 40px 0;
        float: left
    }
    .section-sub {
        padding: 50px 0
    }
    .download_doc {
        padding: 20px !important
    }
    .width73 {
        width: 100% !important;
        margin-bottom: 15px
    }
    .casestudies-lp .case-abt {
        float: left
    }
    .mt150 {
        margin-top: 0;
        margin-left: 20px
    }
    .slideInRight {
        margin-top: 20px
    }
    .width73 {
        width: 100% !important
    }
    .whitepapers-lp .download_doc .filed-doc {
        width: 50% !important;
        margin-bottom: 15px
    }
    .inner-sec {
        padding: 0 !important;
        float: left
    }
    .inner-sec-ser {
        padding: 20px !important;
        margin-top: 30px !important
    }
}

@media (max-width:991px) {
    .sidebar-contact .sideformtoggle {
        position: absolute;
        width: 40px;
        height: 40px;
        text-align: center;
        cursor: pointer;
        background: #244e9e !important;
        border-radius: 20px 0 0;
        top: 40%;
        left: -40px;
        line-height: 42px
    }
}

.portfolio-grid {
    width: 100%;
    float: left;
    margin-bottom: 100px;
    position: relative
}

.bg-f7 {
    background: #f7f7f7
}

.bg-white {
    background: #fff
}

.portfolio-grid .food-dishpal-img {
    width: 100%;
    float: left
}

.portfolio-grid .food-dishpal-img img {
    height: 560px;
    border-radius: 0 10px 10px 0
}

.portfolio-grid .img-rad img {
    border-radius: 10px 0 0 10px !important
}

.portfolio-grid .food-dishpal-det {
    width: 100%;
    position: relative;
    float: left;
    padding: 30px 0 0;
    height: 560px
}

.portfolio-grid .app-cont {
    padding: 50px 0 0
}

.portfolio-grid .food-dishpal-det .app-screen {
    width: 330px;
    float: left;
    position: absolute;
    left: -125px;
    z-index: 999
}

.portfolio-grid .food-dishpal-det .app-screen img {
    border-radius: 40px
}

.portfolio-grid .food-dishpal-det .app-cont {
    width: 65%;
    float: left;
    margin-left: 200px;
    position: relative;
    text-align: left
}

.home-port .food-dishpal-img {
    width: 40%
}

.home-port .food-dishpal-det {
    width: 60%
}

.gape-img {
    margin: 20px 0
}

.home-port .arrow-p {
    width: initial;
    height: initial;
    line-height: inherit;
    text-align: center;
    font-size: 24px;
    color: #333;
    display: block;
    border-radius: 100px;
    z-index: 3;
    background: 0 0;
    right: inherit;
    top: 100%;
    position: absolute;
    cursor: pointer;
    -webkit-box-shadow: none;
    box-shadow: none;
    float: right;
    border: none;
    margin-left: 60px !important
}

.home-port .arrow-n {
    width: initial;
    height: initial;
    line-height: inherit;
    text-align: center;
    font-size: 24px;
    color: #333;
    display: block;
    border-radius: 100px;
    z-index: 3;
    background: 0 0;
    right: inherit;
    top: 100%;
    position: absolute;
    cursor: pointer;
    -webkit-box-shadow: none;
    box-shadow: none;
    float: right;
    border: none;
    margin-right: 60px !important
}

.portfolio-grid .col-md-5 {
    padding-left: 0;
    padding-right: 0
}

.portfolio-grid .col-md-7 {
    padding-left: 0;
    padding-right: 0
}

.portfolio-grid .food-dishpal-det .port-btn {
    margin-left: 200px;
    margin-top: 15px;
    display: inline-block
}

.portfolio-grid .food-dishpal-det2 {
    width: 100%;
    position: relative;
    float: left;
    padding: 30px 0 0;
    height: 560px
}

.portfolio-grid .app-cont {
    padding: 0
}

.portfolio-grid .food-dishpal-det2 .app-screen {
    width: 330px;
    float: left;
    position: absolute;
    right: -210px;
    z-index: 999
}

.portfolio-grid .food-dishpal-det2 .app-screen img {
    border-radius: 40px
}

.portfolio-grid .food-dishpal-det2 .app-cont {
    width: 65%;
    float: left;
    margin-left: 75px;
    position: relative
}

.portfolio-grid .col-md-6 {
    padding-left: 0;
    padding-right: 0
}

.portfolio-grid .food-dishpal-det2 .port-btn {
    margin-left: 75px;
    margin-top: 15px;
    display: inline-block
}

.appstlinksrw .stdsbx .comingsoon {
    border: 2px solid #333 !important;
    border-radius: 6px;
    background-color: transparent;
    color: #333 !important
}

.portfolio-grid .food-dishpal-det2 .port-btn {
    margin-left: 75px;
    margin-top: 15px;
    display: block;
    width: 100%;
    float: left
}

.port-tab {
    width: 100%;
    margin: 50px 0;
    float: left;
    text-align: center
}

.port-tab .port-tabs {
    margin: 0 auto;
    padding: 0;
    width: 400px;
    text-align: center;
    margin-top: 15px
}

.port-tab .port-tabs li {
    list-style: none;
    display: inline-block;
    margin: 0 10px
}

.port-tab .port-tabs li a {
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: .5px;
    padding: 15px 30px;
    background: #f7f7f7;
    color: #333;
    border-radius: 3px;
    border-bottom: 2px solid #0328d2
}

.current {
    background: #0328d2;
    color: #fff;
    border-color: #0328d2
}

.port-tab .port-tabs li a:hover {
    transition: .3s;
    background: #0328d2;
    color: #fff;
    border-color: #0328d2
}

.port-app {
    margin: 100px 0
}

.port-app .appdevheading {
    text-align: left !important
}

.port-app .app_txt_info {
    text-align: left !important
}

.mobile-slide {
    width: 100%;
    position: relative;
    margin-top: 100px
}

#container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 320px;
    height: 500px;
    background-color: transparent
}

#iphone_container {
    position: relative;
    background: 0 0;
    width: 100%;
    margin: 0 auto;
    height: 100%;
    display: block;
    border-top-left-radius: 40px;
    border-top-right-radius: 40px;
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px
}

#top_container {
    width: 100%;
    height: 30px;
    background-color: #fff;
    border-top-left-radius: 40px;
    border-top-right-radius: 40px
}

#dot1 {
    position: absolute;
    top: 10px;
    right: 30%;
    width: 7px;
    height: 7px;
    background-color: #4a4a52;
    border-radius: 50%
}

#line1 {
    position: absolute;
    top: 10px;
    left: 40%;
    width: 60px;
    height: 4px;
    background-color: #4a4a52;
    border-radius: 48px
}

#dot2 {
    position: absolute;
    top: 22px;
    left: 48%;
    width: 8px;
    height: 8px;
    background-color: #4a4a52;
    border-radius: 50%;
    display: none
}

#volume_up {
    position: absolute;
    width: 10px;
    height: 35px;
    background-color: #fff;
    left: -15px;
    border-radius: 20px;
    top: 10px
}

#volume_down {
    position: absolute;
    width: 10px;
    height: 35px;
    background-color: #fff;
    left: -15px;
    border-radius: 20px;
    top: 55px
}

#power {
    position: absolute;
    width: 10px;
    height: 35px;
    background-color: #fff;
    right: -15px;
    border-radius: 20px;
    top: 10px
}

#bottom_container {
    width: 100%;
    height: 30px;
    background-color: #fff;
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px
}

#btn {
    position: absolute;
    width: 15%;
    height: 9%;
    background-color: rgba(0, 0, 0, .001);
    left: 41%;
    top: 88.3%;
    border-radius: 50%;
    border: 2px solid gray;
    box-shadow: 1px 1px 2px, -1px -1px 2px;
    display: none
}

#square {
    position: absolute;
    width: 4%;
    height: 2.5%;
    background-color: rgba(0, 0, 0, .001);
    top: 89.4%;
    left: 130px;
    margin: 3.5% 0;
    border-radius: 5px;
    border: 2px solid gray;
    box-shadow: .1px .1px #4a4a52;
    display: none
}

#ribbon {
    position: absolute;
    background-color: red;
    color: #fff;
    top: 40px;
    left: -30px;
    width: 160px;
    transform: rotate(-45deg);
    text-align: center;
    font-family: consolas
}

.color-dish {
    color: #c42b40
}

.color-pod {
    color: #ffc552
}

.color-day {
    color: #03c8dd
}

.color-aber {
    color: #f92f3b
}

.color-rgroup {
    color: #01346d
}

.color-kizoi {
    color: #75060c
}

.color-goldplus {
    color: #c42b40
}

.color-smart {
    color: #276ef1
}

.color-homey {
    color: #78bfed
}

.color-health {
    color: #1357bb
}

.color-speekezy {
    color: #046200
}

.color-jolly {
    color: #ec3138
}

.color-kidizen {
    color: #7dcfdd
}

.color-genius {
    color: #e0313e
}

.color-carsome {
    color: #ffc501
}

.color-urban {
    color: #00c2c2
}

.port-heading {
    width: 100%;
    text-align: center;
    margin: 50px 0 30px;
    float: left
}

.divided {
    width: 160px;
    margin: auto;
    position: relative
}

.mb-5 {
    margin-bottom: 3rem !important
}

.port-head .divided:before {
    content: "";
    position: absolute;
    bottom: 0;
    width: 160px;
    height: 2px;
    -webkit-transition: all ease-in-out .4s;
    -moz-transition: all ease-in-out .4s;
    -ms-transition: all ease-in-out .4s;
    -o-transition: all ease-in-out .4s;
    transition: all ease-in-out .4s;
    left: 0;
    right: 0;
    margin: auto;
    background: #067abf
}

.port-head h2~.divided:after {
    animation: move 5s infinite;
    -webkit-animation: move 5s infinite
}

.port-head .divided:after {
    background: #0328d2;
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    width: 40px;
    height: 6px;
    -webkit-transition: all ease-in-out .4s;
    -moz-transition: all ease-in-out .4s;
    -ms-transition: all ease-in-out .4s;
    -o-transition: all ease-in-out .4s;
    transition: all ease-in-out .4s;
    margin: 0 auto;
    border-radius: 5px
}

.img-gape {
    margin: 15px 0;
    width: 150px
}

.nav-tabs {
    border-bottom: none
}

@media (min-width:320px) and (max-width:479px) {
    .home-port .food-dishpal-det {
        height: 970px !important
    }
}

@media (min-width:480px) and (max-width:766px) {
    .home-port .food-dishpal-det {
        height: 900px !important
    }
}

@media (min-width:767px) and (max-width:990px) {
    .home-port .food-dishpal-det {
        height: 650px !important;
        width: 100%
    }
    .port_btn button {
        margin-top: -120px;
        float: left
    }
    .home-port .arrow-n {
        background: 0 0 !important;
        top: 92%
    }
    .home-port .arrow-p {
        background: 0 0 !important;
        top: 92%
    }
    .img-gape {
        width: 100px
    }
}

@media (min-width:991px) and (max-width:1100px) {
    .img-gape {
        width: 100px
    }
}

@media (min-width:320px) and (max-width:767px) {
    .testi-grid .review_row {
        padding: 25px;
        min-height: auto
    }
    .home-port .food-dishpal-det {
        width: 100%
    }
    .img-gape {
        width: 100px
    }
    .home-port .arrow-n {
        font-size: 20px;
        background: 0 0 !important;
        top: 92%;
        margin-right: 30px !important
    }
    .home-port .arrow-p {
        font-size: 20px;
        background: 0 0 !important;
        top: 92%;
        margin-left: 30px !important
    }
    .portfolio-grid .food-dishpal-img {
        display: none
    }
    .portfolio-grid {
        margin: 0
    }
    .portfolio-grid .food-dishpal-det .app-cont {
        width: 88%;
        margin-left: 20px
    }
    .portfolio-grid .food-dishpal-det {
        padding: 50px 0 30px;
        height: auto
    }
    .portfolio-grid .food-dishpal-det .app-screen {
        width: 50%;
        float: none;
        position: relative;
        left: 0;
        margin: 0 auto
    }
    .portfolio-grid .app-cont {
        padding: 10px 0 0
    }
    .portfolio-grid .food-dishpal-det .port-btn {
        margin-left: 20px
    }
    .portfolio-grid .food-dishpal-det .port-btn .casestudybtn .stdsbx a {
        width: 100%
    }
    .portfolio-grid .food-dishpal-det .port-btn .casestudybtn .stdsbx a img {
        float: left;
        height: 33px
    }
    .portfolio-grid .food-dishpal-det .app-screen img {
        width: 100%
    }
    .portfolio-grid .food-dishpal-det2 {
        height: auto
    }
    .portfolio-grid .food-dishpal-det2 .app-cont {
        width: 88%;
        margin-left: 20px
    }
    .portfolio-grid .food-dishpal-det2 {
        padding: 50px 0 30px;
        height: auto
    }
    .portfolio-grid .food-dishpal-det2 .app-screen {
        width: 50%;
        float: none;
        position: relative;
        left: 0;
        margin: 0 auto
    }
    .portfolio-grid .food-dishpal-det2 .app-screen img {
        width: 100%
    }
    .portfolio-grid .food-dishpal-det2 .port-btn {
        margin-left: 20px
    }
    .portfolio-grid .food-dishpal-det2 .port-btn .casestudybtn .stdsbx a {
        width: 100%
    }
    .portfolio-grid .food-dishpal-det2 .port-btn .casestudybtn .stdsbx a img {
        float: left;
        height: 33px
    }
    .mobile-slide {
        display: none;
        text-align: center !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .testi-grid .review_row {
        min-height: 420px
    }
    .testi-grid .col-md-4 {
        width: 50%;
        float: left
    }
    .portfolio-grid .food-dishpal-det {
        height: 540px
    }
    .portfolio-grid .food-dishpal-det2 {
        height: 540px
    }
    .portfolio-grid .app-cont {
        padding: 0
    }
    .portfolio-grid {
        margin-bottom: 50px
    }
    .mobile-slide {
        display: none
    }
    .portfolio-grid .food-dishpal-img {
        display: none
    }
    .portfolio-grid .food-dishpal-det .app-cont {
        width: 60%;
        float: right;
        margin-left: 0;
        position: relative;
        margin-top: 50px
    }
    .portfolio-grid .food-dishpal-det .app-screen {
        width: 40%;
        float: left;
        left: inherit
    }
    .portfolio-grid .food-dishpal-det .port-btn {
        float: right;
        clear: both
    }
    .portfolio-grid .food-dishpal-det2 .app-cont {
        width: 60%;
        float: left;
        margin-left: 0;
        position: relative;
        margin-top: 50px
    }
    .portfolio-grid .food-dishpal-det2 .port-btn {
        margin-left: 0;
        float: left;
        width: 60%
    }
    .portfolio-grid .food-dishpal-det2 .app-screen {
        width: 40%;
        float: right;
        position: relative;
        right: inherit;
        z-index: 999
    }
    .portfolio-grid .food-dishpal-det2 .app-screen img {
        float: right
    }
    .portfolio-grid .food-dishpal-det .port-btn .casestudybtn .stdsbx a img {
        float: left;
        height: 35px
    }
    .portfolio-grid .food-dishpal-det2 .port-btn .casestudybtn .stdsbx a img {
        float: left;
        height: 35px
    }
    .portfolio-grid .food-dishpal-det2 .app-cont h2 {
        margin-top: 0
    }
    .portfolio-grid .app-cont {
        padding: 0
    }
    .portfolio-grid .food-dishpal-det {
        padding: 30px 20px
    }
    .portfolio-grid .food-dishpal-det2 {
        padding: 30px 20px
    }
    .appstlinksrw .stdsbx .comingsoon {
        width: 140px;
        height: 33px;
        line-height: 28px;
        font-size: 18px
    }
    .appstlinksrw .casestudybtn {
        text-align: left !important
    }
    .appstlinksrw .stdsbx {
        text-align: left !important
    }
}

@media (min-width:992px) and (max-width:1150px) {
    .testi-grid .col-md-4 {
        width: 50%;
        float: left
    }
    .testi-grid .review_row {
        min-height: 440px
    }
    .portfolio-grid .food-dishpal-det .app-screen {
        width: 50%;
        left: inherit;
        margin-left: -310px;
        margin-top: 80px
    }
    .portfolio-grid .food-dishpal-det .app-cont {
        width: 88%;
        margin-left: 50px
    }
    .portfolio-grid .app-cont {
        padding: 0
    }
    .portfolio-grid .food-dishpal-det .port-btn {
        margin-left: 50px
    }
    .appstlinksrw .casestudybtn {
        text-align: left !important
    }
    .appstlinksrw .stdsbx {
        width: initial !important
    }
    .portfolio-grid .food-dishpal-det .port-btn .casestudybtn .stdsbx a {
        width: 100%
    }
    .portfolio-grid .food-dishpal-det .port-btn .casestudybtn .stdsbx a img {
        float: left;
        height: 31px
    }
    .portfolio-grid .food-dishpal-det2 .app-screen {
        width: 50%;
        float: right;
        right: initial;
        z-index: 999;
        top: initial;
        margin-top: 65px;
        margin-left: 69rem
    }
    .portfolio-grid .food-dishpal-det2 .app-cont {
        width: 90%;
        margin-left: 30px
    }
    .portfolio-grid .food-dishpal-det2 .port-btn {
        margin-left: 25px
    }
    .portfolio-grid .food-dishpal-det2 .port-btn .casestudybtn .stdsbx a img {
        float: left;
        height: 31px
    }
    .portfolio-grid {
        margin-bottom: 75px
    }
    .portfolio-grid .food-dishpal-det .app-screen img {
        border-radius: 0
    }
}

@media (min-width:320px) and (max-width:767px) {
    .nsf-slide h1 {
        margin-top: 30px !important
    }
    .nsf-slide .slider-form .wpcf7-submit {
        color: #333 !important;
        margin-top: 10px
    }
    .webdevelopment_re {
        padding: 30px 0
    }
    .nsf-slide .slider-form {
        margin-top: 0
    }
    .MobileApplicationDevelopment {
        padding: 20px 0
    }
    .projects-bg {
        padding: 30px 0 30px
    }
    .development-stages {
        padding: 70px 0 0
    }
}

.portfolio-tabs .port-tabs>li.active>a,
.portfolio-tabs .port-tabs>li.active>a:focus,
.portfolio-tabs .port-tabs>li.active>a:hover {
    color: #0328d2 !important
}

.portfolio-tabs {
    width: 100%
}

.portfolio-tabs .port-tabs {
    text-align: center;
    margin-bottom: 50px
}

.portfolio-tabs .port-tabs li {
    text-align: center;
    display: inline-block;
    float: none
}

.portfolio-tabs .port-tabs li a {
    color: #000;
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 0;
    border: none;
    margin: 0 20px
}

.portfolio-tabs .port-tabs li a:hover {
    border: none;
    color: #0328d2 !important
}

.portfolio-tabs .port-tabs li a span {
    display: block;
    margin-top: 15px;
    font-weight: 700
}

@media (min-width:768px) and (max-width:991px) {
    .portfolio-grid .port-show {
        display: block !important
    }
}

@media (max-width:767px) {
    .portfolio-grid .port-show {
        display: block !important;
        padding-top: 40px
    }
    .portfolio-grid .port-bg {
        background: #f7f7f7;
        padding-top: 50px
    }
    .portfolio-grid .port-show img {
        height: auto !important;
        border-radius: 0 10px 10px 0;
        width: 60%;
        margin: 0 auto
    }
    .row-res {
        display: -webkit-flex;
        -webkit-flex-direction: row-reverse;
        display: flex;
        flex-direction: column-reverse
    }
    .portfolio-grid .row-res .food-dishpal-det2 {
        padding: 0 0 50px;
        height: auto
    }
    .portfolio-grid .port-top {
        padding: 0 0 50px;
        height: auto
    }
    .portfolio-tabs .port-tabs li a span {
        margin-top: 10px
    }
    .portfolio-tabs .port-tabs li a {
        color: #000;
        font-size: 16px;
        text-transform: uppercase;
        letter-spacing: 1px;
        padding: 0;
        border: none;
        margin: 0 15px;
        padding: 0 !important
    }
    .portfolio-tabs .port-tabs {
        margin-bottom: 30px
    }
    .appstlinksrw .casestudybtn {
        margin-bottom: 0
    }
    .portfolio-grid .food-dishpal-det h2 {
        margin-top: 0
    }
    .portfolio-grid .food-dishpal-det .app-screen img {
        border-radius: 35px
    }
    .portfolio-grid .food-dishpal-det2 .app-screen img {
        border-radius: 35px
    }
}

.portfolio-grid .port-show img {
    height: auto !important
}

.portfolio-grid .port-top {
    height: 525px !important
}

.portfolio-grid .port-bg img {
    height: 560px
}

.arrow {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 30px
}

.arrow span {
    display: block;
    width: 20px;
    height: 20px;
    border-bottom: 2px solid #151516;
    border-right: 2px solid #151516;
    transform: rotate(45deg);
    margin: -10px;
    animation: animate 2s infinite
}

.arrow span:nth-child(2) {
    animation-delay: -.2s
}

.arrow span:nth-child(3) {
    animation-delay: -.4s
}

.sidebar-contact .sideformtoggle {
    display: none
}

div#xyzGiggle {
    transform: scale(.8)
}

.this_footer .material-form .input-block:before {
    background: 0 0 !important
}

.scrolled #main-menu {
    display: list-item !important
}

.scrolled div#maintoggle {
    display: none
}

@media (min-width:320px) and (max-width:767px) {
    .contactformwrap .material-form .input-block {
        border-bottom: none !important
    }
}

section.our__Client_contain {
    padding: 40px 0 80px;
    text-align: center;
    position: relative;
    background-color: #fff !important;
    background-image: none !important;
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto !important;
    /*margin-bottom: 60px;*/
    overflow: hidden
}

section.our__Client_contain:before {
    position: absolute;
    content: "";
    top: -30px;
    left: 50%;
    bottom: 0;
    transform: translate(-50%);
    width: calc(100vw - 0vw);
    height: 450px;
    background-color: #fff !important;
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto !important;
    opacity: .03
}

section.our_brand.our__Client_contain .item {
    border: none !important;
    margin: 0 7px;
    padding: 0 !important;
    border-radius: 0;
    text-align: center;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-left: 40px
}

section.our_brand.our__Client_contain .item img {
    height: 40px !important
}

section.our__Client_contain p {
    padding: 0 140px;
    color: #000 !important
}

section.our_brand.our__Client_contain .item img.increase_size {
    height: 123px !important;
    width: auto !important;
    margin-top: -38px
}

section.our_brand.our__Client_contain .item img.less-increase {
    height: 65px !important;
    width: auto !important;
    margin-top: -8px
}

section.our_brand.our__Client_contain .item img.less-decrease {
    height: 44px !important;
    width: auto !important;
    margin-top: 0
}

section.our_brand.our__Client_contain .owl-carousel .owl-item {
    margin-top: 40px
}

@media (max-width:767px) {
    section.our__Client_contain p {
        padding: 0 10px
    }
}

@media (min-width:768px) and (max-width:1024px) {
    section.our__Client_contain p {
        padding: 0 50px
    }
    section.our_brand.padding.our__Client_contain {
        padding-left: 20px;
        padding-right: 20px
    }
}

@media (min-width:1024px) {
    section.our_brand.our__Client_contain .owl-carousel .owl-item:nth-child(10),
    section.our_brand.our__Client_contain .owl-carousel .owl-item:nth-child(12) {
        width: 150px !important
    }
}