﻿/***** BEGIN RESET *****/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;	
}

ol, ul {
	list-style: none;
}

table{border-collapse:collapse; width:100%;}
td{vertical-align:top;}

/* Make HTML 5 elements display block-level for consistent styling */  
header, nav, article, footer, address {  
    display: block;  
} 

/*-------- COLORS --------

*/

/***** END RESET *****/
::-moz-selection {
    background: #000; 
    color: #fff;
    text-shadow: none;
}
::selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}


/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

/*-------- BODY STYLES --------*/

body {

}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

img { max-width: 100%; }

/*--- HEADER STYLES ---------------------*/
header {}

.header {
	display: flex;
	justify-content: space-between;
	padding: 20px;
	background-color: #404041; /* DARK GRAY */
}

.header-logo-div { width: 15%; }

.nearest-location {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 280px;
	background-color: #fff;
	font-family: 'Montserrat', sans-serif;
	font-size: 14px;
	line-height: 16px;
	clip-path: polygon(20% 0, 100% 0%, 100% 100%, 0% 100%);
	padding: 16px;
	margin: -20px;
}
.nearest-location a { color: #4F4F4F; font-weight: 600; letter-spacing: 1px; }
.nearest-location a:first-of-type i { color: #ce202f; /* RED */ font-size: 30px; padding: 0 25px 0 25px; }
.nearest-location a:last-of-type i { 
	color: #ce202f; /* RED */ 
	font-size: 24px; 
	padding: 0 0 0 4px; 
	position: absolute;
	top: 16px;
}
.nearest-location span.loc-light { color: #4F4F4F; font-weight: 200; font-style: italic; line-height: 2; }
.powersystemsistateinventorycomhdev-a0om98.MuiPaginationItem-previousNext { background-color:#4F4F4F;}
.list-top-section .list-listings-count {color:#1E638C!important;}
/*---BODY--------------------------------*/




/*--------FORM STYLES--------------------*/




/*-------- FOOTER STYLES ----------------*/
footer{}

.footer {
	background-color: #404041; /* DARK GRAY */
}

.footer-top {
	display: flex;
	justify-content: space-between;
	padding: 50px 5%;
}
.footer-top .footer-logo-div { width: 25%; padding: 10px 20px 0 0;}
.footer-top .footer-loc-div {
	font-family: 'Montserrat', sans-serif;
	font-size: 16px;
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	justify-content: left;
}
.footer-top .footer-loc-div .states-mobile { display:none; }
.footer-top .footer-loc-div h6.footer-loc-h6 {
	font-size: 36px;
	font-weight: 800;
	text-transform: uppercase;
	color: #939597; /* LIGHT GRAY */
}
.footer-top .footer-loc-div a {
	color: #fff;
	font-size: 20px;
	line-height: 35px;
}
.footer-top .footer-loc-div a:hover { color: #ce202f; /* RED */ }
.footer-top .footer-loc-div p {
	display: inline; 
	padding: 0 16px;
	color: #FFF; /* RED */
}
.footer-top > hr.footer-hr { border: #fff; background-color: #fff; width: 1px; height: 180px; margin:0; }
.footer-top .footer-social-div {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	font-family: 'Montserrat', sans-serif;
	padding: 0 20px 0 0;
}
.footer-top .footer-social-div p { font-size: 20px; color: #fff; letter-spacing: 1px; }
.footer-top .footer-social-div a.link-m-page-a { 
	font-family: 'Montserrat', sans-serif; 
	color: #fff; 
	font-size: 20px; 
	letter-spacing: 1px; 
}
.footer-top .footer-social-div a.link-m-page-a:hover { color: #ce202f; }
.footer-top .footer-social-div a.social i.f-spacer { padding: 0 3px; }
.footer-top .footer-social-div a.social { 
	background-color: #fff;
	color: #ce202f; /* RED */
	border-radius: 50%;
	padding: 12px 13.5px;
	margin: 0 6px;
}
.footer-top .footer-social-div a.social:hover { background-color: #ce202f; color: #fff; }
.footer-top .footer-social-div a.credapp-link { 
	background-color: #939597; /* LIGHT GRAY (CORRECT) */ 
	color: #fff; 
	font-size: 12px;
	font-weight: 600;
	padding: 10px; 
}
.footer-top .footer-social-div a.credapp-link:hover { background-color: #fff; color: #404041; /* DARK GRAY */ }
.footer-top .footer-social-div a.credapp-link > i { color: #ce202f; }
.footer-bottom {
	display: flex;
	justify-content: space-between;
	background-color: #4e4e50; /* MED GRAY (CORRECT) */
	padding: 20px 5%;
	border-top: 1px #939597 solid;
	font-family: 'Montserrat', sans-serif;
	text-align: center;
}
.footer-bottom a { color: #fff; }
.footer-bottom a:hover { color: #ce202f; }
.footer-bottom p { color: #fff; }
.footer-bottom p:last-of-type { color: #fff; }

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/







/*---------- RESPONSIVE STYLES ----------*/

@media only screen and (max-width: 1100px) {
	.header-nav-div { 
		order: 1; 
		position: absolute;
		left: 0; 
	}
	.header-logo-div { 
		order: 2; 
		width: 30%;
		padding: 10px 0;
	}
	.nearest-location { display: none; }
	.header {
		padding: unset;
		height: 80px;
		width: 100%;
		align-items: center;
		justify-content: center;
	}
	
	.footer-top { padding: 20px 1%; }
	.footer-top .footer-loc-div a { font-size: 18px; }
	.footer-top .footer-social-div { justify-content: space-around; }
	.footer-bottom { flex-wrap: wrap; line-height: 2; justify-content: center; }
	.footer-bottom a { text-align: center; }
	.footer-bottom p { padding: 0 10px; text-align: center; }
}

@media only screen and (max-width: 850px) {
	.footer-top .footer-loc-div a { font-size: 16px; }
}

@media only screen and (max-width: 800px) {
	.footer-top {
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.footer-top .footer-logo-div { width: 50%; padding: 0 0 20px 0; }
	.footer-top > hr.footer-hr { display: none; }
	.footer-top .footer-loc-div { flex-direction: column; }
	.footer-top .footer-loc-div .states-desktop { display: none; }
	.footer-top .footer-loc-div .states-mobile { display:flex; justify-content: center; padding: 0 0 20px 0; }
	.footer-top .footer-loc-div .states-mobile .state-col1 {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 0 40px 0 0;
	}
	.footer-top .footer-loc-div .states-mobile .state-col2 {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 0 0 0 40px;
	}
	.footer-top .footer-social-div {
		flex-direction: column;
		padding: 0;
	}
	.footer-top .footer-social-div div { 
		padding: 25px;
	}
	.footer-top .footer-social-div a.link-m-page-a { margin: 0 0 20px 0; }
	.footer-bottom { 
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.footer-bottom p { display: none; }
	.footer-bottom p:last-of-type { display: flex; align-items: center; }
}

@media only screen and (max-width: 700px) {
	.header-logo-div { width: 40%; } 
}

@media only screen and (max-width: 500px) {
	.header { height: 60px; }
	
	.footer-top .footer-loc-div h6.footer-loc-h6 { font-size: 30px; padding: 20px 0 0 0; }
	.footer-top .footer-logo-div { width: 80%; }
	.footer-top .footer-loc-div a { font-size: 14px; }
}





