body, html{
width: 100%;
height: 100%;
}

body{
margin:0 auto;
padding:0;
font-family: 'Titillium Web', sans-serif;
font-size:14px;
height:100%
}

.tp-leftarrow{display:none;} .tp-rightarrow{display:none;}

.sticky{
position:fixed;
width:100%;
z-index:9999;
}

.sticky .logo{
padding-right:80px;
}

.sticky .logo img{
width:100px;
}

.sticky .menu li a{
padding-bottom:15px;
padding-top:20px;
}

.sticky .diller{
padding-top:2px;
}

.sticky .sosyal{
padding-top:21px;
}

.sticky .menu li li a{
padding:0
}
#header{
background: linear-gradient(40deg,#343434, #343434, #343434);

}

.header{
overflow:hidden;
width:1100px;
margin:0 auto;
}

.logo{
overflow:hidden;
float:left;
padding:10px 0;
}

.menu{
float:left;
overflow:hidden;
}

.menu ul{
margin:0 auto;
list-style:none;
padding:0;
padding-left:30px;
}

.menu li{
float:left;
color:#eee;
font-weight:600;
cursor:pointer;
}

.menu li:hover{
background: linear-gradient(49deg,#666, #343434);
}

.menu li a{
display:block;
padding:34px 5px;
color:#ccc;
text-decoration:none;
}

.menu li a:hover{
color:#fff;
transition: 0.8s;
}

.menu ul ul{
display:none;
margin:0 auto;
padding:0;
border-top:2px solid #ff6203;
}

.menu ul li:hover ul{
display:block;
position:absolute;
z-index:9!important;
}

.menu li li{
float:none;
background:#333;
padding:10px 20px;
font-weight:normal;
width:180px;
border-bottom:1px solid #282828;
}

.menu li li i{
float:right;
display:block;
padding:5px 0 0 0
}

.menu li li a{
padding:0;
border:none;
}

.menu li li a:hover{
border:none;
}

.sonmenu{
display:none;
margin:0 auto;
padding:0;
margin-left:200px;
margin-top:-31px;
position:absolute;
background:#343434;
width:220px;
overflow:hidden;
box-shadow: 6px 3px 13px -5px rgba(0,0,0,0.54);
}

.menu ul li ul li:hover .sonmenu{
display:block;
}

.sonmenu b{
display:block;
font-weight:normal;
padding:10px 20px;
border-bottom:1px solid #282828
}

.sonmenu em{
padding-right:5px;
}

.menu b:hover{
background: linear-gradient(49deg,#666, #343434);
}

.diller{
overflow:hidden;
float:left;
padding:14px 0 0 5px;
}

.diller span{
display:block;
float:left;
padding:0 5px 0 5px;
}

.diller span img{
border-radius:10px;
}

.diller em{
display:block;
color:#999;
font-style:normal;
text-align:center;
padding-bottom:5px;
font-size:12px;
}

.diller em:before{
	content:'Dil Seciniz';
	color: black;
	animation: yazi infinite 10s;
	color:#999;
}
@keyframes yazi{
	0%{content:'Dil Seciniz';}
	25%{content:'Select Language';}
	50%{content:'Seleccione el idioma';}
	75%{content:'Select Language';}
	100%{content:'Dil Seciniz';}
}

.sosyal{
float:left;
color:#fff;
padding:33px 0 0 15px;
}

.sosyal i{
padding:0 3px;
}

.shadow {
background: url(../images/shadow.png);
height: 30px;
width: 100%;
background-position: center bottom;
background-repeat: no-repeat;
}

#slayt{
position:relative;
width:100%;
overflow:hidden;
z-index:1;
object-fit: cover;
margin:0 auto;
}

/* Slideshow container */
.slideshow-container {
  position: relative;
  margin: auto;
}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

#content{
overflow:hidden;
min-height:400px;
}

.giris{
overflow:hidden;
text-align:center;
font-size:25px;
font-weight:700;
letter-spacing:1px;
}

.giris em{
display:block;
font-size:12px;
font-weight:normal;
font-style:normal;
margin-top:-7px;
letter-spacing:2px;
}

.giris span{
display:block;
height:1px;
background:#ff6203;
width:80px;
margin:0 auto;
margin-top:5px;
}

.anakutu{
overflow:hidden;
width:1100px;
margin:0 auto;
padding:20px 0 0 0
}

.anakutu{
width:1100px;
margin:0 auto;
overflow:hidden;
}

.anakutu ul{
margin:0 auto;
list-style:none;
padding:0;
}

.anakutu li{
float:left;
width:31%;
text-align:center;
margin:1%;
padding:30px 0 0 0;
box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.20);
border-radius:5px;
cursor:pointer;
min-height:380px;
}

.anakutu li h1{
margin:0 auto;
padding:0;
font-size:21px;
color:#343434;
margin-bottom:10px;
margin-top:10px;
}

.anakutu li:hover{
box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.30);
transition: 0.4s;
}

.listeadi{
text-align:center;
padding:5px 0 5px 5px;
border-bottom:1px dashed #ddd;
font-size:14px;
}

.anakutu li:hover h1{
color:#ff6203;
transition: 0.4s;
}

.listeadi:last-child{
border:none;
}

.listeadi a{
color:#343434;
text-decoration:none;
}

.listeadi a:hover{
color:#ff6203;
transition: 0.4s;
}

.ustserit{
background: linear-gradient(40deg,#e34735, #7c1212, #e34735);
padding:10px;
background-size:cover;
background-position:center center;
text-align:center;
margin-top:40px;
font-size:21px;
color:#fff;
font-weight:700;
}

#serit{
overflow:hidden;
min-height:50px;
background: linear-gradient(40deg,#313a43, #888, #313a43);
color:#fff;
}

.serit{
width:1100px;
margin:0 auto;
overflow:hidden;
}

.serit ul{
margin:0 auto;
list-style:none;
padding:0;
}

.serit li{
float:left;
width:33.33333%;
}

.serit li span{
display:block;
font-size:70px;
font-weight:700;
float:left;
padding-right:10px;
}

.serit li em{
display:block;
padding-top:28px;
font-size:21px;
font-style:normal;
color:#ccc;
}

.serit li b{
font-size:20px;
margin-top:-5px;
display:block;
color:#ccc;
}

.serit li sup{
font-size:26px;
margin-top:10px;
display:block;
float:right;
}

.harita{
overflow:hidden;
text-align:center;
width:1100px;
margin:0 auto;
}

#anakatalog{
overflow:hidden;
min-height:460px;
background: linear-gradient(40deg,#313a43, #888, #313a43);
}

.anakatalog{
width:1100px;
margin:0 auto;
overflow:hidden;
}

.anasol{
width:500px;
float:left;
overflow:hidden;
padding:150px 0 0 0;
text-align:right;
color:#fff;
}

.anasag{
float:left;
overflow:hidden;
width:270px;
padding:50px 0 0 0;
margin-left:20px;
}

.anasag img{
border-radius:10px;
width:100%;
background:#fff;
box-shadow: 6px 3px 13px -5px rgba(0,0,0,0.54);
}

.anasol h1{
margin:0 auto;
padding:0;
}

.anasol h1 span{
display:block;
font-size:12px;
font-weight:normal;
}

.indir{
margin-top:30px;
padding:20px 50px;
border:2px solid #fff;
width:140px;
float:right;
background:#242424;
}

.indir:hover{
background:#343434;
cursor:pointer;
}

.carousel {
overflow:hidden;
}

.carousel-cell {
  width: 250px;
  height: 145px;
  margin-right: 20px;
  border-radius: 5px;
  text-align:center;
}

.carousel-cell img{
width:200px!important;
border-radius:10px;
filter: grayscale(100%);
}

.carousel-cell img:hover{
filter: grayscale(0%);
}

.carousel-cell span{
display:block;
text-align:center;
font-size:12px;
vertical-align:middle;
padding:10px 0 0 0;
}

#kayar{
width:1100px;
margin:0 auto;
padding:30px 0;
}

#kayar h1{
margin:0 auto;
padding:0;
padding-bottom:20px;
font-size:21px;
text-align:center;
color:#999;
}

#footer{
overflow:hidden;
min-height:150px;
background-color:#343434;
background-image:url(../images/footer.jpg);
background-position:bottom right;
background-repeat:no-repeat;
}

.footer{
width:1100px;
margin:0 auto;
overflow:hidden;
}

.footer ul{
margin:0 auto;
padding:0;
list-style:none;
overflow:hidden;
float:left;
}

.footer li{
color:#eee;
overflow:hidden;
padding:10px 0;
width:300px;
}

.footer li i{
display:block;
float:left;
font-size:20px;
padding-right:10px;
height:30px;
}

.footer li:first-child i{
padding-top:10px;
}

.footer h1{
color:#eee;
margin:0 auto;
padding:0;
padding-top:20px;
padding-bottom:10px;
font-size:21px;
}

.f1{
float:left;
overflow:hidden;
padding:0px 0 0 100px;
}

.f1 img{
width:300px;
padding-top:40px;
}

.mobil{
display:none;
}

/*ÜRÜNLER*/
#bread{
background:#eee;
}

.bread{
overflow:hidden;
width:1100px;
margin:0 auto;
font-size:21px;
padding:30px 0;
font-weight:700;
color:#333
}

.urunler{
overflow:hidden;
width:1100px;
margin:0 auto;
padding:20px 0 20px 0;
}

.urunler ul{
margin:0 auto;
list-style:none;
padding:0;
}

.urunler li{
float:left;
object-fit: cover;
width:46%;
margin:2% 1%;
background:#f9f9f9;
border-bottom-right-radius:5px;
border-bottom-left-radius:5px;
min-height:410px
}

.golge{
box-shadow: 0px 8px 18px -8px rgba(0,0,0,0.18);
}

.urunler li span{
display:block;
float:left;
width:76%;
padding:5px 2%;
font-size:17px;
font-weight:700;
min-height:60px;
}

.urunler li em{
display:block;
width:16%;
padding:5px 2%;
float:right;
text-align:right;
}

.urunler li img:hover{
opacity:0.5;
cursor:pointer;
}

.urunler li:hover{
background:#343434;
color:#fff;
}

/*YAZILAR*/
.yazilar{
width:1100px;
margin:0 auto;
overflow:hidden;
}

.kutus{
overflow:hidden;
padding:20px 0
}

.birs{
width:49%;
overflow:hidden;
font-size:16px;
line-height:1.5rem;
color:#333;
}

.ikis{
width:45%;
overflow:hidden;
padding-top:70px;
}

.ikis img{
width:90%;
}

.flsol{
float:left;
}

.flsag{
float:right;
}

.kutus h1{
margin:0;
padding:20px 0 15px 0;
border-bottom:1px solid #eee;
}

.birs ul{
margin:0 auto;
padding:0;
list-style:none;
padding:20px 0 0 0;
}

.birs li{
padding:10px;
color:#333;
}

#kayar a{
color:#666;
text-decoration:none;
}

.sosyal a{
color:#fff;
text-decoration:none
}