html, body {
	scroll-behavior:smooth;
}
@media (prefers-reduced-motion: reduce){
	html, body {
		scroll-behavior:auto;
	}
}

body {     -webkit-text-size-adjust: 100%;     -ms-text-size-adjust: 100%;   } 


code, deepl {
    padding: 2px 4px;
  font-size: 90%;
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 4px;
    max-width: 460px;
    overflow: hidden;
    -webkit-text-fill-color:#c7254a!important;
}
code[style*="background"] {
    color:rgba(0,0,0,0.9);
    -webkit-text-fill-color:rgba(0,0,0,0.9)!important;
    border-color:color:rgba(0,0,0,0.3);
    display: inline-block;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 1px;
    padding-bottom: 1px;
}
deepl {
    padding: 0px;
    color: #55A797;
    -webkit-text-fill-color:#55A797!important;
  background-color: #ACDAB620;
}
deepl[from-translate-key] {
    background-color: #CFB32720;
    color: #CFB327;
    -webkit-text-fill-color:#CFB327!important;
}
* {
	 font-display: swap;
}
textarea {
        resize: none;
    }

input,
textarea, input, textarea, button, button, select {
    -webkit-appearance: none;
	border-radius:0;
	outline:none;
}
html, body, div, span, object, iframe, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, img, ins, kbd, q, samp, tt, var, center, dl, dt, dd, ol, ul, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, h1, h2, h3, h4, h5, h6 {   margin: 0;   padding: 0;   border: 0;   outline: 0;  } * { -webkit-tap-highlight-color: rgba(255, 255, 255, 0); tap-highlight-color: rgba(255, 255, 255, 0);  } 

*, *:focus, input, label, *::before, *::after  {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;	*behavior: url(/_core/htc/boxsizing.htc);
}

body {
	width: 100%;
	min-height: 100svh;
}
body {  
	overflow-y: auto;
	overflow-x: hidden;
	max-width: 100%;
	max-height: 100svh;
} 
body, input, textarea, button, table {
	line-height: 1.5;
	font-family: sans-serif;
	font-size:13.333333px;
}
h1, h2, h3, h4, h5, h6 {
	line-height: 1;
}
alpha {
	opacity: 0.5;
}
alpha:hover {
	opacity: 1;
}
table {
	border-spacing: 0px;
    border-collapse:collapse;
}
ul li, ol li {
	padding: 0;
	margin: 0;
	list-style-position:outside;
	margin-left: 15px;
}
nav ul li {
	margin-left: 0px;
}
/* Bootstrap*/


.clearafter:after, .group:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  margin:0px;
  padding:0px;
}
.clear {
  height: 0;
  clear: both;
  visibility: hidden;
  margin:0px;
  padding:0px;
}


/*Menu, Submenu, footer, headlines etc*/
header ul, footer ul, nav ul {
	margin:0px;
	padding:0px;
	list-style:none;
	list-style-type:none;
}

header ul li > a, footer ul li > a, nav ul li > a {
	display:block;
}

/*Grid model*/
.group, .group-tiny, .group-small, .group-big {	
	width:100%;
}
hr {
	border: none;
	border-top:1px solid rgba(200,200,200,0.5);
	margin-top: 15px;
	margin-bottom: 5px;
}
.group:not(:first-child) {
	padding-top:10px;	
}
div[style*="grid"] > .group {
    padding-top: 0px;
}
.group-tiny {
	
}
.group-small:not(:first-child) {
	padding-top:5px;	
}
.group-big {
	padding-top:25px;	
}
.group-big:first-child, .group-small:first-child, .group:first-child {
	padding-top:0px;	
}
.no-border-top {
	border-top:none!important;	
}
.no-border-left {
	border-left:none!important;	
}
.no-border-right {
	border-right:none!important;	
}
.no-border-bottom {
	border-bottom:none!important;	
}
.no-borders {
	border-top:none!important;	
	border-left:none!important;	
	border-right:none!important;
	border-bottom:none!important;
}
.edge-top-left,.edge-top-right,.edge-bottom-left, .edge-bottom-right {
	position:fixed;
	z-index:9999;
}
.edge-bottom-right {
	bottom: 0px;
	right: 0px;
}
.float-left {
	float:left!important;	
}
.float-right {
	float:right!important;	
}
.center {
	margin:auto;
}
.truncate {
  	white-space: nowrap;
  	overflow: hidden;
  	text-overflow: ellipsis;
}

body {

}
nav {

}

nav ul {
	display: flex;
	flex-direction: row;
}
nav ul nav ul {
    display: block;
}
nav ul > li {
	position: relative;
}
pre, code {
	font-size:9.5px;
	line-height: 13px;
}
a {
	color:blue;
	text-decoration: none;
}
#chrome_websiteIP {
	width: 100px!important;
	font-size:10px!important;
	left: 50%!important;
	margin-left: -25px!important;
	opacity: 0.1;
	text-align: center;
	background-color: #000!important;
	color:#fff;
	border:none;
}
#chrome_websiteIP:hover {
	opacity: 1;	
}
img, figure {
	max-width: 100%;
    display: block;
}
th {
	text-align: left;
}
a img {
	display: block;
}
body.not-published { 
     position: relative;
}
body.not-published { 
     position: relative;
}
body.not-published::before {
    content: 'Deze pagina is nog niet gepubliceerd en niet zichtbaar voor bezoekers';
    position: fixed;
    bottom:0px; 
    left: 0px;
    right: 0px;
    padding: 5px;
    text-align: center;
    font-size:11px;
    font-family: 'verdana';
    line-height: 11px;
    letter-spacing: 0px;
    z-index: 999999;
    background-color: #ffcc0095;
}
nav .not-published {
    opacity: 0.66;
    position: relative;
}
nav  .not-published::before {
    content: 'niet gepubliceerd:';
    position: absolute;
    bottom:100%;
    left: 0px;
    right: 0px;
    text-align: center;
    font-size:8px;
    font-family: 'verdana';
    line-height: 8px;
    letter-spacing: 0px;
}
.align-left {
    text-align: left;
}
p.align-center {
    margin-left: auto;
    margin-right: auto;
}
.align-center {
    text-align: center;
}

.align-right {
    text-align: right;
}

figure.align-center {
    margin: auto;
    text-align: center; 
}
figure.align-center > * {
	text-align: center;
	width: 100%;
}
figure.align-center > *:is(img, figcaption) {
    display: inline-block;
    margin-left: auto;
	margin-right: auto;
    width: auto;
    max-width: 100%;
}


div.not-published {
    opacity: 0.75;
    mix-blend-mode: luminosity;
}


.loading-dots {
    display: inline-block;
}
.loading-dots::after {
	display: inline-block;
	min-width: 15px;
	text-align: left;
	
	content:'...';
	animation: fxltd;
	animation-duration: 1s;
	animation-iteration-count: infinite;
}

@keyframes fxltd {
    0% {content:'...' }
    25% {content:'....'}
	50% { content:'.'}
	75% {content:'..'}
	0% {content:'...' }
}

.cookie-bar {
	position: fixed;
	left:10px;
	bottom: 20px;
	z-index: 100000000;
	
}

a:has(img){
    
    display: block;
}