/* global varaiables */
:root
{
	--max-content-width: 1200px;
}


/* website structure */
	html, body
	{
		display: block;
		margin: 0px;
		padding: 0px;
		color: #222222;
		font-size: 1.0em;
		font-family: system-ui;
		word-spacing: 0 !important;
		letter-spacing: 0 !important;
		min-width: 350px;
	}

	body
	{
		background: #020202;
	}

	.maxwidth
	{
		display: block;
		margin: auto;
		width: 100%;
		max-width: var(--max-content-width);
	}

	header
	{
		background: #020202;
		position: relative;
		overflow: auto;
		color: #ffffff;
		user-select: none; -webkit-user-select: none;
	}

		header #logo img
		{
			border: 0;
			padding: 0;
			max-width: 100%;
			max-height: 5.5em;
			padding: 0.5em 0;
		}

		header #members
		{
			display: inline-block;
			padding: 0 0.5em;
			font-size: 0.95em;
			background: #464445;
			border-radius: 0 0 0.5em 0.5em;
		}
			header #members a
			{
				color: #ffffff;
				padding: 0.4em 0.5em;
				display: inline-block;
				text-decoration: none;
				font-weight: 600;
			}
			header #members a:hover
			{
				text-decoration: underline;
			}

		header .social
		{
			display: inline-block;
			margin: auto;
			padding: 0.5em;
		}
			header .social a, footer .social a
			{
				display: inline-block;
				width: 3.5em;
				color: #ffffff;
				padding: 0.1em;
			}
			header .social a>i, footer .social a>i
			{
				color: #ffffff;
				font-size: 1.8em !important;
				text-decoration: none;
			}
			header .social a>s-icon, footer .social a>s-icon
			{
				color: #ffffff;
				font-size: 1.8em !important;
				text-decoration: none;
			}

	#main_nav
	{
		display: block;
		top: 0;
		left: 0;
		right: 0;
		margin: 0;
		padding: 0;
		z-index: 500;
		color: #020202;
		overflow: show;
		font-size: 1.6em;
		letter-spacing: 1px;
		text-align: left;
		background: #969696;
		text-transform: uppercase;
		font-weight: 600;
		text-decoration: none;
		user-select: none; -webkit-user-select: none;
	}
		#main_nav ul ul
		{
			display: none;
		}

		#main_nav ul li:hover>ul
		{
			display: block;
		}

		#main_nav ul
		{
			padding: 0;
			margin: 0;
			display: block;
			list-style: none;
			position: relative;
			text-align: center;
		}

			#main_nav ul li
			{
				margin: 0;
				padding: 0;
				color: #ffffff;
				position: relative;
				display: inline-block;
			}

			#main_nav ul li>a
			{
				display: block;
				color: #020202;
				padding: 0.3em 1em;
				cursor: pointer;
				white-space: nowrap;
				text-decoration: none;
			}
			#main_nav ul li:hover>a
			{
				color: #ffffff !important;
				background: #4D4D4D;
			}

			#main_nav>div>ul>li:hover
			{
				color: #ffffff !important;
				background: #4D4D4D;
			}

			#main_nav>div>ul>li:active
			{
				background: #6D6D6D;
			}

		#main_nav ul ul
		{
			top: 100%;
			z-index: 500;
			padding: 0;
			min-width: 10em;
			text-align: left;
			letter-spacing: 0;
			position: absolute;
			color: #ffffff !important;
			background: #4D4D4D;
			box-shadow: 1px 2px 2px 0 rgba(0,0,0, 0.5);
		}
		#main_nav ul ul li
		{
			display: block;
			margin: 0;
			padding: 0;
			position: relative;
		}
		#main_nav ul ul li>a
		{
			padding: 0.5em;
			color: #ffffff;
		}
		#main_nav ul ul li:hover>a
		{
			background-color: #6D6D6D;
		}

		main
		{
			display: block;
			margin: 0;
			padding: 0;
			text-align: left;
			background: #EDEDED;
		}
			#content
			{
				min-height: 60vh;
				max-width: var(--max-content-width);
				margin: 0 auto;
			}

		main section.content
		{
			display: block;
			margin: 0 auto;
			overflow: hidden;
		}

		main section.content.bg-charcoal
		{
			color: #ffffff;
			background: #1E1E1E;
		}
		main section.content.bg-grey
		{
			background: #E9E9E9;
		}
		main section.content.bg-red
		{
			color: #ffffff;
			background: #AD0000;
		}

		#partners
		{
			display: block;
			width: 100%;
			padding: 10px 0;
			overflow: hidden;
			position: relative;
			white-space: nowrap;
			background-color: #ffffff;
			user-select: none;
			-webkit-user-select: none;
		}
			#partners>a
			{
				display: inline-block;
				vertical-align: middle;
				padding: 0 20px;
			}
			#partners>a>img
			{
				display: inline-block;
				vertical-align: middle;
				width: 225px;
				aspect-ratio: 2 / 1;
				object-fit: contain;
				background: transparent;
			}


	footer
	{
		overflow: auto;
		color: #ffffff;
		text-align: center;
		background: #020202;
		font-size: 1.1em;
	}
		footer a
		{
			color: inherit;
			text-decoration: underline;
		}
		footer a:hover
		{
			text-decoration: none;
		}
		footer .social
		{
			padding-top: 1.2em !important;
			font-size: 1em;
		}

	#foot_nav
	{
		display: block;
		top: 0;
		left: 0;
		right: 0;
		margin: 0;
		padding: 0;
		z-index: 500;
		color: #ffffff;
		overflow: show;
		font-size: 1.1em;
		text-transform: uppercase;
		font-weight: 600;
		text-decoration: none;
		user-select: none; -webkit-user-select: none;
	}
		#foot_nav ul
		{
			list-style: none;
			text-align: left;
			text-decoration: none;
		}
		#foot_nav ul>li
		{
			margin: 0;
			padding: 0;
			width: 50%;
			text-align: center;
			display: inline-block;
		}
		#foot_nav ul>li>ul
		{
			display: none;
		}
		#foot_nav a
		{
			display: block;
			padding: 0.4em;
			text-decoration: none;
		}

	#newsletter
	{
		color: #ffffff;
		text-align: center;
		font-size: 1.2em;
		font-weight: 600;
	}
		#newsletter input[type="email"]
		{
			text-align: center;
			padding: 0.2em 0.8em;
			line-height: 1.1em;
			color: #000000 !important;
			border: 0;
			vertical-align: middle;
			max-width: 95%;
			margin: auto;
		}
		#newsletter button[type="submit"]
		{
			background: #AD0000;
			color: #ffffff;
			border: 0;
			padding: 0.2em 0.8em;
		}


	/* PROMOBOX */
	#promobox
	{
		display: block;
		width: 100%;
		height: auto;
		aspect-ratio: 2 / 1;
		overflow: hidden;
		position: relative;
		user-select: none; -webkit-user-select: none;
	}

		#promobox>.promobox_slide
		{
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: auto;
			aspect-ratio: 2 / 1;
			z-index: 85;
			border: 0px;
			outline: none;
		}

		#promobox>.promobox_slide>img
		{
			width: 100%;
			height: auto;
			aspect-ratio: 2 / 1;
		}

	/* eventbox */
	#eventbox
	{
		display: flex;
		flex-direction: row;
		justify-content: space-evenly;
		align-items: stretch;
		align-content: center;
		gap: 1em;
		user-select: none;
		-webkit-user-select: none;
	}
		#eventbox a
		{
			display: block;
			width: 33%;
		}
			#eventbox a img
			{
				display: block;
				object-fit: contain;
				aspect-ratio: 1 / 1;
				width: 100%;
			}

	#eventbox a:hover
	{
		opacity: 0.7;
	}


/* countdown */
#countdown
{
	-webkit-user-select: none;
	user-select: none;
	text-align: center;
	background: #fff;
	vertical-align: middle;
}
	#countdown .numbers
	{
		display: inline-block;
		color: #AD0000;
		font-size: 12em;
		letter-spacing: 0.05em;
		text-align: right;
		vertical-align: middle;
		padding: 10px;
	}

	#countdown .days
	{
		display: inline-block;
		color: #020202;
		font-size: 4em;
		line-height: 1.0em;
		text-align: left;
		vertical-align: middle;
		max-width: 10em;
		padding: 10px;
	}



/* basic headings */
	h1, h2, h3, h4, h5
	{
		color: #282828;
		font-style: italic;
		font-weight: normal;
		text-decoration: none;
		text-transform: uppercase;
		font-weight: 600;
	}
	h1.red, h2.red, h3.red, h4.red, h5.red
	{
		color: #ED0000;
	}
	h1
	{
		margin: 0;
		font-size: 1.8em;
		padding: 0.1em 0.3em;
	}
	h2
	{
		margin: 0;
		font-size: 1.5em;
		padding: 0.1em 0.3em;
	}
	h3
	{
		margin: 0;
		font-size: 1.3em;
		padding: 0.1em 0.3em;
	}
	h4
	{
		margin: 0;
		font-size: 1.1em;
		padding: 0.1em 0.3em;
	}
	h5
	{
		margin: 0;
		font-size: 1em;
		padding: 0.1em 0.3em;
	}
	h1 a, h2 a, h3 a, h4 a, h5 a
	{
		color: inherit;
		text-decoration: inherit;
	}
	h1.fill, h2.fill, h3.fill, h4.fill, h5.fill
	{
		color: #ffffff;
		background: #282828;
	}



/* banner */
	.pagebanner
	{
		display: block;
		overflow: hidden;
	}
		.pagebanner>img
		{
			display: block;
			position: relative;
			width: 100%;
			left: 0;
			right: 0;
		}


/* images */
	img.profile
	{
		float: right;
		margin: 10px;
		padding: 5px;
		background: #ffffff;
		border: 1px solid #A6A6A6;
	}

/* auction article list */
	.auction_title
	{
		display: block;
		font-size: 1.3em;
		padding: 0.2em 0.4em;
		text-decoration: none;
		font-weight: 600;
		color: #ffffff;
		background-image: url('/theme/charcoal.jpg');
	}

/* auction section tabs */
	.auction_sections a
	{
		display: block;
		border: 1px solid #E9E9E9;
		margin: 0 5px;
		padding: 8px;
		font-size: 1.2em;
		line-height: 1.5em;
		z-index: 50;
		border-bottom: 0;
		text-align: center;
		text-decoration: none;
		font-weight: 600;
		background: rgb(237,237,237);
		background: linear-gradient(0deg, rgba(237,237,237,1) 0%, rgba(255,255,255,1) 100%);
		position: relative;
		border-radius: 6px;
	}
		.auction_sections a:hover
		{
			text-decoration: underline;
		}
	.auction_sections a.sel, .auction_sections a.sel:hover
	{
		z-index: 50;
		color: #ffffff;
		border-bottom: 0;
		text-align: center;
		text-decoration: none;
		font-weight: 600;
		background: #8F0000 url("/theme/red_gradient.jpg") 0 10px repeat-x;
		position: relative;
	}


/* consignment list */
	#consign_list
	{
		background: #ffffff;
	}

/* consignment search */
	#consign_search
	{
		position: sticky;
		top: 0px;
		z-index: 999;
		background: #AD0000;
		color: #ffffff;
		font-weight: bold;
		font-size: 1.3em !important;
		vertical-align: top;
		box-sizing: border-box;
	}
		#consign_search>label
		{
			display: inline-block;
			vertical-align: middle;
			width: 5em;
			text-align: center;
			vertical-align: top;
			padding: 0.5em;
			box-sizing: border-box;
			text-transform: uppercase;
		}
		#consign_search>.input
		{
			display: inline-block;
			width: calc(100% - 5em);
			padding-right: 0.5em;
			box-sizing: border-box;
		}
		#consign_search>.input>input
		{
			width: 100%;
			border: 0px;
			border-radius: 0;
			line-height: 1.4em;
			background: #ffffff;
			padding: 0.2em 0.3em !important;
			vertical-align: middle;
			box-sizing: border-box;
			vertical-align: top;
		}
	#consign_search .sections
	{
		display: block;
		box-sizing: border-box;
	}
		#consign_search input[type=checkbox]
		{
			width: 1.5em;
			box-sizing: border-box;
		}
		#consign_search .sections>div
		{
			padding: 0 0.5em 0.5em 0.5em;
			display: inline-block;
			text-transform: uppercase;
			box-sizing: border-box;
		}

	#consign_search[data-admin=y]
	{
		top: 1.6em;
	}


/* article_list */
	#article_list
	{
		display: block;
	}
		#article_list .section_flag
		{
			padding: 0.5em;
			font-size: 1.5em;
			font-weight: bold;
			background: #D9D9D9;
			text-transform: uppercase;
		}

/* auction articles */
	.article_grid
	{
		display: block;
		cursor: pointer;
		position: relative;
		vertical-align: middle;
		text-align: left;
		text-decoration: none;
		padding-bottom: 0.6em;
	}
		.article_grid>.flag-noreserve
		{
			position: absolute;
			top: 1.5em;
			left: -3em;
			width: 10em;
			color: #ffffff;
			display: block;
			padding: 0.3em;
			text-align: center;
			background: #980000;
			vertical-align: middle;
			font-weight: 600;
			transform: rotate(-45deg);
		}
		.article_grid>.flag-makeoffer
		{
			position: absolute;
			top: 1.5em;
			left: -3em;
			width: 10em;
			color: #ffffff;
			display: block;
			padding: 0.3em;
			text-align: center;
			background: #980000;
			vertical-align: middle;
			font-weight: 600;
			transform: rotate(-45deg);
		}
		.article_grid>.photo
		{
			position: relative;
			aspect-ratio: 4 / 3;
			height: auto;
			overflow: hidden;
			background-color: #BFBFBF;
			background-position: center;
			background-repeat: no-repeat;
			background-size: cover;
		}
		.article_grid>img
		{
			display: inline-block;
			width: 100%;
			aspect-ratio: 4 / 3;
			height: auto;
			background-color: #BFBFBF;
			object-position: 50% 50%;
			object-fit: cover;
			text-align: center;
		}
		.article_grid>.title, .article_grid>.title1
		{
			display: block;
			padding: 0;
			color: #000000;
			font-size: 1.3em;
			text-align: left;
			box-sizing: border-box;
		}
		.article_grid>.title2
		{
			display: block;
			padding: 0;
			color: #000000;
			font-size: 1.4em;
			text-align: left;
			font-weight: bold;
			box-sizing: border-box;
		}
		.article_grid>.price
		{
			display: block;
			background: #AD0000;
			padding: 0.2em;
			color: #ffffff;
			font-weight: bold;
			font-style: italic;
			font-size: 1.2em;
			text-align: center;
			box-sizing: border-box;
		}
		.article_grid>.price.high
		{
			background-color: #606060;
		}
		.article_grid>.lot
		{
			position: absolute;
			top: 0;
			right: 0;
			color: #ffffff;
			min-width: 3em;
			display: block;
			padding: 0.3em 0.8em;
			text-align: center;
			background: #980000;
			vertical-align: middle;
			font-weight: 600;
		}

/* hotels */

.hotel_grid
{
	display: block;
	background: #fff;
	box-sizing: border-box;
	box-shadow: 0 0 4px #292929;
	border-radius: 0.35em;
}
	.hotel_grid>img
	{
		display: inline-block;
		width: 100%;
		height: 17em;
		background-color: #BFBFBF;
		object-position: 50% 50%;
		object-fit: cover;
		text-align: center;
		border-radius: 0.35em 0.35em 0 0;
	}
	.hotel_grid a.info
	{
		display: block;
		padding: 0.3em;
		text-decoration: none;
	}
	.hotel_grid i.fa
	{
		margin-right: 0.4em;
	}




/* carousel */
	.carousel
	{
		z-index: 75;
		margin: auto;
		display: block;
		overflow: hidden;
		scroll-x: auto;
	}
		.carousel .carousel_slides
		{
			z-index: 80;
			width: 100%;
			height: 100%;
			white-space: nowrap;
			display: inline-block;
		}
			.carousel_slides .slide
			{
				display: inline-block;
				background-size: cover;
				background-repeat: no-repeat;
				background-position: center center;
			}
		.carousel_thumbs
		{
			z-index: 80;
			padding: 0.25em 0;
			display: block;
			overflow: hidden;
			white-space: nowrap;
		}
			.carousel_thumbs a
			{
				margin: 0;
				padding: 0;
				display: inline-block;
				background-size: cover;
				background-repeat: no-repeat;
				background-position: center center;
				cursor: pointer;
				opacity:.6;
			}
			.carousel_thumbs a.sel, .carousel_thumbs a:hover
			{
				opacity: 1;
			}




/* carousel */
	#photos
	{
		margin: auto;
		display: block;
		background-color: #000000;
	}
		#photos_image
		{
			width: 100%;
			height: 100%;
			display: block;
			background-color: #000000;
			background-size: contain;
			background-repeat: no-repeat;
			background-position: center center;
		}
		#photos_image.enlarge
		{
			z-index: 2000;
			position: fixed;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			width: 100% !important;
			height: 100% !important;
		}

		#photos_thumbs
		{
			width: 100%;

			padding: 0.25em 0;
			display: block;
			overflow-x: auto;
			overflow-y: hidden;
			white-space: nowrap;
		}
			#photos_thumbs a
			{
				height: 6em;
				width: calc((100% / 5));
				margin: 0;
				padding: 0;
				border: 0.1em solid #000000;
				display: inline-block;
				box-sizing: border-box;
				background-size: cover;
				background-repeat: no-repeat;
				background-position: center center;
				cursor: pointer;
				border-radius: 0.3em;
			}
			#photos_thumbs a.sel, #photos_thumbs a:hover
			{
				border-color: #C7C7C7;
			}

/* photo gallery */
	photo-gallery
	{
		position: relative;
		display: block;
		background-color: #000000;
		box-sizing: border-box;
	}
		photo-gallery button
		{
			position: absolute;
			display: inline-block;
			background: transparent;
			border: 0;
			padding: 0;
			text-align: center;
			vertical-align: middle;
			color: #fff;
			cursor: pointer;
		}
			photo-gallery button m-icon
			{
				font-size: 2em;
			}

		/* loading indicator */
		photo-gallery button.load
		{
			visibility: hidden;
			top: 0.5em;
			left: 0.5em;
			width: 3em;
			height: 3em;
			line-height: 1em;
			border-radius: 50%;
			background: rgba(0,0,0,0.6);
		}
		photo-gallery button.load:hover
		{
			background: rgba(0,0,0,0.6);
		}

		/* close button */
		photo-gallery button.close
		{
			visibility: hidden;
			top: 0.5em;
			right: 0.5em;
			width: 3em;
			height: 3em;
			line-height: 1em;
			border-radius: 50%;
			background: rgba(0,0,0,0.6);
		}
		photo-gallery button.close:hover
		{
			background: rgba(0,0,0,0.9);
		}

		/* left button */
		photo-gallery button.left
		{
			bottom: 0;
			left: 0;
			height: 7.5em;
			line-height: 1em;
		}

		/* right button */
		photo-gallery button.right
		{
			bottom: 0;
			right: 0;
			height: 7.5em;
			line-height: 1em;
		}
		photo-gallery button.left:hover,
		photo-gallery button.right:hover
		{
			background: transparent;
			opacity: 0.9;
		}

		photo-gallery>img
		{
			display: block;
			width: 100%;
			aspect-ratio: 4 / 3;
			object-fit: contain;
			box-sizing: border-box;
			border: 0.2em solid transparent;
			cursor: pointer;
		}

		photo-gallery thumb-list
		{
			display: flex;
			flex-direction: row;
			flex-wrap: nowrap;
			flex-shrink: 0;
			gap: 0.2em;
			margin: 0 2em;
			padding: 0.2em;
			overflow-x: hidden;
			touch-action: pan-x;
			-ms-overflow-style: none;
			scrollbar-width: none;
			user-select: none;
			-webkit-user-select: none;
			white-space: nowrap;
			box-sizing: border-box;
		}
			photo-gallery thumb-list img
			{
				height: 7em;
				aspect-ratio: 4 / 3;
				object-fit: cover;
				margin: 0;
				padding: 0;
				opacity: 0.65;
				border: 0.1em solid transparent;
				display: inline-block;
				box-sizing: border-box;
				cursor: pointer;
				border-radius: 0.2em;
				box-sizing: border-box;
			}
			photo-gallery thumb-list img[data-current]
			{
				opacity: 1;
				border-color: #C7C7C7;
			}
			photo-gallery thumb-list img:hover
			{
				border-color: #C7C7C7;
			}

		photo-gallery[data-fullscreen]
		{
			z-index: 2000;
			position: fixed;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			width: 100% !important;
			height: 100% !important;
			display: flex;
			flex-direction: column;
		}
			photo-gallery[data-fullscreen] button.close
			{
				visibility: visible;
			}
			photo-gallery[data-fullscreen]>img
			{
				height: calc( 100% - 7.5em );
				aspect-ratio: auto;
				object-fit: contain;
			}

/* nav lo res */
	#disp_nav_lo
	{
		display: none;
		text-align: right;
	}
		#disp_nav_lo>a
		{
			display: block;
			padding: 0.1em;
			font-size: 1.8em;
		}

/* consignment videos */
	#videolist
	{
		display: block;
	}
		#videolist>div
		{
			cursor: pointer;
			display: inline-block;
			margin: 0.2em;
			padding: 0;
			height: 9em;
			width: 13em;
			background-size: cover;
			background-position: center center;
			border-radius: 0.3em;
			text-align: center;
			vertical-align: middle;
			color: #ffffff;
		}
		#videolist>div>m-icon
		{
			display: inline-block;
			width: 100%;
			font-size: 4em;
			height: 1em;
			line-height: 2.2em;
			text-shadow: 0px 0px 7px #292929;
			vertical-align: middle;
		}
		#videolist>div:hover
		{
			box-shadow: 0 0 4px #292929;
		}

/* banner buttons */
	.bannerbuttons
	{
		display: flex;
		flex-align: row;
		flex-wrap: wrap;
		justify-content: space-evenly;
		align-items: stretch;
		background: #AD0000;
		font-size: 1.6em;
		letter-spacing: 1px;
		text-transform: uppercase;
		vertical-align: middle;
		text-align: center;
		box-sizing: border-box;
	}
		.bannerbuttons a
		{
			flex-grow: 1;
			display: inline-block;
			box-sizing: border-box;
			padding: 0.4em 0.8em;
			color: #fff;
			font-size: 1em;
			font-weight: 600;
			text-align: center;
			text-decoration: none;
			vertical-align: baseline;
		}
		.bannerbuttons a:hover
		{
			background: #D30000;
		}

/* featured lots */
.featured
{
	background: #fff;
}
	.featured .photo
	{
		height: 12em;
	}

/*
 * LOW RESOLUTION
 */
@media screen and (max-width: 749px)
{
	#countdown
	{
		font-size: 0.5em;
	}

	.lores-font-decrease
	{
		font-size: 0.75em;
	}

	#disp_nav_lo
	{
		display: block;
	}

	#disp_nav_hi
	{
		display: none;
		width: 90%;
		text-align: right;
	}

	header .social a
	{
		width: 2.2em;
	}

	/* clean up menu */
	#main_nav ul li
	{
		width: 50%;
		text-align: left;
	}
	#main_nav ul li>a
	{
		padding: 0.3em 0.8em;
	}

	#content
	{
		min-height: unset;
	}

	footer
	{
		font-size: 0.95em;
	}

	footer section, footer div
	{
		text-align: center !important;
	}

	header #members a.lowres-show
	{
		display: inline-block !important;
	}

	/* PROMOBOX */
	#promobox
	{
		overflow: show;
		height: auto !important;
		box-shadow: none;
	}

	#promobox>.promobox_slide
	{
		display: block;
		position: relative !important;
		top: none;
		left: none;
		margin: 0 0 .5em 0;
		opacity: 1.0 !important;
	}


	/* pagebanner */
	.pagebanner>img
	{
		position: relative;
		width: 120%;
		left: -10%;
		right: -10%;
	}

	/* featured vehicles */
	.featured section.col25
	{
		width: 50% !important;
		font-size: 0.8em;
	}
	.featured .photo
	{
		height: 10em;
	}

	#eventbox
	{
		flex-direction: column;
		padding: 1em;
	}

	#eventbox>a
	{
		width: 100% !important;
	}

	#photos_thumbs a
	{
		height: 6em;
		width: calc(100% / 3);
	}

	#videolist>div
	{
		width: 48% !important;
	}
}