.lgcomment {
  margin-top: 50px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}


#avis_block {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;

  @media screen and (max-width: 1210px) {
    flex-direction: column;
    justify-content: center;
    padding: 0 15px;
    align-items: center;
  }

  & .title {
    font-size: 2rem;
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 12px;
    text-transform: capitalize;
  }

  & .comment {
    font-size: 1.3rem;
  }
 

} 

.content-button {
  width: 100%;
}

#more_less {
  width: 100%;
  display: flex;
  justify-content: center;

  button {
    max-width: 250px;
    margin: 0 10px;
    position: relative;
    background-color: inherit;
    border: none;
    display: flex;
    justify-content: center;
    align-content: center;

    &:hover {
      span {
        &:before {
          background-color: #f5c778;
          color: #343434;
        }

      }
    }

    &:before {
      content: "";
      position: absolute;
      bottom: -8px;
      width: 100%;
      background-color: #343434;
      height: 1px;

    }

    span {
      &:before {
        content: "";
        background-color: #343434;
        width: 20px;
        height: 20px;
        position: absolute;
        border-radius: 50%;
        z-index: -1;
        top: 2px;
        transition: 0.3s all ease;

      }

      color: #fff;
      display: flex;
      justify-content: center;
      align-content: center;

      margin-left: 5px;
      width: 20px;
      height: 20px;
      align-items: center;
      transition: 0.3s all ease;
      font-weight: bold;
      position: relative;
      z-index: 1;
      margin-top: -1px;
    }
  }

  margin-bottom: 10px;
}
 



.productComment {
  margin: 0 1% 25px 1%;
  display: flex;
  /*justify-content: center;*/
  background-color: #fffafa;
  border-radius: 5px;
  box-shadow: 0 0 6px 0 rgba(249, 190, 169, 0.29);
  width: 30%;
  flex-direction: column;
  padding: 15px;

  @media screen and (max-width: 1210px) {
    width: 100%;
    max-width: 800px;
  }
}

.line_avis {
  width: 100%;
  display: flex;
  justify-content: flex-start;

  & .nick {
    text-align: left;
    text-transform: capitalize;
  }

  & .date {
    font-size: 1.3rem;
    margin-left: 20px;
  }


}


/*.lgcomment .productComment .nick {
  font-size: .86rem;
  color: #222222;
}

.lgcomment .productComment .date {
  font-size: .72rem;
  color: #7a7a7a;
}

.lgcomment .productComment .title {
  font-size: 1rem;
  color: #222222;
  font-weight: bold;
  margin-bottom: 10px;
}

.lgcomment .productComment .comment {
  font-size: 0.95rem;
  color: #555555;
}

.lgcomment .productComment .answer {
  padding-left: 50px;
  color: #2fb5d2;
  font-style: italic;
  margin-top: 10px;
}

.lgcomment_summary {
  border-bottom: 3px solid #2fb5d2;
  display: table;
  padding: 20px 25px;
  font-family: "Open Sans", sans-serif;
  width: 100%;
  background: none repeat scroll 0 0 #FFFFFF;
  color: #777777;
}

.commentfilter {
  float: left;
  width: 12%;
  cursor: pointer;
}

.commentfiltertitle {
  float: left;
  width: 100%;
  cursor: pointer;
}

.commentfilterreset {
  float: left;
  width: 14%;
  cursor: pointer;
}

.comment_anchor {
  cursor: pointer;
}*/

/*@media (max-width: 768px) {*/
/*.productComment table,*/
/*.productComment td,*/
/*.productComment tr {*/
/*display: block;*/
/*}*/
/*}*/

/*@media (max-width: 768px) {
  .lgcomment .productComment .info-block {
    text-align: center;
  }

  .lgcomment .productComment .nick {
    font-size: 1rem;
  }

  .lgcomment .productComment .date {
    font-size: .90rem;
  }

  .lgcomment .productComment .content-block {
    border: none;
    border-bottom: 1px solid #DDDDDD;
    margin-top: 20px;
    padding-bottom: 25px;
  }

  .commentfilter {
    float: none;
    width: 70%;
    cursor: pointer;
  }

  .commentfilter {
    float: none;
    width: 70%;
    margin-right: 0%;
    cursor: pointer;
  }

  .commentfilterreset {
    float: none;
    width: 70%;
    cursor: pointer;
  }
}

.comment_anchor {
  cursor: pointer;
}
*/