.catalog-category-page .actions-block {
  display: flex; }

@media screen and (min-width: 767px) {
  .catalog-category-page .actions-block {
    justify-content: flex-end; } }

.catalog-category-page .actions-block .filters-panel {
  max-width: 0; }

@media screen and (min-width: 767px) {
  .catalog-category-page .actions-block .filters-panel {
    flex: 0 0 auto; } }

.catalog-category-page .actions-block .filters-panel .filters-toggle {
  padding: 7px 10px;
  outline: none; }

.catalog-category-page .actions-block .filters-panel .filters-toggle .icon:before {
  content: "\f0b0"; }

.catalog-category-page .actions-block .search-panel {
  width: 100%;
  order: -1; }

@media screen and (min-width: 767px) {
  .catalog-category-page .actions-block .search-panel {
    order: 0;
    padding: 0; } }

.catalog-category-page .actions-block .search-panel form {
  display: flex;
  background-color: white;
  border: 1px solid #f0f0f0;
  padding: 5px 0;
  height: 33px;
  box-sizing: border-box; }

.catalog-category-page .actions-block .search-panel form button {
  display: inline-block;
  border: none;
  background-color: transparent;
  padding: 0 10px;
  outline: none; }

.catalog-category-page .actions-block .search-panel form button .icon {
  color: #666; }

.catalog-category-page .actions-block .search-panel form button[type='submit'] .icon:before {
  content: "\f002"; }

.catalog-category-page .actions-block .search-panel form button[data-search-reset] .icon:before {
  content: "\f00d"; }

.catalog-category-page .actions-block .search-panel form [data-search-input] {
  outline: none;
  border: none;
  flex: 1;
  width: 100%;
  padding-left: .5em; }

.catalog-category-page .actions-block .buttons-panel {
  padding: 0;
  display: flex;
  min-width: 120px;
  justify-content: flex-end; }

.catalog-category-page .actions-block .buttons-panel .catalog-view-mode {
  display: flex; }

.catalog-category-page .actions-block .buttons-panel button {
  padding: 5px 8px;
  outline: none;
  height: 33px;
  width: 36px;
  margin-left: 3px;
box-sizing: border-box;}

.catalog-category-page .actions-block .buttons-panel button.active {
  background-color: #eee;
  color: #333;
  border-color: #e1e1e1; }

.catalog-category-page .actions-block .buttons-panel button.list-view {
  margin-right: 5px; }

.catalog-category-page .actions-block .buttons-panel button.list-view .icon:before {
  content: "\f03a"; }

.catalog-category-page .actions-block .buttons-panel button.block-view .icon:before {
  content: "\f00a"; }

.catalog-category-page .actions-block .icon, .catalog-category-page .actions-block .search-panel form button .icon {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.catalog-category-page .actions-block .filters-panel .filters-toggle, .catalog-category-page .actions-block .buttons-panel button {
  border: 1px solid #ccc;
  background-color: #f7f7f7;
  color: #666;
  outline: none;
  padding: 4px;
  line-height: 18px;
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s; }

.catalog-category-page .actions-block .filters-panel .filters-toggle:hover, .catalog-category-page .actions-block .buttons-panel button:hover {
  background-color: #eaeaea; }

.catalog-category-page .actions-block .filters-panel .filters-toggle:active, .catalog-category-page .actions-block .buttons-panel button:active {
  background-color: #dedede;
  color: #333; }

.filter-slide-panel {
  position: fixed;
  background-color: white;
  border-left: 1px solid #ccc;
  box-shadow: -3px 0 10px rgba(0, 0, 0, 0.3);
  top: 32px;
  width: 0;
  height: calc(100vh - 32px);
  overflow: hidden;
  right: 0;
  transition: all .5s ease-in-out; }

@media screen and (min-width: 768px) {
  .filter-slide-panel {
    top: 48px; } }

@media screen and (min-width: 1200px) {
  .filter-slide-panel {
    top: 60px; } }

.filter-slide-panel.visible {
  width: 320px;
  z-index: 20;
}

.filter-slide-panel__close {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 300vh;
  height: 100vh;
  z-index: 0;
}

.filter-slide-panel.visible .filter-slide-panel__close  {
  display: block;
}

.filter-slide-panel__body {
  position: relative;
  height: 100%;
  padding: 10px; }

.filter-slide-panel__title {
  padding: 10px;
  background-color: #f0f0f0;
  border-bottom: 1px solid #ddd;
  font-size: 1.4em;
  color: #999;
  text-align: center;
  text-transform: uppercase;
  position: relative; }

.filter-slide-panel__close-btn {
  position: absolute;
  left: 10px;
  background-color: transparent;
  border: none;
  outline: none; }

.filter-slide-panel li {
  list-style: none; }