/**************************************************************************** 
 * teqa.css (used instead of default main.css, including bootstrap overrides)
 ***************************************************************************/

/* Bootstrap 3 zet html op 62.5% (=10px); zet de root terug op 16px zodat
   rem-gebaseerde widgets (o.a. de ires-chat-widget) op ware grootte renderen */
html {
	font-size:16px;
	}
body {
	background-color:#f4f4f4;
	}
	header {
		background-color:#ffffff;
		border-bottom:1px solid #e7e7e7;
		}
	
/*------------------------------
	    NAVIGATION
------------------------------*/ 
header .navbar {
	min-height:70px;
	margin-bottom:0;
	}
	header .navbar-default {
		box-shadow:none;		
		background-image:none;
		background-color:#ffffff;
		border-width:0!important;
		}
		
	/* START change Navbar Collapse Breakpoint */
		@media (min-width: 768px) and (max-width: 991px) {
			header .navbar-header {
				float: none;
				margin-left:-15px!important;
				margin-right:-15px!important;
				}
			header .navbar-brand {
				margin-left:0!important;
				}
			header .navbar-toggle {
				display: block;
			}
			header .navbar-collapse {
				border-top: 1px solid #e7e7e7!important;
				box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
				padding-left:0!important;
				padding-right:0!important;
				margin-left:0!important;
				margin-right:0px!important;
				max-height:none!important;
				height:auto!important;
				overflow-x:visible!important;
			}
			header .navbar-collapse.collapse {
				display: none!important;
			}
			header .navbar-nav {
				float: right!important;
				margin: 7.5px -15px;
			}
			header .navbar-nav li {
				float: left;
				}
				header .navbar-nav li.dropdown li {
					float:none;
					}
			/* since 3.1.0 */
			header .navbar-collapse.collapsing,
			header .navbar-collapse.collapse.in { 
				display: block!important;
			}
			header .collapsing {
				overflow: hidden!important;
			}
		}
		/* END change Navbar Collapse Breakpoint */	
		
	header .navbar-brand {
		padding:5px 15px;
		height:70px;
		}
	header .navbar-nav li {
		margin:0;
		white-space:nowrap;
		}
		.navbar-nav.navbar-right:last-child {
			margin-right:0;
			}
		header .navbar-nav li.dropdown-header {
			text-transform:uppercase;
			}
	header .navbar-nav li a {
		padding:7px 8px;
		margin-top:20px;
		margin-bottom:20px;
		border-radius:5px;
		margin-right:5px;
		}
		@media (min-width:768px) and (max-width:1199px){
			header .navbar-nav li a {
				padding:6px 9px;
				}
		}
		/* solution for common bootstrap problem 'any parent element in menu cannot link to content': see _func.php line 156 */
		/* necessary custom styling for this solution																		 */
		header .navbar-nav li.parentlink a {
			margin-right: 0px; 
			border-radius: 5px 0px 0px 5px;
			padding-right:4px;
			}
		header .navbar-nav li.dropdown_showchildren a {
			border-radius: 0 5px 5px 0;
			border-left:1px solid rgba(255,255,255,0.5)!important;
			}
		.navbar-default .navbar-nav > li > a:hover,
		.navbar-default .navbar-nav > li > a:focus,
		.navbar-default .navbar-nav > li.open > a, 
		.navbar-default .navbar-nav > li.open > a:focus, 
		.navbar-default .navbar-nav > li.open > a:hover {
			background-color:transparent;
			color:#67b516;
			}
		/*** last child of mainmenu is FREE TRIAL, this menu-button differs in color-setting ***/
		header .navbar-nav li:last-child a {
			background-color:#67b516;
			color:#ffffff;
			margin-right:0;
			}			
			.navbar-default .navbar-nav > li:last-child > a:hover,
			.navbar-default .navbar-nav > li:last-child > a:focus,
			header .collapse.in .navbar-nav li:last-child a:hover,
			header .collapse.in .navbar-nav li:last-child a:focus {
				background-color:#529011;
				color:#ffffff;
				}
			/* no different color for last-child in dropdown */
			header .dropdown-menu li:last-child a {
				background-color:transparent;
				color:#333333;
				}
				header .navbar-nav .dropdown-menu li:last-child a:hover,
				header .navbar-nav .dropdown-menu li:last-child a:focus {
					background-color:#f5f5f5;
					color:#262626;			
					}
					header .navbar-nav .dropdown-menu li.active:last-child a,
					header .navbar-nav .dropdown-menu li.active:last-child a:hover,
					header .navbar-nav .dropdown-menu li.active:last-child a:focus {
						background-color:#ffffff;
						color:#67b516;
						}
				
		header .navbar-nav > li > .dropdown-menu { 
			border-radius:4px;
			margin-top:-18px;
			}
		header .dropdown-menu li a {
			padding: 3px 20px;
			margin:0;
			border-radius:0!important;
			}
	/* active menu item color settings*/	
	.navbar-default .navbar-nav > .active > a,
	.navbar-default .navbar-nav > .active.open > a {
		background-color:#e7e7e7;
		color:#333333;
		}
		.navbar-default .navbar-nav > .active > a:hover,
		.navbar-default .navbar-nav > .active > a:focus,
		.navbar-default .navbar-nav > .active.open > a:hover,
		.navbar-default .navbar-nav > .active.open > a:focus {
			background-color:#999999;
			color:#ffffff;
			}
		.dropdown-menu > .active > a,
		.dropdown-menu > .active > a:hover, 
		.dropdown-menu > .active > a:focus {
			background-color:#ffffff;
			color:#67b516;
			}
				
/*** START setting for collapsed menu - default for XS devices + custom for this site for SM devices ***/
	/* toggle button */
	.navbar-default .navbar-toggle {
		border:0;
		padding:0;
		border-radius:0;
		margin:23px 15px 0;
		font-size:28px;
		color:#555555;
		}
		.navbar-default .navbar-toggle:hover,
		.navbar-default .navbar-toggle:focus {
			background-color:transparent;
			}
		.navbar-default .navbar-toggle .icon-bar {
			background-color:#555555;
			height:5px;
			width:30px;
			}
			.navbar-default .navbar-toggle:hover .icon-bar,
			.navbar-default .navbar-toggle:focus .icon-bar {
				background-color:#67b516;
				}
				
	/*header .navbar-collapse.collapsing,
	header .navbar-collapse.collapse.in {
		height:auto;
		overflow-y:visible;
		}*/
	header .navbar-collaps .navbar-nav {
		background-color:#ffffff;
		margin-top:0;
		margin-bottom:0;
		border-bottom:1px solid #e7e7e7;
		}
		@media (min-width: 768px) and (max-width: 991px) {
			header .navbar-collapse .navbar-nav {
				border-bottom:0 none;
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
				}
				header .navbar-collapse .navbar-nav li:last-child a {
					margin-top: 0!important;
					}
				header .navbar-collapse .navbar-nav.navbar-right .dropdown_showchildren .dropdown-menu.dropdown-menu-right {
					right: -70px;
					}
		}
	
	/* START XS ONLY SETTINGS */
	@media (max-width:767px) {		
		header .collapse.in .navbar-nav li a {
			padding:10px 15px;
			margin:0;
			border-radius:0;
			color:#777777;
			}			
			header .collapse.in .navbar-nav li a:hover,
			header .collapse.in .navbar-nav li a:focus {
				color:#353535;
				background-color:#e7e7e7;
				}
		/* custom css for common bootstrap problem 'any parent element in menu cannot link to content' */
		header .collapse.in .navbar-nav li.dropdown_showchildren {
			margin-top:-40px;
			margin-left:95px; /*set margin-left so arrow is displayed at the right side to the text of the parentlink*/
			width:45px;
			}
			header .collapse.in .navbar-nav li.dropdown_showchildren a {
				border-right:1px solid rgba(255,255,255,0.5);
				}
		
		/* active menu item color settings*/	
		.navbar-default .collapse.in .navbar-nav > .active > a,
		.navbar-default .collapse.in .navbar-nav > .active > a:hover,
		.navbar-default .collapse.in .navbar-nav > .active > a:focus {
			background-color:#fff;
			color:#67b516;
			}
		/* for .collapse.in navbar-right we need the default margin-right of -15px*/
			.collapse.in .navbar-nav.navbar-right:last-child {
				margin-right:-15px;
				}

		/* dropdown */
		.collapse.in .navbar-nav .open {
			background-color:#ffffff;
			color:#555555;
			}
			.collapse.in .navbar-nav .open .dropdown-menu {
				background-color:#ffffff;
				padding:0;
				margin-left:-95px; /* same margin as 'header .collapse.in .navbar-nav li.dropdown_showchildren' but negative value */
				}
				.navbar-default .collapse.in .navbar-nav .open .dropdown-menu > li > a,
				.navbar-default .collapse.in .navbar-nav .open .dropdown-menu > li:last-child > a {
					color:#999999;
					font-size:90%;
					padding-left:25px;
					margin-top:0;
					margin-left:0;
					background-color:#ffffff;
					border-radius:0;
					}
					.navbar-default .collapse.in .navbar-nav .open .dropdown-menu > li > a:hover,
					.navbar-default .collapse.in .navbar-nav .open .dropdown-menu > li > a:focus,
					.navbar-default .collapse.in .navbar-nav .open .dropdown-menu > li:last-child > a:hover,
					.navbar-default .collapse.in .navbar-nav .open .dropdown-menu > li:last-child > a:focus{
						color:#555555;
						background-color:#ffffff;
						}
					/* dropdown active */
					.navbar-default .collapse.in  .navbar-nav .open .dropdown-menu > .active > a,
					.navbar-default .collapse.in  .navbar-nav .open .dropdown-menu > .active > a:hover,
					.navbar-default .collapse.in  .navbar-nav .open .dropdown-menu > .active > a:focus,
					.navbar-default .collapse.in .navbar-nav .open .dropdown-menu > li.active:last-child > a {
						background-color:#ffffff;
						color:#67b516;
						}
					.navbar-default .collapse.in .navbar-nav .open .dropdown-menu .divider {
						margin-left:25px;
						}
		/* for .collapse.in navbar-right we need to set a fixed max-width for the free trial link so the button won't be full size*/
		/* also: less margin-top and add margin-bottom + margin-left and less padding */
		header .collapse.in .navbar-nav li:last-child a {
			max-width:155px;
			margin-top:3px;
			margin-bottom:5px;
			margin-left:15px;
			padding: 6px 12px;
			border-radius:4px;
			color:#ffffff;
			}
	}
	/* END XS ONLY SETTINGS */
	
	/* START SM ONLY SETTINGS */
	@media (min-width: 768px) {
		header .collapse.in .navbar-nav li a {
			padding:6px 9px;
			margin-top:20px;
			margin-bottom:20px;
			border-radius:5px;
			margin-right:5px;
			}
			/* solution for common bootstrap problem 'any parent element in menu cannot link to content': see _func.php line 156 */
			/* necessary custom styling for this solution																		 */
			header .collapse.in .navbar-nav li.parentlink a {
				margin-right: 0px; 
				border-radius: 5px 0px 0px 5px;
				padding-right:4px;
				}
			header .collapse.in .navbar-nav li.dropdown_showchildren a {
				border-radius: 0 5px 5px 0;
				border-left:1px solid rgba(255,255,255,0.5)!important;
				}
			.navbar-default .collapse.in .navbar-nav > li > a:hover,
			.navbar-default .collapse.in .navbar-nav > li > a:focus,
			.navbar-default .collapse.in .navbar-nav > li.open > a, 
			.navbar-default .collapse.in .navbar-nav > li.open > a:focus, 
			.navbar-default .collapse.in .navbar-nav > li.open > a:hover {
				background-color:transparent;
				color:#67b516;
				}
			/*** last child of mainmenu is FREE TRIAL, this menu-button differs in color-setting ***/
			header .collapse.in .navbar-nav li:last-child a {
				background-color:#67b516;
				color:#ffffff;
				margin-right:0;
				}			
				.navbar-default .collapse.in .navbar-nav > li:last-child > a:hover,
				.navbar-default .collapse.in .navbar-nav > li:last-child > a:focus,
				header .collapse.in .navbar-nav li:last-child a:hover,
				header .collapse.in .navbar-nav li:last-child a:focus {
					background-color:#529011;
					color:#ffffff;
					}
				/* no different color for last-child in dropdown */
				header .collapse.in .dropdown-menu li:last-child a {
					background-color:transparent;
					color:#333333;
					}
					header .collapse.in .navbar-nav .dropdown-menu li:last-child a:hover,
					header .collapse.in .navbar-nav .dropdown-menu li:last-child a:focus {
						background-color:#f5f5f5;
						color:#262626;			
						}
						header .collapse.in .navbar-nav .dropdown-menu li.active:last-child a,
						header .collapse.in .navbar-nav .dropdown-menu li.active:last-child a:hover,
						header .collapse.in .navbar-nav .dropdown-menu li.active:last-child a:focus {
							background-color:#ffffff;
							color:#67b516;
							}
							
			header .collapse.in .navbar-nav > li > .dropdown-menu { 
				border-radius:4px;
				margin-top:-18px;
				}
			header .collapse.in .dropdown-menu li a {
				padding: 3px 20px;
				margin:0;
				border-radius:0;
				}
		/* active menu item color settings*/	
		.navbar-default .collapse.in .navbar-nav > .active > a,
		.navbar-default .collapse.in .navbar-nav > .active.open > a {
			background-color:#e7e7e7;
			color:#333333;
			}
			.navbar-default .collapse.in .navbar-nav > .active > a:hover,
			.navbar-default .collapse.in .navbar-nav > .active > a:focus,
			.navbar-default .collapse.in .navbar-nav > .active.open > a:hover,
			.navbar-default .collapse.in .navbar-nav > .active.open > a:focus {
				background-color:#999999;
				color:#ffffff;
				}
			.navbar-default .collapse.in .navbar-nav .dropdown-menu > .active > a,
			.navbar-default .collapse.in .navbar-nav .dropdown-menu > .active > a:hover, 
			.navbar-default .collapse.in .navbar-nav .dropdown-menu > .active > a:focus {
				background-color:#ffffff;
				color:#67b516;
				}	
	}
	/* END SM ONLY SETTINGS */
/*** END setting for collapsed menu **/
	
/*------------------------------
	    BREADCRUMB
------------------------------*/
#breadcrumb {
	background-color:#fafafa;
	}
	#landing-page #breadcrumb,
	#articles-main #breadcrumb,
	#articles-all #breadcrumb,
	#articles-category #breadcrumb,
	#articles-page #breadcrumb,
	#search-page #breadcrumb,
	#integration-all #breadcrumb,
	#integration-category #breadcrumb,
	#integration-page #breadcrumb,
	#integration-search-page #breadcrumb {
	background-color:#fff;
	}
	.breadcrumb	{
		font-size:12px;
		background-color:transparent;
		color:#a8a8a8;
		padding-left:0;
		padding-right:0;
		margin-bottom:0;
		}
		.breadcrumb a,
		.breadcrumb a:link,
		.breadcrumb a:visited{
			color:#a8a8a8;
			}
			.breadcrumb a:hover{
				color:#67b516;
				text-decoration:none;
				}
			.breadcrumb li:last-child a {
				font-weight:bold;
				}

/*------------------------------
	    FOOTER
------------------------------*/			
#footer {
	background-color:#f4f4f4;
	padding:30px 0 15px;	
	color:#555555;
	}
	#footer .well {
		background-color:transparent;
		border:0 none;
		box-shadow:none;
		padding:0;
		border-radius: 0;
		}
		#footer .well a {
			color:#1667b5;
			}
			#footer .well a:hover,
			#footer .well a:focus {
				color:#0f487e;
				}
		#footer .well a.phone,
		#footer .well a.phone:link {
			color: #555555;
			}
			#footer .well a.phone:hover,
			#footer .well a.phone:focus {
				color:#67b516;
				}
	@media (max-width:767px) {
			#footer .well {
				padding-top:10px;
				border-top:1px solid #dadada;
				}
				#footer .row div:first-child .well {
				padding-top:0;
				border-top:0 none #dadada;
				}
		}
		#footer .well h4 {
			color:#1667b5;
			}
		#footer .well hr { /* just used for nice spacing, same color as background-color footer */
			margin-top:5px;
			margin-bottom:5px;
			border-style:dashed;
			border-color:#f4f4f4;
			}
		#footer .list-inline > li {
			padding-right:0;
			}
		#footer .well .follow-us {
			margin-top:22px;
			}
			#footer .well .follow-us .social {
				display:inline-block;
				margin-right:5px;
				}
				#footer .well .follow-us .social a {
					color:#777777;
					}
					#footer .well .follow-us  .social a:hover,
					#footer .well .follow-us  .social a:focus{
						color:#67b516;
						}
			/*custom blog icon*/
			#footer .well .follow-us .social.i-reserve-blog a {
				background-color:#777777;
				height: 36px;
				display: inline-block;
				width: 36px;
				top: -11px;
				position: relative;
				border-radius: 7px;
				color:#777777;
				}
				#footer .well .follow-us .social.i-reserve-blog a:hover,
				#footer .well .follow-us .social.i-reserve-blog a:focus {
					background-color:#67b516;
					color:#67b516;
					}
				
			#footer .well .follow-us .social.i-reserve-blog a .fa-stack-2x {
				font-size: 30px;
				top: 2px;
				color: #EAEAEA!important;
				}
			#footer .well .follow-us .social.i-reserve-blog a .fa-stack-1x {
				font-size: 17px;
				top:-1px;
				font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
				font-weight: bold;
				}
			/* Certificeringen */
			@media only screen and (min-width:768px) and (max-width:991px) {
				.modal-footer .footer_content .certificates {
					margin-top:30px;
					}
			}
			#footer .certificeringen a.certificate {
				display:table-cell;
				height:100px;
				vertical-align:middle;
				padding-right:10px;
				padding-bottom:10px;
				}
				#footer .certificeringen a.moreInfo {
				display:block;
				margin-top:10px;
				margin-bottom:20px;
				color:#555;
				}
				#footer .certificeringen a.moreInfo:hover {
					color:#67b516;
					}
			/* last footer block is full width with a different styling */
			#footer .fullWidth .well {
				padding: 15px;
				border-left: 5px solid #67b516;
				border-radius: 0;
				margin: 10px 0;
				background-color: rgba(0,0,0,0.075);
				}
				#footer .fullWidth .well h4 {
					font-size:20px;
					color:#000;
					}
				#footer .fullWidth .well p {
					color:#333;
					}
				#footer .fullWidth .well a {
					color:#67b516;
					}
	#footer .newsletterform-subscribtion {
		margin-bottom:8px;
		}
		#footer .newsletterform-subscribtion .mhp {
			display: none;
			}
	#footer .footer-bottom {
		/*border-top:1px solid #dadada;
		margin:10px 0 0;
		padding:15px 0 0;*/
		font-size:13px;
		color:#777777;
		}
		#footer .footer-bottom .footermenu li {
			border-right:1px solid #aaaaaa;
			padding-right:5px;
			}
			#footer .footer-bottom .footermenu li:last-child {
				border-right:0 none;
				padding-right:0;
				}
		#footer .footer-bottom .footermenu li a,
		#footer .footer-bottom .footermenu li a:link {
			color: #777777;
			}
			#footer .footer-bottom .footermenu li a:hover,
			#footer .footer-bottom .footermenu li a:focus {
				color:#1667b5;
				}
		#footer .footer-bottom .copyright.text-muted {
			text-align:right;
			}
			@media only screen and (max-width: 320px) {
				#footer .footer-bottom .copyright.text-muted {
					text-align:left;					
					}
			}
			

/*------------------------------
	    ADMIN BAR
------------------------------*/			
#footer-admin {
	background-color:transparent;
	padding: 10px 0 0;
	}
	#footer-admin .list-inline li:last-child {
		padding-right:0;
		}
		
/*------------------------------
	    BUTTONS
------------------------------*/
.btn-primary {
	background-color:#67b516;
	border-color:#67b516;
	color:#ffffff!important;
	}
	.btn-primary:hover,
	.btn-primary:focus {
		background-color:#529011;
		border-color:#529011;
		color:#ffffff!important;
		}
.btn-default {
    color: #555555!important;
    background-color: #ffffff;
    border-color: #cccccc;
	}
	.btn-default:hover,
	.btn-default:focus {
		color:#555555!important;
		background-color:#e6e6e6;
		border-color:#adadad
		}
.btn-black {
	background-color:#000000;
	border-color:#000000;
	color:#ffffff!important;
	}
	.btn-black:hover,
	.btn-black:focus {
		background-color:#67b516;
		border-color:#67b516;
		color:#ffffff!important;
		}
.btn-my-ires { /* used for My i-Reserve button in breadcrumb section */
	background-color:#fafafa;
	border-color:#fafafa;
	color:#999999!important;
	padding:6px;
	border-radius:0;
	}
	.btn-my-ires:hover,
	.btn-my-ires:focus {
		background-color:#777777;
		border-color:#777777;
		color:#ffffff!important;
		}
		#breadcrumb .btn-my-ires {
			margin-top:0;
			}
		@media only screen and (max-width: 767px) {
			#breadcrumb .btn-my-ires {
				margin-bottom:5px;
				}
		}
.btn-grey {
	background-color:#777777;
	border-color:#777777;
	color:#ffffff!important;
	}
	.btn-grey:hover,
	.btn-grey:focus {
		background-color:#67b516;
		border-color:#67b516;
		color:#ffffff!important;
		}
.btn-light-grey {
	background-color:transparent;
	border-color:#999;
	color:#999!important;
	}
	.btn-light-grey:hover,
	.btn-light-grey:focus {
		background-color:#999;
		border-color:#999;
		color:#333!important;
		}
.btn-white {
	background-color:transparent;
	border-color:#ffffff;
	color:#ffffff!important;
	}
	.btn-white:hover,
	.btn-white:focus {
		background-color:#ffffff;
		border-color:#ffffff;
		color:#1667b5!important;
		}
		/* on home-page + landing-page section contact, the hover color is green */
		#home-page .btn-white:hover,
		#home-page .btn-white:focus,
		#landing-page #section-contact .btn-white:hover,
		#landing-page #section-contact .btn-white:focus {
			color:#67b516!important;
			}	
	/*little adjustment for white buttons inside the header, improved readability */
	header .btn-white {
		background-color:rgba(0,0,0,0.3);
		}
		header .btn-white:hover,
		header .btn-white:focus {
			background-color:#ffffff;
			}
.btn-solid-white {
	background-color:#ffffff;
	border-color:#67b516 ;
	color:#67b516!important;
	padding: 8px 16px;
	}
	.btn-solid-white:hover,
	.btn-solid-white:focus {
		background-color:#ffffff;
		border-color:#ffffff;
		color:#67b516!important;
		}
.btn-pricing,
.btn-pricing:focus { /* used for modal Pricing Available Modules on Pricing Page */
	background-color:rgba(0,0,0,0.35);
	border-color:rgba(0,0,0,0.1);
	color:#ffffff!important;
	margin-top:5px;
	margin-bottom:0!important;
	}
	.btn-pricing:hover {
		background-color:#67b516;
		border-color:#67b516;
		color:#ffffff!important;
		}
.btn-functions,
.btn-functions:focus { /* used for modal Functionalities Module on Modules Page */
	background-color:#529011;
	border-color:#529011;
	color:#ffffff!important;
	}
	.btn-functions:hover {
		background-color:#ffffff;
		border-color:#ffffff;
		color:#67b516!important;
		}
.btn-xl {/* use with btn-lg */
	font-size:25px;
	}
/* CTA button with special hover effect, f.e. used in de Home intro section  */
/* based on: https://www.sliderrevolution.com/resources/css-button-hover-effects/ */
#home-page .ctaButtons {
	margin-top:50px;
	}
	@media screen and (max-width:767px) {
		#home-page .ctaButtons {
			margin-top:20px;
			}
			#home-page .ctaButtons .btn-effect {
				margin-bottom:10px;
				}
	}
	#home-page .ctaButtons .btn-white-solid.btn-effect,
	#home-page .ctaButtons .btn-white-solid.btn-effect:hover {
		background-color:#ffffff;
		border-color:#ffffff;
		color:#67b516!important;	
		}
	#home-page .ctaButtons .btn-white.btn-effect,
	#home-page .ctaButtons .btn-white.btn-effect:hover {
		background-color:transparent;
		border-color:#ffffff;
		color:#ffffff!important;
		}
	.ctaDemo .btn-primary.btn-effect,
	.ctaDemo .btn-primary.btn-effect {
		background-color:#67b516;
		border-color:#67b516;
		color:#fff!important;
		padding:15px 30px;
		}
	.ctaButtons .btn-effect {
		text-transform:uppercase;
		position:relative;
		transition: all 0.2s linear 0s;
		padding:10px 20px;
		}
		.ctaButtons .btn-effect:hover {
			text-indent: -25px;
			}	
		.ctaButtons .btn-effect::before {
			content: "\f178";
			font-family: FontAwesome;
			font-size: 15px;
			position: absolute;
			display: flex;
			align-items: center;
			justify-content: center;
			right: 0;
			top: 0;
			opacity: 0;
			height: 100%;
			width: 40px;
			transition: all 0.2s linear 0s;
			}
			.ctaButtons .btn-effect:hover::before {
				opacity: 1;
				text-indent: 5px;
			}

/*------------------------------
	    COMMON
------------------------------*/
.page-header h1 {
	color:#67b516;
	}
	@media screen and (max-width:413px) {
		.page-header h1 {
			font-size:30px;
			}
	}
p, ul, ol {
	font-weight: 300;
	line-height: 180%;
	}
	header ul {
		font-weight:400;
		}
a,
a:link,
a:visited {
	color:#1667b5;
	text-decoration:none;
	}
	a:hover,
	a:focus {
	color:#67b516;
	text-decoration:none;
	}
a, 
a:focus, 
a:hover, 
button, 
button:focus, 
button:hover, 
button:active {
	outline:0 none;
	}
	
/* tooltip */
a.show_tooltip,
a.show_tooltip:link,
a.show_tooltip:hover,
a.show_tooltip:focus {
	color:#555;
	border-bottom:1px dotted #555;
	cursor:help;
	}

/* screenshot inside flat minimal MAC browser */
.browser-bar {
	padding: 0 .5rem;
	border: 1px solid #e5e9ec;
	text-align: left;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	box-shadow: 0 10px 20px rgba(0,0,0,0.025),0 30px 60px rgba(0,0,0,0.05);	
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
	}
	.browser-bar .circle {
		border-radius: 100%;
		display: inline-block;
		width: 8px;
		height: 8px;
		margin-right:4px;
		background-color: #e5e9ec;
	  	}
		.browser-bar .circle.bg-danger {
			background-color: #dc3545 !important;
		  	}
		.browser-bar .circle.bg-warning {
			background-color: #ffc107 !important;
			}
		.browser-bar .circle.bg-success {
			background-color: #40c057 !important;
			}
.insideFlatMacBrowser .img-responsive {
	border: 1px solid #e5e9ec;
	border-radius: 0 0 5px 5px;
	border-top: 0 none;
	}			

/*------------------------------
	    HOME SECTIONS
------------------------------*/
#home-page .content h2 {
	font-size:36px;
	/*text-transform:uppercase;*/
	margin:0 0 40px;
	}
	@media (max-width:767px) { /*extra small devices (xs)*/
		home-page .content h2 {
			font-size:26px;
			}
	}
	
/* HOME INTRO incl. CAROUSEL */
#introFlexContainer {
	display: flex;
	align-items: center;
	background: #67b516;
	flex-wrap: wrap;
	}
	#introFlexContainer .introText {
		flex: 0 1 auto;
		width: 50%;
		text-align: right; 
		background:transparent;
		padding: 40px 50px 30px;
		color:#fff;
		font-size:22px;
		}		
		#introFlexContainer .introText h1 {
			margin-top:0;
			margin-bottom:30px;
			font-size:42px;
			}
	#introFlexContainer #carousel-intro {
		flex: 0 1 auto;
		width: 50%;
		padding: 50px;
		}
		#introFlexContainer #carousel-intro .img-responsive {
			max-height:530px
			}
		#introFlexContainer #carousel-intro .left.carousel-control,
		#introFlexContainer #carousel-intro .right.carousel-control {
			background-image: none;
			}
			/* HIDE CONTROLS, we use next button defined per slide
			/* you still can click/touch the left or right side to go to the prev/next slide but you don't see the glyphicon icons left and right!
			/* uncomment if you want to show the left and right aroows */
			#introFlexContainer #carousel-intro .carousel-control .glyphicon {
				display:none;
				}
	@media screen and (max-width:1199px) {
		#introFlexContainer .introText {
			padding: 40px 30px 30px;
			font-size:18px;
			}		
			#introFlexContainer .introText h1 {
				font-size:36px;
				}
		#introFlexContainer #carousel-intro {
			padding: 40px 30px;
			}
	}
	@media screen and (max-width:991px) {
		#introFlexContainer .introText {
			padding: 30px 15px 20px;
			font-size:16px;
			}		
			#introFlexContainer .introText h1 {
				font-size:32px;
				margin-bottom:20px;
				}
		#introFlexContainer #carousel-intro {
			padding: 30px 15px;
			}
	}
	@media screen and (max-width:767px) {
		#introFlexContainer .introText {
			width:100%;
			text-align:center;
			}
		#introFlexContainer #carousel-intro {
			width:100%;
			}
			#introFlexContainer #carousel-intro .img-responsive {
				max-height:275px
				}
	}
	@media screen and (max-width:339px) {				
		#introFlexContainer .introText h1 {
			font-size:28px;
			margin-bottom:20px;
			}
	}

/* FUNCTIONALITEITEN */
#section-functionaliteiten {
	background-color:#fff;
	padding:40px 0;
	}
	#section-functionaliteiten .flexContainer {
		display: flex;
		justify-content:space-between;
		align-items: center;
		flex-wrap: wrap;
		}
		#section-functionaliteiten .flexImage {
			flex: 0 1 auto;
			width: 40%;
			padding: 40px 0;
			}
			#section-functionaliteiten .flexImage .img-responsive {
				max-height:400px
				}
		#section-functionaliteiten .flexText {
			flex: 0 1 auto;
			width: 60%;
			padding: 40px 0 30px 50px;
			}		
			#section-functionaliteiten .flexText h2 {
				font-size:30px;
				margin-top:0;
				margin-bottom:10px;	
				}
				#section-functionaliteiten .flexText a {
					margin-top:5px;
					}
		
@media screen and (max-width:991px) {
	#section-functionaliteiten {
		background-color:#fff;
		padding:40px 0;
		}
		#section-functionaliteiten .flexContainer {
			display: flex;
			justify-content:space-between;
			align-items: center;
			flex-wrap: wrap;
			}
			#section-functionaliteiten .flexText {
				width: 100%;
				padding: 40px 0 30px 0;
				}		
				#section-functionaliteiten .flexText h2 {
					font-size:24px;
					}
			#section-functionaliteiten .flexImage {
				width: 100%;
				max-width:512px;
				margin-left:auto;
				margin-right:auto;
				padding: 0 0 40px;
				order:1;
				}
}

/* DIVIDER */
#section-divider {
	padding:0;
	}
	#section-divider.white {
		background-color:#fff;
		}
		#section-divider div.green {
			width: 20%;
			height:5px;
			background-color:#67b516;
			opacity: 0.5;
			}

/* MODULES */
#section-modules {
	background-color:#fff;
	padding:40px 0;
	}
	#section-modules .flexContainer {
		display: flex;
		justify-content:space-between;
		align-items: center;
		flex-wrap: wrap;
		}
		#section-modules .flexText {
			flex: 0 1 auto;
			width: 60%;
			padding: 40px 30px 30px 0;
			}		
			#section-modules .flexText h2 {
			font-size:30px;
			margin-top:0;
			margin-bottom:10px;	
			}
			#section-modules .flexText a {
				margin-top:5px;
				}
		#section-modules .flexImage {
			flex: 0 1 auto;
			width: 40%;
			padding:0;
			}
			#section-modules .flexImage .img-responsive {
				max-height:400px
				}
@media screen and (max-width:991px) {
	#section-modules {
		background-color:#fff;
		padding:40px 0;
		}
		#section-modules .flexContainer {
			display: flex;
			justify-content:space-between;
			align-items: center;
			flex-wrap: wrap;
			}
			#section-modules .flexText {
				width: 100%;
				padding: 40px 0 30px 0;
				}		
				#section-modules .flexText h2 {
				font-size:24px;	
				}
			#section-modules .flexImage {
				width: 100%;
				max-width:250px;
				margin-left:auto;
				margin-right:auto;
				padding: 0 0 30px;
				}
}

/* DEMOS */
#section-demos {
	padding:50px 0;
	}
	#home-page #section-demos h2 {
		margin-bottom:20px;
		}
	#home-page #section-demos p {
		width:85%;
		margin:0 auto 40px;
		}
	@media screen and (max-width:991px){
		#home-page #section-demos h2 {
			font-size:30px;
			}
		#home-page #section-demos p {
			width:95%;
			}
	}
	@media screen and (max-width:767px){
		#home-page #section-demos h2 {
			font-size:26px;
			text-align:left;
			}
		#home-page #section-demos p {
			width:100%;
			text-align:left;
			}
	}
	@media screen and (max-width:413px)	{
		#home-page #section-demos h2  {
			font-size:24px;
			}	
	}
	@media screen and (max-width:359px)	{
		#home-page #section-demos h2  {
			font-size:20px;
			}	
	}
	#section-demos .well {
		box-shadow: 0 0 6px 1px rgba(0,0,0,.15);
		background-color: #fff;
		border-radius:0;
		border:0 none;
		padding:5px;
		margin-bottom:30px;
		}
		@media (max-width:767px) {
			#section-demos .well {
				max-width:400px;
				margin-left:auto;
				margin-right:auto;
				}
		}
		#section-demos .well h4 {
			color:#555555;
			text-align:center;
			margin-top:0;
			margin-bottom:0;
			padding:10px 0;
			}
			#section-demos .well a:hover h4,
			#section-demos .well a:focus h4 {
				color:#67B516;
				}

/* KOPPELINGEN */
#section-koppelingen {
	background-color:#67B516;
	background-image:url("https://i-reserve.nl/site/templates/images/koppelingen-bg.jpg");
	background-size: cover;
	background-position: center center;
	padding:40px 0;
	}
	#section-koppelingen .flexContainer {
		display: flex;
		justify-content:space-between;
		align-items: center;
		flex-wrap: wrap;
		}
		#section-koppelingen .flexText {
			flex: 0 1 auto;
			width: 60%;
			padding: 40px 30px 30px 0;
			text-align:center;
			color:#fff;
			}		
			#section-koppelingen .flexText h2 {
				font-size:30px;
				margin-top:0;
				margin-bottom:10px;
				text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.75);	
				}
				#section-koppelingen .flexText p {
					text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
					font-size:18px;
					font-weight:400;
					}
					@media screen and (max-width:767px) {
						#section-koppelingen .flexText p {
							font-size:16px;
							}
					}
				#section-koppelingen .flexText a {
					margin-top:5px;
					}
		#section-koppelingen .flexImage {
			flex: 0 1 auto;
			width: 40%;
			padding:0;
			}
			#section-koppelingen .flexImage .img-responsive {
				max-height:400px
				}
@media screen and (max-width:991px) {
	#section-koppelingen {
		background-color:#67B516;
		padding:40px 0;
		}
		#section-koppelingen .flexContainer {
			display: flex;
			justify-content:space-between;
			align-items: center;
			flex-wrap: wrap;
			}
			#section-koppelingen .flexText {
				width: 100%;
				padding: 40px 0 30px 0;
				}		
				#section-koppelingen .flexText h2 {
					font-size:24px;	
					}
			#section-koppelingen .flexImage {
				width: 100%;
				padding: 0 0 30px;
				}
				#section-koppelingen .flexImage .img-responsive {
					max-height:250px;
					margin-left:auto;
					margin-right:auto;
					}
}

/* FEATURES */
#section-features {	
	padding:40px 0;
	}
	/* section names + titles */
	#home-page #section-features .section-name {
		margin-top:0;
		margin-bottom:5px;
		font-size:12px;
		text-transform:lowercase;
		}
	#home-page #section-features .section-title {
		font-size: 28px;
		margin-top: 5px;
		margin-bottom: 45px;
		}
		#section-features .section-title.green {
			color: #67b516;
			}

	#section-features .flexContainer {
		margin-left:-15px;
		margin-right:-15px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		}
		#section-features .flexItem {
			flex: 0 1 auto;
			width: 25%;
			border-right: 1px solid #d5d5d5;
			}
			#section-features .flexItem.item-3 {
				border-right:0 none;
				}
			
				#section-features .flexItem .feature {
					padding:15px;
					text-align:center;
					}
			@media screen and (max-width:991px) {
				#section-features .flexItem {
					width:50%;
					}
					#section-features .flexItem.item-1 {
						border-right:0 none;
						}
						#section-features .flexItem.item-2,
						#section-features .flexItem.item-3 {
							border-top: 1px solid #d5d5d5;
						}
			}
			@media screen and (max-width:767px) {
				#section-features .flexItem {
					width:100%;
					border-right: 0 none;
					margin-bottom: 20px;
					}
					#section-features .flexItem.item-1 {
						border-top: 1px solid #d5d5d5;
						}
			}		
			#section-features .glyphicon {
				display:block;
				float:none;
				margin:auto;
				width:90px;
				height:90px;
				border:2px solid #67b516;
				border-radius:50%;
				font-size:40px;
				color:#67b516;
				padding-top:25px;
				}
				#section-features .feature h3,
				#section-features .feature h4 {
				/*text-transform:uppercase;*/
				font-size:22px;
				margin:18px 0 5px;
				min-height:2em;
				}
			#section-features .feature p {
				font-size:13px;
				color:#555;
				margin:0;
				text-align:justify;
				}
	
			
/* ABOUT US */
#section-about {
	background-color:#fff;
	padding:70px 0 50px;
	}
	#section-about h2 {
		margin:0 0 15px!important;
		}
		@media screen and (max-width:991px){
			#home-page #section-about h2 {
				font-size:30px;
				}
		}
		@media screen and (max-width:767px){
			#home-page #section-about h2 {
				font-size:26px;
				}
		}
		@media screen and (max-width:413px)	{
			#home-page #section-about h2  {
				font-size:24px;
				}	
		}
		@media screen and (max-width:359px)	{
			#home-page #section-about h2  {
				font-size:20px;
				}	
		}
	/* quotes carousel */
	#section-about .carousel-control.left, 
	#section-about .carousel-control.right {
		background-image:none !important;
		}
		#section-about .carousel-control {
			font-size:16px;
			background:	#cecece;
			padding: 2px 0;
			width:20px;
			top:auto;	
			left:auto;
			bottom:0;
			opacity:1;
			text-shadow:none;
			}
			#section-about .carousel-control,
			#section-about .carousel-control:focus,
			#section-about .carousel-control a,
			#section-about .carousel-control a:link,
			#section-about .carousel-control a:focus,
			#section-about .carousel-control:focus {
				color:#67b516;
				}
				#section-about .carousel-control a:hover,
				#section-about .carousel-control:hover {
					color:#ffffff;
					}
			#section-about .carousel-control.right {
				right:10px;
				}
		 
			#section-about .carousel-control.left {
				right: 40px;
				}
	#section-about blockquote {
		background-color:#e5e5e5;
		border-left-color:#67b516;		
		margin:0;
		padding:20px 20px 30px;
		min-height:280px;
		margin-top:20px;
		}		
		@media (min-width:480px) {
			#section-about blockquote {
				min-height:220px;
				}
		}
		@media (min-width:768px) {
			#section-about blockquote {
				min-height:180px;
				}
		}
		@media (min-width:992px) {
			#section-about blockquote {
				min-height:250px;
				margin-top:0;
				}
		}
		@media (min-width:1200px) {
			#section-about blockquote {
				min-height:210px;
				}
		}		
		#section-about blockquote i {
			color:#aaaaaa;
			font-size:30px;
			margin-bottom:10px;
			}
		#section-about blockquote p {
			color:#666666;
			font-style:italic;
			font-weight:300;
			font-size:14px;
			}
		#section-about blockquote footer {
			color:#777777;
			font-style:italic;
			}

#section-faq {
	background-color:#fff;
	}
/* TEASER + TOUR */
#section-teaser {
	padding:20px 0 10px;
	background-color:#1667b5;
	color:#ffffff;
	}
#section-tour {
	padding:20px 0 10px;
	background-color:#67b516;
	color:#ffffff;
	}
	#section-tour p,
	#section-teaser p {
		font-size:24px;
		line-height:1.8;
		}
	/* teaser home-page */
	#home-page #section-teaser {
		background-color:#67b516;
		}

#section-safe {
	padding-top: 10px;
	padding-bottom: 10px;
	background: #1667b5;
	color:#fff;	
	}
	#section-safe .list-inline {
		margin-bottom:0;
		text-align:right;
		}
		@media screen and (min-width:992px) {
			#section-safe .list-inline li {
				padding-left:15px;
				padding-right:15px;
				}
		}
		@media screen and (min-width:768px) {
				#section-safe .col-sm-4 {
					padding-right:0;
					}
				#section-safe .list-inline li:last-child {
					padding-right:0;
					}
		}
	@media screen and (max-width:767px) {
		#section-safe .list-inline {
			text-align:left;
			margin-top:10px;
			}
			#section-safe .list-inline li {
				padding-right:10px;
				}
			#section-safe .list-inline li:last-child {
					padding-right:0;
					}
	}
	@media screen and (max-width:567px) {
		#section-safe .list-inline {
			text-align:left;
			margin-top:10px;
			}
			#section-safe .list-inline li {
				display:block;
				padding-right:0;
				padding-bottom:5px;
				}
				#section-safe .list-inline li:last-child {
					padding-bottom:0;
					}
	}
			
/*------------------------------
	    LOGOBAR
------------------------------*/
#section-logobar {
	background-color:#ffffff;
	padding:0 0 40px 0;
	}
	#section-logobar p.text-muted {
		padding-top:40px;
		}
	/* border-top for the logo-bar on the contact-page */
	#contact-page #section-logobar p.text-muted {
		border-top:1px solid #eeeeee;
		padding-top:20px;
		}		
	
	/*Extra small devices: Phones Landscape (≤ 360px) Customized Settings using classes phonePortrait_50*/
	@media (max-width:360px) {
		.logobar .phonePortrait_50 {
			width:50%;
			}
	}
	/* overrides slcik-theme.css */
	#section-logobar .slick-prev:before,
	#section-logobar .slick-next:before {
		color:#424242;
		opacity:0.5
		}
		#section-logobar .slick-prev:hover:before,
		#section-logobar .slick-prev:focus:before,
		#section-logobar .slick-next:hover:before,
		#section-logobar .slick-next:focus:before {
			opacity: 1;
			}
	#section-logobar .slick-prev {
		left:-21px;
		}
	#section-logobar  .slick-next {
		right:-21px;
		}
		
	#section-logobar  .slick-slider {
		margin:0 25px;
		}
			
/*------------------------------
	  MAIN CONTENT SECTION
	  -not apply to home-
------------------------------*/
section.content.main {
	padding-bottom:50px;
	background-color:#ffffff;
	}
section.content.main.padding30 { /* page Features */
	padding-bottom:30px;
	}
	section.content.main.padding0 { /* landing-pages Demos */
		padding-bottom:0;
		}

	
/*------------------------------
FUNCTIONALITIES (PRODUCT) PAGE
	incl module overview page 
	using template basic-page	
------------------------------*/
/* OLD... to be deleted */
.advantage-list li {
	margin-bottom:10px;
	}
	.advantage-list li .fa {
		color:#67b516;
		top:5px;
		}
	.advantage-list li.new .label {
		background-color:#67b516;
		}
/* end OLD ... to be deleted */

/*** section names + titles ***/
#functionalities-page .section-name {
	margin-top:0;
	margin-bottom:5px;
	font-size:12px;
	text-transform:lowercase;
	}
#functionalities-page .section-title {
	font-size: 28px;
	margin-top: 5px;
	margin-bottom: 45px;
	}
	#functionalities-page .section-title.green {
		color: #67b516;
		}
	#functionalities-page .section-title.black {
		color: #333;
		margin-bottom:10px;
		}
		#functionalities-page .section-intro {
			color:#555;
			margin-top:-25px;
			margin-bottom:45px;
			}
/*** sectie Highlights (uitgelichte functionaliteiten, niet gebruikt op modules page) ***/
#functionalities-page #section-hightlight {
	padding: 20px 0 40px;
	background-color:#fff;
	}
	#functionalities-page #section-hightlight .flexContainer {
		display: flex;
		justify-content:space-between;
		align-items: center;
		flex-wrap: wrap;
		}
		#functionalities-page #section-hightlight .flexImage {
			flex: 0 1 auto;
			width: 40%;
			padding: 40px 0;
			order:0;
			}
			/* if odd: place image right */
			#functionalities-page #section-hightlight.imgRight .flexImage {
				order:1;
				}
			/*#functionalities-page #section-hightlight .flexImage .img-responsive {
				max-height:400px
				}*/
		#functionalities-page #section-hightlight .flexText {
			flex: 0 1 auto;
			width: 60%;
			padding: 40px 0 30px 50px;
			order:1;
			}
			/* if odd: place text left */
			#functionalities-page #section-hightlight.imgRight .flexText {
				order:0;
				padding: 40px 50px 30px 0;
				}	
			#functionalities-page #section-hightlight .section-name {
				font-size:16px;
				text-transform:lowercase;
				color: #67b516;
				letter-spacing:2px;
				}
			#functionalities-page #section-hightlight .fa-ul {
				margin-top:0;
				}
				#functionalities-page #section-hightlight .fa-li {
					top:5px;
					color: #67b516;
					}
			#section-functionaliteiten .flexText .btn-default {
				margin-top:5px;
				}
		
@media screen and (max-width:991px) {
	#functionalities-page #section-hightlight .flexContainer {
		display: flex;
		justify-content:space-between;
		align-items: center;
		flex-wrap: wrap;
		}
		#functionalities-page #section-hightlight .flexText {
			width: 100%;
			padding: 40px 0 30px 0;
			order:0!important;
			}
		#functionalities-page #section-hightlight .flexImage {
			width: 100%;
			max-width:512px;
			margin-left:auto;
			margin-right:auto;
			padding: 0 0 40px;
			order:1!important;
			}
}

/*** sectie Mogelijkheden (functionalities, not used on modules overview page) **/
#functionalities-page #section-functionaliteiten {
	padding: 40px 0;
	background-color:#f4f4f4;
	}
	#functionalities-page #section-functionaliteiten .flexContainer {
		display:flex;
		flex-wrap:wrap;
		justify-content: space-between;
		align-items:stretch;
		}
		#functionalities-page #section-functionaliteiten .flexItem {
			flex: 0 1 auto;
			width: calc(33.33333333% - 20px);
			display: flex;
			flex-direction: column;
			}
			@media screen and (max-width:991px) {
				#functionalities-page #section-functionaliteiten .flexItem {
					width: calc(50% - 20px);
					}
			}
			@media screen and (max-width:767px) {
				#functionalities-page #section-functionaliteiten .flexItem {
					width:100%;
					}
			}
			/* for the USP styling settings, see the USP settings landing-page, sectie functionalities! */

/*** sectie Koppelingen ***/
/* see style settings for koppelingen on homepage + */
/* if overrides are needed, put them here prepend with the templatename */
#functionalities-page #section-koppelingen,
#basic-page #section-koppelingen {
	background-color:#fff;
	background-image:none;
	padding:40px 0;
	}
	#functionalities-page #section-koppelingen .flexText,
	#basic-page #section-koppelingen .flexText {
		color:#333;
		}		
		#functionalities-page #section-koppelingen .flexText h2,
		#basic-page #section-koppelingen .flexText h2 {
			text-shadow: none;	
			}
			#functionalities-page #section-koppelingen .flexText p,
			#basic-page #section-koppelingen .flexText p {
				text-shadow: none;
				font-weight: 300;
				}
	/* grey bg if OUDE OPZET */
	#functionalities-page #section-koppelingen.grey {
		background-color:#f4f4f4;
		}

/*** sibling navigation ***/
#product_siblings_nav {
	background-color: #67b516;
	padding-bottom: 50px;
	padding-top:40px;
	color:#ffffff;
	}
	#product_siblings_nav h2 {
		margin-top:0;
		}
	#product_siblings_nav p.intro {
		font-size:16px;
		}
	.flexProductContainer {
		display: flex;
		flex-wrap: wrap;
		margin:0 -15px;
		}
		.flexProductItem {
			flex: 0 1 auto;
			width: calc(20% - 30px);
			margin:15px;
			}
			.flexProductItem .well {
				height: 100%;
				display: flex;
				flex-direction: column;
				margin-bottom: 0;
				box-shadow: 0 0 6px 1px rgba(0,0,0,.15);
				background-color: #ffffff;
				border-radius: 0;
				border: 0 none;
				}
				.flexProductItem .well h4 {
					color:#555;
					margin-top:0;
					margin-bottom:3px;
					}
				.flexProductItem .well p {
					line-height:150%;
					color:#777;
					font-size:12px;
					}
				.flexProductItem .well .btn-default {
					margin-top:auto;
					}
		@media screen and (max-width:1199px) {
			.flexProductItem {
				width: calc(25% - 30px);
				}
		}
		@media screen and (max-width:991px) {
			.flexProductItem {
				width: calc(33.33333333% - 30px);
				}
		}
		@media screen and (max-width:639px) {
			.flexProductItem {
				width: calc(50% - 30px);
				}
		}
		@media screen and (max-width:480px) {
			.flexProductItem {
				width: calc(100% - 30px);
				}
		}
/*** sectie Features (Voordelen) ***/
/* see style settings for features on homepage + */
/* if overrides are needed, put them here prepend with the templatename */
#functionalities-page #section-features,
#basic-page #section-features {	
	background-color:#fff;
	}

/*------------------------------
	  MODULES OVERVIEW PAGE
------------------------------*/
/* see stylesettings for module section Landings-page below and for the other sections see the settings for the product pages above! 
/* Overrides or extra settings are set here */
#content .flexContainer.modulesOverview {
	margin-top:50px;
	}
#basic-page #section-koppelingen {
	background-color:#f4f4f4;
	}

			
/*------------------------------
	  DEMO PAGE - OVERVIEW	  
------------------------------*/
/* detail page: see setting below in LANDING (DEMO) */
#demo-page #content p {
	line-height:1.8;
	}
	#demo-page #content p.lead {
		line-height:1.4;
		}

.all-demos {
	margin-top:40px;
	margin-bottom:30px;
	}
	.all-demos .well {
		box-shadow: 0 0 6px 1px rgba(0,0,0,.15);
		background-color: #fff;
		border-radius:0;
		border:0 none;
		padding:5px;
		margin-bottom:30px;
		}
		@media (max-width:767px) {
			.all-demos .well {
				max-width:400px;
				margin-left:auto;
				margin-right:auto;
				}
		}
		.all-demos .well h4 {
			color:#555555;
			text-align:center;
			margin-top:0;
			margin-bottom:0;
			padding:10px 0;
			}
			.all-demos .well a:hover h4,
			.all-demos .well a:focus h4 {
				color:#67B516;
				}

/*------------------------------
	  PRICING PAGE
------------------------------*/
.sectorContainer {
	margin-top: 40px;
	margin-bottom: 60px;
  	}
	.sectorFlexContainer {
		background-color: #f2f2f2;
		border:1px solid #f2f2f2;
		padding: 10px;
		margin-bottom: 30px;
		}
		.sectorFlexContainer:hover,
		.sectorFlexContainer:focus {
			background-color: #fff;
			border-color: #67b516;
			}
		.sectorFlexContainer a {
			display: flex;
			align-items: center;
			color:#333;
			}
			.sectorImage {
				flex: 0 1 auto;
				max-width: 400px;
				}
				@media screen and (min-width:992px) {
					.sectorFlexContainer:nth-child(2n+1) .sectorImage {
						order: 0;
						}
					.sectorFlexContainer:nth-child(2n) .sectorImage {
						order: 1;
						}
					}
				@media screen and (max-width:991px) {
					.sectorFlexContainer {
						width:100%;
						width: 100%;
						max-width: 400px;
						margin: 0 auto 30px;
						}
						.sectorFlexContainer a {
							display: flex;
							flex-direction: column;
							align-items: center;
							}
							.sectorImage {
								max-width: 100%;
								}
							.sectorContent {
								flex: 0 1 auto;
								width: 100%;
								padding:0;
								} 
				}
			.sectorContent {
				flex: 0 1 auto;
				width: 100%;
				padding:15px;
				} 
				.sectorContent h3 {
					margin-top:0;
					}


.modalpanels .panel-primary {
	border-color: #67b516;
	box-shadow:none;
	}
	.modalpanels .panel-primary > .panel-heading {
		border-color: #67b516;
		background-color: #67b516;
		}
	.modalpanels .panel-primary > .panel-body {
		color:#67b516;
		}
	.modalpanels .panel-primary > td {
		padding:8px 15px;
		}
/* different panel heading font-size for SM devices */
@media (min-width:768px) and (max-width:991px) {
	.modalpanels .panel-title {
		font-size:14px;
		font-weight:bold;
		}
}
/* table modal Workshop */
.paneltable tbody tr td {
	padding:8px 15px;
	}
.themecolor {
	color:#67b516;
	}

/*--------------------------------	
		SECTOR PAGE
	internal pricelist
---------------------------------*/
.highlight {
	margin: 0;
	border: 1px solid #eaeaea;
	background-color: #fafafa;
	padding: 5px;
	display:flex;
	justify-content: space-between;
	flex-wrap: wrap;
	}
	.highlight .bullets,
	.highlight .trialLink {
		flex:0 1 auto;
		}
		.highlight .bullets {
			display:flex;
			justify-content:flex-start;
			align-items:center;
			}
			.highlight .bullets div {
				margin-right:10px;
				}
	@media screen and (max-width:699px) {
		.highlight .bullets {
			width:100%;
			margin-bottom:10px;
			}
	}
	@media screen and (max-width:568px) {
		.highlight .bullets {
			flex-direction:column;
			align-items:flex-start;
			margin:5px 10px;
			}
			.highlight .bullets div {
				margin-bottom:5px;
			}
		.highlight .trialLink {
			margin:5px 10px;
			}
	}

/* price blocks, page Prijzen */
.row.highlight {
	margin:0;
	border:1px solid #eaeaea;
	background-color:#fafafa;
	padding:5px;
	}
	.row.highlight div{
		padding:0;
		}
		.row.highlight .list-inline {
			margin-top:7px;
			margin-bottom:5px;
			color:#777777;
			}
.row.all-licenses {
	margin:40px 0 20px;
	}
	.row.all-licenses div.custom-width {
		padding:0;
		}
        	/*** start OLD PRICE TABLE ***/	
        	@media (min-width:768px) {
        		.row.all-licenses .col-sm-4.custom-width {
        			width:24%;
        			}
        		.row.all-licenses .col-sm-2.custom-width {
        			width:19%;
        			}
        	}
            /*** end OLD PRICE TABLE ***/
    
    /*** start NEW PRICE TABLE ***/	
	@media (min-width:768px) {
		.row.all-licenses.customColumns .col-sm-4.custom-width {
			width:20%;
			}
		.row.all-licenses.customColumns .col-sm-2.custom-width {
			width:16%;
			}
	}
    /*** end NEW PRICE TABLE ***/
    
	@media (max-width:767px) {
		.row.all-licenses {
			margin-bottom:30px;
			}
			.row.all-licenses .col-sm-2.custom-width {
				max-width:350px;
				margin-left:auto;
				margin-right:auto;
				}
	}
	.pricing-plan.label-list {
		background-color:#ffffff;
		}
		.label-list h3,
		.label-list .pricing-plan-price {
			visibility:hidden;
			}
	.pricing-plan {
		background-color: #F5F5F5;
		text-align:center;
		margin:34.6px 0 0;
		}
	.pricing-plan.popular {
		background-color: #E5E5E5;
		/*position:relative;
		top:-34px;*/
		margin-top:0;
		}
		@media (max-width:767px) {
		.pricing-plan.popular {
			margin-top:30px;
			}
		}
		.pricing-plan h3,
		.pricing-plan p {
			background-color:#23527c;
			padding:15px 0;
			color:#FFFFFF;
			margin:0;
			text-transform:uppercase;
			font-size:22px;
			font-weight:700;
			}
			.pricing-plan.popular h3,
			.pricing-plan.popular p {
				filter: grayscale(100%);
				}
			.pricing-plan.popular p {
				font-size:14px;
				line-height:19.6px;
				color:#EEEEEE;
				padding-top:0;
				}
		/*** start NEW PRICE TABLE ***/
		@media screen and (min-width:768px) and (max-width:991px) {
    		.all-licenses.customColumns .custom-width .pricing-plan h3 {
    		    font-size:18px;
    		    }
		    .all-licenses.customColumns .custom-width .pricing-plan.popular p {
    		    font-size:12px;
    		    }
		}
	   /*** end NEW PRICE TABLE ***/
		
		.pricing-plan-price {
			background-color:#1667b5;
			padding:20px 10px;
			}

		.popular .pricing-plan-price {
			filter: grayscale(100%);
			}
		    .pricing-plan .pricing-plan-price span {
				color:#FFFFFF;
				}
			.pricing-plan-price span.pricing-plan-small {
				font-size:20px;
				}
			.pricing-plan-price span.pricing-plan-big {
				font-size:30px;
				}
			.pricing-plan-price span.pricing-plan-text {
				font-size:16px;
				display:block;
				font-weight:300;
				position:relative;
				top:0;
				color:rgba(215,215,215,0.85);
				}
				/*** start NEW PRICE TABLE ***/
				    .all-licenses.customColumns .pricing-plan-price span.pricing-plan-text {
				        min-height:19.6px;
				        }
				/*** end NEW PRICE TABLE ***/
				
			.pricing-plan-price span.pricing-plan-text-small {
				font-size:13px;
				display:block;
				font-weight:300;
				position:relative;
				top:-5px;
				color:rgba(215,215,215,0.6);
				border-top:1px solid rgba(215,215,215,0.3);
				padding-top:5px;
				}
				.pricing-plan-price span.pricing-plan-text-small span {
					color:rgba(215,215,215,0.6);
					font-weight:300;
					font-size:11px;
					}
		.row.all-licenses .pricing-plan ul {
			padding:0;
			text-align:left;
			margin-bottom:20px;
			}
		@media (min-width:768px) {
			.row.all-licenses .col-sm-2 .pricing-plan ul {
				border-right: 1px solid #e5e5e5;
				}
				.row.all-licenses .col-sm-2:last-child .pricing-plan ul {
					border-right-width:0;
					}
		}
		    .pricing-plan ul li {
				border-bottom:1px solid #E5E5E5;
				text-align:center;
				color:#555555;
				line-height:20px;
				padding:10px 5px;
				font-size:13px;
				}
				/*** start NEW PRICE TABLE ***/
	            @media screen and (min-width:768px) and (max-width:991px) {
	                .all-licenses.customColumns .custom-width .pricing-plan ul li {
	                    font-size:12px;
	                    }
	            }
	            /*** start NEW PRICE TABLE ***/
	            
				@media (max-width:767px) {
					.pricing-plan ul li .small {
						color:#777;
						}
				}
				.pricing-plan.label-list ul li:last-child {
					border-bottom:1px solid #ffffff;
					}
				.pricing-plan.label-list ul li {
					color:#777;
					}
					.pricing-plan.label-list ul li .small {
						color:#999;
						}
					.pricing-plan.label-list ul li.infoIcon .fa {
						position:relative;
						top:-1px;
						}
			.pricing-plan.popular ul li {
				border-color:#D5D5D5;
				}
				
			/* set custom heights All devices except XS */
			@media (min-width:768px) {
				.pricing-plan ul li.twoLines {
					height:61px;
					}			
			}
			/* set custom heights SM only */
			@media (min-width:768px) and (max-width:991px) {
				.pricing-plan ul li.twoLines_SM {
					height:61px;
					padding:10px;
					}			
			}

			/* set custom heights MD only */
			@media (min-width:992px) and (max-width:1199px) {
				.pricing-plan ul li.twoLines_MD {
					height:61px;
					padding:10px;
					}			
			}
				
			#ModulesModal .dl-horizontal dt {
				text-align:left;
				width:200px;
				}
				
		.pricing-plan .btn {
			margin-bottom:30px;
			}
			/*** start NEW PRICE TABLE ***/
			.all-licenses.customColumns .custom-width .pricing-plan .btn {
			    font-size:16px;
			    }
			    @media (min-width:768px) and (max-width:991px) {
			        .all-licenses.customColumns .custom-width .pricing-plan .btn {
    			        font-size:12px;
    			        font-weight:bold;
    			        padding:6px;
			            }
    			}
			/*** end NEW PRICE TABLE ***/
			
	
.whiteSpaceTop {
	margin-top: 40px;
	}
/*--------------------------------	
	GENERAL CONDITIONS
---------------------------------*/
ul.list-inline.ict-links {
	margin-bottom:25px;
	}
	
/*--------------------------------	
	    CONTACT PAGE
	(FORM + GoogleMap)
---------------------------------*/
section.content.main .contactform {
	margin-top:30px;
	}
	.contactform .form-horizontal .control-label {
		text-align:left;
		}
	/* hide item error message because these messages are in English  */
	.contactform .Inputfields p.text-danger {
		display:none;
		}
		help-block
	/* notation settings, prevent example phone number is displayed as link in IOS */
	.contactform .Inputfields p.help-block a {
		color:#737373!important;
		}
	/* fix for checkboxes + radiobuttons (see also line 303 _contact.php radio + checkbox field FIX) */
	section.content.main .contactform .InputfieldCheckboxesStacked input[type="checkbox"],
	section.content.main .contactform .InputfieldRadiosStacked input[type="radio"] {
		margin-top: 6px;
		}
section.content.main .contactdata {
	margin-top:30px;
	}

.locationmap a.btn.btn-primary {
	margin-top:10px;
	}

.sidebar-right {
	padding-top:8px;
	}	
	.contactinfo {
		margin-top:30px;
		}
		.contactinfo .desc {
			color:#999999;
			}
		.contactinfo .clearfix.spacer {
			margin-bottom:20px;
			}
		.contactinfo .no-link,
		.contactinfo .no-link a {
			color:#333333;
			}

/*------------------------------
	  MAGNIFIC POPUP
------------------------------*/
.mfp-figure:after { /* override the default #444 img background */
	background-color:#ffffff;
	}
	
/*------------------------------
	  SCROLL TO TOP
------------------------------*/
/*see www.paulund.co.uk/how-to-create-an-animated-scroll-to-top-with-jquery*/
.scrollToTop{
	font-size:50px;
	position:fixed;
	bottom:50px;
	right:15px;
	display:none;
	z-index:9999;
	color:rgba(0,0,0,0.5)!important;
	}
	.scrollToTop:hover{
		text-decoration:none;
		color:rgba(0,0,0,0.8)!important;
		}
/*--------------------------------------------------------
					SECTION CHILDNAV
				   -not apply to home-
--------------------------------------------------------*/
#section_childnav {
	background-color:#ffffff;
	padding-bottom:50px;
	}
	#section_childnav li {
		margin-bottom:5px;
		}
		#ection_childnav li a {
			color:#67b516;
			}
			#ection_childnav li a:hover,
			#ection_childnav li a:focus {
				color:#67b516;
				font-weight:bold;
				}
		
/*--------------------------------------------------------
			 SECTION PARENT AND SIBLINGSNAV
				   -not apply to home-
--------------------------------------------------------*/
#section_parent_siblings_nav {
	background-color:#ffffff;
	padding-bottom:50px;
	}
	#section_parent_siblings_nav li {
		margin-bottom:5px;
		}
		#section_parent_siblings_nav li a {
			color:#67b516;
			}
			#section_parent_siblings_nav li a:hover,
			#section_parent_siblings_nav li a:focus {
				color:#67b516;
				font-weight:bold;
				}

/*--------------------------------------------------------
					SECTION PARENTNAV
				   -not apply to home-
--------------------------------------------------------*/
#section_parentnav {
	background-color:#ffffff;
	padding-bottom:50px;
	}
	#section_parentnav li a {
		color:#67b516;
		}
		#section_parentnav li a:hover,
		#section_parentnav li a:focus {
			color:#67b516;
			font-weight:bold;
			}

/*--------------------------------------------------------
					    REFERENTIES
--------------------------------------------------------*/
.ref-list {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
  	}
	.refListChild {
		flex: 0 1 auto;
		margin: 15px;
		width: calc(33% - 30px);
		display:flex;
		}
		@media screen and (max-width:991px) {
			.refListChild {
				width:calc(50% - 30px);
				}
		}
		@media screen and (max-width:600px) {
			.ref-list {
				justify-content:center;
				}
				.refListChild {
					width:calc(100% - 30px);
					max-width:400px;
					}
		}
		.refListChild a {
			box-shadow: 0 0 6px 1px rgba(0,0,0,.15);
			display: flex;
			flex-direction: column;
			padding:10px;
			border:1px solid #ffffff;
			}
			.refListChild a:hover,
			.refListChild a:focus {
				border-color: rgba(103,181,22,.5);
				box-shadow: 0 0 6px 1px rgba(103,181,22,.5);
				}
				.refListChild a h3 {
					font-size:18px;
					color:#999;
					margin-bottom:0;
					}
					.refListChild a:hover h3,
					.refListChild a:focus h3 {
						color:#67b516;
						}

/*--------------------------------------------------------
				LANDING (DEMO)
--------------------------------------------------------*/
.staticHeader .img-responsive {
	width:100%;	
	}
#landing-page .page-header {
	margin-top:30px;
	}
/*** NEW SETUP landing-demo pages nov/dec 2021 ***/
/* intro */
#landing-page.seoOptimezed #content p {
	font-size:15px;
	line-height:1.6;
	}
	#landing-page.seoOptimezed #content p.lead {
		font-size:21px;
		line-height:1.4;
		}
	/* ctaButton (naar demo) */
	#landing-page.seoOptimezed #content .ctaButtons.ctaDemo {
		margin-top: 25px;
		margin-bottom: 50px;
		}

/* section names + titles */
#landing-page .section-name {
	margin-top:0;
	margin-bottom:5px;
	font-size:12px;
	text-transform:lowercase;
	}
#landing-page .section-title {
	font-size: 28px;
	margin-top: 5px;
	margin-bottom: 45px;
	}
	#landing-page .section-title.green {
		color: #67b516;
		}
		#landing-page .section-intro {
			color:#555;
			margin-top:-25px;
			margin-bottom:45px;
			}
/* sectie Functionaliteiten */
#landing-page #section-functionaliteiten {
	padding: 40px 0;
	background-color:#f4f4f4;
	}
	#landing-page #section-functionaliteiten .flexContainer {
		display:flex;
		flex-wrap:wrap;
		justify-content: space-between;
		align-items:stretch;
		}
		#landing-page #section-functionaliteiten .flexItem {
			flex: 0 1 auto;
			width: calc(33.33333333% - 20px);
			display: flex;
			flex-direction: column;
			}
			@media screen and (max-width:991px) {
				#landing-page #section-functionaliteiten .flexItem {
					width: calc(50% - 20px);
					}
			}
			@media screen and (max-width:767px) {
				#landing-page #section-functionaliteiten .flexItem {
					width:100%;
					}
			}
		.uspContent {
			color:#555;
			margin-bottom:30px;
			}
			.uspContent h3,
			.uspContent h4 {
				font-size:16px;
				margin-top:0;
				margin-bottom:0;
				}
				.uspContent h3 .fa,
				.uspContent h4 .fa {
					color:#67b516;
					}

/* sectie Modules */
#landing-page #section-modules {
	padding: 40px 0;
	}
	.flexContainer.modulesOverview {
		display: flex;
		flex-wrap: wrap;
		justify-content: center!important;
		align-items:stretch!important;
		}
		.flexContainer.modulesOverview .flexItem {
			flex: 0 1 auto;
			width: 33.33333333%;
			display: flex;
			flex-direction: column;
			}
			@media screen and (max-width:991px) {
				.flexContainer.modulesOverview .flexItem {
					width: 50%;
					}
			}
			@media screen and (max-width:767px) {
				.flexContainer.modulesOverview .flexItem {
					width:100%;
					}
			}
			.flexContainer.modulesOverview .flexItem .well {
				flex: 0 1 auto;
				height: 100%;
				box-shadow: 0 0 6px 1px rgba(0,0,0,.15);
				background-color: #fff;
				border-radius: 0;
				border: 0 none;
				margin: 0 15px 30px;
				}
				.flexContainer.modulesOverview .flexItem .well h3,
				.flexContainer.modulesOverview .flexItem .well h4 {
					color: #67b516;
					font-size:24px;
					margin-top:20px;
					margin-bottom:10px;
					}

/* sectie Features (Voordelen) */
/* see style settings for features on homepage + */
/* if overrides are needed, put them here prepend with the templatename */


/* sectie Contact */
#landing-page #section-contact {
	padding:30px 0;
	background-color:#67b516;
	color:#ffffff;
	}
	#landing-page #section-contact .flexContainer {
		display: flex;
		margin: 0;
		justify-content: space-between;
		}
		#landing-page #section-contact .flexItem {
			width: calc(50% - 30px);
			padding: 0;
			flex: 0 1 auto;
			}
			#landing-page #section-contact .flexItem.flexBackgroundImg {
				background-size: cover;
				background-position: center center;
				}
			#landing-page #section-contact h2 {
				font-size:28px;
				margin-top:0;
				}
			@media screen and (max-width:991px) {
				#landing-page #section-contact .flexContainer {
					flex-direction:column;
					justify-content: stretch;
					}
					#landing-page #section-contact .flexItem {
						flex:0 1 auto;
						width:100%;
						order:1;
						}
						#landing-page #section-contact .flexItem.flexBackgroundImg {
							margin-bottom:30px;
							height:400px;
							order:0;
							}
			}
			@media screen and (max-width:767px) {
				#landing-page #section-contact .flexItem.flexBackgroundImg {
					height:300px;
					}
			}
			@media screen and (max-width:359px) {
				#landing-page #section-contact .flexItem.flexBackgroundImg {
					height:250px;
					}
			}

/* sectie Demo & Trial */
#landing-page #section-demo-trial {
	padding: 60px 0 40px;
	}
	#landing-page #section-demo-trial .flexContainer {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		}
		#landing-page #section-demo-trial .flexItem {
			flex: 0 1 auto;
			width: calc(50% - 15px);
			margin-bottom:30px;
			}
			@media screen and (max-width:991px) {
				#landing-page #section-demo-trial .flexItem {
					width:100%;
					}
			}
			#landing-page #section-demo-trial .flexItem .well {
				box-shadow: 0 0 6px 1px rgba(0,0,0,.15);
				background-color: #fff;
				border-radius:0;
				border:0 none;
				padding:25px;
				height:100%;
				display: flex;
				flex-direction: column;
				justify-content: center;
				}
				#landing-page #section-demo-trial .flexItem .well h3 {
					color:#67b516;
					}
				#landing-page #section-demo-trial .flexItem .well p {
					flex-grow: 2;
					}
				#landing-page #section-demo-trial .btnBlockLink {
					margin-top:5px;
					}
					#landing-page #section-demo-trial .btnBlockLink a.btn-primary {
						display: table;
						padding: 0;
						border: 0;
						}
						#landing-page #section-demo-trial .btnBlockLink .btnLabel {
							display: table-cell;
							padding:6px 12px;
							}
							#landing-page #section-demo-trial .btnBlockLink .btnTxtHead {
								font-weight:bold;
								text-transform:uppercase;
								}
								#landing-page #section-demo-trial .btnBlockLink .btnIcon {
									display: table-cell;
									vertical-align: middle;
									padding-left: 12px;
									padding-right: 12px;
									background-color: rgba(0,0,0,0.1);
									font-size: 24px;
									border-radius: 0 4px 4px 0;
									}

/* sectie Teaser (blue) */
#landing-page #section-teaser {
	padding:20px 0 10px;
	background-color:#1667b5;
	color:#ffffff;
	}
	#landing-page #section-teaser p {
		font-size:24px;
		line-height:1.8;
		}

/*--------------------------------------------------
	    SEARCH BAR
	articles-main, articles-category, articles-page
	integration-main, integration-category, integration-page
---------------------------------------------------*/
#searchBar {
	background-color:#fafafa;
	padding-top:10px;
	padding-bottom:10px;
	border-bottom:1px solid #e7e7e7;
	}
	.form-control {
	    box-shadow: none;
		appearance: none;
		}
		.form-control:focus {
		    border-color:#67b516;
		    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(103,181,22,.6);
			}
/*------------------------------
       SEARCH RESULTS PAGE
------------------------------*/
#search-page .alert.alert-danger,
#integration-search-page .alert.alert-danger {
    padding:15px;
    margin:-21px 0 40px;
    border:1px solid #a94442;
	border-left-width:10px;
	background-color: #fff;
    border-radius:0;
}

#search-page .alert.alert-success,
#integration-search-page .alert.alert-success {
    padding:15px;
    margin:-21px 0 40px;
    border:1px solid #67b516;
    border-radius:0;
    background-color: #fff;
    color:#67b516;
	border-left-width:10px;
}

#search-page .filterSearchResults,
#integration-search-page .filterSearchResults {
	margin-top:15px;
	margin-bottom:5px;
}

#advancedSearch {
	overflow:hidden;
	box-shadow: 0 0 6px 1px rgba(0,0,0,.15);
	background-color: #fff;
	border-radius: 0;
	border: 0 none;
	padding: 15px;
	margin-top:20px;
	margin-bottom: 30px;
	}
	#advancedSearch .form-group .radio {
		margin-top:0;
	}
	#advancedSearch .form-group .checkbox {
		margin-top:0;
	}

.dashedLine {
    border-top: 1px dashed #ccc;
    display: block;
    margin: 20px 0;
}
	.dashedLine.first {
		display:none;
	}
	#advancedSearch .dashedLine.first {
		display:block;
	}
@media (max-width:767px) {
	.margin-bottomXS {
		margin-bottom:30px;
	}
}

/*--------------------------------------------------------------------------
         LIST GROUP
 (f.e. used to display searchresults + articles listings)
--------------------------------------------------------------------------*/
a.list-group-item {
    margin-bottom:0;
	background-color: #fff;
	border: 1px solid #fff;
	border-left-width:1px;
	border-radius:0!important;
	color:#555;
	}
	a.list-group-item:nth-of-type(2n+1) {
		background-color:#f0f7e7;
		border-color:#f0f7e7;
		}
	a.list-group-item .categoryIcon {
		color:#cbddb7;
		padding-right:15px!important;
		}
		a.list-group-item:hover .categoryIcon,
		a.list-group-item:focus .categoryIcon {
			color:#529011;
			}
		/* hover */			
		a.list-group-item:hover,
		a.list-group-item:focus {
			background-color:#fff;
			border-color:#67B516;
			color:#333;
			}
			a.list-group-item:nth-of-type(2n+1):hover,
			a.list-group-item:nth-of-type(2n+1):focus {
				background-color:#f0f7e7;
				border-color:#67B516;
				color:#333;
				}


	a.list-group-item h5 {
		font-weight:bold;
	}
	a.list-group-item .text-muted {
		color:#999999;
	}
		a.list-group-item:hover .text-muted,
		a.list-group-item:focus .text-muted {
			color:#777777;
		}
	
	/* read more link (articles list only) */
	#articles-main a.list-group-item .readMoreLink,
	#articles-all a.list-group-item .readMoreLink,
	#articles-category a.list-group-item .readMoreLink,
	#integration-main a.list-group-item .readMoreLink,
	#integration-all a.list-group-item .readMoreLink,
	#integration-category a.list-group-item .readMoreLink {
		color:#67B516;
		}
		#articles-main a.list-group-item:hover .readMoreLink,
		#articles-main a.list-group-item:focus .readMoreLink,
		#articles-all a.list-group-item:hover .readMoreLink,
		#articles-all a.list-group-item:focus .readMoreLink,
		#articles-category a.list-group-item:hover .readMoreLink,
		#articles-category a.list-group-item:focus .readMoreLink,
		#integration-main a.list-group-item:hover .readMoreLink,
		#integration-main a.list-group-item:focus .readMoreLink,
		#integration-all a.list-group-item:hover .readMoreLink,
		#integration-all a.list-group-item:focus .readMoreLink,
		#integration-category a.list-group-item:hover .readMoreLink,
		#integration-category a.list-group-item:focus .readMoreLink {
			color:#529011;
			}

/* INTEGRATION SEARCHRESULTS (using flex css, display logo if present else display category icon ) */
#integration-search-page a.list-group-item:nth-of-type(2n+1) {
	background-color:#f4f4f4;
	border-color:#f4f4f4;
	}
	/* hover*/
	#integration-search-page a.list-group-item:hover {
		background-color:#fff;
		border-color:#999;
		}
	#integration-search-page a.list-group-item:nth-of-type(2n+1):hover {
		background-color:#f4f4f4;
		border-color:#999;
		}
#integration-search-page .list-group-item .flexC {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items:center;
	}
	#integration-search-page .list-group-item .flexI {
		flex:0 1 auto;
		}
		#integration-search-page .list-group-item .flexI .fa,
		#integration-search-page .list-group-item:hover .flexI .fa,
		#integration-search-page .list-group-item:focus .flexI .fa {
			color:#999;
			}
	#integration-search-page .list-group-item .flexT {
		flex:0 1 auto;
		width:calc(100% - 220px);
		}
@media screen and (max-width:599px) {
	#integration-search-page .list-group-item .flexI {
		width:100%
		}
	#integration-search-page .list-group-item .flexT {
		flex:0 1 auto;
		width:100%;
		margin-top:10px;
		}
}

/*------------------------------
         PAGINATION
   (f.e. used on searchresults)
------------------------------*/
#pagination {
	text-align:right;
	border-top: 1px dashed #cccccc;
}
.pagination {
	margin-bottom:0;
}
	.pagination > li > a, 
	.pagination > li > span {
	    color:#999;
	    background-color: #fff;
	    border: 1px solid #ccc;
	}
		.pagination > li > a:hover,
		.pagination > li > span:hover,
		.pagination > li > a:focus,
		.pagination > li > span:focus {
		  z-index: 2;
		  color:#666;
		  background-color:#f7f7f7;
		  border-color:#ccc;
		}
	.pagination > .active > a,
	.pagination > .active > span,
	.pagination > .active > a:hover,
	.pagination > .active > span:hover,
	.pagination > .active > a:focus,
	.pagination > .active > span:focus {
	  background-color:#ccc;
	  border-color:#ccc;
	}

/*------------------------------
	  PAGE NAVIGATION
	     sibling
------------------------------*/
.sibling-navigation {
	margin-top:25px;
}
	.sibling-navigation a.siblingLink {
		color:rgba(103,181,22,0.5);
		display:inline-block;
	}
		.sibling-navigation a.siblingLink:hover,
		.sibling-navigation a.siblingLink:focus {
			color:rgba(103,181,22,0.9);
		}

/*------------------------------
	  TOOLTIP
------------------------------*/
.tooltip.top .tooltip-arrow {
    border-top-color: #777!important;
}

.tooltip.bottom .tooltip-arrow {
    border-bottom-color: #777!important;
}

.tooltip-inner {
    background-color: #777!important;
    color: #fff!important;
}
		
/*-----------------------------------------
	  ARTICLES + INTEGRATIONS - MAIN
 (see also settings for ListGroup, above)
------------------------------------------*/
#articles-main #content p,
#integration-main #content p {
	line-height:1.8;
	}
	#articles-main #content p.lead,
	#integration-main #content p.lead {
		line-height:1.4;
		}
h3.articlesSubhead,
h3.typesSubhead {
	margin-top:40px;
	margin-bottom:15px;
	}
.all-categories {
	margin-top:0;
	margin-bottom:30px;
	}
	.all-categories .well {
		box-shadow: 0 0 6px 1px rgba(0,0,0,.15);
		background-color: #fff;
		border-radius:0;
		border:0 none;
		padding:15px 5px 5px;
		margin-bottom:30px;
		}
		@media (max-width:479px) {
			#articles-main .all-categories .col-xs-6 {
				width:100%;
				}
				#articles-main .all-categories .well {
					max-width:400px;
					margin-left:auto;
					margin-right:auto;
					}
		}
		.all-categories .well a {
			display:block;
			}
			.all-categories .well a .fa {
				color:#eaeaea;
				}
				.all-categories .well a:hover .fa,
				.all-categories .well a:focus .fa {
					color:#67b516;
					}
			.all-categories .well a h4 {
				color:#999;
				text-align:center;
				margin-top:0;
				margin-bottom:0;
				padding:10px 0;
				}
				.all-categories .well a:hover h4,
				.all-categories .well a:focus h4 {
					color:#67b516;
					}

/* integrations only - XS devices lt 480px */
@media screen AND (max-width: 479px) {
	.highlightTypes .col-xs-6 {
		width:100%;
		}
		.highlightTypes .col-xs-6 .iLink {
			max-width:300px;
			}
}

/*---------------------------------
	  ARTICLES + INTEGRATION - all
---------------------------------*/
#articles-all #content p,
#integration-all #content p {
	line-height:1.8;
	}
	#articles-all #content p.lead,
	#integration-all #content p.lead {
		line-height:1.4;
		}
#articles-all  .row.showContent,
#integration-all  .row.showContent	{
	margin-top:40px;
	}

/* integrations only - XS devices lt 480px */
@media screen AND (max-width: 479px) {
	.rowTypes .col-xs-6 {
		width:100%;
		}
		.rowTypes .col-xs-6 .iLink {
			max-width:300px;
			}
}
			
/*------------------------------------------
	  ARTICLES + INTEGRATION - CATEGORY/TYPE
------------------------------------------*/
#articles-category #content p,
#integration-category #content p {
	line-height:1.8;
	}
	#articles-category #content p.lead,
	#integration-category #content p.lead {
		line-height:1.4;
		}
#articles-category  .row.showContent,
#integration-category  .row.showContent {
	margin-top:40px;
	}
	.all-categories.categoryMenu {
		margin-top:25px;
		}
		@media (min-width:992px) {
			.all-categories.categoryMenu {
				margin-top:0;
				}
		}
		.all-categories.categoryMenu .well {
			padding:10px 5px 5px;
			margin-bottom:20px;
			}
			@media (max-width:359px) {
				.all-categories.categoryMenu .col-xs-6 {
					width:100%;
					}
					.all-categories.categoryMenu .well {
						max-width:330px;
						margin-left:auto;
						margin-right:auto;
						}
			}
			.all-categories.categoryMenu .well a .fa {
				color:#ccc;
				}
				.all-categories.categoryMenu .well a:hover .fa,
				.all-categories.categoryMenu .well a:focus .fa {
					color:#999;
					}
			.all-categories.categoryMenu .well a h4 {
				font-size:14px;
				color:#999;
				}
				.all-categories.categoryMenu .well a:hover h4,
				.all-categories.categoryMenu .well a:focus h4 {
					color:#555;
					}
			/* active category */
			.all-categories.categoryMenu .well.active a .fa,
			.all-categories.categoryMenu .well.active a:hover .fa,
			.all-categories.categoryMenu .well.active a:focus .fa,
			.all-categories.categoryMenu .well.active a h4,
			.all-categories.categoryMenu .well.active a:hover h4,
			.all-categories.categoryMenu .well.active a:focus h4 {
				color:#67b516;
				}
/*----------------------------------
	  ARTICLES + INTEGRATION - PAGE
----------------------------------*/
#articles-page #content p,
#integration-page #content p {
	line-height:1.8;
	}
	#articles-page #content p:first-child,
	#integration-page #content p:first-child {
		margin-top:10px;
		}
	#articles-page #content p.lead,
	#integration-page #content p.lead {
		line-height:1.4;
		}
.all-categories.catHB {
		margin-top:15px;
		}
@media (max-width:991px) {
	.all-categories.catHB {
		margin-top:40px;
		}
}
	.all-categories.catHB .well {
		padding:10px 5px 5px;
		margin-bottom:20px;
		}
		@media (max-width:359px) {
			.all-categories.catHB .col-xs-6 {
				width:100%;
				}
				.all-categories.catHB .well {
					max-width:330px;
					margin-left:auto;
					margin-right:auto;
					}
		}
		.all-categories.catHB .well a .fa {
			color:#ccc;
			}
			.all-categories.catHB .well a:hover .fa,
			.all-categories.catHB .well a:focus .fa {
				color:#999;
				}
		.all-categories.catHB .well a h4 {
			font-size:14px;
			color:#999;
			}
			.all-categories.catHB .well a:hover h4,
			.all-categories.catHB .well a:focus h4 {
				color:#555;
				}
		/* active category */
		.all-categories.catHB .well.active a .fa,
		.all-categories.catHB .well.active a:hover .fa,
		.all-categories.catHB .well.active a:focus .fa,
		.all-categories.catHB .well.active a h4,
		.all-categories.catHB .well.active a:hover h4,
		.all-categories.catHB .well.active a:focus h4 {
			color:#67b516;
			}
			
	/* images inside body field */
	#articles-page .content.main  figure,
	#integration-page .content.main  figure,
	#integration-codeblokken-instructie .content.main figure {
		max-width:100%;
		height:auto;
		margin:30px auto 20px 0;
		}
		#articles-page .content.main figure img,
		#integration-page .content.main figure img,
		#integration-codeblokken-instructie .content.main figure img {
			display:block;
			max-width: 100%;
			height: auto;
			margin-top:0;
			margin-bottom:0;
			}
		
		#articles-page .content.main img,
		#integration-page .content.main img,
		#integration-codeblokken-instructie .content.main img {
			display: block;
			margin: 30px auto 20px 0;
			max-width: 100%;
			height: auto;
			}
		#articles-page .content.main figure figcaption,
		#integration-page .content.main figure figcaption,
		#integration-codeblokken-instructie .content.main figure figcaption {
			font-size:0.8em;
			color:#777777;
			font-style:italic;
			margin-bottom:10px;
			}
		/* centered image, put img tag inside div with class 'text-center' */
		#articles-page .content.main .text-center img,
		#integration-page .content.main .text-center img,
		#integration-codeblokken-instructie .text-center .content.main img {
			display: block;
			margin: 30px auto 20px auto;
			max-width: 100%;
			height: auto;
			}

/*-----------------------------------------
	  INTEGRATIONS - MAIN
------------------------------------------*/
.iLink {
	margin: 0 auto 30px;
	padding: 20px;
	background: #fff;
	text-align: center;
	text-decoration: none !important;
	display: block;
	box-shadow: 0 0 5px 1px rgba(0,0,0,.15);
	transition: all .3s linear;
	cursor: pointer;
	border:1px solid #fff;
	}
	.iLink:hover {
		border-color:#67b516;
		box-shadow: 0 0 5px 1px rgba(103,181,22,1.0);
		}	
		
	.iLogo .img-responsive {
		padding-top:1.5px;
		padding-bottom:1.5px;
		width:100%;
		height:70px;
		object-fit:contain;
		object-position:center;
		}
	.iLogoNoImage .fa {
		color:#999;
		opacity:0.5;
	}
	.iLink h3 {
		font-size: 18px;
		margin-top: 10px;
		margin-bottom: 0;
		color:#67b516!important;
		}

/*-----------------------------------------
	  INTEGRATIONS - Extra mogelijkheden
------------------------------------------*/
.extraItems {
	margin-top:5px;
	margin-bottom:0;
	}
	.extraItem {
		margin-bottom:20px;
		}
		.extraItem h4 {
			margin-bottom:2px;
			}
			.extraContent p {
				margin-top:0!important;
				}

/*-----------------------------------------
	  INTEGRATIONS - Notes
------------------------------------------*/
.notes {
	margin-top:10px;
	}
	.notes .media {
	    border:1px solid transparent;
	    border-left-width: 5px;
	    padding: 15px;
	    display:block;
		}
		.notes .media.alert-default {
			background-color: #f0f7e7;
			border-left-color:#67b516;
			color:#67b516;
			}
			.notes .media.alert-default:hover {
				background-color: #fff;
				border-color: #67b516;
				color:#67b516;
				}
		.notes .media.alert-info {
			background-color:#d9edf7;
			border-left-color:#5bc0de;
			color:#5bc0de;
			}
			.notes .media.alert-info:hover {
				background-color: #fff;
				border-color: #5bc0de;
				color:#5bc0de;
				}

			.notes .media .media-body p {
				line-height: 1.42857143;
				}
			.notes .media .media-body p:first-child {
		    	margin-top: 0!important;
				}
			.notes .media .media-body p:last-child {
		    	margin-bottom: 0;
				}

/*-----------------------------------------
	  INTEGRATIONS - Categories Navigation
------------------------------------------*/
/* right Nav (all + category, for XS devices we use the settings for the bottomNav below) */
.typesNavigation {
	text-align:left;
	margin-bottom: 40px;
	}
	.typesNavigation .categoryLinks {
		display: block;
		padding: 10px 0;
		border-bottom: 1px solid #999;
		color: #777!important;
		}
		.typesNavigation .categoryLinks:hover,
		.typesNavigation .categoryLinks:focus {
			color:#333!important;
			}
			.typesNavigation .categoryLinks.active {
				color:#67b516!important;
				}
		@media screen and (min-width:992px) and (max-width:1199px) {
			.typesNavigation .categoryLinks {
				font-size:13px;
				}
		}
		.typesNavigation .categoryLinks:first-child {
			border-top:1px solid #999;
			}
@media screen and (max-width:767px) {
	.typesNavigation {
		margin-bottom: 40px;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin-top: 30px;
		}
		.typesNavigation .categoryLinks {
			margin:5px;
			padding: 5px 10px;
			border: 1px solid #999;
			color: #777 !important;
			flex: 0 1 auto;
			width:calc(50% - 20px);
			}
			.typesNavigation .categoryLinks:hover,
			.typesNavigation .categoryLinks:focus {
				color:#333!important;
				border-color:#777;
				}
				.typesNavigation .categoryLinks.active {
					color:#67b516!important;
					border-color:#67b516!important;
					}	
}
@media screen and (max-width:520px) {
	.typesNavigation .categoryLinks {
		width:80%;
		}
}
/* bottom Nav (used on integration page) */
.categoryBottomNav {
	margin-bottom: 40px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 30px;
	}
	.categoryBottomLinks {
		margin:5px;
		padding: 5px 10px;
		border: 1px solid #999;
		color: #777 !important;
		flex: 0 1 auto;
		}
		.categoryBottomLinks:hover,
		.categoryBottomLinks:focus {
			color:#333!important;
			border-color:#777;
			}
			.categoryBottomLinks.active {
				color:#67b516!important;
				border-color:#67b516!important;
				}
	@media screen and (max-width:767px) {
		.categoryBottomLinks {
			width:calc(50% - 20px);
			}
	}
	@media screen and (max-width:520px) {
		.categoryBottomLinks {
			width:80%;
			}
	}

/*-----------------------------------------
	          FAQ
https://codepen.io/johnhubler/pen/bGpMYwq
------------------------------------------*/
.faqSection {
	margin-top:50px;
	}
	.faqSection h1 {
		font-size: 30px;
		color: #67b516;
		}
		#home-page .faqSection h1 {
			color:#333;
		}
	.accordion-list {
		margin:20px 0 40px;
		}
		.accordion-list .faqItem {
			padding: 0;
			margin: 0 auto;
			border-bottom: 1px solid rgba(0,0,0,0.1);
			cursor: pointer;
			}
			.accordion-list .faqItem:last-child {
				border-bottom-color:transparent;
				}	
			.accordion-list .faqItem.active h2:after {
				transform: rotate(45deg);
				}			
			.accordion-list .faqItem h2,
			#home-page #section-faq .accordion-list .faqItem h2 {
			font-weight: 500;
			position: relative;
			padding: 20px 16px 20px 0;
			margin: 0;
			font-size: 16px;
			letter-spacing: 0.01em;
			cursor: pointer;
			}
			.accordion-list .faqItem h2:after {
				content: "\f067";
				font-family: "FontAwesome";
				position: absolute;
				right: 0;
				top: 20px;
				color: rgba(0,0,0,0.15);
				transition: all 0.3s ease-in-out;
				font-size: 18px;
				}
			.accordion-list .faqItem.active h2,
			#home-page #section-faq .accordion-list .faqItem.active h2 {
				padding-bottom:0;
				}
			
			.answer {
				width: 100%;
				height: auto;
				margin: 0;
				padding: 0;
				cursor: pointer;
				}
			.answer .faqAnswer {
				font-weight: 300;
				padding: 10px 0 0 0;
				cursor: pointer;
				line-height: 150%;
				margin: 0 0 15px 0;
				font-size: 14px;
				}
/* custom coloredstars in faq answer about techniques */
.answer .faqAnswer .fa-star {
	color:#999;
}
/*-----------------------------------------
	  TRUNCATE TEXT + Read More/Less link
------------------------------------------*/
.read-more {
	position:relative;
	}
	.read-more::before {
		content: '';
		position: absolute;
		left: 0px;
		right: 0;
		bottom: 5px;
		height: 30px;
		background: linear-gradient(to bottom, rgba(240,249,255,0) 0%, rgba(255,255,255,1) 100%);
		z-index: 1;
		}
		.read-more.expanded::before {
			content: '';
			position: absolute;
			left: 0px;
			right: 0;
			bottom: 20px;
			height: 30px;
			background: transparent;
			z-index: 1;
			}
	.read-more__link {
		text-align: center;
		white-space: nowrap;
		vertical-align: middle;
		-ms-touch-action: manipulation;
		touch-action: manipulation;
		cursor: pointer;
		user-select: none;
		background-image: none;
		border: 1px solid transparent;
		padding: 1px 5px;
		font-size: 12px;
		line-height: 1.5;
		border-radius: 3px;
		color: #555555 !important;
		background-color: #ffffff;
		border-color: #cccccc;
		}
		.read-more__link:hover,
		.read-more__link:focus {
			color: #555555 !important;
			background-color: #e6e6e6;
			border-color: #adadad;
			}

/*-----------------------------------------
	  TESTIMONIALS
------------------------------------------*/
#testimonial-page .clientQuote {
	margin-top:50px;
	}
	#testimonial-page .clientQuote blockquote {
		border-left-color: #67b516;
  		background-color: rgb(from #67b516 r g b / 0.15);
		}

/*****************************************/
[lang=nl] .showOtherLangs {
	display: none;
}

[lang=en] .showOnlyDutch,
[lang=da] .showOnlyDutch,
[lang=de] .showOnlyDutch,
[lang=es] .showOnlyDutch,
[lang=fr] .showOnlyDutch,
[lang=pt] .showOnlyDutch,
[lang=sv] .showOnlyDutch{
	display: none;
}
