/* 
===========================================================================================
==================================== Global CSS ===========================================
===========================================================================================
*/


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


#about .section-title {
	width: auto;
	text-align: left;
}

#about .section-title h2 {
	line-height: 1.3;
	color:#3F515C;
}

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

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


#whyAbout .list-item,
#whyAbout .img-list-item  {
	width: calc(100%/3 - 3em);
	height:auto;
	flex-direction: column;
	margin:1.5rem;
	border-width: 0;
	box-sizing: border-box;
}

#whyAbout .list-item .list-heading h3,
#whyAbout .img-list-item .list-heading h3 {
	margin:0 0 0 1em;
}

/* 
===========================================================================================
================================ Services Page CSS ========================================
===========================================================================================
*/

#residentialCover .background,
#services .card:nth-child(1) figure { 
    background-image: url('../img/overlays/residential.jpg');
}

#commercialCover .background,
#services .card:nth-child(2) figure { 
    background-image: url('../img/overlays/commercial.jpg');
}

#lightingCover .background,
#services .card:nth-child(3) figure { 
    background-image: url('../img/overlays/lighting.jpg');
}

#panelCover .background,
#services .card:nth-child(4) figure { 
    background-image: url('../img/overlays/panels.png');
}

#surgeCover .background,
#services .card:nth-child(5) figure { 
    background-image: url('../img/overlays/surge.jpg');
}

#repairCover .background,
#services .card:nth-child(6) figure { 
    background-image: url('../img/overlays/troubleshooting.jpg');
}


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

@media all and (min-width: 1022px) and (max-width: 1199px) {

    #about .section-inner .section-body .why {
        padding:3.125em 2em;
    }

}

@media all and (min-width: 766px) and (max-width: 1022px) {

	#whyAbout .section-body {
		padding:0;
	}

}

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

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

}