<!-- 

                                                                                                                                                                  
                                                                                                                                                                  
MMMMMMMM               MMMMMMMM                                  tttt         hhhhhhh             DDDDDDDDDDDDD                                                   
M:::::::M             M:::::::M                               ttt:::t         h:::::h             D::::::::::::DDD                                                
M::::::::M           M::::::::M                               t:::::t         h:::::h             D:::::::::::::::DD                                              
M:::::::::M         M:::::::::M                               t:::::t         h:::::h             DDD:::::DDDDD:::::D                                             
M::::::::::M       M::::::::::Myyyyyyy           yyyyyyyttttttt:::::ttttttt    h::::h hhhhh         D:::::D    D:::::D     eeeeeeeeeeee  vvvvvvv           vvvvvvv
M:::::::::::M     M:::::::::::M y:::::y         y:::::y t:::::::::::::::::t    h::::hh:::::hhh      D:::::D     D:::::D  ee::::::::::::ee v:::::v         v:::::v 
M:::::::M::::M   M::::M:::::::M  y:::::y       y:::::y  t:::::::::::::::::t    h::::::::::::::hh    D:::::D     D:::::D e::::::eeeee:::::eev:::::v       v:::::v  
M::::::M M::::M M::::M M::::::M   y:::::y     y:::::y   tttttt:::::::tttttt    h:::::::hhh::::::h   D:::::D     D:::::De::::::e     e:::::e v:::::v     v:::::v   
M::::::M  M::::M::::M  M::::::M    y:::::y   y:::::y          t:::::t          h::::::h   h::::::h  D:::::D     D:::::De:::::::eeeee::::::e  v:::::v   v:::::v    
M::::::M   M:::::::M   M::::::M     y:::::y y:::::y           t:::::t          h:::::h     h:::::h  D:::::D     D:::::De:::::::::::::::::e    v:::::v v:::::v     
M::::::M    M:::::M    M::::::M      y:::::y:::::y            t:::::t          h:::::h     h:::::h  D:::::D     D:::::De::::::eeeeeeeeeee      v:::::v:::::v      
M::::::M     MMMMM     M::::::M       y:::::::::y             t:::::t    tttttth:::::h     h:::::h  D:::::D    D:::::D e:::::::e                v:::::::::v       
M::::::M               M::::::M        y:::::::y              t::::::tttt:::::th:::::h     h:::::hDDD:::::DDDDD:::::D  e::::::::e                v:::::::v        
M::::::M               M::::::M         y:::::y               tt::::::::::::::th:::::h     h:::::hD:::::::::::::::DD    e::::::::eeeeeeee         v:::::v         
M::::::M               M::::::M        y:::::y                  tt:::::::::::tth:::::h     h:::::hD::::::::::::DDD       ee:::::::::::::e          v:::v          
MMMMMMMM               MMMMMMMM       y:::::y                     ttttttttttt  hhhhhhh     hhhhhhhDDDDDDDDDDDDD            eeeeeeeeeeeeee           vvv           
                                     y:::::y                                                                                                                      
                                    y:::::y                                                                                                                       
                                   y:::::y                                                                                                                        
                                  y:::::y                                                                                                                         
                                 yyyyyyy                                                                                                                          
                                                                                                                                                                  
                                                                                                                                                                  
-->
<!DOCTYPE html>
<html lang="tr-TR">
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />

<head>
  <link rel="icon" href="img/favicon.png" type="image/x-icon" />
  <!-- Required meta tags -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

  <title>Hızlı, Akıcı ve Anlayarak Okuma - Online Anlayarak Hızlı Okuma Programı | BHO</title>
  <meta name="description" content="Baykuş Hızlı Okuma ve Anlama Programı ile kursa gerek kalmadan günde 20 dakika çalışarak 3 haftada, okuma hızınızı ve anlama oranınızı 3 kat arttırın.">
  <meta name="keywords" content="hızlı okuma,anlayarak hızlı okuma, hızlı okuma kursu, hızlı okuma egzersizleri, okuma ve anlama metinleri, hızlı okuma programı, okuma hızını artırma, online hızlı okuma, online hızlı okuma kursu, tablet hızlı okuma">

  <link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css'>
  <!-- <link rel="stylesheet" href="./style.css"> -->
  <!-- Bootstrap CSS -->
  <link rel="stylesheet" href="css/bootstrap.min.css">
  <!-- Icon -->
  <link rel="stylesheet" href="cdn.lineicons.com/1.0.1/LineIcons.min.css">

  <!-- Animate -->
  <link rel="stylesheet" href="css/animate.css">
  <!-- Main Style -->
  <link rel="stylesheet" href="css/main.css">
  <!-- Responsive Style -->
  <link rel="stylesheet" href="css/responsive.css">
  <!-- Swiper Slider -->
  <link rel="stylesheet" href="cdnjs.cloudflare.com/ajax/libs/Swiper/4.5.0/css/swiper.min.css">
  <!-- Popup Styles -->
  <link rel="stylesheet" href="css/popup.css">
  <!-- <link rel="stylesheet" href="css/lightgallery.css"> -->
  <link rel="stylesheet" href="css/floating-wpp.min.css">
  <link rel="stylesheet" href="css/whatschat-style7.css">
  <link rel="stylesheet" href="css/color-green.css">
  <link rel="stylesheet" href="css/lity.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
  <link rel="stylesheet" href="css/light-modal.css">

  <!-- Owl Carousel -->
  <link rel="stylesheet" href="js/OwlCarousel2-2.3.4/dist/assets/owl.carousel.min.css">
  <link rel="stylesheet" href="js/OwlCarousel2-2.3.4/dist/assets/owl.theme.default.min.css">

  <!-- Global site tag (gtag.js) - Google Analytics -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-158117746-2"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag() { dataLayer.push(arguments); }
    gtag('js', new Date());

    gtag('config', 'UA-158117746-2');
  </script>

  <style>
    #start-test-button {
      line-height: 25px;
    }

    @media (max-width: 480px) {
      #start-test-button {
        line-height: 16px;
      }

      #play-video1 {
        transform: translateX(-50%) translateY(-120%)
      }
    }

    @media (max-width: 991) {
      #start-test-button {
        line-height: 20px;
      }
    }

    @media (max-width: 1199px) and (min-width: 992px) {
      #start-test-button {
        line-height: 20px;
      }
    }

    #paymentCard3DS.custom-control-input:disabled~.custom-control-label {
      color: #f8f9fa;
    }

    .section-title {
      margin-bottom: 0px !important;
    }
  </style>

</head>

<body>

  <!-- Header Area wrapper Starts -->
  <header id="header-wrap">
    <div class="fixed-top">
      <!-- Navbar Start -->
      <div class="top-header-area bg-dark text-white alt-font">
        <div class="container">
          <div class="row">
            <div class="col-12">
              <ul class="header-social text-right">
                <li class="mobile-menu-li"><img src="img/whatsapp-icon.png" style="height:25px; width:25px;"> 0552 686
                  4493 </li>
                <li class="mobile-menu-li" style="margin-left: 15px; margin-right: 15px;"><img src="img/phone-icon.png" style="height:20px; width:20px;"> 0850 473 1058 </li>
                <li>
                  <div class="social-div"><a target="_blank" href="https://www.facebook.com/baykushizliokuma/"><img src="img/facebook-icon.png" style="width: 24px; height: 24px; margin-right: 5px;"></a><a target="_blank" href="https://www.instagram.com/baykusegitim/"><img src="img/instagram-icon.png" style="width: 24px; height: 24px; margin-right: 5px;"></a>
                    <a target="_blank" href="https://www.youtube.com/channel/UCnW1xBUjNjAwhCOn7JA9m7Q"><img src="img/youtube-icon.png" style="width: 27px; height: 17px; margin-right: 5px;"></a>
                  </div>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
      <nav class="navbar navbar-expand-md bg-inverse scrolling-navbar">
        <div class="container">
          <a href="index.html" class="navbar-brand"><img style="width: 150px; height: 80px;" src="img/logo-baykus.png" alt="BHO Logo"></a>
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
            <i class="lni-menu"></i>
          </button>
          <div class="collapse navbar-collapse" id="navbarCollapse">
            <ul class="navbar-nav mr-auto w-100 justify-content-end clearfix">
              <li class="nav-item active" data-wow-delay="0.3s">
                <a class="nav-link" href="#bhonedir">BHO Nedir?</a>
              </li>
              <li class="nav-item" data-wow-delay="0.4s">
                <a class="nav-link" href="#ozellikler">Özellikler</a>
              </li>
              <li class="nav-item" data-wow-delay="0.5s">
                <a class="nav-link" href="#hiziniolc">Okuma Hızınızı Ölçün</a>
              </li>
              <li class="nav-item" data-wow-delay="0.5s">
                <a class="nav-link" href="#iletisim">İletişim</a>
              </li>
              <li class="nav-item" data-wow-delay="0.6s">
                <a class="nav-link" href="#sss">S.S.S.</a>
              </li>
              <li class="nav-item" data-wow-delay="0.7s">
                <a class="nav-link" href="#pricing">Satın Al</a>
              </li>

              <li class="nav-item" data-wow-delay="0.9s">
                <a href="/app" class="btn btn-login btn-login-text" data-wow-delay="0.3s" style="visibility: visible;-webkit-animation-delay: 0.3s; -moz-animation-delay: 0.3s; animation-delay: 0.3s;">Giriş
                  Yap</a>
              </li>
            </ul>
          </div>
        </div>
      </nav>
    </div>
    <!-- Navbar End -->

    <!-- Hero Area Start -->
    <div id="hero-area" class="hero-area-bg" style="background-image: url('img/slider.jpg'); background-position: center; height: auto; width: 100%; bottom: 0px; margin: 70px auto 0px;">
      <div class="container">
        <div class="row">
          <div class="col-lg-12" style="margin-top: 30px; margin-bottom: -30px;">
            <div class="contents">
              <div class="head-title">
                <h2 class="wow fadeIn" data-wow-delay="0.3s">
                  <center>2021 LGS-YKS Adayları ve Tüm Öğrenciler! Bu Program Çok İşinize Yarayacak!</center>
                </h2>
                <h1 class="wow fadeIn" data-wow-delay="0.3s">
                  <small class="text-center mx-auto" style="font-size: small">
                    <center>* En Kapsamlı Hızlı Okuma ve Anlama Programı *</center>
                  </small>
                </h1>

              </div>
              <p id="alternating-text" class="wow fadeIn mb-0" data-wow-delay="0.6s"></p>
            </div>
          </div>
        </div>
      </div>f

      <div class="header-button">
        <a href="#bhonedir" class="btn btn-common wow fadeInLeft" data-wow-delay="0.3s">DETAYLI BİLGİ</i></a>
        <a href="#pricing" class="btn btn-border wow fadeInRight" data-wow-delay="0.3s">SATIN AL</i></a>
      </div>
      <div class="col-md-12 play-video-slider">
        <a id="play-video1" class="video-play-button" href="https://youtu.be/OlQ4xnEAGC0" data-lity>

          <span></span>
        </a>
        <div class="light-modal" id="modal-id-2" role="dialog" aria-labelledby="light-modal-label" aria-hidden="false" style="overflow-y: auto;">
          <div class="light-modal-content  animated zoomInUp">
            <!-- light modal header -->
            <div class="light-modal-header">
              <h3 class="light-modal-heading">Ödeme Bildirimi</h3>
              <a href="#" class="light-modal-close-icon" aria-label="close">&times;</a>
            </div>
            <!-- light modal body -->
            <div class="light-modal-body" style="overflow-y: auto;">
              <center>
                <p>Lütfen ödeme yaptıysanız gerekli alanları doldurarak bize bildirin.</p>
              </center><br>
              <form id="paymentFeedbackForm" role="form" action="/app/payments/" method="post">
                <div class="form-group">
                  <div class="row">
                    <div class="col-md-12">
                      <input type="text" class="form-control input-lg" placeholder="Adınız - Soyadınız" required="" name="name" id="isim" value="">
                    </div>
                    <div class="col-md-12">
                      <input type="text" class="form-control input-lg" placeholder="Telefon Numaranız" required="" name="phone" id="telefonno" value="">
                    </div>
                    <div class="col-md-12">
                      <input type="text" class="form-control input-lg" placeholder="E-Posta Adresiniz" required="" name="email" id="eposta" value="">
                    </div>
                    <div class="col-md-12">
                      <textarea style="height: 50px;" name="note" class="form-control" rows="8" cols="80" placeholder="Notunuz (Varsa)"></textarea>
                    </div>
                    <div class="col-md-12">
                      <button style="background-color: #fff; width: 100%; color: #222;" type="submit" class="btn btn-gonder2 btn-lg" name="gonder">GÖNDER</button>
                    </div>
                  </div>
                </div>

              </form>
            </div>
            <!-- light modal footer -->

          </div>
        </div>

        <div class="light-modal" id="modal-id-1" role="dialog" aria-labelledby="light-modal-label" aria-hidden="false">
          <div class="light-modal-content   animated bounceIn">
            <a href="#pricing" class="light-modal-close-icon" aria-label="close">&times;</a>
            <div class="light-modal-body">
              <center><img src="img/halkbank-logo.svg" style="width: 50%; height: auto; padding-bottom: 30px;" />
              </center>
              <p><b>Baykuş Eğitim Yazılımları Ltd. Şti.</b></p>
              <p class="my-2">Halkbank Bahçeşehir Şubesi</p>
              <p>TR78 0001 2001 2720 0010 1008 99</p>
            </div>
          </div>
        </div>

      </div>
    </div>
    <!-- Hero Area End -->

  </header>
  <!-- Header Area wrapper End -->

  <!-- About Section start -->
  <section id="bhonedir" class="section-padding" style="background-color: #edf5f8;">
    <div class="container">
      <div class="row">

        <div class="col-lg-6 col-md-12 col-xs-12 info">
          <div class="about-wrapper wow fadeInLeft" data-wow-delay="0.3s">
            <div>
              <div class="site-heading about-title">
                <h2 style="color: #8f3e9f;" class="section-title">Baykuş Hızlı Okuma Nedir?</h2>
              </div>
              <div class="content">
                <p class="about-description">
                  BHO okuma hızınızı ve anlama oranınızı 3 katına kadar çıkarmanızı sağlayan online "Hızlı Okuma ve
                  Anlama" programıdır. İçeriğinde bulunan egzersizler ve alıştırmalar binlerce öğrenci tarafından
                  uygulanmış ve başarılı sonuçlar alınmıştır. Okuma hızınızı
                  ve anlama oranınızı bilimsel yöntemlerle hazırlanan bu egzersiz ve alıştırmalarla 3 hafta gibi bir
                  sürede geliştirerek, çok daha kısa sürelerde daha fazla sayıda metni/dokümanı/kitabı okuyabilirsiniz.
                </p>
              </div>
            </div>
          </div>
        </div>

        <div class="col-lg-6 col-md-12 col-xs-12 wow fadeInRight" data-wow-delay="0.3s">
          <div id="video-container">
            <iframe style="max-width: 100%; max-height: 100%;" src="https://www.youtube.com/embed/bwRcu8-haSY" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

          </div>
          <!-- <div id="video-container"
            style="background-image: url('img/baykushizliokumanedir.jpg'); background-size: cover;"><a id="play-video"
              class="video-play-button" href="https://youtu.be/bwRcu8-haSY" data-lity>

              <span></span>
            </a></div> -->
        </div>
        <div class="col-lg-6 col-md-12 col-xs-12 wow fadeInRight mobile-2" data-wow-delay="0.3s">
          <!-- <iframe style="max-width: 100%; max-height: 100%;" src="https://www.youtube.com/embed/skCo3EiFTgo" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
          <div id="video-container">
            <iframe style="max-width: 100%; max-height: 100%;" src="https://www.youtube.com/embed/skCo3EiFTgo?fs=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen onReady='testYoutubeReady()'></iframe>
          </div>
          <!-- <div id="video-container-left"
            style="background-image: url('img/hızlı-okuma-anlam-ilişkisi.jpg'); background-size: cover;"><a
              id="play-video" class="video-play-button" href="https://youtu.be/skCo3EiFTgo" data-lity>
              <span></span>
            </a></div> -->
        </div>



        <div class="col-lg-6 col-md-12 col-xs-12 info mobile-1">
          <div class="about-wrapper wow fadeInLeft" data-wow-delay="0.3s">
            <div>
              <div class="site-heading">
                <h2 class="section-title anlam-mobil">Hızlı Okuma - Anlama İlişkisi</h2>
              </div>
              <div class="content fast-read-content">

                <p>
                  <b>Unutmayınız ki !</b> Yavaş Okuyan Değil, Hızlı Okuyan Okuduklarını Daha İyi Anlar.
                </p>
                <br>
                <p>
                  "Okurken kelimeleri ne kadar yavaş okursanız, arada kalan zamanda zihniniz başka düşüncelerle meşgul
                  olacak ve anlama kaliteniz düşecektir."
                </p>
                <br>
                <p>
                  Okuma Hızınız İle Anlama Oranınız Arasında Doğrusal Bir İlişki Vardır; <b>Okuma Hızınız Arttıkça
                    Anlama Oranınızda Artar !!!</b>
                </p>

                <p>
                  <b>"Yavaş Okuyan Birey Alışkanlıklarının Kölesidir."</b>
                </p>
              </div>
            </div>
          </div>
        </div>

      </div>
    </div>
  </section>
  <!-- About Section End -->

  <!-- Kimler İçindir Başlangıç -->
  <section id="kimlerkullanabilir" class="section-padding">
    <div class="container">

      <div class="row">
        <div class="col-lg-4 col-md-4 col-sm-6">
          <h3 class="section-title left-title wow fadeInDown" data-wow-delay="0.3s">Kimler Kullanabilir?</h3>
          <h3 class="section-title wow fadeInDown" data-wow-delay="0.3s">Baykuş Hızlı Okuma Programı</h3>
        </div>
        <div class="col-md-8">
          <div class="col-md-6 whouseit">
            <img src="img/icon-1.png" style="width: 45px; height: auto;" />
            <p style="font-size: 25px; padding-top: 15px;"><b>Öğrenciler</b></p>
            <p style="color: #777777; padding-top: 20px;">BHO programı 4. sınıftan itibaren her öğrenim seviyesindeki
              öğrenciler için içerik-alıştırma ve metinlerden oluşan bir programdır. Öğrenciler okuma hızlarını
              arttırırken dikkat-konsantraston ve odaklanma seviyelerinde de belli
              bir artış olur.</p>
          </div>
          <div class="col-md-6 whouseit" style="float:left;">
            <img src="img/icon-2.png" style="width: 45px; height: auto;" />
            <p style="font-size: 25px; padding-top: 15px;"><b>Sınav Grupları LGS ve YKS (TYT-AYT) Öğrencileri</b></p>
            <p style="color: #777777; padding-top: 20px;">LGS sınavına hazırlanan 8.sınıf öğrencileri ve TYT/YKS
              sınavlarına hazırlanan üniversite hazırlık gurupları; yeni nesil soruları daha kısa sürede anlayıp
              çözebilir, sınavlarda zaman kazanabilir ve odaklanmanızda artış sağlayabilirsiniz.</p>
          </div>
          <div class="col-md-6 whouseit" style="float:left; padding-top: 40px;">
            <img src="img/icon-3.png" style="width: 45px; height: auto;" />
            <p style="font-size: 25px; padding-top: 15px;"><b>Akademisyenler</b></p>
            <p style="color: #777777; padding-top: 20px;">Kaç yaşında ve hangi düzeyde olursanız olun, eğitim
              yaşamınızda çok okuyup birçok zorlu sınavlardan geçmek durumundasınız. BHO programı ile akademik
              öğreminizde daha hızlı ve daha çok okuyup daha iyi anlayabilir ve buna bağlı olarak
              akademik çalışma / performansınızı arttırabilirsiniz.</p>
          </div>
          <div class="col-md-6 whouseit">
            <img src="img/icon-4.png" style="width: 45px; height: auto;" />
            <p style="font-size: 25px; padding-top: 15px;"><b>Her Sektörde Çalışan Bireyler</b></p>
            <p style="color: #777777; padding-top: 20px;">Her meslekten iş insanları/ev hanımları... kısacası hızlı
              okuyup daha çok anlamak isteyen herkes BHO programı ile daha çok kitabı daha kısa sürede okuyarak
              entelektüel kültür seviyelerini ve mesleki verimliliklerini arttırabilir,
              kişisel gelişimlerine önemli bir katkı sağlayabilirler.</p>
          </div>
        </div>
      </div>

    </div>
  </section>
  <section id="ozellikler">
    <div style="background-color:#f6f6f6;">
      <div class="container" style="padding-bottom: 100px; padding-top: 100px;">
        <div class="row">
          <div class="col-md-12 text-center">
            <h3 class="section-title wow fadeInDown information" data-wow-delay="0.3s">Özellikler</h3>
          </div>

          <div id="ozellikler-carousel" class="owl-carousel owl-theme" style="padding-top: 0px; margin: 0;">
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-1.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-1.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-2.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-2.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-3.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-3.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-4.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-4.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-5.0.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-5.0.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-6.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-6.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-7.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-7.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-8.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-8.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-9.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-9.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-10.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-10.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-11.png"><img style="max-width: 100%; max-height: 100%;" src="img/imaj-11.png"></a>
            </div>
            <div class="whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-12.png"><img style="width: 100%; height: auto;" src="img/imaj-12.png"></a>
            </div>
          </div>

          <div class="row d-none" style="padding-top: 50px; margin: 0;">
            <div class="col-md-4 whouseit" style="padding-top: 0px;">
              <a href="/image.html" data-lity data-lity-target="img/imaj-1.png"><img style="width: 100%; height: auto;" src="img/imaj-1.png"></a>
            </div>
            <div class="col-md-4 whouseit" style="padding-top: 0px;">
              <a href="/image.html" data-lity data-lity-target="img/imaj-2.png"><img style="width: 100%; height: auto;" src="img/imaj-2.png"></a>
            </div>
            <div class="col-md-4 whouseit" style="padding-top: 0px;">
              <a href="/image.html" data-lity data-lity-target="img/imaj-3.png"><img style="width: 100%; height: auto;" src="img/imaj-3.png"></a>
            </div>
            <div class="col-md-4 whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-4.png"><img style="width: 100%; height: auto;" src="img/imaj-4.png"></a>
            </div>
            <div class="col-md-4 whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-5.0.png"><img style="width: 100%; height: auto;" src="img/imaj-5.0.png"></a>
            </div>
            <div class="col-md-4 whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-6.png"><img style="width: 100%; height: auto;" src="img/imaj-6.png"></a>
            </div>
            <div class="col-md-4 whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-7.png"><img style="width: 100%; height: auto;" src="img/imaj-7.png"></a>
            </div>
            <div class="col-md-4 whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-8.png"><img style="width: 100%; height: auto;" src="img/imaj-8.png"></a>
            </div>
            <div class="col-md-4 whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-9.png"><img style="width: 100%; height: auto;" src="img/imaj-9.png"></a>
            </div>
            <div class="col-md-4 whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-10.png"><img style="width: 100%; height: auto;" src="img/imaj-10.png"></a>
            </div>
            <div class="col-md-4 whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-11.png"><img style="width: 100%; height: auto;" src="img/imaj-11.png"></a>
            </div>
            <div class="col-md-4 whouseit">
              <a href="/image.html" data-lity data-lity-target="img/imaj-12.png"><img style="width: 100%; height: auto;" src="img/imaj-12.png"></a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>

  <section id="hiziniolc" class="" style="padding-bottom: 80px;">
    <div class="container-fluid">
      <div class="row">

        <div class="col-lg-6 col-md-6 col-sm-12 col-12 readspeedtitle">
          <p class="information readspeeddesc">Okuma Hızınızı ve Anlama Oranınızı Ölçün</p>
          <div class="speedtest-section-texts">Hızlanmak için öncellikle mevcut hızını bilmelisin.<br>Dakikada okuduğun
            kelime sayısı, yılda kaç kitap bitirebileceğinin göstergesidir.<br>Hesapla ve hızlanmaya başla!</div>
          <div class="speedtest-section-texts"><span class="pre-texts">Okuma Hızım Dakikada</span> <input id="speedtest-wpm" min="0" type="number" value="100" class="form-control calculation-inputs"><span class="post-texts">Kelime</span></div>
          <div class="speedtest-section-texts"><span class="pre-texts">Günlük Okuma Sürem</span> <input id="speedtest-duration" min="0" type="number" value="10" class="form-control calculation-inputs"><span class="post-texts">Dakika</span></div>
          <div id="calculate-speed-button-container"><a id="calculate-speed-button" class="btn btn-common">Hesapla</a>
          </div>
          <div class="speedtest-section-texts">Yılda <span id="calculate-speed" class="animated wow fadeInUp animated" data-wow-delay="0.3s">-</span> Kitap Okuyorsun</div>
          <div class="speedtest-section-texts small-text">* 1 Kitap 200 sayfa, 1 sayfa 30 satır ve 1 satırında 10 kelime
            olduğu varsayılarak hesaplanmıştır. <br> * 1 Yıl 360 gün olarak hesaplanmıştır.</div>
          <div class="speedtest-section-texts small-text"></div>
        </div>
        <div class="col-lg-6 col-md-6 col-sm-12 col-12">
          <span id="start-test-button" class="pulse" style="padding-top: 12px;"><b>OKUMA HIZINI <br> ÖLÇ</b></span>
          <img id="big-laptop-image" class="img-fluid" src="img/compressed/hizimi-olc.jpg" alt="BHO ile hızını ölç!" />
        </div>
      </div>
    </div>
  </section>
  <!-- jQuery first, then Popper.js, then Bootstrap JS -->
  <script src="js/jquery-min.js"></script>
  <script src="js/preloader.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script src="js/wow.js"></script>
  <script src="js/jquery.easing.min.js"></script>
  <script src="js/main.js"></script>
  <script src="js/jquery.nav.js"></script>
  <script src="js/scrolling-nav.js"></script>
  <script src="js/typeit.js"></script>
  <script src="js/bowser.js"></script>
  <script src="js/jquery.maskedinput.min.js"></script>
  <script src="js/jquery.validate.min.js"></script>
  <script src="js/popUpManager.js"></script>
  <script src="js/floating-wpp.min.js"></script>
  <script src="js/lity.js"></script>
  <script src="js/jquery-sticky.js"></script>
  <!-- <script src="js/jquery.lightgallery.js"></script> -->
  <script src="js/whatschat-style7.js"></script>
  <script src="cdnjs.cloudflare.com/ajax/libs/Swiper/4.5.0/js/swiper.min.js"></script>

  <!-- Owl Carousel -->
  <script src="js/OwlCarousel2-2.3.4/dist/owl.carousel.min.js"></script>

  <script>
    $(function () {
      $('#paymentFeedBackForm').submit(function () {
        $.ajax({
          type: 'POST',
          url: '/app/payments',
          data: $(this).serialize(),
          success: () => {
            $(".light-modal").modal("hide")
            alert("Ödeme bildiriminiz alınmıştır!")
          }
        });
        return false;
      });
    })
    $(function () {
      $('#contactForm').submit(function () {
        $.ajax({
          type: 'POST',
          url: '/app/contacts',
          data: $(this).serialize(),
          success: () => {
            alert("Mesajınız alınmıştır!")
          }
        });
        return false;
      });
    })

    var preloader = new Preloader();
    preloader.showPreloader();

    var popUpManager = new PopupManager();

    var pricingSeen = false;

    /*popUpManager.showPopup({
            "TAMAM": function () {

            },
            "İPTAL": function () {

            }
        },

        
        "deneme", "Bilgilendirme", popupTypes.success);*/


    $('.annually-button').off('click');
    $('.annually-button').on('click', function () {


      try {
        gtag('event', 'tıklandı', {
          'event_category': 'satın al butonu',
          'event_label': 'yıllık'
        });
      }
      catch (e) {
        console.log("GA not loaded");
      }
    })

    $('.monthly-button').off('click');
    $('.monthly-button').on('click', function () {
      try {
        gtag('event', 'tıklandı', {
          'event_category': 'satın al butonu',
          'event_label': 'türk telekom akademi'
        });
      }
      catch (e) {
        console.log("GA not loaded");
      }
    })


    $.fn.isInViewport = function () {
      var elementTop = $(this).offset().top;
      var elementBottom = elementTop + $(this).outerHeight();

      var viewportTop = $(window).scrollTop();
      var viewportBottom = viewportTop + $(window).height();

      return elementBottom > viewportTop && elementTop < viewportBottom;
    };

    $(window).on('resize scroll', function () {
      if ($('#services').isInViewport()) {
        $('.navbar').addClass('green').removeClass('gray');
      }
      else if ($('#key-points').isInViewport()) {
        $('.navbar').removeClass('green').removeClass('gray');
      }
      else if ($('#gallery').isInViewport()) {
        $('.navbar').removeClass('green').addClass('gray');
      }

      if ($('#pricing').isInViewport()) {

        try {
          if (!pricingSeen) {
            gtag('event', 'satış bölümü incelendi', {
              'event_category': 'sayfa inceleme',
              'event_label': 'sayfa sonu'
            });

            pricingSeen = true;
          }
        }
        catch (e) {
          console.log("GA not loaded");
        }

      }
    });
  </script>

  <script>
    $(document).ready(function () {
      $("#ozellikler-carousel").owlCarousel({
        loop: true,
        margin: 20,
        nav: true,
        center: true,
        responsive: {
          0: {
            items: 1
          },
          600: {
            items: 2
          },
          1000: {
            items: 4
          }
        }
      });
    });
  </script>



  <!-- Pricing section Start -->
  <section id="pricing" class="section-padding" style="background-color: #f6f6f6; padding-bottom: 60px;">
    <div class="container">
      <div class="section-header text-center">
        <h2 class="section-title wow fadeInDown" data-wow-delay="0.3s">SATIN AL</h2>
        <p class="wow fadeInDown">Kredi Kartıyla Kolayca Satın Alıp Şifrenizi Oluşturabilir ve Hemen Kullanmaya
          Başlayabilirsiniz</p>
        <div class="shape wow fadeInDown" data-wow-delay="0.3s"></div>
      </div>
      <div class="row">
        <div class="col-md-2 d-flex flex-column flex-center">
          <img class="w-100 my-auto " src="img/product-box-2-transparent-small.png" alt="" srcset="">
        </div>
        <div class="col-lg-4 col-md-4 col-xs-12">
          <div class="table wow fadeInLeft animated" data-wow-delay="0.6s">

            <div class="pricing-header">
              <p class="price-value text-center">199 ₺</p>
            </div>
            <div class="title text-center">
              <h3>Baykuş Hızlı Okuma Programı</h3>
            </div>
            <hr style=" height: 10px;">
            </hr>
            <ul class="description">

              <li><b><span><img src="img/iyzico.jpg" alt="iyzico" height="13"> İle Güvenli Ödeme</span></b></li>
              <li><b>Kredi Kartına 6 Taksit İmkanı.</b></li>
              <li><b>1 Yıl (365 Gün Sınırsız Kullanım)</b></li>
            </ul>
            <div id="tryButtonHsyn" class="btn btn-success wow fadeInLeft lisans-button w-100 mb-2" data-wow-delay="0.3s">DEMO KULLAN</i></div>
            <!-- <a href="#modal-id-1" class="btn btn-common wow fadeInLeft lisans-button" data-wow-delay="0.3s">SATIN AL</i></a> -->
            <a href="#paymentModal" class="btn btn-common wow fadeInLeft lisans-button w-100 " data-wow-delay="0.3s">SATIN AL ve ŞİFRE OLUŞTUR</i></a>
            <!-- <a href="#modal-id-2" class="price-button btn btn-border wow fadeInRight lisans-button"
              data-wow-delay="0.3s">ÖDEME BİLDİRİMİ</i></a> -->
          </div>
        </div>
        <div class="col-lg-6 col-md-6 col-xs-12 py-sm-4">
          <!-- <iframe class="d-md-none" style="max-width: 100%; max-height:100;" src="https://www.youtube.com/embed/wTrGG250Olw" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
          <!-- <div class="d-md-none" id="video-container" style="background-image: url('img/video-intro-resim.webp'); background-size: contain; background-repeat: no-repeat; background-position: center;">
            <a id="play-video" class="video-play-button" href="https://youtu.be/wTrGG250Olw" data-lity>
              <span></span>
            </a>
          </div> -->
          <div class="d-md-none" id="video-container">
            <iframe style="max-width: 100%; max-height:100; top:10px;" src="https://www.youtube.com/embed/wTrGG250Olw" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
          </div>

          <!-- <div class="d-none d-md-block" id="video-container"
            style="background-image: url('img/video-intro-resim.webp'); background-size: contain; background-repeat: no-repeat; background-position: center;">
            <a id="play-video" class="video-play-button" href="https://youtu.be/wTrGG250Olw" data-lity>
              <span></span>
            </a>
          </div> -->
          <div class="d-none d-md-block" id="video-container">
            <iframe style="max-width: 100%; max-height:100; top:10px;" src="https://www.youtube.com/embed/wTrGG250Olw" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
          </div>
        </div>
        <div class="col-md-12">
          <p class="price-alt-title">SATIN ALMADAN ÖNCE BİZİMLE İLETİŞİME GEÇEBİLİR DETAYLI BİLGİ ALABİLİRSİNİZ</p>
        </div>
        <div class="col-md-6">
          <p class="buywhatsapp"><b>WhatsApp: 0552 686 4493</b></p>
        </div>
        <div class="col-md-6">
          <p class="buyphone"><b>Hemen Arayın: 0850 473 1058</b></p>
        </div>
      </div>
    </div>
  </section>

  <section id="ekrangoruntusu" class="section-padding" style="background-color: #fff; padding-bottom: 60px;">
    <div class="container">
      <div class="section-header text-center">
        <h2 class="section-title wow fadeInDown" data-wow-delay="0.3s">BHO Ekran Görüntüleri</h2>
      </div>
      <center>
        <p class="wow fadeInDown">BHO ekran görüntülerini görmek için resimleri tıklayın</p>
      </center>
      <div class="container" style="padding-top: 10px;">
        <div id="ekran-goruntuleri" class="owl-carousel owl-theme">
          <div class="">
            <a href="/image.html" data-lity data-lity-target="img/2-Okuma-Şekilleri-Ekran-Görüntüsü.png"><img class="ekran-goruntuleri" src="img/2-Okuma-Şekilleri-Ekran-Görüntüsü.png" style="max-width: 100%; max-height: 100%;"></a>
            <p class="ekran-goruntuleri-text">Okuma Şekilleri</p>
          </div>
          <div class="">
            <a href="/image.html" data-lity data-lity-target="img/3-Görme-Alanı-Genişletme-Egzersizleri.png"><img class="ekran-goruntuleri" src="img/3-Görme-Alanı-Genişletme-Egzersizleri.png"></a>
            <p class="ekran-goruntuleri-text">Görme Alanı Genişletme Egzersizleri</p>
          </div>
          <div class="">
            <a href="/image.html" data-lity data-lity-target="img/4-Göz-Sıçrama-Takip-Egzersizleri.png"><img class="ekran-goruntuleri" src="img/4-Göz-Sıçrama-Takip-Egzersizleri.png"></a>
            <p class="ekran-goruntuleri-text">Göz Sıçrama Takip Egzersizleri</p>
          </div>
          <div class="">
            <a href="" data-lity data-lity-target="img/5-Göz-Odaklanma-Egzersizleri.png"><img class="ekran-goruntuleri" src="img/5-Göz-Odaklanma-Egzersizleri.png"></a>
            <p class="ekran-goruntuleri-text">Göz Odaklanma Egzersizleri</p>
          </div>
          <div class="">
            <a href="/image.html" data-lity data-lity-target="img/6-Bloklam-ve-Gölgeleme-Çalışmaları.png"><img class="ekran-goruntuleri" src="img/6-Bloklam-ve-Gölgeleme-Çalışmaları.png"></a>
            <p class="ekran-goruntuleri-text">Bloklama ve Gölgeleme Çalışmaları</p>
          </div>
          <div class="">
            <a href="/image.html" data-lity data-lity-target="img/7-Hızlı-Okuma-Egzersizleri.png"><img class="ekran-goruntuleri" src="img/7-Hızlı-Okuma-Egzersizleri.png"></a>
            <p class="ekran-goruntuleri-text">Hızlı Okuma Egzersizleri</p>
          </div>
        </div>
        <div class="row d-none">
          <div class="col-md-2">
            <a href="/image.html" data-lity data-lity-target="img/2-Okuma-Şekilleri-Ekran-Görüntüsü.png"><img class="ekran-goruntuleri" src="img/2-Okuma-Şekilleri-Ekran-Görüntüsü.png"></a>
            <p class="ekran-goruntuleri-text">Okuma Şekilleri</p>
          </div>
          <div class="col-md-2">
            <a href="/image.html" data-lity data-lity-target="img/3-Görme-Alanı-Genişletme-Egzersizleri.png"><img class="ekran-goruntuleri" src="img/3-Görme-Alanı-Genişletme-Egzersizleri.png"></a>
            <p class="ekran-goruntuleri-text">Görme Alanı Genişletme Egzersizleri</p>
          </div>
          <div class="col-md-2">
            <a href="/image.html" data-lity data-lity-target="img/4-Göz-Sıçrama-Takip-Egzersizleri.png"><img class="ekran-goruntuleri" src="img/4-Göz-Sıçrama-Takip-Egzersizleri.png"></a>
            <p class="ekran-goruntuleri-text">Göz Sıçrama Takip Egzersizleri</p>
          </div>
          <div class="col-md-2">
            <a href="/image.html" data-lity data-lity-target="img/5-Göz-Odaklanma-Egzersizleri.png"><img class="ekran-goruntuleri" src="img/5-Göz-Odaklanma-Egzersizleri.png"></a>
            <p class="ekran-goruntuleri-text">Göz Odaklanma Egzersizleri</p>
          </div>
          <div class="col-md-2">
            <a href="/image.html" data-lity data-lity-target="img/6-Bloklam-ve-Gölgeleme-Çalışmaları.png"><img class="ekran-goruntuleri" src="img/6-Bloklam-ve-Gölgeleme-Çalışmaları.png"></a>
            <p class="ekran-goruntuleri-text">Bloklama ve Gölgeleme Çalışmaları</p>
          </div>
          <div class="col-md-2">
            <a href="/image.html" data-lity data-lity-target="img/7-Hızlı-Okuma-Egzersizleri.png"><img class="ekran-goruntuleri" src="img/7-Hızlı-Okuma-Egzersizleri.png"></a>
            <p class="ekran-goruntuleri-text">Hızlı Okuma Egzersizleri</p>
          </div>
        </div>
      </div>
    </div>
    </div>
  </section>

  <script>
    $(document).ready(function () {
      $("#ekran-goruntuleri").owlCarousel({

        loop: true,
        margin: 10,
        nav: true,
        center: true,
        responsive: {
          0: {
            items: 1
          },
          600: {
            items: 2
          },
          1000: {
            items: 4
          }
        }
      });
    });
  </script>

  <section id="sss" class="section-padding" style="background-color: #fff;">
    <div class="container">
      <div class="section-header text-center">
        <h2 class="section-title wow fadeInDown" data-wow-delay="0.3s">S.S.S</h2>
        <div class="shape wow fadeInDown" data-wow-delay="0.3s"></div>
      </div>
      <div class="row">

        <div class="col-lg-6">
          <div class="toggle wow fadeInLeft" data-wow-delay="0.1s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name"><b>Baykuş Hızlı Okuma Programı anlama oranımı da arttırır mı?</b></span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>BHO Programındaki soru cevaplı okuma metinleri ile sizin okuduğunuzu daha iyi anlayıp anlamadığınız
                ölçer. Yine bu parçalardaki anahtar kelimeleri size gösterir ve 5N1K çalışması yaparak ve okuduklarınızı
                daha iyi anlamanız
                ve özetlemeniz için örnek çalışmaları size gösterir, ipuçları verir. </p>
            </div>
          </div>
          <div class="toggle wow fadeInRight" data-wow-delay="0.2s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name">Baykuş Hızlı Okuma Programı LGS sınavına hazırlanan öğrencilerde başarıyı
                  arttırır mı?</span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>Yeni nesil diye adlandırılan LGS sınav soruları artık daha fazla kelimeden oluşan ve zorluk derecesi
                arttırılmış sorulardır. Bu soruları tek seferde ve kısa sürede okuyup-kavramak ve çözmek artık daha da
                önem kazanmıştır. Kelimelerin
                yanında büyük karmaşık tablo ve grafik sorularıda LGS sınavında sorulmaktadır. BHO Programı ile
                yapacağınız çalışmalar, sizin bu sorulara daha kısa sürede okuyup anlamanızı ve daha doğru cevaplar
                vermenizi sağlar ve sınava
                hazırlık sürecinizi de hem nitelik hem de nicelik olarak zenginleştirir.</p>
            </div>
          </div>
          <div class="toggle wow fadeInLeft" data-wow-delay="0.3s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name"><b>Baykuş Hızlı Okuma Programı TYT-YKS sınavına hazırlanan öğrencilerde
                    başarıyı arttırır mı?</b></span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>Her yıl milyonlarca gencin girdiği Üniversiteye giriş TYT-YKS sınavı soruları artık daha fazla
                kelimeden oluşan ve zorluk derecesi her yıl daha da artan sorulardır. Bu soruları tek seferde ve kısa
                sürede okuyup-kavramak ve
                çözmek büyük önem taşır. BHO Programı ile yapacağınız çalışmalar, sizin bu sorulara daha kısa sürede
                okuyup anlamanızı ve daha doğru cevaplar vermenizi sağlar ve sınava hazırlık sürecinizi de hem nitelik
                hem de nicelik
                olarak zenginleştirir. UNUTMAYIN! Ulusal çapta yapılan sınavlarda 2 beceriden imtihan olursunuz; 1) Hız
                2) Bilgi Düzeyiniz. </p>
            </div>
          </div>
          <div class="toggle wow fadeInRight" data-wow-delay="0.4s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name">Baykuş Hızlı Okuma Programını tabletimde kullanabilir miyim?</span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>BHO Programı cep telefonlarının dışında; masaüstü bilgisayarlarınızda, dizüstü bilgisayarlarınızda ve
                tabletlerinizde rahatça kullanabilirsiniz. </p>
            </div>
          </div>
          <div class="toggle wow fadeInLeft" data-wow-delay="0.5s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name"><b>Baykuş Hızlı Okuma Programını cep telefonumdan çalışabilirmiyim?</b></span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>Cep telefonlarının ekran boyutları sağlıklı bir hızlı okuma egzersizi yapmaya elverişli ölçülerde büyük
                ve geniş olmadıkları için BHO Programı cep telefonlarında doğru çalışmaz.</p>
            </div>
          </div>

          <div class="toggle wow fadeInRight" data-wow-delay="0.5s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name">Baykuş Hızlı Okuma Programınını interneti olan her yerde kullanabilir
                  miyim?</span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>BHO Programı online bir program olduğu için, sabit hiçbir bilgisayara bağlı olmadan internete
                ulaşabildiğiniz her yerde hızlı bir şekilde egzersizlere ulaşabilirsiniz. </p>
            </div>
          </div>

          <div class="toggle wow fadeInLeft" data-wow-delay="0.5s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name"><b>Baykuş Hızlı Okuma Programını disleksilerde kullanabilir mi?</b></span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>BHO, disleksi dostu bir programdır. Disleksi problemi olan öğrenciler, okumayı tam anlamıyla sökmüş
                olmaları koşuluyla, okuma hızlarını artırmak için 5. sınıftan itibaren günde 15 dakikayı geçmeyecek
                şekilde BHO’dan yararlanabilirler.
                BHO göz kaslarını geliştirerek disleksiye fayda sağlayabilmektedir. BHO; Açılı göz egzersizleri, göz
                sıçrama-takip egzersizleri ile satır atlama gibi disleksi problemi olan öğrencilerin temel problemlerine
                gidermelerinde
                fayda sağlar. • Odaklanma egzersizleri ile konsantrasyonlarının artmasına yardımcı olur. • Okuma hızını
                artırarak, bireyin özgüveninin gelişmesini destekler. Yapılan araştırmalar, disleksilerin kendine
                güvenlerinin yaş
                ilerledikçe düştüğünü göstermektedir. Bu nedenle, okuma hızlarının artırılması önemli bir destek olarak
                görülmektedir.</p>
            </div>
          </div>

          <div class="toggle wow fadeInRight" data-wow-delay="0.5s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name">Miyop-Hipermetrop-Astigmat gibi temel görme bozuklukları olanlar da Baykuş
                  Hızlı Okuma Programından faydalanabilirler mi?</span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>Gözümüz, kaslardan oluşur. BHO Programı benzersiz egzersizleri sayesinde göz kaslarınızı
                çalıştırdığından, göz sağlığı için faydalıdır. Bu nedenle, göz bozukluğu olanlarda günlük 20 dakikayı
                aşmayacak şekilde, gözü fazla yormadan
                çalışmalarını yapabilirler.</p>
            </div>
          </div>
        </div>

        <div class="col-lg-6">
          <div class="toggle wow fadeInLeft" data-wow-delay="0.1s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name"><b>Hızlı okuma eğitimi sadece kitaptan yada yüzyüzemi öğrenilir?</b></span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>Hayır bu tek taraflı bir düşüncedir. BHO Programıyla yapacağınız çalışmalar sizin tek başınıza da
                çalışarak okuma hızınızın en az 2 kat arttırmanızı sağlar. BHO Programı içeriğindeki kamp programı ile
                sizin hangi gün, hangi
                egzersizi, kaç tekrar yapmanız gerektiğini gösterir. </p>
            </div>
          </div>
          <div class="toggle wow fadeInRight" data-wow-delay="0.2s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name">Baykuş Hızlı Okuma Programı Kimler İçindir?</span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>BHO Programı ilkokul 4.sınıftan itibaren her yaş gurubunun anlayarak ve kolayca çalışabileceği şekilde
                hazırlanmış akıllı bir programdır. Her yaş gurubuna uygun okuma metinlerini içeriğinde barındırır.</p>
            </div>
          </div>
          <div class="toggle wow fadeInLeft" data-wow-delay="0.3s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name"><b>Baykuş Hızlı Okuma Programının içeriğinde ne var? Kaç farklı egzersiz
                    var?</b></span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>BHO Programı içeriğindeki 7 modül, 45 farklı egzersiz, yüzlerce metin ve binlerce kelime ile sizlere
                sıkılmadan ve kelime hazinenizi geliştirerek çalışma olanağı sunar. </p>
            </div>
          </div>
          <div class="toggle wow fadeInRight" data-wow-delay="0.4s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name">Baykuş Hızlı Okuma Programının kullanımı kolay mı?</span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>BHO Programı sade, basit ve açıklayıcı bir içeriğe ve kullanıma sahiptir. Her egzersizin nasıl
                yapılacağını ve ne işe yarayacağını anlatan açıklayıcı metinler ve kısa videolar sizlerin daha kolay ve
                anlayarak kullanmanıza yardımcı
                olur. </p>
            </div>
          </div>
          <div class="toggle wow fadeInLeft" data-wow-delay="0.5s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name"><b>Baykuş Hızlı Okuma Programı bana hazır programlar sunuyor mu ? Beni
                    yönlendiriyor mu?</b></span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>BHO Programı içeriğindeki kamp programı ile sizin hangi gün, hangi egzersizi, kaç tekrar yapmanız
                gerektiğini gösterir, size hazır çalışma programları sunar. Her egzersizin nasıl yapılacağını ve ne işe
                yarayacağını anlatan
                açıklayıcı metinler ve kısa videolarla sizleri doğru okuma egzersizleri yapmanız için yönlendirir.</p>
            </div>
          </div>

          <div class="toggle wow fadeInRight" data-wow-delay="0.5s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name">Baykuş Hızlı Okuma Programı ile ne kadar sürede okuma hızımı
                  arttırabilirim?</span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>BHO Programı ile günde 20 dakikanızı egzerisizlere ayırarak ve haftanın en az 5 günü çalışarak 2/3
                haftada okuma hızınızı en az 2 kat arttırırsınız. Egzersizlerin dışında öğrendiklerimizi uygulamak ve
                pratik yapmak içinde günde
                en az 30 dakika kitap okumayada unutmayalım! </p>
            </div>
          </div>

          <div class="toggle wow fadeInRight" data-wow-delay="0.5s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name"><b>Baykuş Hızlı Okuma Programı ile günde 20 dakika çalışmak okuma hızımın
                    artmasında yeterli olur mu?</b></span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>Egzersizlerin dışında, öğrendiklerinizi pratiğe çevirmek için sevdiğiniz kitaplardan günde en az yarım
                saat kitap okumanız okuma hıznızın 3 kaftada en az 2 kat artmasını sağlar. </p>
            </div>
          </div>

          <div class="toggle wow fadeInRight" data-wow-delay="0.5s">
            <div class="toggle-title">
              <h3>
                <i class="lni-plus accordion-icons"></i>
                <span class="title-name">Baykuş Hızlı Okuma Programı ile ne kadar sürede okuma hızımı
                  arttırabilirim?</span>
              </h3>
            </div>
            <div class="toggle-inner">
              <p>BHO Programı ile günde 20 dakikanızı egzerisizlere ayırarak ve haftanın en az 5 günü çalışarak 2/3
                haftada okuma hızınızı en az 2 kat arttırırsınız. Egzersizlerin dışında öğrendiklerimizi uygulamak ve
                pratik yapmak içinde günde
                en az 30 dakika kitap okumayada unutmayalım! </p>
            </div>
          </div>
        </div>
      </div>
    </div>
    </div>
  </section>

  <section id="kullaniciyorumlari" class="section-padding" style="background-color: #f6f6f6;">
    <div class="container">
      <div class="row" style="padding-top: 60px; padding-bottom: 0px;">
        <div class="col-md-12">
          <center>
            <h3 class="section-title wow fadeInDown animated yorumlarbaslik" data-wow-delay="0.3s" style="visibility: visible;-webkit-animation-delay: 0.3s; -moz-animation-delay: 0.3s; animation-delay: 0.3s; ">
              Kullanıcı Yorumları</h3>
          </center>
        </div>
      </div>

      <div id="kullanici-yorumlari" class="owl-carousel owl-theme">
        <div class="kullaniciyorumlari wow fadeInLeft animated" data-wow-delay="0.3s" style="visibility: visible;-webkit-animation-delay: 0.3s; -moz-animation-delay: 0.3s; animation-delay: 0.3s;">
          <span class="icon">
            <img src="img/avatarkadın.png" />
          </span>
          <div class="text">
            <p class="kullaniciadi">Sevilay GARGULİ</p>
            <p class="kullaniciisi">Psikolog</p>
          </div>
          <p class="kullaniciaciklama">Program öncelikle öğrenci dostu; kullanımı kolay ve işlevsel bir şekilde
            hazırlanmış. Öğrencilerin sıkılmadan, rahatça ve isteyerek çalışabilecekleri şekilde hazırlanmış. Tüm
            öğrencilere tavsiye eder ve emeği geçenlere çok teşekkür
            ederim.

          </p>
        </div>
        <div class="kullaniciyorumlari wow fadeInLeft animated" data-wow-delay="0.3s" style="visibility: visible;-webkit-animation-delay: 0.3s; -moz-animation-delay: 0.3s; animation-delay: 0.3s;">
          <span class="icon">
            <img src="img/avatarerkek.png" />
          </span>
          <div class="text">
            <p class="kullaniciadi">Doğan EKREK</p>
            <p class="kullaniciisi">Öğretmen</p>
          </div>
          <p class="kullaniciaciklama">Bir matematik öğretmeni olarak sayısal bir bakış açısıyla incelediğimde
            egzersiz yapısı ve çeşitliliği çok güzel. Özellikle yeni nesil soru tiplerinin olduğu LGS ve TYT/YKS
            sınavlarına hazırlanan öğrencilere hem okuma metinlerinde
            zaman kazandırır hemde tablo grafik sorularını daha bütünsel bir bakış açısıyla görüp anlamalarında çok
            yardımcı olacağını düşünüyorum.</p>
        </div>
        <div class="kullaniciyorumlari wow fadeInLeft animated" data-wow-delay="0.3s" style="visibility: visible;-webkit-animation-delay: 0.3s; -moz-animation-delay: 0.3s; animation-delay: 0.3s;">
          <span class="icon">
            <img src="img/avatarerkek.png" />
          </span>
          <div class="text">
            <p class="kullaniciadi">Cihan ŞİMENDÜFER</p>
            <p class="kullaniciisi">Veli</p>
          </div>
          <p class="kullaniciaciklama">Programı kullanmış ve okuma hızında artış sağlamış veli olarak çok beğendiğimi
            söyleyebilirim. Herkesin seviyesine uygun egzersiz ve hız seviyeleri var, bu çok iyi. Ayrıca içerisindeki
            hazır programlar ile size nereden başlamanızı
            gösteriyor, bu büyük bir kullanım kolaylığı. Teşekkürler emeği geçen herkese.</p>
        </div>
        <div class="kullaniciyorumlari wow fadeInLeft animated" data-wow-delay="0.3s" style="visibility: visible;-webkit-animation-delay: 0.3s; -moz-animation-delay: 0.3s; animation-delay: 0.3s;">
          <span class="icon">
            <img src="img/avatarerkek.png" />
          </span>
          <div class="text">
            <p class="kullaniciadi">Dursun KARABATAK</p>
            <p class="kullaniciisi">Öğrenci</p>
          </div>
          <p class="kullaniciaciklama">Baykuş Hızlı Okuma Programı sayesinde dakikada 180 kelime okurken artık 600
            kelime civarı okuyabiliyorum ve bu program sayesinde Üniversite sınavı hazırlık çalışmalarımda artık
            süreyi çok daha iyi kullanabiliyorum. Bu program sadece
            hızlı okumamı değil anlayarak hızlı okumamı geliştirdiği için emeği geçen herkese teşekkür ederim.</p>
        </div>
      </div>
    </div>

  </section>

  <script>
    $(document).ready(function () {
      $("#kullanici-yorumlari").owlCarousel({
        // loop: true,
        margin: 20,
        nav: true,
        // center: true,
        responsive: {
          0: {
            items: 1
          },
          600: {
            items: 2
          },
          1000: {
            items: 2
          }
        }
      });
    });
  </script>

  <!-- Pricing Table Section End -->
  <!-- Footer Section Start -->
  <section id="iletisim">
    <footer id="footer" class="">
      <div class="row">
        <div class="col-lg-6 contact-col-1">
          <div class="iletisimform">
            <div class="mbottom">
              <h2 style="color: #000; padding-bottom: 50px;" class="section-title">Bizimle İletişime Geçiniz <br>Hemen
                Arayın :)</h2>

            </div>
            <form id="contactForm" role="form" action="/app/contacts" method="post">
              <div class="form-group">
                <div class="row">
                  <div class="col-md-6">
                    <input type="text" class="form-control input-lg" placeholder="İsminiz" required="" name="name" id="ad" value="">
                  </div>
                  <div class="col-md-6">
                    <input type="text" class="form-control input-lg" placeholder="Telefon Numaranız" required="" name="phone" id="telefonnumarasi" value="">
                  </div>
                </div>
              </div>
              <div class="form-group">
                <div class="row">
                  <div class="col-md-12">
                    <input type="email" name="email" placeholder="E-Posta Adresiniz" required="" class="form-control input-lg" id="epostaadresi" value="">
                  </div>
                </div>
              </div>
              <div class="form-group">
                <div class="row">
                  <div class="col-md-12">
                    <textarea name="message" id="mesaj" class="form-control" rows="8" cols="80" placeholder="Mesajınız"></textarea>
                  </div>
                </div>
              </div><button style="background-color: #8f3e9f;" type="submit" class="btn btn-gonder2 btn-lg" name="gonder">GÖNDER</button>
            </form>
          </div>
        </div>

        <div class="col-lg-6 iletisimbilgi iletisimmobil">
          <h2 style="color: #fff;"> İletişim Bilgilerimiz </h2>
          <div class="col-md-12 h4 mt-5 text-left" style="margin-left: -14px; font-weight: bold; ">
            Baykuş Eğitim Yazılımları Ltd. Şti.
          </div>
          <div class="col-md-3">
            <p style="color:#fff; margin-left: -14px; padding-top: 30px;"><b>Adres:</b></p>
          </div>
          <div class="col-md-12">
            <p style="color:#f3f6f6; margin-left: -14px;">
              Koza Mah. Atatürk Bulv. Dumankaya Modern Vadi <br>
              A6 Blok No:20K Daire:17 <br>
              Esenyurt / İstanbul
            </p>
          </div>
          <div class="col-md-6">
            <p style="color:#fff; padding-top: 30px; margin-left: -14px;"><b>Telefon ve WhatsApp:</b></p>
          </div>
          <div class="col-md-4">
            <p style="color: #f3f6f6; margin-left: -14px;">0 (552) 686 4493 <br />0 (850) 473 1058</p>
          </div>
          <div class="col-md-6">
            <p style="color:#fff; padding-top: 30px; margin-left: -14px;"><b>Mail Adresimiz:</b></p>
          </div>
          <div class="col-md-3">
            <p style="color: #f3f6f6; margin-left: -14px;">baykushizliokuma@gmail.com
            </p>
          </div>
        </div>
      </div>
      </div>
      <div class="row alt-footer-bc">
        <div class="container">
          <div class="row">
            <div class="col-md-5 order-2 order-md-1">
              <p class="copyright-text" style="color: #fff;">© 2020 Tüm Hakları Saklıdır. <a class="px-2" style="color: #181818; background-color:darkorange; font-weight: bold; border-radius: 10px;" target="_blank" href="https://baykusegitim.com/">Baykuş Eğitim Yazılımları Ltd. Şti.</a></p>
            </div>
            <div class="col-md-7 order-1 order-md-2 mb-2 mb-md-0">
              <ul class="text-center text-md-right">
                <li class="alt-footer-link"><a style="color: #fff;" href="/kullanici-sozlesmesi.html">Kullanıcı
                    Sözleşmesi</a></li>
                <li class="alt-footer-link"><a style="color: #fff;" href="/iade-politikamiz.html">İade Politikamız</a>
                </li>
                <li class="alt-footer-link"><a style="color: #fff;" href="/gizlilik-sozlesmesi.html">Gizlilik
                    Sözleşmesi</a></li>
                <li class="alt-footer-link"><a style="color: #fff;" href="/hakkimizda.html">Hakkımızda</a></li>
                <li class="alt-footer-link"><a style="color: #fff;" href="/">Anasayfa</a></li>
              </ul>
            </div>
          </div>
          <div class="row text-center mt-3 w-100">
            <p class="payment-methods w-100 text-center" style="height: 40px;">
              <span class="px-2 h-100"><img src="/img/mastercard-logo.png?v=v4.0.117" srcset="/img/mastercard-logo.png?v=v4.0.117 2x" alt="BHO MasterCard" style="max-width: 100%; max-height: 100%;"></span>
              <span class="px-2"><img src="/img/visa-logo@2x.png?v=v4.0.117" srcset="/img/visa-logo@2x.png?v=v4.0.117 2x" alt="BHO Visa"></span>
              <span class="px-2"><img src="/img/troy-logo@2x.png?v=v4.0.117" srcset="/img/troy-logo@2x.png?v=v4.0.117 2x" alt="BHO Troy"></span>
            </p>
          </div>
        </div>
      </div>
    </footer>
  </section>


  <div>

  </div>

  <div class="wc-style7">
    <a style="float: right; position: fixed; margin-bottom: 64px;" class="call-us-button circle-call-us call-us-div" href="tel:08504731058"><i class="fa fa-phone"></i></a>
    <!-- Floating Button-->
    <a class="wc-button">
      <i id="wc-whatsapp" class="fa fa-whatsapp" aria-hidden="true"></i>
      <i id="wc-times" class="fa fa-minus-square-o" aria-hidden="true"></i>
    </a>

    <!-- Chat Panel -->
    <div class="wc-panel">
      <!-- Panel Header Content -->
      <div class="wc-header">
        <!-- Profile Picture -->
        <div class="wc-img-cont">
          <img class="wc-user-img" src="img/baykus-logo.png" />
        </div>
        <!-- Display Name & Last Seen -->
        <div class="wc-user-info">
          <strong>Baykuş Hızlı Okuma</strong>
          <p>Genelde 1 Saat İçinde Cevap Verir</p>
        </div>
      </div>
      <!-- Panel Body Content -->
      <div class="wc-body">
        <div class="wc-content">
          <div class="wc-bubble tri-right left-top">
            <span>Baykuş Hızlı Okuma</span>
            <br>
            <p>Merhaba! Sizde okuma hızınızı ve anlama oranınızı kolayca 3 kat arttırabilirsiniz. Tüm sorularınız ve
              bildirimleriniz için bize Whatsapp'dan ulaşabilirsiniz..</p>

          </div>
        </div>
      </div>
      <!-- Panel Footer Content -->
      <div class="wc-footer">
        <!-- Start Single Contact List -->
        <a class="wc-list" number="905526864493" message="Merhaba. Size BHO sitesinden ulaşıyorum. Yardımcı olur musunuz?">
          <i class="fa fa-whatsapp" aria-hidden="true"></i>
          <p>Konuşmaya Başla</p>
        </a>
      </div>
    </div>
  </div>

  <script>
    $("#tryButtonHsyn").click(() => {
      window.location.href = `/app/login?username=misafir${Date.now()}&password=any#!`
      console.log("Here")
    })
  </script>

  <div class="light-modal" id="paymentModal" role="dialog" aria-labelledby="light-modal-label" aria-hidden="false" style="overflow-y: auto;">
    <div class="light-modal-content animated zoomInUp" style="width: 500px !important;">
      <!-- light modal header -->
      <div class="light-modal-header">
        <h3 class="light-modal-heading">Satın Al</h3>
        <a href="#" class="light-modal-close-icon" aria-label="close">&times;</a>
      </div>
      <!-- light modal body -->
      <div class="light-modal-body" style="overflow-y: auto;">
        <center>
          <p>Lütfen gerekli alanları doldurunuz.</p>
        </center><br>
        <form id="paymentForm" role="form">
          <div class="form-group">
            <div class="row">
              <div class="col-6">
                <div class="form-group">
                  <label for="name">Adınız:</label>
                  <input type="text" class="form-control" id="paymentName" aria-describedby="paymentNameHelp" placeholder="" name="name" value="">
                </div>
              </div>
              <div class="col-6">
                <div class="form-group">
                  <label for="name">Soyadınız:</label>
                  <input type="text" class="form-control" id="paymentSurname" aria-describedby="paymentSurnameHelp" placeholder="" name="surname" value="">
                </div>
              </div>
            </div>
            <div class="row d-none">
              <div class="col-md-12">
                <div class="form-group">
                  <label for="name">TC Kimlik Numaranız:</label>
                  <input type="text" class="form-control mb-0" id="paymentIdentityNumber" aria-describedby="paymentIdentityNumberHelp" placeholder="" name="identity" value="">
                  <small class="form-text text-muted" style="color:  rgb(177, 157, 157) !important; font-style: italic;">* Elektronik fatura için
                    gereklidir.</small>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-md-12">
                <div class="form-group">
                  <label for="name">Telefon Numaranız:</label>
                  <input type="text" class="form-control" id="paymentPhoneNumber" aria-describedby="paymentPhoneNumberHelp" placeholder="" name="phone" value="">
                </div>
              </div>
            </div>
            <div class="row d-none">
              <div class="col-md-12">
                <div class="form-group">
                  <label for="name">E-posta Adresiniz:</label>
                  <input type="text" class="form-control" id="paymentEmail" aria-describedby="paymentEmailHelp" placeholder="" name="email" value="">
                </div>
              </div>
            </div>

            <br>

            <div class="row">
              <div class="col-md-12 text-center">
                <center>
                  <p>3D Secure ile Güvenli Ödeme</p>
                </center><br>
              </div>
            </div>
            <div class="row">
              <div class="col-md-12">
                <img src="https://www.evtekstilial.com/images/companies/1/pg/Guvenli-Odeme-2.png?1553775805269" alt="" srcset="">
              </div>
            </div>
            <div class="row mt-1">
              <div class="col-md-12 mt-2">
                <div class="form-group">
                  <label for="name">Kart Üzerindeki İsim:</label>
                  <input type="text" class="form-control mb-0" id="paymentCardHolderName" aria-describedby="paymentCardHolderNameHelp" placeholder="" name="cardHolderName" value="">
                  <small class="form-text text-muted" style="color:  rgb(177, 157, 157) !important; font-style: italic;">Lütfen kart üzerindeki ismi
                    göründüğü gibi yazınız.</small>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-md-12 mt-2">
                <div class="form-group">
                  <label for="name">Kart Numarası:</label>
                  <input type="text" class="form-control mb-0" id="paymentCardNumber" aria-describedby="paymentCardNumberHelp" placeholder="" name="cardNumber" value="">
                  <small class="form-text text-muted" style="color:  rgb(177, 157, 157) !important; font-style: italic;">12 haneli kart numaranızı
                    yazınız.</small>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-md-6">
                <div class="form-group">
                  <label for="name">Taksit Sayısı:</label>
                  <select class="form-control mb-0" id="paymentCardInstallment" name="cardInstallment">
                    <option value='1_199' selected> Tek çekim = 199 ₺ </option>
                  </select>
                  <small class="form-text text-muted" style="color:  rgb(177, 157, 157) !important; font-style: italic;">Taksitlendirme seçenekleri
                    otomatik olarak gözükecektir.</small>
                </div>
              </div>
              <div class="col-md-6 my-auto">
                <div class="form-group">
                  <div class="custom-control custom-checkbox">
                    <input type="checkbox" class="custom-control-input" id="paymentCard3DS" name="card3DS" value=0>
                    <label class="custom-control-label" for="paymentCard3DS">3D Secure ile öde</label>
                  </div>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-6">
                <div class="form-group">
                  <label for="name">Son Kullanma Tarihi:</label>
                  <input type="text" class="form-control mb-0" id="paymentCardExpiry" aria-describedby="paymentNameHelp" placeholder="" name="cardExpiry" value="">
                  <small id="emailHelp" class="form-text text-muted" style="color: rgb(177, 157, 157) !important; font-style: italic;">12/2050 şeklinde yazınız.</small>
                </div>
                <!-- <input type="text" class="form-control input-lg" placeholder="Adınız - Soyadınız" required="" name="name" id="isim" value=""> -->
              </div>
              <div class="col-6">
                <div class="form-group">
                  <label for="name">CV2:</label>
                  <input type="text" class="form-control mb-0" id="paymentCardCV2" aria-describedby="paymentSurnameHelp" placeholder="" name="cardCV2" value="">
                  <small id="emailHelp" class="form-text text-muted" style="color: rgb(177, 157, 157) !important; font-style: italic;">Kartınızın arkasındaki 3 haneli
                    güvenlik kodu.</small>
                </div>
                <!-- <input type="text" class="form-control input-lg" placeholder="Adınız - Soyadınız" required="" name="name" id="isim" value=""> -->
              </div>


            </div>
          </div>
        </form>

        <div class="col-md-12">
          <button id="paymentCheckout" style="background-color: #fff; width: 100%; color: #222;" class="btn btn-gonder2 btn-lg">TAMAMLA</button>
        </div>
      </div>
    </div>
  </div>

  <script>

    $(document).ready(() => {
      $("#paymentPhoneNumber").mask('0(000) 000-0000', { placeholder: "0(___) ___-____" });
      $("#paymentCardNumber").mask('0000-0000-0000-0000', { placeholder: "____-____-____-____" });
      $("#paymentCardExpiry").mask('00/0000', { placeholder: "__/____" });
      $("#paymentCardCV2").mask('000', { placeholder: "___" });

      $('[name="cardNumber"]').keyup((event) => {
        if ($(event.target).val().length > 5) {
          $.post(`/app/payment/installment`,
            {
              binNumber: $(event.target).val().split("-").join("").slice(0, 6),
              price: 199
            },
            data => {
              console.log(data)
              if (data.status == "success") {
                console.log(data.installmentDetails[0].force3ds)
                console.log(data.installmentDetails[0].installmentPrices)
                if (data.installmentDetails[0].force3ds == '1') {
                  if ($('[name="card3DS"]').val() == '0') $('[name="card3DS"]').trigger('click')
                  $('[name="card3DS"]').attr('disabled', '')
                }
                else {
                  $('[name="card3DS"]').removeAttr('disabled', '')
                  if ($('[name="card3DS"]').val() == '1') $('[name="card3DS"]').trigger('click')
                }

                $('[name="cardInstallment"]').empty()
                for (var i = 0; i < data.installmentDetails[0].installmentPrices.length; ++i) {
                  if (i == 0) {
                    $('[name="cardInstallment"]').append(`
                    <option value='1_199' selected> Tek çekim = 199 ₺ </option>
                  `)
                  }
                  else {
                    if (Number(data.installmentDetails[0].installmentPrices[i].installmentNumber) < 7) {
                      $('[name="cardInstallment"]').append(`
                        <option value=${data.installmentDetails[0].installmentPrices[i].installmentNumber}_${data.installmentDetails[0].installmentPrices[i].totalPrice} selected>
                          ${data.installmentDetails[0].installmentPrices[i].installmentNumber} taksit x ${data.installmentDetails[0].installmentPrices[i].installmentPrice} ₺ = ${data.installmentDetails[0].installmentPrices[i].totalPrice} ₺
                        </option>
                      `)
                    }
                  }
                }
              }
            })
        }
      })

      $('[name="cardNumber"]').change((event) => {
        if ($(event.target).val().length > 5) {
          $.post(`/app/payment/installment`,
            {
              binNumber: $(event.target).val().slice(0, 6),
              price: 199
            },
            data => {
              console.log(data)
              if (data.status == "success") {
                console.log(data.installmentDetails[0].force3ds)
                console.log(data.installmentDetails[0].installmentPrices)
                if (data.installmentDetails[0].force3ds == '1') {
                  if ($('[name="card3DS"]').val() == '0') $('[name="card3DS"]').trigger('click')
                  $('[name="card3DS"]').attr('disabled', '')
                }
                else {
                  $('[name="card3DS"]').removeAttr('disabled', '')
                  if ($('[name="card3DS"]').val() == '1') $('[name="card3DS"]').trigger('click')
                }

                $('[name="cardInstallment"]').empty()
                for (var i = 0; i < data.installmentDetails[0].installmentPrices.length; ++i) {
                  if (i == 0) {
                    $('[name="cardInstallment"]').append(`
                    <option value='1_199' selected> Tek çekim = 199 ₺ </option>
                  `)
                  }
                  else {
                    if (Number(data.installmentDetails[0].installmentPrices[i].installmentNumber) < 7) {
                      $('[name="cardInstallment"]').append(`
                        <option value=${data.installmentDetails[0].installmentPrices[i].installmentNumber}_${data.installmentDetails[0].installmentPrices[i].totalPrice} selected>
                          ${data.installmentDetails[0].installmentPrices[i].installmentNumber} taksit x ${data.installmentDetails[0].installmentPrices[i].installmentPrice} ₺ = ${data.installmentDetails[0].installmentPrices[i].totalPrice} ₺
                        </option>
                      `)
                    }
                  }
                }
              }
            })
        }
      })

      $('#paymentCard3DS').click(event => {
        if (event.target.value == '0') event.target.value = '1'
        else event.target.value = '0'
      })

      $('#paymentCheckout').click(event => {
        let request = {
          price: '199',
          paidPrice: $('#paymentCardInstallment').val().split('_')[1],
          installment: $('#paymentCardInstallment').val().split('_')[0],
          basketId: String(Date.now()),

          paymentCard: {
            cardHolderName: $('#paymentCardHolderName').val(),
            cardNumber: $('#paymentCardNumber').val().split("-").join(""),
            expireMonth: $('#paymentCardExpiry').val().split('/')[0],
            expireYear: $('#paymentCardExpiry').val().split('/')[1],
            cvc: $('#paymentCardCV2').val(),
            secure3d: $('#paymentCard3DS').val(),
            registerCard: '0'
          },
          buyer: {
            id: 'BY789',
            name: $('#paymentName').val(),
            surname: $('#paymentSurname').val(),
            gsmNumber: $("#paymentPhoneNumber").val().replace(")", "").replace("(", "").replace(" ", "").replace("-", ""),
            email: 'baykushizliokuma@gmail.com',
            // identityNumber: $('#paymentIdentityNumber').val(),
            // identityNumber: '18241472234',
            identityNumber: '18244472180',
          },
          billingAddress: {
            contactName: $('#paymentName').val() + " " + $('#paymentSurname').val(),
          },
          basketItems: [
            {
              id: 'BHO',
              name: 'Baykuş Hızlı Okuma Programı - Yıllık Lisans',
              category1: 'Software Subscription',
              category2: 'Education',
              price: '199'
            },
          ]
        };

        $.post("/app/payment/checkout", request, res => {
          if (res.status) {
            if (res.status == "success") {
              if (request.paymentCard.secure3d == '1') {
                window.open(`/app/payment/3ds/${res.conversationId}`, '_blank');
                // window.location.href = `/app/payment/${res.conversationId}`
              }
            }
            else window.alert("İşlem gerçekleştirilemedi. Lütfen bilgileri kontrol ediniz.")
          }
          else window.alert("İşlem gerçekleştirilemedi. Lütfen bilgileri kontrol ediniz.")
        })
      })
    })


  </script>

  <!-- <div class="modal fade" id="paymentModal2" tabindex="-1" role="dialog" aria-labelledby="paymentModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="paymentModalLabel">Smart Wizard modal</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button>
        </div>
        <div class="modal-body">
          <div id="smartwizard">
            <ul>
              <li><a href="#step-1">Step 1<br /><small>Account Info</small></a></li>
              <li><a href="#step-2">Step 2<br /><small>Personal Info</small></a></li>
              <li><a href="#step-3">Step 3<br /><small>Payment Info</small></a></li>
              <li><a href="#step-4">Step 4<br /><small>Confirm details</small></a></li>
            </ul>
            <div class="mt-4">
              <div id="step-1">
                <div class="row">
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="Name" required> </div>
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="Email" required> </div>
                </div>
                <div class="row mt-3">
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="Password" required> </div>
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="Repeat password" required> </div>
                </div>
              </div>
              <div id="step-2">
                <div class="row">
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="Address" required> </div>
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="City" required> </div>
                </div>
                <div class="row mt-3">
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="State" required> </div>
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="Country" required> </div>
                </div>
              </div>
              <div id="step-3" class="">
                <div class="row">
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="Card Number" required> </div>
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="Card Holder Name" required> </div>
                </div>
                <div class="row mt-3">
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="CVV" required> </div>
                  <div class="col-md-6"> <input type="text" class="form-control" placeholder="Mobile Number" required> </div>
                </div>
              </div>
              <div id="step-4" class="">
                <div class="row">
                  <div class="col-md-12"> <span>Thanks For submitting your details with BBBootstrap.com. we will send you a confirmation email. We will review your details and revert back.</span> </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div> -->
</body>

</html>