<!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//?/" />
    <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//?/" />
    <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 slider -->
      <section class="hero__area-3 pb-120">
        <div class="container">
          <div class="hero__wrapper-3">
            <div class="hero__content-3">
              <p class="hero__subtitle-3 cxu-words">Merhaba <i class="fa-solid fa-hand-sparkles"></i> , Kurumsal dönüşüme hazır mısın?</p>
              <h1 class="hero__title-3 cxu-words">Dijital Dönüşümün Doğduğu Yer!</h1>
              <div class="hero__info-3">
                <div class="hero__shape-3">
                  <img src="assets/imgs/shape/arrow-9.png" alt="Icon" class="infinite-move">
                </div>
                <div class="hero__text-3">
                  <div class="cxu-fade" data-ease="back" data-delay="0.7">
                    <p>İş dünyasında ilerlemenin yeni rotası, yenilikçiliği ve sanatı buluşturan bir yolculuktur. Garanti Medya olarak, işinizi bu özel kombinasyonla şekillendirmenizi sağlamak için buradayız. Bizler, iş modellerini alıp onları dijital çağa taşımanın yanı sıra, onlara bir doz sanat ve yenilik katmayı amaçlıyoruz.</p>
                  </div>
                </div>
              </div>
            </div>

            <div class="hero__right-3">
              <div class="hero__img-3">
                <img src="assets/imgs/shape/Garanti-Medya-Slider-Main-Sec-Stop.gif" alt="Image" class="image infinite-move-2">
                <img src="assets/imgs/shape/shape.png" alt="Shape" class="shape infinite-move">
                <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>
		<div class="mention">
          <div class="text">İşinizi İnovatif Sanatla Şekillendirin</div>
        </div>
      </section>
      <!-- Garanti slider end -->
	  
	  <!-- Hizmetlerimiz -->
      <section class="service__area-4 pt-140 pb-140">
        <div class="container">
          <div class="service__top-2">
            <h2 class="sec-title cxu-words">Hizmetlerimiz</h2>
          </div>

          <div class="cxu__service style-3">
		  
            <div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/web-d.png" alt="WEB TASARIM" style="width: 75px;">
              </div>
              <div class="content">
                <h3 class="title"><a href="?w/web-tasarim-hizmeti">WEB TASARIM</a></h3>
                <p>Farklı, kaliteli ve yeni trend web tasarım projeleri ile Garanti Medya müşterilerine sınırsız hizmetler sunmaya devam ediyor.</p>
                <div class="link">
                  <a href="?w/web-tasarim-hizmeti">Detaylı Bilgi<i class="fa-solid fa-arrow-right"></i></a>
                </div>
              </div>
            </div>
			<div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/web-c.png" alt="WEB YAZILIM" style="width: 75px;">
              </div>
              <div class="content">
                <h3 class="title"><a href="?z/Web-Yazilim">WEB YAZILIM</a></h3>
                <p>Garanti Medya müşteri ihyaçlarına uygun ve isteğe özel istenen web yazılım projelerini büyük bir titizlik ve kalite ile uygulamaktadır.</p>
                <div class="link">
                  <a href="?z/Web-Yazilim">Detaylı Bilgi<i class="fa-solid fa-arrow-right"></i></a>
                </div>
              </div>
            </div>
			<div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/web-e.png" alt="E-TİCARET WEB SİTESİ" style="width: 75px;">
              </div>
              <div class="content">
                <h3 class="title"><a href="?e/E-Ticaret-Web-Sitesi">E-TİCARET WEB SİTESİ</a></h3>
                <p>İnternet üzerinden e-ticaret web siteleri ile satışını artırmak isteyen müşterilerimize özel sanal mağaza tasarımları hizmeti vermekteyiz.</p>
                <div class="link">
                  <a href="?e/E-Ticaret-Web-Sitesi">Detaylı Bilgi<i class="fa-solid fa-arrow-right"></i></a>
                </div>
              </div>
            </div>
			<div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/web-p.png" alt="PORTAL WEB SİTE TASARIMI" style="width: 75px;">
              </div>
              <div class="content">
                <h3 class="title"><a href="?d600/calisma-surecimiz">PORTAL WEB SİTE TASARIMI</a></h3>
                <p>Dünyada daha çok müşteri ve kullanıcıya ulaşmak için portal web site tasarımları yapılmaktadır. İçerik olarak daha geniş ve bilgilendirici olan web sitesi dir.</p>
                <div class="link">
                  <a href="?d600/calisma-surecimiz">Detaylı Bilgi<i class="fa-solid fa-arrow-right"></i></a>
                </div>
              </div>
            </div>
			<div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/web-ads.png" alt="GOOGLE ADWORDS" style="width: 75px;">
              </div>
              <div class="content">
                <h3 class="title"><a href="?d605/dijital-pazarlama-hizmetlerimiz">GOOGLE ADWORDS</a></h3>
                <p>Türkiye' de ve Dünya' da en çok tercih edilen arama motoru olan Google' da Google Adwords kullanarak kullanıcıların size daha hızlı ulaşmasını sağlamak artık daha kolay.</p>
                <div class="link">
                  <a href="?d605/dijital-pazarlama-hizmetlerimiz">Detaylı Bilgi<i class="fa-solid fa-arrow-right"></i></a>
                </div>
              </div>
            </div>
			<div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/web-k.png" alt="KURUMSAL KİMLİK" style="width: 75px;">
              </div>
              <div class="content">
                <h3 class="title"><a href="?d607/kurumsal-kimlik-tasarim-hizmetlerimiz">KURUMSAL KİMLİK</a></h3>
                <p>Uzman ekibimizle, kurumsal kimlik çalışmalarınız yapılmaktadır. Logo, katalog, web tasarım, mobil tasarım ve daha fazlasını üretmekteyiz.</p>
                <div class="link">
                  <a href="?d607/kurumsal-kimlik-tasarim-hizmetlerimiz">Detaylı Bilgi<i class="fa-solid fa-arrow-right"></i></a>
                </div>
              </div>
            </div>
			
          </div>

		  
        </div>
      </section>
      <!-- Hizmetlerimiz end -->
	  
	  <!-- >Sınırların Ötesi -->
      <section class="service__area-2 pt-140 pb-100">
        <div class="container">
          <div class="service__top-2">
            <h2 class="sec-title cxu-words">Sınırların Ötesi</h2>
          </div>

          <div class="cxu__service style-3">
            <div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/kalite-guvencisi.png" alt="Icon">
              </div>
              <h3 class="title"><a href="#">Kalite Güvencesi</a></h3>
              <p>Tasarım tutkumuzla müşterilerimizin taleplerini ilk sırada tutarak eşsiz kalite sunuyoruz.</p>
            </div>
            <div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/hizli-destek.png" alt="Icon">
              </div>
              <h3 class="title"><a href="#">Hızlı Destek</a></h3>
              <p>Kullandığımız farklı iletişim kanalları ile her zaman işiniz için gereken hızlı desteği veriyoruz.</p>
            </div>
            <div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/uygun-fiyat.png" alt="Icon">
              </div>
              <h3 class="title"><a href="#">Uygun Fiyat</a></h3>
              <p>Müşterilerimiz ile birlikte büyüyor ve bu anlamda en kaliteli ve en uygun hizmet anlayışını benimsiyoruz.</p>
            </div>
			<div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/deneyimli-ekip.png" alt="Deneyimli Ekip">
              </div>
              <h3 class="title"><a href="#">Deneyimli Ekip</a></h3>
              <p>Yetenekli ekip arkadaşlarımızla, taleplerinizi %100 oranda karşılayacak çalışmalar yürütüyoruz.</p>
            </div>
			<div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/gizlilik.png" alt="Gizlilik Politikası">
              </div>
              <h3 class="title"><a href="#">Gizlilik Politikası</a></h3>
              <p>Aldığımız projelerde, güven duygusunu sağlamlaştırmak için gizlilik sözleşmesi imzalıyoruz.</p>
            </div>
			<div class="service-item cxu-fade" data-ease="back">
              <div class="icon">
                <img src="assets/imgs/icon/100-memnuniyet.png" alt="%100 Memnuniyet">
              </div>
              <h3 class="title"><a href="#">%100 Memnuniyet</a></h3>
              <p>Kaliteli çalışma anlayışı ve sonuç odaklı çalışmalarımız ile müşteri memnuniyetini ilk sırada tutuyoruz.</p>
            </div>
          </div>
        </div>
      </section>
      <!-- >Sınırların Ötesi end -->
	  
	  <!-- Garanti Medya -->
      <section class="about__area-3 pt-140 pb-100">
        <div class="container">
          <div class="about__wrapper-3">
            <div class="about__left-3">
              <h2 class="sec-sub-title cxu-chars">KİMİZ?</h2>
              <div class="about__img">
                <img src="assets/imgs/shape/G-shape.png" alt="Image" class="cxu-fade" data-ease="back" data-speed="0.9">
              </div>
            </div>
            <div class="about__right-3">
              <h3 class="title cxu-lines">Garanti Medya</h3>
              <p class="cxu-lines">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>
              <ul>
                <li class="cxu-fade" data-ease="back">
                  <span>MERKEZ</span>
                  Kağıthane / İstanbul
                </li>
                <li class="cxu-fade" data-ease="back">
                  <span>KURULUŞ YILI</span>
                  2007
                </li>
                <li class="cxu-fade" data-ease="back">
                  <span>TAKIM DENEYİMİ</span>
                  On (10) + Yıl
                </li>
                <li class="cxu-fade" data-ease="back">
                  <span>TAKIM ÜYELERİ</span>
                  On (10)
                </li>
				<li class="cxu-fade" data-ease="back">
                  <span>MÜŞTERİ LİSTESİ</span>
                  500’den fazla müşteri
                </li>
				<li class="cxu-fade" data-ease="back">
                  <span>PROJE TAMAMLANDI</span>
                  Bu güne kadar 5000+ üzerinde
                </li>
				<li class="cxu-fade" data-ease="back">
                  <span>İŞ MEMNUNİYET ORANI</span>
                  Tüm müşterilerin %99’u
                </li>
				<li class="cxu-fade" data-ease="back">
                  <span>MÜŞTERİ DÖNÜŞÜM ORANI</span>
                  %98 katılım
                </li>
              </ul>
              <a href="?h593/hakkimizda" class="cxu-btn-primary" data-ease="bounce">Hakkımızda</a>
            </div>
          </div>
        </div>
      </section>
      <!-- Garanti Medya end -->
	  

      <!-- Referanslar -->
      <section class="logo__slider-area">
        <div class="container">
          <div class="logo__slider-wrapper">
            <div class="logo__slider-left">
              <h3 class="title">Referanslar</h3>
            </div>
            <div class="logo__slider-right">
              <div class="swiper logo__slider">
                <div class="swiper-wrapper">
                  <div class="swiper-slide">
                    <div class="logo"><img src="assets/imgs/ref/1.png" alt="Ref 1"></div>
                  </div>
				  <div class="swiper-slide">
                    <div class="logo"><img src="assets/imgs/ref/2.png" alt="Ref 2"></div>
                  </div>
				  <div class="swiper-slide">
                    <div class="logo"><img src="assets/imgs/ref/3.png" alt="Ref 3"></div>
                  </div>
				  <div class="swiper-slide">
                    <div class="logo"><img src="assets/imgs/ref/4.png" alt="Ref 4"></div>
                  </div>
                   <div class="swiper-slide">
                    <div class="logo"><img src="assets/imgs/ref/1.png" alt="Ref 5"></div>
                  </div>
				  <div class="swiper-slide">
                    <div class="logo"><img src="assets/imgs/ref/2.png" alt="Ref 6"></div>
                  </div>
				  <div class="swiper-slide">
                    <div class="logo"><img src="assets/imgs/ref/3.png" alt="Ref 7"></div>
                  </div>
				  <div class="swiper-slide">
                    <div class="logo"><img src="assets/imgs/ref/4.png" alt="Ref 8"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
      <!-- Referanslar end --><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>