body {
	margin:0px;
	padding: 0px;
	font-family: ‘Arial Black’, Gadget, sans-serif;
	font-family: "Montserrat", sans-serif;
	font-size:15px;
	color: #093281;
	overflow: hidden;
}

input, select, textarea {
	font-family:Verdana, Arial, Helvetica, sans-serif;	
	font-size: 15px;
	border: 1px solid #567cba;
	/*border-radius:5px 5px 5px 5px;*/
	padding: 1px;
}
input[type=file] {
	font-size: 15px;
}

input[type=checkbox],input[type=radio],input[type=image] {
	border: 2px;
}

h1, h2, h3 {
	display: inline;
}

img {
	border: 0px;
}
a img{
	border: none;
}

div.wrapper {
	width: 100%;
	overflow-y: scroll;
	position: absolute;
	top: 0px;
	bottom: 30px;
}

div.header {
	height:154px;
	font-size:14px;
	border-top: 6px solid #567CBA;
	border-bottom: 6px solid #164E9B;
}
	div.header .logo {
		position: absolute;
		margin-top: 8px;
	}
	div.header .logo img {
		max-height: 150px;
	}
	

div.inlogbox {
	width: 400px;
	margin-left: auto;
	margin-right: auto;
	vertical-align: middle;
	margin-top: 200px;
}
	div.inlogbox a {
		color: #567cba;
		text-decoration: none;
	}

div.banner {
	float: right;
}
	div.banner .text {
		height:25px;
		margin-top: 70px;
		font-size: 22px;
	}
	div.banner .icon {
		position:fixed;
		top:130px;
		left:20px;
		width:80px;
		z-index:1;
	}
	div.banner .menu {
		padding-top: 55px;
		text-align: center;
		line-height: 28px;
		text-align: right;
		text-decoration: none;
	}
		div.banner .menu .item {
			float: left;
			margin-left: 10px;
			_min-width: 80px;
			text-transform: uppercase;
			text-align: center;
			filter: grayscale(100%);
		}
		div.banner .menu .item:hover {
			color: #567cba;
			text-decoration: none;
			filter: grayscale(0%);
		}
		div.banner .menu .actief {
			filter: grayscale(0%);
		}
		div.banner .menu .actief a {
			color: #567cba;
			text-decoration: none;
		}
		div.banner .menu .icon {
			float: left;
			margin-right: 20px;
			border: 2px solid black;
		}
		div.banner .menu .subitem {
			float: left;
			min-width: 80px;
			padding-left: 10px;
			font-size: 11px;
			text-align: left;
			text-transform: uppercase;
		}
		div.banner .menu .subitem:hover {
			text-decoration: none;
		}
		div.banner .menu .subactief a {
			color: #567cba;
		}
	div.banner a {
		color: #093281;
		text-decoration: none;
	}
	div.banner a:hover {
		color: #567cba;
	}
		
div.content {
	text-align: center;
}

div.home {
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}
	div.home a {
		color: #567cba;
		text-decoration: none;
	}
	div.home a:hover {
		text-decoration: underline;
	}
div.detail {
	margin-left: auto;
	margin-left: calc(50% - 435px);
	margin-right: auto;
	text-align: left;
}

div.headercenterwrapper {
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}
div.footercenterwrapper {
	width: 1000px;
	margin-left: auto;
	margin-left: calc(50% - 445px);
	margin-right: auto;
	text-align: left;
}

div.demo {
	background: url('/img/demo.png') repeat;
}

div.messagebox {
	background: #5EA91A;
	color: #FFFFFF;
	line-height: 20px;
	padding: 5px;
	margin-bottom: 5px;
}
div.messagebox_error {
	background: #D92626;
	color: #FFFFFF;
	line-height: 20px;
	padding: 5px;
	margin-bottom: 5px;
}

div.footer {
	position: absolute;
	bottom: 0px;
	width: 100%;
	height: 30px;
	background: #567cba;
	font-size:14px;
	line-height: 30px;
}
	div.footer a {
		color: #ffffff;
		text-decoration: none;
	}
	div.home a:hover {
		text-decoration: underline;
	}
	div.footer	.item { width:70px; }
	div.footer	img { max-height: 24px; padding-top: 3px; }

.klikbox { width: 255px; background: #567cba; color: #ffffff; line-height:24px; padding:15px; min-height:50px; }
.klikbox input { width:99%; font-size: 12px; border-radius: 0px; padding:1px; }

.uitklapregel_roze { cursor:pointer; }
.uitklapregel { height:50px; background-color:#eeeeee; border:1px solid #567cba; cursor:pointer; }
.uitklapregel_roze h3 { float:left; margin:0px; font-size:24px; width:150px;  }
.uitklapregel h2 { display:inline; line-height:50px; margin-left:10px; }
.uitklapregel h3 { display:inline; line-height:50px; margin-left:10px; }
.uitklapregel_roze .uitklapbox { float:right; margin-top:5px; }
.uitklapregel .uitklapbox { float:right; margin-top:3px; margin-right:10px; background-color:#567cba; }
.uitklapregel_roze .uitklapbox img,
.uitklapregel .uitklapbox img { margin: 10px; }
.uitklapregel:hover { color: #567cba; }
.uitklapregel_roze:hover > .uitklapbox img { transform: rotate(90deg); }
.uitklapregel:hover > .uitklapbox img { transform: rotate(90deg); }

div.transactiebox {
	background: #567cba;
	color: #ffffff;
	margin-left: auto;
	margin-right: auto;
	width: 600px;
	padding: 15px;
	font-size: 14px;
}
	div.transactiebox a {
		color: #ffffff;
	}
	div.transactiebox input {
		font-size: 12px;
		border-radius: 0px;
		border-color: #093281;
		padding: 1px;
	}
	div.transactiebox select {
		font-size: 12px;
		border-radius: 0px;
		border-color: #093281;
		padding: 1px;
	}
	div.transactiebox .knop {
		background-color: #093281;
		color: #ffffff;
		width: 150px;
		height: 30px;
		font-size: 15px;
		cursor: pointer;
	}

div#popup {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 100;
	display: none;
	background: url('/img/popup_bg.png') repeat-x;
	overflow: auto;
	font-size: 12px;
}
	div#popup table#popup_table {
		height: 100%;
	}
	div#popup table#popup_table td#popup_content {
		vertical-align: top;
		border: 1px solid #567cba;
		background-color: #FFFFFF;
		height: 400px;
		width: 600px;
		padding: 0px;
	}
	div.popuptitel {
		padding: 5px 10px;
		background-color: #093281;
		border-bottom: 1px solid #567cba;
		color: #FFFFFF;
	}

table.calendar {
	border: 1px solid #000000;
	background-color: #FFFFFF;
}
	table.calendar td {
		width: 20px;
		cursor: pointer;
		border: 1px solid white;
		text-align: center;
	}
	table.calendar td:hover {
		color: blue;
		font-weight: bold;
	}
	table.calendar td.currentday {
		color: #C00000;
	}
	table.calendar td.selectedday {
		color: #567cba;
		font-weight: bold;
		border: 1px solid #0000C0;
	}
	table.calendar tr.week {
		background-color: #CCCCCC;	
	}
	table.calendar tr.footer th {
		cursor: pointer;	
	}

table.tabbladmenu {
	/*border: 1px solid #567cba;*/
}
	table.tabbladmenu td {
		background-color: #567cba;
		color: #FFFFFF;
		padding: 2px;
	}
	table.tabbladmenu td:hover {
		cursor: pointer;
	}
	table.tabbladmenu td.active {
		background-color: #093281;
	}

.schaduwveld
{
	border:1px solid #567cba;
	/*border-radius:5px 5px 5px 5px;*/
	box-shadow:2px 2px 5px rgba(0,0,0,0.3);
}

.knop
{
	background: #8e004f;
	width: 150px;
	padding:1px;
	color:#FFFFFF;
	cursor: pointer;
	height: 20px;
}
.knopmiddel
{
	background: #8e004f;
	width: 175px;
	padding:1px;
	color:#FFFFFF;
	cursor: pointer;
	height: 24px;
	font-size: 16px;
}
.knopgroot
{
	background: #8e004f;
	width: 200px;
	padding:1px;
	color:#FFFFFF;
	cursor: pointer;
	height: 40px;
	font-size: 20px;
}

.oplichten:hover
{
	background: #567cba;
}
.knopdisabled
{
	background: #093281;
	width: 150px;
	padding:1px;
	color:#FFFFFF;
}

.zichtbaar {
	display:block;
}
.verborgen {
	display:none;
	height:100%;
}

.links { float: left; }
.rechts { float: right; }

.klikbaar {
	cursor:pointer;
}
.klikbaar:hover {
	text-decoration: underline;
}

.mooieachtergrondkleur {
	background-color: #164E9B;
}
.mooieachtergrondkleur:hover {
	background: #567cba;
}
.mooiekleur {
	color: #093281;
}
.mooiroze {
	color: #567cba;
}
.mooiblauw {
	color: #093281;
}
.groeneachtergrondkleur {
	background-color: #10cb01;
}
.groeneachtergrondkleur:hover {
	background-color: #39fe29;
}
.rodeachtergrondkleur {
	background-color: #cb1001;
}
.rodeachtergrondkleur:hover {
	background-color: #fe3929;
}

.klikbaarmooiroze {
	cursor: pointer;
	color: #567cba;
	text-decoration: none;
}

.klikbaarmooiroze:hover {
	text-decoration: underline;
}

.deleted {
	color: #ff0000;
	text-decoration: line-through;
}

table {
	font-size: 12px;
}

table.sorteertabel { padding-top:5px; padding-bottom:5px; }
table.sorteertabel thead tr.sorteerheader td { background: #093281; color: #ffffff; font-weight:bold; border-top-style:solid; border-top-width:1px; /*padding-top:2px;*/ border-bottom-style:solid; border-bottom-width:1px; /*padding-bottom:2px;*/ border-color:#567cba; }
table.sorteertabel thead tr.sorteerheader td.sorteerbaar { cursor: pointer; background: #093281 url('/img/sort.png') no-repeat top right; color: #ffffff; }
table.sorteertabel thead tr.sorteerheader td.sorteerbaar:hover { color: #ffbfe2; }
table.sorteertabel thead tr.sorteerexport { background: #cdddfc; height:10px; }
table.sorteertabel tbody tr.selecteerbaar:hover { background:#ffbfe2; cursor:pointer; } 
table.sorteertabel td { padding-right: 7px; }
table.sorteertabel td:last-child { padding-right:0px; }
table.sorteertabel tfoot td { font-weight:bold; border-top: 1px solid #567cba; padding-top:2px; }
.subitemstabel { padding-left: 10px; border-left: 4px solid #567cba; }


.statusicon {
	position: absolute;
	bottom: 3px;
	right: 3px;
	max-height: 40px;
}

div.grijs {
	filter: gray;
}

.BedrijfsLogo {
	max-width: 150px;
	max-height: 150px;
}
.bijlagebox {
	padding: 15px;
	width: 200px;
	border: 1px solid #ffffff;
}
.bijlagebox:hover {
	border: 1px solid #093281;
}
.bijlagebox img {
	max-height: 200px;
	max-width: 200px;
}

.nawgegevensbox {
	border: 2px solid #093281;
	width:45%;
	padding: 10px;
	height: 205px;
}
.nawgegevensbox .statusrood {
	color: red;
	font-size: 80%;
}

.inputerror {
	border: 1px solid red;
	color: #ff0000;
}

div.loading-widget{
    width: 60px;
    height: 60px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
}
div.loading-widget-spinner {
    border: 6px solid #f3f3f3;
                border-top: 6px solid #233775;
                border-radius: 50%;
                width: 60px;
                height: 60px;
                animation: spin 1s linear infinite;
                position:absolute;
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
