.categories {
  padding-top: 50px;
  padding-bottom: 10px; }

@media (max-width: 991px) {
  .categories {
    padding-top: 30px;
    padding-bottom: 30px; } }

@media (max-width: 767px) {
  .categories {
    padding-top: 40px;
    padding-bottom: 40px; } }

.categories-inner {
  max-width: 1420px;
  margin-right: auto;
  margin-left: auto;
  padding-right: 10px;
  padding-left: 10px;
  box-sizing: border-box; }

@media (max-width: 991px) {
  .categories-inner {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center; } }

.site-categories__item {
  display: flex;
  flex-wrap: wrap;
  list-style-type: none;
  margin: 0;
  padding: 0; }

@media (max-width: 991px) {
  .site-categories__item {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: stretch;
    grid-auto-columns: 1fr;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto auto auto auto;
    grid-template-rows: auto auto auto auto; } }

.categories-item {
  width: calc(25% - 20px);
  margin: 0 10px 20px;
  -webkit-box-flex: 0;
  flex: 0 auto;
  box-shadow: 0 5px 13px rgba(0, 0, 0, 0.05);
  box-sizing: border-box;
  position: relative;
  min-height: 272px; }

@media (max-width: 1260px) {
  .categories-item {
    width: calc(33% - 20px); } }

@media (max-width: 991px) {
  .categories-item {
    display: block;
    width: calc(50% - 30px);
    flex-direction: row;
    flex-wrap: nowrap;
    min-height: auto; } }

@media (max-width: 479px) {
  .categories-item {
    width: 100%; } }

.categories-item.show .categories__body {
  position: absolute;
  box-shadow: 0 5px 25px rgba(49, 154, 221, 0.25);
  z-index: 2; }

.categories-item.show .second-level {
  display: block;
  opacity: 1;
  visibility: visible; }

.categories-item.show .text-title {
  color: #319add; }

.categories-item.show .site-categories__btn {
  border-color: #319add;
  background: url("data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20baseProfile%3D%22full%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Aev%3D%22http%3A%2F%2Fwww.w3.org%2F2001%2Fxml-events%22%20xml%3Aspace%3D%22preserve%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2212px%22%20height%3D%228px%22%20%20viewBox%3D%220%200%2012%208%22%20preserveAspectRatio%3D%22none%22%20shape-rendering%3D%22geometricPrecision%22%3E%22%3Cpath%20d%3D%22M11.98847%2C1.45281v0l-5.53544%2C5.53517v0l-0.45332%2C-0.45295v0l-0.45301%2C0.45295v0l-5.53575%2C-5.53517v0l1.4421%2C-1.44196v0l4.54666%2C4.5465v0l4.54697%2C-4.5465v0z%22%20fill%3D%22%23319add%22%20fill-opacity%3D%221%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E") 50% 50% no-repeat; }

.categories__body {
  background-color: #fff;
  position: relative;
  transition: all 0.3s;
  width: 100%; }

.categories__body-inner {
  height: 100%; }

.categories__body .second-level {
  position: relative;
  background: #fff;
  padding: 0 40px 38px;
  box-sizing: border-box;
  list-style: none;
  z-index: 10;
  transition: all 0.3s;
  opacity: 0;
  visibility: hidden;
  display: none; }

.categories__body .second-level li a {
  color: #319add;
  text-decoration: none;
  font-size: 16px;
  font-weight: 300;
  line-height: 30px;
  transition: all 0.3s; }

.categories__body .second-level li a:hover {
  text-decoration: underline; }

.categories__body-link {
  position: absolute;
  text-decoration: none;
  color: transparent;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: all 0.3s;
  z-index: 1; }

.categories__pic-wr {
  display: block;
  position: relative;
  padding-top: 65%; }

.categories__pic-wr.no_pic {
  background: #e6e6e6 url("/g/shop2v2/default/images/noimage.png") 50% 50% no-repeat; }

.categories__pic-wr.no_pic img {
  opacity: 0; }

.categories__pic-wr img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  object-position: center;
  object-fit: cover;
  width: 100%;
  height: 100%; }

.site-categories__holder {
  display: flex;
  align-items: center;
  position: relative;
  padding: 30px 80px 30px 40px; }

.categories__title {
  display: flex; }

.text-title {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  color: #373740;
  font-size: 17px;
  font-weight: 700;
  transition: all 0.2s; }

.site-catedories__buttons {
  width: 100%; }

@media (max-width: 479px) {
  .site-catedories__buttons {
    margin-right: 10px;
    margin-left: 10px; } }

.site-categories__btn {
  position: absolute;
  right: 30px;
  border-radius: 50%;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  width: 35px;
  height: 35px;
  border: 2px solid rgba(0, 0, 0, 0.1);
  font-size: 0;
  transition: all 0.2s;
  outline: none;
  box-sizing: border-box;
  background: url("data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20baseProfile%3D%22full%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Aev%3D%22http%3A%2F%2Fwww.w3.org%2F2001%2Fxml-events%22%20xml%3Aspace%3D%22preserve%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2212px%22%20height%3D%228px%22%20%20viewBox%3D%220%200%2012%208%22%20preserveAspectRatio%3D%22none%22%20shape-rendering%3D%22geometricPrecision%22%3E%3Cpath%20d%3D%22M11.98847%2C1.45281v0l-5.53544%2C5.53517v0l-0.45332%2C-0.45295v0l-0.45301%2C0.45295v0l-5.53575%2C-5.53517v0l1.4421%2C-1.44196v0l4.54666%2C4.5465v0l4.54697%2C-4.5465v0z%22%20fill%3D%22%23373740%22%20fill-opacity%3D%221%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E") 50% 50% no-repeat; }

.site-catedories__button-down {
  display: block;
  margin-top: 40px;
  text-align: center;
  position: relative; }

@media (max-width: 991px) {
  .site-catedories__button-down {
    margin-top: 10px; } }

.site-catedories__button-down:before {
  content: '';
  position: absolute;
  top: 50%;
  left: calc(50% + 40px);
  right: 0;
  height: 1px;
  background: rgba(0, 0, 0, 0.1); }

.site-catedories__button-down:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  right: calc(50% + 40px);
  height: 1px;
  background: rgba(0, 0, 0, 0.1); }

.button-down {
  width: 50px;
  height: 50px;
  font-size: 0;
  border-radius: 50%;
  border: 2px solid #e8e8e8;
  box-sizing: border-box;
  background: url("data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20baseProfile%3D%22full%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Aev%3D%22http%3A%2F%2Fwww.w3.org%2F2001%2Fxml-events%22%20xml%3Aspace%3D%22preserve%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2221px%22%20height%3D%2211px%22%20%20viewBox%3D%220%200%2021%2011%22%20preserveAspectRatio%3D%22none%22%20shape-rendering%3D%22geometricPrecision%22%3E%3Cpath%20d%3D%22M20.98664%2C2.15188v0l-9.83474%2C8.83465v0h-1.30437v0l-9.83474%2C-8.83465v0l2.13915%2C-2.13957v0l8.34794%2C7.3483v0l8.34778%2C-7.3483v0z%22%20fill%3D%22%23373740%22%20fill-opacity%3D%221%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E") 50% 50% no-repeat;
  display: inline-block;
  vertical-align: middle;
  transition: all 0.3s; }

.button-down:hover {
  border-color: #319add;
  background: url("data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20baseProfile%3D%22full%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Aev%3D%22http%3A%2F%2Fwww.w3.org%2F2001%2Fxml-events%22%20xml%3Aspace%3D%22preserve%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2221px%22%20height%3D%2211px%22%20%20viewBox%3D%220%200%2021%2011%22%20preserveAspectRatio%3D%22none%22%20shape-rendering%3D%22geometricPrecision%22%3E%22%3Cpath%20d%3D%22M20.98664%2C2.15188v0l-9.83474%2C8.83465v0h-1.30437v0l-9.83474%2C-8.83465v0l2.13915%2C-2.13957v0l8.34794%2C7.3483v0l8.34778%2C-7.3483v0z%22%20fill%3D%22%23319add%22%20fill-opacity%3D%221%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E") 50% 50% no-repeat; }

@media (max-width: 600px) {
  .categories-item {
    width: 100%; } }

.categories-item.show .text-title, .categories__body .second-level li a {
  color: #27a804; }

.categories-item.show .site-categories__btn {
  border-color: #27a804;
  background: url("data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20baseProfile%3D%22full%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Aev%3D%22http%3A%2F%2Fwww.w3.org%2F2001%2Fxml-events%22%20xml%3Aspace%3D%22preserve%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2212px%22%20height%3D%228px%22%20%20viewBox%3D%220%200%2012%208%22%20preserveAspectRatio%3D%22none%22%20shape-rendering%3D%22geometricPrecision%22%3E%22%3Cpath%20d%3D%22M11.98847%2C1.45281v0l-5.53544%2C5.53517v0l-0.45332%2C-0.45295v0l-0.45301%2C0.45295v0l-5.53575%2C-5.53517v0l1.4421%2C-1.44196v0l4.54666%2C4.5465v0l4.54697%2C-4.5465v0z%22%20fill%3D%22%2327a804%22%20fill-opacity%3D%221%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E") 50% 50% no-repeat; }

.cat_title {
  position: relative;
  color: #fff;
  font-weight: 700;
  font-size: 28px;
  line-height: 1;
  margin: 0 10px 30px;
  background: #111;
  border-radius: 10px;
  overflow: hidden; }
  .cat_title span {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 0 115px 0 0;
    padding: 21px 20px 21px 30px;
    background: #49c745; }
    .cat_title span:before {
      position: absolute;
      content: '';
      width: 60px;
      left: 100%;
      top: 0;
      bottom: 0;
      background: url("data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20baseProfile%3D%22full%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Aev%3D%22http%3A%2F%2Fwww.w3.org%2F2001%2Fxml-events%22%20xml%3Aspace%3D%22preserve%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2260px%22%20height%3D%2270px%22%20%20viewBox%3D%220%200%2060%2070%22%20preserveAspectRatio%3D%22none%22%20shape-rendering%3D%22geometricPrecision%22%3E%22%3Cpath%20fill%3D%22%2349c745%22%20d%3D%22M0.000%2C70.000%20L0.000%2C-0.000%20L60.000%2C-0.000%20C60.000%2C-0.000%2040.833%2C31.000%200.000%2C70.000%20Z%22%2F%3E%3C%2Fsvg%3E") 0 0 /contain no-repeat; }

@media (max-width: 991px) {
  .categories-inner {
    align-items: initial; }

  .cat_title span {
    padding: 21px 20px 20px 30px;
    font-size: 23px; } }

@media (max-width: 639px) {
  .cat_title span {
    font-size: 21px; } }

@media (max-width: 410px) {
  .cat_title span {
    font-size: 17px; } }