body {font-family: "Mulish", sans-serif;}
* {margin: 0; padding: 0; list-style: none;}
a {text-decoration: none; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
::selection {color: #fff; background-color: #2c52b4;}

/**** heeader ****/
header {margin: 0; padding: 0; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); position: sticky; z-index: 99999; top: 0;}
header .navbar-brand {padding: 0;}
header .navbar-brand img {max-width: 100%;}
header nav {margin: 0; padding: 0 !important; display: flex !important; align-items: center !important; flex-wrap: wrap !important; justify-content: space-between !important;}
header nav #navbarSupportedContent {display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; flex-basis: auto; flex-grow: inherit;}
header nav ul.navbar-nav {display: flex; align-items: center; flex-wrap: wrap;}
header nav ul.navbar-nav li {display: inline-flex; align-items: center; flex-wrap: wrap;}
header nav ul.navbar-nav li a {font-size: 18px; font-weight: 500; color: #000; padding: 4px 10px; margin-right: 20px; border-radius: 3px;}
header nav ul.navbar-nav li a:hover, header nav ul.navbar-nav li a.active {background: #2c52b4; color: #fff !important;}

/**** banner ****/
#banner {margin: 0; padding: 0; height: calc(100vh - 100px); position: relative;}
#banner .stepsWrapper {position: absolute; top: 0; right: 200px; height: 100%; z-index: 2; width: 280px;}
#banner .stepsWrapper img {height: 100%; padding-bottom: 20px;}
#banner #bannerSlider, #banner #bannerSlider .owl-stage-outer, #banner #bannerSlider .owl-stage, #banner #bannerSlider .owl-stage .owl-item {height: 100%;}
#banner #bannerSlider .owl-stage .owl-item .item {height: 100%; position: relative;}
#banner #bannerSlider .owl-stage .owl-item .item:before {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4);}
#banner #bannerSlider .owl-stage .owl-item .item .bannerContent {position: relative; height: 100%; display: flex; align-items: center; flex-wrap: wrap; width: calc(100% - 200px); margin: 0 auto; padding-left: 220px; -webkit-transition: all 1.25s ease-in-out; -moz-transition: all 1.25s ease-in-out; -o-transition: all 1.25s ease-in-out; transition: all 1.25s ease-in-out; opacity: 0;}
#banner #bannerSlider .owl-stage .owl-item .item .bannerContent:before {background: url(../images/banner-blue-vector.png) no-repeat left center; position: absolute; left: 0; top: 0; content: ""; width: 100%; height: 100%;}
#banner #bannerSlider .owl-stage .owl-item.active .item .bannerContent {opacity: 1;}
#banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent {position: relative; z-index: 1; width: 100%; max-width: 700px;}
#banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent h1 {margin: 0; padding: 0 0 30px 0; font-size: 70px; color: #fff; font-weight: 600; text-shadow: 6px 6px 0px rgba(0, 0, 0, 0.25);}
#banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent p {margin: 0; padding: 0 0 30px 0; font-size: 30px; color: #fff; font-weight: 400;}
#banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent a {padding: 0; font-size: 24px; color: #fff; font-weight: 400; padding: 10px 20px; background: #1F1F1F; border-radius: 16px 8px 16px 8px;}
#banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent a:hover {background: #fff; color: #1F1F1F;}
#bannerSlider .owl-nav {position: absolute; top: 50%; right: 80px; width: 60px;}
#bannerSlider .owl-nav button {width: 60px; height: 60px; border-radius: 100%; background: rgba(0, 0, 0, 0.5); color: #fff; margin: 10px 0;}
#bannerSlider .owl-nav button span.material-icons {font-size: 31px;}

/**** about ****/
#about {margin: 0; padding: 100px 0; position: relative;}
#about:before {content: ""; background: url(../images/about-top-background.png) no-repeat left top; background-size: cover; width: 310px; height: 492px; position: absolute; top: 0; left: 0;}
#about .topContent {margin: 0; padding: 0 0 40px 0; text-align: center;}
#about .topContent label {margin: 0; padding: 0; text-transform: uppercase; font-size: 18px; font-weight: 400; color: #000;}
#about .topContent h1 {margin: 0; padding: 0; font-size: 32px; font-weight: 700; color: #3F3F3F;}
#about .topContent h1 span {color: #2c52b4;}
#about .aboutImageWrapper {position: relative;}
#about .aboutImageWrapper img {position: relative; z-index: 1;}
#about .aboutImageWrapper:before{content: ""; position: absolute; background: url(../images/dots-vector-light.svg) no-repeat; left: -66px; top: -66px; width: 132px; height: 132px; z-index: 0;}
#about .aboutImageWrapper:after {content: ""; position: absolute; background: url(../images/dots-vector-dark.svg) no-repeat; right: -66px; bottom: -66px; width: 132px; height: 132px; z-index: 0;}
#about .aboutContent a {color: #000; font-size: 18px; font-weight: 500; display: inline-flex; align-items: center; flex-wrap: wrap;}
#about .aboutContent a:hover {color: #2c52b4;}
#about .aboutContent .stat-wrap {width: 100%; max-width: 400px; margin: 30px auto 0 auto; display: flex; align-items: center; flex-wrap: wrap;}
#about .aboutContent .stat-wrap div {display: inline-flex; align-items: center; flex-wrap: wrap; justify-content: center; width: 50%;}
#about .aboutContent .stat-wrap div:nth-child(1) {border-right: 1px solid #D4D4D4;}
#about .aboutContent .stat-wrap div ul {margin: 0; padding: 0;}
#about .aboutContent .stat-wrap div ul li {display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
#about .aboutContent .stat-wrap div ul li:nth-child(1) {font-size: 51px; font-weight: 600; color: #000;}
#about .aboutContent .stat-wrap div ul li label {font-size: 24px; font-weight: 300; color: #000;}

/**** challenges ****/
#challenges {margin: 0; padding: 100px 0;}
#challenges h2 {margin: 0; padding: 0 0 40px 0; color: #3F3F3F; font-size: 40px; font-weight: 700; text-align: center;}
#challenges .rowFlex {display: flex; flex-wrap: wrap; justify-content: center;}
#challenges .rowFlex .rowInFlex {display: inline-flex; flex-wrap: wrap; justify-content: center;}
#challenges .rowFlex .rowInFlex .challengesContentWrapper {background: rgba(44, 82, 180, 0.1); width: 100%; margin-bottom: 20px; padding: 15px; display: flex; flex-wrap: wrap; justify-content: center;}
#challenges .rowFlex .rowInFlex .challengesContentWrapper .image {width: 100%; text-align: center;}
#challenges .rowFlex .rowInFlex .challengesContentWrapper .image img {max-width: 60px;}
#challenges .rowFlex .rowInFlex .challengesContentWrapper .content {width: 100%;}
#challenges .rowFlex .rowInFlex .challengesContentWrapper .content h3 {margin: 20px 0 0 0; padding: 0; text-align: center; color: #2C52B4; font-size: 20px; font-weight: 700;}

/**** technologyServices ****/
#technologyServices {margin: 0; padding: 0 0 120px 0; background: url(../images/technology-layer-bg.png) no-repeat right bottom;}
#technologyServices h2 {margin: 0; padding: 0 0 10px 0; color: #3F3F3F; font-size: 40px; font-weight: 700; text-align: center;}
#technologyServices label {margin: 0 0 100px 0; padding: 0; color: #000; font-size: 20px; font-weight: 500; text-align: center; width: 100%;}
#technologyServices label span {color: #2c52b4;}
#technologyServices #techServicesCarousel .owl-stage-outer {padding: 65px 0 0 0;}
#technologyServices #techServicesCarousel .owl-stage-outer .owl-stage {display: flex; flex-wrap: wrap;}
#technologyServices #techServicesCarousel .owl-stage-outer .owl-stage .item {display: flex; flex-wrap: wrap; height: 100%;}
#technologyServices #techServicesCarousel img {max-width: 60px;}
#technologyServices #techServicesCarousel .owl-nav {position: absolute; top: calc(50% + 32px); width: calc(100% + 120px); left: -60px; transform: translateY(-50%); display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between;}
#technologyServices #techServicesCarousel .owl-nav button {width: 40px; height: 40px; border-radius: 100%; background: rgba(0, 0, 0, 0.5); color: #fff; margin: 10px 0; display: flex; align-items: center; flex-wrap: wrap; justify-content: center}
#technologyServices .rowFlex {display: flex; flex-wrap: wrap; justify-content: center;}
#technologyServices .rowFlex .rowInFlex {display: inline-flex; flex-wrap: wrap; justify-content: center;}
#technologyServices .boxWrapper {background: linear-gradient(to right,  #eaeaed 0%,#ffffff 100%); position: relative; padding-top: 80px; padding-bottom: 30px;}
#technologyServices .boxWrapper:after {width: 100%; height: 100%; top: 0; right: 0; background: url(../images/box-pattern-bg.png) no-repeat right center; position: absolute; content: "";}
#technologyServices .boxWrapper .iconWrapper {position: absolute; left: 50%; transform: translateX(-50%); top: -55px; width: 110px; height: 110px; display: flex; align-items: center; flex-wrap: wrap; justify-content: center; border-radius: 100%; background: linear-gradient(to bottom, #4844f3 0%, #15129f 100%); z-index: 1;}
#technologyServices .boxWrapper .contentWrapper h4 {color: #2c52b4; font-size: 24px; font-weight: 700; text-align: center; margin: 0; padding: 0;}
#technologyServices .boxWrapper .contentWrapper p {margin: 0; padding: 10px 20px; text-align: center; font-size: 18px; color: #000; font-weight: 500;}
#technologyServices h3 {margin: 50px 0 0 0; padding: 0 0 10px 0; font-size: 26px; font-weight: 600; color: #000; text-align: center;}
#technologyServices #technologyLayer {margin-top: 50px;}
#technologyServices #technologyLayer .owl-stage-outer {z-index: 2; padding: 20px 0;}
#technologyServices #technologyLayer .item {background: rgba(44, 82, 180, 0.1); padding: 20px 10px; height: 100%; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
#technologyServices #technologyLayer .item:hover {transform: scale(1.1);}
#technologyServices #technologyLayer .item .iconWrapper {width: 100%; display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
#technologyServices #technologyLayer .item .iconWrapper img {max-width: 50px;}
#technologyServices #technologyLayer .item .contentWrapper {display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
#technologyServices #technologyLayer .item .contentWrapper h5 {color: #012068; font-size: 21px; font-weight: 700; text-transform: uppercase; margin: 0; padding: 20px 0 10px 0; width: 100%; text-align: center;}
#technologyServices #technologyLayer .item .contentWrapper p {color: #000; font-size: 16px; font-weight: 500; margin: 0; padding: 0; text-align: center;}
#technologyServices #technologyLayer .owl-stage {display: flex; flex-wrap: wrap;}
#technologyLayer .owl-nav {position: absolute; top: 50%; width: calc(100% + 120px); left: -60px; transform: translateY(-50%); display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between;}
#technologyLayer .owl-nav button {width: 40px; height: 40px; border-radius: 100%; background: rgba(0, 0, 0, 0.5); color: #fff; margin: 10px 0; display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
#technologyLayer .owl-nav button span.material-icons {font-size: 31px;}
#technologyServices .singleBtnWrapper {width: 100%; display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
#technologyServices .singleBtnWrapper a {display: inline-flex; align-items: center; flex-wrap: wrap; background: linear-gradient(135deg, #95c308 0%, #6e9103 100%); padding: 15px 80px 15px 40px; border-radius: 40px; color: #fff; font-size: 25px; margin-top: 50px; animation: scaleAnimation 1s ease-in-out .35s infinite; position: relative;     text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4); font-weight: 600;}
#technologyServices .singleBtnWrapper a sup {margin-right: 6px;}
#technologyServices .singleBtnWrapper a span.material-icons {background: #fff; color: #709303; border-radius: 100%; position: absolute; right: 5px; top: 5px; width: 58px; height: 58px; display: flex; align-items: center; flex-wrap: wrap; justify-content: center; font-size: 42px; text-shadow: none !important;}

@keyframes scaleAnimation {
    0% {transform: scale(1);}
    50% {transform: scale(1.1);}
    100% {transform: scale(1);}
}

/**** impactStory ****/
#impactStory {margin: 0; padding: 60px 0 100px 0; background: url(../images/story-background.png) no-repeat center center; background-size: cover;}
#impactStory h2 {margin: 0 0 50px 0; padding: 0; color: #fff; font-size: 40px; font-weight: 700; text-align: center;}
#impactStory .impactStoryContent {margin: 0; padding: 0;}
#impactStory .impactStoryContent ul.counterListing {margin: 0; padding: 0; display: flex; align-items: center; flex-wrap: wrap;}
#impactStory .impactStoryContent ul.counterListing li {margin: 0 3px 3px 0; padding: 10px 20px 15px 20px; background: rgba(0, 0, 0, 0.24);}
#impactStory .impactStoryContent ul.counterListing li p {margin: 0; padding: 0; font-size: 40px; font-weight: 700; color: #fff; width: 100%;}
#impactStory .impactStoryContent ul.counterListing li label {margin: 0; padding: 0; font-size: 20px; font-weight: 600; color: #fff; width: 100%;}
#impactStory .impactStoryContent h3 {margin: 30px 0; padding: 0; font-size: 38px; font-weight: 600; color: #fff;}
#impactStory .impactStoryContent ul.contentListing {margin: 0; padding: 0;}
#impactStory .impactStoryContent ul.contentListing li {margin: 0 0 10px 0; padding: 0 0 0 30px; font-size: 20px; font-weight: 400; color: #fff; background: url(../images/story-impact-icon.svg) no-repeat left 7px;}

/**** bestInIndustry ****/
#bestInIndustry {margin: 0; padding: 120px 0;}
#bestInIndustry h2 {margin: 0; padding: 0 0 10px 0; color: #2c52b4; font-size: 40px; font-weight: 700; text-align: center;}
#bestInIndustry label {margin: 0 0 100px 0; padding: 0; color: #000; font-size: 20px; font-weight: 500; text-align: center; width: 100%;}
#bestInIndustry #bestInIndustryCarousel .owl-stage-outer {z-index: 2;}
#bestInIndustry #bestInIndustryCarousel img {filter: grayscale(1); opacity: 0.7; max-height: 150px; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
#bestInIndustry #bestInIndustryCarousel img:hover {filter: grayscale(0); opacity: 1;}
#bestInIndustryCarousel .owl-nav {position: absolute; top: 50%; width: calc(100% + 120px); left: -60px; transform: translateY(-50%); display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between;}
#bestInIndustryCarousel .owl-nav button {width: 40px; height: 40px; border-radius: 100%; background: rgba(0, 0, 0, 0.5); color: #fff; margin: 10px 0; display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
#bestInIndustryCarousel .owl-nav button span.material-icons {font-size: 31px;}

#bestInIndustry .flex {display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
#bestInIndustry .flex .colInFlex {display: inline-flex; align-items: center; flex-wrap: wrap;}
#bestInIndustry .bextInIndustryLogo {display: flex; align-items: center; flex-wrap: wrap; justify-content: center; width: 100%; margin-bottom: 40px;}
#bestInIndustry .bextInIndustryLogo img {max-width: 100%; display: inline-flex; align-items: center; flex-wrap: wrap; filter: grayscale(1); opacity: 0.7; max-height: 150px; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
#bestInIndustry .bextInIndustryLogo img:hover {filter: grayscale(0); opacity: 1;}

/**** letsConnect ****/
#letsConnect {margin: 0; padding: 0 0 120px 0; background: url(../images/lets-talk-bg.png) no-repeat center top;}
#letsConnect h3 {margin: 0; padding: 0 0 10px 0; color: #2c52b4; font-size: 40px; font-weight: 700; text-align: center;}
#letsConnect h2 {margin: 0; padding: 0 0 50px 0; color: #000; font-size: 48px; font-weight: 600; text-align: center;}
#letsConnect .connectFormWrapper input[type="text"], #letsConnect .connectFormWrapper input[type="email"], #letsConnect .connectFormWrapper textarea {border: 1px solid #C2C2C2; background: #E4E4E4; font-size: 16px; color: #000; font-weight: 300; padding: 12px 20px; border-radius: 5px; margin-top: 20px;}
#letsConnect .connectFormWrapper textarea {resize: none;}
#letsConnect .connectFormWrapper input[type="text"]::-webkit-input-placeholder, #letsConnect .connectFormWrapper input[type="email"]::-webkit-input-placeholder, #letsConnect .connectFormWrapper textarea::-webkit-input-placeholder {color: #000}
#letsConnect .connectFormWrapper input[type="text"]::-moz-placeholder, #letsConnect .connectFormWrapper input[type="email"]::-moz-placeholder, #letsConnect .connectFormWrapper textarea::-moz-placeholder {color: #000}
#letsConnect .connectFormWrapper input[type="text"]:-ms-input-placeholder, #letsConnect .connectFormWrapper input[type="email"]:-ms-input-placeholder, #letsConnect .connectFormWrapper textarea:-ms-input-placeholder {color: #000}
#letsConnect .connectFormWrapper input[type="text"]:-moz-placeholder, #letsConnect .connectFormWrapper input[type="email"]:-moz-placeholder, #letsConnect .connectFormWrapper textarea:-moz-placeholder {color: #000}
#letsConnect .connectFormWrapper p.requiredTxt {margin: 0; padding: 0; font-size: 14px; color: #c50b0b;}
#letsConnect .connectFormWrapper input[type="submit"] {background: #1F1F1F; font-size: 18px; font-weight: 500; text-transform: uppercase; padding: 12px 30px; border: none; color: #fff; margin-top: 20px}
.error {color: #ff0000; font-weight: normal;}

/**** footer ****/
footer {margin: 0; padding: 80px 0 0 0; background: url(../images/footer-top-bg.png) no-repeat top center #02236c; position: relative; overflow: hidden;}
footer:before {content: ""; position: absolute; width: 236px; height: 512px; background: url(../images/footer-left-bg.png) no-repeat bottom; left: 0; bottom: 0; z-index: 1;}
footer:after {content: ""; position: absolute; width: 236px; height: 512px; background: url(../images/footer-right-bg.png) no-repeat bottom; right: 0; bottom: 0; z-index: 1;}
footer h3 {margin: 0; padding: 0 0 30px 0; color: #fff; font-size: 20px; font-weight: 600;}
footer .footerLinks {margin: 0; padding: 0; position: relative; z-index: 2;}
footer .footerLinks ul {margin: 0; padding: 0; display: flex; flex-wrap: wrap;}
footer .footerLinks ul li {margin: 0; padding: 0 0 15px 0; display: inline-flex; flex-wrap: wrap; width: 50%;}
footer .footerLinks ul li a {color: #fff; display: flex; align-items: center; flex-wrap: wrap;}
footer .footerLinks ul li a:hover {margin-left: 10px;}
footer .footerLinks ul li a span.icon {margin-right: 8px;}
footer ul.socialLinks {display: flex; align-items: center; flex-wrap: wrap; margin: 0; padding: 0;}
footer ul.socialLinks li {display: inline-flex; align-items: center; flex-wrap: wrap; width: auto !important; margin-right: 20px;}
footer ul.socialLinks li:last-child {margin-right: 0;}
footer .googleMapWrapper {margin: 0; padding: 0; position: relative; z-index: 2;}
footer .googleMapWrapper iframe {width: 100%; height: 280px;}
.footerBottomStrip {background: rgba(0, 0, 0, 0.25); text-align: center; color: rgba(255, 255, 255, 0.5); padding: 15px 0; margin-top: 60px; font-size: 12px; position: relative; z-index: 2;}
footer address {font-size: 16px; color: #fff; line-height: 30px; margin-top: 50px;}
footer address span {font-size: 21px; font-weight: 700; padding-bottom: 10px; display: flex;}

/**** innerBanner ****/
#innerBanner {background-repeat: no-repeat; background-position: center center; background-size: cover; height: 500px; position: relative; display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
#innerBanner:before {content: ""; left: 0; top: 0; position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4);}
#innerBanner h1 {position: relative; z-index: 2; margin: 0; padding: 0 0 30px 0; font-size: 80px; color: #fff; font-weight: 600; text-shadow: 6px 6px 0px rgba(0, 0, 0, 0.25);}

/**** careers ****/
#careers {margin: 0; padding: 120px 0;}
#careers h3 {color: #2c52b4; font-size: 38px; line-height: 42px; margin: 0; padding: 0 0 20px 0;}
#careers h3 span {font-weight: 800;}
#careers p {color: #000; font-size: 16px; line-height: 24px; margin: 0; padding: 0 0 30px 0;}
#careers label {background: #2c52b4; color: #fff; padding: 10px 40px 14px 40px; cursor: pointer; display: inline-flex; align-items: center; flex-wrap: wrap;}
#careers label span.material-icons {margin-right: 10px;}
#careers label:hover {background: #1a3885;}

/**** back to top ****/
.back-to-top {position: fixed; bottom: 20px; right: 20px; background: #2c52b4; color: #fff; border-radius: 100%; width: 50px; height: 50px; display: flex; align-items: center; flex-wrap: wrap; justify-content: center; z-index: 2; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
.back-to-top:hover {cursor: pointer;}

/**** thankYouWrapper ****/
#thankYouWrapper {margin: 0; padding: 100px 0;}
#thankYouWrapper h2 {font-size: 36px; text-align: center; margin: 0; padding: 0 0 20px 0; font-weight: 700; color: #2c52b4;}
#thankYouWrapper p {font-size: 20px; text-align: center; margin: 0; padding: 0 80px; font-weight: 500; color: #000;}
#thankYouWrapper .thankYouContent {display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
#thankYouWrapper .thankYouContent a {background: #2c52b4; color: #fff; padding: 16px 40px; font-size: 20px; border-radius: 31px; display: inline-flex; align-items: center; flex-wrap: wrap; justify-content: center; margin: 30px auto 0 auto; border: 2px solid #2c52b4;}
#thankYouWrapper .thankYouContent a:hover {background: none; color: #2c52b4;}

/**** media queries ****/
@media only screen and (min-width: 0px) and (max-width: 575px) {
    header .navbar-brand {max-width: 200px;}
    header button.navbar-toggler {margin-right: 15px;}
    header nav #navbarSupportedContent {display: none !important;}
    header nav #navbarSupportedContent.show {display: flex !important; width: 100%; position: absolute; top: 100%; background: rgba(255, 255, 255, 0.9); padding: 10px 0;}
    header nav ul.navbar-nav {margin: 0; width: 100%;}
    header nav ul.navbar-nav li {margin-bottom: 6px; border-bottom: 1px solid #bbb; width: 100%; justify-content: center; padding-bottom: 6px;}
    header nav ul.navbar-nav li a {margin-right: 0;}
    header nav ul.navbar-nav li:last-child {margin-bottom: 0;}
    #banner {height: 400px;}
    #banner .stepsWrapper {display: none;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent {width: calc(100% - 30px); padding-left: 30px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent:before {width: 300px; height: 300px; background-size: cover; top: 50%; transform: translateY(-50%);}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent h1 {font-size: 36px; font-weight: 700; text-shadow: 3px 3px 0px rgba(0, 0, 0, 0.25); padding: 0 0 10px 0;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent p {font-size: 18px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent a {font-size: 18px;}
    #bannerSlider .owl-nav {top: inherit; right: 15px; width: 50px; bottom: 0;}
    #bannerSlider .owl-nav button {width: 50px; height: 50px;}
    #about {padding: 60px 0;}
    #about:before {display: none;}
    #about .aboutImageWrapper {width: 90%; margin: 0 auto;}
    #about .aboutImageWrapper:before {left: -22px; top: -22px; width: 90px; height: 90px; background-size: cover;}
    #about .aboutImageWrapper:after {right: -22px; bottom: -22px; width: 90px; height: 90px; background-size: cover;}
    #about .aboutContent {padding-top: 40px; text-align: center;}
    #about .aboutContent .stat-wrap div ul li:nth-child(1) {font-size: 32px;}
    #about .aboutContent .stat-wrap div ul li label {font-size: 18px;}
    #challenges {padding: 40px 0 60px 0;}
    #challenges h2 {font-size: 32px;}
    #technologyServices {padding: 40px 0 120px 0; background: none;}
    #technologyServices h2 {font-size: 32px;}
    #technologyServices #techServicesCarousel .owl-nav {top: 50%; width: calc(100% + 20px); left: -10px;}
    #technologyServices .singleBtnWrapper a {padding: 10px 60px 10px 20px; font-size: 19px; margin-top: 90px;}
    #technologyServices .singleBtnWrapper a span.material-icons {right: 4px; top: 4px; width: 41px; height: 41px; font-size: 30px;}
    #technologyServices .boxWrapper {margin-bottom: 65px; padding-top: 60px;}
    #technologyServices .boxWrapper .iconWrapper {top: -45px; width: 90px; height: 90px;}
    #technologyServices .boxWrapper .contentWrapper h4 {font-size: 22px;}
    #technologyServices .boxWrapper .contentWrapper p {font-size: 16px; padding: 10px 40px;}
    #technologyServices h3 {margin: 0; font-size: 22px;}
    #technologyServices #technologyLayer {margin-top: 20px;}
    #technologyServices #technologyLayer .item .contentWrapper h5 {width: 100%; text-align: center;}
    #technologyLayer .owl-nav {transform: translateY(0); top: inherit !important; bottom: -50px; width: 100%; left: 0 !important; justify-content: center;}
    #technologyLayer .owl-nav button {margin: 0 10px;}
    #impactStory {padding: 60px 0;}
    #impactStory h2 {font-size: 32px; font-weight: 600;}
    #impactStory .impactStoryContent ul.counterListing li {padding: 10px 20px 10px 20px;}
    #impactStory .impactStoryContent ul.counterListing {margin-top: 40px;}
    #impactStory .impactStoryContent ul.counterListing li p {font-size: 30px;}
    #impactStory .impactStoryContent ul.counterListing li label {font-size: 16px;}
    #impactStory .impactStoryContent h3 {font-size: 26px;}
    #bestInIndustry {padding: 60px 0;}
    #bestInIndustry h2 {font-size: 32px;}
    #bestInIndustry label {margin: 0 0 40px 0;}
    #bestInIndustryCarousel .owl-nav {width: 100%; left: 0;}
    #bestInIndustry #bestInIndustryCarousel .owl-stage-outer {z-index: 0;}
    #letsConnect {padding: 60px 0;}
    #letsConnect h3 {font-size: 28px;}
    #letsConnect h2 {font-size: 32px; padding: 0 0 20px 0;}
    footer .footerLinks {margin: 0 0 30px 0;}
    #thankYouWrapper {padding: 60px 0;}
    #innerBanner {height: 350px;}
    #innerBanner h1 {font-size: 52px; padding: 0;}
    #thankYouWrapper h2 {font-size: 32px;}
    #thankYouWrapper p {font-size: 18px; padding: 0;}
    #thankYouWrapper .thankYouContent a {padding: 10px 40px;}
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
    header button.navbar-toggler {margin-right: 15px;}
    header nav #navbarSupportedContent {display: none !important;}
    header nav #navbarSupportedContent.show {display: flex !important; width: 100%; position: absolute; top: 100%; background: rgba(255, 255, 255, 0.9); padding: 10px 0;}
    header nav ul.navbar-nav {margin: 0; width: 100%;}
    header nav ul.navbar-nav li {margin-bottom: 6px; border-bottom: 1px solid #bbb; width: 100%; justify-content: center; padding-bottom: 6px;}
    header nav ul.navbar-nav li a {margin-right: 0;}
    header nav ul.navbar-nav li:last-child {margin-bottom: 0;}
    #banner {height: 500px;}
    #banner .stepsWrapper {display: none;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent {width: calc(100% - 30px); padding-left: 30px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent:before {width: 300px; height: 300px; background-size: cover; top: 50%; transform: translateY(-50%);}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent h1 {font-size: 36px; font-weight: 700; text-shadow: 3px 3px 0px rgba(0, 0, 0, 0.25); padding: 0 0 10px 0;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent p {font-size: 18px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent a {font-size: 18px;}
    #bannerSlider .owl-nav {top: inherit; right: 15px; width: 50px; bottom: 0;}
    #bannerSlider .owl-nav button {width: 50px; height: 50px;}
    #about {padding: 80px 0;}
    #about:before {display: none;}
    #about .aboutImageWrapper {width: 90%; margin: 0 auto;}
    #about .aboutImageWrapper:before {left: -36px; top: -36px; width: 100px; height: 100px; background-size: cover;}
    #about .aboutImageWrapper:after {right: -36px; bottom: -36px; width: 100px; height: 100px; background-size: cover;}
    #about .aboutContent {padding-top: 50px; text-align: center;}
    #about .aboutContent .stat-wrap div ul li:nth-child(1) {font-size: 38px;}
    #about .aboutContent .stat-wrap div ul li label {font-size: 20px;}
    #challenges {padding: 20px 0 80px 0;}
    #challenges h2 {font-size: 32px;}
    #technologyServices {background: none; padding: 0 0 80px 0;}
    #technologyServices h2 {font-size: 32px;}
    #technologyServices label {margin: 0 0 40px 0;}
    #technologyServices #techServicesCarousel .owl-stage-outer {padding: 45px 0 0 0;}
    #technologyServices #techServicesCarousel .owl-nav {top: 50%; width: calc(100% + 40px); left: -20px;}
    #technologyServices .singleBtnWrapper a {padding: 12px 70px 12px 30px; font-size: 22px; margin-top: 30px;}
    #technologyServices .singleBtnWrapper a span.material-icons {right: 4px; top: 4px; width: 49px; height: 49px; font-size: 30px;}
    #technologyServices .boxWrapper .iconWrapper {top: -45px; width: 90px; height: 90px;}
    #technologyServices .boxWrapper .iconWrapper img {max-width: 50px;}
    #technologyServices .boxWrapper {padding-top: 60px; margin-bottom: 60px; padding-bottom: 20px;}
    #technologyServices .boxWrapper .contentWrapper h4 {font-size: 22px;}
    #technologyServices .boxWrapper .contentWrapper p {padding: 10px 40px; font-size: 16px;}
    #technologyServices h3 {margin: 0; font-size: 22px;}
    #technologyLayer .owl-nav {width: calc(100% + 40px); left: -20px;}
    #technologyServices #technologyLayer .item .contentWrapper h5 {width: 100%; text-align: center;}
    #bestInIndustry {padding: 80px 0;}
    #bestInIndustry label {margin: 0 0 50px 0;}
    #bestInIndustry #bestInIndustryCarousel .owl-stage-outer {z-index: inherit;}
    #bestInIndustryCarousel .owl-nav {width: calc(100% + 20px); left: -10px;}
    #letsConnect {padding: 40px 0 80px 0;}
    #letsConnect h3 {font-size: 28px;}
    #letsConnect h2 {padding: 0 0 10px 0; font-size: 32px;}
    footer .googleMapWrapper {margin: 30px 0 0 0;}
    #innerBanner {height: 330px;}
    #innerBanner h1 {padding: 0; font-size: 52px;}
    #thankYouWrapper {padding: 70px 0;}
    #thankYouWrapper p {padding: 0;}
    #thankYouWrapper .thankYouContent a {padding: 12px 40px; font-size: 18px;}
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    header button.navbar-toggler {margin-right: 15px;}
    header nav #navbarSupportedContent {display: none !important;}
    header nav #navbarSupportedContent.show {display: flex !important; width: 100%; position: absolute; top: 100%; background: rgba(255, 255, 255, 0.9); padding: 10px 0;}
    header nav ul.navbar-nav {margin: 0; width: 100%;}
    header nav ul.navbar-nav li {margin-bottom: 6px; border-bottom: 1px solid #bbb; width: 100%; justify-content: center; padding-bottom: 6px;}
    header nav ul.navbar-nav li a {margin-right: 0;}
    header nav ul.navbar-nav li:last-child {margin-bottom: 0;}
    #banner {height: 600px;}
    #banner .stepsWrapper {display: none;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent {width: calc(100% - 30px); padding-left: 140px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent:before {width: 380px; height: 380px; background-size: cover; top: 50%; transform: translateY(-50%);}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent h1 {font-size: 48px; font-weight: 700; text-shadow: 3px 3px 0px rgba(0, 0, 0, 0.25); padding: 0 0 10px 0;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent p {font-size: 20px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent a {font-size: 20px;}
    #bannerSlider .owl-nav {top: inherit; right: 15px; width: 50px; bottom: 0;}
    #bannerSlider .owl-nav button {width: 50px; height: 50px;}
    #about {padding: 80px 0;}
    #about:before {display: none;}
    #about .aboutImageWrapper {max-width: 500px; margin: 0 auto;}
    #about .aboutImageWrapper:before {left: -40px; top: -40px; width: 110px; height: 110px; background-size: cover;}
    #about .aboutImageWrapper:after {right: -40px; bottom: -40px; width: 110px; height: 110px; background-size: cover;}
    #about .aboutContent {text-align: center; padding-top: 60px; max-width: 500px; margin: 0 auto;}
    #challenges {padding: 40px 0 60px 0;}
    #challenges h2 {font-size: 36px;}
    #technologyServices {padding: 40px 0 80px 0; background: none;}
    #technologyServices h2 {font-size: 36px;}
    #technologyServices label {margin: 0 0 20px 0;}
    #technologyServices #techServicesCarousel .owl-nav {top: 50%; width: calc(100% + 40px); left: -20px;}
    #technologyServices .boxWrapper .iconWrapper {top: -50px; width: 100px; height: 100px;}
    #technologyServices .boxWrapper {padding-top: 60px; padding-bottom: 20px; margin-bottom: 70px;}
    #technologyServices .boxWrapper .contentWrapper {padding: 0 15px;}
    #technologyServices .boxWrapper .contentWrapper h4 {font-size: 22px;}
    #technologyServices .boxWrapper .contentWrapper p {font-size: 16px;}
    #technologyServices h3 {margin: 0; font-size: 22px;}
    #technologyServices #technologyLayer {margin-top: 20px;}
    #technologyLayer .owl-nav {width: calc(100% + 40px); left: -20px;}
    #technologyServices #technologyLayer .item .contentWrapper h5 {width: 100%; text-align: center;}
    #impactStory {padding: 80px 0 80px 0;}
    #impactStory h2 {margin: 0 0 30px 0; font-size: 36px;}
    #impactStory .indiaMap {max-width: 360px; margin: 0 auto 30px auto;}
    #impactStory .impactStoryContent h3 {font-size: 30px;}
    #bestInIndustry {padding: 80px 0;}
    #bestInIndustry h2 {font-size: 36px;}
    #bestInIndustry label {margin: 0 0 50px 0;}
    #bestInIndustry #bestInIndustryCarousel .owl-stage-outer {z-index: inherit;}
    #bestInIndustryCarousel .owl-nav {width: calc(100% + 40px); left: -20px; z-index: 1;}
    #letsConnect {padding: 40px 0 80px 0;}
    #letsConnect h3 {font-size: 30px;}
    #letsConnect h2 {padding: 0 0 20px 0; font-size: 36px;}
    footer .googleMapWrapper {margin-top: 30px;}
    #innerBanner {height: 380px;}
    #innerBanner h1 {font-size: 60px;}
    #thankYouWrapper p {padding: 0;}
    #thankYouWrapper .thankYouContent a {padding: 12px 40px;}
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    header nav ul.navbar-nav li a {font-size: 16px; margin-right: 10px;}
    #banner {height: 700px;}
    #banner .stepsWrapper {display: none;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent:before {top: 50%; width: 460px; height: 460px; transform: translateY(-50%); background-size: cover; left: -40px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent {width: calc(100% - 130px); padding-left: 130px; padding-right: 160px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent h1 {padding: 0 0 10px 0; font-size: 50px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent p {font-size: 20px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent a {font-size: 20px;}
    #about:before {display: none;}
    #about .aboutImageWrapper {margin-right: 20px;}
    #about .aboutImageWrapper:before {left: -22px; top: -22px; width: 100px; height: 100px; background-size: cover;}
    #about .aboutImageWrapper:after {right: -22px; bottom: -22px; width: 100px; height: 100px; background-size: cover;}
    #about .aboutContent .stat-wrap div ul li:nth-child(1) {font-size: 40px;}
    #about .aboutContent .stat-wrap div ul li label {font-size: 20px;}
    #challenges {padding: 30px 0 100px 0;}
    #challenges h2 {padding: 0 0 30px 0; font-size: 36px;}
    #technologyServices #techServicesCarousel .owl-nav {top: calc(50% + 32px); width: calc(100% + 40px); left: -20px;}
    #technologyServices {background: none;}
    #technologyServices h2 {font-size: 36px;}
    #technologyServices .boxWrapper .iconWrapper {top: -45px; width: 90px; height: 90px;}
    #technologyServices .boxWrapper .iconWrapper img {max-width: 50px;}
    #technologyServices .boxWrapper {padding-top: 60px; padding-bottom: 10px;}
    #technologyServices .boxWrapper .contentWrapper h4 {font-size: 20px;}
    #technologyServices .boxWrapper .contentWrapper p {padding: 10px 35px; font-size: 16px; line-height: 22px;}
    #technologyServices h3 {font-size: 22px;}
    #technologyServices #technologyLayer {margin-top: 20px;}
    #technologyLayer .owl-nav {width: calc(100% + 40px); left: -20px;}
    #impactStory .impactStoryContent h3 {font-size: 28px; line-height: 38px;}
    #bestInIndustry #bestInIndustryCarousel .owl-stage-outer {z-index: inherit;}
    #bestInIndustryCarousel .owl-nav {width: calc(100% + 40px); left: -20px; z-index: 1;}
    #letsConnect h3 {font-size: 32px;}
    #letsConnect h2 {font-size: 36px; padding: 0 0 10px 0;}
    #innerBanner {height: 440px;}
    #thankYouWrapper p {padding: 0;}
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    #banner .stepsWrapper {width: 240px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent:before {top: 50%; width: 460px; height: 460px; background-size: cover; transform: translateY(-50%); left: -110px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent {width: calc(100% - 260px); padding-left: 0;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent h1 {font-size: 50px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent p {font-size: 22px; padding: 0 50px 30px 0;}
    #bannerSlider .owl-nav {right: 30px;}
    #banner .stepsWrapper {right: 120px;}
    #about:before {display: none;}
    #about .aboutImageWrapper {max-width: 90%;}
    #about .aboutImageWrapper:before {left: -35px; top: -35px; width: 100px; height: 100px; background-size: cover;}
    #about .aboutImageWrapper:after {right: -35px; bottom: -35px; width: 100px; height: 100px; background-size: cover;}
    #about .aboutContent .stat-wrap div ul li:nth-child(1) {font-size: 41px;}
    #about .aboutContent .stat-wrap div ul li label {font-size: 22px;}
    #challenges {padding: 40px 0 100px 0;}
    #challenges h2 {font-size: 38px;}
    #technologyServices {background: none;}
    #technologyServices h2 {font-size: 38px;}
    #technologyServices label {margin: 0 0 30px 0;}
    #technologyServices #techServicesCarousel .owl-nav {width: calc(100% + 40px); left: -20px;}
    #technologyServices .boxWrapper .contentWrapper p {font-size: 16px;}
    #technologyLayer .owl-nav {width: calc(100% + 40px); left: -20px;}
    #impactStory .impactStoryContent h3 {font-size: 28px;}
    #impactStory .impactStoryContent ul.counterListing li p {font-size: 32px;}
    #impactStory .impactStoryContent ul.counterListing li label {font-size: 16px; font-weight: 400;}
    #bestInIndustryCarousel .owl-nav {width: calc(100% + 40px); left: -20px; z-index: 2;}
    #letsConnect h3 {font-size: 28px;}
    #letsConnect h2 {font-size: 38px; padding-bottom: 20px;}
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent {padding-left: 20px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent:before {left: -90px; top: 50%; width: 500px; height: 500px; background-size: cover; transform: translateY(-50%);}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent h1 {font-size: 60px;}
    #banner #bannerSlider .owl-stage .owl-item .item .bannerContent .bannerInnerContent p {font-size: 22px;}
    #technologyServices #techServicesCarousel .owl-nav {width: calc(100% + 80px); left: -40px;}
}