@import "fonts.css";
@charset "utf-8";
body { margin:0; font-family: 'Bega Medium', sans-serif; }
hiddenelements { display:none; }
h1   { display:none; }
.row { width:100%; height:auto; }

.banner_row { width:80%; margin-left:10%; height:auto; }

.button {
	width:150px;
	height:40px;
	line-height:40px;
	vertical-align:middle;
	font-size:22px;
	text-align:center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	border-radius:8px;
	background:#00ADEE;
	color:#FFF;
	border:1px solid #00ADEE;
}

	.button:hover { cursor:pointer; color:#000; }
	
.titel {
	width:96%;
	height:80px;
	vertical-align:middle;
	line-height:80px;
	color:#344455;
	font-weight:bold;
	font-size:40px;
	text-align:center;
	margin:2%
}

a {
	text-decoration:none;
}

#top_banner {
	width:100%;
	height:50px;
	background:#00334C;
	margin:0;
}

	#top_banner .banner_row { height:50px; line-height:50px; vertical-align:middle; margin-left:10%; }

	#top_banner #banner_info { font-size:20px; font-weight:bold; color:#FFF; text-transform:uppercase; float:left;	}
	#top_banner a { font-weight:normal; color:#FFF; }
	#top_banner a:hover { cursor:pointer; color:#00ADEE; }
	
	.social_buttons { font-size:20px; font-weight:bold; color:#FFF; margin-left:auto; margin-right:0; float:right; height:50px; width:auto; }
	
	.social_buttons .language_menu {
		width:40px;
		height:30px;
		text-align:center;
		vertical-align:middle;
		float:left;
		border-radius:8px;
		margin:10px 5px;
		line-height:30px;
		position:relative;
	}	
		.social_buttons .language_menu::after{
			content: '';
			position: absolute;
			left: 35px;
			top: 10px;
			width: 0;
			height: 0;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			border-top: 5px solid #fff;
			clear: both;
		}
	
		.social_buttons .language_menu .other_languages {
			display:none;
			position:absolute;
			z-index:1;
			background:#00334C;
			width:50px;
			font-weight:bold;
		}
		
		.social_buttons .language_menu .other_languages .change_language {
			color:#FFF;
			height:30px;
			width:50px;
			line-height:30px;
			vertical-align:middle;
			text-align:center;
			display:block;
			font-weight:bold;
		}
		
		.social_buttons .language_menu .other_languages .change_language:hover { color:#00334C; background:#FFF;  }
		.language_menu:hover { cursor:pointer; }
		.language_menu:hover .other_languages { display:block; }
	
	.social_buttons .social_button {
		background:#FFF;
		width:30px;
		height:30px;
		border-radius:50%;
		margin:10px 5px;
		float:left;
	}
	
		.social_buttons .social_button img {
			width:22px;
			height:22px;
			margin:4px;
		}
		
		.social_buttons .social_button:hover {
			cursor:pointer;
			background:#00334C;
		}
			.social_buttons .social_button:hover img {
				filter:invert(100);
			}
		
		.social_buttons .social_seperator { width:2px; height:40px; background:#FFF; content:' '; float:left; margin:5px; }
		.social_buttons .social_text {
			float:left;
		}
		

#bullet_banner {
	width:100%;
	background:#FFF;
	margin:0px;
	height:40px;
	border-top:1px solid #CCC;
}

	#bullet_banner .banner_row { height:40px; line-height:40px; vertical-align:middle; margin-left:10%; width:80%; }
	#bullet_banner .bullet_button { width:25%; height:40px; line-height:40px; vertical-align:middle; float:left; font-size:14px; }
		#bullet_banner .bullet_button img  { width:20px; height:20px; vertical-align:middle; margin:10px 5px; float:left; }
		#bullet_banner .bullet_button b    { width:auto; float:left; color:#00AEEF; font-weight:bold; }
		#bullet_banner .bullet_button span { width:auto; float:left; }
		#bullet_banner .bb_pr { padding-right:5px; }

#menu_banner {
	width:100%;
	background:#FFF;
	margin:20px 0;
	height:127px;
}
		
	#menu_banner .logo { width:300px; height:127px; margin-left:0; margin-right:auto; float:left; background:url(../images/logo.png); background-repeat:no-repeat; background-size:contain; background-position:center; }
		
		#menu_banner .logo:hover { cursor:pointer; }
		
	#menu_banner #menu_buttons { 
		width:auto; 
		height:127px; 
		margin-top:auto; 
		margin-bottom:auto; 
		margin-right:0; 
		margin-left:auto;
		height:127px;
		line-height:127px;
		vertical-align:middle;
		color:#344455;
		font-size:22px;
		display:inline-block;
		float:right;
	}
	
	#menu_banner #menu_buttons ul { list-style-type:none; margin:0; padding:0; overflow:hidden; }
	#menu_banner #menu_buttons li { 
		padding:5px; 
		white-space: nowrap; 
		overflow: hidden; 
		text-overflow: ellipsis; 
		float:left; 
		font-weight:bold;
		height:127px;
		line-height:127px;
		vertical-align:middle;
	}
		
		#menu_banner #menu_buttons li a { color:#344455; }
	
		#menu_banner #menu_buttons li a:hover { cursor:pointer; color:#00ADEE; }
	
	#menu_banner #menu_buttons li:after {
		content: "";
		display: inline-block;
		background: #00ADEE;
		width:2px;
		height:50px;
		vertical-align:middle;
		line-height:127px;
		margin-left:10px;
	}
	
	#menu_banner #menu_buttons li:last-child:after {
		display: none;
	}

#banner {
	width:100%;
	height:600px;
	background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../images/bg_image.jpg");
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
	position:relative;
}

	#banner #banner_text { color:#FFF; height:400px;  width:100%; font-weight:bold; position:relative; }
		#banner #banner_text span { 
			height:auto; 
			min-height:60px; 
			position:absolute;
			top:50%;
			transform: translateY(-50%);
			font-size:50px; 
			line-height:60px; 
			width:100%; 
			text-align:center;
		}
	#banner #banner_search { width:100%; background:rgba(0, 173, 238, 0.5); height:200px; border-top-right-radius:20px; border-top-left-radius:20px; }
	#banner #banner_search #banner_search_titel {
		font-weight:normal;
		text-align:center;
		line-height:100px;
		vertical-align:middle;
		height:100px;
		text-align:center;
		font-size:36px;
		font-weight:bold;
		color:#FFF;
		padding:10px;
	}
	#banner #banner_search #banner_search_row {
		height:80px;
		line-height:80px;
		text-align:left;
		vertical-align:middle;
		padding:0 2%;
	}
	
		#banner #banner_search #banner_search_row select { 
			border:1px solid white;
			border-radius:8px;
			width:17%;
			margin:0 1%;
			height:50px;
			float:left;
			background:none;
			-webkit-appearance: none;
		    -moz-appearance: none;
		    appearance: none;       /* Remove default arrow */
		    background-image: url(../images/donwarrrow_blue.png);   /* Add custom arrow */ 
			background-size:30px 30px;
			background-position:right 5px center;
			background-repeat:no-repeat;
			font-size:20px;
			color:#FFF;
			font-weight:normal;
			padding:4px;
		}
		
			#banner #banner_search #banner_search_row select option {
				height:50px;
				line-height:50px;
				vertical-align:middle;
				font-weight:normal;
				font-size:20px;
				color:#000;
				background:none;
			}
		
		#banner #banner_search #banner_search_row #button_afspraak {
			background:#00A3DF;
			color:#FFF;
			border:1px solid white;
			float:left;
			height:50px;
			width:21%;
			line-height:50px;
			vertical-align:middle;
			margin:0 1%;
		}
		
			#banner #banner_search #banner_search_row #button_afspraak:hover { color:#000; }
		
#content {
	width:100%;
}

#content .content_block {
	width:100%;
	height:auto;
	padding:2% 0px;
	min-height:400px;
}

	#content .bg_white { background:#FFFFFF; }
	#content .bg_grey  { background:#F0F2F3; }
	#content .bg_blue  { background:#00ADEE; }
	
	#content .content_block #content_repairs {
		height:auto;
		width:1200px;
		margin:auto;
	}
	
	#content .content_block #content_repairs .content_repair_block {
		width:300px;
		height:310px;
		display:inline-block;
		position:relative;
		font-size:22px;
	}
	
		#content .content_block #content_repairs .content_repair_block .content_repair_block_titel {
			height:40px;
			line-height:20px;
			vertical-align:middle;
			text-align:center;
			padding:10px;
			width:calc(100% - 20px);			
		}
	
		#content .content_block #content_repairs .content_repair_block .content_repair_block_img {
			width:100%;
			height:150px;
		}

			#content .content_block #content_repairs .content_repair_block .content_repair_block_img img {
				max-height:150px;
				max-width:100%;
				height:150px;
				margin:auto;
			}
		
		#content .content_block #content_repairs .content_repair_block .content_repair_block_prijs {
			width:calc(100% - 20px);
			height:30px;
			line-height:30px;
			vertical-align:middle;
			font-weight:bold;
			padding:10px;
			text-transform:uppercase;
			text-align:center;
		}
		
		#content .content_block #content_repairs .content_repair_block .content_repair_block_button {
			height:30px;
			line-height:30px;
			vertical-align:middle;
			width:70%;
			margin:10px auto;
			color:#00ADEE;
			background: url(../images/rightarrow_blue.png) no-repeat right;
			background-size:26px 26px;
			background-position: right 4px center;
			border-radius:15px;
			border:2px solid #00ADEE;
			text-align:center;
			font-size:16px;
			font-weight:bold;
			padding:4px;
		}
		
			#content .content_block #content_repairs .content_repair_block .content_repair_block_button:hover {
				cursor:pointer;
				background: url(../images/rightarrow_white.png) no-repeat right;
				background-color:#00ADEE;
				background-size:26px 26px;
				color:#FFF;
				background-origin:content-box;
			}
	
#content .content_block .content_block_img { 
	width:40%; 
	border-top-right-radius:14px;
	border-bottom-right-radius:14px;
	height:100%;
	position:relative;
	float:left;
	min-height:400px;
}

	#content .content_block .content_block_img .content_block_img_fader {
		position:absolute;
		left:0px;
		top:0px;
		width:25%;
		background:rgba(0, 173, 238, 0.5);
		z-index:10;
		height:100%;
	}
	
	#content .content_block #img_1 {
		background:url("../images/bg_img_2.jpg");
		background-position:right;
		background-size:cover;
		background-repeat:no-repeat;
	}
	
	#content .content_block #img_2 {
		background:url("../images/bg_img_3.jpg");
		background-position:right;
		background-size:cover;
		background-repeat:no-repeat;
	}

#content .content_block .content_block_text {
	width:40%;
	height:auto;
	float:left;
	margin-left:2%;
}

	#content .content_block .content_block_text .button {
		width:30%;
		height:40px;
		line-height:40px;
		margin-right:2%;
		float:left;
	}

	#content .content_block .content_block_text .subtitel { 
		color:#00334C; 
		font-size:28px;
		font-weight:bold;
		width:100%;
		height:auto;
		line-height:32px;
		vertical-align:middle;
		padding:10px;
	}
	
	#content .content_block .content_block_text .subtitel_blue { color:#00ADEE; }

	#content .content_block .content_block_text .text_block {
		height:auto;
		width:100%;
		padding: 0px 10px;
		font-size:20px;
		line-height:32px;
		vertical-align:middle;
		color:#000;
		margin-bottom:2%;
	}
	
	#content .content_block .content_block_text .text_block_white { color:#FFF; }
	#content .content_block .content_block_text .button_white {
		border:1px solid #FFF;
		color:#FFF;
	}
		#content .content_block .content_block_text .button_white:hover { color:#000; }
	
	#content .content_block .content_block_text .button_blanc {
		background:none;
		color:#00334C;
		border:1px solid #00334C;
		border-radius:8px;
	}
		#content .content_block .content_block_text .button_blanc:hover { background:#00ADEE; color:#FFF; }
		
#footer {
	width:96%;
	height:auto;
	background:#00334C;
	margin-top:2%;
	color:#FFF;
	padding: 2%;
}

#footer a { font-weight:normal; color:#FFF; }

	#footer .top_row { height: 166px; width:100%; margin-bottom:5%;  }
	#footer .bottom_row { height:80px; width:100%; }
	
	#footer .top_row .row { height:30px; line-height:30px; color:#FFF; font-size:24px; vertical-align:middle; }
	#footer .top_row .row a:hover { cursor:pointer; color:#00ADEE; }
	
	#footer .bottom_row .row { height:20px; line-height:20px; font-size:20px; color:#FFF; vertical-align:middle; }
	#footer .bottom_row .row a:hover { cursor:pointer; color:#00ADEE; }

	
	#footer .footer_block {
		width:35%;
		display:inline-block;
	}
		
		#footer .footer_block .bottom_row { text-align:right; }
		#footer .footer_block .bottom_row .row a { margin-right:calc(100% - 400px); }
		#footer .bottom_row .row { height:30px; line-height:30px; vertical-align:middle; }
		#footer .bottom_row .big_href { font-weight:bold; color:#009ED8; }
	
	#footer .footer_seperator {
		width:2px;
		background:#00ADEE;
		height:280px;
		content:" ";
		display:inline-block;
		margin:0 1%;
	}
	
		#footer .footer_block .top_row #logo_inverted { 
			background:url(../images/logo_whiteblue.png);
			background-size:contain;
			background-repeat:no-repeat;
			background-position:center;
			height:166px;
			width:400px;
		}
		
			#footer .footer_block .top_row #logo_inverted:hover { cursor:pointer; }
		
	#footer .footer_middle {
		width:22%;
		display:inline-block;
		text-align:left;
	}


.scrollbar::-webkit-scrollbar, .col1 .col_detail::-webkit-scrollbar {
	background: transparent;
	width:10px;
	height:5px;
}
.scrollbar::-webkit-scrollbar-thumb, .col1 .col_detail::-webkit-scrollbar-thumb {
	 -webkit-border-radius: 10px;
	border-radius: 10px;
	background: rgba(0,0,0,0.8); 
	-webkit-box-shadow: inset 0 0 4px rgba(204,204,204,0.5); 
}
.scrollbar::-webkit-scrollbar-thumb:hover, .col1 .col_detail::-webkit-scrollbar-thumb:hover {
	background-color: rgba(0, 0, 0, 0.3);
}

.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 900;
    background: rgba( 255, 255, 255, .8 );
	background-position:center;
}

.loader .loader_img {
	position:absolute;	
	left:calc(50% - 60px);
	top:calc(50% - 60px);
	border: none; /* Light grey */
	border-top: 12px solid #00AEEF; /* Blue */
	border-radius: 50%;
	width: 120px;
	height: 120px;
	animation: spin 2s linear infinite;
	z-index:901;
}

	.loader img {
		width:60px;
		height:60px;
		position:absolute;
		left:calc(50% - 30px);
		top:calc(50% - 30px);
		z-index:902;
		animation:none;
	}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/*
#loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
    background: rgba( 255, 255, 255, .8 ) 
                url('../images/spin_logo.png') 
				10% 10%
                no-repeat;
	background-position:center;
}

@keyframes rotate {
    100% {
        transform: rotateY(90deg);
    }
}
*/

@media only screen and (max-width: 1530px) {
	#content .content_block .content_block_text .button {
		width:46%;
	}
}

@media only screen and (max-width: 1400px) {
	.banner_row, #top_banner .banner_row { width: 98%; margin-left:1%; margin-right:1%; }
}

@media only screen and (max-width: 1215px) {
	#footer .footer_block .top_row #logo_inverted { 
		height:125px;
		width:300px;
	}
	#footer .footer_block .bottom_row .row a { margin-right:calc(100% - 300px); }
}

@media only screen and (max-width: 1200px) {
	#content .content_block #content_repairs { width:100%; margin:auto; }
}

@media only screen and (max-width: 1100px) {
	#bullet_banner { height:80px; }
	#bullet_banner .banner_row { height:80px; }
	#bullet_banner .bullet_button { width:50%; }
}

@media only screen and (max-width: 1070px) {
	#footer .banner_row #footer_block_right { width: 20%; }
	#footer .banner_row .footer_middle { width:37%; }
}

@media only screen and (max-width: 1000px) {
	#content .content_block .content_block_text {
		width:56%;
	}
}

@media only screen and (max-width: 930px) {
	#banner #banner_search #banner_search_row #button_afspraak { font-size:18px; }
	#banner #banner_search #banner_search_row select {  font-size:18px; }
		
		#banner #banner_search #banner_search_row select option {
			font-size:18px;
		}

	#footer .footer_block .top_row #logo_inverted { 
		height:104px;
		width:250px;
	}
	#footer .footer_block .bottom_row .row a { margin-right:calc(100% - 250px); }
}

@media only screen and (max-width: 900px) {
	#menu_banner { height:85px; margin:10px 0; }
	#menu_banner .logo { width:200px; height:85px; } 
	#menu_banner #menu_buttons { 
		height:85px; 
		line-height:85px;
		font-size:18px;
	}
	
	#menu_banner #menu_buttons li { 
		height:85px;
		line-height:85px;
	}
	
	#menu_banner #menu_buttons li:after {
		height:40px;
		line-height:85px;
	}

	#content .content_block #content_repairs .content_repair_block {
		width:50%;
		font-size:20px;
	}
}

@media only screen and (max-width: 870px) {
	#banner #banner_text { height:360px; }
	#banner #banner_search { height:240px;}
	#banner #banner_search #banner_search_titel {
		line-height:60px;
		height:60px;
		font-size:30px;
		padding:5px;
	}
	#banner #banner_search #banner_search_row {
		height:120px;
		line-height:60px;
	}
	
		#banner #banner_search #banner_search_row select { 
			width:30%;
			margin-top:2%;
		}
		
		#banner #banner_search #banner_search_row #button_afspraak {
			width:62%;
			margin-top:2%;
		}
}

@media only screen and (max-width: 770px) {
	#footer .footer_block .top_row #logo_inverted { 
		height:83px;
		width:200px;
	}
	#footer .footer_block .bottom_row .row a { margin-right:calc(100% - 200px); }
}

@media only screen and (max-width: 715px) {
	#content .content_block .content_block_text .button {
		width:96%;
		margin-bottom:2%;
	}
}

@media only screen and (max-width: 685px) {
	#menu_banner #menu_buttons { 
		height:85px; 
		line-height:85px;
		font-size:18px;
		width:50%;
	}
	
	#menu_banner #menu_buttons li { 
		height:20px;
		line-height:20px;
		text-align:right;
		padding-right:10px;
		width:calc(100% - 10px);
	}
	
	#menu_banner #menu_buttons li:after {
		display:none;
	}
	
	#content .content_block .content_block_img { display:none; }
	
	#content .content_block .content_block_text {
		width:96%;
	}
	
	#content .content_block .content_block_text .button {
		width:46%;
		margin-bottom:0;
	}
}

@media only screen and (max-width: 650px) {
	.titel {font-size:30px; }
	
	#footer .banner_row #footer_block_right { display:none; }
	#footer .banner_row #footer_seperator_right { display:none; }
	#footer .banner_row .footer_block  { width:48%; }
	#footer .banner_row .footer_middle { width:48%; }
}

@media only screen and (max-width: 605px) {
	#banner #banner_text { height:300px; }
	#banner #banner_search { height:300px;}
	#banner #banner_search #banner_search_titel {
		line-height:40px;
		height:90px;
		font-size:30px;
		padding:5px;
	}
	#banner #banner_search #banner_search_row {
		height:160px;
		line-height:60px;
	}
	
		#banner #banner_search #banner_search_row select { 
			width:45%;
			margin-top:2%;
		}
		
		#banner #banner_search #banner_search_row #button_afspraak {
			width:92%;
			margin-top:2%;
		}	
}

@media only screen and (max-width: 590px) {
	#top_banner .banner_row .social_buttons .social_button { display:none; }
	#top_banner .banner_row .social_buttons .social_seperator { display:none; }
	#top_banner .banner_row .social_buttons .social_text { display:none; }
}

@media only screen and (max-width: 560px) {
	#bullet_banner { height:160px; }
	#bullet_banner .banner_row { height:160px; }
	#bullet_banner .bullet_button { width:60%; margin-left:20%; }
}

@media only screen and (max-width: 530px) {	
	#footer .banner_row #footer_seperator_left { display:none; }
	#footer .banner_row .footer_block  { width:96%; padding-bottom:4%; }
	#footer .banner_row .footer_middle { width:96%; padding-top:2%; padding-bottom:2%; border-top:2px solid #00ADEE; }
	
	#footer .banner_row .footer_middle .row { text-align:center; }
	
	#footer .footer_block .top_row #logo_inverted { 
		height:166px;
		width:400px;
	}
	#footer .footer_block .bottom_row .row a { margin-right:calc(100% - 400px); }
}

@media only screen and (max-width: 490px) {
	#top_banner  { height:80px; }
	#top_banner .banner_row { height:80px; line-height:40px; }
	#top_banner #banner_info { width:100%; text-align:center; }
	#top_banner .banner_row .social_buttons { width:100%; text-align:center; }
	#top_banner .banner_row .social_buttons .language_menu { margin-left:calc(50% - 20px); }
}

@media only screen and (max-width: 465px) {
	#content .titel { line-height:40px; }
	#content .content_block #content_repairs .content_repair_block .content_repair_block_button {
		text-align:left;
		padding-left:13px;
	}
}

@media only screen and (max-width: 450px) {
	#bullet_banner .bullet_button { width:80%; margin-left:10%; }
}

@media only screen and (max-width: 420px) {
	#banner #banner_text span { 
		min-height:55px; 
		font-size:45px; 
		line-height:55px; 
	}
	
	#content .content_block .content_block_text .button {
		width:90%;
		height:5%;
		margin:10px;
	}
	
	#content .content_block {
		min-height:450px;
	}
	
	#content .content_block #content_repairs .content_repair_block .content_repair_block_button {
		text-align:center;
		padding-left:4px;
		font-size:18px;
	}
	
	#menu_banner #menu_buttons { 
		width:40%;
		font-size:14px;
	}
}

@media only screen and (max-width: 400px) {
	#footer .footer_block .top_row #logo_inverted { 
		height:145px;
		width:350px;
	}
	
	#footer .footer_block .bottom_row .row a { margin-right:auto; }
	
	#content .content_block #content_repairs .content_repair_block {
		width: 90%;
		margin:5%;
	}
}


@media only screen and (max-width: 380px) {
	#content .content_block {
		min-height:480px;
	}	
}

@media only screen and (max-width: 360px) {
	#footer .footer_block .top_row #logo_inverted { 
		height:124px;
		width:300px;
	}
	
	#menu_banner .logo { width:170px; height:72px; }
	
	#bullet_banner .bullet_button { width:100%; margin-left:0%; }
	
	#menu_banner #menu_buttons { 
		width:45%;
	}
}

@media only screen and (max-width: 360px) {
	#top_banner #banner_info { font-size:16px; }
}

@media only screen and (max-width: 340px) {
	#menu_banner #menu_buttons { 
		font-size:12px;
		width:40%;
	}

	#banner #banner_search #banner_search_titel {
		line-height:30px;
		height:90px;
		font-size:30px;
		padding:5px;
	}
}