.products.no-sidebar .inner-with-sidebar {width: 100%;}
.products {margin-top: 0;}

.products .filters {position: relative; font-size: 14px; box-shadow: none; z-index: 90;}
.products .filters .panel-inner {position: relative;}
.products .filters .close {display: none;}
.products .filters a {color: var(--black4);}
.products .filters ul {padding: 0; margin: 0;}
.products .filters ul li {position: relative; line-height: 30px; padding: 0; margin: 0;}
.products .filters ul li.checkbox a::before {content: ""; display: inline-block; position: relative; top: 3px; width: 14px; height: 14px; background: #FFFFFF; border: 1px solid #C5C5C5; margin: 0 12px 0 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.products .filters ul li.checked a::before {content: "\2713"; top: -2px; line-height: 14px; color: #FFFFFF; font-size: 10px; font-weight: bold; background: var(--blue); border: 1px solid var(--blue); text-align: center;}
.products .filters ul li.checked a {color: var(--grey); font-weight: bold;}

.products .filters ul.categories li a:hover {color: var(--red);}
.products .filters ul.categories li.checked {font-weight: bold;}
.products .filters ul.categories li.checked a::before {display: none;}

.products .filters ul.variants li span {display: font-size: 13px; color: var(--grey3); margin: 0 0 0 3px;}
.products .filters ul.variants li.checked span {font-weight: normal;}

.products .filters ul.colors li span {display: inline-block; position: relative; top: 5px; width: 18px; height: 18px; background: #DDDDDD; border: 1px solid #FFFFFF; margin: 0 12px 0 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.products .filters ul.colors li span.white {border: 1px solid #DDDDDD;}
.products .filters ul.colors li span.colored {background: url(../../theme/images/icons/colored.png) 0 0 no-repeat transparent;}
.products .filters ul.colors li.checked a::before {display: none;}
.products .filters ul.colors li.checked span::before {content: "\2713"; position: absolute; top: -6px; left: 5px; font-size: 11px; width: 14px; height: 14px; color: #FFFFFF;}
.products .filters ul.colors li.checked span.white::before {font-size: 12px; color: var(--black3);}

.products .products-header h1 {display: inline-block; margin: 0 10px 0 0;}
.products .products-header .category-description {color: #555555; margin: 15px 0 0 0;}

.products .subcategories {display: none; position: relative; width: 100%; height: 36px; white-space: nowrap; overflow: hidden; margin-bottom: 18px !important;}
.products .subcategories ul.subcategories-menu {position: relative; left: 0; width: 100%; font-size: 13px; overflow-x: scroll; overflow-y: hidden; padding-bottom: 10px;}
.products .subcategories ul.subcategories-menu li {display: inline-block;}
.products .subcategories ul.subcategories-menu li a {display: flex; font-family: 'Oswald'; font-size: 12px; font-weight: normal; color: var(--grey2); background: #FFFFFF; border: 1px solid #EEEEEE; padding: 6px 14px; margin: 0 8px 0 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}
.products .subcategories ul.subcategories-menu li.active a,
.products .subcategories ul.subcategories-menu li a:hover {color: #FFFFFF; background: var(--black3);}
.products .subcategories ul.subcategories-menu li:last-child a {margin: 0;}

.products .products-header .products-count {display: inline-block; position: relative; top: -3px; line-height: 36px; color: var(--grey); font-size: 18px; padding: 0; margin: 0;}
.products .products-header .selected-filters {padding: 0; margin: 30px 0 0 0;}
.products .products-header .selected-filters ul {padding: 0; margin: 0;}
.products .products-header .selected-filters ul li {display: inline-block; position: relative; font-family: 'Oswald'; font-size: 13px; font-weight: normal; color: var(--grey2); background: #FFFFFF; border: 1px solid #DDDDDD; padding: 6px 48px 6px 12px; margin: 5px 12px 5px 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; cursor: default;}
.products .products-header .selected-filters ul li a.delete {position: absolute; display: inline-block; top: 0; right: 0; font-family: inherit; font-size: 12px; color: var(--red); background: #F4F4F4; padding: 6px 8px;}

.products .products-header2 {padding-top: 20px !important; padding-bottom: 20px !important; margin: 20px 0 0 0;}
.products .products-header2 .btn {display: inline-block; position: relative; width: 170px; line-height: 18px; font-size: 13px; text-align: center; color: var(--grey2); background: #FFFFFF; border: 1px solid #E0E0E0; padding: 7px 12px; margin: 0 8px 0 0; outline: 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; cursor: pointer;}
.products .products-header2 .btn .btn-title {display: none;}
.products .products-header2 .btn .btn-value {display: block; font-size: 14px; font-weight: normal;}
.products .products-header2 p {display: inline-block; font-size: 14px; margin: 0 6px 0 0;}

.products .products-header2 .filter-menu {display: none;}
.products .products-header2 .sort-menu {position: relative; display: inline-block; font-size: 14px; text-align: left; color: var(--grey2);}
.products .products-header2 .sort-menu .icon-arrow-d {position: absolute; top: 9px; right: 8px; opacity: 0.8; filter: alpha(opacity=80);}
.products .products-header2 .sort-menu ul {display: none; position: absolute; left: -1px; width: 100%; text-align: left; background: #FFFFFF; border: 1px solid #E0E0E0; border-top: 0; padding: 7px 0; margin: 5px 0 0 0; z-index: 999;}
.products .products-header2 .sort-menu ul li {padding: 0; margin: 0;}
.products .products-header2 .sort-menu ul li a {display: block; color: var(--grey); padding: 6px 15px;}
.products .products-header2 .sort-menu ul li a:hover {background: #F5F5F5;}
.products .products-header2 .sort-menu ul li.selected a {background: #EEEEEE;}

.products .products-header2 .list-type {display: inline-block; float: right; padding: 0; margin: 0;}
.products .products-header2 .list-type li {display: inline-block; padding: 0; margin: 0;}
.products .products-header2 .list-type li a {display: block; width: 20px; height: 20px; padding: 6px; border: 1px solid #E0E0E0; opacity: 0.7; filter: alpha(opacity=70);}
.products .products-header2 .list-type li.grid a {position: relative; left: 1px; background: url(../../images/icons/grid.png) center center no-repeat transparent; -moz-border-radius: 3px 0 0 3px; -webkit-border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px;}
.products .products-header2 .list-type li.list a {background: url(../../images/icons/list.png) center center no-repeat transparent; -moz-border-radius: 0 3px 3px 0; -webkit-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0;}
.products .products-header2 .list-type li:hover,
.products .products-header2 .list-type li.selected {background: #F5F5F5;}

.products .product-items-grid {display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); grid-gap: 22px; padding: 0; margin: 20px 0 0 0;}
.products .product-items-grid li {position: relative; display: grid; align-content: normal; background: #FFFFFF; text-align: center; padding: 5px 5px 22px 5px; margin: 0; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;}
.products .product-items-grid li:hover {box-shadow:0 2px 12px rgba(0,0,0,.09);}
.products .product-items-grid li a.product-link {position: relative; display: grid;}
.products .product-items-grid li .product-link img {display: flex; width: 100%; height: auto; aspect-ratio: auto; z-index: 1; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;}
.products .product-items-grid li .product-link img:nth-of-type(2) {position: absolute; display: none; width: 100%;}
.products .product-items-grid li:hover .product-link img:nth-of-type(2) {display: block; -webkit-transition-duration: 100ms; transition-duration: 100ms;}
.products .product-items-grid li .variants {display: none; position: absolute; bottom: 0; width: 100%; min-height: 26px; background: rgba(255, 255, 255, .6); text-align: center; padding: 9px 15px 8px 15px; margin: 0; z-index: 50;}
.products .product-items-grid li:hover .variants {display: block;}
.products .product-items-grid li .variants span {display: inline-block; font-size: 12px; color: #F5F5F5; background: #444444; padding: 4px 8px; margin: 2px; cursor: default;}
.products .product-items-grid li a h2.title,
.products .product-items-grid li a h3.title {display: inline-block; font-family: 'Oswald'; font-size: 14px; font-weight: normal; color: var(--black4); line-height: 22px; padding: 0; margin: 15px 15px 0 15px; text-transform: none; word-break: break-word;}
.products .product-items-grid li .rating {color: var(--grey2); margin: 4px 15px 0 15px;}
.products .product-items-grid li .description {font-size: 13px; line-height: 19px; color: var(--grey2); margin: 8px 15px 0 15px;}
.products .product-items-grid li .price-outer {display: block; line-height: 24px; padding: 0; margin: 8px 15px 0 15px;}
.products .product-items-grid li .price-outer .price {display: inline-block; font-family: 'Oswald'; font-size: 16px; font-weight: normal; color: var(--red);}
.products .product-items-grid li .price-outer .price.unavailable {font-size: 14px; color: var(--grey4);}
.products .product-items-grid li .price-outer .sale-price {display: inline-block; font-family: 'Oswald'; font-size: 14px; font-weight: normal; color: var(--grey2); text-decoration: line-through; margin: 0 0 0 8px;}
.products .product-items-grid li .price-outer .note {display: inline-block; font-size: 14px; color: var(--grey3); margin: 0 8px 0 0;}
.products .product-items-grid li .price-outer .reseller-standard-price {font-size: 14px; color: var(--grey2);}
.products .product-items-grid li .labels {display: inline-block; position: absolute; top: 8px; right: 8px; width: 40px; font-family: 'Oswald'; font-size: 11px; color: #FFFFFF; text-align: center; z-index: 3;}
.products .product-items-grid li .labels .new {display: block; background: var(--black2); padding: 3px 0 3px 0; margin: 0 0 4px 0;}
.products .product-items-grid li .labels .discount {display: block; background: var(--red); padding: 6px 0; margin: 0 0 4px 0;}

.products .product-items-list {display: grid; grid-template-columns: auto; grid-gap: 20px; padding: 0; margin: 20px 0 0 0;}
.products .product-items-list li {position: relative; display: block; align-content: center; background: #FFFFFF; text-align: left; padding: 5px; margin: 0; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;}
.products .product-items-list li:hover {box-shadow:0 2px 12px rgba(0,0,0,.12);}
.products .product-items-list li a.image-cont {float: left; display: grid; position: relative; width: 250px;}
.products .product-items-list li a.image-cont img {display: flex; width: 100%; height: auto; aspect-ratio: auto; z-index: 1; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;}
.products .product-items-list li a.image-cont img:nth-of-type(2) {position: absolute; display: none; width: 100%;}
.products .product-items-list li:hover a.image-cont img:nth-of-type(2) {display: block; -webkit-transition-duration: 100ms; transition-duration: 100ms;}
.products .product-items-list li .product-info {display: inline-block; width: -webkit-calc(100% - 290px); width: -moz-calc(100% - 290px); width: calc(100% - 290px); margin: 0 20px 25px 20px;}
.products .product-items-list li .product-info a h3.title {display: inline-block; font-family: 'Oswald'; font-size: 16px; font-weight: normal; color: var(--grey); line-height: 22px; padding: 0; margin: 15px 0 0 0; text-transform: none; word-break: break-word;}
.products .product-items-list li .rating {color: var(--grey2); margin: 5px 0 0 0;}
.products .product-items-list li .product-info .description {margin: 17px 0 25px 0;}
.products .product-items-list li .product-info .variants {padding: 0; margin: 20px 0 0 0;}
.products .product-items-list li .product-info .variants span {display: inline-block; font-size: 12px; color: #F5F5F5; background: #444444; padding: 4px 8px; margin: 0 4px 0 0; cursor: default;}
.products .product-items-list li .product-info .price-outer {display: block; line-height: 24px; padding: 0; margin: 20px 0 0 0;}
.products .product-items-list li .product-info .price-outer .price {display: inline-block; font-family: 'Oswald'; font-size: 16px; font-weight: bold; color: var(--red2);}
.products .product-items-list li .product-info .price-outer .sale-price {display: inline-block; font-family: 'Oswald'; font-size: 14px; font-weight: normal; color: var(--grey2); text-decoration: line-through; margin: 0 0 0 8px;}
.products .product-items-list li .product-info .price-outer .note {display: inline-block; font-size: 14px; color: var(--grey3); margin: 0 8px 0 0;}
.products .product-items-list li .product-info .price-outer .reseller-standard-price {font-size: 14px; color: var(--grey2);}
.products .product-items-list li .labels {display: inline-block; position: absolute; top: 8px; right: 8px; width: 40px; font-family: 'Oswald'; font-size: 11px; color: #FFFFFF; text-align: center; z-index: 3;}
.products .product-items-list li .labels .new {display: block; background: var(--black2); padding: 3px 0 3px 0; margin: 0 0 4px 0;}
.products .product-items-list li .labels .discount {display: block; background: var(--red2); padding: 6px 0; margin: 0 0 4px 0;}

.products .products-pagination {margin-top: 20px !important; text-align: right;}

@media only screen and (max-width: 940px)
{
  .products .sidebar.filters-menu {position: fixed; display: block; width: 290px; z-index: 9999;}
  .products .inner-with-sidebar {width: 100%; margin: 0;}

  .products .products-header2 .btn {text-align: center; padding: 6px 12px;}
  .products .products-header2 .btn:hover {background: #F8F8F8;}
  .products .products-header2 .btn .btn-title {display: block; font-size: 13px; font-weight: bold;}
  .products .products-header2 .btn .btn-value {font-size: 12px; color: var(--grey3);}

  .products .products-header2 p {display: none;}
  .products .products-header2 .filter-menu {display: inline-block;}
  .products .products-header2 .sort-menu {padding-right: 25px;}
  .products .products-header2 .sort-menu .icon-arrow-d {top: 16px;}

  .products .filters-menu.closed {left: -340px;}
  .products .filters-menu.open {left: 0;}
  .products .filters-menu .close {display: flex; margin: 0 0 0 290px;}
  .products .filters-menu .panel-inner {width: 254px; margin: 0 0 0 18px;}
  .products .filters-menu .panel-inner .content {margin: 20px 0 0 0;}

  .products .products-header2 .list-type {position: relative; top: 8px;}
}

@media only screen and (max-width: 920px)
{
  .products .subcategories {display: block;}
}

@media only screen and (max-width: 800px)
{
  .products .products-pagination {padding-left: 20px !important; padding-right: 20px !important;}
}

@media only screen and (max-width: 640px)
{
  .products .product-items-grid {grid-template-columns: repeat(auto-fill, minmax(min(200px, 100%), 1fr));}

  .products .product-items-grid li .labels .new {padding: 2px 0 2px 0;}
  .products .product-items-grid li .labels .discount {padding: 4px 0;}

  .products .product-items-list li .labels .new {padding: 2px 0 2px 0;}
  .products .product-items-list li .labels .discount {padding: 4px 0;}
  .products .product-items-list li a.image-cont {width: 220px;}
  .products .product-items-list li .product-info {width: -webkit-calc(100% - 260px); width: -moz-calc(100% - 260px); width: calc(100% - 260px);}
  .products .product-items-list li .product-info a h3.title {margin: 8px 0 0 0;}
}

@media only screen and (max-width: 550px)
{
  .products-header {padding-top: 18px !important; margin-bottom: 0 !important;}
  .products-header h2 {margin-top: 8px !important;}
  .products .products-header2 {padding-top: 0 !important; padding-bottom: 26px !important;}
  .products .products-header2 .btn {width: -webkit-calc(50% - 8px); width: -moz-calc(50% - 8px); width: calc(50% - 8px); margin-bottom: 5px;}
  .products .products-header2 div.btn:last-of-type {margin-right: 0;}
  .products .products-header2 .list-type {display: none;}

  .products .product-items-grid {grid-template-columns: repeat(auto-fill, minmax(min(170px, 100%), 1fr)); grid-gap: 14px;}

  .products .product-items-list li a.image-cont {width: 180px;}
  .products .product-items-list li .product-info {width: -webkit-calc(100% - 220px); width: -moz-calc(100% - 220px); width: calc(100% - 220px);}
}

@media only screen and (max-width: 460px)
{
  .products .product-items-list li a.image-cont {width: 100%;}
  .products .product-items-list li .product-info {width: -webkit-calc(100% - 40px); width: -moz-calc(100% - 40px); width: calc(100% - 40px);}
  .products .product-items-list li .product-info a h3.title {margin: 20px 0 0 0;}
}

@media only screen and (max-width: 420px)
{
  .products .product-items-grid {grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr));}
}

@media only screen and (max-width: 390px)
{
  .products .products-header2 .btn {width: 100%;}
  .products .products-header2 div.btn:first-of-type {margin-bottom: 10px;}
}
