@charset "utf-8";
/* CSS  ECAS */

/* *************************************************************************************************************** */
/* ############################################# GLOBAL DEFINITIONS ############################################## */
/* *************************************************************************************************************** */

* {
	box-sizing: border-box;
	outline: none;
}

html{}

body{
	font-family: 'Lexend', sans-serif;
	font-size:14px;
	margin: 0;
	padding: 0;
	color: #232323;
	overflow-y: scroll;
}

a{
	text-decoration:none;
	transition: all 300ms;
}

table{
	width: 100%;
}

/* SVG ICONS */

.arrow-right-white:after,
.arrow-right-ci:after,
.search-ci:after{
	width: 15px;
	display: block;
	margin-left:3px;
}

.arrow-right-white:after{
	content: url("icons/arrow-right-white.svg");
}

.arrow-right-ci:after{
	content: url("icons/arrow-right-ci.svg");
}

.search-ci:after{
	content: url("icons/search-ci.svg");
}

.button:hover .search-ci:after{
	content: url("icons/search-white.svg");
}

.d-flex {
    display: flex !important;
}

.justify-content-between {
    justify-content: space-between !important;
}

.align-items-center {
    align-items: center !important;
}

/* HEADLINES */

h1, h2, h3, h4, h5, h6{
	font-weight:normal;
	margin:0px;
	padding:0px;
	color: #232323;
	text-align: center;
}

h1{
	border-bottom:1px solid #d8d8d8;
	font-size:18px;
	margin-bottom:20px;
	padding-bottom:15px;
}

h2{
	font-weight: 500;
    text-align: center;
    font-size: 32px;
    padding-bottom: 2rem;
}

h3{
	font-size:20px;
}

/* LIST PACKAGES & PACKAGES DETAILS */

h5 {
	box-sizing:border-box;
	overflow: hidden;
	padding: 0px;
	color: #ffffff;
	font-size: 18px;
	font-weight: normal;
	margin: 20px 0 0 0;
	cursor:pointer;
}

	.packages h5 div:nth-child(1){
		 padding: 5px 0;
		 border-bottom: 1px solid #ccc;
	 }

	.packages h5 div:nth-child(1) > span:first-child{
		 font-size: 24px;
		 font-weight: bold;
		 white-space: nowrap;
		 overflow: hidden;
		 text-overflow: ellipsis;
	 }

	.packages h5 div:nth-child(1) span:nth-child(2){
		color: #000;
		font-size: 19px;
	}

	.packages h5 div:nth-child(2){
		padding: 5px 10px;
		background:#f1f1f1;
		color: #919191;
		font-size: 14px;
	}

	.packages h5{
		width:100%;
		position: relative;
	}
	.packages h5 span:nth-child(2),
	.packages h5 span:nth-child(3){
		font-size: 14px;
	}

	.packages h5 span:nth-child(2){
		text-align: right;
	}

	.packages h5 div:nth-child(1) > span:nth-child(1):before{
		font-family: FontAwesome;
		content: "\f1b2";
		margin-right: 10px;
		font-weight: normal;
	}


	.packages h5 div:nth-child(2) span.packageButton:after{
		font-family: FontAwesome;
		content: "\f0d7";
		margin-left: 10px;
		font-size: 16px;
	}

		.packages h5 div:nth-child(2) span.packageButton.active:after{
			content: "\f0d8";
		}

		 .packages h5 a{
			color:#fff;
		 }

.switcher{
	display:none;
	float: left;
  background: #f1f1f1;
	padding: 0 10px;
	width: 100%;
}

.hautp_reaser .button.small{
	width: auto;
	margin: 20px 0 0 0;
}

.denied,
.warning,
.success{
	color: #fff;
	padding: 10px;
	margin-bottom: 20px;
}

.denied{
	background:#d10404;
}

.warning{
	background:#ec971f;
}

	.denied span:before,
	.warning span:before{
			font-family: FontAwesome;
			content: "\f071";
			margin-right: 10px;
		}

.success{
	background:#22b14c;
}

	.success span:before{
			font-family: FontAwesome;
			content: "\f00c";
			margin-right: 10px;
		}



/* FORM TAGS */

form{
	margin: 0;
}

input{
	padding: 0 10px;
	line-height: 26px;
	height: 26px;
	border-radius: 15px;
}

input[type="text"],
input[type="password"]{
	padding: 0 1rem;
	line-height: normal;
	height: 39px;
	vertical-align: middle;
	-webkit-appearance: none;
  	appearance: none;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

input[type="checkbox"]{
	line-height: normal;
	height: auto;
}

input[type="radio"] {
  border-radius: 100%;
  padding: 10px;
  height: 15px;
}

input, textarea{
	font-family: inherit;
	font-size: inherit;
	margin: 0;
	background: #fff;
	color: #6c6d70;
}

#generalForm.missedpassword input.button.small{
	width: auto;
}

#generalForm.register  .checkboxWrap span{
	margin: -4px 0 0 10px;
}

#generalForm.register input.button.small{
	width: auto;
	height: fit-content;
}

/* GRAPHICAL SELECT */

.graphical-select{
	cursor:pointer;
}

	.graphical-select ul{
		background: #fff;
		list-style: none;
		padding: 10px 10px 10px 10px;
		margin: 0;
		position: absolute;
		left: -1px;
		top: 26px;
		z-index: 3;
		right: -1px;
		-webkit-border-bottom-right-radius: 20px;
		-webkit-border-bottom-left-radius: 20px;
		-moz-border-radius-bottomright: 20px;
		-moz-border-radius-bottomleft: 20px;
		border-bottom-right-radius: 20px;
		border-bottom-left-radius: 20px;
	}

	.graphical-select div{
		position:relative;
		font-family: inherit;
		font-size: 14px;
		margin: 0;
		border-radius: 15px;
		background: #fff;
		color: #757575;
		line-height: 39px;
		padding:0 10px;
	}

	.graphical-select div span{
		display: block;
		height: 39px;
		padding: 0 1rem;
		position: relative;
		z-index: 2;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.graphical-select li{
		transition: all 300ms;
		padding: 0 1rem;
	}
	

	.graphical-select li:hover{
		color:#000;
	}

		.graphical-select div span:after{
			font-family: FontAwesome;
			content: "\f107";
			font-size: 20px;
			right: 10px;
			position: absolute;
		}

/* CHECKBOXES */

i.checkbox{
	height: 18px;
	width: 18px;
	display: inline-block;
	margin-right: 5px;
}

i.checkbox:before{
	font-family: FontAwesome;
	content: "\f096";
	color: #b4b4b4;
	font-style: normal;
	font-size: 18px;
}

	i.checkbox.active:before{
		content: "\f14a";
		margin-right: 4px;
	}

/* RADIOS */

i.radio{
	height: 18px;
	width: 18px;
	display: inline-block;
	margin-right: 5px;
}

i.radio:before{
	font-family: FontAwesome;
	content: "\f10c";
	color: #fff;
	font-style: normal;
	font-size: 18px;
}

	i.radio.active:before{
		content: "\f192";
		margin-right: 5px;
	}

.clear{
	clear:both;
	padding:0;
	margin:0;
}

.wrapper{
	position:relative;
	width:1160px;
	margin:0 auto;
}

.plattformLogo img {
	width: 236px;
	float: right;
}
.vehicleListLang img {
	width: 20px;
}

/* *************************************************************************************************************** */
/* ################################################### LOGIN ##################################################### */
/* *************************************************************************************************************** */

.MainWindow{
	position:absolute;
	z-index:999;
	top:0;
	left:0;
	bottom:0;
	background: url("images/bymycar-banner.jpg");
	width: 100%;
	height: 100%;
	background-size: cover;
}

.MainWindow .logo{
	width: 150px;
	margin-bottom: 1rem;
}

	.MainWindow.ShowMenu{
		top:130px;
	}

	#LoginLayer .mobile {
	 border: none;
	}

.LayerHead {
	box-sizing: border-box;
	margin: 0;
	width: 100%;
	}

.LoginBoxTop{
	margin-bottom:15px;
}

.LoginBoxTop .text{
	font-size: 22px;
	float:left;
}

.LoginBoxTop div:nth-child(2){
	float:right;
}

#LoginLayer .centerBox {
	background: #000;
	clear: both;
	margin: 30px auto;
	padding: 40px;
	position: relative;
	max-width:560px;
	border-radius: 20px;
	font-size: 14px;
	-webkit-box-shadow: 0px 0px 14px 2px rgba(0,0,0,0.29);
	-moz-box-shadow: 0px 0px 14px 2px rgba(0,0,0,0.29);
	box-shadow: 0px 0px 14px 2px rgba(0,0,0,0.29);
	color: #fff;
}

#LoginLayer #msg_login{
	color:#dddddd;
	margin-bottom:20px;
}

#LoginLayer input[type="text"],
#LoginLayer input[type="password"]{
	width:100%;
	margin-bottom:10px;
}

#LoginLayer .Buttons{
	margin-top:35px;
	float: left;
	width:100%;
}

#LoginLayer .Buttons div{
	float: left;
}

#LoginLayer .Buttons div:nth-child(2){
	float:right;
}

#LoginLayer #footer{
	position: absolute;
	width: 100%;
	bottom: 50px;
}

#LoginLayer .footer-gardient{
	position: absolute;
	bottom: 0;
	width: 100%;
}

#LoginLayer .stay-logged-in{
	margin-top: 5px;
}

#LoginLayer .stay-logged-in input{
	margin-top: 2px;
}

#LoginLayer .stay-logged-in input,
#LoginLayer .stay-logged-in span{
	float: left;
}

#LoginLayer .stay-logged-in span{
	margin: 0px 0 0 5px;
	color:#dddddd;
}

#LoginLayer #flags a{
	padding: 0 2px;
}

.center a {
	display: block;
	float: left;
	margin: 20px 30px;
	padding: 10px;
}

.center a:first-child,
.center a:last-child{
	margin: 20px 0;
}

/* *************************************************************************************************************** */
/* ################################################ MESSAGES ##################################################### */
/* *************************************************************************************************************** */

#err-msg,
#contact-main_err{
	background:#d80000;
	color: #fff;
	font-size: 14px;
	padding: 5px;
	margin-bottom: 20px;
}

/* *************************************************************************************************************** */
/* ################################################ BUTTONS ###################################################### */
/* *************************************************************************************************************** */

.buttonBar{
	margin:40px 0;
	width: 100%;
	padding:0;
	float: left;
}

.button.small.gardient2.l50,
.button.small.gardient2.m50,
.button.small.gardient2.s50,
.button.small.white.l50,
.button.small.white.m50,
.button.small.white.s50{
	min-width: 50%;
}

.button{
	cursor: pointer;
	transition: all 300ms;
}

.button.small	{
	transition: all 300ms;
	font-size: 12px;
	padding: 12px 30px;
	border:1px solid #fff;
	color: #fff;
	margin-bottom: 5px;
	cursor: pointer;
	line-height: initial;
	font-weight: 500;
	text-transform: uppercase;
	display: inline-flex!important;
	justify-content: center !important;
}

.button.small.transparent{
	background: rgba(181, 153, 96, 0.15);
	color:#b59960;
	border: 1px solid rgba(181, 153, 96, 0.10);
}

	.button.small.transparent:hover	{
		color:#fff;
	}

	.button.small:hover	.arrow-right-white:after{
		transform: translateX(10px);
		position: relative;
	}

	/*.button.small > span{
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
   }*/

	.button.small span		{
		position: relative;
		display: inline-flex;
	}

	



/* BUTTON BACKWARDS */

.button.small.backwards{
	background: #232323;
	border: 1px solid transparent;
	color: #fff;
}

.button.small.backwards span{
	color: #fff;
}

/* BUTTON FORWARDS */

	.button.small.forwards span{
		color: #fff;
	}

		.button.small.forwards::after{
			font-family: FontAwesome;
			content: "\f0da";
			padding-left: 10px;
			font-size:18px;
			vertical-align: middle;
			float: right;
		}

		.button.small.forwards span > span::after{
			content: "";
		}

/* BUTTON FORWARDS GREY */

	.button.small.forwards.grey{
		background: #e4e4e7;
		background: -moz-linear-gradient(top, #e4e4e7 0%, #fcfcfc 100%);
		background: -webkit-linear-gradient(top, #e4e4e7 0%,#fcfcfc 100%);
		background: linear-gradient(to bottom, #e4e4e7 0%,#fcfcfc 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4e4e7', endColorstr='#fcfcfc',GradientType=0 );
		text-align: center;
	}

	.button.small.forwards.grey span{
		color: #6c6d70;
	}

	.button.small.forwards.grey.active span{
		color: #fff;
	}

		.button.small.forwards.grey::after{
			font-family: FontAwesome;
			content: "\f0da";
			padding-left: 10px;
			font-size:18px;
			vertical-align: middle;
			float: right;
			color: #6c6d70;
		}

		.button.small.forwards.grey span span{
			float: left;
		}

	.button.small.forwards.grey.dark{
		background: #232323;
		width: 100%;
	}

	#quickSearchOverlay .button.small.forwards.grey.dark::after{
			font-family: FontAwesome;
			content: "\f0da";
			padding-left: 10px;
			font-size:18px;
			vertical-align: middle;
			float: right;
			color: #fff;
		}

	.button.small.forwards.grey.dark::after{
		content: "";
	}

	.button.small.forwards.grey.dark span {
    color:#fff;
	}

	#quickSearchOverlay .button.small{
		font-size: 12px;
		float: none;
	}

		#quickSearchOverlay .button.small.forwards.grey.dark span::before{
			content: "";
			width: inherit;
			margin: 0;
			display: inherit;
		}

		#quickSearchOverlay .button.small.forwards.grey span::before{
			font-family: FontAwesome;
			content: "\f1b9";
			padding-right: 10px;
		}

		#quickSearchOverlay .button.small.forwards.grey span{
			float: none;
		}

		#quickSearchOverlay .button.small.forwards.grey.dark span{
			float: left;
		}

		#quickSearchOverlay .button.small.forwards.grey::after{
			content: "";
		}

		#mini_vehiclesFound{
			padding:0 5px 0 0;
		}

/* BACK LINK */

.back-link{
	padding: 10px 0;
}

	.back-link span::before{
		font-family: FontAwesome;
		content: "\f0d9";
		padding-right: 10px;
		font-size:18px;
		vertical-align: middle;
	}

	.button.small #vehiclesFound{
		padding-right: 5px;
		float: left;
	}

/* BUTTON MENU */

.button.small.menu{
	background: #e4e4e7;
	background: -moz-linear-gradient(top, #e4e4e7 0%, #fcfcfc 100%);
	background: -webkit-linear-gradient(top, #e4e4e7 0%,#fcfcfc 100%);
	background: linear-gradient(to bottom, #e4e4e7 0%,#fcfcfc 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4e4e7', endColorstr='#fcfcfc',GradientType=0 );
	line-height: 21px;
	padding: 4px 6px;
	width: 100%;
}

	.button.small.menu:hover{
	opacity: 1;
	color: #fff;
	}

	.button.small.menu:hover span{
		color: #fff;
	}

	.button.small.menu.active span{
		color: #fff;
	}

	.button.small.menu span{
		color: #000;
	}

		.button.small.menu span::before{
			font-family: FontAwesome;
			content: "\f0da";
			margin-right: 10px;
			font-size:18px;
			vertical-align: middle;
			color: #fff;
			padding:2px 7px;
		}

/* ****************************************************************************************************************** */
/* ################################### VEHICLE STOCK BOXES START PAGE ############################################### */
/* ****************************************************************************************************************** */

.stock{
	padding: 3rem 0;
}

.auction-stock:after,
.buy-now-stock:after,
.package-stock:after{
	width: 150px;
    display:inline-block;
    transition: transform 0.3s ease, content 0.3s ease;
}

.stock a:hover .auction-stock:after,
.stock a:hover .buy-now-stock:after,
.stock a:hover .package-stock:after{
	transform: rotate(360deg);
}

.auction-stock:after{
	content: url(icons/auction-stock.svg); 
}

.stock a:hover .auction-stock:after{
	content: url(icons/auction-stock-ci.svg);
}

.buy-now-stock:after{
	content: url(icons/stock-buy-now.svg);
}

.stock a:hover .buy-now-stock:after{
	content: url(icons/stock-buy-now-ci.svg);
}

.package-stock:after{
	content: url(icons/package-stock.svg);
}

.stock a:hover .package-stock:after{
	content: url(icons/package-stock-ci.svg);
}

.stock a {
    padding: 2rem;
	text-align: center;
}

.stock span {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 20px;
    padding: 1rem 0;
    color: #232323;
}

.stock .anzahl {
    text-align: center;
}

.stock .anzahl span{
	color: #fff;
    padding: 0.5rem;
    display: inline-block;
    width: 37px;
    font-size: 16px;
    border-radius: 100%;
}

.stock a:hover .anzahl span{
	color: #fff;
}




.stock .column {
	color: #fff;
	margin: 15px 0;
}

.stock .box {
	position: relative;
	padding: 10px;
	max-height: 180px;
	min-height: 180px;
	overflow: hidden;
	background: #232323;
	cursor: pointer;
	border-radius: 20px;
}

.stock .box img {
	max-width: 200px;
	max-height: 100px;
	position: absolute;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	left: 50%;
}

.stock .box span {
	display: block;
	text-align: center;
	position: absolute;
	bottom: 25px;
	width: 100%;
	padding: 10px 0;
	left: 0;
	color: #fff;
	font-size: 16px;
}

.stock .box.packages img{
	bottom: 59px;
}

.stock .box .anzahl{
	position: absolute;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	left: 50%;
	bottom: 3px;
	font-weight: bold;
	color: #fff;
}


/* ****************************************************************************************************************** */
/* ################################################ QUICKLINKS ###################################################### */
/* ****************************************************************************************************************** */

.QuicklinkBackground {
	background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #ffffff 0%, #f2f2f2 100%) repeat scroll 0 0;
	padding: 10px 20px;
}

#quickLinks{
	margin-bottom:40px;
	float: left;
}

#quickLinks2 .QuicklinkBackground {
	padding: 10px 20px 10px 0px;
}

#quickLinks2 .QuicklinkBackground {
	height: 60px;
}
/* ------------- CONTAINER -------------- */

#container{
	width:100%;
}
/* ****************************************************************************************************************** */
/* #################################################### HEADER ###################################################### */
/* ****************************************************************************************************************** */

#header{
	width:100%;
	font-size:14px;
	position: relative;
	position: fixed;
	top: 0;
	z-index: 4;
}

.headerWrap{
    align-items: center;
    display: flex;
	justify-content: space-between !important;
	padding: 1rem 2rem;
	background: rgba(0, 0, 0, 0.9);
}

.start .headerWrap{
	background: none;
}

.top-line{
	height: 29px;
}

#logo{
	margin:10px 119px 0 0;
	float:left;
}

#logo img{
	width: 150px;
}

.headSlogan{
	float:right;
	font-size: 16px;
	margin-top: 30px;
}

	.headSlogan span{
		font-weight: bold;
		float: left;
	}

	#menu .headSlogan a{
		float: left;
		line-height: inherit;
		padding: 0 0 0 5px;
	}

	.headSlogan span:before{
		font-family: FontAwesome;
		content: "\f095";
		margin-right: 5px;
	}

#menu .headSlogan{
	padding: 0;

}

#menu a#logo{
	padding: 0;
}

/* ****************************************************************************************************************** */
/* ###################################################### MENÜ ###################################################### */
/* ****************************************************************************************************************** */

#menu{
	font-size: 16px;
}

#menu .wrapper{
	width: 100%;
	padding: 1rem;
	flex-direction: row;
    align-items: center;
    display: flex;
}

	#menu a{
		color:#fff;
		position:relative;
		float:left;
		transition: all 300ms;
	}

	#menu a.active,
	#menu a:hover{
		
	}

	#menu .headslogan a,
	#menu .headslogan a:hover,
	#menu a#logo,
	#menu a#logo:hover{
		
	}

		#menu #stock a:first-child{
			padding-left: 35px;
		}

		#menu a:hover{
			text-decoration:none;
		}

		#menu a span{
			padding: 0px 20px;
		}

		#menu a:nth-child(2) span{
			border: none;
		}

		a.logout,
		a.login{
			color: #fff;
			float: right;
			margin-top: 4px;
		}

		a.logout,
		a.login{
			padding: 2px 7px 4px;
			display: flex;
    		align-items: center !important;
			font-size: 16px;
			transition: all 300ms;
		}

			a.logout:hover,
			a.login:hover{
				color: #b59960;
			}

		a.logout span:after,
		#mobileUserMenuOpen span:after{
			content: url(icons/login.svg);
			width: 20px;
			display: block;
			margin-left: 3px;
			transition: transform 0.3s ease, content 0.3s ease;
		}

		#mobileUserMenuOpen span:after{
			border-radius: 100%;
			padding: 0.4rem;
		}
		
		a.logout:hover span:after {
			content: url(icons/logout.svg);
			transform: rotate(360deg);
		}

		a.login span:after{
			font-family: FontAwesome;
			content: "\f090";
			margin-left: 5px;
		}

		#cart-icon {
			display: flex;
			align-items: center !important;
		}

		#cart-icon span:after{
			content: url(icons/shopping-cart.svg);
			width: 20px;
			display: block;
			margin-left: 3px;
			transition: transform 0.3s ease, content 0.3s ease;
		}
		
		#cart-icon:hover span:after,
		#cart-icon.active span:after{
			content: url(icons/shopping-cart-ci.svg);
			transform: rotate(360deg);
		}

		a#cart-icon span{
			padding: 0;
		}

		#menu .LngSelecter a,
		#menu .StockSelecter a{
			background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
			color: #fff;
			display: block;
			float: none;
			line-height: 37px;
			padding: 0 15px;
			width: 100%;
		}

		#Stock {
			float: left;
			margin: 0;
			position: relative;
		}

/* ------------- MENÜ NEU -------------- */

.menu {
	line-height: 1;
	margin: 0 auto 3em;
}

.menu__list {
	position: relative;
	/*display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;*/
	margin: 0;
	padding: 0;
	list-style: none;
}

.menu__item {
	display: block;
	margin: 1em 0;
}

.menu__link {
	font-size: 1.05em;
	display: block;
	padding: 1em;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-touch-callout: none;
	-khtml-user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.menu__link:hover,
.menu__link:focus {
	outline: none;
}

/* Trinculo */
.menu--trinculo .menu__item {
	margin: 0 1.75em;
}

.menu--trinculo .menu__link {
	position: relative;
	padding: 1em 0.1em;
	text-align: center;
	color: #000;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
}

.menu--trinculo .menu__link:hover,
.menu--trinculo .menu__link:focus {
	color: #e67037;
}

.menu--trinculo .menu__link::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 4px;
	opacity: 0;
	background: #e67037;
	-webkit-transform: scale3d(0, 1, 1);
	transform: scale3d(0, 1, 1);
	-webkit-transform-origin: 100% 50%;
	transform-origin: 100% 50%;
	-webkit-transition: -webkit-transform 0s 0.2s, opacity 0.2s;
	transition: transform 0s 0.2s, opacity 0.2s;
}

.menu--trinculo .menu__item--current .menu__link::before {
	opacity: 1;
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
	-webkit-transition: -webkit-transform 0.2s, opacity 0.1s;
	transition: transform 0.2s, opacity 0.1s;
	-webkit-transition-delay: 0.35s;
	transition-delay: 0.35s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}

.menu--trinculo .menu__helper {
	display: block;
	pointer-events: none;
}

.menu--trinculo .menu__item--current .menu__helper {
	-webkit-animation: anim-trinculo 0.6s forwards;
	animation: anim-trinculo 0.6s forwards;
}

@-webkit-keyframes anim-trinculo {
	50% {
		opacity: 0;
		color: #000;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}

	51% {
		opacity: 0;
		color: #e67037;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}

	75% {
		opacity: 1;
		-webkit-transform: translate3d(5px, 0, 0);
		transform: translate3d(5px, 0, 0);
	}

	100% {
		opacity: 1;
		color: #e67037;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes anim-trinculo {
	50% {
		opacity: 0;
		color: #929292;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}

	51% {
		opacity: 0;
		color: #000;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}

	75% {
		opacity: 1;
		-webkit-transform: translate3d(5px, 0, 0);
		transform: translate3d(5px, 0, 0);
	}

	100% {
		opacity: 1;
		color: #e67037;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

/* Media queries */

/* Stack items for smaller screens */
@media screen and (max-width:55em) {
	.menu__list {
		display: block;
		margin: 0 auto;
	}
}

/* ------------- LNG SELECTER -------------- */

#menu .LngSelecter{
	display: none;
	position: absolute;
	top: 60px;
	z-index: 1000;
}

	#menu .LngSelecter a{
		width:100%;
		float: left;
		display: block;
		background: rgba(0,0,0,0.8);
		color:#fff;
		line-height: 37px;
	}

	#menu .LngSelecter span{
		float: left;
	}

	#menu .LngSelecter span.flag-icon{
		float: right;
		margin-top: 10px;
	}

 #menu #languages > a:first-child{
	padding: 0px 35px;
	}

#userMenu{
	float:right;
}

#mobileMenu {
	display: none;
}
	.navi-button.active span {
		background: none!important;
	}

	body .navi-button.active span:before {
		top: 0!important;
		transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-o-transform:rotate(45deg);
	}

	body .navi-button.active span:after {
		bottom: 0!important;
		transform:rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
	}

	.navi-button span:before,
	.navi-button span:after {
		transition-duration: 0.3s, 0.3s;
		-moz-transition-duration: 0.3s, 0.3s;
		-o-transition-duration: 0.3s, 0.3s;
		transition-delay: 0.03s, 0s;
		-moz-transition-delay: 0.03s, 0s;
		-o-transition-delay: 0.03s, 0s;
	}

	.navi-button span {
		transition: background 0s 0.15s;
		-moz-transition: background 0s 0.15s;
		-o-transition: background 0s 0.15s;
	}

	.navi-button.active span {
		transition: background 0s 0.01s;
		-moz-transition: background 0s 0.01s;
		-o-transition: background 0s 0.01s;
	}

	.navi-button.active span:after,
	.navi-button.active span:before {
		transition-duration: 0.3s, 0.3s;
		-moz-transition-duration: 0.3s, 0.3s;
		-o-transition-duration: 0.3s, 0.3s;
		transition-delay: 0.03s, 0s;
		-moz-transition-delay: 0.03s, 0s;
		-o-transition-delay: 0.03s, 0s;
	}

	#mobileMenu .navi-button span {
		display: block;
		position: absolute;
		top: 10px;
		left: 0px;
		right: 0;
		height: 5px;
		width: 40px;
		background: #fff;
	}

	#mobileMenu .navi-button span:before, .navi-button span:after {
		position: absolute;
		display: block;
		left: 0;
		width: 100%;
		height: 5px;
		background-color: #fff;
		content: "";
	}

	#mobileMenu .navi-button span:after {
		bottom: -10px;
	}

	#mobileMenu .navi-button span:before {
		top: -10px;
	}



#userMenu #login.basket{
	background:#848484;
	padding: 5px 15px;
}

	#userMenu #login.basket img,
	#userMenu #login.basket span{
		float:left;
	}

	#userMenu #login.basket span{
		line-height: 20px;
		margin-left:5px;
	}

	#userMenu #login.basket a{
		color:#fff;
	}

#Stock .StockSelecter a:first-child{
	padding-left: 35px;
}

/* ------------- LOGO -------------- */

#userMenu #logo{
	float:right;
	margin-bottom:5px;
	padding:0 0 5px 0;
}

/* ------------- LOGIN -------------- */

#login,
#languages,
#basketIcon{
	margin-top: 18px;
}

	.loginInner input{
		width:100%;
	}

/* FLAGS */

img.flagImg {
	margin-bottom: -7px;
}

.login-lang{
	align-items: center;
	display: flex;
    justify-content: flex-end !important;
}

#flags {

}

.flag-icon{
	font-size: 30px;
	transition: all 300ms;
}

.flag-icon:hover{
	transform: scale(1.2);
}

.selectedLng,
.selectedLng:before{
	float: right;
	margin: 0 5px;
}

	.selectedLng:before {
		margin-top: 40px;
	}

/* *************************************************************************************************************** */
/* ############################################### LANGUAGES ##################################################### */
/* *************************************************************************************************************** */

#languages{
	position: relative;
	float: left;
	margin: 0;
}


#userMenu > a{
	display:block;
	float:left;
	text-transform:uppercase;
	position:relative;
	line-height:29px;
	height:29px;
	padding:0px 5px;
}

#userMenu > div > span,
#userMenu > div > a{
	display:inline-block;
}

#userMenu > div span.arrow{
	height:7px;
	width:21px;
	background:url(images/dd-arrows.png) no-repeat right top;
}

#userMenu div .userSub{
	display:none;
	min-width:196px;
	background:#fff;
	position:absolute;
	top:100%; right:0;
	z-index:25;
}

#userMenu div.userSub a	{
	display:block;
	height:29px;
	line-height:29px;
	padding:0px 13px;
	border-top:1px solid #d8d8d8;
}

#userMenu div:hover span.arrow{
	background:url(images/dd-arrows.png) no-repeat right bottom;
}

#userMenu div:hover .userSub{
	display:block;
}

#userMenu div .userSub a:hover{
	color:#1E2A32;
}


#userMenu > div.lng {
	background:url(images/lng-icons.png) no-repeat #fff;
	font-size:12px;
}

#userMenu > div.lng span.selectedLng{
	width:24px;
}

#userMenu > div.lng a{
	background:url(images/lng-icons.png) no-repeat;
	padding-left:45px;
}

#userMenu > div.lng.en
,#userMenu > div.lng .en{
	background-position:10px 0px;
}

#userMenu > div.lng.fr,
#userMenu > div.lng .fr{
	background-position:10px -29px;
}

#userMenu > div.lng.nlbe,
#userMenu > div.lng .nlbe{
	background-position:10px -58px;
}

#userMenu > div.lng.de,
#userMenu > div.lng .de{
	background-position:10px -87px;
}

#userMenu > div.lng.es,
#userMenu > div.lng .es{
	background-position:10px -116px;
}

#userMenu > div.lng.pt,
#userMenu > div.lng .pt{
	background-position:10px -145px;
}

#userMenu > div.lng.it,
#userMenu > div.lng .it{
	background-position:10px -174px;
}

#userMenu > #noOfVehiclesOnNotepad {
	padding-left:30px;
	background:#fff url(images/notepad-compare-icon.png) no-repeat 5px -17px;
}

/* ****************************************************************************************************************** */
/* #################################################### BASKET ###################################################### */
/* ****************************************************************************************************************** */

#basket{}

	a#basketIcon{
		padding:0;
	}

.deleteFromBasket{
	margin:0 0 0 10px;
	float:right;
}

.basketFullPrice{
   margin: 10px 0 0 0;
   font-size: 16px;
}

.basket.button{
   width: auto;
}

#basketform .userAreaList .vehicleListBuyNow.discount,
#basketform .userAreaList .vehicleListLastBid{
	width:35%;
}

.errorVehicle {
    background: rgba(0,0,0,0.1);
    padding: 10px !important;
		opacity: 0.3;
}

/* *************************************************************************************************************** */
/* ########################################### BANNER/ ANIMATION ################################################# */
/* *************************************************************************************************************** */

#animation{
	transform-style:preserve-3d;
	width:100%;
	position:relative;
	overflow:hidden;
	height: 800px;
}

#animation .show{
	overflow:hidden;
}

#animation .animationSlide{
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	max-width: 100%;
	overflow: hidden;
	min-height: 355px;
}

#animation img{
	z-index:5;
	width:100%;
}

	#animation .infoWrap	{
		position:absolute;
		bottom: 9rem;
		width:100%;
	}

	#animation .info{
		position: relative;
		padding: 1rem 2rem;
	}

	#animation .imgHeadline,
	#animation .imgSubline{
		font-size: 45px;
		text-align: center;
		color: #fff;
		text-transform: uppercase;
		max-width: 800px;
		margin: 0 auto;
	}

	#animation .imgHeadline{
		font-weight: 300;
	}

	#animation .imgSubline{
		text-transform: uppercase;
		font-weight: 600;
	}

	#animation .imageNavigator {
    position: absolute;
    bottom: 20px;
    left: 50%;
    padding: 0px;
    margin: 0px;
    width: 1160px;
    transform: translateX(-50%);
    z-index: 14;
}

	#animation .imageNavigator	li{
		background:#ffffff;
		width:17px;
		height:17px;
		cursor:pointer;
		display:inline-block;
		list-style:none;
		margin:0px 10px 0 0;
		-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
	}

	#animation .imageNavigator	li:hover{
		cursor:pointer;
	}

	#animation .imageNavigator .liPrev{
		background:#75AFDC; color:#fff;
	}

	#animation .imageNavigator .liNext{
		background:#75AFDC; color:#fff;
	}

	.posAbsBorderBottom{
		border-bottom: 10px solid #fff;
		display: none;
	}

	#animation + .posAbsBorderBottom {
    display: block;
	}


/* *************************************************************************************************************** */
/* ################################################ CONTENT ###################################################### */
/* *************************************************************************************************************** */

#website{
	position:relative;
	clear:both;
	-webkit-box-shadow: 0px -8px 11px -5px rgba(0,0,0,0.41);
  -moz-box-shadow: 0px -8px 11px -5px rgba(0,0,0,0.41);
	box-shadow: 0px -8px 11px -5px rgba(0,0,0,0.41);
	padding-top: 5.7rem;
}

.start #website{
	padding-top: inherit;
}

#content{
	position: relative;
	padding:30px 0 ;
	min-height: calc(100vh - 17rem);
}

	.stocks img,
	.stocks span{
		float:left;
	}
	.stocks img{
		width:200px;
	}

	.stocks .button.small.gardient2{
		max-width:230px;
	}

	#content .infoLinks{
		margin-top:20px;
	}

/* *************************************************************************************************************** */
/* ############################################### GENERAL FORMS ################################################# */
/* *************************************************************************************************************** */

#generalForm{
	width: 100%;
}

	#generalForm h3{
		font-size:20px;
		padding: 10px 0;
	}

	#generalForm h4{
		font-size:14px;
		font-weight:bold;
		padding: 5px 0;
		border:none;
	}

	#generalForm h3,
	#generalForm h4,
	#generalForm input{
	clear: both;
	}

	#generalForm input,
	#generalForm textarea{
		width:100%;
	}

	#generalForm input[type="file"]{
		border:none;
		box-shadow: none;
	}


	#generalForm .inputWrap,
	#generalForm .checkboxWrap,
	#generalForm .textareaWrap{
		width: 49%;
		float: left;
		padding: 1rem;
	}

	.inputWrap.ust{
		width: 98%!important;
	}

	.register .buttonBar{
		text-align: center;
	}

	#generalForm .checkboxWrap{
			width: 100% !important;
			justify-content: center !important;
			display: flex;
			float: none;
		;
	}

	#generalForm .inputTitle {
		display: block;
		color: #929292;
		padding-bottom: 6px;
	}

	#generalForm .checkboxWrap span{
		margin: 10px 0 0 10px;
	}

	#generalForm .checkboxWrap span,
	#generalForm .checkboxWrap input{
		float: left;
		width: auto;
	}

/* ------------- SEARCH -------------- */

#search{}

/* *************************************************************************************************************** */
/* ################################################ QUICK SEARCH ################################################# */
/* *************************************************************************************************************** */

#quickSearchOverlay{
	position:absolute;
	z-index:1;
	width: 100%;
	top: 10rem;
	background: rgba(255, 255, 255, 0.15);
}

#quickSearchOverlay .wrapper{
width: 100%;
padding: 1rem 2rem;
}

.quickSearchInner div{
	width: 100%;
	gap:0 1rem;
}

#quickSearchOverlay a {
	width: 100%;
}

	/*.searchBox{
		width:100%;
		box-sizing:border-box;
		float:left;
	}

	.searchBox div{
		box-sizing:border-box;
	}

	.searchBox.one input,
	.searchBox.two input,
	.searchBox.three input,
	.searchBox.one select,
	.searchBox.three select{
		width:100%;
	}

	.searchBox.twoA,
	.searchBox.twoB{
		width:50%;
		float:left;
	}

	.searchBox.twoB{
		padding-left:10px;
	}

	.searchBox.twoA select,
	.searchBox.twoB select{
		width:100%;
	}

		.searchBox.button.small.gardient2 span{
			line-height:43px;
		}*/


/* *************************************************************************************************************** */
/* ############################################### DETAIL SEARCH ################################################# */
/* *************************************************************************************************************** */

.load {
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: -1;
}

	.load img {
		top: 50%;
		left: 50%;
		position: absolute;
		transform: translate(-50%,-50%);
		width: 200px;
	}

.bodyColor,
.buyingFormat{
	clear: both;
}
#searchBar{
	overflow: hidden;
}

#searchBar h3{
	text-align: left;
}

#searchBar .button.small.forwards.grey.dark{
	width: auto;
}

#searchBar .search_hd{
	font-size: 20px;
	padding: 15px 0 5px;
	clear: both;
	text-transform: uppercase;
}

#searchBar .button.small.white.clearfix{
	display: block;
}

	#searchBarWrap {
		margin: 0 auto;
		padding: 1rem;
		position: relative;
	}

	#searchBarWrap input[type="text"],
	#searchBarWrap select{
		width:100%;
	}

	.searchBarInner {
    opacity: 0;
    z-index: 1;
	}

	#searchBarWrap .searchVersionBar{
		padding:5px;
		background:#494949;
	}

	#searchBarWrap .searchVersionBar a{
		color: #fff;
	}

	#searchBar .ChackerDiv{
		float:left;
		width:33.333%;
		margin-bottom:10px;
	}

      #searchBar .ChackerDiv img,
      #searchBar .ChackerDiv span{
				float:left;
      }

	.saveSearch{
		float:right;
	}

	#searchBar .button.small.white{
		float:left;
		max-width: 250px;
	}

	#searchBar .button.small.gardient2{
		float: right;
	}

	#searchBar h2{
		font-weight: 500;
		clear: both;
		width: 100%;
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.kfz_typ_img{
		margin-bottom: 20px;
		margin-right: 25px;
	}

	.kfz_farbe_img{
		margin-right:3px;
		margin-left:0px;
		margin-bottom:5px;
		width:17px;
	}

	#kfz_farbe br{
		display: none;
	}

/* ------------- FILL TYPE-------------- */

	.fillType{
		margin: 20px 0 20px 0;
		float: left;
	}

	.fillType div{
		float: left;
		margin: 10px 20px 0 0;
	}

/* ------------- BODY COLOR -------------- */

.bodyColor{
	float: left;
	margin: 6px 0 20px 0;
}

	.bodyColor div{
		float: left;
	}

	.CarColor{
		border-radius: 100%;
		width: 20px;
		height: 20px;
		float: left;
		margin: 10px 10px 0 0;
		position: relative;
	}

		.CarColor.active:before{
			font-family: FontAwesome;
			content: "\f00c";
			color: #000;
			font-size: 27px;
			margin: -4px 0 0 -1px;
			position: absolute;
			font-style: initial;
		}

	/* WHITE */

	.CarColor.white{
		background: #fff;
		border: 1px solid #ccc;
	}

		.CarColor.white.active:before{
			color: #ffffff;
		}

	/* SILVER */

	.CarColor.silver{
		background: #a8a8a8;
	}

		.CarColor.silver.active:before{
			color: #a8a8a8;
		}

	/* DARK GREY */

	.CarColor.darkGrey{
		background: #6d6d6d;
	}

		.CarColor.darkGrey.active:before{
			color: #6d6d6d;
		}

	/* BLACK */

	.CarColor.black{
		background: #000;
	}

		.CarColor.black.active:before{
			color: #000;
		}

	/* FAWN */

	.CarColor.fawn{
		background: #ddd8aa;
	}

		.CarColor.fawn.active:before{
			color: #ddd8aa;
		}

	/* YELLOW */

	.CarColor.yellow{
		background: #ffe100;
	}

		.CarColor.yellow.active:before{
			color: #ffe100;
		}

	/* GOLD */

	.CarColor.gold{
	background: #ffc700;
	}

		.CarColor.gold.active:before{
			color: #ffc700;
		}

	/* ORANGE */

	.CarColor.orange{
		background: #ffad3d;
		clear: both;
	}

		.CarColor.orange.active:before{
			color: #ffad3d;
		}

	/* RED */

	.CarColor.red{
		background: #d53d38;
	}

		.CarColor.red.active:before{
			color: #d53d38;
		}

	/* VIOLET */

	.CarColor.violet{
		background: #a134c3;
	}

		.CarColor.violet.active:before{
			color: #a134c3;
		}

	/* BLUE */

	.CarColor.blue{
		background: #3f2cc3;
	}

		.CarColor.blue.active:before{
			color: #3f2cc3;
		}

	/* PURPEL */

	.CarColor.purple{
		background: #00c4ad;
	}

		.CarColor.purple.active:before{
			color: #00c4ad;
		}

	/* BROWN */

	.CarColor.brown{
		background: #aa5712;
	}

		.CarColor.brown.active:before{
			color: #aa5712;
		}

	/* GREEN */

	.CarColor.green{
		background: #3ecb56;
	}

		.CarColor.green.active:before{
			color: #3ecb56;
		}

	.CarColor.active{
		border: 1px solid transparent;
		background: transparent;
	}

.bodyColor div:last-child{
	width: 100%;
	margin: 10px 0 0 0;
}

/* ------------- BUYING FORMAT -------------- */

.buyingFormat{
	float: left;
	margin: 20px 0 20px 0;
}

	.buyingFormat div{
		float: left;
		margin: 10px 20px 0 0;
	}

/* ------------- BODY TYPE -------------- */

.bodyType{
	float: left;
	margin: 0 0 20px 0;
	clear:both;
}

	.bodyType div{
		float: left;
		margin: 0;
	}

	.bodyType img path{
		fill:#b4b4b4;
	}

	i svg path {
			fill: #232323;
	}


/* ------------- GEAR TYPE-------------- */

.gearType{
	margin: 20px 0 20px 0;
	float: left;
}

	.gearType div{
		float: left;
		margin: 10px 20px 0 0;
	}

/* ------------- QUICK LINKS -------------- */

#quickLinks p{
	font-size: 14px;
	margin: 0;
}

#quickLinks,
#quickLinks2{
	position:relative;
	float: left;
	margin-bottom: 20px;
	padding: 0 0 10px;
	width: 100%;
}

	#quickLinks > div{
		float: left;
		margin-top:15px;
	}

	#quickLinks select{
		float:right;
		margin:10px 0 0;
	}

	#quickLinks a {

	}

		#quickLinks span{

		}

		#quickLinks .stocks span{
			font-size:18px;
			font-weight:bold;
			margin-bottom: 12px;
			margin-left: 10px;
		}

		#quickLinks .stocks a span{
			font-size:inherit;
			font-weight:normal;
			margin-left: 0px;
		}

		#quickLinks .stocks h3{
			font-size: 22px;
			font-weight: 600;
		}

		#quickLinks .stocks div h3{
			color:#000;
			font-size: 18px;
			margin: 10px 0;
		}


	#quickLinks #content{
		font-size:18px;
	}

	#quickLinks .infoLinks a,
	#quickLinks .infoLinks span{
		font-size:14px;
		float:left;
		padding:0 10px 0 0;
	}

		#quickLinks > div:nth-child(1) h2 span{
			margin-left:10px;
			margin-bottom: 30px;
		}

		#quickLinks > div:nth-child(1) h2 img,
		#quickLinks > div:nth-child(1) h2 span{
			float:left;
			width: 200px;
		}

	#quickLinks > div:nth-child(2){
		padding-left:20px;
	}

/* ************************************************************************************************************************ */
/* ############################################### VEHICLE LIST BOX VIEW ################################################## */
/* ************************************************************************************************************************ */

#vehicleListBox{
	line-height: 21px;
	padding-bottom:2rem;
}

	#vehicleListBox .insidePackage{
		max-width: inherit;
	}

	.BoxName h2,
	.BoxName h3{
		text-align: left;
	}

	.BoxDistance > span{
		padding: 2px 5px;
	}

		.BoxDistance span span{
			float: left;
			padding: 0;
		}

		.BoxDistance span span:first-child{
			padding: 2px 5px 0 0;
		}

		.BoxDistance span.flag-icon{
			font-size: 14px;
			margin-top: 3px;
		}

		.BoxDistance {
			position: absolute;
			right: 1rem;
		}

	.BoxPic,
	.BoxDescript,
	.BoxPrices{
		position: relative;
	}

	.BoxDescript,
	.BoxPrices{
		padding: 15px;
	}

	.BoxPic img{
		max-width: 100%;
		border-radius: 20px;
	}

	.BoxDescript h2{
		font-size: 24px;
    border: none;
    padding-bottom: 5px;
	}

	.BoxDescript h3{
		font-size: 16px;
		color: #333333;
		font-weight: normal;
		padding-bottom: 20px;
		text-transform: uppercase;
	}

	.BoxText span{
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

		.BoxText span:nth-child(odd),
		.BoxPricePositions span:nth-child(odd),
		.BoxTime span:nth-child(odd){
			font-weight: bold;
		}

		.BoxText span span:nth-child(odd),
		.BoxPricePositions span span:nth-child(odd),
		.BoxTime span span:nth-child(odd){
			font-weight: normal;
		}

	.BoxPrices{
		border:1px solid #ebebeb;
		border-radius: 20px;
	}

		.BoxButton{
			margin-bottom: 1.5rem;
		}

			.BoxPrices span span{
				border:none;
			}

		.BoxPricePositions span span:last-child{
			color:#a3a3a3;
		}

	.BoxTime{
		padding-top: 1rem;
	}

		.BoxTime .date:before,
		.BoxTime .clock:before{
			margin-right: 2px;
		}

		.BoxTime .date:before{
			font-family: FontAwesome;
			content: "\f073";
		}

		.BoxTime .clock:before{
			font-family: FontAwesome;
			content: "\f017";
			margin-left: 10px;
		}

		.BoxTime span{
			border: none;
		}

/* *************************************************************************************************************** */
/* ############################################### VEHICLE LIST ################################################## */
/* *************************************************************************************************************** */

/* SORTING */

#vehicleListSort{
	box-sizing:border-box;
	padding:20px 0;
}

	#vehicleListSort h2{
		font-size: 14px;
		padding-top: 4px;
	}

	#vehicleListSort .graphical-select:nth-child(4) div,
	#vehicleListSort .clearfix{
		margin-right:0px;
	}

#vehicleListSiteNumbers{
	width:100%;
	padding:0 0 10px;
	float:left;
}

	#vehicleListSiteNumbers > div{
		float:right;
	}

/* Site Numbering */

.seiten{
	background: #f2f2f2;
	background: -moz-linear-gradient(top, #f2f2f2 0%, #cccccc 100%);
	background: -webkit-linear-gradient(top, #f2f2f2 0%,#cccccc 100%);
	background: linear-gradient(to bottom, #f2f2f2 0%,#cccccc 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#cccccc',GradientType=0 );
	color: #333333;
	display: inline-block;
	font-size: 12px;
	line-height: 30px;
	margin-left: 6px;
	margin-top:10px;
	text-align: center;
	width: 36px;
	height:29px;
	cursor:pointer;
}

	.seiten:hover	{
		font-weight:bold;
		color: #ffffff;
	}

	.seiten_aktiv{
		font-size:16px;
		color: #ffffff;
		display: inline-block;
		font-size: 12px;
		font-weight:bold;
		line-height: 30px;
		margin-left: 6px;
		text-align: center;
		width: 36px;
		height:29px;
		cursor:pointer;
		margin-top:10px;
	}

/* LIST HEAD */

#vehicleListHead{
	float:left;
	width:100%;
	border-bottom: 1px solid #d8d8d8;
}

		#vehicleListHead div{
			box-sizing:border-box;
			padding:10px 0 10px 10px;
			float:left;
		}

		#vehicleListHead div:nth-child(2){
			width:30%;
		}

		#vehicleListHead div:first-child{
			width:25%;
		}

		#vehicleListHead div:nth-child(3){
			width:8%;
		}

		#vehicleListHead div:nth-child(4),
		#vehicleListHead div:nth-child(5),
		#vehicleListHead div:last-child{
			width:12.333%;
		}

		#vehicleListHead div:last-child{
			text-align:right;
		}

#vehicleList{
	position:relative;
	box-sizing:border-box;
	border-bottom: 1px solid #d8d8d8;
	float:left;
	padding:10px 0;
	width:100%;
}

	#vehicleList > div{
		float:left;
		padding:0 0 0 10px;
		box-sizing:border-box;
	}

	#vehicleList > div:first-child{
		padding:0;
	}

	.vehicleListPic{
		position:relative;
		width:25%;
		padding: 0;
	}

	#vehicleList > div.vehicleListPic{
		padding: 0;
	}

		.vehicleListPic img{
			width:100%;
			max-width:263px;
		}

		.insidePackage{
			position:absolute;
			color:#ffffff;
			padding:5px;
			box-sizing:border-box;
			top:0;
			width:100%;
			max-width:263px;
			-webkit-box-shadow: 0 2px 2px rgba(2, 2, 2, 0.5);
			text-align: center;
		}

	.vehicleListDescript{
		width:30%;
	}

		.vehicleListDescript .desc{
			color:#333;
		}

		.vehicleListDescript .date:before,
		.vehicleListDescript .clock:before{
			font-family: FontAwesome;
			margin-right: 5px;
		}

		.vehicleListDescript .date:before{
			content: "\f073";
		}

		.vehicleListDescript .clock:before{
			content: "\f017";
			margin-left: 10px;
		}

      .vehicleListDescript h2{
				font-size: 24px;
				border:none;
				padding-bottom: 5px;
      }

      .vehicleListDescript h3{
				font-size: 19px;
				color: #333333;
				font-weight: normal;
      }

      .vehicleListLang{
				width:8%;
      }

      .vehicleListLangMobile{
				display:none;
      }

      .vehicleListAuctEnd{
				font-size:17px;
      }

      #vehicleList .button.small.forwards{
				position:absolute;
				right:0;
				bottom: 5%;
				max-width: 200px;
      }

		#vehicleList .button.small.mobile{
		display: none;
		}

	/* PRICES */

	.vehicleListStartPrice span,
	.vehicleListHighestBid span,
	.vehicleListBuyNow span{
		display:none;
	}

	.vehicleListStartPrice{
		width:12.333%;
	}

	.vehicleListHighestBid{
		width:12.333%;
	}

	.vehicleListBuyNow{
		text-align:right;
		width:12.333%;
	}

	.vehicleListPackagePrice{
		text-align:right;
		width:37%;
	}

	.vehicleListHighestBid p,
	.vehicleListStartPrice p,
	.vehicleListBuyNow p,
	.vehicleListPackagePrice p{
		margin: 5px 0;
	}


/* *************************************************************************************************************** */
/* ############################################# VEHICLE DETAILS ################################################# */
/* *************************************************************************************************************** */

.backoverview{
	float:left;
	font-size:14px;
	margin-top: 10px;
	margin-bottom:10px;
}

	.backoverview span:before{
		font-family: FontAwesome;
		content: "\f0d9";
		margin-right: 10px;
	}

#vehicleDetail{
}

	#vehicleDetail input{
		max-width:106px;
	}

.close{
	position:absolute;
	top:20px;
	right:20px;
	cursor:pointer;
}
	.close span:after{
		font-family: FontAwesome;
		content: "\f00d";
		font-size: 20px;
	}

	/* HEADLINE AREA WITH PRICES */

	.vehicleDetailHeadline .make{
		font-size: 36px;
		font-weight:bold;
		width:100%;
		line-height: 36px;
		text-transform: uppercase;
	}

	.vehicleDetailHeadline .model{
		font-size: 24px;
		line-height: 29px;
	}

	.vehicleDetailHeadline .v-id{
		color:#a8a8a8;
		line-height: 30px;
	}

		#contentDetailsPackage .green,
		#contentDetailsPackage .red,
		#contentDetails .green,
		#contentDetails .red{
			color:#ffffff;
			font-size: 20px;
			padding:7px;
			margin-bottom:20px;
			text-align: center;
			float: left;
			width: 100%;
		}

		#contentDetailsPackage .green,
		#contentDetails .green{
			background:#22b14c;
		}

		#contentDetailsPackage .red,
		#contentDetails .red{
			background:#d10a0a;
		}

		.grey-bg{
			background: #f2f2f2;
			padding: 20px;
			line-height: 30px;
			border-radius: 20px;
		}

		.grey-bg .column{
			border-bottom: 1px solid #fff;
		}

		.no-bg{
			padding: 20px 0px 20px 10px;
		}

		.auction-info .column:nth-child(2n-1),
		.auction-pricings .column:nth-child(3n-2){
			font-weight: bold;
		}

		.auction-pricings{
			position: relative;
			min-height: 100px;
		}

		.auction-pricings span.arrow::before{
		font-family: FontAwesome;
		content: "\f0d9";
		font-size: 52px;
		position: absolute;
		color:#f2f2f2;
		left: -15px;
		top: 15px;
		}

		/* RAINBOW */

		.rainbow{
			margin: 10px 0 30px;
		}

		.rainbow-pricing{
			font-weight: bold;
			position: absolute;
			bottom:-22px;
		}

		.columns-container-10 > .no-left-p.column{
			padding:0 10px 0 0;
		}

		.columns-container-10 > .no-right-p.column{
			padding:0 0 0 10px;
		}

		/* VEHICLE NOTEPAD */

		.vehicleDetailNotepad{
			width:100%;
			margin-top: 20px;
		}

		.no-right-p .vehicleDetailNotepad{
			margin-top: 110px;
		}

		.vehicleDetailNotepad .button.small.forwards.grey.dark span::before{
			content: none;
		}

		.vehicleDetailNotepad .button.small span{
				float: none;
			}

.notepadVehicleFrame{
	border-bottom:1px solid #d8d8d8;
	padding:20px 0px;
	position: relative;
}

.notepadVehicleFrame .vehicleImage{
	float:left;
	width:214px;
	border:1px solid #e7e7e7;
	background:#f0f0f0;
	height:159px;
	position:relative;
}

.notepadVehicleFrame .notepadVehicleInfo{
	float:left;
	margin:0px 18px;
	padding:10px 0px;
	width:312px;
}

.notepadVehicleFrame .notepadVehicleInfo .title	{
	font-size:14px;
	padding-bottom:10px;
}

.notepadVehicleFrame .notepadVehicleInfo td	{
	padding:1px 0px;
	padding-left:10px;
}

.notepadVehicleFrame .notepadVehicleInfo th	{
	padding:1px 0px;
	text-align:left;
}

.notepadVehicleFrame .notepadVehicleInfo .colBG	{
	background:#f0f0f0;
}

.notepadVehicleFrame .notepadLinks{
	float:right;
	width:120px;
	text-align:right;
	padding:10px 0px;
}

.notepadVehicleFrame .notepadLinks .price	{
	font-weight:bold;
	font-size:14px;
}

.notepadVehicleFrame .notepadLinks .prevPrice	{
	text-decoration:line-through;
	color:#D0D0D0;
	font-size:12px;
	display:block;
}

.notepadVehicleFrame .notepadLinks .discount	{
	font-size:12px;
	display:block;
}

.vehicleListToolsTop{
	padding:0px 0px 10px;
	border-bottom:1px solid #d8d8d8;
	margin-bottom:16px;
}

.notepadVehicleFrame .delete{
		margin:0;
		float:right;
	}

.button.delete span:before{
	font-family: FontAwesome;
	content: "\f1f8";
	font-size: 16px;
}

	.button.delete span:hover:before{
		opacity: 0.5;
	}

	/* BID ENGINES */

   .hLine{
   height: 1px;
   width: 100%;
   margin: 5px 0;
   }

	 .bidLine .CounterReplace{
		line-height: 10px;
	 }

	.vehicleDetailBidEngines .button.small{
		text-align: center;
	}

	.vehicleDetailBidEngines #cntdwn{
		line-height: 16px;
		padding-bottom: 0px;
	}

			.vehicleDetailBidEngines.bidEnginesTwo .button.small{
				width: auto;
			}

							.vehicleDetailBidEngines.bidEnginesOne div span span{
								font-weight:normal;
								font-size:12px;
							}

					.vehicleDetailBidEngines.bidEnginesOne div > span{
						float:left;
					}


							.vehicleDetailBidEngines.bidEnginesOne div.highestBid a,
							.vehicleDetailBidEngines.bidEnginesOne div.buyNow a{
								float:right;
							}

							.vehicleDetailBidEngines.bidEnginesOne div.bid a.button span,
							.vehicleDetailBidEngines.bidEnginesOne div.buyNow a.button span{
								width:auto;
							}

							.vehicleDetailBidEngines.bidEnginesOne div.bid span span,
							.vehicleDetailBidEngines.bidEnginesOne div.highestBid span span,
							.vehicleDetailBidEngines.bidEnginesOne div.buyNow span span{
								color:#919191;
								font-size:10px;
								float:none;
							}

							.vehicleDetailBidEngines.bidEnginesOne .fastBid button.small{
								font-size: 14px;
							}

                .vehicleDetailBidEngines.bidEnginesOne .bid > span:first-child,
                .vehicleDetailBidEngines.bidEnginesOne .highestBid > span:first-child,
                .vehicleDetailBidEngines.bidEnginesOne .buyNow > span:first-child{
               margin-right: 1%;
                }

               #vehicleDetail .button.small span i{
              	margin-right: 5px;
                }


						.vehicleDetailBidEngines.bidEnginesOne button.small span{
						float:none;
						}

						.vehicleDetailBidEngines.bidEnginesOne .button.small span{
							text-align: center;
						}

		/* BID ENGINE TWO */

		.vehicleDetailBidEngines.bidEnginesTwo{}


				.vehicleDetailBidEngines.bidEnginesTwo div.rainbowBidLine{
					margin-top:30px;
				}

				.rainbowBidLine img{
					max-width:100%;
				}

      /* FAST BID */

      .vehicleDetailBidEngines .fastBid{
				margin-top:10px;
      }

			/* RESERVATION */

			.BidEngineLayer {
				position: absolute;
				top: 0;
				bottom: 0;
				width: 100%;
				height: 100%;
				background: rgba(240,240,240,0.9);
				z-index: 9;
				border-left:1px solid #d8d8d8;
				border-right:1px solid #d8d8d8;
			}

			.BidEngineLayer .message-wrapper {
				top: 50%;
				left: 50%;
				position: absolute;
				transform: translate(-50%,-50%);
				-o-transform: translate(-50%,-50%);
				-webkit-transform: translate(-50%,-50%);
				-moz-transform: translate(-50%,-50%);
				-ms-transform: translate(-50%,-50%);
				font-size: 26px;
			}

			.BidEngineLayer .message {
				padding: 5px 10px 8px;
				background: #09a9b5;
				color: #fff;
				border-radius: 4px;
				transform: rotate(-20deg);
				-moz-transform: rotate(-20deg);
				-ms-transform: rotate(-20deg);
				-o-transform: rotate(-20deg);
				-webkit-transform: rotate(-20deg);
				position: relative;
				-webkit-animation-name: message;
				-webkit-animation-duration: 4s;
				-webkit-animation-iteration-count: 3;
				animation-name: message;
				animation-duration: 1s;
				animation-iteration-count: infinite;
				webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.41);
				-moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.41);
				box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.41);
			}

			/* Safari 4.0 - 8.0 */
			@-webkit-keyframes message {
				0%   {background-color:#e67037; }
				50% {background-color:#bc5829; }
				100% {background-color:#db4289; }
			}

			/* Standard syntax */
			@keyframes message {
				0%   {background-color:#e67037; }
				50% {background-color:#bc5829; }
				100% {background-color:#e67037; }
			}

	/* AUCTION DATA */

    #contentDetails,
    #contentDetailsPackage{
			padding: 0px;
    }

    .euroToSek{
			color:#bfbfbf;
    }

	.vehicleDetailData{
		width:50%;
		float:left;
		padding: 20px 0 20px 20px;
	}

		.vehicleDetailData table{
			width:100%;
			font-size: 14px;
			margin-top: 40px;
			line-height: 24px;
		}

					.vehicleDetailData tr td:first-child{
						font-weight:bold;
					}

					.vehicleDetailData tr td{
						padding-bottom:5px;
						width:50%;
					}

       .vehicleDetailDataList div{
					margin-bottom:10px;
					line-height: 26px;
       }

      .vehicleDetailDataList div.item span:first-child{
				font-weight:bold;
				white-space: nowrap;
				text-overflow: ellipsis;
				overflow: hidden;
      }

      .vehicleDetailDataList div span,
      .vehicleDetailDataList div sub{
				float:left;
      }

		#contentDetailsPackage .no-right-p .vehicleDetailNotepad{
			margin-top: 17px;
		}

	/* VEHICLE SLIDER */

	.vehicleDetailSlider{
		width:50%;
		float:left;
		padding-top:37px;
	}

			.vehicleDetailSlider img{
				max-width:100%;
			}

			#MainPic,#MainPic2 {
				position: relative;
				border: 1px solid #666;
				overflow: hidden;
				padding-bottom: 65%;
			}

			#MainPic img,#MainPic2 img{
				width: 100%;
				position: absolute;
			}

			#MainPic span img,
			#MainPic2 span img{
				width: 50px;
				height:50px;
				position:relative;
			}

			/* :::::::: NEU - 06.02.2017:::::::: */

			.Pics {
					overflow: hidden;
					width: 100%;
					position:relative;
					padding-bottom: 15%;
				}

					.pic-container{
						position: absolute;
						width: 100%;
						margin: 10px 0;
					}

					.Pics .column{
						position: relative;
						margin-bottom: 10px;
					}

			.format{
					width: 100%;
					padding-bottom: 60%;
					overflow: hidden;
					position: relative;
				}

				.format img{
					position: absolute;
					width: 100%;
					vertical-align: middle;
				}

				.LightBoxMessage {
					position: absolute;
					background: #037B00;
					color: #fff;
					width: 100%;
					text-align: center;
					padding: 10px;
					bottom: 0;
					font-weight: bold;
					text-transform: uppercase;
				}

				/* ::::::::::::::::::::: */

				#LightBoxAreaArrowRight, #LightBoxAreaArrowLeft {
					position: absolute;
					z-index: 700;
					top: 50%;
					transform: translateY(-50%);
				}

				#LightBoxAreaArrowRight {
					right: 5px;
				}

				#LightBoxAreaArrowLeft {
					left: 10px;
				}

					#LightBoxAreaArrowRight img, #LightBoxAreaArrowLeft img {
					width: 40px;
					}

	/********** Arrows **************/

		#LightBoxArrowRight {
		    position: absolute;
		    right: 10px;
		    top:50%;
		    margin-top:-25px;
		    z-index:10;
		    cursor:pointer;
		}

		#LightBoxArrowLeft {
		    position: absolute;
		    left: 10px;
		    top:50%;
		    margin-top:-25px;
		    z-index:10;
		    cursor:pointer;
		}

			#LightBoxArrowRight img {
	 		   width: 100%;
			}
			#LightBoxArrowRight img:hover {
				opacity:1;
			}

			#LightBoxArrowLeft img {
	 		   width: 100%;
			}
			#LightBoxArrowLeft img:hover {
				opacity:1;
			}


	#LightboxActiveChild {
	    opacity: 0.50;
	    border:5px solid #bf0000 inset;
	}

	/* VEHICLE DECRIPTION */

	.description{
		margin: 10px 0;
	}

	/* VEHICLE FEATURES */

	.vehicleDetailFeaturesHeadline {
			background: #dfdfdf;
			padding: 15px 20px;
			width: auto;
			float: left;
			font-size: 18px;
			font-weight: bold;
			text-transform: uppercase;
			margin-top: 20px;
			cursor: pointer;
			-webkit-border-top-left-radius: 20px;
			-webkit-border-top-right-radius: 20px;
			-moz-border-radius-topleft: 20px;
			-moz-border-radius-topright: 20px;
			border-top-left-radius: 20px;
			border-top-right-radius: 20px;
		}

		.vehicleDetailFeaturesHeadline.active {
			background: #f2f2f2;
		}

		.vehicleDetailFeaturesWrap {
			padding: 20px 20px 1px 20px;
			clear: both;
			background: #f2f2f2;
			-webkit-border-radius: 20px;
			-webkit-border-top-left-radius: 0;
			-moz-border-radius: 20px;
			-moz-border-radius-topleft: 0;
			border-radius: 20px;
			border-top-left-radius: 0;
		}

		.TabContent {
			display: none;
		}

		.TabContent.active {
    display: block;
}

		.vehicleDetailFeatures > div {
			white-space: nowrap;
			text-overflow: ellipsis;
			overflow: hidden;
			margin-bottom: 10px;
		}

		.vehicleDetailFeatures span:before {
			font-family: FontAwesome;
			content: "\f00c";
			margin-right: 10px;

		}

.hautp_reaser.packages {
  margin-bottom: 20px;
}

.hautp_reaser.packages .vehicleListDescript {
    width: 75%;
}


	/* SIMILAR VEHICLES */

	.vehicleDetailSimilar{
	width:100%;
	float:left;
	padding: 40px 0;
	}

			.vehicleDetailSimilar h6{
			padding:20px 0 0;
			}

	.vehicleDetailSimilarBox > div{
	box-sizing:border-box;
	width:25%;
	float:left;
	padding:0 20px 20px 20px;
	border-right: 1px solid #d8d8d8;
	margin-top:20px;
	}

			.vehicleDetailSimilarBox > div:nth-child(4n){
			border:none;
			padding-right:0;
			}

			.vehicleDetailSimilarBox > div:nth-child(4n+1){
			padding-left:0;
			clear:both;
			}

/* *************************************************************************************************************** */
/* ############################################## BID CONFIRMATION ############################################### */
/* *************************************************************************************************************** */

#contentDetails.bid-process{
	padding-top: 20px;
}

p.bid_confirm{
	margin:0;
	padding:0 0 20px;
	}

	.bid_confirm a{
		color:#C90000;
		text-decoration:underline;
		}

.close_x:before{
	font-family: FontAwesome;
	content: "\f00d";
	cursor:pointer;
	position:absolute;
	right: 0px;
	font-size: 26px;
	}

.quickSearchTitle {
    color: #FFFFFF;
    display: block;
    font-size: 16px;
    padding-bottom: 5px;
		text-transform: uppercase;
		font-weight: bold;
}
.searchVersionBar {
    color: #d8d8d8;
}
.searchVersionBar a {
    color: #1e2a32;
    display: inline-block;
    font-size:15px;
}

.quickSearchTitle {
    color: #FFFFFF;
    display: block;
    font-size: 18px;
    line-height: 26px;
}
.searchBox .quickSearchTitle{
    font-size: 14px;
}

#searchSlide {
    color: #fff;
    cursor: pointer;
    font-size: 15px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    clear:both;
}

#searchSlide span:after {
	-webkit-transition: 1s;
	-moz-transition: 1s;
	-ms-transition: 1s;
	-o-transition: 1s;
	transition: 1s;
	display: inline-block;
}

#searchSlide span.rotate:after {
	transform: rotate(180deg);
}


#searchBar{
width:100%;
padding: 0 2rem;
}

#searchBar input,
#searchBar .graphical-select div{
	border: 1px solid #fff;
}

#searchBar .graphical-select ul {
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

#searchBar .button.small.gardient2{
max-width:250px;
}

#searchSlide span {
    display: inline-block;
    height: 30px;
    padding:0 20px;
    width:auto;
}

#searchSlide span:after{
	font-family: FontAwesome;
	content: "\f107";
	margin-left:10px;
	font-size: 20px;
}


#footerRight a:first-child{
background:none;
}

iframe[name="horst"]#head{
	display:none;
	}


#userNavi > div, #userNavi > a {

}

#userNavi #login{
	background:#ffffff;
	}

#userNavi div#login.login,
.loging{
	color:#ffffff;
	display:block;
	padding:0 10px;
	}

#userNavi div .userSub {right:0; left:auto;}

/* *************************************************************************************************************** */
/* ################################################## MY ACCOUNT ################################################# */
/* *************************************************************************************************************** */

.my_account_left{
	width:28%;
	height:auto;
	margin-right:2%;
	float:left;
	}

      .my_account_left h2{
      font-size: 19px;
      font-weight: normal;
      padding-bottom: 18px;
      padding-top: 25px;
      }

      .my_account_left .button.small.gardient2{
      width:100%;
      }

.my_account_left a.bt5{
margin:0 0 70px 0;
}

/* -------------- My Menu ---------------- */

.my_account_menu{}

.my_account_menu .button.small{
	margin-bottom: 10px;
}

.my_account_menu span, .my_account_menu a {
	display:block;
	}

.my_account_menu span:nth-child(6), .my_account_menu span:nth-child(10), .my_account_menu span:nth-child(12) {
	margin-top:20px;
	}

/*

.my_account_menu a {
	background: #ffffff;
	background: -moz-linear-gradient(top,  #ffffff 0%, #f2f2f2 100%);
	background: -webkit-linear-gradient(top,  #ffffff 0%,#f2f2f2 100%);
	background: linear-gradient(to bottom,  #ffffff 0%,#f2f2f2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 );
	padding:15px 20px;
	overflow:hidden;
  line-height:50px;
	color:#333;
	}

    .my_account_menu a span{
    position: relative;
    padding: 0 0 0 33px;
    color: #333;
    line-height: 19px;
    }

    .my_account_menu a span:before{
    font-family: FontAwesome;
    content: "\f0da";
    position: absolute;
    left: 0;
    color: #fff;
    padding: 2px 8px;
    font-size: 14px;
    line-height: 18px;
    }

    .my_account_menu a:hover span:before,
    .my_account_menu a.active span:before{
    font-family: FontAwesome;
    content: "";
    }

    .my_account_menu a:hover span:after,
    .my_account_menu a.active span:after{
    font-family: FontAwesome;
    content: "\f0da";
    position: absolute;
    right: 0;
    color: #fff;
    padding: 2px 8px;
    font-size: 14px;
    line-height: 18px;
    }

			.my_account_menu a:hover,
      .my_account_menu a:hover span {
			color:#ffffff;
			}

		.my_account_menu a.active {
			color:#ffffff;
      line-height:50px;
			}

               .my_account_menu a.active span,
               .my_account_menu a:hover span{
               padding:0 33px 0 0;
               color:#fff;
               position: relative;
               }

		.my_account_menu a.h_active {
			color:#fff;
			}


.my_account_right .button.small{
width:auto;
}

*/

.my_account_right input[name="tel_l"], .my_account_right input[name="mobil_l"]{
    background-color: #FFFFFF;
    border: 1px solid #D8D8D8;
    border-radius: 5px;
    color: #333333;
    float: left;
    font-size: 14px;
    font-weight: normal;
    height: 28px;
    margin: 2px 10px 0 0;
    padding: 0 10px;
    width: 27px;
	}

.my_account_right input[name="tel"], .my_account_right input[name="mobil"]{
    background-color: #FFFFFF;
    border: 1px solid #D8D8D8;
    border-radius: 5px;
    color: #333333;
    float: left;
    font-size: 14px;
    font-weight: normal;
    height: 28px;
    margin: 2px 0 0 0;
    padding: 0 10px;
    width: 235px;
	}

.my_account_right tr:nth-Child(1n) {
	line-height:30px;
	}

.my_inhalt
{
	display:none;
}


img#loadAnim {
    position: absolute;
		left: 50%;
    transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		-o-transform: translateX(-50%);
		top: 200px;
}

/* *************************************************************************************************************** */
/* ################################################# USER AREA ################################################### */
/* *************************************************************************************************************** */

#vehicleList2{
position: relative;
}

#vehicleList2 h2,
#vehicleList2 h3{
	text-align: left;
}

.my_inhalt h2,
.my_account_right h2{
border-bottom: 1px solid #D8D8D8;
line-height: 35px;
margin-bottom: 20px;
padding: 0 0 20px 0;
font-size: 30px;
	}

	.my_account_right h2{
		margin-top: 16px;
		padding: 0 0 18px 0;
	}

.my_account_right{
width:70%;
float:left;
position: relative;
}

   .my_account_right .m100 .button.small.gardient2{
   width: auto;
   max-width: auto;
   }

   .my_account_right .userInfoForm > div:nth-child(2n){
   padding-left:40px;
   }

   .my_account_right .userInfoForm > div.buttonBar:nth-child(2n){
   padding:0;
   }

   .my_account_right .userInfoForm > div input,
   .my_account_right .userInfoForm > div .graphical-select{
   width:100%;
   }

   .my_account_right .userInfoForm > div input.l50,
   .my_account_right .userInfoForm > div input.lm50{
   width:48%;
   }

      .my_account_right .userInfoForm > div input.l50:first-child,
      .my_account_right .userInfoForm > div input.lm50:first-child{
      margin-right:4%;
      }

   .userInfoForm > div{
   margin-bottom: 10px;
   }

#userArea{}

.my_account_right .generateSearchCriteria .l25{
   width:25% !important;
}

.my_account_right .generateSearchCriteria .l50{
   width:50% !important;
}

.my_account_right .generateSearchCriteria .l32{
   width:32% !important;
}

.my_account_right .generateSearchCriteria label{
   margin: 1px 0  0 10px ;

}

.my_account_right .right{
   float:right !important;
}

.my_account_right .generateSearchCriteria .graphical-select div{
   width:100% !important;
}

.formPartName{
	padding-bottom: 10px;
}

.formPartField{
   width: 39%;
}

.MyAccount_TargetText{
   padding: 0  0 20px 0;
}


.StockSelecter{
   display: none;
   position: absolute;
   top: 60px;
   z-index: 999;
	 left: 35px;
}

.notHighestBidderMessage,
.highestBidderMessage{
	color: #fff;
	padding: 5px;
	font-size: 12px;
	text-align: center;
}

.notHighestBidderMessage{
	background: #d10404;
}

.highestBidderMessage{
	background: #2c9b00;
}

/* ------------- USER AREA USER MANAGEMENT -------------- */

	.userEdit div > div	{
	float:left;
	}

	.userEdit input,
	.userEdit .graphical-select{
		margin-bottom: 10px;
	}

	.userEdit div div:first-child {
	width:25%;
	}

	.userEdit div div:nth-child(2) {
	width:75%;
	}

		.userEdit select,
    .userEdit .graphical-select,
    .userEdit div div:nth-child(2) div,
		.userEdit input{
		width:100%;
		}

		.userEdit div div input:nth-child(2){
		margin-left:2%;
		}

	.userEdit.userLoginData{
	background:#F0F0F0;
	float:left;
	width:100%;
	padding:10px;
	}

	.userEdit .button.small{
	float:right;
	margin-top:10px;
	}

	.userEdit .button.small.gray{
	float:left;
	}


/* ------------- USER AREA LISTS -------------- */

	.userAreaList{}

	.userAreaList h2{
		font-size: 24px;
		line-height:21px;
		padding-bottom: 5px;
		border:none;
		margin-bottom: 0px;
	}

	#vehicleList > div.vehicleListPricesUserArea{
		float:right;
	}

	.vehicleListPricesUserArea{
	line-height:22px;
	position: relative;
	}

	.vehicleListPricesUserArea .delete{
		position: absolute;
		top: 0;
		right: 0;
	}


	.vehicleListPricesUserArea div:nth-child(2n+1){
		clear:both;
	}

	.userAreaList .vehicleListBuyNow,
	.userAreaList .vehicleListLastBid{
	text-align:left;
	width:auto;
	}

	.userAreaList .vehicleListBuyNow span{
	display:inline;
	}

.userList {
clear:both;
}

.userList div{
width:100%;
padding:5px;
border-bottom: 1px solid #d8d8d8;
float:left;
}

div.userListHead{
background:#ccc;
width:100%;
border:none;
}

.userList div div{
width:25%;
border:none;
float:left;
}

/* ------------- USER AREA MENU -------------- */

#userMenu .mobileMy_account_menu {
    display:none;
}

#mobileUserMenu{
	z-index:999;
	background-color:#777;
	position:absolute;
	width: 100%;
	font-weight:normal;
	display:none;
	top:32px;
}

#mobileUserMenu > a {
	float: left;
	width: 100%;
	color:#fff;
	padding: 15px 20px;
	box-sizing: border-box;
	border-bottom: 1px solid #333333;
	text-transform:capitalize;
	position: relative;
}

#mobileUserMenu > a:hover{
opacity: 0.5;
}

#mobileUserMenu > a span{
display: block;
padding: 0 0 0 33px;
}

	#mobileUserMenu > a span:before{
		font-family: FontAwesome;
    content: "\f0da";
    position: absolute;
    left: 16px;
		top:12px;
    color: #fff;
    padding: 2px 8px;
    font-size: 14px;
    line-height: 18px;
	}

#userMenu #mobileUserMenuOpen {
    color: #fff;
    float: left;
    line-height: 29px;
    cursor:pointer;
}


#mobileUserMenu > span {
	float: left;
	width: 100%;
	color:#fff;
	background:#333;
	box-sizing: border-box;
	padding: 15px;
}

#userMenu .mobileMy_account_menu {
  z-index: 999;
	padding:0;
}

#userMenu #mobileUserMenuOpen{
	display:none;
}

/* ------------- USER AREA CRITERIA -------------- */

.alert .searchCriteria:first-child{
padding-top:0;
}

.alertHeader{
font-size:18px;
margin-bottom:5px;
}

.searchCriteria{
width:100%;
border-bottom:1px solid #D8D8D8;
padding:20px 0;
}

.searchCriteria a{
float:right;
}

div.alertFields{
float:left;
}


.alertInfo{
color:#8f8f8f;
margin:5px 0;
}
a.alertDelete{
display:inline-block;
background:url(../images/icon-delete.gif) no-repeat right center;
padding-right:15px;
color:#000;
}
	a.alertDelete:hover{
	text-decoration:underline;
	}

.generateSearchCriteria > div	{
	margin-bottom: 10px;
	float: left;
	width: 100%;
}

.generateSearchCriteria div div:first-child{
width: 35%;
}

.generateSearchCriteria div > div {
float: left;
}

.generateSearchCriteria div div:nth-child(2) {
width: 65%;
}

.generateSearchCriteria select,
.generateSearchCriteria input {
width: 100%;
}

.generateSearchCriteria div div select{
float:left;
}

.generateSearchCriteria div div select:nth-child(2){
margin-left: 2%;
}

.generateSearchCriteria label,
.generateSearchCriteria input[type="radio"]{
float:left;
}

.generateSearchCriteria label{
margin:15px 0 0 0;
}

.generateSearchCriteria .button.small{
margin-top: 10px;
}

.generateSearchCriteria .button.small.gray {
float: left;
}

/* ----- USER AREA VEHICLE LIST ------ */

#vehicleList2{
   border-bottom:1px solid #ccc;
   padding:20px 0;
}

   #vehicleList2:first-child{
      padding-top:0px;
   }

   #vehicleList2 div.vehicleListPic,
   #vehicleList2 div.vehicleListDescript,
   #vehicleList2 div.vehicleListPricesUserArea{
      padding:0 10px;
      width:33.333%;
   }

   #vehicleList2 div.vehicleListPic{
      padding-left:0;
   }

   #vehicleList2 div.vehicleListDescript p{
      font-size: 12px;
   }

   #vehicleList2 div.vehicleListPricesUserArea{
      padding-right:0;
      line-height: normal;
   }

      #vehicleList2 .vehicleListPricesUserArea .spacer span{
         margin: 0;
         padding: 0;
      }
         #vehicleList2 .vehicleListPricesUserArea span{
           font-size: 12px;
         }

         #vehicleList2 .vehicleListPricesUserArea div.spacer span:nth-child(2){
            text-align: right;
         }

         #vehicleList2 .vehicleListPricesUserArea:last-child{
            padding-bottom:0;
         }
            #vehicleList2 .vehicleListPricesUserArea div.spacer span:nth-child(2){
               font-weight: normal;
            }

            #vehicleList2 .vehicleListPricesUserArea div.spacer span.euroToSek{
               font-weight: normal;
               text-align: right;
               padding-bottom: 15px;
            }

				#vehicleList2 .button{
					max-width: 100px;
				}




/* :::::::::::::::::::::::::::::::::::::::: USER LIST ::::::::::::::::::::::::::::::::::: */

a.addUser{
margin:0 0 10px 0;
float:left;
}

	a.addUser span:before{
		font-family: FontAwesome;
		content: "\f007";
		margin-right: 5px;
		font-size: 16px;
	}

a.deleteUser span:before{
	font-family: FontAwesome;
	content: "\f1f8";
	font-size: 18px;
}

a.editUser span:before{
	font-family: FontAwesome;
	content: "\f044";
	font-size: 18px;
}

a.addUser:hover{
opacity:0.5;
}

a.addUser div{
padding:0 0 3px 0;
}

a.addUser div,
a.addUser img{
float:left;
}

.userEdit td,
.userLogData td{
padding:5px;
height:35px;
}

.userLogData td{
height:30px;
}

.userEdit td:first-child,
.userLogData td:first-child{
width:170px;
}

table.userLogData{
background:#F0F0F0;
}

.userLogData tr:last-child{
background:#ffffff;
height:50px;
}

.userLogData tr:last-child td{
padding:10px 0 0 0;
}

.userLogData a.button:first-child{
float:left;
}

.userLogData a.button:last-child{
float:right;
}

input[name="BPreis"] + span{
float:left;
margin:6px 0 0;
}

.introduction{
	margin-bottom:20px;
}

.redMessage{
	color:#FF0000;
	border-bottom:1px solid #D8D8D8;
	padding:0 0 20px 0;
}

/* *************************************************************************************************************** */
/* ################################################ POPUPS ####################################################### */
/* *************************************************************************************************************** */

#overlay{
	position:absolute;
	top:0px;
	z-index:20;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.8);
	display:none;
	padding-top: 62px;
}

#content p{
	font-size: 16px;
	line-height: 30px;
}

#content #content{
	padding:0;
	margin-bottom:25px;
}

#contactSalesCenter{
	margin:20px 0 0 0;
}

#overlay .requestInner{
	max-width:500px;
	display: none;
	z-index:999;
	margin: 0px auto;
	transform: translate(0%,50px);
	-webkit-transform: translate(0%,50px);
	-moz-transform: translate(0%,50px);
	-ms-transform: translate(0%,50px);
	-o-transform: translate(0%,50px);
}

.requestInner{
	padding:20px;
	position:relative;
	background:#fff;
}

.error{
	display:block;
	color:#ff0000;
}

#overlay .requestInner h2{
	border:none;
	padding-bottom:0px;
	margin-bottom: 20px;
	color:#2f2f2f;
}

#overlay .button.small{
	min-width: auto;
	max-width: 100px;

}

#overlay .requestInner .buttonBar{
	padding-top:20px;
}

#overlay .requestInner .inputWrap{
	float:left;
	padding-bottom:10px;
}

#overlay .requestInner .formIntro{
	padding-bottom:20px;
}

#overlay .requestInner .textareaWrap.small{
	width:100%;
}

#overlay .requestInner .textareaWrap.small textarea	{
	width:100%;
	height:70px;
}

#overlay .requestInner .inputWrap.small{
	width:100%;
}

#overlay .requestInner .inputWrap.small input{
	width:100%;
}

#overlay .requestInner .textareaWrap.big textarea		{
	width:100%;
	height:90px;
}

#overlay .requestInner .inputWrap.big{
	width:100%;
}

#overlay .requestInner .inputWrap.big input{
	min-width:100%;
}

#overlay .requestInner .inputWrap.large{
	width:100%;
}

#overlay .requestInner .inputWrap.large input{
	width:100%;
}

#overlay .requestInner input,
#overlay .requestInner textarea		{
	margin:0px;
	padding:0px 10px;
	font-size:12px;
	min-width: 100%;
}

#overlay .requestInner textarea{
	padding: 10px;
}

#overlay .requestInner .inputTitle	{
	display:block;
	color:#929292;
	padding-bottom:6px;
}

#overlay .requestInner .graphical-select{
	margin-bottom:6px;
}

#overlay .hideFiled		{
	display:none;
}

#contact{
	width:298px;
	display:none;
	margin:0px auto;
}

#tellAFriend{
	width:410px;
	display:none;
	margin:0px auto;
}

#reserveVehicle,
#buyVehicle{
	width:610px;
	display:none;
	margin:0px auto;
}

#contact-main{
max-width:550px;
display: none;
margin: 0px auto;
z-index:999;
}

#SendAFriend-main{
max-width:420px;
display: none;
margin: 0px auto;
z-index:999;
}

#contact-main .buttonBar .button.small,
#contact-main .buttonBar .button.small.gray,
#SendAFriend-main .buttonBar .button.small,
#SendAFriend-main .buttonBar .button.small.gray{
width:auto;
max-width:200px;
}



/* *************************************************************************************************************** */
/* ################################################ LOADER ####################################################### */
/* *************************************************************************************************************** */

#Loader img {
    margin-left: 250px;
    margin-top: 250px;
}


#Loader{
		background: url("../images/white_trans.png") repeat scroll center;
    height: 100%;
    position: absolute;
    width: 65%;
    z-index: 999;
    }

#Loader_full{
		text-align:center;
		background: url("../images/white_trans.png") repeat scroll center;
    display: none;
    height: 100%;
    position: fixed;
    width: 100%;
    z-index: 999;
    top:0;
    left:0;
}

#Loader_full img{
	margin-top:300px;
	}

/* *************************************************************************************************************** */
/* ################################################ FOOTER ####################################################### */
/* *************************************************************************************************************** */

#footer{
font-size:16px;
text-align: center;
background: #000000;
position:relative;
margin-top:20px;
clear: both;
}
#footerWrap{
	width:1160px;
	margin:0px auto;
}

#footerInner{
	padding: 3rem 0 6rem;
}

#footer a{
	color:#ffffff;
	padding:0 30px;
	display: inline-block;
	line-height: 12px;
	transition: all 300ms;
}

#footer a:last-child{
	border-right:none;
}

.footer-gardient{
	height: 50px;
	width: 100%;
	display: block;
	background: #f7921e;
	background: -moz-linear-gradient(top,  #f7921e 0%, #f06f18 100%);
	background: -webkit-linear-gradient(top,  #f7921e 0%,#f06f18 100%);
	background: linear-gradient(to bottom,  #f7921e 0%,#f06f18 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7921e', endColorstr='#f06f18',GradientType=0 );


}

/* Back to top button */

#back-top {
	position: fixed;
	right: 25px;
	bottom: 75px;
	z-index: 2;
}

#back-top a {
	display: block;
	text-align: center;
	font-size: 9px;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	transition: 0.5s;
	padding:3px 5px;
	background: #6c7073;
	border-radius: 4px;
}

	#back-top a:hover{
		background: #f7921e;
	}

#back-top span {
	width: 100%;
	height: 28px;
	display: block;
	margin-top: 8px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}

#back-top span::after{
	font-size: 30px;
	font-family: FontAwesome;
	content: "\f077";
}

/*########### cookieAlert ###################*/

.hide-new {
    display: none;
}

.cookie-settings.hide-new, 
.modal-backdrop.hide-new {
    display: none;
}

.CookieAlert {
	color: #fff;
    position: fixed;
    bottom: 0;
	left: 0;
	right: 0;
    background: rgba(0,0,0,0.5);
	width: 100%;
	height: 100%;
    padding: 20px;
    z-index: 999;
}

	.CookieAlert .fa{
		float:right;
		font-size: 24px;
		margin-bottom: 10px;
		text-align: right;
	}

	.CookieAlert .fa.fa-close{
		cursor: pointer;
	}


.CookieAlertExtreme {
		color: #fff;
    position: fixed;
		top: 0;
		bottom:0;
		background: rgba(0,0,0,0.9);
		padding: 20px;
		width: 100%;
		z-index: 99999;
		border:1px solid #990000;
		height:100%;
}

	.CookieAlertExtreme div:first-child{
		width: 10%;
	}
	.CookieAlertExtreme div:last-child{
		width: 90%;
	}

	.CookieAlertExtreme .fa{
		font-size: 24px;
		margin-bottom: 10px;
		float: right;
	}

	.cookieboxStartSettingsButton {
		padding: 15px 45px;
		background: #e9e9e9;
		color: #000;
		border-radius: 4px;
		border: none;
		font-weight: 600;
		margin-bottom: 2rem;
	}

	.accordion-body{
		color: #000;
		padding-bottom: 1rem;
	}

	div#accordionExampledetail {
		width: 100%;
		max-height: 255px;
		overflow: scroll;
		overflow-x: hidden;
	}

/* Base styling for the switch */
.switch {
	position: relative;
	display: inline-block;
	width: 50px;
	height: 26px;
  }
  
  .switch input {
	opacity: 0;
	width: 0;
	height: 0;
  }
  
  /* The slider */
  .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	transition: 0.4s;
	border-radius: 34px;
  }
  
  .slider:before {
	position: absolute;
	content: "";
	height: 20px;
	width: 20px;
	left: 4px;
	bottom: 3px;
	background-color: white;
	transition: 0.4s;
	border-radius: 50%;
  }
  
  /* When the checkbox is checked */
  input:checked + .slider {
	background-color: #b59960; /* Custom color */
  }
  
  input:checked + .slider:before {
	transform: translateX(24px);
  }
  
  /* Disabled state */
  input:disabled + .slider {
	background-color: #999;
  }
  
  input:disabled + .slider:before {
	background-color: #fff;
  }
  
  /* Round style */
  .slider.round {
	border-radius: 34px;
  }
  
  .slider.round:before {
	border-radius: 50%;
  }

  input:checked+.slider {
    background-color: #b59960 !important;
}

button.button.small.darker {
    background: #000;
	margin-bottom: 2rem;
}

button.button.small.darker:hover {
    background: #e0b662;
}

.accordion.scroll{
overflow-y: scroll!important;
}

.accordion-collapse {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease-out;
  }
  
  .accordion-collapse.open {
	max-height: 200px; /* Adjust as per content size or use 'auto' with JavaScript */
  }

  button.accordion-button{
	width: 100%;
    background: #fff;
    border: 1px solid #e9e9e9;
    padding: 0.5rem;
    border-radius: 2px;
	cursor: pointer;
  }

  button.accordion-button:hover{
	background:#e9e9e9;
  }

  .accordion-button .label{
	font-size: 16px;
	padding-top: 0.2rem;
  }

  .accordion-header{
	padding-bottom: 1rem;
  }


.modal{
	float: unset !important;
}

.modal-dialog {
	max-width: 500px !important;
	margin-right: auto!important;
	margin-left: auto!important;
	float: unset !important;
}

.modal-content {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%!important;
	pointer-events: auto;
	background-color: #ffffff;
	background-clip: padding-box;
	outline: 0;
	border-radius: 4px;
}

.modal-header {
	border-top-left-radius: .2rem;
	border-top-right-radius: .2rem;
	padding: 1rem;
	background: #b59960;
	color: #fff;
	width: unset!important;
}

.modal-body {
	color: #000000;
	margin: 5px 25px;
}

.modal-footer{
	padding: 1rem;
}

button.btn.btn-secondary {
	padding: 15px 45px;
	background: #e9e9e9;
	border-radius: 4px;
	border: none;
	font-weight: 600;
}

button.btn.btn-primary {
	padding: 15px 45px;
	background: #b59960;
	border-radius: 4px;
	border: none;
	color: #ffffff;
	font-weight: 600;
}

h5.modal-title {
	margin: 5px 0 0 30px;
}

.d-flex {
	display: flex;
}

.justify-content-between{
	justify-content: space-between;
}

.justify-content-center {
    justify-content: center;
}