/*

################
// BODY 
// HEADER
// LEFTNAV
// MENU
// CONTENT
// FORM
// TABLE
// EVENT SLIDER
################

HTG: #04AAAA
HTI: CF033D

*/

@font-face {
	font-family: 'FrutigerLTPro-Light';
	src: url('font-frutiger/2DFF09_0_0.eot');
	src: url('font-frutiger/2DFF09_0_0.eot?#iefix') format('embedded-opentype'),
		 url('font-frutiger/2DFF09_0_0.woff2') format('woff2'),
		 url('font-frutiger/2DFF09_0_0.woff') format('woff'),
		 url('font-frutiger/2DFF09_0_0.ttf') format('truetype');
}
@font-face {
	font-family: 'FrutigerLTPro-Roman';
	src: url('font-frutiger/2E07B8_2_0.eot');
	src: url('font-frutiger/2E07B8_2_0.eot?#iefix') format('embedded-opentype'),
		 url('font-frutiger/2E07B8_2_0.woff2') format('woff2'),
		 url('font-frutiger/2E07B8_2_0.woff') format('woff'),
		 url('font-frutiger/2E07B8_2_0.ttf') format('truetype');
}
@font-face {
	font-family: 'Montserrat';
	src: url('font-montserrat/montserrat-regular-400.woff2') format('woff2');
}

/*  
##########################

BODY  

##########################
*/

* {
    --main-background-color: #FFF;
	--main-accent-color: #CF033D; 
    --secondary-accent-color: #50BCBD;
    --main-font-family: 'FrutigerLTPro-Roman', 'FrutigerLTPro-Light', Arial, sans-serif;
	--main-font-color: #3e3e3e;
    --table-header-color: #6a6a6a;
	--table-body-color: #ECECEC;
	--table-body-color-hover: #d3d0d0;
    --table-body-color-odd: #F9F9F9;
	--table-border: 1px solid #ddd;
	--section-grey-color: #E1E4E8;
	--btn-color: #E6E6E6;
	--btn-color-hover: #F5F5F5;
	--input-color: #FFFFFF;
	
    --muted-light-text: #A5AEBF;
    --muted-accent-color: #4C5D80;
    --light-secondary-accent-color: #EEF8F8;
    --light-secondary-color: rgba(242, 244, 250, 1);
    --main-alert-color: #E73458;
    --secondary-alert-color: #E73458;
    --secondary-accent-support-color: #B9E4E5;
	--form-border-color: #dee2e6;
}

.darktheme, .darktheme * {
	--main-background-color: #000;
	--table-header-color: #6a6a6a;
    --table-body-color: #2f2f2f; /* #4F4F4F;*/
	--table-body-color-hover: #6a6a6a;
    --table-body-color-odd: #000;
	--table-border: 1px solid #959595;
	--main-font-color: #CCC;
	--section-grey-color: #2F2F2F;
	--btn-color: #000;
	--btn-color-hover: #6a6a6a;
	--input-color: #2F2F2F;
}

BODY.main_htg * {
	--main-accent-color: #50BCBD; 
}

BODY {
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: 100%;
	background-color: var(--main-background-color);
	color: var(--main-font-color);
	line-height: 1.5em
}

BODY, TD, INPUT, TEXTAREA, BUTTON, P, DIV {
	/*FONT-FAMILY: 'FrutigerLTPro-Roman', 'FrutigerLTPro-Light', Arial, sans-serif;*/
	FONT-FAMILY: var(--main-font-family);
	FONT-SIZE: 12px;
	font-style: normal;
}
TEXTAREA {
	padding: 4px;
}
FORM {
	margin-bottom: 0px;
}

#overlay {
    position: fixed;
    z-index: 5;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background: #000;
    display: none;
    overflow: hidden;
}

i.fa, i.fa-solid, i.fa-regular { 
	color: var(--main-accent-color);
	font-size: 16px;
	cursor: pointer;
	display: inline-block;
}

/*
.overview i.fa {
	margin-left: 5px;
}
*/
/*  
##########################

HEADER AND SECTION STYLE

##########################
*/

HEADER {
	padding-bottom: 90px;
}
HEADER #logo {
	position: absolute;
}
HEADER #logo IMG {
	max-height: 50px;
	margin-top: 20px;
	/*margin-left: -43px;*/
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
HEADER.onscroll #logo IMG {
	max-height: 30px;
	margin-top: 5px;
}
HEADER #header-nav {
	display: block;
	background: var(--main-background-color);
	position: fixed;
	top: 0px;
	width: 100%;
	height: 84px;
	padding: 0px;
	vertical-align: middle;
	color: black;
	box-shadow: 0px 7px 10px #888888;
	z-index: 999;
	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
HEADER.onscroll #header-nav {
	height: 40px;
}
SECTION, FOOTER {
	padding: 15px 0px;
}
SECTION DIV.centered, .grid-container {
	max-width: 1400px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 10px;
    padding-right: 10px;
}
SECTION DIV.fullscreen {
	margin-left: auto;
	margin-right: auto;
	padding-left: 10px;
    padding-right: 10px;
}
SECTION.grey {
	background-color: var(--section-grey-color);
}


/*  
##########################

MENU  

##########################
*/

/* HOOFD LAAG */
HEADER #topmenu {
	display:block;
	float: right;
	max-height: 80px;
}
HEADER #mobilemenu {
	display: none;
}
HEADER #mobile_menubutton {
	display: none;
}	
NAV ul {
	list-style:none;
	position:relative;
	float:left;
	margin:0;
	padding:0;
	z-index: 10;
	text-transform: uppercase;
}
NAV ul a {
	display:block;
	color:var(--main-font-color);
	text-decoration:none;
	font-weight:700;
	font-size:12px;
}
NAV ul li {
	position:relative;
	float:left;
	color: white;
	margin:0;
	padding:0;
	padding: 40px 15px 0px 16px;
	 -webkit-transition: padding 0.5s ease-in-out;
	-moz-transition: padding 0.5s ease-in-out;
	-ms-transition: padding 0.5s ease-in-out;
	-o-transition: padding 0.5s ease-in-out;
	transition: padding 0.5s ease-in-out;
}
NAV ul li:last-child {
	padding-right: 0px;
	/* padding-left: 0px; */
	/* ivm searchlogo */
}
NAV ul li #searchbar, #topmenu .shopping-cart .fa-shopping-cart, #topmenu .shopping-basket .fa-shopping-basket {
	font-size: 22px !important;
	line-height: 44px !important;
}

#mobilemenu .fa-exclamation-circle {
	display: contents;
}

.shopping-cart, .shopping-basket {
    display: none;
}
.shopping-cart .item-cart-count, .shopping-basket .item-cart-count {
    display: block;
	background-color: #6a6a6a;
    border-radius: 50%;
    color: #fff;
	margin-top: -34px;
    margin-left: 17px;
    line-height: 1rem;
    position: relative;
    text-align: center;
    min-width: 1rem;
    padding: 2px;
}

HEADER.onscroll NAV ul li {
	padding-top: 0px;
}
NAV ul li IMG {
	max-height: 40px;
}
NAV ul li a {
	line-height: 44px;
}
HEADER.onscroll NAV ul li a {
	line-height: 40px;
}

/* TWEEDE LAAG*/
HEADER.onscroll NAV ul li li a {
    line-height: initial;
}
NAV ul li a span, NAV ul li li a span {
	position: relative;
    display: inline-block;
	max-width: 150px;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
NAV ul li a span:before {
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  border-bottom: 3px solid transparent;
  -webkit-transition: border-color 0.1s ease-in-out 0s;
  -moz-transition: border-color 0.1s ease-in-out 0s;
  -ms-transition: border-color 0.1s ease-in-out 0s;
  -o-transition: border-color 0.1s ease-in-out 0s;
  transition: border-color 0.1s ease-in-out 0s;
}
NAV ul li li a:before {
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  border-left: 3px solid transparent;
  border-bottom: 0px;
  -webkit-transition: border-color 0.1s ease-in-out 0s;
  -moz-transition: border-color 0.1s ease-in-out 0s;
  -ms-transition: border-color 0.1s ease-in-out 0s;
  -o-transition: border-color 0.1s ease-in-out 0s;
  transition: border-color 0.1s ease-in-out 0s;
}
NAV ul li li a span:before { 
	border: 0px;
}
NAV ul li a span:before, NAV ul li li a:before {
  border-color: transparent;
}
NAV ul li:hover > a > span:before, NAV ul li li:hover > a:before {
  border-color: var(--main-accent-color);
}
NAV ul li:hover > a {
	color: var(--main-accent-color);
}
NAV ul ul {
	display:none;
	border: 1px solid var(--main-accent-color);
	margin-left: -1px;
	border-top: 0px;
	position:absolute;
	top:100%;
	left:0;
	background: var(--main-background-color);;
	padding:0;
	box-shadow: 5px 7px 10px #888888;
}
NAV ul ul li {
	float:none;
	width:200px;
	padding: 0px !important;
}
NAV ul li:last-child li {
	width: 215px;
}
NAV ul ul a {
	color: var(--main-font-color);
	line-height:120%;
	padding:10px 15px;
	max-width: inherit;
}
NAV ul ul ul {
	top: 0;
    right: 100%;
	left: inherit;
    margin-top: -1px !important;
    margin-left: 0px;
    border-top: 1px solid var(--main-accent-color);
    box-shadow: 0px 7px 10px #888888;
}
NAV ul li:hover > ul {
	display:block;
	margin-top: -18px;
}
HEADER.onscroll NAV ul li:hover > ul {
	margin-top: -16px;
}

.branding {
	min-width: 100%;
    margin-bottom: 40px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.branding span {
	height: 6px;
}

.branding .main {
	background-color: var(--main-accent-color);
	width:26%;
}
.branding .secondary {
	background-color: #f90;
	width:32%;
}

.branding .accent {
	background-color: #ffcd00;
	width:42%;
}



/*  
##########################

CONTENT  

##########################
*/

.onlymobile {
	display: none !important;
}
.nomobile {
	display: block !important;
}

.content A {
	color: var(--main-accent-color);
	text-decoration: none;
}
.content A:hover {
	text-decoration: underline;
}
.content OL {
	list-style: decimal;
}

.content OL > LI > OL {
	list-style: lower-alpha;
}

 H2 {
	FONT-FAMILY: 'Montserrat', Arial, sans-serif;
	color: var(--main-accent-color);
	font-size: 1.5em;
	margin-top: 0px;  
}

#news .overview A {
	color: var(--main-font-color);
}
#news .overview A:hover {
	color: var(--main-accent-color);
}

VIDEO::-internal-media-controls-download-button {
	display:none;
}

VIDEO::-webkit-media-controls-enclosure {
	overflow:hidden;
}

VIDEO::-webkit-media-controls-panel {
	width: calc(100% + 30px); /* Adjust as needed */
}

.pageswitch {
	text-align: center;
	font-size: 14px;
}

DIV.blockarea {
	MARGIN-TOP: -1px;
	BORDER: 1px solid #FE4878;
	PADDING: 10px;
}

DIV.centered.nopadding {
	max-width: 1420px;
	padding-left: 0px;
    padding-right: 0px;
}
DIV.contentblocks {
	letter-spacing: -.31em;
}
DIV.contentblocks .col {
	display:inline-block; 
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	letter-spacing: normal; 
	vertical-align: top;
	padding-left: 10px;
    padding-right: 10px;
	padding-bottom: 20px
}
DIV.contentblocks .col DIV, .ht-textarea {
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

DIV.contentblocks.c3 .col {
	width: 33.3%;
}



	
@media (min-width:430px) and (max-width:700px) {
	DIV.contentblocks.c2 .col {
		display: block;
		width: 100% !important;
		padding-left: 0px;
		padding-right: 0px;
	}
	DIV.contentblocks.c4 .col {
		width: 50%;
	}
}

@media (max-width:430px) {
	DIV.contentblocks.c2 .col {
		display: block;
		width: 100% !important;
		padding-left: 0px;
		padding-right: 0px;
	}
	DIV.contentblocks.c3 .col, DIV.contentblocks.c4 .col, DIV.contentblocks.c5 .col  {
		display: block;
		width: 100%;
		padding-left: 0px;
		padding-right: 0px;
		padding-bottom: 0px
	}
	DIV.contentblocks.c5 {
		display: table;
		margin: 0 auto;
	}
}
@media (min-width:700px) {
	DIV.contentblocks.c2 .col {
		width: 50%;
	}
	DIV.contentblocks.c4 .col {
		width: 25%;	
	}
	DIV.contentblocks.c5 .col {
		width: 20%;	
	}
}

@media (min-width:520px) and (max-width:800px) {
DIV.contentblocks.c5 .col {
		width: 33%;
	}
}

@media (min-width:400px) and (max-width:520px) {
DIV.contentblocks.c5 .col {
		width: 50%;
	}
}

/* 
##################################
TABLE STYLE 
Opties: 
- Header zonder kolommen. Gebruik dan de class DIV.caption
- Overzicht tabel met even/oneven rijen kleuren met class overview

################################## 
*/
DIV.table {
  display: table;
  width: 100%;
  border: var(--table-border);
  margin: 0px;
}

DIV.tr {
  display: table-row;
}

/* TABLE HEADER */

/* DIV.tr:first-child DIV, */
DIV.caption {
	display: table-caption;
	background: var(--main-accent-color);
	color: white;
	font-weight: bold;
	padding: 8px 5px !important;
}
/* TABLE HEADER */


/* EERSTE KOLOM */ 
/*
DIV.tr DIV.cell:first-child {
  width: 150px;
}
*/
/* EERSTE KOLOM */ 


DIV.tr DIV.cell {
  display: table-cell;
  padding: 5px;
  vertical-align: top;
}

.ellipsis DIV {		
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
	width: 0;
    min-width: 100%;
}

/* nowrap alle kolommen */
.nowrap {
	white-space: nowrap;
}

/* nowrap alleen eerste kolomm */
.nowrap_firstcolumn td:nth-child(1) {
	white-space: nowrap;
}

@media (max-width:700px) {
	DIV.tr DIV.cell DIV.blocks {
		display: block;
	}
	DIV.mobile-blocks {
		display: block !important;
		width: 100% !important;
		padding-left: 0px !important;
	}	
  
	DIV.tr DIV.cell:first-child {
		width: auto;
	}
	DIV.centered.nopadding {
		padding-left: 10px;
		padding-right: 10px;
	}
	
	SELECT {
		width: 100%;
	}
}
@media (max-width:400px) {
	.small-table-blocks TD {
		display: block;
	}
	.small-table-blocks TD:nth-child(1) {
		font-weight:bold;
	}
	#mainpage .small-table-blocks TD {
		line-height: 15px !important;
		border: 0px;
	}	
	#mainpage .small-table-blocks THEAD TD{
		line-height: 25px !important;
	}	
}

/*
##########################

ABSENCE OVERVIEW

##########################
*/

#absenceoverview TBODY TR {
  display:none;
}
#absenceoverview TBODY TR.active {
  display: table-row;
}
#absenceoverview TBODY TR.odd {
    background-color:#F9F9F9;
}
#absenceoverview TBODY TR.even {
    background-color:#ECECEC;
}

#loadingdata {
	width: 200px;
	padding: 10px;
	position: relative;
	border: 1px solid black;
	z-index: 10001;
	background: rgb(221, 221, 221);
	FONT-SIZE: 14px;
	text-align: center;
	vertical-align: middle;
	margin-left: auto;
	margin-right: auto;
}

#absencetable {
  position: relative;
  padding-top: 35px;
}
.absencetype DIV:first-letter {
	text-transform: capitalize;
}
.scrollable-area {
	padding: 0;
	border-top: 2px solid #E0E0E0;
	overflow: auto;
}
#absenceoverview DIV {
	text-align: center;
	white-space: nowrap; 
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
	width: 0;
	min-width: 100%;
}
#absenceoverview A {
	color: black;
	text-decoration: none;
}
#absenceoverview TD, #absenceoverview TH {
	padding: 5px; 
	FONT-FAMILY: Arial;
	FONT-SIZE: 12px;
}
#absenceoverview TH:nth-child(1), #absenceoverview TH:nth-child(2) {
	width: 50px;
}
#absenceoverview .col_name, #absenceoverview .col_name > DIV {
	text-align: left;
}
#absenceoverview i.fa, #absenceoverview i.fa-info-circle {
	color: #cacaca;
	cursor: default;
}

#absenceoverview .popover, #absenceoverview .popover DIV {
	min-width: initial !important;
	width: initial !important;
	overflow: initial !important;
	white-space: initial !important;
}

.ellipsis .popover, .ellipsis .popover-content, .ellipsis .popover .arrow {
	min-width: initial !important;
	width: initial !important;
	overflow: initial !important;
	text-overflow: initial !important;
	white-space: initial !important;
}


/*  
##########################

FORM  

##########################
*/

TEXTAREA:focus, SELECT:focus, INPUT:focus { 
	outline-style: inherit;
    box-shadow: inherit;
    border-color: inherit;
}

.content TEXTAREA, .content SELECT, .content INPUT, ul.token-input-list { 
	padding: .375rem .75rem;
	BORDER: 1px solid var(--form-border-color); 
	COLOR: var(--main-font-color); 
	BACKGROUND-COLOR: var(--input-color); 
	box-sizing: border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing: border-box;
	line-height: 1.5;
	background-clip: padding-box;
    border-radius: .375rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.content TEXTAREA:focus, .content SELECT:focus, .content INPUT:focus, ul.token-input-list:focus {
	box-shadow: 0 0 0 .25rem #0d6efd40;
}
/*
.content SELECT { 
	width: 100%;
    max-width: fit-content;
}
*/

.content .datepicker {
	min-width: 90px;
}

/*
.content INPUT, .content SELECT { 
	PADDING: 5px;
	MARGIN: 0px;
}
*/

DIV.time {
	display: inline-block;
}
.time SELECT {
	width: 50px;
}
SELECT[disabled], INPUT[disabled], TEXTARE[disabled]{
	color: grey;
}

OPTION[disabled]{
	background: #d0cfcf;
	color: grey;
}

FORM .error, .red TD:first-child {
	color: red;
	font-weight: bold;
}
FORM .error { 
	display: inline-block;
	margin-left: 15px;
}

.content INPUT[type="checkbox"], .content INPUT[type="radio"] {
	BACKGROUND-COLOR: transparent; 
	BORDER: 0px;
	margin: inherit;
    margin-top: 6px;
}

/* BEGIN TEXTAREA EDITOR */
.ht-textarea {
	position: relative;
	border: 1px solid black;
}

.ht-textarea .contentbar {
	clear: both;
	width: 100%;
	height: 30px;
	border-bottom: 1px solid black;
}

.ht-textarea .contentbar DIV {
	cursor: pointer;
	float: left;
	margin: 5px;
	width: 20px;
	height: 20px;
	background-image: url('../images/buttons.svg'),none; 
	background-size: initial !important; 
}

.ht-textarea TEXTAREA {
	clear: both;
	width: 100%;
	border: none;
	/*font-family: Arial, Helvetica,Tahoma, Verdana;*/
	/*font-size: 12px;*/
	padding:4px;
	-moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.ht-textarea .contentbar #bold { background-position: 0px 0px; }
.ht-textarea .contentbar #bold:hover { background-position: 0px -40px; }
.ht-textarea .contentbar #italic { background-position: -20px 0px; }
.ht-textarea .contentbar #italic:hover { background-position: -20px -40px; }
.ht-textarea .contentbar #link { background-position: -40px 0px; }
.ht-textarea .contentbar #link:hover { background-position: -40px -40px; }
.ht-textarea .contentbar #hr { background-position: -180px 0px; }
.ht-textarea .contentbar #hr:hover { background-position: -180px -40px; }
.ht-textarea .contentbar .whitespace {
	float: left;
	width: 20px;
	cursor: default;
	background-image: none; 
}
/* END TEXTAREA EDITOR */


BUTTON[type='submit'], .ajax-file-upload {
    border: 1px solid #64758B;
	border-radius: 1px;
    font-style: normal;
    background: #FFFFFF;
    padding: 5px 15px;
    font-weight: 700;
    line-height: 22px;
	font-size: 14px;
    color: var(--main-font-color);
    /* identical to box height */
	text-align: center;
	margin-right: 10px;
	margin-bottom: 10px;
	width: fit-content;
	cursor:pointer;	
}

BUTTON[type='submit']:hover, .ajax-file-upload:hover {
    background: #F1F5F9;
}

BUTTON[type='submit'].green, .ajax-file-upload {
    border-left: 5px solid #1f8838;
}

BUTTON[type='submit'].red {
    border-left: 5px solid #bd1120;
}

BUTTON[type='submit'].blue {
    border-left: 5px solid #19a4cd;
}

BUTTON[type='submit'].green:not(:disabled):active:focus {
    box-shadow: 0 0 0 0.2rem rgba(31, 136, 56, 0.2);
	background: #e3fcef !important;
}

BUTTON[type='submit'].red:not(:disabled):active:focus {
    box-shadow: 0 0 0 0.2rem rgba(189, 17, 32, 0.2);
	background: #f9dbdb !important;
}

BUTTON[type='submit'].blue:not(:disabled):active:focus {
    box-shadow: 0 0 0 0.2rem rgba(25, 164, 205, 0.2);
	background: #dafaff !important;
}

BUTTON[type='submit']:disabled, BUTTON[type='submit']:disabled:hover {
    background: var(--main-background-color);
    border-left: 5px solid #838383;
	color: grey;
	cursor: unset;
}

.green i.fa {
	color: #1f8838;
}

BUTTON.link-button { 
	padding: 0px !important;
	margin: 0px !important;
	background: none;
	border: none;
	color: var(--main-accent-color);
	text-decoration: none;
	cursor: pointer; 
	FONT-SIZE: 12px;
}
BUTTON.link-button:hover { 
	 text-decoration: underline;
	 background: none;
}

.btn:focus {
    outline: medium none !important;
}

.btn {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
	background-color: var(--btn-color);
    background-image: -moz-linear-gradient(center top , #FFFFFF, #E6E6E6);
    background-repeat: repeat-x;
    border-color: #CCCCCC #CCCCCC #BBBBBB;
    border-radius: 10px;
    border-style: solid;
    border-width: 1px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
	color: var(--main-font-color) !important;
    cursor: pointer;
    display: inline-block;
    font-size: 11px;
    line-height: 14px;
	font-weight: bold;
    margin-bottom: 0;
    outline: medium none !important;
    padding: 8px;
    position: relative;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    vertical-align: middle;
	text-decoration: none;
    -webkit-user-select: none;  /* Chrome all / Safari all */
    -moz-user-select: none;     /* Firefox all */
    -ms-user-select: none;      /* IE 10+ */
    user-select: none;          /* Likely future */      
}

.btn:active, .btn.active, .btn.disabled, .btn[disabled] {
    background-color: #E6E6E6;
}
.btn:active, .btn.active {
}
.btn:first-child {
}
.btn:hover {
    -moz-transition: background-position 0.1s linear 0s;
    background-color: var(--btn-color-hover);
    background-position: 0 -15px;
    color: var(--main-accent-color) !important;
	text-decoration: none !important;
}
.btn:focus {
    outline: thin dotted #333333;
    outline-offset: -2px;
}
.btn.active, .btn:active {
    background-color: #E6E6E6;
    background-image: none;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
    outline: 0 none;
}
.btn.disabled, .btn[disabled] {
    background-color: #E6E6E6;
    background-image: none;
    box-shadow: none;
    cursor: default;
    opacity: 0.65;
}
.btn.filter {
	color: var(--main-font-color);
}

#result.short{
	font-weight:bold;
	color:#FF0000;
	font-size:larger;
}
#result.weak{
	font-weight:bold;
	color:orange;
	font-size:larger;
}
#result.good{
	font-weight:bold;
	color:#2D98F3;
	font-size:larger;
}
#result.strong{
	font-weight:bold;
	color: limegreen;
	font-size:larger;
}

DIV.box {
	display: block;
	max-width: 1000px;
	border: 1px solid #fff;
	font-weight: bold;
	padding: 15px;
	margin: auto;
	margin-bottom: 20px;
	text-align: center;
}
DIV.box.success {
	background-color: #d6eed7;
	color: green;
	border-bottom-color: green;
	border-top-color: green;
}
DIV.box.error {
	background-color: #f9dbdb;
	color: #CF033D;
	border-bottom-color: #CF033D;
	border-top-color: #CF033D;
}
DIV.box.warning {
	background-color: #fdfcd2;
	color: var(--main-font-color);
	border-bottom-color: yellow;
	border-top-color: yellow;
}


/*	############################
	Start new notification box
	############################
*/

.react-notification-root{
	position:fixed;
	z-index:9000;
	pointer-events:none;
	width:100%;
	height:100%;
	display: none;
}

.notification-item { 
	display:flex;
	position:relative;
	border-radius:3px;
	box-shadow:1px 3px 4px rgba(0,0,0,.2);
	cursor:pointer
}
.notification-item .timer {
	width:100%;
	margin-top:10px
}
.notification-item .timer,.notification-item .timer .timer-filler {
	height:3px;
	border-radius:5px
}
.notification-item .timer .timer-filler {
	animation-duration: 5000ms;
}
.notification-item.notification-warning .timer .timer-filler  {
	animation-duration: 15000ms;
}
.notification-item .notification-title {
	/*color:#fff;*/
	font-weight:700;
	font-size:14px;
	margin-top:5px;
	margin-bottom:5px
}
.notification-item .notification-message{
	/*color:#fff;*/
	max-width:calc(100% - 15px);
	font-size:14px;
	line-height:150%;
	word-wrap:break-word;
	margin-bottom:0;
	margin-top:0
}
.notification-item .notification-content {
	padding:8px 15px;
	display:inline-block;
	width:100%
}
.notification-item .notification-close {
	width:18px;
	height:18px;
	border-radius:50%;
	display:inline-block;
	position:absolute;
	right:10px;
	top:10px
}
.notification-item .notification-close:after {
	content:'\D7';
	position:absolute;
	transform:translate(-50%,-50%);
	color:#000;
	font-size:12px;
	left:50%;top:50%
}

.notification-container-bottom-center,.notification-container-bottom-left,.notification-container-bottom-right,.notification-container-center,.notification-container-top-center,.notification-container-top-left,.notification-container-top-right{
	max-width:500px;
	width: -webkit-fill-available;
	position:absolute;
	pointer-events:all
}

.notification-container-bottom-left{
	bottom:20px;
	margin-left: 20px;
	margin-right: 20px;			
}
.notification-default, .notification-default .timer{
	background-color:#007bff
}
.notification-default .timer-filler{
	background-color:#fff
}
.notification-default .notification-close{
	background-color:#007bff
}
.notification-success {
	border-left:8px solid #1f8838
}
.notification-success,.notification-success .timer {
	background-color:#e3fcef
}
.notification-success .timer-filler {
	background-color:#1f8838
}
.notification-success .notification-close {
	background-color:#e3fcef
}
.notification-error{
	border-left:8px solid #bd1120
}
.notification-error,.notification-error .timer{
	background-color:#f9dbdb
}
.notification-error .timer-filler{
	background-color:#bd1120
}
.notification-error .notification-close{
	background-color:#f9dbdb
}
.notification-info{
	border-left:8px solid #138b9e
}
.notification-info,.notification-info .timer{
	background-color:#17a2b8
}
.notification-info .timer-filler{
	background-color:#fff
}
.notification-info .notification-close{
	background-color:#17a2b8
}
.notification-warning{
	border-left:8px solid #ce9c09
}
.notification-warning,.notification-warning .timer{
	background-color:#fff79c
}
.notification-warning .timer-filler{
	background-color:#ce9c09
}
.notification-warning .notification-close{
	background-color:#fff79c
}
.notification-awesome{
	border-left:8px solid #4c3fb1
}
.notification-awesome,.notification-awesome .timer{
	background-color:#685dc3
}
.notification-awesome .timer-filler{
	background-color:#fff
}
.notification-awesome .notification-close{
	background-color:#685dc3
}
@keyframes timer{0%{width:100%}to{width:0}}

@media screen and (max-width: 530px) {
	.notification-container-bottom-center,.notification-container-bottom-left,.notification-container-bottom-right,.notification-container-center,.notification-container-top-center,.notification-container-top-left,.notification-container-top-right{
		max-width:unset;
		position:absolute;
		pointer-events:all
	}	
}
/*
@media screen and (max-width: 740px) {
	.notification-container-bottom-left{
		bottom:70px;
	}
}
*/
/* 	############################
	End of notification box
	############################
*/



/* 	############################
			DROPDOWN MENU
	############################
*/
.btn-group {
    position: relative;
    display: inline-block;
    vertical-align: middle;
	margin-right: 10px;
}
.btn-group.open .dropdown-toggle {
    -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
    box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
}
.btn-group.open>.dropdown-menu, .btn-group.open>.dropdown-search {
    display: block;
}
.btn-group .dropdown-toggle:active, .btn-group.open .dropdown-toggle {
    outline: 0;
}
.dropdown-toggle i.fa { 
	font-size: 12px;
}
.dropdown-menu {
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 1000;
    display: none;
    min-width: 100px;
    padding: 5px 0;
    margin: 0;
    list-style: none;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    background-clip: padding-box;
}
.dropdown-menu>li {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: var(--main-font-color);
    white-space: nowrap;
}
.dropdown-menu>li:hover, .dropdown-menu>li:focus {
    color: var(--main-accent-color);
	cursor: pointer;
    background-color: #f5f5f5;
	text-decoration: none;
}
.dropdown-menu SPAN {
  display: none;
}
.dropdown-menu .active SPAN {
  display: inline-block;
}
.dropdown-search {
    position: absolute;
    right: 0;
	width: 300px;
    display: none;
    background-color: #fff;
    border: 1px solid var(--main-accent-color);
	border-top: 0px;
	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
HEADER.onscroll .dropdown-search {
    margin-top: -4px;
}

.searcharea BUTTON {
    border: 0px;
    background: transparent;
    padding: 0px;
}
.searcharea {
	display: table;
	width: 100%;
}
.searcharea > DIV.row {
	display: table-row;
}
.searcharea > DIV.row DIV {
	display: table-cell;
	padding: 8px;
}
.searcharea INPUT {
	border: 0px;
	width:100%;
	padding: 15px 5px;
	box-sizing: border-box;
	height: 22px;
}	
.searcharea i {
	font-size: 20px;
	margin-top: 0px;
}


/* 	############################
	CK Editor
	############################
*/
P {
	margin: 0;
    line-height: 1.5em;
}
TABLE.ck-table-top {
	border-bottom: 0px !important;
}
TABLE.ck-table-bottom {
	border-top: 0px !important;
}
.ck-editor__editable_inline {
	min-height: 200px;
}
.ck-content .image {
	margin: 0 !important;
}
.ck.ck-editor__editable_inline{
	padding: var(--ck-spacing-standard) !important;
}
/*.text p,
.ck-content p{
	margin: 0;
}*/
.text .image-style-side{
	float: right;
}
.text::after{
	content: '';
	display: block;
	clear: both;
}
.ck-content blockquote,
.text blockquote{
	background: #c6c6c6;
	margin: 0;
	padding: 10px !important;
	font-family: Courier New;
}
.ck-content blockquote P,
.text blockquote P {
	font-family: Courier New;
}
.text figure{
	width: 100%;
	max-width: 100%;
	margin: 0;
}
.ck-content img,
.text img{
	width: 100%;
}
.ck-content .todo-list .todo-list__label>input {
	padding-top: 0px;
	margin-top: 0px;
	padding-left: 0px;
}
UL {
	margin-block-start: 0px;
    margin-block-end: 0px;
}


.google_map {
	overflow: hidden;
    border-radius: 20px;
}


/* 	############################
			MOBILE VERSION
	############################
*/

@media (min-width:740px) and (max-width:1100px) {
	NAV ul ul {
		left: inherit;
		right: 0;
	}
}

@media screen and (max-width: 740px) {
	HEADER {
		padding-bottom: 50px;
	}
	HEADER #logo IMG, HEADER.onscroll #logo IMG { 
		max-height: 32px;
		margin-left: 10px;
		margin-top: 11px;
	}	
	HEADER #header-nav, HEADER.onscroll #header-nav {
		height: 50px;
	}	
	HEADER .grid-container {
		width: 100%;
		padding-left: 0px; 
		padding-right: 0px;
	}
	HEADER #topmenu {
		display: none;
	}
	HEADER #mobilemenu {
		top: 50px;
		left: 0px;
		width: 100%;
		min-height: 100%;
		height: 100%;
		background: rgba(236,236,236,1);	
		position: fixed;
		display: none;
		overflow-x: hidden;
		overflow-y: auto;
		z-index: 10;	
	}		
	.content {
		padding: 10px 0px 10px 0px;		
	}
	HEADER #mobile_menubutton {
		display: inline-block;
		float: right;
		padding: 10px;
	}	
	HEADER #mobile_menubutton i {
		font-size: 30px;
	}
	/* MOBILEMENU */
	HEADER #mobilemenu NAV ul {
		width: 100%;
		margin-bottom: 50px;
		float: none;
	}
	HEADER #mobilemenu NAV ul a {
		color:var(--main-font-color);
	}
	HEADER #mobilemenu NAV ul li {
		position:relative;
		float:none;
		margin:0;
		padding:0;
		height: auto;
	}
	HEADER #mobilemenu NAV ul li:last-child { border-bottom: solid 1px black; }
	HEADER #mobilemenu NAV ul ul li:last-child { border-bottom: none; }
	
	HEADER #mobilemenu NAV ul li a span, HEADER #mobilemenu NAV ul li li a span {
		position: initial;
	}
	HEADER.onscroll #mobilemenu NAV ul li {
		padding-top: 0px;
	}

	HEADER #mobilemenu NAV > ul ul.active {
	  margin: 0;
	  max-height: 55em;
	  padding: 0;
	  display: block;
	}
	HEADER #mobilemenu NAV ul li a {
		border-top: solid 1px black;
		padding: 10px;
		padding-left: 20px;
		max-width: inherit;
		line-height: initial;
	}
	HEADER #mobilemenu NAV ul li i {
		margin-right: 15px;
		float: right;
	}
	HEADER #mobilemenu NAV ul li:hover {
		background:none;
	}
	HEADER #mobilemenu NAV ul li:hover > ul {
		margin-top: 0px;
	}
	HEADER #mobilemenu NAV ul ul li:hover {
		background:#ddd;
	}
	HEADER #mobilemenu NAV ul li:hover > a > span:before, HEADER #mobilemenu NAV ul li li:hover > a:before {
		border: 0px;
	}
	HEADER #mobilemenu NAV ul ul {
		display:none;
		border:0px;
		margin-top:0px;
		position:inherit;
		background:#fff;
		box-shadow: none;
		z-index: 1;
	    margin: 0;
		max-height: 0; 
		overflow: hidden;		
	}
	HEADER #mobilemenu NAV ul ul li {
		float: left;
		position: relative;
		width:100%;
		height: auto;
	}
	HEADER #mobilemenu NAV ul li:last-child li {
		width: inherit;
	}
	HEADER #mobilemenu NAV ul ul a {
		color:var(--main-font-color);
		/* line-height:44px; */
		padding: 12px 15px;
		padding-left: 30px;
	}
	HEADER #mobilemenu NAV ul ul ul {
		top:0;
		left:100%;
		margin-left: 0px;
		border:0px;
		position: initial;
	}
	HEADER #mobilemenu NAV ul ul ul a {
		padding-left: 50px;
	}
	.onlymobile {
		display: block !important;
	}
	.nomobile, #topmenu .shopping-cart, #topmenu .shopping-basket  {
		display: none !important;
	}
	i.fa, i.fa-solid, i.fa-regular { 
		font-size: 25px;
	}
}

/*  
##########################

TABLE

##########################
*/

.table-responsive {
  min-height: .01%;
  overflow-x: auto;
}

TABLE {
	border-collapse: collapse; 
	margin: 0px;
	width: 100%
}
TABLE.bordered, TABLE.form, TABLE.content {
	--border: 1px solid #ddd;
	border-radius: 10px;

	/* Don't change these properties */
	border-spacing: 0;
	border-collapse: separate;
	border: var(--table-border);
	overflow: hidden;	
}

/* Apply a border to the right of all but the last column */
table.bordered th:not(:last-child),
table.bordered td:not(:last-child) {
 border-right: var(--border);
}

/* Apply a border to the bottom of all but the last row */
table.bordered>thead>tr:not(:last-child)>th,
table.bordered>thead>tr:not(:last-child)>td,
table.bordered>tbody>tr:not(:last-child)>th,
table.bordered>tbody>tr:not(:last-child)>td,
table.bordered>tfoot>tr:not(:last-child)>th,
table.bordered>tfoot>tr:not(:last-child)>td,
table.bordered>tr:not(:last-child)>td,
table.bordered>tr:not(:last-child)>th,
table.bordered>thead:not(:last-child),
table.bordered>tbody:not(:last-child),
table.bordered>tfoot:not(:last-child) {
 border-bottom: var(--border);
}

TABLE.radius-header-only {
	border-radius: 10px 10px 0px 0px;
}
TABLE.radius-bottom-only {
	border-radius: 0px 0px 10px 10px;
}

TABLE.bordered-save-button TD {
	padding: 15px 15px 5px 15px !important;
}

/*
table.bordered>tbody>tr:hover {
	--bs-table-hover-bg: rgba(0, 0, 0, 0.075);
	background-color: var(--bs-table-hover-bg) !important;
}
*/

TABLE.content {
	padding: 5px;
}
TABLE.bordered TD, TABLE.form TD {
	padding: 7px;
	line-height: 25px;
	-webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
TABLE.bordered TD {
	/*border: 1px solid #ddd;*/
}
TABLE THEAD TR {
	background-color: #6a6a6a; /* #CF033D; */
	color: white;
	font-weight: bold;
}
TABLE.bordered TBODY TR:nth-child(even), TABLE.overview TBODY TR:nth-child(even), .overview DIV.tr:nth-child(even), .eventslider UL > LI {  
	/* BACKGROUND-COLOR: #ECECEC; */
	background-color: var(--table-body-color);
}
TABLE.bordered TBODY TR:nth-child(odd), TABLE.overview TBODY TR:nth-child(odd), .eventslider UL > LI.odd {
	/* BACKGROUND-COLOR: #F9F9F9; */
	background-color: var(--table-body-color-odd);
}
TABLE.headerform {
		width: inherit;
	}
.headerform TD{
	vertical-align: middle;
	padding: 5px;
}
.headerform BUTTON[type='submit'] {
	margin-bottom: 0px;
}

.table-bordered {
  border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td {
  border-bottom-width: 2px;
}

@media screen and (max-width: 767px) {
  .table-responsive {
    width: 100%;
    margin-bottom: 15px;
    overflow-y: hidden;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    border: 1px solid #ddd;
  }
  .table-responsive > .table {
    margin-bottom: 0;
  }
  .table-responsive > .table > thead > tr > th,
  .table-responsive > .table > tbody > tr > th,
  .table-responsive > .table > tfoot > tr > th,
  .table-responsive > .table > thead > tr > td,
  .table-responsive > .table > tbody > tr > td,
  .table-responsive > .table > tfoot > tr > td {
    white-space: nowrap;
  }
  .table-responsive > .table-bordered {
    border: 0;
  }
  .table > caption + thead > tr:first-child > th,
	.table > colgroup + thead > tr:first-child > th,
	.table > thead:first-child > tr:first-child > th,
	.table > caption + thead > tr:first-child > td,
	.table > colgroup + thead > tr:first-child > td,
	.table > thead:first-child > tr:first-child > td {
	  border-top: 0;
	}
  .table-responsive > .table-bordered > thead > tr > th:first-child,
  .table-responsive > .table-bordered > tbody > tr > th:first-child,
  .table-responsive > .table-bordered > tfoot > tr > th:first-child,
  .table-responsive > .table-bordered > thead > tr > td:first-child,
  .table-responsive > .table-bordered > tbody > tr > td:first-child,
  .table-responsive > .table-bordered > tfoot > tr > td:first-child {
    border-left: 0;
  }
  .table-responsive > .table-bordered > thead > tr > th:last-child,
  .table-responsive > .table-bordered > tbody > tr > th:last-child,
  .table-responsive > .table-bordered > tfoot > tr > th:last-child,
  .table-responsive > .table-bordered > thead > tr > td:last-child,
  .table-responsive > .table-bordered > tbody > tr > td:last-child,
  .table-responsive > .table-bordered > tfoot > tr > td:last-child {
    border-right: 0;
  }
  .table-responsive > .table-bordered > tbody > tr:last-child > th,
  .table-responsive > .table-bordered > tfoot > tr:last-child > th,
  .table-responsive > .table-bordered > tbody > tr:last-child > td,
  .table-responsive > .table-bordered > tfoot > tr:last-child > td {
    border-bottom: 0;
  }
}

/* EVENT SLIDER */
#news .table.overview {
	overflow: hidden;
	border-radius:20px;
}
.eventslider {
	width: 100%;
	border: var(--table-border);
	overflow: hidden;
	border-radius:20px;
}
.eventslider UL { 
	padding:0; 
	margin: 0;
	list-style:none;
	width: 100%;
}
.eventslider .cell {
	display: table-cell;
	vertical-align: middle;
}
.eventslider LI IMG {
	float: left;
	width: 60px;
	margin-right: 15px;
}		
.eventslider LI {
	height: 60px
}
.eventslider .cell DIV {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;	/* number of lines to show */
	-webkit-box-orient: vertical;
}

/* POPOVER */
.popover {
  position: absolute;
  top: 0;
  left: 0;
  color: black;
  z-index: 1060;
  display: none;
  max-width: 276px;
  padding: 1px;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  letter-spacing: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  white-space: normal;
  background-color: #fff;
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, .2);
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
          box-shadow: 0 5px 10px rgba(0, 0, 0, .2);

  line-break: auto;
}
.popover.top {
  margin-top: -10px;
}
.popover.right {
  margin-left: 10px;
}
.popover.bottom {
  margin-top: 10px;
}
.popover.left {
  margin-left: -10px;
}
.popover-title {
  padding: 8px 14px;
  margin: 0;
  font-size: 12px;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
  border-radius: 5px 5px 0 0;
}
.popover-content {
  padding: 9px 14px;
}
.popover > .arrow,
.popover > .arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.popover > .arrow {
  border-width: 11px;
}
.popover > .arrow:after {
  content: "";
  border-width: 10px;
}
.popover.top > .arrow {
  bottom: -11px;
  left: 50%;
  margin-left: -11px;
  border-top-color: #999;
  border-top-color: rgba(0, 0, 0, .25);
  border-bottom-width: 0;
}
.popover.top > .arrow:after {
  bottom: 1px;
  margin-left: -10px;
  content: " ";
  border-top-color: #fff;
  border-bottom-width: 0;
}
.popover.right > .arrow {
  top: 50%;
  left: -11px;
  margin-top: -11px;
  border-right-color: #999;
  border-right-color: rgba(0, 0, 0, .25);
  border-left-width: 0;
}
.popover.right > .arrow:after {
  bottom: -10px;
  left: 1px;
  content: " ";
  border-right-color: #fff;
  border-left-width: 0;
}
.popover.bottom > .arrow {
  top: -11px;
  left: 50%;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: #999;
  border-bottom-color: rgba(0, 0, 0, .25);
}
.popover.bottom > .arrow:after {
  top: 1px;
  margin-left: -10px;
  content: " ";
  border-top-width: 0;
  border-bottom-color: #fff;
}
.popover.left > .arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-right-width: 0;
  border-left-color: #999;
  border-left-color: rgba(0, 0, 0, .25);
}
.popover.left > .arrow:after {
  right: 1px;
  bottom: -10px;
  content: " ";
  border-right-width: 0;
  border-left-color: #fff;
}

.ui-autocomplete li:nth-child(odd) {
    background: inherit;
}
.ui-autocomplete-category {
	font-weight: bold;
	padding: .2em .4em;
	background: #6a6a6a !important;
	color: white !important;
}

/*
Favorite buttons
*/
.favoblocks {
	text-align: center;
}
.favo {
	display: inline-table;
	margin: 0px 5px 10px 5px;
	width: 100%;
	height: 70px;
	max-width: 200px;
	padding: 10px;
	background-color: var(--table-body-color);
	color: var(--main-font-color);
	border-radius: 20px;
	overflow: hidden;
	border 0px;
	cursor: pointer;
	align-items: center;
}
.favo:hover {
	background-color: var(--table-body-color-hover); 
}
.favo SPAN {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	font-size: 25px;
	line-height: 25px;
}
.favo IMG {
	max-width: 100%;
    max-height: 40px;
}


/*
bx-slider style
*/
.bx-wrapper img {
	border-radius: 15px;
}

.bx-wrapper .bx-caption span {
	border-radius: 0px 0px 15px 15px;
}

/*

#####################################
#
# SPECIAL STYLE FOR INTERNET EXPLORER
#
#####################################

*/

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	nav ul li li a {
		line-height: 16px;
	}
	
	header.onscroll nav ul li li a {
		line-height: 16px;
	}

	header.onscroll nav ul li:hover > ul {
		margin-top: -16px;
	}
}

@media print {
	HEADER {
		display: none;
	}
}

.statusblock {
	height: 200px; 
	width: 200px; 
	margin: 0px 20px 20px 0px;
	padding:2px;
	position: relative;
	display: inline-block;
	cursor: pointer;
	overflow: hidden;
	border-radius: 20px;
}
.statusblock.green {
	background: linear-gradient(to top,  #27d427 0%,#f6f6f6 130%); 
}

.statusblock.red {
	color: white;
	background: linear-gradient(to top,  #FF0000 0%,#f6f6f6 130%); /* W3C */
}
.statusblock.orange {
	background: linear-gradient(to top,  #ff8822 0%,#f6f6f6 130%); /* W3C */			
}
.statusblock.grey {
	background: linear-gradient(to top,  #b5b5b5 0%,#f6f6f6 130%); /* W3C */
}		
.statusblock .subject {
	font-size: 15pt;
	text-align: center;
	padding: 5px;
	bottom: 5px;
	position: absolute;
	width: -webkit-fill-available;
}
.statusblock .number {
	font-size: 40pt;
	width: 100%;
	position: absolute;
	top: 68px;
	text-align: center;
}
.statusblock .date {
	font-size: 25pt;
	width: 100%;
	position: absolute;
	top: 68px;
	text-align: center;
}