@charset "utf-8";
/* CSS Document */


body{
 font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: normal;

}
embed{
	widh:100%;
	display: block;
	position: absolute;
	top:0;
}
.linehight{
	line-height: 1.8rem;
}
.lightfont{
	font-weight: 300;
}
iframe{
	width: 100%;
	height: 70px;
	position: fixed;
	top: 0;
	z-index: 102;
}
header{
	position: relative;
	z-index: 102;
}
*{box-sizing: border-box;
}
a{
	text-decoration: none;
}
a:hover{
	text-decoration: none;
}
.aligh-right{
	text-align: right;
}


img{
	max-width: 100%;
	height: auto;
}
.bg-dark{
	background: rgba(0,0,0,1.0) !important;
}
.navbar{

}

.navbar-nav .dropdown-menu{
	color: #ffffff;
	margin-top: -5px;
	background: linear-gradient(45deg, #34054a 0%,#0d2872 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.dropdown-item{
	color:#ffffff;
	font-weight: 300;
	padding: 10px 20px;
}
.navbar-expand-md .navbar-nav .nav-link {
	color:#ffffff;
        padding-right: 1rem;
        padding-left: 1rem;
    }

.navbar-brand{
	width: 90px;
	height:auto;
	
}

.section1{
	background: url("../images/section1-bg.jpg") no-repeat top center;
	background-size: 100% 100%;
	padding-top:140px;
}

.section1a{
background:#030C2A url("../images/blur-bg.png") repeat-y;
	background-size: 100% auto;
	padding-top:140px;
}


.hero-text{
	color:#ffffff;
/*		margin-left: 25%;*/
	margin-top: 60px;
}
.hero-text h1{
	font-size: 60px;
	font-weight: 900;
	margin-bottom: 60px;
	border-right: none;


}


.typewriter h1 {
  overflow: hidden; /* Ensures the content is not revealed until the animation */
  /*border-right: .15em solid orange; /* The typwriter cursor */
  white-space: nowrap; /* Keeps the content on a single line */
  margin: 0 auto; /* Gives that scrolling effect as the typing happens */
  letter-spacing: .15em; /* Adjust as needed */
  animation: 
    typing 3.5s steps(40, end),
    blink-caret .75s step-end infinite;
}

/* The typing effect */
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

/* The typewriter cursor effect */
/*@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: orange; }
}*/


.section-hd{
	font-size: 50px;
	font-weight: 600;
}

.hero-text p{
	font-size: 24px;
	
}

 .rotateIn {
	 position: absolute;
	 left:245px;
	 top: 50px;
	 width: 190px;
	 
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
  -webkit-animation-duration: 20s;
  animation-duration: 20s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes rotateIn {
  0% {
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-transform: rotate3d(0, 0, 2, -200deg);
  transform: rotate3d(0, 0, 2, -200deg);
  opacity: 1;
  }
  100% {
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-transform: none;
  transform: none;
  opacity: 1;
  }
  }
  @keyframes rotateIn {
  0% {
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-transform: rotate3d(0, 0, 2, -200deg);
  transform: rotate3d(0, 0, 2, -200deg);
  opacity: 1;
  }
  100% {
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-transform: none;
  transform: none;
  opacity: 1;
  }
  } 

.circle{
	transform: rotate(360deg) translate(0px, 0px);
}

.flexbox1{
	display: flex;
	align-content: center;
	
}
.promobtn{
	font-size: 18px;
	padding: 7px 30px 0;
	display: inline-block;
	line-height: 35px;
	border-radius: 50px;
	border: 2px solid #747272;
	font-weight: 600;
	color:#ffffff;
	margin-left: 50px;
}
.promobtn:hover {
	color: #ffffff;
}
.svg-anim{
	position: relative;
	top:100px;
	height:480px;
}

.card-wrapper{
    display: grid;
grid-template-columns: 1fr 1fr 1fr;
	column-gap: 1rem;
	padding-bottom: 60px;
	margin-top: -150px;
	min-height: 550px;
}

.card{
	background: #ffffff;
	align-self: start;
}
.blog1box{
	background: url("../images/blog1-bg.png") no-repeat;
			background-size: 100% auto;
	padding: 35px;
	
	color:#ffffff;
	 transition: all 0.2s ease-out;
	min-height: 330px;
}
.blog1box h3{
/*	font-size: 20px;
	font-weight: 500;*/
	font-size: 14px;
	font-weight: 300;
	margin-bottom: 50px;
	text-transform: uppercase;
}
.blog1box p{
	font-size: 20px;
	margin-bottom: 40px;
}

.blog1box h4{
	font-size: 18px;
		font-weight: 500;
	margin-bottom: 40px;

	
}

.blog1box span{
	font-size: 14px;
		font-weight: 300;
	display: block;

	
}

.blog1box:hover{
		background: url("../images/blog1-bg-hover.png") no-repeat;
	background-size: 100% auto;
	
}
.blog1box:hover h4{
		color: #FF5404
}
.card-hidden{
	display:none;
	 transition: all 0.5s ease-out;

}
.blog1box:hover .card-hidden{
	display:block;
	 transition: all 0.5s ease-out;
}
.readmore{
	font-size: 14px;
	background: #2C144A;
	color: #FFD5BE !important;
	padding: 5px 20px;
	display: inline-block;
	position: relative;
	bottom: -5px;

	
}
.techsights{
	background: url("../images/techsights-bg.png") no-repeat;
		background-size: 100% auto;
}
.techsights:hover{
	background: url("../images/techsights-bg-hover.png") no-repeat;
	background-size: 100% auto;
}

.blog2{
	background: url("../images/blog2-bg.png") no-repeat;
		background-size: 100% auto;
}
.blog2:hover{
	background: url("../images/blog2-bg-hover.png") no-repeat;
	background-size: 100% auto;
}


.mb40{
	margin-bottom: 40px;
}
.sectionpadd{
	padding: 100px 0;
}
.talent{
	background: url("../images/talent-bg.png") no-repeat right top;
	color:#ffffff;
	
}
.section-title{
	border-bottom: 1px solid rgba(256,256,256,0.15);
	padding-bottom: 10px;
	margin-bottom: 40px;
}

.heading2{
	font-size: 32px;
	font-weight: 500;
	margin-bottom: 50px;
}

.heading3{
	font-size: 38px;

}
.talent-wrapper{
	padding-bottom: 80px;
}

.talent-grid{
	padding-top: 100px;
	display: grid;
	grid-template-columns: 26% 26% 26%;
	column-gap: 15px;
	grid-auto-rows: minmax(100px, auto);
align-items: end;
height: 400px;

	}



.talent-card{
	background: #ffffff;
	padding: 30px;
transition: all 1s ease-out;
	height: 250px;
	overflow: hidden;
	position: relative;

}
.userbox .talent-card{
	height: 215px;
}

.userbox .bluebg {
    height: 240px;
}

.talent-card:hover{
	height: 380px;

}

.userbox .talent-card:hover{
	height: 330px;
}
.talent-grid .bluebg{

	width: 100%;
	height: 250px;
		transition: all 1s ease-in-out;
}
.talent-grid .bluebg:hover{
	height: 330px;

}

.hiddentext{
	display: none;
	font-size: 14px;
	font-weight: 300;
	opacity: 0;
	  transition: all 2s ease-in-out ;
}
.hiddenimg{
	display: none;
	opacity: 0;
	  transition: all 2s ease-in-out ;
}

.talent-card:hover .hiddentext{
	display: block;
	opacity: 1;
	transition: all 2s ease-in-out ;
}
.talent-card:hover .hiddenimg{
	display: inline-block;
	opacity: 1;
	transition: all 2s ease-in-out ;
}
	.talent-card:hover .aligh-right{
	text-align: left;
		
}


.white-color{
	color:#ffffff;
}
.white-color:hover{
	color:#f1f1f1;
}
.black-color{
	color:#333333;
}
.orangebg{
	background: #893404;
}

.bluebg{
	background: #304E8B;
}

.t-card-hd{
	/*font-size: 18px;*/
	padding-bottom: 10px;
	border-bottom: 1px solid #ffffff;
	/*font-weight: 600;*/
	margin-bottom: 20px;
	line-height: 24px;
	text-transform: uppercase;
}
.blackborder{
		border-bottom: 1px solid #333333;
}

.talent-text{
	font-size: 20px;
}

.surecafe{
	width: 157px;
	margin: 0 auto 55px auto;
		transition: all 2s ease-in-out ;
}

.talent-card:hover .surecafe{
	width: 100%;
}
.innovation{
	background: url("../images/section2-bg.jpg") no-repeat center top;
}

.innovation-a{

background-image: linear-gradient(to right top, #0b0f1a,  #0b0f1a, #0b151f, #082630, #0a1823, #0b151f, #08232e, #0a1720, #0b141d, #0b0f1a, #0b151f, #082630, #0a1823, #0b151f, #0b141d, #0b141d, #0b141d );
	padding-top:140px;


}





/*galaxy bg animation*/

.bg {
    /*background: url(https://i.ibb.co/87GbbFP/2799006.jpg) no-repeat;*/
    background-size: cover;
    height: auto;
    width: 100%;
  /*  position: fixed;*/
    top: 0;
    left: 0;
    z-index: 1;
}
.bg:before {
    content: "";
    width: 100%;
    height: 100%;
    background: #000;
    position: fixed;
    z-index: 2;
    top: 0;
    left: 0;
    opacity: 0.3;
}
@keyframes sf-fly-by-1 {
    from {
        transform: translateZ(-600px);
        opacity: 0.5;
    }
    to {
        transform: translateZ(0);
        opacity: 0.5;
    }
}
@keyframes sf-fly-by-2 {
    from {
        transform: translateZ(-1200px);
        opacity: 0.5;
    }
    to {
        transform: translateZ(-600px);
        opacity: 0.5;
    }
}
@keyframes sf-fly-by-3 {
    from {
        transform: translateZ(-1800px);
        opacity: 0.5;
    }
    to {
        transform: translateZ(-1200px);
        opacity: 0.5;
    }
}
.star-field {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    perspective: 600px;
    -webkit-perspective: 600px;
    z-index: 2;
}
.star-field .layer {
    box-shadow: -411px -476px #cccccc, 777px -407px #d4d4d4, -387px -477px #fcfcfc, -91px -235px #d4d4d4, 491px -460px #f7f7f7, 892px -128px #f7f7f7, 758px -277px #ededed, 596px 378px #cccccc, 647px 423px whitesmoke, 183px 389px #c7c7c7,
        524px -237px #f0f0f0, 679px -535px #e3e3e3, 158px 399px #ededed, 157px 249px #ededed, 81px -450px #ebebeb, 719px -360px #c2c2c2, -499px 473px #e8e8e8, -158px -349px #d4d4d4, 870px -134px #cfcfcf, 446px 404px #c2c2c2,
        440px 490px #d4d4d4, 414px 507px #e6e6e6, -12px 246px #fcfcfc, -384px 369px #e3e3e3, 641px -413px #fcfcfc, 822px 516px #dbdbdb, 449px 132px #c2c2c2, 727px 146px #f7f7f7, -315px -488px #e6e6e6, 952px -70px #e3e3e3,
        -869px -29px #dbdbdb, 502px 80px #dedede, 764px 342px #e0e0e0, -150px -380px #dbdbdb, 654px -426px #e3e3e3, -325px -263px #c2c2c2, 755px -447px #c7c7c7, 729px -177px #c2c2c2, -682px -391px #e6e6e6, 554px -176px #ededed,
        -85px -428px #d9d9d9, 714px 55px #e8e8e8, 359px -285px #cfcfcf, -362px -508px #dedede, 468px -265px #fcfcfc, 74px -500px #c7c7c7, -514px 383px #dbdbdb, 730px -92px #cfcfcf, -112px 287px #c9c9c9, -853px 79px #d6d6d6,
        828px 475px #d6d6d6, -681px 13px #fafafa, -176px 209px #f0f0f0, 758px 457px #fafafa, -383px -454px #ededed, 813px 179px #d1d1d1, 608px 98px whitesmoke, -860px -65px #c4c4c4, -572px 272px #f7f7f7, 459px 533px #fcfcfc,
        624px -481px #e6e6e6, 790px 477px #dedede, 731px -403px #ededed, 70px -534px #cccccc, -23px 510px #cfcfcf, -652px -237px whitesmoke, -690px 367px #d1d1d1, 810px 536px #d1d1d1, 774px 293px #c9c9c9, -362px 97px #c2c2c2,
        563px 47px #dedede, 313px 475px #e0e0e0, 839px -491px #e3e3e3, -217px 377px #d4d4d4, -581px 239px #c2c2c2, -857px 72px #cccccc, -23px 340px #dedede, -837px 246px white, 170px -502px #cfcfcf, 822px -443px #e0e0e0, 795px 497px #e0e0e0,
        -814px -337px #cfcfcf, 206px -339px #f2f2f2, -779px 108px #e6e6e6, 808px 2px #d4d4d4, 665px 41px #d4d4d4, -564px 64px #cccccc, -380px 74px #cfcfcf, -369px -60px #f7f7f7, 47px -495px #e3e3e3, -383px 368px #f7f7f7, 419px 288px #d1d1d1,
        -598px -50px #c2c2c2, -833px 187px #c4c4c4, 378px 325px whitesmoke, -703px 375px #d6d6d6, 392px 520px #d9d9d9, -492px -60px #c4c4c4, 759px 288px #ebebeb, 98px -412px #c4c4c4, -911px -277px #c9c9c9;
    transform-style: preserve-3d;
    position: absolute;
    top: 50%;
    left: 50%;
    height: 4px;
    width: 4px;
    border-radius: 2px;
}
.star-field .layer:nth-child(1) {
    animation: sf-fly-by-1 5s linear infinite;
}
.star-field .layer:nth-child(2) {
    animation: sf-fly-by-2 5s linear infinite;
}
.star-field .layer:nth-child(3) {
    animation: sf-fly-by-3 5s linear infinite;
}

/*end*/






.innovation-grid{

	background: url("../images/innovation-verticle.png") no-repeat right bottom;
	background-size: 45px auto;

}
.flex{
	display:flex;
	width: 100%;
}

.blog-card-wrapper{
	width: 52%;
	position: relative;
}
.ino-box{
	padding: 20px;
	width: 26%;
	position: relative;
	bottom: 0;
	
}
.ino-box1{
background: #893404;
	color: #ffffff;
	 transition: 500ms linear; 
	width: 50%;
	height: 260px;
	position: absolute;
	
}
.readmorelink{
	position: absolute;
	bottom: 20px;
	
}
.ino-box1:hover{
	height: 350px;
	transition: 500ms linear; 
}
.ino-box:hover .hiddentext{
display: block;
	opacity: 0.7;
	transition: 500ms linear; 

}

.ino-box2{
width: 48%;
text-align: right;
		padding: 0;
padding-left: 40px;
}
.innovatio-logo{
	padding: 10px 0;
	border-bottom: 1px solid #ffffff;
	margin-bottom: 20px;
}
.ino-box3{
padding: 0;
}
.ino-box4{
	position: absolute;
	background: #41756B;
color: #ffffff;
	  transition: 500ms linear; 
	width: 100%;
	height: 242px;
	bottom: 0;
}

.ino-box4:hover{
	bottom:0;
height: 400px;

}

.ino-box5{
width: 48%;
text-align: right;
	padding: 0;
		padding-left: 18%;
}

.ino-box6{
padding: 0;
	text-align: center;
}

.ino-box7{
padding: 0;
	
}

.ino-box8{
background: #E9E9E9;
		height: 242px;
	transition: 500ms linear; 
}
.ino-box8:hover{
	height: 300px;
}


.ino-box1:hover .hiddentext, .ino-box4:hover .hiddentext, .ino-box8:hover .hiddentext{
	display: block
}
.ino-box1:hover .hiddenimg, .ino-box4:hover .hiddenimg, .ino-box8:hover .hiddenimg{
	display: inline-block
}

.user{
	background: url("../images/section3-bg.jpg") no-repeat center center;
	color:#ffffff;
}
.graybg{
	background: #E9E9E9;
}
.section-hd{
	text-transform: uppercase;
}
p .user-text{
	padding-left: 300px !important;
}
.userbox1{
	padding: 40px;
	text-align: center;
}
.userbox{
	width: 33.3%;
	  transition: 500ms linear; 

}
.userbox p .hiddentext{
	font-size: 13px;
	font-weight: 300;
	opacity: 0;
	    transition: all 2s ease-in-out;
}

.user-grid{
	width: 85%;
	margin: auto;
	height: 230px;
}
.userbox4{
	position: relative;
	left: 0;
}
.userbox5{
	height: 220px;
	bottom: 0;
	position: relative;
}
.userbox5:hover{
	height: 450px;

}


/*.userbox5 .talent-card:hover {
    height: 270px;
		overflow: hidden;
}*/


.marque{
	font-size: 30px;
	font-weight: 800;
	letter-spacing: 2px;
	padding: 20px 10px 10px;
	background: linear-gradient(to right, #34054a 0%,#111699 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	color:#ffffff;
	margin-top:-2px;
}
.section4{
	background: url("../images/section4-bg.jpg") no-repeat;
}
.section4a{
    background: 
	linear-gradient(114.95deg, #091d1e 0%, rgba(0, 71, 255, 0) 34.35%), 
	linear-gradient(180deg, #0b0f1a 0%, #FFA7A7 100%), linear-gradient(244.35deg, #FFB26A 0%, #3676B1 50.58%, #320f16 103%), linear-gradient(244.35deg, #FFFFFF 0%, #004A74 49.68%, #0b0f1a 100%), radial-gradient(100% 233.99% at 0% 100%, #B70000 0%, #0b0f1a 100%), linear-gradient(307.27deg, #219D87 20.37%, #0b0f1a 50.19%, #0b0f1a 102%), radial-gradient(100% 140% at 100% 0%, #320f16 0%, #006C7A 49.48%, #760000 100%);
background-blend-mode: hard-light, overlay, overlay, overlay, difference, difference, normal;
}

.section4b{
	background: radial-gradient(100% 147.24% at 0% 31%, #200f17 0%, #000000 100%), linear-gradient(307.27deg, #0b0f1a 80.37%, #2800C6 100%), radial-gradient(100% 140% at 100% 0%, #081752 0%, #0b0f1a 57.29%, #091545 100%);
background-blend-mode: difference, difference, normal;
}

.solutions{
	width: 80%;
	margin: auto;
	margin-bottom: 40px;
}

.ecommerce-grid{
	display: grid;
	grid-template-columns: repeat(3, 1fr); 
	column-gap: 10px;
	row-gap: 10px;
}
.ecombox{
	background: #cccccc;
	position: relative;
}
.ecomtext img{
	opacity:0.5;
	}
.ecomtext{
	position: absolute;
	color: #ffffff;
	width: 100%;
	padding: 10px;
	overflow: hidden;
	bottom:0;
		height: 95px;
	background: none;
  transition: all 0.5s ease-in-out;
}
.ecomtext:hover{
	background: linear-gradient(135deg, rgba(0,60,105,1) 0%,rgba(29,0,60,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	  -webkit-transition: all 1s ease;
  transition: all 0.5s ease;
	height: 100%;
}

.ecom-overlay{
	background: url("../images/toparrow.png") no-repeat right center;
	width: 100%;
	font-size: 16px;
	font-weight: 700;
	padding: 2px 20px 2px 10px ;
	min-height: 60px;
	display: flex;
	align-items: center;

}

.ecomtext ul{
	margin: 0;
	padding: 20px 10px;
	font-size: 13px;
	font-weight: 300;
	border-top:1px solid #ffffff;
}
.ecomtext ul li{
	margin-bottom:10px;
		list-style-type:none;
		margin-left:0;
		padding:0;
	}
	.ecomtext ul li a{
color:#FD5F07;
	}

.hiddentlist{
	display: none;
	opacity: 0;

}
.ecomtext:hover ul.hiddentlist{
	display: block;
	  	opacity: 1;
}

.ecombox:hover .ecom-overlay{
	background: url("../images/down-arrow2.png") no-repeat right center;
	  transition: all 1s ease;
}
.nav-pills .nav-link{

	border: 1px solid #666666;
	border-radius: 50px;
	margin-bottom: 0;
	padding: 10px 20px;
	color: #EBEBEB;
	background: url("../images/sidearrow.png") no-repeat 95% center;
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link{
	border: none;
	background: linear-gradient(to right, rgba(52,5,74,1) 0%,rgba(17,22,153,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

/*.solution-tabs .nav-pills .nav-link{
	font-size: 14px;
}*/
.nav-item{
	margin-bottom: -7px;
	line-height: normal;
}
.nav-pills span{
	display: inline-block;
	font-size: 18px;
	font-weight: 700;
	color: rgba(256,256,256, 0.1);
	float: right;
	margin-top: 10px;
	margin-right: 35px;
}

.industries-grid{
	width: 70%;
	margin: 0 auto;
		display: grid;
	grid-template-columns: repeat(3, 1fr); 
	column-gap: 2px;
	row-gap: 2px;
}
.ind-box{
	height: 214px;
	padding: 20px;
	text-align: center;
	font-size: 20px;
	font-weight: 700;
	color: #ffffff;
transition: all .3s ease-in-out;
}
.ind-box a{
	color: #ffffff;
}
.ind-box{
	background-size: 70% auto;
	text-align: left;
	transition: all .3s ease-in-out;
}

.ind-box:hover{
	background-size: 80% auto;
	transition: all .3s ease-in-out;
}
.banking{
	background: #223B52 url("../images/banking.png") no-repeat left bottom ;
	background-size: 70% auto;
}
.insurance{
	background: #4D5756 url("../images/Insurance.png") no-repeat right bottom;	
	background-size: 60% auto;
}

.healthcare{
	background: #4D5756 url("../images/healthcare.png") no-repeat right bottom;	
	background-size: 50% auto;
}

.lifescience{
	background: #3D2045 url("../images/life-science.png") no-repeat right bottom;
	background-size: 60% auto;
}

.tiu{
	background:  url("../images/tiu-icon.png") no-repeat center center ;	
}

.software{
	background: #3D1F44 url("../images/software.png") no-repeat center bottom;	
	background-size: 50% auto;
}

.consumer1{
	background: #4D5652 url("../images/consumer-icon.png") no-repeat center bottom;	
	background-size: 50% auto;
}

.telecom{
	background: #332828 url("../images/telecom.png") no-repeat right bottom;	
}

.consumer{
	background: #223C55 url("../images/consumer.png") no-repeat right bottom;	
	background-size: 60% auto;
}


.stat-grid{
	display:flex;
	
}


.circle-text{
	width: 200px;
	height: 200px;
	margin: auto;
	border-radius: 50%;
	border: 5px solid #424242;
	color:#ffffff;
	text-align: center;
}

.number{
	font-size: 60px;
	font-weight: 900;
	color: #ffffff;
    -webkit-text-stroke: 1px #ffffff;
	margin-top: 20px;
}
.circle-text:hover .number:hover{
	color:#FD5F07;
	 -webkit-text-stroke: 1px #FD5F07;

}

.growth{
	font-size: 23px;
	color:#ffffff;
	margin-top: 20px;
}


.footer{
/*	background: url("../images/footer-bg.jpg") no-repeat;
	background-size: cover;*/
		color: #fffff;
		background:#030C2A url("../images/footer-bg-new.png") no-repeat center bottom;
	
}
.footercontent{
	padding: 40px 0 0 0;
	border-top: 1px solid rgba(256,256,256,0.25);
}

.copyright{
	border-top: 1px solid rgba(256,256,256,0.25);
	padding: 20px 15px;
	padding-bottom: 50px;
	margin-top: 40px;
	color: rgba(256,256,256,0.55);
	
}

.footer-text{
	margin-top: 40px;
	font-weight: 300;
}
.footer-text li{
	margin-bottom: 10px;
}
.footer-text li a{
	color: #ffffff;
}
.footer-text li a:hover{
	color: #f66c2d;
}


.pb0{
	padding-bottom: 0;
}
.footer-hd{
	font-size: 20px;
}
.footer-text-about{
	margin-top: 40px;
	
}

.social-icons a{
	margin-right: 10px;
	display: inline-block;
	
}
.social-icons a:hover{
opacity: 0.5;
	
}
	
.surecafe-banner{
	background: url("../images/surecafe-bg.png") no-repeat center top;
	background-size: cover;
	height: auto;
}
.surecafe-banner .hero-text h1{
	font-size: 50px;
	font-weight: 600;
	padding-right: 40px;
	margin-top: 150px;
	   /* padding-bottom: 30px;*/
    border-bottom: 1px solid rgba(256,256,256,0.5);
	margin-bottom: 40px;
}
.surecafe-logo{
width: 200px;
	display: inline-block;
	margin: 0 20px;
}
.surecafe-banner h3{
	font-size: 30px;
	font-weight: 500;
	margin-bottom: 30px;
}

.talent-acquisition{
/*	background: url("../images/talent-acquisition-bg.png") no-repeat center top;
	background-size: cover;*/
	  background-image:  linear-gradient(to right top, #0c0f18, #0f0f19, #0b1821, #081d48, #0b0f1a, #0b0f1a, #3b1457, #360000);
	color: #ffffff;
}
.h3heading{
	font-size: 30px;
	margin-bottom: 20px;
	font-weight: 400;
}
.process-ul{
	list-style-type:disc;
	
}
.process-ul li{
	margin-bottom: 20px;
	font-size: 24px;
	font-weight: 500;
	
}
.process{
	margin-top:25%;
}
.our-process{
	background: url("../images/our-process-bg.png") no-repeat center top;
/*	padding: 60px 0;*/
}
.tiuwhitelogo{
	margin-right: 100px;
}

.accordion .fa {
  margin-right: 0.5rem;
}
.accordion button, .accordion button:hover, .accordion button:focus{
  text-decoration: none;
}

.accordionbox{
	    background-image:  linear-gradient(to right top, #0c0f18, #0f0f19, #0b1821, #081d48, #0b0f1a, #0b0f1a, #3b1457, #360000);
}
/*	
	background: url("../images/accordion-bg.png") no-repeat center top;
	background-size: cover;*/

.card-header button{
    width: 100%;
    text-align: left;
	font-size: 33px;
	color: #ffffff;
	*border-bottom: 1px solid #666666;
	padding: 20px 0;

}
.card-header button:out-of-range{
		border-bottom:none;
}
.card-header button .fa-arrow-right{
	color: #CC4C08;
}
.accordionbox .card {
	background: none;
}
.card-body{
	margin-left:0;
	color: #ffffff;
	font-weight: 300;
	line-height: 180%;
}
.accordionbox .card-header .btn{
		background: url("../images/ac1-bg.png") no-repeat 90% top;
}
 
.accordionbox .card-header .collapsed{
		background: none !important;
}

.your-needs{
	background: url("../images/your-needs-bg.png") no-repeat center top;
	background-size:cover;
	color: #ffffff;
	    margin-top: -5px;
}

.need-card{
	position: relative;
	padding-top: 60px;
}
.need-card h5{
	background: url("../images/Arrow45.png")no-repeat 90% center;
	    width: 100%;
	padding: 20px;
	margin-bottom: 20px;
    top: 0;
position: absolute;
	z-index: 101;

}
.need-card-overlay p{
	margin-bottom: 20px;
	
}

.need-card-overlay{
	position: absolute;
	top: 0;
	width: 100%;
	height: auto;
	padding: 20px;
	padding-top: 60px;
	z-index: 100;
	background: linear-gradient(to bottom, rgba(1,120,158,1) 0%,rgba(44,2,64,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
color:#ffffff;
opacity:0;
	  transition: 500ms linear; 
	}
.need-card-overlay:hover{
opacity:1;
	height: 100%;
}
.learn-arrow{
	width: 20px;
	height: auto;
}


.yourneed-tabs{
	margin-top: 20px;
	
}
.nav-item1{
	margin-bottom: 20px;
	background: none;
}

.yourneed-tabs .tab-pane{
	font-size: 26px;
	font-weight: 300;
	padding-left: 40px;
}

.yourneed-tabs .nav-pills .nav-link{
	font-size: 28px;
	font-weight: 300;
	background: none;
	padding: 15px 30px;
	border: 2px solid #ffffff;

}


.yourneed-tabs .tab-pane ol li{
	margin-bottom: 20px;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link{
	
	border: none;
	font-weight: 500;
}

.related-content{
	background: url("../images/related-content-bg.png") no-repeat center top;
	background-size: cover;
	
}
.blogbox2 img{
			transition: all .3s ease-in-out;
		
}

.blogbox2{
	color:#ffffff;
	margin: 10px;
		border:0px solid #F90;
		transition: all .3s ease-in-out;
		overflow:hidden;
	
}



.blogbox2:hover img{
	transform:scale(1.1);

}


.blogtxtbox{
	padding: 20px 15px;
	font-weight:300;
   transition: all .3s ease-in-out;


}
.no-arrow button{
	display: none !important; 
}

.blogbox2:hover .blogtxtbox{
	background: rgba(1,104,173,0.1);
}

.blogbox2:hover .hiddentext{
display: block;
opacity: 1;
	}
	
.blogtxtbox h6{
	font-size:1.3rem}

.related-hd{
	margin: 0 0 50px 15px;
}

.blogtxtbox svg{
	width:20px;
	height:auto;
	
	}
.cms-logobox{
	display: flex;
	border-top: 1px solid rgba(256,256,1256,0.3);
		border-bottom: 1px solid rgba(256,256,1256,0.3);
	padding: 40px 15px;
	justify-content:space-between;
	align-items: center;
	
	}

.casestudy-text{
	font-size: 23px;
	color:#C3F3FF;
	font-weight: 300;
	padding-right: 20px;
}
.casestudy-text span{
	color:#00CAFF;
	font-weight: 700;
	display: inline-block; 
	margin-right: 10px;
}

.casestudy-section2{
	background: url( "../images/Casestudy-bg2.jpg") no-repeat center center;
	background-size: cover;
	
}
.project-goals-wrapper{
	border-left: 1px dashed rgba(256,256,256,0.25);
	
}

.project-goals{
	padding: 0 60px 120px;
	color: #ffffff;
	position: relative;
	
}
.downarrow{
	position: absolute;
	left: -18px;
	top: 55px;
}
.project-goals h3{
	margin-left: -60px;
	padding-left: 60px;
	border-top: 1px dashed rgba(256,256,256,0.25);
	margin-bottom: 30px;
	display: inline-block;
}
.project-goals h3 span{
	background: #03133B;
	display: block;
	margin-top: -5px;
}

.project-results{
	padding: 0 150px 40px 60px;
	color: #ffffff;
	border-top: 1px dashed rgba(256,256,256,0.25);
	border-right: 1px dashed rgba(256,256,256,0.25);
}

.project-results h3{
text-align: center;
		margin-top: -15px;
}
.project-results h3 span{
	background: #03133B;
margin:0 auto 80px;
	display: inline-block;
	text-align: center;

}
.dashborder{
		border-top: 1px dashed rgba(256,256,256,0.25);
	border-left: 1px dashed rgba(256,256,256,0.25);
}
.download-icon{
	margin: 50px 0 0 -20px
}

.download-pdf{
	background: #03133B url("../images/download-bg.png") no-repeat center top;
	background-size: 100% auto;
}
.download-hd{
	text-align: center;
	
}
.download-hd a{
	font-size: 26px;
	background: #FD5F07;
	display: inline-block;
		margin: -30px auto 40px;
padding: 0 0 0 40px ;
	color:#ffffff;
	border-radius: 50px;
	font-weight: 600;
}
.pdf-icon{
	padding: 15px;
	background: #cccccc;
	border-radius: 50%;
	margin-left: 30px;
}




/*expanded search*/
.button:hover {
	transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-webkit-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
	background-color: white;
	color: black;
}

.search-container {
    position: absolute;
    right: 0;
	display: inline-block;
	margin: 4px 2px;
	height: 50px;
	width: 50px;
	vertical-align: bottom;
}

.mglass {
	display: inline-block;
	pointer-events: none;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
}

.searchbutton {
	position: absolute;
	    font-size: 30px;
    color: #ffffff;
	width: 100%;
	margin: 0;
	padding: 3px 0 2px 15px;
}

.search:focus + .searchbutton {
	transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-webkit-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
	background-color: white;
	color: black;
}

.search {
	position: absolute;
	left: 47px; /* Button width-1px (Not 50px/100% because that will sometimes show a 1px line between the search box and button) */
	background-color: white;
	outline: none;
	border: none;
	padding: 0;
	width: 0;
	height: 100%;
	z-index: 10;
	transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-webkit-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
}

.search:focus {
	width: 363px; /* Bar width+1px */
	padding: 0 16px 0 0;
}

.expandright {
	left: auto;
	right: 47px; /* Button width-1px */
}

.expandright:focus {
	padding: 0 0 0 16px;
}
/*expanded search ends*/



.blog1-banner {
	background: url("../images/blog-bg1.png") no-repeat center top;
	background-size: cover;
	padding-top: 170px;
	padding-bottom: 160px;
}
.datebox{
/*	padding: 10px 20px;
	border: 1px solid rgba(256,256,256, 0.5);*/
	border-radius: 10px;
	margin: 40px 20px 40px 15px;
	color: #C3F3FF;
}
.datebox span{
	color: #00CAFF;
}
.blog-section2{
	background: url("../images/blog-section2-bg.jpg") no-repeat center top;
	background-size: cover;
}
.blog-content{
	padding-right: 50px;
}
.blog-content h2{
	font-size: 40px;
}
.topics-title{
	padding:20px 30px 15px;
	background: #000000;
}
.topic-bg{
	background: #3C3A3E;
	padding: 20px 30px;
	font-weight: 300;
	margin-bottom: 15px;
}
.topic-list li a{
	color: #EEEEEE;
	display: block;
	margin: 15px 0;
	text-decoration: underline;
}
.topic-bg a{
	color: #EEEEEE;
	text-decoration: underline;
}
.topic-bg h5{
	border-bottom: 1px solid rgba(256,256,256,0.3);
}
.topic-links{
	padding: 0 20px;
}
.mb8{
	margin-bottom: 90px;
}
.mb5{
	margin-bottom: 50px;
}
.typewriter2{
	margin-left:25%;
	}

/*image color animation */

.talentimg {
	animation-name: backgroundColorPalette;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: linear; 
	/* linear is enabled default, it’s not necessary to add it make it work but it can make your code more expressive */
}


@keyframes backgroundColorPalette {
	0% {
		background: url("../images/Maskgroup.svg") no-repeat;
	}
	25% {
		background: url("../images/Maskgroup2.svg") no-repeat;
	}
	50% {
		background: url("../images/Maskgroup.svg") no-repeat;
	}
	75% {
		background: url("../images/Maskgroup2.svg") no-repeat;
	}
	100% {
		background: url("../images/Maskgroup.svg") no-repeat;
	}
}





.about-img {
	animation-name: backgroundColorPalette;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: linear; 
	/* linear is enabled default, it’s not necessary to add it make it work but it can make your code more expressive */
}


@keyframes backgroundColorPalette {
	0% {
		background: url("../images/Maskgroup.svg") no-repeat;
	}
	25% {
		background: url("../images/Maskgroup2.svg") no-repeat;
	}
	50% {
		background: url("../images/Maskgroup.svg") no-repeat;
	}
	75% {
		background: url("../images/Maskgroup2.svg") no-repeat;
	}
	100% {
		background: url("../images/Maskgroup.svg") no-repeat;
	}
}






.herobganimation {
	animation-name: backgroundColorPalette2;
animation-duration: 5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
/*	animation-timing-function: linear; */
	/* linear is enabled default, it’s not necessary to add it make it work but it can make your code more expressive */
}


@keyframes backgroundColorPalette2 {
	0% {
		background: url("../images/heroanim5.svg") no-repeat bottom center;
		background-size:130%;
	}
	25% {
		background: url("../images/heroanim6.svg") no-repeat bottom center;
		background-size:130%;
	}
	50% {
		background: url("../images/heroanim5.svg") no-repeat bottom center;
		background-size:130%;
	}
	75% {
		background: url("../images/heroanim6.svg") no-repeat bottom center;
		background-size:130%;
	}
	100% {
		background: url("../images/heroanim5.svg") no-repeat bottom center;
		background-size:130%;
	}
}


.herobganimation-123{
	background:url(../images/heroanim5.svg) no-repeat center top;
	background-size:130%;
	}





/*image color animation ends */


.blog .carousel-indicators {
	left: 0;
	top: auto;
    bottom: -40px;

}

/* The colour of the indicators */
.blog .carousel-indicators li {
    background: #a3a3a3;
    border-radius: 50%;
    width: 8px;
    height: 8px;
}
.blogcard-wrapper{
	color:#cccccc;
	background:#232323;
	padding:20px;
	}

.blog .carousel-indicators .active {
background: #707070;
}

.blog-flex{
	display:flex;
	border-top:1px solid #333333;
}

	
.blogcard-wrapper h5{
	padding-left:20px;}
	
	.blogcard-wrapper h6{
	padding-bottom:10px;}
	
	
.blog-card-dark{
	background:#232323;}

.blog-img{
		padding:20px 10px;
	}
	.blogdate{
		float:right;
		font-size:14px;
		color:#F56C2C;
		display:inline-block;
		padding:0 20px;
		background:url(../images/calendar-icon.png) no-repeat;}
.blog-card-text{
	padding:20px 10px;
	width:60%;
	}
	.blog-card-text p{
font-weight:300;
font-size:14px;
	}
.blogs .slide{
	border:none;
	padding:0;}
	
	.blog-card-text a.readmore{
		background:none;
		border:1px solid #666666;}
		
		
/* fore rounded animated text*/

.circle {
	position: relative;
	
	height: 200px;
	border-radius: 100vmax;
	display: flex;
	align-items: center;
	justify-content: center;
}

.logo123 {
	position: absolute;
	width: 140px;
	height: 140px;
/*	background: url("https://assets.codepen.io/7344750/internal/avatars/users/default.png?fit=crop&format=auto&height=512&version=1657025755&width=512");*/
	background-size: cover;
	border-radius: 100vmax;
	background-position: center;
}


.text {
	position: absolute;
	width: 100%;
	height: 100%;
	top:-95px;
left:-25px;
	animation: textRotation 15s linear infinite;
	color:#ffffff;
	text-transform:uppercase;
	letter-spacing:normal;
font-size: 1rem;
}


			.hero-text h1 {
					font-size: 48px;}
				


@keyframes textRotation {
	to {
		transform: rotate(360deg);
	}
}

.text span {
	position: absolute;
	left: 50%;
	
	transform-origin: 0 100px;
}
/**end***/


/*blog card css starts here */


.blogcard-wrapper2{
    display: grid;
grid-template-columns: 1fr 1fr 1fr;
	column-gap: 1rem;
	padding-bottom: 60px;
	margin-top: -150px;
	
	
}

.blogcontainer {
 
  margin: 0 auto;
  padding: 20px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  grid-auto-flow: dense;
  grid-gap: 30px;
  align-items: center;
  justify-content: center;

}


.blogcard-wrapper2 .blogcard {
  position: relative;
padding-bottom:20px;
   background:none;
      transition: all .5s ease-in-out;
}

 .blogcard-wrapper2 .blogcard .card-media {
/*  width: 100%;
  height: 100%;*/
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
/*  z-index: -1;*/
}

 .blogcard-wrapper2 .blogcard .card-media img {
width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s;
}

 .blogcard-wrapper2 .blogcard:hover .card-media img {
  transform: scale(1.5);
  opacity:0;

}

 .blogcard-wrapper2 .blogcard .card-media::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(22, 22, 22, 0);
  transition: all 0.3s;
  z-index: 1;
}

 .blogcard-wrapper2 .blogcard:hover{
  background: #000000;
  width:100%;
  height:100%;
}

 .blogcard-wrapper2 .blogcard .card-content {
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding: 10px;
  opacity: 1;
  transition: all 0.3s;
  color:#ffffff;
}

 .blogcard-wrapper2 .blogcard .card-desc{
	  opacity: 0;
	      padding: 0 28px 10px;
	}


 .blogcard-wrapper2 .blogcard:hover .card-desc{
  opacity: 1;
  z-index:1;
}






 .blogcard-wrapper2 .blogcard .card-content .card-header h3 a {
  display: block;
  color: #ffffff;
  text-decoration: none;
  transition: all 0.3s;
}

 .blogcard-wrapper2 .blogcard .card-content .card-header h3 a:hover {
  color: #cf000f;
}

 .blogcard-wrapper2 .blogcard .card-content .card-desc {
  color: rgba(255, 255, 255, 0.6);
  font-size: 15px;
  line-height: 27px;
}

 .blogcard-wrapper2 .blogcard .card-content .card-footer {
	  opacity:0;
}

 .blogcard-wrapper2 .blogcard .card-content .card-footer .read-more-link {
  display: inline-flex;
  align-items: center;
  color: #ffffff;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s;


}
.read-more-link svg{
	width:20px;
	height:autok;
	}
 .blogcard-wrapper2 .blogcard .card-content .card-footer {
  opacity:1;
  
}

 .blogcard-wrapper2 .blogcard .card-content .card-footer .read-more-link:hover {
  color: #cf000f;
  
}

 .blogcard-wrapper2 .blogcard .read-more-link svg {
  height: 10px;
  margin-left: 10px;
  transition: transform 0.3s;
}

 .blogcard-wrapper2 .blogcard .read-more-link:hover svg {
  transform: translateX(5px);
}

 .blogcard-wrapper2 .blogcard .card-border span {
  display: inline-block;
  position: absolute;
  background-color:#FF5404;
  transition: all 0.3s linear;
  
  z-index: 2;
}

 .blogcard-wrapper2 .blogcard .card-border span.top {
  width: 100%;
  height: 1px;
  top: 0;
  left: 0;
  transform: scaleX(0);
  transform-origin: left;
}

 .blogcard-wrapper2 .blogcard .card-border span.right {
  width: 1px;
  height: 100%;
  top: 0;
  right: 0;
  transform: scaleY(0);
  transform-origin: top;
}

 .blogcard-wrapper2 .blogcard .card-border span.bottom {
  width: 100%;
  height: 1px;
  bottom: 0;
  left: 0;
  transform: scaleX(0);
  transform-origin: right;
}

 .blogcard-wrapper2 .blogcard .card-border span.left {
  width: 1px;
  height: 100%;
  top: 0;
  left: 0;
  transform: scaleY(0);
  transform-origin: bottom;
}

 .blogcard-wrapper2 .blogcard:hover .card-border span.top {
  transform: scaleX(1);
}

 .blogcard-wrapper2 .blogcard:hover .card-border span.right {
  transform: scaleY(1);
  transition-delay: 0.3s;
}

 .blogcard-wrapper2 .blogcard:hover .card-border span.bottom {
  transform: scaleX(1);
  transition-delay: 0.6s;
}

 .blogcard-wrapper2 .blogcard:hover .card-border span.left {
  transform: scaleY(1);
  transition-delay: 0.9s;
}
.card-header h3{
	font-size:20px;
	margin:30px 8px;
font-weight:700;
	text-transform:uppercase;
	/*border-bottom:1px solid #333333;*/
	padding-bottom:10px;
	}
	.card-header h4{
	font-size:18px;
	margin:30px 8px;}
	
	.card-header p{
		margin:20px 8px 0 8px;
		
		}
	 .blogcard-wrapper2 .blogcard:hover .card-header p{
		
		color:#FF5404;
		}
			 .blogcard-wrapper2 .blogcard:hover .card-header h3{
		border-bottom:1px solid #333333;
		
		}

/* Let's write the media query */
 @media (max-width:767px) {
  .blogcontainer {
    grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  }

  .blogcard-wrapper2 .blogcard {
    grid-column: span 3;
    grid-row: span 3;
  }
 
}


/*blog card css ends here */


.solutions-wrapper {
	color:#ffffff;
}
.solutions-wrapper p {
	font-weight:300;
	color:#cccccc;
}
.solutions-wrapper h5 {
	font-weight:400;
	color:#cccccc;
	;
}

.e-font-icon-svg{
	width: 15px;
	height: auto;
	fill:#cccccc;
	margin-right: 5px;
}

.bigtext{
	font-size: 22px;
	line-height: 38px;
	margin-bottom: 30px;
	font-weight: 300;
}
.processarrow{
	width: 30px;
	
}
.surecafe-logo-bg{
	background: url("../images/swril-bg-2.png") no-repeat center center;
	background-size: 110% auto;
	padding: 70px 0;
}

.blogbanner{
	background: url("../images/blog-banner-bg.png") no-repeat center top;
	background-size: cover;
	
}

.blogbanner2{
	background: url("../images/blog-banner-bg-2.png") no-repeat center top;
	background-size: cover;
	
}


.blog-line-logo{
	width: 150px;
}

.arrow-bullet{
	background: url("../images/orange-double-arrow.png") no-repeat left center;
	padding-left: 50px;
	border-bottom: 1px solid rgba(256,356,256, 0.2);
	padding-bottom: 15px;
}

.card-header{
	background: none !important;
	border-bottom:none !important;
	
}
.btn-link{
	border:none !important;
} 
.sap-txt{
	display: none;
	transition: all 0.5s ease-in;
	opacity: 0;
}
.industry-card{
	position: relative;
	/*border: 1px solid rgba(256,256,256,0.25);*/
	margin-bottom: 30px;
}
.industry-text-overlay h4, .keytosuccess h4{
	font-size: 24px;
	font-weight: 900;
	margin-bottom: 20px;
}
.industry-text-overlay{
	position: absolute;
	color: #ffffff;
	padding: 30px;
	width: 100%;
	height: 40%;
	bottom: 0;
	background: none;
	overflow: hidden;
	transition: all .5s ease-in-out;


}
.small-arrow{
	width:20px;
	position: absolute;
	bottom: 15px;
	right: 15px;
}

.industry-text-overlay p{
	font-weight: 300;
	margin-top: 10px;
	font-size: 14px;
}
.industry-card:hover .industry-text-overlay{
	background: #002061;
	height: 100%;
	transition: all .5s ease-in-out;
}
.industry-card:hover .sap-txt{
display: block;
		opacity: 1;
}


.benefits-txt{
	color: #ffffff;
}

.benefits-txt p{
	font-weight: 300;
	margin: 20px 0 30px 0;
	border-bottom: 1px solid rgba(256,256,256,0.25);
	padding-bottom: 15px;
}
.centerlogo{
	padding: 20px;
	margin-top: 90%;
}

.solutions-sap-banner{
	background:url( "../images/solutions-sap-bg.jpg")no-repeat center top;
	background-size: cover;
}
.web-design-banner{
	background:url( "../images/WebDesign-bg.jpg")no-repeat center top;
	background-size: cover;
}
.keytosuccess  .nav-pills .nav-link{
		background: #384572;
	padding: 15px 30px;
	border-radius: 0;
	border: none;
	margin-bottom: 2px;
	font-size: 27px;
	font-weight: 500;
}
.keytosuccess .nav-pills .nav-link.active, 
.keytosuccess .nav-pills .show>.nav-link{
	background: #000F46;
	
	
}

.keytosuccess .tab-content{
	background: #000F46;
	padding: 5px 40px;
}

/*responsive tabs*/

.keytosuccess .nav-pills {
    display:none;
}

@media(min-width:768px) {
	
	.keytosuccess h4{
		color: #ffffff;
		padding: 0;
	}
 .keytosuccess .nav-pills {
        display: flex;
    }
    
    .keytosuccess .card {
        border: none;
    }
		.keytosuccess .card-body {
			padding: 0 5px;
		}

    .keytosuccess .card .card-header {
        display:block;
		padding:10px  0;
    }  

    .keytosuccess .card .collapse{
        display:block;
    }
	
	
}

@media(max-width:767px){
	
	.keytosuccess .tab-content{

	padding: 5px;
}

		.keytosuccess .card-header{
		padding: 0;
		color: #ffffff;
		font-size: 20px;
		
	}
	
    .keytosuccess .tab-pane {
        display: block !important;
        opacity: 1;
    }
}



/*.benefits-txt p{
	font-size: 20px;}*/



.benefits-txt ul{

	font-weight: 300;
	padding: 0 50px 0 10px;
	margin: 0 0 20px 0;
}

.benefits-txt ul li{
	padding: 5px 0 10px;
	margin: 5px 10px;
	border-bottom: 1px solid #4F4D4D;
}

.h5-blog{
	font-size: 22px;
	    border-bottom: 1px solid rgba(256,256,256,0.25);
    padding-bottom: 10px;
    margin-bottom: 20px;
}


 .keytosuccess2 .card{
	transition: all 0.5s linear;
}
.keytosuccess2 .card-body{

  transition: all 0.5s linear;
}
.keytosuccess2 .card-header{
	font-size: 30px;
	font-weight: 200;
border-bottom: 1px solid rgba(256,256,256,0.25) !important;
	 
}
 .keytosuccess2 .accordion .card-header:after {
    font-family: 'FontAwesome';  
    content: url("../images/up-arrow.png");
    float: right; 

	
}
 .keytosuccess2 .accordion .card-header.collapsed:after {
    /* symbol for "collapsed" panels */
    content: url("../images/down-arrow.png"); 
	
}

.innerpagebg, .casestusybox{
	background:#030C2A url("../images/blur-bg.png") repeat-y;
	background-size: 100% auto;
	color: #ffffff;
}
.blogtxtbox h3{
	font-size-adjust: 32px;
	font-weight: 300;


}
.blog-date{
	color: rgba(256,256,256,0.5);
}

.solutions-wrapper h2, .section-title h2, .ino-box2 h2{
	font-size: 32px;
}

.breadcrumb-box p a {
 display: inline-block;
	color: #cccccc;
}
.breadcrumb-box p a span {
 display: inline-block;
	color: #cccccc;
	margin: 0 10px;
}

.right-nav{
	border: 1px solid #666666;
	margin-top: 5px;
}

.right-nav ul{
	list-style-type: none;
	padding: 0;
	margin: 0;
}


.right-nav ul li{
	padding:10px 20px 10px 40px;
	border-bottom: 1px solid #666666;
	
}
.right-nav ul li a{
	color: #0999B9;
	display: block;
}

.right-nav ul li:hover{
	color: #0999B9;
background: rgba(256,256,256,0.1)
}

.right-nav ul li.active a{
		color: #ffffff;
}
.right-nav ul li.active{
	background: url("../images/orange-arrow.png") no-repeat 10px 12px;
}




.parallax {
  /* The image used */
	position: relative;
  background-image: url("../images/highlighs-bg.png");

  /* Set a specific height */
  min-height: 500px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 50% auto;
}

.stat-card{
	padding: 40px 20px;
	text-align: center;
	color: #ffffff;
	position: relative;
	background: linear-gradient(to bottom, rgba(2,45,76,1) 0%,rgba(52,2,65,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	
}
.stcard2{
	top:80px;
}

.stcard3{
	top:160px;
}

.stat-card:hover .number{
color:#FD5F07;
	 -webkit-text-stroke: 1px #FD5F07;
}

.aboutus-banner{
	background:#060d26 url( "../images/aboutus-banner-bg.jpg")no-repeat center top;
	background-size: 100%;
	margin-top:60px;

}
.card-wrapper2{
	margin-top: 50px;
}


.blog1box-t-bg{
	background: url("../images/t-bg.png") no-repeat;
			background-size: 100% auto;

}

.blog1box-t-bg:hover{
	background:#36053A url("../images/t-bg-hover.png") no-repeat;
			background-size: 100% auto;

}

.blog1box-i-bg{
	background: url("../images/i-bg.png") no-repeat;
			background-size: 100% auto;

}

.blog1box-i-bg:hover{
	background:#36053A url("../images/i-bg-hover.png") no-repeat;
			background-size: 100% auto;

}

.blog1box-u-bg{
	background: url("../images/u-bg.png") no-repeat;
			background-size: 100% auto;

}

.blog1box-u-bg:hover{
	background: #36053A url("../images/u-bg-hover.png") no-repeat;
			background-size: 100% auto;

}

.section-title2{
	border-bottom: 1px solid rgba(256,256,256,0.15);
	padding-bottom: 10px;
	margin-bottom: 40px;
}

.agilebox{
	min-height: 307px;
	padding: 30px;
	border: 1px solid rgba(256,256,256,0.15);
	margin-bottom: 30px;
	color: #cccccc;
	transition: all .25s ease-in;
}

.agilebox:hover{
background: #00194C;
}
.agilebox h3{
	font-size: 28px;
	color: #00CAFF;
	font-weight: 400;
}
.agilebox h3 span{
	color: rgba(255,255,255,0.20);
	font-size: 45px;
	font-weight: 900;
	display: inline-block;
	margin-right: 10px;
}

/* css for tabs to accordion*/

.ourprocess .nav-pills .nav-link{
	background: none;
	border: none;
	color: #5A5A5A;
		font-size: 28px;
	font-weight: 400;
	padding-left: 40px;
	background: url("../images/gray-arrow.png") no-repeat left center;
}
.ourprocess .nav-pills .nav-link.active, .ourprocess .nav-pills .show >.nav-link{
	background: none;
background: url("../images/blue-arrow.png") no-repeat left center;
	color: #ffffff;
	font-weight: 600;
	
}

	@media(min-width:768px) {
    .ourprocess .nav-pills {
        display: flex;
    }
    
    .ourprocess .card {
        border: none;
		background: none;
    }
		 .ourprocess .card-body {
			padding: 0;
			 color: #cccccc;
		}

     .ourprocess .card .card-header {
        display:block;
		         padding: 20px 0;
        font-size: 20px;
    }  

    .ourprocess .card .collapse{
        display:block;
	
    }
}

@media(max-width:767px){
	
	.ourprocess .nav-pills {
    display:none !important;
}
	
     .ourprocess .tab-pane {
        display: block !important;
        opacity: 1;
    }
	
	.ourprocess .card{
	background: none !important;
	}
	    .ourprocess .card .card-header {
			font-size: 18px;
			font-weight: 700;
}
}

/***/



.aboutus-banner .blog1box h3{
	font-size: 28px;
	padding-bottom: 10px;
	margin-right: 40px;
	border-bottom: 1px solid rgba(255,255,255,0.15);
}

.surecafe-accordion .card{
	background: none !important;
}

.surecafe-accordion .card-body{
	padding: 0 20px;

}
.surecafe-accordion .card-header span{
   display: inline-block;
    margin-right: 10px;
	font-weight: 900;
	color:#00CAFF;
}

.surecafe-accordion .card-header button {
  padding: 0px 0 20px 0;
	border-bottom: 1px solid rgba(255,255,255,0.17)!important;
}

.hiring h3{
color: #00CAFF;
	
}

.digital-bg{
	background: url("../images/digital-swril.png") no-repeat center top;
	background-size: cover;
		padding: 20px;
}
.tabs-title{
	color:#00FFFF;
}
.digital-tab-content{
	padding: 20px 40px 20px 0;
}
.digital-tab-content ul li{
	font-weight: 200;
	font-size: 22px;
	margin-bottom: 10px;
}

.ecommerce-banner{
background:#030C2A url( "../images/ecommerce-bg.jpg")no-repeat center top;
	background-size: cover;
}
.portfolio-wrapper{
	border-bottom: 1px solid rgba(255,255,255,0.17);
	border-top: 1px solid rgba(255,255,255,0.17);
}

.iot-banner{
background:#030C2A url( "../images/iot-banner-bg.jpg")no-repeat center top;
	background-size: cover;
}


.digital-banner{
background:#030C2A url( "../images/digital-banner-bg.jpg")no-repeat center top;
	background-size: cover;
}

.mobileapp-banner{
	
	background:#030C2A url( "../images/mobile-banner-bg.jpg")no-repeat center top;
	background-size: cover;
}

.webdesign-banner{
	
	background:#030C2A url( "../images/WebDesign-banner-bg.jpg")no-repeat center top;
	background-size: cover;
}

.data-science-banner{
	
	background:#030C2A url( "../images/data-science-banner-bg.jpg")no-repeat center top;
	background-size: cover;
}
.clinical-banner{
	
	background:#030C2A url( "../images/clinical-banner-bg.jpg")no-repeat center top;
	background-size: cover;
}
.agile-banner{
	background:#030C2A url( "../images/agile-banner-bg.jpg")no-repeat center top;
	background-size: cover;
	
}


.nav-item a:active { 
	color:#333 }

.min-height-370{
	min-height: 370px;
}


.form-wrapper{
	width: 80%;
	margin: auto;
	margin-top: 10px;
	
}

.form-wrapper .inpt, .form-wrapper textarea{
	width: 100%;
	padding: 5px;
	border: 1px solid #666666;
	color: #8F8E8E;
	margin-bottom: 25px;
	background: none;
}

.formbtn{
	padding: 10px 30px;
	color: #000000;
	background: #ffffff;
	border: none;
	outline: none;
	border-radius: 50px;
	cursor: pointer;
}

.privacy-policy-banner{
		
	background:#030C2A url( "../images/sitemap-bg.png")no-repeat center top;
	background-size: 100% auto;
}

.extended-reality-cs-banner{
		
	background:#030C2A url( "../images/axe-throwing-bg.jpg")no-repeat center top;
	background-size: 100% auto;
}
.empowering-cs-banner{
		background:#030C2A url( "../images/empowering-bg.jpg")no-repeat center top;
	background-size: 100% auto;
}

.medical-ecommerce-cs-banner{
	background:#030C2A url( "../images/medical-ecommerce-magento-bg.jpg")no-repeat center top;
	background-size: 100% auto;
}

.supplychain-cs-banner{
	background:#030C2A url( "../images/supply-chain-bg.jpg")no-repeat center top;
	background-size: 100% auto;	
	
}
.comprehensive-solution-cs-banner{
		background:#030C2A url( "../images/comphrensive-banner-cs.jpg")no-repeat center top;
	background-size: 100% auto;	
}
.transforming-cs-banner{
	background:#030C2A url( "../images/transforming-diagnostics-bg.jpg")no-repeat center top;
	background-size: 100% auto;	
}
.ecommerce-cs-banner{
	background:#030C2A url( "../images/ecommerce-cs-bg.jpg")no-repeat center top;
	background-size: 100% auto;		
	
}

.mobile-tablet-cs-banner{
	background:#030C2A url( "../images/mobile-and-tablet-bg.jpg")no-repeat center top;
	background-size: 100% auto;	
	
}

.multi-lingual-cs-banner{
		background:#030C2A url( "../images/multi-lingual-bg.jpg")no-repeat center top;
	background-size: 100% auto;	
	
}
.blue-color{
	color: #00CAFF;
}
.breadcrumb-box span{
	margin: 0 5px;
}
.bigtext2 li{
	margin: 10px 0;
}

.bigtext2{
	font-size: 18px;
}
.sitemap-content h2{
	font-size: 28px;
}
.sitemap-content h2 a{
color: #00CAFF;
}
.sitemap-content p a{
	color: #cccccc;
}

.sitemap-content ul li a{
	color: #A4A3A3;
}
.sitemap-content a:hover{
	color:#00CAFF;
}
/*.innpagebanner{
	padding: 0 0 50px 0;
}*/

.cs-text{
	margin-bottom: 100px;
	padding: 0 15px;
}
.cs-text2{
padding: 0 15px;
}

.cs-text .h3heading, .cs-text2 .h3heading{
	color:#00CAFF;
	font-size: 28px !important;
    font-weight: 400 !important;
	border-bottom: 1px solid rgba(255,255,255,0.18);
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.slide .bigtext2{
	margin-top: 20px;
}
.casestudies-wrapper .slide a{
	color: #ffffff !important;
}



.bigtext2 strong{
	font-weight: 800;
}
.bigtext2 > li{
	margin-bottom: 20px;
}



.float-container {
    position: fixed;
    top: 33%;
    right: 0;
	    z-index: 100;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    width: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.float-container a {
    z-index: 99;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  align-items: center;
	width: 207px;
    margin-right: -150px;
    margin-bottom: 10px;
    padding: 5px 15px;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    text-decoration: none;
    color: white;
    border-color: #46b8da;
    border-radius: 5px 0 0 5px;

    
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    font-family: sans-serif;
	background: linear-gradient(135deg, rgba(11,145,255,1) 0%,rgba(144,11,156,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.float-container a:hover {
    margin-right: 0;
 
}

/* Icon settings - remove if not needed*/
.float-container .icon:before {
    font-family: "Font Awesome 5 Free";
     margin-right: 12px;
    padding-top: 5px;
    -webkit-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
}

.icon.one:before {
    content: url("../images/download.png");
}


/* Media queries */
@media screen and (max-width:767px)
{
	.float-container .icon:last-child {
	/*	display: none;*/
	}
    .float-container
    {
        position: fixed;
        top: auto;
        bottom: 0;
z-index: 1000;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
            -ms-flex-direction: row;
                flex-direction: row;

        width: 100%;

        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: auto;
        -webkit-box-align: auto;
        -ms-flex-align: auto;
        align-items: auto;
    }
		.float-container a.icon
    {
        right: 0;
        bottom: 0;

        width: 100%;
        margin-right: 0;
        margin-bottom: 0;
        padding: 5px;

        border-radius: 0;
        -webkit-box-shadow: 0 0 0 #7d7d7d;
                box-shadow: 0 0 0 #7d7d7d;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
		border-left: 1px solid darkorange;
		border-right: 1px solid darkorange;
    }
}

.related-hd{
	font-weight: 700;
}
.tech{
	margin-left: -15px;
}
.no-padd{
	padding-left: 0;
}

.slide .bigtext2{
	margin-top: 15px;
	margin-left: 0;
}
#thankyou{
	padding-top: 100px;
	margin-bottom: 50px;
}

.social-icons{
	display: none;
}

.copyright p{
	float: none !important;
}
.surecafe-logo-bg .heading2{
	margin-left: 15px;
}
.pl-15{
	padding-left: 15px;
}


.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover{
	background: #0468A9;
	color: #ffffff;
}


.partners-banner{
						background: url("images/partners-bg.jpg") no-repeat center top;
	background-size: cover;
				}
				
				.client-logo-wrapper{
					padding: 10px 5px;
					border: 1px solid #333333;
					margin-bottom: 20px;
					text-align: center;
					
					transition: all .25s ease-in;
				}
				.client-logo-wrapper:hover{
				background: #ffffff;
					border: 1px solid #FD5F07;
				}
			
			
				.formbtn:hover{
					color:#000000;
				}
				.testimonial-card{
					background: linear-gradient(135deg, rgba(106,14,87,1) 0%,rgba(5,98,123,1) 100%);
					border-radius: 10px;
					padding: 40px;
					min-height: 360px;

					
				}
				.testimonial-img{
					margin-top: 5px;
				}

				.tech-wrapper h4{
					font-size: 20px;
					
				}

				.case-studies .slick-next {
					right: 40px;
				}	
				.case-studies .slick-prev {
					left: 86%;
				}	





				/*classes for new about us page*/

				.industry-box{
					border:1px solid #333333;
				box-sizing: border-box;
						transition: all .25s ease-in;
			
				}
				
				.industry-box1{
				padding: 30px 25px 20px 25px;
					text-align: center;
	}
			.industry-box:hover{
					background: #2A0836;
				}
				
					.industry-box:hover p{
					color: #ffffff;
				}
				
				.industry-box p{
						font-size: 20px;
					margin-top: 30px;
					font-weight: 600;
					color: #F56C2C;
				}
				
				.industry-boxes-wrapper{
					margin-top: 60px;
					margin-bottom: 60px;
					box-sizing: border-box;
					
				}
				.excellence {
 	 padding: 30px;
    
    color: #cccccc;
    transition: all .25s ease-in;
}
			.excellence-box{
					border: 1px solid rgba(256, 256, 256, 0.15);
    margin: 30px 0;
				transition: all .25s ease-in;
				background: rgb(2,45,76, 0);
				}
				.excellence-box:hover{
				
background: linear-gradient(0deg, rgba(2,45,76,1) 0%, rgba(52,2,65,1) 100%);
				}
				.missionbox{
					margin-bottom: 30px;
				}
					.mission-img {
    margin-right: 30px;
					width: 15%;
}
				.mission-text{
					width: 85%;
				}
				
				.mission-text h4{
					color: #0674CD;
				}
				.capability-img{
					margin-left: 50px;
				}
					.capability-text{
						font-weight:500;
						display: inline-block;
						width: 60%;
						border-bottom: 1px solid #333;
						padding-bottom: 10px;
					
				}
				.excellencebox{
					background: url("../images/excellencebox-bg.png") no-repeat center center;
					background-size: contain;
					
				}
				
				.commitment-box{
					padding: 30px;
					border: 1px solid #333333;
					margin-bottom: 80px;
					transition: all .3s ease-in;
					
				}
				.commitment-box:hover{
					background: rgba(85,115,169,0.2) url("../images/half-circle.png") no-repeat top right;  
						
				}
				.commitment-box h4{
					font-size: 28px;
					font-weight: 500;
					color: #0674CD;
	}
				.emailbox{
					text-align: center;
					padding:20px;
					border-left: 1px solid #333333;
				}
				
				.connect-box{
					padding: 30px;
					border: 1px solid #333333;
				background: #11192B;
				}
				.tech-wrapper{
					position: relative;
					overflow: hidden;
					
				}
				
			
				.tech-wrapper-overlay{
					padding: 20px;
					position: absolute;
					width: 100%;
					height: 100%;
				
			}


			
			
				
				.readmorebtn2{
					position: absolute;
					bottom:-40px;
					right: 20px;
					transition: all .5s ease-in;
					z-index: 1002;
				}
				.casestudy-hidden-text{
					color: #cccccc;
					position: relative;
					left: -500px;
					transition: all .5s ease-in;
				
				}
				
				
				.tech-wrapper{
					background: rgba(34, 12, 104, .9);
				}
			.casestudy-img{
					opacity: 1;
					transition: all .5s ease-in;
				}
				.tech-wrapper:hover .casestudy-img{
				transform: scale(1.3); 
					opacity: 0;
				}
				
				.tech-wrapper:hover .readmorebtn2{
					position: absolute;
					bottom:20px;
					right: 20px;
					
				}
				.tech-wrapper:hover .casestudy-hidden-text{
					position: relative;
					left: 0;
				
				}
				
				
				.case-studies .slick-slide{
					padding: 0;
					margin: 0 15px;
				}
				.casestudy-title{
					font-size: 12px;
					transition: all .5s ease-in;
					position: relative;
					z-index: 1001;
					
				}
				
				.tech-wrapper h4 {
    position: relative;
					z-index: 1001;
					
}




				.case-studies .slick-prev, .case-studies .slick-next {
    position: absolute;
    top: 108%;
    transform: translateY(-50%);
    z-index: 1;
    font-size: 0;
    cursor: pointer;
    transition: all 0.3s ease;
    border: none;
    background: transparent;
    outline: none;
					opacity: 0.5;
}
				.slick-prev:hover, .slick-next:hover {
					opacity:1;
				}
				
			
					.slick-dots{
					position: absolute;
						width: 100%;
						text-align: center;
						
						bottom: -65px;
				}
				.slick-dots button{
					color:#666666;
					border: none;
					outline: none;
					height: 20px;
					background: #666666;
					
				}
				.slick-dots li{
					display:inline-block;
					margin: 0 5px;
				}
				
				.case-studies .slick-next:before {
    content: url("../images/sliderarrow-right.jpg") !important;
    display: inline-block;
    width: 20px;
    height: 20px;
  
    transform: rotate(0deg);
}
.case-studies .slick-prev:before {
    content: url("../images/sliderarrow-left.jpg") !important;
    display: inline-block;
    width: 20px;
    height: 20px;
  
    transform: rotate(0deg);
}
					

				/****end*/

				.orange-bar{
					position: absolute;
					left: 0;
					top: 40px;
				}
				.lets-connect{
					color:#FD5F07;
					transition: all .2s ease-in-out;
				
				}
				.lets-connect:hover{
					color:#0674CD;
				}

				/*css for case studies*/

				.cs-banner{
					background: url("../images/Casestudy-bg.jpg") no-repeat center top;
background-size: cover;
			}
			
			.client-logo-wrapper{
				padding: 5px;
				border: 1px solid #333333;
				margin-bottom: 20px;
				text-align: center
			}
			.formbtn:hover{
				color:#ffffff;
			}
			.testimonial-card{
				background: linear-gradient(135deg, rgba(106,14,87,1) 0%,rgba(5,98,123,1) 100%);
				border-radius: 10px;
				padding: 40px;
				min-height: 360px;

				
			}
			.testimonial-img{
				margin-top: 5px;
			}
			
			.case-studies-wrapper .slide{
				margin-bottom: 70px;
			}
			
					.case-studies-wrapper .slide a{
				color:#ffffff;
			}
			.orange-bg-gradient{
				background: url("../images/orange-bg-gradient.png") no-repeat  280px -18%;
				background-size: contain;
			}
			.cs-wrapper{
				position: relative;
				height: 288px;
				margin: 1px;
				overflow: hidden;
				padding: 40px;
				
			}
			.orange-bar{
				position: absolute;
				left: 0;
				top: 40px;
			}
							.cs-wrapper .casestudy-hidden-text {
position: relative;
left: 0 !important;
bottom: -200px;
transition: all .5s ease-in-out;
								
					
}
			
			.cs-wrapper:hover .casestudy-hidden-text {
position: relative;
				
bottom: 100px;
					
}
			.cs-wrapper .circle-arrow {
		   bottom: 40px ;
right: 40px;
				  position: absolute;
				transition: all .25s ease-in;
			}
			.cs-wrapper:hover .circle-arrow {

bottom: 40px ;
right: 30px;
}
			.csbg1{
				background: rgba(47,55,101,0.37);
			}
			
			.csbg2{
				background: rgba(190,182,178,0.25);
			}
			
			.csbg3{
				background: rgba(39,178,188,0.20);
			}
			
			.csbg4{
				background: rgba(84,88,116,0.25);
			}
			.csbg5{
				background: rgba(111,86,78,0.25);
			}
			
			.tiulogo-transperant{
				margin: 5% auto;
				width: 115px;
				height: auto;
				
			}
			
				.csbg6{
				background: rgba(98,135,168,0.25);
			}
	
			
			.csbg7{
				background: rgba(48,49,55,0.50);
			}
			
		
					.csbg8{
				background: rgba(131,115,105,0.25);
			}
			.latest-insights{
		/*		background: url("../images/cs-bg.png")no-repeat top left;*/
				padding-top: 150px;
				margin-top: -290px;
			}
			
			.bighd{
				position: relative;
				overflow: hidden;
				height: 200px;
				margin-top: 30px;
				
			}
			
			.cs-wrapper .bighd h3 {
				position: relative;
				
				bottom: 0;
				transition: all .5s ease-in-out;
			}
			
			.cs-wrapper:hover .bighd h3 {
				position: relative;
				bottom: 300px;
			}
			.techsights-topm{
				margin-top: 240px;
			}

			
			.cs-wrapper2{
				padding: 20px 0;
				background: url("../../images/orange-topline.png") no-repeat top left;
				margin-bottom: 50px;
				position: relative;
			}
			.box-botoom-line{
				background: linear-gradient(to right, rgba(53,106,160,0) 0%,rgba(53,106,160,.5) 50%,rgba(53,106,160,0) 100%);
				position: absolute;
				height: 2px;
				width: 100%;
				bottom: 0;
			}
			.cs-wrapper2:hover{
				background: linear-gradient(to right, rgba(53,106,160,0) 0%,rgba(53,106,160,.2) 50%,rgba(53,106,160,0) 100%);
			}
			.cs-wrapper2 h6{
				font-size: 24px;
				font-weight: 500;
				margin-bottom: 30px;
			}
			.no-border{
				border:none;
			}
			.cs-details-bg{
				background: url("../../images/cs-detail-bg.png") no-repeat bottom right;
			}
			.transperant-logo img{
				width: 100px;
				height: auto;
			}
			.critical-business{
				background: url("../../images/cs-bg.png")no-repeat top left;
			}
			
	
			/*cs-accordion*/
			
			.faq-drawer {
margin-bottom: 30px;
				border-bottom: #333333 1px solid;
				padding-bottom: 20px;
}

.faq-drawer__content-wrapper {
font-size: 1.2em;
line-height: 1.4em;
color: #cccccc;
max-height: 0px;
overflow: hidden;
transition: 0.25s ease-in-out;
 margin-top: 20px;
margin-right: 30px;
}

.faq-drawer__title {

cursor: pointer;
display: block;
font-size: 1.55em;
font-weight: 700;
position: relative;

transition: all 0.25s ease-out;
}

.faq-drawer__title::after {

content: url("../../images/plus.png");
display: inline-block;
float: right;

left: 2px;
position: relative;
right: 20px;
top: 5px;
transition:all 0.35s ease-in-out;
vertical-align: top;

}

/* OPTIONAL HOVER STATE */
.faq-drawer__title:hover { 
color: #cccccc  ;
}

.faq-drawer__trigger:checked
+ .faq-drawer__title
+ .faq-drawer__content-wrapper {
max-height: 350px;
}

.faq-drawer__trigger:checked + .faq-drawer__title::after {
content: url("../../images/minus.png");

}

input[type="checkbox"] {
display: none;
}
			.faq-drawer__title span{
				color:#FD5F07;
			}
			
			.Pioneering{
				background: url("../../images/tech-benifits-bg.png") no-repeat center center;
			
			}
			.cs-wrapper3{
				margin-bottom: 50px;
			}
			.cs-wrapper3 h6{
				font-size: 24px;
				margin-bottom: 10px;
			}
			
			

			
			/*end*/


			.gray-color{
				color:#909090;
			}
			.bigtext2{
				color:#ebebeb ;
			}
			.transforming-challenges-bg{
				background: url("../../images/transforming-challenges-bg.png") no-repeat left -200px;
			}
			.discover-bg1{
	position: relative;
				text-align: right;
	
			}
			
				.discover-bg{
	position: absolute;
					text-align: left;
					width: 100%;
					height: 100%;
			}
			.line{
				font-size: 42px;
				font-weight: 700;
				margin-bottom: 30px;
				margin-top: -5px;
			}
			.line2{
				margin-left: 100px;
				color: #C3C3C3;
			}
			.line3{
				margin-left: 200px;
				color: #8B8B8B;
			}
			
			.industry-card:hover .industry-text-overlay {
				background: #2A0836;}
			.capabilities-bg{
				background: url("../../images/capabilities-bg.png") no-repeat right 115%;
				background-size: 80%;
			}
			.innovatiob-bg{
				background: url("../../images/innovation-bg.png") no-repeat center top;
				background-size: cover;
				
			}

			.latest-insights a{
				color:#ffffff;
			}

			.surecafe-banner .hero-text h1 {
				padding-bottom: 20px;
			}