#switcher li#list {
  background-color: #ED1C24; }
  #switcher li#list i {
    color: #ffffff; }
#switcher li#box {
  background: none; }
  #switcher li#box i {
    color: #999999; }

#productsList,
.productsList {
  display: block;
  border-top: 1px solid #eeeeee; }
  @media (max-width: 720px) {
    #productsList,
    .productsList {
      display: flex;
      display: -ms-flex;
      display: -webkit-flex;
      flex-wrap: wrap;
      align-content: stretch;
      align-items: stretch; } }
  #productsList .article,
  .productsList .article {
    width: 100%;
    text-align: center; }
    @media (max-width: 720px) {
      #productsList .article,
      .productsList .article {
        width: 50%;
        text-align: center; } }
  @media screen and (max-width: 720px) and (min-width: 641px) and (max-width: 720px) {
    #productsList .article,
    .productsList .article {
      width: 33.3%; } }

    #productsList .article a,
    .productsList .article a {
      display: flex;
      display: -ms-flex;
      display: -webkit-flex;
      position: relative;
      padding: 0 0;
      border: 1px solid #eeeeee;
      border-left: 1px solid #ffffff;
      border-right: 1px solid #ffffff;
      border-top: 1px solid #ffffff;
      text-decoration: none;
      margin: 0;
      transition: all 0.2s ease-in-out;
      width: 100%;
      height: 100%;
      box-sizing: border-box;
      color: #222222;
      justify-content: flex-start;
      flex-wrap: wrap; }
      @media (max-width: 720px) {
        #productsList .article a,
        .productsList .article a {
          display: block;
          padding: 10px; } }
      #productsList .article a .tag,
      .productsList .article a .tag {
        display: inline;
        position: absolute;
        font-size: 12px;
        padding: 0 20px;
        background-color: #ED1C24;
        color: #ffffff;
        left: auto;
        right: 0;
        line-height: 24px;
        height: 24px;
        top: -2px; }
        @media (max-width: 720px) {
          #productsList .article a .tag,
          .productsList .article a .tag {
            font-size: 11px;
            padding: 0 10px; } }
        @media (min-width: 721px) and (max-width: 1280px) {
          #productsList .article a .tag,
          .productsList .article a .tag {
            font-size: 11px;
            padding: 0 10px;
            left: 60px;
            right: auto;
            line-height: 16px;
            height: 16px;
            top: 0%;
            margin: 0 0 0 0; } }
      #productsList .article a .thumbnail,
      .productsList .article a .thumbnail {
        width: 70px;
        height: 70px;
        display: flex;
        display: -ms-flex;
        display: -webkit-flex;
        padding: 5px;
        margin: 0;
        flex-direction: column;
        justify-content: center;
        order: 1;
        flex: none; }
        @media (max-width: 720px) {
          #productsList .article a .thumbnail,
          .productsList .article a .thumbnail {
            padding-top: 10px; } }
        @media (min-width: 721px) and (max-width: 1280px) {
          #productsList .article a .thumbnail,
          .productsList .article a .thumbnail {
            width: 60px;
            height: 60px; } }
        #productsList .article a .thumbnail img,
        .productsList .article a .thumbnail img {
          width: 70px; }
          @media (min-width: 721px) and (max-width: 1280px) {
            #productsList .article a .thumbnail img,
            .productsList .article a .thumbnail img {
              width: 60px; } }
      #productsList .article a h3,
      .productsList .article a h3 {
        display: flex;
        display: -ms-flex;
        display: -webkit-flex;
        margin: 0;
        padding: 0 0 0 10px;
        height: 80px;
        flex-direction: column;
        justify-content: center;
        width: 160px;
        line-height: 1.25;
        text-align: left;
        order: 2;
        flex: none; }
        @media (min-width: 721px) and (max-width: 1280px) {
          #productsList .article a h3,
          .productsList .article a h3 {
            height: 60px;
            width: 140px;
            font-size: 14px; } }
      #productsList .article a .spec,
      .productsList .article a .spec {
        order: 4;
        width: 360px;
        flex: none;
        display: flex;
        display: -ms-flex;
        display: -webkit-flex;
        justify-content: flex-start; }
        @media (max-width: 720px) {
          #productsList .article a .spec,
          .productsList .article a .spec {
            display: block;
            width: auto; } }
        @media (min-width: 721px) and (max-width: 1280px) {
          #productsList .article a .spec,
          .productsList .article a .spec {
            order: 4;
            width: 300px;
            flex: none; } }
        #productsList .article a .spec dl,
        .productsList .article a .spec dl {
          display: flex;
          display: -ms-flex;
          display: -webkit-flex;
          flex: none;
          width: 120px;
          margin: 0;
          padding: 0;
          height: 80px;
          flex-direction: column;
          justify-content: center;
          position: relative; }
          @media (max-width: 720px) {
            #productsList .article a .spec dl,
            .productsList .article a .spec dl {
              width: auto;
              margin: 0 auto;
              padding: 0;
              display: flex;
              display: -ms-flex;
              display: -webkit-flex; } }
          @media (min-width: 721px) and (max-width: 1280px) {
            #productsList .article a .spec dl,
            .productsList .article a .spec dl {
              width: 100px;
              height: 60px; } }
          #productsList .article a .spec dl:before,
          .productsList .article a .spec dl:before {
            content: "";
            width: 1px;
            height: 40px;
            background-color: #eeeeee;
            position: absolute;
            left: 0;
            top: 20px; }
            @media (min-width: 721px) and (max-width: 1280px) {
              #productsList .article a .spec dl:before,
              .productsList .article a .spec dl:before {
                top: 10px; } }
          #productsList .article a .spec dl dt,
          .productsList .article a .spec dl dt {
            width: 100%;
            flex: none;
            text-align: center;
            font-size: 13px;
            color: #999999; }
            @media (max-width: 720px) {
              #productsList .article a .spec dl dt,
              .productsList .article a .spec dl dt {
                width: 5em;
                font-size: 11px;
                margin: 0; } }
            @media (min-width: 721px) and (max-width: 1280px) {
              #productsList .article a .spec dl dt,
              .productsList .article a .spec dl dt {
                font-size: 12px; } }
          #productsList .article a .spec dl dd,
          .productsList .article a .spec dl dd {
            flex: none;
            text-align: center;
            font-size: 15px;
            line-height: 1.25; }
            @media (max-width: 720px) {
              #productsList .article a .spec dl dd,
              .productsList .article a .spec dl dd {
                flex: 1;
                font-size: 11px;
                margin: 0; } }
            @media (min-width: 721px) and (max-width: 1280px) {
              #productsList .article a .spec dl dd,
              .productsList .article a .spec dl dd {
                font-size: 13px; } }
      #productsList .article a .red,
      .productsList .article a .red {
        order: 5;
        font-size: 13px;
        display: flex;
        display: -ms-flex;
        display: -webkit-flex;
        padding: 25px 0 0 20px;
        margin: 0;
        height: fit-content;
        flex-direction: column;
        justify-content: center;
        position: relative;
        text-align: left;
        word-break: break-all;
        width: calc(100% - 630px);
        width: -webkit-calc(100% - 630px);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        line-height: 1; }
        @media (max-width: 720px) {
          #productsList .article a .red,
          .productsList .article a .red {
            font-size: 11px; } }
        @media (min-width: 721px) and (max-width: 1280px) {
          #productsList .article a .red,
          .productsList .article a .red {
            font-size: 12px;
            flex: 1;
            padding: 10px 0 0 10px;
            height: 20px; } }
        #productsList .article a .red p,
        .productsList .article a .red p {
          font-size: 13px;
          margin: 0; }
          #productsList .article a .red p.smallText,
          .productsList .article a .red p.smallText {
            font-size: 11px; }
          @media (max-width: 720px) {
            #productsList .article a .red p,
            .productsList .article a .red p {
              font-size: 11px; } }
        #productsList .article a .red:before,
        .productsList .article a .red:before {
          content: "";
          width: 1px;
          height: 40px;
          background-color: #eeeeee;
          position: absolute;
          left: 0;
          top: 20px; }
      #productsList .article a .red + p.smallText,
      #productsList .article a p.smallText:last-of-type,
      .productsList .article a .red + p.smallText,
      .productsList .article a p.smallText:last-of-type {
        order: 10;
        line-height: 1;
        margin: 0;
        width: calc(100% - 630px);
        width: -webkit-calc(100% - 630px);
        text-align: left;
        position: absolute;
        left: 630px;
        bottom: 10px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        height: fit-content; }
        @media (max-width: 720px) {
          #productsList .article a .red + p.smallText,
          #productsList .article a p.smallText:last-of-type,
          .productsList .article a .red + p.smallText,
          .productsList .article a p.smallText:last-of-type {
            font-size: 11px; } }
        @media (min-width: 721px) and (max-width: 1280px) {
          #productsList .article a .red + p.smallText,
          #productsList .article a p.smallText:last-of-type,
          .productsList .article a .red + p.smallText,
          .productsList .article a p.smallText:last-of-type {
            font-size: 12px;
            flex: 1;
            padding: 0 0 0 10px;
            width: calc(100% - 520px);
            width: -webkit-calc(100% - 520px);
            height: 40px;
            top: 35px;
            left: 520px; } }
      #productsList .article a:hover,
      .productsList .article a:hover {
        border: 1px solid #ED1C24;
        z-index: 2; }

/*# sourceMappingURL=products_list.css.map */