<!--
 
██╗   ██╗ █████╗ ███████╗ █████╗ ██╗         ██╗   ██╗██╗   ██╗ █████╗ ██████╗ ██╗
╚██╗ ██╔╝██╔══██╗██╔════╝██╔══██╗██║         ██║   ██║╚██╗ ██╔╝██╔══██╗██╔══██╗██║
 ╚████╔╝ ███████║███████╗███████║██║         ██║   ██║ ╚████╔╝ ███████║██████╔╝██║
  ╚██╔╝  ██╔══██║╚════██║██╔══██║██║         ██║   ██║  ╚██╔╝  ██╔══██║██╔══██╗██║
   ██║   ██║  ██║███████║██║  ██║███████╗    ╚██████╔╝   ██║   ██║  ██║██║  ██║██║
   ╚═╝   ╚═╝  ╚═╝╚══════╝╚═╝  ╚═╝╚══════╝     ╚═════╝    ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝╚═╝
                                                                                  
Bu internet sayfası BYTECH BOYA VE YAPI KİM. SAN. TİC. LTD. ŞTİ'ya aittir ve BYTECH BOYA VE YAPI KİM. SAN. TİC. LTD. ŞTİ tarafından kullanılmaktadır. ('BYTECH BOYA VE YAPI KİM. SAN. TİC. LTD. ŞTİ). 
Bu internet sayfasında ya da bu internet sayfası kullanılarak yayımlanan tüm içerik, bilgi ve yazılım BYTECH BOYA VE YAPI KİM. SAN. TİC. LTD. ŞTİ'ın mülküdür. 
Bu internet sayfası sadece aşağıdaki kullanım şartlarına uyulduğu takdirde kullanılabilir. 
Bu internet sayfasını kullanımınız bu şartnameyi kabul ettiğinizin göstergesidir. 
Bu internet sayfasının içeriği sadece kişisel kullanım içindir ve ticari amaçla kullanılamaz.  
Bu siteyi kendiniz ve kendi şirketinizin ihtiyaçları için kullanabilirsiniz.  
Size bu sayfa ile ilgili olarak kaynak koda dönüştürme, tersine mühendislik yapma, sökme, kiralama, leasing, ödünç verme, satma, başkalarına 
lisans verme, veya bu internet sayfasından veya içeriğinden alıntılar yaparak benzer işler yapma hakkı verilmemiştir.  
Herhangi bir şebeke ağı takip ve keşif yazılımı kullanarak bu sitenin mimarisini saptayıp kullanımı veya kullanıcıları hakkında bilgiyi almanız yasaktır.  
Robot, spider ya da başka otomatik veya manüel cihaz veya yöntem ile bu internet sayfasını ya da içeriğini BYTECH BOYA VE YAPI KİM. SAN. TİC. LTD. ŞTİ'ın önceden vermiş olduğu yazılı onayı olmadan takip etmek ya da kopyalamak yasaktır.  
İster ticari ister kâr amacı gütmeden ya da ister başkaları için olsun, bu web sitesini yukarıda tanınan izinlerin dışında kısmen de olsa yazdırma, indirme, kopyalama, değiştirme, çoğaltma, dağıtma, gösterme veya yayımlama hakkınız yoktur.  
Bu web sitesini ya da bir kısmını, içeriğini veya bu web sitesinde ya da web sitesi aracılığıyla mevcut yazılımı başka bir yere nakletmek ya da değiştirerek nakletmek geçerli nakil kontrol kanun ve düzenlemelerine ihlal sayılmaktadır.  
Bu web sitesinin veya içeriğinin yetki almadan kullanımı yasaktır ve size karşı infaz ve diğer yasal sonuçları doğurabilir.
Tüm içerik, başka şekilde belirtilmediği takdirde, en başta Türkiye Cumhuriyeti ve  Amerika Birleşik Devletlerinin telif hakkı, ticarî sır ve marka kanunu olmakla birlikte diğer eyalet, ulusal ve uluslararası kanun ve düzenlemeler gereğince korunmuştur.  BYTECH BOYA VE YAPI KİM. SAN. TİC. LTD. ŞTİ size dolaylı ya da dolaysız olarak telif hakkı, marka veya ticarî sır haklarını vermemektedir. 
Bununla birlikte , bu web sitesinin veya içeriğinin yetki alınmadan kullanımı telif hakkı kanunlarına, marka kanunlarına, ticarî sır kanunlarına veya şahsiyet veya umumiyet ile ilgili kanunlara ters düşebilir.
Bu şartları kabul etmiyorsanız, lütfen bu siteyi kullanmayın.
!-->
<!doctype html>
<html xmlns="//www.w3.org/1999/xhtml" xml:lang="tr-tr" lang="tr-tr">
<!--[if IE 7 ]>    <html lang="en-gb" class="isie ie7 oldie no-js"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en-gb" class="isie ie8 oldie no-js"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en-gb" class="isie ie9 no-js"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html lang="tr-tr" class="no-js">
<!--<![endif]-->
<head>
	<!-- Head -->
			<meta charset="UTF-8" />
	<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="BYTECH BOYA VE YAPI KİM. SAN. TİC. LTD. ŞTİ"/>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
	<meta content="follow, index, all" name="robots"/>
	<link id="page_favicon" href="https://res.cloudinary.com/watolye/image/upload/v1557399705/image/crm.ico" rel="icon" type="image/x-icon"/>
	<link rel="shortcut icon" type="image/x-icon" href="https://res.cloudinary.com/watolye/image/upload/v1557399705/image/crm.ico"/>
	<link rel="icon"  type="image/vnd.microsoft.icon" href="https://res.cloudinary.com/watolye/image/upload/v1557399705/image/crm.ico"/>
	<link rel="icon" href="https://bytechboya.com.tr/deppo/image/logo-c0316.png" sizes="32x32"/>
	<meta name="google-site-verification" content=""/>
	<meta name="yandex-verification" content=""/>
		
	<title>Bytech Boya ve Yapı Kimyasalları | BYTECH BOYA VE YAPI KİM. SAN. TİC. LTD. ŞTİ</title>
	<meta name="description" content="" />
	<meta name="keywords" content="Solventsiz Epoksi,Dekoratif Epoksi Zemin Kaplama,Granit Efekt Zemin Kaplama,Akrilik Spor Sistemleri,Akrilik Tenis Kort Boya,Akrilik Asfalt Kaplama,Poliüretan Spor Sistemleri,Ahşap Desenli Söve Boya,Betopan Boya,Parlak Dış Cephe Boya,Akrilik Boya,İstanbul,Kocaeli,üretici,Akrilik Yürüyüş Yolları,İç Cephe Boyaları,Dış Cephe Boyaları,Dekoratif Boyalar,Sedefli Boya,Desenli Asfalt Boyası,Badana Boya renkleri" />
	<link rel="canonical" href="https://colors.bytechboya.com.tr" />
		<meta property="og:title" content="Bytech Boya ve Yapı Kimyasalları" />
	<meta property="og:site_name" content="https://colors.bytechboya.com.tr" />
	<meta property="og:url" content="https://colors.bytechboya.com.tr/?" />
	<meta property="og:image" content="https://colors.bytechboya.com.trhttps://bytechboya.com.tr/deppo/image/logo-c0316.png" />
	<meta property="og:description" content="" />
	<meta name="twitter:card" content="summary_large_image" />
	<meta name="twitter:site" content="https://colors.bytechboya.com.tr" />
	<meta name="twitter:creator" content="@" />
	<meta name="twitter:title" content="Bytech Boya ve Yapı Kimyasalları" />
	<meta name="twitter:description" content="" />
	<meta name="twitter:image" content="https://colors.bytechboya.com.trhttps://bytechboya.com.tr/deppo/image/logo-c0316.png" />
	<meta name="twitter:domain" content="https://colors.bytechboya.com.tr/?" />
	
	<div id="guncellendi" class="notify pulse" style="display:none;"><i class="fa fa-check" style="font-size: 20px; margin-right: 10px;"></i> Güncellendi</div>
<div id="AddBasket" class="notify pulse" style="display:none;"></div>
<div id="RemBasket" class="notify pulse" style="display:none;"></div>
<div id="AddFav" class="notify pulse" style="display:none;"></div>
<div id="AddLike" class="notify pulse" style="display:none;"></div>
<div class="rside" style="display:none;">
	<i class="fa fa-close" onclick="toggle('.rside');" style="margin-left: -24px; font-size: 24px; position: absolute; cursor:pointer;"></i>
	<div id="rside"></div>
</div>

<div class="loader" id="preload">
	<div class="loader-inner"></div>
	<div class="loader-inner"></div>
	<div class="loader-inner"></div>
</div>

<div id="AjaxSuccess" style="display:none;"><img border="0" src="https://bytechboya.com.tr/deppo/tools/img/saved.gif" alt="saved" style="max-height:150px;"></div>

<!--
*/.notranslate Çeviri engeller.*/
<a href="#" onclick="Translate('tr|tr');return false;" >  <img src="https://lipis.github.io/flag-icon-css/flags/4x3/tr.svg" style="height:24px;"> </a>
<a href="#" onclick="Translate('tr|en');return false;" > <img src="https://lipis.github.io/flag-icon-css/flags/4x3/gb.svg" style="height:24px;"> </a>
-->
<style>
#goog-gt-tt { display: none!important }
.goog-te-banner-frame { display: none!important }
.goog-te-menu-value:hover { text-decoration: none!important }
.goog-text-highlight { background-color: transparent!important; box-shadow: inherit!important }
body { top: 0px !important }
#google_translate_element2 { display: none!important }
</style>
<div id="google_translate_element2"></div>
<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit2"></script> 
<script type="text/javascript">
	function googleTranslateElementInit2(){new google.translate.TranslateElement({pageLanguage:'tr',autoDisplay:false},'google_translate_element2')}
	function GTranslateFireEvent(a,b){try{if(document.createEvent){var c=document.createEvent("HTMLEvents");c.initEvent(b,true,true);a.dispatchEvent(c)}else{var c=document.createEventObject();a.fireEvent('on'+b,c)}}catch(e){}}
	function Translate(a){
		if(a.value)a=a.value;
		if(a=='')return;
		var b=a.split('|')[1];
		jQuery(".lang").html("Language ("+b+")");
        if (b == "ar"){
			jQuery('html, body').css('direction', 'rtl'); 
        } else {
			jQuery('html, body').css('direction', 'ltr'); 
        };
		var c;
		var d=document.getElementsByTagName('select');
		for(var i=0;i<d.length;i++)if(d[i].className=='goog-te-combo')c=d[i];
			if(document.getElementById('google_translate_element2')==null||document.getElementById('google_translate_element2').innerHTML.length==0||c.length==0||c.innerHTML.length==0){
				setTimeout(function(){Translate(a)},200)
			}else{
				c.value=b;GTranslateFireEvent(c,'change');GTranslateFireEvent(c,'change')
			}
		}
		(function($){$.fn.disableSelection=function(){return this .addClass("noSelect").attr("unselectable","on").on("selectstart",false)}
	})(jQuery);
	</script><script src="//cdn.crmplus.com.tr/js/inc.js" id="wjs" lang="lang1" url="colors.bytechboya.com.tr" pow="{"company":"Web Atölyesi"" ver=""ver":"V4.0101""></script> 
<link rel="stylesheet" href="//cdn.crmplus.com.tr/css/watolye.css" type="text/css" /> 
<link rel="stylesheet" href="https://bytechboya.com.tr/deppo/tools/css.php" type="text/css" /> 
<link rel="stylesheet" href="//cdn.crmplus.com.tr/css/bootstrap_v4.css" type="text/css" /> 
<script src="https://bytechboya.com.tr/deppo/tools/jquery.php?sayfa=&id="></script> 
<!--[if lt IE 9]><script src='https://bytechboya.com.tr/deppo/tools/js/html5.js'></script><![endif]--> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.css" /> 
<script src="//cdn.ckeditor.com/4.13.1/basic/ckeditor.js"></script> 
	<style> .modal-lg {margin:auto !important;} </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'); lmedya();">
		<div style="margin-top:10% !important; width:60% !important; height:60% !important; position:relative; border:solid 5px #ccc; background-color:#fff;" class="v3-img-thumbnail">
			<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 class="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 class="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" style="display:none; ">
		<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 cw">
					<p id="mb-p" class="cw">Bizi tercih Ettiğiniz için Teşekkürler</p>
				</div>
				<div class="mb-footer">
					<div class="pull-right">
						<a id="mb-a" href="?" style="cursor:pointer;" onclick="hide('mmesaj')" class="v3-btn v3-btn-danger v3-btn-lg mb-control-close">Kapat</a>
					</div>
				</div>
			</div>
		</div>
	</div>

	<!-- Modal -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display:none; z-index: 9999999; background: #00000085; padding-top: 50px;">
		<div class="modal-dialog modal-lg" style="margin:auto !important;">
			<div class="modal-content">
				<div class="modal-header" style="min-height: 60px;">
					<h4 class="modal-title" id="myModalLabel" style="width: 60%; float: left;">Modal Başlık</h4>
					<a class="cp close cmdl" data-dismiss="modal" data-url="about:blank" style="color: #999; padding: 3px; background: transparent; font-size: 16px;"> X Gizle </a>
				</div>
				<div class="modal-body" style="min-height: 500px;">
					<iframe class="iframe" width="100%" height="500" src="" name="modal" frameborder="0" style="height: 500px;" allowfullscreen></iframe>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->

	<!-- Modal -->
	<div class="modal fade" id="v3_ajax_modal" tabindex="-1" role="dialog" aria-labelledby="ajxModalLabel" aria-hidden="true" style="display:none; z-index: 9999999; background: #00000085; padding-top: 50px;">
		<div class="modal-dialog modal-lg" style="margin:auto !important;">
			<div class="modal-content">
				<div class="modal-header" style="min-height: 60px;">
					<h4 class="modal-title" id="ajxModalLabel" style="width: 60%; float: left;">Modal Başlık</h4>
					<a class="cp close cmdl" data-dismiss="modal" data-url="about:blank" style="color: #999; padding: 3px; background: transparent; font-size: 16px;"> X Gizle </a>
				</div>
				<div class="modal-body" id="majax"></div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->

	<!--<a href="#" data-url="" modal-size="full" data-title=".xls Import" class="cp mfrm">-->
	<!--<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">-->
	<!--<a class="btn btn-warning" data-toggle="modal" data-target="#v3-login" style="position:absolute; z-index:9999999"> Üye Giriş </a>-->
		<!-- Modal -->
	<div class="v3-modal fade" id="v3-login" tabindex="-1" role="dialog" aria-labelledby="loginModalLabel" aria-hidden="true">
	  <div class="v3-modal-dialog" role="document">
		<div class="v3-modal-content">
		  <div class="v3-modal-header" style="min-height: 60px;">
			<h4 class="v3-modal-title" id="loginModalLabel" style="width: 60%; float: left;">Giriş / Kayıt</h4>
			<a class="cp close cmdl" data-dismiss="modal" data-url="about:blank" style="color: ##99999; padding: 3px; background: transparent; font-size: 16px;"> X Gizle </a>
		  </div>
		  <div class="v3-modal-body" style="font-size: 18px;">

			<div class="alert alert-warning" id="mresult" role="alert" style="margin:2px 0px; padding:8px; display:none;"></div>
			<ul class="v3-nav v3-nav-tabs" role="tablist" style="border-bottom: 0px;">
				<li role="presentation" id="btn_login" class="active" style="width: 49%; float: left;"><a class="v3-alert-success" style="cursor:pointer;font-weight: unset;" href="#tab_login" aria-controls="tab_login" role="tab" data-toggle="tab">Giriş </a></li>
				<li role="presentation" id="btn_register" style="width: 49%; float: right;"><a class="v3-alert-info" style="cursor:pointer;font-weight: unset;" href="#tab_register" aria-controls="tab_register" role="tab" data-toggle="tab">Kayıt</a></li>
			</ul>

			<div class="v3-tab-content" style="margin-top:20px;">
				<div role="tabpanel" class="v3-tab-pane active" id="tab_login" style="padding:0px 5px;">
									</div>
				<div role="tabpanel" class="v3-tab-pane" id="tab_register" style="padding:0px 5px; height: 470px; overflow: auto; overflow-x: hidden;">
									</div>
			</div>
		  </div>

		</div>
	  </div>
	</div>

	<script type="text/javascript">
        jQuery(function () {
          jQuery('#btn_login').click(function () {
            jQuery('#tab_register').hide();
            jQuery('#tab_login').show();
          });
          jQuery('#btn_register').click(function () {
            jQuery('#tab_login').hide();
            jQuery('#tab_register').show();
          });
        })
      </script>
	

</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:99999999999999999999999999999999; 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]-->

	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/style.css?v=1.0.0">
	<link rel="stylesheet" href="css/basketball.css">
	<link rel="stylesheet" href="css/pickleball.css">
	<link rel="stylesheet" href="css/netball.css">
	<link rel="stylesheet" href="css/tennis-og.css">
	<link rel="stylesheet" href="css/tennis-rd.css">
	<script src="js/jquery-3.3.1.slim.min.js"></script>
	<script src="js/popper.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script src="js/printThis.js"></script>
	<script src="js/dom-to-image.js"></script>
	<script src="js/FileSaver.js"></script>
<style>
	.container {max-width: 1200px !important; }
</style>
<body>
	<script type="text/javascript">
			// THIS UPLOADS THE LOGO IMAGE
			window.onload=function(){
				var upload = document.getElementById('upload');
				//var patternImage = document.querySelector('image#img1');
				var patternImageTwo = document.querySelector('img#logoOne');
				var patternImageThree = document.querySelector('img#logoTwo');
				var currentBlobData = null;

				upload.addEventListener('change', function (e) {
					var file = this.files[0];
					if (currentBlobData) {
						URL.revokeObjectURL(currentBlobData);
					}
					currentBlobData = URL.createObjectURL(file);
				  //patternImage.setAttribute('xlink:href', currentBlobData);
				  patternImageTwo.setAttribute('src', currentBlobData);
				  patternImageThree.setAttribute('src', currentBlobData);
				});
			}

		</script>
<div class="container" style="position: relative;">
			<div class="sport-select-wrap" style="top: 11px; left: 26px;">
				<div class="sport-selector-label">Spor Seçiniz:</div>
				<div class="sport-selector">
					<select id="selectbox" name="" onchange="javascript:location.href = this.value;" >
						<option value="?" selected>Seçiniz</option>
						<option value="?s189/basketball">Basketball</option>
						<option value="?s190/bedmington">Bedmington</option>
						<option value="?s191/hentball">Hentball</option>
						<option value="?s192/tenis2">Tennis</option>
						<option value="?s193/voleyball">Voleyball</option>
					</select>
				</div>
			</div>
			</div>
		
		<script type="text/javascript">
			jQuery(function () {
				jQuery("#selectbox").change(function () {
					location.href = jQuery(this).val();
				})
			})
		</script>

<style>
.info-block {
    background-color: #3b526b !important;
}
.css-logo {
    background-color: #3b526b !important;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #fff;
    background-color: #ffaf00;
    border-color: #ffaf00 #ffaf00 #fff;
    font-weight: bold;
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #3b526b;
    border-color: #3b526b;
}
.btn-primary {
    color: #fff;
    background-color: #ffaf00;
    border-color: #ffaf00;
    font-weight: bold;
    border-radius: 0;
}
.color-selection {
    position: absolute;
    background-color: #716f6e;
    color: #000;
    z-index: 9999;
    width: 100%;
    top: 688px;
}
.chooser li {
    border-radius: 25%;
}
.chooser a {
    border-radius: 25%;
}
.color-selection p {
	color:white;
}
.chooser li {
    display: inline-block;
    width: 25px;
    height: 25px;
}
</style><div class="container">
		<div id="sport-basketball" class="colorizer-container" style="padding: 10px; max-width: 100%;">
			<div class="court-wrapper" id="court-wrapper" style="position: relative; background-color: #cedcdf; background-image: none;">
				
				<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
				viewBox="0 0 792 612" style="enable-background:new 0 0 792 612;" xml:space="preserve">
				<style type="text/css">

				.st2{fill:#fff;}
			</style>
			<rect x="15.8" y="105.34" class="st0" width="760.22" height="400.42" id="OuterCourt" fill="rgb(69,95,56)" />
			<path class="court-color" style="fill: rgb(34,29,60);" d="M171.08,258.99v-0.05v0H156.2h-42.02H14.92v92.92h156.16c25.42-0.98,45.83-21.47,45.83-46.44
			C216.91,280.46,196.5,259.98,171.08,258.99z"/>
			<path class="court-color" style="fill: rgb(34,29,60);" d="M620.74,352.41v0.05v0h14.87h42.02h99.27v-92.92H620.74c-25.42,0.98-45.83,21.47-45.83,46.44
			C574.92,330.95,595.32,351.43,620.74,352.41z"/>
			<g>
				<rect x="103.61" y="251.93" class="st2" width="2.38" height="5.02"/>
				<rect x="128.61" y="251.93" class="st2" width="2.38" height="5.02"/>
				<rect x="152.61" y="251.93" class="st2" width="2.38" height="5.02"/>
				<path class="st2" d="M396.88,103.34h-1.94H13.8v404.42h381.14h1.94h381.14V103.34H396.88z M15.8,354.13h56.06v4.84h9.09v-4.84
				h22.66v4.82h2.38v-4.82h22.62v4.82h2.38v-4.82h21.62v4.82h2.38v-4.82h14.55l0.75-0.01v-0.02c21.3-0.68,39.34-14.65,45.72-33.54
				c-7.68,79.96-75.75,142.76-158.44,143.1h-1.33H31.31H15.8V354.13z M156.44,352.02H15.8v-92.97h98.39h42.25h11.95v0v92.97v0
				L156.44,352.02C156.44,352.02,156.44,352.02,156.44,352.02z M170.55,351.97V259.1c25.42,0.98,45.83,21.47,45.83,46.44
				C216.38,330.51,195.97,350.99,170.55,351.97z M170.28,256.98l-89.33-0.02v-5.03h-9.09v5.03l-56.06-0.01V147.28h15.51h24.93h1.3
				c82.77,0.33,150.89,63.23,158.48,143.29C209.65,271.66,191.61,257.66,170.28,256.98z M394.88,351.03
				c-24.55-0.54-44.36-20.66-44.36-45.34s19.81-44.8,44.36-45.34V351.03z M394.88,258.36c-25.65,0.54-46.36,21.56-46.36,47.34
				c0,25.78,20.71,46.8,46.36,47.34v152.73H15.8v-40.09h44.05v-0.04c87.88-1.57,158.88-72.8,158.88-160.15
				c0-87.35-71-158.58-158.88-160.15v-0.05H15.8v-39.93h379.07V258.36z M396.94,260.07c24.55,0.54,44.36,20.66,44.36,45.34
				s-19.81,44.8-44.36,45.34V260.07z M776.02,505.76H396.94V352.74c25.65-0.54,46.36-21.56,46.36-47.34
				c0-25.78-20.71-46.8-46.36-47.34V105.34h379.07v40.09h-44.05v0.04c-87.88,1.57-158.88,72.8-158.88,160.15
				c0,87.35,71,158.58,158.88,160.15v0.05h44.05V505.76z M635.38,259.08h140.64v92.97h-98.39h-42.25h-11.95v0v-92.97v0L635.38,259.08
				C635.38,259.08,635.38,259.08,635.38,259.08z M719.96,256.98v-4.84h-9.09v4.84h-22.66v-4.82h-2.38v4.82h-22.62v-4.82h-2.38v4.82
				h-21.62v-4.82h-2.38v4.82h-14.55l-0.75,0.01v0.02c-21.3,0.68-39.34,14.65-45.72,33.54c7.68-79.96,75.75-142.76,158.44-143.1h1.33
				h24.92h15.51v109.52H719.96z M621.27,259.13V352c-25.42-0.98-45.83-21.47-45.83-46.44C575.44,280.6,595.85,260.11,621.27,259.13z
				M760.51,463.82h-24.93h-1.3c-82.77-0.33-150.89-63.23-158.48-143.29c6.37,18.92,24.41,32.91,45.74,33.6l89.33,0.02v5.03h9.09
				v-5.03l56.06,0.01v109.67H760.51z"/>
				<rect x="685.84" y="354.15" class="st2" width="2.38" height="5.02"/>
				<rect x="660.84" y="354.15" class="st2" width="2.38" height="5.02"/>
				<rect x="636.84" y="354.15" class="st2" width="2.38" height="5.02"/>
			</g>
		</svg>

		
		
		<div class="bb-hoop-left">
			<img src="images/hoop.png" width="100%" height="auto">
		</div>
		
		<div class="bb-hoop-right">
			<img src="images/hoop.png" width="100%" height="auto">
		</div>
		
		<div class="logo-2">
			<img src="images/css-logo-rev.png" id="logoTwo">
		</div>

		<div class="logo-1">
			<img src="images/css-logo-rev.png" id="logoOne">
		</div>
		
		<div class="info-block">
			<div class="css-logo" style="background: #0D1226;">
				<img src="images/css-logo-rev.png" id="css-logo">
			</div>
			<div class="css-contact-info">
				<p><strong>Adres</strong><br>
					İstanbul Deri Organize San Bölgesi Tav Cad. No:11 Tuzla - İstanbul Türkiye<br>
					T: +90 216 394 22 07<br>
				</p>
				<p id="disclaimer"><strong>Açıklama:</strong><br> </p>
			</div>
		</div>
		<div class="color-selection">
			<p id="inner" style="padding-left: 10px;">İç Renk: <strong><span></span></strong></p>
			<p id="outer">Saha Renk: <strong><span></span></strong></p>
			<p id="outer2">Dış Renk: <strong><span></span></strong></p>
		</div>
	</div>

	<script>
		$(document).ready(function(e) {
			var colors={
				Ral6021 : "rgb(138,153,119)",
				KoyuMaviDarkBlueRAL5010 : "rgb(0,79,124)",
				AcikMaviLightBlueRAL5015 : "rgb(0,124,176)",
				KoyuYesilDarkGreenRal6028 : "rgb(49,84,66)",
				AcikYesilLightGreenRal6010 : "rgb(77,111,57)",
				OksitKirmiziOxideRedRal3503 : "rgb(162,71,51)",
				KiremitTileRal3504 : "rgb(129,48,33)",
				GriGrayRal7037 : "rgb(122,123,122)",
				GokMaviSkyBlueRAL5012 : "rgb(0,137,182)",
				BlueLilacRal4005 : "rgb(118,104,154)",
				AcikGriLightGrayRal7045 : "rgb(141,146,149)",
				CottoRal3009 : "rgb(109,52,45)",
				SignalVioletRal4008 : "rgb(132,76,130)",
				MintTurqoiseRal6033 : "rgb(70,135,127)",
				PastelTurqoiseRal6034 : "rgb(122,172,172)",
				SafranYellowRal1017 : "rgb(246,169,80)",
				MaizeYellowRal1006 : "rgb(226,144,0)",
				TrafficYellowRal1023 : "rgb(247,181,0)",
				OrangeBrownRal8023 : "rgb(164,87,41)",
				Ral1001 : "rgb(208,176,132)",
				Ral1015 : "rgb(230,210,181)",
				Ral1019 : "rgb(164,143,122)",
				Ral1011 : "rgb(175,128,79)",
				RAL1024 : "rgb(186,143,76)",
				Ral1034 : "rgb(235,156,80)",
				Ral8001 : "rgb(157,98,43)",
				Ral8004 : "rgb(141,73,49)",
				Ral7035 : "rgb(197,199,196)",
				Ral7032 : "rgb(181,176,161)",
				Ral7045 : "rgb(141,146,149)",
				Ral5024 : "rgb(96,147,172)",
				Ral5014 : "rgb(99,125,150)",
				Ral5009 : "rgb(34,95,120)",
				Ral6011 : "rgb(108,124,89)",
				Ral6017 : "rgb(88,127,64)",
				RAL1013 : "rgb(227,217,198)",
				Ral1014 : "rgb(221,196,154)",
				Ral1018 : "rgb(250,202,48)",
				Ral1016 : "rgb(241,221,56)",
				Ral1033 : "rgb(249,154,28)",
				Ral1028 : "rgb(255,155,0)",
				Ral1032 : "rgb(226,163,0)",
				Ral2008 : "rgb(237,107,33)",
				Ral3020 : "rgb(187,30,16)",
				Ral3031 : "rgb(166,52,55)",
				Ral3000 : "rgb(167,41,32)",
				Ral4009 : "rgb(157,134,146)",
				Ral4001 : "rgb(129,97,131)",
				Ral5007 : "rgb(55,107,140)",
				Ral5005 : "rgb(0,83,135)",
				Ral7031 : "rgb(91,104,109)",
				Ral8003 : "rgb(126,75,38)",
				Ral8022 : "rgb(26,23,24)",
				Ral6018 : "rgb(97,153,59)",
				Ral6021 : "rgb(138,153,119)",
				KoyuMaviDarkBlueRAL5010 : "rgb(0,79,124)",
				AcikMaviLightBlueRAL5015 : "rgb(0,124,176)",
				KoyuYesilDarkGreenRal6028 : "rgb(49,84,66)",
				AcikYesilLightGreenRal6010 : "rgb(77,111,57)",
				OksitKirmiziOxideRedRal3503 : "rgb(162,71,51)",
				KiremitTileRal3504 : "rgb(129,48,33)",
				GriGrayRal7037 : "rgb(122,123,122)",
				GokMaviSkyBlueRAL5012 : "rgb(0,137,182)",
				BlueLilacRal4005 : "rgb(118,104,154)",
				AcikGriLightGrayRal7045 : "rgb(141,146,149)",
				CottoRal3009 : "rgb(109,52,45)",
				SignalVioletRal4008 : "rgb(132,76,130)",
				MintTurqoiseRal6033 : "rgb(70,135,127)",
				PastelTurqoiseRal6034 : "rgb(122,172,172)",
				SafranYellowRal1017 : "rgb(246,169,80)",
				MaizeYellowRal1006 : "rgb(226,144,0)",
				TrafficYellowRal1023 : "rgb(247,181,0)",
				OrangeBrownRal8023 : "rgb(164,87,41)",
				Ral1001 : "rgb(208,176,132)",
				Ral1015 : "rgb(230,210,181)",
				Ral1019 : "rgb(164,143,122)",
				Ral1011 : "rgb(175,128,79)",
				RAL1024 : "rgb(186,143,76)",
				Ral1034 : "rgb(235,156,80)",
				Ral8001 : "rgb(157,98,43)",
				Ral8004 : "rgb(141,73,49)",
				Ral7035 : "rgb(197,199,196)",
				Ral7032 : "rgb(181,176,161)",
				Ral7045 : "rgb(141,146,149)",
				Ral5024 : "rgb(96,147,172)",
				Ral5014 : "rgb(99,125,150)",
				Ral5009 : "rgb(34,95,120)",
				Ral6011 : "rgb(108,124,89)",
				Ral6017 : "rgb(88,127,64)",
				RAL1013 : "rgb(227,217,198)",
				Ral1014 : "rgb(221,196,154)",
				Ral1018 : "rgb(250,202,48)",
				Ral1016 : "rgb(241,221,56)",
				Ral1033 : "rgb(249,154,28)",
				Ral1028 : "rgb(255,155,0)",
				Ral1032 : "rgb(226,163,0)",
				Ral2008 : "rgb(237,107,33)",
				Ral3020 : "rgb(187,30,16)",
				Ral3031 : "rgb(166,52,55)",
				Ral3000 : "rgb(167,41,32)",
				Ral4009 : "rgb(157,134,146)",
				Ral4001 : "rgb(129,97,131)",
				Ral5007 : "rgb(55,107,140)",
				Ral5005 : "rgb(0,83,135)",
				Ral7031 : "rgb(91,104,109)",
				Ral8003 : "rgb(126,75,38)",
				Ral8022 : "rgb(26,23,24)",
				Ral6018 : "rgb(97,153,59)",
 		    };
 		    
 		    $(".chooser li").each(function(index, element) {
 		    	var thisClass = $(this).attr('class');
 		    	for (var colorName in colors){
 		    		if(colorName==thisClass){
 		    			$(this).css("border-color",colors[colorName]);
 		    			$(this).children("a").css("background-color",colors[colorName]);
 		    		}
 		    	}
 		    });
 		    $(".court-color").css("fill","rgb(34,29,60)")
 		    
 		    $("#outer-chooser li a").click(function(e) {
 		    	var thisClass = $(this).attr('class');
 		    	var thisText = $(this).attr("data-original-title");
 		    	
 		    	console.log (thisText)
 		    	for (var colorName in colors){
 		    		if(colorName==thisClass){
 		    			$("#court").css("background-color",colors[colorName]);
 		    			
 		    			$("#outer").css("visibility","visible");
 		    			$("#outer span").empty().append(thisText);
 		    			
							// new set colors within svg
							$("#OuterCourt").attr('fill', colors[colorName]);
							
						}
					}
					event.preventDefault();
				});

 		    $("#outer2-chooser li a").click(function(e) {
 		    	var thisClass = $(this).attr('class');
 		    	var thisText = $(this).attr("data-original-title");
 		    	
 		    	console.log (thisText)
 		    	for (var colorName in colors){
 		    		if(colorName==thisClass){
 		    			$("#court-wrapper").css("background-color",colors[colorName]);
 		    			
 		    			$("#outer2").css("visibility","visible");
 		    			$("#outer2 span").empty().append(thisText);
 		    			
							// new set colors within svg
							$("#court-wrapper").attr('fill', colors[colorName]);
							
						}
					}
					event.preventDefault();
				});

 		    $("#inner-chooser li a").click(function(e) {
 		    	var thisClass = $(this).attr('class');
 		    	var thisText = $(this).attr("data-original-title");
 		    	
 		    	for (var colorName in colors){
 		    		if(colorName==thisClass){
 		    			$(".court-color").css("fill",colors[colorName]);
 		    			$("#inner").css("visibility","visible");
 		    			$("#inner span").empty().append(thisText)
 		    		}
 		    	}
 		    	event.preventDefault();
 		    });

 		    $("#ircolor,#igcolor,#ibcolor").keyup(function(){
 		    	var ircolor = $("#ircolor").val();
 		    	var igcolor = $("#igcolor").val();
 		    	var ibcolor = $("#ibcolor").val();
				if($("#ircolor").val().length==2 && $("#igcolor").val().length==0){
					$( "#igcolor" ).focus();
				}else if($("#igcolor").val().length==2 && $("#ibcolor").val().length==0){
					$( "#ibcolor" ).focus();
				}
 		    	var thisText = 'rgb('+ircolor+','+igcolor+','+ibcolor+')';
    			$(".court-color").css("fill",'rgb('+ircolor+','+igcolor+','+ibcolor+')');
    			$("#inner").css("visibility","visible");
    			$("#inner span").empty().append(thisText);
 		    	event.preventDefault();
 		    });

 		    $("#srcolor, #sgcolor, #sbcolor").keyup(function(){
 		    	var srcolor = $("#srcolor").val();
 		    	var sgcolor = $("#sgcolor").val();
 		    	var sbcolor = $("#sbcolor").val();
				if($("#srcolor").val().length==2 && $("#sgcolor").val().length==0){
					$( "#sgcolor" ).focus();
				}else if($("#sgcolor").val().length==2 && $("#sbcolor").val().length==0){
					$( "#sbcolor" ).focus();
				}
 		    	var thisText = 'rgb('+srcolor+','+sgcolor+','+sbcolor+')';
 		    		$("#court").css("background-color", 'rgb('+srcolor+','+sgcolor+','+sbcolor+')');
 		    		$("#outer").css("visibility","visible");
 		    		$("#outer span").empty().append(thisText);
					$("#OuterCourt").attr('fill', 'rgb('+srcolor+','+sgcolor+','+sbcolor+')');
 		    	event.preventDefault();
 		    });

 		    $("#drcolor, #dgcolor, #dbcolor").keyup(function(){
 		    	var drcolor = $("#drcolor").val();
 		    	var dgcolor = $("#dgcolor").val();
 		    	var dbcolor = $("#dbcolor").val();
				if($("#drcolor").val().length==2 && $("#dgcolor").val().length==0){
					$( "#dgcolor" ).focus();
				}else if($("#dgcolor").val().length==2 && $("#dbcolor").val().length==0){
					$( "#dbcolor" ).focus();
				}
 		    	var thisText = 'rgb('+drcolor+','+dgcolor+','+dbcolor+')';
 		    		$("#court-wrapper").css("background-color", 'rgb('+drcolor+','+dgcolor+','+dbcolor+')');
 		    		$("#outer2").css("visibility","visible");
 		    		$("#outer2 span").empty().append(thisText);
					$("#OuterCourt").attr('fill', 'rgb('+drcolor+','+dgcolor+','+dbcolor+')');
 		    	event.preventDefault();
 		    });
 		    
 		    $(".nav-item").click(function(e) {
 		    	$(".court-color").css("fill", 'rgb(36,76,128)');
 		    	$("#OuterCourt").attr('fill', 'rgb(59,127,67)');
 		    	$("#outer").css("visibility","hidden");
 		    	$("#outer span").empty();
 		    	$("#inner").css("visibility","hidden");
 		    	$("#inner span").empty();
 		    	event.preventDefault();
 		    });
 		    
 		    if ('createTouch' in document){
 		    	try {
 		    		var ignore = /:hover/;
 		    		for (var i=0; i<document.styleSheets.length; i++) {
 		    			var sheet = document.styleSheets[i];
 		    			for (var j=sheet.cssRules.length-1; j>=0; j--){
 		    				var rule = sheet.cssRules[j];
 		    				if (rule.type === CSSRule.STYLE_RULE && ignore.test(rule.selectorText)){
 		    					sheet.deleteRule(j);
 		    				}
 		    			}
 		    		}
 		    	}
 		    	catch(e){}
 		    }
 		});
 	</script>

 	<div class="colorizer-options-panel">
 		<div class="row">
 			<div class="col-md-8">
 				<div class="color-options">
 					<nav>
 						<div class="nav nav-tabs" id="nav-tab" role="tablist">
 							<a class="nav-item nav-link active" id="nav-decoturf-tab" data-toggle="tab" href="#nav-decoturf" role="tab" aria-controls="nav-decoturf" aria-selected="true">® BYTECH</a>
<!-- 
							<a class="nav-item nav-link" id="nav-reboundace-tab" data-toggle="tab" href="#nav-reboundace" role="tab" aria-controls="nav-reboundace" aria-selected="false">REBOUND ACE®</a>
 							<a class="nav-item nav-link" id="nav-plexipave-tab" data-toggle="tab" href="#nav-plexipave" role="tab" aria-controls="nav-plexipave" aria-selected="false">PLEXIPAVE®</a>
-->
 							<a class="nav-item nav-link" id="nav-custom-tab" data-toggle="tab" href="#nav-custom" role="tab" aria-controls="nav-custom" aria-selected="false">Özelleştir</a>
 						</div>
 					</nav>
 					<div class="tab-content" id="nav-tabContent">
 						<div class="tab-pane fade show active" id="nav-decoturf" role="tabpanel" aria-labelledby="nav-decoturf-tab">
 							<div class="chooser clearfix" id="inner-chooser">
 								<h2>İç Renkler:</h2>

 								<ul>
 									<li class="Ral6021" style="border-color: rgb(138,153,119);" >
 										<a class="Ral6021" href="#" style="background-color: rgb(138,153,119);" data-toggle="tooltip" data-placement="top" title="Ral 6021 "></a>
 									</li>
 									<li class="KoyuMaviDarkBlueRAL5010" style="border-color: rgb(0,79,124);" >
 										<a class="KoyuMaviDarkBlueRAL5010" href="#" style="background-color: rgb(0,79,124);" data-toggle="tooltip" data-placement="top" title="Koyu Mavi - Dark Blue (RAL 5010)"></a>
 									</li>
 									<li class="AcikMaviLightBlueRAL5015" style="border-color: rgb(0,124,176);" >
 										<a class="AcikMaviLightBlueRAL5015" href="#" style="background-color: rgb(0,124,176);" data-toggle="tooltip" data-placement="top" title="Açık Mavi - Light Blue (RAL 5015)"></a>
 									</li>
 									<li class="KoyuYesilDarkGreenRal6028" style="border-color: rgb(49,84,66);" >
 										<a class="KoyuYesilDarkGreenRal6028" href="#" style="background-color: rgb(49,84,66);" data-toggle="tooltip" data-placement="top" title="Koyu Yeşil - Dark Green (Ral 6028)"></a>
 									</li>
 									<li class="AcikYesilLightGreenRal6010" style="border-color: rgb(77,111,57);" >
 										<a class="AcikYesilLightGreenRal6010" href="#" style="background-color: rgb(77,111,57);" data-toggle="tooltip" data-placement="top" title="Açık Yeşil - Light Green (Ral 6010)"></a>
 									</li>
 									<li class="OksitKirmiziOxideRedRal3503" style="border-color: rgb(162,71,51);" >
 										<a class="OksitKirmiziOxideRedRal3503" href="#" style="background-color: rgb(162,71,51);" data-toggle="tooltip" data-placement="top" title="Oksit Kırmızı - Oxide Red (Ral 350-3)"></a>
 									</li>
 									<li class="KiremitTileRal3504" style="border-color: rgb(129,48,33);" >
 										<a class="KiremitTileRal3504" href="#" style="background-color: rgb(129,48,33);" data-toggle="tooltip" data-placement="top" title="Kiremit -Tile (Ral 350-4)"></a>
 									</li>
 									<li class="GriGrayRal7037" style="border-color: rgb(122,123,122);" >
 										<a class="GriGrayRal7037" href="#" style="background-color: rgb(122,123,122);" data-toggle="tooltip" data-placement="top" title="Gri - Gray (Ral 7037)"></a>
 									</li>
 									<li class="GokMaviSkyBlueRAL5012" style="border-color: rgb(0,137,182);" >
 										<a class="GokMaviSkyBlueRAL5012" href="#" style="background-color: rgb(0,137,182);" data-toggle="tooltip" data-placement="top" title="Gök Mavi - Sky Blue (RAL 5012)"></a>
 									</li>
 									<li class="BlueLilacRal4005" style="border-color: rgb(118,104,154);" >
 										<a class="BlueLilacRal4005" href="#" style="background-color: rgb(118,104,154);" data-toggle="tooltip" data-placement="top" title="Blue Lilac (Ral 4005)"></a>
 									</li>
 									<li class="AcikGriLightGrayRal7045" style="border-color: rgb(141,146,149);" >
 										<a class="AcikGriLightGrayRal7045" href="#" style="background-color: rgb(141,146,149);" data-toggle="tooltip" data-placement="top" title="Açık Gri - Light Gray (Ral 7045)"></a>
 									</li>
 									<li class="CottoRal3009" style="border-color: rgb(109,52,45);" >
 										<a class="CottoRal3009" href="#" style="background-color: rgb(109,52,45);" data-toggle="tooltip" data-placement="top" title="Cotto (Ral 3009)"></a>
 									</li>
 									<li class="SignalVioletRal4008" style="border-color: rgb(132,76,130);" >
 										<a class="SignalVioletRal4008" href="#" style="background-color: rgb(132,76,130);" data-toggle="tooltip" data-placement="top" title="Signal Violet (Ral 4008)"></a>
 									</li>
 									<li class="MintTurqoiseRal6033" style="border-color: rgb(70,135,127);" >
 										<a class="MintTurqoiseRal6033" href="#" style="background-color: rgb(70,135,127);" data-toggle="tooltip" data-placement="top" title="Mint Turqoise (Ral 6033)"></a>
 									</li>
 									<li class="PastelTurqoiseRal6034" style="border-color: rgb(122,172,172);" >
 										<a class="PastelTurqoiseRal6034" href="#" style="background-color: rgb(122,172,172);" data-toggle="tooltip" data-placement="top" title="Pastel Turqoise (Ral 6034)"></a>
 									</li>
 									<li class="SafranYellowRal1017" style="border-color: rgb(246,169,80);" >
 										<a class="SafranYellowRal1017" href="#" style="background-color: rgb(246,169,80);" data-toggle="tooltip" data-placement="top" title="Safran Yellow (Ral 1017)"></a>
 									</li>
 									<li class="MaizeYellowRal1006" style="border-color: rgb(226,144,0);" >
 										<a class="MaizeYellowRal1006" href="#" style="background-color: rgb(226,144,0);" data-toggle="tooltip" data-placement="top" title="Maize Yellow (Ral 1006)"></a>
 									</li>
 									<li class="TrafficYellowRal1023" style="border-color: rgb(247,181,0);" >
 										<a class="TrafficYellowRal1023" href="#" style="background-color: rgb(247,181,0);" data-toggle="tooltip" data-placement="top" title="Traffic Yellow (Ral 1023)"></a>
 									</li>
 									<li class="OrangeBrownRal8023" style="border-color: rgb(164,87,41);" >
 										<a class="OrangeBrownRal8023" href="#" style="background-color: rgb(164,87,41);" data-toggle="tooltip" data-placement="top" title="Orange Brown (Ral 8023)"></a>
 									</li>
 									<li class="Ral1001" style="border-color: rgb(208,176,132);" >
 										<a class="Ral1001" href="#" style="background-color: rgb(208,176,132);" data-toggle="tooltip" data-placement="top" title="Ral 1001"></a>
 									</li>
 									<li class="Ral1015" style="border-color: rgb(230,210,181);" >
 										<a class="Ral1015" href="#" style="background-color: rgb(230,210,181);" data-toggle="tooltip" data-placement="top" title="Ral 1015"></a>
 									</li>
 									<li class="Ral1019" style="border-color: rgb(164,143,122);" >
 										<a class="Ral1019" href="#" style="background-color: rgb(164,143,122);" data-toggle="tooltip" data-placement="top" title="Ral 1019"></a>
 									</li>
 									<li class="Ral1011" style="border-color: rgb(175,128,79);" >
 										<a class="Ral1011" href="#" style="background-color: rgb(175,128,79);" data-toggle="tooltip" data-placement="top" title="Ral 1011 "></a>
 									</li>
 									<li class="RAL1024" style="border-color: rgb(186,143,76);" >
 										<a class="RAL1024" href="#" style="background-color: rgb(186,143,76);" data-toggle="tooltip" data-placement="top" title="RAL 1024"></a>
 									</li>
 									<li class="Ral1034" style="border-color: rgb(235,156,80);" >
 										<a class="Ral1034" href="#" style="background-color: rgb(235,156,80);" data-toggle="tooltip" data-placement="top" title="Ral 1034"></a>
 									</li>
 									<li class="Ral8001" style="border-color: rgb(157,98,43);" >
 										<a class="Ral8001" href="#" style="background-color: rgb(157,98,43);" data-toggle="tooltip" data-placement="top" title="Ral 8001"></a>
 									</li>
 									<li class="Ral8004" style="border-color: rgb(141,73,49);" >
 										<a class="Ral8004" href="#" style="background-color: rgb(141,73,49);" data-toggle="tooltip" data-placement="top" title="Ral 8004"></a>
 									</li>
 									<li class="Ral7035" style="border-color: rgb(197,199,196);" >
 										<a class="Ral7035" href="#" style="background-color: rgb(197,199,196);" data-toggle="tooltip" data-placement="top" title="Ral 7035"></a>
 									</li>
 									<li class="Ral7032" style="border-color: rgb(181,176,161);" >
 										<a class="Ral7032" href="#" style="background-color: rgb(181,176,161);" data-toggle="tooltip" data-placement="top" title="Ral 7032"></a>
 									</li>
 									<li class="Ral7045" style="border-color: rgb(141,146,149);" >
 										<a class="Ral7045" href="#" style="background-color: rgb(141,146,149);" data-toggle="tooltip" data-placement="top" title="Ral 7045"></a>
 									</li>
 									<li class="Ral5024" style="border-color: rgb(96,147,172);" >
 										<a class="Ral5024" href="#" style="background-color: rgb(96,147,172);" data-toggle="tooltip" data-placement="top" title="Ral 5024"></a>
 									</li>
 									<li class="Ral5014" style="border-color: rgb(99,125,150);" >
 										<a class="Ral5014" href="#" style="background-color: rgb(99,125,150);" data-toggle="tooltip" data-placement="top" title="Ral 5014"></a>
 									</li>
 									<li class="Ral5009" style="border-color: rgb(34,95,120);" >
 										<a class="Ral5009" href="#" style="background-color: rgb(34,95,120);" data-toggle="tooltip" data-placement="top" title="Ral 5009"></a>
 									</li>
 									<li class="Ral6011" style="border-color: rgb(108,124,89);" >
 										<a class="Ral6011" href="#" style="background-color: rgb(108,124,89);" data-toggle="tooltip" data-placement="top" title="Ral 6011"></a>
 									</li>
 									<li class="Ral6017" style="border-color: rgb(88,127,64);" >
 										<a class="Ral6017" href="#" style="background-color: rgb(88,127,64);" data-toggle="tooltip" data-placement="top" title="Ral 6017"></a>
 									</li>
 									<li class="RAL1013" style="border-color: rgb(227,217,198);" >
 										<a class="RAL1013" href="#" style="background-color: rgb(227,217,198);" data-toggle="tooltip" data-placement="top" title="RAL 1013"></a>
 									</li>
 									<li class="Ral1014" style="border-color: rgb(221,196,154);" >
 										<a class="Ral1014" href="#" style="background-color: rgb(221,196,154);" data-toggle="tooltip" data-placement="top" title="Ral 1014"></a>
 									</li>
 									<li class="Ral1018" style="border-color: rgb(250,202,48);" >
 										<a class="Ral1018" href="#" style="background-color: rgb(250,202,48);" data-toggle="tooltip" data-placement="top" title="Ral 1018"></a>
 									</li>
 									<li class="Ral1016" style="border-color: rgb(241,221,56);" >
 										<a class="Ral1016" href="#" style="background-color: rgb(241,221,56);" data-toggle="tooltip" data-placement="top" title="Ral 1016"></a>
 									</li>
 									<li class="Ral1033" style="border-color: rgb(249,154,28);" >
 										<a class="Ral1033" href="#" style="background-color: rgb(249,154,28);" data-toggle="tooltip" data-placement="top" title="Ral 1033"></a>
 									</li>
 									<li class="Ral1028" style="border-color: rgb(255,155,0);" >
 										<a class="Ral1028" href="#" style="background-color: rgb(255,155,0);" data-toggle="tooltip" data-placement="top" title="Ral 1028"></a>
 									</li>
 									<li class="Ral1032" style="border-color: rgb(226,163,0);" >
 										<a class="Ral1032" href="#" style="background-color: rgb(226,163,0);" data-toggle="tooltip" data-placement="top" title="Ral 1032"></a>
 									</li>
 									<li class="Ral2008" style="border-color: rgb(237,107,33);" >
 										<a class="Ral2008" href="#" style="background-color: rgb(237,107,33);" data-toggle="tooltip" data-placement="top" title="Ral 2008"></a>
 									</li>
 									<li class="Ral3020" style="border-color: rgb(187,30,16);" >
 										<a class="Ral3020" href="#" style="background-color: rgb(187,30,16);" data-toggle="tooltip" data-placement="top" title="Ral 3020"></a>
 									</li>
 									<li class="Ral3031" style="border-color: rgb(166,52,55);" >
 										<a class="Ral3031" href="#" style="background-color: rgb(166,52,55);" data-toggle="tooltip" data-placement="top" title="Ral 3031"></a>
 									</li>
 									<li class="Ral3000" style="border-color: rgb(167,41,32);" >
 										<a class="Ral3000" href="#" style="background-color: rgb(167,41,32);" data-toggle="tooltip" data-placement="top" title="Ral 3000"></a>
 									</li>
 									<li class="Ral4009" style="border-color: rgb(157,134,146);" >
 										<a class="Ral4009" href="#" style="background-color: rgb(157,134,146);" data-toggle="tooltip" data-placement="top" title="Ral 4009"></a>
 									</li>
 									<li class="Ral4001" style="border-color: rgb(129,97,131);" >
 										<a class="Ral4001" href="#" style="background-color: rgb(129,97,131);" data-toggle="tooltip" data-placement="top" title="Ral 4001"></a>
 									</li>
 									<li class="Ral5007" style="border-color: rgb(55,107,140);" >
 										<a class="Ral5007" href="#" style="background-color: rgb(55,107,140);" data-toggle="tooltip" data-placement="top" title="Ral 5007"></a>
 									</li>
 									<li class="Ral5005" style="border-color: rgb(0,83,135);" >
 										<a class="Ral5005" href="#" style="background-color: rgb(0,83,135);" data-toggle="tooltip" data-placement="top" title="Ral 5005"></a>
 									</li>
 									<li class="Ral7031" style="border-color: rgb(91,104,109);" >
 										<a class="Ral7031" href="#" style="background-color: rgb(91,104,109);" data-toggle="tooltip" data-placement="top" title="Ral 7031"></a>
 									</li>
 									<li class="Ral8003" style="border-color: rgb(126,75,38);" >
 										<a class="Ral8003" href="#" style="background-color: rgb(126,75,38);" data-toggle="tooltip" data-placement="top" title="Ral 8003"></a>
 									</li>
 									<li class="Ral8022" style="border-color: rgb(26,23,24);" >
 										<a class="Ral8022" href="#" style="background-color: rgb(26,23,24);" data-toggle="tooltip" data-placement="top" title="Ral 8022 "></a>
 									</li>
 									<li class="Ral6018" style="border-color: rgb(97,153,59);" >
 										<a class="Ral6018" href="#" style="background-color: rgb(97,153,59);" data-toggle="tooltip" data-placement="top" title="Ral 6018"></a>
 									</li>
									</ul>
								</div>
								<div class="chooser clearfix" id="outer-chooser">
									<h2>Saha Renkler:</h2>
									<ul>
 									<li class="Ral6021" style="border-color: rgb(138,153,119);" >
 										<a class="Ral6021" href="#" style="background-color: rgb(138,153,119);" data-toggle="tooltip" data-placement="top" title="Ral 6021 "></a>
 									</li>
 									<li class="KoyuMaviDarkBlueRAL5010" style="border-color: rgb(0,79,124);" >
 										<a class="KoyuMaviDarkBlueRAL5010" href="#" style="background-color: rgb(0,79,124);" data-toggle="tooltip" data-placement="top" title="Koyu Mavi - Dark Blue (RAL 5010)"></a>
 									</li>
 									<li class="AcikMaviLightBlueRAL5015" style="border-color: rgb(0,124,176);" >
 										<a class="AcikMaviLightBlueRAL5015" href="#" style="background-color: rgb(0,124,176);" data-toggle="tooltip" data-placement="top" title="Açık Mavi - Light Blue (RAL 5015)"></a>
 									</li>
 									<li class="KoyuYesilDarkGreenRal6028" style="border-color: rgb(49,84,66);" >
 										<a class="KoyuYesilDarkGreenRal6028" href="#" style="background-color: rgb(49,84,66);" data-toggle="tooltip" data-placement="top" title="Koyu Yeşil - Dark Green (Ral 6028)"></a>
 									</li>
 									<li class="AcikYesilLightGreenRal6010" style="border-color: rgb(77,111,57);" >
 										<a class="AcikYesilLightGreenRal6010" href="#" style="background-color: rgb(77,111,57);" data-toggle="tooltip" data-placement="top" title="Açık Yeşil - Light Green (Ral 6010)"></a>
 									</li>
 									<li class="OksitKirmiziOxideRedRal3503" style="border-color: rgb(162,71,51);" >
 										<a class="OksitKirmiziOxideRedRal3503" href="#" style="background-color: rgb(162,71,51);" data-toggle="tooltip" data-placement="top" title="Oksit Kırmızı - Oxide Red (Ral 350-3)"></a>
 									</li>
 									<li class="KiremitTileRal3504" style="border-color: rgb(129,48,33);" >
 										<a class="KiremitTileRal3504" href="#" style="background-color: rgb(129,48,33);" data-toggle="tooltip" data-placement="top" title="Kiremit -Tile (Ral 350-4)"></a>
 									</li>
 									<li class="GriGrayRal7037" style="border-color: rgb(122,123,122);" >
 										<a class="GriGrayRal7037" href="#" style="background-color: rgb(122,123,122);" data-toggle="tooltip" data-placement="top" title="Gri - Gray (Ral 7037)"></a>
 									</li>
 									<li class="GokMaviSkyBlueRAL5012" style="border-color: rgb(0,137,182);" >
 										<a class="GokMaviSkyBlueRAL5012" href="#" style="background-color: rgb(0,137,182);" data-toggle="tooltip" data-placement="top" title="Gök Mavi - Sky Blue (RAL 5012)"></a>
 									</li>
 									<li class="BlueLilacRal4005" style="border-color: rgb(118,104,154);" >
 										<a class="BlueLilacRal4005" href="#" style="background-color: rgb(118,104,154);" data-toggle="tooltip" data-placement="top" title="Blue Lilac (Ral 4005)"></a>
 									</li>
 									<li class="AcikGriLightGrayRal7045" style="border-color: rgb(141,146,149);" >
 										<a class="AcikGriLightGrayRal7045" href="#" style="background-color: rgb(141,146,149);" data-toggle="tooltip" data-placement="top" title="Açık Gri - Light Gray (Ral 7045)"></a>
 									</li>
 									<li class="CottoRal3009" style="border-color: rgb(109,52,45);" >
 										<a class="CottoRal3009" href="#" style="background-color: rgb(109,52,45);" data-toggle="tooltip" data-placement="top" title="Cotto (Ral 3009)"></a>
 									</li>
 									<li class="SignalVioletRal4008" style="border-color: rgb(132,76,130);" >
 										<a class="SignalVioletRal4008" href="#" style="background-color: rgb(132,76,130);" data-toggle="tooltip" data-placement="top" title="Signal Violet (Ral 4008)"></a>
 									</li>
 									<li class="MintTurqoiseRal6033" style="border-color: rgb(70,135,127);" >
 										<a class="MintTurqoiseRal6033" href="#" style="background-color: rgb(70,135,127);" data-toggle="tooltip" data-placement="top" title="Mint Turqoise (Ral 6033)"></a>
 									</li>
 									<li class="PastelTurqoiseRal6034" style="border-color: rgb(122,172,172);" >
 										<a class="PastelTurqoiseRal6034" href="#" style="background-color: rgb(122,172,172);" data-toggle="tooltip" data-placement="top" title="Pastel Turqoise (Ral 6034)"></a>
 									</li>
 									<li class="SafranYellowRal1017" style="border-color: rgb(246,169,80);" >
 										<a class="SafranYellowRal1017" href="#" style="background-color: rgb(246,169,80);" data-toggle="tooltip" data-placement="top" title="Safran Yellow (Ral 1017)"></a>
 									</li>
 									<li class="MaizeYellowRal1006" style="border-color: rgb(226,144,0);" >
 										<a class="MaizeYellowRal1006" href="#" style="background-color: rgb(226,144,0);" data-toggle="tooltip" data-placement="top" title="Maize Yellow (Ral 1006)"></a>
 									</li>
 									<li class="TrafficYellowRal1023" style="border-color: rgb(247,181,0);" >
 										<a class="TrafficYellowRal1023" href="#" style="background-color: rgb(247,181,0);" data-toggle="tooltip" data-placement="top" title="Traffic Yellow (Ral 1023)"></a>
 									</li>
 									<li class="OrangeBrownRal8023" style="border-color: rgb(164,87,41);" >
 										<a class="OrangeBrownRal8023" href="#" style="background-color: rgb(164,87,41);" data-toggle="tooltip" data-placement="top" title="Orange Brown (Ral 8023)"></a>
 									</li>
 									<li class="Ral1001" style="border-color: rgb(208,176,132);" >
 										<a class="Ral1001" href="#" style="background-color: rgb(208,176,132);" data-toggle="tooltip" data-placement="top" title="Ral 1001"></a>
 									</li>
 									<li class="Ral1015" style="border-color: rgb(230,210,181);" >
 										<a class="Ral1015" href="#" style="background-color: rgb(230,210,181);" data-toggle="tooltip" data-placement="top" title="Ral 1015"></a>
 									</li>
 									<li class="Ral1019" style="border-color: rgb(164,143,122);" >
 										<a class="Ral1019" href="#" style="background-color: rgb(164,143,122);" data-toggle="tooltip" data-placement="top" title="Ral 1019"></a>
 									</li>
 									<li class="Ral1011" style="border-color: rgb(175,128,79);" >
 										<a class="Ral1011" href="#" style="background-color: rgb(175,128,79);" data-toggle="tooltip" data-placement="top" title="Ral 1011 "></a>
 									</li>
 									<li class="RAL1024" style="border-color: rgb(186,143,76);" >
 										<a class="RAL1024" href="#" style="background-color: rgb(186,143,76);" data-toggle="tooltip" data-placement="top" title="RAL 1024"></a>
 									</li>
 									<li class="Ral1034" style="border-color: rgb(235,156,80);" >
 										<a class="Ral1034" href="#" style="background-color: rgb(235,156,80);" data-toggle="tooltip" data-placement="top" title="Ral 1034"></a>
 									</li>
 									<li class="Ral8001" style="border-color: rgb(157,98,43);" >
 										<a class="Ral8001" href="#" style="background-color: rgb(157,98,43);" data-toggle="tooltip" data-placement="top" title="Ral 8001"></a>
 									</li>
 									<li class="Ral8004" style="border-color: rgb(141,73,49);" >
 										<a class="Ral8004" href="#" style="background-color: rgb(141,73,49);" data-toggle="tooltip" data-placement="top" title="Ral 8004"></a>
 									</li>
 									<li class="Ral7035" style="border-color: rgb(197,199,196);" >
 										<a class="Ral7035" href="#" style="background-color: rgb(197,199,196);" data-toggle="tooltip" data-placement="top" title="Ral 7035"></a>
 									</li>
 									<li class="Ral7032" style="border-color: rgb(181,176,161);" >
 										<a class="Ral7032" href="#" style="background-color: rgb(181,176,161);" data-toggle="tooltip" data-placement="top" title="Ral 7032"></a>
 									</li>
 									<li class="Ral7045" style="border-color: rgb(141,146,149);" >
 										<a class="Ral7045" href="#" style="background-color: rgb(141,146,149);" data-toggle="tooltip" data-placement="top" title="Ral 7045"></a>
 									</li>
 									<li class="Ral5024" style="border-color: rgb(96,147,172);" >
 										<a class="Ral5024" href="#" style="background-color: rgb(96,147,172);" data-toggle="tooltip" data-placement="top" title="Ral 5024"></a>
 									</li>
 									<li class="Ral5014" style="border-color: rgb(99,125,150);" >
 										<a class="Ral5014" href="#" style="background-color: rgb(99,125,150);" data-toggle="tooltip" data-placement="top" title="Ral 5014"></a>
 									</li>
 									<li class="Ral5009" style="border-color: rgb(34,95,120);" >
 										<a class="Ral5009" href="#" style="background-color: rgb(34,95,120);" data-toggle="tooltip" data-placement="top" title="Ral 5009"></a>
 									</li>
 									<li class="Ral6011" style="border-color: rgb(108,124,89);" >
 										<a class="Ral6011" href="#" style="background-color: rgb(108,124,89);" data-toggle="tooltip" data-placement="top" title="Ral 6011"></a>
 									</li>
 									<li class="Ral6017" style="border-color: rgb(88,127,64);" >
 										<a class="Ral6017" href="#" style="background-color: rgb(88,127,64);" data-toggle="tooltip" data-placement="top" title="Ral 6017"></a>
 									</li>
 									<li class="RAL1013" style="border-color: rgb(227,217,198);" >
 										<a class="RAL1013" href="#" style="background-color: rgb(227,217,198);" data-toggle="tooltip" data-placement="top" title="RAL 1013"></a>
 									</li>
 									<li class="Ral1014" style="border-color: rgb(221,196,154);" >
 										<a class="Ral1014" href="#" style="background-color: rgb(221,196,154);" data-toggle="tooltip" data-placement="top" title="Ral 1014"></a>
 									</li>
 									<li class="Ral1018" style="border-color: rgb(250,202,48);" >
 										<a class="Ral1018" href="#" style="background-color: rgb(250,202,48);" data-toggle="tooltip" data-placement="top" title="Ral 1018"></a>
 									</li>
 									<li class="Ral1016" style="border-color: rgb(241,221,56);" >
 										<a class="Ral1016" href="#" style="background-color: rgb(241,221,56);" data-toggle="tooltip" data-placement="top" title="Ral 1016"></a>
 									</li>
 									<li class="Ral1033" style="border-color: rgb(249,154,28);" >
 										<a class="Ral1033" href="#" style="background-color: rgb(249,154,28);" data-toggle="tooltip" data-placement="top" title="Ral 1033"></a>
 									</li>
 									<li class="Ral1028" style="border-color: rgb(255,155,0);" >
 										<a class="Ral1028" href="#" style="background-color: rgb(255,155,0);" data-toggle="tooltip" data-placement="top" title="Ral 1028"></a>
 									</li>
 									<li class="Ral1032" style="border-color: rgb(226,163,0);" >
 										<a class="Ral1032" href="#" style="background-color: rgb(226,163,0);" data-toggle="tooltip" data-placement="top" title="Ral 1032"></a>
 									</li>
 									<li class="Ral2008" style="border-color: rgb(237,107,33);" >
 										<a class="Ral2008" href="#" style="background-color: rgb(237,107,33);" data-toggle="tooltip" data-placement="top" title="Ral 2008"></a>
 									</li>
 									<li class="Ral3020" style="border-color: rgb(187,30,16);" >
 										<a class="Ral3020" href="#" style="background-color: rgb(187,30,16);" data-toggle="tooltip" data-placement="top" title="Ral 3020"></a>
 									</li>
 									<li class="Ral3031" style="border-color: rgb(166,52,55);" >
 										<a class="Ral3031" href="#" style="background-color: rgb(166,52,55);" data-toggle="tooltip" data-placement="top" title="Ral 3031"></a>
 									</li>
 									<li class="Ral3000" style="border-color: rgb(167,41,32);" >
 										<a class="Ral3000" href="#" style="background-color: rgb(167,41,32);" data-toggle="tooltip" data-placement="top" title="Ral 3000"></a>
 									</li>
 									<li class="Ral4009" style="border-color: rgb(157,134,146);" >
 										<a class="Ral4009" href="#" style="background-color: rgb(157,134,146);" data-toggle="tooltip" data-placement="top" title="Ral 4009"></a>
 									</li>
 									<li class="Ral4001" style="border-color: rgb(129,97,131);" >
 										<a class="Ral4001" href="#" style="background-color: rgb(129,97,131);" data-toggle="tooltip" data-placement="top" title="Ral 4001"></a>
 									</li>
 									<li class="Ral5007" style="border-color: rgb(55,107,140);" >
 										<a class="Ral5007" href="#" style="background-color: rgb(55,107,140);" data-toggle="tooltip" data-placement="top" title="Ral 5007"></a>
 									</li>
 									<li class="Ral5005" style="border-color: rgb(0,83,135);" >
 										<a class="Ral5005" href="#" style="background-color: rgb(0,83,135);" data-toggle="tooltip" data-placement="top" title="Ral 5005"></a>
 									</li>
 									<li class="Ral7031" style="border-color: rgb(91,104,109);" >
 										<a class="Ral7031" href="#" style="background-color: rgb(91,104,109);" data-toggle="tooltip" data-placement="top" title="Ral 7031"></a>
 									</li>
 									<li class="Ral8003" style="border-color: rgb(126,75,38);" >
 										<a class="Ral8003" href="#" style="background-color: rgb(126,75,38);" data-toggle="tooltip" data-placement="top" title="Ral 8003"></a>
 									</li>
 									<li class="Ral8022" style="border-color: rgb(26,23,24);" >
 										<a class="Ral8022" href="#" style="background-color: rgb(26,23,24);" data-toggle="tooltip" data-placement="top" title="Ral 8022 "></a>
 									</li>
 									<li class="Ral6018" style="border-color: rgb(97,153,59);" >
 										<a class="Ral6018" href="#" style="background-color: rgb(97,153,59);" data-toggle="tooltip" data-placement="top" title="Ral 6018"></a>
 									</li>
									</ul>
								</div>

								<div class="chooser clearfix" id="outer2-chooser">
									<h2>Dış Renkler:</h2>
									<ul>
 									<li class="Ral6021" style="border-color: rgb(138,153,119);" >
 										<a class="Ral6021" href="#" style="background-color: rgb(138,153,119);" data-toggle="tooltip" data-placement="top" title="Ral 6021 "></a>
 									</li>
 									<li class="KoyuMaviDarkBlueRAL5010" style="border-color: rgb(0,79,124);" >
 										<a class="KoyuMaviDarkBlueRAL5010" href="#" style="background-color: rgb(0,79,124);" data-toggle="tooltip" data-placement="top" title="Koyu Mavi - Dark Blue (RAL 5010)"></a>
 									</li>
 									<li class="AcikMaviLightBlueRAL5015" style="border-color: rgb(0,124,176);" >
 										<a class="AcikMaviLightBlueRAL5015" href="#" style="background-color: rgb(0,124,176);" data-toggle="tooltip" data-placement="top" title="Açık Mavi - Light Blue (RAL 5015)"></a>
 									</li>
 									<li class="KoyuYesilDarkGreenRal6028" style="border-color: rgb(49,84,66);" >
 										<a class="KoyuYesilDarkGreenRal6028" href="#" style="background-color: rgb(49,84,66);" data-toggle="tooltip" data-placement="top" title="Koyu Yeşil - Dark Green (Ral 6028)"></a>
 									</li>
 									<li class="AcikYesilLightGreenRal6010" style="border-color: rgb(77,111,57);" >
 										<a class="AcikYesilLightGreenRal6010" href="#" style="background-color: rgb(77,111,57);" data-toggle="tooltip" data-placement="top" title="Açık Yeşil - Light Green (Ral 6010)"></a>
 									</li>
 									<li class="OksitKirmiziOxideRedRal3503" style="border-color: rgb(162,71,51);" >
 										<a class="OksitKirmiziOxideRedRal3503" href="#" style="background-color: rgb(162,71,51);" data-toggle="tooltip" data-placement="top" title="Oksit Kırmızı - Oxide Red (Ral 350-3)"></a>
 									</li>
 									<li class="KiremitTileRal3504" style="border-color: rgb(129,48,33);" >
 										<a class="KiremitTileRal3504" href="#" style="background-color: rgb(129,48,33);" data-toggle="tooltip" data-placement="top" title="Kiremit -Tile (Ral 350-4)"></a>
 									</li>
 									<li class="GriGrayRal7037" style="border-color: rgb(122,123,122);" >
 										<a class="GriGrayRal7037" href="#" style="background-color: rgb(122,123,122);" data-toggle="tooltip" data-placement="top" title="Gri - Gray (Ral 7037)"></a>
 									</li>
 									<li class="GokMaviSkyBlueRAL5012" style="border-color: rgb(0,137,182);" >
 										<a class="GokMaviSkyBlueRAL5012" href="#" style="background-color: rgb(0,137,182);" data-toggle="tooltip" data-placement="top" title="Gök Mavi - Sky Blue (RAL 5012)"></a>
 									</li>
 									<li class="BlueLilacRal4005" style="border-color: rgb(118,104,154);" >
 										<a class="BlueLilacRal4005" href="#" style="background-color: rgb(118,104,154);" data-toggle="tooltip" data-placement="top" title="Blue Lilac (Ral 4005)"></a>
 									</li>
 									<li class="AcikGriLightGrayRal7045" style="border-color: rgb(141,146,149);" >
 										<a class="AcikGriLightGrayRal7045" href="#" style="background-color: rgb(141,146,149);" data-toggle="tooltip" data-placement="top" title="Açık Gri - Light Gray (Ral 7045)"></a>
 									</li>
 									<li class="CottoRal3009" style="border-color: rgb(109,52,45);" >
 										<a class="CottoRal3009" href="#" style="background-color: rgb(109,52,45);" data-toggle="tooltip" data-placement="top" title="Cotto (Ral 3009)"></a>
 									</li>
 									<li class="SignalVioletRal4008" style="border-color: rgb(132,76,130);" >
 										<a class="SignalVioletRal4008" href="#" style="background-color: rgb(132,76,130);" data-toggle="tooltip" data-placement="top" title="Signal Violet (Ral 4008)"></a>
 									</li>
 									<li class="MintTurqoiseRal6033" style="border-color: rgb(70,135,127);" >
 										<a class="MintTurqoiseRal6033" href="#" style="background-color: rgb(70,135,127);" data-toggle="tooltip" data-placement="top" title="Mint Turqoise (Ral 6033)"></a>
 									</li>
 									<li class="PastelTurqoiseRal6034" style="border-color: rgb(122,172,172);" >
 										<a class="PastelTurqoiseRal6034" href="#" style="background-color: rgb(122,172,172);" data-toggle="tooltip" data-placement="top" title="Pastel Turqoise (Ral 6034)"></a>
 									</li>
 									<li class="SafranYellowRal1017" style="border-color: rgb(246,169,80);" >
 										<a class="SafranYellowRal1017" href="#" style="background-color: rgb(246,169,80);" data-toggle="tooltip" data-placement="top" title="Safran Yellow (Ral 1017)"></a>
 									</li>
 									<li class="MaizeYellowRal1006" style="border-color: rgb(226,144,0);" >
 										<a class="MaizeYellowRal1006" href="#" style="background-color: rgb(226,144,0);" data-toggle="tooltip" data-placement="top" title="Maize Yellow (Ral 1006)"></a>
 									</li>
 									<li class="TrafficYellowRal1023" style="border-color: rgb(247,181,0);" >
 										<a class="TrafficYellowRal1023" href="#" style="background-color: rgb(247,181,0);" data-toggle="tooltip" data-placement="top" title="Traffic Yellow (Ral 1023)"></a>
 									</li>
 									<li class="OrangeBrownRal8023" style="border-color: rgb(164,87,41);" >
 										<a class="OrangeBrownRal8023" href="#" style="background-color: rgb(164,87,41);" data-toggle="tooltip" data-placement="top" title="Orange Brown (Ral 8023)"></a>
 									</li>
 									<li class="Ral1001" style="border-color: rgb(208,176,132);" >
 										<a class="Ral1001" href="#" style="background-color: rgb(208,176,132);" data-toggle="tooltip" data-placement="top" title="Ral 1001"></a>
 									</li>
 									<li class="Ral1015" style="border-color: rgb(230,210,181);" >
 										<a class="Ral1015" href="#" style="background-color: rgb(230,210,181);" data-toggle="tooltip" data-placement="top" title="Ral 1015"></a>
 									</li>
 									<li class="Ral1019" style="border-color: rgb(164,143,122);" >
 										<a class="Ral1019" href="#" style="background-color: rgb(164,143,122);" data-toggle="tooltip" data-placement="top" title="Ral 1019"></a>
 									</li>
 									<li class="Ral1011" style="border-color: rgb(175,128,79);" >
 										<a class="Ral1011" href="#" style="background-color: rgb(175,128,79);" data-toggle="tooltip" data-placement="top" title="Ral 1011 "></a>
 									</li>
 									<li class="RAL1024" style="border-color: rgb(186,143,76);" >
 										<a class="RAL1024" href="#" style="background-color: rgb(186,143,76);" data-toggle="tooltip" data-placement="top" title="RAL 1024"></a>
 									</li>
 									<li class="Ral1034" style="border-color: rgb(235,156,80);" >
 										<a class="Ral1034" href="#" style="background-color: rgb(235,156,80);" data-toggle="tooltip" data-placement="top" title="Ral 1034"></a>
 									</li>
 									<li class="Ral8001" style="border-color: rgb(157,98,43);" >
 										<a class="Ral8001" href="#" style="background-color: rgb(157,98,43);" data-toggle="tooltip" data-placement="top" title="Ral 8001"></a>
 									</li>
 									<li class="Ral8004" style="border-color: rgb(141,73,49);" >
 										<a class="Ral8004" href="#" style="background-color: rgb(141,73,49);" data-toggle="tooltip" data-placement="top" title="Ral 8004"></a>
 									</li>
 									<li class="Ral7035" style="border-color: rgb(197,199,196);" >
 										<a class="Ral7035" href="#" style="background-color: rgb(197,199,196);" data-toggle="tooltip" data-placement="top" title="Ral 7035"></a>
 									</li>
 									<li class="Ral7032" style="border-color: rgb(181,176,161);" >
 										<a class="Ral7032" href="#" style="background-color: rgb(181,176,161);" data-toggle="tooltip" data-placement="top" title="Ral 7032"></a>
 									</li>
 									<li class="Ral7045" style="border-color: rgb(141,146,149);" >
 										<a class="Ral7045" href="#" style="background-color: rgb(141,146,149);" data-toggle="tooltip" data-placement="top" title="Ral 7045"></a>
 									</li>
 									<li class="Ral5024" style="border-color: rgb(96,147,172);" >
 										<a class="Ral5024" href="#" style="background-color: rgb(96,147,172);" data-toggle="tooltip" data-placement="top" title="Ral 5024"></a>
 									</li>
 									<li class="Ral5014" style="border-color: rgb(99,125,150);" >
 										<a class="Ral5014" href="#" style="background-color: rgb(99,125,150);" data-toggle="tooltip" data-placement="top" title="Ral 5014"></a>
 									</li>
 									<li class="Ral5009" style="border-color: rgb(34,95,120);" >
 										<a class="Ral5009" href="#" style="background-color: rgb(34,95,120);" data-toggle="tooltip" data-placement="top" title="Ral 5009"></a>
 									</li>
 									<li class="Ral6011" style="border-color: rgb(108,124,89);" >
 										<a class="Ral6011" href="#" style="background-color: rgb(108,124,89);" data-toggle="tooltip" data-placement="top" title="Ral 6011"></a>
 									</li>
 									<li class="Ral6017" style="border-color: rgb(88,127,64);" >
 										<a class="Ral6017" href="#" style="background-color: rgb(88,127,64);" data-toggle="tooltip" data-placement="top" title="Ral 6017"></a>
 									</li>
 									<li class="RAL1013" style="border-color: rgb(227,217,198);" >
 										<a class="RAL1013" href="#" style="background-color: rgb(227,217,198);" data-toggle="tooltip" data-placement="top" title="RAL 1013"></a>
 									</li>
 									<li class="Ral1014" style="border-color: rgb(221,196,154);" >
 										<a class="Ral1014" href="#" style="background-color: rgb(221,196,154);" data-toggle="tooltip" data-placement="top" title="Ral 1014"></a>
 									</li>
 									<li class="Ral1018" style="border-color: rgb(250,202,48);" >
 										<a class="Ral1018" href="#" style="background-color: rgb(250,202,48);" data-toggle="tooltip" data-placement="top" title="Ral 1018"></a>
 									</li>
 									<li class="Ral1016" style="border-color: rgb(241,221,56);" >
 										<a class="Ral1016" href="#" style="background-color: rgb(241,221,56);" data-toggle="tooltip" data-placement="top" title="Ral 1016"></a>
 									</li>
 									<li class="Ral1033" style="border-color: rgb(249,154,28);" >
 										<a class="Ral1033" href="#" style="background-color: rgb(249,154,28);" data-toggle="tooltip" data-placement="top" title="Ral 1033"></a>
 									</li>
 									<li class="Ral1028" style="border-color: rgb(255,155,0);" >
 										<a class="Ral1028" href="#" style="background-color: rgb(255,155,0);" data-toggle="tooltip" data-placement="top" title="Ral 1028"></a>
 									</li>
 									<li class="Ral1032" style="border-color: rgb(226,163,0);" >
 										<a class="Ral1032" href="#" style="background-color: rgb(226,163,0);" data-toggle="tooltip" data-placement="top" title="Ral 1032"></a>
 									</li>
 									<li class="Ral2008" style="border-color: rgb(237,107,33);" >
 										<a class="Ral2008" href="#" style="background-color: rgb(237,107,33);" data-toggle="tooltip" data-placement="top" title="Ral 2008"></a>
 									</li>
 									<li class="Ral3020" style="border-color: rgb(187,30,16);" >
 										<a class="Ral3020" href="#" style="background-color: rgb(187,30,16);" data-toggle="tooltip" data-placement="top" title="Ral 3020"></a>
 									</li>
 									<li class="Ral3031" style="border-color: rgb(166,52,55);" >
 										<a class="Ral3031" href="#" style="background-color: rgb(166,52,55);" data-toggle="tooltip" data-placement="top" title="Ral 3031"></a>
 									</li>
 									<li class="Ral3000" style="border-color: rgb(167,41,32);" >
 										<a class="Ral3000" href="#" style="background-color: rgb(167,41,32);" data-toggle="tooltip" data-placement="top" title="Ral 3000"></a>
 									</li>
 									<li class="Ral4009" style="border-color: rgb(157,134,146);" >
 										<a class="Ral4009" href="#" style="background-color: rgb(157,134,146);" data-toggle="tooltip" data-placement="top" title="Ral 4009"></a>
 									</li>
 									<li class="Ral4001" style="border-color: rgb(129,97,131);" >
 										<a class="Ral4001" href="#" style="background-color: rgb(129,97,131);" data-toggle="tooltip" data-placement="top" title="Ral 4001"></a>
 									</li>
 									<li class="Ral5007" style="border-color: rgb(55,107,140);" >
 										<a class="Ral5007" href="#" style="background-color: rgb(55,107,140);" data-toggle="tooltip" data-placement="top" title="Ral 5007"></a>
 									</li>
 									<li class="Ral5005" style="border-color: rgb(0,83,135);" >
 										<a class="Ral5005" href="#" style="background-color: rgb(0,83,135);" data-toggle="tooltip" data-placement="top" title="Ral 5005"></a>
 									</li>
 									<li class="Ral7031" style="border-color: rgb(91,104,109);" >
 										<a class="Ral7031" href="#" style="background-color: rgb(91,104,109);" data-toggle="tooltip" data-placement="top" title="Ral 7031"></a>
 									</li>
 									<li class="Ral8003" style="border-color: rgb(126,75,38);" >
 										<a class="Ral8003" href="#" style="background-color: rgb(126,75,38);" data-toggle="tooltip" data-placement="top" title="Ral 8003"></a>
 									</li>
 									<li class="Ral8022" style="border-color: rgb(26,23,24);" >
 										<a class="Ral8022" href="#" style="background-color: rgb(26,23,24);" data-toggle="tooltip" data-placement="top" title="Ral 8022 "></a>
 									</li>
 									<li class="Ral6018" style="border-color: rgb(97,153,59);" >
 										<a class="Ral6018" href="#" style="background-color: rgb(97,153,59);" data-toggle="tooltip" data-placement="top" title="Ral 6018"></a>
 									</li>
									</ul>
								</div>
							</div>
							<div class="tab-pane fade" id="nav-reboundace" role="tabpanel" aria-labelledby="nav-reboundace-tab">
								<div class="chooser clearfix" id="inner-chooser">
									<h2>Inner Court Colors:</h2>
									<ul>
										<li class="REBOUNDACEbyronBlue"><a class="REBOUNDACEbyronBlue" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Byron Blue"></a></li>
										<li class="REBOUNDACEoceanBlue"><a class="REBOUNDACEoceanBlue" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Ocean Blue"></a></li>
										<li class="REBOUNDACEroyalBlue"><a class="REBOUNDACEroyalBlue" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Royal Blue"></a></li>
										<li class="REBOUNDACEmidGray"><a class="REBOUNDACEmidGray" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Mid Gray"></a></li>
										<li class="REBOUNDACEdenimBlue"><a class="REBOUNDACEdenimBlue" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Denim Blue"></a></li>
										<li class="REBOUNDACEgrassGreen"><a class="REBOUNDACEgrassGreen" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Grass Green"></a></li>
										<li class="REBOUNDACEmossGreen"><a class="REBOUNDACEmossGreen" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Moss Green"></a></li>
										<li class="REBOUNDACEterracotta"><a class="REBOUNDACEterracotta" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Terracotta"></a></li>
									</ul>
								</div>
								<div class="chooser clearfix" id="outer-chooser">
									<h2>Outer Court Colors:</h2>
									<ul>
										<li class="REBOUNDACEbyronBlue"><a class="REBOUNDACEbyronBlue" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Byron Blue"></a></li>
										<li class="REBOUNDACEoceanBlue"><a class="REBOUNDACEoceanBlue" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Ocean Blue"></a></li>
										<li class="REBOUNDACEroyalBlue"><a class="REBOUNDACEroyalBlue" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Royal Blue"></a></li>
										<li class="REBOUNDACEmidGray"><a class="REBOUNDACEmidGray" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Mid Gray"></a></li>
										<li class="REBOUNDACEdenimBlue"><a class="REBOUNDACEdenimBlue" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Denim Blue"></a></li>
										<li class="REBOUNDACEgrassGreen"><a class="REBOUNDACEgrassGreen" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Grass Green"></a></li>
										<li class="REBOUNDACEmossGreen"><a class="REBOUNDACEmossGreen" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Moss Green"></a></li>
										<li class="REBOUNDACEterracotta"><a class="REBOUNDACEterracotta" href="#" data-toggle="tooltip" data-placement="top" title="REBOUND ACE® Terracotta"></a></li>
									</ul>
								</div>

							</div>
							<div class="tab-pane fade" id="nav-plexipave" role="tabpanel" aria-labelledby="nav-plexipave-tab">
								<div class="chooser clearfix" id="inner-chooser">
									<h2>Inner Court Colors:</h2>
									<ul>
										<li class="PLEXIPAVEbruinBlue"><a class="PLEXIPAVEbruinBlue" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Bruin Blue"></a></li>
										<li class="PLEXIPAVEcaliforniaRed"><a class="PLEXIPAVEcaliforniaRed" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® California Red"></a></li>
										<li class="PLEXIPAVEcapeGray"><a class="PLEXIPAVEcapeGray" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Cape Gray"></a></li>
										<li class="PLEXIPAVEdarkGreen"><a class="PLEXIPAVEdarkGreen" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Dark Green"></a></li>
										<li class="PLEXIPAVEfloridaGreen"><a class="PLEXIPAVEfloridaGreen" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Florida Green Ebony"></a></li>
										<li class="PLEXIPAVElightGreen"><a class="PLEXIPAVElightGreen" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Light Green"></a></li>
										<li class="PLEXIPAVEpacificBlue"><a class="PLEXIPAVEpacificBlue" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Pacific Blue"></a></li>
										<li class="PLEXIPAVEsaharaSand"><a class="PLEXIPAVEsaharaSand" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Sahara Sand"></a></li>
										<li class="PLEXIPAVEproPurple"><a class="PLEXIPAVEproPurple" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Pro Purple (Indian Wells)"></a></li>
										<!--<li class="PLEXIPAVEtrueBlue"><a class="PLEXIPAVEtrueBlue" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Australian Open True Blue"></a></li>
										<li class="PLEXIPAVEusopenBlue"><a class="PLEXIPAVEusopenBlue" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® US Open™ Blue™"></a></li>
										<li class="PLEXIPAVEvelocityBlue"><a class="PLEXIPAVEvelocityBlue" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Australian Open Velocity Blue"></a></li>-->
									</ul>
								</div>
								<div class="chooser clearfix" id="outer-chooser">
									<h2>Outer Court Colors:</h2>
									<ul>
										<li class="PLEXIPAVEbruinBlue"><a class="PLEXIPAVEbruinBlue" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Bruin Blue"></a></li>
										<li class="PLEXIPAVEcaliforniaRed"><a class="PLEXIPAVEcaliforniaRed" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® California Red"></a></li>
										<li class="PLEXIPAVEcapeGray"><a class="PLEXIPAVEcapeGray" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Cape Gray"></a></li>
										<li class="PLEXIPAVEdarkGreen"><a class="PLEXIPAVEdarkGreen" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Dark Green"></a></li>
										<li class="PLEXIPAVEfloridaGreen"><a class="PLEXIPAVEfloridaGreen" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Florida Green Ebony"></a></li>
										<li class="PLEXIPAVElightGreen"><a class="PLEXIPAVElightGreen" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Light Green"></a></li>
										<li class="PLEXIPAVEpacificBlue"><a class="PLEXIPAVEpacificBlue" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Pacific Blue"></a></li>
										<li class="PLEXIPAVEsaharaSand"><a class="PLEXIPAVEsaharaSand" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Sahara Sand"></a></li>
										<li class="PLEXIPAVEproPurple"><a class="PLEXIPAVEproPurple" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Pro Purple (Indian Wells)"></a></li>
										<!--<li class="PLEXIPAVEtrueBlue"><a class="PLEXIPAVEtrueBlue" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Australian Open True Blue"></a></li>
										<li class="PLEXIPAVEusopenBlue"><a class="PLEXIPAVEusopenBlue" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® US Open™ Blue™"></a></li>
										<li class="PLEXIPAVEvelocityBlue"><a class="PLEXIPAVEvelocityBlue" href="#" data-toggle="tooltip" data-placement="top" title="PLEXIPAVE® Australian Open Velocity Blue"></a></li>-->
									</ul>
								</div>

							</div>
							<div class="tab-pane fade" id="nav-custom" role="tabpanel" aria-labelledby="nav-custom-tab">
								<div class="v3-col-md-3">
									<label style="display:block;">İç Renk</label>
									<input type="text" id="ircolor" placeholder="(R)" style="width:33%; float:left;">
									<input type="text" id="igcolor" placeholder="(G)" style="width:33%; float:left;">
									<input type="text" id="ibcolor" placeholder="(B)" style="width:33%; float:left;">
								</div>
								<div class="v3-col-md-3">
									<label style="display:block;">Saha Renk</label>
									<input type="text" id="srcolor" placeholder="(R)" style="width:33%; float:left;">
									<input type="text" id="sgcolor" placeholder="(G)" style="width:33%; float:left;">
									<input type="text" id="sbcolor" placeholder="(B)" style="width:33%; float:left;">
								</div>

								<div class="v3-col-md-3">
									<label style="display:block;">Dış Renk</label>
									<input type="text" id="drcolor" placeholder="(R)" style="width:33%; float:left;">
									<input type="text" id="dgcolor" placeholder="(G)" style="width:33%; float:left;">
									<input type="text" id="dbcolor" placeholder="(B)" style="width:33%; float:left;">
								</div>

							</div>
						</div>
					</div>
				</div>
<div class="col-md-4">
					<label>Logo Yükle</label>
					<div class="custom-file">
						<input type="file" class="custom-file-input" id="upload" data-buttonText="Gözat">
						<label class="custom-file-label" for="upload">Dosya Seçiniz</label>
						<small id="uploadHelp" class="form-text text-muted">Dosya Türleri: JPG, PNG, GIF</small>
					</div>
					<button id="download-image" class="btn btn-primary"><i class="fa fa-arrow-down" aria-hidden="true"></i> Görseli İndir</button>
					<!--<button id="print-image" href="#print" style="background-color: #ccc; padding: 6px 10px;font-weight: bold;">PRINT IMAGE</button>-->
				</div>
			</div>
		</div>
				</div>
				
	
	
	</div>
<div class="col-md-12" style="text-align: center; ">
	Copyright © 2021 <a href="https://www.webatolyesi.com.tr" style="color: #3b526b !important;" target="_blank">Web Atölyesi</a>
<div>
<script>
			// THIS DOWNLOADS THE IMAGE
			var btn = document.getElementById('download-image');
			var node = document.getElementById('court-wrapper');
			btn.onclick = function() {
				
				var button = $(this);
				button.html("Generating Image...").prop('disabled', true);
				setTimeout(function() {
					domtoimage.toBlob(document.getElementById('court-wrapper'))
					.then(function(blob) {
						window.saveAs(blob, 'bytech-colorizer.png');
						button.html("Download Image").prop('disabled', false);
					});
				}, 7000);
			}

			// THIS PRINTS THE IMAGE
			$('#print-image').on("click", function () {
				$('#court-wrapper').printThis({
					importCSS: true,           
					importStyle: true,    
					base: "https://jasonday.github.io/printThis/"
				});
			});

			$(function () {
				$('[data-toggle="tooltip"]').tooltip({trigger: 'hover'})
			})

        //detects if user is using Internet Explorer
        //returns version of IE or false, if browser is not IE
        //Function to detect IE or not
        function IEdetection() {
        	var ua = window.navigator.userAgent;
        	var msie = ua.indexOf('MSIE ');
        	if (msie > 0) {
                // IE 10 or older, return version number
                return ('' + parseInt(ua.substring(
                	msie + 5, ua.indexOf('.', msie)), 10));
            }
            var trident = ua.indexOf('Trident/');
            if (trident > 0) {
                // IE 11, return version number
                var rv = ua.indexOf('rv:');
                return ('' + parseInt(ua.substring(
                	rv + 3, ua.indexOf('.', rv)), 10));
            }
            var edge = ua.indexOf('Edge/');
            if (edge > 0) {
                //Edge (IE 12+), return version number
                return ('' + parseInt(ua.substring(
                	edge + 5, ua.indexOf('.', edge)), 10));
            }
            // User uses other browser
            return ('0');
        }
        
        var result = IEdetection();
        var dlbtn = document.getElementById('download-image');
        
        if(result > 0) {
        	dlbtn.style.display = 'none';
        }
        
        //document.write(result);
    </script>
    
    <script>
    	var monthNames = [ "1", "February", "March", "April", "May", "June","July", "August", "September", "October", "November", "December" ];
    	var dayNames= ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]
    	var newDate = new Date();
    	$('#date').html(monthNames[newDate.getMonth()] + '/' + newDate.getDate() + '/' + newDate.getFullYear());
    </script>
    
</body>
</html>