/*	========================
	>>>>>>>>>> ROOT <<<<<<<< 
	======================== */

:root
{
	--default-MAIN-width: 950px;
	--default-MAIN-height: 450px;
	--default-MAIN-verklein: 0.692308;
}

@media (min-height: 550px) and (min-width: 1160px)
{
	:root
	{
		--default-MAIN-width: 1160px;
		--default-MAIN-height: 550px;
		--default-MAIN-verklein: 0.846154;
	}
}

@media (min-height: 650px) and (min-width: 1370px)
{
	:root
	{
		--default-MAIN-width: 1370px;
		--default-MAIN-height: 650px;
		--default-MAIN-verklein: 1;
	}
}

@media (min-height: 850px) and (min-width: 1800px)
{
	:root
	{
		--default-MAIN-width: 1800px;
		--default-MAIN-height: 850px;
		--default-MAIN-verklein: 1.307692;
	}
}

@media (min-height: 1000px) and (min-width: 2110px)
{
	:root
	{
		--default-MAIN-width: 2110px;
		--default-MAIN-height: 1000px;
		--default-MAIN-verklein: 1.538461;
	}
}

/*	============================
	>>>>>>>>>> ALGEMEEN <<<<<<<< 
	============================ */

* 
{
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
}

body, table, form, input, select, div, p
{
	font-family: Arial, Helvetica, "Helvetica Neue", Gotham, sans-serif;
	font-size: calc(20px * var(--default-MAIN-verklein));
	font-weight: normal;
	line-height: 1.4;
	color: rgba(0, 0, 0, 1);
	margin: 0;
	outline: 0;
}

/*	==================================
	>>>>>>>>>> HOOFDELEMENTEN <<<<<<<< 
	================================== */

body
{
/**/	background-image: url('../img_website/achtergrond_hflnd_dataverzameling_v001_2100x1400px.jpg');
	background-repeat: no-repeat;
	overflow: hidden;
	user-select: none;
}

p
{
	margin: 0;
}

input[type=submit],
input[type=button]
{
	font-size: calc(14px * var(--default-MAIN-verklein));
    font-weight: bold;
    color: rgba(255, 255, 255, 1);
   
	border-radius: calc(4px * var(--default-MAIN-verklein));
    border: calc(1px * var(--default-MAIN-verklein)) solid rgba(0, 0, 0, 1);
   
	background-color: rgba(0, 0, 0, 1);

	padding: calc(4px * var(--default-MAIN-verklein));
    cursor: pointer;
    cursor: hand;
    -webkit-appearance: none;
    -webkit-transition: color .15s ease 0s,background-color .15s ease 0s,border-color .15s ease 0s;
    -moz-transition: color .15s ease 0s,background-color .15s ease 0s,border-color .15s ease 0s;
    -o-transition: color .15s ease 0s,background-color .15s ease 0s,border-color .15s ease 0s;
    -ms-transition: color .15s ease 0s,background-color .15s ease 0s,border-color .15s ease 0s;
    transition: color .15s ease 0s,background-color .15s ease 0s,border-color .15s ease 0s;
	
	box-shadow: calc(10px * var(--default-MAIN-verklein)) calc(10px * var(--default-MAIN-verklein)) calc(10px * var(--default-MAIN-verklein)) calc(-5px * var(--default-MAIN-verklein)) rgba(127, 127, 127, 0.5);
	margin: calc(10px * var(--default-MAIN-verklein));
}

input[type=submit]:hover,
input[type=button]:hover

{
	background-color: rgba(255, 0, 0, 1);;
	border: calc(1px * var(--default-MAIN-verklein)) solid rgba(0, 0, 0, 1);;
	color: rgba(255, 255, 255, 1);
}

input[type=text],
input[type=password]
{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

	width: 100%;

	font-size: calc(20px * var(--default-MAIN-verklein));
	font-weight: bold; 
	text-align: center; 
	color: rgba(0, 0, 0, 1);

	border: calc(2px * var(--default-MAIN-verklein)) solid rgba(97, 178, 47, 1);
	background-color: rgba(255, 255, 255, 1);
	padding: calc(6px * var(--default-MAIN-verklein));
	border-radius: calc(6px * var(--default-MAIN-verklein));
	
	box-shadow: calc(10px * var(--default-MAIN-verklein)) calc(10px * var(--default-MAIN-verklein)) calc(10px * var(--default-MAIN-verklein)) calc(-5px * var(--default-MAIN-verklein)) rgba(127, 127, 127, 0.5);
	margin: calc(10px * var(--default-MAIN-verklein));
}

/*	============================
	>>>>>>>>>> SROLLBAR <<<<<<<< 
	============================ */

/* width */
::-webkit-scrollbar {
	width: calc(15px * var(--default-MAIN-verklein));
}

/* Track */
::-webkit-scrollbar-track {
	box-shadow: inset 0 0 calc(5px * var(--default-MAIN-verklein)) rgba(127, 127, 127, 1); 
	border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
	background: rgba(97, 178, 47, 0.3);
	border-radius: calc(10px * var(--default-MAIN-verklein));
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
	background: rgba(97, 178, 47, 1); 
	border: calc(2px * var(--default-MAIN-verklein)) solid rgba(97, 178, 47, 1);
}

/*	================================
	>>>>>>>>>> span_GENERAL <<<<<<<< 
	================================ */

span.span_GENERAL_tekst_14
{
	font-size: calc(14px * var(--default-MAIN-verklein));
}

span.span_GENERAL_tekst_14_bold
{
	font-size: calc(14px * var(--default-MAIN-verklein));
	font-weight: bold;
}

span.span_GENERAL_tekst_16
{
	font-size: calc(16px * var(--default-MAIN-verklein));
}

span.span_GENERAL_tekst_16_bold
{
	font-size: calc(16px * var(--default-MAIN-verklein));
	font-weight: bold;
}

span.span_GENERAL_tekst_20
{
	font-size: calc(20px * var(--default-MAIN-verklein));
}

span.span_GENERAL_tekst_20_bold
{
	font-size: calc(20px * var(--default-MAIN-verklein));
	font-weight: bold;
}

span.span_GENERAL_tekst_center
{
	text-align: center;
}

span.span_GENERAL_tekst_left
{
	text-align: left;
}

/*	===============================
	>>>>>>>>>> div_GENERAL <<<<<<<< 
	=============================== */

div.div_GENERAL_tekst_14
{
	font-size: calc(14px * var(--default-MAIN-verklein));
}

div.div_GENERAL_tekst_14_bold
{
	font-size: calc(14px * var(--default-MAIN-verklein));
	font-weight: bold;
}

div.div_GENERAL_tekst_16
{
	font-size: calc(16px * var(--default-MAIN-verklein));
}

div.div_GENERAL_tekst_16_bold
{
	font-size: calc(16px * var(--default-MAIN-verklein));
	font-weight: bold;
}

div.div_GENERAL_tekst_20
{
	font-size: calc(20px * var(--default-MAIN-verklein));
}

div.div_GENERAL_tekst_20_bold
{
	font-size: calc(20px * var(--default-MAIN-verklein));
	font-weight: bold;
}

div.div_GENERAL_width_10
{
	flex: 0 0 auto;
	width: calc(10px * var(--default-MAIN-verklein));
}

div.div_GENERAL_width_15
{
	flex: 0 0 auto;
	width: calc(15px * var(--default-MAIN-verklein));
}

div.div_GENERAL_width_20
{
	flex: 0 0 auto;
	width: calc(20px * var(--default-MAIN-verklein));
}

div.div_GENERAL_height_10
{
	flex: 0 0 auto;
	height: calc(10px * var(--default-MAIN-verklein));
}

div.div_GENERAL_height_15
{
	flex: 0 0 auto;
	height: calc(15px * var(--default-MAIN-verklein));
}

div.div_GENERAL_height_20
{
	flex: 0 0 auto;
	height: calc(20px * var(--default-MAIN-verklein));
}

div.div_GENERAL_flex_row
{
	width: 100%;

	display: flex;
	flex-flow: row;

	overflow: hidden;
}

div.div_GENERAL_flex_column
{
	height: 100%;

	display: flex;
	flex-flow: column;

	overflow: hidden;
}

div.div_GENERAL_flex_fixed
{
	flex: 0 0 auto;
}

div.div_GENERAL_flex_space_1x
{
	flex: 1 0 auto;
}

div.div_GENERAL_flex_space_2x
{
	flex: 2 0 auto;
}

div.div_GENERAL_flex_space_3x
{
	flex: 3 0 auto;
}

div.div_GENERAL_overflow_on
{
	overflow: auto !important;
}

div.div_GENERAL_overflow_off
{
	overflow: hidden !important;
}

div.div_GENERAL_input_header
{
	font-size: calc(40px * var(--default-MAIN-verklein));
	font-weight: 900; 
	text-align: center;
	margin-bottom: calc(-23px * var(--default-MAIN-verklein));
	padding: 0;
	color: rgba(97, 178, 47, 0.5);
}

div.div_GENERAL_foutmelding
{
	text-align: center;
	font-size: calc(16px * var(--default-MAIN-verklein));
	color: rgba(255, 255, 255, 1);
	
	background-color: rgba(255, 0, 0, 1);
	padding: calc(6px * var(--default-MAIN-verklein)) calc(20px * var(--default-MAIN-verklein)) calc(6px * var(--default-MAIN-verklein)) calc(20px * var(--default-MAIN-verklein));
	border-radius: calc(6px * var(--default-MAIN-verklein));

	box-shadow: calc(10px * var(--default-MAIN-verklein)) calc(10px * var(--default-MAIN-verklein)) calc(10px * var(--default-MAIN-verklein)) calc(-5px * var(--default-MAIN-verklein)) rgba(127, 127, 127, 0.5);
	margin: calc(10px * var(--default-MAIN-verklein));
}

div.div_GENERAL_scheidingslijn_groen
{
	width: 100%;
	height: calc(4px * var(--default-MAIN-verklein));
	margin: calc(20px * var(--default-MAIN-verklein)) 0px calc(20px * var(--default-MAIN-verklein)) 0px;
	background-color: rgba(97, 178, 47, 0.3);
}

/*	=================================
	>>>>>>>>>> input_GENERAL <<<<<<<< 
	================================= */

input[type=submit].input_GENERAL_button_LOGON,
input[type=button].input_GENERAL_button_LOGON
{
	min-width: calc(200px * var(--default-MAIN-verklein));
	font-size: calc(20px * var(--default-MAIN-verklein));
	color: rgba(0, 0, 0, 1);
	background-color: rgba(255, 255, 255, 1);
	border: calc(1px * var(--default-MAIN-verklein)) solid rgba(0, 0, 0, 1);
	padding: calc(6px * var(--default-MAIN-verklein)) calc(20px * var(--default-MAIN-verklein)) calc(6px * var(--default-MAIN-verklein)) calc(20px * var(--default-MAIN-verklein));
	border-radius: calc(6px * var(--default-MAIN-verklein));
}

input[type=submit]:hover.input_GENERAL_button_LOGON,
input[type=button]:hover.input_GENERAL_button_LOGON
{
	font-size: calc(20px * var(--default-MAIN-verklein));
	color: rgba(255, 255, 255, 1);
	background-color: rgba(255, 0, 0, 1);
	border: calc(1px * var(--default-MAIN-verklein)) solid rgba(0, 0, 0, 1);
	padding: calc(6px * var(--default-MAIN-verklein)) calc(20px * var(--default-MAIN-verklein)) calc(6px * var(--default-MAIN-verklein)) calc(20px * var(--default-MAIN-verklein));
	border-radius: calc(6px * var(--default-MAIN-verklein));
}

input[type=submit]:disabled.input_GENERAL_button_LOGON,
input[type=button]:disabled.input_GENERAL_button_LOGON
{
	font-size: calc(20px * var(--default-MAIN-verklein));
	color: rgba(127, 127, 127, 1);
	background-color: rgba(255, 255, 255, 1);
	border: calc(1px * var(--default-MAIN-verklein)) solid rgba(0, 0, 0, 1);
	padding: calc(6px * var(--default-MAIN-verklein)) calc(20px * var(--default-MAIN-verklein)) calc(6px * var(--default-MAIN-verklein)) calc(20px * var(--default-MAIN-verklein));
	border-radius: calc(6px * var(--default-MAIN-verklein));
}

input[type=submit].input_GENERAL_button_MENU,
input[type=button].input_GENERAL_button_MENU
{
	width: 80%;
	font-size: calc(14px * var(--default-MAIN-verklein));
	color: rgba(255, 255, 255, 1);
	background-color: rgba(0, 0, 0, 1);
	border: calc(2px * var(--default-MAIN-verklein)) solid rgba(0, 0, 0, 1);
	padding: calc(4px * var(--default-MAIN-verklein)) calc(8px * var(--default-MAIN-verklein)) calc(4px * var(--default-MAIN-verklein)) calc(8px * var(--default-MAIN-verklein));
	border-radius: calc(4px * var(--default-MAIN-verklein));
}

input[type=submit]:hover.input_GENERAL_button_MENU,
input[type=button]:hover.input_GENERAL_button_MENU
{
	width: 80%;
	font-size: calc(14px * var(--default-MAIN-verklein));
	color: rgba(255, 255, 255, 1);
	background-color: rgba(97, 178, 47, 1);
	border: calc(2px * var(--default-MAIN-verklein)) solid rgba(0, 0, 0, 1);
	padding: calc(4px * var(--default-MAIN-verklein)) calc(8px * var(--default-MAIN-verklein)) calc(4px * var(--default-MAIN-verklein)) calc(8px * var(--default-MAIN-verklein));
	border-radius: calc(4px * var(--default-MAIN-verklein));
}

input[type=submit].input_GENERAL_button_SPECIAAL_rood,
input[type=button].input_GENERAL_button_SPECIAAL_rood
{
	width: 40%;
	font-size: calc(14px * var(--default-MAIN-verklein));
	color: rgba(255, 255, 255, 1);
	background-color: rgba(255, 0, 0, 1);
	border: calc(2px * var(--default-MAIN-verklein)) solid rgba(0, 0, 0, 1);
	padding: calc(4px * var(--default-MAIN-verklein)) calc(8px * var(--default-MAIN-verklein)) calc(4px * var(--default-MAIN-verklein)) calc(8px * var(--default-MAIN-verklein));
	border-radius: calc(4px * var(--default-MAIN-verklein));
}

input[type=submit]:hover.input_GENERAL_button_SPECIAAL_rood,
input[type=button]:hover.input_GENERAL_button_SPECIAAL_rood
{
	width: 40%;
	font-size: calc(14px * var(--default-MAIN-verklein));
	color: rgba(255, 255, 255, 1);
	background-color: rgba(97, 178, 47, 1);
	border: calc(2px * var(--default-MAIN-verklein)) solid rgba(0, 0, 0, 1);
	padding: calc(4px * var(--default-MAIN-verklein)) calc(8px * var(--default-MAIN-verklein)) calc(4px * var(--default-MAIN-verklein)) calc(8px * var(--default-MAIN-verklein));
	border-radius: calc(4px * var(--default-MAIN-verklein));
}

/*	===================================
	>>>>>>>>>> BASIS (level 1) <<<<<<<< 
	=================================== */

div.div_START_basis 
{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/*	===================================
	>>>>>>>>>> START (level 2) <<<<<<<< 
	=================================== */

div.div_BASIS_centered
{
	width: var(--default-MAIN-width);
	max-width: var(--default-MAIN-width);
	height: var(--default-MAIN-height);
	max-height: var(--default-MAIN-height);
	
	display: flex;
	flex-wrap: nowrap;

	border: 2px solid rgb(97, 178, 47);
	border-radius: calc(25px * var(--default-MAIN-verklein));
	box-shadow: calc(20px * var(--default-MAIN-verklein)) calc(20px * var(--default-MAIN-verklein)) calc(20px * var(--default-MAIN-verklein)) calc(-5px * var(--default-MAIN-verklein)) rgba(127, 127, 127, 0.5);
}

div.div_BASIS_disclaimer
{
	position: absolute;
}

/*	======================================
	>>>>>>>>>> CENTERED (level 3) <<<<<<<< 
	====================================== */

div.div_CENTERED_links
{
	width: 80%;
	height: 100%;

	border-radius: calc(23px * var(--default-MAIN-verklein)) 0px 0px calc(23px * var(--default-MAIN-verklein));
	padding: calc(23px * var(--default-MAIN-verklein));
	background-color: rgba(0, 255, 0, 1);
	background-color: rgba(255, 255, 255, 0.95);

}

div.div_CENTERED_rechts
{
	width: 20%;
	height: 100%;

	border-radius: 0px calc(23px * var(--default-MAIN-verklein)) calc(23px * var(--default-MAIN-verklein)) 0px;
	padding: calc(23px * var(--default-MAIN-verklein));
	background-color: rgba(97, 178, 47, 0.3);
	background-color: rgba(207, 232, 192, 1);
	
	display: flex;
	flex-flow: column;

	overflow: hidden;
}

/*	========================================
	>>>>>>>>>> DISCLAIMER (level 3) <<<<<<<< 
	======================================== */

div.div_DISCLAIMER_tekst
{
	width: var(--default-MAIN-width);
	height: auto;
	
	margin-top: calc(5px * var(--default-MAIN-verklein));
	text-align: center;
	overflow: hidden;
}

div.div_DISCLAIMER_tekst p 
{
	font-size: calc(12px * var(--default-MAIN-verklein));
	font-weight: bold;
	color: rgba(255, 255, 255, 1);
}

/*	===================================
	>>>>>>>>>> LINKS (level 4) <<<<<<<< 
	=================================== */

div.div_LINKS_main
{
	width: 100%;
	height: 100%;
	overflow-x: auto;
	
}

/*	====================================
	>>>>>>>>>> RECHTS (level 4) <<<<<<<< 
	==================================== */

div.div_RECHTS_main
{
	width: 100%;
	height: 100%;
}

div.div_RECHTS_main div.scheiding_lijn
{
	width: 100%;
	height: calc(2px * var(--default-MAIN-verklein));
	margin: calc(10px * var(--default-MAIN-verklein)) 0px calc(10px * var(--default-MAIN-verklein)) 0px;
	background-color: rgba(0, 0, 0, 1);
}

div.div_RECHTS_main div.buttons_terug_naar,
div.div_RECHTS_main div.buttons_admin
{
	text-align: center;
}

div.div_RECHTS_main span.tekst_16
{
	font-size: calc(16px * var(--default-MAIN-verklein));
}