@charset "utf-8";
#highlights img {
	
    max-width:70%;
    max-height: 70%;	
}
/* [1] The container */
.img-hover-zoom {
  width: 100%; /* [1.1] Set it as per your need */
  overflow: hidden; /* [1.2] Hide the overflowing of child elements */
}

/* [2] Transition property for smooth transformation of images */
.img-hover-zoom img {
   transform-origin: 20% 20%;
  transition: transform 5s, filter 2s ease-in-out;
  filter: brightness(100%);
}

/* [3] Finally, transforming the image when container gets hovered */
.img-hover-zoom:hover img {
 
  filter: brightness(120%);
  transform: scale(1.1);
}
img.fitz {
    width: 40%;
    height:40%;
    float: right;
    padding-left: 20px;
}
#why {
    background-color: #FFFFFF;
    text-align: center;
	
	
}
#why1 {
    background-color: #1e5588;
  
  background-size: cover; 
	
}

#why.wire {
    background-color: #1e5588;
    text-align: center;
	background-image: url("../images/bannerwire.jpg");
	background-position: left; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; 

}
.whyChoose1 {
    margin-bottom: 30px;
    margin-top: 30px;  
}
.whyChoose1 p {
    padding: 5%;
    color: #1E5588
}
.whyChoose1 h3 {
    padding: 5px;
    color: #1E5588
	
}
.whyChoose1 img {
    margin: 0 auto;
	padding-top: 10px;
  
}
.whyChoose1 {
    min-height: 100%;
    
    margin-bottom: 5px;
    margin-top: 20px;
    
}
.whyChoose1 p {
    padding: 5px;
}
.whyChoose1 h3 {
    padding: 5px;
}
#why2 {
	/* Create the parallax scrolling effect */
	
	background-position: center;
	
	background-size: 100%;
	background-image: url("../images/par.jpg");
	text-align: center;
    height: 230px;
}
#why2 p {
    color: #FFFFFF;
    font-weight: bolder;
    padding-top: 30px;
    font-size: 1em;
	text-shadow: 1px 1px 2px black;
}
body {
    background-color: #FFFFFF;  font-family: "poppins", sans-serif
;
font-weight: 300;
font-style: normal;
	overflow-x: hidden;
}
#lake {
	position: relative;
}
img .icon {
	width: 30px;
	margin: 10px auto;
	display: block;
}
#highlights {
	text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #FFFFFF;
}
h2{  font-family: "poppins", sans-serif
;
    color: #1F2D7D;
    font-size: 2.5em;
    line-height: 1.2em;
	text-align: center;
	padding-top:2px;
	padding-bottom:2px;
	font-weight: 800;
}
 #why1 h2{
	color: #FFFFFF;
	 margin-top: 0px;
	 padding-top: 0px;
}
h2.icons {
	color: #1E5588;
	font-weight: bold;
}

.col-sm-6.col-md-3.first.col-lg-6.logo {
    height: 300px;
}
#highlights h2 {
    font-weight:  800px;
    text-align: center;
    font-size: 1.8em;
	padding-bottom: 2px;
	padding-top: 2px;
	color: #000000;
	
}
h3 {  font-family: "poppins", sans-serif
;
font-weight: 400;
font-style: normal;
	color: #000000;
        font-size: 1.8em;
    font-weight: bold;
	line-height: 0.9em
}
#footer h3 {
	text-align: center;
}
#extreintro h3 {
	color: #2d78dd;
    font-weight: bolder;
}
#extreintro {
	background-color: #F6F6F6;
}
#extreintro img {
    width: 30%;
    height:50%;
    float: left;
    padding-right: 20px;
    padding-bottom: 20px;
}
#footer p img {
    float: left;
   
    padding-right: 10px;
}
#footer .img-responsive {
    max-width: 100%;
	padding-top:0px;
	margin-top: 0 auto;
	 max-height: 200px;
	
}
#footer {
    background-color: #1e5588;
    border-bottom: 10px solid #000000;
    padding-top: 5px;   
}
#footer p { 
	color: #FFFFFF;
	font-weight: bolder;
}
#mainContent h3 {
    color: #2E72E2;
    font-size: 1.5em;
    line-height: 1.4em;
    font-weight: normal;
}
#feature h3 {
    color: #2E72E2;;
    font-size: 1em;
    line-height: 1.4em;
    font-weight: normal;
	text-align: center;
}
h4 {  font-family: "poppins", sans-serif
;
font-weight: 400;
font-style: normal;
    font-size: 1.2em;
    text-align: center;
    letter-spacing: 1px;
     padding-left: 0px;
    padding-right:0px;
    padding-top: 5px;
    padding-bottom: 5px;
    color: #FFFFFF;
}

#accreditation h4 {
    color: #4A4A4A;
    font-size: 2em;
}
.accreditationImages  h4{
    color: #2E2E2E;
}
#header h5 {  font-family: "poppins", sans-serif
;
font-weight: 400;
font-weight: 800;

font-weight: 400;
font-style: normal;
    color:  #000000;
    font-size: 1.5em;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: right;
    padding-top: 0px;;
}
#footer h5 a:link {
    color: #FFFFFF;
    font-size: 1.2em;
    font-weight: bolder;
    letter-spacing: 2px;
    /* new */
	-moz-transition: color .75s ease;
	-o-transition: color .75s ease;
	-webkit-transition: color .75s ease;
    transition: color .75s ease;
}
#footer h5 a:hover {
	color: #000000;
    text-decoration: none;
}
#header h5 a:link {
    color:  #FFFFFF;
    font-size: 1.5em;
    font-weight: lighter;
    /* new */
	-moz-transition: color .75s ease;
	-o-transition: color .75s ease;
	-webkit-transition: color .75s ease;
	transition: color .75s ease;
}
#header h5 a:hover {
	color: #007BC5;
    text-decoration: none;
}
h6 {
    font-size: 1.5em;  font-family: "poppins", sans-serif
;
font-weight: 400;
font-weight: 800;
	line-height: 1em;
}
#footer h6 .img-responsive {
	text-align: center;
	margin: 0 auto;
	padding-top: 10px;

}
#header h6 a:link {
    font-weight: bold;
    color: #08DAF9;
	 /* new */
	-moz-transition: color .75s ease;
	-o-transition: color .75s ease;
	-webkit-transition: color .75s ease;
	transition: color .75s ease;
	font-size: 1.3em;
}

#header h6 a:hover {
	
    font-weight: bold;
    color: #000000;
    text-decoration: none;
}

a:link, a:visited{
    font-weight: bold;
    color: #2E72E2;
	text-decoration: none;
	 /* new */
	-moz-transition: color .75s ease;
	-o-transition: color .75s ease;
	-webkit-transition: color .75s ease;
	transition: color .75s ease;
}
a:hover, a:active {
    font-weight: bold;
    color: #000000;
    text-decoration: none;
}
#footer a:link, #footer a:visited{
    font-weight: bold;
    color: #2E72E2;
	text-decoration: none;
}
#footer a:hover, #footer a:active {
    font-weight: bold;
    color: #000000;
    text-decoration: none;
}
#accordion1 a:link, a:visited{
	font-weight: lighter;
	color: #000000;
	list-style-type: square;
	font-size: 1em;
}
#accordion1 a:hover, a:active {
 
    color: #2E72E2;
    text-decoration: none;
}
.navbar-default .navbar-nav > li > a:link,
.navbar-default .navbar-nav > li > a:visited {
  color: #1F2D7D;
  background-color: transparent;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #2E72E2;
  background-color: transparent;
}

#accordion1 .panel.panel-default #collapseTwo1 .panel-body .row .col-lg-3.col-md-3.col-sm-6 ul li a {
    font-size: 0.8em;
}
p{
    color: #4A4A4A;  font-family: "poppins", sans-serif
;
font-weight: 300;
font-style: normal;
	font-size: 1.2em;
    line-height: 1.6em;
}
#footer p {
	line-height: 1em;
}
h1 {  font-family: "poppins", sans-serif
;
font-style: normal;
	color:#FFFFFF;
	font-size: 1.5em;
    font-weight: bolder;
    text-align: center;
  margin-top: 20px;
    margin-bottom: 0px;
  line-height: 1.1em;
}
h1 a:link {
	color:#007BC5;

}
p strong {
	color: #0D167B;
}

#header {
padding-top: 20px;
text-align: center;
	background-color: #1e5588;
	width:  100%;
position: fixed;
	z-index: 15;
	height: 120px;
	
}
.navbar-fixed-top,
.navbar-fixed-bottom {
  position: fixed;
  right: 0;
  left: 0;
  margin-top:120px;
  z-index: 10;
	background-color: #FFFFF;

}
#feature  {
    background-color: #FFFFFF;
    padding-top: 50px;
    padding-bottom: 50px;
	padding-left:10px;
	padding-right: 10px;
}

.whyChoose1 {
  
    margin-top: 30px;  
	margin-bottom: 0px;
  
}
.whyChoose1 h6 {
    margin: 0px;  
	padding: 0px;
	position: absolute;
	left: 30px;
	top:20px;
}
.whyChoose1 p {
    padding: 5%;
   color: #1E5588
}
.whyChoose1 h3 {
    padding-left:5%;
	margin-top: 5px;
   
}
.whyChoose1 img {
    margin: 0 auto;
    
}
.whyChoose1 h3 img {
    margin: 0 auto;
	padding: 0px;
}
.example-image-link img {
    max-width: 100%;
    padding: 5px;
  
}
#banner img {
	
	background-color: #1e5588;
}
#header .btn-success {
    background-color: #FFFFFF;
    width:100%;
    max-width: 300px;
    margin-bottom: 15px;
    margin-top: 10px;
    height: 50px;
    color: #000000;
	border: none;
}

#header .btn.btn-success:hover {
	background-color: #007BC5;
    color: #FFFFFF;
}

 .img-responsive.main {
    max-height: 80px;
    margin: 0 auto;
    padding-top: 2px;
 
} 
.btn-success {
    background-color: #28B2D3;
    width: 130px;
    margin-bottom: 15px;
    margin-top: 5px;
    height: 50px;
    border: none;
    font-weight: bold;
	-moz-transition: background-color .75s ease;
	-o-transition: background-color .75s ease;
	-webkit-transition: background-color .75s ease;
	transition: background-color .75s ease;
}
.btn-success:hover {
	background-color: #616060;
}
#contactBar .btn.btn-success:hover {
	background-color: #616060;
    color: #FFFFFF;
}
#contactBar2 .btn.btn-success:hover {
	background-color: #616060;
    color: #FFFFFF;
}

#mainContent {
    background-color: #EFEFEF;
    padding-top: 5px;
    padding-bottom:5px;
}
#mainContent2{
    background-color: #FFFFFF;
    padding-top: 5px;
    padding-bottom:5px;
}
.container-fluid.headerContain {
    background-color: #FFFFFF;
}
.whyChoose1 {
  
    margin-bottom: 5px;
    margin-top: 5px;
    
}
.whyChoose1 p {
    padding-left:5%;
	padding-right:5%;
	padding-top:2px;
	padding-bottom:2px;
    font-weight: lighter;
    font-size: 1em;
    line-height: 1.5em;
}
.whyChoose1 h3 {
    padding-left:5%;
	padding-right:5%;
	padding-top:2px;
	padding-bottom:2px;
   text-align: center;
	font-size: 1.2em;
	line-height: 1.3em;
}
#suppliers {
    background-color: #EFEFEF;
   padding-top:30px;
    padding-bottom:30px;
}
#suppliers h4 {
    font-size: 2em;
}
#suppliers h5 {
    color: #FFFFFF;
    text-align: center;
     padding-left: 0px;
    padding-right:0px;
    padding-bottom: 0px;
}
#accreditation {
         padding-top:80px;
    padding-bottom:80px;
}
#accreditation h5{
    color: #606060;
    text-align: center;
         padding-left: 0px;
    padding-right:0px;
    padding-bottom: 50px;
}

#footer ul {
    color:#FFFFFF;
    font-weight: lighter;
    font-size: 1.1em;
    line-height: 2em;
}
ul {
  list-style: none;
}

#mainContent.row.wire ul li:before {
	 content: '✓';
}
#contactBar.row ul li:before {
	 content: '✓';
}
.row.subject p {
    text-align: center;
    font-size: 0.8em;
    padding-top: 20px;
    padding-bottom: 20px;
}
#feature  {
    background-color: #FFFFFF;
    padding-top: 50px;
    padding-bottom: 50px;
}
.glyphicon.glyphicon-home {
    margin-top: 15px;
}

.carousel-caption p  {
    text-align: left;
}

.carousel-caption p img {
    max-height: 15px;
}
.carousel-inner .item .carousel-caption {
    max-width: 1000px;
    margin: 0 auto;
}
#carousel1 h3 img {
    margin: 0px auto;
    padding-top: 20px;
}
#carousel1 .carousel-inner .item {
    background-color: #4A4A4A;
     padding-bottom: 50px;
}
.review {
    background-color: #FFFFFF;
}
#carousel1 {
    padding-bottom: 50px;
}

.item .carousel-caption p {
    color: #FFFFFF;
}
.col-sm-6.col-lg-3.col-md-3.first {
    min-height:250px;
}
#accordion1 {
    margin-bottom: 0px;
}
#accordion1 h3 {
    font-size: 1em;
}
#accordion1 li {
	font-size: 1.2em;
	list-style-position: outside;
    }
.rightside {
    background-color: #D20F12;
}
.row.banner {
    background-color: #FFFFFF;
}
#bannerImg {
    height: 600px;
}
#suppliers img {
	margin: 10px;
    max-height: 40px;
	-webkit-transition: all .5s ease;	
	-moz-transition: all .5s ease;	
	-o-transition: all .5s ease;	
	transition: all .5s ease;
}
#suppliers img:hover {
	
	-webkit-backface-visibility: hidden;
	filter: brightness(1000%);
  transform: scale(1.2);
}
#accreditation img {
	margin: 20px;
    max-height: 70px;
	-webkit-transition: all .5s ease;	
	-moz-transition: all .5s ease;	
	-o-transition: all .5s ease;	
	transition: all .5s ease;
}
#accreditation img:hover {
	-webkit-transform: scale(1.5);	
	-moz-transform: scale(1.5);	
	-ms-transform: scale(1.5);	
	-o-transform: scale(1.5);	
	transform: scale(1.5);
	-webkit-backface-visibility: hidden;
}
#highlights img {
	margin-top: 5px;
	margin-bottom: 5px;

}

label {
    font-size: 1.2em;
    margin-top: 20px;
    color: #007BC5;
}

form input {
    width: 100%;
    margin-top: 10px;
}
form label {
    width: 100%;
    margin-top: 10px;
}
form textarea {
    width: 100%;
    height: 200px;
    margin-top: 10px;
    margin-bottom: 20px;
}
input[type=submit] {
    border-radius: 5px;
    border: 0;
    width: 80px;
    height:25px;  font-family: "poppins", sans-serif
;
    background: #f4f4f4;
    /* Old browsers */
    background: -moz-linear-gradient(top, #f4f4f4 1%, #ededed 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #f4f4f4), color-stop(100%, #ededed));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #f4f4f4 1%, #ededed 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #f4f4f4 1%, #ededed 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #f4f4f4 1%, #ededed 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #f4f4f4 1%, #ededed 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f4f4', endColorstr='#ededed', GradientType=0);
    /* IE6-9 */
}

#carousel1 .img-responsive {
    padding: 0px;
    margin-top: 3px;
    margin-bottom: 3px;
}
#carousel1 h3 {
    padding-top: 0px;
    padding-bottom: 10px;
    margin: 0px;
}
#carousel1 p {
padding: 0px;
    margin: 0px;
    font-size: 0.9em;
}
#carousel1 h3 .img-responsive {
    margin: 0 auto;
    max-height: 100px;
}

#header  h6 .img-responsive.which {
    max-height: 90px;
    position: absolute;
    right: 290px;
    top: 10px;
}
#header  h5 .img-responsive.which {
    max-height: 100px;
    margin: 0px auto;
}
.glyphicon.glyphicon-chevron-left {
}
.row.review #carousel1 h2 {
    text-align: center;
}
#contactBar p {
    color: #FFFFFF;
    font-weight: bold;
    font-size: 1em;
    
	line-height: 1.2em;
}
#contactBar .btn.btn-success {
    text-align: center;
   
    float: right;
    margin-top: 0px;
    background-color: #2E72E2;;
    color: #000000;
    margin-bottom: 15px;
    height: 50px;
	border: none;
    
}
#contactBar .btn.btn-success:hover {
    background-color: #007BC5;
    color: #FFFFFF;
}
#contactBar2 .btn.btn-success:hover {
    background-color: #007BC5;
    color: #FFFFFF;
}
#contactBar3 .btn.btn-success:hover {
    background-color: #007BC5;
    color: #FFFFFF;
}
#contactBar2 p {
    color: #ADADAD;
    font-weight: bold;
    font-size: 1em;
    
	line-height: 1.8em;
}
#contactBar h2 {
	padding-top: 0px;
	
    color: #007BC5;
    font-weight: bold;
    font-size: 1.4em;
	line-height: 1.1em;
	
}
#contactBar3 h2 {
	padding-top: 0px;
	
    color: #2E72E2;;
    font-weight: bold;
    font-size: 1.4em;
	line-height: 1em;
}
#contactBar2 h2 {
	padding-top: 0px;
	
    color: #2E72E2;;
    font-weight: bold;
    font-size: 1.4em;
	line-height: 1em;
}
#contactBar2 .btn.btn-success {
    text-align: center;
    width: 100%;
    float: right;
    margin-top: 10px;
    background-color: #2E72E2;;
    color: #000000;
    margin-bottom: 15px;
    height: 50px;
	border: none;
    
}
#contactBar3 p {
     color: #ffffff;
    font-weight: bold;
    font-size: 1em;
    line-height: 1.8em;
}
#contactBar3 .btn.btn-success {
    text-align: center;
    width: 100%;
    float: right;
    margin-top: 0px;
    background-color: #2E72E2;;
    color: #000000;
    margin-bottom: 15px;
    height: 50px;
	border: none;
	
    
}
.container-fluid.page #contactBar {
        background-color: #007BC5;
   padding-bottom: 10px;
	background-image: url("../images/bannerblue2.jpg");
	background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; 
}
li {
	color: #000000;
	font-size: 1em;
	
}
#mainContent li {
	color: #000000;
	font-size: 1em;
}
li.blue {
	color: #1F2D7D;
	font-size: 1.3em;
	
}

ul {
	list-style-position: inside;
  padding-left: 0;
}
.container-fluid.page #contactBar2 {
    background-color: #007BC5;
   padding-bottom: 10px;
}
.container-fluid.page #contactBar3 {
       background-color: #000000;
   padding-bottom: 10px;
}

.hero-image {
  background-image: url("../images/banner_main.jpg"); /* The image used */
  background-color: #cccccc; /* Used if the image is unavailable */
  height: 500px; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
	position: relative;
	width: auto;
}
.hero-image2 {
  background-image: url("../images/banner_floor.jpg"); /* The image used */
  background-color: #cccccc; /* Used if the image is unavailable */
  height: 500px; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
	position: relative;
}
.hero-image3 {
  background-image: url("../images/banner_aircon.jpg"); /* The image used */
  background-color: #cccccc; /* Used if the image is unavailable */
  height: 500px; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
	position: relative;
}
.hero-image4 {
  background-image: url("../images/banner_boilerinstall.jpg"); /* The image used */
  background-color: #cccccc; /* Used if the image is unavailable */
  height: 500px; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
	position: relative;
}
.hero-image5 {
  background-image: url("../images/banner_boilerserve.jpg"); /* The image used */
  background-color: #cccccc; /* Used if the image is unavailable */
  height: 500px; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
	position: relative;
}

.overlayText {
  position: relative;
  top: 50%;
  left: 10%;
  z-index: 5;
}
video {
  width: 90%;
  height: auto;
}
.videocontainer {
		position: relative;
	margin-top:170px;
		width: 110%;
	overflow: visible;
	left: -15px;
margin-left: auto;
	margin-right: auto;
	padding: 15px;
	
}
#topText {
  color: white;
  font-size: 20px;
  align-self: center;
}
/* Centered text */
.centered {
	color: #FFFFFF;
 position: absolute;
  top: 30px;
  left: 10%;  font-family: "poppins", sans-serif
;
	font-size: 3em;
	font-weight: bolder;
	text-shadow: 4px 4px 4px #000000;
	text-align: left;
	
}

/* Centered text */
.centered2 {
	color: #FFFFFF;  font-family: "poppins", sans-serif
;
  position: absolute;
  top:120px;
  left: 10%;
	font-size: 1.5em;
	font-weight: bolder;
	text-shadow:4px 4px 4px #000000;
	text-align: left;
	width: 80%;


}
.centered3 {
	color: #FFFFFF;
	text-align: left;  font-family: "poppins", sans-serif
;
	
  position: absolute;
  top: 180px;
  left: 10%;
}

.centered4 {
	color: #FFFFFF;
  position: absolute;
  top: 100px;
  left: 30%;  font-family: "poppins", sans-serif
;
	font-weight: bolder;
	text-shadow: 4px 4px 4px #0E73C8;
	text-align: center;

}
/* [1] The container */
.img-hover-zoom {
  width: 100%; /* [1.1] Set it as per your need */
  overflow: hidden; /* [1.2] Hide the overflowing of child elements */
}

/* [2] Transition property for smooth transformation of images */
.img-hover-zoom img {
  transition: transform .5s ease;
}

/* [3] Finally, transforming the image when container gets hovered */
.img-hover-zoom:hover img {
  transform: scale(1.1);
}

.reveal {

  opacity: 0;
}

.reveal.active {
  opacity: 1;
}
.active.fade-bottom {
  animation: fade-bottom 1s ease-in;
}
.active.fade-left {
  animation: fade-left 1s ease-in;
}
.active.fade-right {
  animation: fade-right 1s ease-in;
}
.bannerreveal {
  position: relative;
  opacity: 0;
}

.bannerreveal.active {
  opacity: 1;
}
#why1 .whyChoose1 h3 {
	color: #FFFFFF;
}
#why1 .whyChoose1 p {
	color: #FFFFFF;
}
/* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {
	margin-top: 10px;
	
  background-color: transparent;
 width: 100%;
  height: 280px;
  border: 1px solid #f1f1f1;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
 width: 100%;
	
  height: 280px;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;

}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
   width: 100%;
  height: 280px;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */

.flip-card h1 {
	padding: 10px
}
.flip-card p {
	padding: 10px;
	color: #FFFFFF;
}
.flip-card-front.one {
	background-color: #bbb;
  color: black;
	background-image: url("../images/project_2.jpg");
background-size:     cover;                      /* <------ */
    background-repeat:   no-repeat;
    background-position: center center;  
}
.flip-card-front.two {
	background-color: #bbb;
  color: black;
	background-image: url("../images/project_1.jpg");
background-size:     cover;                      /* <------ */
    background-repeat:   no-repeat;
    background-position: center center;  
}
.flip-card-front.three {
	background-color: #bbb;
  color: black;
	background-image: url("../images/project_3.jpg");
background-size:     cover;                      /* <------ */
    background-repeat:   no-repeat;
    background-position: center center;  
}
.flip-card-front.four {
	background-color: #bbb;
  color: black;
	background-image: url("../images/project_4.jpg");
background-size:     cover;                      /* <------ */
    background-repeat:   no-repeat;
    background-position: center center;  
}

/* Style the back side */
.flip-card-back {
  background-color: dodgerblue;
  color: white;
  transform: rotateY(180deg);
}
.flip-card-back.one {
  background-image: url("../images/project_2b.jpg");
background-size:     cover;                      /* <------ */
    background-repeat:   no-repeat;
    background-position: center center;  
  color: white;
  transform: rotateY(180deg);
}
.flip-card-back.two {
 background-image: url("../images/project_1b.jpg");
background-size:     cover;                      /* <------ */
    background-repeat:   no-repeat;
    background-position: center center;  
  color: white;
  transform: rotateY(180deg);
}
.flip-card-back.three {
  background-image: url("../images/project_3b.jpg");
background-size:     cover;                      /* <------ */
    background-repeat:   no-repeat;
    background-position: center center;  
  color: white;
  transform: rotateY(180deg);
}
.flip-card-back.four {
  background-image: url("../images/project_4b.jpg");
background-size:     cover;                      /* <------ */
    background-repeat:   no-repeat;
    background-position: center center;  
  color: white;
  transform: rotateY(180deg);
}
#project {
margin-bottom: 10px;
}

.sliderContainer {
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.logoSlider img {
  height: 50px;
	padding: 10px;
  
}

.logoSlider {
  display: flex;
  animation: slideshow 60s infinite linear;
}

@keyframes slideshow {
  from {
    transform: translate(0px);
  }
  to {
    transform: translate(-1800px);
  }
}
@keyframes fade-bottom {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-left {
  0% {
    transform: translateX(-100px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes fade-right {
  0% {
    transform: translateX(100px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}




/* Animation property */

/* Keyframes */
@keyframes wiggle {
  0%, 7% {
    transform: rotateZ(0);
  }
  15% {
    transform: rotateZ(-15deg);
  }
  20% {
    transform: rotateZ(10deg);
  }
  25% {
    transform: rotateZ(-10deg);
  }
  30% {
    transform: rotateZ(6deg);
  }
  35% {
    transform: rotateZ(-4deg);
  }
  40%, 100% {
    transform: rotateZ(0);
  }
}

@media (max-width: 649px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #4a4a4a;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #007BC5;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    background-color: #f8f8f8;
  }
    
}
@media (max-width:400px){
.container-fluid.page #header {
    text-align:  center;
}
.container-fluid.page #header h5 {
    text-align: center;
}
    .container-fluid.page #header h1 {
    text-align: center;
    padding-left: 0px;
}
      .container-fluid.page #header .img-responsive.main {
   margin: 0 auto;
		 
}  


	.navbar-header {
		height: 60px;
		background-color: #1E5588
		
	}
}
.videocontainer {
		overflow: hidden;	
	}
.videocontainer .centered2{
	overflow: hidden;
	
	}

@media (max-width:825px){
     #header  h6 .img-responsive.which {
        display: none;     
    } 
    .btn-success {
        margin-top: 0px;
    }

		#header h6 {
    font-size: 1em;
}
			#header h1 {
    font-size: 1em;
}
    
}
@media (min-width:649px){
     #header  h5 .img-responsive.which {
        display: none;
    }
	#mobileHeader {
		display: none;
		z-index: 2000;
	}
#banner {
	
	margin-top: 170px;		
}
	.centered {
	color: #FFFFFF;
 position: absolute;
  top: 180px;
  left: 10%;  font-family: "poppins", sans-serif
;
	font-size: 4em;
	font-weight: bolder;
	text-shadow: 4px 4px 4px #000000;
	text-align: left;

}

/* Centered text */
.centered2 {
	color: #FFFFFF;  font-family: "poppins", sans-serif
;
  position: absolute;
  top:270px;
  left: 10%;
	font-size: 1.5em;
	font-weight: bolder;
	text-shadow:4px 4px 4px #000000;
	text-align: left;


}
.centered3 {
	color: #FFFFFF;
	text-align: left;  font-family: "poppins", sans-serif
;
	
  position: absolute;
  top: 330px;
  left: 10%;
}
}


@media (max-width:649px){
	
	body {
		padding-top: 50px;
	}
    .container-fluid.page #header {
    display: none;
}
.container-fluid.page #header h5 {
    text-align: center;
}
    .container-fluid.page #header h1 {
    text-align: center;
    padding-left: 0px;
}
      .container-fluid.page #header .img-responsive.main {
   margin: 5px auto;
		  width: 200px;
}
    .btn-success {
    margin-top: 15px;
	
}
	#header h1 {
    font-size: 0.7em;
		font-weight: lighter;
		line-height: 1.2em;
		padding-top: 0px;
		margin-top: 0px;
		margin-bottom: 0px;
}
		#header h6 {
    font-size: 1.2em;
			margin-top: 5px;
		margin-bottom: 5px;
}
	.navbar-header {
	
	background-color: #1E5588;	
		margin-bottom: 0px;

}
		/* Centered text */
.centered {
	color: #FFFFFF;
 position: absolute;
  top: 30px;
  left: 20px;  font-family: "poppins", sans-serif
;
	font-size: 2em;
	font-weight: bolder;
	text-shadow: 4px 4px 4px #000000;
	text-align: center;

}

/* Centered text */
.centered2 {
	color: #FFFFFF;
	font-family: "poppins", sans-serif;
  position: absolute;
  top: 70px;
  left: 20px;
	font-size: 1.2em;
	font-weight: lighter;
	text-shadow:4px 4px 4px #000000;
	text-align: left;


}
.centered3 {
	color: #FFFFFF;
	text-align: center;
	font-family: "poppins", sans-serif;	
  position: absolute;
  top: 130px;
  left: 5px;
}
	li {
	color: #FFFFFF;
	font-size: 0.7em;
}
	#mainContent li {
		color: #000000;
		font-size: 1em;
	}
#header {
 background-color: #1E5588;
position: relative;
        text-align: center;	
	margin-top: 30px;
	width: 100%;
	height: 100%;
}
	#header h6 {
		font-size: 1em;
	}
	#header h6 a:link, #header h6 a:hover {
		font-size: 1em;
	}
	.navbar-fixed-top,
.navbar-fixed-bottom {
  position: fixed;
  right: 0;
  left: 0;
  margin-top:0px;
  z-index: 50;
	background-color: #FFFFF;
	width: 100%;
}
	.videocontainer {
		position: relative;
	margin-top:0px;
	
}

	#mobileHeader {
		position: fixed;
		top: 0px;
		z-index: 52;
		width: 90%;
	}
	#mobileHeader .img-responsive.main {
		
		height: 40px;
	
		z-index: 52;
		margin-top: 5px;
	}
	#mobileHeader .btn-success {
    margin-top: 10px;	
	
		z-index: 51;
		height: 30px;
		width: 80px;
		margin-left: 15px;
	
}
		#mobileHeader .img-responsive.icon1 {
		
		height: 30px;
		z-index: 52;
		
			float: right;
	margin-left: 10px;
	}
		#mobileHeader .img-responsive.icon2 {
		
		height: 30px;
		z-index: 52;
		
			margin-left: 10px;
			float: right;
	
	}
#mobileHeader .img-responsive.icon h2 {
		
	text-align: center
	}
	.videocontainer {
		z-index: -50;
	}
} 

.videocontainer {
		overflow: clip;
	padding: 0;
	margin: 0;
	}


.navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #F8F8F8;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #ffffff;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #ffffff;
    background-color: #F8F8F8;
  }
@media (max-width: 949px) {
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
		z-index: 60;
		
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 7.5px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .collapse.in{
        display:block !important;
    }
}
.first {
}
.responsive {
}
.banner {
    border-top: thin solid #007BC5;
}
.parallax {
    background-attachment: fixed;
    background-position: center 200;
    background-repeat: no-repeat;
    background-size: auto;
}

.enlarge {
}

@media (max-width:1200px){
    }
#carousel1 .item {
        height:460px;
    }
#carousel1 .carousel-caption {
    padding-bottom: 80px;
}

.which {
}
.navbar {
	margin:20 auto;
	background-color: #FFFFFF;	
	border: none;	
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #555;
  background-color: #1e5588;
}
.nav.navbar-nav li  {
    width: 25%;
   padding: 0px;
   
}
.navbar-default .navbar-nav {
  color: #FFFFFF;
	width: 100%;
	padding: 0px;
		border-bottom-style: solid;
	border-bottom-color: #1E5588;
	border-bottom-width: 2px;
}
.nav > li > a {
  position: relative;
  display: block;
  padding-top: 20px;
	text-align: center;
}

.nav > li > a {
   
    color: 000000;
    padding: 5px 5px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    width: 90%;
    margin-left: 0px;
    margin-right: 0px;
    border-radius: 5px;
    margin-bottom: 10px;
	margin-top: 10px;
	font-size: 1.2em;
}
.nav a:link, a:visited{  font-family: "poppins", sans-serif
;

font-weight: 800;
font-style: normal;
    color: #2E72E2;
	text-decoration: none;
	 /* new */
	-moz-transition: color .75s ease;
	-o-transition: color .75s ease;
	-webkit-transition: color .75s ease;
	transition: color .75s ease;
}
@keyframes blink {
  0%,
  22%,
  36%,
  75% {
    color: #ffe6ff;
    text-shadow: 0 0 0.6rem #ffe6ff, 0 0 1.5rem #2FA6EF,
      -0.2rem 0.1rem 1rem #2FA6EF, 0.2rem 0.1rem 1rem #2FA6EF,
      0 -0.5rem 2rem #0DECF2, 0 0.5rem 3rem #0DECF2;
  }
  28%,
  33% {
    color: #2FA6EF;
    text-shadow: none;
  }
  82%,
  97% {
    color: #0DECF2;
    text-shadow: none;
  }
}
.flicker {
  animation: shine 2s forwards, blink 3s 2s infinite;
}

.fast-flicker {
  animation: shine 2s forwards, blink 10s 1s infinite;
}

@keyframes shine {
  0% {
    color: #6b1839;
    text-shadow: none;
  }
  100% {
    color: #ffe6ff;
    text-shadow: 0 0 0.6rem #ffe6ff, 0 0 1.5rem #2FA6EF,
      -0.2rem 0.1rem 1rem #2FA6EF, 0.2rem 0.1rem 1rem #2FA6EF,
      0 -0.5rem 2rem #0DECF2, 0 0.5rem 3rem #0DECF2;
  }
}

@keyframes flicker {
  from {
    opacity: 1;
  }

  4% {
    opacity: 0.9;
  }

  6% {
    opacity: 0.85;
  }

  8% {
    opacity: 0.95;
  }

  10% {
    opacity: 0.9;
  }

  11% {
    opacity: 0.922;
  }

  12% {
    opacity: 0.9;
  }

  14% {
    opacity: 0.95;
  }

  16% {
    opacity: 0.98;
  }

  17% {
    opacity: 0.9;
  }

  19% {
    opacity: 0.93;
  }

  20% {
    opacity: 0.99;
  }

  24% {
    opacity: 1;
  }

  26% {
    opacity: 0.94;
  }

  28% {
    opacity: 0.98;
  }

  37% {
    opacity: 0.93;
  }

  38% {
    opacity: 0.5;
  }

  39% {
    opacity: 0.96;
  }

  42% {
    opacity: 1;
  }

  44% {
    opacity: 0.97;
  }

  46% {
    opacity: 0.94;
  }

  56% {
    opacity: 0.9;
  }

  58% {
    opacity: 0.9;
  }

  60% {
    opacity: 0.99;
  }

  68% {
    opacity: 1;
  }

  70% {
    opacity: 0.9;
  }

  72% {
    opacity: 0.95;
  }

  93% {
    opacity: 0.93;
  }

  95% {
    opacity: 0.95;
  }

  97% {
    opacity: 0.93;
  }

  to {
    opacity: 1;
  }
}