@import url(/assets/fonts/et-line.woff);@font-face {
    font-family: et-line;
    src: url(/assets/fonts/et-line.woff) format("woff");
    font-style: normal;
    font-weight: 400
}

body {
    color: #6f6f6f;
    font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    -webkit-font-smoothing: subpixel-antialiased;
    font-family: 'Varela Round',sans-serif;
    padding-top: 56px;
}

h1,h2,h3,h4,h5,h6,p {
    font-family: Poppins,sans-serif
}

.fw-600 {
    font-weight: 600
}

.fw-800 {
    font-weight: 800
}
.rbImage.hform img {
    /* max-width: 100px; */
}

.font-normal img {
    max-width: 50px;
    margin-right: 10px;
}
section.bg-neutral-600.border-b.border-white.border-opacity-15.py-3 {
    background: #1b91b5;
    position: fixed;
    top: 0;
    width: 100%;
    /* margin-bottom: 32px; */
    z-index: 1000;
}
.font-normal span {
    margin-left: 10px;
}
.sub-menu{
    display:none;
    list-style:none;
    margin-top: 10px;
}
ul.sub-menu.slide {
    display: block;
}
.service svg {
    width: 46px;
    fill: #fff;
    position: absolute;
    right: -100px;
    top: 13px;
    transition: all .3s ease-in-out;
}
.slideDown svg {
    transform: rotate(180deg);
}
.after::after,.before:before {
    content: '';
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
    position: absolute
}
/*.social-share li:last-child svg {*/
/*    width: 20px;*/
/*    fill: #1b91b5;*/
/*    position: relative;*/
/*    top: 7px;*/
/*}*/
.icon-mobile::before {
    content: "\e000"
}

a {
    transition: all .3s ease;
    color: #6f6f6f
}

a:hover {
    text-decoration: none
}

.transition {
    transition: all .3s ease
}

.theme-bg {
    background: linear-gradient(45deg,#00a4bd,#00bda5)
}

.theme-color {
    color: #1b91b5
}

.theme-btn {
    padding: 7px 15px;
    border-radius: 22px;
    background: linear-gradient(45deg,#00a4bd,#00bda5);
    border: 2px solid transparent;
    color: #fff
}

.theme-btn:hover {
    border: 2px solid #1b91b5;
    color: #1b91b5;
    background: #fff
}

.fs-12 {
    font-size: 12px
}

.fs-14 {
    font-size: 14px
}

.fs-16 {
    font-size: 16px
}

.fs-18 {
    font-size: 18px
}

.fs-20 {
    font-size: 20px
}

.fs-24 {
    font-size: 24px
}

.fs-65 {
    font-size: 65px
}

.top-0 {
    top: 0
}

.right-0 {
    right: 0
}

.bottom-0 {
    bottom: 0
}

.left-0 {
    left: 0
}

.zin-1 {
    z-index: 1
}

.zin-2 {
    z-index: 2
}

.zin-3 {
    z-index: 3
}

.zin-4 {
    z-index: 4
}

.themetx-shadow {
    text-shadow: 0 2px 2px rgba(1,12,15,.77)
}

.section-title {
    padding-bottom: 15px;
    font-size: 32px;
    font-weight: 600
}

.section-title:before {
    background: #1b91b5;
    height: 3px;
    bottom: 0;
    width: 30px;
    top: auto
}

.mauto-before:before {
    margin: auto
}

.section-padding {
    padding-top: 70px;
    padding-bottom: 70px
}

.site-header {
    z-index: 10;
    padding-top: 65px;
}

.floating-wpp-button {
    position: fixed;
    bottom: 20px;
    left: 25px;
    max-width: 50px;
    width: 100%;
    z-index: 1000
}

.home.fixed .site-header {
    background: #fff;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
    position: fixed!important
}

body:not(.home) .site-header.transition {
    position: static!important;
    background-image: linear-gradient(45deg,#00a4bd,#00bda5);
    padding-top: 0px;
    padding-bottom: 0px;
    height: 135px;
}

.menu-wily-top-menu-container {
    min-height: 60px;
    display: flex;
    width: 100%
}

.navbar-brand {
    max-width: 130px;
}

.wily-logo {
    display: none
}

.fixed .wily-logo-white {
    display: none
}

.fixed .wily-logo {
    display: block
}

.home .fixed .navbar-brand {
    color: #1b91b5!important
}

.top-bar-menu {
    position: fixed;
    visibility: hidden;
    opacity: 0;
    z-index: 100;
    pointer-events: none
}

.mobile-open .top-bar-menu {
    visibility: visible;
    opacity: 1;
    pointer-events: auto
}

.site-header ul>li>a {
    color: #fff;
    padding-right: 5px;
    padding-left: 5px;
    white-space: normal;
    font-family: Poppins
}

.site-header ul>li>a:after {
    transform: translate3d(0,0,0);
    z-index: 1;
    left: 0;
    right: 0;
    height: 3px;
    bottom: 0;
    background: #fff;
    top: 100%;
    width: 0%;
    transition: all .3s ease
}

.site-header ul>li>a:hover:after {
    width: 100%
}

.site-header ul>li>a:hover {
    opacity: .7
}

.bg-left {
    left: 0;
    top: 0;
    z-index: 2
}

.banner h1,.banner h1 .wrap {
    font-size: 68px
}

.item.before:before {
    background: rgba(82,98,237,.5)
}

.banner .item {
    height: 100vh;
    background-size: cover!important
}

.owl-carousel.owl-drag .owl-item {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.scroll-down {
    bottom: 90px;
    left: 50%;
    z-index: 2;
    display: inline-block;
    -webkit-transform: translate(0,-50%);
    transform: translate(0,-50%);
    color: #fff;
    font: normal 400 20px/1 'Josefin Sans',sans-serif;
    letter-spacing: .1em;
    text-decoration: none;
    transition: opacity .3s
}

.scroll-down span {
    top: 0;
    left: 50%;
    width: 30px;
    height: 50px;
    margin-left: -15px;
    border: 2px solid #fff;
    border-radius: 50px;
    box-sizing: border-box
}

.scroll-down span:before {
    position: absolute;
    top: 10px;
    left: 50%;
    content: '';
    width: 6px;
    height: 6px;
    margin-left: -3px;
    background-color: #fff;
    border-radius: 100%;
    -webkit-animation: sdb10 2s infinite;
    animation: sdb10 2s infinite;
    box-sizing: border-box
}

.getin-touch {
    top: 50%;
    left: 50%;
    z-index: 8;
    transform: translate(-50%,-50%)
}

.inner-banner {
    background-attachment: scroll;
    min-height: 365px;
    background-size: cover!important
}

.inner-banner:before {
    background: rgb(27,145,181,.6)
}

.about-right {
    background-size: cover!important
}

.about-right:before {
    background: rgba(82,98,237,.5)
}

.read-more {
    z-index: 1000;
    position: relative
}

.read-more svg {
    height: 17px;
    width: 20px!important;
    position: relative;
    top: 1px
}

.services {
    background-color: #fafbfe
}

.our-work .section-title:before,.why-choose .section-title:before {
    margin: auto
}

.why-choose .card {
    -webkit-box-shadow: 0 10px 50px rgba(166,209,237,.2);
    box-shadow: 0 10px 50px rgba(166,209,237,.2)
}

.why-choose .card .icon {
    width: 70px;
    height: 70px;
    background: linear-gradient(45deg,#00a4bd,#00bda5);
    box-shadow: 0 8px 32px rgba(27,145,181,.4)
}

.why-choose .card:hover {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
    -webkit-box-shadow: 0 1rem 3rem rgba(31,45,61,.125);
    box-shadow: 0 1rem 3rem rgba(31,45,61,.125);
    background: linear-gradient(45deg,#00a4bd,#00bda5)
}

.card:hover .icon {
    background: #fff!important
}

.card:hover .icon i {
    color: #1b91b5!important
}

.why-choose .card:hover h5,.why-choose .card:hover i,.why-choose .card:hover p {
    color: #fff
}

.text-medium-gray {
    color: #fff;
    font-size: 35px;
    font-style: normal
}

.card h5 {
    color: #232323;
    font-family: Nunito,sans-serif
}

.card p {
    color: #6f6f6f;
    font-family: Nunito,sans-serif
}

.text-medium-gray:before {
    font-family: et-line
}

.icon-desktop::before {
    content: "\e002"
}

.icon-pricetags::before {
    content: "\e02f"
}

.icon-chat::before {
    content: "\e049"
}

.icon-mobile::before {
    content: "\e000"
}

.icon-target::before {
    content: "\e04e"
}

.icon-tools-2::before {
    content: "\e034";
    font-family: et-line
}

.oour-work ul {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.our-work ul>li {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: calc(25% - 10px);
    position: relative;
    width: 100%;
    margin: 5px;
    border: 5px solid #1b91b5;
    box-sizing: border-box
}

.animated-item {
    visibility: hidden;
    opacity: 0;
    bottom: 0
}

.our-work ul>li:hover .item-category,.our-work ul>li:hover .item-title {
    visibility: visible;
    opacity: 1
}

.item-meta:hover .animated-item {
    visibility: visible;
    opacity: 1
}

.item-title {
    font-size: 28px;
    line-height: 30px;
    font-weight: 700;
    margin-bottom: 10px;
    opacity: 0;
    margin-left: -100px;
    pointer-events: none;
    transition: all .5s ease-in-out;
    text-align: left
}

.item-meta:hover .item-category,.item-meta:hover .item-title {
    opacity: 1;
    margin-left: 0
}

.item-category {
    font-size: 14px;
    line-height: 14px;
    opacity: 0;
    margin-left: 25px;
    transition: all .5s ease-in-out;
    text-align: left;
    pointer-events: none
}

.our-work ul>li a {
    width: 0;
    height: 0;
    transition: all .5s ease-in-out
}

.our-work ul>li:hover a {
    width: 100%;
    height: 100%
}

.item-meta::before {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    transform: scale(0);
    transform-origin: center bottom;
    transition: all .5s ease-in-out
}

.our-work ul>li:hover .item-meta:before {
    background-color: rgb(27,145,181,.7);
    width: 100%;
    height: 100%;
    transform: scale(1)
}

.footer-sec {
    color: #6f6f6f;
    visibility: visible;
    background: url(assets/images/map-compressor.png) no-repeat bottom;
    background-size: auto;
    background-color: rgba(0,0,0,.02);
    background-size: auto;
    background-size: 100%;
    border-top: 1px solid #dedede
}

.social-share a {
    font-size: 13px;
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-align: center;
    border: 2px solid transparent;
    color: #1b91b5;
    margin: 0 0 5px
}

.social-share a:after {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    border-width: 2px;
    border-style: solid;
    border-color: transparent;
    transition: transform .3s ease .3s,border-color .4s ease .1s;
    transform: scale(1.4);
    border-radius: 1000px
}

.social-share a:hover:after {
    -webkit-transition: -webkit-transform ease .3s,border-color ease .1s;
    -moz-transition: -moz-transform ease .3s,border-color ease .1s;
    -ms-transition: -ms-transform ease .3s,border-color ease .1s;
    -o-transition: -o-transform ease .3s,border-color ease .1s;
    transition: transform ease .3s,border-color ease .1s;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    border-color: #111
}

.copy-right {
    border-top: 1px solid #dedede
}

.add-agra,.add-delhi {
    background-size: cover!important
}

.add-agra .section-title:before,.add-delhi .section-title:before {
    margin: auto
}

.add-delhi .section-title:before {
    background: #fff
}

.add-agra .section-title:before {
    background: #1b91b5
}

.add-delhi:before {
    background: rgb(27,145,181,.6)
}

.add-agra:before {
    background-color: rgba(20,22,24,.85)
}

.form-section {
    border: 1px solid #eaf0f6;
    -webkit-box-shadow: 0 10px 60px rgba(50,50,93,.1);
    box-shadow: 0 10px 60px rgba(50,50,93,.1);
    z-index: 1
}

.team-section {
    height: calc(100vh - 95px)
}

.team-section:before {
    background: rgb(27,145,181,.2)
}

.our-team {
    background-color: #fafBFEAB;
    padding-bottom: 0;
    margin-top: -200px;
    padding-bottom: 80px;
    position: relative
}

.desc-icon {
    width: 50px;
    height: 50px
}

.employe-area {
    overflow: hidden;
    box-shadow: 0 25px 50px -15px rgba(0,0,0,.4)
}

.employe-area.position-relative::before {
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    background: -moz-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    background: -ms-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    background: -o-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    background: linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    -webkit-transform: skewX(-25deg);
    -moz-transform: skewX(-25deg);
    -ms-transform: skewX(-25deg);
    -o-transform: skewX(-25deg);
    transform: skewX(-25deg);
    backface-visibility: hidden;
    z-index: -2
}

.employe-area.position-relative:hover::before {
    -webkit-animation: shine 1s;
    animation: shine 1s;
    z-index: 1
}

@-webkit-keyframes shine {
    100% {
        left: 100%
    }
}

@keyframes shine {
    100% {
        left: 100%
    }
}

.employe-desc {
    background: rgb(27,145,181,.6)
}

.aboutTypeWrite {
    display: inline-block;
    font-size: 65px
}

section.building .card.rounded {
    padding: 25px
}

section.building .card.rounded .icon img,section.process .card.rounded i img {
    max-width: 50px
}

.nav-pills a:hover {
    color: #333
}

.nav-pills strong {
    font-size: 54px
}

.nav-pills .active {
    border-color: #eb3719!important
}

.box {
    border-bottom: 1px solid #dee2e6!important;
    position: relative;
    cursor: pointer;
    overflow: hidden
}

.box .thumb {
    height: 175px;
    position: relative;
    transition: all .4s ease-in-out
}

.ov {
    left: 15px;
    top: 0;
    opacity: 0;
    width: 0;
    height: 0;
    max-width: calc(100% - 30px);
    max-height: calc(100% - 1.5rem);
    overflow: hidden;
    z-index: 2;
    background: #fff
}

.bg-secondary {
    background-color: #1b91b5!important
}

.ov.theme-gradient:before {
    background: rgba(235,55,25,.9);
    right: auto;
    width: 50%
}

.ov>* {
    opacity: 0
}

.ov .close {
    top: 0;
    right: 0;
    width: 30px;
    height: 30px;
    opacity: 1;
    font-size: 0;
    cursor: pointer;
    outline: 0!important;
    box-shadow: none!important;
    background: 0 0
}

button.close:after,button.close:before {
    background: #eb3719;
    opacity: 1
}

.ov .close .bdr {
    height: 30px;
    width: 30px;
    border: 2px solid #eb3719;
    background: 0 0;
    margin: auto;
    transform: scale(.85);
    border-radius: 100%;
    transition: all ease-in-out .25s
}

.ov .close:hover .bdr {
    transform: scale(1)
}

.ov {
    overflow: hidden
}

.ov.theme-gradient .half-g {
    position: absolute;
    z-index: -1;
    opacity: .1!important;
    transform: scale(2.3);
    top: 360px;
    left: -180px
}

.box span {
    left: -20px;
    margin: auto;
    top: 0;
    font-size: 15rem;
    font-weight: 700;
    background-image: url(assets/images/lines.png);
    background-size: auto auto;
    background-position: left -50% top;
    background-repeat: repeat;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    line-height: 160px;
    height: 100%
}

.services .row>div:nth-child(3) .box span {
    left: 3px
}

.box span+span {
    -webkit-text-fill-color: #de00000d
}

.sub-heading {
    font-size: 1.2rem
}

.box .content {
    overflow: hidden;
    position: relative;
    transition: all .4s ease-in-out
}

.box:hover .content,.box:hover .thumb {
    transform: translateY(-33px);
    z-index: 1
}

.box .btn {
    background: #eb3719;
    left: 0;
    right: 0;
    padding: 5px;
    font-size: .9rem;
    bottom: 0;
    opacity: 0;
    z-index: 2;
    transform: translateY(35px);
    transition: all .4s ease-in-out
}

.box:hover {
    box-shadow: 0 25px 50px -15px rgba(0,0,0,.4)
}

.box:before {
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    background: -moz-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    background: -ms-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    background: -o-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    background: linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    -webkit-transform: skewX(-25deg);
    -moz-transform: skewX(-25deg);
    -ms-transform: skewX(-25deg);
    -o-transform: skewX(-25deg);
    transform: skewX(-25deg);
    backface-visibility: hidden;
    z-index: -2
}

.box:hover:before {
    -webkit-animation: shine 1s;
    animation: shine 1s;
    z-index: 100
}

.box:hover .btn {
    opacity: 1;
    transform: translateY(0)
}

.exp-box {
    box-shadow: 0 0 45px rgba(0,0,0,.13)
}

.exp {
    font-size: 109px
}

.exp-9 {
    font-weight: 900;
    -webkit-text-stroke: 2px #1b91b5;
    -webkit-text-fill-color: #fff;
    line-height: .8
}

.exp-box .vt {
    color: #1b91b5;
    font-size: 15%;
    font-weight: 700;
    transform: rotate(90deg);
    display: inline-block;
    transform-origin: 0 0;
    margin-left: 31px;
    white-space: nowrap
}

.exp-text {
    color: #666;
    font-weight: 700;
    font-size: 1.875rem;
    line-height: .9;
    transform: translateX(-54px)
}

.exp-text span {
    display: block;
    font-size: 65%;
    font-weight: 600
}

.stats .st-title {
    font-size: calc(36rem / 16);
    font-weight: 700;
    color: #1b91b5;
    line-height: 1.1
}

.stats .st-title span {
    display: block;
    font-size: 60%
}

.st-count div {
    color: #666;
    font-weight: 700;
    font-size: 2.5rem;
    line-height: .5
}

.st-count div span {
    font-size: 30%;
    font-weight: 400
}

#secondary form {
    display: none
}

#secondary ul {
    list-style: none;
    padding-left: 0
}

.blog-banner {
    background-size: cover
}

.blog-banner::before {
    background: rgba(27,145,181,.3);
    z-index: 0
}

@-webkit-keyframes sdb10 {
    0% {
        -webkit-transform: translate(0,0);
        opacity: 0
    }

    40% {
        opacity: 1
    }

    80% {
        -webkit-transform: translate(0,20px);
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@-webkit-keyframes topBar_open {
    0% {
        -webkit-transform: translateY(0) rotate(0);
        transform: translateY(0) rotate(0);
        width: 60px
    }

    10% {
        -webkit-transform: translateY(-8px) rotate(0);
        transform: translateY(-8px) rotate(0);
        width: 60px
    }

    50% {
        -webkit-transform: translateY(25px) rotate(45deg);
        transform: translateY(25px) rotate(45deg);
        width: 84px
    }

    75% {
        -webkit-transform: translateY(12px) rotate(45deg);
        transform: translateY(12px) rotate(45deg);
        width: 84px
    }

    100% {
        -webkit-transform: translateY(17px) rotate(45deg);
        transform: translateY(17px) rotate(45deg);
        width: 84px
    }
}

@keyframes topBar_open {
    0% {
        -webkit-transform: translateY(0) rotate(0);
        transform: translateY(0) rotate(0);
        width: 60px
    }

    10% {
        -webkit-transform: translateY(-8px) rotate(0);
        transform: translateY(-8px) rotate(0);
        width: 60px
    }

    50% {
        -webkit-transform: translateY(25px) rotate(45deg);
        transform: translateY(25px) rotate(45deg);
        width: 84px
    }

    75% {
        -webkit-transform: translateY(12px) rotate(45deg);
        transform: translateY(12px) rotate(45deg);
        width: 84px
    }

    100% {
        -webkit-transform: translateY(17px) rotate(45deg);
        transform: translateY(17px) rotate(45deg);
        width: 84px
    }
}

@-webkit-keyframes bottomBar_open {
    0% {
        -webkit-transform: translateY(0) rotate(0);
        transform: translateY(0) rotate(0);
        width: 60px
    }

    10% {
        -webkit-transform: translateY(-8px) rotate(0);
        transform: translateY(-8px) rotate(0);
        width: 60px
    }

    60% {
        -webkit-transform: translateY(0) rotate(-45deg);
        transform: translateY(0) rotate(-45deg);
        width: 84px
    }

    75% {
        -webkit-transform: translateY(-10px) rotate(-45deg);
        transform: translateY(-10px) rotate(-45deg);
        width: 84px
    }

    100% {
        -webkit-transform: translateY(-8px) rotate(-45deg);
        transform: translateY(-8px) rotate(-45deg);
        width: 84px
    }
}

@keyframes bottomBar_open {
    0% {
        -webkit-transform: translateY(0) rotate(0);
        transform: translateY(0) rotate(0);
        width: 60px
    }

    10% {
        -webkit-transform: translateY(-8px) rotate(0);
        transform: translateY(-8px) rotate(0);
        width: 60px
    }

    60% {
        -webkit-transform: translateY(0) rotate(-45deg);
        transform: translateY(0) rotate(-45deg);
        width: 84px
    }

    75% {
        -webkit-transform: translateY(-10px) rotate(-45deg);
        transform: translateY(-10px) rotate(-45deg);
        width: 84px
    }

    100% {
        -webkit-transform: translateY(-8px) rotate(-45deg);
        transform: translateY(-8px) rotate(-45deg);
        width: 84px
    }
}

@-webkit-keyframes menuLabel_open {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }

    25% {
        -webkit-transform: translateY(-18px);
        transform: translateY(-18px)
    }

    45% {
        -webkit-transform: translateY(44px);
        transform: translateY(44px);
        opacity: 1
    }

    48% {
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0
    }
}

@keyframes menuLabel_open {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }

    25% {
        -webkit-transform: translateY(-18px);
        transform: translateY(-18px)
    }

    45% {
        -webkit-transform: translateY(44px);
        transform: translateY(44px);
        opacity: 1
    }

    48% {
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0
    }
}

@-webkit-keyframes topBar_close {
    0% {
        -webkit-transform: translateY(17px) rotate(45deg);
        transform: translateY(17px) rotate(45deg);
        width: 84px
    }

    35% {
        -webkit-transform: translateY(-8px) rotate(-4deg);
        transform: translateY(-8px) rotate(-4deg);
        width: 60px
    }

    53% {
        -webkit-transform: translateY(10px) rotate(3deg);
        transform: translateY(10px) rotate(3deg);
        width: 60px
    }

    70% {
        -webkit-transform: translateY(-6px) rotate(0);
        transform: translateY(-6px) rotate(0);
        width: 60px
    }

    100% {
        -webkit-transform: translateY(-2px) rotate(0);
        transform: translateY(-2px) rotate(0);
        width: 60px
    }
}

@-webkit-keyframes bottomBar_close {
    0% {
        -webkit-transform: translateY(-8px) rotate(-45deg);
        transform: translateY(-8px) rotate(-45deg);
        width: 84px
    }

    35% {
        -webkit-transform: translateY(-18px) rotate(6deg);
        transform: translateY(-18px) rotate(6deg);
        width: 60px
    }

    53% {
        -webkit-transform: translateY(0) rotate(-3deg);
        transform: translateY(0) rotate(-3deg);
        width: 60px
    }

    68% {
        -webkit-transform: translateY(-7px) rotate(0);
        transform: translateY(-7px) rotate(0);
        width: 60px
    }

    100% {
        -webkit-transform: translateY(0) rotate(0);
        transform: translateY(0) rotate(0);
        width: 60px
    }
}

@-webkit-keyframes menuLabel_close {
    0% {
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0
    }

    5% {
        -webkit-transform: translateY(25px);
        transform: translateY(25px);
        opacity: 1
    }

    25% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 1
    }

    37% {
        -webkit-transform: translateY(-22px);
        transform: translateY(-22px);
        opacity: 1
    }

    45% {
        -webkit-transform: translateY(-22px);
        transform: translateY(-22px);
        opacity: 1
    }

    58% {
        -webkit-transform: translateY(8px) rotate(-10deg);
        transform: translateY(8px) rotate(-10deg);
        opacity: 1
    }

    83% {
        -webkit-transform: translateY(-6px) rotate(0);
        transform: translateY(-6px) rotate(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

#menu-btn {
    text-align: center;
    width: 60px;
    height: 65px;
    z-index: 15;
    right: 15px;
    top: 15px;
    z-index: 101
}

body:not(.home) #menu-btn {
    top: 4px
}

.home.fixed #menu-btn {
    top: 3px;
    height: 25px
}

.home.fixed #menu-btn .text {
    bottom: 3px;
    font-size: 14px;
    left: 7px
}

.home.fixed .d-block.close .text {
    bottom: 10px!important
}

:not(.fixed) .d-block.close .text {
    bottom: 5px!important
}

#menu-btn:after,#menu-btn:before {
    content: '';
    width: 100%;
    height: 8px;
    background-color: #fff;
    display: block;
    position: absolute;
    border-radius: 20px
}

.fixed #menu-btn::after {
    right: 0;
    top: 20px
}

.fixed #menu-btn:after,.fixed #menu-btn:before {
    height: 5px
}

.fixed #menu-btn::before {
    top: -2px
}

.home.fixed #menu-btn:after,.home.fixed #menu-btn:before {
    background-color: #1b91b5
}

.home.fixed #menu-btn .text {
    color: #1b91b5
}

#menu-btn:before {
    -webkit-transform-origin: left center;
    transform-origin: left center
}

#menu-btn:after {
    right: 0;
    top: 25px;
    -webkit-transform-origin: right center;
    transform-origin: right center
}

#menu-btn .text {
    color: #fff;
    font-family: Candal,sans-serif;
    display: block;
    position: absolute;
    bottom: 0;
    font-size: 17px;
    letter-spacing: 2.5px
}

#menu-btn:hover {
    cursor: pointer
}

#menu-btn.open:before {
    -webkit-animation: topBar_open 1s ease-in-out;
    animation: topBar_open 1s ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

#menu-btn.open:after {
    -webkit-animation: bottomBar_open 1s ease-in-out;
    animation: bottomBar_open 1s ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

#menu-btn.open .text {
    -webkit-animation: menuLabel_open 1s ease-in;
    animation: menuLabel_open 1s ease-in;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

#menu-btn.close:before {
    -webkit-animation: topBar_close 1s ease-in-out;
    animation: topBar_close 1s ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

#menu-btn.close:after {
    -webkit-animation: bottomBar_close 1s ease-in-out;
    animation: bottomBar_close 1s ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

#menu-btn.close .text {
    -webkit-animation: menuLabel_close 1s ease-in;
    animation: menuLabel_close 1s ease-in;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

@media (min-width: 768px) {
    .h-100vh {
        height:100vh
    }
}

@media (min-width: 1024px) {
    .banner:before {
        top:0;
        left: 0;
        width: 65%;
        border-right: 5px solid #fff;
        background-image: linear-gradient(to top,rgb(0,164,189,.7),rgb(0,189,165,.7));
        z-index: 2;
        transform-origin: top;
        height: 100%;
        transform: skew(-25deg)
    }
}

@media (min-width: 1200px) {
    .container {
        max-width:1170px
    }
}

@media (max-width: 991.98px) {
    .exp-text,.stats .st-title+div {
        border:none!important
    }
}

@media (max-width: 767.98px) {
    .site-header {
    
    padding-top: 125px;
}
#menu-btn {
      top: 0px;
}
    .navbar-brand {
   
    padding-left: 0;
    margin-left: 0 !important;
    position: relative;
    left: -20px;
}
    .aboutTypeWrite,.banner h1,.banner h1 .wrap,.fs-65 {
        font-size:30px
    }

    .ourwork-container {
        padding-left: 15px;
        padding-right: 15px
    }

    h1 {
        font-size: 32px
    }

    .w-50 {
        width: 100%!important
    }

    .section-padding {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .navbar {
        padding: 0!important
    }

    .home .fixed #about {
        padding-top: 20px
    }

    #menu-btn {
        height: 55px
    }

    .about-right {
        height: 365px
    }

    .site-header ul>li {
        margin-bottom: 10px
    }

    .our-work ul>li {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        position: relative;
        width: 100%;
        margin: 0 0 10px
    }

    .our-team {
        margin-top: -150px
    }

    .exp-text,.st-count div,.stats .st-title {
        font-size: calc(21rem / 16)
    }

    .st-count div {
        flex: 0 0 33.333%;
        margin-bottom: 10px;
    }

    .st-count {
        flex-wrap: wrap;
    }

    .exp {
        font-size: 100px
    }
}

.call-popup .close {
    background: #000;
    padding: 7px!important;
    border-radius: 50%;
    top: 15px!important;
    position: absolute;
    right: 31px;
    top: 30px!important;
    width: 35px;
    height: 35px;
    z-index: 1
}

.call-popup .close svg {
    width: 17px;
    margin-top: -4px
}