/* ==== Google font ==== */
@import url(http://fonts.googleapis.com/css?family=Roboto+Slab:400,300,700,100);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,700,600);
@import url('font-awesome.css');

/* ==== overwrite bootstrap standard ==== */
@import url('overwrite.css');
@import url('animate.css');

/*************************
*******Typography******
**************************/

body {
  background: #ffffff;
  font-family:'Roboto', Arial, sans-serif;
  color:#1a1a1a;
  line-height:1.6em;
  overflow-x:hidden;
}



/************************************
*******Sticky Header Row START ******
*************************************/
.table {
  position: relative;
  z-index: 1;
}

.table__cell { /* header cell */
  position: sticky;
  top: 0;
  /*  background-color: hsl(0, 0%, 100%);  */
  background: #e6e6ff;  
}
/************************************
*******Sticky Header Row END ******
*************************************/




h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight:500; 
    font-family:'Roboto';
	color:#12B3E4;
}

h1{
  font-size: 36px;
	color:#12B3E4;
}

h2{
  font-size:20px;
  color:#12B3E4;
  
}

h3{
  font-size: 16px;
  color: #787878;
  font-weight: 400;
  line-height: 24px;
}

h4{
  font-size: 16px;
}

a {
  color: #0BA9F9;
  -webkit-transition: color 300ms, background-color 300ms;
  -moz-transition: color 300ms, background-color 300ms;
  -o-transition:  color 300ms, background-color 300ms;
  transition:  color 300ms, background-color 300ms;
}

a:hover, a:focus {
  color:rgba(0,0,0,.85);
  text-decoration:none;
}

hr {
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #fff;
}

.btn-primary {
	margin-top:30px;
}

.btn {
  display: inline-block;
  padding: 10px 20px;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
      user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  background-color: #0BA9F9;
}

.btn:hover {
	color: #fff;
	background-color: #0BA9F9;
	border-color: #0BA9F9;
}

.copyright {
	font-size: 10px;
	font-weight: normal;
	/*  color: #fff;  */
	color:#379484;
	/*  font-family:'Roboto';  */
}



/******************************
*******Style Button START******
*******************************/
		.collapsible {
		  background-color: #777;
		  color: white;
		  cursor: pointer;
		  padding: 0px;
		  width: 100%;
		  border: none;
		  text-align: left;
		  outline: none;
		  font-size: 15px;
		}

		.active, .collapsible:hover {
		  background-color: #555555;
		}
		.content {
		  padding: 0;
		  max-height: 0;
		  overflow: hidden;
		  transition: max-height 0.2s ease-out;
		  background-color: #E3E4FB;
		}
		
		/*
		.collapsible:after {
		  content: '\002B';
		  color: #223150;
		  font-weight: bold;
		  float: right;
		  margin-left: 5px;
		}

		.active:after {
		  content: "\2212";
		}
		*/


/******************************
*******Style Button END******
*******************************/



/*************************
*******Header******
**************************/

.navbar-fixed-top .navbar-toggle .icon-bar {
  background-color: #d9d9d9;
}
.navbar>.container .navbar-brand{
  margin-left: 0;
}

.nav-logo {
  position: fixed;
  top: 10px;
  left: 10px;
}

.navbar-brand {
  position: fixed;
  top: 7px;
  left: 75px;
/*  font-size: 80vw; */
/*  padding: 0;  */
/*  margin:0;  */
}

.navbar-header a.navbar-brand {
   color:#111;
   font-family:'Roboto';
}

.navbar-header a.navbar-brand:hover{
   color:#F9F803;
}

.navbar {
  border-radius: 0;
  margin-bottom: 0;
  background: #d9d9d9;
  padding: 8px 0;
  padding-bottom: 0;
}

.navbar-nav{
  margin-top: 12px;
}

.navbar-nav>li{
  margin-left: 20px;
  padding-bottom: 28px;
}

.navbar-fixed-top .navbar-nav > li > a {
	padding: 5px 12px;
	margin: 0;
	border-radius: 3px;
	color: #ffffff;
	line-height: 24px;
	display: inline-block;
	/* text-transform:; */
	font-weight:500;  
	font-size:18px;  
	font-family:'Roboto';
}

.navbar-fixed-top .navbar-nav > li > a:hover{
	background: #223150;	
	/*  background:url('../images/HeaderBackground.jpg');  */
	color:#0ba9f9;
}

.navbar-fixed-top {
  border: none;
  background: #034363;
}

.navbar-fixed-top .navbar-brand {
  font-size: 3vw;
  /*  font-size: 36px;  */
  line-height: 50px;
  color: #fff;
}
.navbar-fixed-top .navbar-nav > .active > a,
.navbar-fixed-top .navbar-nav > .active > a:hover,
.navbar-fixed-top .navbar-nav > .active > a:focus,
.navbar-fixed-top .navbar-nav > .open > a,
.navbar-fixed-top .navbar-nav > .open > a:hover,
.navbar-fixed-top .navbar-nav > .open > a:focus {
  background-color: #111;
  color: #fff;
}

/*************************
*******Slider******
**************************/
.slider {
	position: relative;	
	padding-top:95px;
	/*  padding-top:70px;  */

}



#carousel-slider {

  position: relative;

}



#carousel-slider .carousel-indicators {

  bottom: -25px;

}



#carousel-slider .carousel-indicators li {

  border: 1px solid #ffbd20;

}



#carousel-slider a i {

  border: 1px solid #0BA9F9;

  border-radius:50%;

  font-size: 30px;

  height: 50px;

  padding: 8px;

  position: absolute;

  top: 50%;

  width: 50px;

  color:#0BA9F9;

}



#carousel-slider a i:hover {

  background:#0BA9F9;

  color:#fff;

  border: 1px solid #0BA9F9;

}



#carousel-slider 

.carousel-control {

  width:inherit;

}



#carousel-slider .carousel-control.left i {

  left:50px;

  top:265px;

}



#carousel-slider .carousel-control.right i {

  right: 50px;

  top:265px;

}



#carousel-slider

.carousel-control.left, 

#carousel-slider

.carousel-control.right {

  background: none;

}



.carousel-caption {

  position: absolute;

  right: 15%;

  bottom: 150px;

  font-size:40px;

  left: 15%;

  z-index: 10;

  padding-bottom: 0px;

  color: #fff;

  text-align: center;

}



.carousel-caption  h2 {

	font-size:60px;

	color: #0BA9F9;

}



.carousel-caption  h2 span {

	font-size:60px;

	color: #fff;

}



.carousel-caption  p {

  font-size:30px;

  margin-top:30px;

  color:#fff;

}



.carousel-inner .form-inline .form-group button[type="livedemo"]{

	padding:20px 60px;

	font-size:25px;

	background:#0BA9F9;

	color:#fff;

}



.carousel-inner .form-inline .form-group button[type="livedemo"]:hover {

	color:#0BA9F9;

	background:#fff;

	-webkit-transition: color 300ms, background-color 300ms;

  -moz-transition: color 300ms, background-color 300ms;

  -o-transition:  color 300ms, background-color 300ms;

  transition:  color 300ms, background-color 300ms;

}



.carousel-inner .form-inline .form-group button[type="getnow"]{

	padding:20px 60px;

	font-size:25px;

	background:#fff;

	color:#0BA9F9;

}



.carousel-inner .form-inline .form-group button[type="getnow"]:hover {

	color:#fff;

	background:#0BA9F9;

	-webkit-transition: color 300ms, background-color 300ms;

  -moz-transition: color 300ms, background-color 300ms;

  -o-transition:  color 300ms, background-color 300ms;

  transition:  color 300ms, background-color 300ms;

}



/*************************

*******ourwork******

**************************/

#ourwork {

	padding-top:90px;

	background:#fff;

	padding-bottom:50px;

}



.hi-icon-effect {

	padding-bottom:30px;

	padding-left:10px;

	padding-right:10px;

}



.hi-icon-effect:hover {

	border-radius:6px;

	background:#f4f4f4;

	-webkit-transition: color 300ms, background-color 300ms;

  -moz-transition: color 300ms, background-color 300ms;

  -o-transition:  color 300ms, background-color 300ms;

  transition:  color 300ms, background-color 300ms;

}



.hi-icon-effect i.fa:hover {

	background:#fff;

	color: #0BA9F9;

	-webkit-transition: color 300ms, background-color 300ms;

  -moz-transition: color 300ms, background-color 300ms;

  -o-transition:  color 300ms, background-color 300ms;

  transition:  color 300ms, background-color 300ms;

}



.text-center i {

	font-size:30px;

	margin-top:50px;

	margin-bottom:30px;

	color:#fff;

	padding:50px;

	background:#0BA9F9;

	border-radius:50%;

}

.text-center h2 {

	margin-top:20px;

	margin-bottom:20px;

}



.text-center h3 {

	font-size:35px;

	margin-top:50px;

	margin-bottom:20px;

	color:#8A89B9;

}



.text-center p {

	margin-bottom:30px;

}



/*************************

********  Gallery  *******

**************************/

#gallery {

	padding-top:70px;

	padding-bottom:70px;

	background:#f4f4f4;

}

#gallery img {

	border-radius:8px;

}



.gallery {

	margin-top:60px;

	margin-bottom:30px;

}



#gallery .text-center {

	padding-top:20px;

	margin-bottom:50px;

	padding-bottom:20px;

}



figure.effect-chico img {

	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;

	transition: opacity 0.35s, transform 0.35s;

	-webkit-transform: scale(1.12);

	transform: scale(1.12);

}



figure.effect-chico:hover img {

	opacity: 0.5;

	-webkit-transform: scale(1);

	transform: scale(1);

}



/*************************

*******parallax******

**************************/



.parallax-window {

    min-height: 500px;

    background: transparent;

}



.parallax-window .text-center h2 {		

	font-size:60px;

	margin-top:90px;

	padding-top:5px;

	padding-bottom:5px;

	color:#fff;

}



.parallax-window .text-center p {	

	color:#fff;

	font-size:20px;	

}



.sub-parallax .form-inline .form-group button[type="purchase"] {

	padding:20px 90px;

	font-size:20px;

	background:#fff;

	color:#0BA9F9;

	border-color: #0BA9F9;

}



.sub-parallax .form-inline .form-group button[type="purchase"]:hover {

	background:#0BA9F9;

	color:#fff;

	-webkit-transition: color 300ms, background-color 300ms;

  -moz-transition: color 300ms, background-color 300ms;

  -o-transition:  color 300ms, background-color 300ms;

  transition:  color 300ms, background-color 300ms;

}



.sub-parallax .form-inline .form-group button[type="subscribe"] {

	padding:20px 90px;

	font-size:20px;	

}



.sub-parallax .form-inline .form-group button[type="subscribe"]:hover {

	background:#fff;

	color:#0BA9F9;

	-webkit-transition: color 300ms, background-color 300ms;

  -moz-transition: color 300ms, background-color 300ms;

  -o-transition:  color 300ms, background-color 300ms;

  transition:  color 300ms, background-color 300ms;

}





/*************************

*******our team******

**************************/

#ourteam {

	padding-top:90px;

	padding-bottom:70px;

	background:#f4f4f4;

}



#ourteam h4 {

	color:#0BA9F9;

}



#ourteam .text-center {

	padding-top:20px;

	margin-bottom:30px;

	padding-bottom:10px;

}



#ourteam .team img {

	border-radius:8px;

}



/*************************

*******footer******

**************************/

footer {

	background:#f4f4f4;

	padding-bottom:20px;

}



#contact {

	background:url('../images/map.jpg');

	padding-top:70px;

	padding-bottom:80px;

}



#contact .text-center {

	padding-top:20px;

	margin-bottom:30px;

	padding-bottom:10px;

}



#contact ul {

	list-style:none;

	margin-left:-40px;

	font-size:13px;

}



#contact h2 {

	color:#000;

	margin-bottom:30px;

	font-size:25px;

}

.form-inline {

	margin-top:15px;

	margin-bottom:15px;	

}



.form-inline .form-group input[type="name"]{

	margin-top:10px;

	border-radius:4px;

	border-radius:6px;

}



.form-inline .form-group input[type="email"]{

	margin-top:10px;

	border-radius:6px;

	padding:5px 20px;

}



.sub-footer form {

	margin-top:60px;

	margin-bottom:30px;

}



.sub-footer .form-inline .form-group button[type="purchase"] {

	padding:20px 90px;

	font-size:25px;

}



.sub-footer .form-inline .form-group button[type="purchase"]:hover {

	background:#fff;

	color:#0BA9F9;

	-webkit-transition: color 300ms, background-color 300ms;

  -moz-transition: color 300ms, background-color 300ms;

  -o-transition:  color 300ms, background-color 300ms;

  transition:  color 300ms, background-color 300ms;

}



.sub-footer .form-inline .form-group button[type="subscribe"] {

	padding:20px 90px;

	font-size:25px;

	background:#fff;

	color:#0BA9F9;

	border-color: #0BA9F9;

}



.sub-footer .form-inline .form-group button[type="subscribe"]:hover {

	background:#0BA9F9;

	color:#fff;

	-webkit-transition: color 300ms, background-color 300ms;

  -moz-transition: color 300ms, background-color 300ms;

  -o-transition:  color 300ms, background-color 300ms;

  transition:  color 300ms, background-color 300ms;

}



ul.social-network {

	list-style:none;

	margin-top:20px;	

	padding:10px;

	transition: all 0.3s ease-in-out;

  -moz-transition: all 0.3s ease-in-out;

  -webkit-transition: all 0.3s ease-in-out;

  -o-transition: all 0.3s ease-in-out;

}



.social-icon {

	text-align:center;

	margin-bottom:30px;

}



ul.social-network li {

	display:inline;

	margin: 0 18px;	

	font-size:25px;	

}



ul.social-network li a {	

	color:#d0d0d0;

	text-align:center;

}

.social-network li:hover .fa-twitter {

  color: #00abf0;

}

.social-network li:hover .fa-facebook {

  color: #39579a;

}

.social-network li:hover .fa-google-plus {

  color: #eb8984;

}

.social-network li:hover .fa-pinterest {

  color: #c9171e; 

}

.social-network li:hover .fa-linkedin {

  color: #0077b5; 

}

.social-network li:hover .fa-youtube-play {

  color: #C84941; 

}

.social-network li:hover .fa-dribbble {

  color: #EA4C89 ; 

}

.social-network li:hover .fa-pinterest-square {

  color: #EA4B49; 

}