/*carpolis 2.0*/

* {
  margin: 0;
}
html, body, ul, ol {
  padding: 0; /*bescherm form controls*/
}

img {
  border: 0;
  vertical-align: bottom;
}

ul {
  list-style: none;
}

body {
  color: #000;
  font: normal 100% helvetica, arial, sans-serif;
  background-color: #fff;
}

#container {
  min-width: 760px;
  max-width: 64em;
}

* html #container {
  width: 760px; 
  width:expression((document.body.clientWidth>1024) ? "1020px" : ((document.body.clientWidth>800) ? "auto" : "760px"));
}

a:hover, a:focus, a:active {
  color: #109cde;
  text-decoration: none;
}

#overslaan {
  color: #fff;
  font: bold 1em/1.1em georgia, "times new roman", serif;
}
	#overslaan:focus, #overslaan:hover, #overslaan:active {
	  color: #000;
	  background-color: #d9e8ff;
	}

a[href$=".pdf"] {
  padding-right: 29px;
  line-height: 1.88em;
  background: url(../images/pdf-icon.gif) 100% 50%  no-repeat;
}
/*afbeeldingen wrap niet correct in IE, maar als de anchor een soort block is, kan bugs verwijderd worden*/
*+html #guis a[href$=".pdf"] {display: inline-block;}

a.skip {
  position: absolute;
  left: -9999em;
  top: -9999em;
  padding: 5px;
  font-size: 1.2em;
  font-weight: bold;
  text-decoration: none;
  border: 1px solid #4864a4;
  background-color: #fff; 
}
	#header a.skip:focus, #header a.skip:active {
	  left: 8em;
	  top: 4em;
	  color: #c10e0e; 
	  outline: 0;
	}

a.formskip {
  color: #d9e8ff;
}
	a.formskip:focus, a.formskip:hover, a.formskip:active {
	  color: #000;
	  text-decoration: underline;
	  background-color: #fff;
	}
p {
  margin: 10px 0;
}

p.bold, span.bold {
  font-weight: bold;
}

p.center {
  text-align: center;
}

span.kleur {
  color: #109cde;
}

span.sitenaam {
  color: #109cde;
  font: small-caps bold 1.4em verdana, arial, helvetica, "bitstream vera sans bold", "trebuchet ms", sans-serif;
}
	span.sitenaam span {
	  color: #000;
	}

#header {
  width: 100%; /*Hazlayout*/
  position: relative;
  z-index: 10;
}

#mainpagina h1, #naam {
  position: relative;
  float: left;
  display: inline;/*IE6*/
  width: 340px;
  height: 50px;
  margin: 10px 0 0 10px;
  text-align: left;
  font: bold small-caps 36px/50px impact, "arial black", "bitstream vera sans bold", verdana, sans-serif;
  text-align: center;
  overflow: hidden; /*stopt woorden van uitgroeien*/
}
	#mainpagina h1 a, #naam a {
  	  position: absolute;
  	  height: 50px;
  	  width: 340px;
	  left: 0;
	  top: 0;
  	  background: url(../images/autoverzekeren.png) 0 0 no-repeat;
	}


#topmenu {
  float: right;
  display: inline;/*IE6*/
  width: 38em;
  max-width: 98%;
  min-height: 20px;
  margin: 24px 10px 0 1px;
  padding: 5px;
  background-color: #d9e8ff;
  border: 5px solid #e7f6ff;
  border-bottom: 0;
}
* html #topmenu {width: 38em;}

	#topmenu li {
  	  display: inline;
	}
	#topmenu a {
	  float: left;
	  margin-left: 15px;
  	  color: #000;
  	  text-decoration: none; 
  	  font: 1.1em/2em arial, helvetica, sans-serif;
  	  text-align: center;
	}
* html #topmenu a {padding-right: 10px; background: url(../../images/divider.gif) 100% 50% no-repeat;}

	#topmenu a:visited {
  	  color: #4864a4;
	}
	#topmenu a:focus, #topmenu a:hover, #topmenu a:active,
	#submenu a:focus, #submenu a:active {
  	  color: #109cde;
          text-decoration: underline;
	  outline: 0;
	}

#sidebar {
  clear: left;
  float: left;
  display: inline; /*IE6*/
  width: 8.5em;
  margin-top: .9em;
}
* html #sidebar {margin-top: 0;}
*+html #sidebar {margin-top: 0;}/*IE neemt margin vanaf de bodem van de H1 terwijl modernen laten margins daaronder glijden*/

	#submenu {
	  width: 8em;
	  margin: 0 auto;
  	  padding: 20px 0;
	  text-align: center;
	  border: 1px solid #000;
	}
	* html #submenu {/*IE5.5 just because*/
	  width: 134px;
	  margin: 0 0 0 5px;
	  _width: 8em;
	  mar\gin-left: auto;
	}
		#submenu li {
  	  	  padding: 10px 0;
		}	
		#submenu li.border {
  	  	  padding-bottom: 20px;
  	  	  border-bottom: 2px solid #8d8d8d;
		} 
		#submenu a {
  	  	  color: #000;
  	  	  text-decoration: none;
	 	  font-size: 1em;
		  font-weight: bold;
		}
		#submenu a:hover {
  	 	  color: #109cde;
	  	  text-decoration: none;
		}
		#submenu a.huidig {
		  color: #c10e0e;
		  text-decoration: underline;
		}
			#submenu a.huidig:focus {
			  outline: 1px dotted;
			}

	#banners a {
	  display: block;
	}
	#banner1 {
	  float: left;
	  width: 59px;
	  height: 35px;
	  margin: 10px 0 15px 2px;
	}
	#banner2 {
	  float: left;
	  width: 51px;
	  height: 35px;
	  margin: 10px 0 15px 5px;
	}
	#banner3 {
	  clear: left;
	  width: 111px;
	  height: 30px;
	  margin: 0 auto;
	}
	#banner4 {
	  width: 120px;
	  height: 90px;
	  margin: 10px auto;
	  border: 1px solid #000;
	}

#inhoud {
  clear: right;
  position: relative;
  top: -5px;
  z-index: 1;
  min-height: 550px;
  margin-left: 8.6em; 
  padding: 15px 15px 5em;
  background-color: #d9e8ff;
  border: 5px solid #e7f6ff;
}
* html #inhoud {height: 550px;}

#inhoud:after {
  clear: both;
  display: block;
  content: " ";
}

	#contact #inhoud {
	  padding-bottom: 50px;
	  background: #d9e8ff url(../images/envelope.gif) 79% 50% no-repeat;
	}

h1 {
  text-align: center;
  font-size: 1.5em;
}

h1+p em {
  font-size: 1.1em;
}

#print {
  position: relative;
  float: right;
  width: 80px;
  height: 40px;
  margin-right: 20px;
  overflow: hidden;
}
	#print span {
	  position: absolute;
	  left: 0;
	  top: 0;
	  height: 100%;
	  width: 100%;
	  background: url(../images/afdrukbaar2.gif) 0 0 no-repeat;
	}
	#print:hover {
	  cursor: pointer; /*stomme IE*/
	}

/*wiesmann ad*/
#wiesmann {
  width: 600px;
  margin: 5px auto 10px;
  padding-top: 125px;
  background: url(../images/Wiesmannzonder.jpg) 50% 0 no-repeat;
  border-bottom: 1px solid #000;
}
	#wiesmann span {
	  font-weight: bold;
	  font-size: 1.1em;
	}

img.guislogo {
  float: right;
  margin-right: 10px;
}

h2 {
  margin: 15px 0 7px 0;
  padding-left: 10px;
  font-size: 1.2em;
}
#mainpagina h2, #login h2 {
  text-align: center;
  font-size: 1.1em;
}

h3 {
  margin: 5px 0 7px 0;
  padding-left: 10px;
  font-style: italic;
  font-size: 1em;
}
	#mainpagina h3 {
	  text-align: center;
	}

.opletlijsten {
  width: 20em;
  margin: 10px auto;
  list-style-type: disc;
  font: italic normal 1em/1.2em georgia, "times new roman", serif;
}

	.opletlijsten strong {
  	  font-weight: bold;
	}

        /*dienstenwijzer enz*/
        #disclaimer h2, #guis h3 {
          margin: 25px 0 -5px 0;
        }

#vsoort {
  width: 95%;
  margin: 0 auto;
  padding: 5px 5px 20px;
  border: 1px solid #535459;
  background-color: #fff;
  overflow: hidden;
}
	.drie {
	  position: relative;
	  float: left;
	  display: inline; /*IE6*/
	  width: 31%;
	  min-height: 22em;
	  margin-left: 10px;
	}
	* html #vsoort div.drei {height: 23em;}

	#vsoort div h3 {
	  margin: 0;
	  padding: 0;
	  color: #fff;
	  line-height: 1.5em;
	  text-align: center;
	  background-color: #4864a4;
	  border: 1px solid #000;
	}
	#vsoort div p {
	  padding: 0 2px 2px;
	} 

#address {
  clear: right;
  width: 20em;
  height: 6em;
  margin: 1.5em auto 0;
  padding: 5px 5px 50px;
  opacity: 0.5;
  filter: alpha(opacity=50);
  border: 1px solid #535459;
  background-color: #d9e8ff;
}

address {
  position: relative;
  width: 16em;
  margin: -9.4em auto 45px;
  font-style: normal;
  font-weight: bold;
}
        #disclaimer address {
          margin: .8em 0 .8em 4em;
        }
        /*dienstenwijzer*/
        #guis address {
          display: inline;
          margin: 0;
        }
	address span {
	  display: block;
	  margin-top: 1em;
	}
/*ie5.5 just because*/
* html #contact #address {
  height: 9em;
  hei\ght: 6em;
}
* html #contact address {
  margin: -8.5em 0 0 2em;
  mar\gin: -9.5em auto 45px;
}

#foutlijst {
  width: 30em;
  margin: 0 auto;
}
	#foutlijst li {
	  display: list-item;
	  list-style-type: circle;
	}
	#foutlijst a {
	  font-weight: bold;
	}

form, #gegevens {
  width: 37em;
  margin: 0 auto 5em;
  font-family: arial, helvetica, sans-serif;
}
* html form, * html #gegevens {width: 36em;}

	#formKenteken {
          margin-bottom: 1em;
	}
	#formAfsluiten {
	  clear: right;/*print.html*/
	}
	#formMutatiePersoon {
  	  margin-bottom: .5em;
	}

form a, form a:hover, form a:focus {
  color: #000;
}

fieldset { 
  position: relative; 
  margin: 5px 0;
  padding: 1em 0.5em 1em;
  border: 1px solid #535459;	
}
/*volgende fieldsets zijn hoger met z-index dan eerder fieldsets... abso-po'd spans (hulptekst) geaffecteerd*/
* html fieldset.iesux {margin-bottom: 3em;}
*+html fieldset.iesux {margin-bottom: 3em;}

	fieldset.langverklaring {
	  margin-top: 1em;
	  padding: 0 0 0 .5em;
	}
	fieldset.access, #formKenteken fieldset {
	  width: 97%;
	  margin: 0;
	  padding: 0 2px 2px;
	  border: 0;
	}
	fieldset.access {
	  clear: left; /*saffy-chrome*/
	}

legend {
  color: #000;
  padding: 5px;
  font: bold 1em verdana, sans-serif;
}
	fieldset.access legend, #formKenteken legend {
	  position: absolute;
	  left: -9999em;
	  top: -999em;
  	  margin-left: -999em;
	  font-size: 0; /*GECKO LEGEND BUG...*/
	} 

fieldset div {
  clear: left;
  float: left;
  width: 95%;
  padding: 2px;
}
	fieldset div:after {
	  display: block;
	  clear: left;
	  height: 0;
	  content: " ";
	}

	fieldset.lanverklaring div {
	  width: 99%;
	}

	form .hidden {
	  display: none;
	}

	#Cascodekking {
	  width: 35em;
	  margin-bottom: 5px;
	  padding-top: 5px;
	  background-color: #fff;
	  border: 1px solid #4864a4;
	}

	#Cascodekking div label a {
	  font-weight: bold;
	  font-size: .9em;
	}
		#Cascodekking div label a span {
		  font-size: 1.1em;
		  font-weight: normal;
		}

label, fieldset.access p {
  float: left;
  width: 16em;
  margin: 0;
  padding: 0 10px 0 5px;
  text-align: right;
  line-height: 150%;
}
	fieldset.access label, label.access {
	  display: none; /*Safari en Konqueror bug, pos: abso not working... display: none read out in screen readers for labels*/
	}
        label[for="JarenSchadevrij"] {
          white-space: nowrap;
        }
                label[for="JarenSchadevrij"] span {
                  white-space: normal;
                }

	#formOpzeg label, #formOpzeg p {
	  width: 12em;
	}
	#formKenteken label[for] {
	  margin-top: .5em;
	}

	fieldset.langverklaring label {
	  float: none;
	  display: inline;
	  padding-left: 5px;
	  text-align: left;
	}
	fieldset.langverklaring div div label, #formVoorwaarden div label {
          float: none;
	  display: inline;
  	  padding: 0 5px;
 	  line-height: 150%;
	  white-space: nowrap;
	}
	form div div label, form div div input {
	  vertical-align: middle;
	}
		fieldset.langverklaring div label.klein {
	          vertical-align: top;
		}
	fieldset.langverklaring #Opmerkingen {
	  display: block;
	  width: 90%;
	}

/*De volgende ideen zijn van het harde werk van Mike Cherim op http://mikecherim.com/experiments/css_map_pop.php */
	label a, fieldset.access p a {
  	  display: block;
  	  position: relative;
	  z-index: 1;
  	  min-height: 30px;
	  padding-left: 30px;
  	  color: #000;
  	  text-decoration: none;
	  background: url(../images/image_vraagteken.gif) 0 0 no-repeat;
	}
* html label a, * html fieldset.access p a {height: 1%;} /*lte IE6 Haslayout*/

	label a[href$=".pdf"] {
	  padding-right: 0;
          background: url(../images/pdf-icon.gif) 0 0 no-repeat;
	}
/*IE5.5*/
* html a:hover {
  visibility: visible;
}
	label a:focus, fieldset.access p a:focus, 
        label a:hover, fieldset.access p a:hover {
	  cursor: pointer; /*IE trigger*/
	  color: #4864a4;
	  font-weight: bold;
	  font-size: .9em;
	}
	label a span, fieldset.access p a span { 
  	  position: absolute;
  	  left: -9999em; 
	  top: -9999em; /*Over 9000!*/ 
  	  width: 15em;
	  padding: 5px;
  	  color: #000;
  	  font: normal 1em/1.1em georgia, "times new Roman", serif;
  	  text-decoration: none;
	  text-align: center;
  	  background-color: #fff;
  	  border: 1px solid #ccc;
	}
	label a:hover span, label a:focus span, label a:active span,
	fieldset.access p a:hover span, fieldset.access p a:focus span, fieldset.access p a:active span {
  	  left: 21.5em;
  	  top: 1.2em;
	  font-size: 1.1em;
	}
		label a span img, fieldset.access p a span img {
		  margin-left: -10px;
		}
		label a span em, fieldset.access p a span em {
		  margin-left: 50px;
		  font-weight: normal;
		  font-style: normal;
		}
/*IE bug, selects hebben altijd een hogere z-index stacking context*/
	label a:hover span.boven, label a:focus span.boven, label a:active span.boven,
	fieldset.access p a:hover span.boven, fieldset.access p a:focus span.boven, fieldset.access p a:active span.boven {
	  top: -4em;
	}
* html label a:hover span.ie6, * html label a:active span.ie6 {
  left: 24em;
}
	
* html label a:hover span.beneden, * html fieldset.access p a:hover span.beneden, 
* html label a:active span.beneden, * html fieldset.access p a:active span.beneden {
  left: 350px;
  top: 10em;
}
/*Eind Mike*/

a.waarschuwing {
  clear: left;
  display: block;
  margin-top: 1.8em;
  color: #fff;
  text-align: center;
  text-decoration: none;
  background-color: #f00;
}
	a.waarschuwing:focus, a.waarschuwing:hover {
	  color: #fff;
	}

input[type=text] {
  margin-right: 5px;
}

form textarea {
  white-space: normal;
}

#formKenteken input[type=text] {
  width: 6.3em;
  height: 35px;
  padding: 5px 0 0 20px;
  font-size: 1.5em;
  font-weight: bold;
  letter-spacing: .1em;
  text-transform: uppercase;
  background: #d9e8ff url(../images/kenteken.png) 0 0 no-repeat;
  border: 0;
}
	#formKenteken input[type=text]:focus, #formKenteken input[type=text]:hover {
	  background-color: #fff;
	}
	select.onder, input.onder {
	  margin-top: 1.5em;
	}
	input.submit {
	  clear: both;
	  display: block;
	  width: 11em;/*Safari en Opera9.5 hebben groter breedte nodig... stom*/
	  margin: 5px auto;
	}
/*IE breedlos submits te lang, width: auto; overflow: visible; toeveogen*/
	#berekenteken {
	  display: block;
	  width: 230px;
	  height: 30px;
	  margin: 5px auto;
	  color: #000;
	  font-size: .95em;
	  text-align: center;
  	  text-decoration: underline;
	  background: url(../images/kenteknop.gif) no-repeat;
	}
		#berekenteken:focus, #berekenteken:hover, #berekenteken:active {
	  	  color: #4864a4;
	  	  text-decoration: none;
		  background-position: 100% -30px; 
	        }
	#formMutatieVoortuig input.submit {
	  width: 18em;
	}


form p.contact a {
  color: #00f;
  text-decoration: underline;
  font-weight: bold;
}
	form p.contact a:focus, form p.contact a:hover {
 	  color: #109cde;
	}

p.button {
  position: relative;
  left: -.5em;
  width: 13em;
  margin: 0 auto 1em;
  padding-left: 3px;
  text-align: center;
  background: url(../images/button.gif) 0 0 no-repeat;
}
	p.button a {
	  display: block;
          min-height: 30px;
	  color: #333;
	  line-height: 30px;
	  text-decoration: none;
	  background: url(../images/button.gif) 100% 0 no-repeat;
	}
* html p.button a {height: 30px;}

		p.button:focus, p.button:hover {
	          background-position: 0 -30px;
		}
		p.button a:focus, p.button a:hover, p.button a:active {
	  	  color: #000;
	  	  background-color: #fff;
	          background-position: 100% -30px;
		}

#guisy {
  display: block;
  width: 250px;
  margin: 5em auto 0;
  text-align: center;
  font-weight: bold;
  font-size: 1.2em;
}

#gegevens {
  margin: 10px auto 0;
}
#gegevens:after {
  clear: both;
  display: block;
  height: 0;
  content: " ";
}

#gegevens dl {
  float: left;
  width: 36em;
  margin-bottom: 10px;
  padding-bottom: 7px;
  border-bottom: 1px solid #535459;
}
#gegevens dl.geenborder {
  border-bottom: none;
}
	#gegevens dt {
  	  clear: left;
  	  float: left;
  	  width: 16em;
  	  padding: 0 5px;
  	  line-height: 150%;
	}
		#gegevens #Premie, #gegevens .premie {
		  margin-top: 1em;
		}
	#gegevens dd {
          margin-left: 16.5em;
  	  font-weight: bold;
  	  line-height: 150%;
	}
	#gegevens dd.premie {
  	  text-decoration: underline;
	  margin-bottom: 1em;
	}


#gegevens a {
  display: block;
  margin: 30px 0 5px 3em;
  padding: 1px 3px;
  color: #000;
  font: .9em/1.6em "trebuchet ms", verdana, helvetica, sans-serif; 
  white-space: nowrap;
  text-decoration: none;
  text-align: center;
  background-color: #efebe7;
  border-top: 2px solid #fff;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #848280;
  border-right: 2px solid #848280;
}
	a.buttonkort {
	  float: left;
  	  width: 6em;
	}
	a.buttonmidden {
	  float: right;
  	  width: 11em;
	}
	#gegevens a:hover {
	  font-weight: bold;
	  color: #000;
	}

/*afsluiten2*/
#voorwaarden {
  clear: left;
  margin: 10px 0 10px 20px; 
}
p.textarea {
  margin-right: 20px;
}

/*dienst*/
ul.bullets {
  width: 96%; /*IE haslayout*/
  padding-left: 2em;
}
        ul.bullets li {
          display: list-item;
          list-style-type: disc;
        }

/*voorwaarden pagina*/
ul.voorwaardlijst {
  width: 27em;
  margin: 5px auto;
  overflow: hidden; /*can't clear floats without hitting sidebar*/
}
#autovoorwaarden h2 {
  padding-top: .5em;
  border-top: 1px solid #333;
}

#autovoorwaarden h3.opgave, #autovoorwaarden h4 { 
  margin-left: 20%;
}

#autovoorwaarden #inhoud p {
  margin: 5px 0;
}
	p.letop {
	  width: 90%;
	  padding: 5px;
	  background-color: #fff;
	  border: 1px solid #333;
	}
	p.druk {
	  font-size: 1.2em;
	  font-weight: bold;
	  font-style: italic;
	}

#autovoorwaarden dl {
  float: none;
}

#autovoorwaarden dl dt {
  font-weight: bold;
}
	dl.rijen dl dt {
	  clear: left;
	  float: left;
	  width: 13.8em;
	}
	dl.rijen dl dd {
	  padding-bottom: 2px;
	}
	#autovoorwaarden dl dd span {
	  display: block;
	  font-weight: bold;
	}
#autovoorwaarden .clear {
  clear: left;
}

ol {
  width: 96%;/*haslayout test*/
  list-style-type: decimal;
  margin-left: 0;
  padding-left: 30px;
}
	ol ol, ol.alpha ol ol {
	  list-style-type: lower-alpha;
	}
ol.alpha {
  list-style-type: upper-alpha;
}
	ol.alpha ol {
	  list-style-type: decimal;
	}

table {
  margin: 2em 0;
  border-collapse: collapse;
}
        #autovoorwaarden table {
          color: #000;
          background-color: #fff;
        }
table caption {
  position: absolute;
  left: -9999em;
}
th, td {
  padding: 0;
  border: 1px solid #000;
}
	th {
          padding: .2em .3em;
	  font-size: .95em;
	}
	tbody td {
	  text-align: center;
	}

tbody tr:hover td {
  color: #fff;
  background-color: #4864a4;
}
	  
p.boven {
  clear: both;
  text-align: center;
}
	p.boven a, p.boven a:visited {
	  color: #00f;
        }
        p.boven a:focus, p.boven a:hover {
          color: #109cde;
        }

/*footer*/
#zustersites {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
}
#zustersites p { /*IE*/
  margin: 0;
  padding: 0 0 0 1em;
  font: bold .8em georgia, times, serif;
}
 
#zustersites ul {
  min-height: 2em;
  background-color: #4864a4;
}
#zustersites ul:after {
  clear: both;
  display: block;
  content: " ";
}
* html #zustersites ul {
  width: 100%;
  height: 2em;
}
#zustersites li {
  display: inline;
  color: #fff;
}
	#zustersites li a {
	  float: left;
  	  height: 22px;
	  padding: 0 8px 1px;
	  text-decoration: none;
    	  font: italic bold 16px/22px georgia, "palatino linotype", "times new roman", serif;
	  color: #fff;
	}
	#zustersites li a:hover, #zustersites li a:focus, #zustersites li a:active {
  	  color: #fff;
	  text-decoration: underline;
	}

