@charset UTF-8;

body {
background-color:#FFF;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
border:1px;
color:#4F5155;
}

#wrapper {
background-color:#FFF;
max-width:980px;
margin-right:auto;
margin-left:auto;
margin-top:0;
padding-left:10px;
padding-right:10px;
}

/*
	TABLES - PARTS
*/

.parts_list {
	width: 75%;
}

.parts_list thead{
	background: #808080;
	font-weight: bold;
	color: white;
	vertical-align: center;
}

.table_title {
	font-weight: bold;
	text-align: right;
	padding: 3px;
}

.part_inventory {
	width: 400px;
}

.part_inventory thead{
	background: #808080;
	font-weight: bold;
	color: white;
}

/*
	
*/

.sidebar {
width:220px;
height:450px;
float:right;
clear:right;
margin:0 0 20px 5px;
padding:5px;
}

.sidebar_button {
height:40px;
color:#FFF;
font-size:22px;
text-align:center;
background:gray;
margin:10px 0;
padding:10px 0;
}

li {
margin:0 0 8px;
}

td {
vertical-align:top;
padding:0 0 5px;
}

.side_pic {
	border-radius: 5px;
	width: 100%;
}

.caption {
color:gray;
font-style:italic;
/*width:450px;*/
text-align:center;
}

.pic_w_caption {
float:right;
clear:right;
margin-bottom:5px;
}

#header {
padding:15px 20px 12px;
}

.phone {
color:red;
font-size:30px;
font-weight:700;
padding-top:8px;
}

.headlink a {
color:#000;
font-style:normal;
}

.contact {
float:right;
color:#000;
}

a {
color:#039;
background-color:transparent;
font-weight:400;
text-decoration:none;
}

p a:hover {
	background-color: yellow;
	font-weight: bold;
}

p a:link {
	font-weight: bold;
}

p a:visited {
	font-weight: bold;
}

<td> a:hover {
	background-color: yellow;
	font-weight: bold;
}

<td> a:link {
	font-weight: bold;
}

<td> a:visited {
	font-weight: bold;
}

#social {
float:right;
clear:right;
padding:6px 3px 0 10px;
}

#social img {
margin-left:5px;
}

#truckCount {
	padding: 4px 2px 5px 0px ;
	font-size: 16px;
	color: grey;
	font-weight: bold;
	text-align: left;
}

.test {
	background: yellow;
	text-align: center;
}

#footer {
border-top:1px solid #999;
height:60px;
clear:both;
margin:15px 0 0;
padding:5px 10px 10px;
}

#footer p {
text-align:center;
font-size:12px;
}

/*#front-nav {*/
/*float:right;*/
/*width:260px;*/
/*height:300px;*/
/*}*/

.front-button {
background:gray;
height:60px;
width:100%;
border-radius: 5px;
font-size:28px;
color:#FFF;
float:right;
margin:0 0 6px;
padding:10px 0 0 5px;
}

.video-button {
	background: black;
	width: 100%;
	font-size: 18px;
	text-align: center;
	color: #FFF;
	border: none; /* Remove default button border */
	border-radius: 5px; /* Optional: add rounded corners */
	cursor: pointer; /* Add pointer cursor on hover */
	transition: background 0.3s ease; /* Smooth transition for background change */
}

.video-button:hover {
	background: darkgray; /* Change background color on hover */
	color: #000; /* Change text color on hover */
}


.socialbox {
	/*width:260px;*/
	/*float:left;*/
	margin:0 0 6px;
	padding:10px 0 0 0px;
	text-align: center;
}

.socialboxCU {
	width:260px;
	float:left;
	padding:10px 0px 0px 0px;
}

.socialbox img {
	padding: 10px 10px 0 10px;
	margin: auto;
	float: center;
}

.front-box {
width:452px;
height:300px;
float:right;
background-image:url(../images/Gradient.png);
background-repeat:repeat-x;
margin:10px 10px 10px 5px;
padding:10px;
}

.learn-box {
font-size:20px;
font-weight:700;
text-align:right;
}

/*#intro {*/
/*width:700px;*/
/*}*/

.loc_pic {
background:#FFF;
width:200px;
height:120px;
padding:0 15px 20px 0;
}

.inventory-headline a {
color:#000;
font-size:18px;
font-weight:700;
padding:0 0 0 5px;
}

.inventory-headline:hover a {
color:blue;
}

.inventory-list {
	margin-bottom: 15px;
	padding: 10px;
}


.inventory-list td {
padding:5px 0;
}

.inventory-detail {
margin:10px 0 5px;
padding:0 0 0 5px;
}

.inventory-date {
font-size:14px;
color:gray;
margin:10px 0 0;
padding:0 0 0 5px;
}

#featured {
background:#FFC;
}

#inventory_table {
width:75%;
}

.sold {
color:red;
}

#main_picture {
width:600px;
height:360px;
background:#FFFFFF;
border:2px;
margin:5px;
}

.thumb {
width:167px;
float:right;
margin:2px;
}

#gallery {
width:350px;
height:360px px;
float:right;
margin:5px 15px 5px 5px;
}

.inv-catch, .inv-back {
	width: 100%;
	font-size: 14px;
	text-align: center;
	color: #FFF;
	border: none;
	border-radius: 5px;
	cursor: pointer;
	transition: background 0.3s ease;
}

.inv-back {
	background: gray;
}

.inv-catch {
	background: green;
}

.catcher-inv {
width:350px;
float:right;
clear:right;
margin:-15px 15px 0 5px;
}

.inventory_detail_left {
font-weight:700;
text-align: left;
margin-bottom: 5px;
}

.section_head {
	background: gray;
	color: #FFF;
	height: 30px;
	font-size: 24px;
	font-weight: 700;
	margin: 0 0 5px;
	padding: 5px;
	border-radius: 5px;
	display: flex;
	align-items: center;
}

.inventory_box {
width:300px;
float:left;
margin:5px;
padding:6px;
}

.back {
width:350px;
text-align:center;
margin:0;
padding:0;
}

.inv_desc_box {
width:580px;
margin:5px;
padding:5px;
}

.buildtile {
	position: absolute;
	z-index: 1;
	color: #FFF;
	font-size: 22px;
	font-weight: 700;
	text-align: left;
	bottom: 10px;
	left: 10px;
}

.buildimage {
	border:none;
	border-radius: 5px;
	width:100%;
	height:auto;
}

a.buildtile-container {
	position: relative;
	display: block;
}

#gal_total {
float:right;
height:200px;
width:200px;
background:#000;
color:#FFF;
text-align:center;
padding:20px;
}

#hof_gallery {
width:350px;
height:350px;
float:right;
background:#FF0;
margin:0 15px 5px 5px;
}

#hof_words {
width:550px;
padding:5px;
}

#hof_picture {
width:600px;
height:360px;
background:#03F;
}

#hof_next {
width:350px;
float:right;
}

.hof_next_title {
float:right;
width:190px;
font-size:20px;
}

.hof_next_box {
background:#FFF;
width:320px;
height:80px;
color:#000;
margin:0 5px 5px;
padding:0 5px 5px;
}

.hof_thumb {
background:#000;
height:80px;
width:118px;
}

#hof_main_gallery {
width:600px;
height:80px;
margin:5px 0 0;
padding:4px;
}

.hof_main_thumbs {
height:72px;
width:115px;
background:#FF0;
float:left;
margin:2px;
}

#hof_catcher {
height:30px;
width:580px;
background:#FFF;
color:#FFF;
text-align:center;
padding:10px 0 5px;
}

.prod_tile {
	color: #FFF;
	height: 300px;
	width: 100%;
	margin: 5px 0;
	padding: 0 5px 5px 10px;
	position: relative;
}

.prod_desc {
	width: calc(100% - 20px);
	color: #FFF;
	position: absolute;
	z-index: 1;
	bottom: 10px;
	left: 10px;
}

.prod_title {
	position: absolute;
	z-index: 1;
	top: 10px;
	left: 10px;
}

.prod_tile img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	border-radius: 5px;
}

.learn {
width:100%;
background:#FF6;
font-style:italic;
border:solid 1px #F90;
padding:10px;
border-radius: 5px;
}

.section-header {
background:#000;
color:#FFF;
font-weight:700;
text-align:center;
padding:10px;
border-radius: 5px;
}

.catcher-quote {
background:green;
color:#FFF;
font-size:22px;
text-align:center;
width:220px;
height:40px;
float:right;
margin:10px 5px 0 8px;
padding:10px 0;
}

.catcher-inventory {
background:blue;
color:#FFF;
font-size:22px;
text-align:center;
width:195px;
height:30px;
float:right;
margin:0 8px 5px;
padding:5px;
}

.catcher {
width:450px;
float:right;
clear:right;
}

.jobs-container {
width:750px;
}

.support_box {
/*width:350px;*/
min-height:500px;
background:#E6E6E6;
border-radius: 5px;
/*float:left;*/
margin:0 8px 20px 0;
padding:6px;
}

#service_top {
background:#E6E6E6;
border-radius:5px;
}

.service_info {
color:#000;
padding:5px;
}

.service_txt {
width: 750px;
}

#slides {
position:relative;
width:420px;
height:280px;
}

#slides > div {
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
}

#surplus_next {
width:350px;
height:500px;
float:right;
}

#other_news {
width:300px;
height:400px;
float:right;
}

#news_bottom {
color:gray;
font-size:12px;
margin:10px 0;
}

.news_sidebar {
width:220px;
height:800px;
float:right;
clear:right;
margin:0 0 20px 5px;
padding:5px;
}

.news_pic {
padding:5px;
}

#form_errors {
color:red;
font-style:italic;
}

.admin-pics {
width:300px;
float:left;
margin:5px;
padding:5px;
}

.admin-pic-upload {
float:left;
clear:all;
background:#FF0;
width:98%;
margin:0 0 20px;
padding:20px 30px;
border-radius: 15px;
}

p a:hover,<td> a:hover {
background-color:#FF0;
font-weight:700;
}

p a:link,p a:visited,<td> a:link,<td> a:visited {
font-weight:700;
}

.buildbutton image,.prod_tile image {
position:absolute;
z-index:0;
}

#news_article,#news_list {
width:650px;
}

.thumbnail-list {
	overflow-y: auto;
	max-height: 370px;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.thumbnail-img {
	cursor: pointer;
	margin: 2px;
	opacity: 0.6;
	width: 125px;
	height: 80px;
	object-fit: cover;
}
.thumbnail-img.active {
	opacity: 1;
}
.carousel-inner {
	height: 370px;
}
.carousel-inner img {
	height: 100%;
	object-fit: cover;
}

.angle-up, .angle-down {
	font-size: 24px;
	color: #FAFAFA;
	cursor: pointer;
	padding: 5px;
}

.angle-up {
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}

.angle-down {
	position: absolute;
	bottom: 0;
	width: 100%;
	z-index: 1;
}

.support_slides {
	border-radius: 5px 0 0 5px;
}

h3 {
	font-weight: bold;
	font-size: 1.17em;
}

@media (min-width: 768px) and (max-width: 1024px) {
	.phone {
		font-size: 18px;
	}

	#navmini, #truckCount {
		font-size: 12px;
	}

	.thumbnail-list {
		max-height: 160px;
		justify-content: center;
	}
	.thumbnail-img {
		width: 100px;
		height: 70px;
		border-radius: 5px;
	}
	.carousel-inner {
		height: 300px;
	}
}

@media only screen and (min-width: 768px) {
	.text-md-center {
		text-align: center;
	}
}

@media only screen and (max-width: 800px) {

	.no-more-tables table,
	.no-more-tables thead,
	.no-more-tables tbody,
	.no-more-tables th,
	.no-more-tables td,
	.no-more-tables tr {
		display: block;
	}

	.no-more-tables thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	.no-more-tables tr { border: 1px solid #ccc; }

	.no-more-tables td {
		border: none;
		border-bottom: 1px solid #eee;
		position: relative;
		padding-left: 50%;
		white-space: normal;
		text-align:left;
	}

	.no-more-tables td:before {
		position: absolute;
		top: 6px;
		left: 6px;
		width: 45%;
		padding-right: 10px;
		white-space: nowrap;
		text-align:left;
		font-weight: bold;
	}

	.no-more-tables td:before { content: attr(data-title); }
}



@media (max-width: 767px) {
	.phone {
		font-size: 18px;
	}

	#navmini, #truckCount {
		font-size: 12px;
	}

	.thumbnail-list {
		max-height: 160px;
		justify-content: center;
	}
	.thumbnail-img {
		width: 100px;
		height: 70px;
		border-radius: 5px;
	}
	.carousel-inner {
		height: 100%;
		margin-bottom: 5px;
	}
	.support_slides {
		border-radius: 5px 5px 0px 0;
	}
	.support_buttons {
		padding: 15px;
	}
}