/**************************************************************************** 
 * teqa.css (used instead of default main.css, including bootstrap overrides)
 * COLORPALETTE: https://www.color-hex.com/color-palette/104245
 ***************************************************************************/
 
 /************************************* CUSTOM FONTS *****************************************/
@font-face {
    font-family: 'clioblack-black';
    src: url('../fonts/clioblack-black-webfont.eot');
    src: url('../fonts/clioblack-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/clioblack-black-webfont.woff') format('woff'),
         url('../fonts/clioblack-black-webfont.ttf') format('truetype'),
         url('../fonts/clioblack-black-webfont.svg#clioblack-blackuploaded_file') format('svg');
    font-weight: normal;
    font-style: normal;
	}
@font-face {
    font-family: 'clioboldoblique-bold';
    src: url('../fonts/clioboldoblique-bold-webfont.eot');
    src: url('../fonts/clioboldoblique-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/clioboldoblique-bold-webfont.woff') format('woff'),
         url('../fonts/clioboldoblique-bold-webfont.ttf') format('truetype'),
         url('../fonts/clioboldoblique-bold-webfont.svg#clioboldoblique-buploadedfile') format('svg');
    font-weight: normal;
    font-style: normal;
	}
@font-face {
    font-family: 'cliosemibold-semibold';
    src: url('../fonts/cliosemibold-semibold-webfont.eot');
    src: url('../fonts/cliosemibold-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/cliosemibold-semibold-webfont.woff') format('woff'),
         url('../fonts/cliosemibold-semibold-webfont.ttf') format('truetype'),
         url('../fonts/cliosemibold-semibold-webfont.svg#cliosemibold-semiuploadedfile') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'cliosemiboldoblique-semibold';
    src: url('../fonts/cliosemiboldoblique-semibold-webfont.eot');
    src: url('../fonts/cliosemiboldoblique-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/cliosemiboldoblique-semibold-webfont.woff') format('woff'),
         url('../fonts/cliosemiboldoblique-semibold-webfont.ttf') format('truetype'),
         url('../fonts/cliosemiboldoblique-semibold-webfont.svg#cliosemiboldobliquploadedfile') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'clioregularoblique';
    src: url('../fonts/clioregularoblique-webfont.eot');
    src: url('../fonts/clioregularoblique-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/clioregularoblique-webfont.woff') format('woff'),
         url('../fonts/clioregularoblique-webfont.ttf') format('truetype'),
         url('../fonts/clioregularoblique-webfont.svg#clioregularobliquuploadedfile') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proxima_nova_regular';
    src: url('../fonts/proximanova-regular-webfont.eot');
    src: url('../fonts/proximanova-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/proximanova-regular-webfont.woff') format('woff'),
         url('../fonts/proximanova-regular-webfont.ttf') format('truetype'),
         url('../fonts/proximanova-regular-webfont.svg#proxima_nova_rgregular') format('svg');
    font-weight: normal;
    font-style: normal;
	}
@font-face {
    font-family: 'proxima_nova_bold';
    src: url('../fonts/proximanova-bold-webfont.eot');
    src: url('../fonts/proximanova-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/proximanova-bold-webfont.woff') format('woff'),
         url('../fonts/proximanova-bold-webfont.ttf') format('truetype'),
         url('../fonts/proximanova-bold-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proxima_novaregular_italic';
    src: url('../fonts/proximanova-regitalic-webfont.eot');
    src: url('../fonts/proximanova-regitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/proximanova-regitalic-webfont.woff') format('woff'),
         url('../fonts/proximanova-regitalic-webfont.ttf') format('truetype'),
         url('../fonts/proximanova-regitalic-webfont.svg#proxima_novaregular_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
/************************************* /CUSTOM FONTS *****************************************/
 
 body {
	background-color:#00202e;
	font-family: 'proxima_nova_regular',Arial,sans-serif;
	font-size:18px;
	line-height:22px;
	color: #ffffff;
	}
	@media only screen and (max-width: 599px) { /* breakpoint, only needed for extra small tablets and below  */
		body {
			font-size:16px;
			line-height:20px;
			}
	}
	
	h1, h2, h3, h4, h5, h6 {
	font-family:'clioboldoblique-bold', Verdana,sans-serif;
	font-weight:normal;
	line-height:1.1em;
	}
	h1, h2	{
		font-size:48.62px;
		/*line-height:2em;*/
		color:#ffffff;
		}
		@media only screen and (max-width: 991px) { /* breakpoint, only needed for small desktops + tablets  */
			h1, h2 {
				font-size:40px;
				/*line-height:1.4em;*/
				margin-bottom:12px;
				}
		}
		@media only screen and (max-width: 767px) { /* breakpoint, only needed for extra small tablets and below  */
			h1, h2 {
				font-size:30px;
				/*line-height:1.4em;*/
				margin-bottom:6px;
				}
		}

			
/*---------------------------------------------------------------------
                          MENUBAR
       fixed menubar met slide menu, language flags + logo + CTA button

------------------------------------------------------------------------*
/*** HEADER MENUBAR ***/
header #menuBar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height:90px;
    z-index: 999;
    background-color:rgba(10,52,74,.85);
    padding-top:17px;
    opacity:1;
    -webkit-transition: all .3s ease;
	transition: all .3s ease;
    }
    /* HOMEPAGE ONLY - see Video Trigger Button functions + scoll function */
    .hideMenuBar header #menuBar.playedFull {
    	display:none;
    	}
    /* see $(window).scroll(function() */ 
    header #menuBar.customized {
        background-color:transparent;
        }            
		header .selectLanguage {
			margin-top: 15px;
			}
			/* if slidemenu is expanded, the background of the menubar is always transparant, the scrollposition is not important in this case */ 
			header #menuBar.onOpen {
				background-color:transparent!important;
				}
				#menuBar .menuIcon {
					padding-top:12px;
					}
					/* SLIDE MENU */
					/* https://www.w3schools.com/howto/howto_js_sidenav.asp */
					.openMenuIcon {
						cursor:pointer;
						color: #fff!important;
						font-size:32px!important;
						position:relative;
						top:4px;
						}
					.sidenav {
						height:100%;
						width:0;
						position:fixed;
						z-index:99999;
						top:0;
						left:0;
						/*background-color:rgba(255,255,255,0.25);*/
						overflow-x:hidden;
						transition:width 0.5s ease;
						-webkit-transition:width 0.5s ease;
						}
						#slideMenu {
							background: #ffffff;
							-webkit-box-shadow: 0 0 4px 0 rgba(0,0,0,.25);
							box-shadow: 0 0 4px 0 rgba(0,0,0,.255);
							color: #00202e;
							height:100%;
							width:100%;
							max-width:370px;
							overflow:auto;
							display:flex;
							flex-direction:column;
							align-items:center;
							padding:5px 15px 30px;
							}
							#slideMenu .slideTop {
								flex: 0 1 auto;
								display: flex;
								width:100%;
								position:relative;
								margin-bottom:20px;
								}
								#slideMenu .slideTop .logoLink {
									max-width:150px;
									margin-left:auto;
									margin-right:auto;
									}
									#slideMenu .slideTop .closebtn {
										position:absolute;
										right:-15px;
										font-size:32px!important;
										padding: 15px;
										color:rgba(0,32,46,0.5)!important;
										transition:color 0.3s;
											-webkit-transition:0.3s;
										}
										#slideMenu .slideTop .closebtn:hover {
											color:rgba(0,32,46,1.0)!important;
											text-decoration:none!important;
											}
							#slideMenu .slideNav {
								flex: 0 1 auto;
								width:100%;
								margin-bottom:20px;
								}
								#slideMenu .slideNav .locationsDropdown {
									width:100%;
									}
									.locationsDropdown .dropdown-toggle,
									.locationsDropdown.open .dropdown-toggle {
										border: 0 none;
										background-color: transparent !important;
										box-shadow: none !important;
										-webkit-box-shadow: none !important;
										font-family: 'proxima_nova_regular',Arial,sans-serif;
										text-transform:uppercase;
										border: 0 none;
										color: rgba(0,32,46,0.75) !important;
										transition: color 0.3s;
										-webkit-transition: 0.3s;
										}
										.locationsDropdown .dropdown-toggle:hover,
										.locationsDropdown.open .dropdown-toggle:hover {
											color:rgba(0,32,46,1.0)!important;
											}
								#slideMenu .slideNav .nav-pills.nav-stacked {
									text-align:center;
									}
									#slideMenu .slideNav .dropdown-menu {
										position:relative;
										min-width:100%;
										background-color:transparent;
										border: 0 none;
										border-radius: 0;
										}
										#slideMenu .slideNav .dropdown-menu a {
											font-size:16px!important;
											text-transform:none!important;
											padding:5px 30px;
											}
										/* flex css settings for location dropdown, including nice transform animation for the dropdown carret */
										#slideMenu .slideNav .locationsDropdown.open .dropdown-menu {
											display:flex;
											flex-wrap:wrap;
											margin-bottom:15px;
											}
											#slideMenu .slideNav .locationsDropdown.open .dropdown-menu li {
												flex:0 1 auto;
												width:170px;
												}
												#slideMenu .slideNav .locationsDropdown.open .dropdown-menu li a {
													padding:5px 15px;
													}
										#slideMenu .slideNav .locationsDropdown .dropdown-toggle .fa {
											transition: all 0.2s ease-in-out;
											}
											#slideMenu .slideNav .locationsDropdown.open .dropdown-toggle .fa {
												transform: rotate(180deg);
											  }
								#slideMenu .slideNav a,
								#slideMenu .slideNav .parentlink.active .dropdown-menu a {
									background-color:transparent!important;
									padding:8px 15px;
									text-decoration:none;
									font-size:18px;
									text-transform:uppercase;
									color:rgba(0,32,46,0.75)!important;
									display:block;
									transition:color 0.3s;
									-webkit-transition:0.3s;
									}                    
									#slideMenu .slideNav a:hover,
									#slideMenu .slideNav .parentlink.active .dropdown-menu a:hover,
									#slideMenu .slideNav .active a,
									#slideMenu .slideNav .active a:hover,
									#slideMenu .slideNav .parentlink.active .dropdown-menu .active a,
									#slideMenu .slideNav .parentlink.active .dropdown-menu .active a:hover {
										background-color:transparent!important;
										color:rgba(0,32,46,1.0)!important;
										text-decoration:none!important;
										}
							
							#slideMenu .slideBottom {
								flex:0 1 auto;
								margin-top:auto;
								display:flex;
								justify-content: center;
								}
								#slideMenu .slideBottom .socialIcon,
								#footer .footerLeft .socialIcon,
								.socialIconsFranchise .socialIcon {
									color:#ffffff;
									font-size:28px;
									text-align:center;
									background-color:rgba(0,0,0,0.5);
									display:inline-block;
									height:42px;
									width:42px;
									padding:7px 0;
									border-radius:50%;
									-moz-border-radius:50%;
									-webkit-border-radius:50%;
									margin:5px;
									}
									/* color setting per icon */
									.socialIcon.facebook {
										background-color:#3B5998!important;
										}
									.socialIcon.twitter {
										background-color:#5EA9DD!important;
										}
									.socialIcon.instagram {
										background:linear-gradient( #400080, transparent), linear-gradient( 200deg, #d047d1, #ff0000, #ffff00)!important;
										}
									.socialIcon.pinterest {
										background-color:#EA1514!important;
										}
									.socialIcon.youtube {
										background-color:#C1191E!important;
										}
							
			/*** LANGUAGE FLAGS ****/
			header .languageswitcher {
				font-size:16px;
				font-family:Helvetica, Arial;
				}
				.languageswitcher .currentLang {
					cursor:pointer;
					color:#fff;
					margin-left:12px;
					}
					.languageswitcher .currentLang.onlyNL {
						cursor:default;
						}
					.languageswitcher .currentLang .fa {
						font-size:16px!important;
						margin-left:5px;
						}
				.languageswitcher .dropdown-menu {
					background-color: #00202e;
					min-width: 100px;
					border-radius: 0;
					-webkitborder-radius: 0;
					margin-top: 5px;
					}
					.languageswitcher .dropdown-menu .languageflag {
						padding:5px 12px;
						color:#fff;
						line-height:24px;
						font-size:16px;
						}
						.languageswitcher .dropdown-menu .languageflag:hover,
						.languageswitcher .dropdown-menu .languageflag:focus {
							background-color:transparent;
							color:#fff;
							}
				.languageswitcher .img-rounded {
					margin-right:8px;
					height:24px;
					border-radius:0;
					-webkit-border-radius:0;
					-webkit-transition: all .3s linear;
					transition: all .3s linear;
					}

/* in the dropdown Book Now + Locations we show a small NL flag is page isn't acytive in the current language */
.smallFlag {
	width: 20px;
	display: inline-block;
	}

/*-------------------------------------------------------
      BOOK NOW BUTON WITH MULTICOLUMN SCROLLABLE DROPDOWN
  			direct links to booking pages
-------------------------------------------------------*/
@media screen and (max-width:575px) {
	#menuBar .neon-btn {
		padding:7.5px 10px;
		margin-top:7.5px;
		}
}
@media screen and (max-width:459px) {
	#menuBar .neon-btn {
		font-size:12px;
		}
}
.franchiseBookingPages {
	right:15px;
	font-size: 16px;
	min-width: 176px;
	background-color: #ff7e4b;
	height: auto;
    max-height: 90vh;
	overflow: auto;
	display: none;
	width: auto;
	min-width: 310px;
	border: 0 none;
	}
	@media screen and (max-width:339px) {
		.franchiseBookingPages {
			right:5px;
			}
	}
	.open .franchiseBookingPages {
		display: flex !important;
		flex-wrap: wrap;
		}
	.franchiseBookingPages li {
		flex: 0 1 auto;
		width: 155px;
		}
		.franchiseBookingPages li a {
			padding:5px 3px 5px 7px;
			}
			.franchiseBookingPages li a:hover,
			.franchiseBookingPages li a:focus {
				color:#000;
				font-weight: bold;
				background-color:transparent;
				}
/*------------------------------
	  HEADER VIDEO
		startpage
------------------------------*/
.header-video {
	position: relative;
	overflow: hidden;
	max-height: 80vh;
	transition: max-height .3s;
	-webkit-transition: max-height .3s;
	}
	.header-video.playedFull {
		max-height: 100vh;
		}
  
  .header-video iframe,
  .header-video video {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	  }
  
  .header-video iframe {
	height: 100%;
	width: 100%;
	  }
  
  .header-video video {
	width: 100%;
	  }
  
  .header-video__teaser-video {
	width: 100%;
	height: auto; 
	  }
  
  .header-video__media {
	width: 100%;
	height: auto;
	  }
  
  #landing-page #customContentVideoHeader {
	  z-index: 5;
	  position: absolute;
	  /*text-align: center;
	  left: 50%;
	  top: 50%;
	  -webkit-transform: translate(-50%, -50%);
	  transform: translate(-50%, -50%);*/
	  left: 10px;
	  bottom: 10px;
	  width:100%;
	  padding:15px;
	  }
	  #landing-page #customContentVideoHeader.playedFull {
		z-index: -99;
		padding:0;
		}
  
  .header-video__play-trigger {
	background: rgba(227,6,19,.25);
	text-align: center;
	color: white!important;
	text-decoration: none;
	padding: 1.5em 3em;
	border-radius: 10px;
	-webkit-transition: background .5s;
	transition: background .5s;
	text-transform:uppercase;
	display: inline-block;
	margin-top:15px;
	}
	.header-video__play-trigger:hover {
		background: rgba(227,6,19,.75);
		text-decoration:none;
		}
	@media screen and (max-width:1199px) {		
		#landing-page #logoBig {
			max-width:225px;
			}
		.header-video__play-trigger {
			padding: 1em 2em;
			font-size:16px;
			}
	}
	@media screen and (max-width:991px) {		
		#landing-page #logoBig {
			max-width:200px;
			}
		.header-video__play-trigger {
			padding: 1em 2em;
			font-size:15px;
			}
	}	
	@media screen and (max-width:666px) {
		#landing-page #customContentVideoHeader {
			padding:0;
			}
			#landing-page #logoBig {
				max-width:120px;
				}
			.header-video__play-trigger {
				padding: 0.75em 1.5em;
				font-size:14px;
				}
	}
  
  /**
	Just some basic styling for the closing trigger
  **/
  
  .header-video__close-trigger {
	  z-index: 99;
	  position: absolute;
	  background: rgba(227,6,19,.6);
	  text-align: center;
	  color: white;
	  text-decoration: none;
	  padding: 0.75em 1.5em;
	  border-radius: 10px;
	  right: 15px;
	  top: 65px;
	  -webkit-transition: background .3s;
	  -moz-transition: background .3s;
	  transition: background .3s;  
	  border: none;
	  text-transform:uppercase;
	  }
	  .header-video__close-trigger:hover {
		  background: rgba(227,6,19,1.0);
		  cursor: pointer;
		  }
	  @media screen and (max-width:567px) {
		  .header-video__close-trigger {
			  font-size:10px;
			  padding: 0.5em 1.0em;
			  }
	  }
	  @media screen and (max-width:513px) {
		  .header-video__close-trigger {
			  top:45px;
			  }
	  }

/*------------------------------
	  HEADER STATIC IMAGE
	  	with GG logo
------------------------------*/
header .static-header-image {
	min-height:550px;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	display: flex;
	flex-direction: column;
	-moz-box-pack: center;
	justify-content: center;
	align-items: center;
	padding:0 15px;
	}
	@media screen and (min-width:1400px) {
		header .static-header-image {
			min-height:650px;
			}
	}
	@media screen and (min-width:1600px) {
		header .static-header-image {
			min-height:750px;
			}
	}
	header .static-header-image h1 {
		font-family: 'clioblack-black','Verdana';
		font-size: 80px;
		line-height: 1.1em;
		color: #ffffff;
		font-weight: normal;
		margin: 0 0 10px;
		text-shadow: 3px 3px 1px rgba(0, 0, 0, 0.75);
		}
		#vestiging-page header .static-header-image h1,
		#combis-page header .static-header-image h1,
		#combi-page header .static-header-image h1 {
			margin: auto 0 10px;
			}
			#vestiging-page header .static-header-image h1.noSocial,
			#combis-page header .static-header-image h1.noSocial,
			#combi-page header .static-header-image h1.noSocial {
				margin: 0 0 10px;
				}
		header .static-header-image .bigLogo {
			max-width:250px;
			}			
			@media screen and (max-width:1199px) {
				header .static-header-image .bigLogo {
					max-width:200px;
					}
			}
			@media screen and (max-width:767px) {
				header .static-header-image h1 {
					font-size:70px;
					}
			}
			@media screen and (max-width:576px) {
				header .static-header-image h1 {
					font-size:60px;
					}
				header .static-header-image .bigLogo {
					max-width:170px;
					}
			}
			@media screen and (max-width:420px) {
				header .static-header-image .bigLogo {
					max-width:150px;
					}
			}

/*------------------------------
	    BREADCRUMB
------------------------------*/
#breadcrumb {
	background-color:#0a344a;
	}
	.breadcrumb	{
		font-size:12px;
		background-color:transparent;
		color:#9fafbf;
		padding-left:0;
		padding-right:0;
		margin-bottom:0;
		}
		.breadcrumb a,
		.breadcrumb a:link,
		.breadcrumb a:visited{
			color:#9fafbf;
			}
			.breadcrumb a:hover{
				color:#03e9f4;
				text-decoration:none;
				}
			.breadcrumb li.active {
				color:#cfd7df;
				}

/*------------------------------
	    SIDEBAR
------------------------------*/
.sidebar {
	padding-top:52px;
	padding-bottom:30px;
	}
	.sidebar .well {
		background-color:#E6E6E6;
		border:1px solid #CFCFCF;
		color:#6a6a6a;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
		padding:30px 20px;
		margin-bottom:20px;
		-webkit-border-radius:0;
		-moz-border-radius:0;
		border-radius:0;
		}
		.sidebar .well h3 {
			font-size:24px;
			line-height:1.5em;
			margin-top:0;
			margin-bottom:12px;
			color:#373737;
			}
		.sidebar .well a,
		.sidebar .well a:visited {
			color:#6a6a6a;
			font-size:16px;
			}
			.sidebar .well a .glyphicon,
			sidebar .well a .glyphicon:visited {
				color:#178C61;
				}
				
	@media (min-width:768px) and (max-width:991px) { /* breakpoint, only needed for small desktops + tablets  */
		.sidebar {
			padding-top:35px;
			padding-bottom:30px;
			}
			.sidebar .well h3 {
					font-size:20px;
					line-height:1.2em;
					}
			.sidebar .well p {
				font-size:17px;
				line-height:21px;
				}
			.sidebar .well a {
				font-size:14px; /* needed to fit long mail adresses */
				}
	}
	@media (max-width: 767px) { /* breakpoint, only needed for small tablets and below, to be exact: where the aside is placed beneath the content  */
		.sidebar {
			padding:30px 15px 0;
			}
	}
	.sidebar .well:last-child {
			margin-bottom:0;
			}
			
	/* green and blue variant sidebar block */
	.sidebar .well.green {
		background:url("../images/videotrigger-background.png") repeat scroll 0 0 #106143;
		border:1px solid #106143;
		color:#ffffff;
		}
	.sidebar .well.blue {
		background-color:#3BA7C2;
		border:1px solid #3596ae;
		color:#ffffff;
		}
		.sidebar .well.green h3,
		.sidebar .well.blue h3 {
			font-family:'clioblack-black',Verdana,sans-serif;
			font-size:30px;					
			}
		.sidebar .well.green p,
		.sidebar .well.blue p {
			font-size:20px;
			line-height:26px;
			}
		.sidebar .well.green h3,
		.sidebar .well.green p,
		.sidebar .well.green a,
		.sidebar .well.green a:visited,
		.sidebar .well.blue h3,
		.sidebar .well.blue p,
		.sidebar .well.blue a,
		.sidebar .well.blue a:visited {
			color:#ffffff;
			}
			.sidebar .well.green a.btn-link,
			.sidebar .well.blue a.btn-link {
				padding:6px 0;
				}
				.sidebar .well.green a.btn-link:hover,
				.sidebar .well.green a.btn-link:focus,
				.sidebar .well.blue a.btn-link:hover,
				.sidebar .well.blue a.btn-link:focus {
					text-decoration:none;
					}
	@media (min-width:768px) and (max-width:991px) { /* breakpoint, only needed for small desktops + tablets  */
		.sidebar .well.green h,
		.sidebar .well.blue h3 {
				font-size:24px;
				}
		.sidebar .well.green p,
		.sidebar .well.blue p {
			font-size:18px;
			line-height:22px;
			}
		.sidebar .well.green a,
		.sidebar .well.blue a {
			font-size:18px; 
			}
	}
	
/*------------------------------
	    FOOTER
------------------------------*/			
#footer {
	background-color: #00202e;
	background-image:none;
	border-top: 0 none;
	border-radius:0;
	color:#ffffff;
	padding:55px 0 15px;
	font-family:'proxima_nova_regular',Arial,sans-serif;
	font-size:17px;
	line-height:24px;
	}
	#footer .footerLeft .logoLink {
		display:block;
		max-width:150px;
		margin:-8px 0 20px;
		}
	#footer .footerNav {
		display: flex;
		flex-wrap: wrap;
		}
		#footer .footerNav .btn-locations,
		#footer .footerNav .footerLink {
			flex: 0 1 auto;
			width: 100%;
			padding: 5px 0;
			text-align: right;
			font-family: 'proxima_nova_regular',Arial,sans-serif;
			color: #fff;
			text-transform: uppercase;
			text-decoration: none;
			}
	
	#footer .footer-bottom {
		border-top:1px solid #365972;
		margin:10px 0 0;
		padding:15px 0 0;
		font-size:13px;
		color:#365972;
		}
		#footer .footer-bottom .genericLinks {
			display:flex;
			}
			#footer .footer-bottom .genericLink,
			#footer .footer-bottom .genericLink:visited {
				flex:0 1 auto;
				padding:0 10px;
				border-right: 1px solid #365972;
				color: #365972 !important;
				}
				#footer .footer-bottom .genericLink:hover {
					color: #ffffff !important;
					}
			#footer .footer-bottom .genericLink:first-child {
				padding-left:0;
				}
			#footer .footer-bottom .genericLink:last-child {
				border:0 none;
				}
		#footer .footer-bottom .copyright {
			text-align:right;
			color:#365972;
			}
	
	@media only screen and (max-width: 767px) {
		#footer .footerLeft {
			text-align:center;
			}
			#footer .footerLeft .logoLink {
				margin:-8px auto 20px;
				}
		#footer .footerNav {
			margin-top:20px;
			}
			#footer .footerNav .btn-locations,
			#footer .footerNav .footerLink {
				text-align:center;
				}
		#footer .footer-bottom .genericLinks {
			justify-content: center;
			margin-bottom:8px;
			}
		#footer .footer-bottom .copyright {
			text-align:center;
			}
	}
	@media only screen and (max-width: 460px) {
		#footer .footer-bottom .genericLinks {
			flex-wrap:wrap;
			text-align: center;
			margin-bottom:15px;
			}
			#footer .footer-bottom .genericLink {
				width:100%;
				padding:0;
				border-right:0 none;
			}
	}

/*------------------------------
	    ADMIN BAR
------------------------------*/			
#footer-admin {
	padding: 10px 0;
	}
	#footer-admin .list-inline li:last-child {
		padding-right:0;
		}
@media only screen and (max-width: 767px) {
	#footer-admin .col-sm-12.text-right {
		text-align:center;
		}
}
		
/*------------------------------
	    BUTTONS
------------------------------*/
.btn	{
	background-image:none;
	text-shadow:none;
	font-family: 'proxima_nova_bold',Arial,sans-serif;
	font-size:18px;
	line-height:20px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	box-shadow:none;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	}
	.btn:hover,
	.btn:focus {
		text-shadow:none;
		box-shadow:none;
		-webkit-box-shadow:none;
		-moz-box-shadow:none;
		}
.btn-large {padding:9px 20px;}

.btn-xs {
	font-family:"proxima_nova_regular",Arial,sans-serif;
	font-size:12px;
	line-height:1.5em;
	}

.btn:focus {
	outline:0 none;
	}

/* front edit + logout buttons */
.btn-blue {
	background-color: transparent;
	border-color: #365972;
	color: #365972!important;
	}
	.btn-blue:hover,
	.btn-blue:focus  {
		background-color: transparent;
		border-color: #fff;
		color: #fff!important;
		}

/* modal close button */
.close-btn {
	background-color: #5e778f;
	border-color: #5e778f;
	color: #fff!important;
	}
	.close-btn:hover,
	.close-btn:focus {
		background-color: #fff;
		border-color: #fff;
		color: #5e778f!important;
		}

/* NEON BUTTONS */
/* without color class the default neon color (neon blue #03e9f4) is used */
/* based on https://codepen.io/bhadupranjal/pen/vYLZYqQ */
.neon-btn {
	padding:15px 20px;
	background-color: transparent;
	color: #03e9f4!important;
	text-decoration: none;
	text-transform: uppercase;
	transition: 0.25s;
	letter-spacing: 4px;
	overflow: hidden;
	border: 2px solid #03e9f4;
	border-radius: 0;
	}
	.neon-btn.neon-small {
		font-size:12px;
		padding:10px 15px;
		margin-bottom: 10px;
	}
	.neon-btn:hover {
		background-color: #03e9f4 !important;
		color: #002c3c !important;
		box-shadow: 0 0 5px #03e9f4, 0 0 12px #03e9f4, 0 0 25px #03e9f4, 0 0 100px #03e9f4;
		}
.neon-btn.neon-green {
	color:#7edc03!important;
	border-color:#7edc03;
	}
	.neon-btn.neon-green:hover {
		background-color: #7edc03 !important;
		color: #002c3c !important;
		box-shadow: 0 0 5px #7edc03, 0 0 12px #7edc03, 0 0 25px #7edc03, 0 0 100px #7edc03;
		}

.neon-btn.neon-pink {
	color:#ff87ff!important;
	border-color:#ff87ff;
	}
	.neon-btn.neon-pink:hover {
		background-color: #ff87ff !important;
		color: #002c3c !important;
		box-shadow: 0 0 5px #ff87ff, 0 0 12px #ff87ff, 0 0 25px #ff87ff, 0 0 100px #ff87ff;
		}

.neon-btn.neon-yellow {
	color:#fbff00!important;
	border-color:#fbff00;
	}
	.neon-btn.neon-yellow:hover {
		background-color: #fbff00 !important;
		color: #002c3c !important;
		box-shadow: 0 0 5px #fbff00, 0 0 12px #fbff00, 0 0 25px #fbff00, 0 0 100px #fbff00;
		}

.neon-btn.neon-orange {
	color:#ff5f1f!important;
	border-color:#ff5f1f;
	}
	.neon-btn.neon-orange:hover {
		background-color:#ff5f1f!important;
		color: #002c3c !important;
		box-shadow: 0 0 5px #ff5f1f, 0 0 12px #ff5f1f, 0 0 25px #ff5f1f, 0 0 100px #ff5f1f;
		}
		/* book now ionside header menuBar */
		#menuBar .neon-btn.neon-orange {
			background-color:#0a344a;
			}
			#menuBar .neon-btn.neon-orange:hover {
				background-color:#ff5f1f!important;
				}

/*-------------------------------------
		NEONBOXES
		refer to: 
https://codepen.io/b3yaz/pen/GRooMvo
--------------------------------------*/
.neonboxes {
	background-color: #0a344a;
	padding-bottom: 30px;
	}
	.neonboxes.warningMsg {
		padding-bottom:0;
		}
	.neonboxes .container {
		position:relative;
		z-index:0;
		}
		.neonboxes.warningMsg .container {
			display: flex;
			justify-content: center;
			flex-wrap:wrap;
			}
		.neonbox {
			position: relative;
			display: flex;
			margin: 60px 15px;
			padding: 0;
			background:#00202e;			
			}
			.combiPage .neonbox {
				flex-wrap:wrap;
				}

			.warningMsg .neonbox {
				margin: 30px 15px 10px;
				}
			.neonbox::before {
				content: '';
				position: absolute;
				top: -2px;
				left: -2px;
				right: -2px;
				bottom: -2px;
				background: #fff;
				z-index: -1;
				}
			.neonbox::after {
				content: '';
				position: absolute;
				top: -2px;
				left: -2px;
				right: -2px;
				bottom: -2px;
				background: #fff;
				z-index: -2;
				filter: blur(15px);
				}
				/* without color class the default neon color (neon blue #03e9f4) is used */
				/* single color */
				.neonbox::before, .neonbox::after {
					background: linear-gradient(235deg, #03e9f4, #0a344a, #03e9f4);
					}
				.neonbox.neon-green::before, .neonbox.neon-green::after {
					background: linear-gradient(235deg, #7edc03, #0a344a, #7edc03);
					}
				.neonbox.neon-pink::before, .neonbox.neon-pink::after {
					background: linear-gradient(235deg, #ff87ff, #0a344a, #ff87ff);
					}
				.neonbox.neon-yellow::before, .neonbox.neon-yellow::after {
					background: linear-gradient(235deg, #fbff00, #0a344a, #fbff00);
					}
				.neonbox.neon-orange::before, .neonbox.neon-orange::after {
					background: linear-gradient(235deg, #ff5f1f, #0a344a, #ff5f1f);
					}
				/* multicolor */
				.neonbox.neon-multi_PinkToBlue::before, .neonbox.neon-multi_PinkToBlue::after {
					background: linear-gradient(235deg, #03e9f4, #0a344a, #f784f9);
					}
				.neonbox.neon-multi_PinkToYellow::before, .neonbox.neon-multi_PinkToYellow::after {
					background: linear-gradient(235deg, #fbff00, #0a344a, #f784f9);
					}
				.neonbox.neon-multi_PinkToGreen::before, .neonbox.neon-multi_PinkToGreen::after {
					background: linear-gradient(235deg, #7edc03, #0a344a, #f784f9);
					}
		.neonbox .boxImage {
			flex: 0 1 auto;
			width: 50%;
			background-size: cover;
			background-position: center center;
			min-height:400px;
			}
			.combiPage .neonbox .boxImage {
				width:100%;
				}
			.neonbox:nth-child(odd) .boxImage {
				order:0;
				}
			.neonbox:nth-child(even) .boxImage {
				order:1;
				}
		.neonbox .boxContent {
			flex: 0 1 auto;
			width: 50%;
			padding:50px 40px;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			text-align:center;			
			}
			.combiPage .neonbox .boxContent {
				width:100%;
				}
			.warningMsg .neonbox .boxContent {
				width: 100%;
				padding: 30px 40px;
				}
				@media screen and (max-width:400px) {
					.warningMsg .neonbox .boxContent {
						padding: 20px 15px;
						}
				}
				.warningMsg .neonbox .boxContent .lead {
					color: #54cde3;
					margin-bottom: 0;
					}
			/* START: vesting-page only */
			.whatToExpect .neonbox .boxContent {
				width: 100%;
				padding: 0;
				flex-direction: row;
				flex-wrap: wrap;
				}
				.whatToExpect h2 {
					text-transform:uppercase;
					}
				.whatToExpect .neonbox .boxContent .popup-gallery,
				.whatToExpect .neonbox .boxContent .popup-youtube {
					width: 50%;
					height:400px;
					position:relative;											
					}
					.whatToExpect .neonbox .boxContent .popup-youtube.fullWidth {
						width:100%;
						}
					@media screen and (max-width:767px) {
						.whatToExpect .neonbox .boxContent .popup-gallery,
						.whatToExpect .neonbox .boxContent .popup-youtube {
							width:100%;
							border:0 none;
							}
					}
					@media screen and (max-width:460px) {
						.whatToExpect .neonbox .boxContent .popup-gallery,
						.whatToExpect .neonbox .boxContent .popup-youtube {
							height:300px;
							}
					}
					.whatToExpect .neonbox .boxContent .popup-gallery {
						border-right: solid 1px #0a344a;
						}
						@media screen and (max-width:767px) {
							.whatToExpect .neonbox .boxContent .popup-gallery {
								border-bottom: solid 1px #0a344a;
								}
						}
						.whatToExpect .neonbox .boxContent .popup-gallery .openGallery {
							display:block;
							height: 100%;
							background-size: cover;
							background-position: center center;
							}								
					.whatToExpect .neonbox .boxContent .popup-youtube {
						border-left: solid 1px #0a344a;
						}
						@media screen and (max-width:767px) {
							.whatToExpect .neonbox .boxContent .popup-yputube {
								border-top: solid 1px #0a344a;
								}
						}
						.whatToExpect .neonbox .boxContent .popup-youtube .openPlayer {
							display:block;
							height: 100%;
							background-size: cover;
							}
							.whatToExpect .neonbox .boxContent .popup-gallery .openGallery::before,
							.whatToExpect .neonbox .boxContent .popup-youtube .openPlayer::before {
								content: '\f030';
								font-family: 'FontAwesome';
								font-style: normal;
								color: rgba(247,132,249,0.5);
								font-size: 5em;
								position: absolute;
								top: 50%;
								left: 50%;
								margin-left: -40px;
								margin-top: -11px;
								z-index: 1;
								text-shadow: 1px 1px 0.5px rgba(0, 0, 0, 0.75);
								}
								.whatToExpect .neonbox .boxContent .popup-youtube .openPlayer::before {
									content: '\f16a';
									color: rgba(84,205,227,0.5);
									}
								/* hover */
								.whatToExpect .neonbox .boxContent .popup-gallery .openGallery:hover::before {
									color: rgba(247,132,249,0.85);
									}
								.whatToExpect .neonbox .boxContent .popup-youtube .openPlayer:hover::before {
									color: rgba(84,205,227,0.85);
									}
								/* END: vesting-page only */
				
			.neonbox:nth-child(odd) .boxContent {
				order:1;
				}
			.neonbox:nth-child(even) .boxContent {
				order:0;
				}
			.neonbox .boxContent .neon-btn {
				margin-top:20px;
				}
		@media screen and (max-width:767px) {
			.neonbox {
				flex-wrap: wrap;
				}
				.neonbox .boxImage,
				.neonbox .boxContent {
					width:100%;
					}
					.neonbox .boxContent {
						padding:45px 30px;
						}
					.neonbox .boxImage {
						height:auto;
						min-height:300px;
						}
		}
		
/*------------------------------
	    COMMON
------------------------------*/
/* all sections with the class .content will have the default section background color */
.content {
	background-color:#0a344a;
	}
	
.page-header {
	margin:20px 0 0;
	padding:0;
	border-bottom-width:0;
	}
	
a,
a:link,
a:visited {
	color:#9fafbf;
	text-decoration:none;
	}
	a:hover,
	a:focus {
	color:#03e9f4;
	text-decoration:none;
	}
a, 
a:focus, 
a:hover, 
button, 
button:focus, 
button:hover, 
button:active {
	outline:0 none;
	}

.modal-content {
	background-color: #365972;
	text-align: left;
	}
	.modal-content .modal-header {
		border-bottom: 1px solid rgba(255,255,255,0.25);
		}
		.modal-content .modal-header .close {
			color:#5e778f;
			opacity:.5;
			text-shadow: none;
			font-size:30px;
			}
			.modal-content .modal-header .close:hover,
			.modal-content .modal-header .close:focus {
				color: #5e778f;
				opacity:1;
				}
		.modal-content .modal-header h4 {
			font-size:22px;
			}
		.modal-content .modal-footer {
			border-top:0 none;
			}
	/* locations Modal - ul list */
	.modal-content .openModalOnLoad {
		overflow:hidden;
		}
		.modal-content .showAllLocations {
			width: 100%;
			background-color: transparent;
			position: relative;
			margin-bottom: 20px;
			border:0 none;
			box-shadow:none;
			padding-left:0;
			display:flex;
			flex-wrap:wrap;
			font-size:16px;
			}
			.modal-content .showAllLocations li {
				flex: 0 1 auto;
				width: 155px;
				}
				.modal-content .showAllLocations li a {
					padding:5px 3px 5px 7px;
					color:#ffffff;
					}
					.modal-content .showAllLocations li a:hover,
					.modal-content .showAllLocations li a:focus {
						color:#03e9f4;
						background-color:transparent;
						}

/*--------------------------------------------------------------------
				SECTIONS LANDING
		see also the NEONBOXES settings above
--------------------------------------------------------------------*/
#landing-page .content {
	padding: 50px 0;
	}
	#landing-page .content h2 {
		text-transform:uppercase;
		margin:0 0 40px;
		}
/* INTRODUCTION  */
#landing-page #section-introduction {
	padding:75px 0 0;
	margin-top:-190px;
	}
	#section-introduction .bigLogo {
		position:relative;
		margin-bottom:30px;
		}
		@media screen and (max-width:1199px) {
			#landing-page #section-introduction {
				margin-top:-180px;
				}
				#section-introduction .bigLogo {
					max-width:250px;
					}
		}
		@media screen and (max-width:991px) {
			#landing-page #section-introduction {
				margin-top:-170px;
				}
				#section-introduction .bigLogo {
					max-width:220px;
					}
		}
		@media screen and (max-width:767px) {
			#landing-page #section-introduction {
				margin-top:-160px;
				}
				#section-introduction .bigLogo {
					max-width:200px;
					}
		}
		@media screen and (max-width:576px) {
			#landing-page #section-introduction {
				margin-top:-140px;
				}
				#section-introduction .bigLogo {
					max-width:150px;
					}
		}
		@media screen and (max-width:460px) {
			#landing-page #section-introduction {
				margin-top:-100px;
				}
				#section-introduction .bigLogo {
					max-width:120px;
					}
		}	
	#section-introduction h1 {
		font-size:60px;
		line-height:70px;
		text-transform:uppercase;
		font-weight:700;
		margin:0 0 40px;
		}
	#section-introduction p {
		font-size:20px;
		padding:0 120px;
		color:#ffffff;
		line-height:30px;
		margin:0 0 30px;
		}
		@media (min-width:992px) and (max-width:1199px) { /*medium devices (md)*/
			#section-introduction h1 {
				font-size:60px;
				}
			#section-introduction p  {
				padding:0 50px;
				}
		}
		@media (max-width:991px) { /*small devices (sm)*/
			#section-introduction h1 {
				font-size:50px;
				line-height:60px;
				}
			#section-introduction p  {			
				padding:0;
				}
		}
		@media (max-width:767px) { /*extra small devices (xs)*/
			#section-introduction h1 {
				font-size:40px;
				line-height:50px;
				margin: 0 0 20px;
				}
			#section-introduction p  {
				font-size:18px;
				margin: 0 0 10px;
				}
		}

/* FROM THE GRAM (landing-page only) */
#landing-page #section-fromTheGram {
	background: rgba(0,32,46, 0) linear-gradient(to bottom, rgb(0,32,46) 0%, rgb(6,127,145) 55%, rgb(6,127,145) 55%, rgb(0,32,46) 100%) repeat scroll 0% 0%;
	padding: 50px 0 60px;
	}
	#landing-page #section-fromTheGram h2 {
		margin-top: 20px;
		margin-bottom: 30px;
		text-transform: uppercase;
		}
	#landing-page #section-fromTheGram .flexImgContainer {
		display:flex;
		flex-wrap:wrap;
		justify-content:center;
		}
		#landing-page #section-fromTheGram .flexImg {
			flex:0 1 auto;
			margin:15px 7.5px 0;
			width:calc(30% - 15px);
			overflow:hidden;
			}
			@media screen and (max-width:480px) {
				#landing-page #section-fromTheGram .flexImg {
					width:calc(50% - 15px);
					}
			}
			#landing-page #section-fromTheGram .flexImg .img-responsive {
				transition: 0.5s all;
				}
				#landing-page #section-fromTheGram .flexImg .img-responsive:hover {
					transform: scale(1.25);
					}

/*------------------------------
	     VESTIGING 
	-> vestiging-page <-
------------------------------*/
#section-intro {
	padding: 50px 0;
	}		
	#section-intro .intro {
		margin:auto;
		max-width:75%;
		}
		#section-intro .truncateMe {
			overflow: hidden;
			display: -webkit-box;
			-webkit-line-clamp: 5;
			-webkit-box-orient: vertical;
			}	
	/* XS Devices */
	@media screen and (max-width:767px) {
		#section-intro .truncateMe,
		#section-intro .intro {
			max-width:90%;
			}
	}

/* MultiSlider for packages */
#section-packages {
	background: rgba(0,32,46, 0) linear-gradient(to bottom, rgb(0,32,46) 0%, rgb(6,127,145) 55%, rgb(6,127,145) 55%, rgb(0,32,46) 100%) repeat scroll 0% 0%;
	padding: 50px 0 60px;
	}
	#section-packages h2 {
		margin-top: 20px;
		margin-bottom: 30px;
		text-transform: uppercase;
		}
	#packageSlider {
		position: relative;
		}
		#packageSlider .MS-content {
			margin: 15px 0;
			overflow: hidden;
			white-space: nowrap;
		}
		@media (max-width: 767px) {
			#packageSlider .MS-content {
			margin: 0;
			}
		}
		#packageSlider .MS-content .item {
			display: inline-block;
			height: 100%;
			overflow: hidden;
			position: relative;
			vertical-align: top;
			width: calc(33.3333% - 20px);
			height: 300px;
			background-color: #00202e;
			margin: 0 10px;
			}
			#packageSlider .MS-content .item a {
				display: inline-flex;
				width: 100%;
				height: 100%;
				background-size: cover;
				background-position: center center;
				background-repeat: no-repeat;
				flex-direction: column;
				justify-content: flex-end;
				}
				#packageSlider .MS-content .item.noImg a {
					background-size: contain;
					}
		@media (max-width: 992px) {
			#packageSlider .MS-content .item {
			width: calc(50% - 20px);
			}
		}
		@media (max-width: 659px) {
			#packageSlider .MS-content .item {
			width: calc(100% - 20px);
			}
		}
		#packageSlider .MS-content .item a p {
			font-size: 30px;
			text-align: center;
			line-height: 1;
			vertical-align: middle;
			margin: 0;
			padding: 10px 0;
			color: #fff;
			background-color: rgba(0,32,46,0.75);
			}
			#packageSlider .MS-content .item a:hover p {
				background-color: rgba(0,32,46,1.0);
				}
		#packageSlider .MS-controls button {
			position: absolute;
			border: none;
			background: transparent;
			font-size: 30px;
			outline: 0;
			top: calc(50% - 16px);
			padding: 5px 14.5px;
			background-color:#ffffff;
			color: #353c45;
		}
		#packageSlider .MS-controls button:hover {
			cursor: pointer;
		}
		#packageSlider .MS-controls .MS-left {
			left: -2px;
		}
		#packageSlider .MS-controls .MS-right {
			right: -2px;
		}

	/*-------------------------------------------------------------------
							MAIN SECTION
	-> nieuws-page, spel-page, app-page, generiek-page, combi(s)-page <-
	---------------------------------------------------------------------*/
	#section-main {
		padding: 50px 0 70px;
		}
		#section-main.news,
		#section-main.game,
		#section-main.the-app,
		#section-main.combis {
			padding-bottom:30px;
			}	
		#section-main .intro {
			margin:auto;
			max-width:75%;
			}
			#section-main.news .intro,
			#section-main.game .intro,
			#section-main.the-app .intro,
			#section-main.combis .intro {
				max-width:100%;
				}
				#section-main.news .intro.newsIntroText,
				#section-main.game .intro.gameIntroText,
				#section-main.the-app .intro.appIntroText,
				#section-main.combis .intro.combisIntroText {
					font-size: 20px;
					padding: 0 120px;
					color: #ffffff;
					line-height: 30px;
					}
			#section-main h2.intro {
				margin-bottom:20px;
				}
			/* default main section: XS Devices */
			@media screen and (max-width:767px) {
				#section-main .intro {
					max-width:90%;
					}
			}
			/* news, game, app settings per device width */
			@media (min-width:992px) and (max-width:1199px) { /*medium devices (md)*/
				#section-main.news .intro.newsIntroText,
				#section-main.game .intro.gameIntroText,
				#section-main.the-app .intro.appIntroText,
				#section-main.combis .intro.combisIntroText {
					padding:0 50px;
					}
			}
			@media (max-width:991px) { /*small devices (sm)*/
				#section-main.news .intro.newsIntroText,
				#section-main.game .intro.gameIntroText,
				#section-main.the-app .intro.appIntroText,
				#section-main.combis .intro.combisIntroText  {			
					padding:0;
					}
			}
			@media (max-width:767px) { /*extra small devices (xs)*/
				#section-main.news .intro.newsIntroText,
				#section-main.game .intro.gameIntroText,
				#section-main.the-app .intro.appIntroText,
				#section-main.combis .intro.combisIntroText  {
					font-size:18px;
					margin: 0 0 10px;
					}
			}

	/*** section contentFooter (combis pages only) ***/
	#contentFooter {
		background: rgba(0,32,46, 0) linear-gradient(to bottom, rgb(0,32,46) 0%, rgb(6,127,145) 55%, rgb(6,127,145) 55%, rgb(0,32,46) 100%) repeat scroll 0% 0%;
		padding: 50px 0 60px;
		}
		#contentFooter .mediaobject_footer {
			font-size: 20px;
			padding: 0 120px;
			color: #ffffff;
			line-height: 30px;
			text-align: center;
		  	}
			  #contentFooter .mediaobject_footer h2,
			  #contentFooter .mediaobject_footer h3,
			  #contentFooter .mediaobject_footer h4 {
				margin-top: 40px;
			  	}
		/* per device width */
		@media (min-width:992px) and (max-width:1199px) { /*medium devices (md)*/
			#contentFooter .mediaobject_footer {
				padding:0 50px;
				}
		}
		@media (max-width:991px) { /*small devices (sm)*/
			#contentFooter .mediaobject_footer  {			
				padding:0;
				}
		}
		@media (max-width:767px) { /*extra small devices (xs)*/
			#contentFooter .mediaobject_footer  {
				font-size:18px;
				margin: 0 0 10px;
				}
		}
		#contentFooter .sibling-navigation {
			margin-top:50px;
			}

	/*-----------------------------------------
			 RULES SECTION
			-> spel-page <-
	------------------------------------------*/
	.rules {
		display: block;
		margin: 0 auto;
		background-color: #0a344a;
		color: white;
		padding: 30px 0 70px;
		}
		.rules .line {
			position: relative;
			background-color: rgba(0,32,46,0.25);
			box-shadow: 0px 0px 12px rgba(255,255,255,0.15);
			height: 2px;
			border-radius: 50%;
			margin: 0 100px;
			}
			/* line per device width */
			@media (max-width:1199px) { 
				.rules .line {
					margin:0 75px;
					}
			}
			@media (max-width:567px) {
				.rules .line {			
					margin:0 50px;
					}
			}
			.rules .line .scanner {
				position: absolute;
				top: -10px;
				left: 0;
				background: #03e9f4;
				width: 20px;
				height: 20px;
				border-radius: 50%;
				animation: scanner-loop 8s cubic-bezier(.68,-0.5,.27,0.5) infinite;
				box-shadow:0 0 5px #03e2ee, 0 0 10px #03e2ee, 0 0 15px #03e2ee, 0 0 20px #03e2ee, 0 0 25px #03e2ee;
				}
			@keyframes scanner-loop {
				0% {
					left: 0;
					box-shadow:0 0 5px #03e2ee, 0 0 10px #03e2ee, 0 0 15px #03e2ee, 0 0 20px #03e2ee, 0 0 25px #03e2ee;
					background: #03e9f4;
					}
				20% {
					box-shadow:0 0 5px #6fc70c, 0 0 10px #6fc70c, 0 0 15px #6fc70c, 0 0 20px #6fc70c, 0 0 25px #6fc70c;
					background: #6fc70c;
					}
				25% {
					left: 50%;
					}
				40% {
					box-shadow:0 0 5px #f1f703, 0 0 10px #f1f703, 0 0 15px #f1f703, 0 0 20px #f1f703, 0 0 25px #f1f703;
					background: #f1f703;
					}
				50% {
					left: 100%;
					}
				60% {
					box-shadow:0 0 5px #fb86fc, 0 0 10px #fb86fc, 0 0 15px #fb86fc, 0 0 20px #fb86fc, 0 0 25px #fb86fc;
					background: #fb86fc;
					}
				75% {
					left: 50%;
					}
				80% {
					box-shadow:0 0 5px #ff5f1f, 0 0 10px #ff5f1f, 0 0 15px #ff5f1f, 0 0 20px #ff5f1f, 0 0 25px #ff5f1f;
					background: #ff5f1f;
					}
				100% {
					left: 0;
					}
			}
		.flexRules {
			display: flex;
			justify-content: center;
			flex-wrap: wrap;
			margin-top: 30px;
			}
			.flexRule {
				margin: 15px;
				background-color:rgba(0,32,46,0.25);
				flex: 0 1 auto;
				text-align: left;
				width: calc(33% - 30px);
				padding: 25px 25px 35px;
				display:flex;
				flex-direction:column;
				}
				/* box width per device width */
				@media (max-width:991px) { 
					.flexRule {
						width: calc(50% - 30px);
						}
				}
				@media (max-width:699px) { 
					.flexRule {
						width: calc(100% - 30px);
						}
				}
				.flexRule h3 {
					font-size: 32px;
					margin-top: 30px;
					color:#ffffff;
					}
					.flexRule p {
						margin-bottom:25px;
						}
					.flexRule .flexGlowingLine,
					.flexRule .flexGlowingLine.blue-glow {
						background-color: #03e9f4;
						box-shadow: 0px 0px 12px #03e9f4;
						height: 2px;
						border-radius: 50%;
						margin-top:auto;
						}
						.flexRule .flexGlowingLine.green-glow {
							background-color: #6fc70c;
							box-shadow: 0px 0px 12px #6fc70c;
							}
						.flexRule .flexGlowingLine.yellow-glow {
							background-color: #f1f703;
							box-shadow: 0px 0px 12px #f1f703;
							}
						.flexRule .flexGlowingLine.pink-glow {
							background-color: #fb86fc;
							box-shadow: 0px 0px 12px #fb86fc;
							}
						.flexRule .flexGlowingLine.orange-glow {
							background-color: #ff5f1f;
							box-shadow: 0px 0px 12px #ff5f1f;
							}
				
/*-----------------------------------------
			 APP SECTION
			-> app-page <-
	------------------------------------------*/
	.app {
		display: block;
		margin: 0 auto;
		background-color: #0a344a;
		color: white;
		padding: 30px 0 70px;
		}
		.flexAppContainer {
			display:flex;
			flex-wrap:wrap;
			align-items: center;
			}
			.flexVideo {
				flex:0 1 40%;
				}
				.embed-responsive-9by16 {
					padding-bottom: 177.81%;
					}
			.flexApp {
				flex: 0 1 60%
				;display: flex;
				flex-direction: column;
				justify-content: center;
				padding-left:20px;
				}
				.flexAppStep {
					margin-bottom:80px;
					}
					.flexAppStep:last-child {
						margin-bottom:0;
						}
			@media screen and (max-width:767px) {
				.flexVideo,
				.flexApp {
					flex:0 1 100%;
					}
					.embed-responsive-9by16 {
						padding-bottom: 100%;
						}
					.flexVideo {
					margin-bottom: 60px;
					}
					.flexApp {
						padding-left:0;
						}
			}
		.app .flexGlowingLine,
		.app .flexGlowingLine.blue-glow {
			background-color: #03e9f4;
			box-shadow: 0px 0px 12px #03e9f4;
			height: 2px;
			border-radius: 50%;
			margin-top:auto;
			}
			.app .flexGlowingLine.green-glow {
				background-color: #6fc70c;
				box-shadow: 0px 0px 12px #6fc70c;
				}
			.app .flexGlowingLine.yellow-glow {
				background-color: #f1f703;
				box-shadow: 0px 0px 12px #f1f703;
				}
			.app .flexGlowingLine.pink-glow {
				background-color: #fb86fc;
				box-shadow: 0px 0px 12px #fb86fc;
				}
			.app .flexGlowingLine.orange-glow {
				background-color: #ff5f1f;
				box-shadow: 0px 0px 12px #ff5f1f;
				}

			.app .line,
			.app .line.blue {
				position: relative;
				background-color: #03e9f4;
				box-shadow: 0px 0px 12px #03e9f4;
				height: 2px;
				border-radius: 50%;
				margin: 0 100px 30px;
				}
				/* line per device width */
				@media (max-width:1199px) { 
					.app .line,
					.app .line.blue {
						margin:0 75px 30px;
						}
				}
				@media (max-width:567px) {
					.app .line,
					.app .line.blue {			
						margin:0 50px 30px;
						}
				}
				.app .line .ball,
				.app .line.blue .ball {
					position: absolute;
					top: -15px;
					left: calc(50% - 15px);
					background: #03e9f4;
					width: 30px;
					height: 30px;
					border-radius: 50%;
					box-shadow:0 0 5px #03e2ee, 0 0 10px #03e2ee, 0 0 15px #03e2ee, 0 0 20px #03e2ee, 0 0 25px #03e2ee;
					line-height:1.75;
					}
				/* neon colors line + ball */
				.app .line.green {
					background-color: #6fc70c;
					box-shadow: 0px 0px 12px #6fc70c;
					}
					.app .line.green .ball {
						background: #6fc70c;
						box-shadow:0 0 5px #6fc70c, 0 0 10px #6fc70c, 0 0 15px #6fc70c, 0 0 20px #6fc70c, 0 0 25px #6fc70c;
						}
				.app .line.yellow {
					background-color: #f1f703;
					box-shadow: 0px 0px 12px #f1f703;
					}
					.app .line.yellow .ball {
						background: #f1f703;
						box-shadow:0 0 5px #f1f703, 0 0 10px #f1f703, 0 0 15px #f1f703, 0 0 20px #f1f703, 0 0 25px #f1f703;
						}
				.app .line.pink {
					background-color: #fb86fc;
					box-shadow: 0px 0px 12px #fb86fc;
					}
					.app .line.pink .ball {
						background: #fb86fc;
						box-shadow:0 0 5px #fb86fc, 0 0 10px #fb86fc, 0 0 15px #fb86fc, 0 0 20px #fb86fc, 0 0 25px #fb86fc;
						}
				.app .line.orange {
					background-color: #fb86fc;
					box-shadow: 0px 0px 12px #fb86fc;
					}
					.app .line.pink .orange {
						background: #ff5f1f;
						box-shadow:0 0 5px #ff5f1f, 0 0 10px #ff5f1f, 0 0 15px #ff5f1f, 0 0 20px #ff5f1f, 0 0 25px #ff5f1f;
						}


/*-----------------------------------------
	          FAQ
		-> faq-page <-
https://codepen.io/johnhubler/pen/bGpMYwq
------------------------------------------*/
#section-faq {
	padding: 50px 0 70px;
	}
	#section-faq .intro {
		margin:auto;
		max-width:75%;
		text-align:center;
		}
		#section-faq h2.intro {
			margin-bottom:20px;
		}
		/* XS Devices */
		@media screen and (max-width:767px) {
			#section-faq .intro {
				max-width:90%;
				}
		}
	.accordion-list {
		margin:20px 0 40px;
		}
		.accordion-list .faqItem {
			padding: 20px 0;
			margin: 0 auto 15px auto;
			border-bottom: 1px solid rgba(255,255,255,0.1);
			cursor: pointer;
			}
			.accordion-list .faqItem:last-child {
				border-bottom-color:transparent;
				}	
			.accordion-list .faqItem.active h2:after {
				transform: rotate(45deg);
				}			
			#section-faq .accordion-list .faqItem h2 {
				font-weight: 500;
				position: relative;
				padding: 0 16px 0 0;
				margin: 0;
				font-size: 20px;
				letter-spacing: 0.01em;
				cursor: pointer;
				}
				.accordion-list .faqItem h2:after {
					content: "\f067";
					font-family: "FontAwesome";
					position: absolute;
					right: 0;
					top: 0;
					color: rgba(255,255,255,0.15);
					transition: all 0.3s ease-in-out;
					font-size:20px;
					}
				
			.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: 18px;
				}
/*------------------------------
	     INFO 
	-> vestiging-page <-
	hours, pricing, address
------------------------------*/
#section-info {
	/*background: rgba(10,52,74, 0) linear-gradient(to bottom, rgb(10,52,74) 0%, rgb(6,127,145) 55%, rgb(6,127,145) 55%, rgb(10,52,74) 100%) repeat scroll 0% 0%;*/
	padding: 10px 0 60px;
	}
	.infoFlexContainer {
		display:flex;
		flex-wrap:wrap;
		justify-content:space-between;
		align-items: flex-start;
		}
		.infoFlexChild {
			flex:0 1 auto;
			display: flex;
			flex-direction: column;
			}
			@media screen and (max-width:767px) {
				.infoFlexChild {
					width:80%;
					padding:0!important;
					}
			}
			.infoFlexChild.pricing {
				max-width:50%;
				padding:0 30px;
				}
				@media screen and (max-width:767px) {
					.infoFlexChild.pricing {
						max-width:100%;
						padding:0!important;
						}
				}
				.infoFlexChild.pricing .remarks-list {
					margin-top: 25px;
					font-size: 90%;
					}
					.infoFlexChild.pricing .remarks-list .fa-li {
						color: #ff5f1f;
						}			
				.infoFlexChild h3 {
					flex:0 1 100%;
					color:#ff5f1f;
					text-transform: uppercase;
					font-family: clioblack-black;
					}
				.infoFlexContentRow {
					flex:0 1 100%;
					display:flex;
					justify-content:space-between;
					line-height: 1.5em;
					}
					.infoFlexContentRow .contentLeft {
						flex:0 1 auto;
						text-align:left;
						padding-right:15px;
						}
					.infoFlexContentRow .contentRight {
						flex:0 1 auto;
						text-align:right;
						padding-left:15px;
						}
						.hours .contentRight {
							display:flex;
							justify-content: flex-end;
							}
							.hours .contentRight .start,
							.hours .contentRight .end {
								width:50px;
								}
							.hours .contentRight .seperator {
								padding: 0 5px;
								width: 15px;
								text-align: center;
								}
						.hours .closedDay {
							color:rgba(255,255,255,0.35);
							}
							a.customOpenHoursModal {
								color: #fff;
								margin-top: 10px;
								font-size:90%;
								}
								a.customOpenHoursModal:hover {
									color:#ff5f1f;
									}
									a.customOpenHoursModal .fa {
										color: #ff5f1f;
										font-size: 30px;
										position: relative;
										top: 5px;
										margin-right: 5px;
										}
						.infoFlexChild.address p,
						.infoFlexChild.address a {
							line-height:1.5em;
							}
					

/*------------------------------
	Social Media Icons
		Franchises
------------------------------*/
.socialIconsFranchise {
	margin-top: auto;
	margin-bottom: 5px;
	align-self: flex-end;
	}
	.socialIconsFranchise .socialIcon {
		box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
		}

/*------------------------------
	  SCROLL TO TOP
------------------------------*/
/*see //www.paulund.co.uk/how-to-create-an-animated-scroll-to-top-with-jquery*/
.scrollToTop{
	position:fixed;
	bottom:55px;
	width:48px;
	right:15px;
	display:none;
	z-index:999;
	}
	.scrollToTop a,
	.scrollToTop a:focus{
		color:rgba(255,255,255,0.2)!important;
		font-size:52px;
		}
		.scrollToTop a:hover{
			text-decoration:none;
			color:rgba(255,255,255,0.9)!important;
			}

/*--------------------------------------------------------
					FOLLOW US
---------------------------------------------------------*
/***** floating div for social media *****/
#socialmedia-float {
	position: fixed;
    right: 0;
    top: 225px;    
	width:48px;
    z-index: 1040;
	background-color:rgba(59,167,194,0.35);
	border:none;
	-webkit-border-radius:5px 0 0 5px!important;
	-moz-border-radius:5px 0 0 5px!important;
	border-radius:5px 0 0 5px!important;
	}
	@media only screen and (max-width: 568px) {
		#socialmedia-float {
			top:150px;
			}
	}
	
	.btn-social,
	.btn-social:visited,
	.btn-social:hover {
		width:48px;
		padding:3px 0;
		background-color:rgba(59,167,194,0);
		border:none;		
		color:#ffffff;
		-webkit-border-radius:5px 0 0 5px!important;
		-moz-border-radius:5px 0 0 5px!important;
		border-radius:5px 0 0 5px!important;
		box-shadow:none;
		-webkit-box-shadow:none;
		-moz-box-shadow:none;
		}
		.btn-social:before {
			content:'\f066' ;
			font-family:'FontAwesome';
			font-style:normal;
			color:#ffffff;
			display:inline-block;
			height:48px;
			line-height:48px;
			padding-left:0;
			font-size:38px;
			}
		.btn-social.collapsed:before {
			content:'\f1e0';
			}		
	#socialmedia-icons {
		background-color:rgba(0,0,0,0);
		padding:0 0 5px;
		text-align:center;
		}
		#socialmedia-icons .follow-us-icons {
			margin: 0px !important;
			padding: 0px !important;
			list-style: outside none none;
			overflow: hidden;
			}
			.follow-us-icons li {
				padding:3px;
				}
				.follow-us-icons a {
					color:#ffffff;
					font-size:28px;
					text-align:center;
					background-color:rgba(0,0,0,0.5);
					display:block;
					height:42px;
					width:42px;
					padding:7px 0;
					border-radius:50%;
					-moz-border-radius:50%;
					-webkit-border-radius:50%;
					}
					/* color setting per icon */
					.follow-us-icons a.facebook {
						background-color:#3B5998;
						}
					.follow-us-icons a.twitter {
						background-color:#5EA9DD;
						}
					.follow-us-icons a.instagram {
						background:linear-gradient( #400080, transparent), linear-gradient( 200deg, #d047d1, #ff0000, #ffff00);
						}
					.follow-us-icons a.pinterest {
						background-color:#EA1514;
						}
					.follow-us-icons a.youtube {
						background-color:#C1191E;
						}
			
/*--------------------------------------------------------
					COOKIEBAR
   -overrides /jquery.cookiebar/jquery.cookiebar.css-
--------------------------------------------------------*/
#cookie-bar {
	position:fixed; 
	bottom:0; 
	left:0; 
	width:100%;
	top:auto;
	height:40px;
	padding:8px 5px;
	z-index:9;
	}
	@media (max-width:425px) { /* on devices with a viewport of 425px or smaller, the cookie text and button appears on two lines*/
		#cookie-bar {
			height:65px;
			}
	}
	#cookie-bar .cb-enable {
		background-color:#f03072;
		font-weight:bold;
		}
		#cookie-bar .cb-enable:hover {
			background-color:#178c61;
			}



/*--------------------------------------------------------
					GLOWGOLF FAQ
		   -only applied to faq pages-
--------------------------------------------------------*/
.panel-group .panel {
	box-shadow:none;
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
	}
	h4.panel-title {
		font-size:18px;
		line-height:22px;
		font-family:"proxima_nova_bold",Arial,sans-serif;
		}
		@media only screen and (max-width: 599px) { /* breakpoint, only needed for extra small tablets and below  */
			h4.panel-title {
				font-size:16px;
				line-height:20px;
				}
		}
		.panel-heading [data-toggle="collapse"]:after {
			content: "\00AB"; /* "&laquo;" icon */
			float: right;
			color: #212121;
			font-size: 24px;
			line-height: 28px;
			/* rotate "&laquo;" icon from << (right arrow) to up arrow */
			-webkit-transform: rotate(90deg);
			-moz-transform: rotate(90deg);
			-ms-transform: rotate(90deg);
			-o-transform: rotate(90deg);
			transform: rotate(90deg);
			}

		.panel-heading [data-toggle="collapse"].collapsed:after {
		   content: "\00BB"; /* "&raquo;" icon */
		   /* rotate "&raquo;" icon from >> (right arrow) to down arrow) */
			-webkit-transform: rotate(90deg);
			-moz-transform: rotate(90deg);
			-ms-transform: rotate(90deg);
			-o-transform: rotate(90deg);
			transform: rotate(90deg);
			color: #3BA7C2;
			}