body{     background: #edf1f5;     margin-top:20px; } .card {     position: relative;     display: flex;     flex-direction: column;     min-width: 0;     word-wrap: break-word;     background-color: #fff;     background-clip: border-box;     border: 0 solid transparent;     border-radius: 0; } .card {     margin-bottom: 30px; } .card-body {     flex: 1 1 auto;     padding: 1.57rem; }   .note-has-grid .nav-link {      padding: .5rem  }   .note-has-grid .single-note-item .card {      border-radius: 10px  }   .note-has-grid .single-note-item .favourite-note {      cursor: pointer  }   .note-has-grid .single-note-item .side-stick {      position: absolute;      width: 3px;      height: 35px;      left: 0;      background-color: rgba(82, 95, 127, .5)  }   .note-has-grid .single-note-item .category-dropdown.dropdown-toggle:after {      display: none  }   .note-has-grid .single-note-item .category [class*=category-] {      height: 15px;      width: 15px;      display: none  }   .note-has-grid .single-note-item .category [class*=category-]::after {      content: "\f0d7";      font: normal normal normal 14px/1 FontAwesome;      font-size: 12px;      color: #fff;      position: absolute  }   .note-has-grid .single-note-item .category .category-business {      background-color: rgba(44, 208, 126, .5);      border: 2px solid #2cd07e  }   .note-has-grid .single-note-item .category .category-social {      background-color: rgba(44, 171, 227, .5);      border: 2px solid #2cabe3  }   .note-has-grid .single-note-item .category .category-important {      background-color: rgba(255, 80, 80, .5);      border: 2px solid #ff5050  }   .note-has-grid .single-note-item.all-category .point {      color: rgba(82, 95, 127, .5)  }   .note-has-grid .single-note-item.note-business .point {      color: rgba(44, 208, 126, .5)  }   .note-has-grid .single-note-item.note-business .side-stick {      background-color: rgba(44, 208, 126, .5)  }   .note-has-grid .single-note-item.note-business .category .category-business {      display: inline-block  }   .note-has-grid .single-note-item.note-favourite .favourite-note {      color: #ffc107  }   .note-has-grid .single-note-item.note-social .point {      color: rgba(44, 171, 227, .5)  }   .note-has-grid .single-note-item.note-social .side-stick {      background-color: rgba(44, 171, 227, .5)  }   .note-has-grid .single-note-item.note-social .category .category-social {      display: inline-block  }   .note-has-grid .single-note-item.note-important .point {      color: rgba(255, 80, 80, .5)  }   .note-has-grid .single-note-item.note-important .side-stick {      background-color: rgba(255, 80, 80, .5)  }   .note-has-grid .single-note-item.note-important .category .category-important {      display: inline-block  }   .note-has-grid .single-note-item.all-category .more-options,  .note-has-grid .single-note-item.all-category.note-favourite .more-options {      display: block  }   .note-has-grid .single-note-item.all-category.note-business .more-options,  .note-has-grid .single-note-item.all-category.note-favourite.note-business .more-options,  .note-has-grid .single-note-item.all-category.note-favourite.note-important .more-options,  .note-has-grid .single-note-item.all-category.note-favourite.note-social .more-options,  .note-has-grid .single-note-item.all-category.note-important .more-options,  .note-has-grid .single-note-item.all-category.note-social .more-options {      display: none  }   @media (max-width:767.98px) {      .note-has-grid .single-note-item {          max-width: 100%      }  }   @media (max-width:991.98px) {      .note-has-grid .single-note-item {          max-width: 216px      }  }