

<!-- class Upload
{
	public $filename;
	public $width = 800;
	public $height = 800;
	public $crop = false;
	public $thumb_crop = true;
	public $thumb_width = 100;
	public $thumb_height = 100;
	public $thumb = false;
	public $max_size = 6097152; // ~6MB

	private $dest_path;
	private $thumb_path;
	private $orig_path;
	private $resize = false;
	private $tmp_name;
	private $file = [];
	private $file_ok = false;

	function __construct($dest_path, $file)
	{
		$this->file = $file;

		$oldumask = umask(0);
		@mkdir($dest_path . "thumb/", 0777, true);
		@mkdir($dest_path . "orig/", 0777, true);
		umask($oldumask);

		$this->dest_path = $dest_path;
		$this->thumb_path = $dest_path . 'thumb/';
		$this->orig_path = $dest_path . 'orig/';

		$this->tmp_name = $this->file['tmp_name'];
		$this->filename = $this->get_filename($this->file['name']);

		if (in_array($this->file["type"], ["image/gif", "image/jpeg", "image/png", "image/webp"]) && ($this->file["size"] < $this->max_size)) {
			$this->file_ok = true;
			$this->save_original();
		}
	}

	private function get_filename($filename)
	{
		$name = pathinfo($filename, PATHINFO_FILENAME);
		$extension = pathinfo($filename, PATHINFO_EXTENSION);

		$temp_name = $name;
		$i = 1;
		while (file_exists($this->orig_path . $temp_name . "." . $extension)) {
			$temp_name = $name . '_' . $i;
			$i++;
		}

		return $temp_name . "." . $extension;
	}

	public function save_image()
	{
		if ($this->file_ok) {
			if ($this->resize) {
				$this->create_image($this->dest_path, $this->filename, $this->width, $this->height, $this->crop);
			} else {
				copy($this->orig_path . $this->filename, $this->dest_path . $this->filename);
			}

			if ($this->thumb) {
				$this->create_image($this->thumb_path, $this->filename, $this->thumb_width, $this->thumb_height, $this->thumb_crop);
			}
		}
	}

	private function create_image($path, $filename, $targetWidth, $targetHeight, $crop)
	{
		$file_path = $this->orig_path . $filename;
		list($origWidth, $origHeight) = getimagesize($file_path);

		$src_image = $this->image_create_from_file($file_path, $this->file['type']);
		if (!$src_image) {
			return false; // Failed to create image from file
		}

		// Calculate resize ratio respecting aspect ratio
		$ratio_orig = $origWidth / $origHeight;
		$ratio_target = $targetWidth / $targetHeight;

		// Initialize dimensions for resizing
		$resizeWidth = $targetWidth;
		$resizeHeight = $targetHeight;

		if ($crop) {
			if ($ratio_orig > $ratio_target) {
				// Original image is wider, fit height
				$resizeWidth = $targetHeight * $ratio_orig;
				$resizeHeight = $targetHeight;
			} else {
				// Original image is taller, fit width
				$resizeWidth = $targetWidth;
				$resizeHeight = $targetWidth / $ratio_orig;
			}
		} else {
			if ($ratio_orig > $ratio_target) {
				// Original image is wider, fit height
				$resizeWidth = $targetHeight * $ratio_orig;
				$resizeHeight = $targetHeight;
			} else {
				// Original image is taller, fit width
				$resizeWidth = $targetWidth;
				$resizeHeight = $targetWidth / $ratio_orig;
			}
		}

		// Create a new true color image with the calculated dimensions
		$resized_image = imagecreatetruecolor($resizeWidth, $resizeHeight);

		// Preserve transparency in PNG images
		if ($this->file['type'] == 'image/png') {
			imagecolortransparent($resized_image, imagecolorallocatealpha($resized_image, 0, 0, 0, 127));
			imagealphablending($resized_image, false);
			imagesavealpha($resized_image, true);
		}

		// Resize the original image
		imagecopyresampled($resized_image, $src_image, 0, 0, 0, 0, $resizeWidth, $resizeHeight, $origWidth, $origHeight);

		// Calculate cropping coordinates to center the image
		$crop_x = ($resizeWidth - $targetWidth) / 2;
		$crop_y = ($resizeHeight - $targetHeight) / 2;

		// Create the final image with the target dimensions
		$destination_image = imagecreatetruecolor($targetWidth, $targetHeight);

		// Preserve transparency in PNG images
		if ($this->file['type'] == 'image/png') {
			imagecolortransparent($destination_image, imagecolorallocatealpha($destination_image, 0, 0, 0, 127));
			imagealphablending($destination_image, false);
			imagesavealpha($destination_image, true);
		}

		// Crop the resized image to the target dimensions
		imagecopyresampled($destination_image, $resized_image, 0, 0, $crop_x, $crop_y, $targetWidth, $targetHeight, $targetWidth, $targetHeight);

		// Save the image in the original format
		$this->image_save_to_file($destination_image, $path . $filename, $this->file['type']);

		// Save the image in WebP format
		$this->image_save_to_webp($destination_image, $path . pathinfo($filename, PATHINFO_FILENAME) . '.webp', 70); // Adjust quality as needed

		// Cleanup
		imagedestroy($src_image);
		imagedestroy($resized_image);
		imagedestroy($destination_image);
	}


	private function image_create_from_file($filepath, $type)
	{
		switch ($type) {
			case 'image/jpeg':
				return imagecreatefromjpeg($filepath);
			case 'image/png':
				return imagecreatefrompng($filepath);
			case 'image/gif':
				return imagecreatefromgif($filepath);
			case 'image/webp':
				return imagecreatefromwebp($filepath);
			default:
				return false;
		}
	}

	private function image_save_to_file($image, $filepath, $type)
	{
		switch ($type) {
			case 'image/jpeg':
				imagejpeg($image, $filepath, 80); // Adjust quality as needed
				break;
			case 'image/png':
				imagepng($image, $filepath, 6); // Adjust compression level as needed
				break;
			case 'image/gif':
				imagegif($image, $filepath);
				break;
			case 'image/webp':
				imagewebp($image, $filepath, 85); // Adjust quality as needed
				break;
		}
	}

	private function image_save_to_webp($image, $filepath, $quality)
	{
		return imagewebp($image, $filepath, $quality);
	}

	private function save_original()
	{
		move_uploaded_file($this->tmp_name, $this->orig_path . $this->filename);
	}

	public function resize($width, $height)
	{
		$this->resize = true;
		$this->width = $width;
		$this->height = $height;
	}

	public function thumb($width = 100, $height = 100, $crop = true)
	{
		$this->thumb = true;
		$this->thumb_width = $width;
		$this->thumb_height = $height;
		$this->thumb_crop = $crop;
	}

	// Rotate Exif function omitted for brevity
} -->


<!-- Get General information -->


<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Google tag (gtag.js) -->
	<script async src="https://www.googletagmanager.com/gtag/js?id=G-KPH5E0LJ8M"></script>
	<script>window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);}gtag('js',new Date());gtag('config','G-KPH5E0LJ8M');</script>
	<!-- Required meta tags -->
	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
	<meta charset="utf-8"/>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no">

			<title>Bowlen & bites - Bowling de Kaden Drachten</title>
		<meta name="description" content="Bowlen & bites arrangementen zijn een complete avond uit, bowlen en daarbij een hapje en een drankje. De perfecte arrangementen voor groepen! Ben je ben je vrienden, familie of collega's? "/>
		<meta name="keywords" content="bowling, bites, arrangementen, familie, collega, collega's, personeel, vrienden, uitje"/>

		<!-- <meta name="Distribution" content="Global" /> -->
		<meta name="Rating" content="General"/>
		<meta name="Robots" content="INDEX,FOLLOW"/>
		<meta name="Revisit-after" content="7 Days"/>
		<meta name="author" content="Spinnerz communicatie">
		<link rel="canonical" href="http://www.bowlingdekaden.nl/Bowlen en bites		"/>

		<link rel="apple-touch-icon" sizes="180x180" href="/favicons/apple-touch-icon.png">
		<link rel="icon" type="image/png" sizes="32x32" href="/favicons/favicon-32x32.png">
		<link rel="icon" type="image/png" sizes="16x16" href="/favicons/favicon-16x16.png">
		<link rel="manifest" href="/favicons/site.webmanifest">
		<link rel="mask-icon" href="/favicons/safari-pinned-tab.svg" color="#000000">
		<link rel="shortcut icon" href="/favicons/favicon.ico">
		<meta name="msapplication-TileColor" content="#ffffff">
		<meta name="msapplication-config" content="/favicons/browserconfig.xml">
		<meta name="theme-color" content="#ffffff">


	<!-- Bootstrap CSS -->
	<!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous"> -->

	<link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;1,200;1,300&display=swap" rel="stylesheet"/>
	<link href="/node_modules/luminous-lightbox/dist/luminous-basic.min.css" rel="stylesheet"/>
	<script src="https://kit.fontawesome.com/0305b9bde9.js" crossorigin="anonymous"></script>
	<link rel="stylesheet" href="/node_modules/animate.css/animate.min.css"/>
	<link rel="stylesheet" href="/css/jquery-ui-min.css">
	<link rel="stylesheet" href="/owlcarousel/owl.carousel.min.css">
	<link rel="stylesheet" href="/owlcarousel/owl.theme.default.min.css">
	<link rel="stylesheet" href="/css/main.min.css"/>
	<link rel="stylesheet" href="/node_modules/pickadate/themes/classic.css" type="text/css"/>
	<link rel="stylesheet" href="/node_modules/pickadate/themes/classic.date.css" type="text/css"/>


	<script src="https://www.google.com/recaptcha/api.js" async defer></script>

	<script defer data-domain="bowlingdekaden.nl" src="https://tester.spinnerz.nl/js/script.js"></script>
</head>

<body id="top">

	
							<div class="carousel slide" data-ride="carousel" style="z-index: 3;">
					<!-- <nav class="navbar navbar-expand-xl navbar-dark transparent fixed-top scrollTo "> -->
<nav class="navbar navbar-expand-xl navbar-dark transparent fixed-top scrollTo ">

	<div class="container-fluid">


		<a class="navbar-brand" href="/index.php"><img class="navLogo" src="https://ik.imagekit.io/mimiudrq1bh/images/logo-white.svg"> </img></a>
		<span class="text-center d-block d-xl-none addressinfoSM white csform">Zuidkade 75 Drachten<br><a href="tel:0512547751">0512 547 751</a> | info@bowlingdekaden.nl</span>
		</span>

		<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
			<span class="navbar-toggler-icon"></span>
		</button>

		<div class="collapse navbar-collapse" id="navbarSupportedContent">
			<ul class="navbar-nav me-auto" data-easing="easeInOutExpo" data-speed="1250" data-offset="65">
				
				<li class="nav-item "><a class="nav-link" href="Over+ons">Over ons</a></li><li class="nav-item "><a class="nav-link" href="Losse+baan">Losse baan</a></li><li class="nav-item "><a class="nav-link" href="Bowlen+en+bites">Bowlen en bites</a></li><li class="nav-item "><a class="nav-link" href="Bowlen+en+eten">Bowlen en eten</a></li><li class="nav-item "><a class="nav-link" href="Kidsparty">Kidsparty</a></li><li class="nav-item "><a class="nav-link" href="Zaalverhuur">Zaalverhuur</a></li><li class="nav-item "><a class="nav-link" href="Competitie">Competitie</a></li>				<!-- echo ' <li class="nav-link ' . $active . '"><a href="#">Contact</li>'; -->

				<li class="nav-item contact"><a href="#navContact" class="nav-link">Contact & Openingstijden</a></li>

			</ul>
			<span class="navbar-text d-none d-xl-block">Zuidkade 75 Drachten				<a href="https://www.google.com/maps/place/Bowling+en+Dartcentrum+de+Kaden+Drachten/@53.1068726,6.1052168,17z/data=!4m12!1m6!3m5!1s0x47c84e2b0c5007b3:0xd392b4616f52957c!2sBowling+en+Dartcentrum+de+Kaden+Drachten!8m2!3d53.1069319!4d6.1073978!3m4!1s0x47c84e2b0c5007b3:0xd392b4616f52957c!8m2!3d53.1069319!4d6.1073978" target="_blank"><i class="fas fa-map-marker-alt px-1 animateSocial" data-toggle="tooltip" data-placement="bottom" title="Vind ons op Google Maps"></i></a>
				<a href="tel:0512547751"><i class="fal fa-phone-office px-1 animateSocial" data-toggle="tooltip" data-placement="bottom" title="Bel ons"></i></a>
				<a target="_blank" href="https://www.facebook.com/bowlingdekaden/"><i class="fab fa-facebook px-1 animateSocial" data-toggle="tooltip" data-placement="bottom" title="Volg ons op Facebook"></i></a>
									<a target="_blank" href="https://www.instagram.com/bowlingdekaden/"><i class="fab fa-instagram px-1 animateSocial" data-toggle="tooltip" data-placement="bottom" title="Volg ons op Instagram"></i></a>
							</span>
		</div>
</nav>					<div class="carousel-inner block" role="listbox" style="background-image:url(https://ik.imagekit.io/mimiudrq1bh/upload/custom_pages/pages/IMG_8361.JPG)">
						<div class="carousel-item active">
							<div class="d-flex align-items-center justify-content-center bg-others">
								<div class="row">
									<div class="col-12 text-center">
										<image class="topLogoOther" src="/images/logo-white.svg" style="margin-top:0px;">
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			
			<div class="container-fluid  pb-5" id="navbowlen-en-bites"><div class="container">

			<div class="col-12 pt-sm-1 pt-md-5 p-sm-1 p-md-5 wow animate__animated animate__fadeIn">
				<h1 class="mt-5 pageTitle  mb-1 ">Bowlen & bites</h1>
				<h3 class="color3 pageSubTitle mb-4 ">Een complete avond bowlen</h3>
				<p class=" ">Bowlen &amp; bites arrangementen zijn een complete avond uit, bowlen en daarbij een hapje en een drankje.<br/>
De perfecte arrangementen voor groepen! Ben je met vrienden, familie of collega&#39;s?&nbsp;<br/>
Met de bowlen en bites arrangementen maak je je avond compleet!<br/>
<br/>
<strong>Natuurlijk is het ook mogelijk om in overleg zelf een arrangement samen te stellen!</strong></p>
				<div class="row my-5"><div class="col-12 mb-2"><h5>Onderstaand zie je de mogelijkheden</h5></div>
						<div class="col-sm-12 col-md-6 col-lg-4 mb-4">

							<div class="card  d-flex arrangementBorder">
								<div class="card-body">
									<p class="text-center color1"><img src="https://ik.imagekit.io/mimiudrq1bh/images/logo-black.svg" style="max-width:114px;"></p>
									<h5 class="card-title arrangementTitle">Let's have a party</h5>
									<p>Prijs: €24,95 p.p.</p>
									<p class="card-text">vanaf 20 pers.<br/>
<br/>
Borrelarrangement feestzaal 4 uren<br/>
<br/>
Ontvangst.<br/>
Onbeperkt Heineken/Amstel bier<br/>
Frisdranken,wijnen en sappen<br/>
Op tafel nootjes en pinda&#39;s<br/>
Incl.zaalhuur en bediening</p>
								</div>

								<div class="card-footer d-grid">

																			<button class="col-12 btn btn-primary" data-bs-toggle="modal" data-bs-target="#resModal">
											<i class="fas fa-chevron-right"></i> RESERVEER NU
										</button>
																	</div>

							</div>
						</div>

					
						<div class="col-sm-12 col-md-6 col-lg-4 mb-4">

							<div class="card  d-flex arrangementBorder">
								<div class="card-body">
									<p class="text-center color1"><img src="https://ik.imagekit.io/mimiudrq1bh/images/logo-black.svg" style="max-width:114px;"></p>
									<h5 class="card-title arrangementTitle">unlimited 2.5 ours of fun</h5>
									<p>Prijs: €42,50 p.p.</p>
									<p class="card-text">Vanaf 6 pers,<br/>
<br/>
<br/>
Zo kun je aan je budget houden.maar toch onbeperkt drinken en gezellig bowlen.<br/>
2 uren bowlen&nbsp;<br/>
Bittergarnituur<br/>
2.5&nbsp;uren vrij drinken<br/>
(bier,fris,wijn en binnenlands)<br/>
&nbsp;</p>
								</div>

								<div class="card-footer d-grid">

																			<button class="col-12 btn btn-primary" data-bs-toggle="modal" data-bs-target="#resModal">
											<i class="fas fa-chevron-right"></i> RESERVEER NU
										</button>
																	</div>

							</div>
						</div>

					
						<div class="col-sm-12 col-md-6 col-lg-4 mb-4">

							<div class="card  d-flex arrangementBorder">
								<div class="card-body">
									<p class="text-center color1"><img src="https://ik.imagekit.io/mimiudrq1bh/images/logo-black.svg" style="max-width:114px;"></p>
									<h5 class="card-title arrangementTitle">Arrangement Lucky Strike</h5>
									<p>Prijs: €27,50 p.p.</p>
									<p class="card-text">Vanaf 6 pers.per baan<br/>
<br/>
2 uren bowlen<br/>
4 consumpties<br/>
4 warme hapjes<br/>
<br/>
<em>Meerprijs:</em><br/>
4 personen&nbsp;&nbsp;&euro;&nbsp;2.00 p.p.<br/>
5 personen&nbsp;&euro;&nbsp;1.00 p.p.&nbsp;<br/>
* niet mogelijk tijdens de kerstdagen<br/>
&nbsp;</p>
								</div>

								<div class="card-footer d-grid">

																			<button class="col-12 btn btn-primary" data-bs-toggle="modal" data-bs-target="#resModal">
											<i class="fas fa-chevron-right"></i> RESERVEER NU
										</button>
																	</div>

							</div>
						</div>

					
						<div class="col-sm-12 col-md-6 col-lg-4 mb-4">

							<div class="card  d-flex arrangementBorder">
								<div class="card-body">
									<p class="text-center color1"><img src="https://ik.imagekit.io/mimiudrq1bh/images/logo-black.svg" style="max-width:114px;"></p>
									<h5 class="card-title arrangementTitle">Arrangement Spare </h5>
									<p>Prijs: €16,50 p.p.</p>
									<p class="card-text">Vanaf 6 pers. per baan<br/>
<br/>
1 uur bowlen&nbsp;<br/>
2 consumpties<br/>
4 warme hapjes<br/>
<br/>
<em>Meerprijs:</em><br/>
4 personen&nbsp;&nbsp;&euro;&nbsp;2.00 p.p.<br/>
5 personen&nbsp;&euro;&nbsp;1.00 p.p.&nbsp;<br/>
&nbsp;</p>
								</div>

								<div class="card-footer d-grid">

																			<button class="col-12 btn btn-primary" data-bs-toggle="modal" data-bs-target="#resModal">
											<i class="fas fa-chevron-right"></i> RESERVEER NU
										</button>
																	</div>

							</div>
						</div>

					
						<div class="col-sm-12 col-md-6 col-lg-4 mb-4">

							<div class="card  d-flex arrangementBorder">
								<div class="card-body">
									<p class="text-center color1"><img src="https://ik.imagekit.io/mimiudrq1bh/images/logo-black.svg" style="max-width:114px;"></p>
									<h5 class="card-title arrangementTitle">Arrangement Frame</h5>
									<p>Prijs: €19,50 p.p.</p>
									<p class="card-text">Vanaf 6 pers.per baan<br/>
<br/>
Koffie met gebak<br/>
1.5 uur bowlen<br/>
2 consumpties<br/>
<br/>
<em>Meerprijs:</em><br/>
4 personen&nbsp;&nbsp;&euro;&nbsp;2.00 p.p.<br/>
5 personen&nbsp;&euro;&nbsp;1.00 p.p.&nbsp;<br/>
&nbsp;</p>
								</div>

								<div class="card-footer d-grid">

																			<button class="col-12 btn btn-primary" data-bs-toggle="modal" data-bs-target="#resModal">
											<i class="fas fa-chevron-right"></i> RESERVEER NU
										</button>
																	</div>

							</div>
						</div>

					
						<div class="col-sm-12 col-md-6 col-lg-4 mb-4">

							<div class="card  d-flex arrangementBorder">
								<div class="card-body">
									<p class="text-center color1"><img src="https://ik.imagekit.io/mimiudrq1bh/images/logo-black.svg" style="max-width:114px;"></p>
									<h5 class="card-title arrangementTitle">Arrangement Perfect Game</h5>
									<p>Prijs: €23,50 p.p.</p>
									<p class="card-text">Vanaf 6 pers per baan.<br/>
<br/>
1.5 uur bowlen<br/>
3 consumpties&nbsp;<br/>
4 warme hapjes<br/>
<br/>
<em>Meerprijs:</em><br/>
4 personen&nbsp;&nbsp;&euro;&nbsp;2.00 p.p.<br/>
5 personen&nbsp;&euro;&nbsp;1.00 p.p.<br/>
&nbsp;</p>
								</div>

								<div class="card-footer d-grid">

																			<button class="col-12 btn btn-primary" data-bs-toggle="modal" data-bs-target="#resModal">
											<i class="fas fa-chevron-right"></i> RESERVEER NU
										</button>
																	</div>

							</div>
						</div>

					
						<div class="col-sm-12 col-md-6 col-lg-4 mb-4">

							<div class="card  d-flex arrangementBorder">
								<div class="card-body">
									<p class="text-center color1"><img src="https://ik.imagekit.io/mimiudrq1bh/images/logo-black.svg" style="max-width:114px;"></p>
									<h5 class="card-title arrangementTitle">Arrangement Patat Bowlen</h5>
									<p>Prijs: €15,50 p.p.</p>
									<p class="card-text">Vanaf 6 pers.<br/>
<br/>
1 uur bowlen<br/>
Patat met een frikadel,kroket of kipnuggets<br/>
1 glas frisdrank<br/>
Vegetarisch en glutenvrij tegen meerprijs<br/>
<br/>
Meerprijs:<br/>
4 personen&nbsp;&nbsp;&euro;&nbsp;2.00 p.p.<br/>
5 personen&nbsp;&euro;&nbsp;1.00 p.p.&nbsp;<br/>
<br/>
&nbsp;</p>
								</div>

								<div class="card-footer d-grid">

																			<button class="col-12 btn btn-primary" data-bs-toggle="modal" data-bs-target="#resModal">
											<i class="fas fa-chevron-right"></i> RESERVEER NU
										</button>
																	</div>

							</div>
						</div>

								</div>

		
				<!-- Include photo album -->
		

		<!-- show random arrangementen -->
		

				</div>
							</div>

</div>

<div id="navContact" class="container-fluid colorBg3 csform">
    <div class="row pt-5">
        <div class="col-12">
            <h5 class="text-white text-center pb-3">Heb je een vraag of wil je meer informatie?</h5>
        </div>
    </div>
    <div class="row text-center text-white pb-3">
        <div class="col-md-3 pb-4">
            <p class="font-weight-bold">volg ons</p>
            <a href="https://www.instagram.com/bowlingdekaden/" target=" _blank"><i class=" fab fa-instagram fa-2x px-2 animateSocial"></i></a><a href="https://www.facebook.com/bowlingdekaden/" target="_blank"><i class="fab fa-facebook px-2 fa-2x animateSocial"></i></a>
        </div>
        <div class="col-md-3 pb-4">
            <p class="font-weight-bold">stuur een Whatsapp bericht</p>
                        <i class="fab fa-whatsapp px-2"></i> <a href="https://wa.me/31612727842" target="_blank">06 127 278 42</a>
        </div>
        <div class="col-md-3 pb-4">
            <p class="font-weight-bold">bel ons</p>
            <i class="fas fa-mobile-alt px-2"></i> <a href="tel:0512547751">0512 547 751</a>
        </div>
        <div class=" col-md-3 pb-4">
            <p class="font-weight-bold">mail ons</p>
            <i class="fas fa-mobile-alt px-2"></i> info@bowlingdekaden.nl        </div>
    </div>
</div>
<div class="container-fluid colorBg1" id="cform">
    <div class="container py-5">
        <div class="row">
            <div class="col-sm-12 col-md-7 text-center mb-5">
                <h5 class="mb-5 text-white csform">Stel je vraag online</h5>

                                    <form method="post" action="/index.php#cform">
                        <input type="hidden" name="contactf" value="contactf">
                        <div class="row mb-3 g-3">

                            <div class="col-md-6">
                                <input id="text" type="text" name="name" class="form-control" placeholder="Naam" required>
                            </div>

                            <div class="col-md-6">
                                <input id="phone" type="tel" name="phone" class="form-control" placeholder="Telefoonnummer" maxlength='10' minlength='10' required>
                            </div>
                        </div>

                        <div class="row mb-3">
                            <div class="col">
                                <input id="email" type="email" name="email" class="form-control" placeholder="Email" required>
                            </div>
                        </div>

                        <div class="row mb-1 g-3">
                            <div class="col-sm-12 col-md-7">
                                <textarea id="message" name="message" cols="40" rows="3" class="form-control" placeholder="Uw vraag / opmerking" required></textarea>
                            </div>
                            <div class="col-sm-12 col-md-5">
                                <div class="g-recaptcha " style=" padding:0px; margin-bottom: 20px;" data-sitekey="6Le3z64UAAAAAJexfES0cAqsT3Xo3aczAxQ72qEq"></div>
                                <input type="hidden" class="hiddenRecaptcha required" name="hiddenRecaptcha" id="hiddenRecaptcha" required>
                            </div>
                        </div>

                        <div class="form-group d-grid d-block">
                            <button name="submit2" type="submit" class="btn btn-primary btn-md btn-block"><i class="fas fa-chevron-right"> Verstuur</i></button>
                        </div>
                    </form>

                            </div>

            <div class="col-sm-12 col-md-4 offset-md-1 text-center">

                <p class="d-md-none">
                    <hr class="white d-md-none mb-4">
                </p>

                <h5 class="mb-5 text-white">Openingstijden</h5>

                                                            <p style="color:#fff;"><br/>
<strong>Onze openingstijden kunnen afwijken.&nbsp;</strong><br/>
Voor arrangementen op maat of grotere groepen en scholen hanteren wij flexibele openingstijden.<br/>
Hemelvaartsdag en tijdens de pinksterdagen geopend</p>
                                        <table class="table table-sm text-center text-white">
                        <tr class="fw-light fs-6">
                            <td>Maandag</td>
                            <td>Gesloten alleen geopend voor scholen en groepen op reservering</td>
                        </tr>
                        <tr class="fw-light fs-6">
                            <td>Dinsdag</td>
                            <td> Gesloten alleen geopend voor scholen en groepen op reservering</td>
                        </tr>
                        <tr class="fw-light fs-6">
                            <td>Woensdag</td>
                            <td>vanaf 14.00 uur</td>
                        </tr>
                        <tr class="fw-light fs-6">
                            <td>Donderdag</td>
                            <td>vanaf 14.00 uur</td>
                        </tr>
                        <tr class="fw-light fs-6">
                            <td>Vrijdag</td>
                            <td>vanaf 14.00 uur</td>
                        </tr>
                        <tr class="fw-light fs-6">
                            <td>Zaterdag</td>
                            <td>vanaf 14.00 uur</td>
                        </tr>
                        <tr class="fw-light fs-6">
                            <td>Zondag</td>
                            <td>vanaf 14.00 uur</td>
                        </tr>
                    </table>

                            </div>

        </div>
    </div>
</div>
<script>window.onload=function(){var recaptcha=document.querySelector('#g-recaptcha-response');if(recaptcha){recaptcha.setAttribute("required","required");}};</script>
<!-- Footer -->
<div class="blueBackTop mt-5"></div>
<div class="container-fluid blueBackFooter">
	<div class="container">

		<button data-bs-toggle="modal" data-bs-target="#resModal" class="btn btn-primary fixedbutton btn-sm"><i class="pr-2 fas fa-chevron-right"></i> RESERVEREN</button>
		<!-- Modal -->
		<div class="modal fade" id="resModal" tabindex="-1" aria-labelledby="resModalLabel" aria-hidden="true">
			<div class="modal-dialog modal-dialog-centered modal-lg">
				<div class="modal-content">
					<div class="modal-header">
						<h5 class="modal-title text-center" id="resModalLabel">RESERVEREN</h5>
						<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
					</div>
					<div class="modal-body">
						    <form class="form needs-validation resv" id="resform" style="z-index:1000;">
        <div class="row mb-4">
            <div class="col">
                <!-- <input type="text" name="date" id="date" class="form-control datepicker" placeholder="Klik hier om een datum te kiezen" required readonly> -->
                <input id="date" name="date" type="text" class="form-control input_bg gray_form datepicker" placeholder="kies een datum" required readonly>

            </div>
        </div>

        <div class="row mb-4">
            <div class="col-6">
                <select name="persons" class="form-select" required="required">
                    <option value="">Aantal pers.</option>
                                            <option value="1">1</option>
                                            <option value="2">2</option>
                                            <option value="3">3</option>
                                            <option value="4">4</option>
                                            <option value="5">5</option>
                                            <option value="6">6</option>
                                            <option value="7">7</option>
                                            <option value="8">8</option>
                                            <option value="9">9</option>
                                            <option value="10">10</option>
                                            <option value="11">11</option>
                                            <option value="12">12</option>
                                            <option value="13">13</option>
                                            <option value="14">14</option>
                                            <option value="15">15</option>
                                            <option value="16">16</option>
                                            <option value="17">17</option>
                                            <option value="18">18</option>
                                            <option value="19">19</option>
                                            <option value="20">20</option>
                                            <option value="21">21</option>
                                            <option value="22">22</option>
                                            <option value="23">23</option>
                                            <option value="24">24</option>
                                            <option value="25">25</option>
                                            <option value="26">26</option>
                                            <option value="27">27</option>
                                            <option value="28">28</option>
                                            <option value="29">29</option>
                                            <option value="30">30</option>
                                            <option value="31">31</option>
                                            <option value="32">32</option>
                                            <option value="33">33</option>
                                            <option value="34">34</option>
                                            <option value="35">35</option>
                                            <option value="36">36</option>
                                            <option value="37">37</option>
                                            <option value="38">38</option>
                                            <option value="39">39</option>
                                            <option value="40">40</option>
                                            <option value="41">41</option>
                                            <option value="42">42</option>
                                            <option value="43">43</option>
                                            <option value="44">44</option>
                                            <option value="45">45</option>
                                            <option value="46">46</option>
                                            <option value="47">47</option>
                                            <option value="48">48</option>
                                            <option value="49">49</option>
                                            <option value="50">50</option>
                                    </select>
            </div>
            <div class="col-6">
                <select name="time" class="form-select" required="required">
                    <option value="">Tijdstip aankomst</option>
                    <option value=14:00>14:00</option><option value=14:30>14:30</option><option value=15:00>15:00</option><option value=15:30>15:30</option><option value=16:00>16:00</option><option value=16:30>16:30</option><option value=17:00>17:00</option><option value=17:30>17:30</option><option value=18:00>18:00</option><option value=18:30>18:30</option><option value=19:00>19:00</option><option value=19:30>19:30</option><option value=20:00>20:00</option><option value=20:30>20:30</option><option value=21:00>21:00</option><option value=21:30>21:30</option><option value=22:00>22:00</option><option value=22:30>22:30</option><option value=23:00>23:00</option>                </select>
            </div>
        </div>

        <div class="row mb-4">
            <div id="arrangementDiv" class="col-sm-12 col-md-6 mb-4 mb-md-0">
                <select name="arrangement" id="arrangement" onchange="lengthFunction()" class="form-select">
                    <option value="">Arrangement (optioneel)</option>
                                            <option value="Bowlen-eten - Arrangement A">Bowlen-eten - Arrangement A (incl. 1.5 uur bowlen)</option>
                                            <option value="Bowlen-eten - Arrangement B">Bowlen-eten - Arrangement B (incl. 1.5 uur bowlen)</option>
                                            <option value="Bowlen-eten - Arrangement C">Bowlen-eten - Arrangement C (incl. 1.5 uur bowlen)</option>
                                            <option value="Bowlen-eten - Arrangement D">Bowlen-eten - Arrangement D (incl. 1.5 uur bowlen)</option>
                                            <option value="Bowlen-eten - Arrangement E">Bowlen-eten - Arrangement E (incl. 1.5 uur bowlen)</option>
                                            <option value="Bowlen-eten - Arrangement F">Bowlen-eten - Arrangement F (incl. 1.5 uur bowlen)</option>
                                            <option value="Bowlen-bites - Arrangement Frame">Bowlen-bites - Arrangement Frame (incl. 1.5 uur bowlen)</option>
                                            <option value="Bowlen-eten - Arrangement G">Bowlen-eten - Arrangement G (incl. 1.5 uur bowlen)</option>
                                            <option value="Bowlen-bites - Arrangement Perfect Game">Bowlen-bites - Arrangement Perfect Game (incl. 1.5 uur bowlen)</option>
                                            <option value="Bowlen-bites - Arrangement Spare ">Bowlen-bites - Arrangement Spare  (incl. 1 uur bowlen)</option>
                                            <option value="Bowlen-bites - Arrangement Lucky Strike">Bowlen-bites - Arrangement Lucky Strike (incl. 2 uur bowlen)</option>
                                            <option value="Bowlen-bites - Arrangement Patat Bowlen">Bowlen-bites - Arrangement Patat Bowlen (incl. 1 uur bowlen)</option>
                                            <option value="Bowlen-bites - Let's have a party">Bowlen-bites - Let's have a party (incl. 0 uur bowlen)</option>
                                            <option value="Bowlen-eten - Lotus">Bowlen-eten - Lotus (incl. 1.5 uur bowlen)</option>
                                            <option value="Kids - Party tasty cake ">Kids - Party tasty cake  (incl. 1.5 uur bowlen)</option>
                                            <option value="Kids - Party tasty chips ">Kids - Party tasty chips  (incl. 1.5 uur bowlen)</option>
                                            <option value="Kids - Party tasty fries ">Kids - Party tasty fries  (incl. 1.5 uur bowlen)</option>
                                            <option value="Kids - Tasty  mini pancakes">Kids - Tasty  mini pancakes (incl. 1.5 uur bowlen)</option>
                                            <option value="Bowlen-bites - unlimited 2.5 ours of fun">Bowlen-bites - unlimited 2.5 ours of fun (incl. 2 uur bowlen)</option>
                                    </select>
            </div>

            <div class="col-sm-12 col-md-6">
                <select name="length" id="length" class="form-select" required="required">
                    <option value="">Hoe lang wil je bowlen?</option>
                    <option value="1 uur">1 uur</option>
                    <option value="1.5 uur">1.5 uur</option>
                    <option value="2 uren">2 uren</option>
                </select>
            </div>
        </div>

        </select>

        <div class="row mb-4">
            <div class="col">
                <input type="text" name="name" class="form-control" placeholder="Naam" required="required">
                <div class="valid-feedback">
                    Looks good!
                </div>
            </div>
            <div class="col">
                <input type="text" name="phone" minlength="10" class="form-control" placeholder="Telefoonnummer" required="required">
            </div>
        </div>
        <div class="row mb-4">
            <div class="col">
                <input type="email" name="email" class="form-control" placeholder="Email-adres" required="required">
            </div>
        </div>

        <div class="d-grid  gap-2">
            <button type="submit" class="btn btn-primary" name="submit">VERSTUUR</button>
        </div>
    </form>

    <p class="mt-3 text-small" id="notice">Wil je een reservering maken voor &#39;vandaag&#39;? Neem contact met ons op! Bel 0512-547751 of stuur een Whatsapp bericht naar&nbsp;06 127 278 42.</p>

    <div id="response"></div>


    <script>function lengthFunction(){var arrangement=document.getElementById("arrangement").value;if(arrangement!==""){var element=document.getElementById("length");var element2=document.getElementById("arrangementDiv");element.classList.add("hide");element2.classList.remove("col-md-6");element2.classList.remove("mb-sm-4");element2.classList.add("col-md-12");element2.classList.remove("mb-4");element2.classList.remove("mb-md-0");}else{var element=document.getElementById("length");var element2=document.getElementById("arrangementDiv");element.classList.remove("hide");element2.classList.remove("col-md-12");element2.classList.add("col-md-6");element2.classList.add("mb-4");element2.classList.add("mb-md-0");}};</script>					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-primary" data-bs-dismiss="modal">Sluiten</button>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<div class="map"></div>


<div class="container-fluid blueBackPayOff my-3">
	<div class="row py-3">
		<div class="col-12 text-center">© 2024 Bowling de Kaden Drachten - created with <i class="far fa-heart"></i> by Spinnerz Communicatie</div>
	</div>
</div>


<!-- Optional JavaScript; choose one of the two! -->

<!-- Option 1: jQuery and Bootstrap Bundle (includes Popper) -->

<!-- <script src="/js/jquery.js"></script> -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>

<script src="/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.min.js" integrity="sha256-eTyxS0rkjpLEo16uXTS0uVCS4815lc40K2iVpWDvdSY=" crossorigin="anonymous"></script>

<script src="/js/jquery.validate.js"></script>
<script src="/node_modules/waypoints/lib/noframework.waypoints.min.js"></script>
<script src="node_modules/luminous-lightbox/dist/luminous.min.js"></script>
<script src="/js/main.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAW0UkddS8kwTeQ1vuAozTBOhypC7W5J84"></script>
<script src="https://cdn.jsdelivr.net/gmap3/7.2.0/gmap3.min.js"></script>
<script src="/owlcarousel/owl.carousel.min.js"></script>
<script src="/js/wow.min.js"></script>
<script src="/node_modules/pickadate/picker.js"></script>
<script src="/node_modules/pickadate/picker.date.js"></script>

<script>new WOW().init();</script>

<script>$('.map').gmap3({center:[53.10712056967018,6.10733039682388],zoom:19}).marker([{position:[53.10712056967018,6.10733039682388],}]).on('click',function(marker){marker.setIcon('https://maps.google.com/mapfiles/marker_green.png');});</script>

<!-- ********************************Disabled days******************************** -->
<!-- <script>
		var DisableDatesJan = [" 24-12-2020", "25-12-2020" , "26-12-2020" , , "1-1-2021" , "2-1-2022" ]; function disabledDates(date) { var dmy=date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear(); if ($.inArray(dmy, DisableDatesJan)>
	= 0) {
		return [false, "", "Unavailable"];
	} else {
		//Show only sundays and thuersdays
		var day = date.getDay();
		return [(day == 1 || day == 2 || day == 3 || day == 4 || day == 5 || day == 6)];
	}
	}
</script>

<script>
	var myModal = document.getElementById('myModal')
	var myInput = document.getElementById('myInput')

	myModal.addEventListener('shown.bs.modal', function() {
		myInput.focus()
	})
</script> -->

</body>

</html>