html {
  position: relative;
  min-height: 100%;
}
 body{
   color: #363f54;
   font-family: 'Roboto', sans-serif;
   margin-bottom: 200px;
 }
section{
  padding:100px 0px;
}
 #main.container-fluid{
   padding: 0px;
 }

 nav {
  height: 80px;
  line-height: 80px;
 }
 nav a{
   color:#363f54; 
   padding:0px 5px;
   text-transform: uppercase;
   font-weight: 300;
   font-size: small;
 }
 nav a.active{ 
   border-bottom: 1px solid #00afff;
   color:#00afff;
   padding:0px;
   
 }
 nav a:hover{
   text-decoration:none;
   color:#00afff;
 }
 .primary {
   color: #363f54;
 }
 .accent {
   color: #00afff;
 } 
 #myCarousel{
   position:relative;
   padding:150px 0px;
 }
 #myCarousel .container{
   position: relative;
 }
 .carousel-caption {
  left:0%;
  right:0%;
  bottom:0%;
}
.carousel-indicators{
  right:initial;
  background-color: #f3f3f3;
  margin-left:25px;
  margin-top:50px;
}
.carousel-indicators li{
 background-color: #00afff;
 height: 5px;
}
.carousel-indicators .active{
  color:#d1d1d2;
  background-color: #d1d1d2;
}

.carousel-inner{
 
}
.carousel-item{
  padding:50px 0px;
}

.carousel-item h6{
  padding-bottom:20px;
}

.carousel-item p{
  padding-top:20px 0px;
}


.title{
  text-align: center;
}
.title h5 {
  position: relative;
  left:45%;
  text-align: center;
  width: 10%;
  color:#29a8e2;
}

.title h5 span {
  background: #fff;
  padding: 0 15px;
  position: relative;
  bottom:5px;
  z-index: 1;
}

.title h5:before {
  background: #29a8e2;
  content: "";
  display: block;
  height: 1px;
  position: absolute;
    top: 50%;
  width: 100%;
}

.title h5:before {
  left: 0;
}

.services .nav-link{
  background-color: #0d1d3d;
  color: #fff;
  border-radius:0px;
  border:0px;
}
.services .nav-link.active{
  background-color: #29a8e2;
  color: #fff; 
  border-left: 1px solid #ffff;
  border-right: 1px solid #ffff;
}
.services #myTabContent{
  border:1px solid #e0e0e0;
  padding:20px;
}

.button{
 background-color: #38a4ff;
 border-radius: 3px;
 color: #fff;
 padding:10px;
}

#service1{
  width: 110px;
  height: 123px;  
  background: url(../img/services_unselected.png) 0 0px;
}

#service1:hover{
  width: 110px;
  height: 123px; 
  background: url(../img/services_selected.png) 0 0;
}
#service1:hover + div{color:#f00;}
#service2{
  width: 110px;
  height: 123px;  
  background: url(../img/services_unselected.png) 340px 0px;
}

#service2:hover{
  width: 110px;
  height: 123px; 
  background: url(../img/services_selected.png) 340px 0px;
}

#service3{
  width: 110px;
  height: 123px;  
  background: url(../img/services_unselected.png) 229px 0px;
}

#service3:hover{
  width: 110px;
  height: 123px; 
  background: url(../img/services_selected.png) 229px 0px;
}
 
#service4{
  width: 110px;
  height: 123px;  
  background: url(../img/services_unselected.png) 120px 0px;
}

#service4:hover{
  width: 110px;
  height: 123px; 
  background: url(../img/services_selected.png) 120px 0px;
}
 

#service5{
  width: 110px;
  height: 123px;  
  background: url(../img/services_unselected.png) 3px 120px;
}

#service5:hover{
  width: 110px;
  height: 123px; 
  background: url(../img/services_selected.png) 3px 120px;
}
#service6{
  width: 110px;
  height: 123px;  
  background: url(../img/services_unselected.png) 342px 120px;
}

#service6:hover{
  width: 110px;
  height: 123px; 
  background: url(../img/services_selected.png) 342px 120px;
}

#service7{
  width: 110px;
  height: 123px;  
  background: url(../img/services_unselected.png) 232px 120px;
}

#service7:hover{
  width: 110px;
  height: 123px; 
  background: url(../img/services_selected.png) 232px 120px;
}
 
#service8{
  width: 110px;
  height: 123px;  
  background: url(../img/services_unselected.png) 122px 120px;
}

#service8:hover{
  width: 110px;
  height: 123px; 
  background: url(../img/services_selected.png) 122px 120px;
}

.services_icons .col-md-3{text-align: center;}
.services_icons .col-md-3:hover{
 color:#2faaf1;
}

#why1{
  width: 100px;
  height: 100px;  
  background: url(../img/why_icons.png) 0px 0px;
}
#why2{
  width: 100px;
  height: 100px;  
  background: url(../img/why_icons.png) 200px 0px;
}
#why3{
  width: 100px;
  height: 100px;  
  background: url(../img/why_icons.png) 100px 0px;
}

.success_story{
 min-height: 300px;
 background: url(../img/bg.jpg) 0px 0px;
 background-repeat: no-repeat;
}

.success_story p{
  font-family: 'Lato';
  font-size: small;
}

.swiperslide{
  position:relative;
}
#js-prev1{
  width: 46px;
  height: 46px;  
  background: url(../img/arrow.png) 0px 0px;
}
#js-next1{
  width: 46px;
  height: 46px;  
  background: url(../img/arrow.png) 46px 0px;
}
#js-prev2{
  width: 46px;
  height: 46px;  
  background: url(../img/arrow.png) 0px 0px;
}
#js-next2{
  width: 46px;
  height: 46px;  
  background: url(../img/arrow.png) 46px 0px;
}
/* now move prev button more to the left */
.swiperslide .swiper-button-prev {
  /* but first hide on small viewports */
  display: none; 
  left: 15%;
  top: 45%; 
  margin-top: 0; 
  /* subtract .swiper-wrapper bottom-margin to vertically center arrow */
  height: calc(100% - 3em);
}

@media (min-width: 37.5em) {
  .swiperslide .swiper-button-prev {
    /* show on larger viewports */
    display: block;
  }
} 
.swiperslide .swiper-button-next {
  /* hide on small viewports */
  display: none;
  right: 15%;
  top: 45%;
  margin-top: 0;
  /* subtract .swiper-wrapper bottom-margin to vertically center arrow */
  height: calc(100% - 3em);
}

@media (min-width: 37.5em) {
  .swiperslide .swiper-button-next {
    /* show on larger viewports */
    display: block;
  }
}

/*=======*/
.testimonial_swiper{
  width: 100%;
  height: 100%;
} 

.testimonial_swiper .swiper-slide-prev, .testimonial_swiper .swiper-slide-next{
 transform: scale(0.8);
 -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
 filter: grayscale(100%);
}

.testimonial_swiper .swiper-button-prev{
  left:30%;
  width: 46px;
  height: 46px;  
  background: url(../img/arrow.png) 0px 0px;
}

.testimonial_swiper .swiper-button-next{
  right:30%;
  width: 46px;
  height: 46px;  
  background: url(../img/arrow.png) 46px 0px;
}
 

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  font-size: small;
  font-family: 'Lato';
  height: 160px; /* Set the fixed height of the footer here */
  
  background-color: #f5f5f5;
}
.footer .copyright{
  line-height: 60px; /* Vertically center the text there */
}


.footer .col-md-2 h5{
  margin-bottom: 50px;

} 
.footer a{
  color:#363f54;
}
.footer a:hover{
  color:#00afff;
}


.service_offerincs .col-md-4{
  margin-bottom: 20px;
}
.offer{
  border:2px solid #fff;
  border-radius: 50%; 
  width:80px;
  height:80px;
  text-align: center;
  float:left; 
  margin-right: 10px;
  
}
.engagement_icon {
  width: 60px;
  height: 55px;  
  margin-top:8px;
  margin-left: 10px;
  background: url(../img/engagement_icon.png) 0px 0px;
}
.each_content h6{
  text-transform: uppercase;
  font-weight: bold; 
} 



/* Solutions */

#solution1{
  width: 61px;
  height: 50px;  
  background: url(../img/solution_icons.png) 0px 0px;
}
#solution2{
  width: 61px;
  height: 50px;  
  background: url(../img/solution_icons.png) 63px 0px; 
}
#solution3{
  width: 61px;
  height: 50px;  
  background: url(../img/solution_icons.png) 0px 0px;
}


.provide_solutions #myTab a {
 font-size: small;
 text-transform: uppercase;
 white-space: nowrap;
 color:#0d1d3d;
}
.provide_solutions #myTab .active{
  border-bottom: 3px #00afff solid;
  color:#00afff;
}
.provide_solutions #myTab a:hover{
  color: #00afff;
}
.provide_solutions #tab1{
  margin-right: 5px;
  width: 21px;
  height: 27px;  
  background: url(../img/solution_tab_unsel.png) 0px 0px;
}
.provide_solutions #tab2{
  margin-right: 5px;
  width: 32px;
  height: 27px;  
  background: url(../img/solution_tab_unsel.png) 79px 0px;
}
.provide_solutions #tab3{
  margin-right: 5px;
  width: 23px;
  height: 27px;  
  background: url(../img/solution_tab_unsel.png) 48px 0px;
}
.provide_solutions #tab4{
  margin-right: 5px;
  width: 25px;
  height: 27px;  
  background: url(../img/solution_tab_unsel.png) 25px 0px;
}

.provide_solutions #home-tab:hover > #tab1, .provide_solutions .active #tab1{
  width: 21px;
  height: 27px;  
  color:#00afff;
  background: url(../img/solution_tab_sel.png) 0px 0px;
}
.provide_solutions #profile-tab:hover > #tab2, .provide_solutions .active #tab2{
  width: 32px;
  height: 27px;  
  background: url(../img/solution_tab_sel.png) 79px 0px;
}
.provide_solutions #contact-tab:hover > #tab3, .provide_solutions .active #tab3{
  width: 23px;
  height: 27px;  
  background: url(../img/solution_tab_sel.png) 48px 0px;
}
.provide_solutions #fourth-tab:hover > #tab4, .provide_solutions .active #tab4{
  width: 25px;
  height: 27px;  
  background: url(../img/solution_tab_sel.png) 25px 0px;
}


/* Engagement Model */

.engagement_model .model_icon{ 
  width: 46px;
  height: 55px;  
  background: url(../img/engagement_icon.png) 0px 0px;
}

.engagement_model .model_why{ 
  width: 66px;
  height: 64px;  
  background: url(../img/engagement_icon.png) 66px 0px;
}


/* Careers */
.careers_accordion #accordion h5{
 border-left: 3px solid #00afff;
 margin-left:-2px;
}
.careers_accordion #accordion h5 button{
  color:#0d1d3d;
}