/*
Kleuren:
- Geel #fff100
- Rood #cb0208
- Blauw #394A94
- Grijs: #909090
-zwart: #202020
*/

body, html {padding:0; margin:0; }
/*Geen: height: 100% Dat leidt tot printen van blanco pagina achteraan*/

body {color: #202020;
	background: #c0c0c0 url('images/shadow-body.jpg') repeat-x; padding-bottom: 20px}

* {font-family: arial, verdana, sans-serif;}

/* font-size: */
body, div#kop, div#container-content, div#content, div#acties, textarea, input {font-size: 12px} 
div.menu a{font-size: 14px;} 

div#kop {padding-top:0; padding-bottom:0; padding-left:3px; max-width: 1230px; min-width: 970px; margin: auto;
	background: url('images/kop_achtergrond.jpg') right no-repeat; height: 200px;}

div#kop form {float: left; margin-top:5px; margin-left: 10px}
div#kop table td {border: none}
div#kop p#kop-logo { margin-top:0; padding-left: 280px; padding-top:60px;}
/* div#kop p#kop-logo {text-align: center; margin-top:0; padding-top:60px;} */

/* Invoer van kenteken in de kop: */
table#zoekvak {width: auto; margin-top:8px;}
table#zoekvak td {border: none; vertical-align: middle; text-align: center;}
table#zoekvak td#boven {font-size: 15px; font-weight: bold; padding-top:8px}
input#kenteken {background: transparent url('images/kentekenplaat.gif') no-repeat left; width: 229px; height: 56px; 
	font-size: 45px; font-weight: bold; text-align: center; border: none; padding-left: 20px}
input#zoekbutton {color: white; background:#63645e ;font-size: 16px; font-weight: bold }
input#kentekensubmit {margin-bottom: 5px; margin-top: -5px}
table#zoekvak td#onder {font-size: 13px; font-weight: bold}


/* container voor hoofdmenu: */
div#container-menu{background: #FFFFFF url('images/shadow-menubalk.jpg') repeat-x;}

/* Menu als CLASS; kan ID worden */	
div.menu {text-align: center; width: auto; background: #909090; max-width: 1234px; min-width: 970px; margin: auto; padding: 3px 0 3px 0}
div.menu a {color: #FFF; background: transparent; font-weight: bold; font-size:13px; border-right: 1px solid #FFF; padding: 0 5px 0 5px; 
	text-decoration: none;}
div.menu a#first {border-left: 1px solid #FFF;} /* eerste optie in menu*/
div.menu a#cartlink {margin-right: 50px; border-left: 1px solid #FFF;} /*button cart*/
div.menu a:visited {color: #FFF; background: transparent;}
div.menu a:hover {color: red}

div.submenu {float: none; text-align: center; margin-top: 10px }
div.submenu a {border: 1px solid #909090; background: white; text-decoration: none; padding: 0 5px 0 5px; line-height: 2em}
div.submenu a:visited {color: #000; background: transparent;}
div.submenu a:hover {color: red}

/*Melding JS (bestel.php)*/
div#geenjavascript {width: 40em; margin: auto; border: 1px solid #CCC; padding: 5px}
div#geenjavascript h1, div#geenjavascript p {color: #cb0208 }

/* Actieve menuitem: voor menu en submenu */
a.actief_menu {color: #cb0208}
a.actief_menu:visited {color: #cb0208}

a.button {border-top: 1px solid black; border-left: 1px solid black; border-bottom: 2px solid black; border-right: 2px solid black;
padding: 5px; background: #CCC; text-decoration: none;}

/* container voor content en rechtervlak */
div#container-content {max-width: 1230px; min-width: 970px; margin: auto; padding: 0; margin-bottom: 20px;
	overflow: hidden; width: 100%; 
	background: #FFFFFF url('images/bg_info.jpg') right repeat-y;}

/* transparent border omdat er anders een grijs vlakje boven de content-div komt*/
div#content {margin-right: 305px; background: #FFFFFF; padding: 0 10px 0 10px; border: 1px solid transparent; min-height: 400px}  

/* Kolom met acties en hot-items: */
/* div#info {width: 290px; float: right; margin-top:10px; padding: 206px 0 0 0; border: 1px solid #000;
background: #FFF url('images/auto-boven-info.jpg') top center no-repeat; }  */
div#info {background: #FFF; width: 290px; float: right; margin-top:10px; padding: 0; border: 1px solid #000;}
div.infoitem {margin:0; padding: 0 0 3px 0;}
div.infoitem h2 {text-align: center; padding: 5px 0 5px 0; font-size: 1em; 
	font-weight: bold; color: white; background: #909090; margin-bottom: 0; margin-top: 0}
div.infoitem-text {padding: 0 10px 0 10px;}
div.infoitem-text ul {margin:0; padding:10px}
/* voor garage e.d. (niet aactief/zinvol lijkt het
div.ingelogd {} 
div.ingelogd h2{background: #909090}	
*/

*/

/* Garagespecifiek*/
table#garagespecifiekinfo {margin: auto}
table#garagespecifiekinfo td {border: none}	
h1 {
	font-size: 1.5em;
	font-weight: bold;
	color: #202020;
	text-align: center}
h2 {
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom:.5em;
	color: #202020;}
h3 {
	font-size: 1em;
	font-weight: bold;
	margin-bottom:.5em;
	color: #202020;}

.rechts {float:right; margin-left:15px;}
.rechtslijnend {text-align: right; padding-right: 5px;}
.links {float:left; margin-right:15px;}
.center {text-align: center;}
.hide {display: none}
.blauw {color: #394A94}
.groen {color:green}
.rood, .alert {color:#D23F38}
.oranje {color: #FF8000;}
.grijs {color: gray}
.nowrap {white-space: nowrap;}

wbr { display: inline-block; } /*Onzichtbaar afbreekstreepje*/

p.beheerder, .beheerder {color: gray} /*Info voor webmaster of beheerder */
.rood, .warning, .alert  {color:#D23F38} /* kop, warning, alert etc */
span.minspace {font-size: 1px} /* 2 woorden aaneengesloten tonen */
span.trekhaaknaam {color: #cb0208; font-weight: bold; font-style: italic; }
span.button {border: 1px solid gray; padding-left: 3px; padding-right: 3px}

a, a:visited {color:#202020}
a:hover {color:#cb0208}

table {/* width: 100%; */ border-collapse: collapse} 
td {vertical-align: top;}
th {text-align: left;}

/* Speciale TD's */
th, td {border: 1px solid #CCCCCC;}  
td, th {padding-left: 2px; padding-right: 2px;}
td.euro {width: 1%; border-right: none; font-weight: bold }
td.prijs {text-align: right; border-left: none;  width: 1%; font-weight : bold; padding-right: 5px;}
td.left {text-align: left}
td.num, td.td_rechts {text-align: right; padding-right: 2px}
td.smal {width: 1%} /*Prijs en euro-kolom werden soms te breed getoond in IE*/
tr.donker td {background: #F7F7F7}

/* Tonen van bestelling (startpagina en later oproepen van order) en NAW: */
table.toonbestelling {width: 98%; max-width: 1190px}
th.garageinformatie {width: 30%}
td#kabelsetkop {border: none; padding-top: 10px;}
table#naw {width: 100%; max-width: 1190px; margin-bottom: 20px;}

table.overigeinformatie {width:auto}
table.overigeinformatie td {border: none; padding-right:5px}

strong {	
	font-weight: bold;
	color: #202020;
	font-style: italic}
hr {color: #E6E6FA; height: 1px}	
img {border: none}

p#inlogmeld {text-align: center; font-style: italic}
p#exclusiefprijs {font-style: italic; margin-bottom: 0}

/* 'onzichtbare' link naar Log in */
a#login {width: 20px; height: 110px; display: block; float: right; text-decoration: none}

/* Bestelpagina */
td.wisbutton {border: none; width: 1em} /* wordt gebruikt om de wisbuttons in artikellijst in kwijt te kunnen*/
input.cartwis {font-size: 1px; color:red; background: url('images/delete.gif') center center no-repeat; 
width: 15px; padding-top: 5px; padding-bottom: 5px; margin-left: 10px}

/*Bestelpagina en pagina 'Overige_artikelen'*/
table.overigeart {float: left; margin: 5px;  width: 170px; border: 1px solid #CCC}
table.overigeart td h3 {font-size: .9em;}
table.overigeart td{ text-align: center; vertical-align: middle; border: none}
table.overigeart td.ovnaam {height: 3em}
table.overigeart td.ovimg {border-bottom: none; height: 155px !important;}
table.overigeart td.ovspecs {border-top: none}
table.overigeart td.ovprijs {font-weight: bold}
table.overigeart td.ovselect {height: 2em}

div.webmasterinfo {color: gray;}
div.webmasterinfo h2 {color: gray;}
div.webmasterinfo h3 {color: gray;}

/*Div om teksten readonly te tonen. Bijv order_view.php*/
div.showtekst {
	height: 12em; overflow: auto; border-left: 2px solid #000; border-top: 2px solid #000;
	border-right: 1px solid #CCC; border-bottom: 1px solid #CCC; margin-top: 5px; padding:2px;
	background-color: #f3f3f3;}

/*Speciale meldingen tbv actiecodes:*/
div.actiecode {width: 40em; overflow: auto; margin-top:10px}

/* CSS popup */
a.infopop{
    position:relative; /*this is the key*/
    z-index:24; 
    color:#000;
    text-decoration:none}
a.infopop:hover{z-index:25;}
a.infopop span{display: none}
a.infopop:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:-8em; left:7em; width:30em;
    padding: 5px;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
    text-align: center}

/* Div-boxes voor rounded corners: (niet in gebruik) */
div.t {background: url('images/dot.png') repeat-x 0 0;}
div.b {background: url('images/dot.png') repeat-x 0 100%; }
div.l {background: url('images/dot.png') repeat-y 0 0; }
div.r {background: url('images/dot.png') repeat-y 100% 0; } 
div.bl {background: url('images/bl.png') no-repeat 0 100%; }
div.br {background: url('images/br.png') no-repeat 100% 100%; }
div.tl {background: url('images/tl.png') no-repeat 0 0; }
div.tr {background: url('images/tr.png') no-repeat 100% 0; padding:10px;}