/*CSS starting*/

/*************************brands page styling*************************/

.section_padding_brands { padding:50px 0px; padding-bottom: 25px; box-sizing: border-box; }
.dd_brands { width: 100%;}

.dd_brands .title { font-size: 30px; font-family: 'gibson_bold'; text-transform:uppercase;}
.dd_brands .all_brands { display: flex; width: 100%; align-items: center; }
.dd_brands .all_brands span a { color: #009e58; font-family: 'Montserrat', sans-serif; font-size: 20px; text-decoration: underline;}
.dd_brands .all_brands span {display: block; width: 12%;}
.dd_brands .brand_carousel { width: 100%; padding: 10px 0px; padding-bottom: 25px; }
.dd_brands .brand_container { display: inline-block; }
.dd_brands .brand_container a { display: block; width:160px; box-shadow:0px 0px 6px 0px rgb(0 0 0 / 12%); margin: 10px 4px; padding: 8px 10px; text-decoration: underline;  box-sizing: border-box;}
.dd_brands .all_brands .letter_list {display:flex; width: 88%; justify-content: space-between;}
.dd_brands .all_brands .letter_list li  a { width: 16px; text-align: center; font-size:16px; color:#000; font-family: 'Montserrat'; display: block; padding: 8px; 
background-color: #ececec; font-weight: 500; border-radius: 4px; text-decoration: unset; }
.dd_brands .all_brands .letter_list li a:hover {color: #ffffff; background-color: #009e58 }


.dd_brands .brand_container .owl-nav{width: 10%; position: absolute; top:-38px; right: 16px; text-align: right;}
.dd_brands .brand_container.owl-carousel .owl-nav button.owl-prev{ background-color: #009e58; width: 25px; height: 25px; top:0%; left:0%; position: static; 
margin-right:3px; transform: none; outline: none;}
.dd_brands .brand_container.owl-carousel .owl-nav button.owl-prev img{width: 8px; padding-top: 3px; box-sizing: border-box;}
.dd_brands .brand_container.owl-carousel .owl-nav button.owl-next{background-color: #009e58; width: 25px; height: 25px; top:0%; right:0%; position: static; 
margin-left:3px; transform: none;  outline: none;}
.dd_brands .brand_container.owl-carousel .owl-nav button.owl-next img{width: 8px; padding-top: 3px; box-sizing: border-box;}
.dd_brands .brand_container.owl-carousel .owl-nav button.owl-next.disabled{background-color: #bfbfbf;}
.dd_brands .brand_container.owl-carousel .owl-nav button.owl-prev.disabled{background-color: #bfbfbf}

.dd_brands .brands_listing {display: grid; grid-template-columns: repeat(auto-fill, minmax(175px, 1fr)); grid-gap:2rem; padding-top: 30px;}
.dd_brands .brands_listing li {  }
.dd_brands .brands_listing li a {border: 1px solid #eeeeee; display: block; text-align: center; padding: 15px 10px; font-family: 'Montserrat'; font-weight:500; font-size: 15px;  color: #000;}

.dd_brands .brands_listing li a:hover{    border: 1px solid #009e58;
    color: #009e58;}

.dd_brands .loading_placeholder { text-align: center; padding-top: 30px; }
.dd_brands .loading_placeholder img {max-width: 100%; }

.dd_brands .title_mobile { width: 100%; display: none; color: #ffffff; background-color:#8d8d8d;
font-size: 15px; padding:6px 0px; text-align: center; text-transform: uppercase; }

 /*brands page responsive*/

@media ( min-width: 200px) and (max-width: 899px)

{

.section_padding_brands { padding:0px 0px; }
.dd_brands .brands_listing {display: grid; grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); grid-gap:1rem; padding-bottom: 40px;}
.dd_brands .title_mobile { display: block; font-size: 13px; }
.dd_brands .brand_container .owl-nav { display: none; }
.dd_brands .title {display: none;}

.dd_brands .all_brands span {display: none;}
.dd_brands .all_brands {display: block;}
.dd_brands .all_brands .letter_list {width: 100%; justify-content:start;  flex-wrap: wrap;}
.dd_brands .all_brands .letter_list li a { width: 12px; font-size: 12px; padding: 6px; margin-right: 5px; margin-top: 5px;}

.dd_brands .brand_container a { width: 110px; padding: 9px 5px;}
.dd_brands .brands_listing li { align-self: center; }
.dd_brands .brands_listing li a { font-size: 12px; line-height: 21px; padding: 12px 5px; }
.dd_brands .loading_placeholder { display: none;}

}

@media ( min-width: 600px) and (max-width: 899px)
{
	.dd_brands .all_brands .letter_list {width: 100%; justify-content:center;  flex-wrap: wrap;}
	.dd_brands .brands_listing {display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); grid-gap:1rem;}
	.dd_brands .brand_container a { width: 140px; padding: 9px 5px;}
	.dd_brands .brands_listing li a { font-size: 12px; padding: 12px 5px; }

}

@media ( min-width: 900px) and (max-width: 1025px)

{

	.dd_brands .all_brands span {width: 10%; }
	.dd_brands .all_brands span a {font-size: 15px;}
	.dd_brands .all_brands .letter_list {width: 90%;}
	.dd_brands .all_brands .letter_list li a { width: 12px; font-size: 13px; padding: 7px; }
	.dd_brands .brand_container a {width: 140px;}
	.dd_brands .brands_listing li a { font-size: 13px; }
}

@media  (min-width: 1030px)

{

	.dd_brands .brands_listing {grid-template-columns: repeat(auto-fill, minmax(205px, 1fr)); grid-gap: 2rem; }

}
.brand_container .owl-nav .owl-prev:after{
	content: url(../images/left_arrow.png);
    width: 8px;
    position: absolute;
    top: 6px;
    right: 42px;

}
.brand_container .owl-nav .owl-next:after{
	content: url(../images/right_arrow.png);
    width: 8px;
    position: absolute;
    top: 6px;
    right: 8px;
    

}
.brand_container .owl-nav .owl-next{
	position: relative;
}
.brand_container .owl-nav .owl-prev{
	position: relative;
}
.all_brands ul li{
	margin-bottom: 0rem;
}
.dd_brands .brands_listing li{
	margin-bottom: 0rem;
}
.dd_brands .all_brands .letter_list li .active {
    color: #ffffff;
    background-color: #009e58;
}
.all_brands .letter_list li p{
text-align: center;
margin: 30px;
}
.fmeshopbybrand-index-index .main .columns .column.main{
	display: none;
}