/* *********************************************************************************************************************
	BaseNet - intranet 
	fluid & mobile ready

	Dit is het hoofd stijl bestand. Hierin zitten de meeste elementen verwerkt voor visuele vorm.
	Het onepcssgrid.css bestand bevat de layout van grid collomen en afwijkingen in stijl voor
	verschillende devices met behulp van media queries.
	Deze media queries worden afgevangen voor oudere browsers met behulp van javascript.

*/





/* *********************************************************************************************************************
 * Global
 */
body {
	background: #B5C7D6;
	font-size: 100%;
	font-family: Arial, Helvetica, sans-serif;
	color: #555;
}

a {
	/*color: #123970;*/
	color: #00acdd;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

strong {
	font-weight: bold;
}

em {
	font-style: italic;
}

hr {
	border-top: 1px solid #d8dfea;
	border-bottom: none;
	border-right: none;
	border-left: none;
	margin-top: 1.5em;
	margin-bottom: 1em;
}

h1 {
	font-family: "Arial Narrow", Arial, Helvetica, sans-serif;
	font-size: 1.8em;
	line-height: 1.2em;
	margin-bottom: 0.6em;
	text-transform: uppercase;
}

h2 {
	font-size: 1.5em;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	margin: 0 0 0 0;
	line-height: 1.0em;
	margin-bottom: 0.4em;
	text-transform: uppercase;
}

h3 {
	font-family: "Arial Narrow", Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	line-height: 1.2em;
	font-weight: bold;
	margin-bottom: 0.2em;
}

h4 {
	font-family: "Arial Narrow", Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	font-weight: bold;
}

p {
	margin: 0 0 0.8em 0;
	line-height: 1.4em;
}

form {
	margin: 0 0 2em 0;
}

legend {
	padding: 0 5px 0 5px;
	font-weight: bold;
	font-size: 0.9em;
	margin-left: -0.4em;
}

fieldset {
	border: 1px solid #E6E6E6;
	padding: 1.2em;
	
	-webkit-border-radius: 3px;		/* Safari/Chrome, other WebKit */
	-moz-border-radius: 3px;		/* Firefox, other Gecko */
	border-radius: 3px;				/* Default */
	margin-bottom: 1em;
}

a.button {
	font-size: 0.85em;
	display: inline-block;
}

button, submit, input[type=button], input[type=submit], a.button {
	box-sizing: border-box;
	
	padding: 0.2em 0.6em;
	margin: 1em 0 0 0;
	
	
	border: 1px solid #CCC;
	color: #666;
	cursor: pointer;
	
	background: #F2F2F2; /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmMmYyZjIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(242,242,242,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(242,242,242,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(242,242,242,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(242,242,242,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(242,242,242,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(242,242,242,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 ); /* IE6-8 */
}

button:hover, submit:hover, input[type=button]:hover, input[type=submit]:hover, a.button:hover {
	-moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);		/* Safari/Chrome, other WebKit */
	-webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);	/* Firefox, other Gecko */
	box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);			/* Default */	
	text-decoration: none;
}

button:disabled, a.button:disabled {
	background: #F2F2F2;
	border: 1px solid #DDD;
	cursor: not-allowed;
	color: #999;
}

button:disabled:hover a.button:disabled:hover {
	-moz-box-shadow: none;		/* Safari/Chrome, other WebKit */
	-webkit-box-shadow: none;	/* Firefox, other Gecko */
	box-shadow: none;			/* Default */
}

input[type=text], input[type=password], textarea {
	border: 1px solid #E6E6E6;
	padding: 0.3em 0.4em;
	color: #999;
}

input[type=text]:hover, input[type=password]:hover, textarea:hover {
	border-color: #CCC;
	color: #666;
}

input[type=text]:focus, input[type=password]:focus, textarea:focus {
	border-color: #00acdd;
	color: #333;
}

textarea {
	resize: vertical;
}
ul.normal {
	margin-left: 20px;
}
.widgetWindow ul {
	margin-left: 20px;
	margin-bottom: 10px;
}

.widgetWindow ol {
	margin-left: 20px;
	margin-bottom: 10px;
}
.widgetWindow ul li {
	list-style: disc;
}

.widgetWindow ol li {
	list-style: decimal;
}


/* *********************************************************************************************************************
 * Header
 */
#header {
	position: relative;
	padding: 2em 0 0 0;
	background-color: #F9F9F9;
	background-image: url('img/headerbg2.png');
	background-position: left top;
	background-repeat: no-repeat;
}

#header:after, #content:after, #footer:after, #navContainer:after {
	content: "";
	display: table;
	clear: both;
}

#navContainer {
	background: rgb(255,255,255); /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNWU1ZTUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(229,229,229,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-8 */
	border-bottom: 1px solid #DDD;
	border-top: 1px solid #EEE;
	box-sizing: border-box;
	/*
	-webkit-box-shadow: 0px 2px 1px 0px rgba(0, 0, 0, 0.45);
	-moz-box-shadow:    0px 2px 1px 0px rgba(0, 0, 0, 0.45);
	box-shadow:         0px 2px 1px 0px rgba(0, 0, 0, 0.45);
	*/
	padding: 0 20px;
}

/* login user menu */
.loginbar {
	background: #123970;
	height: 34px;
	width: 100%;
}
.login {
	margin: 0.3em 3% 0.3em 0;
}
	.login a {
		text-decoration: none;
		white-space: nowrap;
		line-height: 1.4em;
		color: #999;
	}
	.login a:hover {
		color: #FFF;
	}
	div.logged {
		cursor: pointer;
		color: #999;
	
		height: 24px;
		width: 24px;
		float: right;
		margin-right: 5px;
		margin-left: 25px;
		
		background-image: url(img/menu-user.svg);
		background-repeat: no-repeat;
		background-position: center right;
	}		
	div.loggedMenu {
		z-index: 1000;
		position: absolute;
		top: 0;
		right: 30px;
		text-align: left;
		background: #FFF;
		border: 1px solid #F2F2F2;
		padding: 1em;
		
		-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.45);		/* Safari/Chrome, other WebKit */
		-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.45);	/* Firefox, other Gecko */
		box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.45);			/* Default */	
	}
		div.loggedMenu ul li {
			border-top: 1px solid #DDD;
			line-height: 1.5em;
			font-size: 0.9em;
			padding: 0.5em 0 0.5em 1.5em;
			background-image: url(img/bullet.svg);
			background-repeat: no-repeat;
			background-position: center left;
		}
		div.loggedMenu ul li:first-child {
			border-top: none;
		}
		div.loggedMenu ul li.logout {
			background-image: url(img/logout.svg);
		}
		div.loggedMenu ul li.settings {
			background-image: url(img/gear.svg);
		}
		div.loggedMenu ul li.username {
			color: #999;
			background-image: url(img/user.svg);
		}
		div.loggedMenu ul li a, div.loggedMenu ul li a:hover {
			color: #DD2108;
		}
#menuButton {
	display: none;
	cursor: pointer;
	color: #999;

	height: 24px;
	width: 24px;
	float: right;
	border: none;
	
	background-image: url(img/menu.svg);
	background-repeat: no-repeat;
	background-position: center right;
}

#miniLogo {
	float: left;
	white-space: nowrap;
	line-height: 1.5em;
	color: #FFF;
}
#miniLogo a {
	color: #FFF;
}
#miniLogo:before {
	content: '';
	float: left;
	height: 24px;
	width: 24px;
	margin-right: 0.5em;
	background-image: url(img/VOC-ICO.png);
	background-repeat: no-repeat;
	background-size: cover;
	line-height: 24px;
}





/* *********************************************************************************************************************
 * Content container
 */
#content {
	background: #FFF;
	padding: 3em 0 4em 0;
}

/* form & validation style */
.singleField {
	margin: 0 0 0.3em 0;
	padding: 3px;
}
	.singleField label {
		display: inline-block;
		width: 45%;
	}
	.singleField label.error {
		margin-top: 0.3em;
		color: #DD2007;
		font-size: 0.85em;
	}
	.singleField label.check {
		width: 90%;
	}
	.singleField input[type=text], .singleField input[type=password] {
		width: 50%;
	}
	@media all and (max-width: 510px) {
		.singleField input[type=text], .singleField input[type=password] {
			width: 94.5%;
		}
	}
	.singleField textarea {
		width: 96%;
		display: block;
		margin-top: 0.3em;
	}
.singleFieldFocus {
	/*background-color: #FADEDA;*/
	background-color: #F2F2F2;
	-webkit-border-radius: 3px;		/* Safari/Chrome, other WebKit */
	-moz-border-radius: 3px;		/* Firefox, other Gecko */
	border-radius: 3px;				/* Default */
}
	
.tableStatic {
	margin: 0 0 1.8em 0;
	width: 100%;
}
.tableStatic td, .tableStatic th {
	border-bottom: 1px dotted #ddd;
	padding: 0.3em 0 0.3em 0;
	line-height: 1.2em;
	vertical-align: top;
}
.tableStatic th {
	min-width: 30%;
}
td.tdHoursNotOnInvoice {
	background-image:url(img/bg-td-hours-not-on-invoice.svg);
	background-position:2px 8px;
	background-repeat:no-repeat;
}
.tableLegenda {
	padding:2px 0 0 20px;
	background-image:url(img/bg-td-hours-not-on-invoice.svg);
	background-position:0px 2px;
	background-repeat:no-repeat;
}

/* linked projects (related to intranetuser) */
.favorite {
	background-image: url(img/star.svg);
	background-repeat: no-repeat;
	background-position: center center;
	text-indent: -9001em;
}
.favorite.active {
	background-image: url(img/star-active.svg);
}

/* widgetWindow */
.widgetHeader {
	padding: 1em 25px 0 25px;
	margin: -25px -25px 25px -25px;
	background: #F9F9F9;
	border-bottom: 1px solid #DDD;
}
	.widgetHeader ul {overflow: auto; margin-bottom: -1px;}
	.widgetHeader ul li {
		list-style: none;
		float: left; 
		margin-right: 5px;
	}
	.widgetHeader ul li a {
		position: relative;
		display: block;
		border: 1px solid #DDD;
		padding: 0.4em;
		
		color: #999;
		text-decoration: none;

		-webkit-border-radius: 3px 3px 0 0;		/* Safari/Chrome, other WebKit */
		-moz-border-radius: 3px 3px 0 0;		/* Firefox, other Gecko */
		border-radius: 3px 3px 0 0;				/* Default */
		
		background: rgb(221,221,221); /* Old browsers */
		/* IE9 SVG, needs conditional override of 'filter' to 'none' */
		background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RkZGRkZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZWVlZWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
		background: -moz-linear-gradient(top,  rgba(221,221,221,1) 0%, rgba(238,238,238,1) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(221,221,221,1)), color-stop(100%,rgba(238,238,238,1))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top,  rgba(221,221,221,1) 0%,rgba(238,238,238,1) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top,  rgba(221,221,221,1) 0%,rgba(238,238,238,1) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top,  rgba(221,221,221,1) 0%,rgba(238,238,238,1) 100%); /* IE10+ */
		background: linear-gradient(to bottom,  rgba(221,221,221,1) 0%,rgba(238,238,238,1) 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#eeeeee',GradientType=0 ); /* IE6-8 */
		outline: none;
	}
	.widgetHeader ul li a:hover {
		background: rgb(238,238,238); /* Old browsers */
		/* IE9 SVG, needs conditional override of 'filter' to 'none' */
		background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VlZWVlZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkZGRkZGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
		background: -moz-linear-gradient(top,  rgba(238,238,238,1) 0%, rgba(221,221,221,1) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(238,238,238,1)), color-stop(100%,rgba(221,221,221,1))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top,  rgba(238,238,238,1) 0%,rgba(221,221,221,1) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top,  rgba(238,238,238,1) 0%,rgba(221,221,221,1) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top,  rgba(238,238,238,1) 0%,rgba(221,221,221,1) 100%); /* IE10+ */
		background: linear-gradient(to bottom,  rgba(238,238,238,1) 0%,rgba(221,221,221,1) 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#dddddd',GradientType=0 ); /* IE6-8 */
		outline: none;
	}
	.widgetHeader ul li a.active {
		color: #666;
		background: #FFF;
		border-bottom: 1px solid #FFF;
		outline: none;
	}

.widgetWindow {
	position: relative;
	overflow: auto;
	
	-webkit-box-sizing: border-box;	/* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box; 		/* Default */
	
	-webkit-border-radius: 3px;		/* Safari/Chrome, other WebKit */
	-moz-border-radius: 3px;		/* Firefox, other Gecko */
	border-radius: 3px;				/* Default */
	
	border: 1px solid transparent;
	padding: 20px;
	margin: 0 0 2em 0;
	background: #FFF;
	-webkit-box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.2);
	-moz-box-shadow:    1px 1px 2px 1px rgba(0, 0, 0, 0.2);
	box-shadow:         1px 1px 2px 1px rgba(0, 0, 0, 0.2);
}
.widgetWindow:before {
	content: "";
	position: absolute;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	
	-webkit-border-radius: 1px;		/* Safari/Chrome, other WebKit */
	-moz-border-radius: 1px;		/* Firefox, other Gecko */
	border-radius: 1px;				/* Default */
				
	border: 1px solid transparent;
	pointer-events:none;
}
.widgetWindow.facebook {
	padding-right: 0px;
	padding-left: 0px;
	padding-top: 10px;
	padding-bottom: 30px;
	text-align: center;
}
.fb-like-box {
	display: inline-block;
	width: 100%;
}

/* WidgetFooter */
.widgetFooter {
	padding: 0.5em 25px 0.5em 25px;
	margin: 25px -25px -25px -25px;
	background: #F9F9F9;
	border-top: 1px solid #DDD;
	line-height: 24px;
	text-transform: uppercase;
	font-size: 0.8em;
	color: #999;
	clear: both;
}
	.widgetFooter span {
		font-weight: bold;
		color: #666;
	}

.blueWindow {
	color: #FFF;
	background-color: #00ACDD;
}
.blueWindow a:not(.button) {
	color: #FFF;
	text-decoration: underline;
}
.blueWindow a:hover:not(.button) {
	text-decoration: none;
}
/* table overflow container */
.tableContainer {
	/*overflow: auto; /* kan niet permanent op overflow-x: scroll; maar moet zo wel GAAN functioneren wanneer de tabel te gek wordt. */
	overflow-x: scroll;
}
	
/* widgetTabs (dossier details tabs) */
#tabs li {
	display: none;
	list-style: none;
}
#tabs li:first-child {
	display: block;
}

/* vorderingen edited values*/
.editedValue {
	color: #CC3333;
}

.gridcell {
	display: inline-block;
}

.formContainer {
	margin-top: 1em;
}

/* searchQuery */
.searchQuery {
	width: 98.5%;
	position: relative;
	background-image: url(img/search-padded.svg);
	background-repeat: no-repeat;
	background-position: center right;
}
.searchQueryFormTabContainer {
	margin-bottom: 20px;
}
/* system messages & errors (html in page) */
.systemError, .systemInfo, .systemSucces {
	padding: 1em 1em 1em 4em;
	border-width: 1px;
	border-style: dotted;
	margin-bottom: 10px;
	background-repeat: no-repeat;
	background-position: 10px center;
	margin-top: 1em;
}
.systemError {
	border-color: #DD2108;
	color: #DD2108;
	background-image: url(img/system-error.svg);
}
.systemInfo {
	border-color: #39F;
	color: #39F;
	background-image: url(img/system-info.svg);
}
.systemSucces {
	border-color: #9C0;
	color: #690;
	background-image: url(img/system-succes.svg);
}

.tooltip {
	cursor: help;
}

/* Date picker (hidden element fix) */
.ui-datepicker.ui-widget.ui-widget-content.ui-helper-clearfix.ui-corner-all {
	display: none;
}

/* *********************************************************************************************************************
 * Weergave leden op homepage
 */

div.homePageWidget {
	width: 100%;
	overflow: auto;
}
div.homePageWidget ul#membersList {
	width: 1710px;
	margin: 0;
	list-style: none;
	list-style-type: none;
	clear: both;
	white-space: nowrap;
}
div.homePageWidget ul#membersList li.memberListItem {
	width: 150px;
	float: left;
	margin: 0 20px 20px 0;
	list-style: none;
	list-style-type: none;
	display: block;
	overflow: hidden;
	line-height: 1.3em;
}
img.memberPicture {
	margin: 0 0 5px 0;
	display: block;
	clear: both;
}
img.memberPictureList {
	margin: 0 0 5px 0;
	display: block;
	clear: both;
	max-width: 70px;
	height: auto;
}

span.memberName, span.memberCompanyName {
	display: inline-block;
	width: 150px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

a.deelnemerLink:hover {
	text-decoration: none;
}

img.deelnemerPictureList {
	max-width: 70px;
	margin-right: 0.1em;
	margin-bottom: 0.1em;
}




/* *********************************************************************************************************************
 * Evenmenten weergave
 */

.eventDate {
	color: #BBB;
	font-size: 0.8em;
	margin-top: 1em;
	margin-bottom: 0.5em;
	border-top: 1px solid #EEE;
	border-bottom: 1px solid #EEE;
	padding: 0.2em 0;
}
.eventDateList {
	color: #BBB;
	font-size: 0.8em;
}
.eventDateFull {
	color: #BBB;
	font-size: 0.8em;
	border-top: 1px solid #EEE;
	border-bottom: 1px solid #EEE;
	padding: 0.2em 0;
	margin: 0.8em 0 0.5em 0;
}

a.meer {
	margin-left: 1em;
	font-size: 0.85em;
}
a.meer:before {
	content: "> ";
}


/* *********************************************************************************************************************
 * Footer
 */

#footer {
	height: 50px;
	line-height: 40px;
	position: relative;
	background-color: #FFF;
	background-image: url('img/bg-footer.svg');
	background-position: left bottom;
	background-repeat: no-repeat;
	padding: 40px 10px 10px 10px;
	font-size: 0.8em;
}
	a#BaseNet {
		color: #FFF;		
	}
	a#BaseNet span {
		color: #FFF;		
	}
	a#BaseNet:hover {
		text-decoration: none;
	}
	
	#footer .socialList li {
		float: right;
		margin-left: 1em;
	}


	#footer a.btn-mag img {
		margin-top: -21px;
		margin-left: -10px;
	}

/* *********************************************************************************************************************
 * Special effects & helpers
 */
.hidden {
	display: none;
}

#overlay {
	display: none;
	position: fixed;
	background: rgba(0,0,0,0.0);
	z-index: 500;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

#lightbox {
	display: none;
	position: fixed;
	background: rgba(0,0,0,0.75);
	z-index: 500;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
	#lightbox-container {
		position: absolute;
		top: 0;
		z-index:1000;
		display: none;
		left: 50%;
		top: 0;
		margin-top: 3.5em;
	}
	.lightboxHeader {
		text-align: right;
		padding: 0 1em 1em 1em;
		margin: -25px -25px 25px -25px;
		background: #F9F9F9;
		border-bottom: 1px solid #DDD;
	}
	.lightboxHeader span {
		float: left;
		margin: 1em;
		line-height: 1em;
		font-size: 1.4em;
	}
	
#lightbox-widget {
	font-size: 0.8em;
}


/* Aanpassingen "maatwerk" */
.wrapper {
	max-width: 1020px;
	margin: 0em auto 0em auto;
	position: relative;
}

.veldjes {
	display: none;
}