/* ff6600 */
/* top menu txt ff6600 */

.ustBosluk{height:0;}
.ustBoslukVideo{height:0;}

.header.scroll-active{height:3vw}
.logo.scroll-active{height:3vw}
.topmenu.scroll-active a{height:3vw;line-height:3vw;}
.topmenu.scroll-active{height:3vw}
.topmenu.scroll-active li ul{top:3vw}
.megaDiv.scroll-active{top:3vw;}
.users-nav li.scroll-active{padding:0 1.3vw 0 1.3vw;height:3vw;}
.loginDiv.scroll-active{top:3vw;}

.header{
	transition: all .5s ease;
	position:fixed;
	display:block;
	width:100%;
	height: 6vw;
    padding:0;
	z-index:9999;
	top:0;
	margin:0;
	background-color: rgba(255, 255, 255, .6);/*siyah-beyaz*/
	box-shadow: 0vw 0vw 2vw -1vw black;
    -moz-box-shadow:0vw 0vw 2vw -1vw black;
    -webkit-box-shadow:0vw 0vw 2vw -1vw black;
	backdrop-filter: blur(5px);
	-moz-backdrop-filter: blur(5px);
	vertical-align:middle;
	justify-content: center;
}
.header:hover {background-color: rgba(255, 255, 255, 1);}/*siyah-beyaz*/

.logo{
	position:absolute;
	left:2vw;
	top:.2vw;
	width:auto;
	height:6vw;
	display:block;
	border:0px solid black;
	z-index: 999;
	transition: all .5s ease;
//filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 1));
//-webkit-filter:drop-shadow(1px 1px 1px rgba(0, 0, 0, 1));
}

.logo img{width:auto;height:95%;}




.topmenu ul {
	display:none;
	margin: 0 auto;
	//margin-top:0vw; /*sağa sola yaslanırsa - genişliği belli olmayanı ortala*/
	//margin-left: 15vw; /*sağa yasla - genişliği belli olmayanı ortala. açılır sol UDA DEĞİŞTİR*/
	//margin-right: auto; /*sola yasla - genişliği belli olmayanı ortala*/
	display: table; /*genişliği belli olmayanı ortala*/
    *zoom:1; /*genişliği belli olmayanı ortala*/
    list-style:none;
    padding:0;
    background: none;
	overflow: visible;
	transition: all  .5s ease;
}
.topmenu ul li{
	font-size:.9vw;
    border-left:1px solid #fff;
	border-right:1px solid #ccc;
	font-weight: 500;
	transition: all .5s ease;
}
.topmenu ul li:first-child{border-left:none}
.topmenu ul li:last-child{border-right:none}

.topmenu ul:before,.topmenu ul:after {
    content:"";
    display:table;
}
.topmenu ul:after {
    clear:both;
}
.topmenu ul > li {
    float:left;
    position:relative;
}
.topmenu a{
	padding:0 1vw 0 1vw;
	border:none;
	color:#000;
    display:block;
	text-decoration:none;
	height:6vw;
    line-height: 6vw;
	transition: all .5s ease;
display: inline-flex;
align-items: center;
}
.topmenu a:hover {
	color:#fff;
	background-color: var(--r);
}
.topmenu li ul { /* açılan menu */
	width:auto; /* açılır menu genişlik - ara 3cw8 onuda değiştir */
    position:absolute;
    //left:-15vw; 		/* açılır sol a54ve ara onuda değiştir*/
    top:6vw;
    z-index:1;
	display:none;
	box-shadow: 0.146vw 0.146vw 1.3vw -1vw #000;
    -moz-box-shadow: 0.146vw 0.146vw 1.3vw -1vw #000;
    -webkit-box-shadow: 0.146vw 0.146vw 1.3vw -1vw #000;
	background-color: rgba(255, 255, 255, .8);
	//overflow:hidden; /* aktif olursa 2. açılır engeller */
	-moz-border-radius: 0 0 1vw 1vw;
	-webkit-border-radius: 0 0 1vw 1vw;
	-khtml-border-radius: 0 0 1vw 1vw;
	border-radius: 0 0 1vw 1vw;
}
.topmenu li ul:last-child {
    padding-bottom: .6vw;
}
.topmenu li ul li {
	width:100%;	 /* açılır width*/
	border:none;
}
.topmenu li ul li:hover {
	transition: none;
	background-color: var(--r);
}
.topmenu li ul a {
	white-space: nowrap;
	text-align:left;
	font-size:.8vw;
	font-weight:400;
	line-height:.8vw;
	color:#000;
	//text-shadow: 1px 1px 1px rgba(255, 255, 255, 1);
    border:none;
    padding:.8vw;		/* alt menu kalınlık */
	height:auto;
	display:block;
	transition: all .5s ease;
}
.topmenu.scroll-active li ul a{line-height:0;height:1vw;}
.topmenu li ul a:hover{
	color:#fff;
    background-color: none;
	background: none;
}
.topmenu ul > li:hover ul{display:block}
.topmenu li ul li ul{ /* 2. açılan menu */
	width:auto; /* burdan değiştir ara 8ds9*/
    position:absolute;
	display:none;
	overflow:hidden;
    left:18.5vw; /* 3cw8 2. açılır menu sola yasla a54ve*/
    top:0vw; 		/* 2. açılır top*/
    z-index:9999;
	box-shadow: 0.146vw 0.146vw 1.3vw -1vw #000;
    -moz-box-shadow: 0.146vw 0.146vw 1.3vw -1vw #000;
    -webkit-box-shadow: 0.146vw 0.146vw 1.3vw -1vw #000;
	background-color: rgba(255, 255, 255, .7);
	border-radius: 0 1vw 1vw 1vw;
}
.topmenu li ul li ul a{ /* 2. açılan menu */
	width:14vw; /* 8ds9 */
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis; /*3 nokta*/
	display:none;
	padding:1vw;
	text-transform:capitalize;
}
.topmenu ul li ul > li:hover ul a{display:block}

.topmenu ul li:nth-child(n+4):nth-child(-n+5) li a { /*sadece 4. ve 5. menu alt menüsü*/}

.menuoksag{
	position:absolute;
	right:1.3vw;
	top:1.3vw;
    display: inline-block;
    width: 0;
    height: 0;
    //margin-left: 0.439vw;
    vertical-align: middle;
    border-left: 0.4vw dashed;
    border-left: 0.4vw solid\9;
    border-top: 0.293vw solid transparent;
    border-bottom: 0.293vw solid transparent;
}
.menuok {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 0.439vw;
    vertical-align: middle;
    border-top: 0.293vw dashed;
    border-top: 0.293vw solid\9;
    border-right: 0.293vw solid transparent;
    border-left: 0.293vw solid transparent;
}
.menuOverlayCss {/*menü açılınca ekranı siyah kapla*/
	height: 100%;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0, 0.7);
	display:block;
	z-index:9;
	backdrop-filter: blur(5px);
	-moz-backdrop-filter: blur(5px);
}






.megaLi:hover .megaDiv{display:table;}
.megaDiv{
	display:none;
    position:absolute;
	width:auto;
	top:6vw;
    left: 43%;
    transform: translateX(-50%);
	padding:1.65vw;
	background-color:rgba(255,255,255,1); /*siyah-beyaz*/ 
	border:1px solid #ccc;
	z-index:2;
	-khtml-border-bottom-left-radius: 2vw;
	-webkit-border-bottom-left-radius: 2vw;
	-moz-border-radius-bottomleft: 2vw;
	border-bottom-left-radius: 2vw;
	-khtml-border-bottom-right-radius: 2vw;
	-webkit-border-bottom-right-radius: 2vw;
	-moz-border-radius-bottomright: 2vw;
	border-bottom-right-radius: 2vw;
	transition: all .5s ease;
}
.megaDiv.scroll-active a{height:auto;line-height:2;}
.megaCab {display: flex;    /*flex-wrap: wrap;  Yatay sıralama ve satır atlaması için */}
.megaIC {
flex: 1;
padding: 1vw;
display: flex;
flex-direction: column; /* İçeriği dikey hizalamak için */
}
.megaIC a{
	cursor: pointer;
	margin:0;
	padding:0;
	height:auto;
	text-align:left;
	line-height:2;
	white-space: nowrap;
	min-width:17vw;
}
.megaIC a:before{
	height: 1vw;
	width: 1vw;
	background-size: 1vw;
	margin-right:.5vw;
	margin-left: -1vw; /*background-size ile aynı olmalı*/
	content: '';
	display: inline-block;
	background-image: url('../i/li-icon.svg') ;
	background-repeat: no-repeat;
	vertical-align:middle;
}
.megaIC a:hover{
	color:var(--r);
	background:none;
	text-shadow: none;
	box-shadow: none;
	padding-left:.5vw;
	transition: all  .5s ease;
}
.megaResim{
	width: 14vw;
	height: 14vw;
	margin-right:2vw;
	background-size: 14vw auto;
	background-position: center;
	background-repeat: no-repeat;
    justify-content: center; /* İçeriği dikey olarak ortala */
    align-items: flex-start; /* İçeriği yatay olarak sola hizala */
}
.araLi a{padding:0;margin:0;width:auto}
.araLi a:hover{background-color:#fff}
.araLi:hover .araCab{display:table}
.araLi input[type=text]:focus {width: 18vw;}
.araLi input[type=text] {
	position:relative;
	width: 8vw;
	height:4vw;
	background : url("../i/ara-icibos2.svg") no-repeat 1vw center;
	background-size:  2vw 2vw;
	padding-left: 3vw;
	-webkit-transition: width 0.4s ease-in-out;
	transition: width 0.4s ease-in-out;
	border:none;
	outline:none;
}
.araLi input[type=text]::placeholder {color: #000;opacity: 1;}
.araCab{
    width: 100vw;
    height: 100vh;
    display: none;
    position: fixed;
    top:3vw;
    left: 0;
	padding:3vw 0 0 0;
    z-index: -1;
    background: white;
	transform: scale(0.75, 0.75) translateY(-8vw);
	//overflow:hidden; /* aktif olursa 2. açılır engeller */
	-moz-border-radius: 0 0 1vw 1vw;
	-webkit-border-radius: 0 0 1vw 1vw;
	-khtml-border-radius: 0 0 1vw 1vw;
	border-radius: 0 0 1vw 1vw;
	}
.araCab::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('../i/ara-icibos2.svg') no-repeat center;
    background-size: 50%; /* SVG boyutunu küçült (isteğe göre %50, %60, vs.) */
    opacity: 0.1;
    z-index: -1;
}


/* Kaydırılabilir içerik alanı */
.araCab-content {
    height: calc(100vh - 6vw); /* Başlık yüksekliğini çıkar */
    overflow-y: auto;
}

.markaCab {
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	grid-gap: 10px;
	margin: 0 auto;
	max-width: 90vw;
}
.markaitem {
	padding: 0px;
	box-sizing: border-box;
}

																														/* USER NAV */

.user-nav{
	position:absolute;
	display: block;
	right:0;
	transition: all .5s ease;
}
.users-nav li {
	float: left;
	list-style: none;
	text-align: center;
	padding:1.3vw;
	height:6vw;
	transition: all .5s ease;
}

.user-nav ul li p{
	display:block;
	font-size:.7vw;
	text-align:center;
	color:#000; /* siyah-beyaz*/
	font-weight:700;
}

.user-navtxt{opacity:.6;display:block;}
.user-navtxt:hover{opacity:1}

.loginicon{ 
    background-image: url(../i/user-icibos.svg);
	/*filter: invert(100%); /* komple siyah-beyaz*/ 
    background-repeat: no-repeat;
    background-position: right top;	
    background-size: 100%;
    display: block;
	margin: 0 auto;
	text-indent: -9999px;
	width: 2.2vw;
	height: 2.2vw;
	transition: all 1s;
}
.loginicon:hover{}

.sepeticon{
    background-image: url(../i/sepet-icibos.svg);
	/*filter: invert(100%); /* komple siyah-beyaz*/ 
    background-repeat: no-repeat;
    background-position: right top;	
    background-size: 100%;
    display: block;
	margin: 0 auto;
	text-indent: -9999px;
	width: 2.2vw;
	height: 2.2vw;
	transition: all 1s;
	z-index:2;
}
.sepeticon:hover{}

.dilicon{
    background-image: url(../i/web.svg);
	/*filter: invert(100%); /* komple siyah-beyaz*/ 
    background-repeat: no-repeat;
    background-position: right top;	
    background-size: 100%;
    display: block;
	margin: 0 auto;
	text-indent: -9999px;
	width: 2.2vw;
	height: 2.2vw;
	transition: all 1s;
	z-index:2;
}
.dilicon:hover{}

.sepetRakamDaire {
	position:absolute;
	width:1.2vw;
	height:1.2vw;
	top:1.5vw;
	right:1.6vw;
    display:inline-block;
    line-height:0;
    border-radius:50%;
    font-size:.7vw;
	font-weight:700;
    background-color:var(--r);
	text-align:center;
	z-index:2
}

.sepetRakamDaire span {
	text-align:center;
    display:inline-block;
    padding-top:50%;
    padding-bottom:50%;
    color:#fff;
}

.sepetRakamDaireBot {
	position:absolute;
	width:4vw;
	height:4vw;
	top:0vw;
	right:11.5vw;
    display:inline-block;
    line-height:0;
    border-radius:50%;
    font-size:2.5vw;
	font-weight:700;
    background-color:var(--r);
	text-align:center;
}

.sepetRakamDaireBot span {
	text-align:center;
    display:inline-block;
    padding-top:50%;
    padding-bottom:50%;
    color:#fff;
}

.sepetTabloDiv{
	font-size:1.4vw;
	margin-left: auto;
	margin-right: auto; 
	display: table;
	max-width: 98%;
	color:#333;
}

.sepetTabloDiv a{color:#333;}

.sepetTabloDiv b {
  font-weight: 400;
  color:#bbb;
}

table.sepetTablo{
	border-collapse: collapse;
	border-style: hidden;
	width:100%;
	-moz-border-radius: 1vw;
	-webkit-border-radius: 1vw;
	-khtml-border-radius: 1vw;
	border-radius: 1vw;
	-webkit-box-shadow: .2vw .2vw .9vw rgba(0,0,0,.4); 
	-moz-box-shadow: .2vw .9vw .7vw rgba(0,0,0,.4);
	box-shadow: .2vw .2vw .9vw rgba(0,0,0,.4);
	overflow: hidden;
	background-color:#fff;
	}
	
.sepetTablo th, .sepetTablo td {
	border:1px solid #f2f2f2;
	vertical-align:middle;
	padding:1vw;
}

.sepetTablo tr:hover {
	background-color:#f7f7f7
}

.sepetTablo th{
	font-size:1.2vw;
	color:#aaa;
	font-weight:300;
}

.sepetSil{
	width:1.6vw;
	vertical-align:middle;
}

.sepetTabloDiv select {
    border: none;
    outline: none;
	font-size:1.4vw;
	text-align:center;
	scroll-behavior: smooth;
}

.durumcubukCab{
	width:70vw;
	height:5vw;
	position:relative;
	display:block;
	margin:0 auto;
	z-index:1;
	font-size:1vw;
	//border: 1px solid red;
}
.durumcubuk{counter-reset: step;} /* otomatik rakam say */
.durumcubuk li{ /*3 adet dış cab*/
	list-style-type:none;
	float:left;
	width:25%;	/*100 bölü sekme sayısı */
	position:relative;
	text-align:center;
	margin:0 auto 0 auto;
}
.durumcubuk li:before{ /* daire */
	content: counter(step);/* otomatik rakam say */
	counter-increment: step;/* otomatik rakam say */
	width:2.2vw;
	height:2.2vw;
	line-height:2.2vw;
	border: 0.366vw solid #ddd;
	display:block;
	text-align:center;
	margin: 0 auto;
	border-radius: 50%;
	background-color:white;
	-moz-box-shadow:inset 3px 3px 6px -3px #000;
	-webkit-box-shadow:inset 3px 3px 6px -3px #000;
	box-shadow:inset 3px 3px 6px -3px #000;
}

.durumcubuk li:after{ /* çubuk */
	content: '';
	position: absolute;
	Width: 100%;
	height: 0.732vw;
	background-color: #ddd;
	top: 1.1vw;
	left: -50%;
	-moz-box-shadow:inset 3px 3px 6px -3px #000;
	-webkit-box-shadow:inset 3px 3px 6px -3px #000;
	box-shadow:inset 3px 3px 6px -3px #000;
	z-index: -2;
}
.durumcubuk li:first-child:after{/*ilk dairenin solundaki barı sil*/
	content: none;
}
.durumcubuk li.active{ /*aktifin yazıları*/
	color:var(--r);
}
.durumcubuk li.active:before{/*aktif daire rengi*/
	border-color:var(--r);
}
.durumcubuk li.active + li:after{/*aktiften sonraki bar rengi*/
	background-color:var(--r);
	z-index: -1;
}

.sepetUrunImg{width:5vw;}

.uad{font-size:1.4vw;}

/* mavi ff6600 */

																															/*LOGIN DIV*/
.loginDiv{
	display:none;
    position:absolute;
	width:auto;
	padding:1.65vw;
    top:6vw;
	right:0;
	background-color:rgba(255,255,255,.7); /*siyah-beyaz*/ 
	border:none;
	z-index:2;
	transition: all .5s ease;
	-khtml-border-bottom-left-radius: 2vw;
	-webkit-border-bottom-left-radius: 2vw;
	-moz-border-radius-bottomleft: 2vw;
	border-bottom-left-radius: 2vw;
	-khtml-border-bottom-right-radius: 2vw;
	-webkit-border-bottom-right-radius: 2vw;
	-moz-border-radius-bottomright: 2vw;
	border-bottom-right-radius: 2vw;
	color:#000; /*siyah-beyaz*/ 
}
.headerLogin:hover .loginDiv{
	display:table;
}

.loginDiv input[type=text], .loginDiv input[type=password] {width: 16vw;}
.loginDiv .jssorbttn{width: 16vw;}

.dilDiv{
	display:none;
    position:absolute;
	width:auto;
	padding:1.65vw;
    top:4.4vw;
	right:0;
	background-color:rgba(255,255,255,0.7); /*siyah-beyaz*/ 
	border:none;
	z-index:2;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
	-khtml-border-bottom-left-radius: 2vw;
	-webkit-border-bottom-left-radius: 2vw;
	-moz-border-radius-bottomleft: 2vw;
	border-bottom-left-radius: 2vw;
	-khtml-border-bottom-right-radius: 2vw;
	-webkit-border-bottom-right-radius: 2vw;
	-moz-border-radius-bottomright: 2vw;
	border-bottom-right-radius: 2vw;
	color:#aaa;
}
.headerDil:hover .dilDiv{
	display:table;
}

.dilDiv input[type=text], .dilDiv input[type=password] {width: 16vw;}
.dilDiv .jssorbttn{width: 16vw;}

a.loginmenua{
    all: unset;
	margin:1vw;
	padding:0;
	line-height:1;
	display:block;
	float:none;
	clear:both;
	border:none;
	cursor:pointer;
	text-align:left;
	color:#000; /* siyah-beyaz */
}
.loginmenu a{
	border-right:none;
}
.loginmenu a:hover{
	transition: all 0s ease;
	font-size:1vw;
	color:#cd171a;
	background:none;
	background-color:none;
}

.menuform input[type=text]:focus, .menuform input[type=password]:focus, .menuform select, .menuform label{
	outline: none;
	background-color: rgba(255,255,255,1);/* siyah-beyaz */
}

.menuform input[type=text] {
	padding: 1vw;
	font-size:1vw;
	letter-spacing:.08vw;
	width: 100%;
	height: auto;
	text-align-last: left;
	text-align: left;
	-ms-text-align-last: left;
	-moz-text-align-last: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
 	-webkit-box-shadow: inset 0px 0.073vw 0.220vw -1px #000;
	-moz-box-shadow: inset 0px 0.073vw 0.220vw -1px #000;
	box-shadow: inset 0px 0.073vw 0.220vw -1px #000; 
	display: inline-block;
	background-color: rgba(0,0,0,0.2);/* background-color: #eee; */
	border: 0.073vw solid #e2e2e2;
	border-top: 0.073vw solid #cdcdcd;
	border-bottom: 0.073vw solid #efefef;
	color: #000;/* siyah-beyaz */
	margin: 0 0 2vw 0;
}

input[type=text].security {
    text-security: square;
    -webkit-text-security: square;
    -moz-text-security: square;
}

.menuform input[type=submit] {
    margin: 0 0 2vw 0;
}



/* Mobil Responsive */
@media screen and (max-width: 799px) {
	.header{display:none}
	.logo{display:none}
	.ustBosluk{height:14vw;}
	.ustBoslukVideo{height:14vw;}
	
	.durumcubukCab{width:98vw;height:10vw;font-size:2.2vw;}
	.durumcubuk li:before{ /* daire */
		width:5vw;
		height:5vw;
		line-height:5vw;
		border: .5vw solid #ddd;
	}
	.durumcubuk li:after{ /* çubuk */
		height: 2vw;
		top: 2.2vw;
	}
	.sepetTabloDiv{font-size:3vw;}
	.sepetTabloDiv select{font-size:3vw;}
	.sepetTablo th{font-size:2vw;}
	.sepetSil{width:4vw;}
	.sepetUrunImg{width:15vw;}
	.uad{font-size:3vw;}
	
	.menuform input[type=text], .menuform input[type=password], .jssorbttn{padding: 2vw; font-size: 4vw; margin: 0 0 4vw 0;}
	.jssorbttn:active {padding: 2.1vw 2vw 1.9vw 2vw;}
	
}