body{
	color: #000;
}
h1, h2, h3, h4, h5 {
    color: #000;
    margin-bottom: 0px;
}
section{
	margin: 0px;
	padding: 0px;
}
.np{
	padding-left: 0px;
	padding-right: 0px;
}
.mt1{
	margin-top: 10px;
}
.mt2{
	margin-top: 20px;
}
.mt3{
	margin-top: 30px;
}
.mt4{
	margin-top: 40px;
}
.mt5{
	margin-top: 50px;
}
.mb1{
	margin-bottom: 10px;
}
.mb2{
	margin-bottom: 20px;
}
.mb3{
	margin-bottom: 30px;
}
.mb4{
	margin-bottom: 40px;
}
.mb5{
	margin-bottom: 50px;
}
.pt1{
	padding-top: 10px;
}
.pt2{
	padding-top: 20px;
}
.pt3{
	padding-top: 30px;
}
.pt4{
	padding-top: 40px;
}
.pt5{
	padding-top: 50px;
}
.pt8{
	padding-top: 80px;
}
.pt10{
	padding-top: 100px;
}
.pb1{
	padding-bottom: 10px;
}
.pb2{
	padding-bottom: 20px;
}
.pb3{
	padding-bottom: 30px;
}
.pb4{
	padding-bottom: 40px;
}
.pb5{
	padding-bottom: 50px;
}
.pb8{
	padding-bottom: 80px;
}
.small-border{
	margin-bottom: 30px;
}
/* navigation styles
====================*/
header {
	height: auto;
	padding-top: 10px;
	padding-bottom: 10px;
}
header.transparent {
    background: rgba(255, 255, 255,0.9);
}
header.smaller{
	padding-top: 3px ;
	padding-bottom: 3px;
	height: auto;
	background-color: #fff;
}
#logo .logo{
	height: 100px;
}
header.smaller #logo .logo{
	height: 90px;
}
header #mainmenu{
	margin-bottom: 0px;
}
#mainmenu a{
	line-height: 50px;
	color: #888;
	letter-spacing: 1px;
}
#mainmenu li:hover a{
	color: #000;
}
#mainmenu li ul{
	left: unset;
	top: 110px;
	right: 0;
}
header.smaller #mainmenu li ul {
	top: 93px;
}
header.smaller #mainmenu li ul ul{
	top: 0;
}
#mainmenu li li a {
	background-color: #fff;
	color: #888;
}
#mainmenu ul li:hover > a{
	background-color: #000;
	color: #fff;
}
#mainmenu li ul ul li a {
	background-color: #fff;
}
#menu-btn{
	margin-top: 30px;
}

@media screen and (max-width: 992px){
	div#logo{
		margin-top: 0px;
	}
}


/* slider styles
================*/
#section-slider .btn-custom{
	background-color: #fff;
	color: #000;
}

/* about home
===================*/
#section-est.side-bg .background-image{
	background: url(../img/about.jpg);
}
.bg-color, section.bg-color{
	background-color: #999;
}
.btn-border:hover,
a.btn-border:hover{
	background-color: #fff;
	border-color:#fff;
	color: #000;
}

.brands .carousel-item img{
	/*border: 1px solid #616161;*/
	border-radius: 10px;
	max-height:100px;
}

#mhabt .btn-default{
	border:1px solid #000;
	border-radius: 0px;
	padding: 10px 20px;
	transition: all 0.3s ease-in; 
}
#mhabt .btn-default:hover{
	background-color: #000;
	color: #fff;
}
#mhabt h3{
	position: relative;
}
#mhabt h3:after{
	display: block;
	content: '';
	position: absolute;
	bottom: 0px;
	left: 0px;
	background-color: #000;
	width: 120px;
	height: 2px;
}
.news{
	border: 5px solid #000;
	border-radius: 20px;
}
.news h4{
	background-color: #000;
	color: #fff;
	margin-bottom: 0px;
	margin-top: 0px;
	padding: 10px 20px;
}
.news .marquee{
	padding: 20px;
	max-height: 300px;
	overflow: hidden;
}

/* solution home
===================*/
.solution{
	position: relative;
	width: 100%;
	overflow: hidden;
	
}
.solution img{
	transition: all 0.3s ease-in;
}
.solution:hover img{
	transform: scale(1.1);
}
.cont{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.cont:hover{
	background-color: rgba(0,0,0,0.5);
}
.cont h4{
	position: absolute;
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
	transition: all 0.3s ease-in;
	font-size: 20px;
	text-align: center;
}
.cont:hover h4{
	bottom: 50%;
	transform: translate(-50%, 50%);
}
.box{
	position: relative;
	display: block;
	cursor: pointer;
	padding-bottom: 70px;
	border: 1px solid #000;
}
.details{
	position: absolute;
	top: 0;
	left:0;
	width: 100%;
	height: 100%;
	
}
.box:hover .details{
	background-color: rgba(0,0,0,0.75);
}
.details h3{
	text-align: center;
	color: #000;
	bottom: 10px;
	position: absolute;
	left: 50%;
	transform: translate(-50%,0%);
	font-size: 20px;
	line-height: 25px;
	transition: all 0.3s ease-in;
	margin-bottom: 0px;
}
.box:hover .details h3{
	transform: translate(-50%,50%);
	bottom:50%;
	color: #fff;
}

/* project home
====================*/
.small-border{
	background-color: #000;
}
#hprj .box {
	padding-bottom: 0;
	margin: 0px;
	border: 0;
}
#hprj .box .details h3{
	background-color: rgba(0,0,0,0.4);
	width: 100%;
	bottom: 0;
	padding: 5px 10px;
	color: #fff;
	font-size: 16px;
	letter-spacing: 1px;
	line-height: 22px;
}
#hprj .box:hover .details h3{
	bottom: 50%;
	background-color: transparent;
}
#hprj .btn{
	border: 1px solid #000;
	color: #000;
	border-radius: 0px;
	padding: 10px 30px;
}
#hprj .btn:hover{
	background-color: #000;
	color: #fff;
}

/* brand home
===============*/

/* testimonial home
====================*/

.testimonial-list span{
	color: #000;
}


/* footer style
====================*/
footer{
	padding-top: 20px;
	padding-bottom: 20px;
	text-align: left;
}
footer p{
	margin-bottom: 0px;
}

.msm{
	float: right;
}
.msm a{
	display: block;
	float: left;
	padding: 3px;
	width: 30px;
	height: 30px;
	text-align: center;
	margin-left: 5px;
}
.msm a:hover{
	background-color: #fff;
	color: #000;
	border-radius: 50%;

}
.msm a i{
	font-size: 20px;
}
.social-icons{
	vertical-align: bottom;
}

.social-icons a{
	display: block;
	float: left;
}
.social-icons i{
	width: 28px;
	height: 28px;
	display: block;
	/*line-height: 44px;*/
	
}
.social-icons i:before{
	/*width: 28px;
	height: 28px;
	display: block;
	line-height: 28px;*/
}

.social-icons i:hover{
	color: #000;
	border-radius: 50%;
}

#back-to-top{
	background-color: #000;
}
#back-to-top:hover:before{
	color: #fff;
}

/* about us page
===================*/
#content{
	background: transparent;
}
section{
	background: transparent;
}
.heading{
	background: url(../img/heading.jpg) center center;
	background-size: cover;
	margin-top: 120px;
	position: relative;
	padding-top: 100px;
	padding-bottom: 100px;
}
.heading h1{
	color: #fff;
	position: relative;
	z-index: 2;
	font-size: 40px;
}
.mover{
	position: absolute;
	background-color: rgba(0,0,0,0.5);
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
}

/* lighting solutions
====================*/
#sol .box {
	padding-bottom: 0;
}
#sol .box .details{
	text-align: center;
}
#sol .box:hover .details{
	background-color: rgba(0,0,0,0.5);
}
#sol .box .details i{
	opacity: 0;
	font-size: 30px;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
}
#sol .box:hover .details i{
	background-color: transparent;
	opacity: 1;
}
#sol .panel-heading{
	background: transparent !important;
	border:1px solid #efefef !important;
	border-bottom: 3px solid #222 !important;
}
#sol .panel-heading a{
	display: block;
	position: relative;
}
#sol .panel-heading a:hover,
#sol .panel-heading a:focus{
	color: #222;
	text-decoration: none;
}
#sol .panel-heading a i{
	position: absolute;
	right: 0;
}
#sol .panel-body {
	background: transparent;
	border: 0 !important;
}
@media screen and (min-width: 768px){
	#sol .modal{
		overflow: hidden;
	}
	#sol .modal-content{
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%,-50%);
		width: auto;
	}
	#sol .modal-header {
		border-bottom: none;
	    padding: 0px;
	    position: absolute;
	    right: -13px;
	    top: -12px;
	    background-color: #000;
	    z-index: 99;
	    width: 30px;
	    text-align: center;
	    border-radius: 25%;
	}
	#sol .modal-header button{
		font-size: 30px;
	    color: #fff;
	    opacity: 1;
	    float: none;
	    margin-top: 0px;
	    vertical-align: bottom;
	}
	#sol .modal-body{
		padding: 5px;
	}
	#sol .modal-body img{
		max-height: 500px;
	}
}
/* automation page
======================*/
#sol ul{
	list-style: none;
	padding-left: 0;
}
#sol li{
	padding-left: 20px;
	position: relative;
}
#sol li i{
	position: absolute;
	left: 0;
	top: 0;
	line-height: 28px;
}

/* project page
====================*/
#prj .box {
	padding-bottom: 0;
	margin: 0px;
	border: 0;
	border: 1px solid #aaa;
}
#prj .box .details h3{
	background-color: rgba(0,0,0,0.4);
	width: 100%;
	bottom: 0;
	padding: 5px 10px;
	color: #fff;
	font-size: 14px;
	letter-spacing: 1px;
	line-height: 22px;
	
}
#prj .box:hover .details h3{
	bottom: 50%;
	background-color: transparent;
}

/* contact page
=================*/
#contact .form-control{
	border-radius: 0px;
	box-shadow: none;
}
#contact .btn{
	padding: 10px 30px;
	border-radius: 0;
	background-color: transparent;
	border:1px solid #000;
	transition: all 0.3s ease-in;
}
#contact .btn:hover{
	background-color: #000;
	color: #fff;
}

.address{
  padding: 0 30px;
}
.address div.cnt{
  margin-bottom: 30px;
  display: table;
  /*padding-bottom: 20px;*/
  width: 100%;
}
.very-big-white{
    line-height:80px;
}

.address .cnt >div{
  display: table-cell;
  vertical-align: middle;
  margin-right: 30px;
  width: 70px;
  text-align: center;
}
.address .cnt > div i{
  font-size: 30px;
  
}
.address .cnt p{
  display: table-cell;
  vertical-align: middle;
  font-size: 18px;
}
#about-pg{
	padding: 60px 0px 10px;
}
#contact{
	padding: 60px 0px 40px;
}
.cara-item-custom img{
    
    height:100px !important;
}
.tp-caption {
    z-index: 1;
    font-size: 30px !important;
}
.very-big-white{
    font-size:72px !important;
}
#section-slider .btn-custom{
    top:90px !important;
}
@media screen and (max-width: 600px){
	.heading {
	    padding-top: 40px;
	    padding-bottom: 40px;
	}
	.heading h1 {
	    font-size: 28px;
	}
	#sol{
		padding-top: 10px;
	}
}@media screen and (max-width:600px){
    .owl-controls{
        display:none !important;
    }
    .brands .carousel-item img{
	/*border: 1px solid #616161;*/
	border-radius: 10px;
	max-height:none !important;
}.very-big-white {
    font-size: 36px !important;
    margin-bottom: 30px !important;
    top: -20px !important;
}.carousel-item img{
    height:auto !important;
}
}