@font-face {
  font-family: 'icomoon';
  src:  url('../fonts/icomoon.eot?hk21s5');
  src:  url('../fonts/icomoon.eot?hk21s5#iefix') format('embedded-opentype'),
  url('../fonts/icomoon.ttf?hk21s5') format('truetype'),
  url('../fonts/icomoon.woff?hk21s5') format('woff'),
  url('../fonts/icomoon.svg?hk21s5#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}


.icon-q:before {
  content: "\e9001";
}


.items_wr {
  position: relative;
  @include wfl;
  margin-top: 30px;
  height: 424px;
}


.items_ {
  @include wfl;
  @include Shadow;
  padding: 0 15px 0 15px;
  position: relative;
  background: #fff;
  @include Transition(0.1);
  &:hover {
    @include Transition(0.5);
    @include Shadow3;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    .cat_hide {
      height: auto;
      overflow: visible;
    }
  }


  &:hover {
    a.name_items {
      height: auto;
      &:before {
        display: none;
      }
    }

    .cat_items {
      &:before{
        background: $link-color;
      }
      p {
        color: #fff;
      }
    }

    .img_items {
      a{
        img {
          @include filter-gray(80%);
        }
      }
    }

  }

  &.cloned {
    position: fixed !important;
    z-index: 7;

    .cat_hide {
      height: auto;
      overflow: visible;
    }
    a.name_items {
      height: auto;
      &:before {
        display: none;
      }
    }
    .cat_items {
      &:before{
        background: $link-color;
      }
      p {
        color: #fff;
      }
    }

  }

}




.status_items-wr {
  position: absolute;
  top: 20px;
  left: 0;
  width: 50%;
  z-index: 1;
  div {
    margin-top: 3px;
    @include wfl;
    &:first-child {margin-top: 0}

    p {
      float: left;
      $h:20 + px;
      color: #fff;
      text-transform: uppercase;
      font-size: 11px;
      padding: 0 7px 0 10px;
      height: $h;
      line-height: $h;
      position: relative;

      span {
        @include svgIcon;
        position: absolute;
        top: 0;
        right: -21px;
        overflow: hidden;
        display: block;
        width: 22px;
        height: 20px;

        &:before {
          font-size: 23px;
          content: "\e9001";
          position: absolute;
          left: 0;
          top: -1px;

        }
      }

      &.staus_new {
        background: $statusNewColor;
        span:before {
          color: $statusNewColor;
        }
      }

      &.staus_sale {
        background-color: $statusSaleColor;
        span:before {
          color: $statusSaleColor;
        }
      }

      &.staus_exclusive {
        @include Gradient-horisontal($statusExclusiveColorFrom,$statusExclusiveColorTo);
        span:before {
          color: $statusExclusiveColorTo;
        }
      }

      &.staus_hit {
        background-color: $statusHitColor;
        span:before {
          color: $statusHitColor;
        }
      }
    }
  }
}

.img_items {
  @include wfl;
  margin-top: 50px;
  display: table;
  a {
    width: 100%;
    height: 160px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;

    img {
      @include Transition(0.3);
      max-width: 100%;
      max-height: 100%;
      vertical-align: top;
    }
  }
}

a.name_items {
  position: relative;
  color: $main-color;
  font-size: 16px;
  font-weight: 700;
  height: 47px;
  min-height: 47px;
  overflow: hidden;
  @include wfl;
  margin-top: 16px;
  &:before {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    height: 11px;
    background: -moz-linear-gradient(top,rgba(255,255,255,0) 0,#fff 100%);
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(255,255,255,0)),color-stop(100%,#fff));
    background: -webkit-linear-gradient(top,rgba(255,255,255,0) 0,#fff 100%);
    background: -o-linear-gradient(top,rgba(255,255,255,0) 0,#fff 100%);
    background: -ms-linear-gradient(top,rgba(255,255,255,0) 0,#fff 100%);
    background: linear-gradient(top,rgba(255,255,255,0) 0,#fff 100%);
  }
  &:hover {
    color: $link-color;
    text-decoration: none;
  }
}

.in_stock_wr {

  @include wfl;
  .in_stock_ {
    float: left;
    span {
      position: relative;
      padding-left: 12px;
      &:before {
        content: '';
        width: 12px;
        height: 14px;
        top: 50%;
        margin-top: -6px;
        left: 0;
        background-position: 0 50%;
        background-repeat: no-repeat;
        position: absolute;
      }
    }
  }

  .title-sku {
    float: right;
  }

  span {
    color: $colorStock;

  }
}
span.yes_stock {
  &:before {
    background-image: url("../images/ico-all/ico-17.png");
  }
}

span.no_stock {
  &:before {
    background-image: url("../images/ico-all/ico-18.png");
  }
}

span.under_stock {
  &:before {
    background-image: url("../images/ico-all/ico-17_2.png");
  }
}

.cat-price-more {
  margin-top: 20px;
  @include wfl;
  position: relative;
}
.cat_price {
  height: 34px;
  line-height: 34px;
  float: left;
  font-size: 18px;
  font-weight: 700;
  span {
    font-size: 13px;
    font-weight: normal;
  }
}
.cat_old_price {
  font-size: 13px;
  text-decoration: line-through;
  float: left;
  position: absolute;
  top: -12px;
  left: 0;
}

.cat_more {
  height: 30px;
  display: block;
  line-height: 34px;
  float: right;
}

.cat_new_price {
  margin-top: 11px;
  margin-bottom: 0;

  .cat_price {
    margin-top: 9px;
    line-height: 28px;
    padding: 0 9px;
    background: #fff59e;
  }
  .btn_buy_basket-fix {
    position: absolute;
    bottom: 0;
    right: 0;
  }
}


.btn_buy_basket-fix {
  float: right;
  .btn_buy_basket {
    float: left;
  }
}



.cat_atr {
  margin-top: 8px;
  margin-bottom: -6px;
  @include wfl;
  p {

    span {
      color: $color2;
    }
    &:first-child {margin-top: 0}
  }
}

.cat_stars-wr {
  @include wfl;
  margin-top: 14px;
  button.rateit-reset {
    display: none !important;
  }
}

.cat_items {
  margin-top: 19px;
  @include wfl;
  margin-bottom: 1px;
  position: relative;
  z-index: 1;
  &:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    $p:14 + px;
    padding-left: $p;
    padding-right: $p;
    left: -$p;
    top: 0;
    background: $Main-bg;
    z-index: 1;
    box-sizing: content-box;
  }
  p {
    color: $color2;
    position: relative;
    z-index: 2;
    display: table-cell;
    height: 31px;
    vertical-align: middle;
    line-height: 12px;
  }
}

.cat-btns-wr {
  margin-top: 19px;
  @include wfl;
  div {
    $h:34 + px;
    height: $h;
    //width: 64px;
    width: auto;
    float: left;
    a {
      position: relative;
      float: left;
      width: 32px;
      height: $h;
      display: block;
      span {
        float: left;
        position: relative;
        @include svgIcon;
        @include Transition(0.15);
        &:before {
          color: $seo-border;
          font-size: 16px;
          line-height: $h;
        }
      }
      &:hover {
        text-decoration: none;
      }

      &:hover span {
        @include Scale(1.35);
        &:before {
          color: $link-color;
          //font-size: 20px;

          @include Transition(0.4);
        }
      }
      &:active span {
        @include Scale(1.35);
        &:before {
          color: $link-active;
          @include Transition(0.05);
        }
      }
      &.list_wish {
        span {
          &:before {
            content: "\e9003";
          }
        }
      }
      &.list_compare {
        span {
          float: right !important;
          &:before {
            content: "\e9004";
          }
        }
      }

      &.list_price {
        span {
          &:before {
            content: "\e9028";
          }
        }
      }
      &.in_active {
        span {
          &:before {
            color: $link-color;
          }
        }
      }
      &:before {
        background:$seo-border;
        position: absolute;
        width: 1px;
        height: 100%;
        top: 0;
        left: -3px;
        content: '';
      }
      &:first-child {
        &:before {display: none;}
      }
    }
  }
}


.cat_comments-link {
  margin-left: 10px;
}
.cat_hide {
  @include wfl;
  height: 0;
  overflow: hidden;
}
.sliders {
  margin-top: -8px;
}
.no-transition {
  transition: 0s !important;
  -webkit-transition: 0s !important;
  -moz-transition: 0s !important;
  -o-transition: 0s !important;
  -ms-transition: 0s !important;
}
.substrate {
  position: relative;
  &:before {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    display: block !important;
    content: '';
    z-index: 9;
  }
}

#overlay {
  &.overlay_cloned {
    display: block !important;
    z-index: 6;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    @include Opacity(0);
    background: none;
  }
}

//gallery

.my-gallery {
  .status_items-wr {
    width: auto;
    div {
      float: none;
      width: auto;
      p {
        float: none;
        display: inline-block;
      }
    }
  }
  .banner_card {
    position: absolute;
    top: -1px;
    margin-top: 0;
    right: -100%;
    margin-right: -38px;
    img {
      max-width: 100%;
    }
  }
}














@media (max-width: 1200px) {
  .btn_buy_basket-fix {
    position: relative !important;
    bottom: auto !important;
    right: auto !important;
    width: 100%;
    margin-top: 10px;
  }

  .cat_new_price {
    margin-top: 11px;
    margin-bottom: 0;
  }

  .in_stock_wr {
    .title-sku {
      float: left;
      width: 100%;
    }
  }
  a.name_items {
    height: 44px;
    min-height: 44px;
  }
  .img_items a {
    height: 135px;
  }

  .items_wr {
    //height: 414px;
    height: 458px;
  }
}



@media (max-width: 992px) {
  .cat_new_price {
    margin-top: 11px;
    margin-bottom: 0;

  }
  .btn_buy_basket-fix {
    width: auto !important;
    margin-top: 0;
    position: absolute !important;
    right: 0 !important;
    bottom: 0 !important;
  }
  .items_wr {
    height: 420px;
  }
  a.name_items {
    height: 50px;
    min-height: 50px;
  }
}
@media (max-width: 970px) {}
@media (max-width: 960px) {

}
@media (max-width: 940px) {

}
@media (max-width: 939px) {

}

@media (max-width: 920px) {

}
@media (max-width: 910px) {

}
@media (max-width: 900px) {

}
@media (max-width: 890px) {

}
@media (max-width: 885px) {
  .items_wr {
    height: 468px;
  }

  .cat_new_price {
    margin-top: 11px;
  }
  .btn_buy_basket-fix {
    position: relative !important;
    bottom: auto !important;
    right: auto !important;
    width: 100% !important;
    margin-top: 10px;
  }
}

@media (max-width: 860px) {

}

@media (max-width: 850px) {
  .my-gallery {

    .banner_card {
      margin-right: -22px;
    }
  }
}
@media (max-width: 835px) {

}

@media (max-width: 820px) {
  .items_wr {
    //height: 417px;
  }
  a.name_items {
    height: 47px;
    min-height: 47px;
  }
}
@media (max-width: 800px) {

}

@media (max-width: 790px) {

}
@media (max-width: 770px) {

}
@media (max-width: 768px) {

}
@media (max-width: 767px) {
  .cat_new_price {
    margin-top: 11px;
    margin-bottom: 0;

  }
  .btn_buy_basket-fix {
    width: auto !important;
    margin-top: 0;
    position: absolute !important;
    right: 0 !important;
    bottom: 0 !important;
  }


  .items_wr {
    height: 478px;
  }

  a.name_items {
    height: 47px;
    min-height: 47px;
  }

  .items_ {
    &:hover {
      @include Shadow;
      .img_items {
        a{
          img {
            @include filter-gray(0);
          }
        }
      }
      a.name_items {
        height: 47px;
        min-height: 47px;
        &:before {
          display: block;
        }
      }
    }
    position: relative !important;
    .cat_hide {
      height: 53px !important;
      overflow: hidden !important;
    }
  }
  .cat_items {
    &:before{
      background: $Main-bg !important;
    }
    p {
      color: $color2 !important;
    }
  }
  .cat-btns-wr div a:hover span {
    @include Scale(1);
  }

  .img_items {
    a{
      height: 160px;
    }
  }

  .in_stock_wr {
    .title-sku {
      float: right;
      width: auto;
    }
  }
}


@media (max-width: 749px) {

}
@media (max-width: 700px) {

}
@media (max-width: 570px) {
  .img_items {
    a{
      height: 135px;
    }
  }
  .items_wr {
    height: auto;
  }

  a.name_items {
    height: auto !important;
    min-height: 36px !important;
    &:before {
      display: none !important;
    }
  }
}


@media (max-width: 585px) {

}
@media (max-width: 555px) {


}
@media (max-width: 500px) {

}
@media (max-width: 480px) {

}
@media (max-width: 470px) {

}
@media (max-width: 460px) {

}
@media (max-width: 450px) {

}
@media (max-width: 436px) {
}
@media (max-width: 420px) {

}
@media (max-width: 400px) {

}
@media (max-width: 370px) {

}
@media (max-width: 350px) {

}
@media (max-width: 345px) {

}
@media (max-width: 335px) {

}
@media (max-width: 327px) {

}