/**
###############################################################################
#  koala.css
#
#  General stylesheet for all browsers 
#  (see special Fixes for IE7 and IE6 in separate stylesheet files)
#
#  Copyright: Koala Software Productions
#  Project: Aanmelden bij EventLogin
#  Creation date: Oktober 2009
#  Last change: December 2017, January 2025
#  History:
#
#
###############################################################################
**/

/*Import Google Font*/
@import url(//fonts.googleapis.com/css2?family=Bree%20Serif:wght@400;500;700);
@import url(//fonts.googleapis.com/css?family=Poppins:300,400,500,700%7CBree+Serif);

@import url(fonts/fonts_akzidenzgrotesk.css);
@import url(fonts/fonts_icomoon.css);

:root {
	--prim-color-1: #0094d9; /* blauw1  */  	
  	--prim-color-2: rgba(255,255,255,1); /* wit */
  	/* --prim-bgcolor-1: rgba(1,150,66,1); /* vmi-groen #019642*/
  	--prim-bgcolor-1: #004a6d; /* donkerblauw */
  	--prim-bgcolor-2: #0094d9; /* blauw1 */  	
 	--select-border: #777;
	--select-focus: blue;
	--select-arrow: var(--select-border);
	--basis-font: 'Poppins', Arial, sans-serif;
	--koppen-font: 'Bree Serif', helvetica, arial, serif; 	
}


html, p, td, li, input, button  {
    font-family: var(--basis-font);
    font-weight: 400;
}
h1, h2, h3, h4, table.content caption {
    font-family: var(--koppen-font);
    font-weight: bold;
    line-height: 1.15em;
}

* {margin: 0; padding: 0}

html{
	font-size: 12pt;
	line-height: normal;

	height: 100%;
	margin: 0; 
	padding: 0;
}

html.authenticate, html.index, html.verwerkAanmelding {	
	background: #97aab0;

	background: #000;
	background: url('../images/backgrounds/background.webp') no-repeat left top fixed; 
	background-size: cover; 
}
/*
.authenticate body, .index body, .verwerkAanmelding body {
	background: rgba(253,253,253,.0) url('../images/logos/klantlogo.webp') calc(20px + max(3%, 34px)) 3% no-repeat; 
	background-size: max(15%,275px) auto;
	background-attachment: fixed;
}
*/

/*  next declarations to fix iPad Safari */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)  { 
	html.authenticate, html.index, html.verwerkAanmelding {
		height: 100%;
		overflow: hidden;
	}
	.authenticate body, .index body, .verwerkAanmelding body {
		height:100%;
		overflow: scroll;
		-webkit-overflow-scrolling: touch;
	}
}
/*  end declarations to fix iPad Safari */

#wrapper {

	xmargin: 20px auto 0px auto;

	margin-left: max(2%, 35px);
	xmargin-left: calc(97% - 630px);
	padding: 10px 20px 5px 20px;
	width: 630px;
}
.authenticate #wrapper {
	xcolor: #fff;

    xmargin-left: calc(97% - 590px);
	padding: 10px 20px 15px 20px;
		
	width: 570px;
	z-index:5;
}
.index #wrapper, .verwerkAanmelding #wrapper {

	
	xcolor: #fff;	
	xbackground: rgba(253,253,253,.0) url('../images/logos/klantlogo.webp') center 6% no-repeat; 
    xbackground-size: 100%;
    xborder-radius: 7px 7px 0 0;	
}
.verwerkAanmelding #wrapper {
	xpadding-top: 2px;	
}	
.adminItems #wrapper, .editItem #wrapper, .editDeelnemer #wrapper {
	color: #000;
	margin-left: 50px;
	padding-top:0;
	position: relative;
	width: 100%;
}
.uploadImages #wrapper {
	width: 100%;
}
#logo-header {
	padding-left: 10px;
	padding-top: 5px;
}


body.admin {
	width: 1200px;
	margin: 0 20px;
	padding: 0 10px;	
}
.authenticate #header {

	background: url('../images/logos/KlantLogo.svg') left top no-repeat;
	background-size: 50%;
	height:200px;
	margin-top:4px;
	text-align: center;
}
.index #header, .verwerkAanmelding #header {
	background: url('../images/logos/KlantLogo.svg') left top no-repeat;  
    background-size: 50%;
	height: 200px;
}
.authenticate table {
	margin: 2px auto;
}
.admin {
	width: 783px;	
}
.configuratiescherm {
	width:1200px;
	padding-left: 20px;	
}
.editDeelnemer ol {
	list-style: none;
}
.xfotostrook {
	background: url(../images/backgrounds/fotostrook.jpg) no-repeat 618px 46px; 
}
#footer {
	height: 6px;
	width: 580px;
	position: relative;
}
.index #footer {
/*
	background: url('../images/backgrounds/footer-kerstharten-3x.jpg') center top no-repeat; 
	height: 500px;
*/	
}
.xauthenticate #footer {
	width: 425px;
}
#footer .custom {
	float: right;
	margin-top:25px;	
	margin-right: 25px;
}
.socialLinks {
    position: absolute;
    top: 0;
    right: 0;
    margin: 6px 4px;
    overflow: hidden;
    line-height: 21px;
}
.socialLinks p,
.socialLinks ul,
.socialLinks li {
    float: left;
}
.socialLinks p {
    margin: 20px 5px 10px 10px;
    color: white;
}
.socialLinks ul {
    margin: 15px 10px 10px 0;
}
.socialLinks li {
    margin-left: 3px;
}
.socialLinks li a {
    display: block;
    width: 20px;
    height: 0;
    padding-top: 20px;
    overflow: hidden;
    background-repeat: no-repeat;
}
.socialLinks li.facebook a {
    background-image: url('../images/icons/facebook.png');
}
.socialLinks li.twitter a {
    background-image: url('../images/icons/twitter.png');
}
.socialLinks li.linkedin a {
    background-image: url('../images/icons/linkedin.png');
}
.socialLinks li.rss a {
    background-image: url('../images/icons/rss.png');
}

h1 {
	color: var(--prim-color-1);
	font-size: 25pt;
	font-weight: bold;
	margin: 10px 10px 25px 0;
	padding-top: 2px;
}
.authenticate h1 {
	font-size: 40px;
	margin: 0 0 25px 0;
	padding-top: 10px;
}
.authenticate h3 {
	color: #fff;
	font-family: "PT Sans", helvetica, arial;
	text-transform: uppercase;
	font-size: 20px;
	line-height: 20px;
	margin-bottom: 20px;
}
.index h1 {
	color: var(--prim-color-1);
	font-size: 18px;	
	text-shadow: 1px 1px #000;	
}
.configuratiescherm h1 {
	margin-top: 30px;
	margin-bottom: 50px;
}
h2 {
	color: var(--prim-color-1);
	font-size: 18pt;	
	margin: 10px 200px 5px 2px;
	text-align: left;
}
.h2 {
	color: var(--prim-color-2);
	font-weight: bold;
	font-style: italic;
}
h3 {
	color: var(--prim-color-1);
	font-size: 16pt;
	margin-top:20px;
	margin-bottom: 0;
}
p, dd {
	line-height: 1.35em;
/*	margin: 2px 25px 7px 2px; */
	margin: 3px 2px 10px 2px;
}
dt {
	display:block;
	width: 5em;
}
dd {
	display:block;
	margin: -1.45em 25px 10px 7em;
}
td p {
	line-height: 1.2em;
	margin: 2px 5px 2px 2px;
}
.intro {
/*
	margin-right: 270px;
*/	
}
.intro img {
	margin-left: 25px;	
}
p.mailcontactgegevens {
	margin-bottom: 25px;
}
.vraag {
	margin: 5px 15px 5px 2em;
	clear: both;
}
.klein{
	font-size:8pt;
	margin: 0px 30px 0px 11em;
}
.klein2{	
	color: #777;
	font-size:8pt;
	margin: 0px 10px 0px 5em;
}
p.waarde {
	background: #FFFFCC;
	display:block;
	font-weight:400;
	padding: 2px;
	width: 20em;
}

ul {
	list-style: none;
	margin-left: 30px;
}
#divWelkomstekst {
/*	
	background: url(../images/backgrounds/eigen-fotos.jpg) left bottom no-repeat; 
	padding-bottom: 70px;	
*/
	xmargin-top: 20px;

	xbackground-color: rgba(255, 255, 255, 0.95);

	xborder: 1px solid #169a4e;
	xborder-radius: 8px;
	xbox-shadow: 2px 3px 2px 0px rgba(22,154,78,1);

	xmargin-bottom: 1.5em;
	xmargin-left: 35px;
	padding: 10px 2em;
	width: 500px;
}
.verwerkAanmelding #divWelkomstekst {
	margin-top: 0;
}

#divWelkomstekst ul {
	list-style: circle;
}
#divWelkomstekst ul.adresgegevens {
	list-style: none;
}
#divWelkomstekst h3  {
    text-transform: none;
    letter-spacing: 0;

}    
#divWelkomstekst h6 {
    font-family: PT Sans;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 20px;
    line-height: 20px;
    font-weight: 700;
}

fieldset ul.adresgegevens li {
	padding: 0;	
}

a{
	color:#000;
	font-weight: bold;
	text-decoration:none;
}
.klant {color: var(--prim-color-1) !important;}
.eventlogin {color: var(--prim-color-1);}
a:hover{
	text-decoration:underline;
}
img{
	border:none;
}
img.plaatje {
	float: right;
}
img.opstapplaats {
	margin: 3px auto;
	width: 150px;
}
.activiteit img {
	border-radius: 4px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);;
	margin-bottom: 3px;
}
#divMain {
	background: rgba(255,255,255,.75);
	padding: 15px 20px 30px 30px;
	position: relative;
}
.xindex #divMain, .xverwerkAanmelding #divMain {
	background: rgba(255,255,255,.75) url(../images/logos/klantlogo.webp) right top no-repeat; 
	background-size: 40%;		
}
.xauthenticate #divMain {
	background: rgba(255,255,255,.75) url(../images/logos/klantlogo.webp) right top no-repeat; 
	background-size: 50%;
}
.config #divMain {
	background-color: #fff;
}

#divTabel {
  clear: both;
  margin-bottom: 40px;
  margin-left: 30px;
  margin-right: 0;
  margin-top: 20px;
  xoverflow-x: auto;
  padding-top: 20px;
}
#KlantLogo {
	position: absolute;
	right: 11px;
	top: 0px;
	display: block;
}
#EventLoginLogo {
	position: absolute;
	top: 0px;
	right: 13px;
}
fieldset {
	xbackground-color: #ffffff;
	xbackground-color: rgba(255, 255, 255, 0.95);

	border: 1px solid var(--prim-color-1);
	border-radius: 8px;
	box-shadow: 2px 3px 2px 0px var(--prim-color-1);

	xcolor: #fff;

	margin: 0 0 1.5em 35px;
	padding: 0;
	width: 500px;
}
fieldset.wide {
	width: 620px;
}
fieldset.submit {
	xtext-align: center;
	padding: 10px 0 10px 2em;
	position: relative;
	width: 468px;
}
legend {
	background: var(--prim-bgcolor-2);
	border: 1px solid var(--prim-bgcolor-2);
	border-radius: 8px;

	color: var(--prim-color-2);
	font-family: var(--koppen-font);
    font-size: 18px;
    font-weight: 700;	
    line-height: 24px;
	margin-left: 1em;
	padding: 0em 0.75em 0.2em;
	text-shadow: 1px 1px #000;
}
 /* Styles for buttons */
.button {
	border: 1px solid var(--prim-color-1);
	background-color: var(--prim-color-1);
	color: #fff;
	border-radius: 1px;
	box-shadow: 3px 3px 5px rgba(0, 66, 99, 0.51);	
	padding: 2px 5px;
	margin: 2px 2px 15px 0;
	text-align: left;
	padding-left: 30px;
}
.button:hover {
	background-color: var(--prim-bgcolor-1);
	color: #fff;
	text-decoration: none;
}
.button:disabled {
    background: #dddddd;
    color: #000000;
    opacity: .4;
}
fieldset ol.tekstvak {
	padding: 0.8em 1em 0 1em;
	list-style: none;
}
label.tekstvak, span.label {
	float: left;
	font-size: 10pt;
	width: 10em;
	margin-right: 1em;
	text-align: right;
}
fieldset input[type="text"] {
  border: 1px solid var(--select-border);
  border-radius: 0.3em;
  padding: 0.35em 0.5em;
  cursor: pointer;
  line-height: 1.1;

}


fieldset select {
  width: 100%;
  min-width: 15ch;
  max-width: 40ch;
  border: 1px solid var(--select-border);
  border-radius: 0.3em;
  padding: 0.25em 0.5em;
  cursor: pointer;
  line-height: 1.1;
  background-color: #fff;
  background-image: linear-gradient(to top, #f9f9f9, #fff 33%);
}

fieldset select#idItem_20008 {
	max-width: 30ch;
}

fieldset ._select5Item select,
fieldset ._select6Item select {
	margin-left: 10%;
	margin-bottom: 20px;
	max-width: 40ch;
}
fieldset  ol.radio, fieldset ol.radio0, fieldset ol.radio1, fieldset ol.radio2, 
fieldset ol.radio5, fieldset ol.radio6, fieldset ol.radio6x3 {
	padding: 0.5em 0 0 2.0em;
	list-style: none;
}
fieldset li {
	padding-bottom: 1em;
}
fieldset ol.radio0 {
	padding-top: 0.5em;
}
fieldset li {
	padding-bottom: 1em;
}
fieldset ol.radio li {
	display: block;
	float: left;
	width: 6em;
}
fieldset ol.radio1 li {
	display: block;
	float: left;
	width: 6.4em;
}
fieldset ol.radio1smal {
	margin-left: 9em;
}
fieldset ol.radio1smal li {
	display: block;
	float: left;
	width: 10em;
}

fieldset ol.radio2 li.selected {
	background: #d0faba;	
}

fieldset ol.radio5 {
/* Vanwege hangend inspringen bij de labels achter de radiostip */	
	padding-left: 50px;	
	text-indent: -18px;
}

fieldset .radio6 img {
	float: left;
	padding: 1px 10px 2px 50px;
}

fieldset .radio6x3 img {
	float: left;
    padding: 1px 25px 2px 2px;
}
fieldset ol.radio6x3 em.klein3 {
	padding-left: 22px;
	text-indent: -22px;
	font-size: 10pt;
}
fieldset ol.radio6x3 li {
	clear: left;
	margin-bottom: 20px;
}
fieldset ol.radio6x3 li > div {
	width: 90%;
	padding-top: 7px;
}

.verwerkAanmelding ol {
	margin-left: 2em;
}
div.checkbox1 {
/* Vanwege hangend inspringen bij de labels achter de checkbox */	
	padding-left: 33px;	
	text-indent: -33px;
}
.verwerkAanmelding div.checkbox1 {
/* Vanwege hangend inspringen bij de labels achter de checkbox */	
	padding-left: 33px;	
	text-indent: -24px;	
}
label.checkboxlabel {
	padding-left: 15px;	
}

textarea {
	font-size: 9pt;
	line-height: normal;
	margin-bottom: 13px;
	padding: 5px 9px;
	width: 30em;
}
fieldset textarea {
	margin-left: 2em;
}
p.textarea1Item {
	margin-left: 4em;
}
fieldset input[type="file"] {
	margin-left: 2em;
	margin-bottom: 2em;
}
input.verplichtspecial {
	text-align: center;
}
.index .error {
	border-left: solid 20px red;
}
.index span.error {
	border-left: 0px;
	color: red;
	font-weight: bold;
	font-size: 8pt;
	margin-left: 2.1em;
}
.authenticate .error {
	color: red;
	font-weight: bold;
}
.clear {
	clear:both;
}
#introducee-data-list td {
	color: var(--prim-color-1);
}

/* Stijlcodes voor Inlog Pagina */
.authenticate .textbox-icon-left {
	position: absolute;
	padding-left: 17px;
	padding-top: 12px;
	pointer-events: none;
}
.authenticate .inputfield {
	font-weight: bold;
    padding: 5px 0;
	position: relative;
	width: 400px;
}
.authenticate p.inputfield {
	margin-left: 2em;
}
.index p.inputfield {
	margin-left: 2em;
}
.authenticate p.inputfield {
	margin-left: 2em;
}
.authenticate .inputfield input {
	font-size: 12pt;
	font-weight: bold;
	width: 350px;
	border-radius: 4px;
	border: 1px solid #ccc;
}
.authenticate .inputfield input {
	background-color: #eaeaf3;
	height: 20px;
	padding: 8px 20px 8px 60px;	
}
.index .inputfield input {
	background-color: #FDEFEF;
	height: 15px;
	padding: 5px 20px 5px 25px;	
}
.index input.userInput {
	xfont-size: 12pt;
	font-weight: bold;
}
.authenticate .inputfield input:focus, .index .inputfield input:focus {
	border-color: #304d9e;
	-webkit-box-shadow: inset 0 1px 1px #231f20, 0 0 8px #231f20;
	box-shadow: inset 0 1px 1px #231f20, 0 0 8px #231f20;
}
.authenticate .submitfield {
	font-size: 12pt;
	margin-top:10px;
	position: relative;
}
.authenticate .fa {
	color: #231f20;
}
.authenticate .submitfield .fa-unlock-alt,  .authenticate .submitfield .fa-arrow-circle-left {
	position: absolute;
	left: 38px;
	top: 1px;
}
.authenticate .submitfield .fa-info-circle {
	position: absolute;
	right: 38px;
	top: 1px;
}
.authenticate input.button {
	
	border: 2px solid #fff;
    border-radius: 4px;
	width: 282px;
}
/* Vanwege iPhone bug */
.authenticate form input#btnSubmitnld {
   -webkit-appearance:none;  
   -webkit-border-radius:0px;
    text-align: left;
    padding-left: 60px;
}

/* Stijlcodes voor speciale onderdelen */
/* Busvervoer */
 ._Item_201 ol,
 ._Item_301 ol {
	margin-left: 0;
	margin-bottom: 20px;
}
  ._Item_201 input[type="radio"]:checked ~ *,
  ._Item_301 input[type="radio"]:checked ~ * {
	background: var(--prim-bgcolor-1);
	font-weight: bold;
}
 ._Item_201 ol.radio2,
 ._Item_201 p label,
 ._Item_301 ol.radio2,
 ._Item_301 p label {
	display: table;
}
 ._Item_201 ol.radio2 li,
 ._Item_301 ol.radio2 li {
	display: table-row;
	padding-bottom: 3px;
}
 ._Item_201 ol.radio2 li span,
 ._Item_201 p span,
 ._Item_301 ol.radio2 li span,
 ._Item_301 p span {
	display: table-cell;
} 
.busvervoer-plaats {
	display: inline-block;
	padding-left: 7px;
	width: 7em;
}
.busvervoer-plaats strong {
	padding-left: 16px;
}	
.busvervoer-tijd {
	display: inline-block;
	width: 5.5em;
}
.busvervoer-tijd strong {
	padding-left: 16px;
}	
.busvervoer-adres {
	display: inline-block;
	width: 14em;
}
 .busvervoer-adres strong {
	padding-left: 16px;
}




/* Stijlcodes voor Admin Page */
.divTblFreq {
/* For IE10 */
	display: -ms-flexbox;
	-ms-flex-align: start;
	-ms-flex-wrap: wrap;
/* Other browsers */
	display: flex;
	flex-flow: row wrap;

	margin: 50px 10px 50px 20px; 
}
.divTblFreq .tblFreq {
	break-inside: avoid-column;
	-webkit-column-break-inside: avoid;
}
.tblFreq {
	margin: 0 10px 40px 0;
}
.tblFreq table {
	min-width: 200px;
}
.tblFreq th {
	text-align: left;
	background-color: inherit;
	border-top: 1px solid var(--prim-color-2);
	color:	inherit;
	vertical-align: top;
}
.tblFreq caption {
	color: var(--prim-bgcolor-1);
    font-family: "CalibriWeb",calibri,Verdana,Helvetica,Arial,sans-serif;
    font-size: 14pt;
    font-weight: bold;
}
ol.menu {
	clear:left;
	list-style:none;
	padding: 3px 0;
	margin-bottom: 20px;
}
.config .menu {
	margin-bottom: 50px;
}
ol.menu li {
	background: var(--prim-bgcolor-1);
	display: block;
	float: left;
	list-style: none;
	padding: 2px 12px;
}
ol.menu li a {
	color: #FFF;
}
#divTabelStatistieken {
	clear:both;
	margin: 20px 0px 40px;
	padding-top:20px;
}
.divTabel {
	clear:both;
	margin: 20px 20px 40px 0;
	padding-top:20px;
	overflow: auto;
}
div.StatTabel {
	margin-top: 25px;
	padding-top: 35px;
	border-top: 2px solid var(--prim-bgcolor-1);
}
table {
	background: rgba(240,236,234,.95);
	border: 1px solid var(--prim-color-2);}
table.wide {	
	width: 479px;
}
.tabeltype1 tr:nth-child(even) {
	background:#fafafa;	
}
.tabeltype1 tr:nth-child(even) td {
	xborder: 1px solid transparent;
}

thead {
    background-color:var(--prim-bgcolor-2);
    color:#fff;
    font-size: 9pt;
    font-weight: bold;
    cursor: default;
}
th {
	background: var(--prim-bgcolor-2);
	color:#FFF;
	padding: 4px 5px 1px 3px;
	text-align: left;
	vertical-align: top;
}
th.mover {
    background-color:#fff;
    color:#029ddf;		
}
tr.odd {
	background:#eee;
}
tr.even {
	background:#ccc;
}
td {
	border-top: 1px solid var(--prim-color-2);
	padding: 4px 5px 2px 5px;
	vertical-align: top;	
}
.admin #divTabel th {
	min-width: 125px;
}

.authenticate td {
	border: none;	
}
td.statistiek {
	padding-left:30px;
	text-align: right;
}
.left {
	text-align: left;
}
.center, .text_center {
	text-align: center;
}
.right {
	text-align: right;
}
.tick {background: url('../images/icons/tick.gif') no-repeat center center;}
.over-inline {
	background-color: #FFFACD;	
}
.editable-punten {
	text-align: center;
}

/* Styles for table in config.tpl */
.w25  {width: 25px; text-align: left;}
.w50  {width: 50px; text-align: left;}
.w75  {width: 75px; text-align: left;}
.w100 {width:100px; text-align: left;}
.w125 {width:125px; text-align: left;}
.w150 {width:150px; text-align: left;}
.w200 {width:200px; text-align: left;}
.w300 {width:300px; text-align: left;}
.w350 {width:350px; text-align: left;}
.w400 {width:400px; text-align: left;}
.w500 {width:500px; text-align: left;}

/* STYLES FOR KOALA BUILDER */
.editItem ol {
	list-style: none;
}


/*  STYLES SPECIAL FOR THIS SITE  */



/* Foto's in de rechtermarge */

	.foto-sidebar {
		display: none;
		position: absolute;
		top: 150px;
		right: 4%;
		width: calc(50% - 400px);
		max-width: 250px;
	}
	.side-foto-element {
	}
	.foto-sidebar img.foto {
		border: 3px solid #fff;
		border-bottom: 3px solid #fff;
		-webkit-box-shadow: 2px 2px 2px #777;
		-moz-box-shadow: 2px 2px 2px #777;
		box-shadow: 2px 2px 2px #777;
		float: left;
		margin: 10px 0;
		max-width: 95%;
	}
	.foto-sidebar img.foto:hover {
	    border-bottom-right-radius: 50% 20px;
	    box-shadow: 5px 10px 15px rgba(0, 0, 0, 0.25);
	    z-index: 10;	
	}

	@media screen and (min-width: 950px) and (max-width: 1300px) {
		.foto-sidebar {	
			display: block;
			right: calc(50% - 400px);
		}
	}

	@media screen and (min-width: 1500px) {
		.foto-sidebar {	
			display: block;
			right: calc(50% - 740px);
		}
	}

/*  STYLES FOR JQUERY FEATURES */
.over-inline {
  background-color: #FFFACD;
}

body .active-inline {
  background-color: inherit;
}
.ui-autocomplete-loading { 
	background: lemonchiffon url('images/ui-anim_basic_16x16.gif') right center no-repeat; }
.ui-widget { 
	font-size: 1em;
}
.ui-widget-header {
	background-color: var(--prim-bgcolor-1);
	background-image: none;
}

.ui-tabs .ui-tabs-panel {
	border: 2px solid var(--prim-bgcolor-1);
	border-top: 0px;
}	

.ui-widget {
	font-size: 1em important!;
}

p#vtip { 
	display: none; 
	position: absolute; 
	padding: 10px; left: 5px; 
	font-size: 0.9em; 
	background-color: white; 
	border: 1px solid #a6c9e2; 
	border-radius: 5px;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
	width: 300px;
	z-index: 9999 
}
p#vtip #vtipArrow { 
	position: absolute; 
	top: -10px; 
	left: 5px 
}

#mainNavTabs {text-align: center;}

#mainNavTabs li {
    float: none !important;
    display: inline-block;
    margin-bottom: -3px;
}    


.tblFreq span {
	display: inline-block;
	padding: 0 3px;
}



#footer {
    padding: 30px 0;
    width: 100%;
    height: auto;
    color: #fff;
    xtext-align: center;
    position: relative;
    text-shadow: 0 1px 3px rgba(0,0,0,0.25);
}
#footer ul {
	margin: 0;
}
#footer ul li {
    padding-left: 0;
    display: inline-block;
    margin: 0 2%
}
#footer ul a {
    color: var(--prim-bgcolor-1);
    display: inline-block;
    width: 50px;
    height: 50px;
    text-shadow: none;
    text-decoration: none;
}    
#footer ul a:before,
#footer ul a .before {
    display: block;
    width: inherit;
    height: inherit;
    line-height: 51px;
    font-size: 20px;
    background: #bcbcbc;
    color: #fff;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    text-align: center;
}
#footer ul a:hover:before,
#footer ul a:hover .before {
    background: #fff;
    color: var(--prim-bgcolor-1);
}
#footer ul a span {
    display: none;
}


/* Voor de count-down */

.count-down {
	display: flex;
}
ul.count-down {
	margin: 0;
}

#divHong {
    position: fixed;
    right: 6%;
    top:0;
}
/* Speciaal voor dit project */

#logo_klant {
    top: 0;
    right: 0;
    position: fixed;
}


A.button, INPUT.button, INPUT.formButton, button {
    display: inline-block;
    border: none;
    cursor: pointer;
    background-color: var(--prim-color-1);
    color: #fff;
    min-height: 27px;
    margin-bottom: 1px;
    padding: 7px 20px 4px;
    font-weight: bold;
    font-size: 16px;
    line-height: 20px;
    border-radius: 3px;
    transition: all .3s ease;
}

input[type="submit"] {
    height: 40px;
    font-size: 15px;
    line-height: 22px;
    min-height: 0;
    padding-top: 6px;
    padding-bottom: 4px;
    min-width: 200px;
}
.xauthenticate input[type="submit"] {
	background-color: inherit;
	border: 2px solid #fff;
	color: #fff;
}
.icon-button-arrow {
    font-family: 'icomoon'!important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
}    
.icon-button-arrow:before {
    content: "\e909";
}
 i.icon-button-arrow {
    font-size: 18px;
    line-height: 18px;
    width: 18px;
    position: absolute;
    top: 50%;
    left: 200px;
    margin-top: -9px;
    opacity: 0;
    -ms-filter: "alpha(opacity=0)";
    transition: all .45s cubic-bezier(0.25,1,0.33,1);
    -webkit-transition: all .45s cubic-bezier(0.25,1,0.33,1);
}
.authenticate .submitfield:hover i.icon-button-arrow {
	left: 250px;
	opacity: 1;
}
.index .submit i.icon-button-arrow {
	left: 120px;
}
.index .submit:hover i.icon-button-arrow {
	left: 200px;
	opacity: 1;
}
.authenticate .button:hover {
	background-color: var(--prim-bgcolor-1);
	border: 1px solid var(--prim-bgcolor-1);
	color: #fff;

}

#divWelkomstekst .nectar-fancy-ul ul {
	list-style: none;
	margin-left: 0;
	margin-top: 20px;
    padding-left: 105px; /* hangend inspringen */
    text-indent: -105px;
}
#divWelkomstekst .nectar-fancy-ul ul li {
	margin-bottom: 5px;
}
#divWelkomstekst .nectar-fancy-ul ul li .icon-default-style[class^="icon-"] {
	color: var(--prim-bgcolor-1);
    line-height: 30px!important;
    padding-right: 20px;
}


.logo-footer {
	bottom:-100px;
}
.config .logo-header, .aanmeldingen .logo-header,
.config .logo-footer, .aanmeldingen .logo-footer {
	position: relative;
}
.config .logo-footer {
	top:0;
}

.vc_column-inner {
	display: none;
}


/* Adaptions for Mobile */
@media only screen and (max-width : 1050px)  {

.authenticate body, .index body, .verwerkAanmelding body{
	background: inherit;
}

#divHong, #vmi-history-images {
	display: none;
}

.authenticate #wrapper {

	margin: 0;
	padding: 0 20px;
	width: inherit;
}
.index #wrapper, .verwerkAanmelding #wrapper {

	margin: 0;
	width: inherit;
	padding: 0 0px 20px;

}
#divMain {
	xmargin-top: 200px;
}

}