<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="tr" lang="tr">
<!--[if IE 7 ]>    <html lang="tr" class="isie ie7 oldie no-js"> <![endif]-->
<!--[if IE 8 ]>    <html lang="tr" class="isie ie8 oldie no-js"> <![endif]-->
<!--[if IE 9 ]>    <html lang="tr" class="isie ie9 no-js"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html lang="tr" class="no-js">
<!--<![endif]-->
<head>
    <!-- Head -->
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1254" />
    <script src="//code.jquery.com/jquery-latest.js" type="text/javascript"></script>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="author" content="Web Sayfası | Garanti Medya | GarantiMedya.com" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="shortcut icon" href="https://garantimedya.com//deppo/image/wfavicon.png" type="image/x-icon" />
    
    <meta name="google-site-verification" content="" />
    <meta name="yandex-verification" content="" />
    
    <title>Web Tasarım & Yazılım | Garanti Medya | GarantiMedya.com</title>
    <meta name="description" content="&#698;GarantiMedya.com olarak, işletmelerin dijital varlıklarını güçlendirmek için özel çözümler sunar. Bize katılın!&#698;" />
    <meta name="keywords" content="Web Sayfası,E-Katalog,Kurumsal Kimlik Çalışması,Garanti Medya,logo tasarım,web sitesi,istanbul web tasarım,web yazılım,web tasarım,web tasarim,web yazilim,tasarım yapma,html örnek projeler,kurumsal web tasarım,web sitesi kurulum maliyeti,web sitesi kurma maliyeti,google web designer,localhost,medyaweb,real web tasarım,site kurma,tasarım hizmetleri,web kodlama,web sayfası,web sitesi logo,web site yaptırma,web site ai,web tasarım dersleri,web tasarım kursu,web tasarımcı nasıl olunur,bedava web sitesi kur,web sitesi paketleri,kağıthane web ajansları,kağıthane web sitesi" />
    <link rel="canonical" href="https://garantimedya.com/" />

    <meta property="og:title" content="Web Tasarım & Yazılım | Garanti Medya | GarantiMedya.com" />
    <meta property="og:type" content="web" />
    <meta property="og:site_name" content="Web Tasarım & Yazılım | Garanti Medya | GarantiMedya.com" />
    <meta property="og:url" content="https://garantimedya.com//?q594/gorus-oneri-ve-sikayetleriniz" />
    <meta property="og:image" content="https://garantimedya.com//https://garantimedya.com//deppo/image/logo (4).png" />
    <meta property="og:description" content="&#698;GarantiMedya.com olarak, işletmelerin dijital varlıklarını güçlendirmek için özel çözümler sunar. Bize katılın!&#698;" />

    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="https://garantimedya.com/" />
    <meta name="twitter:creator" content="@twitter" />
    <meta name="twitter:title" content="Web Tasarım & Yazılım | Garanti Medya | GarantiMedya.com" />
    <meta name="twitter:description" content="&#698;GarantiMedya.com olarak, işletmelerin dijital varlıklarını güçlendirmek için özel çözümler sunar. Bize katılın!&#698;" />
    <meta name="twitter:image" content="https://garantimedya.com//https://garantimedya.com//deppo/image/logo (4).png" />
    <meta name="twitter:domain" content="https://garantimedya.com//?q594/gorus-oneri-ve-sikayetleriniz" />
    <style type="text/css">
    /****************** Switches ********************/
    #autosave input[type=checkbox] {
        display: none;
    }

    #autosave input[type="checkbox"]:checked + label:before {
        display: none;
    }

    .mini-switch + label {
        width: 40px;
        height: 20px;
        background: url('https://cdn.v3medya.com/wpanel/wpanel.png') no-repeat 0 -24px;
        background-position: -1px -311px;
        display: inline-block;
        padding: 0 0 0 0px;
        cursor: pointer;
    }

    .mini-switch:checked + label {
        width: 40px;
        height: 20px;
        background: url('https://cdn.v3medya.com/wpanel/wpanel.png') no-repeat 0 0px;
        background-position: -1px -287px;
        display: inline-block;
        padding: 0 0 0 0px;
        cursor: pointer;
    }

    #guncellendi {
        padding: 5px 10px;
        background-color: #FFFF00;
        color: #000;
        width: 100px;
        position: fixed;
        margin-left: 46%;
        z-index: 9999999999999999;
        display: none;
        text-align: center;
    }

    .v3statusac {
        position: fixed;
        left: 10px;
        z-index: 9999999999;
        cursor: pointer;
        font-size: 30px !important;
    }

    .v3status {
        background-color: #000;
        color: #fff;
        opacity: 0.8;
        position: fixed;
        display: block;
        left: -1px;
        top: -2px;
        margin: 0px;
        width: 101%;
        padding: 5px;
        border: solid 1px #ccc;
        z-index: 999999999;
        display: none;
    }

        .v3status ul {
            list-style: none;
            font-size: 13px;
        }

            .v3status ul li {
                float: left;
                padding: 5px;
                margin-left: 10px;
            }

                .v3status ul li a {
                    color: #fff;
                }
</style>
<div id="guncellendi">Güncellendi</div>
<div id="preload" style="display: none; width: 100%; height: 100%; padding: 20% 45%; position: fixed; margin: 0px; left: 0px; top: 0px; z-index: 999999999999;">
</div>
<div id="preload" style="display:none; width:100%; height:100%; padding:20% 45%; position:fixed; margin:0px; left:0px; top:0px; z-index:999999999999;"><img border="0" src="https://garantimedya.com//deppo/tools/img/loading.gif" style="max-height: 150px;"></div>

<link rel='stylesheet' href='https://res.cloudinary.com/watolye/raw/upload/v1556794008/css/watolye.css' type='text/css' /><link rel='stylesheet' href='//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'> <!--[if lt IE 9]><script src='https://garantimedya.com//deppo/tools/js/html5.js'></script><![endif]--> <script src='https://garantimedya.com//deppo/tools/js/gen_validatorv4.js'></script> <script src='https://cdn.ckeditor.com/4.8.0/basic/ckeditor.js'></script> 

<script type="text/javascript">
    document.getElementsByTagName("body")[0].setAttribute("id", "watolye");

    function AjaxKaydet(){
        for(var dilan in CKEDITOR.instances)
            CKEDITOR.instances[dilan].updateElement();
        jQuery.ajax({type: "POST", url: "?panel/ilan/kilan/<?php echo $sayfa3?>",
            data: jQuery('#autosave').serialize(), success: function () {
                setTimeout(function () { jQuery('#guncellendi').fadeIn('slow'); }, 500);  setTimeout(function () { jQuery('#guncellendi').delay(3000).fadeOut('slow'); }, 500);
            }
        });
    }

    $(document).on('click','[data-form]',function(e){
        $('#preload').fadeIn('slow');
        e.preventDefault();
        var _this=$(this);
        $.post(_this.data('url'),$(_this.data('form')).find('input,textarea,select').serialize(),function(){
            show('mmesaj');
            $(_this.data('form'))[0].reset();
            $('#preload').fadeOut('slow');
        });
    });
    //data-url="func..php?func.=fmail" data-form="#iform"

    //!-- Göster/Gizle -->
    function hide(id){var divObject=document.getElementById(id); divObject.style.display="none";}
    function show(id){var divObject=document.getElementById(id); divObject.style.display="block";}
    //!-- Göster/Gizle -->

    function sgoster(id){
        setTimeout(function() {var divObject=document.getElementById(id); divObject.style.display="block";}, 0);
        setTimeout(function() {var divObject=document.getElementById(id); divObject.style.display="none";}, 3000);
    }

    jQuery(function(){
        jQuery('form.fcontrol button').prop('disabled',true);
    });

    jQuery(document).on('input','form.fcontrol input.icontrol',function(e){
        if(jQuery('form.fcontrol input.icontrol').filter(function() { return this.value == ""; }).length==0){
            jQuery('form.fcontrol').find('.alert1').remove();
            jQuery('form.fcontrol button').prop('disabled',false);
        }else{
            jQuery('form.fcontrol button').prop('disabled',true);
            if(jQuery('form.fcontrol').find('.alert1').length==0){
                jQuery('form.fcontrol').prepend('<div class="v3-row alert alert-danger alert1" style="padding:5px;">Formda boş alanlar var.</div><br>');
            }
        }
    });

    jQuery(function(){
        jQuery('form.fcontrol2 button').prop('disabled',true);
    });

    jQuery(document).on('input','form.fcontrol2 input.icontrol',function(e){
        if(jQuery('form.fcontrol2 input.icontrol').filter(function() { return this.value == ""; }).length==0){
            jQuery('form.fcontrol2').find('.alert2').remove();
            jQuery('form.fcontrol2 button').prop('disabled',false);
        }else{
            jQuery('form.fcontrol2 button').prop('disabled',true);
            if(jQuery('form.fcontrol2').find('.alert2').length==0){
                jQuery('form.fcontrol2').prepend('<div class="v3-row alert alert-danger alert2" style="padding:5px;">Formda boş alanlar var.</div><br>');
            }
        }
    });

    jQuery(function(){
        jQuery('form.fcontrol3 button').prop('disabled',true);
    });

    jQuery(document).on('input','form.fcontrol3 input.icontrol',function(e){
        if(jQuery('form.fcontrol3 input.icontrol').filter(function() { return this.value == ""; }).length==0){
            jQuery('form.fcontrol3').find('.alert3').remove();
            jQuery('form.fcontrol3 button').prop('disabled',false);
        }else{
            jQuery('form.fcontrol3 button').prop('disabled',true);
            if(jQuery('form.fcontrol3').find('.alert3').length==0){
                jQuery('form.fcontrol3').prepend('<div class="v3-row alert alert-danger alert3" style="padding:5px;">Formda boş alanlar var.</div><br>');
            }
        }
    });

    //<form class="fcontrol">
    //<input type="text" class="icontrol">
    //</form>

    //!-- Fade Out -->
    jQuery(window).load(function(){setTimeout(function(){
        jQuery('.v3_mbox').fadeOut() }, 3000);});
    //<div class="v3_mbox"></div>
    //!-- Fade Out -->

    //!-- Sadece Sayı -->
    function IsNumeric(nesne){var ValidChars = "0123456789.";
        var IsNumber=true;
        var Char;
        for (i = 0; i < nesne.value.length && IsNumber == true; i++){Char = nesne.value.charAt(i); 
            if (ValidChars.indexOf(Char) == -1) {// alert('Lütfen Sadece Sayısal Değer Giriniz')
                nesne.value = nesne.value.substring(0,i);
                break;}}
        return IsNumber;}
    //<input name="" type="text" onKeyUp="IsNumeric(this);">
    //!-- Sadece Sayı -->

    //!-- Font Boyut -->
    function degistir(kaynak, deger) {
        var hedef = document.getElementById(kaynak);
        var hedeffont = parseInt(hedef.style.fontSize, 10)
        hedef.style.fontSize = (hedeffont + parseInt(deger, 10)) + 'px';
    }
    //Kullanımı onClick="degistir('ContentID','2');"
    //!-- Font Boyut -->

    
    //!-- Lazyload -->

    //!-- LightBOX-1 -->


    //var frmvalidator = new Validator("FormID");
    //frmvalidator.addValidation("Zorunlu","req","Lütfen Adınızı Giriniz");
    //frmvalidator.addValidation("max50","maxlen=50");
    //frmvalidator.addValidation("Email","email");
    //frmvalidator.addValidation("Numara","numeric");
</script>





































<!--[if lt IE 9]>
    <script src="https://garantimedya.com//deppo/tools/js/html5.js"></script>
<![endif]-->
<script type="text/javascript">
    
        //!-- Göster/Gizle -->
	function hide(id){var divObject=document.getElementById(id); divObject.style.display="none";}
        function show(id){var divObject=document.getElementById(id); divObject.style.display="block";}
    //!-- Göster/Gizle -->

    //!-- Fade Out -->
    jQuery(window).load(function () { setTimeout(function () {
        jQuery('.v3_mbox').fadeOut() }, 3000); });
    //!-- Fade Out -->

    //!-- Sadece Sayı -->
    function IsNumeric(nesne){var ValidChars = "0123456789.";
        var IsNumber=true;
        var Char;
        for (i = 0; i < nesne.value.length && IsNumber == true; i++){Char = nesne.value.charAt(i); 
            if (ValidChars.indexOf(Char) == -1) {// alert('Lütfen Sadece Sayısal Değer Giriniz')
                nesne.value = nesne.value.substring(0,i);
                break;}}
        return IsNumber;}
    //<input name="" type="text" onKeyUp="IsNumeric(this);">
    //!-- Sadece Sayı -->
</script>






<script src="https://garantimedya.com//deppo/tools/js/il-ilce.js"></script>
<script src="https://garantimedya.com//deppo/tools/js/gen_validatorv4.js"></script>
<script src="https://cdn.ckeditor.com/4.4.7/basic/ckeditor.js"></script>

  <!-- Fav Icon -->
  <link rel="icon" type="image/x-icon" href="deppo/image/favicon.png">

  <link rel="stylesheet" href="assets/css/all.min.css">
  <link rel="stylesheet" href="assets/css/bootstrap.min.css">
  <link rel="stylesheet" href="assets/css/swiper-bundle.min.css">
  <link rel="stylesheet" href="assets/css/meanmenu.min.css">
  <link rel="stylesheet" href="assets/css/magnific-popup.css">
  <link rel="stylesheet" href="assets/css/master.css">
  <link rel="stylesheet" href="style.css">
  <!-- Google tag (gtag.js) -->
	<script async src="https://www.googletagmanager.com/gtag/js?id=G-JMB2F8KBG9"></script>
	<script>
	window.dataLayer = window.dataLayer || [];
	function gtag(){dataLayer.push(arguments);}
	gtag('js', new Date());

	gtag('config', 'G-JMB2F8KBG9');
	</script>
  <script src="https://www.google.com/recaptcha/api.js" async defer></script>
</head>

<body>
  <!-- Go to Top -->
  <button class="cxu--go-top">
    <span class="icon-1"><img src="assets/imgs/shape/go-top.png" alt="Icon"></span>
    <span class="icon-2"><img src="assets/imgs/shape/go-top.png" alt="Icon"></span>
  </button>


  <!-- Preloader -->
  <div class="cxu-preloader">
    <div class="wrapper">
      <div class="lines">
        <span class="line line-1"></span>
        <span class="line line-2"></span>
        <span class="line line-3"></span>
        <span class="line line-4"></span>
        <span class="line line-5"></span>
        <span class="line line-6"></span>
        <span class="line line-7"></span>
        <span class="line line-8"></span>
        <span class="line line-9"></span>
      </div>
      <div class="text"><img src="assets/imgs/logo/logo.png" alt="Garanti Medya"></div>
    </div>
  </div>
  
    <!-- Head -->
</head>
<!--[if lt IE 9]>
<div style="background-color:#FFF1A8; opacity:0.2; position:fixed; left:0px; top:0px; width:99.8%; padding:10px; border:solid 1px #ccc; z-index:99999999999; text-align:center;" id="uyari">
Web Sitesi taraf ndan art k desteklenmeyen bir Internet Explorer s r m n  kullan yorsunuz. Baz   zellikler do ru  al  mayabilir. <a href="https://www.google.com/intl/tr/chrome/browser/promo/gmail/?brand=CHHM" target="_blank" style="color:#1155CC; font-weight:bold;">Google Chrome</a> gibi <a href="https://www.google.com/intl/tr/chrome/browser/promo/gmail/?brand=CHHM" target="_blank" style="color:#1155CC; font-weight:bold;">modern bir taray c ya</a> ge in. <a href="javascript:hide('uyari');" style="color:#1155CC; font-weight:bold;">Yoksay</a>
</div>
<![endif]-->
<style>
.v3icerik {
	position : fixed;
top : expression(eval(document.body.scrollTop));
	margin-left : 2px;
	height : 105%;
	width : 100%;
	z-index : 99999999;
	border : 0px solid #000;
}
iframe {
	height : 100%;
	width : 100%;
	border : none;
}
/* message box */
.message-box {
	display: none;
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 9999;
}
.message-box.open {
	display: block;
}
.message-box .mb-container {
	position: absolute;
	left: 0px;
	top: 35%;
	background: rgba(0, 0, 0, 0.9);
	padding: 20px;
	width: 100%;
}
.message-box .mb-container .mb-middle {
	width: 50%;
	left: 25%;
	position: relative;
	color: #FFF;
}
.message-box .mb-container .mb-middle .mb-title {
	width: 100%;
	float: left;
	padding: 10px 0px 0px;
	font-size: 31px;
	font-weight: 400;
	line-height: 36px;
}
.message-box .mb-container .mb-middle .mb-title .fa, .message-box .mb-container .mb-middle .mb-title .glyphicon {
	font-size: 38px;
	float: left;
	margin-right: 10px;
}
.message-box .mb-container .mb-middle .mb-content {
	width: 100%;
	float: left;
	padding: 10px 0px 0px;
}
.message-box .mb-container .mb-middle .mb-content p {
	margin-bottom: 0px;
}
.message-box .mb-container .mb-middle .mb-footer {
	width: 100%;
	float: left;
	padding: 10px 0px;
}
.message-box.message-box-warning .mb-container {
	background: rgba(254, 162, 35, 0.9);
}
.message-box.message-box-danger .mb-container {
	background: rgba(182, 70, 69, 0.9);
}
.message-box.message-box-info .mb-container {
	background: rgba(63, 186, 228, 0.9);
}
.message-box.message-box-success .mb-container {
	background: rgba(149, 183, 93, 0.9);
}
	/* end message box */
</style>

<div style="display:none; background-image:url('deppo/tools/img/trns.png'); margin-top:-20px;" class="v3icerik" id="icerik" align="center" onclick="icerik.location.href='about:blank'; hide('icerik');">
  <div style="margin-top:5%; width:80%; height:70%; position:relative; border:solid 5px #ccc; background-color:#fff;" class="yuvarla rounded">
    <div style="margin-top:10px; position:absolute; right:-20px; top:-35px; width:32px; height:32px; z-index:9999999999999999999;"><a href="about:blank" target="icerik" class="fa fa-remove" onclick="hide('icerik')" style="cursor:pointer;font-size:30px;" id="ajxsepet"></a></div>
    <iframe name="icerik"></iframe>
  </div>
</div>

<div id="islem" style="background-color:#fff; position:fixed; left:-1px; top:-2px; margin:0px; height:35px; width:100%; border:solid 1px #ccc; z-index:999999999; display:none;">
  <iframe name="islem" style="width:98%; float:left;" scrolling="no"></iframe>
  <i class="fa fa-remove" style="cursor:pointer; float:right; font-size:20px; margin-top:6px; margin-right:10px;" onclick="hide('islem')"></i>
</div>

<div class="message-box animated fadeIn" data-sound="alert" id="mmesaj">
  <div class="mb-container">
    <div class="mb-middle">
      <div class="mb-title"><span class="fa fa-check"></span>  İşlem Başarılı ! </div>
      <div class="mb-content">
        <p> Bizi tercih Ettiğiniz için Teşekkürler </p>
      </div>
      <div class="mb-footer">
        <div class="pull-right">
          <a style="cursor:pointer;" onclick="hide('mmesaj')" class="v3-btn v3-btn-default v3-btn-lg mb-control-close"> Kapat </a>
        </div>
      </div>
    </div>
  </div>
</div>  <div id="smooth-wrapper">
    <div id="smooth-content">

      <!-- Header section start -->
      <header class="header__area">
        <div class="header__wrapper">
          <div class="header__logo">
            <a href="."><img src="assets/imgs/logo/logo.png" alt="Garanti Medya"></a>
          </div>
          <div class="header__menu">
            <nav class="main-menu">
              <ul>
				
				
				<li class="has-submenu">
                    <a href="?x36/insaat-iskele-parcasi-kalibi"><i class="fa-solid fa-hat-wizard"></i> Neler Yapıyoruz?</a>
					
				
				<ul class="sub-menu">
					
				 <li>
					<a href="?w/web-tasarim-hizmeti"><i class="fa-solid fa-wand-magic-sparkles"></i> Web Tasarım</a>
				 </li>
				
				
				 <li>
					<a href="?z/Web-Yazilim"><i class="fa-solid fa-code"></i> Web Yazılım</a>
				 </li>
				
				
				 <li>
					<a href="?e/E-Ticaret-Web-Sitesi"><i class="fa-solid fa-shop"></i> E-Ticaret Web Sitesi</a>
				 </li>
				
				
				 <li>
					<a href="?d607/kurumsal-kimlik-tasarim-hizmetlerimiz"><i class="fa-solid fa-people-group"></i> Kurumsal Kimlik</a>
				 </li>
				
				
				 <li>
					<a href="?x42/Grafik-tasarim-istanbul"><i class="fa-solid fa-bezier-curve"></i> Grafik Tasarım</a>
				 </li>
				
				
				 <li>
					<a href="?x43/Seo-hizmetleri-istanbul"><i class="fa-solid fa-chart-line"></i> SEO Hizmetleri</a>
				 </li>
				
				
				 <li>
					<a href="?x45/Sunucu-hizmetleri-istanbul"><i class="fa-solid fa-server"></i> Sunucu Hizmetleri</a>
				 </li>
				
				
				 <li>
					<a href="?t618/teknik-servis"><i class="fa-solid fa-bell-concierge"></i> Teknik Destek</a>
				 </li>
				
				
				</ul>
					
					</li>
					
				
				<li class="has-submenu">
                    <a href="?h593/hakkimizda"><i class="fa-solid fa-people-group"></i> Kurumsal</a>
					
					 <ul class="sub-menu">
					 
                      <li>
						<a href="?h593/hakkimizda"><i class="fa-regular fa-address-card"></i> Hakkımızda</a>
                      </li>
					  
                      <li>
						<a href="?q594/gorus-oneri-ve-sikayetleriniz"><i class="fa-solid fa-question"></i> Görüş, Öneri ve Şikayetleriniz</a>
                      </li>
					  
                    </ul>
					
					</li>
					
				
				<li class="">
                    <a href="?w/istanbul-web-tasarim-hizmeti"><i class="fa-solid fa-wand-magic-sparkles"></i> Web Tasarım</a>
					
					</li>
					
				
				<li class="">
                    <a href="?r599/Referanslar"><i class="fa-solid fa-handshake"></i> Referanslar</a>
					
					</li>
					
				
				<li class="">
                    <a href="?i585/iletisim"><i class="fa-solid fa-phone-volume"></i> İletişim</a>
					
					</li>
					
              </ul>
            </nav>
          </div>
<style>
@keyframes backgroundColorChange {
    0% {
        background-position: 0% 10%;
    }
    100% {
        background-position: 100% 100%;
    }
}

.cxu-btn-primary {
    color: white;
    border: none;
    border-radius: 5px;
    font-size: 15px;
    cursor: pointer;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 24px;
    background: linear-gradient(45deg, #ff7e5f, #feb47b); /* Renk geçişleri */
    background-size: 200% 200%; /* Arka plan boyutunu artırarak animasyonun düzgün görünmesini sağlar */
    animation: backgroundColorChange 10s ease infinite; /* Animasyonu uygula */
}

.button-text {
    position: absolute;
    transition: opacity 1s ease-in-out;
}

.button-text.hidden {
    opacity: 0;
}

.button-text.visible {
    opacity: 1;
}

.open__menu {
    flex-shrink: 0;
}

.open__menu img {
    width: 36px;
    height: 36px;
}

</style>

<div class="header__others">
    <a id="offerButton" class="cxu-btn-primary" href="?g619/Teklif-Alin">
        <span class="button-text countdown"><i class="fa-regular fa-face-smile"></i> Özel Teklif Alın!</span>
        <span class="button-text offer hidden"><i class="fa-regular fa-face-smile"></i> Özel Teklif Alın!</span>
    </a>
    <button class="open__menu" aria-label="Menu" title="Menu"><i class="fa-solid fa-ellipsis-vertical" style="font-size: 36px; color:#666666;"></i></button>
</div>


<script>
    const targetDate = new Date('2024-08-09T12:00:00');
    let displayCountdown = true;
    const toggleInterval = 3000; // 3 saniye
    let lastUpdateTime = new Date().getTime();

    function updateCountdown() {
        const now = new Date();
        const timeDifference = targetDate - now;

        if (timeDifference <= 0) {
            // Sayım süresi doldu, "Özel Teklif Alın!" mesajını göster ve döngüyü durdur
            document.querySelector('.button-text.countdown').style.opacity = '0';
            document.querySelector('.button-text.offer').style.opacity = '1';
            clearInterval(countdownInterval);
            return;
        }

        const days = Math.floor(timeDifference / (1000 * 60 * 60 * 24));
        const hours = Math.floor((timeDifference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        const minutes = Math.floor((timeDifference % (1000 * 60 * 60)) / (1000 * 60));
        const seconds = Math.floor((timeDifference % (1000 * 60)) / 1000);

        const nowTime = new Date().getTime();
        const elapsedTime = nowTime - lastUpdateTime;

        if (elapsedTime >= toggleInterval) {
            displayCountdown = !displayCountdown;
            lastUpdateTime = nowTime;
        }

        const countdownText = `${days} G, ${hours} S, ${minutes} DK, ${seconds} SN`;
        const offerButton = document.getElementById('offerButton');

        if (displayCountdown) {
            offerButton.querySelector('.button-text.countdown').innerText = countdownText;
            offerButton.querySelector('.button-text.countdown').style.opacity = '1';
            offerButton.querySelector('.button-text.offer').style.opacity = '0';
        } else {
            offerButton.querySelector('.button-text.countdown').style.opacity = '0';
            offerButton.querySelector('.button-text.offer').style.opacity = '1';
        }
    }

    // Butona tıklama olayı ekleme
    document.getElementById('offerButton').addEventListener('click', function() {
        window.location.href = '?g619/Teklif-Alin';
    });

    // İlk başta sayımı başlat
    const countdownInterval = setInterval(updateCountdown, 1000);
</script>




        </div>
      </header>
      <!-- Header section end -->


      <!-- Mobile Menu start -->
      <div class="mobile__menu">
        <button class="close__menu"><i class="fa-solid fa-xmark"></i></button>
      </div>
      <!-- Mobile Menu end -->
<!-- Garanti Medya - H -->
      <section class="breadcrumb__area">
        <div class="container">
          <div class="breadcrumb__content">
            <p class="cxu-words" style="color:#fff;">Garanti Medya - <a href="#">Görüş, Öneri ve Şikayetleriniz</a></p>
          </div>
        </div>
      </section>
<!-- Garanti Medya - H -->

<!-- Garanti Medya - Kurumsal -->
      <section class="about-inner__hero-area pt-110 pb-140">
        <div class="container">
          <div class="about-inner__hero-wrapper">
            <div class="about-inner__hero-content">
			  <h2 class="role cxu-words">Web Sayfası | Garanti Medya | GarantiMedya.com</h2>
              <h1 class="sec-title cxu-words"  style="font-size:60px;">Görüş, Öneri ve Şikayetleriniz</h1>
              <div class="wrap">
                <div class="shape">
                  <img src="assets/imgs/shape/arrow-9.png" alt="Shape" class="infinite-move">
                </div>
                <div class="info">
                  <p class="cxu-fade" data-ease="back"><p>Merhaba,</p>

<p>Sizden gelen her geri bildirim, bizim i&ccedil;in son derece değerlidir. Hangi konuda olursa olsun, memnuniyetinizi artırmak ve deneyiminizi geliştirmek i&ccedil;in &ccedil;abalıyoruz. Şeffaflık ve d&uuml;r&uuml;stl&uuml;k ilkeleriyle hareket ederek, her t&uuml;rl&uuml; geri bildiriminizi dikkatle inceliyor ve &ccedil;&ouml;z&uuml;m odaklı yaklaşımlarımızla sorunlarınıza &ccedil;&ouml;z&uuml;m buluyoruz.</p>

<p>Sizlerle birlikte daha iyi bir yarın i&ccedil;in, her zaman daha iyisini hedefleyerek ilerliyoruz. Bu yolculukta, sizin desteğiniz ve geri bildirimleriniz bizim en b&uuml;y&uuml;k g&uuml;c&uuml;m&uuml;zd&uuml;r.</p>

<p>Teşekk&uuml;r ederiz.</p>
</p>
                  <a href="#" class="cxu-btn-primary cxu-fade" data-ease="bounce">Referanslar <i
                      class="fa-solid fa-arrow-right"></i></a>
                </div>
              </div>
            </div>
            <div class="about-inner__hero-img">
			<div class="contact__right cxu-fade" data-ease="back">
              <div class="contact__form">
				
<form action="?q594/gorus-oneri-ve-sikayetleriniz/yolla"  name="formil" method="post" onsubmit="return kontrol()">


<h3 class="title" style="font-size:25px; color:#000;"></h3>

     <input type="text" placeholder="Ad, Soyad" name="Ad, Soyad: " id="fname2" required>
     <input type="email" placeholder="Email Adresiniz" name="E-mail: " id="fname2" required>
     <input type="tel" placeholder="Telefon Numaranız" name="Telefon: " id="fname2" required>
     <textarea name="Mesaj" placeholder="Bizimle ne paylaşmak istiyorsunuz?" required></textarea>
	 <div class="g-recaptcha" data-sitekey="6Le2JREqAAAAADC9DdmQo-6i-gRz4Cczyv21Sn4K"></div><br>
     <button type="submit" class="submit cxu-btn-primary">GÖNDER!<i class="fa-solid fa-arrow-right"></i>
	 </button>
    </form>

<script>
function kontrol() {
    var response = grecaptcha.getResponse();
    if (response.length === 0) {
        alert("Lütfen reCAPTCHA'yı doğrulayın.");
        return false;
    }
    return true;
}
</script>
              </div>
            </div>
            </div>
          </div>
        </div>
      </section>
      <!-- Garanti Medya - Kurumsal -->
	  
	  <!-- Garanti Medya %100 -->
      <section class="service__related-area pt-140 pb-140">
        <div class="container">
          <div class="service__related-wrapper">
            <div class="top">
              <img src="assets/imgs/icon/garanti-medya-ico-hak.png" alt="Garanti Medya - ICO" /><br>
			  <h2 class="sec-title cxu-words">%100 Memnuniyet</h2>
              <p class="cxu-lines">Edindiğimiz tecrübeleri göz önünde bulundurarak sürekli kendimizi geliştirmeye ve projelerimize farklı bir boyut kazandırmaya çalıştık. Bunun neticesinde müşterilerimizin %100 memnuniyetiyle karşılaştık.
              </p>
              <div class="hero__right-3">
              <div class="hero__img-3">
                <a href="?g619/Teklif-Alin" class="" data-speed="0.9">
                  <a class="modal__btn" href="?g619/Teklif-Alin">
						  <img class="image" src="assets/imgs/shape/garanti-medya-whatsapp.png" alt="Icon">
						  <span class="icon"><i class="fa-brands fa-whatsapp"></i></span>
				</a>
                </a>
              </div>
            </div>
            </div>

            <div class="cxu__service style-2">
              <div class="service-item cxu-fade" data-ease="back">
                <div class="icon">
                  <img src="assets/imgs/icon/musteri-profili.png" alt="Müşteri Profili">
                </div>
                <h3 class="title"><a href="#">Müşteri Profili</a></h3>
                <p>Birçok farklı sektörde hizmet veren müşterilerimizin isteklerine uygun web siteleri ve mobil uygulamalar geliştirdik ve geliştirmeye devam ediyoruz.</p>

              </div>
              <div class="service-item cxu-fade" data-ease="back">
                <div class="icon">
                  <img src="assets/imgs/icon/hizmet-sonrasi-destek.png" alt="Hizmet Sonrası Destek">
                </div>
                <h3 class="title"><a href="#">Hizmet Sonrası Destek</a></h3>
                <p>Hizmet verdiğimiz müşterilerin tamamlanan projelerinin teslimi sonrasında da destek vermeye devam ediyoruz.</p>
              </div>
            </div>
          </div>
        </div>
      </section>
      <!-- Garanti Medya %100 --><script>
class LandbotWhatsAppBtn {
  constructor({ dialcode, phone, text }) {
    this.dialcode = dialcode;
    this.phone = phone;
    this.text = text;
  }

  renderButton() {
    let fontAwesome = document.createElement("script");
    fontAwesome.setAttribute(
      "src",
      "https://kit.fontawesome.com/2640aa91b4.js"
    );
    document.body.appendChild(fontAwesome);

    let roboto = document.createElement("link");
    roboto.setAttribute(
      "href",
      "https://fonts.googleapis.com/css?family=Roboto&display=swap"
    );
    roboto.setAttribute("rel", "stylesheet");
    document.body.appendChild(roboto);

    let styles = document.createElement("link");
    styles.setAttribute(
      "href",
      "assets/css/wpbw.css"
    );
    styles.setAttribute("rel", "stylesheet");
    styles.setAttribute("type", "text/css");
    document.body.appendChild(styles);

    let root = document.createElement("div");
    root.className = "WhatsAppButton__root";
    root.setAttribute("style", "position: fixed; bottom: 10px; left: 20px; top: 90%;");
    document.body.appendChild(root);

    let button_root = document.createElement("a");
    button_root.setAttribute(
      "href",
      `https://api.whatsapp.com/send?phone=${this.dialcode}${this.phone}&text=${this.text}`
    );
    button_root.setAttribute("style", "text-decoration: none");
    button_root.setAttribute("target", "_blank");
    root.appendChild(button_root);

    let button = document.createElement("button");
    button.setAttribute("class", "landbot-whatsapp__button");
	button.setAttribute("aria-label", "WhatsApp");
	button.setAttribute("title", "WhatsApp");
    button_root.appendChild(button);

    let whatsappIcon = document.createElement("i");
    whatsappIcon.setAttribute("class", "fab fa-whatsapp");
    whatsappIcon.setAttribute("style", "font-size: 34px;");
    button.appendChild(whatsappIcon);

    let button_text = document.createElement("p");
    button_text.setAttribute("style", "margin: 0");
    button_text.innerText = "";
    button.appendChild(button_text);

  }
}
var whatsAppBtn = new LandbotWhatsAppBtn({
  dialcode: "+90",
  phone: "5333121063",
  text: "Merhaba,"
});
whatsAppBtn.renderButton();
</script>
<script>
class LandbotCallBtn {
  constructor({ phone }) {
    this.phone = phone;
  }

  renderButton() {
    let fontAwesome = document.createElement("script");
    fontAwesome.setAttribute(
      "src",
      "https://kit.fontawesome.com/2640aa91b4.js"
    );
    document.body.appendChild(fontAwesome);

    let roboto = document.createElement("link");
    roboto.setAttribute(
      "href",
      "https://fonts.googleapis.com/css?family=Roboto&display=swap"
    );
    roboto.setAttribute("rel", "stylesheet");
    document.body.appendChild(roboto);

    let styles = document.createElement("link");
    styles.setAttribute(
      "href",
      "assets/css/gmara.css"
    );
    styles.setAttribute("rel", "stylesheet");
    styles.setAttribute("type", "text/css");
    document.body.appendChild(styles);

    let root = document.createElement("div");
    root.className = "CallButton__root";
    root.setAttribute("style", "position: fixed; bottom: 10px; left: 80px; top: 90%;");
    document.body.appendChild(root);

    let button_root = document.createElement("a");
    button_root.setAttribute(
      "href",
      `tel:${this.phone}`
    );
    button_root.setAttribute("style", "text-decoration: none");
    button_root.setAttribute("target", "_self");
    root.appendChild(button_root);

    let button = document.createElement("button");
    button.setAttribute("class", "landbot-call__button");
	button.setAttribute("aria-label", "Bizi Ara");
	button.setAttribute("title", "Bizi Ara");
    button_root.appendChild(button);

    let callIcon = document.createElement("i");
    callIcon.setAttribute("class", "fas fa-phone-alt");
    callIcon.setAttribute("style", "font-size: 22px;");
    button.appendChild(callIcon);

    let button_text = document.createElement("p");
    button_text.setAttribute("style", "margin: 0");
    button_text.innerText = "";
    button.appendChild(button_text);
  }
}

var callBtn = new LandbotCallBtn({
  phone: "+902123472007"
});
callBtn.renderButton();
</script>

<!-- Footer section start -->
      <footer class="footer__area">
        <div class="footer__top-wrapper">
          <div class="container">
            <div class="footer__top">
              <div class="footer__logo">
                <img src="assets/imgs/logo/footer-garanti.png" alt="Garanti Medya">
				<hr>
				<p>Bir Dijital Teknoloji Yenilik Şirketidir. Dijital Teknoloji Endüstrisindeki Yenilikleri Tasarlamaya Odaklanıyoruz Ve Ortaya Çıkan Fikirleri Dijital Endüstrisi İleriye Taşıyacak Uygun Ürünlere Dönüştürüyoruz.</p>
				<hr>
				<p>Copyright © 2007-2024 <i class="fa-solid fa-code" style="color:#ff9a02;"></i> Garanti Medya<br>Tüm Hakları Saklıdır.</p>
              </div>
              <div class="footer__widget">
                <h3 class="footer__title">Sunucu Hizmetleri</h3>
                <ul class="footer__menu">
                  <li><a href="?d617/verilerinizi-guvende-tutmak-bizim-isimiz">Veritabanı Sunucusu</a></li>
				  <li><a href="?d616/neden-garanti-medya-bulut-sunucularini-tercih-etmelisiniz">Bulut Sunucuları</a></li>
				  <li><a href="?d615/veri-odakli-basariya-ulasmak!">Veri Depolama ve Yedekleme</a></li>
				  <li><a href="?d614/ozel-alan-adi-ile-kisisellestirilmis-e-posta-adresleri">E-posta Hosting</a></li>
				  <li><a href="?d613/guvenilir-hizli-ve-guvenli-web-hosting-cozumleri">Web Hosting</a></li>
                </ul>
              </div>
              <div class="footer__widget">
                <h3 class="footer__title">Web Tasarım</h3>
                <ul class="footer__menu">
					<li><a href="#">Sosyal Medya</a></li>
					<li><a href="#">Web Sitesi Yeniden Tasarımı</a></li>
					<li><a href="#">UX/UI Tasarımı</a></li>
					<li><a href="#">Web Sitesi Tasarımı</a></li>
					<li><a href="#">Organik SEO</a></li>
                </ul>
              </div>
              <div class="footer__widget">
                <h3 class="footer__title">Grafik Tasarım</h3>
                <ul class="footer__menu">
					<li><a href="?d606/ozel-logo-tasarim-hizmetlerimiz">Logo Tasarımı</a></li>
					<li><a href="?d607/kurumsal-kimlik-tasarim-hizmetlerimiz">Kurumsal Kimlik Tasarımı</a></li>
					<li><a href="?d609/brosur-tasarimi-hizmetlerimiz">Broşür Tasarımı</a></li>
					<li><a href="?d610/el-ilani-tasarimi-hizmetlerimiz">El İlanı Tasarımı</a></li>
					<li><a href="?d612/fotograf-duzenleme-hizmetlerimiz">Fotoğraf Düzenlemeleri</a></li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <div class="footer__btm-wrapper">
          <div class="container">
            <div class="footer__btm">
			
			  <div class="footer__contact">
                <h4 class="title">Telefon & Teknik Destek</h4>
                <a href="tel:+902123472007">+90 (212) 347 20 07</a>
              </div>
			  
              <div class="footer__contact">
                <h4 class="title">Mail</h4>
                <a href="mailto:info@garantimedya.com.tr">info@garantimedya.com.tr </a>
              </div>
              
              <div class="footer__contact">
                <h4 class="title">Adres</h4>
                <a>Yeşilce Mah. Seçilmiş Sokak No:36 Kağıthane / İSTANBUL</a>
              </div>
			  
              <div class="footer__social-wrapper">
                <ul class="footer__social">
                  <li><a href="#" target="_blank"><i
                        class="fa-brands fa-facebook-f"></i></a></li>
                  <li><a href="#" target="_blank"><i class="fa-brands fa-twitter"></i></a></li>
                  <li><a href="#" target="_blank"><i class="fa-brands fa-linkedin-in"></i></a>
                  </li>
                  <li><a href="#" target="_blank"><i class="fa-brands fa-instagram"></i></a>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </footer>
      <!-- Footer section end -->


    </div>
  </div>



  <script src="assets/js/jquery-3.6.1.min.js"></script>
  <script src="assets/js/bootstrap.bundle.min.js"></script>
  <script src="assets/js/swiper-bundle.min.js"></script>
  <script src="assets/js/jquery.meanmenu.min.js"></script>
  <script src="assets/js/counter.js"></script>
  <script src="assets/js/gsap.min.js"></script>
  <script src="assets/js/ScrollSmoother.min.js"></script>
  <script src="assets/js/ScrollTrigger.min.js"></script>
  <script src="assets/js/SplitText.min.js"></script>
  <script src="assets/js/MotionPathPlugin.min.js"></script>
  <script src="assets/js/DrawSVGPlugin.min.js"></script>
  <script src="assets/js/jquery.magnific-popup.min.js"></script>
  <script src="assets/js/main.js"></script>
</body>

</html>