/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, fieldset, form, label, legend,
 caption, tbody, tfoot, thead, tr, th, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}


td
{
	font-size: 100%;
	font: inherit;
	font-size:18px;
}


td.border
{
	font-size: 100%;
	font: inherit;
	font-size:12px;
	border: none;
	border-bottom:1px dashed #BBB;
}


td.border2
{
	font-size: 100%;
	font: inherit;
	font-size:12px;
	border: none;
	border-bottom:1px dashed #BBB;
	border-left:1px dashed #BBB;
}


input, select{
	font-size:18px;
	height: 30px;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

html {
	height: 100%;
}

body {
	line-height: 1;
	background-color:#000000;
	height: 100%;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}


textarea{	
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:18px;
}


blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

#wrapper {
	height: 100%;
	width: 100%;
}

#header {
	width: 100%;
	height: 170px;
	background-image: url(../images/header_bg.jpg);
	background-repeat:repeat-x;
	color: #FFFFFF;
	font-size:12px;
	font-weight:bold;
	line-height:14px;
}

#header a {
	color: #FFFFFF;
	text-decoration:none;
}

#header a:hover {
	text-decoration:underline;
}

#inheader {
	margin:0 auto;
	width: 940px;
	height: 170px;
}

#inheader img {
	float:left;
	display:inline;
}

#logoextranet {
	margin-top: 10px;
	width: 120px;
	height: 14px;
}

#logohome{
	margin:0 auto;
	
	}

#homeafmelden_A {
	float:left;
	margin-top: 0px;
	margin-left: 20px;
}


#homeafmelden_B {
	float:left;
	margin-top: 0px;
	margin-left: 20px;
}


.subheader {
	width: 100%;
	background-repeat:repeat-x;
}

#loginheader {
	height: 23px;
	background-image: url(../images/subheader_login_bg.jpg);
}

#welkomheader {
	height: 86px;
	background-image: url(../images/subheader_welkom_bg.jpg);
}

#projectheader {
	height: 162px;
	background-image: url(../images/subheader_project_bg.jpg);
}

#insubheader {
	margin:0 auto;
	width: 910px;
	padding-left: 30px;
	padding-top: 15px;
}

#insubheader p {
	color: #FFFFFF;
	font-size: 12px;
}

#logininhoud {
	width: 100%;
	padding-top:10%;
}

#inout_scr {
	margin:0 auto;
	width: 280px;
	height: 110px;
	-webkit-box-shadow: 1px 1px 3px 3px rgba(256, 256, 256, 0.38);
	-moz-box-shadow: 1px 1px 3px 3px rgba(256, 256, 256, 0.38);
	box-shadow: 1px 1px 3px 3px rgba(256, 256, 256, 0.38);
	
	padding-top: 50px;
	padding-left: 0px;
	background-color:#C0C0C0;
	float:left;
	margin:10px;
}


#inhoudkader {
	margin:0 auto;
	width: 950px;
	min-height: 300px;
	-webkit-box-shadow: 3px 3px 6px 6px rgba(192, 192, 192, 0.38);
	-moz-box-shadow: 3px 3px 6px 6px rgba(192, 192, 192, 0.38);
	box-shadow: 3px 3px 6px 6px rgba(192, 192, 192, 0.38);

	padding-top: 10px;
	padding-left: 10px;
	background-color:#FFF;
	float:left;
	margin:10px;
}


#login_scr {
	margin:0 auto;
	width: 455px;
	height: 200px;
	-webkit-box-shadow: 3px 3px 8px 8px rgba(192, 192, 192, 0.38);
	-moz-box-shadow: 3px 3px 8px 8px rgba(192, 192, 192, 0.38);
	box-shadow: 3px 3px 8px 8px rgba(192, 192, 192, 0.38);
	
	padding-top: 50px;
	padding-left: 60px;
	background-color:#000000;
}

#logo_scr {margin:0 auto;
	width: 465px;
	height: 200px;
	margin-top: -200px;
	
	padding-top: 50px;
	padding-left: 50px;
	}

#login_scr label {
	font-size: 17px;
	color: #C0C0C0;
}

#login_scr input {
	
	font-size: 18px;
	color: #C0C0C0;	
	border: 1px solid #C0C0C0;
	width: 250px;
	height: 30px;
	padding-left: 10px;
	line-height: 23px;
}

#login_scr #aanmelden {
	
	background-repeat:no-repeat;
	border: none;
	width: 151px;
	height: 30px;
	font-size: 18px;
	color: #FFFFFF;
	cursor:pointer;
	background-color: #C0C0C0;
}


h1 {
	font-size:28px;
	font-weight:bold;
	color:#FFFFFF;
}

h1.inout {
	font-size:26px;
	font-weight:bold;
	color:#FFFFFF;
	text-align: center;
}

h2 {
	font-size:28px;
	font-weight:bold;
	color:#fff;
	margin-bottom:7px;
}

h3 {
	font-size:20px;
	color:#B1B1B1;
	margin-top:7px;
	margin-bottom:7px;
	text-decoration:underline;
}


h4 {
	font-size:15px;
	color:#FFFFFF;
	margin-top:0px;
	margin-bottom:0px;
	text-decoration:underline;
	margin-left: 10px;
}


h5 {
	font-size:12px;
	color:#FFFFFF;
	margin-top:2px;
	margin-bottom:0px;
	margin-left: 10px;
}


#inhoud {
	width: 100%
}

#ininhoud {
	margin:0 auto;
	width: 910px;
	padding-left: 30px;
	padding-top: 30px;
}

#ininhoud_overzicht{
	margin:0 auto;
	width: 1100px;
	padding-left: 30px;
	padding-top: 30px;
}

#projectbeschrijving {
	width:284px; /*308*/
	height: 108px; /*105*/
	border: 1px solid #FFFFFF;
	padding:12px;
	float:left;
	margin-right: 14px;
}

.menu {
	/*width:308px; /*308*/
	height: 131px; /*50*/
	float: left;
	margin-left: 15px;
}

.menu .knop {
	width: 241px;
	height: 26px;
	background-image: url(../images/knop_rollover.gif);
	background-position:top;
	line-height: 26px;
	padding-left: 10px;
	color: #FFFFFF;
	font-size: 14px;
	margin-bottom:1px;
	display:block;
}

.menu .knop:hover {
	background-image: url(../images/knop_rollover.gif);
	background-position:bottom;
}

.menu .knopblock {
	width: 241px;
	height: 26px;
	background-image: url(../images/knop_rollover.gif);
	background-position:top;
	line-height: 26px;
	padding-left: 10px;
	color: #777;
	font-size: 14px;
	margin-bottom:1px;
	display:block;
	font-style: italic;
}


.menu a {
	text-decoration: none;
}

.table {
  display: table;
  border-collapse: separate;
  border-spacing: 10px;
}

.row { display:table-row;}

.cell {
  display:table-cell;height: 175px;
}


.cell a {
display:block;
width: 200px;
margin: 15px;
padding: 15px;
vertical-align:bottom;
text-align:center;

-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
font-size:21px;

background: #bd0b25; /* Old browsers */

/* IE9 SVG, needs conditional override of 'filter' to 'none' */

background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2JkMGIyNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM4MDE1MWQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);

background: -moz-linear-gradient(top,  #bd0b25 0%, #80151d 100%); /* FF3.6+ */

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bd0b25), color-stop(100%,#80151d)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(top,  #bd0b25 0%,#80151d 100%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(top,  #bd0b25 0%,#80151d 100%); /* Opera 11.10+ */

background: -ms-linear-gradient(top,  #bd0b25 0%,#80151d 100%); /* IE10+ */

background: linear-gradient(to bottom,  #bd0b25 0%,#80151d 100%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bd0b25', endColorstr='#80151d',GradientType=0 ); /* IE6-8 */

-webkit-box-shadow: 0 0 5px 0 #666;
box-shadow: 0 0 5px 0 #666;

color: #FFFFFF;
text-decoration:none;
}

.cell a:hover {
background: #bd0b25;
}

ul
	{
		list-style-type: none;
	}

.example {
	float: left;
	margin: 15px;
}

.demo {
	width: 800px;
	height: 400px;
	/*border-top: solid 1px #BBB;
	border-left: solid 1px #BBB;
	border-bottom: solid 1px #FFF;
	border-right: solid 1px #FFF;
	background: #FFF;*/
	overflow: scroll;
	padding: 5px;
}