
/**
*   Stylesheet www.beterenbalans.nl
*
*   Author: Matthijs Abeelen
*   Url: www.sitestone.nl
*
****************************************************************/

/* Reset */

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,font,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 {
	margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent; }
body{ line-height:1; }
ol,ul{ list-style:none; }
blockquote,q{ quotes:none; }
blockquote:before,blockquote:after,q:before,q:after{ content:'';content:none; }
:focus{ outline:0; }
ins{ text-decoration:none; }
del{ text-decoration:line-through; }
table{ border-collapse:collapse;border-spacing:0; }

/* Typography */

body { font:13px/1.5 Helvetica,Arial,'Liberation Sans',FreeSans, Verdana, sans-serif; }
a:focus { outline:1px dotted invert; }
hr { border-color:#ccc;border-style:solid;border-width:1px 0 0;clear:both;height:0; }
h1 { font-size:25px; }
h2 { font-size:20px;line-height:24px;text-transform:uppercase;font-weight:normal;}
h3 { font-size:18px;font-weight:normal; }
h4 { font-size:12px;font-weight:bold; }
h5 { font-size:12px; }
h6 { font-size:12px; }
ol { list-style:decimal; }
ul { list-style:square; }
li {  margin-left:30px; }
p,dl,hr,h1,h2,h3,h6,ol,ul,pre,table,address,fieldset { margin-bottom:20px; }
ol { list-style: decimal; }
ul { list-style: disc; }
li { margin-left: 30px; }

/* Clearing */

html body * span.clear,
html body * div.clear,
html body * li.clear,
html body * dd.clear { background:none;border:0;clear:both;display:block;float:none;font-size:0;list-style:none;margin:0;padding:0;
	overflow:hidden;visibility:hidden;width:0;height:0; }
.clearfix:after{ clear:both;content:'.';display:block;visibility:hidden;height:0; }
.clearfix{ display:inline-block; }
* html .clearfix{ height:1%; }
.clearfix{ display:block; }

/* Force scrollbar */

html { overflow-y: scroll; } 

/* Design & Colors */

body { background:#CB6F15;color:#444; }
a { color:#EB821B;text-decoration:none; }
a:hover { text-decoration:underline; }
h2,h3,h4,h5 { color:#333; }
blockquote { font-style:italic;font-size:15px;color:#888;font-family:Georgia,serif; }
blockquote p { margin:0 0 5px; }
span.date { color:#444;text-transform:uppercase;font-size:12px; }

/* Layout grid */

#container { width:900px;margin:0 auto;padding:20px 0 60px;background:#fff; }
#header { height:170px;position:relative;background:transparent url(../img/bg-header-orange.jpg) 570px 0 no-repeat;border-bottom:0px solid #eee; }
#logo { margin:0px 0 0 35px;padding:0;height:120px;width:281px; }
#dienstverlening #header { background:transparent url(../img/bg-header-stetos.jpg) 550px 0 no-repeat; }
#kennismaking #header { background:transparent url(../img/bg-header-appel.jpg) 550px 0 no-repeat; }
#aanbevelingen #header { background:transparent url(../img/bg-header-chart.jpg) 580px 0 no-repeat; }

/* Navigatie */
#nav { margin:0 90px;padding:0;list-style:none;height:35px;background:transparent url(../img/bg-nav.png) 0 0 no-repeat;position:relative; }	
#nav li { margin:0;padding:0;display:inline;list-style:none; }
#nav li a { 
	line-height:35px;color:#333;text-transform:uppercase;font-size:11px;text-decoration:none;
	position:absolute;top:0px;display:block;width:80px;height:35px;margin:0;padding:0;text-indent:-9999px;
	background:transparent url(../img/bg-nav.png) 0 0 no-repeat; }
#nav li#nhome a { left:15px;width:50px;background-position: -15px 0px; }
#home li#nhome a, #nav li#nhome a:hover { background-position: -15px -35px; }
#nav li#ndienstverlening a { left:80px;width:115px;background-position: -80px 0px; }
#dienstverlening li#ndienstverlening a, #nav li#ndienstverlening a:hover { background-position: -80px -35px; }
#nav li#nkennismaking a { left:210px;width:105px;background-position: -210px 0px; }
#kennismaking li#nkennismaking a, #nav li#nkennismaking a:hover { background-position: -210px -35px; }
#nav li#naanbevelingen a { left:330px;width:110px;background-position: -330px 0px; }
#aanbevelingen #nav li#naanbevelingen a, #nav li#naanbevelingen a:hover { background-position: -330px -35px; }
#nav li#ncontact a { left:455px;width:80px;background-position: -455px 0px; }
#contact #nav li#ncontact a, #nav li#ncontact a:hover { background-position: -455px -35px; }


/* Content */

#content {}
#maincontent { float:left;width:480px;margin:0 0 0 110px;display:inline;padding:35px 0 0; xborder-top:2px solid #333;}
h3#hd-bb { height:30px;text-indent:-9999px;background:transparent url(../img/hd-bb.gif) 0 0 no-repeat; }
#subcontent { float:right;width:160px;margin:0 105px 0 0;display:inline;padding:35px 0 0; xborder-top:2px solid #333;}
#subcontent h4 { height:16px;margin:0 0 9px;text-transform:uppercase;font-size:11px;color:#777;font-weight:bold;letter-spacing:1px;
	background:transparent url(../img/hd-submenu.gif) 0 0 no-repeat;text-indent:-9999px; }
#subcontent ul {}
#subcontent ul li { margin:0;list-style:none; }

#subcontent p { font-size:12px;color:#666;margin:0 0 10px; }
#subcontent p strong { color:#222; }
#subcontent img { margin:0 0 10px; }
#emailcontact {  }
#footer { clear:both;padding:20px 0; }
#footer p { margin:0 110px;font-size:11px;line-height:30px;color:#666;padding:0;padding-left:20px;
	background:transparent url(../img/icon-email.png) 0 50% no-repeat;
	border-top:1px solid #eee;
}

#subcontent p.large { font-size:13px;color:#444;background:#f2f2f2;padding:10px;margin:0 -10px 10px -10px; }

/* Forms */
form p { margin:0 0 4px;}
label { font-weight: bold; }
fieldset { padding:1em; margin: 0 0 1.5em 0; border: 1px solid #ccc; }
legend { font-weight: bold; font-size:12px; }
	
input[type=text], input[type=password],
input.text, input.title,
textarea, select {
  background-color:#fff;
  border:1px solid #bbb;
}
input[type=text]:focus, input[type=password]:focus,
input.text:focus, input.title:focus,
textarea:focus, select:focus {
  border-color:#666;
}

input[type=text], input[type=password],
input.text, input.title,
textarea, select {
  margin:0.2em 0;margin:2px 0;
}

input.text,
input.title   { width: 300px; padding:5px; }
input.title   { font-size:1.5em; }
textarea      { width: 390px; height: 250px; padding:5px; }

input[type=checkbox], input[type=radio],
input.checkbox, input.radio {
  position:relative; top:.25em;top:.1em;
}
.error,
.notice,
.success    { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }
.error      { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.success    { background: #E6EFC2; color: #264409; border-color: #C6D880; }

/* Images */
#maincontent img { border:2px solid #ddd;padding:2px;  } 
.pull-r { margin: 0 -180px 18px 18px;float: right; position:relative; }

