@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');
@import url('https://fonts.googleapis.com/css?family=Merriweather+Sans:300,400,700,800');
body{font-family: 'Roboto', sans-serif;color:#333333; font-size:14px; font-weight:400; background:#fff;padding-right: 0 !important;}/*font-family: 'Merriweather Sans', sans-serif;*/
*{margin:0; padding:0;}
p,h1,h2,h3,h4,h5,h6,label,address,ul,ol{margin:0; padding:0;}
ul li a,ul li a:hover,a:hover,a{text-decoration:none;}
a:focus {outline: none;}
img{max-width:100%;}

/*header css start*/

header nav ul {margin: 0;list-style-type: none;display: flex;justify-content: flex-end;padding-right: 15px;align-items: center;}
header nav ul li {display:inline;position:relative;padding:0;background:url(../images/menu-border.png) right 2px no-repeat;padding: 0 18px;}
header nav ul li:last-child {background:none;padding-right: 0;}
header nav ul li:first-child {padding-left: 0;}
header ul li a {color: #fff;font-size: 15px;text-decoration: none;transition: ease-in-out 0.4s;display: inline-block;position: relative;padding: 18px 0;height: auto;text-transform: uppercase;font-weight: 300;border-bottom: 2px solid transparent;}
header nav ul li a img {vertical-align: middle;}
header ul li:last-child a::after {background: none;}
header ul li ul li a:after {background:none;}
header ul li a.active {color:#fff;border-bottom: 2px solid #fff;}
header ul li a:hover {text-decoration: none;color: #fff;border-bottom: 2px solid #fff;}
header {display: block;width: 100%;}
.menu {display: inline-block;width: 100%;position: relative;top: 27px;}
header {width: 100%;position: absolute;z-index: 9;top: 25px;}
header nav ul.sub-menu {position: absolute;display: flex;flex-direction: column;width: 250px;background-color: #e16226;padding-right: 0;display: none;}
header nav ul li:hover ul.sub-menu {display: block;}
header nav ul.sub-menu li {padding: 0;width: 100%;border-bottom: 1px solid #fff;display: inline-block;}
header nav ul li ul.sub-menu li:last-child {border-bottom: 0;} 
header nav ul li ul.sub-menu li a {width: 100%;display: inline-block;padding: 10px;}
header nav ul li.contact a {background-color: #3a96ff;padding: 10px;border-radius: 5px;}
.logo {position: absolute;top: 0;z-index: 1;text-align: center;left: 100px;}
.logo a {max-width: 120px;display: inline-block;line-height: 116px;background-color: #07111c;box-shadow: 4px 4px 13px rgba(255, 255, 255, 0.3);width: 120px;height: 120px;border-radius: 100%;}
.logo a img {width: 85px;height: 85px;line-height: 90px;}

/*header css end*/

/*banner css start*/

.banner {position: relative;background: url("../images/slider-image.jpg") center top no-repeat;background-attachment: fixed;height: 700px;background-size: cover;object-fit: cover;object-position: center;width: 100%;}
.banner:after{content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-color: #000;opacity: 0.5;}
.bannerCaption {position: absolute;top: 50%;transform: translateY(-50%);text-align: center;width: 100%;z-index: 1;}
.bannerCaption h1 {color: #fff;font-size: 50px;line-height: 50px;padding-bottom: 20px;width: 70%;margin: 0 auto;}
.bannerCaption p {color: #fff;font-size: 22px;line-height: 26px;margin: 0 auto;width: 70%;}

/*banner css end*/

/*expertise css start*/

.expertiseContent {display: flex;}
.expBox {padding: 20px;width: 100%;position: relative;}
.expBox:after {content: "";position: absolute;left: 0;top: 0;background-color: #000;width: 100%;height: 100%;opacity: 0.7;z-index: 0;}
.expBox img {margin-bottom: 20px;z-index: 9;position: relative;}
.expBox h3 {color: #fff;font-size: 22px;line-height: 26px;margin-bottom: 20px;position: relative;z-index: 9;}
.expBox p {color: #fff;font-size: 16px;line-height: 22px;position: relative;z-index: 9;min-height: 110px;}
.expBox.dataAna {background: url("../images/data-analytics-img.png") center top no-repeat;background-size: cover;}
.expBox.cloud {background: url("../images/Cloud-Migration-img.png") center top no-repeat;background-size: cover;}
.expBox.dataMna {background: url("../images/dada-management.png") center top no-repeat;background-size: cover;}
.expBox.dataVis {background: url("../images/data-visulation.png") center top no-repeat;background-size: cover;}

/*expertise css end*/

/*services css start*/

.services {background-color: #fbfbfb;padding: 30px 0;}
.serInn h2 {color: #e16226;font-size: 40px;line-height: 42px;padding-bottom: 10px;text-align: center;}
.serInn > p {color: #000;font-size: 20px;line-height: 22px;text-align: center;}
.serviceDetail {display: flex;justify-content: space-between;flex-wrap: wrap;margin-top: 30px;}
.serviceDetail a.serviceBox {width: 24%;text-align: center;border-right: 1px solid #cfcfcf;border-bottom: 1px solid #cfcfcf;padding: 20px;min-height: 200px;transition: ease-in-out 0.4s;}
.serviceIcon img {max-width: 70px;}
.serviceDetail a.serviceBox h3 {font-size: 22px;line-height: 24px;padding-top: 20px;color: #e16226;font-weight: 400;}
.serviceDetail a.serviceBox:hover {box-shadow: 5px 6px 5px 0px #A8A8A8;}

/*services css end*/

/*about us css start*/

.aboutus {padding: 30px 0;position: relative;background: url("../images/about-bg.png") center top no-repeat;background-size: cover;background-attachment: fixed;}
/*.aboutus:after {content: "";position: absolute;left: 0;top: 0;background-color: #000;width: 100%;height: 100%;opacity: 0.7;z-index: 0;}*/
.aboutinn {display: flex;align-items: center;}
.aboutContent {position: relative;z-index: 9;width: 70%;padding-right: 15px;}
.aboutContent .sectionTitle p {color: #fff;font-size: 20px;line-height: 24px;padding-bottom: 15px;}
.aboutContent .sectionTitle h2 {color: #e16226;font-size: 40px;line-height: 42px;padding-bottom: 20px;}
.aboutContent p {color: #000;font-size: 22px;line-height: 28px;padding-bottom: 20px;}
.aboutImg {border-radius: 100%;overflow: hidden;position: relative;z-index: 9;}

/*about us css end*/

/*technologies css start*/

.technologies {padding: 50px 0;position: relative;/*background: url("../images/technologies-bg.png") center top no-repeat;background-size: cover;background-attachment: fixed;*/}
/*.technologies:after {content: "";position: absolute;left: 0;top: 0;background-color: #000;width: 100%;height: 100%;opacity: 0.7;z-index: 0;}*/
.techInn {position: relative;z-index: 9;}
.techInn h2 {color: #e16226;font-size: 40px;line-height: 42px;padding-bottom: 10px;text-align: center;}
.techSlider {margin-top: 20px;}
.techSlider ul.slick-dots {display: flex !important;justify-content: center;list-style: none;margin-top: 20px;}
.techSlider ul.slick-dots li {margin-right: 10px;}
.techSlider ul.slick-dots li button {text-indent: -9999px;border: 0;width: 10px;height: 10px;border-radius: 100%;background-color: #ccc;}
.techSlider ul.slick-dots li.slick-active button {background-color: #e37440;}

/*technologies css end*/

/*business domain css start*/

.businessDomain {background: url("../images/business-domain-bg.png") center top no-repeat;background-size: cover;padding: 30px 0;position: relative;background-attachment: fixed;}
/*.businessDomain:after {content: "";position: absolute;left: 0;top: 0;background-color: #000;width: 100%;height: 100%;opacity: 0.7;z-index: 0;}*/
.Bdomain h2 {color: #e16226;font-size: 40px;line-height: 42px;padding-bottom: 10px;text-align: center;position: relative;z-index: 9;}
.Bdomain > p {color: #000;font-size: 20px;line-height: 22px;text-align: center;position: relative;z-index: 9;}
.domainDetail {display: flex;justify-content: space-between;flex-wrap: wrap;margin-top: 30px;position: relative;z-index: 9;}
.domainBox {width: 32%;padding: 20px 10px;border: 5px solid #22599d;text-align: center;transition: ease-in-out 0.4s;background-color: #fff;cursor: pointer;margin-bottom: 30px;border-radius: 10px;}
.iconBox {display: inline-block;width: 120px;height: 120px;line-height: 105px;border-radius: 100%;background-color: #22599d;text-align: center;border: 5px solid #e16226;margin-bottom: 20px;transition: ease-in-out 0.4s;}
.iconBox img {max-width: 70px;}
.domainBox h3 {color: #e16226;font-size: 25px;line-height: 28px;margin-bottom: 15px;transition: ease-in-out 0.4s;}
.domainBox p {color: #000;font-size: 18px;line-height: 22px;transition: ease-in-out 0.4s;}
.domainBox:hover {box-shadow: 4px 3px 10px rgba(0, 0, 0, 0.3);background-color: #3a96ff;border: 5px solid #e16226;}
.domainBox:hover .iconBox {border-color: #fff;}
.domainBox:hover p,.domainBox:hover h3 {color: #fff;}

/*business domain css end*/

/*our client css start*/

.ourClient {padding: 30px 0;position: relative;}
.clientInn h2 {color: #e16226;font-size: 40px;line-height: 42px;padding-bottom: 10px;text-align: center;}
.clientLogo {display: flex;flex-wrap: wrap;margin-top: 20px;margin-bottom: 10px;}
.logoBox {width: 25%;border: 1px solid #f1f1f1;cursor: pointer;filter: grayscale(100);transition: ease-in-out 0.4s;}
.logoBox:hover {filter: grayscale(0);box-shadow: 4px 3px 10px rgba(0, 0, 0, 0.3);}

/*our client css end*/


/*cookie popup css start*/

.wrapper {position: fixed;right: -370px;bottom: 50px;max-width: 345px;width: 100%;background: #fff;border-radius: 8px;padding: 15px 25px 22px;transition: all 0.3s ease;box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);}
.wrapper.show {right: 20px;z-index: 999;}
.title-box {display: flex;align-items: center;column-gap: 15px;color: #4070f4;margin-bottom: 15px;}
.title-box h3 {font-size: 24px;font-weight: 500;}
.info {margin-bottom: 15px;}
.info p {font-size: 16px;font-weight: 400;color: #333;}
.info p a {color: #4070f4;text-decoration: none;}
.info p a:hover {text-decoration: underline;}
.buttons {display: flex;justify-content: space-between;align-items: center;width: 100%;}
.button {width: calc(100% / 2 - 10px);padding: 8px 0;border: none;border-radius: 4px;background-color: #4070f4;color: #fff;cursor: pointer;transition: all 0.2s ease;}
.button:hover {background-color: #031bf1;}

/*cookie popup css end*/

/*footer css start*/

footer {background-color: #3a96ff;padding: 20px;text-align: center;display: flex;align-items: center;justify-content: space-between;}
footer p {color: #fff;font-size: 18px;line-height: 24px;}
footer ul {list-style: none;display: flex;}
footer ul li {margin-left: 10px;}

/*footer css end*/

/*about css start*/

.banner.about {background: url("../images/about-page-bg.png") center top no-repeat;object-fit: cover;object-position: center;width: 100%;height: 400px;background-size: cover;}
.about .bannerCaption {top:auto;bottom: 0;}
.about.banner:after {height: 397px;}
.about {padding: 30px 0;}
.aboutPageContent h2 {font-size: 30px;line-height: 32px;padding-top: 15px;padding-bottom: 20px;color: #e16226;margin: 0 auto;display: table;}
.aboutPageContent p {font-size: 22px;line-height: 26px;margin-bottom: 20px;color: #000;text-align: center;}

/*about css end*/

/*service Detail css start*/

.banner.serviceDet {background: url("../images/service-detail-banner.png") center top no-repeat;object-fit: cover;object-position: center;width: 100%;height: 400px;background-size: cover;}
.serviceDet .bannerCaption {top:auto;bottom: 0;}
.serviceDet.banner:after {height: 397px;}
.serviceDetailContent {padding: 50px 0;}
.detailContent {display: flex;align-items: center;justify-content: space-between;}
.serContent,.serImg {width: 49%;}
.serContent h2 {color: #e16226;font-size: 40px;line-height: 42px;padding-bottom: 20px;}
.serContent p {color: #000;font-size: 22px;line-height: 28px;padding-bottom: 20px;}

/*service Detail css end*/

/*blog css start*/

.banner.blog {background: url("../images/blog.png") center top no-repeat;object-fit: cover;object-position: center;width: 100%;height: 400px;background-size: contain;}
.blog .bannerCaption {top:auto;bottom: 0;}
.blog.banner:after {height: 397px;}
.blog {padding: 50px 0;}
.blogInn {display: flex;justify-content: space-between;flex-wrap: wrap;}
.blogBox {border: 2px solid #e16226;margin-bottom: 20px;width: 49%;transition: ease-in-out 0.4s;border-radius: 10px;}
.blogBox:hover {border-color: #22599d;}
.blogInfo {padding: 20px;}
.blogInfo h2 {font-size: 25px;line-height: 28px;margin-bottom: 10px;color: #000;}
.blogInfo p {font-size: 16px;line-height: 22px;margin-bottom: 10px;color: #000;}
.dateAuthor {display: flex;justify-content: space-between;}
.dateAuthor p,.dateAuthor span {margin-bottom: 0;color: #22599d;font-size: 14px;line-height: 18px;}

/*blog css end*/

/*blog detail css start*/

.blog-detail {padding: 50px 0;}
.blogDetailContent h2 {font-size: 30px;line-height: 32px;margin-top: 15px;margin-bottom: 10px;color: #000;}
.blogDetailContent .dateAuthor {justify-content: flex-start;}
.blogDetailContent .dateAuthor span {margin-right: 10px;padding-right: 10px;margin-bottom: 10px;}
.blogDetailContent p {font-size: 18px;line-height: 26px;margin-bottom: 15px;}
.dateAuthor > p, .dateAuthor span {margin-bottom: 0;color: #22599d;font-size: 14px;line-height: 18px;}
.blogDetailContent ul,.blogDetailContent ol {margin-bottom: 15px;list-style: inside;}
.blogDetailContent ul li,.blogDetailContent ol li {margin-bottom: 15px;}
.blogDetailContent ul li p,.blogDetailContent ol li p {font-size: 18px;line-height: 26px;}

/*blog detail css start*/

/*contact css start*/

.banner.contact {background: url("../images/contact-us-bg.png") center top no-repeat;object-fit: cover;object-position: center;width: 100%;height: 397px;background-size: cover;}
.contact .bannerCaption {top:auto;bottom: 0;}
.contactUs {padding: 30px 0;}
.contactInn {display: flex;justify-content: space-between;}
.contactForm,.map {width: 49%;}
.contactForm {background-color: #22599d;padding: 20px;border-radius: 10px;}
.formField {margin-bottom: 15px;}
.formField input {width: 100%;border: 0;background-color: #fff;cursor: #000;font-size: 16px;padding: 10px;}
.formField textarea {width: 100%;border: 0;background-color: #fff;cursor: #000;font-size: 16px;padding: 10px;height: 200px;resize: none;outline: 0;}
.formField button {border: 0;background-color: #fff;color: #22599d;font-size: 16px;padding: 8px 20px;}
.contactDetail {margin-bottom: 30px;}
.contactDetail h3 {color: #e16226;font-size: 30px;line-height: 35px;margin-bottom: 20px;}
.contactDetail p {font-size: 20px;line-height: 22px;margin-bottom: 10px;font-weight: bold;color: #000;}
.contactDetail a {color: #22599d;}

/*contact css end*/

/*general Responsive*/

@media (max-width:1024px) {
.container {max-width: 95%;}
.logo {left: 20px;}
.domainBox {width: 49%;}
.banner {height: 500px;background-position: bottom center;background-attachment: initial;}
.bannerCaption h1,.bannerCaption p {width: 85%;}
.wrapper.show {display: none;}
.banner.about,.banner.serviceDet,.banner.blog,.banner.contact {background-size: cover;background-position: right;}

}

@media (max-width:900px) {

.mean-container .mean-nav > ul {flex-wrap: wrap;}
.mean-container .mean-nav ul li {padding: 0;}
header ul li a:hover,header ul li a.active {border-bottom: 0;}
header nav ul li.contact a {border-radius: 0;}
.bannerCaption {z-index: 1;}
.bannerCaption {top: auto;bottom: 30px;transform: none;}
.bannerCaption h1 {font-size: 40px;line-height: 45px;}
.bannerCaption p {font-size: 20px;line-height: 24px;}
.serviceDetail a.serviceBox {width: 49%;margin-bottom: 20px;}
.aboutinn {flex-wrap: wrap;}
.aboutContent {order: 2;width: 100%;margin-top: 20px;text-align: center;padding-right: 0;}
.aboutImg {order: 1;max-width: 70%;margin: 0 auto;}
.aboutImg img {width: 100%;}

}

@media (max-width:768px) {

.mean-container .mean-bar {top: 40px;}
.mean-container .mean-nav ul {position: relative;}
.contactInn {flex-wrap: wrap;}
.contactForm {width: 100%;order: 2;}
.map {width: 100%;order: 1;margin-bottom: 20px;}

}

@media (max-width:767px) {

.bannerCaption h1 {font-size: 35px;line-height: 40px;}
.expBox {min-height: 282px;}
.aboutContent .sectionTitle h2 {font-size: 30px;line-height: 35px;}
.aboutContent p {font-size: 18px;line-height: 24px;}
.domainBox h3 {font-size: 22px;line-height: 28px;}
.aboutPageContent p {font-size: 18px;line-height: 24px;}
.detailContent {flex-wrap: wrap;}
.serContent, .serImg {width: 100%;}
.serImg {text-align: center;}
.serContent h2 {text-align: center;font-size: 30px;line-height: 35px;}
.serContent p {font-size: 18px;line-height: 22px;text-align: center;}
.blogBox {width: 100%;}

}

@media (max-width:568px) {

.banner {height: 450px;}
.banner.about,.banner.serviceDet,.banner.blog,.banner.contact {height: 300px;}
.about.banner:after,.banner.blog:after,.banner.contact:after,.serviceDet.banner:after {height: 300px;}
.serInn h2,.Bdomain h2,.techInn h2 {font-size: 30px;line-height: 35px;}
.serviceDetail a.serviceBox {width: 100%;border-right: 0;}
.expBox {min-height: 292px;}
.serviceDetail a.serviceBox:last-child {border-bottom: 0;}
.techSlider .item img {margin: 0 auto;}
.domainBox {width: 100%;}
footer {flex-wrap: wrap;justify-content: center;}
.socialMedia {margin-top: 20px;}

}

@media (max-width:480px) {

.bannerCaption h1,.aboutContent .sectionTitle h2,.serInn h2,.Bdomain h2,.techInn h2,.serContent h2 {font-size: 25px;line-height: 30px;width: 95%;}
.aboutContent .sectionTitle h2 {margin: 0 auto;}
.bannerCaption p {font-size: 16px;line-height: 20px;width: 95%;}
.banner.about,.banner.serviceDet {background-position: center;}

}