
.comments {
    background: #f9f9f9;
    display: flex;
    flex-flow: column;
    padding: 0px;
  }
 
  .commentstitle {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: column;
  }
  
  .commentsclose {
    cursor: pointer;
   font-size: 20px;
   color: lightcoral;
   margin-left: 5px;
   font-weight: bold;
 
   position: absolute;
   right: 10px;
   top: 0px;
  }
 
  .commentstitle h4 {
   font-size: 18px;
   font-style: normal;
   font-weight: 500;
   line-height: 26px;
   color: cornflowerblue;
  }
  .commentstitle p {
   color: gray;
  }
 
  .commentstitle span {
    padding-top: 3px;
  }
 
  .commentslist {
   max-height: 400px;
   overflow: auto;
    background: #fdfdfd;
  }
  .commentslist::-webkit-scrollbar {
   width: 7px;
   background-color: #e8e8e8;
 }
 .commentslist::-webkit-scrollbar-thumb {
   border-radius: 10px;
   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
   background-color: #C1C1C1;
 }
 
  .comments>div:last-of-type {
     margin-top: auto;
   }
 
   .commentsinput input {
     padding: 10px;
     background: white;
     border: 1px solid lightgray;
   }
 
   .msgcomment {
     background: white;
     padding: 7px;
     margin: 10px;
     font-size: 12px;
     color: darkgray;
     border-bottom: 1px solid lightgray;
     /* border-left: 1px solid lightgray; */
     /* border-right: 1px solid lightgray; */
   }
   .msgcomment:last-child {
     /* border-bottom: 1px solid lightgray; */
   }