@charset "utf-8";

.top { background-color:#000; padding-top:15px !important; padding-bottom:10px !important; }
.top i{ color:#FFF; font-size:18px;}
.top p{font-family: 'Roboto', sans-serif; font-size:17px; color:#fff; text-align:left;}

.social-icons {
	padding: 0!important;
	margin: 0!important;
	list-style-type: none!important;
	float:right !important;
}
.social-icons li{
	float: left!important;
	margin-right: 2px!important;
	margin-bottom: 2px!important;
	padding: 0px!important;
	display: inline!important;
	width: auto!important;

}			
.social-icons li a {
	-moz-transition: all 0.3s ease 0s;
	display: block!important;
	float: left!important;
	height: 100%!important;
	margin: 0!important;
	padding: 0!important;
	width: 40px!important;
	height: 40px!important;
	text-indent: -9999px!important;
}
.social-icons li a:hover {
	background-position: 0 -40px!important;
}


.social-icons li.facebook a {
	background: url(images/facebook.png) no-repeat 0 0;
}
.social-icons li.facebook a:hover {
	background-color: #3b5998;
}

.social-icons li.linkedin a {
	background: url(images/linkedin.png) no-repeat 0 0;
}
.social-icons li.linkedin a:hover {
	background-color: #71b2d0;
}

.social-icons li.twitter a {
	background: url(images/twitter.png) no-repeat 0 0;
}
.social-icons li.twitter a:hover {
	background-color: #48c4d2;
}

.social-icons li.youtube a {
	background: url(images/youtube.png) no-repeat 0 0;
}
.social-icons li.youtube a:hover {
	background-color: #f45750;
}

.logo{ margin-top:10px !important;}


.fade-carousel {
    position: relative;
    height: 90vh;
}
.fade-carousel .carousel-inner .item {
    height: 90vh;
}

.carousel-indicators {
    bottom: 100px !important;
  }

.fade-carousel .carousel-indicators > li {
    margin: 0 2px;
    background-color: #f39c12;
    border-color: #f39c12;
    opacity: .7;
	
}
.fade-carousel .carousel-indicators > li.active {
  width: 10px;
  height: 10px;
  opacity: 1;
  
}

/********************************/
/*          Hero Headers        */
/********************************/
.hero {
    position: absolute;
    top: 50%;
    left: 30%;
    z-index: 3;
    color: #000;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 1px 1px 0 rgba(0,0,0,.75);
      -webkit-transform: translate3d(-50%,-50%,0);
         -moz-transform: translate3d(-50%,-50%,0);
          -ms-transform: translate3d(-50%,-50%,0);
           -o-transform: translate3d(-50%,-50%,0);
              transform: translate3d(-50%,-50%,0);
}
.hero h1 { font-family:'Oswald', sans-serif;
    font-size: 4.5em;    
    font-weight: bold;
	color:#fff;
    margin: 0;
	margin-left:25%;
    padding: 0;
	text-align:left;
}

.hero h3{font-family:'Roboto Condensed', sans-serif;
    font-size: 2.5em;    
    margin: 0;
	margin-left:25%;
    padding: 0; 
	text-align:left;}


.fade-carousel .carousel-inner .item .hero {
    opacity: 0;
    -webkit-transition: 2s all ease-in-out .1s;
       -moz-transition: 2s all ease-in-out .1s; 
        -ms-transition: 2s all ease-in-out .1s; 
         -o-transition: 2s all ease-in-out .1s; 
            transition: 2s all ease-in-out .1s; 
}
.fade-carousel .carousel-inner .item.active .hero {
    opacity: 1;
    -webkit-transition: 2s all ease-in-out .1s;
       -moz-transition: 2s all ease-in-out .1s; 
        -ms-transition: 2s all ease-in-out .1s; 
         -o-transition: 2s all ease-in-out .1s; 
            transition: 2s all ease-in-out .1s;    
}

/********************************/
/*            Overlay           */
/********************************/
/*.overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    background-color: #080d15;
    opacity: .1;
}
*/
/********************************/
/*          Custom Buttons      */
/********************************/
.btn.btn-lg {padding: 10px 40px;}
.btn.btn-hero,
.btn.btn-hero:hover,
.btn.btn-hero:focus {
    color: #f5f5f5;
    background-color: #027ebf;
    border-color: #027ebf;
    outline: none;
    margin: 20px auto;
}

/********************************/
/*       Slides backgrounds     */
/********************************/
.fade-carousel .slides .slide-1, 
.fade-carousel .slides .slide-2,
.fade-carousel .slides .slide-3 {
	width:100%;
  height: 90vh;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.fade-carousel .slides .slide-1 {
  background-image:url(images/banner.jpg);  background-size:100%; 
}
.fade-carousel .slides .slide-2 {
    background-image:url(images/banner_2.jpg); background-size:100%; 
}
.fade-carousel .slides .slide-3 {
   background-image:url(images/banner_3.jpg);  background-size:100%; 
}

.box_bg { margin-top:-100px !important;  position:relative; background-color:#FFF; z-index:9999;
 padding: 35px !important; padding-left:50px !important; float:none !important;

}
.title-arch {
		text-align: center;
		/*margin: 50px 0;*/
		font-size: 22px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding:10px !important;
	}
.project {
	width: 100%;
	height: 350px;
	background-image: url(images/innovetion.jpg); background-size:90%;  background-repeat:no-repeat; 
	padding: 10px !important;

}
.project h2{ margin-top:-25px !important;}
.project p{font-family: 'Roboto', sans-serif; font-size:16px; color:#fff; text-align:left;}

.project-2 {
	background-image: url(images/performance.jpg); background-size:90%;  background-repeat:no-repeat; 
}

.project-3 {
	background-image: url(images/service.jpg); background-size:90%;  background-repeat:no-repeat;
}

/*.project-4 {
	background-image: url(https://image.freepik.com/free-vector/abstract-geometric-background-design_1045-764.jpg);
}*/

.project-hover {
	width: 90%;
	height: 80%;
	color: #fff;
	opacity: 0;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	background-color: rgba(0, 91,193, 0.7);
	padding: 20% 10px !important;
	margin-right:20px !important;
	margin-top:0px !important;
	
	
	
}

.project-hover hr {
	height: 30px;
	width: 0;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	background-color: rgba(255, 255, 255, 1);
	border: 0;
}

.project-hover a {
	color: rgba(255, 255, 255, 1);
	padding: 2px 22px;
	line-height: 40px;
	border: 2px solid rgba(255, 255, 255, 1);
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.project-hover a:hover {
	border-color: rgba(51, 51, 51, 1);
	color: rgba(51, 51, 51, 1);
	background-color: #FFF;
}

.project:hover .project-hover {
	opacity: 1;
}

.project:hover .project-hover hr {
	width: 100%;
	height: 5px;
}

.welcome_note h1{  font-family: 'Roboto Condensed', sans-serif; font-size:40px; color:#015c93; 
text-align:center; }

.sm_bdr {
	
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#efefef+39,005bc1+39,005bc1+63,ededed+63 */
background: #efefef; /* Old browsers */
background: -moz-linear-gradient(left, #efefef 39%, #015c93 39%, #015c93 63%, #ededed 63%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #efefef 39%,#015c93 39%,#015c93 63%,#ededed 63%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #efefef 39%,#015c93 39%,#015c93 63%,#ededed 63%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#ededed',GradientType=1 ); /* IE6-9 */
height:6px;


}

.welcome_note p{font-family: 'Roboto', sans-serif; font-size:17px; color:#000; text-align:left; padding:20px 100px 20px 100px;}



.profile_intro { margin-top:30px;}
.profile_intro span{font-family: 'Oswald', sans-serif; font-size:34px; color:#015c93; text-align:left;} 
.profile_intro p{ font-family: 'Roboto', sans-serif; font-size:14px; color:#000; text-align:left;
 padding:30px !important; padding-left:0px !important;}

.profile_intro i { color:#015c93; border:#015c93 2px solid; padding:10px; }

.we_offer h1{  font-family: 'Roboto Condensed', sans-serif; font-size:40px; color:#015c93; text-align:center; 
margin-top:70px; }

.we_offer {

}

.we_offer ul {
  list-style: none;
  margin: 0px;
  margin-top:45px !important;
  padding: 0px;
}

.we_offer li{
	float: none; 
  width: 100%;
}

.we_offer li a{
  display: block; 
  width: 100%; 
  padding: 20px; 
  border-left: 5px solid;
  font-size:20px;
  font-family:'Roboto Condensed', sans-serif;
  position: relative; 
  z-index: 2;
  text-decoration: none;
  color: #444;
  box-sizing: border-box;  
  -moz-box-sizing: border-box;  
  -webkit-box-sizing: border-box; 
}
	
.we_offer li a:hover{ border-bottom: 0px; color: #fff;}
.we_offer li:first-child a{ border-left: 10px solid #015c93; }
.we_offer li:nth-child(2) a{ border-left: 10px solid #015c93; }
.we_offer li:nth-child(3) a{ border-left: 10px solid #015c93; }
.we_offer li:last-child a{ border-left: 10px solid #015c93; }

.we_offer li a:after { 
  content: "";
  height: 100%; 
  left: 0; 
  top: 0; 
  width: 0px;  
  position: absolute; 
  transition: all 0.3s ease 0s; 
  -webkit-transition: all 0.3s ease 0s; 
  z-index: -1;
}

.we_offer li a:hover:after{ width: 100%; }
.we_offer li:first-child a:after{ background: #015c93; }
.we_offer li:nth-child(2) a:after{ background: #015c93; }
.we_offer li:nth-child(3) a:after{ background: #015c93; }
.we_offer li:last-child a:after{ background: #015c93; }



@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 100;
  src: local('Lato Hairline'), local('Lato-Hairline'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/boeCNmOCCh-EWFLSfVffDg.woff) format('woff');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: local('Lato Light'), local('Lato-Light'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/KT3KS9Aol4WfR6Vas8kNcg.woff) format('woff');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/9k-RPmcnxYEPm8CNFsH2gg.woff) format('woff');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: local('Lato Bold'), local('Lato-Bold'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/wkfQbvfT_02e2IWO3yYueQ.woff) format('woff');
}

.gallery h1{ font-family: 'Roboto Condensed', sans-serif; font-size:40px; color:#015c93; text-align:center;}



.footer{ background-color:#015c93; margin-top:15px !important;}
.footer h1{ font-family: 'Oswald', sans-serif; font-size:30px; text-align:left; color:#fff; font-weight:600 ; padding:15px !important; padding-top:10px !important; }

.footer ul{ list-style:none;}
.footer li { display:block; padding-top:5px;}
.footer a{ font-family: 'Roboto', sans-serif; font-size:16px; color:#fff; text-align:left; text-decoration:none; }
.footer a:hover{ color:#FFF; text-decoration:none;}
.footer p{ font-family: 'Roboto', sans-serif; font-size:17px; color:#fff; padding-top:5px; text-align:left; }

.footer_bottom{  background-color:#00456f}


.shreya a{ font-family: 'Roboto', sans-serif; font-size:16px; color:#fff; text-align:right; text-decoration:none; 
padding:5px;}
.shreya a:hover{ color:#FFF; text-decoration:underline}

.copyright { font-family: 'Roboto', sans-serif; font-size:14px; color:#fff; padding-top:5px; text-align:left; }


.contact_div{ margin-top:30px !important;}
.contact_div h1{font-family:'Roboto Condensed', sans-serif; font-size:30px; color:#015c93; font-weight:bold; text-align:left; text-decoration:underline; }

.contact_div h3{ont-family:'Roboto', sans-serif; font-size:18px; color:#000; font-weight:bold; text-align:left;}
.contact_div p{font-family:'Roboto', sans-serif; font-size:16px; color:#000; text-align:left;  }
.map h1{font-family:'Roboto', sans-serif; font-size:30px; color:#b20000; font-weight:bold; text-align:center; text-decoration:underline; }
.contact_div img{ margin-top:50px !important;}

.inquiry_div { margin-top:25px;}
.inquiry_div h1{font-family:'Roboto Condensed', sans-serif; font-size:30px; color:#015c93; font-weight:bold; text-align:left; text-decoration:underline; }
.inquiry_div h3{font-family:'Roboto'; font-size:16px; color:#000; text-align:left; text-transform:uppercase; font-weight:700 ;}

.submit{  background-color:#137ea7; border:#FFF solid thin; padding:12px 20px 12px 20px; text-align:center; font-family:'Roboto', sans-serif; font-size:20px; font-style:italic; color:#FFF;  }


#text2 {
    border: 1px solid #015c93;
    height: 50px;
    width: 90%;
    /*box-shadow: 0 0 27px rgb(204, 204, 204) inset;*/
    transition: 500ms all ease;
    padding: 3px 3px 3px 3px;
	background:none;
}

#text2:hover,
#text2:focus {
    width: 90%;
    transition: 500ms all ease;
    /*
    background-size: 25px 25px;
    background-position: 96% 62%;
    padding: 3px 32px 3px 3px;*/
	box-shadow:#ccc 0 0 15px;
}




.profile { margin-top:25px !important;}
.profile h1{ font-family:'Roboto Condensed', sans-serif; font-size:30px !important; text-align:left; color:#015c93; font-weight:700; border-left:#015c93 solid 12px; padding:8px; background-color:#f2faff;}

.profile h3{ font-family:'Roboto Condensed', sans-serif; font-size:23px !important; text-align:left; color:#000; 
padding:10px; margin:0px !important; margin-top:15px !important;  border-bottom:#000 1px solid; font-weight:700;}

.profile p{ font-size:16px; font-family: 'Roboto', sans-serif; text-align:justify; color:#000; padding-top:10px;}
.profile ul { margin-top:10px !important;}
.profile ul li { font-size:16px; font-family: 'Roboto', sans-serif; text-align:left; color:#000; padding-top:5px !important;}

.product_image { padding:5px; margin-top:10px;} 
.product_image h3{ color:#000;}

table { width:90%; margin-top:20px !important;}
table h1 {font-family:'Archivo'; font-size:18px !important; color:#104099; text-align:left; font-weight:700; border:none !important; background:none !important; padding:0px !important; margin:0px !important;}
table td{ font-family:'Roboto', sans-serif; font-size:16px; color:#000; text-align:left; padding:8px !important; border:#CCC thin solid}
table td span{ font-size:14px; color:#F00;}
.grey_bg{ background-color:#dedede;}
.grey_bdr {border:#ccc thin solid}


/********************************/
/*          Media Queries       */
/********************************/
@media screen and (min-width: 980px){
    .hero { width: 980px; }    
}

@media screen and (max-width: 980px){
	
	
	
	.project {
	width: 100%;
	height:200px;
	padding: 10px !important;
	margin-top:15px !important;
	
}
	.project-hover {
		
	width: 90%;
	height:100%;
	}
	
	.project h2{ margin-top:-25px !important; font-size:20px;}
.project p{font-family: 'Roboto', sans-serif; font-size:16px; color:#fff; text-align:left;}

}

@media screen and (max-width: 768px){
	
	.fade-carousel .slides .slide-1, 
.fade-carousel .slides .slide-2,
.fade-carousel .slides .slide-3 {
	width:100%;
  height: 25vh;
  
}
	.fade-carousel {
    position: relative;
    height: 40vh;
}
.fade-carousel .carousel-inner .item {
    height: 30vh;
}
	
	
	.title-arch {
		text-align: center;
		/*margin: 50px 0;*/
		font-size: 22px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding:10px !important;
	}
	
	
.project {
	width: 100%;
	height:400px;
	
	padding: 10px !important;
	margin-top:0px !important;

}



.project-hover {
	width: 90%;
	height:90%;
}

.project h2{ margin-top:-25px !important; font-size:30px;}
.project p{font-family: 'Roboto', sans-serif; font-size:16px; color:#fff; text-align:left;}

}


@media screen and (max-width: 640px){
    .hero h1 { font-size: 2em; } 
	.hero h3 { font-size: 1.5em; }   
	
	
}

@media screen and (max-width: 480px){
	
	.project {
	width: 100%;
	height:300px;
	}
	
    .project-hover {
	width: 90%;
	height:100%;

}
	
}