html, body{
	padding:0;
	margin:0;
}
body{
	font-family:Trebuchet, Verdana, Arial;
	background-color:#50A2D9;
}
a{
	color:#000000;
	text-decoration:none;	
}
table td, table th{
	padding:3px;
}
table th {
	font-weight: bold;
}
input, select{
	padding:10px;
	border:1px solid #DDDDDD;
}

.clear{
	clear:both;
}

div#logo{
	position:absolute;
	top:100px;
	right:100px;
	width:164px;
	height:271px;
	background-image:url('../images/we_make_it_work.png');
	background-repeat:no-repeat;
}
body.loggedin div#logo{
	top:200px;
}

div#welcome{
	width:700px;
	height:180px;
	padding-top:120px;
	margin:0 auto;
	text-align:center;
	background-color:#FFFFFF;
	font-size:30px;
}

div#header{
	width:494px;
	padding:0px;
	margin:100px auto 0;
	vertical-align:bottom;
}
	div#header div.wrapper{
		height:80px;
		background-image:url('../images/survey.png');
		background-position:center;
		background-repeat:no-repeat;	
	}
body.loggedin div#header{
	width:100%;
	background-color:#FFFFFF;
	margin:0;
}
	body.loggedin div#header div.wrapper{
		height:100px;
		background-image:url('../images/survey_blue.png');
		background-position:left center;
		position:relative;
		width:990px;
		margin:0 auto;
	}
		div#header div.wrapper div.menu{
			position:absolute;
			top:30px;
			right:0;
		}
			div#header div.menu a{
				margin-bottom:-2px;
				font-size:18px;
				display:inline-block;
				padding:5px 15px;
				color:#525252;
			}
				div#header div.menu a + a{
					border-left:1px solid #525252;
				}
			div#header div.menu a:hover{
				color:#50A2D9;
				background-position:200px;
			}

div#login, div#tablet{
	position:relative;
	width:300px;
	padding:20px 5px;
	margin:0 auto;
	background-color:#FFFFFF;
	font-size:12px;
}
div#login{
	margin-top:100px;
	padding:35px 45px;
}
div#tablet{
	width:800px;
}
	div#tablet h1{
		font-size:18px;
	}
	div#login form{
		width:auto;
		text-align:center;
		margin:0 auto;
	}
		div#login input,
		div#tablet input,
		div#tablet select{
			margin:10px 0 0;
			width:220px;
		}
			div#login input.login,
			div#tablet input.next,
			div#login a.button{
				padding:10px 30px;
				width:182px;
				margin:10px 0 0;
				background-color:#FFFFFF;
				font-family:Arial;
				text-align:center;
			}
			div#login input.login,
			div#login a.button{
				color:#FFFFFF;
				background-color:#50A2D9;
				border:1px solid #DDDDDD;
			}
			div#login input.login{
				width:244px;
				background-image:url('../images/arrow_right.png');
				background-repeat:no-repeat;
				background-position:right 6px;
			}
			div#login input.email,
			div#login input.password{
				width:186px;
				padding-left:44px;
				background-image:url('../images/email.png');
				background-repeat:no-repeat;
				background-position:10px 10px;
			}
			div#login input.password{
				background-position:10px 5px;
				background-image:url('../images/password.png');
			}
			div#login a.button{
				display:inline-block;
			}
	div#tablet div.locations,
	div#tablet div.operations{
		margin-top:15px;
	}
		div#tablet div.locations input.location,
		div#tablet div.operations input.operation{
			width:250px;
			float:left;
			margin:8px;
			padding:15px 30px;
			background-color:#FFFFFF;
			border:1px solid #DDDDDD;
		}
	div#tablet div.location_select{
		position:absolute;
		top:0;
		right:0;
	}
div#container{
	position:relative;
	width:990px;
	margin:45px auto 0;
	padding-bottom:100px;
	min-height:650px;
}
body.loggedin div#container{
	background-color:#FFFFFF;
}
	div#container div.spacer{
		padding:35px 45px;
	}
	div#container div.message,
	div#tablet div.message{
		padding:10px;
		margin-bottom:5px;
		background-color:red;
		clear:both;
		color:#FFFFFF;
	}
		div#container div.message h3,
		div#tablet div.message h3{
			margin:5px 0;
			font-weight:bold;
		}
		div#container div.message span,
		div#tablet div.message span{
			float:left;
			display:block;
			width:100%;
		}
	div#container div.survey_group{
		width:100%;
		margin-bottom:10px;
		clear:both;
	}
		div#container div.survey_group span.title{
			display:block;
			font-weight:bold;
		}
		div#container div.survey_group span.info{
			display:block;
			margin-bottom:15px;
		}
		div#container div.survey_group div.question{
			padding-bottom:15px;
		}
	div#container div#footer{
		position:absolute;
		bottom:0;
		width:100%;
		height:100px;
		background-color:#50A2D9;
		background-image:url('../images/weerdenburg.png');
		background-repeat:no-repeat;
		background-position:center;
	}
	div#container div#tabs{
		float:left;
		width:100%;
		padding-bottom:10px;
	}
/*
		div#container div#tabs a{
			margin-left:10px;
			float:left;
			padding:5px 30px;
			border:1px solid #DDDDDD;
			text-align:center;
		}
			div#container div#tabs a{
				background-color:#CCCCCC;
				color:#FFFFFF;
			}
			div#container div#tabs a.clickable{
				background-color:#FFFFFF;
				color:#000000;
			}
			div#container div#tabs a.active{
				color:#FFFFFF;
				background-color:green;
			}
*/
		div#container div#progressbar{
			width:100%;
			background-color:red;
			margin-bottom:15px;
		}
			div#container div#progressbar span{
				display:block;
				height:20px;
				background-color:green;
			}
		div#container div#footer input.previous,
		div#container div#footer input.next{
			float:left;
			width:150px;
			padding:5px 30px;
			margin:10px 0 0 10px;
			background-color:#FFFFFF;
			border:1px solid #DDDDDD;
		}
		div#container div#footer input.next{
			float:right;
			margin:10px 10px 0 0;
		}
a#www{
	position:absolute;
	bottom:5px;
	left:50%;
	width:250px;
	margin-left:-125px;
	text-align:center;
	color:gray;
}
	
div.info a.active{
	background-color:#F2F2FD;
}
	
div.info table td{
	cursor:pointer;
	padding:10px;
}
div.info tr:nth-child(2n) td{
	background-color:#F2F2FD;
}

div.info tr.header th{
	background-color:#50A2D9;
	padding:10px 5px;
	color:#FFF;
	cursor:default;
}

div.content table th,
div.content table tr{
	font-size:12px;
	padding:5px 12px 0px;
}

div.content input.text,
div.content textarea{
	width:100%;
}
div.content select{
	max-width:450px;
}

div.info input.savebutton,
div.content input.savebutton,
div.content button.savebutton,
div.info button.backbutton,
div.content button.backbutton{
	background:#FFFFFF;
	border:1px outset #000000;
	cursor:pointer;
	padding:10px 30px;
}
div.content button.savebutton:hover,
div.content button.backbutton:hover{
	background-color:#BDBDBD;
}

/* Request */
div.info table tr.selected td,
div.info table tr:hover td,
div.info table tr:hover td a{
	color:#50A2D9;
}
span.notice{
	display:inline-block;
	padding:5px 0;
	color:#CD0025;
}
div.history{
	height:150px;
	padding:5px;
	overflow-y:scroll;
	border:1px solid #999999;
}

/* file upload */
.ee_file_upload{
	height:22px;
	overflow:hidden;
}
	.ee_file_button{
		display:inline-block;
		position:relative;
		width:80px;
		padding:0px 10px;
		line-height:20px;
		border:solid 1px #333;
		border-radius:2px;
		background:#EEE;
		color:#000;
		overflow:hidden;
		cursor:pointer;
	}
	@media all and (min-width: 1px){
		.ee_file_button{
			width:auto;
		}
	}
			.ee_file_button img{
				display:block;
				margin:3px 10px;
			}
			.ee_file_button_text{
			
			}
		.ee_file_loader{
			position:absolute;
			left:0px;
			bottom:0px;
			width:0%;
			height:3px;
			background:#e2722a;
		}
		.ee_file_button input{
			position:absolute;
			top:-5px;
			right:-5px;
			font-size:100px;
			width:300px;
			max-width:300px;
			opacity:.01;
			filter:alpha(opacity=1); 
			z-index:999;
			cursor:pointer;
		}
		.ee_file_button input::-webkit-file-upload-button{
			cursor:pointer;
		}

@media all and (min-height: 1px){
	div#header{
		margin-top:10px;
	}
		body.loggedin div#header div.wrapper{
			height:60px;
		}
			div#header div.wrapper div.menu{
				top:15px;
			}
	div#container{
		margin-top:10px;
		min-height:0;
	}
		div#container div.spacer{
			padding-top:10px;
			padding-bottom:10px;
		}
	div#login{
		margin-top:20px;
	}
}
@media all and (min-height: 600px){
	div#header{
		margin-top:50px;
	}
		body.loggedin div#header div.wrapper{
			height:100px;
		}
			div#header div.wrapper div.menu{
				top:30px;
			}
	div#container{
		margin-top:25px;
	}
		div#container div.spacer{
			padding-top:17px;
			padding-bottom:17px;
		}
	div#login{
		margin-top:50px;
	}
}
@media all and (min-height: 800px){
	div#header{
		margin-top:100px;
	}
	div#container{
		margin-top:45px;
	}
		div#container div.spacer{
			padding-top:35px;
			padding-bottom:35px;
		}
	div#login{
		margin-top:100px;
	}
}
@media all and (min-height: 900px){
	div#container{
		min-height:550px;
	}
}
@media all and (min-height: 1000px){
	div#container{
		min-height:650px;
	}
}

@media all and (min-width: 1px){
	div#logo{
		display:none;
	}
	body.loggedin div#header div.wrapper{
		background-image:none;
	}
	div#header,
	body.loggedin div#header div.wrapper,
	div#container{
		width:600px;
	}
	div#login input,
	div#tablet input,
	div#tablet select{
		width:100%;
	}
	div.content select{
		max-width:300px;
	}
}
@media all and (min-width: 632px){
	div#logo{
		display:block;
		right:10px;
	}
	body.loggedin div#logo{
		display:none;
	}
	div#header,
	body.loggedin div#header div.wrapper,
	div#container{
		width:95%;
	}
}
@media all and (min-width: 750px){
	div#header div.wrapper{
		background-image:url('../images/survey.png');
	}
	body.loggedin div#header div.wrapper{
		background-image:url('../images/survey_blue.png');
	}
	div#login input,
	div#tablet input,
	div#tablet select{
		width:220px;
	}
	div.content select{
		max-width:450px;
	}
}
@media all and (min-width: 1042px){
	div#header,
	body.loggedin div#header div.wrapper,
	div#container{
		width:990px;
	}
}
@media all and (min-width: 1350px){
	div#logo{
		display:block;
		right:10px;
	}
}
@media all and (min-width: 1520px){
	div#logo{
		right:100px;
	}
}