.folders-wrapper {
  /*height: 100vh;*/
  background-color: #f7f8f9;
  padding: 20px;
  overflow: auto;
}

.main-icon img {
  width: 70px;
}
::-webkit-scrollbar {
  /* chrome based */
  width: 0px; /* ширина scrollbar'a */
  background: transparent; /* опционально */
}

.folders-title {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #cccccc;
  padding: 0px 20px;
  padding-bottom: 20px;
  margin: 0px -20px;
}

.folders-title .title {
  padding-left: 20px;
}

.folders-title .left {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.folders-title .right {
  cursor: pointer;
}

.left-back {
  cursor: pointer;
}

.left-back i {
  color: #979eab;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
  width: 14px;
}

.advice {
  padding: 10px;
  font-size: 14px;
  background-color: #ececec;
  color: grey;
  margin-top: 30px;
}
.user-folders-block {
  background: white;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 10px 10px;
}

.user-folders-block .c-chat {
  width: 16px;
  text-align: center;
  cursor: pointer;
}

/*.user-folders-block {*/
/*  cursor: pointer;*/
/*}*/

.user-social-title,
.media-title {
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 10px;
}
.user-folder {
  margin-top: 30px;
}

.user-folder-link {
  padding: 10px 0px;
  font-size: 14px;
  cursor: pointer;
}

.user-folders-blocks {
  background-color: #fff;
  max-height: 360px;
  overflow: auto;
}

.comp .user-folders-blocks {
  max-height: none;
  height: calc(100vh - 390px);
  min-height: 121px;
}

.user-folders-blocks ul li {
  list-style: none;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: #8d8d8d;
  transition: 0.3s ease;
}

.list-item-wrapper:hover {
  color: #4c567d;
  border-bottom: 1px solid #4c567d;
}

.list-item-wrapper {
  display: flex;
  width: 100%;
  border-bottom: 1px solid #ccc;
  padding: 10px;
  align-items: center;
  transition: 0.3s ease;
  cursor: pointer;
}

.list-item-wrapper input {
  margin-right: 20px;
  margin-left: 10px;
  font-size: 16px;
}

.list-folders {
  display: flex;
  justify-content: space-between;
}

.delete-folder {
  width: 40px;
  text-align: center;
  border-bottom: 1px solid #ccc;
  padding: 10px;
  transition: 0.3s ease;
  font-size: 16px;
}

.delete-folder:hover {
  border-bottom: 1px solid darkred;
  color: darkred;
}

.user-folders {
  margin: 30px 0px;
}

.user-folders-title {
  margin-bottom: 10px;
}

.folders-content {
  height: 100vh;
  overflow: auto;
}

.user-social-title {
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 10px;
  color: #4c567d;
}

.user-social-name {
  font-size: 14px;
  font-weight: 600;
  color: #8d8d8d;
}

/** creating folder */
.creating-folder-block {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.creating-folder-block form {
  width: 100%;
}

.creating-folder-block i {
  color: #4c567d;
}
.creating-folder-block input {
  border: none;
  padding: 10px;
  outline: none;
  width: 100%;
}

.icon-new-folder {
  width: 20px;
  text-align: center;
}

.icon-new-folder i {
  color: #bacbe3;
  transition: 0.3s ease;
}
.icon-new-folder i:hover {
  color: #6328f8;
}

.main-icon {
  margin-top: 30px;
  text-align: center;
}

.main-icon i {
  font-size: 56px;
}