@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700;900&display=swap');

*{ font-family:'Poppins'; font-size:14px; color:#000; box-sizing: border-box; margin:0; padding:0}

.container{ width:100%; float:left}

.header{ background:url(../images/banner.jpg) no-repeat center center; }
.header.aboutusBanner{ background:url(../images/aboutus-banner.jpg) no-repeat center center; background-size:cover; position:relative }
.header.aboutusBanner:after{ content:""; left:0; right:0; top:0; bottom:0; background:rgba(28,40,126,0.4); z-index:0; position:absolute}
.bannerTxt.bannerHeading{ text-align:center; font-weight:700; position:relative; z-index:5}

.blockBox{ width:100%; float:left; padding-top:0; margin-top:0; padding-bottom:0}


.navBox{ width:100%; max-width:1200px; display:flex; background:#fff; margin:10px auto; border-radius:10px; padding:5px 20px !important; margin:10px auto !important; position:relative; z-index:10}
.navList{ list-style:none; margin:0 !important; }
.navList li{ display:inline; margin-left:10px}
.navBoxLeft{ font-weight:700; font-size:26px}
.navBoxRight{ margin-left:auto; align-self: center;}
.navList li a:link, .navList li a:visited{ padding:5px 10px; color:#000; font-size:16px}
.navList li a:hover, .navactive{ color:#00b0f0 !important;}
.bannerTxt{width:100%; max-width:1200px; margin-left:auto; color:#fff; font-size:46px; margin: 0 auto; padding:40px 20px 110px 20px; line-height:60px}
.bannerTxt span{color:#fff; font-size:46px; font-weight:700; line-height:60px}
.owl-carousel#owl-demo .owl-item
{
  align-self: start;
}
.cls{ clear:both}
.logo{ height:70px; float:left}
.innerContainer{width:100%; max-width:1200px; margin:0 auto}
.innerCcontainer{ display:flex; width:100%}
.expertiseBox{ }

.owl-carouselowl-them .item{width:calc(33.33% - 40px); float:left; padding:20px; box-shadow:0 0 20px rgba(0,0,0,0.08); border:1px solid #fff; margin:30px 20px; border-radius:20px; min-height:425px; -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease;
}

.threeCol{ float:left; width:calc(33.33% - 40px); margin:30px 20px; padding:20px; border-radius:15px; box-shadow: 0 0 20px rgba(0,0,0,0.08); margin-bottom:20px;-webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease; background:#fff;border:1px solid #fff;}
.threeCol:hover{box-shadow:0 0 20px rgba(0,0,0,0.1)}
.threeCol:nth-child(1), .threeCol:nth-child(2),.threeCol:nth-child(3){ min-height:350px}
.threeCol img{ margin-left: auto; display: block; margin-right: auto;}


.threeCol{-webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease;}
.owl-carouselowl-them .item:hover,.threeCol:hover{ box-shadow:0 5px 0px #3d8df7;  border:1px solid #3d8df7;}
.owl-carouselowl-them .item:hover h3,.threeCol:hover h3,.threeCol:hover .boxHeading{ color:#3d8df7}



.txtCenter{ text-align:center}
h2{ font-weight:700 !important; font-size:36px; margin:20px auto 0 auto}
h3{ margin:0; padding:0; font-size:20px; font-weight:700}
h2.hheading{font-weight:700 !important; font-size:30px; margin:20px auto 0 auto}

.subHeading{ font-size:18px; font-weight:300; margin-bottom:20px; color:#000}
.middleBox{ background:url(../images/bg.png) repeat-x; margin-top:-70px; z-index:5; position:relative}
.middleBox:before{ content:''; width:29px; height:251px; background:url(../images/leftbg.png) no-repeat; position:absolute; left:-29px; top:0}
.middleBox:after{ content:''; width:29px; height:251px; background:url(../images/rightbg.png) no-repeat; position:absolute; right:-29px; top:0}

p{ font-size:14px; padding:10px 0; margin:0; color:#000; font-weight:300; line-height: 26px;}

.aboutBox{ display:flex; margin:50px auto}
.aboutBoxLeft{ width:35%; padding-left:20px}
.aboutBoxRight{ width:65%; padding:0 50px; align-self: center;}

.roundImg{ border-radius:50px; width:100%}
.noSpaceVer{ margin-bottom:0; padding-bottom:0}

.logosSlider{ background:url(../images/logo-bg.png) repeat-x center center; padding:50px 0; border-bottom:0px solid #f1f1f1; border-top:0px solid #f1f1f1;}
.logosSlider h2{ margin-bottom:30px}

.expertiseBox img{ width:80px !important; display: inline !important; padding-bottom:10px}

.servicesContainer{ width:100%; display:flex}
.servicesBox{ width:35%; margin:0 7.5% 50px 7.5%; text-align:center}
.servicesBox img{ width:100%; border-radius:50px; margin-bottom:10px; margin-top:0px; margin-left:auto; text-align:center;;}
.servicesBox.lastservices{width:35%; margin:0 auto 30px auto; text-align:center}

#owl-demo .item { text-align:center}

.outerAboutBox{ position:relative; z-index:1}

/*.outerAboutBox:before{ background:url(../images/services-bg-left.png); content:""; left:0; bottom:0; position:absolute; width:366px; height:352px; z-index:0}
*/

.quickContact{ width:100%; display:flex; margin:50px 0 0 0}
.quickContactLeft{ width:30%; box-shadow:0 0 10px rgba(0,0,0,0.1); border-radius:20px 20px 0 0; padding:30px; background:#fff}
.quickContactRight{ width:70%; padding-top:50px}
.contactFF{ width:100%; display:flex; padding:30px}
.contactF{ width:50%; padding:0 20px }
.quickContactLeft p.contactHeading{ font-size:65px; line-height:50px; margin-bottom:50px}
.quickContactLeft p.contactHeading span{ font-weight:700; font-size:65px; line-height:50px}
.quickContactRight h3{ padding-left:50px}
.contactF input,.contactF textarea{ background:#f1f1f1; border:0; border-radius:8px; box-shadow:none; padding:10px; width:100%; margin-bottom:15px}
p.txtTitle{ font-weight:700; font-size:16px}
.callInfo{ background:url(../images/call-icon.svg) no-repeat left center; padding-left:35px; background-size:30px; }
.emailInfo{ background:url(../images/email-icon.svg) no-repeat left center; padding-left:35px; background-size:25px;}
.contactF input[type="submit"]{ cursor:pointer; background:#1c287e; color:#fff}
.contactF input[type="submit"]:hover{ background:#26a7f7}
.contactF textarea{ height:155px}

a:link,a:visited{ text-decoration:none}

.footerBox{ width:100%; float:left; padding:50px; background:#1c287e}
.footerBoxInner{ width:100%; max-width:1200px; margin:0 auto}
.footerLogo{ height:70px}
.footerCol1 p,.footerCol1 p a:link,.footerCol1 p a:visited{ color:#fff !important}

.footerCol1{ width:25%; float:left}
.footerCol2{ width:20%; float:left}
.footerCol3{ width:35%; float:left}
.footerCol4{ width:20%; float:left; color:#fff; text-align:right}
.footerCol2 ul,.footerCol3 ul,.footerCol4{ list-style:none; margin-top:60px}
.footerCol2 ul li,.footerCol3 ul li{display:block; padding:3px 0}
.footerCol2 ul a:link,.footerCol2 ul a:visited, .footerCol3 ul a:link,.footerCol3 ul a:visited{ color:#fff; padding:3px 0; }

html{ 
background-image:url(../images/services-bg-left.png), url(../images/services-bg.png), url(../images/services-bg1.png); 
background-repeat:no-repeat, no-repeat, no-repeat; 
background-position:  left calc(100% - 295px), right center, left calc(50% + 950px)}


.digitalEngineering .services1{ background:url(../images/digital-engineering.jpg) center center;background-size:100%; -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease; }
.digitalEngineering:hover .services1{ background:url(../images/digital-engineering.jpg) center center; background-size:115%;  -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease;}

.business .services1{ background:url(../images/digital-business.jpg) center center;background-size:100%; -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease; }
.business:hover .services1{ background:url(../images/digital-business.jpg) center center; background-size:115%;  -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease;}

.cloudEngineering .services1{ background:url(../images/cloud-engineering.jpg) center center;background-size:100%; -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease; }
.cloudEngineering:hover .services1{ background:url(../images/cloud-engineering.jpg) center center; background-size:115%;  -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease;}


.dataInsights .services1{ background:url(../images/Data-Insights.jpg) center center;background-size:100%; -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease; }
.dataInsights:hover .services1{ background:url(../images/Data-Insights.jpg) center center; background-size:115%;  -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease;}


.securityCompliance .services1{ background:url(../images/Security-Compliance.jpg) center center;background-size:100%; -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease; }
.securityCompliance:hover .services1{ background:url(../images/Security-Compliance.jpg) center center; background-size:115%;  -webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease;}


.servicesBox:hover{ background:#fff; border-radius:50px; box-shadow:0 0 20px rgba(0,0,0,0.1) }
.servicesBox:hover h3{ color:#1c287e}

.servicesBox{-webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease; }
.servicesBox p{ padding-left:15px; padding-right:15px; padding-bottom:5px;  overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;}

.viewMore:link,.viewMore:visited{ margin: 10px auto 20px auto;
  border: 1px solid #1c287e;
  color: #1c287e;
  padding: 10px 15px;
  border-radius: 50px;
  display: inline-block;-webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease; }
  
.servicesBox:hover .viewMore,.viewMore:hover{border: 1px solid #1c287e; color: #fff; background:#1c287e}  

.hgt{ height:30px}

/*drop down menu*/
.dropbtn {
  background-color: #04AA6D;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #fff;
  min-width: 180px; padding-top:20px;
  z-index: 1; left:0;
}

.dropdown-content a {
  color: black;
  padding: 10px 15px !important;
  text-decoration: none;
  display: block; border-bottom:1px solid #f1f1f1;
}

.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .dropbtn {background-color: #3e8e41;}
.txtCenter.bld,.bld{ font-size:18px; font-weight:600; margin-bottom:20px}
.menuIcon{ position:relative; width:35px; cursor:pointer; display:none}

.customBullet li{ list-style:none; background:url(../images/bullet1.svg) left 5px no-repeat; padding-left:25px; background-size:15px; margin-bottom:8px; font-weight:300}

img.topMarginImg{ margin-top:30px}

.firstColumn .aboutBoxRight{ padding-left:0}
.firstColumn .aboutBoxLeft{ padding-left:0; padding-right:40px}
.customBullet ul{ margin-left:20px}
.customBullet ul li{ list-style:none; background:url(../images/bullet2.svg) left 3px no-repeat; padding-left:25px; background-size:15px; margin-bottom:8px}
.cls.hgtt{ height:10px}

div.threeCol.twoCol{float:left; width:calc(50% - 40px); min-height:380px}

.owl-dots{ display:none !important}

.hheading.innerTop{  padding-bottom:20px}

.minHgtLogo .item img{ max-height:30px; min-height:auto; margin:0 auto; max-width:130px}
.minHgtLogoN .item img{ max-height:60px; min-height:auto; margin:0 auto; }

p.boxHeading{ font-weight:600; text-align:center; font-size:18px}
.threeCol img{ width:80px; margin:0 auto; display:block}

.digitalBoxes .threeCol img{ height:auto; width:auto}
.digitalBoxes .threeCol{ min-height:380px}
.digitalBoxes .threeCol:nth-child(4), .digitalBoxes .threeCol:nth-child(5), .digitalBoxes .threeCol:nth-child(6){min-height:590px}
.threeCol.samehgt{ min-height:310px}

.subHeading.txtCenter.bigTxt{ font-size:20px; line-height:normal; }
strong{ font-weight:600}

.removeSpace .aboutBox,.removeSpace h2.hheading,.removeSpace .topMarginImg{ margin-top:0 }
.removeSpace{ margin-top:0}
.removeSpace .aboutBoxRight{ padding-left:20px}

.boxes .threeCol{ min-height:370px}
.boxes .boxess.threeCol{ min-height:360px}
.boxes .boxess.threeCol img{ height:60px; width:auto}

.digitalBoxes .threeCol.samehgtt{ min-height:160px}
.threeCol.servicesHgt{ min-height:295px}

div.centerAlignBox{margin-left: calc(33.33% + 20px);}

div.threeCol.leftMarginBox{width: calc(12.0% + 16px); opacity:0}

.cloudServices div.threeCol{ min-height:450px}

@media screen and (max-width:760px) {
.threeCol.samehgt{ min-height:10px}
div.centerAlignBox{ margin-left:20px}
.owl-carouselowl-them .item{width:calc(100% - 40px);}
div.threeCol.leftMarginBox{ display:none}
.aboutBoxLeft,.aboutBoxRight,.quickContactRight,.contactF,.footerCol1,.footerCol2,.footerCol3,.footerCol4{ width:100%}
.navList{ position:absolute; top:90px; left:10px; right:10px; width:calc(100% - 20px); max-width:320px; display:none; z-index:10 }	
.navList li:nth-child(1){ border-radius:10px 10px 0 0}
.navList li:last-child{ border-radius: 0 0 10px 10px}
.navList li{ width:100%; float:left; background:#f1f1f1; margin:0}
.navList li a{ padding:15px 15px; width:100%; float:left;}	
.navList li a:link, .navList li a:visited{padding:10px 15px;}
.menuIcon{ display:block}
.dropdown-content{ display:block; position:relative; padding-left:30px; padding-top:0}
.aboutBoxRight{ text-align:center}
.bannerTxt{ padding:20px; font-size:26px; line-height:normal}
.bannerTxt span{ font-size:26px; line-height:normal}
.navBox{ width:calc(100% - 20px); margin-left:10px; padding:5px 10px !important}
.header{ background-size:100%; background:url(../images/banner-mobile.jpg) center top; padding-bottom:20px}
.middleBox{ margin-top:0; padding-top:00px; background:none}
h2{font-size: 26px;}
.bannerTxt.bannerHeading{ font-size:28px}
.subHeading{ font-size:16px}
.item img{ margin-left:auto; margin-right:auto}
.item { text-align:center}
.aboutBox,.servicesContainer, .quickContact, .contactFF{flex-direction: column;}
.aboutBoxLeft,.aboutBoxRight{ padding:10px}
.aboutBoxRight h2{ padding-top:0; margin-top:0}
.servicesBox,.servicesBox.lastservices, .quickContactLeft, div.threeCol.twoCol{width: calc(100% - 20px); margin: 0 10px 20px 10px;}
.quickContactLeft p.contactHeading, .quickContactLeft p.contactHeading span{ font-size:30px; line-height:normal !important}
.quickContactLeft p.contactHeading{ margin-bottom:20px}
.quickContactRight{ padding-top:20px}
.contactFF{ padding:10px}
.quickContactRight h3{ padding-left: 30px;}
.footerBox{ padding:10px}
.footerLogo{ height:50px}
.footerCol2 ul, .footerCol3 ul, .footerCol4{ margin-top:20px}
.footerCol4{ text-align:left}
.middleBox::before,.middleBox::after{ display:none}
.innerCcontainer1{ padding-left:10px; padding-right:10px}
.customBullet li{ text-align:left; margin-left:10px}
h2.hheading{ font-size:24px}
.firstColumn .aboutBoxRight{ order:4}
.firstColumn .aboutBoxLeft{ order:2; padding-left: 10px; padding-right: 10px;}
.firstColumn .aboutBoxRight{ padding-left:10px}
.aboutBox{ margin:20px auto}
.aboutBoxInner{padding-left:10px; padding-right:10px}
img.topMarginImg{ margin-top:0}
.threeCol{  width: calc(100% - 20px); margin-left:10px}
.outerAboutBox.outerAboutBoxx{ padding-left:10px; padding-right:10px}

.resImg{ width:100%}

}