﻿/* Stylesheet voor Ping. (c) Speak. Alle rechten voorbehouden. */

/* ---------------------------------------------------------------------------------- */
/* ----- Stijlen: Algemeen ---------------------------------------------------------- */
/* ---------------------------------------------------------------------------------- */

html {
  overflow-y: scroll;
}

html, body {
	margin: 0px;
	padding: 0px;
}

body {
  padding-bottom: 20px;
  font-family: Arial, Helvetica, Verdana, sans-serif;
  font-size: 12px;
  line-height: 20px;
  color: #6f6f6e;
  background: #ffffff;
}

a { color: #a0ac01; }
a:hover { color: #145035; }
a img { border: 0px; }
img { display: block; }

form {
  margin: 0px;
  padding: 0px;
}

.clearfix {
  height: 0px;
  overflow: hidden;
  clear: both;
  line-height: 0px;
  font-size: 0px;
}

#site {
  width: 820px;
  margin: 0px auto;
  position: relative;
}


/* ---------------------------------------------------------------------------------- */
/* ----- Stijlen: Top --------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------- */

#top {
  width: 100%;
  padding-top: 22px;
  margin-bottom: 28px;
  z-index: 30;
}

#top .logo {
  float: left;
  width: 142px;
  height: 58px;
  margin: -5px 0px 16px 19px;
  overflow: hidden;
  text-indent: -9001px;
}

#top .logo span {
  position: absolute;
  left: -9001px;
  top: 0px;
}

#top #nav {
  float: left;
  width: 100%;
  height: 37px;
  margin: 0px;
  padding: 0px;
  list-style: none;
  font-size: 16px;
  background: #a0ac01 url(/interface/images/nav-bg.gif) no-repeat right top;
  font-family: "century gothic", futura, arial, helvetica, sans-serif;
  position: relative;
  z-index: 40;
}

#top #nav li {
  float: left;
  height: 37px;
  margin: 0px;
  padding: 0px;
  border-left: 2px solid #ffffff;
}

#top #nav li.nolink {
  float: left;
  height: 27px;
  line-height: 27px;
  padding: 5px 14px;
  color: #ffffff;
  text-decoration: none;
}

#top #nav li a {
  float: left;
  height: 27px;
  line-height: 27px;
  padding: 5px 14px;
  color: #ffffff;
  text-decoration: none;
}

#top #nav li:hover a,
#top #nav li.active a {
  background: #145035;
}

#top #nav li.first {
  border: 0px;
}

#top #nav li.last {
  float: right;
}

#top #nav li.last:hover a,
#top #nav li.last_active a {
  background: #145035 url(/interface/images/nav-item-last-bg.gif) no-repeat right top;
}

#top #nav ul {
  width: 200px;
  overflow: hidden;
  position: absolute;
  top: 37px;
  left: -9001px;
  list-style: none;
  padding: 0px;
  margin: 0px;
  clear: both;
  font-family: Arial, Helvetica, Verdana, sans-serif;
  font-size: 12px;
}

#top #nav li.last ul {
  margin-left: -100px;
}

#top #nav li:hover ul {
  left: auto;
}

#top #nav ul li {
  float: none;
  display: block;
  width: 200px;
  height: auto;
  margin: 0px;
  padding: 0px;
  border: 0px;
  clear: both;
}

#top #nav li ul li a, 
#top #nav li.active ul li a, 
#top #nav li:hover ul li a,
#top #nav li.last ul li a,
#top #nav li.last:hover ul li a {
  float: none;
  display: block;
  border-top: 2px solid #ffffff;
  padding: 6px 14px;
  width: 172px;
  height: auto;
  color: #ffffff;
  line-height: 18px;
  background: url(/interface/images/subnav-bg.png);
}

#top #nav li ul li a:hover, 
#top #nav li.active ul li a:hover, 
#top #nav li:hover ul li a:hover  {
  background: #145036;
}


/* ---------------------------------------------------------------------------------- */
/* ----- Stijlen: Main -------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------- */

#main {
  width: 100%;
  overflow: hidden;
  position: relative;
  padding-bottom: 20px;
}

#main h1,
#main h2 {
  margin: 0px 0px 18px 0px;
  padding: 0px;
  font-family: "century gothic", futura, arial, helvetica, sans-serif;
  font-size: 18px;
  line-height: 26px;
  color: #a0ac00;
}

#main h3 {
  margin: 0px;
  padding: 0px;
  font-family: "century gothic", futura, arial, helvetica, sans-serif;
  font-size: 16px;
  line-height: normal;
  color: #a0ac00;
}

#main h4,
#main h5,
#main h6 {
  margin: 0px;
  padding: 0px;
  font-size: 12px;
  color: #a0ac00;
}

#main p {
  margin: 0px 0px 17px 0px;
  padding: 0px;
}

#main .nomargin {
  margin: 0px;
}

#main table {
  width: 100%;
  margin-bottom: 17px;
}

#main ul {
  margin: 0px 0px 17px 0px;
  padding: 0px;
  list-style: none;
}

#main ul.floated {
  float: left;
}

#main li {
  margin: 0px 0px 5px 0px;
  padding: 0px 0px 0px 18px;
  background: url(/interface/images/bullet.gif) no-repeat left 6px;
}

#main li ul {
  margin: 5px 0px 8px 0px;
}

#main .knop {
  float: right;
  padding: 8px 40px 8px 16px;
  font-family: "century gothic", futura, arial, helvetica, sans-serif;
  font-size: 13px;
  font-weight: bold;
  line-height: 20px;
  color: #ffffff;
  text-decoration: none;
  text-align: right;
  background: #145036 url(/interface/images/knop-bg.gif) no-repeat right top;
}

#main .knop:hover {
  text-decoration: underline;
}

#main .knop_licht {
  background: #a0ac01 url(/interface/images/knop-licht-bg.gif) no-repeat right top;
}

#main .knop_links {
  float: left;
  padding: 8px 16px 8px 40px;
  text-align: left;
  background: #a0ac01 url(/interface/images/knop-licht-links-bg.gif) no-repeat;
}


/* ---------------------------------------------------------------------------------- */
/* ----- Stijlen: Home -------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------- */

#main .logo_home {
  float: left;
  width: 341px;
  margin: 55px 0px 45px 0px;
}

#main .logo_home span {
  position: absolute;
  left: -9001px;
  top: 0px;
}

#main .bespaartip {
  float: right;
  width: 400px;
  margin-bottom: 45px;
  font-family: "century gothic", futura, arial, helvetica, sans-serif;
  font-size: 13px;
  font-weight: bold;
  line-height: 28px;
  color: #929d00;
  background: #e7edea url(/interface/images/content-uitgelicht-bg.gif) repeat-x left bottom;
}

#main .bespaartip .bespaartip_inner {
  width: 280px;
  overflow: hidden;
  padding: 5px 60px;
  background: url(/interface/images/content-uitgelicht-inner-bg.gif) repeat-x;
}

#main .bespaartip h2 {
  font-size: 26px;
  font-weight: normal;
  font-style: italic;
  color: #115136;
  text-align: right;
}

#main .bespaartip .link_meer {
  float: right;
  color: #145034;
  padding-right: 14px;
  text-decoration: none;
  line-height: 18px;
  background: url(/interface/images/bullet.gif) no-repeat right 4px;
}

#main .bespaartip .link_meer:hover {
  text-decoration: underline;
}

#main .homeboxes {
  clear: both;
  width: 100%;
  overflow: hidden;
  padding: 127px 0px 15px 0px;
  background: url(/interface/images/homeboxes-bg.gif) no-repeat;
}

#main .homeboxes .homebox {
  float: left;
  width: 220px;
  margin-right: 80px;
}

#main .homeboxes .last {
  margin-right: 0px;
}

#main .homeboxes .homebox h2 {
  margin-bottom: 8px;
}

#main .homeboxes .homebox .knop {
  float: none;
  display: block;
  text-align: left;
}


/* ---------------------------------------------------------------------------------- */
/* ----- Stijlen: Vervolgpagina's algemeen + Sidebar -------------------------------- */
/* ---------------------------------------------------------------------------------- */

#main #content {
  float: left;
  width: 570px;
  overflow: hidden;
}

#main .afbeelding_links {
  float: left;
  clear: left;
  margin-right: 15px;
}

#main .afbeelding_rechts {
  float: right;
  clear: right;
  margin: 0px 0px 15px 15px;
}

#main .afbeeldingen_onder {
  width: 585px;
  margin: 18px -15px 18px 0px;
}

#main .afbeeldingen_onder a {
  float: left;
  margin: 0px 15px 15px 0px;
}

#main .paragraaf {
  width: 100%;
  overflow: hidden;
}

#main #sidebar {
  float: right;
  width: 220px;
  overflow: hidden;
}

#main #sidebar .knop {
  float: none;
  display: block;
  background: url(/interface/images/knop-sidebar-bg.gif) no-repeat;
}

#main #sidebar .knop_licht {
  background: url(/interface/images/knop-sidebar-licht-bg.gif) no-repeat;
}

#main #sidebar .sidebox {
  width: 100%;
  overflow: hidden;
  margin-bottom: 27px;
}

#main #sidebar .testimonial {
  font-family: "century gothic", futura, arial, helvetica, sans-serif;
  font-size: 15px;
  font-weight: bold;
  line-height: 22px;
  color: #ffffff;
  background: #a0ac01 url(/interface/images/testimonial-bg.gif) no-repeat left bottom;
}

#main #sidebar .testimonial .testimonial_inner {
  width: 184px;
  overflow: hidden;
  padding: 12px 18px;
  background: url(/interface/images/testimonial-inner-bg.gif) no-repeat;
}

#main #sidebar .testimonial p {
  margin: 0px;
}

#main #sidebar .testimonial img {
  float: right;
  margin: 0px -10px -8px 0px;
}


/* ---------------------------------------------------------------------------------- */
/* ----- Stijlen: Test (financiele APK) --------------------------------------------- */
/* ---------------------------------------------------------------------------------- */

#main .test {
  float: left;
  width: 340px;
  margin-bottom: 20px;
}

#main .test .stappen {
  height: 36px;
  overflow: hidden;
  margin-bottom: 16px;
  padding: 0px;
  line-height: 26px;
  background: #a0ac00 url(/interface/images/test-stappen-bg.gif) no-repeat right top;
}

#main .test .stappen li {
  float: left;
  width: 47px;
  margin: 0px;
  padding: 5px 21px 5px 17px;
  font-family: "century gothic", futura, arial, helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;
  color: #ffffff;
  background: url(/interface/images/test-stap-bg.gif) no-repeat right top;
}

#main .test .stappen li.last {
  background: none;
}

#main .test .stappen li.active {
  margin-left: -14px;
  padding-left: 31px;
  background: #134f35 url(/interface/images/test-stap-active-bg.gif) no-repeat right top;
}

#main .test .stappen li.first_active {
  margin-left: 0px;
  padding-left: 17px;
  background-image: url(/interface/images/test-stap-first-active-bg.gif);
}

#main .test .stappen li.last_active {
  background-image: url(/interface/images/test-stap-last-active-bg.gif);
}

#main .test .stappen li a {
  color: #ffffff;
  text-decoration: underline;
}

#main .test table {
  color: #ffffff;
  line-height: 18px;
  background: #a0ac00 url(/interface/images/test-vragen-inner-bg.gif) no-repeat right top;
}

#main .test tr.alternate td {
  background: #7e950f;
}

#main .test tr.last .antwoorden {
  background: #a0ac00 url(/interface/images/test-vragen-last-bg.gif) no-repeat right bottom;
}

#main .test tr.alternate_last .antwoorden {
  background: #7e950f url(/interface/images/test-vragen-alternate-last-bg.gif) no-repeat right bottom;
}

#main .test td {
  padding: 6px 7px;
  border: 2px solid #ffffff;
  border-width: 0px 2px 2px 0px
}

#main .test table .nummer {
  width: 22px;
  font-family: "century gothic", futura, arial, helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;
  text-align: right;
  vertical-align: top;
}

#main .test table .vraag {
  width: 208px;
}

#main .test table .antwoorden {
  width: 64px;
  border-right: 0px;
}

#main .test table .antwoorden .antwoord {
  width: 100%;
  overflow: hidden;
  margin: 2px 0px;
}

#main .test table .antwoorden .antwoord input {
  float: left;
  margin: 2px 7px 0px 0px;
  padding: 0px;
  width: 13px;
  height: 13px;
}

#main .test table .antwoorden .antwoord label {
  float: left;
  width: 34px;
}

#main .test .stap_tekst {
  width: 100%;
  margin-bottom: 16px;
  overflow: hidden;
  color: #ffffff;
  line-height: 18px;
  background: #a0ac00 url(/interface/images/test-vragen-inner-bg.gif) no-repeat right top;
}

#main .test .stap_tekst_inner {
  width: 316px;
  overflow: hidden;
  padding: 12px;
  background: url(/interface/images/test-vragen-last-bg.gif) no-repeat right bottom;
}

#main .test .stap_tekst_inner a {
  color: #145035;
}

#main .test .stap_tekst_inner a:hover {
  color: White;
}

#main .test .knop {
  width: 113px;
}

#main #melding_test {
  display: none;
}


/* ---------------------------------------------------------------------------------- */
/* ----- Stijlen: Tips-module ------------------------------------------------------- */
/* ---------------------------------------------------------------------------------- */

#main .tips_categorieen {
  float: left;
  width: 175px;
  margin: 0px;
}

#main .tips_categorieen ul {
  width: 100%;
  overflow: hidden;
  margin: 0px;
}

#main .tips_categorieen ul li {
  float: left;
  width: 100%;
  margin: 0px;
  padding: 0px;
  line-height: 21px;
  clear: both;
  background: none;
}

#main .tips_categorieen ul li.active {
  margin-top: -1px;
}

#main .tips_categorieen ul li a {
  display: block;
  width: 128px;
  height: 17px;
  overflow: hidden;
  padding: 9px 16px;
  border-bottom: 1px solid #a2ab02;
  color: #646464;
  text-decoration: none;
  line-height: 17px;
  background: url(/interface/images/tips-categorie-bg.gif) no-repeat right 12px;
}

#main .tips_categorieen ul li.active a {
  padding: 8px 31px 8px 16px;
  border: 0px;
  background: #a0ac00 url(/interface/images/tips-categorie-active-bg.gif) no-repeat right top;
}

#main .tips_categorieen ul li a:hover {
  color: #a0ac00;
  text-decoration: underline;
}

#main .tips_categorieen ul li.active a,
#main .tips_categorieen ul li.active a:hover {
  color: #ffffff;
  text-decoration: none;
}

#main .tips_contentwrapper {
  float: right;
  width: 372px;
  line-height: 18px;
}

#main .tips_content {
  width: 100%;
  overflow: hidden;
  background: #e7edeb url(/interface/images/content-uitgelicht-bg.gif) repeat-x left bottom;
}

#main .tips_content_inner {
  width: 340px;
  padding: 0px 16px 16px 16px;
  background: url(/interface/images/content-uitgelicht-inner-bg.gif) repeat-x;
}

#main .tips_content_inner .tips {
  width: 100%;
  overflow: hidden;
}

#main .tips_content_inner .tips li {
  width: 100%;
  overflow: hidden;
  margin: 0px;
  padding: 0px;
  background: none;
}

#main .tips_content_inner .tips li .nummer {
  float: left;
  width: 30px;
  font-family: "century gothic", futura, arial, helvetica, sans-serif;
  font-size: 24px;
  line-height: normal;
  color: #145036;
}

#main .tips_content_inner .tips li .tip {
  float: right;
  width: 302px;
}

#main .tips_content_inner .tips li .tip ul {
  margin: 0px 0px 18px 0px;
}

#main .tips_content_inner .tips li .tip li {
  float: none;
  width: auto;
  margin: 0px 0px 5px 0px;
  padding: 0px 0px 0px 18px;
  background: url(/interface/images/bullet.gif) no-repeat left 6px;
}

#main .tips_contentwrapper .knop {
  width: 129px;
}


/* ---------------------------------------------------------------------------------- */
/* ----- Stijlen: Routebeschrijving ------------------------------------------------- */
/* ---------------------------------------------------------------------------------- */

#main #googlemap {
  width: 570px;
  height: 400px;
  position: relative;
  margin-bottom: 15px;
}

#main .routevan {
  width: 540px;
  overflow: hidden;
  margin: 3px 0px 0px 0px;
  padding: 10px 14px;
  border: 1px solid #dddddd;
  background: #f3f3f3;
  position: relative;
}

#main .routevan .formblock-route {
  float: left;
}

#main .routevan .formblock-route label {
  display: block;
  clear: both;
  color: #7a8300;
  font-weight: bold;
}

#main .routevan .formblock-route input {
  width: 154px;
  margin-right: 9px;
  padding: 3px 5px;
  border: 1px solid #d4d5d7;
  border-top: 1px solid #9e9ea1;
  font-family: Arial, Helvetica, Verdana, sans-serif;
  font-size: 12px;
  color: #686868;
}

#main .routevan #route_nr {
  width: 46px;
}

#container_routebeschrijving {
  margin-left: -5px;
  width: 605px;
}

#main .btn_route {
  margin-top: 6px;
  white-space: nowrap;
}


/* ---------------------------------------------------------------------------------- */
/* ----- Stijlen: Formulieren ------------------------------------------------------- */
/* ---------------------------------------------------------------------------------- */

#main .foutmelding {
  width: 284px;
  margin-bottom: 15px;
  padding: 8px 10px 8px 44px;
  border: 1px solid #e4bc00;
  font-size: 12px;
  font-weight: bold;
  line-height: 18px;
  color: #9e6400;
  background: #fff9cd url(/interface/images/melding-bg.gif) no-repeat 10px 6px;
}

#main .formulier {
  float: left;
  width: 340px;
}

#main .formulier .regel {
  width: 100%;
  overflow: hidden;
  clear: both;
  margin-bottom: 7px;
}

#main .formulier .regel label {
  float: left;
  width: 105px;
  padding-right: 10px;
}

#main .formulier .verplicht label {
  font-weight: bold;
  color: #175138;
}

#main .formulier .fingevuld label {
  color: #ee0000;
}

#main .formulier .regel input,
#main .formulier .textarea textarea {
  float: left;
  width: 213px;
  margin: 0px;
  padding: 3px 5px;
  border: 1px solid #d4d5d7;
  border-top: 1px solid #9e9ea1;
  font-family: Arial, Helvetica, Verdana, sans-serif;
  font-size: 12px;
}

#main .formulier .regel select {
  width: 225px;
}

#main .formulier .textarea textarea {
  height: 104px;
}


/* ---------------------------------------------------------------------------------- */
/* ----- Stijlen: Footer ------------------------------------------------------------ */
/* ---------------------------------------------------------------------------------- */

#footer {
  width: 100%;
  padding: 55px 0px 15px 0px;
  overflow: hidden;
  position: relative;
  color: #a0ac01;
  background: url(/interface/images/footer-bg.gif) no-repeat;
}

#footer .footerlinks {
  float: left;
  width: 39%;
}

#footer .footertekst {
  float: right;
  width: 59%;
  text-align: right;
}

#mainContact
{
	float:left;
	width:100%;
	margin-bottom: 15px;
}

#mainContactLeft
{
	float:left;
	width:315px;	
}

#mainContactRight
{
	float:left;
	width:460px;
	margin-left:45px;	
}

#mainContactRight h3
{
	margin-bottom: 18px;	
}

#mainContactRight #googlemap
{
	width:400px;
	height:280px;
	margin-top: 15px;	
}

#mainContact #contactformulier_small
{
	width: 315px;	
}

#mainContact .foutmelding
{
	width: 260px;	
}

#mainContact #contactformulier_small label
{
	width:80px;
}

#mainContact #contactformulier_small select
{
	font-size: 12px;
	height: 26px;
	padding: 2px;
	
}

#main #content_groot .routevan .formblock-route input 
{
	width:250px;
}

#main #content_groot .routevan #route_nr 
{
	width:70px;
}

#main #content_groot .routevan
{
	width:780px;	
}

