@media (max-width:1500px) { 
.bannerSlider .item .container {height: 500px;}
}

@media (max-width:1169px) { 
   .bannerSlider .item .container {height: 400px;}
   .bannerHd {font-size: 50px;}
   .bannerText {font-size: 17px;}
   .innerBanner {font-size: 60px;}
   .innerBanner .container {height: 260px;}
   .shopLeft {width: 220px;}
   .shopRight {width: calc(100% - 220px); padding: 30px 0 30px 20px;}
   .productList {margin: -10px;}
   .productList li {padding: 10px;}
   .productList li .imgBox .status {left: 5px; top: 5px; font-size: 13px; padding: 5px 10px;}
   .productList li .imgBox .discount {right: 5px; top: 5px; font-size: 13px; padding:5px 10px;}
   .benifite li .inner {padding: 15px;}
   .relatedProduct .slick-list {margin: -10px;}
   }
   

 @media (max-width:999px) { 
    .logo {margin-left: -85px;}
    .logo img {height: 110px;}
    .menu li {font-size: 18px;}
    .bannerHd {font-size: 40px;}
    .bannerText {font-size: 19px;}
    .wwdList li .over {padding: 20px;}
    .footerLogo {width: 100%; text-align: center;}
    .footerCen {width: 100%; padding: 0; text-align: center;}
    .footerMenu {justify-content: center; padding-bottom: 15px;}
    .footerRight {width: 100%; text-align: center; padding: 15px 0;}
    .copy {padding-bottom: 10px;}
    .coreValues li {width: 50%;}
    .contactDet {padding-right: 40px;}

    .missionBox .left {width: calc(100% - 300px); padding-right: 40px;}
   .missionBox .right {width: 300px;}
   .visionBox .left {width: 300px;}
   .visionBox .right {width: calc(100% - 300px); padding-left: 40px;}
   .productList li {width: 50%;}
   .viewMore a {height: 50px; font-size: 16px; min-width: 220px;}

   .detailImage {width: 50%; flex-direction: column-reverse;}
   .productSlider {width: 100%; padding: 0 0 20px 0; margin: 0;}
   .productThumb {width: 100%;}
   .productThumb .item {padding: 0 5px;}
   .detailInfo {width: 50%; padding: 0 0 0 15px;}
   .productName {font-size: 22px;}
   .benifite li {width: 50%; max-width: 100%;}

 }
 @media (max-width:767px) { 
   .mainCon {padding: 85px 0 0 0;}
    .header .container {height: 85px;}
    .logo {position: static; margin: 0;}
    .logo img {height: 80px;}
    a.showMobMenu {display: block; background: #CAB44B; width: 46px; height: 36px; border-radius: 3px; padding-top: 10px;}
    a.showMobMenu em {width: 28px; display: block; height: 2px; background: #fff; margin: 0 auto 5px auto; transition: ease-in-out .4s;}
    a.showMobMenu.active em:nth-child(3) {display: none;}
    a.showMobMenu.active em:nth-child(1) {transform: rotate(45deg); background: #fff; margin-top: 6px;}
    a.showMobMenu.active em:nth-child(2) {transform: rotate(-45deg); margin: -7px auto 0 auto; background: #fff;}
    .menu {position: fixed; z-index: 1001; left: -280px; top: 85px; width: 280px; background: #CAB44B; height: calc(100% - 85px); display: block; transition: ease-in-out .4s;}
    .menu.active {left: 0;}
    .menu li:nth-child(2) {padding-right: 0;}
    .menu li:nth-child(3) {padding-left: 0;}
    .menu li a {padding:15px; border-bottom: 1px solid rgba(0,0,0,.2);}
    .menu li a:after {display: none;}
    .bannerSlider .item .container {height: 300px;}
    .bannerHd {font-size: 30px; line-height: 35px;}
    .bannerText {font-size: 16px;}
    .topText {font-size: 16px; line-height: 26px;}
    .pt60 {padding-top: 30px;}
   .pb60 {padding-bottom: 30px;}
   .wwdList li {width: 100%; margin: auto;}
    .mainHd span {font-size: 20px; padding: 5px 10px;}
    .customerList li .inner .img {width: 120px;}
    .customerList li .inner .det {padding: 10px; width: calc(100% - 120px); font-size: 15px; line-height: 24px;}
    .customerList li .inner .det .hd {font-size: 18px;}
    .contactDet {width: 100%; padding: 0 0 30px 0;}
    .contactForm {width: 100%;}
    .contactSubText {font-size: 16px;}
    .contactInfo li {font-size: 16px;}
    .contactInfo li span {display: block; font-size: 18px;}
    .callUs li {font-size: 18px;}
    .callUs li .hd {font-size: 22px;}

    .shopLeft {width: 100%; padding: 0; position: relative;}
    #filter {display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: #fff; z-index: 1001; padding: 20px 20px 80px 20px; overflow: auto;}
    a.showFilter {display: inline-block; background: #CAB44B; border-radius: 3px; padding: 9px 15px; color: #fff; position: absolute; left: 0; top: 20px;}
    .filterSelect {height: 42px;}
    .applyBtn {position: fixed; left: 0; display: block; bottom: 0; z-index: 1002; background: #fff; padding: 20px; width: 100%;}
    .applyBtn  a {display: block;  background: #CAB44B; color: #fff; border-radius: 4px; padding: 10px; text-align: center;}
    .shopRight {width: 100%; padding: 20px 0;}
 }

 @media (max-width:599px) { 
 .footerMenu li {font-size: 14px; padding: 0 10px;}
 .innerBanner {font-size: 32px;}
 .innerBanner .container {height: 140px;}

 .innerHd {font-size: 22px; line-height:30px; padding-bottom: 10px;}

 .missionBox {flex-direction: column-reverse;}
 .missionBox .left {width: 100%; padding: 20px 0 0 0;}
 .missionBox .right {width: 100%;}
 .visionBox .left {width: 100%;}
 .visionBox .right {width:100%; padding: 20px 0 0 0;}

 .helpInfo li .hd {font-size: 24px; }
.helpInfo li .icon {width: 72px; height: 72px;}
.helpInfo li .icon span {font-size: 32px;}
   .coreValues {margin: -10px;}
   .helpInfo li {width: 100%; font-size: 16px; line-height:24px;}

   .searchBox {width: calc(100% - 110px); padding-right: 60px;}
   .searchBox .input {padding: 0 15px;}
   .searchBox .btn {width: 60px;}
   .detailImage {width: 100%;}
   .detailInfo {width: 100%; padding: 20px 0 0 0;}

   .benifite {margin: -5px;}
   .benifite li {padding: 5px;}
   .benifite li .inner {padding: 10px; flex-direction: column; text-align: center;}
   .benifite li .inner .icon {margin:0 0 10px 0;}
   .detHd {font-size: 22px;}
}

.btn-fill-primary, .btn-primary {
    color: #FFFFFF !important;
    background-color: #17302a !important;
    border-color: #17302a !important;
}

/* Keep the same color on hover */
.btn-fill-primary:hover,
.btn-primary:hover {
    color: #FFFFFF !important;
    background-color: #17302a !important;
    border-color: #17302a !important;
}





.brandsSlider .item img {
    width: 150px;
    height: 150px;
    object-fit: contain;
}