/*
===========================================================================================
================================ Cover CSS ================================================
===========================================================================================
*/

#cover {
	z-index:1;
}

/* 
===========================================================================================
============================== Callout Section CSS ========================================
===========================================================================================
*/

#callout {
	display: none;
}

#callout .card:nth-child(1) a {
    background-image: url('../img/overlays/residential.jpg');
}

#callout .card:nth-child(2) a {
	background-image: url('../img/overlays/commercial.jpg');
}

#callout .card:nth-child(3) a {
	background-image: url('../img/overlays/lighting.jpg');
}

#callout .card:nth-child(4) a {
	background-image: url('../img/overlays/panel.jpg');
}

#callout .card:nth-child(5) a {
	background-image: url('../img/overlays/surge.jpg');
}

#callout .card:nth-child(6) a {
	background-image: url('../img/overlays/troubleshooting.jpg');
}



/* 
===========================================================================================
================================= About CSS ===============================================
===========================================================================================
*/

#aboutHome .section-body {
	display: block;
}

#aboutHome .image-layer {
	margin:0 0 0 2rem;
}

#aboutHome .image-layer figure {
	background-image: url('../img/overlays/kitchen.jpg');
}


#aboutHome ul li {
	width:calc(100% - 2rem);
	margin:0 auto;
}


#whyChoose .list-item, 
#whyChoose .img-list-item {
	width: calc(100%/3 - 3em);
}

/* 
===========================================================================================
================================= Works CSS ===============================================
===========================================================================================
*/

#worksHome {
	color:white;
	background-color:#2e383e;
}

#worksHome .section-inner .section-title h2 {
	color:white;
}

#worksHome .section-inner .section-body .img-list-item:first-child figure {
	background-image: url('../img/gallery/residential/5805\ Hillcroft\ St\ _\ 0011.jpg');
}

#worksHome .section-inner .section-body .img-list-item:nth-child(2) figure {
	background-image: url('../img/gallery/residential/residential_0001.jpg');
}

#worksHome .section-inner .section-body .img-list-item:nth-child(3) figure {
	background-image: url('../img/gallery/residential/residential_0005.jpg');
}

#worksHome .section-inner .section-body .img-list-item:nth-child(4) figure {
	background-image: url('../img/gallery/commercial/Jovie\ Salon_0010.jpg');
}

#worksHome .section-inner .section-body .img-list-item:nth-child(5) figure {
	background-image: url('../img/gallery/commercial/Jovie\ Salon_0014.jpg');
}

#worksHome .section-inner .section-body .img-list-item:nth-child(6) figure {
	background-image: url('../img/overlays/panel.jpg');
}

#worksHome .quick-links {
	margin:2.5em auto 0;
}

/* 
===========================================================================================
=================================== FAQ CSS ===============================================
===========================================================================================
*/

#faqHome {
	display: none;
}

.faq {
	width: 100%;
	height: auto;
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	box-sizing: border-box;
}

.faq .list-item {
	padding:1.5em;
}

.faq .question-heading {
	margin:0;
}

/*
====================================================================================================
=====================================                ===============================================
=====================================  Media Queries ===============================================
=====================================                ===============================================
====================================================================================================
*/

@media all and (min-width: 765px) and (max-width: 1022px) {
/* 
===========================================================================================
================================= About CSS ===============================================
===========================================================================================
*/

	#aboutHome .section-inner {
		align-items:center;
	}

	#aboutHome .section-inner .section-title {
		width:100%;
		flex:1 1 60%;
	}

	#aboutHome .section-body {
		width:100%;
	}

	#aboutHome .quick-links {
		margin:0 auto;
	}


/* 
===========================================================================================
================================ Why US CSS ===============================================
===========================================================================================
*/

	#whyChoose .section-body {
		justify-content: center;
		align-items: flex-start;
	}

	#whyChoose .list-item, 
	#whyChoose .img-list-item {
		margin:0 1rem;
	}


  
}

@media all and (max-width: 764px) {


/* 
===========================================================================================
================================= About CSS ===============================================
===========================================================================================
*/

	#aboutHome .list-item {
		margin:1.5em 0;
	}

	#aboutHome .section-inner .section-title {
		width:100%;
	}

	#aboutHome .section-body {
		width:100%;
		margin:2em auto 0;
	}

	#aboutHome .quick-links {
		margin:0 auto;
	}


	#aboutHome .image-layer {
		margin:0 0 1rem;
	}

	#whyChoose .list-item, 
	#whyChoose .img-list-item {
		width: 100%;
		margin:1rem;
	}


}