#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;} 
.menu ul a form{float:left;}
body{margin:0px;text-align: left;padding:0;overflow-x: hidden; font-family: cursive;font-weight:300; font-size:15px; color:#959595; line-height:25px;}
#wrapper{ position:relative; width: 1200px; margin: 0 auto; }
header{ position: relative;; width: 100%; height: auto;   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;background: linear-gradient(90deg, #fff 24%, #009fe3 82%, #00364e 98%);}

header > #wrapper > #ust > .logo { position: relative; width:11%; float: left; display: block; padding-left: 10px;   }
header > #wrapper > #ust > .logo img{width: 100%;}
header > #wrapper > #ust > .menu{position: relative;height: 70px;float:right;display: block;text-align: center;top:15%}
header > #wrapper > #ust > .menu ul{list-style: none;margin: 20px auto;}
header > #wrapper > #ust > .menu ul li{ position: relative; display: inline-block; margin: 0 -2px; z-index: 2; } 
header > #wrapper > #ust > .menu ul li a{position: relative;width: 100%;height: 30px;line-height: 30px; font-family: roboto;font-size: 16px;font-weight: 500;padding-right: 20px;padding-left: 10px;color: #000;text-decoration: none;/* padding: 0px 5px; */display: block;} 


header > #wrapper > #ust > .menu ul li a::after {
  content: "";
  position: absolute;
  display: block;
  height: 4px;
  width: 0%;
  background-color: #00a0e3;
  transition: all ease-in-out 250ms;
}

header > #wrapper > #ust > .menu ul li :hover::after {
  width:80%;
}

.phone-ikincialan > a{
  margin-right: 10px;
}

.dil{right: 40px; position: fixed; bottom: 5%;z-index: 9999; }
    .buton-iletisim{cursor: pointer;border-radius: 100%;background: #000000;position: relative;height: 70px;width: 70px;text-align: center;line-height: 70px;display: block;}
    .buton-iletisim i{color: #fff; font-size: 24px;}
    .yan{position: absolute;right: 70px; border-radius: 5px; color: #fff;top: 15px;line-height: 35px;background: #895a9c;width: 150px;}
    .yan2{position: absolute;top: 20px;border-radius: 5px;right: 80px;width: 150px;color: #ffffff;background: #00a0e3;line-height: 35px;font-weight: 400;}
    .buton-iletisim:hover .yan2{background: #000;}
    .dil-alt a:hover .yan{background: #000;}
    .dil-alt a{border-radius: 100%; background:#895a9c; height: 60px; width: 60px; line-height: 65px; position: relative; display: block; text-align: center; margin-bottom: 20px;}
    .dil-alt a i{color: #fff; font-size: 24px;}
    .dil-alt{position: relative; }
   


header > #wrapper > #ust > .menu ul li ul{position: absolute;visibility: hidden;width: 250px;left: 0;top: 100px;background: #372e87;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 > #ust > .menu ul li ul li{position: relative;width: 100%;height: auto;display: block;border-right: none;margin: 0;text-align: left;}
header > #wrapper > #ust > .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 > #ust > .menu ul li ul li a:hover{ background: rgba(255,255,255,1.00); color: rgba(0,0,0,1.00); }
header > #wrapper >  #ust > .menu li:hover > ul{top: 10px;visibility: visible;transition:all 0.2s ease-in;}
header > #wrapper > #ust > .menu li:hover > a{ background:none; border-radius: none; }

#sag2{position: relative; display: block; text-align: center; float: right;  margin: 31px auto;}
#sag2 a{float: left; margin-right:30px; font-size:16px; font-weight: 500; color: #000;}
#sag2 a img{padding-right: 20px;}



#logoMarqueeSection {
  max-width: 1920px!important;
  margin: 0 auto;
}

.default-content-container {
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 5rem;
    padding-right: 5rem;
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
    width: 100%;
    min-height: 100vh;
}

div.marquee>a>img {
  height: 90px;
}

.logoMarqueeSection>div>div {
    padding-top: 0;
    padding-bottom: 0;
    min-height: 0;
}

.marquee-wrapper {
  display:  inline-block;
  white-space: nowrap;
}

.marquee {
    display:  inline-block;
    white-space: nowrap;
    position: relative;
    transform: translate3d(0%, 0, 0);
    animation-name: marquee;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

.marquee a {
    display:  inline-block;
    white-space: nowrap;
    padding-right: 5.4rem;
}

.marquee-wrapper:hover .marquee {
    animation-play-state: paused !important;
}

@keyframes marquee {
    0% {
        transform: translate3d(0%, 0, 0);
    }

    100% {
        transform: translate3d(-100%, 0, 0);
    }
}


#iletisim{position: relative;display: block;font-size: 24px;font-weight: 600;background:#00a0e3;color: #fff;text-align: center;float: right;width: 50px;margin-left: 5px;height:105px;line-height: 105px;}
#iletisim img{padding-right: 20px;}
#ust{position: relative; display: block; width: 100%; height: 105px;}
#alt{position: relative; display: block; width: 100%; background: #194181;}

#dil{float: right; color: #fff; font-size: 16px; font-weight: 500; line-height: 70px; height: 70px; padding-right: 10px; }

#ana-hakkimizda{position: relative; display: block; width: 100%; background: url(/img/hak-bg.jpg) center no-repeat; height: 600px; }
#title{font-family: cursive; font-size: 24px; color: #000; font-weight: 500;  }
.yazi{font-family: cursive; font-size:16px; color: #848484; font-weight: 400;  }
.buton{font-family: cursive; font-size:18px; color: #fff; font-weight: 400; background: #009fe3; padding: 10px 30px;transition:all 0.2s ease-in;}
.buton:hover{background: #000; color: #fff;}
#ana-hakkimizda #wrapper #yarim1 .yazi{line-height: 26px;}
#urunler{position: relative; display: block; width: 100%; background: url(/img/urunler.jpg)center no-repeat; padding-top: 40px;transition:all 0.2s ease-in;
  height: 118px; font-family: cursive; font-size:30px; color: #fff; font-weight: 700; text-align: center;}
#urunler:hover{ font-size: 32px; transition:all 0.2s ease-in;}

#markalar{position: relative; display: block; width: 100%; background:#f7f7f7; text-align: center;}

#duyurular{position: relative; display:block; width:100%;  text-align: center; }
#duyurular #title{color: #000; padding: 20px;}


#page-title{ position:relative; width:100%; height:auto; background:#00a0e3; padding:30px; margin-top:-5px; text-align: center;}
#page-title span { font-size: 30px; color: #000; font-weight: 600; margin: 0; position: relative; font-family: cursive;}
#takip{ position:relative; text-align:center;font-family: cursive; font-size:13px; font-weight:600; color:#fff; margin-top:10px;}
#takip a{font-family: cursive; font-size:13px; font-weight:600; color:#fff; }
#takip a:hover{ color:#333; }


#hamburger{position: absolute; display: block; top:12px; right: 0px; }

 #hamburger svg {
    stroke: #000;
    width: 40px;
    height: 40px;
  }
  
  #mmenu {
    font-family: cursive;
    display: block;
    height: 110vh;
    left: -300px;
    background-color: #372e87;
    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: cursive;
    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: cursive; transition:all 0.2s ease-in; }
#center-bar-product-box img {height: 350px; 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 {height: 90px;text-align: left;font-family: cursive;  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; }
#wrapper2{ 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: cursive; list-style:none; padding:0; margin:0;   }
#page-left ul li a{position:relative;color: #3c5930;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: cursive;}
#page-left ul li a i{padding-right: 10px; color:#000 ;}
#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:87%; float:left; margin-bottom:5px; box-sizing: border-box;}
#yarim4{ width:10%; float:right; margin-bottom:5px; box-sizing: border-box;}
#yarim5{ width:81%; float: right; margin-bottom:5px; box-sizing: border-box;}
#yarim6{ width:10%; float:left; margin-bottom:5px; box-sizing: border-box;}

#kapa{display: block;}
#acil{ display:none; }


#ana{ position: relative; width: 100%; box-sizing: border-box;}


#iletisim-bar{ display: block; position: relative; box-sizing: border-box; width: 100%;  background: #009fe3; padding: 20px; color: #FFFFFF;}
#iletisim-bar > #wrapper2 > .bir{ position:relative; float:left; width:21%; margin: 0.5%; height:auto; display:block; border-right: 1px solid #FFFFFF;}
#iletisim-bar > #wrapper2 > .bir > .yarim1{ position:relative; float:left; width:14%; margin: 0.5%; height:auto; display:block; text-align: center;}
#iletisim-bar > #wrapper2 > .bir > .yarim1 i{ font-size: 32px; }
#iletisim-bar > #wrapper2 > .bir > .yarim2{ position:relative; float:left; width:84%; margin: 0.5%; height:auto; display:block; text-align: left; padding-left: 15px;}

#iletisim-bar > #wrapper2 > .iki{ position:relative; float:left; width:21%; height:auto; margin: 0.5%; display:block;  border-right: 1px solid #FFFFFF; }
#iletisim-bar > #wrapper2 > .iki > .yarim1{ position:relative; float:left; width:20%; margin: 0.5%; height:auto; display:block; padding-left: 15px; text-align: right;}
#iletisim-bar > #wrapper2 > .iki > .yarim1 i{ font-size: 28px; padding-top: 5px; }
#iletisim-bar > #wrapper2 > .iki > .yarim2{ position:relative; float:left; width:74%; margin: 0.5%; height:auto; display:block; padding-left: 15px;  text-align: left;}

#iletisim-bar > #wrapper2 > .uc{ position:relative; float:left; width:21%; height:auto; margin: 0.5%; display:block; border-right: 1px solid #FFFFFF;}
#iletisim-bar > #wrapper2 > .uc > .yarim1{ position:relative; float:left; width:20%; margin: 0.5%; height:auto; display:block; padding-left: 15px; text-align: right;}
#iletisim-bar > #wrapper2 > .uc > .yarim1 i{ font-size: 32px; }
#iletisim-bar > #wrapper2 > .uc > .yarim2{ position:relative; float:left; width:74%; margin: 0.5%; height:auto; display:block; padding-left: 15px;  text-align: left; padding-top: 8px;}

#iletisim-bar > #wrapper2 > .dort{ position:relative; float:left; width:20%; height:auto; margin: 0.5%; display:block;   border-right: 1px solid #fff;}
#iletisim-bar > #wrapper2 > .dort > .yarim1{ position:relative; float:left; width:14%; margin: 0.5%; height:auto; display:block; text-align: center;}
#iletisim-bar > #wrapper2 > .dort > .yarim1 i{ font-size: 32px; }
#iletisim-bar > #wrapper2 > .dort > .yarim2{ position:relative; float:left; width:84%; margin: 0.5%; height:auto; display:block; text-align: left; padding-left: 15px; padding-top: 8px;}

#iletisim-bar > #wrapper2 > .bes{ position:relative; float:right; width:10%; height:auto; margin: 0.5%; display:block; }


footer{ height:auto; width:100%; margin:0px auto;  padding:10px 0px 10px 0px; z-index:2;background: linear-gradient(90deg, #fff 24%, #009fe3 82%, #00364e 98%)}
footer .bir{ position:relative; float:left; width:27%; height:auto; display:block; }
footer .iki{ position:relative; float:left; width:23%; height:auto; display:block; }
footer .uc{ position:relative; float:left; width:23%; height:auto; display:block; }
footer .dort{ position:relative; float:left; width:27%; height:auto; display:block;  }
footer .bes{ color: #000; position:relative; float:left; width:75%; height:auto; font-size: 12px; display:block; text-align:left; font-weight: 300; }
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: 'Montserrat', sans-serif;  color:#a9a9a9; font-size:15px; line-height:30px; font-weight:500; transition:all 0.2s ease-in;  }
footer .link:hover{ border-left:2px solid #f66000; color:#fff; padding-left:10px; border-radius:5px; }
footer .baslik1{ position:relative; width:auto; height:auto; display:inline-block; font-family: 'Montserrat', sans-serif;   font-size:19px; color:#fff; font-weight:700; line-height:40px; border-bottom:4px solid #f66000; padding-bottom:20px; margin-bottom:20px; text-align:right; }
footer .sosyal{ width:auto; height:auto; margin-left:5px; float:left; 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: 'Montserrat', sans-serif;   font-size:14px; color:#dedede; line-height:20px; text-align:center; }
.footer-yazi{ font-family: 'Montserrat', sans-serif;  color:#000000; font-size:14px; line-height:24px; font-weight:600; }
footer .line{ width:100%; height:1px; background:#666; position:relative; display:block; margin:20px auto;}
#ebultentxt{width:75%; height:60px; background:#464646; line-height:60px; padding-left:10px; box-sizing:border-box; border:0px; border-top-left-radius:5px;border-bottom-left-radius:5px; }
#ebultengonder{border:0px; background:#464646; width:25%; float:right; box-sizing:border-box; text-align:center; color:#FFF; line-height:58px; font-family: 'Montserrat', sans-serif;  font-size:24px; color:#fff; font-weight:700; cursor:pointer; border-top-right-radius:5px; border-bottom-right-radius:5px;}
#ebultengonder:hover{ background:#f66000; }


.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: 1000px) { 

#alt{display: none;}
#sag2{display: none;}
#iletisim{display: none;}
#ust{background: none; height: auto;}
header > #wrapper > #ust > .logo{width: 25%;}
header{position: relative;}
#ana-hakkimizda{background: none; height: auto;}
#markalar a{width: 30%;}
header > #wrapper > #ust > .menu{display: none;}
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: 0px;float: none;}
header > #wrapper > .logo img{width: auto;}

#tel{float: left; font-family: cursive;font-size: 16px;font-weight: 600; color: #000;  margin-top: 10px;  margin-bottom: 10px; background: #ffd226; border-radius: 5px; padding:5px 10px;} 
#dil{float: right; font-family: cursive;font-size: 18px;font-weight: 400;background: #ffd226; color: #fff; margin-top: 10px; border-radius: 5px; padding:5px 10px; } 
#ana-hakkimizda #yarim2{right: 0px; position: relative;}
#ana-hakkimizda #yarim1 img{width: 100%;}


footer{ height:auto; width:100%; margin:0px auto; 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; }

#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; }
#yarim4{ width:100%; float:none; }
#yarim5{ width:100%; float:none; }
#yarim6{ width:100%; float:none; }

#center-bar-product-box{width: 48%;}


#iletisim-bar{ display: block; position: relative; box-sizing: border-box; width: 100%;  background: #00a0e3; padding: 20px; color: #FFFFFF;}
#iletisim-bar > #wrapper2 > .bir{ position:relative; float:left; width:24%; margin: 0.5%; height:auto; display:block; border-right: 1px solid #FFFFFF;}
#iletisim-bar > #wrapper2 > .bir > .yarim1{ position:relative; float:left; width:14%; margin: 0.5%; height:auto; display:block; text-align: center;}
#iletisim-bar > #wrapper2 > .bir > .yarim1 i{ font-size: 32px; }
#iletisim-bar > #wrapper2 > .bir > .yarim2{ position:relative; float:left; width:84%; margin: 0.5%; height:auto; display:block; text-align: left;}

#iletisim-bar > #wrapper2 > .iki{ position:relative; float:left; width:24%; height:auto; margin: 0.5%; display:block;  border-right: 1px solid #FFFFFF; }
#iletisim-bar > #wrapper2 > .iki > .yarim1{ position:relative; float:left; width:24%; margin: 0.5%; height:auto; display:block; padding-left: 15px; text-align: right;}
#iletisim-bar > #wrapper2 > .iki > .yarim1 i{ font-size: 28px; padding-top: 5px; }
#iletisim-bar > #wrapper2 > .iki > .yarim2{ position:relative; float:left; width:74%; margin: 0.5%; height:auto; display:block; padding-left: 15px;  text-align: left;}

#iletisim-bar > #wrapper2 > .uc{ position:relative; float:left; width:24%; height:auto; margin: 0.5%; display:block; border-right: 1px solid #FFFFFF;}
#iletisim-bar > #wrapper2 > .uc > .yarim1{ position:relative; float:left; width:24%; margin: 0.5%; height:auto; display:block; padding-left: 15px; text-align: right;}
#iletisim-bar > #wrapper2 > .uc > .yarim1 i{ font-size: 32px; }
#iletisim-bar > #wrapper2 > .uc > .yarim2{ position:relative; float:left; width:74%; margin: 0.5%; height:auto; display:block; padding-left: 15px;  text-align: left; padding-top: 8px;}

#iletisim-bar > #wrapper2 > .dort{ position:relative; float:left; width:24%; height:auto; margin: 0.5%; display:block;  }
#iletisim-bar > #wrapper2 > .dort > .yarim1{ position:relative; float:left; width:14%; margin: 0.5%; height:auto; display:block; text-align: center;}
#iletisim-bar > #wrapper2 > .dort > .yarim1 i{ font-size: 32px; }
#iletisim-bar > #wrapper2 > .dort > .yarim2{ position:relative; float:left; width:84%; margin: 0.5%; height:auto; display:block; text-align: left;}

}

@media only screen and (max-width: 600px) { 
    #urunler{width: 100%;}
    #dortlu{width: 100%; text-align: center;}
    #center-bar-product-box{width: 100%;}

}