* {
margin: 0;
padding: 0;
}
.clr {
float: none;
clear: both;
}

/* CONTAINERS */
body, html{
height: 100%;
}
body {
background: url(../images/background_image.jpg) repeat-x top center #3c90b3;
font: normal 15px Garamond, Times, Times New Roman, Freesans, serif;
color: #c7e7f4;
}
#wrap{
background: url(../images/top_image.gif) no-repeat top;
height: 100%;
width: 100%;
padding: 0;
}
#container{
background: url(../images/footer2.gif) no-repeat bottom center;
height: 100%;
min-height: 100%;
}
html>body #container{
background: url(../images/footer.png) no-repeat bottom center;
height: auto;
}
#header{
background: url(../images/header.jpg) no-repeat top;
width: 980px;
height: 249px;
margin: 0 auto;
position: relative;
}
#content{
position:relative;
width: 900px;
overflow: hidden;
padding: 0 40px 100px 40px;
margin: 0 auto;
}

/* MENU */
#menu {
position: relative;
width: 619px;
height: 54px;
margin: -40px 0 0 273px;

}
#menu li {
list-style: none;
float: left;
width: auto;
}
#menu li a span {
visibility: hidden;
}
.m1, .m2, .m3, .m4, .m5, .m6 {
background: url(../images/menu.jpg) no-repeat top left;
height: 58px;
display: block;
float: left;
overflow: hidden;
width: auto;
}
#menu a span {
display: none;
}
a.m1 { background-position: 0 0; width: 97px;}
a.m2 { background-position: -97px 0; width: 114px; }
a.m3 { background-position: -211px 0; width: 139px; }
a.m4 { background-position: -350px 0; width: 115px; }

a:hover.m1 { background-position: 0 -58px;}
a:hover.m2 { background-position: -97px -58px;}
a:hover.m3 { background-position: -211px -58px;}
a:hover.m4 { background-position: -350px -58px;}


a#o1 { background-position: 0 -116px;}
a#o2 { background-position: -97px -116px;}
a#o3 { background-position: -211px -116px;}
a#o4 { background-position: -350px -116px;}

#logo {
position: relative;
width: 195px;
height: 64px;
padding: 29px 0 0 13px;
border: 0px;
}

/* H TAGS */
h1{
display:block;
width:600px;
position: relative;
margin: 120px 0 0 49px;
font: normal 30px Helvetica, Arial, sans-serif;
color: #ffffff;
}
html>body h1{
margin: 120px 0 0 49px;
}

#content .originator h1{
margin: 120px 0 0 149px;
}
html>body #content .originator h1{
margin: 120px 0 0 149px;
}
/*2e positie h1*/
h1#right{
margin-left: 282px;
}
html>body h1#right{
margin-left: 272px;
}
h2{
width: 209px;
height: 22px;
font: normal 18px Helvetica, Arial, sans-serif;
color: #87b9cd;
}
#subtitel h2{
margin: 36px 0 0 18px;
width: 659px;
}
html>body #subtitel h2{
margin: 36px 0 0 9px;

}
h3{
width: 209px;
height: 14px;
line-height: 14px;
font: normal 14px "Century Gothic", Tahoma, "Franklin Gothic Medium";
color: #000000;
}
h4{
color: #ffffff;
font-size: 14px;
}
h4 span{
color: #a7def4;
width: 79px;
float: left;
}

/* TEXT ELEMENTS */
a{
text-decoration: none;
color: #c7e7f4;
}
p a{
text-decoration: underline;
}

/* HOMEPAGE */
#col1{
position: relative;
margin: 22px 0 0 9px;
width: 209px;
float: left;
}
#col1 img{
border: 0px;
padding-bottom: 9px;
}
#col1 a{
height: 32px;
width: 208px;
background: url(../images/bc.jpg) no-repeat top center;
display: block;
}
#col1 a:hover{
background: url(../images/bco.jpg) no-repeat top center;
}
#col2{
position: relative;
margin: 22px 0 0 16px;
width: 209px;
float: left;
}
#col2 a {
margin: 0;
}
.home #col2 a.blanc{
line-height: 20px;
font-family: Garamond, Arial, Freesans, sans-serif;
margin: 10px 0 0 0;
color: #fff;
height: 22px;
width: 131px;
float: right;
text-align: center;
background: url(../images/bb.jpg) no-repeat center center;
border: 0;
}
.home #col2 a.blanc:hover{
background: url(../images/bbo.jpg) no-repeat center center;
border: 0;
height: 22px;
}
.home #col2{
width: 434px;
}
.home #col2 li{
margin-left: 22px;
}
.home ul#submenu{
margin: 0 0 25px 0;
}
.home ul#submenu li{
list-style: none;
}
.home #col3 {
margin-top: 70px;
}
.home a.bco {
height: 32px;
width: 208px;
background: url(../images/bc.jpg) no-repeat top center;
display: block;
}
.home a.bco:hover {
background: url(../images/bco.jpg) no-repeat top center;
}
.home #col2 a.leesmeer {
font: normal 15px Garamond, Times, Times New Roman, Freesans, serif;
color: #c7e7f4;
border: 0;
text-decoration: underline;
}
.home #col2 a:hover.leesmeer {
font: normal 15px Garamond, Times, Times New Roman, Freesans, serif;
color: #fff;
border: 0;
text-decoration: none;
}
#col2 h2{
margin-bottom: 25px;
width: 434px;
}
#col2 h3{
height: 24px;
background: url(../images/streep1.gif) no-repeat center 22px;
}
#col2 h4{
background: url(../images/streep1.gif) no-repeat center 24px;
line-height: 26px;
}

#col3{
position: relative;
margin: 22px 0 0 16px;
width: 209px;
float: left;
}
.home #col3,.profile #col3{
line-height: 20px;
}
#col3 img{
border: 0px;
padding-bottom: 9px;
}
#col3 h2{
margin-bottom: 25px;
}
#col3 p{
font-size: 15px;
font-weight: normal;
}
#col3 span{
font-weight: bold;
}
#col3 a:hover{
color: #fff;
text-decoration: none;
}
#col4{
position: relative;
margin: 75px 0 0 16px;
width: 209px;
float: left;
list-style: none;
}

/* OVERIGE BUTTONS HOME */
#assesment, #coaching, #teamcoaching, #recruitment{
padding-bottom: 11px;
width: 209px;
height: 58px;
display: block;
}
#assesment{
background: url(../images/bac.jpg) no-repeat top center;
}
#assesment:hover, #assesment.sel{
background: url(../images/baco.jpg) no-repeat top center;
}
#coaching{
background: url(../images/coa.jpg) no-repeat top center;
}
#coaching:hover, #coaching.sel{
background: url(../images/coao.jpg) no-repeat top center;
}
#teamcoaching{
background: url(../images/tco.jpg) no-repeat top center;
}
#teamcoaching:hover, #teamcoaching.sel{
background: url(../images/tcoo.jpg) no-repeat top center;
}
#recruitment{
background: url(../images/rec.jpg) no-repeat top center;
}
#recruitment:hover, #recruitment.sel{
background: url(../images/reco.jpg) no-repeat top center;
}
#bottombuttons{
font-size: 14pt;
float: left;
margin: 20px 0 0 235px;
width: 680px;
height: 20px;
color: #0b719a;
list-style: none;
display: inline;
}
#bottombuttons li{
float: left;
}
#bottombuttons li p{
float: left;
padding:0 26px;
width:10px;
}
#bottombuttons a{
font-size: 14px;
color: #000000;
}
#bottombuttons a:hover, #bottombuttons .sel{
color: #97c3d5;
}

/* HOMEPAGE LEES VERDER*/
.more #col2{
width: 659px;
}
.more #col2 span{
font-weight: bold;
}
.more #col2 ul{
list-style: circle;
margin-left: 16px;
}

/* PROFIEL PAGINA */
.profile #col2{
list-style: none;
margin-top: 23px;
width: 214px;
border-right: 2px solid #99c4d4; 
}
.profile #col3 {
position: relative;
width: 434px;
margin: 22px 0 0 16px;
float: left;
}
.profile #col2 li{
margin-bottom: 1px; 
}
.profile #col2 a.k1{
font-size: 14px;
font-weight: bold;
color: #fff;
width: 209px;
height: auto;
display: block;
border-top: 1pt solid #6fabc3;
border-bottom: 1pt solid #5093ad;
background: url(none) #559cb8;
padding: 4px 0 4px 5px;
margin: 0;
text-align: left;
}
.profile #col2 a.k2{
font-size: 13px;
color: #f1f1f1;
width: 207px;
height: auto;
display: block;
border-top: 1pt solid #6fabc3;
border-bottom: 1pt solid #5093ad;
background: url(none) #66a5b9;
padding: 2px 0 2px 7px;
margin: 0;
text-align: left;
}
.profile #col2 a.k1:hover, .profile #col2 a.k2:hover{
color: #004f6f;
background: url(none) #99c4d4;
}
.profile #col2 a.selected, .profile #col2 a.selected{
color: #004f6f;
background: url(none) #99c4d4;
}
.profile #col2 h3, .profile #col3 h3 {
font: bold 14px/16px "Century Gothic", Tahoma, "Franklin Gothic Medium";
height: auto;
margin: 20px 0 6px 0;
color: #000;
background: none;
}
.profile #col2 h2{
margin: 20px 0 20px 0;
width:400px;
}
.profile #col3 h3{
width:400px;
}
.profile #col3 p strong {
color: #FFF;
}
.profile #col3 h2 {
width: 434px;
color: #ffffff;
}
.profile #col3 img {
width: 152px;
height: 152px;
padding: 7px 0 0 10px;
float: right;
}
.profile #col3 ul {
list-style: disc;
margin-left: 25px;
font-weight: normal;
}
.profile #col3 ul li.indent {
list-style: circle;
margin-left: 30px;
}
.profile #col3 a.prev{
background: #0a3749;
padding: 3px 6px;
float: left;
font: normal 11px Garamond, Times, Times New Roman, Freesans, serif;
color: #fff;
text-decoration: none;
}
.profile #col3 a.prev:hover{
background: #12536d;
}
.profile #col3 a.next{
background: #0a3749;
padding: 3px 6px;
float: right;
font: normal 11px Garamond, Times, Times New Roman, Freesans, serif;
color: #fff;
text-decoration: none;
}
.profile #col3 a.next:hover{
background: #12536d;
}

/* OPDRACHTGEVER PAGINA */
.originator #col2 {
line-height: 18px;
}
.originator h3{
font: bold 14px/16px "Century Gothic", Tahoma, "Franklin Gothic Medium";
color: #000;
border: 0;
height: auto;
margin: 0 0 5px 0;
}
.originator p {
margin: 0 0 15px 0;
}
.originator #col2 h3{
background-image: url(none);
}
.originator #col2 img{
width: 209px;
height: 162px;
margin-top: 10px;
}
.originator #col1, .originator #col3{
line-height: 18px;
}
.originator #col4{
margin: 29px 0 0 16px;
}
.originator #col4 img{
width: 209px;
}
.originator #col4 a{
margin-top: 10px;
height: 32px;
width: 208px;
background: url(../images/bc.jpg) no-repeat top center;
display: block;
}
.originator #col4 a:hover{
background: url(../images/bco.jpg) no-repeat top center;
}

/* KANDIDATEN PAGINA */
.candidates #col3 {
margin-top: 85px;
}
.candidates #col3 a {
height: 32px;
width: 208px;
background: url(../images/bc.jpg) no-repeat top center;
display: block;
}
.candidates #col3 a:hover {
background: url(../images/bco.jpg) no-repeat top center;
}
.candidates #col2 {
position: relative;
width: 434px;
margin: 22px 0 0 16px;
float: left;
}
.candidates #col2 h2 {
margin: 30px 0 10px 0;
}
.candidates #col2 p strong {
color: #FFF;
}
.candidates #col2 .h3 {
font: bold 14px/16px "Century Gothic", Tahoma, "Franklin Gothic Medium";
border: 0;
height: auto;
color: #000000;
margin: 22px 0 5px 0;
background: url(none);
}


/* JOBS PAGINA */
.jobs #col2, .jobs #col3, .jobs #col4{
margin-top: 0;

}
.jobs #col2 p, .jobs #col3 p, .jobs #col4 p{
line-height:14px;

}
.jobs #col2 a, .jobs #col3 a, .jobs #col4 a, .home #col2 a{
font: bold 14px "Century Gothic", Tahoma, "Franklin Gothic Medium";
text-align: left;
color: #000;
padding-bottom: 2px;
margin: 15px 0 2px 0;
width: 209px;
border-bottom: 1px solid #000;
display: block;
background-position: center 22px;
position: relative;
}
.jobs #col2 a:hover, .jobs #col3 a:hover, .jobs #col4 a:hover, .home #col2 a:hover{
color: #fff;
}
html>body .jobs #col2 a:hover, html>body .jobs #col3 a:hover,html>body .jobs #col4 a:hover,html>body .home #col2 a:hover{
color: #fff;
border-bottom-color: #FFF;
}
.jobs a span, .home #col2 a span{
display: none;
width: 15px;
height: 18px;
position: absolute;
top: 0;
right: 0;
text-align: right;
}
.jobs a:hover span, .home #col2 a:hover span{
display: block;
}
.jobs #col2 h4, .jobs #col3 h4, .jobs #col4 h4{
background: url(../images/streep1.gif) no-repeat center 24px;
line-height: 18px;
height: 24px;
padding-top: 2px;
}
.jobs #col4 a.blanc{
font: normal 14px/20px Garamond, Arial, Freesans, sans-serif;
margin: 10px 0 0 0;
color: #fff;
border: 0;
height: 22px;
width: 131px;
float: right;
text-align: center;
background: url(../images/bb.jpg) no-repeat center center;
}
.jobs #col4 a.blanc:hover{
background-image: url(../images/bbo.jpg);
border: 0;
}

/* JOB PAGINA */

.job #col1{
width:233px;
}
.job #col2{
width: 305px;
background: url(../images/lijn.gif) repeat-x 0 18px;
margin:22px 15px 0 15px;
}
.job #col3{
margin: 21px 0 0 0;
width: 305px; 
}
.job #col1 a.terug{
margin:0 0 0 0;
text-align: center;
line-height: 21px;
float: right;
height: 22px;
width: 139px;
background: url(../images/bb.jpg) no-repeat center center;
display: block;
}
.job #col1 a.reageer{
margin: 10px 0 0 0;
height: 32px;
width: 233px;
background: url(../images/br.jpg) no-repeat top center;
display: block;
}
.job #col1 a.terug:hover{
background: url(../images/bbo.jpg) no-repeat center center;
}
.job #col1 a.reageer:hover{
background: url(../images/bro.jpg) no-repeat top center;
}
.job #col1 a.mail{
width: 170px;
overflow-x: hidden;
height: auto;
margin: 0;
}
.job #col1 a.mail:hover{
background: none;
color: #000;
}
.job #col1 a.mail{
background: url(none);
}
.job #col1 h4{
padding:3px 0 3px 0;
border-bottom:1px solid #07597a;
}
.job #col2 .h3,.job #col1 .h3, .job #col3 .h3, .job #col3 .h3plus{
font: bold 14px/16px "Century Gothic", Tahoma, "Franklin Gothic Medium";
line-height: 14px;
padding:0; 
text-align: left;
color: #000;
padding-bottom: 5px;
display: block;	
}
.job #col3 .h3, .job #col3 .h3plus{
background: url(none);	
}
.job #col3 .h3plus{
margin-top: 25px;
}
.job #col2 p, .job #col3 p{
margin:0;
padding: 7px 0 0 0;
}
.job #col3 p{
background: url(../images/lijn.gif) repeat-x 0 0;
}
.job #col3 ul{
list-style: square;
margin-left: 14px;
}
.job p.h3extra{
margin:25px 0 0 0;
background: url(../images/lijn.gif) repeat-x bottom;
font: bold 14px "Century Gothic", Tahoma, "Franklin Gothic Medium";
line-height: 28px;
color: #000;
padding:0;
}
.job #col1 p.h3extra{
font: bold 14px "Century Gothic", Tahoma, "Franklin Gothic Medium";
line-height: 14px;
margin:0;
padding:0 0 6px 0;
}

/* CONTACT PAGINA */
.contact #col1, .contact #col2{
margin: 15px 0 0 9px;
display: inline;
overflow: hidden;
}
.contact #col2 h3{
height: auto;
font-size: 16px;
line-height: 16px;
}
.contact #col3{
width: 434px;
margin: -262px 0 0 25px;
overflow: hidden;
}
.contact #col2 a, .contact #col2 h4{
background: url(none);
line-height: normal;
}
.contact #col2 a{
height: auto;
margin: 0;
color: #fff;
}
.contact #col2 a:hover{
color: #000;
}
.contact #map{
margin: 0 0 0 9px;
width:434px; 
height:220px;
border: 1px solid #FFF;
}
.contact h2{
margin:20px 0 20px 9px;

line-height:20px;

}
.contact #col1 .h3{
font: bold 14px/14px "Century Gothic", Tahoma, "Franklin Gothic Medium";
padding:0 0 5px 0; 
text-align: left;
color: #000;
width: 209px;
display: block;
background: url(none);
}
.contact #col3 h2{
width: 340px;
margin: 0 0 19px 0;
}
.contact #col3 a{
display: block;
float: right;
background: url(../images/bv.jpg) no-repeat top center;
height: 32px;
width: 292px;
}
.contact #col3 a:hover{
background: url(../images/bvo.jpg) no-repeat top center;
}
.contact #col3 a.blanc{
background: 0;
display: inline;
float: none;
}
label{
font: bold 14px "Century Gothic", Tahoma, "Franklin Gothic Medium";
padding:0; 
text-align: left;
color: #000;
display: block;
background: url(none);
float: left;
width: 130px;
height:26px;
}
input.input, textarea {
font: normal 14px/18px Garamond, Arial, Freesans, sans-serif;
float: left;
overflow:auto;
width:282px;
border:none;
margin:0 0 2px 8px;
border-top:2px solid #cac7c2;
padding:0 5px;
}
input#attachment {
border-top-width: 0;
margin-top: 6px;
}
textarea{
width:296px;
padding:0;
}
input.input {
display: block;
height: 21px;
}
select{
margin: 0 0 2px 8px;
width: 294px;
height: 21px;
padding: 0 4px 0 4px;
float: left;
border:none;
border-top:2px solid #cac7c2;

}
input.file{
margin: 2px 0 2px 8px;
float: left;
width: 296px;
height: 21px;
float: left;
border:none;
border-top:2px solid #cac7c2;
}
.contact #send{
width: 296px;
float: right;
margin:5px 0 0 0;
}
.radio {
margin: 0 3px 3px 3px;
}
.contact p{
width: 290px;
float: left;
padding: 0 0 0 3px;
margin:3px 0 5px 0;
}
textarea{
padding: 3px 4px 3px 4px;
width: 286px;
height: 88px;
}
