/* Notes

960px, 12 col, px based typography

body background color: #FAFAFA
highlight color: #
link color: #
----------------------------------------*/

p.footerbar {
clear: left; background: url('/img/footer.png') no-repeat; padding-top:13px; margin-top:20px; font-size: 14px; height:45px; color: #a7a7a7;
}

p.footerbar a{
color: #a7a7a7;
}

p.footerbar a:hover{
color: #ff9500;
}

.backtotop {
float: right;
margin-top:-20px;
margin-right: 15px;
}

a.footerhome {
padding-left:63px; 
color: #a7a7a7;
}

.fieldvacaturemedia {
background: #FFF;
padding:2px;
border:1px solid #EEE;
}

.vacatures #content-start h1, .contactpage #content-start h1, .sub #content-start h1{
padding-bottom:15px;
}

.companylogo {
float: right;
margin-left:5px;
margin-bottom:5px;
margin-top:-20px;
background: #FFF;
padding:3px;
border:1px solid #CCC;
}


.index h1.intro {
width: 520px;
}


.page-content a, .sub #content-start a {
font-weight: 400;
color: #004a68;
border-bottom:1px dotted #004a68;
}

.page-content a:hover, .sub #content-start a:hover {
border-bottom:1px solid #004a68;
}

/* Whitespace Reset
----------------------------------------------------------------------------------------------------*/
* {
	padding:0;
	margin:0;
	outline:none;
}

img {
	border: 0;
}

/* Global Settings
----------------------------------------------------------------------------------------------------*/

body { 
	background: #4c4c4c;
	text-align: left;
	position: relative;
}

.headerwrap { 
width: 100%;
background: #004a68 url('../img/header-bg2.jpg') top center no-repeat;
border-bottom:1px solid #0083b6;
position: relative;
}

.header {
width: 960px;
margin:0px auto;
padding: 0px 10px;
position: relative;
}

.index .header {
height: 315px;
}

.sub .header {
height: 99px;
}



.contentwrap { 
clear:both;
width:100%;
background: #f7f7f7 url('../img/content-bg.png') top left repeat-x;
}

.content {
width: 960px;
margin:0px auto;
padding: 30px 10px;
}

.index .content {
background: url('../img/quick-intro.png') top left no-repeat;
}

.side {

float: left;

padding-right:15px;
width:295px;
background: url('../img/sidebar-bgx.jpg') top left no-repeat;
}

.other {
padding-left: 15px;
background: url('../img/side-bg-sub.jpg') top left no-repeat;
}


.media-holder {
width: 390px;
display: block;
height: 346px;
}

/* Containers
----------------------------------------------------------------------------------------------------*/
.container_12 {
	padding-top:10px;
	margin-left: auto;
	margin-right: auto;
	width: 960px;
	background: url('../img/wrap-bg.jpg') top center no-repeat;
	position: relative;
	z-index:2;
}

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	display:inline;
	float: left;
	margin-left: 10px;
	margin-right: 10px;
}




/* Logo
----------------------------------------------------------------------------------------------------*/

a.logo, h1.logo {
	display: block;
	width: 300px;
	height: 70px;
	overflow: hidden;
	margin: 0;
	padding: 0;
	margin-bottom: 30px;
}

h1.logo a {
	display: block;
	width: 100%;
	text-indent: -9999px;
	height: 100%;
	background: url('../img/vivacature.png') no-repeat;
}

h1.logo a img {
	border: 0px;
	text-indent: 0;
}

.logo {  float: left;}


.intro { clear: both; }
/* Navigation sprite #330099
----------------------------------------------------------------------------------------------------*/



/* Linking styles
----------------------------------------------------------------------------------------------------*/

a {
color: #ff9500;
text-decoration: none;
}




/* Typography and vertical rhythm
----------------------------------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
	font-family: "Trebuchet MS";
	font-weight: 100;
	line-height: 1;
	margin-bottom: 5px;
	color: #4c4c4c;
}

h1 {
	font-size: 23px;
	font-family: "Trebuchet MS";
	display: block;
	/*width: 510px;*/
}

.header h1 {
	color: #FFF;
	
}

h2 {
	font-size: 23px; 
}

.vacatures h2 {
font-size: 18px; 
}

.sub h2 {

font-size: 18px; 
}

h3 {
	font-size: 18px; 
}

h4 {
	font-size: 21px; 
}

h5 { 
	font-size: 18px;
}

h6 { 
	font-size: 16px;
}

p { 
	font-family: "Nimbus Sans L", "Trebuchet MS", "Helvetica", "Verdana", arial, sans-serif;
	font-size:12px;
	line-height:20px;
	font-weight:400;
	margin-bottom: 20px;
	color: #4a4a4a;
}

ul, ol, dl
{
	margin-top: -10px;
	font-family: arial, sans-serif;
	font-size: 14px;
	margin-bottom: 20px;
	padding-left: 25px;
	
	color: #4a4a4a;
}

ul li
{
	padding-bottom: 5px;
	margin: 0px;
}

ol li
{
	padding: 0.2em 0;
	list-style: decimal inside;
}



table.details {
width:100%;
border:0;
border-top:1px solid #ccc;
padding:15px 0px;
font-family: "Trebuchet MS";
font-size:16px;
font-style: italic;
}


table.details td{
width:50%;
border:0;
}

table.details th{
border:0;
color: #ff9500;
}
table caption {
height:1px;
text-indent:-9999em;
}

table.laatstevacaturestabel {
font-family: Arial;
width:100%;
border:0;
font-size:12px;
}

table.laatstevacaturestabel tr td {
padding:3px;
border:0;
}

table.laatstevacaturestabel tr th {
padding:3px;
}

table.laatstevacaturestabel tr.zebra {
background: #FFF;
}



/* Paragraphs
----------------------------------------------------------------------------------------------------*/

p {
font-family: "Nimbus Sans L", arial, "Helvetica", "Verdana", arial, sans-serif;
font-size: 14px;
line-height: 20px;
}

.header p {
color: #FFF;
display: block;
width: 480px;
padding-top: 20px;
}

p.screenreader {
margin-left: -300px;
top: -50px;
position: absolute;
height:20px;
}

/* comps
----------------------------------------------------------------------------------------------------*/
.company-notice {
float: right;
width: 278px;
padding:15px;
background: #e2e2e2 url('../img/box-bg.png') repeat-x;
border: 1px solid #d5d5d5;
margin-left:30px;
}

.product-notice {
width: 272px;
padding:15px;
background: #e2e2e2 url('../img/box-bg.png') repeat-x;
border: 1px solid #d5d5d5;

}

.sub .company-notice {
float: none;
margin-left: -15px;
position: relative;
}



.company-notice h2{
font-size:16px;
}

.company-notice p{
font-size:12px;
}

.quick-intro {
padding-bottom: 10px;
float: right;
width: 196px;
padding-right: 15px;
}

.last {
padding-right: 0px;
margin-right: 0px;
}

.quick-intro img {
z-index: 11;
}

.quick-intro img.correct3 {
margin-left:1px;
margin-top:2px;
}

.quick-intro img.correct2 {
margin-left:1px;
margin-top:2px;
}

.quick-intro img.correct {

margin-top:2px;
}

.quick-intro h3{

font-style: italic;
font-size: 18px;
color: #ff9500;
display: block;
width: 196px;
margin-top: -85px;
z-index: 23;
}

.quick-intro h3 a{
z-index: 24;
position:relative;	
padding: 95px 0px 65px 0px;
display: block;
width: 196px;
height: 20px;
background: url('../img/box-bg.png') -900px no-repeat;
font-style: italic;
font-size: 18px;
color: #ff9500;
text-decoration: none;
}

.quick-intro h3 a:hover {
color: #4c4c4c;
}

.quick-intro p {
font-size: 12px;
display: block;
width:196px;
margin-top: -70px;
}

.page-content {
width:620px;
float: left;

margin-right:30px;
}

.product-media {
width: 634px;
height: 310px;
padding-left: 38px;
padding-top: 25px;
background: #FFF url(../img/media-bg.png) bottom center;
margin-left:-29px;

position: absolute;
z-index: 5;
}

.sidebar {

padding-top:13px;
float: left;
padding-left:15px;
padding-right:15px;
width:280px;
background: url('../img/sidebar-bg.jpg') top left no-repeat;
}

.sidebar h2 {
font-size: 16px;
}

.side h2 {
font-size: 16px;
margin-top: 20px;
}

.sub .product-notice h2 {
margin-top: 0px;
}

.content-content {

}


.sidebar h3, .side h3 {
display: inline;
font-size: 12px;
font-family: arial;
font-weight: 900;
color: #696969;
}

.sidebar h3 a, .side h3 a{
color: #5d5d5d;
}

.sidebar p, .side p {
display: inline;
font-size: 12px;
font-family: arial;
font-weight: 100;
color: #696969;
}

.sidebar em, .side em {
display: block;
margin-bottom: 10px;
padding-bottom: 10px;

}

.company-logo {
width: 84px;
height: 84px;
border-left: 1px solid #e2e2e2;
border-top: 1px solid #e5e5e5;
border-right: 1px solid #c8c8c8;
border-bottom: 1px solid #b9b9b9;
float: left;
display: inline;
margin-right: 10px;
margin-bottom: 10px;
}

#m2 { overflow: hidden; }

.company-logo img {
width: 84px;
height: 84px;
}

.sidebar h2.company-logos {
padding-bottom: 10px;
}

.company-logo.last {
margin-right:0px;
}

.media-component {
overflow: hidden;
position: absolute;
top:110px;
left: 50%;
margin-left: 80px;
z-index:2;
}

.index .page-content h2 {padding-top: 10px;}


.members {
position: absolute;
top:20px;
left: 50%;
margin-left: 180px;
}

.members li {
float: left;
list-style-type: none;
margin-right:5px;
}

.members li a{
display: block;
padding:5px;
background: #004a68;
}

.buttonholder {
height: 31px;
width:160px;
}

.page-content a.button, .sub #content-start a.button {
display:block;
width:160px;
height:24px;
background: url('/img/button.png') 0px 0px no-repeat;
font-size:12px;
font-family: Arial;
font-weight:100;
text-align: center;
color: #000;
padding-top:7px;
margin:0px;
font-weight: 100;
border:none;
}

.product-notice p, .company-notice p {
margin:0px;
padding:0px;
}

.product-notice a, .company-notice a {
display:block;
width:160px;
height:26px;
margin-left:60px;
margin-top:10px;
margin-bottom:0px;
background: url('/img/button-werk.png') 0px 0px no-repeat;
font-size:12px;
font-family: Arial;
font-weight:100;
text-align: center;
color: #000;
padding-top:5px;

font-weight: 100;
text-shadow: 1px 1px 1px #FFF;
}

 

.page-content a.button:hover, .sub #content-start a.button:hover {
display:block;
width:160px;
height:24px;
background: url('/img/button.png') 0px -31px no-repeat;
padding-top:7px;
margin:0px;border:0;
}

.product-notice a:hover, .company-notice a:hover {
display:block;
width:160px;
height:26px;
background: url('/img/button-werk.png') 0px -31px no-repeat;
padding-top:5px;
}



.vacature {

padding:15px 0px;
border-top:1px solid #d0d0d0;
}

.vacature p {
margin-bottom:10px;
padding:0;
}

.p20 {padding-bottom:20px;}

/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}

/* Little bits
----------------------------------------------------------------------------------------------------*/

hr {display: none; }

h1 b.vivacature { margin-left:-5px; }

span.reminder {
font-style: italic;
}

.warning {
display: block;
height: 30px;
border-top: 1px solid #fdada9;
border-bottom: 1px solid #fdada9;
background: #ffd9d7 url('../img/warning.png') center left no-repeat;
margin:20px 0px;
padding:10px 0px 0px 50px;
}

.warning p{
margin:0;
padding:0;
font-weight: 400;
}

.ok {
display: block;
height: 30px;
border-top: 1px solid #aff567;
border-bottom: 1px solid #aff567;
background: #f0ffe0 url('../img/ok.png') center left no-repeat;
margin:20px 0px;
padding:10px 0px 0px 50px;
}

.ok p{
margin:0;
padding:0;
font-weight: 400;
}

.profile-photo {

padding:3px;
border:1px solid #EEE;
display: block;
}

.profile h2 {
font-size:18px;
}

.content-content h2 {
font-size:18px;
}

.specs {
float: left;
width: 175px;
margin-top:20px;
border-right:1px solid #d9d9d9;
}

.profile-content {
margin-top:20px;
float: left;
width: 424px;
padding-left: 20px;
}

.profileoptions .profile-content {
padding:0; width:600px;
}

ul.options {
margin-top:10px;
font-size:12px;
}



.msg_list {
margin: 0px;
padding: 0px;
width: 620px;
}

.msg_list p{
margin: 1px;

}
.msg_head {
padding: 5px 10px;
cursor: pointer;
position: relative;
background-color:#4c4c4c;
color: #FAFAFA;
border-left:1px solid #2f2f2f;
border-top:1px solid #2f2f2f;
border-bottom:1px solid #757575;
border-right:1px solid #757575;
}
.msg_body {
padding: 5px 10px 15px 10px;
background-color:#FFF;
}
/***************************************

    Form styles

******************************/

.contactpage form { 

padding-bottom:5px;
margin-bottom:20px;
border-bottom:1px solid #CCC;
display: block;
}


form input {
margin:0;
padding:0;

}

form input.medium-input {
width:194px;
height:16px;
padding:3px;
margin-right:5px;
font-family:"Trebuchet MS";
font-style:italic;
font-weight:100;
}

form textarea.medium-text {
width:394px;
height:96px;
padding:3px;
margin-right:5px;
font-family:"Trebuchet MS";
font-style:italic;
font-weight:100;
}

form span {
padding-left:5px; font-style:italic;
font-size: 12px;

}

form legend {
display:none;
}

form fieldset {
border:none;
}

form label {
font-weight:100;

display:block;
font-size:1.1em;
margin:0;
padding-bottom:5px;
}

form label.error {
 font-variant:normal; display: inline;
}

form p.submit {
margin-top:-30px;

padding:0;
}

form p.agree {
margin-top:-30px;

padding:0;
}

form h2 {
margin-left:-5px;
}



/***************************************

    Footer styles

******************************/





.footerwrap {
clear: both;
border-top:1px solid #2c2c2c;
width:100%;
background: #4c4c4c url('../img/footer-bg2.jpg') top center no-repeat;
}

.sub .footerwrap {
background: #4c4c4c url('../img/footer-bg2.jpg') 0px -190px no-repeat;
}

.footer {
padding-top:20px;
width: 960px;
margin:0px auto;

color: #FFF;

font-size:10px;
font-family: arial;
}

.footer {
text-align: left;
}


.footer ul.footerlist {
font-size:10px;
border-left: 1px solid #666666;
display: block;
padding: 0px 15px;
width:160px;
float: left;
margin: 15px 0px 30px 0px;
}

.footer ul.footerlistnu {
font-size:10px;
border-left: 1px solid #666666;
display: block;
padding: 0px 15px;
width:260px;
float: left;
margin: 15px 0px;
}

.footer ul.footerlistnu li ul {
display: block;
width: 700px;

margin-left:175px;
margin-top:-70px;
font-size:10px;
padding-left:15px;
height: 60px;
}

.footer ul.footerlistnu li ul li{
float: left;
}

.footer ul.footerlistnu li ul li a{
padding-right:15px;
list-style-type: disc;
}

.footer ul.footerlistnu li ul li span{
color: #fafafa;
display: block;
width:800px;
font-size:13px;
color: #e0e0e0;
}

.footer ul.footerlistnu li h4 a{
display: block;
width: 160px;
height:40px;
background: url('../img/nucommunicatie.png') left center no-repeat;
margin:0;
padding-bottom:20px;
text-indent: -999em;
}

.footer ul.footerlist a{
color: #FAFAFA;
}

.footer h3.footerheader {
color: #FAFAFA;
margin-top:10px;
}

.footer .news {
text-align: left;
color: #FFF;
}

.footer h2, .footer p, .footer h3 {
text-align: left;
color: #FFF;
}

.footer h2 {
font-size:16px;
padding:0px;
margin:0;
}

.footer h3 {
font-size:14px;
font-weight:900;
color: #ffa200;
font-family: "Nimbus Sans L", arial, "Helvetica", "Verdana", arial, sans-serif;
}

.footer ul {
list-style-type:none;
margin:0;
padding:0;
display: block;

padding-top:5px;


}

.fcol {
width: 305px;
padding-right:20px;
float: left;
padding-bottom:20px;
}

.fcol ul li p{
font-size: 12px;
margin:0;
padding:0;
}

.lol {
width:290px;
padding-right:20px;

}



.footercol {
float: left;
width: 300px;

}


.overlay {
	position: absolute;
	z-index: 23;
	bottom: 0;  /* will cover the entire parent */
	left: 0;
	width: 390px;
	height:30px;
	background: #000;
	opacity: 0.40;
	-moz-opacity: 0.40; /* older Gecko-based browsers */
}

.description {
position: absolute;
bottom: 0;  /* will cover the entire parent */
left: 0;
width: 367px;
height:20px;
top: 146px;
padding-left: 8px;
}

.description2 {
position: absolute;
bottom: 0;  /* will cover the entire parent */
left: 0;
width: 367px;
height:20px;
top: 146px;
padding-left: 8px;
}



.description h3 {
	position: absolute;
	color: #EEE;
	opacity: 1;
	-moz-opacity: 1; /* older Gecko-based browsers */
	
	z-index:88;
	font-family: Verdana;
	font-weight:900;
	font-size:12px;
}

.description2 h3 {
	position: absolute;
	color: #EEE;
	opacity: 1;
	-moz-opacity: 1; /* older Gecko-based browsers */
	
	z-index:88;
	font-family: Verdana;
	font-weight:900;
	font-size:12px;
}

.description a {
color: #ffb854;
text-decoration: none;
font-weight:900;
}

.sub #content-start ul {
margin-top:15px;

}

.vacature-media-logo {
float: right;
padding:2px;
border:1px solid #EEE;
background: #FFF;
margin-left: 15px;
margin-bottom:15px;
}

#content-start a.button {
font-weight:100;
}

#searchcontainer {
font-family: "Trebuchet MS";
}


/*  Styling for Suggestion Box Container  */
.suggestionsBox {
	position: absolute;
	width: 340px;
	background-color: #212427;
	border: 2px solid #000;
	color: #fff;
	padding: 5px;
	margin-top: 33px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	z-index: 999;
	opacity: 0.95;
}

#inputString {
width: 340px;
padding: 3px;
font-size: 16px;

}


.suggestionList {
	margin: 0px;
	padding: 0px;
	
}


/*  Individual Search Results  */
.suggestionList li {
	margin: 0px 0px 3px 0px;
	padding: 7px;
	cursor: pointer;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	list-style-type: none;
}

/*  Hover effect  */
.suggestionList li:hover {
background-color: #FF9500;
font-weight: 400;
}


#content-start .content-content a.applynow {
padding-top:5px;
height:26px;
}

#content-start .content-content a.applynow:hover {
padding-top:5px;
height:26px;
}

#content-start .content-content a.applynow:active {
padding-top:6px;
height:24px;
}