@charset "utf-8";
/* CSS Document */
@charset "utf-8";
/* CSS Document */
body {
	background-color: #ffffff;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000;
	font-family: 'Noto Sans', Arial, Helvetica, sans-serif;
	font-size: 15px;
}
a {
	color: #8b181b;
}
.clear {
	clear:both;	
	float: none;
}
.alt {
	display:none;	
}
a img {
	border: none;
}
img {  
	border: none;
	vertical-align: middle;
	max-width: 100%;
}
.container {
	width: 1200px;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
}
.hideondesktop {
	display: none !important;
}
/*HEADERS*/
h1, h2, h3, h4 {
	font-family: 'Anton', Arial, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
	margin: 0px;
}
h1 {
	font-size: 50px;
}
h2 {
	font-size: 40px;
}
h3 {
	
}
h4 {
	
}
/*COLORS*/
.redBG {
	background-color: #8b181b;
}
.redText {
	color: #8b181b;
}
.redBorderBottom {
	border-bottom: solid 5px #8b181b;
}
.grayBG, .greyBG {
	background-color: #eaebed;
}
.darkGrayBG, .darkGreyBG {
	background-color: #585858;
}
.whiteBG {
	background-color: white;
}
.whiteText {
	color:#FFFFFF;
}
.blueBG {
	background-color: #008aff;
}
.greenBG {
	background-color: #00aa1c;
}
/* BUTTONS */
.button {
	text-decoration: none;
	color: #FFFFFF;
	text-shadow: none !important;
	font-family: 'Anton', Arial, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
	font-size: 20px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 20px;
	padding-right: 20px;
	display: inline-block;
	background-color: #8b181b;
}
.button:hover {
	background-color: #4d0e10;
}
.button-blue {
	background-color: #008aff;
}
.button-blue:hover {
	background-color: #0471ce;
}
.button-outline-white {
	border: solid 2px white;
	color: white;
	background-color: transparent;
}
.button-outline-white:hover {
	background-color: white;
	color: #8b181b;
}
/*MARGINS AND PADDINGS*/
.padding-tb-20 {
	padding-top: 20px;
	padding-bottom: 20px;
}

/*TEXT ALIGNMENT*/
.text-center {
	text-align: center;
}
/* TOP BAR */
.topbar {
	padding-top: 0px;
	padding-bottom: 10px;
	text-align: center;
}
.topbar a {
	color: #FFFFFF;
	text-decoration: none;
	display: inline-block;
	margin-right: 10px;
}
.topbar .top-button {
	font-family: 'Anton', Arial, sans-serif;
	text-transform: uppercase;
	color: #000000;
	background-color: #f3f3f3;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 3px;
	padding-bottom: 3px;
	
}
.top-button:hover {
	color: #8b181b;
}
.topbar .facebook {
	font-size: 31px;
	color: #f3f3f3;
	position: relative;
	top: 5px;
}
/* NAV AREA */
.navArea {
	padding-top: 10px;
	padding-bottom: 10px;
}
.logoArea {
	float: left;
	width: 243px;
}
.navRight {
	float: left;
	width: 950px;
}
.searchArea {
	padding-bottom: 10px;
	float: right;
}
.searchArea input[type="text"] {
	border: none;
	border: solid 1px #8b181b;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 16px;
	font-family: 'Noto Sans', Arial, Helvetica, sans-serif;
	display: block;
	float: left;
}
.searchArea input[type="submit"] {
	border: none;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 16px;
	font-family: 'Anton', Arial, sans-serif;
	text-transform: uppercase;
	margin: 0px;
	display: block;
	cursor: pointer;
	background-color: #8b181b;
	color: white;
	float: left;
}
.nav-bar {
	padding-top: 10px;
	padding-bottom: 10px;
}
.nav-bar ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
	text-align: right;
}
.nav-bar ul li {
	margin: 0px;
	padding: 0px;
	display: inline-block;
	position: relative;
}
.nav-bar ul li a {
	color: #FFFFFF;
	text-decoration: none;
	text-transform: uppercase;
	font-family: 'Anton', Arial, sans-serif;
	font-weight: normal;
	font-size: 16px;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 5px;
	padding-bottom: 5px;
	position: relative;
	background-color: #8b181b;
}
.nav-bar ul li a:hover { 
	background-color: #4d0e10;
}
.nav-bar ul li ul {
	display: none;
	position: absolute;
	text-align: left;
	top: 29px;
	width: 240px;
	z-index: 9;
}
.nav-bar ul li:hover ul {
	display: block;
}
.nav-bar ul li:hover a {
	background-color: #4d0e10
}
.nav-bar ul li ul li {
	display: block;
}
.nav-bar ul li ul li a {
	display: block;
	font-size: 17px;
	text-transform: none;
	font-family: 'Noto Sans', Arial, Helvetica, sans-serif;
}
.nav-bar ul li ul li a:hover {
	background:#8b181b;
}
.header {
	position: relative;
}
.hamburger, .hamburger-close {
	display: none;
	position: absolute;
	font-size: 40px;
	top: 26px;
	right: 20px;
	color: #8b181b;
}
/* BIG BANNER */
.bigBanner {
	background-image: url(graphics/trucksBGDark.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	padding-top: 50px;
	padding-bottom: 50px;
	text-shadow: 1px 1px 0px rgba(0,0,0,0.53);
}
.bigBanner h1 {
	color: #FFFFFF;
}
.bigBanner p {
	font-size: 22px;
	color: white;
	margin: 0px;
	margin-bottom: 20px;
}

/* AUCTION LISTINGS */
.currentAuctions {
	padding-top: 20px;
}
.auctionListing {
	display: table; /* Make the container element behave like a table */
    width: 100%; /* Set full-width to expand the whole page */
	margin-top: 10px;
	margin-bottom: 10px;
	border-collapse:separate;
	border-spacing: 10px;
}
.auctionBox {
	display: table-cell;
	width: 276px;
	border: solid 2px #eaebed;
}
.auctionBoxInner {
	
}
.auctionBoxImage {
	
}
.auctionBoxTitle {
	text-align: center;
	font-weight: bold;
	border-top: solid 3px #8b181b;
	padding: 5px;
}
.auctionBoxDesc {
	padding: 5px;
	text-align: center;
}
.auctionBoxInfo {
	padding: 5px;
	background-color: #eaebed;
}
.timeLeft {
	font-weight: bold;
	color: red;
}
.auctionBoxButtons {
	text-align: center;
	padding: 5px;
}
.auctionBoxButtons .button {
	margin-top: 5px;
	margin-bottom: 5px;
	display: block;
	width: 100%;
	padding-left: 0px;
	padding-right: 0px;
}
/* MIDDLE BANNER */
.middleBanner {
	padding-top: 20px;
	padding-bottom: 20px;
	color: #FFFFFF;
	font-size: 40px;
	font-family: 'Anton', Arial, sans-serif;
}
.middleBanner .button {
	position: relative;
	top: -8px;
	left: 20px;
}
/* BROWSE BY CATEGORY */
.categories {
	padding-top: 20px;
	padding-bottom: 50px;
}
.categories h2 {
	margin-bottom: 20px;
}
.categoryBox {
	display: inline-block;
	margin-left: 5px;
	margin-right: 5px;
	background-color: #000000;
	background-repeat: no-repeat;
	background-size: cover;
	-ms-filter: "alpha(opacity=80)";
	filter: alpha(opacity=80);
	-khtml-opacity: .8;
	opacity: .8;
	padding-top: 164px;
	padding-bottom: 1px;
	text-align: center;
	font-family: 'Anton', Arial, sans-serif;
	text-transform: uppercase;
	font-size: 30px;
	color: #FFFFFF;
	text-shadow: 1px 1px 0px rgba(0,0,0,0.53);
	text-decoration: none;
	width: 287px;
}
.categoryBox:hover {
	-ms-filter: "alpha(opacity=100)";
	filter: alpha(opacity=100);
	-khtml-opacity: 1;
	opacity: 1;
}
.heavyDuty {
	background-image: url(graphics/heavyDuty.jpg)
}
.mediumDuty {
	background-image: url(graphics/medDuty.jpg)
}
.lightDuty {
	background-image: url(graphics/lightDuty.jpg)
}
.trailers {
	background-image: url(graphics/trailer.jpg)
}
/*SELL WITH US */
.sellWithUs {
	padding-top: 20px;
	padding-bottom: 30px;
}
.bullet {
	font-size: 29px;
	display: inline-block;
	margin-left: 10px;
	margin-right: 10px;
	text-transform: uppercase;
}
.bullet i {
	font-size: 40px;
	display: inline-block;
	top: 4px;
	position: relative;
	margin-right: 10px;
}
.banner-text {
	font-size: 30px;
	margin-top: 20px;
}
/* FOOTER */
.footer {
	padding-top: 20px;
	padding-bottom: 50px;
}
@media (max-width: 1216px)
{
	.container {
		width: 990px;
	}
	.nav-bar ul li a {
		padding-left: 10px;
		padding-right: 10px;
	}
	.navRight {
		width: 740px;
	}
	.categoryBox  {
		width: 234px;
		padding-top: 114px;
	}
	.bullet {
		font-size: 22px;
	}
	.bullet i {
		font-size: 32px;
	}
}
@media (max-width: 999px)
{
	.container {
		width: auto;
		padding-left: 10px;
		padding-right: 10px;
	}
	.hideonmobile {
		display: none;
	}
	.hideondesktop {
		display: block !important;
	}
	.navRight {
		width: 100%;
	}
	.nav-bar {
		background-color: #8b181b;
	}
	.nav-bar ul {
		text-align: center;
	}
	.nav-bar ul li {
		display: block;
	}
	.nav-bar ul li ul {
		display: block;
		position: static;
		text-align: center;
		width: 100%;
	}
	.nav-bar ul li a {
		font-size: 18px;
		padding: 0px;
		padding-top: 5px;
		padding-bottom: 5px;
	}
	.nav-bar ul li ul li a {
		font-size: 14px;
	}
	.nav-bar ul li ul li {
		display: inline-block;
		margin-left: 8px;
		margin-right: 8px;
	}
	.hamburger {
		display: block;
	}
	.categoryBox {
		width: 50%;
		margin-bottom: 10px;
		margin-left: 0px;
		margin-right: 0px;
	}
	.bullet {
		display: block;
		margin-top: 10px;
		margin-bottom: 10px;
	}
	.auctionBox {
		display: block;
		width: 100%;
		margin-bottom: 20px;
	}
	.auctionBoxImage {
		width: 250px;
		float: left;
		margin-right: 10px;
	}
	.auctionBoxTitle {
		border-top: none;
		text-align: left;
	}
	.auctionBoxDesc {
		float: none;
		clear: both;
		text-align: left;
		padding-top: 20px;
	}
}
@media (max-width: 710px)
{
	h1 {
		font-size: 40px;
	}
	h2 {
		font-size: 30px;
	}
	.bigBanner  {
		padding-top: 20px;
		padding-bottom: 20px;
	}
	.bigBanner p {
		font-size: 17px;
	}
}
@media (max-width: 586px)
{
	.logoArea  {
		width: 183px;
	}
	.hamburger, .hamburger-close {
		top: 15px;
	}
	h1 {
		font-size: 33px;
	}
	h2 {
		font-size: 25px;
	}
	.bigBanner p {
		font-size: 15px;
	}
	.auctionBoxImage {
		float: none;
		margin-right: 0px;
		width: 100%;
		border-bottom: solid 2px #8b181b;
	}
	.auctionBoxTitle {
		text-align: center;
	}
	.middleBanner {
		font-size: 25px;
	}
	.middleBanner .button {
		top: 0px;
	}
	.bullet {
		font-size: 14px;
	}
	.bullet i {
		font-size: 24px;
	}
	.banner-text {
		font-size: 20px;
	}
}