.inim-component.distributors .inim-component-wrapper { padding-top:0 }
.inim-component.distributors .distributors-wrapper { padding:0rem 0 2.5rem; }
.inim-component.distributors .distributors-heading { color:rgb(var(--black)); font-size:1.75rem; line-height: 1.5rem; text-align:left; text-transform: uppercase; margin-bottom:1rem; }
.inim-component.distributors .list { display:grid; width:100%; position: relative; gap:2rem; grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); margin-top:1rem; }
.inim-component.distributors .list .posts-item { text-align: left; display:flex; flex-direction: row; align-items: flex-start; flex-wrap: wrap; padding:0; gap:2rem; }
.inim-component.distributors .list .posts-image { width:6rem; height:4rem; background: none top center no-repeat; background-size: contain; background-color:rgb(var(--white)); margin-bottom:2rem; color:rgb(var(--black)); }
.inim-component.distributors .list .posts-item > div { flex:1 0 }
.inim-component.distributors .list .posts-title { color:rgb(var(--black)); font-family:var(--font-headings); font-size:1.5rem; line-height:2rem; font-weight:600; text-align:left; width: 100%; margin-bottom:.5rem; }

.inim-component.distributors .list .branches { margin:5px 0; padding:0; }
.inim-component.distributors .list .branches .branch { margin:0 0 5px; padding:0; display: flex; flex-direction: column; gap:5px; }
.inim-component.distributors .list .branches .branch > a { display:flex; align-items: center; width:100%; }
.inim-component.distributors .list .branches .branch > a:before { content:""; margin-right:10px; font-family: "inim-icon"; font-size: 8px; content: "\e95c"; line-height: 1.5rem; display: inline-block;}
.inim-component.distributors .list .branches .branch > div { width:100%; display:grid; grid-template-rows:0fr; transition: grid-template-rows 0.5s ease-out; }
.inim-component.distributors .list .branches .branch > div.open-branch { grid-template-rows:1fr; }
.inim-component.distributors .list .branches .branch > div > div { overflow:hidden; }

.inim-component.distributors .list .posts-text { text-align:left; width: 100%; margin-bottom:1rem; }
.inim-component.distributors .list .posts-text a { color:rgb(var(--accent)); }
.inim-component.distributors .list .inim-button { width: fit-content; }
.inim-component.distributors .distributor-filter { width:100%; margin: 2rem 0; display:flex; flex-wrap: wrap; gap: 1rem; }
.inim-component.distributors .distributor-filter > * { flex:1 0 100%; }
.inim-component.distributors .distributor-filter .distributor-filter-text { position:relative; flex:1 1 20rem; }
.inim-component.distributors .distributor-filter .distributor-filter-text input { display:block; border:1px solid rgb(var(--gray-2)); border-radius:100px; color:rgb(var(--black)); background-color: rgb(var(--gray-background)); width:100%; padding:1rem; }
.inim-component.distributors .distributor-filter .distributor-filter-text i { position:absolute; right:2rem; top:50%; margin-top:-0.5rem; z-index:999; }
.inim-component.distributors .distributor-filter .distributor-filter-label { font-weight:bold; text-transform: uppercase; font-size: 0.875rem;}
.inim-component.distributors .distributor-filter .distributor-filter-select { display:flex; gap:1rem; margin-left:auto; flex-wrap: wrap; max-width: 100%; align-items: center; }
.inim-component.distributors .distributor-filter .distributor-filter-select > * { flex:1 0 auto; }
.inim-component.distributors .distributor-filter .filter-button { width:100%; border-radius:8px; }
.inim-component.distributors .distributor-filter .spinner { margin-left: 20px; position:initial; top: auto; left:auto; flex: 0 0 auto; }
.inim-component.distributors .list .dummy-posts-item, .inim-component.distributors .list .dummy-posts-inim { display:none }

@media (min-width: 768px) {
    .inim-component.distributors .distributor-filter .distributor-filter-text { flex:0 1 40rem; }
    .inim-component.distributors .distributor-filter .distributor-filter-select > * { flex:0 0 auto; }
    .inim-component.distributors .distributor-filter .filter-button { width:auto; height:100%; }
    .inim-component.distributors .list { grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); }
    .inim-component.distributors .list .posts-image { flex: 0 0 auto; width:12rem; height:7rem; }
    .inim-component.distributors .list { column-gap: 5rem; }
}

@media (min-width: 992px) {
    .inim-component.distributors .list { column-gap: 5rem; }
}