/* CSS Document */

a, button, .button, a:hover, button:hover, .button:hover, button.mobile_btn::after, .cta a .opacity, .cta ul li a .opacity::before, .cta ul li a:hover .opacity::before {
    -webkit-transition:all .45s ease;
    -moz-transition:all .45s ease;
    -ms-transition:all .45s ease;
    -o-transition:all .45s ease;
    transition:all .45s ease;
    outline: none;
}

/* =============================================================================
   Foundation Resets                                                               
============================================================================= */

.columns.collpase { padding: 0px !important; }
/*body, html { overflow-x: hidden; }*/
table tbody, table tfoot, table thead {
    border: none;
	background: transparent;
}
select { width: auto; }




/* =============================================================================
   Typeography                                                              
============================================================================= */
body { font-family: 'Roboto', sans-serif; color: #222; }
h1,h2,h3,h4,h5,h6 { font-family: 'Roboto', sans-serif; }

h1 { font-weight: 900; }
h2 { font-weight: 600; }


a, a:visited {
	color: #0563ab;
}
a:hover, a:focus {
	color: #666;
	text-decoration: none !important;
}

a.button, button, .button, .btn, .btn:visited, a.button:visited, button:visited, .button:visited, .listings-wrapper .hosted-theme .btn {
	background: #0563ab !important;
	border-radius: 2px !important;
	color: #fff !important;
}
a.button:hover, button:hover, .button:hover, .btn:hover, .btn:focus, a.button:focus, button:focus, .button:focus, .listings-wrapper .hosted-theme .btn:hover {
	background: #666 !important;
	color: #fff !important;
}

.bold{font-weight: bold;}
.white{color:#fff;}

/* =============================================================================
   Header                                                              
============================================================================= */

/* Tob Bar */
#topbar {
	width: 100%;
	display: flex; 
	justify-content: space-between;
	align-items: center;
}
#topbar .logo a img { 
	width: 130px; 
	margin: 0px auto;
	display: block;
	padding: 15px 0px;
}
#topbar h1 { padding: 4% 0 0 0; }
#topbar .logo a:hover img { opacity: .75; }
#topbar ul#contact {
	list-style: none;
	margin: 0px;
	padding: 15px 0 0 0;
}
#topbar ul#contact li {
	color: #222;
	display: block;
	text-align:center;
	padding: 5px 0;
	line-height:1;
	font-size: 13px;
}
#topbar ul#contact li a {color: #222}
#topbar ul#contact li a:hover { opacity: .75; }

#topbar h2 {text-transform: uppercase; color: #C40002; font-size: 28px;}

/* Header */
header {
	position: relative;
	background: #0563ab;
	padding: 5px 0;
	text-align:center;
}

/* Menu Main */
.menu-main-container ul {
	margin: 0;
	padding:0;
	list-style: none;
}
#menu-main a {
	display:block; 
	color: #fff; 
	text-transform: uppercase;
	padding: 0.8em 1.8em;
	font-size: 16px;
	letter-spacing: 1px;
	position: relative;
	font-weight: 500;
}
#menu-main li {
	position: relative;
}
#menu-main > li { 
	display: inline-block; 
} 
#menu-main > li > a { 

}
#menu-main li a:hover {
	background: #000;
}
#menu-main > li:hover, 
#menu-main > li:hover > a { 

}
.menu-main-container button.mobile_btn {
	display: none;
}
/* Sub-Menu */
#menu-main ul {
	position: absolute;
	white-space: nowrap;
	z-index: 1;
	left: -99999em;
	background: #0563ab;
	text-align: left;
}
#menu-main ul li a { font-size: 14px; }
#menu-main ul li a:hover {
	opacity: 1;
}
#menu-main > li:hover > ul {
	left: auto;
	min-width: 100%;
}
#menu-main > li li:hover > ul { 
	left: 100%;
	margin-left: 1px;
	top: -1px;
}

/* Dropdown Arrow */
/*#menu-main li > a:after {
    color: #666;
    content: url(../siteart/down.png);
    position: absolute;
    top: -2px;
    padding-left: 3px;
}

#menu-main li > a:hover:after {
    color: #666;
    content: url(../siteart/down.png);
}

#menu-main li > a:only-child:after {
    content: '';
}*/

  	/* Mobile Menu */
	.off-canvas {
		background: #888;
		height: 100%;
		min-height: 100vh;
		display: none;
	}
	.off-canvas header {
		background: transparent;
		padding: 0px;
		position: relative;	
		text-align: left;	
	}
	.off-canvas h2 {
		color: #fff;
		text-align:center;
		font-size: 2em;		
	}
	.mobile.button { display: none; }
	.off-canvas-wrapper { overflow: visible; }
	.mobile-nav {
		width: 100%;
		position: relative;
		height: auto;
	}
	.mobile-nav #mobile-menu-main {
		border-top: 1px solid #333;
		margin: 0px;
	}
	.mobile-nav #mobile-menu-main li {
		width: 100%;
		position: relative;
	}
	.mobile-nav #mobile-menu-main li a:hover {
		background: #666;
	}
	.mobile-nav #mobile-menu-main a {
		width: 100%;
		color: #fff;
		display: block;
		text-decoration: none;
		padding: 10px 5%;
		height: 45px;
		position: relative;
		border-bottom: 1px solid #333;
		font-size: 14px;
	}

	/* Sub-Menu */
	.mobile-nav #mobile-menu-main ul {
		position: relative;
		white-space: nowrap;
		z-index: initial;
		left: 0;
		background: transparent;
		text-align: left;
	}
	.mobile-nav ul.sub-menu li ul.sub-menu {
		margin: 0px;
		display: none;
	}
	.mobile-nav ul li a:hover { color: #fff !important; }
	.mobile-nav #mobile-menu-main > li li:hover > ul { left: 0px; }
	.mobile-nav #mobile-menu-main > li:hover, #mobile-menu-main > li:hover > a { border-color: #333;	}
	.mobile-nav #mobile-menu-main > li > .sub-menu > li > ul.sub-menu li a { padding: 10px 15%;	}
	.mobile-nav #mobile-menu-main > li > .sub-menu > li > ul.sub-menu > li > ul.sub-menu li a { padding: 10px 20%; }
	.mobile-nav #mobile-menu-main > li > .sub-menu {
		display: none;
		margin: 0px;
	}
	.mobile-nav #mobile-menu-main > li > .sub-menu li a { padding: 10px 10%; }

	/* Mobile Btn */
	.mobile-nav li button.mobile_btn {
		height: 45px;
		width: 50px;
		position: absolute;
		top: 0;
		right: 0;
		background: #333;
		background-size: 10px;
	}
	button.mobile_btn::after {
		content: ' ';
		position: absolute;
		top: 0;
		background: url(../siteart/mobile_arrow.png) no-repeat center center;
		background-size: 10px;
		width: 100%;
		height: 100%;
		right: 0;
	}
	.mobile-nav li button.mobile_btn.active::after {
		-webkit-transform: rotate(180deg);
		-moz-transform: rotate(180deg);
		-ms-transform: rotate(180deg);
		-o-transform: rotate(180deg);
		transform: rotate(180deg);
	}

/* =============================================================================
   Body                                                              
============================================================================= */

#main-container {
	display: table;
	width: 100%;
	padding: 50px;
	box-sizing: border-box;
}
#wrap{
	width:100%;
	box-sizing: border-box;
	padding: 50px;
}
.interior .texture {
	padding: 25px 0;
}

.inv-container{max-width: 1800px; margin: auto;}

/* Slider */
#slider {
	height: 580px;
	overflow:hidden;
	position:relative;
	padding: 0 0 10px;
}
#slider .orbit-container {
    margin: 0;
    list-style: none;
    overflow: hidden;
    height: 580px;
	width: 100%;
}
#slider .orbit-slide {
    background-repeat: no-repeat;
    background-size: cover;
    height: 580px;
    background-position: center center;
}
.orbit-next, .orbit-previous { 
	z-index: 999999; 
	background: transparent !important; 
}
.orbit-next:hover, .orbit-previous:hover { cursor: pointer; }

	/* Interior */
	.interior #slider .orbit-slide, .interior #slider .orbit-container, .interior #slider { 
		height: 200px !important;
	}
	
/* Call to Action */
.cta ul {
	list-style:none;
	margin: 0px;
	padding: 10px 0;
}
.cta ul li {
	display: inline-block;
	background-position: right center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100px;
	position:relative;
}
.interior .cta ul li {
	margin: 0 0 10px;
}
.cta ul li:first-child { background-image: url(../siteart/slide4.jpg); }
.cta ul li:nth-child(2) { background-image: url(../siteart/slide1.jpg); }
.cta ul li:nth-child(3) { background-image: url(../siteart/slide3.jpg); }
.cta ul li:last-child { background-image: url(../siteart/slide2.jpg); }
.cta ul li .opacity::before {
		content: ' ';
		background: #3d3d3b;
		position:absolute;
		left: 0;
		top: 0;
		bottom: 0;
		width: 115px;
		background-size: contain !important;
		background-position: 50% 50% !important;
		background-repeat: no-repeat !important;
}
.cta ul li .opacity:hover:before { content: ''; background:rgba(5,99,171,1) }
.cta ul li:first-child .opacity:before { background-image: url(../siteart/trucks.png) !important; }
.cta ul li:nth-child(2) .opacity:before { background-image: url(../siteart/trailer.png) !important; }
.cta ul li:nth-child(3) .opacity:before { background-image: url(../siteart/machine.png) !important; }
.cta ul li:last-child .opacity:before { background-image: url(../siteart/attachments.png) !important; }
.cta ul li a {
	color: #fff;
	text-align: center;
}
.cta a h4 {
	color: #fff;
	text-align: center;
	display: table-cell; 
	vertical-align:middle;
	position: relative;
	left: 55px;
}
.cta a:hover { opacity: 1; }
.cta a .opacity {
	background: rgba(5,99,171,.5);
	position:absolute;
	top:0;
	right: 0;
	left: 0;
	bottom: 0;
	display: table;
	width: 100%;
	height: 100%;
}
.cta ul li a:hover .opacity::before { background:rgba(5,99,171,1) }
.cta ul li a:hover .opacity { background: rgba(5,99,171,.75); }

/* Scroll Bar */
.scrollBar {
	background: #fff;
	padding: 15px 0;
	display: block;
	width: 100%;
	height: 125px;	
	overflow:hidden;
}
.scrollBar iframe { overflow:hidden; width:100%; height:90px; padding:0; background:#fff;}

/* Texture */
.texture {
	background: url(../siteart/texture.jpg) no-repeat center 80%;
	background-size: cover;
	padding: 75px 0;
	color: #fff;
	display: table;
	width: 100%;
	background-color: black;
}
.texture2 {
	background: url(../siteart/texture.jpg) fixed no-repeat center 80%;
	background-size: cover;
	padding: 75px 0;
	display: table;
	width: 100%;
	background-color:black;
}

.auctioncontainer {
	margin: 20px auto 0px auto;
	text-align: center;
	width: 80%;
}

/* =============================================================================
   Footer                                                              
============================================================================= */

footer {
	border-top: #0563ab 5px solid;
	background: #3d3d3b;
	display: table;
	width: 100%;
	color: #999;
	padding: 25px 0 15px;
}
footer font, footer font a {
	color: #999 !important;
	font-size: 14px;
}

/* =============================================================================
   Mobile                                                              
============================================================================= */


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

	.auctioncontainer {
		width: 95%;
	}
	
	.off-canvas {
		display: block;
	}
	header {
		display: table;
		width: 100%;
		padding: 40px 0;		
	}
	.mobile.button {
		display: block;
		background: url(../siteart/mobile.png) center center no-repeat !important;
		background-size: contain !important;
		height: 45px;
		width: 45px;
		position:absolute;
		color: transparent !important;
		top: 25%;
		right: 0;
		left: 0;
		margin: 0px auto;
	}
	.mobile.button:hover {
		background: url(../siteart/mobile.png) center center no-repeat !important;
		background-size: contain !important;		
	}
	.menu-main-container {
		display: none;
	}
	.cta ul li {
		margin: 0 0 10px;
	}
	#topbar h1 {
		padding: 3% 0 0 0;
	}
	#topbar ul#contact { display: none; }

	/* Interior */
	#slider .orbit-slide, #slider .orbit-container, #slider, .interior #slider .orbit-slide, .interior #slider .orbit-container, .interior #slider { 
		height: 200px !important;
	}
	.cta a .opacity { width: 110%; }	
	.cta a h4 { left: 50px; right: 0; }
	
	#topbar {display: flex; align-items: center;}
	#topbar div:nth-child(2) {width: 100% !important;}
	#topbar div:last-child {display: none;}
	#topbar div:first-child {width: 180px;}
}

@media only screen and (max-width: 639px) {
	#topbar div:first-child {width: 100%;}
	#topbar {flex-wrap: wrap; justify-content: center;}
	#topbar div:nth-child(2) {text-align: center;}
	#topbar h2 {font-size: 20px;}
	#topbar h1 {padding: 0% 0 0 0;}
	#topbar .logo a img {width: 100px;}
}