﻿/***** 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; } 
/***** END RESET *****/
::-moz-selection { background: #000;  color: #fff; text-shadow: none; } 
::selection { background: #000; color: #fff; text-shadow: none; }
/* Clearfix */
.cf { *zoom: 1; }
.cf:before, .cf:after { content: " "; display: table; } 
.cf:after { clear: both; } 

/*-------- BODY STYLES --------*/
body {

}

a:link, a:visited, a:active, a:hover { text-decoration: none; }
hr { border: #000 1px solid; }
div, span, iframe, h1, h2, h3, h4, h5, h6, p, a, img, i, ol, ul, li, form, label, :before, :after { box-sizing: border-box; }

/*--- HEADER STYLES ---------------------*/
header {  }

.timpte-header {
	position: relative; z-index: 1004; width: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, .15); 
	background: #fff; padding: 20px max(4%, calc(50% - 1200px)); 
	display: flex; justify-content: space-between; align-items: center; 
	row-gap: 12px; 
}
.header-logo { 
	position: relative; 
	display: flex; justify-content: center; align-items: center; 
}
.header-logo, .header-logo img { width: min(100%, 240px); }
.header-logo img { height: auto; object-fit: contain; object-position: center; }
.header-nav {
	position: relative; 
	display: flex; justify-content: flex-end; align-items: center; column-gap: 20px; 
}
.header-nav a {
	position: relative; padding: 20px 12px; 
	display: flex; justify-content: center; align-items: center; 
	font-family: 'raleway', sans-serif; font-size: 16px; font-weight: 500; text-align: center; 
	color: #000; 
	transition: .25s ease all; 
}
.header-nav a:hover { color: #e86a28; }

/* Site Colors: 
	
	Orange: #e86a28; 

	Light Gray: #ddd; 
*/
/*---BODY--------------------------------*/


/*-------- FOOTER STYLES ----------------*/
footer {  }

.timpte-footer {
	position: relative; width: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, .15); 
	display: flex; flex-direction: column; 
}
.foot-top {
	position: relative; width: 100%; background: #fff; padding: 24px 5%; 
	display: flex; justify-content: center; align-items: center; 
}
.foot-logo { 
	position: relative; 
	display: flex; justify-content: center; align-items: center; 
}
.foot-logo, .foot-logo img { width: min(100%, 250px); }
.foot-logo img { height: auto; object-fit: contain; object-position: center; }
.foot-bottom {
	position: relative; width: 100%; background: #ddd; padding: 12px max(3%, calc(50% - 1200px)); 
	display: flex; justify-content: space-between; align-items: center; 
}
.foot-nav {
	position: relative; 
	display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; column-gap: 24px; 
}
.foot-nav a {
	position: relative; padding: 4px 20px; 
	display: flex; justify-content: center; align-items: center; 
	font-family: 'raleway', sans-serif; font-size: 16px; font-weight: 500; text-align: center; 
	color: #000; 
	transition: .25s ease all; 
}
.foot-nav a:hover { color: #e86a28; }

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.inv-foot-spacer { width: 100%; height: 110px; background: #ddd; }

/*---------- RESPONSIVE STYLES ----------*/

@media only screen and (min-width: 1081px) {	/* MIND THE MIN-WIDTH */
	.inv-foot-spacer { height: 50px!important; }
}

@media only screen and (max-width: 1080px) {
	.foot-bottom, .foot-nav { justify-content: center; }
}

@media only screen and (max-width: 1000px) {
	.timpte-header { padding: 12px 20px; }
	.header-nav { column-gap: 0; }
}

@media only screen and (max-width: 800px) {
	.header-logo, .header-logo img { width: min(100%, 200px); }
	.header-nav a { font-size: 14px; padding-top: 16px; padding-bottom: 16px; min-height: 50px; }
	
	.foot-nav a { min-height: 42px; }
}

@media only screen and (max-width: 700px) {
	.inv-foot-spacer { height: 150px!important; }
}

@media only screen and (max-width: 650px) {
	.header-nav a { font-size: 13px; }
}

@media only screen and (max-width: 600px) {
	.timpte-header { padding: 8px 3vw; }
	.header-nav { flex-direction: column; align-items: flex-end; }
	.header-nav a { min-height: unset; padding-top: 8px; padding-bottom: 8px; }
}

@media only screen and (max-width: 450px) {
	.timpte-header { flex-direction: column-reverse; padding-top: 0; padding-bottom: 12px }
	.header-nav { width: 100%; flex-direction: row; flex-wrap: wrap; justify-content: space-around; align-items: center; }
}






