#temizle {clear:both; } 
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline;} 
body{margin:0px;text-align: left;padding:0;overflow-x: hidden; font-family: 'Open Sans', sans-serif;font-weight:300; font-size:15px; color:#959595; line-height:25px;}
#wrapper{ position:relative; width: 1200px; margin: 0 auto; }
header{ position: absolute;; width: 100%; height: auto; height:70px;  box-sizing: border-box; box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.0); z-index: 9999999 !important;  transition:all 0.5s ease-in;}

header > #wrapper > .logo { position: relative; width:18%; float: left; display: block; top: 10px;  }
header > #wrapper > .logo img{width: 100%;}

header > #wrapper > .menu{ position: relative; width:64%; height: 70px; float:left; display: block; text-align: center;  }
header > #wrapper > .menu ul{list-style: none;margin: 30px auto;}
header > #wrapper > .menu ul li{ position: relative; display: inline-block; margin: 0 -2px; z-index: 2; } 

header > #wrapper > .menu ul li a{position: relative;width: 100%;height: 30px;line-height: 30px; font-family: 'Open Sans', sans-serif;font-size: 18px;font-weight: 400;padding-right: 20px;padding-left: 20px;color: #fff;text-decoration: none;/* padding: 0px 5px; */display: block;} 
header > #wrapper > .menu ul li a:hover{ background: none;  color:#f20f0f; border-radius: none; }
header > #wrapper > .menu ul li ul{position: absolute;visibility: hidden;width: 250px;left: 0;top: 100px;background: #f20f0f;box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.1);padding: 15px;box-sizing: border-box;border-radius: none;transition:all 0.2s ease-in;}
header > #wrapper > .menu ul li ul li{position: relative;width: 100%;height: auto;display: block;border-right: none;margin: 0;text-align: left;}
header > #wrapper > .menu ul li ul li a{ width: 100%; height: auto; font-size: 14px; font-weight: 400; line-height:20px; padding: 5px; box-sizing: border-box; text-align: left;  background: none; display: block; color: aliceblue; border-radius: none; } 
header > #wrapper > .menu ul li ul li a:hover{ background: rgba(255,255,255,1.00); color: rgba(0,0,0,1.00); }
header > #wrapper > .menu li:hover > ul{top: 0px;visibility: visible;transition:all 0.2s ease-in;}
header > #wrapper > .menu li:hover > a{ background:none; color:#f20f0f; border-radius: none; }
header > #wrapper > .logo2 {position: relative;width: 18%;float: right;display: block;top: 17px;}
header > #wrapper > .logo2 a{ font-family: 'Open Sans', sans-serif;font-size: 24px;font-weight: 600; color: #fff; float: right;}
header > #wrapper > .logo2 a span{font-size: 16px; font-weight: 400;}

#ana-ikonluk{position: relative; display: block; width: 100%;}
#ikon{position: relative; display: block; width: 25%; padding: 20px 0px; float: left; background: rgb(248,161,31);
  background: linear-gradient(0deg, rgba(248,161,31,1) 0%, rgba(194,126,24,1) 100%); cursor: pointer;}
#ikon-title{font-size:20px; text-align: center; font-weight:700; color: #fff;  font-family: 'Open Sans', sans-serif;}
#ikon img{padding-right: 20px;}

#ikon2{position: relative; display: block; width: 25%; padding: 20px 0px; float: left; background: rgb(40,179,87);
  background: linear-gradient(0deg, rgba(40,179,87,1) 0%, rgba(31,140,67,1) 100%); cursor: pointer;}
#ikon2 img{padding-right: 20px;}

#ikon3{position: relative; display: block; width: 25%; padding: 20px 0px; float: left; background: rgb(17,123,185);
  background: linear-gradient(0deg, rgba(17,123,185,1) 0%, rgba(13,96,144,1) 100%);cursor: pointer;}
#ikon3 img{padding-right: 20px;}

#ikon4{position: relative; display: block; width: 25%; padding: 20px 0px; float: left; background: rgb(8,18,88);
  background: linear-gradient(0deg, rgba(8,18,88,1) 0%, rgba(6,14,69,1) 100%);cursor: pointer;}
#ikon4 img{padding-right: 20px;}

#ana-hakkimizda{position: relative; display: block; width: 100%; background: url(/static/img/hak-bg.png)center no-repeat; height: 511px;}
#title{font-size:24px; font-weight:600; color: #000; font-family: 'Open Sans', sans-serif;}
.text{font-size:16px; font-weight:500; color: #848484; font-family: 'Open Sans', sans-serif;}
.buton{font-size:16px; font-weight:500; color: #848484; font-family: 'Open Sans', sans-serif; color: #fff; background: #f20f0f; padding: 10px 25px;}
.buton:hover{background: #000; color: #fff;}

#tir{position: absolute; float: right; right: -30px; top: 50px; transition:all 0.2s ease-in; cursor: pointer;}
#tir:hover{right: 0px;}
#ana-blog{position: relative; display: block; width: 100%; background: url(/static/img/blog-bg.jpg)center no-repeat; height: 271px;}

#yarim3 #title{font-size:30px; font-weight:500; color: #fff; font-family: 'Open Sans', sans-serif; margin-top: 80px;}
#yarim3 #title span{font-weight: 700;}

#alt-title{position: absolute; z-index: 9;}

#ana-urun:hover #title2{bottom:20%;}
#ana-urun:hover #title3{bottom: 20%;}
#tam:hover #title4{bottom: 20%;}

#tam{position: relative; display: block; width: 100%;}


#logo-icon{ position:relative; display: block; margin: 0px auto; top: 15px; z-index: 99999;}


  
#page-title{ position:relative; width:100%; height:auto; background:url(/img/banalt.jpg) no-repeat center; padding:80px; margin-top:-5px; }
#page-title span{background:#008fff; color:#fff; padding:5px;}

#page-title span { font-size: 30px; background: #008fff; color: #fff; padding: 10px 10px 10px 0; margin: 0; position: relative; }
#page-title span:after { background: #008fff; height: 100%; width: 300%; position: absolute; left: -300%; top: 0; content: ''; }
#takip{ position:relative; float:left; text-align:right;font-family: 'Open Sans', sans-serif; font-size:13px; font-weight:600; color:#fff; margin-top:10px;}
#takip a{font-family: 'Open Sans', sans-serif; font-size:13px; font-weight:600; color:#fff; }
#takip a:hover{ color:#333; }


#hamburger{position: absolute; display: block; top:12px; right: 0px; }

 #hamburger svg {
    fill: #fff;
    width: 40px;
    height: 40px;
  }
  
  #mmenu {
    font-family: 'Open Sans', sans-serif;
    display: block;
    height: 110vh;
    left: -300px;
    background-color: #f20f0f;
    color: #fff;
    position: fixed;
    top: 0;
    z-index: 2;
    width: 300px;
    -webkit-transition: all 0.122s ease-in-out;
    transition: all 0.122s ease-in-out;
  }
  
  #mmenu > ul {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    margin: 0;
    padding: 0;
  }
  
  #mmenu > ul > li {
    height: auto;
    display: block;
    width: 100%;
    margin-top: 5px;
  }
  
  #mmenu > ul > li a {
    height: 42px;
    font-size: 17px;
    text-decoration: none;
    color: #fff;
   font-family: 'Open Sans', sans-serif;
    display: block;
    line-height: 42px;
    font-weight: 500;
  }
  
  #mmenu > ul > li > a {
    padding-left: 15px;
  }
  
  #mmenu > ul > li:hover ul {
    max-height: 4200px;
    visibility: visible;
    opacity: 1;
  }
  
  #mmenu > ul > li > ul {
    max-height: 0;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.122s ease-in-out;
    transition: all 0.122s ease-in-out;
    list-style: none;
    padding-left: 0px;
    margin: 0;
  }
  
  #mmenu > ul > li > ul a {
    border: 1px solid #eee;
    border-left: 0;
    border-right: 0;
    padding-left: 20px;
  }
  
  #closeButton {
    padding-left: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 18px;
    border-bottom: 1px solid #fff;
    cursor: pointer;
  }
  
  .hidden {
    opacity: 0;
    visibility: hidden;
    z-index: -9999;
  }
  
  #overlay {
    content: "";
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1;
  }
  







#center-bar-product-box { width: 31%; margin-right: 2%; border:1px solid #f2f2f2;  overflow: hidden; margin-bottom:20px;overflow: hidden; float:left; background-color:#fff;  padding:0px 0px;transition:all .2s ease; font-family: 'Open Sans', sans-serif; transition:all 0.2s ease-in; }
#center-bar-product-box img { text-align:center; width:100%; border-top-left-radius:0px;border-top-right-radius:0px; transition:all 0.2s ease-in; }
#center-bar-product-box:hover img {-webkit-transform: scale(1.05); transform: scale(1.05);}
#center-bar-product-box h5 {text-align: left;font-family: 'Open Sans', sans-serif;  font-size:20px;  margin:0px; padding:15px 10px; color:#3f3f3f!important;  font-weight:500;}






#banner{ width:100%;   position: relative;  box-sizing:border-box;  }
#wrapper{ position:relative; width:1200px; height:auto; margin:0 auto; }
#dortlu{position: relative; display: block; overflow: hidden;transition:all 0.2s ease-in; width: 23%; float: left; margin:1%;  }
#dortlu:hover{ transform: scale(1.05); cursor:pointer;}






#page-left{position: relative; display: block; width: 20%; float: left; margin-right: 2%; } 

#page-right{position: relative; display: block; width: 78%; float: right; border-left: 1px solid #f2f2f2; padding-left: 30px; } 
#page-right2{position: relative; display: block; width: 75%; float: left; margin-right: 2%; } 

#page-left ul{  font-family: 'Open Sans', sans-serif; list-style:none; padding:0; margin:0;   }
#page-left ul li a{position:relative;color: #a8a8a8;transition:all 0.2s ease-in; border-bottom: 1px solid #f2f2f2; font-size: 16px;line-height:24px;padding: 15px 20px;font-weight:500;display:block; font-family: 'Open Sans', sans-serif;}
#page-left ul li a i{padding-right: 10px; color:#ea0b1a ;}
#page-left ul li a:hover{ color:#000; transition:all 0.2s ease-in; padding-left:10px;}

#urun-detay{position: relative; display: block; width: 100%; background: #fff; box-shadow: 0 2px 24px 0 rgba(40, 44, 43, 0.1); padding: 40px; text-align: left;}
#urun-detay #title{text-align: left; font-size: 21px;}




#yarim1{ width:49%; float:left; margin-bottom:5px; box-sizing: border-box;}
#yarim2{ width:49%; float:right; margin-bottom:5px; box-sizing: border-box;}

#yarim3{ width:10%; float:left; margin-bottom:5px; box-sizing: border-box;}
#yarim4{ width:80%; float:right; margin-bottom:5px; box-sizing: border-box;}

#kapa{display: block;}
#acil{ display:none; }

footer{ height:auto; width:100%; margin:0px auto; background:#eeeeee; padding:40px 0px 15px 0px; z-index:2;}
footer .bir{ position:relative; float:left; width:20%; margin-right:15%; height:auto; display:block; text-align: center; }
footer .iki{ position:relative; float:left; width:18%; height:auto; display:block; }
footer .uc{ position:relative; float:left; width:20%; height:auto; display:block; }
footer .dort{ position:relative; float:right; width:25%; height:auto; display:block; text-align:left; }
footer .bes{ position:relative; float:left; width:75%; height:auto; line-height:50px; display:block; text-align:left;  }
footer .alti{ position:relative; float:left; width:25%; height:auto; display:block; text-align:right;  }
footer .link{ position:relative; float:left; width:100%; height:auto; display:block; font-family: 'Open Sans', sans-serif;  color:#000; font-size:17px; line-height:30px; font-weight:400; transition:all 0.2s ease-in;  }
footer .link:hover{ border-left:2px solid #f20f0f; color:#000; padding-left:10px; border-radius:5px; }
footer .baslik1{ position:relative; width:auto; height:auto; display:inline-block; font-family: 'Open Sans', sans-serif;   font-size:21px; color:#000; font-weight:500; line-height:40px; border-bottom:4px solid #f20f0f; padding-bottom:10px; margin-bottom:20px; text-align:right; }
footer .sosyal{ width:auto; height:auto; margin-left:5px; display:inline-block; transition:all 1s ease-in; }
footer .sosyal:hover{ transform: rotate(-360deg);  }
footer .copy{ position:relative; margin:0 auto; width:60%; height:auto; display:block; font-family: 'Open Sans', sans-serif;   font-size:17px; color:#000; line-height:20px; text-align:center; }
.footer-yazi{ font-family: 'Open Sans', sans-serif;  color:#000; font-size:14px; line-height:24px; font-weight:500; }
footer .line{ width:100%; height:1px; background:#666; position:relative; display:block; margin:20px auto;}
footer .phone-alan{position:relative; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%;}
footer .phone{position:relative; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background: #f20f0f; border: 1px dashed #f20f0f; color: #fff; width: 40px; height: 40px; line-height: 30px; text-align: center; border-radius: 5px; transition:all 0.2s ease-in; float: left;}
footer .phone{max-width: 100%}
footer .phone-alan:hover .phone{background: #f20f0f;}
footer .phone-alan p{padding-left: 55px; padding-top:6px; font-size: 17px; font-weight:300; cursor: pointer;}



.asd{position: relative; display: block; color: #fff; font-size: 18px; font-weight: 600; background:#2088ca; padding:10px;}
#sol{float: left;}
#sag{float: right;}

@media only screen and (max-width: 1600px) { 
  #tir{right: -100px;}
}

@media only screen and (max-width: 1000px) { 

header > #wrapper > .menu{display: none;}
#menu-yan{display: none;}
#uclu{width: 100%;}
#banner{padding-top: 0px;}

#takip{width: 100%;}
#page-left{width: 100%;}
#page-right{width: 100%;}
#dortlu{width: 45%; text-align: center;}
#urunler{width: 48%;}
#urunler img{width: 100%;}
#urunn{text-align: center; margin-bottom: 20px;}
header > #wrapper > .logo{width: 100%;text-align: left;margin: 0px auto;top: 12px;float: none;}
header > #wrapper > .logo img{width: auto;}
header > #wrapper > .logo2{display: none;}
#ikon{width: 100%;}
#ikon2{width: 100%;}
#ikon3{width: 100%;}
#ikon4{width: 100%;}
#ana-hakkimizda{background: none; height: auto;}
#tir{display: none;}


footer{ height:auto; width:100%; margin:0px auto; background:#eee; padding:80px 0px 80px 0px; z-index:2;}
footer .bir{ position:relative; float:left; width:100%; height:auto; display:block; text-align:center; border-bottom:1px solid #666; margin-bottom:30px; }
footer .iki{ display: none;}
footer .uc{ display: none; }
footer .dort{ position:relative; float:left; width:100%; height:auto; display:block; text-align: center;  }
footer .bes{ position:relative; float:left; width:100%; height:auto; line-height:50px; display:block; text-align:center;  }
footer .alti{ position:relative; float:left; width:100%; height:auto; display:block; text-align:center;  }
footer .sosyal{ width:auto; height:auto; margin-left:5px;display:inline-block; transition:all 1s ease-in; }

#ust{display: none;}

#page-header h1{width:auto;}
#page-right2{width:100%;}

#acil{ display:block; }
#kapa{ display:none !important; visibility:hidden;}

#wrapper{ position:relative; width:95%; height:auto; margin:0 auto; }

#yarim1{ width:100%; float:none; margin-bottom:10px;  margin-right:0px;}
#yarim2{ width:100%; float:none; margin-bottom:10px;  margin-right:0px;}
#yarim3{ width:100%; float:none; margin-bottom:10px;  margin-right:0px;}
#yarim4{ width:100%; float:none; margin-bottom:10px;  margin-right:0px;}
#yarim3 #title{margin-top: 0px;}
#center-bar-product-box{width: 48%;}


}

@media only screen and (max-width: 600px) { 
    #urunler{width: 100%;}
    #dortlu{width: 100%; text-align: center;}
    #center-bar-product-box{width: 100%;}

}

footer #wrapper > div.bir:first-child > a {
  color: #000;
}

footer {
  position: relative;
}

footer .neturk {
  display: block;
  position: absolute;
  right: 10px; bottom: 10px;
}

@media (max-width: 1000px) {
  footer .neturk {
      display: block;
      margin: 0 auto;
      margin-top: 30px;
      position: static;
  }
}