/* Global Styles */

html,
body {
padding:0; margin:0;
background: url(../images/bg.jpg) fixed top;
background-color:#145c6b;
}

.clr{clear:both;}

/* Preloader */
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background:rgba(255,255,255,0.8);
  /* change if the mask should have another color then white */
  z-index: 2000;
  /* makes sure it stays on top */
}

#status {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 50%;
  /* centers the loading animation horizontally one the screen */
  top: 50%;
  /* centers the loading animation vertically one the screen */
  background-image: url(../images/loader.gif);
  /* path to your loading animation */
  background-repeat: no-repeat;
  background-position: center;
  margin: -100px 0 0 -100px;
  /* is width and height divided by two */
}
/* Preloader end*/

.nogap{padding:0; margin:0;}

.img-portfolio {
    margin-bottom: 30px;
}

.img-hover:hover {
    opacity: 0.8;
}


header{position:relative; width:100%; padding:0;}

header .title{color:#ffffff; padding:10px 1% 10px 160px; background:url(../images/titlebg.png) no-repeat right top;}


header > div > img{padding:0; margin-left:100px;}


.navigation {
background-color: #e2c8a3;
padding: 3px 10px;
border-top: solid 2px #ffffff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#118a8e+0,3f4c6b+100 */
background: #118a8e; /* Old browsers */
background: -moz-linear-gradient(left, #118a8e 0%, #3f4c6b 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #118a8e 0%,#3f4c6b 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #118a8e 0%,#3f4c6b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#118a8e', endColorstr='#3f4c6b',GradientType=1 ); /* IE6-9 */
}


.navigation .ul{padding:0; margin:0; float:right; margin:0;}
.navigation .ul > li{list-style-type:none; display:inline-block; position:relative;}
.navigation .ul > li > a{padding:2px 20px 4px; text-transform:uppercase; font-family: 'Abel'; color:#ffffff; font-weight:bold; text-decoration:none; font-size:16px;}
.navigation .ul > li > a:hover{background:#16c9ef; color:#ffffff;}

.navigation .ul > li:hover .dropdown{display:block;  position:absolute; left:0; top:28px; z-index:1000; width:170px; background:#000; color:#ffffff;
-webkit-animation-name: example; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 0.4s; /* Safari 4.0 - 8.0 */
    animation-name: example;
    animation-duration: 0.4s;
}

.navigation > div > .togglebutton{display:none;}

.togglecontent{display:none;}

/* Home Page Carousel */
.banner{position:relative; margin-top:5px;}

.carousel {
    height: 90%;
}

.carousel .item,
.carousel .item.active,
.carousel .carousel-inner {
    height: 100%;
}

.carousel .fill {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
}

.carousel-control.left, .carousel-control.right {
    background-image: -webkit-linear-gradient(left,rgba(0,0,0,0) 0,rgba(0,0,0,0) 100%);
    background-image: -o-linear-gradient(left,rgba(0,0,0,0) 0,rgba(0,0,0,0) 100%);
    background-image: -webkit-gradient(linear,left top,right top,from(rgba(0,0,0,0)),to(rgba(0,0,0,0)));
    background-image: linear-gradient(to right,rgba(0,0,0,0) 0,rgba(0,0,0,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
    background-repeat: repeat-x;
}


.form-control::-moz-placeholder{color:#fff;opacity:1}
.form-control:-ms-input-placeholder{color:#fff}
.form-control::-webkit-input-placeholder{color:#fff}

.containerbg{background:#ffffff;}

.content{padding:2% 0 5%;}
.content > .heading{border-bottom: 60px solid; position:relative; width:35%;}
.content > div > h3{position:relative; padding-left:30px; font-size:35px; margin-top:10px; font-family: 'Abel'; color:#0689a5; text-transform: uppercase;}
.content > div > h3:after{content:""; position:absolute; width:100px; height:4px; background:#0689a5; bottom:-10px; left:30px; z-index:1000;}
.content > div > .details{text-align:justify; padding:2% 4%; font-size:16px; color:#000000;}

.content > div > .homeimg{display:block; width:84%; margin:0 auto 20px; padding:1% 1%; border:solid 3px #d1a63c;}
.content > div > .homeimg > img{border:solid 4px #d1a63c; margin:0 auto;}


.enquiry{
background: url('../images/feedbackbg.jpg') no-repeat fixed bottom;
background-color:#4a6063;
padding:4%; margin:80px 0 0;
}
.enquiry h1{position:relative; font-family: 'Abel'; font-size: 50px; color:#ffffff; text-align:center; margin-bottom:40px;}
.enquiry h1:after{content:""; position:absolute; width:100px; height:7px; background:#000000; bottom:-10px; left:0; right:0; margin:0 auto; z-index:1000;}
.enquiry > form{width:50%; margin:0 auto;}
.enquiry > form > .form-group > input, .enquiry > form > .form-group > textarea{background:rgba(255,255,255,0.7)!important;}
.enquiry > form > .form-group > input{height:50px;}

.btn-danger, .btn-danger:hover{background-color: #000000; border:0; padding:10px 40px;}



.form-control::-moz-placeholder{color:#6a6464; opacity:1}
.form-control:-ms-input-placeholder{color:#6a6464;}
.form-control::-webkit-input-placeholder{color:#6a6464;}

/*...............Gallery..................*/

.btn-read, .btn-read:hover {
        background: transparent;
        border-radius: 0;
        border: 1px solid #ffffff;
        color: #fff;
		margin-top:20px;
    }

.gallery-section{
border:0;
-webkit-box-shadow: 7px 10px 5px 0px rgba(0,0,0,0.22);
-moz-box-shadow: 7px 10px 5px 0px rgba(0,0,0,0.22);
box-shadow: 7px 10px 5px 0px rgba(0,0,0,0.22);
}	
	
.section-box-nine{
        height: 230px;
        background: #000;
        color: #fff;
        position: relative;
        overflow:hidden;
		margin-bottom:20px;
    }
	
	figure {
		display:none;
    }
	
	figure h3{
		color:#ffffff;
		font-size:16px;
    }
	
    .section-box-nine:hover figure {
		display:block;
        position: absolute;
        text-align: center;
        padding: 19px;
        width: 100%;
        height: 100%;
		z-index:2000;
    }
    .section-box-nine img, .section-box-nine iframe{
		width: 100%;
        height: 100%;
		object-fit:cover;
        position: absolute;
        transition: ease-in-out .5s;
        -webkit-transition: ease-in-out .5s;
        -moz-transition: ease-in-out .5s;
    }
    .section-box-nine:hover img, .section-box-nine:hover iframe{
        transform: scale(1.4);
        -webkit-transform: scale(1.4);
        -moz-transform: scale(1.4);
        opacity: 0.1;
    }
	
/*...............Gallery End..................*/



/* Footer Styles */
footer {
	background:#145c6b;
	color:#ffffff;
	text-align:right;
    padding: 6px 20px;
	font-weight:bold;
}

.gallery > div > p{position:relative; overflow:hidden; border: solid 2px #a2a2a2; text-align:center; padding:5px; margin-bottom:30px;}
.gallery > div > p:hover img {transform:scale(1.1); transition:ease-out all 0.3s;}
.gallery > div > p > span {position:relative; display:block; overflow:hidden; height:240px; text-align:center;}
.gallery > div > p > span > img {width:auto; height:260px; margin:auto;}

.gallery > div > p:hover .galleryoverlay {
	opacity: 1;
}
.galleryoverlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding-top:60px;
  height: 100%;
  width: 100%;
  color:#ffffff;
  opacity: 0;
  transition: .5s ease;
  background:rgba(0,0,0,0.8);
}

#next {
    background: none;
    color: #e91e63;
    font-weight: bold;
    border: solid 2px #e91e63;
    padding: 4px 13px;
    outline: none;
    margin: 0 auto;
    display: block;
}

footer > a, footer > a:hover {
	color:#ffffff;
}

/* Social Link Start */
.icon-bar {
  position: relative;
  text-align: right;
}

.icon-bar a {
  display: inline-block;
  text-align: center;
  padding: 5px 0 0;
  color: #000000;
  font-size: 25px;
  transition:ease all 0.5s;
}

.icon-bar a:hover {
	color: #000000;
    background-color: #d7ab3e;
}


.facebook, .twitter, .youtube {
  width:40px;
  height:40px;
  border-radius:50%;
  background: #ffffff;
  color: #043909;
  margin:10px 0 0;
}

/* Social Link End */


/* Responsive Styles */

@media (min-width: 990px){
.container {
    width: 990px;
}
}


@media(max-width:991px) {
    .customer-img,
    .img-related {
        margin-bottom: 30px;
	}

.title{background:url(../images/titlebgmobile.jpg);}

.title img{float:none;}
.title img:nth-child(2){margin-top:0;}

header{position:relative; z-index:1000; width:100%; padding:0;}
.navigation{position:relative; padding:4px 10px; background:none;}

.navigation .ul{display:none;}

.togglebutton{
display:block; color:#ffffff; width:35px; border-radius:4px; padding:5px; position:fixed; z-index:1000; right:10px; top:30px;
background:#003b4c;
}

.togglebutton > span{background-color:#ffffff; width:100%; padding:1px 0; margin:4px 0; display:block;}

.togglecontent{background-color: rgba(1, 2, 2, 0.77); display:none; position:absolute; width:210px; height: 100%; z-index:1000; top: 0px; right:0; padding:8px; margin:6px 0;
-webkit-animation-name: example; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 0.4s; /* Safari 4.0 - 8.0 */
    animation-name: example;
    animation-duration: 0.4s;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
    0%   {right:-100px;}
    100% {right:0px;}
}

/* Standard syntax */
@keyframes example {
    0%   {right:-100px;}
    100% {right:0px;}
}


.togglecontent > ul{padding:0; margin:10px 0 0;}

.togglecontent > ul > li{position:relative; list-style-type:none;}

.togglecontent > ul > li a{display:block; border-bottom:1px solid #ffffff; padding:5px; color:#ffffff; text-transform:uppercase; font-family: 'Abel';}

.togglecontent > ul > li a:hover{text-decoration:none; background-color:#145c6b; color:#ffffff;}

.togglecontent > ul > li a span{float:right;}

.togglecontent > ul > li > .submenudropdown{display:none; position:absolute; top:30px; left:0; z-index:100; width:100%; padding:2px 6px; background-color:#413434;}

.togglecontent > ul > li > .submenudropdown > ul{padding:0; margin:0;}

.togglecontent > ul > li > .submenudropdown > ul li{list-style-type:none;}

.togglecontent > span{width:30px; height:25px; color:#ffffff; position:absolute; right:0; top:-15px; z-index:1000; font-size:33px;}
	
	
.enquiry{display:none;}


.content > .heading h3, .contact_content > .heading h3 {font-size: 25px;}

.content > .heading, .contact_content > .heading {
    border-bottom: 50px solid;
    border-color: #0ca5eb;
    position: relative;
    color: #ffffff;
    border-right: 90px solid transparent;
    width: 85%;
}


.content > .details{text-align:justify; padding:2% 9% 2% 2%;}


}

@media(max-width:767px) {
    .img-portfolio {
        margin-bottom: 15px;
    }

    header.carousel .carousel {
        height: 70%;
    }
}

@media(max-width:767px) {
header .title{color:#ffffff; padding:10px 1% 10px 0;}
.carousel .item.active img{height:150px; width:100%;}
}


@media(max-width:480px) {
.togglecontent{display:none; position:absolute; width:210px; top: -10px; right:0; padding:8px; margin:6px 0;
-webkit-animation-name: example; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 0.4s; /* Safari 4.0 - 8.0 */
    animation-name: example;
    animation-duration: 0.4s;
}
}