﻿.listNav {position: relative;width: 100%;-ms-overflow-style: none;scrollbar-width: none;scrollbar-width: none;border: 1px solid #ccc;float:left; border-radius:5px;}
.listNav a:first-child{border-radius:5px 0 0 5px;}
.ln-letters {width: max-content;}
.listNavHide {position: absolute;overflow: hidden;clip: rect(0 0 0 0);height: 1px;width: 1px;margin: -1px;padding: 0;border: 0}
.letterCountShow {display: block}
.ln-letters a {display: inline-block;font-size: 14px;color: #212529;width: 40px;line-height: 40px;text-align: center;border-right: 1px solid #e5e5e5;float: left;}
.ln-letters a:hover, .ln-letters .ln-selected {background-color: #00abec;color: #fff}
.ln-letters .ln-disabled {color: #ccc}
.ln-letter-count {color: #369;font-size: .8em;left: 0;line-height: 1.35;position: absolute;text-align: center;top: 0;width: 20px}
.listNav::-webkit-scrollbar {display: none}
ul.brand-section {width: 100%;float: left;text-align: center;margin-top:10px;}
ul.brand-section li.brand-block {width: 15.666%;border: 1px solid #eaecef;background: #fff;overflow: hidden;transition: all .5s;margin: 5px .5%;border-radius: 5px;float: left;min-height:unset;height:110px;text-align:center;}
ul.brand-section li.brand-block:hover {box-shadow: 0 5px 20px -13px rgba(0,0,0,.75);}
ul.brand-section li.brand-block a {padding: 0}
ul.brand-section li.brand-block p { text-align:center;overflow: hidden;/*background: #eaecef;*/ padding:5px 0;}
ul.brand-section li.brand-block p span {text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
ul.brand-section li.brand-block img {background: #fff;/*width: 80%;height: auto;*/border-radius: 0 0 10px 10px;padding: 10px;margin: 10px 0 5px 0;}
.popular-brand-container {width:100%; float:left; text-align:center; padding-bottom:20px;}
.popular-brand-container .shop-item{width:19%; margin:0 0.5%; float:left;}
.brand-logo-img {width: 100%;float: left;background: #fff;border: 1px solid #eaecef;border-radius: 10px; padding:20px 0 0 0; height:90px;}
.brand-logo-img img {width: 130px;margin: 0 auto;display: block;height: 45px;}
.brand-logo-name {width:100%; float:left; padding:10px 0;}
.food_Shop_Category.BrandLogoPage {}
.food_Shop_Category.BrandLogoPage .brand_Shop_title {position:relative;}
.food_Shop_Category.BrandLogoPage .brand_Shop_title .BrandSearchBox {width: 200px;position: absolute;right: 0;top: 0;}
.food_Shop_Category.BrandLogoPage .brand_Shop_title .BrandSearchBox input {padding:0 5px; font-size:14px; width:100%;border:1px solid #ccc; border-radius:5px; height:30px; font-weight:400;}

@media only screen and (max-width:1200px), (max-width:1299px) {
.container {width: 100%;padding: 0 15px;}
}

@media only screen and (max-width:800px),(max-width:899px) {
.listNav {scrollbar-color: #174572 #f5fcff;scrollbar-width: thin;overflow: scroll hidden;}
ul.brand-section li.brand-block {width: 19%;}
}

@media only screen and (max-width:400px),(max-width:499px) {
.food_Shop_Category.BrandLogoPage .brand_Shop_title .BrandSearchBox {width: 100%;position: relative;right: 0; float:left;top: 10px; padding-bottom:20px;}
.food_Shop_Category.BrandLogoPage .brand_Shop_title .BrandSearchBox input {height:40px;}
ul.brand-section li.brand-block {width: 32.333%;background: none;height: 100px;}
ul.brand-section li.brand-block img {min-height: 50px;padding: 5px;width: auto;}
.brand-name {display: none;}
.popular-brand-container .shop-item{width: 32.333%;margin: 0 0.5% 5px 0.5%;float: left;}
.brand-logo-img {height: 80px;}
.brand-logo-img img {width: 85%;margin: 0 auto;display: block;height: 40px;}
.brand-logo-name {width: 100%;float: left;padding: 10px 0;}
}

@media only screen and (max-width:375px), (max-width:399px) {
}

@media only screen and (max-width:360px) {
}

@media only screen and (max-width:300px), (max-width:320px) {
}
