body{
	background-color: #EEE;
	color: #001a27;
	font-family: Helvetica,Arial,sans-serif;
	/*font-family: 'Kanit', sans-serif;*/
	font-size: 14px;
	overflow-x: hidden;
    width: 100%;
}

.overlay{
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 99;
    opacity: 1;
}

body.mmactive>#mobile-search,
body.mmactive>#mainContent,
body.mmactive>.fluid-container,
body.mmactive>footer{
	height: 0;
	overflow: hidden;
	padding: 0;
	margin: 0;	
	display: none;
}


a{text-decoration:none;color: #001a27;}
a, *::before {transition: all 0.2s ease 0s;}
a:hover {
	color: #ef7c00;
	text-decoration: none;
}
a:active, a:hover, a:focus, button:focus {
	outline: 0 none;
}
a, button{
	cursor: pointer;
}
button{border-radius: 3px;}

.container-fluid{padding-left: 15px; padding-right: 15px;}
.fluid-container{margin-left: auto; margin-right: auto; padding-left: 10px; padding-right: 10px; width: 90%;}
.container{padding-left: 10px; padding-right: 10px;}
.row {margin-left: -10px; margin-right: -10px;}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
    padding-left: 10px;
    padding-right: 10px;
}

.form-control{
	/*border-radius: 0;*/
    line-height: 40px;
    padding: 0 10px;
    border: 1px solid #DBE0E3;
}
.form-control:focus{box-shadow: none; border-color: #DBE0E3;}
/*.input-group-addon{
	border-radius: 0;
}*/
.table-hover tbody tr:hover {
    background-color: rgba(190, 201, 204, 0.2);
}
#commentComment{line-height: 18px; padding: 10px;}

.nav-tabs.nav-fill.nav-ub{border-bottom: none;}
.nav-tabs.nav-fill.nav-ub .nav-link{
	border-bottom: 5px solid #bfcacd;
	border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0;
    font-size: 24px;
    line-height: 35px;
    padding: 0;
    text-align: left;
}
.nav-tabs.nav-fill.nav-ub .nav-link.active {
    background-color: transparent;
    border-bottom: 10px solid #ef7c00;
    border-top: none;
    border-left: none;
    border-right: none;
    color: #001a27;
    border-radius: 0 0 10px 0;
}
.nav-tabs.nav-fill.nav-ub .nav-link:focus{outline: none;}
.nav-tabs.nav-fill.nav-ub .nav-item{padding-left: 20px;}
.nav-tabs.nav-fill.nav-ub .nav-item:first-child{padding-left: 0;}

.tab-content > .tab-pane{padding: 20px 0;}


h2.title {
    font-size: 24px;
    font-weight: 400;
    height: 38px;
    line-height: 24px;
    margin: 40px 0 20px;
    overflow: hidden;
    padding-top: 5px;
    padding-bottom: 40px;
    position: relative;
}
h2.title::before {
    border-bottom: 5px solid #ef7c00;
    content: " ";
    left: 0;
    position: absolute;
    right: 0;
    top: 35px;
    z-index: 1;
}
h2.title::after {
    border-bottom: 5px solid #BFCACD;
    content: " ";
    position: absolute;
    top: 35px;
    width: 100%;
    z-index: 2;
}



.mt20{margin-top: 20px;}
.mt30{margin-top: 30px;}
.mt40{margin-top: 40px;}

.breadcrumb{
	background-color: transparent;
	font-size: 13px;
	padding: 0;
	max-height: 30px;
	overflow: hidden;
	position: relative;
	margin-bottom: 10px;
}
.breadcrumb.breadcrumb-left{overflow: visible;}
.breadcrumb li{line-height: 30px; height: 30px;}
.breadcrumb li a{color: #6E7D81;}
.breadcrumb li a:hover{color: #ef7c00;}
.breadcrumb-item.active {color: #001a27;
	max-width: 90%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: block;
}
.breadcrumb .dropdown.show{position: static;}
.breadcrumb .dropdown-menu{border-radius: 0; right: 0;}
.breadcrumb .dropdown-menu::after{display: none;}
.breadcrumb .dropdown-menu li a{
	font-size: 13px;
	padding: 0 10px;
	max-width: 100%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: inline-block;
}

.rainbow{
	/*background-image: linear-gradient(90deg, #ef7c00 0%, #6A3AA3 32%, #42872B 65%, #ef7c00 100%);*/
	background-image: linear-gradient(90deg, #ef7c00 0%, #F89303 50%, #ef7c00 100%);
	height: 5px;
}

#mobile-search {
	background-color: rgba(0, 26, 39, 0.5);
    height: 50px;
    /*overflow: hidden;*/
    position: relative;
}
.mobile-search-wrapper{padding: 5px;}
#mobile-search .form-control{line-height: 40px; height: 40px;}
#mobile-search-addon{
	background-color: #ef7c00;
	color: #FFF;
	line-height: 40px;
	height: 40px;
	padding: 0 13px;
	border: none;
	border-radius: 0 5px 5px 0;
}

header{
	background-color: #FFF;
	padding: 20px 0;
}
header .logo{
	display: block;
	max-width: 300px;
}
header form.search .input-group{
	width: 100%;
}
header form.search input{ 
	height: 50px;
	line-height: 50px;
	background-color: #f0f0f0; 
	border: none;             
	color: #333;             
	padding: 0 10px;       
	border-top-left-radius: 3px;    
	border-bottom-left-radius: 3px; 
	border-top-right-radius: 0;    
	border-bottom-right-radius: 0; 
}

header form.search .input-group input.form-control::placeholder {
    color: #777; /* Placeholder metin rengi */
    opacity: 1; /* Firefox için */
}
header form.search .input-group button{
	background-color: #f0f0f0; /* DEĞİŞTİ - Input alanı ile aynı açık gri */
	cursor: pointer;
	line-height: 50px;
	height: 50px;
	padding: 0 15px;          /* İkonun konumuna göre padding'i ayarlayabilirsiniz */
	border: none;             /* Kenarlık yok (önceki gibi) */
	border-top-left-radius: 0;    /* Sol köşeler düz (önceki gibi) */
	border-bottom-left-radius: 0;
	border-top-right-radius: 3px; /* Sağ köşeler yuvarlak (önceki gibi, sitenizin geneliyle uyumlu) */
	border-bottom-right-radius: 3px;
}
header form.search {
	padding: 10px 0;
	position: relative;

}
header form.search .input-group button i{
	margin-right: 10px;
	font-size: 24px;
}

header form.search .input-group {
    /* input-group'un kendisine de köşe yuvarlaklığı veriyoruz,
       bu, odak border'ının da yuvarlak olmasını sağlar. */
    border-radius: 3px; /* Sitenizdeki genel border-radius ile uyumlu olsun (örn: 3px) */

    /* Normal durumda, input'un arka planıyla aynı renkte veya transparan bir border.
       Bu, odaklandığında border eklendiğinde layout kaymasını önler. */
    border: 2px solid #f0f0f0; /* Input arka planıyla aynı renk, böylece görünmez */
    /* Alternatif: border: 1px solid transparent; */

    /* Odaklandığında border renginin yumuşak geçişi için (isteğe bağlı) */
    transition: border-color 0.15s ease-in-out;
}

header form.search .input-group:focus-within {
    /* Input veya buton odaklandığında input-group'un border rengini değiştir */
    border-color: #777; /* İstediğiniz koyu gri tonu, örn: #333, #6c757d */

    /* Eğer Bootstrap'in varsayılan mavi focus box-shadow'ını istemiyorsanız
       ve sadece border görünsün istiyorsanız, onu burada sıfırlayabilirsiniz: */
    /* box-shadow: none; */
    /* Not: Sizin genel .form-control:focus stilinizde zaten box-shadow: none; var,
       bu yüzden ekstra bir box-shadow eklenmeyecektir muhtemelen. */
}

header .account .dropdown{
	float: right;
	margin-top: 10px;
}
header .account .dropdown button{
	background-color: #ffffff;	
	margin-left: 10px;
	font-size: 14px;
	line-height: 15px;
	text-align: left;
	padding: 10px 20px;
	cursor: pointer;
	border: 1px solid #ffffff;
	height: 50px;
	transition: background-color 0.2s ease, border-color 0.2s ease;
}

header .account .dropdown button:hover {
  background-color: #f0f0f0;  /* açık gri */
  border-color:   #cccccc;    /* biraz koyu gri */
}

header .account .dropdown button i{
	font-size: 22px;
	float: left;	
	margin-right: 10px;
	line-height: 30px;
}
header .account .dropdown button>div{
	float: left;
}
header .account .dropdown button span.username{
	color: #919191;
	font-size: 12px;
	font-weight: 200;
}
header .account .dropdown button span.cartitems{
	background-color: #ef7c00;
	width: 16px;
	height: 16px;
	display: inline-block;
	text-align: center;
	color: #FFF;
	border-radius: 8px;
	font-size: 12px;
	line-height: 16px;
}
header .account .dropdown .dropdown-menu{
	border-radius: 0;
	margin-top: 15px;
	border: none;
}
header .account .dropdown-cart{
	padding: 20px;
	width: 375px;
}
header .account .dropdown-cart .table,
#cartSummary table.cartdetails{
	margin: 0;
}
header .account .dropdown-cart .table tbody,
#cartSummary table.cartdetails tbody{
	max-height: 350px;
	overflow-y: scroll;
	display: block;
}
header .account .dropdown-cart .table td,
#cartSummary table.cartdetails td{
	border-bottom: 1px solid #BFCACD;
	border-top: none;
	font-size: 12px;
	padding: 10px 20px 10px 0;
	position: relative;
}
header .account .dropdown-cart .table td .sub,
#cartSummary table.cartdetails td .sub{
	/*position: absolute;
	bottom: 10px;
	left: 0;
	right: 0;
	width: 100%;*/
	margin-top: 10px;
}
header .account .dropdown-cart .table td .sub .qty,
#cartSummary table.cartdetails td .sub .qty{float: left;}
header .account .dropdown-cart .table td .sub .price,
#cartSummary table.cartdetails td .sub .price{float: right; font-weight: 600; padding-right: 0px;}
header .account .dropdown-cart .table tfoot tr {
	border-top: 3px solid #BFCACD;
}
header .account .dropdown-cart .table tfoot tr th{
	padding: 20px 0;
}
header .account .dropdown-cart .table tfoot tr th .cartTotal{
	float: right;
}
header .account .dropdown-cart a{
	background-color: #ef7c00;
	color: #FFF;
	display: block;
	font-size: 18px;
	font-weight: 600;
	line-height: 50px;
	height: 50px;
	text-align: center;
	border-radius: 3px;
}
header .account .dropdown-cart a i{margin-left: 10px;}
header #btnMobileSearch{
	float: right;
	border: none;
	background: transparent;
	height: 50px;
	line-height: 50px;
	padding: 0;
}
.resp_price{line-height: 40px; text-align: right;}


.dropdown-menu:after {
	position: absolute;
	top: -10px;
	right: 10%;
	display: inline-block;
	border-right: 11px solid transparent;
	border-bottom: 11px solid #FFF;
	border-left: 11px solid transparent;
	content: '';
}
.dropdown-menu-right:after{
	border: none;
}
/*.dropdown-menu::before {
    position: absolute;
    top: -10px;
    right: 10%;
    display: inline-block;
    border-right: 12px solid transparent;
    border-bottom: 12px solid #ccc;
    border-left: 12px solid transparent;
    border-bottom-color: rgba(0, 0, 0, 0.2);
    content: '';
}*/



#acContent, 
#acContentMobile {
    padding: 0 12px;
    position: relative;
    display: none;
    width: 100%;
}
#acContent .acWrapper, 
#acContentMobile .acWrapper{
	background: #fff none repeat scroll 0 0;
    /*border: 1px solid #ccc;
    border-radius: 4px;*/
    left: 0;
    max-height: 320px;
    overflow: auto;
    position: absolute;
    right: 0;
    top: -1px;
    z-index: 99;
}
#acContent .acWrapper .acList, 
#acContentMobile .acWrapper .acList {
    border-top: 1px solid #d0d0d0;
    padding: 0;
}
#acContent .acWrapper .acList > li, 
#acContentMobile .acWrapper .acList > li {
    display: block;
	line-height: 50px;
	overflow: hidden;
	text-overflow: ellipsis;
	border-bottom: 1px solid #efefef;
}
#acContent .acWrapper .acList > li:hover, 
#acContentMobile .acWrapper .acList > li:hover,
#acContent .acWrapper .acList > li.active, 
#acContentMobile .acWrapper .acList > li.active{
	background-color: #efefef;
}
#acContent .acWrapper .acList > li a, 
#acContentMobile .acWrapper .acList > li a {
    display: block;
	padding: 5px 20px;
	width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
#acContent .acWrapper .acList > li a img, 
#acContentMobile .acWrapper .acList > li img{
	margin-right: 10px;
}
#acContentMobile .acWrapper .acList > li{
	line-height: 30px;
}
#acContentMobile .acWrapper .acList > li a{
	font-size: 12px;
	padding: 5px 10px;
}
#acContentMobile .acWrapper .acList > li img{
	 height: 30px !important;
	 margin-right: 5px;
 }


nav{
	/*background-color: #FAFAFA;*/
	background-color: #ffffff;
	height: 50px;
}
/*nav .megaMenu{
	position: relative;
	float: left;
	width: 100%;
	flex: 0 0 25%;
	max-width: 25%;
	padding: 0 10px;
}*/
nav .megaMenu{
	position: static;
	display: inline-block;
	float: left;
	width: 25%;
}
nav ul.main{
	height: 50px;	
	overflow: hidden;
	/*float: right;*/
	padding-left: 0;
	line-height: 50px;
	/*display: table-row;*/
	margin: 0;
	display: inline-block;
}
nav ul li{
	display: inline-block;
	margin-left: 15px;
}
nav ul.main li{
	display: table-cell;
	margin-left: 15px;	
	vertical-align: middle;
	height: 50px;
	max-width: 250px;
	text-align: center;	
	line-height: 16px;
	/*border-left: 1px solid #dedede;*/
}
nav ul.main li a{
	color: #001a27;
	font-size: 15px;
	border-right: 1px solid #bcbcbc;	
	padding: 0 20px;
	text-align: center;
	display: block;
	width: 100%;
}
nav ul.main li:first-child a{
	border-left: none;
}
nav ul li a{
	font-size: 13px;
}
nav .col-md-11 {
	font-size: 15px;
	line-height: 50px;
	text-align: right;
}

#mainContent{
	padding: 20px 0;
}


#mainPromo{
	background-color: #FFF;
	/*max-height: 650px;*/
	overflow: hidden;
}
#mainPromo ul.gallery,
#campaignPromo ul.gallery{
	list-style: none;
	padding: 0;
}
#mainPromo ul.prm-hidden,
#campaignPromo ul.prm-hidden{
	height: 1px;
    opacity: 0;
    filter: alpha(opacity=0);
    overflow: hidden;
}
#mainPromo ul.gallery li,
#campaignPromo ul.gallery li {
    display: block;
    float: left;
    margin-right: 6px;
}
#mainPromo ul.gallery li a{
	display: block;
	width: 100%;
}
#mainPromo ul.gallery img,
campaignPromo  ul.gallery img{
    height: auto;
    max-width: 100%;
    display: block;
    width: 100%;
}
#mainPromo .lSSlideOuter .lSPager.lSGallery{
	padding: 6px 3px 0;
	text-align: center;
	width: 100% !important;
}
#mainPromo .lSSlideOuter .lSPager.lSGallery li{
	border: 1px solid #DBE0E3;
	border-radius: 3px;
	width: 60px !important;
	float: none;
	display: inline-block;
}
#mainPromo .lSSlideOuter .lSPager.lSGallery li.active,
#mainPromo .lSSlideOuter .lSPager.lSGallery li:hover{
	border: 1px solid #ef7c00;
}
#campaignPromo{
	background-color: #FFF;
}
#campaignPromo ul.gallery{
	border-bottom: 1px solid #EEEEEE;
}
#campaignPromo ul.gallery li{
	background-color: #FFF;
	padding: 20px;
	position: relative;
}
#campaignPromo ul.gallery li .details{
	bottom: 15px;
	position: absolute;
	left: 20px;
	right: 20px;
	text-align: center;
}
#campaignPromo ul.gallery li .details>a{
	margin-bottom: 10px;
	display: block;	
	font-size: 13px;
	line-height: 18px;
}
#campaignPromo ul.gallery li .details .price p{
	font-size: 16px;
	text-align: right;
	margin: 0;
	line-height: 22px;
	height: 22px;
}
#campaignPromo ul.gallery li .details .price p span{
	font-size: 80%;
}
#campaignPromo ul.gallery li .details .price p.regular{
	color: #BFCACD;
	text-decoration: line-through;
}
#campaignPromo ul.gallery li .details .price p.current{
	font-size: 20px;
	font-weight: 800;
}
#campaignPromo ul.gallery li .details a.buynow{
	background-color: #5BA71B;
	color: #FFF;
	height: 40px;
	line-height: 40px;
	display: block;
	width: 100%;
	text-align: center;
	border-radius: 3px;
}
#campaignPromo ul.gallery li .details a.buynow i{
	margin-right: 5px;
}
#campaignPromo .footer{
	height: 72px;
	line-height: 72px;
	padding: 0 20px;
	font-weight: 800;
}


.tlicon{
	font-size: 70% !important;
	font-weight: 400;
	margin-right: 2px;
}

#newsletter .form-wrapper{
	background-color: #fff;
    padding: 30px 20px 30px 180px;
    position: relative;
}
#newsletter .form-wrapper::before {
    content: "\E00C";	
	height: 100px;
	left: 20px;
	position: absolute;
	right: 0;
	top: 6px;
	font-family: 'ubicon';
	font-size: 86px;
}
#newsletter .form-wrapper h4{
	font-size: 28px;
}
#newsletter .form-wrapper .form-control{
	line-height: 40px;
}
#newsletter .form-wrapper button {
    background-color: #001a27;
    border: medium none;
    color: #ffffff;
    display: block;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 42px;
   