/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, button {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	/*	vertical-align: baseline;*/
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

.hover {
	-webkit-user-select: none;
	-webkit-touch-callout: none;
}



/****************************************************

	Design: Autosoft BV - www.autosoft.eu
	Code & CSS: Autosoft BV - www.autosoft.eu
	Copyright 2015 Autosoft BV

****************************************************/

.clear {
	clear: both;
	display: block;
	width: 0px;
	height: 0px;
	content: '.';
	visibility: hidden;
}

body {
	font-family : Arial, helvetica, sans-serif;
	font-size: 14px;
	line-height: 21px;
	color: #333333;
	text-align: left;


	background: rgb(239,239,239); /* Old browsers */
	background: -moz-linear-gradient(left,  rgb(239,239,239) 0%, rgb(255,255,255) 16%, rgb(255,255,255) 50%, rgb(255,255,255) 86%, rgb(239,239,239) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgb(239,239,239) 0%,rgb(255,255,255) 16%,rgb(255,255,255) 50%,rgb(255,255,255) 86%,rgb(239,239,239) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgb(239,239,239) 0%,rgb(255,255,255) 16%,rgb(255,255,255) 50%,rgb(255,255,255) 86%,rgb(239,239,239) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#efefef',GradientType=1 ); /* IE6-9 */


}

sup { font-size: 8px; line-height: 0px;}

button {
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
	cursor: pointer;
}


h1, h2, h3, h4, h5, h6 {
	color: #333333;
	/*text-shadow: 1px 1px 0px #ffffff;*/
	font-weight: normal;
	padding: 5px;
}

h1 { font-size: 1.5em; line-height: 1.3em;}
h2 { font-size: 1.4em; line-height:1.2em; }
h3 { font-size: 1.3em; line-height: 1.1em; }
h4 { font-size: 0.9em; line-height: 1em; }
h5 { font-size: 1.1em; line-height: 0.9em; }
h6 { font-size: 1em; line-height: 0.8em; }


p {
	font-size: 12px;
	line-height: 1.5em;
	margin-top: 1em;
	margin-bottom: 0.5em;
}

.tabcontent p.bold {
	font-weight: bold;
	color: red;
}


a {
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}


#container {
	max-width: 940px;
	margin: 0 auto;
	padding: 20px 0px 20px 0px;
	/*background: #f1f1f1;*/
}

#header { padding: 10px 0px;}

#header h1{  float: left;}

#header p.productname {
	float: right; padding: 5px;
	font-size: 1.5em; line-height: 1.3em;
	margin-top: 0px;
	margin-bottom: 0px;
}

#header p.productname span {
	font-weight:900;
	font-style: italic;
	color: #000000;
}


#footer {
	padding: 20px 0px 10px 0px;
	text-align: center;
	font-size: 10px;
	font-style: italic;
	color: #bbbbbb;
}

#footer a { color: #aaaaaa; text-decoration: none;}
#footer a:hover { color: #000000; text-decoration: none;}



.backgroundColor {
	background-color: #696a61;
}


@keyframes showhide {
	from {
		line-height: 0px;
		opacity: 0;
		filter: alpha(opacity=0);
	}
	to {
		line-height: 20px;
		opacity: 1;
		filter: alpha(opacity=100);
	}
}


/* -------- -------- -------- STAPPEN -------- -------- -------- */




#stappen {  text-align: left;}

button.tab {
	background-image: url("../images/buttonBG.png");
	color: #6f7261;
	height: 30px;
	text-align: center;
	width: 174px;
	box-sizing: border-box;
	font-size: 11px;
	margin: 5px;
	border-radius: 6px;
	padding: 0px 0px;
	border: 1px solid #cccccc;
}

button.tab.active {
	background-image: url("../images/buttonBG_hover.png");
	color: #000; text-decoration: none;
	border: 1px solid #999999;
	-webkit-box-shadow:inset 0 0 10px 0 #cccccc;
	box-shadow:inset 0 0 10px 0 #cccccc;
	font-weight: bold;
}

button.tab.past {
	background-image: url("../images/buttonBG_hover.png");
	color: #cccccc;
	-webkit-box-shadow:inset 0 0 10px 0 #cccccc;
	box-shadow:inset 0 0 10px 0 #cccccc;
}

button.tab:hover {
	background-image: url("../images/buttonBG_hover.png");
	color: #000; text-decoration: none;
	border: 1px solid #999999;
	-webkit-box-shadow:inset 0 0 10px 0 transparent;
	box-shadow:inset 0 0 10px 0 transparent;
}

button.tab.notactive, button.tab.notactive:hover {
	background: #ffffff;
	color: #cccccc;
	-webkit-box-shadow:inset 0 0 10px 0 #efefef;
	box-shadow:inset 0 0 10px 0 #efefef;
	border: 1px solid #cccccc;
	cursor: default;
	pointer-events:none;
}

/* -------- -------- -------- MERKEN MODELLEN OVERZICHT -------- -------- -------- */

/*#carListContainer { text-align: center;}*/

.merkBox,
.modelBox  {
	display: inline-block;
	box-sizing: border-box;
	width: 104px;
	height: 100px;
	text-align: center;
	vertical-align: top;
	margin: 5px;
	margin-bottom: 10px;
	padding: 5px;
	border-radius: 6px;
	-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
	background: #ffffff;
}


.modelBox {
	width: 222px;
	height: 196px;
}

.merkBox:hover,
.modelBox:hover {
	cursor: pointer;
	-webkit-box-shadow: 0 0 10px 0 #696a61;
	box-shadow: 0 0 10px 0 #696a61;
}

.merkBox  h2,
.modelBox h2 {
	font-weight: normal;
	font-size: 10px;
	line-height: 14px;
	display: block;
	height:10px;
	text-align: center;
}

.modelBox h2 {
	font-size: 12px;
}

.merkBox .imageHolder,
.modelBox .imageHolder {
	width: 84px; height: 70px;
	margin: 0 auto;
	background-size: contain;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}

.modelBox .imageHolder {
	width: 202px; height: 166px;
	margin-top: -20px;
	-webkit-filter: grayscale(1); /* Webkit */
	filter: gray; /* IE6-9 */
	filter: grayscale(1); /* W3C */
}

.thumbWrapper .imageHolder {
	-webkit-filter: grayscale(1); /* Webkit */
	filter: gray; /* IE6-9 */
	filter: grayscale(1); /* W3C */
}

.modelBox .priceHolderOnly {
	text-align: left;
	padding-left: 5px;
	margin-top: 0px;
	line-height: 1.2em
}

.modelBox .priceHolderOnly .priceOnly {
	display: inline-block;
	font-weight: bold;
	margin-top: -6px;
}

.modelBox .priceHolderOnly .values {
	display: inline-block;
	float: left;
	font-size: 10px;
}

.modelBox .priceHolderOnly .emissionOnly{
	display: inline-block;
	float: right; margin-top: -6px;
}



.modelBox .priceHolder {
	text-align: left;
	padding-left: 5px;
	margin-top: -10px;
	line-height: 1.2em
}

.modelBox .priceHolder .price {
	display: block;
	font-weight: bold;
}

.modelBox .priceHolder .values {
	display: inline-block;
	float: left;
	font-size: 10px;
}

.modelBox .priceHolder .emission{
	display: inline-block;
	float: right; margin-top: -6px;
}




/* -------- -------- -------- UITVOERINGEN OVERZICHT -------- -------- -------- */

/*#carListContainer { text-align: center;}*/

#carListContainer {

}
#tranmissionSelect {
	line-height: 40px;
	margin-left: 5px;
}

.optionwrapper {
	display: inline-block;
	margin-left: 5px; margin-right: 15px;
}

.optionwrapper input[type=radio] {
	float: left;
	margin-right: 5px;
	margin-top: 14px;
}


.vehicleType { margin-bottom: 40px;}

.vehicleType .title h2 {float: left;}
.vehicleType .title strong {
	display: block; float: right;
	min-width: 80px; padding-top: 8px;
	text-align: center; font-style: italic;
}

.vehicleType .thumbWrapper { padding: 5px; padding-top: 10px;}


.vehicleType .thumbWrapper img {
	display: inline-block;
	vertical-align: top;
	margin: 10px;
	max-width: 162px!important;
	height: auto!important;
}

.vehicleType .thumbWrapper h1 { margin-top: 50px; font-weight: bold; display: inline-block;}



.vehicleType .vehicleSelect { background: #efefef;}

.vehicleType .vehicleSelect .voertuig { border-bottom: 1px solid #ffffff;}
.vehicleType .vehicleSelect .voertuig:hover { background: #e3e3e3; cursor: pointer;}


.vehicleType .vehicleSelect .voertuig { line-height: 21px;}

.vehicleType .vehicleSelect .voertuig input[type=checkbox] {
	float: left;
	margin-left: 5px;
	margin-top: 6px;
}


.vehicleType .vehicleSelect .voertuig .type,
.vehicleType .vehicleSelect .voertuig .typeDetails,
.vehicleType .vehicleSelect .voertuig .typePrice {
	display: inline-block; min-width: 140px;
	font-size: 12px; padding: 2px 8px;
}

.vehicleType .vehicleSelect .voertuig .type { font-weight: bold; min-width: 240px; }

.vehicleType .vehicleSelect .voertuig .typePrice {
	float: right; text-align: right;
	min-width: 80px; }

.vehicleType .vehicleSelect .voertuig .typePrice span.valuta {
	float: left; width: 12px;
}





/* -------- -------- -------- COMPARE -------- -------- -------- */

#compare-container {
	margin: 0 auto;
	padding: 0px 10px 20px 10px;
	text-align: center;
	min-width: 940px;
	font-size: 0;
	/*background: #f1f1f1;*/
}


#compare-container #compare-wrapper {
	margin: 0 auto;
	/*-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;*/
	overflow-x: auto;
	white-space: nowrap;
	padding-left: 400px; /*fix margin first two columns*/
}



#compare-container .column {
	display: inline-block;
	vertical-align: top;
	box-sizing: border-box;
	padding: 0px;
	text-align: left;
	font-size: 11px;
	line-height: 18px;
	width: 140px;
	border: 2px solid #ffffff;
	margin: 20px 0px;
	white-space: normal;
	background: #ffffff;
}



#compare-container #maincolumn.column {
	position: absolute;
	margin-left: -400px; /*puts first column to the left */
	width: 270px;
	z-index: 1000;
}

#compare-container #chosen.column {
/*	position: absolute;*/
	margin-left: -140px;/*puts secondcolumn next to first */
}

#compare-container .column.stock {
	border: 2px solid #666666;
}

#compare-container .column div.row { margin-bottom: 20px;}
#compare-container .column div.row.prices { margin-bottom: 0px;}

#compare-container .column span.row {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 20px;
}

#compare-container .column span.row input[type=checkbox] {
	float: left; margin-left: -16px;}


#compare-container .column span {
	display: block;
	box-sizing: border-box;
	padding: 0px 4px 0px 18px;
	text-align: center;
	border-bottom: 1px solid #ffffff;
}

#compare-container .column .title,
#compare-container .column .makemodel {
	font-size: 12px;
	font-weight: bold;
	padding: 0px 0px;
}

#compare-container .column .title { padding-left: 0px;}

#compare-container .column .picture { height: 60px;}
#compare-container .column .picture img {
	max-height: 60px;
	border: 0;
	-webkit-filter: grayscale(1); /* Webkit */
	filter: gray; /* IE6-9 */
	filter: grayscale(1); /* W3C */
}

#compare-container .column .makemodel {
	padding: 5px 0px;
	height: 40px;
}

#compare-container .column .even,
#compare-container .column .mainprice {
	background: #d1d1d1;
}

#compare-container .column .odd {
	background: #ebebeb;
}

#compare-container .column .options span {
	text-align: right; padding-right: 60px;
}

#compare-container .column .prices span  {
	text-align: right; padding-right: 45px;
}

#compare-container .column .link,
#compare-container .column .prices .link {
	text-align: center; padding: 0px;
	background: #ffffff;
}

#compare-container .column .link,
#compare-container .column .prices .link {
	line-height: 40px!important;
}

#compare-container .column .link a,
#compare-container .column .prices .link a {
	display: inline-block; text-align: center;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	margin: 5px; border: 1px solid #ffffff;
	background: #eeeeee; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#eeeeee, #cccccc);
	background: -o-linear-gradient(#eeeeee, #cccccc);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#cccccc)); /* older webkit syntax */
	background: -webkit-linear-gradient(#eeeeee, #cccccc);
	-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;
	text-decoration: none;
	color: #333333;
	font-size: 12px;
	font-weight: bold;
	line-height: 20px;
	padding: 2px 5px;
	width: 90%;
	box-sizing: border-box;
}


#compare-container .column .link a:hover,
#compare-container .column .prices .link a:hover {
	border: 1px solid #ffffff;
	background: #cccccc; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#cccccc, #d1d1d1);
	background: -o-linear-gradient(#cccccc, #d1d1d1);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cccccc), to(#d1d1d1)); /* older webkit syntax */
	background: -webkit-linear-gradient(#cccccc, #d1d1d1);
	-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;
	cursor: pointer;
}


#compare-container #maincolumn.column span {
	text-align: left;
}
#compare-container #maincolumn.column span.link {
	background: #ffffff;
}


#compare-container a.toggle {
	display: block;
	width: 18px;
	height: 18px;
	cursor: pointer;
	overflow: hidden;
	text-align: center;
	font-weight: bold;
	font-size: 14px;
	float: left; margin-right: 10px;
	border:  1px solid #ffffff;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	background: #eeeeee; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#eeeeee, #cccccc);
	background: -o-linear-gradient(#eeeeee, #cccccc);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#cccccc)); /* older webkit syntax */
	background: -webkit-linear-gradient(#eeeeee, #cccccc);
	-webkit-box-shadow: 0 0 4px 0 #cccccc;
	box-shadow: 0 0 4px 0 #cccccc;
	line-height: 18px;
}

#compare-container a.toggle:before {
	content: '+';
	display: block;
}

#compare-container a.toggle.close {
	background: #cccccc; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#cccccc, #eeeeee);
	background: -o-linear-gradient(#cccccc, #eeeeee);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cccccc), to(#eeeeee)); /* older webkit syntax */
	background: -webkit-linear-gradient(#cccccc, #eeeeee);
}

#compare-container a.toggle.close:before {
	content: '-';
	display: block;
}





#compare-container .column .showspecs,
#compare-container .column .showoptions,
#compare-container .column .showprices
{display: none;}


#compare-container .column .showspecs.visible,
#compare-container .column .showoptions.visible,
#compare-container .column .showprices.visible
{display: block; animation-name: showhide; animation-duration: 750ms;}

#compare-container #maincolumn.column .showspecs.visible,
#compare-container #maincolumn.column .showoptions.visible,
#compare-container #maincolumn.column .showprices.visible
{ border-left: 1px solid #cc0000;}

#compare-container #maincolumn.column .showprices.visible.link {
	line-height: 40px; border-left: 1px solid white;
}



/* -------- -------- -------- CONFIGUREREN OPTIES TABBLADEN -------- -------- -------- */


.vehicleType .carWrapper { padding: 5px; padding-top: 10px }

.vehicleType  { margin-bottom: 4px;}

.vehicleType .carWrapper img {
	display: inline-block;
	vertical-align: top;
	margin: 10px;
	margin-right: 20px;
	max-width: 162px!important;
	height: auto!important;
	float: left;
	-webkit-filter: grayscale(1); /* Webkit */
	filter: gray; /* IE6-9 */
	filter: grayscale(1); /* W3C */
}

.vehicleType .carWrapper h1 { margin-top: 20px; font-weight: bold;}
.vehicleType .carWrapper h2 { font-weight: normal; font-size: 1em;}

.tabcontent h2 { font-weight: bold; font-size: 1.2em; margin-bottom: 10px; padding-left: 0px;}

#tabs ul#tablinks {
	margin-left: 15px;
	position: relative;
	z-index: 1;
	margin-top: 0px;
}

#tabs ul#tablinks li {
	display: inline;
	margin-right: 5px;
}

#tabs a.tablinks {
	display: inline-block;
	cursor: pointer;
	text-align: center;
	font-weight: normal;
	font-size: 14px;
	line-height: 18px;
	cursor: pointer;
	border-radius: 6px;
	-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;
	box-sizing: border-box;
	padding: 15px 20px;
	vertical-align: top;
	text-decoration: none;
	color: #333333;
	background: #ffffff;
}

#tabs a.tablinks.active {
	font-weight: bold;
}

#tabs a.tablinks:hover,
#tabs a.tabactive:hover	{
	margin-top: -6px;
	padding-bottom: 21px;
}

#tabs #tabswrapper { width: 100%;position: relative; z-index: 2;}

#tabs .tabcontent {
	display: block;
	padding: 25px;
	border-radius: 6px;
	-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;
	box-sizing: border-box;
	width: 100%;
	margin-top: -4px;
	background: #ffffff;
	display: none;
}

#tabs .tabcontent ul {
	margin-bottom: 1.5em;
	display: block;
	vertical-align: top;
	clear: both;
	padding-top: 20px;
}

#tabs .tabcontent ul ul {
	padding-top: 10px;
}


#tabs .tabcontent ul li ul li {
	display: inline-block;
	width:33.33333%;
	float: left;
	list-style: square;
	font-size: 12px;
}

#tabs .tabcontent ul li ul li:before {
	display: inline-block;
	content: "\002713";
	color: green;
	font-weight: bold;
	margin-right: 10px
}

#tabs .tabcontent .title {
	font-size: 12px;
	font-weight: bold;
	padding: 0px 0px;
	padding-left: 10px;
	position: relative
}


#tabs .tabcontent a.toggle {
	display: block;
	width: 18px;
	height: 18px;
	cursor: pointer;
	overflow: hidden;
	text-align: center;
	font-weight: bold;
	font-size: 14px;
	float: left; margin-right: 0px;
	border:  1px solid #ffffff;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	background: #eeeeee; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#eeeeee, #cccccc);
	background: -o-linear-gradient(#eeeeee, #cccccc);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#cccccc)); /* older webkit syntax */
	background: -webkit-linear-gradient(#eeeeee, #cccccc);
	-webkit-box-shadow: 0 0 4px 0 #cccccc;
	box-shadow: 0 0 4px 0 #cccccc;
	line-height: 18px;
}


#tabs .tabcontent a.toggle:before {
	content: '+';
	display: block;
}

#tabs .tabcontent a.toggle.close {
	background: #cccccc; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#cccccc, #eeeeee);
	background: -o-linear-gradient(#cccccc, #eeeeee);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cccccc), to(#eeeeee)); /* older webkit syntax */
	background: -webkit-linear-gradient(#cccccc, #eeeeee);
}

#tabs .tabcontent a.toggle.close:before {
	content: '-';
	display: block;
}

#tabs .tabcontent .content { padding-bottom: 20px;}

#tabs .tabcontent .showdims,
#tabs .tabcontent .showaudio,
#tabs .tabcontent .showcomf,
#tabs .tabcontent .showexte,
#tabs .tabcontent .showinte,
#tabs .tabcontent .showperf,
#tabs .tabcontent .showsafe,
#tabs .tabcontent .showlight,
#tabs .tabcontent .showpkt
{display: none; }

#tabs .tabcontent .showdims.visible,
#tabs .tabcontent .showaudio.visible,
#tabs .tabcontent .showcomf.visible,
#tabs .tabcontent .showexte.visible,
#tabs .tabcontent .showinte.visible,
#tabs .tabcontent .showperf.visible,
#tabs .tabcontent .showsafe.visible,
#tabs .tabcontent .showlight.visible,
#tabs .tabcontent .showpkt.visible
{display: block; animation-name: showhide; animation-duration: 750ms;}


#tabs .tabcontent .options { background: #efefef; border-bottom: 1px solid #ffffff;}
#tabs .tabcontent .options:hover { background: #e3e3e3; cursor: pointer;}

#tabs .tabcontent .options input[type=checkbox] {
	float: left;
	margin-left: 5px;
	margin-top: 5px;
}


#tabs .tabcontent .optionDetails,
#tabs .tabcontent .optionCode,
#tabs .tabcontent .optionPrice {
	display: inline-block; min-width: 140px;
	font-size: 12px; padding: 2px 8px;
}

#tabs .tabcontent .optionCode {
	float: right; text-align: right;
	min-width: 80px;
}

#tabs .tabcontent .optionPrice {
	float: right; text-align: right;
	min-width: 80px;
}

#tabs .tabcontent .optionPrice span.valuta {
	float: left; width: 12px;
}


#tabs .tabcontent .colorsBlocksContainer { padding-bottom: 20px;}
#tabs .tabcontent .colorsBlock .title {
	font-size: 12px;
	font-weight: bold;
	padding: 0px 0px;
	padding-left: 0px;
	position: relative;
}

#tabs .tabcontent .colorsBlock .meerprijs { font-style: italic; font-size: 11px; font-weight: normal;}

#tabs .tabcontent .colorsBlock ul { padding-top: 0px;}
#tabs .tabcontent .colorsBlock li { font-size: 12px;}

#tabs .tabcontent .colorsBlock li { background: #efefef; border-bottom: 1px solid #ffffff; line-height: 21px;}
#tabs .tabcontent .colorsBlock li:hover { background: #e3e3e3; cursor: pointer;}

#tabs .tabcontent .colorsBlock input[type=radio] {
	float: left;
	margin-left: 5px;
	margin-top: 3px;
}
#tabs .tabcontent .colorsBlock .colorCode {
	float: right;
	text-align: right;
	min-width: 80px;
}

#tabs .tabcontent .overviewBlockContainer { padding-bottom: 20px;}
#tabs .tabcontent .overviewBlock .title {
	font-size: 12px;
	font-weight: bold;
	padding: 0px 0px;
	padding-left: 0px;
	position: relative;
}

.extraOptionsBox {
	width: 100%; height: 100%; text-align: center;
	top: 0; left: 0; position: fixed; z-index: 1000; display: block;
	background: rgba(255,255,255,0.5);
}

.extraOptionsBoxWrapper {
	background:  #ffffff;
	height: auto;
	width: 500px;
	position: fixed;
	top: 50%; margin-top: -100px;
	left: 50%; margin-left: -250px;
	margin-bottom: 10px;
	padding: 15px;
	border-radius: 6px;
	-webkit-box-shadow: -1px 1px 8px 0 #666;
	box-shadow: -1px 1px 8px 0 #666;
	font-sizr: 12px;
}

.extraOptionsBox  p.bold { font-weight: bold;}

.extraOptionsBox td { font-size: 12px; padding: 5px;}

.exclusionsBox {
	width: 100%; height: 100%; text-align: center;
	top: 0; left: 0; position: fixed; z-index: 1000; display: block;
	background: rgba(255,255,255,0.5);
}

.exclusionsBoxWrapper {
	background:  #ffffff;
	height: auto;
	width: 500px;
	top: 10%;

	/*		position: absolute;*/
	position: fixed;

	/*		position: relative;*/
	/*		top: 50%; margin-top: -100px;*/
	left: 50%; margin-left: -250px;
	z-index: 1000;
	margin-bottom: 10px;
	padding: 15px;
	border-radius: 6px;
	-webkit-box-shadow: -1px 1px 8px 0 #666;
	box-shadow: -1px 1px 8px 0 #666;
	font-sizr: 12px;
}

.exclusionsBox  p.bold { font-weight: bold;}

.exclusionsBox td { font-size: 12px; padding: 5px;}

/* -------- -------- -------- MIJN CONFIGURATIE -------- -------- -------- */
.carOverview {
	display: inline-block;
	box-sizing: border-box;
	text-align: left;
	vertical-align: top;
	margin: 5px;
	margin-bottom: 10px;
	padding: 5px;
	border-radius: 6px;
	-webkit-box-shadow: -1px 1px 8px 0 #666;
	box-shadow: -1px 1px 8px 0 #666;
	top: 1%; right: 0;
	z-index: 1000;
	position: fixed;
	padding-right: 40px;
	margin-right: -30px;
	background: #ffffff;
	min-width: 100px;
	min-height: 10px;
}

.carOverview:hover { width: auto; height: auto;}

.carOverview h2 { font-size: 1.1em; line-height:1.2em; font-weight: bold;}
.carOverview:hover h2 { font-size: 1.4em; line-height:1.2em; }

.carOverview .carOverviewContent { display: none; }
.carOverview:hover .carOverviewContent { display: block;}

.carOverview table {
	width: 100%; text-align: left; font-size: 12px; margin-top: 20px;

	}

.carOverview tr:hover {
	background-image: url("../images/buttonBG_hover.png");
	cursor: pointer;
}
.carOverview tr.borderLineWhite { border-bottom: 8px solid #ffffff;}
.carOverview tr.totaal {
	background-image: none;
}

.carOverview td {
	border-bottom: 1px solid #efefef; line-height: 21px;
	padding: 4px; vertical-align: top; text-align: left;
}

.carOverview tr.totaal td {
	border-bottom: 1px solid transparent;
}

.carOverview td.label {}
.carOverview td.value {font-weight: bold; width: 140px;}
.carOverview td#optionCount,
.carOverview td#colorCount,
.carOverview td#bekledingCount {  font-style: italic; font-size: 10px; width: 10px; }

.carOverview button.edit {
	display: block;
	width: 18px;
	height: 18px;
	cursor: pointer;
	overflow: hidden;
	text-align: center;
	font-weight: bold;
	font-size: 14px;
	float: right;
	margin-right: 10px;
	margin-top: 2px;
	background: url('../images/edit-icon.png') 50% 50% no-repeat transparent;
	background-size: 16px 16px;
	line-height: 18px;
	opacity: 0.4;
	filter: alpha(opacity=40);
}

.carOverview button.edit:hover {
	cursor: pointer;
	opacity: 1;
	filter: alpha(opacity=100);
}


.carOverview a.save {
	display: inline-block; text-align: center;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	margin: 5px; border: 1px solid #ffffff;
	background: #eeeeee; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#eeeeee, #cccccc);
	background: -o-linear-gradient(#eeeeee, #cccccc);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#cccccc)); /* older webkit syntax */
	background: -webkit-linear-gradient(#eeeeee, #cccccc);
	-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;
	text-decoration: none;
	color: #333333;
	font-size: 12px;
	font-weight: bold;
	line-height: 20px;
	padding: 2px 5px;
	width: 90%;
	box-sizing: border-box;
}


.carOverview a.save:hover {
	border: 1px solid #ffffff;
	background: #cccccc; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#cccccc, #d1d1d1);
	background: -o-linear-gradient(#cccccc, #d1d1d1);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cccccc), to(#d1d1d1)); /* older webkit syntax */
	background: -webkit-linear-gradient(#cccccc, #d1d1d1);
	-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;
	cursor: pointer;
}

/* -------- -------- -------- BESTELFORMULIER -------- -------- -------- */

form#bestelformulier .spacer { margin-top: 20px;}

form#bestelformulier .formlabel {
	display: block;
	box-sizing: border-box;
	padding-left: 10px;
	float: left;
	width: 20%;
	padding-top: 10px;
	font-size: 12px;
	line-height: 18px;
}

form#bestelformulier req { color: #ff0000; padding-left: 8px;}
form#bestelformulier .formfield {
	line-height: 22px;
	padding: 2px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	margin: 5px; border: 1px solid #ffffff;
	-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;
	background: #f4f4f4;
	width: 52.3%;
	font-size: 12px;
	font-style: italic;
}

form#bestelformulier .formfield:focus {
	-webkit-box-shadow: 0 0 6px 0 #000000;
	box-shadow: 0 0 6px 0 #000000;
	background: #ffffff;
	outline:none;
}

form#bestelformulier .formfield.medium { width: 40%}
form#bestelformulier .formfield.small { width: 10%}
form#bestelformulier .formfield.middle { width: 25%}
form#bestelformulier select.formfield {width: 25%}

form#bestelformulier .tinytext  {width: 20%; display: block; float: left; color: #adadad; font-size: 11px; font-style: italic;}

form#bestelformulier #verzend {
	text-align: center;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	margin: 5px; border: 1px solid #ffffff;
	background: #eeeeee; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#eeeeee, #cccccc);
	background: -o-linear-gradient(#eeeeee, #cccccc);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#cccccc)); /* older webkit syntax */
	background: -webkit-linear-gradient(#eeeeee, #cccccc);
	-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;
	text-decoration: none;
	color: #333333;
	font-size: 12px;
	font-weight: bold;
	line-height: 20px;
	padding: 2px 50px;
	box-sizing: border-box;

}

form#bestelformulier #verzend:hover {
	border: 1px solid #ffffff;
	background: #cccccc; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#cccccc, #d1d1d1);
	background: -o-linear-gradient(#cccccc, #d1d1d1);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cccccc), to(#d1d1d1)); /* older webkit syntax */
	background: -webkit-linear-gradient(#cccccc, #d1d1d1);
	-webkit-box-shadow: 0 0 6px 0 #cccccc;
	box-shadow: 0 0 6px 0 #cccccc;
	cursor: pointer;
}


	a.backbutton {
		display: inline-block;
		padding: 10px 20px;
		cursor: pointer;
		overflow: hidden;
		text-align: center;
		font-weight: bold;
		font-size: 12px;
		float: left; margin-right: 10px;
		border:  1px solid #ffffff;
		-webkit-border-radius: 5px 5px 5px 5px;
		border-radius: 5px 5px 5px 5px;
		background: #eeeeee; /* Show a solid color for older browsers */
		background: -moz-linear-gradient(#eeeeee, #cccccc);
		background: -o-linear-gradient(#eeeeee, #cccccc);
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#cccccc)); /* older webkit syntax */
		background: -webkit-linear-gradient(#eeeeee, #cccccc);
		-webkit-box-shadow: 0 0 4px 0 #cccccc;
		box-shadow: 0 0 4px 0 #cccccc;
		line-height: 16px;
		text-decoration: none;
		color: #333333;
		margin-top: 100px;
		}

	a.backbutton:hover {
		background: #cccccc; /* Show a solid color for older browsers */
		background: -moz-linear-gradient(#cccccc, #eeeeee);
		background: -o-linear-gradient(#cccccc, #eeeeee);
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cccccc), to(#eeeeee)); /* older webkit syntax */
		background: -webkit-linear-gradient(#cccccc, #eeeeee);

		}

/****************************************************

	Design: Autosoft BV - www.autosoft.eu
	Code & CSS: Autosoft BV - www.autosoft.eu
	Copyright 2015 Autosoft BV

****************************************************/



