/* CSS Document */


body {
  font-size:13px;
  padding:0;
  margin:0;
  background-color:#fff;
  background-image: url('../images/bg_light.jpg');
  color:#343434;
  font-family: 'open_sansregular', verdana, arial, sans-serif;
}

ul, h1, p {
  padding:0;
  margin:0;
}

h2 {
  font-weight: normal;
}

#bg_dark {
  position:absolute;
  z-index:0;
  width:100%;
  height:700px;
  background-image:url('../images/bg_dark.jpg');
  background-repeat: no-repeat;
  -webkit-background-size: 100%;
  -moz-background-size: 100%;
  -o-background-size: 100%;
  background-size: 100%;
}

#wrapper {
  width:980px;
  margin:auto;
  position:relative;
  z-index:1;
  box-shadow: 0px 2px 8px #111;
}

#top {
  position:relative;
  z-index:1;
  width:980px;
  height:40px;
  margin:0 auto;
}

#main {
  width:100%;
  height:auto;
  background-color:#fff;

}

#main_top {
  width:100%;
  height:135px;  
}

#main_top_logo {
  width:370px;
  height:134px;
  background-image: url('../images/logo.jpg');
  background-repeat: no-repeat;
  float:left;
}


/* TOPPERR */


#top ul {
  display:block;
  float:right;
  margin-top:10px;
}
#top ul li {
  display:block;
  float:left;
  width:auto;
  height:auto;
  margin:0 0 0 5px;
}
#top li a{
  display:block;
  width:17px;
  height:18px;
  text-decoration: none;
  background-image: url('../images/flags.png');
}

#top ul li a.nl { background-position: 0 0; }
#top ul li a.de { background-position: -17px 0; }
#top ul li a.en { background-position: -34px 0; }
#top ul li a.fr { background-position: -52px 0; }
#top ul li a.pl { background-position: -69px 0; }

#top ul li a.nl:hover { background-position: 0 -18px; }
#top ul li a.de:hover { background-position: -17px -18px; }
#top ul li a.en:hover { background-position: -34px -18px; }
#top ul li a.fr:hover { background-position: -52px -18px; }
#top ul li a.pl:hover { background-position: -69px -18px; }

#top ul li a.nl.active { background-position: 0 -18px; }
#top ul li a.de.active { background-position: -17px -18px; }
#top ul li a.en.active { background-position: -34px -18px; }
#top ul li a.fr.active { background-position: -52px -18px; }
#top ul li a.pl.active { background-position: -69px -18px; }


/* GLOBAL NAV & CTA */

#main_top_right {
  width:607px;
  height:135px;
  float:right;
}

#main_top_right_nav {
  width:100%;
  height:60px;
  background-image: url('../images/top_nav/main_top_nav_bg.jpg');
}

#main_top_right_nav ul#nav {
  display:block;
}

#main_top_right_nav ul#nav li {
  display:block;
  float:left;
}

#main_top_right_nav ul#nav li a{
  float:left;
  display:block;
  background-image:url('../images/top_nav/nav_btns.jpg');
  height:60px;
  cursor:pointer;
}

ul#nav li a.home { width:73px; background-position: 0px 0px; }
ul#nav li a.about { width:159px; background-position: -73px 0px; }
ul#nav li a.work { width:176px; background-position: -232px 0px; }
ul#nav li a.request { width:106px; background-position: -408px 0px; }
ul#nav li a.contact { width:92px; background-position: -513px 0px; }

ul#nav li a.home:hover, ul#nav li a.home.active { width:73px; background-position: 0px -60px; }
ul#nav li a.about:hover, ul#nav li a.about.active { width:159px; background-position: -73px -60px; }
ul#nav li a.work:hover, ul#nav li a.work.active { width:176px; background-position: -232px -60px; }
ul#nav li a.request:hover, ul#nav li a.request.active { width:106px; background-position: -408px -60px; }
ul#nav li a.contact:hover, ul#nav li a.contact.active { width:92px; background-position: -513px -60px; }

#main_top_right_cta {
  overflow:hidden;
}

#main_top_right_cta h3 {
  display:block;
  float:right;
  font-weight:normal;
  margin:26px 20px 0 0;
  font-size:13px;
}

#main_top_right_cta a.btn.cta {
  display:block;
  float:right;
  height:40px;
  width:180px;
  background-color:#88bc0f;
  margin:17px 40px 0 0;
  cursor:pointer;
  text-decoration:none;
}

#main_top_right_cta a.btn.cta:hover {
  background-color:#78aa05;
}

#main_top_right_cta a.btn.cta span {
  display:block;
  text-align:center;
  color:#fff;
  font-size:14px;
  line-height:40px;
}





/* HEADER */

#main_header {
  width:100%;
  height:400px;
  background-image: url('../images/header_2.jpg');
  overflow: auto;  
}

#main_header #main_header_text {
  width:380px;
  height:250px;
  margin:40px 0 0 40px;

}

#main_header #main_header_text .row {
  width:500px;
  height:80px;
  background-image: url('../images/bg.png');
  background-repeat: repeat;
  margin-bottom:1px;
  color:#fff;
  font-family: 'open_sanssemibold', verdana, arial, sans-serif;
}

#main_header #main_header_text .row > span {
  display:block;
  margin-left:20px;
}

#main_header #main_header_text .row.large { font-size:18px; line-height:83px; overflow:hidden; white-space: nowrap; letter-spacing:-0.05em; }
#main_header #main_header_text .row.small { font-size:20px; line-height:80px; overflow:hidden; white-space: nowrap;}

#main_header #main_header_text .row.white span {
  font-weight: bolder;
  font-size:11px;
  letter-spacing:-0.03em;
}

#main_header #main_header_text .row.white { 
  font-size:12px;
  font-weight:bold;
  line-height:32px;
  color:#000;
  height:60px;
  background-image: url('../images/header_text_white_bg_shadow.png');
  margin:6px 0 0 0;
  background-color:transparent;
}

#main_header #main_header_text .white_row span {
  text-decoration: underline;
  color:#78aa05;
}





/* CONTENT */

#main_content {
  width:900px;
  height:auto;
  margin:0px auto 0px auto;
}

#main_content > p {
  margin-top:20px;
}

#main_content h1 {
  font-size: 20px;
  margin-top:30px;
  font-family: 'open_sansregular', verdana, arial, sans-serif;
  font-weight:normal;
}

#main_content_usp {
  margin-top:40px;
}

#main_content_usp .block {
  width:193px;
  height:250px;
  border:1px solid #eaeaea;
  float:left;
}

#main_content_usp .block:hover {
  border:1px solid #88bc0f;
}

#main_content_usp .block .icon {
  width:65px;
  height:65px;
  margin:30px auto 0 auto;
  background-image: url('../images/main_usp/icons.jpg');
}

#main_content_usp .block .icon.usp1 { background-position: 0px 0px; }
#main_content_usp .block .icon.usp2 { background-position: -65px 0px; width:68px;  }
#main_content_usp .block .icon.usp3 { background-position: -133px 0px; width:64px;  }
#main_content_usp .block .icon.usp4 { background-position: -195px 0px; }

#main_content_usp .text {
  text-align:center;
  width:163px;
  margin:30px auto 0 auto;
  font-size:12px;
}

#main_content_usp .spacer {
  width:38px;
  height:200px;
  float:left;
}

#main_content_cta {
  width:100%;
  overflow:hidden;
}

#main_content_cta h2 {
  display:block;
  padding:30px 0px;
  font-weight:normal;
  font-size:16px;
  float:left;
  letter-spacing: -0.03em;
}

#main_content_cta a.btn.cta {
  width:220px;
  height:50px;
  background-color:#88bc0f;
  float:right;
  margin-top:30px;
  cursor:pointer;
  text-decoration:none;
}

#main_content_cta a.btn.cta:hover {
  background-color:#78aa05;
}

#main_content_cta a.btn.cta span {
  display:block;
  color:#fff;
  text-decoration:none;
  font-size:16px;
  text-align:center;
  line-height:50px;
}





/* FOOTER */

#main_footer {
  width:100%;
  height:auto;
  background-color:#222222;
  overflow:hidden;
}

#main_footer #inner_footer {
  width:900px;
  margin:20px auto 0px auto;
}

#main_footer #inner_footer .col {
  width:273px;
  height:auto;
  margin-bottom:20px;
  float:left;
  color:#fff;
  overflow:hidden !important;
}

#main_footer #inner_footer .spacer {
	width:40px;
  height:100px;
  float:left;
}

#main_footer #inner_footer h2 {
  padding:0;
  margin:0px 0 0px 0;
  font-size:15px;
  width:auto;
}

#main_footer #inner_footer .company_address {
  display:block; 
  margin-top:20px;
}

#main_footer #inner_footer a {
  text-decoration: none;
  color:#88bc0f;
}


/* FOOTER LEFT */

#inner_footer .col .row {
  width:100%;
  height:60px;
}

#inner_footer .col .hor_spacer {
  height:20px;
  width:100%;
}

#inner_footer .col .row img {
  float:left;
  margin-right:20px;
}

#inner_footer .col .row p {
  float:left;
  width:273px;
  height:60px;
  color:#fff;
  font-size:11px;
  overflow:hidden;
  white-space:normal; 
  text-overflow: ellipsis;
  margin-left:0px;
}


/* BOTTOM FOOTER */

#footer {
  height:26px;
  background-color:#151515;
  font-size:10px;
  color:#A4A4A4;
  
}

#footer a {
  color:#A4A4A4;
  text-decoration: none;
}

#footer a:hover {
  color:#78aa05; 
}

#footer span {
  margin: 0 12px;
}

#footer > div {
  width:940px;
  margin:0 auto;
  padding-top:6px;
}




/* VAN ALLES */

.clear {
  clear:both;
}

.hr {
  display:block;
  height:40px;
  width:100%;
  border-bottom:1px solid #eaeaea;
}

.hr10 {
  display:block;
  height:0px;
  width:100%;
  border-bottom:1px solid #6E6E6E;
  margin:20px 0;
}

.white {
  color:#fff;
}

.bg_white {
  background-color:#fff;
}

.bg_black {
  background-color:#1c1c1c;
}

.bg_green {
  background-color: #88bc0f;
}

.green {
  color: #88bc0f;
  text-decoration: none;
}
.darkgreen {
  color: #78aa05;
}

.bg_darkgreen {
  background-color: #78aa05;
}

.darkgreen {
  color: #78aa05;
  text-decoration: none;
}

.bg_orange {
  background-color: #fa8406;  
}

.orange {
  color: #fa8406;
}

#htmlvalid{
	float:right;
	background:url('../images/valid.png') no-repeat;
	width:59px;
	height:14px;
}
#htmlvalid:hover{
	background:url('../images/valid.png') no-repeat;
	background-position:-60px;
}
#htmlvalid a{ 
	display:block;
	width:100%;
	height:100%;
}






/* CONTENT */

#main_content > h1 {
  
}

#main_content > h2 {
  margin-top:40px;
  font-size:23px;
}

ul.list {
  margin-top:20px;
  margin-left:40px;
}

ul.hor li {
  float:left;
  width:192px;
}

.map {
  margin: 20px 0px 20px 40px;
  width: 500px;
  display:block;
  float:right;
  border:3px solid #f2f2f2; 
}

#infograph {
  width:800px;
  display:block;
  margin:40px auto 20px auto ;
  background-image: url('../images/main_infographic/bg.jpg');
  background-repeat:no-repeat;
}

#infograph .row {
  width:100%;
  height:130px;
}

#infograph .row .icon  {
  width:100px;
  height:112px;
  background-image: url('../images/main_infographic/icons.jpg');
  background-repeat:no-repeat;

}

#infograph .row .icon.personal { background-position: 0 -112px; }
#infograph .row .icon.report { background-position: -100px -112px; }
#infograph .row .icon.anonymous { background-position: -200px -112px; }
#infograph .row .icon.match { background-position: -300px -112px; }
#infograph .row .icon.contact { background-position: -400px -112px; }


#infograph .row .text {
  width:660px;
  height: 120px;
  overflow: hidden;
}

#infograph .row.left .icon {
  float:left;
  margin-right:40px;
}

#infograph .row.right .icon {
  float:right;
  margin-left:40px;
}

#infograph .row.left .text {
  float:left;
}

#infograph .row.right .text {
  float:right;
}

#infograph .row .text p {
  color:#111;
  margin:10px 0 0 0;
  padding:0;
  line-height:22px;
  height:90px;
  position:relative;
}

/*
#infograph .row .text p.lightbrown { background-color:#e3b695; }
#infograph .row .text p.blue { background-color:#698da3; }
#infograph .row .text p.yellow { background-color:#ebb352; }
#infograph .row .text p.green { background-color:#9abd9c; }
#infograph .row .text p.brown { background-color:#a78579; } 

#infograph .row .text p { background-color:#f2f2f2; }
*/

#infograph .row .text p span {
  position:absolute;
  margin:0 20px 0 20px;
}
#infograph .row .text p span.five {
  top:0%;
}
#infograph .row .text p span.four {
  top:12%;
}
#infograph .row .text p span.three {
  top:23%;
}
#infograph .row .text p span.two {
  top:35%;
}

.list_bg ul {
  padding: 0 0 0 20px;
  display: block;
}

.list_bg {
  margin-top:20px;
  background-color:#f2f2f2;
  padding:20px 20px 20px 20px;
}

.contact {
  float:right;
}

#voorwaarden ul {
  margin-left:20px;
}

#sitemap ul {
  margin-left:40px;
  margin-top:20px;
}

#sitemap a {
  color:#111;
  text-decoration: none;
}

#sitemap a:hover {
  color:#88bc0f;
}

.clear.hor_spacer {
  height:40px;
}

div.table {
  width:800px;
  margin:20px auto 40px auto;
}

table.tbl_pricing {
  width:150px;
  height:150px;
}

table.tbl_pricing td.title {
  width:100%;
  height:40px;
  background-color:#404040;
}

.introductie {
  width:620px; 
  background-color:#ECF6CE;
  padding:20px 40px 20px 40px;
  margin:30px auto;
  
  text-align: center;
}

.introductie h3 {
  padding-top:0;
  margin-top:0;
}

.intro {
  text-decoration: none;
  color:#1c1c1c;
}