/* ------------------------------------------------------------------
Project: Insee
Place here your custom CSS styles
------------------------------------------------------------------ */

/*COLORS*/
/*
Black #0c0c0c
*/

/*MISC*/
body 
.black_home .module, .black_home .module-small, .black_home .module-header {
	background:#0c0c0c;
	color:#fff;
}
.divider-w {
	border-top:none;
}

.scroll-up a {
    background: #000;
    color: #fff !important;
}
.module, .module-small, .module-header {
    padding: 80px 0 10px;
}

/*HEADER*/
#main_header {
	font-size: 28px;
    text-align: center;
    margin: 0;
    padding: 12px 30px;
	color:#fff;
}
#main_header span {
	font-size:20px;
	padding:0 0 0 12%;
}

/*SLIDER*/	
.hero-slider .slides .bg-dark {
    background: #0c0402;
}

/*SERVICES*/
.module.gray-bg.service-area {
	background-color:#0c0c0c;
	padding-top:10px;
}
.service-area .content-box {
    background: #202020 none repeat scroll 0 0;
	border:none;
}	
#services_row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
  flex-wrap: wrap;
}
#services_row .col-lg-3 {
    width: 23%;
    background: #202020;
    margin: 1%;
}
#services_row .col-lg-3 .content-box {
	margin:0;
}

/*PORTFOLIO*/
#portfolio .module-small {
	padding-bottom:30px;
}
#portfolio .portfolio-summary h6,
#portfolio .portfolio-summary p,
#portfolio .portfolio-summary ul li {
	font-size:18px;
	color:#000;
}
#portfolio .portfolio-video {
    padding: 30px 20% 0 20%;
}
/*custom layout*/
.portfolio-2-col-grid {
	list-style:none;
}
.portfolio-2-col-grid li {
	width:48%;	
	float:left;
}	
.portfolio-2-col-grid li img {
	padding:5%;
}

/*FOOTER*/
.footer-area {
	border-top:none;
}
.footer-area {
	background-color:unset;
}
.social-bookmark-wrapper a i {
	display:block;
	padding-top:10px;
}

.copy-right p,
.copy-right a, .copy-right a:hover {
	color: #0c0c0c;
}
.social-bookmark-wrapper a, 
.social-bookmark-wrapper a:hover {
	border-color: #0c0c0c;
}
.social-bookmark-wrapper a i {
    color: #0c0c0c;
	width:100%;
	height:100%;
}
.social-bookmark-wrapper a:hover,
.social-bookmark-wrapper a i:hover {
    color: #fff !important;
}

#home .footer-area {
	background-color:#202020;
}
#home .copy-right p,
#home .copy-right a, #home .copy-right a:hover {
	color:#fff !important;
}
#home .social-bookmark-wrapper a, 
#home .social-bookmark-wrapper a:hover {
	border-color: #fff;
}
#home .social-bookmark-wrapper a i,
#home .social-bookmark-wrapper a i:hover {
    color: #fff;
}

/*SMALL SCREENS*/
@media screen and (max-width: 1000px) {
	#services_row {
		width: 80%;
		margin: auto;
	}		#services_row .col-lg-3 {
		width: 40%;    
		margin: 2% 5%;
	}
	.service-area .content-box {
		padding:15px 15px 25px 15px;
	}}
@media screen and (max-width: 800px) {	.hero-slider #heroslider_slide_2 .slidebg.slide-zoom {
		background-position:left;
		margin-top: -20%;
		margin-left: -20%;
	}
	.hero-slider #heroslider_slide_3 .slidebg.slide-zoom {
		background-position:right;
	}	.hero-slider #heroslider_slide_2 .caption-content.right,
	.hero-slider #heroslider_slide_3 .caption-content.left {
		vertical-align: bottom !important;		
		padding: 0 0 100px 0;
	} 
	#portfolio .portfolio-video {
		padding: 20px 15% 0 15%;
	}	
}
@media screen and (max-width: 700px) {
	.breadcrum-area {    
		padding: 30px 10px;
	}
	.portfolio-summary ul {
		padding-left:20px;
		margin-bottom:0;
	}
	#portfolio .module-small {
		padding-bottom: 10px;
	}
	#services_row {
		width: 60%;
		margin: auto;
	}	
	#services_row .col-lg-3 {
		width: 100%;    
		margin: 2% 5%;
	}
	#portfolio .portfolio-video {
		padding: 0 20px;
	}
}
@media screen and (max-width: 600px) {
	.module, .module-small, .module-header {
		padding: 50px 0 10px;
	}	
	.portfolio-2-col-grid li {
		width:100%;	
		float:none;
	}	.portfolio-2-col-grid li img {
		padding:10px 15% 10px 5%;
	}
}	
@media screen and (max-width: 500px) {
	#main_header span {
		font-size: 18px;
		padding: 5px;
		display: block;
	}	#services_row {
		width: 100%;	
	}	
	.filter > li {
		margin:0 10px;
	}}