@import "variables.css?v374";
@import "font.css?v374";

html, body { height: 100%; width: 100%; }

.nav-top {
	height: 106px;
	/*border-bottom: 7px solid #949599;*/
	background-repeat: repeat-x;
	background-position: 0 -10px;
	background-color: white;
}

	.nav-top div.navbar {
		height: 70px;
		display: flex;
		flex-flow: row nowrap;
	}

		.nav-top div.navbar > div {
			display: flex;
			flex-flow: row nowrap;
			align-items: center;
		}

		.nav-top div.navbar > div:first-child {
			flex-grow: 1;
		}

	.nav-top .user-menu {
		display: flex;
		flex-flow: row nowrap;
		align-items: center;
		gap: 7px;
		font-size: 13px;
		color: white;
		margin-right: 10px;
	}
		.nav-top .user-menu i {
			font-size: 16px;
		}

.navbar-mode { 
	display: none;
	height: 100%; }
		
	.navbar-mode div {
		line-height: 180%;
		cursor: pointer;
		display: none;
		color: White;
	}
	.mode-desktop .navbar-mode .mode-desktop {
		display: none; }
			
	.mode-desktop .navbar-mode .mode-mobile {
		display: block; }
		
	.mode-mobile .navbar-mode .mode-mobile {
		display: none; }
		
	.mode-mobile .navbar-mode .mode-desktop {
		display: block; }

div.logo {
	text-align: right;
	vertical-align: middle;
	padding: 0px 18px 0 0; }
	
	.logo object, .logo img {
		height: 50px;
		/*width: 130px;*/
		margin-top: 12px;
		position: relative;
		top: -2px;
	}
	.logo img {
	}

div#support {
	display: none;
	/*background: url(images/support-phone.png) no-repeat 0px 7px;*/
	text-align: right;
	width: 160px;
	margin-top: 6px;
	margin-right: 10px;
	padding-left: 40px;
}


/* "support" */

	div#support div#header
	{
		color: #777;
		cursor: text;
		font: normal 16px 'CalibriBold' , Arial, Sans-serif;
		/*text-transform: uppercase;*/
		text-decoration: none;
	}

	/* het telefoon nummer */

	div#support div#number
	{
		color: #777;
		cursor: text;
		font: normal 16px 'CalibriBold' , Arial, Sans-serif;
		position: relative;
		text-decoration: none;
	}

@media only screen and (min-width: 1024px) {
	
	div#support { display: inherit; }

}

/* Main navigation */

div#toolbar {
	/*position: absolute;
	top: 68px;*/
	width: 100%;
	left: 0px;
	background: var(--main-gradient);
	height: 36px;
	z-index: 3;
	display: flex;
	align-items: center;
	padding-left: 17px;
}

	div#toolbar #formname, div#toolbar #formtitle {
		padding: 0 8px 0 8px;
		color: rgb(255,255,255,0.9);
		font-size: 13px;
	}
	div#toolbar #formtitle {
		padding-left: 8px;
		border-left: 1px solid rgb(255,255,255,0.8);
	}

	div#toolbar *:focus, div#toolbar *:focus-visible {
		outline-color: white;
	}

/*
td.navbar 
{
	height: 70px;
}
*/
div#navbar {
	padding-top: 26px;
	padding-left: 25px;
	z-index: 2;
}

	/* level 1 */
				
	#navbar menu {
		display: flex;
		flex-flow: row nowrap;
		gap: 20px;
		height: 44px;
		list-style: none;
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-weight: inherit;
		font-style: inherit;
		font-size: 100%;
		font-family: inherit;
		vertical-align: baseline; }
	
		#navbar li {
			position: relative;
			height: 44px;
			cursor: pointer;
		}

			/*#navbar li:after {
				content: "";
				position: absolute;
				bottom: -2px;
				border-bottom: 1px solid var(--main-accent-color-purple);
				width: 100%;
				display: block;
				transition: .5s;
			}*/

			#navbar li button {
				display: block;
				color: #666;
				font: unset;
				font-size: 15px;
				line-height: 20px;
				text-decoration: none;
				background-color: unset;
				border: unset;
				border-radius: unset;
				padding: 4px 0;
				/*transition: .3s;*/
			}
				#navbar li button:focus {
					outline-offset: 4px;
				}
			
				/* rollover */
			#navbar li:not(.current-navbar-item):not(.button-disabled) button:hover {
				color: var(--main-accent-color-purple);
				border-bottom: 1px solid var(--main-accent-color-purple);
			}
			
			/*#navbar li:not(.current-navbar-item):not(.button-disabled):hover:after {
				bottom: 14px;
			}*/

			#navbar li.button-disabled, #navbar li.button-disabled button {
				cursor: default;
			}

			/* current page & ancestors */
			#navbar li.current-navbar-item button {
				color: var(--main-accent-color-purple);
				font-weight: bold;
				border-bottom: 3px solid var(--main-accent-color-purple);
			}

				

#menu-top {
	padding-top: 6px;
	min-height: 34px;
	clear: both;
	background: var(--main-gradient);
}
	
	#menu-top ul {
		display: flex;
		flex-flow: row wrap;
		list-style-type: none;
		margin: 0px;
		padding: 0px 0px 0px 10px }
		
		#menu-top ul li {
			height: 28px;
			white-space: nowrap;
			padding: 6px 15px 0px 15px;
			position: relative;
			/*float: left;*/ }
			
			#menu-top ul li img {
				margin-top: -4px;
				vertical-align: middle;
				display: inline-block;
			}

			#menu-top ul li a, #menu-top ul li span {
				color: white !important; /*var(--main-font-color) !important;*/
				margin: 0px;
				cursor: pointer;
				text-decoration: none;
				margin-right: 4px;
			}
				#menu-top ul li a:focus {
					outline-color: white;
				}
			
			#menu-top ul li a:hover, #menu-top ul li span:hover {
				text-decoration: underline !important; }

			#menu-top ul li.current-item {
				background-color: var(--main-bg-color);
				-webkit-border-top-left-radius: 5px;
				-webkit-border-top-right-radius: 5px;
				-moz-border-radius-topleft: 5px;
				-moz-border-radius-topright: 5px;
				border-top-left-radius: 5px;
				border-top-right-radius: 5px;
				/*behavior: url(/label/formdesk-new/PIE.htc);*/
			}

				#menu-top ul li.current-item a, #menu-top ul li.current-item span {
					color: var(--main-font-color) !important;
				}

/*
DIV.fdbutton A, DIV.fdbutton A:active
{
	font-weight: normal;
	font-size: 11px;
	color: black;
	font-family: Tahoma, Arial;
	text-decoration: none;
}
DIV.fdbuttonspecial A, DIV.fdbuttonspecial A:active
{
	font-weight: bold;
	font-size: 11px;
	color: black;
	font-family: Tahoma, Arial;
	text-decoration: none;
}
*/

.nav-bottom {
	height: 47px;
	padding: 4px 6px;
	background-color: #6a6b6f;
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#939599, EndColorStr=#6a6b6f));
	-ms-filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#6a6b6f, EndColorStr=#6a6b6f));
	background: linear-gradient(bottom, #939599, #6a6b6f);
	background: -webkit-gradient(linear, left top, left bottom, from(#939599), to(#6a6b6f));
	background: -webkit-linear-gradient(bottom, #939599, #6a6b6f);
	background: -ms-linear-gradient(bottom, #939599, #6a6b6f);
	background: -moz-linear-gradient(bottom, #939599, #6a6b6f); }
	
	.nav-bottom div#content > div {
		height: 40px;
		padding: 3px 8px;
	}
	
	.nav-bottom .button-icon, 
	.nav-bottom .button-icon span, 
	.nav-bottom .button-icon:hover, 
	.nav-bottom .button-icon:hover span {
		color: #fff;
	}
	
	.nav-bottom a.button-icon:active, .nav-bottom .button-focus {
		border: 1px solid transparent !important;
	}
	
	.nav-bottom a.button-icon:hover, .nav-bottom a.button-icon:active, .nav-bottom .button-focus {
		text-decoration: underline; }
		
		.nav-bottom a.button-icon:hover span {
			text-decoration: none;
		}
	
	.nav-bottom .button-disabled, .nav-bottom .button-disabled span,
	.nav-bottom .button-disabled:hover, .nav-bottom .button-disabled:hover span {
		color: #ececec !important;
	}

.blognews-wrapper {
	min-height: 132px;
}
#blognews {
	width: 420px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 120%;
	/*color: #939599;*/
	padding-left: 20px;
	padding-top: 20px; }
	
	#blognews .blognews-title {
		/*float: left;*/
		font-weight: bold;
		padding-bottom: 8px;
	}
	#blognews .blognews-list {
		/*float: right;
		width: 310px;*/ }
		
		#blognews .blognews-list ul {
			margin: 0px;
			padding-left: 30px }
			
			#blognews .blognews-list ul li {
				margin-bottom: 5px; }
				
				#blognews .blognews-list ul li .blogitem-title {
					color: #939599; 
					text-decoration: none;
				}
				#blognews .blognews-list ul li .blogitem-more {
					color: #EA640D;
					font-size: 10px;
				}
	
	#blognews #twitter {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-style: italic;
		font-size: 13px; 
		color: #939599; 
		clear: both; 
		padding-top: 10px; 
		margin-left: 120px; }
		
		#blognews #twitter > div {
			padding-left: 25px; 
			float: left; 
			height: 16px; 
			background-image: url(images/twitter.png); 
			background-repeat: no-repeat;
		}