/*!
 * Start Bootstrap - Creative Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */
 
/*@import url('https://fonts.googleapis.com/css?family=Lato:400,700&display=swap');*/

@font-face {
  font-family: 'Effra-Regular';
  src: url('../fonts/Effra-Regular/Effra-Regular.eot?#iefix') format('embedded-opentype'),  url('../fonts/Effra-Regular/Effra-Regular.woff') format('woff'), url('../fonts/Effra-Regular/Effra-Regular.ttf')  format('truetype'), url('../fonts/Effra-Regular/Effra-Regular.svg#Effra-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'EffraMedium-Regular';
  src: url('../fonts/EffraMedium-Regular/EffraMedium-Regular.eot?#iefix') format('embedded-opentype'),  url('../fonts/EffraMedium-Regular/EffraMedium-Regular.woff') format('woff'), url('../fonts/EffraMedium-Regular/EffraMedium-Regular.ttf')  format('truetype'), url('../fonts/EffraMedium-Regular/EffraMedium-Regular.svg#EffraMedium-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Effra-Bold';
  font-display: swap;
  src: url('../fonts/Effra-Bold/Effra-Bold.eot?#iefix') format('embedded-opentype'),  url('../fonts/Effra-Bold/Effra-Bold.woff') format('woff'), url('../fonts/Effra-Bold/Effra-Bold.ttf')  format('truetype'), url('../fonts/Effra-Bold/Effra-Bold.svg#Effra-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}


html, body {
    height: 100%; font-size: 18px;  line-height: 30px; color:#666; 
}

body {
    font-family: "Effra-Regular", sans-serif; margin:0; padding:0;
}

a {
    color: #666;
    text-decoration: none;
    transition: 0.3s ease-in-out;
}

a:hover {
    color: #000; text-decoration: none;
}

header {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
	z-index:10;
	padding:20px 0;
	transition: all 0.3s;
	/*box-shadow: 0 0 10px rgba(0,0,0,0.2);*/
	
}
header.active {background-color:rgba(0,0,0,.7); padding: 10px 0;}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Effra-Bold', sans-serif; color:#222; margin:0 0 20px;
}


h1 {font-size:65px; line-height:65px;}
h2 {font-size:50px; line-height:50px;}
h3 {font-size:30px; line-height:40px;}
h4 {font-size:20px; line-height:25px;}

/*h1:after {content:''; width:50px; height:5px; background-color:#42c3f1; margin-top:15px; display:block;}
h1.text-center:after {margin:15px auto 0;}*/


.bold {font-weight:700;}

/*h1:after {background: #000; content: ""; display: block; height: 2px; position: relative; top: 10px; width: 5%; margin:20px auto 50px; }
h2:after {background: #000; content: ""; display: block; height: 2px; position: relative; top: 10px; width: 20%; margin:10px auto 50px; }
*/

p {
    margin-bottom: 20px;
    font-family: 'Effra-Regular', sans-serif;
	font-size: 18px;
    line-height: 30px;
	color:#666;
}


section {
    padding: 100px 0; background-color: #fff; overflow: hidden;
}

/*.maincontainer {width: 100%; background-color: #fff; position: relative; z-index: 1; display:table;}*/

.bggray {background-color:#F2F2F2;}

.navbar {padding:0 1rem;}
.navbar-brand {width:150px; margin-right:0; padding:0;}
.navbar-nav li a {font-size:1rem; color:#000; position:relative; padding:26px 15px; display:block;}

nav ul li a,
nav ul li a:after,
nav ul li a:before {
  transition: all .5s;
}
.navbar ul li a:after {
  position: absolute;
  bottom: 0px;
  left: 0;
  right: 0;
  margin: auto;
  width: 0%;
  content: '.';
  color: transparent;
  background: #49c1ba;
  height: 4px;
  visibility:hidden;
}

.navbar ul li a:hover:after {
  width: 100%; visibility:visible;
}
.navbar ul li ul li a:hover:after {visibility:hidden;}
.navbar ul li ul {padding:10px;}
.navbar ul li ul li a { padding:5px 10px; margin:0; border-bottom:solid 1px #eaeaea;}
.navbar ul li ul li a:hover{background-color:#49c1ba; color:#fff;}
.dropdown-menu {margin-top:-1px; min-width:12rem; padding:0; border-radius:0; background-color:#fff;}
.dropdown:hover>.dropdown-menu {
  display: block;
}

/*menu*/
.main-menu {width:100%; height:0; background-color:#111; transition:height .5s; overflow:hidden;}
.nav-open .main-menu {height:100%;  }
.fixed-top {z-index:9;}
.main-menu nav#ddfullscreenmenu {
    -webkit-transform: translateY(-100px);
    transform: translateY(-100px);
    /*-webkit-transition: -webkit-transform .5s ease-in,opacity 1s ease-in;*/
    transition: all .5s;
	opacity:0;
}
.nav-open .main-menu nav#ddfullscreenmenu {   
   -webkit-transform: translateY(0px);
    transform: translateY(0px);
	opacity:1;
}
.nav-open .main-menu nav#ddfullscreenmenu {visibility:visible;}
.nav-button {position:relative; z-index:1031; padding:10px; margin-top: 5px; cursor:pointer; display:inline-block;}
.nav-button .txt {text-transform:uppercase; font-size:12px; line-height:12px; color:#fff !important; margin:0 0 0 5px; display:inline-block;}
.nav-button #nav-icon3 {width:30px; height:22px; top:3px; display:inline-block; position:relative; -webkit-transform:rotate(0deg);-moz-transform:rotate(0deg); -o-transform:rotate(0deg); transform:rotate(0deg); -webkit-transition:.5s ease-in-out; -moz-transition:.5s ease-in-out; -o-transition:.5s ease-in-out; transition:.5s ease-in-out; cursor:pointer;}
.nav-button #nav-icon3 span {display:block; position:absolute; height:3px; width:100%; background:#FFFFFF; border-radius:9px; opacity:1;right:0; -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg); -o-transform:rotate(0deg); transform:rotate(0deg);-webkit-transition:.25s ease-in-out; -moz-transition:.25s ease-in-out; -o-transition:.25s ease-in-out; transition:.25s ease-in-out;}
.nav-button #nav-icon3 span:nth-child(1){top:0;}
.nav-button #nav-icon3 span:nth-child(4){width:40%;}
.nav-button #nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3){top:7px; width:70%;}
.nav-button #nav-icon3 span:nth-child(4){top:14px}
.nav-open #nav-icon3 span:nth-child(1){top:0px; width:0; right:0; opacity:0;}
.nav-open #nav-icon3 span:nth-child(2){-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg); width:100%;}
.nav-open #nav-icon3 span:nth-child(3){-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg); width:100%;}
.nav-open #nav-icon3 span:nth-child(4){top:14px; width:0; right:0; opacity:0;}
/*menu*/

.main-menu h3 {color: #666;}
.menuintro p {font-size:15px; color:#666;}
.menuintro p a {color:#666;}
.menuintro p a:hover {color:#fff;}
.menuintro p a:after {content:''; background-color:#666; width:0; height:1px; transition:all 0.5s; position:relative; display:block;}
.menuintro p a:hover:after {width:120px;}
.social {margin-top:50px;}
.social li {display:inline-block !important;}
.social li .fa:before {font-size:20px;}
.social li a:before, .social li:after {display:none !important;}
.social li a {padding:5px !important; margin:0 10px; background-image:none !important; opacity:0.5;}
.social li a:hover {opacity:1;}

.footersocial a {width:30px; height:30px; border-radius:50%; border:solid 1px #ccc; color:#ccc; text-align:center; padding:7px; margin:0 2px; display:inline-block;}
.footersocial a:hover {color:#49c1ba; border:solid 1px #49c1ba;}


#header.scrolled .navbar-nav li a {
  color:#000;
}
#header.scrolled {
  background-color: rgba(255,255,255,0.5) !important;
  transition: background-color 200ms linear;
}

.hero {background-color:#020116; position:relative; padding:0;}
.herocaption {position: absolute; top:30%;}
.w-65 {width: 65%;}
.caption {position:relative; display:inline-block;}
.caption h1 {color:#fff; margin-bottom: 30px;}
.caption p {font-size:18px; color:#fff; margin-bottom:40px; text-align: left;}
.caption .head {color:#fff; opacity:.5; margin-bottom:10px; display:inline-block;}
.caption .head:after {content:''; width:50px; height:1px; background-color:#fff; position:relative; top:-4px; right:-10px; display:inline-block;}
.caption .head1 {color:#666; margin-bottom:10px; display:inline-block;}
.caption .head1:after {content:''; width:50px; height:1px; background-color:#666; position:relative; top:-4px; right:-10px; display:inline-block;}

.carousel-caption {width:100%; position:absolute; z-index:0; left:0; top:30%; padding-bottom:30px;}
.carousel-caption h1 {font-size:30px; line-height:35px; color:#fff; font-weight:bold; margin-bottom:20px;}
.carousel-caption p {font-size:1rem; color:#fff; text-align:center;}
.carousel-indicators {z-index:8; bottom:20px;}
.carousel-indicators li {width:7px; height:7px; border-radius:50%; cursor:pointer;}
.carousel-indicators .active {width:15px; background-color:#fff; border-radius:5px;}
.carousel-control-next, .carousel-control-prev {top:45%; width:auto; height:30px; background-color:rgba(255,255,255,0.1); padding:20px 10px;}

.knowmore, .knowmore1 {position: relative; z-index: 1;}
.knowmore a {color:#fff; position:relative; background:url(../images/arrow.png) no-repeat center right 20px; border-radius:50px; padding:5px 60px 5px 0; overflow:hidden; display:inline-block;}
.knowmore a:hover {padding:5px 60px 5px 20px; }
.knowmore a:after {content:''; width:50%; height:100%; background-color:#ff6600;  position:absolute; top:0; left:-50%; transition:0.5s; z-index:-1; display:inline-block;}
.knowmore a:hover:after {width:100%; left:0;}

.knowmore1 a {color:#666; position:relative; background:url(../images/arrow1.png) no-repeat center right 20px; border-radius:50px; padding:5px 60px 5px 0; overflow:hidden; display:inline-block;}
.knowmore1 a:hover {padding:5px 60px 5px 20px; color:#fff; background:url(../images/arrow.png) no-repeat center right 20px;}
.knowmore1 a:after {content:''; width:50%; height:100%; background-color:#ff6600;  position:absolute; top:0; left:-50%; transition:0.5s; z-index:-1; display:inline-block;}
.knowmore1 a:hover:after {width:100%; left:0;}

.knowmore2 a {background-color:#000; color: #fff; border-radius:5px; padding:10px 60px; position: relative; top: 170px; display:inline-block;}
.knowmore2 a:hover {background-color: #ff6600;}


.fixed-side-navbar {
  position: fixed;
  top: 50%;
  right: 0;
  z-index: -1;
  margin-top: -100px;
  text-align: right;
  padding: 30px 0;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.fixed-side-navbar:hover {
  background: transparent;
}
.fixed-side-navbar:hover .nav > li > a > span {
  color: rgba(0, 0, 0, 0.5);
  display: block;
  background-color: #fff;
  text-align: center;
  text-transform: uppercase;
  font-size: 12px;
  padding: 2px 12px;
  border-radius: 15px;
}
.fixed-side-navbar .nav > li a.active {
  background-color: transparent;
  color: black;
}
.fixed-side-navbar .nav > li a.active:after {
  background: rgba(255, 255, 255, 1);
  transform:scale(1);
  
}
.fixed-side-navbar .nav > li a.active:before {
  content: '';
  position: absolute;
  top: 50%;
  right: 46px;
  margin-top: -4px;
  width: 18px;
  height: 18px;
  background: transparent;
  border: 2px solid #fff;
  border-radius: 10px;
}
.nav>li {
  position: relative;
  display: block;
}
.fixed-side-navbar .nav > li a {
  color: #fff;
  min-height: 32px;
  background: transparent;
  padding: 5px 45px 5px 25px;
  border-right: none;
}
.fixed-side-navbar .nav > li a span {
  display: none;
  -webkit-transition: all .2s;
  transition: all .2s;
}
.fixed-side-navbar .nav > li a:after {
  content: '';
  position: absolute;
  top: 50%;
  right: 50px;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.75);
  -webkit-transition: all .3s;
  transition: all .3s;
  transform:scale(0.5);
}
.fixed-side-navbar .nav > li a:hover {
  background-color: transparent;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  border-color: black;
  boder-right: 0;
}
.fixed-side-navbar .nav > li a:hover > span {
  color: #666;
  display: block;
}
.ainav.fixed-side-navbar {position: relative; right: auto; margin-top: 60px; z-index: 0;}
.ainav.fixed-side-navbar .nav > li a {color: #666; text-align: left; padding: 5px 0 5px 25px; }
.ainav.fixed-side-navbar .nav > li a span {display: block; font-size: 12px; text-align: left; text-transform: none; padding:0; position: relative; top: 5px;}
.ainav.fixed-side-navbar .nav > li a:hover > span {display: block;}
.ainav.fixed-side-navbar .nav > li a::after {left:4px;}
.ainav.fixed-side-navbar .nav > li a.active:before {border: solid 2px #000364; left:0px;}
.ainav.fixed-side-navbar .nav > li a.active:after {background: #000364;}
.ainav.fixed-side-navbar .nav > li a:after {background: rgba(0, 0, 0, 0.5);}
.ainavdiv {border-top: solid 100px #fff;  margin-bottom: 100px;}
.aiworkwrap {position: sticky; top: 100px; z-index: 1;}
.ainavdivborder {width:1px; height: 95%; border-right: solid 1px #ccc; position: absolute; top: 100px; right: 20px; display: inline-block;} 
/*.block{
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  font-size: 16px;
}
.img-parallax {
  width: 100vmax;
  z-index: -1;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%,0);
  pointer-events: none
}*/
.z-2 {z-index: -2;}
.parallax-content {width: 100%; min-height: 100vh; position:relative;}
.ai {background:url(../images/bg-ai.jpeg) right; background-attachment: fixed; background-size:cover;}
.omni {background:url(../images/bg-omnichannel.jpeg) right; background-attachment: fixed; background-size:cover;}
.data {background:url(../images/bg-data.jpeg) right; background-attachment: fixed; background-size:cover;}
.b2b {background:url(../images/bg-b2b.jpeg) right; background-attachment: fixed; background-size:cover;}
.digital {background:url(../images/bg-digital-solution.jpeg) right; background-attachment: fixed; background-size:cover;}

.work {background:url(../images/bg-work.jpeg) right; background-attachment: fixed; background-size:cover;}
.workdesc img {width:100px; background-color: #fff; padding: 10px; text-align: center; border-radius: 5px; margin-bottom: 10px; display: inline-block;}
.workdesc h3 {    color: #fcb616;
    margin-bottom: 5px;
    font-size: 3rem;}
.workdesc p {    color: #fff;
    font-size: 17px; line-height: 20px; text-align: left;}
.workwrap {position: sticky;/* top: 100px;*/}
.border-radius {border-radius: 5px;}

.parallax-content.fcblack h1, .parallax-content.fcblack h2, .parallax-content.fcblack h3 {color: #222;}
.parallax-content.fcblack.fcblack p {color: #666;}
.fcblack {color: #222;}

.clients {background-color: #fff;}
.clientdiv img {margin-bottom: 50px; /*filter: grayscale(100%); opacity: .5;*/ transition: all .5s;}
/*.clientdiv img:hover {filter: grayscale(0%); opacity: 1;}*/

.insights {background-color: #f2f2f2;}
.insightdiv a img {border-radius: 5px; margin-bottom: 10px; border: solid 10px #f6f6f6; transition: all .5s;}
.titlesmall {font-size: 15px; color: #999;}
.titlesmall span {margin: 0 10px;}
.insightdiv a p {color: #222;}
.insightdiv a:hover img {border: solid 10px #ccc;}

.letstalk {background-color: #0213a9;}
.letstalk h1, .letstalk p {color: #fff;}

.fcdarkblue {color: #000364}
.aibgtop {border-top: solid 20px #000364;}
.fcmaroon {color: #970025}
.omnibgtop {border-top: solid 20px #970025;}
.fcgreen {color: #1a4800}
.databgtop {border-top: solid 20px #1a4800;}
.fcdarkorange {color: #c01c00}
.b2bbgtop {border-top: solid 20px #c01c00;}
.fcpurple {color: #6c0096;}
.digitalbgtop {border-top: solid 20px #6c0096;}
.bgdarkgray {background-color: #111;}
.fcgray {color: #aaa;}
.fcblue {color: #0213a9;}
.innertop {margin-top: 96px;}

.clientimg {margin: 30px 0;}
.clientimg img {border: solid 1px #eee; border-radius: 5px; padding: 10px 0; margin-bottom: 30px; transition: all 0.5s;}
.clientimg img:hover {box-shadow: 0 0 30px #ddd;}
.client-infographic {width: 100%; background-color: #111; padding: 15px; border-radius: 5px; position: relative; display: inline-block;}
.client-infographic ul {padding: 0 0 0 30px; margin-bottom: 0;}
.client-infographic li {color: #fff; line-height: 20px; margin-bottom: 20px; list-style: none; position: relative;}
.client-infographic li:before {content: '\f054'; font-family: 'FontAwesome'; font-size: 12px; position: absolute; left: -20px;  color: #fff;}
.client-infographic li:last-child {margin-bottom: 0;}
.client-infographic:before {content: '\f0d9'; font-family: 'FontAwesome'; font-size: 40px; color: #111; position: absolute; left: -10px; top: 50%; transform: translateY(-50%); display: inline-block;}
.client-infographic-img {width: 100%; height: 100%; background: url(../images/client-infographic-center.png) no-repeat center center; margin-bottom: 20px; overflow: hidden; display: inline-block;}
.client-infographic-img img {-webkit-animation:rotation 10s linear infinite; -moz-animation:rotation 10s linear infinite; animation:rotation 10s linear infinite;}
@-webkit-keyframes rotation {
	from {
			-webkit-transform: rotate(0deg);
	}
	to {
			-webkit-transform: rotate(359deg);
	}
}
.client-testidiv {background: url(../images/client-testi-bg.jpeg) no-repeat bottom 48px center #fff; background-size: 100%; overflow: hidden;}
.client-testi {width: 100%; background-color: #fff; padding: 40px 40px 20px; border-radius: 5px; border:solid 1px #ccc; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.6); display: inline-block;}
.client-testi img {border-radius: 50%;}
.client-testi .quote {font-family: 'Effra-Bold'; font-size: 20px; color: #000; font-style: italic;}
.client-testi .quote span {font-family: 'Effra-Regular'; font-size: 70px; position: absolute; left: -15px;}
.testiname p {margin-bottom: 0;}
.client-testidiv .owl-carousel .owl-stage, .career-gal .owl-carousel .owl-stage {padding: 50px 0;}
.client-testidiv .owl-carousel .owl-stage-outer, .career-gal .owl-carousel .owl-stage-outer {overflow: visible;}
.client-testidiv .owl-nav button, .career-gal .owl-nav button {bottom: -150px; top: auto;}
.client-testidiv .owl-carousel .owl-nav button.owl-next, .client-testidiv .owl-carousel .owl-nav button.owl-prev,
.career-gal .owl-carousel .owl-nav button.owl-next, .career-gal .owl-carousel .owl-nav button.owl-prev {width: 80px; height: 80px; border-radius: 50%; background: #fff; opacity: 1;}
.client-testidiv .owl-nav button.owl-next, .career-gal .owl-nav button.owl-next {right: 0;}
.client-testidiv .owl-nav button.owl-prev, .career-gal .owl-nav button.owl-prev {right: 100px; left: auto;}
.client-testidiv .owl-nav button .fa:before, .career-gal .owl-nav button .fa:before {font-size: 20px;}
.client-testidiv .owl-carousel .owl-nav button.owl-prev:hover, .client-testidiv .owl-carousel .owl-nav button.owl-next:hover, .client-testidiv .owl-carousel button.owl-dot,
.career-gal .owl-carousel .owl-nav button.owl-prev:hover, .career-gal .owl-carousel .owl-nav button.owl-next:hover {background-color: #111;}
.clientsinner .col-lg-3 {display: none;}

.gen-enq {width: 100%; padding: 30px 0; border: solid 1px #ccc; border-radius: 5px; box-shadow: 10px 10px 0 rgba(0, 0, 0, 0.1); margin-top:50px; display: inline-block;}
.gen-enq h2, .gen-enq h4 {margin-bottom: 0;}
.gen-enq i, .gen-enq h4 {float: left;}
.gen-enq i:before {font-size: 20px; color: #0213a9;}
.gen-enq i {margin-right: 10px;}
.gen-enq h4 a {color: #222;}
.gen-enq a:after {content:''; background-color:#222; width:0; height:1px; transition:all 0.5s; position:relative; display:block;}
.gen-enq a:hover:after {width:165px;}
.contactab {border: solid 1px #ccc; border-radius: 5px;}

.contactab .nav-tabs {display:none; border: none;}

/*Testimonial*/
#testimonal-slider {
    /*background: #222;*/
    /*max-width: 900px;*/
    margin: auto
}

.testimonial-caption {
    position: initial;
    z-index: 10;
    padding:2rem 3rem;
    text-align: center;
    font-size: 1.2rem;
	
   /* font-style: italic;
    font-weight: bold;*/
    line-height: 2rem
}
.testimonial-caption p{
	color: #666 !important;
	}
.testimonial-caption img {
    /*width: 6rem;*/
    border-radius: 5rem;
    margin-top: 2rem
}
#image-caption {
    font-style: normal;
    font-size: 0.8rem;
    margin-top: 0.5rem;
color: #666 !important;
}
#image-caption img{
	margin-top:0;
	}
#image-caption h3,#image-caption p{
	margin-bottom:0;
	
	}
.test-arrow {
    background-color: rgb(223, 56, 89);
    padding: 0.5rem
}
.carousel-control-prev {
    justify-content: flex-start
}

.carousel-control-next {
    justify-content: flex-end
}

.carousel-control-prev,
.carousel-control-next {
    transition: none;
    opacity: unset
}

/*job opening*/
.career-box{
	padding: 25px 25px 5px;
    background: #fcb616;
    color: #fff;
    border-radius: 7px;
    box-shadow: 0 0 30px #999999;
	    margin-bottom: 50px;
	}
.career-box h3{
color: #fff;
    text-transform: uppercase;
    font-size: 22px;
    line-height: 30px;
}
.career-box p{
	color: #fff;
	}


@media(min-width:768px) {
.contactab .nav-tabs {display: flex;}    
.contactab .card {border: none;}
.contactab .card .card-header {display:none;}
.contactab .card .collapse{display:block;}
}
@media(max-width:767px){
.contactab .tab-content > .tab-pane {display: block !important; opacity: 1;}
.contactab .card .card-header {padding: 0!important; border: none;} 
.contactab .card .card-header a {display:block; padding: 20px;} 
.contactab .card .card-header a[aria-expanded=true] {background-color: #fff!important;} 
}
.contactab .nav-tabs li {width:50%; text-align:center; margin:0 auto; font-family: 'Effra-Bold'; font-size:30px; color:#232323;}
.contactab .nav-tabs .nav-link {background-color:#f2f2f2 !important; border:none; padding:40px 0; margin:0; border-radius: 0;}
.contactab .nav-tabs li span {font-size:0.9rem; line-height:0.9rem;}
.contactab .nav-tabs .nav-link:hover {background-color: #ddd!important;}
.contactab .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {background-color:#fff !important;}
.contactab .card-body {padding: 30px 50px;}



.office img {border-radius: 5px; margin-bottom: 20px;}
.office h3 {margin-bottom: 10px;}
.office p {font-size: 15px; line-height: 25px;}
.office .phone, .office .email {position: relative; font-size: 15px; padding: 5px 5px 5px 25px;}
.office .phone:before {content: '\f095'; font-family: 'FontAwesome'; font-size: 15px; position: absolute; left: 0;  top: 6px; display: inline-block;}
.office .email:before {content: '\f0e0'; font-family: 'FontAwesome'; font-size: 13px; position: absolute; left: 0;  top: 4px; display: inline-block;}
.office .map {width: 40px; height: 100%; padding: 15px 0 0; display: inline-block;}
.office .map img {margin-bottom: 0; transform: scale(0.6); transition: all 0.5s;}
.office .map:hover img {transform: scale(1);}
.office .phone a:after, .office .email a:after {content:''; background-color:#222; width:0; height:1px; transition:all 0.5s; position:relative; margin-top: -5px; display:block;}
.office .phone a:hover:after {width:115px;}
.office .email a:hover:after {width:120px;}
.bordertb {border-top: solid 1px #eee; border-bottom: solid 1px #eee;}
.office .phone {border-bottom: solid 1px #eee;}
.borderl {border-left: solid 1px #eee;}
.address {height: 160px;}

.career-gal {background: url(../images/career-gal-bg.jpeg) no-repeat bottom 48px center #fff; background-size: 100%; overflow: hidden;}
.career-gal img {border-radius: 5px;}
.career-gal .owl-carousel button.owl-dot, .career-gal .owl-carousel button.owl-dot span, .career-gal .owl-carousel button.owl-dot.active span, .career-gal .owl-carousel button.owl-dot:hover span {background-color: transparent; width: 0; height: 0; margin: 0;}
.career-gal .owl-carousel button.owl-dot {padding: 0!important; }
.career-gal .owl-carousel .owl-dot.active {color:#fff!important;}
.career-gal .owl-carousel .owl-dots {left: 0;}
.career-gal .owl-carousel .owl-dots:before {content: ''; width: 80px; height: 1px; display: inline-block; position: relative; 
background: #999; left: 25px; top: -3px;}
.owl-dots {
  counter-reset: slides-num;
  /* Initialize counter. */
  position: absolute;
  top: 100%;
  left: 50%;
  margin-top: 15px;
}
.owl-dots:after {
  content: counter(slides-num);
  /* get total number of items - more info on http://www.sitepoint.com/a-little-known-way-to-replace-some-scripts-with-css-counters/ */
  display: inline-block;
  font-size: 20px;
  font-weight: 700;
  vertical-align: middle;
  color: #999;
margin-left: 30px;
}

.owl-dot {
  display: inline-block;
  counter-increment: slides-num;
  /* Increment counter */
  margin-right: 5px;
}
.owl-dot span {
  display: none;
}
.owl-dot.active:before {
  content: counter(slides-num) "";
  /*content: counter(slides-num) " /";*/
  /* Use the same counter to get current item. */
  display: inline-block;
  vertical-align: middle;
  font-size: 20px;
  position: absolute;
  left: 0;
  top: 0;
}

.card {border: none; border-bottom: solid 1px #ccc;}
.card-header {background-color: #fff; border: none; padding: 0;}
.card-header>a, .card-header>a:active{display:block; /*font-family: 'Effra-Bold';*/ font-size: 25px; color: #222; padding: 40px 20px; }
.card-header a:before {font-family: 'FontAwesome'; content: "\f105"; font-size:25px; float: right; transition: all 0.5s;}
.card-header.active a:before {-webkit-transform: rotate(90deg)!important; -moz-transform: rotate(90deg)!important; transform: rotate(90deg)!important;
} 

.blogdiv {display: none;}
.blog {width: 100%; background-color: #000; border-radius: 5px; display: inline-block; position: relative; margin-bottom: 20px; overflow: hidden;}
.blog  img {opacity: .6; transition: all .5s;}
.blog:hover img {opacity: .8; transform: scale(1.1);}
.blogdesc {width: 100%; padding: 20px; position: absolute; z-index: 1; left:0; bottom: 0; display: inline-block;}
.blogdesc h3 {color: #fff;}

.a1 {background:url(../images/bg-a1.jpeg) right; background-attachment: fixed; background-size:cover;}
.a2 {background:url(../images/bg-a2.jpeg) right; background-attachment: fixed; background-size:cover;}
.a3 {background:url(../images/bg-a3.jpeg) right; background-attachment: fixed; background-size:cover;}
.a4 {background:url(../images/bg-a4.jpeg) right; background-attachment: fixed; background-size:cover;}


.workdiv {width: 100%; height: 400px; border-radius: 5px; margin-bottom: 30px; overflow: hidden!important; display: none;}
.workdivimg {width: 100%; height: 100%; background-size:cover; background-position: center center!important; position: relative; transition: all .5s;  display: inline-block;}
.workdivimg::before { 
  content:"";
  position:absolute; top:0;right:0;bottom:0;left:0;
  background:inherit;
  transition:inherit;
}
.workdivimg:hover::before { 
  transform: scale(1.2);
}
.apollo {background:url(../images/work/apollo.jpeg) no-repeat;}
.digit {background:url(../images/work/digit.jpeg) no-repeat;}
.kotak {background:url(../images/work/kotak.jpeg) no-repeat;}
.capgemini {background:url(../images/work/capgemini.jpeg) no-repeat;}
.tatac {background:url(../images/work/tata-capital.jpeg) no-repeat;}
.ramrajya {background:url(../images/work/ramrajya.jpeg) no-repeat;}
.westside {background:url(../images/work/westside.jpeg) no-repeat;}
.nippon {background:url(../images/work/nippon.jpeg) no-repeat;}
.bharti-axa {background:url(../images/work/bharti-axa.jpeg) no-repeat;}
.workpos {width:40%; position: absolute; z-index: 1; right: 20px; top: 50%; padding: 20px; transform: translateY(-50%);}
.workdetail {background-size: cover;}
.detail-num h3 {font-size: 50px;}
.fcyellow {color: #fcb716;}
.bgyellow {background-color: #fcb716;}
.fckotak {color: #ec1e30;}
.bgkotak {background-color: #ec1e30;}
.fccapgemini {color: #0070ad;}
.bgcapgemini {background-color: #0070ad;}
.fctata {color: #2a6eb6;}
.bgtata {background-color: #2a6eb6;}
.fcmagenta {color: #bf0b4a;}
.bgmagenta {background-color: #bf0b4a;}
.logobg img {background-color: #fff; border-radius: 5px;}


.objective h3, .objective p, .objective li {color: #fff;}
.obj-img img  {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}

.li2 ol {margin: 0; padding: 0 0 0 20px;}
.li2 ol li {color: #666; margin-bottom: 20px; padding: 0 0 0 20px;}
.li2 ol li:before {display: none;}

.li ul {margin: 0 0 0 40px; padding: 0;}
.li li {list-style: none; color: #666; margin-bottom: 20px;}
.li li:before {content: '\f054'; font-family:'FontAwesome'; font-size: 12px; position: absolute; left: 20px; display: inline-block;}

.li1 ul {margin: 0 0 0 40px; padding: 0;}
.li1 li {list-style: none; color: #fff; margin-bottom: 20px;}
.li1 li:before {content: '\f054'; font-family:'FontAwesome'; font-size: 12px; position: absolute; left: 20px; display: inline-block;}

.approach img {border: solid 1px #ccc; border-radius: 5px; padding: 5px; margin-bottom: 10px;}

.bloginner img {border-radius: 5px;}
.report .card-group .card {border: solid 1px #eee; border-radius: 5px!important; margin:0 20px 40px; transition: all 0.5s;}
.report .card-group .card:hover {box-shadow: 0 0 30px #ddd;}
.report .card-group .card-footer {background-color: transparent; border: none;}
.report {display: none;}
.report .titlesmall, .report img {margin-bottom: 10px;}
 
.services {width: 100%; border-radius: 5px; display: inline-block; position: relative; margin-bottom: 20px; overflow: hidden;}
.services  img {transition: all .5s;}
.services:hover img {transform: scale(1.1);}
.servicesdesc {width: 100%; padding: 50px; position: absolute; left:0; top: 0; display: inline-block;}
.servicesdesc h3 {color: #fff;}

.msticky a {position: fixed; bottom: 0; width: 100%; background-color: #111; font-size: 20px; color: #fff; text-align: center; padding: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px;  display: none;}
.msticky a:hover {background-color: #0213a9;}

.overflow {overflow: visible;}
.googlepartner {width: 100%; padding: 30px; border: solid 1px #ccc; border-radius: 5px; box-shadow: 10px 10px 0 rgba(0, 0, 0, 0.1); display: inline-block;}

.team {width:100%; position:relative; overflow:hidden; margin:10px 0; border-radius: 5px; background-color:#f6f6f6; text-align:center; display: inline-block;}
.team img {margin:0 auto;}
.team .title {width:100%; padding: 0 30px; position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); transition: all .8s;}
.teams .team .title h2 {font-size: 40px; line-height:40px; color: #fff; border-bottom: solid 1px #666; margin-bottom: 10px;
padding-bottom: 15px;}
.teams .team .title p {color: #fff;}
.overlay {position: absolute; bottom: 0; left: 0; right: 0; background-color:rgba(0,0,0,0.6); overflow: hidden; height: 0;
  transition: .5s ease;}
.teams .team:hover .overlay {height: 100%;}
.teams .team:hover .title {bottom: -200px;}
.teamdetails {width:100%; color: #fff; font-size: 13px; padding:20px 10px; position: absolute; top: 55%; left: 50%; transform: translate(-50%, -50%);  }
.teamdetails h4 {font-size: 23px; color:#fff;}
.teamdetails h4 span {font-size: 15px; color:#fff;}
.teamdetails p {color:#fff; line-height: 25px; text-align:center;}
/*.teams [class*='col-'] {padding: 0;}*/
.teams h3:before {content: ''; width: 100px; height: 1px; background-color: #222; position: relative; margin-right:15px; top: -8px; display: inline-block;}
.teams h3:after {content: ''; width: 100px; height: 1px; background-color: #222; position: relative; margin-left:15px; top: -8px; display: inline-block;}
.tmember:hover .overlay {height: 40px;}
.tmember .title {width:100%; padding: 20px 10px; position: relative; bottom: -20px; left: 0; font-size: 13px; line-height: 15px; color: #fff; transition: all .5s;}
.tmember:hover .title {bottom: 10px;}
.flip-box {
  background-color: transparent;
  width: 100%;
  height: 100%;
  perspective: 1000px;
}

.flip-box-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
  overflow: hidden;
}

/*.flip-box:hover .flip-box-inner {
  transform: rotateY(180deg);
}*/
.flip-box img {transition: all .5s;}
.flip-box:hover img {
  transform: scale(1.2);
}

.flip-box-front, .flip-box-back {
  position: relative;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-box-back {  
  transform: rotateY(180deg); position: absolute; top: 0;
}
.tmember {width: 100%; margin-bottom: 20px; display: inline-block;}
.tmember img {border-radius: 5px;}
.teamcaption {width: 100%; position: relative; margin-top: 10px; text-align: center; display: inline-block;}
.teamcaption h4 {font-size: 16px; line-height: 20px; margin-bottom: 0;}
.teamcaption p {font-size: 13px;}







footer {width:100%; min-height: 100vh; background-color:#222; padding:150px 0 0 0; position: sticky; bottom: 0; z-index: -3;  /*display:inline-block;*/}
.footerlogo {width: 150px; display: inline-block; margin-bottom: 30px;}
.flocation {width:100%; border-bottom: solid 1px #333; padding: 10px 0; display: inline-block;}
.flocation p {margin-bottom: 5px; line-height: 18px; color: #999;}
.flocation p small {color: #666;}
footer ul {margin:0; padding:0;}
footer ul li {margin:0; padding:0; list-style:none; margin-bottom:10px;}
footer ul li a {color:#999;}
footer ul li a:hover, footer h4 a:hover {color:#ccc;}
.copy {font-size: 15px; margin-top: 20px;}


.top a{background-color:#222; width:30px; height: 30px; border:solid 1px #666; border-radius:50%; padding:0; display:inline-block; font-size:15px; color:#666; text-align:center; margin: 0 auto; display: inline-block;}
.top a i:before {font-size: 20px;}
.top a:hover {background-color:#000; color: #999;}
.top:after {content: ''; width: 100%; height: 1px; background-color: #666; position: relative; top: -35px; z-index: -1; display: inline-block;}


.breadcrumb {width:100%; background-color:#eaeaea; border-radius:0; text-align:center; display:inline-block; margin:0; padding:5px 0;}
.breadcrumb li {display:inline-block; font-size:0.8rem;}
.breadcrumb-item.active {color:#000;}




.card-header {cursor:pointer;}
.accordion-wrapper .accordion .card-header::after {
	font-family: 'FontAwesome';
    content: "\f077";
    float: right;
}
.accordion-wrapper .accordion .card-header.collapsed::after {content: "\f078";}
.card-header {font-weight:bold;}
.awarenesstab {padding:5% 10%;}
.awarenesstab .list li {text-align:left;}
.accordion {margin-bottom:30px;}

.sticky {background-color:#fff; box-shadow:0 0 10px #ccc;}
.fixed {position:fixed; top:0; width:100%;}


.hidden {display:none;}



.left {text-align:left;}
.right {text-align:right;}

input, textarea, select {width:100%; background-color:#fff; padding:10px; border:solid 1px #ccc; border-radius:5px; color:#666; -webkit-appearance: none; -moz-appearance: none;  appearance: none;}
.select {position: relative;}
.select:after {content: '\f107'; font-family: 'FontAwesome'; font-size: 20px; position: absolute; right: 15px; top: 10px; display: inline-block;}
input[type="submit"] {background: rgb(242,242,242); background: linear-gradient(0deg, rgba(242,242,242,1) 0%, rgba(255,255,255,1) 100%); padding:10px 30px; color:#222; border:none; cursor:pointer; text-transform:uppercase; box-shadow:0 5px 10px #ccc; transition: 0.3s ease-in-out;}
input[type="submit"]:hover {background: rgb(255,255,255); background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(242,242,242,1) 100%); box-shadow:0 10px 10px #ccc;}
label {font-size:15px; color: #999; margin-bottom: 0;}


::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  opacity:1;
}
::-moz-placeholder { /* Firefox 19+ */
  opacity:1;
}
:-ms-input-placeholder { /* IE 10+ */
  opacity:1;
}
:-moz-placeholder { /* Firefox 18- */
  opacity:1;
}

.fa::before {font-size:13px;}


.fcwhite {color:#fff;}


.logos.owl-carousel .owl-nav.disabled, .logos.owl-carousel .owl-dots.disabled { display: block !important; }
.owl-nav button.owl-prev {
  left: -50px; padding:20px !important;
}
.owl-nav button.owl-next {
  right: -50px; padding:20px !important;
}
.owl-nav button {
    position: absolute;
    top: 40%;
    transform: translateY(-50%);
}
/*
.owl-nav button span {
    font-size: 50px;    
    position: relative;
    
}

.owl-nav button:focus {
    outline: none;
}*/
.modal .close {position:absolute; top:-20px; right:-10px; background-color:#000; color:#fff; border-radius:50%; padding:3px 10px 8px; opacity:1; z-index:1;}
#myModal .modal-body {padding:0;}