
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<meta http-equiv="Content-Language" content="tr">
<title>Online Randevu | Deneme Firması</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta name="copyright" content="© Tum Hakları Saklıdır.">
<script type="text/javascript" src="https://cdn.pluto.com.tr/js/jquery-3.4.1.min.js"></script>
<link href="https://cdn.pluto.com.tr/css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="https://cdn.pluto.com.tr/css/content.css" rel="stylesheet" type="text/css" />
<link href="https://cdn.pluto.com.tr/css/lightbox.css" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="/uploads/logo/fav.png">
<style>
.navbar-light .topbar a {color: #005B80;}
.navbar-light .topbar a:hover {color: #009DDE;}
.navbar-light .navbar-nav .nav-link {color: #3F536E;}
.navbar-light .navbar-nav .nav-link:hover {color: #59759C;}
.pagetitle {color: #FFFFFF;}
.pagetitle a {color: #FFFFFF;}
.pagetitle a:hover {color: #C9C9C9;}
.footer {color: #FFFFFF;}
.footer a {color: #FFFFFF;}
.footer a:hover {color: #C9C9C9;}
.footer .is-social a > i {color: #FFFFFF;}
.footer .is-social a:hover > i {color: #C9C9C9;}
@media screen and (max-width: 800px) {.mobiletel{ position:fixed;width:40px;height:40px;bottom:56px;left:10px;z-index:100; } .mobilewhatsapp{ position:fixed;width:40px;height:40px;bottom:10px;left:10px;z-index:100; }}
@media screen and (min-width: 801px) {.mobiletel{ display:none; } .mobilewhatsapp{ position:fixed;width:40px;height:40px;bottom:10px;left:10px;z-index:100; }}

</style>

</head>
<body bgcolor="#FFFFFF" link="#CCCCCC" alink="#000000" text="#000000">

<div class='col-sm-12' style='background-color: #FFFFFF;'><div class='klik'><nav class='navbar navbar-expand-lg navbar-light'><div class='col-xl-12'><a class='navbar-brand' href='/'><img src='/uploads/logo/logo.png' alt='Logo'></a><button class='navbar-toggler' type='button' data-toggle='collapse' data-target='#navbarNavDropdown' aria-controls='navbarNavDropdown' aria-expanded='false' aria-label='Toggle navigation' style='float: right; margin-top:30px;'><span class='navbar-toggler-icon'></span></button><div class='collapse navbar-collapse' id='navbarNavDropdown'><ul class='navbar-nav'><li class='nav-item'><a href='/hakkimizda' class='nav-link'>Hakkımızda</a></li> <li class='nav-item'><a href='/hizmetler' class='nav-link'>Hizmetler</a></li> <li class='nav-item'><a href='/blog' class='nav-link'>Blog</a></li> <li class='nav-item'><a href='/randevu' class='nav-link'>Randevu</a></li> <li class='nav-item'><a href='/iletisim' class='nav-link'>İletişim</a></li> </ul></div></div></nav></div></div>

<div class="is-wrapper" id="is-wrapper">

<div class="is-section is-static pagetitle" style="border-top: 1px solid #006A95; border-bottom: 1px solid #006A95; background-color: #006A95;">	<div class="is-boxes100">
		<div class="is-box-centered">
			<div class="is-container container is-content-1200">
				<div class="clearfix">
					<div class="column two f1">
						<p style="margin: 30px 0">Online Randevu</p>
					</div>
					<div class="column two f2">
						<div class="pagetitle is-social" style="margin: 35px 0">
							<a href='/'>Ana sayfa</a> > <a href='/randevu'>Online Randevu</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<br>
<div class="is-section is-box is-section-20">
	<div class="is-boxes">
		<div class="is-box-centered">
			<div class="is-container container is-content-1200" style="margin-bottom: 45px;">
				<div class="clearfix">
					<div class="column full">
						<p>
						
						
						
						

	
    <link rel="stylesheet" media="screen" href="vendor/simplebar/dist/simplebar.min.css">
    <link rel="stylesheet" media="screen" href="vendor/tiny-slider/dist/tiny-slider.css">
    <link rel="stylesheet" media="screen" href="vendor/lightgallery.js/dist/css/lightgallery.min.css">
    <link rel="stylesheet" media="screen" href="vendor/flatpickr/dist/flatpickr.min.css">
    <link rel="stylesheet" media="screen" href="vendor/sweetalert2/dist/sweetalert2.min.css">
    <link rel="stylesheet" media="screen" href="css/theme.min.css">
    <link rel="stylesheet" media="screen" href="css/aos.css">
    <link rel="stylesheet" media="screen" href="vendor/bootstrap-pincode-input/css/bootstrap-pincode-input.css">

<main class="cs-page-wrapper">

<section class="position-relative pt-2 pb-3">

    <div class="container bg-overlay-content py-5 pt-md-6 pt-lg-0 my-lg-3 mb-lg-3">
     
    </div>
</section>

<section class="container bg-overlay-content" style="margin-top: -120px;">
    <div class="row">
        <div class="col-lg-12 col-sm-12">
		
            <form method="post" id="order-form" action="randevukayit/">

                <div class="card border-0 box-shadow-lg bg-white" id="card-paketler">
                    <div class="card-body pb-0">
                        <div class="row">
	
                                    <div class="col-lg-4 col-sm-6 mb-grid-gutter">
                                        <div class="card border-0 box-shadow w-100">
                                            <div class="card-img-top text-center py-5 px-grid-gutter" style="background-color: #f2f2f2; color: #000;">
                                                <h6 class="text-body mb-0" style="min-height:220px;"><img src="/uploads/1-xmiduj.jpg" style="border-radius: 100%;" height="160"><br>Op. Dr Adı Soyadı</h6>
                                            </div>
                                            <div class="card-body px-grid-gutter py-grid-gutter">
                                                <div class="text-center mb-2">
                                                    <button type="button" class="btn btn-outline-primary pack-buttons pack-button-1" style="background-color: #006A95; color: #FFFFFF;" onclick="selectPack('1', 'Op. Dr Adı Soyadı');">Randevu al</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
	
                                    <div class="col-lg-4 col-sm-6 mb-grid-gutter">
                                        <div class="card border-0 box-shadow w-100">
                                            <div class="card-img-top text-center py-5 px-grid-gutter" style="background-color: #f2f2f2; color: #000;">
                                                <h6 class="text-body mb-0" style="min-height:220px;"><img src="/uploads/3-axb702.jpg" style="border-radius: 100%;" height="160"><br>Doç. Dr. Abdulmuttalip Selami ÖZTÜRK</h6>
                                            </div>
                                            <div class="card-body px-grid-gutter py-grid-gutter">
                                                <div class="text-center mb-2">
                                                    <button type="button" class="btn btn-outline-primary pack-buttons pack-button-2" style="background-color: #006A95; color: #FFFFFF;" onclick="selectPack('2', 'Doç. Dr. Abdulmuttalip Selami ÖZTÜRK');">Randevu al</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
	
                                    <div class="col-lg-4 col-sm-6 mb-grid-gutter">
                                        <div class="card border-0 box-shadow w-100">
                                            <div class="card-img-top text-center py-5 px-grid-gutter" style="background-color: #f2f2f2; color: #000;">
                                                <h6 class="text-body mb-0" style="min-height:220px;"><img src="/uploads/profil.jpg" style="border-radius: 100%;" height="160"><br>adım soyadım</h6>
                                            </div>
                                            <div class="card-body px-grid-gutter py-grid-gutter">
                                                <div class="text-center mb-2">
                                                    <button type="button" class="btn btn-outline-primary pack-buttons pack-button-9" style="background-color: #006A95; color: #FFFFFF;" onclick="selectPack('9', 'adım soyadım');">Randevu al</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
             
                        </div>
                    </div>
                </div>

                <div class="card border-0 box-shadow-lg bg-white mb-4 card-hide" id="card-gosterge">
                    <div class="card-body">
                        <div class="progress mb-3" style="height: 4px;">
                            <div class="progress-bar order-progress-bar" role="progressbar" style="width: 0%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
                        </div>
                        <div class="row pt-4">
                            <div class="col-lg-3 col-sm-6">
                                <div class="media align-items-center mb-3">
                                    <div class="rounded-circle border text-center order-step-icon"><i class="fe-feather font-size-xl" id="order-progress-icon-1"></i></div>
                                    <div class="media-body pl-3">
                                        <span id="order-progress-1">
                                            <span class="d-block text-muted font-size-ms mb-1">1. Adım</span>
                                            <h6 class="mb-0">Genel bilgiler</h6>
                                        </span>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6">
                                <div class="media align-items-center mb-3">
                                    <div class="rounded-circle border text-center order-step-icon"><i class="fe-calendar font-size-xl" id="order-progress-icon-2"></i></div>
                                    <div class="media-body pl-3">
                                        <span id="order-progress-2">
                                            <span class="d-block text-muted font-size-ms mb-1">2. Adım</span>
                                            <h6 class="mb-0">Randevu tarihi</h6>
                                        </span>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6">
                                <div class="media align-items-center mb-3">
                                    <div class="rounded-circle border text-center order-step-icon"><i class="fe-clock font-size-xl" id="order-progress-icon-3"></i></div>
                                    <div class="media-body pl-3">
                                        <span id="order-progress-3">
                                            <span class="d-block text-muted font-size-ms mb-1">3. Adım</span>
                                            <h6 class="mb-0">Randevu saati</h6>
                                        </span>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-3 col-sm-6">
                                <div class="media align-items-center mb-3">
                                    <div class="rounded-circle border text-center order-step-icon"><i class="fe-file-text font-size-xl" id="order-progress-icon-4"></i></div>
                                    <div class="media-body pl-3">
                                        <span id="order-progress-4">
                                            <span class="d-block text-muted font-size-ms mb-1">4. Adım</span>
                                            <h6 class="mb-0">Randevuyu onayla</h6>
                                        </span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="card-hide" id="card-genel">
                    <div class="card border-0 box-shadow-lg bg-white mb-4">
                        <div class="card-body">
                            <div class="row">
                                <div class="col-sm-9 form-group">
                                    <label class="form-label" for="ch-title">Adınız Soyadınız<sup class="text-danger ml-1">*</sup></label>
                                    <input class="form-control" type="text" name="adsoyad" id="ch-title" placeholder="Adınız Soyadınız*" required>
                                </div>
                                <div class="col-sm-3 form-group">
                                    <label class="form-label" for="ch-service">Hizmet<sup class="text-danger ml-1">*</sup></label>
                                    <select class="form-control custom-select" name="hizmet" id="ch-service" placeholder="Hizmetler*" required>
                                        <option value="" selected="">Seçiniz</option>
										
                                        <option value="Genel">Genel</option> 
										
                                        <option value="Kontrol">Kontrol</option> 
   
									</select>
                                </div>
                                <div class="col-sm-3 form-group">
                                    <label class="form-label" for="ch-type">Cinsiyet<sup class="text-danger ml-1">*</sup></label>
                                    <select class="form-control custom-select" name="cinsiyet" id="ch-type" placeholder="Cinsiyet*" required>
                                        <option value="" selected="">Seçiniz</option>
                                        <option value="Erkek">Erkek</option>
										<option value="Kadın">Kadın</option>                                    
									</select>
                                </div>
                                <div class="col-sm-3 form-group">
                                    <label class="form-label" for="birth-input">Doğum tarihi<sup class="text-danger ml-1">*</sup></label>
                                    <div class="input-group-overlay">
                                        <input class="form-control appended-form-control cs-date-picker" type="text" name="dogumtarihi" placeholder="Tarih seç" id="birth-input" required data-datepicker-options='{"altInput": true, "altFormat": "d.m.Y", "dateFormat": "Y-m-d"}'>
                                        <div class="input-group-append-overlay">
                                            <span class="input-group-text">
                                                <i class="fe-calendar"></i>
                                            </span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-3 form-group">
                                    <label class="form-label" for="tel-input">Telefon<sup class="text-danger ml-1">*</sup></label>
                                    <input class="form-control" type="telefon" name="telefon" id="tel-input" placeholder="05xx xxx xx xx" required>
                                </div>
                                <div class="col-sm-3 form-group">
                                    <label class="form-label" for="email-input">E-posta</label>
                                    <input class="form-control" type="email" name="eposta" id="email-input" placeholder="E.posta adresi">
                                </div>
                                <div class="col-sm-12">
                                    <label class="form-label" for="ch-category">İletmek istediğiniz notunuz</label>
                                    <textarea class="form-control" rows="5" name="not" placeholder="Notunuz"></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="d-sm-flex flex-wrap justify-content-between align-items-center text-center mb-4">
                        <button type="button" class="btn btn-outline-dark btn-sm btn-previous-card" style="background-color: #006A95; color: #FFFFFF;" onclick="previousCard('1');"><i class="fe-arrow-left"></i> Geri dön</button>
                        <button type="button" class="btn btn-success btn-sm btn-next-card" onclick="nextCard('3');">Devam et <i class="fe-arrow-right"></i></button>
                    </div>
                </div>

                <div class="card border-0 box-shadow-lg bg-white mb-4 card-hide" id="card-genel-hata">
                    <div class="card-body pb-2">
                        <div class="alert alert-danger" id="card-genel-hata-isim">
                            Lütfen <strong>Adınızı Soyadınızı</strong> giriniz.
                        </div>
                        <div class="alert alert-danger" id="card-genel-hata-service">
                            Lütfen <strong>hizmet</strong> seçiniz.
                        </div>
                        <div class="alert alert-danger" id="card-genel-hata-gender">
                            Lütfen <strong>cinsiyetinizi</strong> seçiniz.
                        </div>
                        <div class="alert alert-danger" id="card-genel-hata-birth">
                            Lütfen <strong>doğum tarihinizi</strong> giriniz.
                        </div>
                        <div class="alert alert-danger" id="card-genel-hata-phone">
                            Lütfen <strong>telefon numaranızı</strong> giriniz.
                        </div>
                    </div>
                </div>

                <div class="card-hide" id="card-tarih">
                    <div class="card border-0 box-shadow-lg bg-white mb-4">
                        <div class="card-body">
                            <div id="myCalendarWrapper"></div>
                        </div>
                    </div>
                    <div class="d-sm-flex flex-wrap justify-content-between align-items-center text-center mb-4">
                        <button type="button" class="btn btn-outline-dark btn-sm btn-previous-card" onclick="previousCard('2');" style="background-color: #006A95; color: #FFFFFF;"><i class="fe-arrow-left"></i> Geri dön</button>
                        <button type="button" class="btn btn-success btn-sm btn-next-card" onclick="nextCard('4');">Devam et <i class="fe-arrow-right"></i></button>
                    </div>
                </div>

                <div class="card-hide" id="card-saat">
                    <div class="card border-0 box-shadow-lg bg-white mb-4">
                        <div class="card-body">
                            <div id="myTimeWrapper"></div>
                        </div>
                    </div>
                    <div class="d-sm-flex flex-wrap justify-content-between align-items-center text-center mb-4">
                        <button type="button" class="btn btn-outline-dark btn-sm btn-previous-card" onclick="previousCard('3');" style="background-color: #006A95; color: #FFFFFF;"><i class="fe-arrow-left"></i> Geri dön</button>
                        <button type="button" class="btn btn-success btn-sm btn-next-card" onclick="nextCard('5');">Devam et <i class="fe-arrow-right"></i></button>
                    </div>
                </div>

                <div class="card border-0 box-shadow-lg bg-white mb-4 card-hide" id="card-saat-hata">
                    <div class="card-body pb-2">
                        <div class="alert alert-danger">
                            Randevu saatini seçmediniz. Lütfen boş bir <strong>randevu saati</strong>ni seçip ilerleyin.
                        </div>
                    </div>
                </div>

                <div class="card-hide" id="card-onay">
                    <div class="card border-0 box-shadow-lg bg-white mb-4">
                        <div class="card-body pb-2">
                            <div class="row mx-n2">
                                <div class="col-md-4 col-sm-12 px-2 mb-3">
                                    <div class="bg-secondary h-100 rounded-lg p-4 text-center">
                                        <h5 class="font-size-sm font-weight-medium text-body">
										<b>Randevu veren</b></h5>
                                        <p class="h2 mb-0" id="grand-pack">.......</p>
                                    </div>
                                </div>
                                <div class="col-md-4 col-sm-12 px-2 mb-3">
                                    <div class="bg-secondary h-100 rounded-lg p-4 text-center">
                                        <h5 class="font-size-sm font-weight-medium text-body">
										<b>Randevu tarihi</b></h5>
                                        <p class="h2 mb-0" id="grand-date">..........</p>
                                    </div>
                                </div>
                                <div class="col-md-4 col-sm-12 px-2 mb-3">
                                    <div class="bg-secondary h-100 rounded-lg p-4 text-center">
                                        <h5 class="font-size-sm font-weight-medium text-body">
										<b>Randevu saati</b></h5>
                                        <p class="h2 mb-0" id="grand-time">..:..</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="d-sm-flex flex-wrap justify-content-between align-items-center text-center mb-4">
                        <div class="custom-control custom-checkbox mr-3">
                            <input class="custom-control-input" type="checkbox" id="notify-me" name="sozlesme" value="1" checked="" required="required">
                            <label class="custom-control-label" for="notify-me"><a target="_blank" href="/p/kvkk" style="color:#000000">KVKK Aydınlatma Metni</a>'ni okudum onaylıyorum.</label>
                        </div>
                        <div class="btn-group btn-group-sm mb-2" role="group" aria-label="Settings group">
                            <button type="button" class="btn btn-outline-dark btn-sm btn-previous-card" onclick="previousCard('4');" style="background-color: #006A95; color: #FFFFFF;"><i class="fe-arrow-left"></i> Geri dön</button>
                            <button type="submit" class="btn btn-success btn-sm btn-result-card">Tamamla <i class="fe-check"></i></button>
                        </div>
                    </div>
                </div>

                <div class="card border-0 box-shadow-lg bg-white mb-4 card-hide" id="card-hata"></div>

                <input type="hidden" name="paket_id" id="pack-id">
                <input type="hidden" name="doktoradsoyad" id="pack-name">
                <input type="hidden" name="saat" id="time-text">
                <input type="hidden" name="gun" id="current-day">
                <input type="hidden" name="tarih" id="current-date">

            </form>


        </div>
    </div>
</section>

</main>

<script src="vendor/jquery-3.5.1.min.js"></script>
<script src="vendor/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="vendor/bs-custom-file-input/dist/bs-custom-file-input.min.js"></script>
<script src="vendor/simplebar/dist/simplebar.min.js"></script>
<script src="vendor/smooth-scroll/dist/smooth-scroll.polyfills.min.js"></script>
<script src="vendor/parallax-js/dist/parallax.min.js"></script>
<script src="vendor/jarallax/dist/jarallax.min.js"></script>
<script src="vendor/tiny-slider/dist/min/tiny-slider.js"></script>
<script src="vendor/lightgallery.js/dist/js/lightgallery.min.js"></script>
<script src="vendor/lg-video.js/dist/lg-video.min.js"></script>
<script src="vendor/flatpickr/dist/flatpickr.min.js"></script>
<script src="vendor/flatpickr/dist/plugins/rangePlugin.js"></script>
<script src="vendor/sweetalert2/dist/sweetalert2.min.js"></script>
<script src="vendor/cleave.js/dist/cleave.min.js"></script>
<script src="js/theme.min.js"></script>
<script src="js/aos.js"></script>
<script>
    AOS.init();
</script>
<script>
    function progressBar(yuzde) {
        $(".order-progress-bar").css('width', yuzde + '%');
    }

    function progressSteps(section, action) {
        var sectionName = "";
        switch (section) {
            case '1':
                sectionName = "Genel bilgiler";
                break;
            case '2':
                sectionName = "Randevu tarihi";
                break;
            case '3':
                sectionName = "Randevu saati";
                break;
            case '4':
                sectionName = "Randevuyu onayla";
                break;
        }
        if (action == "Tamamlandı") {
            $("#order-progress-icon-" + section).removeClass("text-primary");
            $("#order-progress-icon-" + section).addClass("text-success");
            $("#order-progress-" + section).html('<span class="badge badge-success badge-pill mb-1">Tamamlandı</span><h6 class="text-success mb-0">' + sectionName + '</h6>');
        } else if (action == "Buradasınız") {
            $("#order-progress-icon-" + section).removeClass("text-success");
            $("#order-progress-icon-" + section).addClass("text-primary");
            $("#order-progress-" + section).html('<span class="badge badge-primary badge-pill mb-1">Buradasınız</span><h6 class="text-primary mb-0">' + sectionName + '</h6>');
        } else {
            $("#order-progress-icon-" + section).removeClass("text-primary");
            $("#order-progress-icon-" + section).removeClass("text-success");
            $("#order-progress-" + section).html('<span class="d-block text-muted font-size-ms mb-1">' + action + '</span><h6 class="text-muted mb-0">' + sectionName + '</h6>');
        }
    }

    function selectPack(id, name) {
        progressBar('0');
        progressSteps("1", "Birinci adım");
        $(".pack-buttons").html("Randevu al");
        $(".pack-button-" + id).html("Seçildi <i class='fe-check'></i> ");
        $("#card-paketler").hide();
        $("#card-gosterge").show();
        $("#card-genel").show();
        $("#pack-id").val(id);
        $("#pack-name").val(name);
        setTimeout(function(){
            progressBar('10');
            progressSteps("1", "Buradasınız");
        }, 100);
    }
	
    function selectTime(timeId, timeText) {
        $("#time-text").val(timeText);	

		$(".selectable61").click(function () {

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");
		
        $(".selectable61").addClass("selected");
    });

		$(".selectable62").click(function () {

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");

		$(".selectable61").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");
		
        $(".selectable62").addClass("selected");
    });

		$(".selectable63").click(function () {

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");
		
        $(".selectable63").addClass("selected");
    });

		$(".selectable64").click(function () {

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");
		
        $(".selectable64").addClass("selected");
    });

		$(".selectable65").click(function () {

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");
		
        $(".selectable65").addClass("selected");
    });

		$(".selectable66").click(function () {

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable67").removeClass("selected");
		
        $(".selectable66").addClass("selected");
    });

		$(".selectable67").click(function () {

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");
		
        $(".selectable67").addClass("selected");
    });

		$(".selectable1").click(function () {		

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");
		
        $(".selectable1").addClass("selected");
    });

		$(".selectable2").click(function () {		

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");

		$(".selectable1").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");
		
        $(".selectable2").addClass("selected");
    });

		$(".selectable3").click(function () {		

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");
		
        $(".selectable3").addClass("selected");
    });

		$(".selectable4").click(function () {		

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");
		
        $(".selectable4").addClass("selected");
    });

		$(".selectable5").click(function () {		

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");
		
        $(".selectable5").addClass("selected");
    });

		$(".selectable6").click(function () {		

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable7").removeClass("selected");

		$(".selectable8").removeClass("selected");
		
        $(".selectable6").addClass("selected");
    });

		$(".selectable7").click(function () {		

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable8").removeClass("selected");
		
        $(".selectable7").addClass("selected");
    });

		$(".selectable8").click(function () {		

		$(".selectable61").removeClass("selected");

		$(".selectable62").removeClass("selected");

		$(".selectable63").removeClass("selected");

		$(".selectable64").removeClass("selected");

		$(".selectable65").removeClass("selected");

		$(".selectable66").removeClass("selected");

		$(".selectable67").removeClass("selected");

		$(".selectable1").removeClass("selected");

		$(".selectable2").removeClass("selected");

		$(".selectable3").removeClass("selected");

		$(".selectable4").removeClass("selected");

		$(".selectable5").removeClass("selected");

		$(".selectable6").removeClass("selected");

		$(".selectable7").removeClass("selected");
		
        $(".selectable8").addClass("selected");
    });

    }

    function previousCard(card_id) {
        $(".btn-previous-card").html("<i class='spinner-border spinner-border-sm mr-1'></i> Bekleyin");
        if (card_id=="1") {
            progressBar('0');
            progressSteps("1", "1. Adım");
            setTimeout(function(){
                $("#card-gosterge").hide();
                $("#card-genel").hide();
                $("#card-paketler").show();
                $(".btn-previous-card").html("<i class='fe-arrow-left'></i> Geri dön");
            }, 600);
        } else if (card_id=="2") {
            progressBar('10');
            progressSteps("1", "Buradasınız");
            progressSteps("2", "2. Adım");
            setTimeout(function(){
                $("#card-tarih").hide();
                $("#card-genel").show();
                $(".btn-previous-card").html("<i class='fe-arrow-left'></i> Geri dön");
            }, 600);
        } else if (card_id=="3") {
            progressBar('35');
            progressSteps("1", "Tamamlandı");
            progressSteps("2", "Buradasınız");
            progressSteps("3", "3. Adım");
            setTimeout(function(){
                $("#card-saat").hide();
                $("#card-tarih").show();
                $(".btn-previous-card").html("<i class='fe-arrow-left'></i> Geri dön");
            }, 600);
        } else if (card_id=="4") {
            progressBar('60');
            progressSteps("1", "Tamamlandı");
            progressSteps("2", "Tamamlandı");
            progressSteps("3", "Buradasınız");
            progressSteps("4", "4. Adım");
            setTimeout(function(){
                $("#card-onay").hide();
                $("#card-saat").show();
                $(".btn-previous-card").html("<i class='fe-arrow-left'></i> Geri dön");
            }, 600);
        }
    }

    function nextCard(card_id) {
        $(".btn-next-card").html("<i class='spinner-border spinner-border-sm mr-1'></i> Bekleyin");
        if (card_id=="3") {
            progressBar('16');
            $("#card-genel-hata-isim").hide();
            $("#card-genel-hata-service").hide();
            $("#card-genel-hata-gender").hide();
            $("#card-genel-hata-birth").hide();
            $("#card-genel-hata-phone").hide();
            var name = $("#ch-title").val();
            var service = $("#ch-service").val();
            var gender = $("#ch-type").val();
            var birth = $("#birth-input").val();
            var phone = $("#tel-input").val();
            if (name=="" || service=="" || gender=="" || birth=="" || phone=="") {
                setTimeout(function(){
                    progressBar('10');
                    if (name=="") {
                        $("#card-genel-hata-isim").show();
                    }
                    if (service=="") {
                        $("#card-genel-hata-service").show();
                    }
                    if (gender=="") {
                        $("#card-genel-hata-gender").show();
                    }
                    if (birth=="") {
                        $("#card-genel-hata-birth").show();
                    }
                    if (phone=="") {
                        $("#card-genel-hata-phone").show();
                    }
                    $("#card-genel-hata").show();
                    $(".btn-next-card").html("Devam et <i class='fe-arrow-right'></i>");
                }, 600);
            } else {
                $("#card-genel-hata").hide();
                progressBar('35');
                progressSteps("1", "Tamamlandı");
                progressSteps("2", "Buradasınız");
                setTimeout(function(){
                    $("#card-genel").hide();
                    $("#card-tarih").show();
                    $(".btn-next-card").html("Devam et <i class='fe-arrow-right'></i>");
                }, 600);
            }
        } else if (card_id=="4") {
            var selectedDate = $('#current-date').val();
            var selectedPack = $('#pack-id').val();
            var selectedTime = $('#time-text').val();
            $.ajax({
                type: "POST",
                url: "saatler.asp?tarihle="+selectedDate+"&doktorid="+selectedPack,
                data: {selectedDate:selectedDate, selectedPack:selectedPack},
                success : function(result) {
                    $("#myTimeWrapper").html(result);
                    progressBar('60');
                    progressSteps("1", "Tamamlandı");
                    progressSteps("2", "Tamamlandı");
                    progressSteps("3", "Buradasınız");
                    setTimeout(function(){
                        $("#card-tarih").hide();
                        $("#card-saat").show();
                        $(".btn-next-card").html("Devam et <i class='fe-arrow-right'></i>");
                    }, 600);
                }
            });
        } else if (card_id=="5") {
            progressBar('66');
            var name = $("#pack-name").val();
            var date = $("#current-day").val();
            var time = $("#time-text").val();
            $("#grand-pack").html(name);
            $("#grand-date").html(date);
            $("#grand-time").html(time);
            if (time=="") {
                setTimeout(function(){
                    progressBar('60');
                    $("#card-saat-hata").show();
                    $(".btn-next-card").html("Devam et <i class='fe-arrow-right'></i>");
                }, 600);
            } else {
                $("#card-saat-hata").hide();
                progressBar('86');
                progressSteps("1", "Tamamlandı");
                progressSteps("2", "Tamamlandı");
                progressSteps("3", "Tamamlandı");
                progressSteps("4", "Buradasınız");
                setTimeout(function(){
                    $("#card-saat").hide();
                    $("#card-onay").show();
                    $(".btn-next-card").html("Devam et <i class='fe-arrow-right'></i>");
                }, 600);
            }
        } else if (card_id=="6") {
            $(".btn-next-card").html("Devam et <i class='fe-arrow-right'></i>");
            progressBar('92');
            $(".btn-result-card").html("<i class='spinner-border spinner-border-sm mr-1'></i> Bekleyin");
            var form = $("form#order-form");
            var formdata = false;
            if (window.FormData){
                formdata = new FormData(form[0]);
            }
            $.ajax({
                type: "POST",
                url: "randevukayit.asp",
                data: formdata ? formdata : form.serialize(),
                cache       : false,
                contentType : false,
                processData : false,
                success : function(result) {
                    if (result == "success") {
                        $("#card-hata").hide();
                        progressBar('100');
                        progressSteps("1", "Tamamlandı");
                        progressSteps("2", "Tamamlandı");
                        progressSteps("3", "Tamamlandı");
                        progressSteps("4", "Tamamlandı");
                        setTimeout(function(){
                            $("#card-onay").hide();
                            $("#card-sonuc").show();
                        }, 600);
                    } else {
                        progressBar('86');
                        $("#card-hata").show();
                        $("#card-hata").html(result);
                    }
                    $(".btn-result-card").html("Tamamla <i class='fe-check'></i>");
                }
            });
        }
    }

    class CalendarPicker {
        constructor(element, options) {
            this.date = new Date();
            this._formatDateToInit(this.date);
            this.day = this.date.getDay()
            this.month = this.date.getMonth();
            this.year = this.date.getFullYear();
            this.today = this.date;
            this.value = this.date;
            this.min = options.min;
            this.max = options.max;
            this._formatDateToInit(this.min)
            this._formatDateToInit(this.max)
            this.userElement = document.querySelector(element);
            [this.dayAsText, this.monthAsText, this.dateAsText, this.yearAsText] = this.date.toString().split(' ')
            this.calendarWrapper = document.createElement('div');
            this.calendarElement = document.createElement('div')
            this.calendarHeader = document.createElement('header');
            this.calendarHeaderTitle = document.createElement('h4');
            this.navigationWrapper = document.createElement('section')
            this.previousMonthArrow = document.createElement('button');
            this.nextMonthArrow = document.createElement('button');
            this.calendarGridDays = document.createElement('section')
            this.calendarGrid = document.createElement('section');
            this.calendarDayElementType = 'time';
            this.listOfAllDaysAsText = ['Pazartesi', 'Salı', 'Çarşamba', 'Perşembe', 'Cuma', 'Cumartesi', 'Pazar'];
            this.listOfAllDaysAsTextMobile = ['Pz', 'Sa', 'Ça', 'Pe', 'Cu', 'Ct', 'Pa'];
            this.listOfAllMonthsAsText = ['Ocak', 'Şubat', 'Mart', 'Nisan', 'Mayıs', 'Haziran', 'Temmuz', 'Ağustos', 'Eylül', 'Ekim', 'Kasım', 'Aralık'];
            this.calendarWrapper.id = 'calendar-wrapper';
            this.calendarElement.id = 'calendar';
            this.calendarGridDays.id = 'calendar-days';
            this.calendarGrid.id = 'calendar-grid';
            this.navigationWrapper.id = 'navigation-wrapper';
            this.previousMonthArrow.id = 'previous-month';
            this.nextMonthArrow.id = 'next-month';
            this.previousMonthArrow.type = 'button';
            this.nextMonthArrow.type = 'button';
            this._insertHeaderIntoCalendarWrapper();
            this._insertCalendarGridDaysHeader();
            this._insertDaysIntoGrid();
            this._insertNavigationButtons();
            this._insertCalendarIntoWrapper();
            this.userElement.appendChild(this.calendarWrapper);
        }
        _getDaysInMonth = (month, year) => {
            if ((!month && month !== 0) || (!year && year !== 0)) return;
            const date = new Date(year, month, 1);
            const days = [];
            while (date.getMonth() === month) {
                days.push(new Date(date));
                date.setDate(date.getDate() + 1);
            }
            return days;
        }
        _formatDateToInit = (date) => {
            if (!date) return;
            date.setHours(0, 0, 0);
        }
        _insertCalendarIntoWrapper = () => {
            this.calendarWrapper.appendChild(this.calendarElement);
            const handleSelectedElement = (event) => {
                if (event.target.nodeName.toLowerCase() === this.calendarDayElementType && !event.target.classList.contains('disabled')) {
                    Array.from(document.querySelectorAll('.selected')).forEach(element => element.classList.remove('selected'));
                    event.target.classList.add('selected');
                    this.value = event.target.value;
                    this.onValueChange(this.callback);
                }
            }
            this.calendarGrid.addEventListener('click', handleSelectedElement, false);
            this.calendarGrid.addEventListener('keydown', (keyEvent) => {
                if (keyEvent.key !== 'Enter') return;
                handleSelectedElement(keyEvent);
            }, false);
            this.calendarGrid.addEventListener('animationend', () => {
                this._resetCalendarAnimations();
                if (this.goingToPrevious) {
                    this.calendarGrid.classList.add('swoosh-down-reverse');
                    this.goingToPrevious = false;
                    this._insertDaysIntoGrid();
                }
                if (this.goingToNext) {
                    this.calendarGrid.classList.add('swoosh-up-reverse');
                    this.goingToNext = false;
                    this._insertDaysIntoGrid();
                }
            }, false);
        }
        _resetCalendarAnimations = () => {
            this.calendarGrid.classList.remove('swoosh-up');
            this.calendarGrid.classList.remove('swoosh-up-reverse');
            this.calendarGrid.classList.remove('swoosh-down');
            this.calendarGrid.classList.remove('swoosh-down-reverse');
        }
        _insertHeaderIntoCalendarWrapper = () => {
            this.calendarHeaderTitle.textContent = `${this.listOfAllMonthsAsText[this.month]} - ${this.year}`;
            this.calendarHeader.appendChild(this.calendarHeaderTitle);
            this.calendarWrapper.appendChild(this.calendarHeader);
        }
        _insertCalendarGridDaysHeader = () => {
            if ($(window).width() < 960) {
                this.listOfAllDaysAsTextMobile.forEach(day => {
                    const dayElement = document.createElement('span');
                    dayElement.textContent = day;
                    this.calendarGridDays.appendChild(dayElement);
                })
                this.calendarElement.appendChild(this.calendarGridDays);
            } else {
                this.listOfAllDaysAsText.forEach(day => {
                    const dayElement = document.createElement('span');
                    dayElement.textContent = day;
                    this.calendarGridDays.appendChild(dayElement);
                })
                this.calendarElement.appendChild(this.calendarGridDays);
            }
        }
        _insertNavigationButtons = () => {
            const arrowSvg = '<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="chevron-down" class="svg-inline--fa fa-chevron-down fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="#3498db" d="M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z"></path></svg>';
            this.previousMonthArrow.innerHTML = arrowSvg;
            this.nextMonthArrow.innerHTML = arrowSvg;
            this.previousMonthArrow.setAttribute('aria-label', 'Go to previous month');
            this.nextMonthArrow.setAttribute('aria-label', 'Go to next month');
            this.previousMonthArrow.tabIndex = 0;
            this.nextMonthArrow.tabIndex = 0;
            this.navigationWrapper.appendChild(this.previousMonthArrow);
            this.navigationWrapper.appendChild(this.nextMonthArrow);
            this.navigationWrapper.addEventListener('click', (clickEvent) => {
                this._resetCalendarAnimations();
                if (clickEvent.target.closest(`#${this.previousMonthArrow.id}`)) {
                    if (this.month === 0) {
                        this.month = 11;
                        this.year -= 1;
                    } else {
                        this.month -= 1;
                    }
                    this._updateCalendar();
                }
                if (clickEvent.target.closest(`#${this.nextMonthArrow.id}`)) {
                    if (this.month === 11) {
                        this.month = 0;
                        this.year += 1;
                    } else {
                        this.month += 1;
                    }
                    this._updateCalendar();
                }
            }, false)
            this.calendarElement.appendChild(this.navigationWrapper);
        }
        _insertDaysIntoGrid = () => {
            this.calendarGrid.innerHTML = '';
            let arrayOfDays = this._getDaysInMonth(this.month, this.year);
            let firstDayOfMonth = arrayOfDays[0].getDay();
            firstDayOfMonth = firstDayOfMonth === 0 ? 7 : firstDayOfMonth;
            if (1 < firstDayOfMonth) {
                arrayOfDays = Array(firstDayOfMonth - 1).fill(false, 0).concat(arrayOfDays);
            }
            arrayOfDays.forEach(date => {
                const dateElement = document.createElement(date ? this.calendarDayElementType : 'span');
                const [Day, Month, Date, Year] = date.toString().split(' ');
                const dateIsTheCurrentValue = this.value.toString() === date.toString();
                if (dateIsTheCurrentValue) this.activeDateElement = dateElement;
                const dateIsBetweenAllowedRange = (this.min || this.max) && (date.toString() !== this.today.toString() && (date < this.min || date > this.max))
                if (dateIsBetweenAllowedRange) {
                    dateElement.classList.add('disabled');
                } else {
                    dateElement.tabIndex = 0;
                    dateElement.value = date;
                }
                dateElement.textContent = date ? `${Date}` : '';
                this.calendarGrid.appendChild(dateElement);
            })
            this.calendarElement.appendChild(this.calendarGrid);
            this.activeDateElement.classList.add('selected');
        }
        _updateCalendar = () => {
            this.previousDate = this.date;
            this.date = new Date(this.year, this.month);
            [this.dayAsText, this.monthAsText, this.dateAsText, this.yearAsText] = this.date.toString().split(' ');
            this.day = this.date.getDay();
            this.month = this.date.getMonth();
            this.year = this.date.getFullYear();
            window.requestAnimationFrame(() => {
                this.calendarHeaderTitle.textContent = `${this.listOfAllMonthsAsText[this.month]} - ${this.year}`;
                if (this.previousDate < this.date) {
                    this.calendarGrid.classList.add('swoosh-up');
                    this.goingToPrevious = true;
                } else {
                    this.calendarGrid.classList.add('swoosh-down');
                    this.goingToNext = true;
                }
            })
        }
        onValueChange = (callback) => {
            if (this.callback) return this.callback(this.value);
            this.callback = callback;
        }
    }

    const nextYear = new Date().getFullYear() + 1;
    const myCalender = new CalendarPicker('#myCalendarWrapper', {
        min: new Date(),
        max: new Date(nextYear, 10)
    });

    function formatDate(date) {
        var d = new Date(date),
            month = '' + (d.getMonth() + 1),
            day = '' + d.getDate(),
            year = d.getFullYear();

        if (month.length < 2)
            month = '0' + month;
        if (day.length < 2)
            day = '0' + day;

        return [year, month, day].join('-');
    }

    function renderDate(date) {
        var d = new Date(date),
            month = '' + (d.getMonth() + 1),
            day = '' + d.getDate(),
            year = d.getFullYear();

        if (month.length < 2)
            month = '0' + month;
        if (day.length < 2)
            day = '0' + day;

        return [day, month, year].join('.');
    }

    const currentDateElement = document.getElementById('current-date');
    currentDateElement.value = formatDate(myCalender.value);
    const currentDayElement = document.getElementById('current-day');
    currentDayElement.value = renderDate(myCalender.value);

    myCalender.onValueChange((currentValue) => {
        currentDateElement.value = formatDate(currentValue);
        currentDayElement.value = renderDate(currentValue);
    })
</script>
						
						
						
						
						
						
						
						</p>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<div class='is-section is-box is-section-50 footer' style='background-color:#12384B;'><div class='is-boxes'><div class='is-box-centered'><div class='is-container container is-content-1200'><div class='clearfix'><div class='column third center'><i class='icon ion-ios-book-outline size-42'></i><p>Tuna Mh. Seher Sk. No:15/6, Yenişehir</p></div><div class='column third center'><i class='icon ion-ios-telephone-outline size-42'></i><p><a href='tel:0123 456 78 90'>0123 456 78 90</a></p></div><div class='column third center'><i class='icon ion-ios-email-outline size-42'></i><p><a href='mailto:mail@sitenizinadi.com' title=''>mail@sitenizinadi.com</a></p></div></div><div class='clearfix'><div class='column full'><p class='size-16' style='text-align: center;'>Deneme Firması © Tüm hakları saklıdır. Powered by <a target="_blank" href="https://www.sitegrap.com" alt="Kendi Siteni Kendin Yap" title="Kendi Siteni Kendin Yap">Sitegrap</a><br><font size='1'><a href='/p/kvkk'>KVKK Aydınlatma Metni</a> | <a href='/p/cerez-politikasi'>Çerez Politikası</a></font></p></div></div></div></div></div></div>

</div>




<div class="mobiletel">
	<a class="mobiletel" href="tel:0123 456 78 90"><img src="/p/ikon-tel.png" alt="Tıkla Hemen Telefonla Ara"></a>
	<span class="teltext">Tıkla Hemen Telefonla Ara</span>
</div>
<div class="mobilewhatsapp">
	<a class="mobilewhatsapp" href="https://api.whatsapp.com/send?phone=90123 456 78 90"><img src="/p/ikon-whatsapp.png" alt="Tıkla Whatsapp Mesajı Gönder"></a>
	<span class="whatsapptext">Tıkla Whatsapp Mesajı Gönder</span>
</div>

<script type="text/javascript" src="https://cdn.pluto.com.tr/js/box.js"></script> 
<script type="text/javascript" src="https://cdn.pluto.com.tr/js/bootstrap.js"></script> 

<script>
function stringFilter (input) {
s = input.value;
filteredValues = ",/\+-*;?=)(&%^'!:<>[]{}½$#£|_@";
var i;
var returnString = "";
for (i = 0; i < s.length; i++) {
	var c = s.charAt(i);
	if (filteredValues.indexOf(c) == -1) {
		returnString += c;
	}
	else
	{
	alert('Yanlış karakter girdiniz!');
	}
}
input.value = returnString;
}
</script>

</body>
</html>