.btn-help {
  min-width: 1rem !important;
  border: none;
  border-radius: 50%;
}

.literal-list-item {
  --SHAPE: landscape;
}
.literal-list-item.circle {
  --SHAPE: circle;
  text-align: -webkit-center;
}
.literal-list-item.circle .image {
  border-radius: 50%;
}
.literal-list-item.square {
  --SHAPE: square;
}
.literal-list-item.portrait {
  --SHAPE: portrait;
}
.literal-list-item .grow-box {
  position: relative;
}
.literal-list-item .grow-box .image {
  position: absolute;
  background: #1D1C1D;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.literal-list-item .grow-box .image-selected {
  position: absolute;
  background: #1D1C1D;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border: 4px solid #0066FF;
}
.literal-list-item-text {
  padding-top: 2rem;
}
.literal-list-item-text-list-view {
  padding-top: 2rem;
  padding-left: 1rem;
}
.literal-list-item .item-text {
  color: white;
}
.literal-list-item.landscape .grow-box {
  width: 100%;
  padding-bottom: 56.25%;
}
.literal-list-item.circle .grow-box {
  width: 100%;
  padding-bottom: 100%;
}
.literal-list-item.square .grow-box {
  width: 100%;
  padding-bottom: 100%;
}
.literal-list-item.portrait .grow-box {
  width: 100%;
  padding-bottom: 150%;
}
.literal-list-item .action-indicator {
  color: white;
  position: absolute;
  border-radius: 50%;
  width: 35px;
  padding-top: 35px;
  right: 0;
}
.literal-list-item .action-indicator.select {
  background: #0066FF;
  top: 0;
}
.literal-list-item .action-indicator.edit {
  background: #0066FF;
  bottom: 0;
}
.literal-list-item .action-indicator.delete {
  background: #E73200;
  top: 0;
}
.literal-list-item .action-indicator svg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  padding: 25%;
}

.literal-list {
  --GRID-GAP: 20px;
}
.literal-list.max-cols-6 {
  --MAX_COLS: 6;
}
.literal-list.max-cols-4 {
  --MAX_COLS: 4;
}
.literal-list.max-cols-8 {
  --MAX_COLS: 8;
}
.literal-list.min-cols-1 {
  --MIN_COLS: 1;
}
.literal-list.min-cols-2 {
  --MIN_COLS: 2;
}
.literal-list.min-cols-3 {
  --MIN_COLS: 3;
}
.literal-list.min-cols-6 {
  --MIN_COLS: 6;
}
.literal-list {
  --COLS: max(var(--MIN_COLS), calc(var(--MAX_COLS) - 4));
}
@media (min-width: 576px) {
  .literal-list {
    --COLS: max(var(--MIN_COLS), calc(var(--MAX_COLS) - 3));
  }
}
@media (min-width: 768px) {
  .literal-list {
    --COLS: max(var(--MIN_COLS), calc(var(--MAX_COLS) - 2));
  }
}
@media (min-width: 992px) {
  .literal-list {
    --COLS: max(var(--MIN_COLS), calc(var(--MAX_COLS) - 1));
  }
}
@media (min-width: 1200px) {
  .literal-list {
    --COLS: var(--MAX_COLS);
  }
}
.literal-list {
  --HALF_GAP: calc(var(--GRID-GAP) / 2);
  --DIVIDED_WIDTH: calc(100% / var(--COLS));
}
@media (max-width: 576px) {
  .literal-list.slider {
    --DIVIDED_WIDTH: calc(100% / var(--COLS) - 2%);
  }
}
.literal-list {
  position: relative;
}
.literal-list .see-all {
  text-align: right;
  color: #0066FF;
  cursor: pointer;
}
.literal-list .see-all-icon {
  height: 2rem;
  width: 2rem;
  font-size: 1rem;
  background-color: #201F20;
  text-align: center;
  border-radius: 4px;
  padding-top: 3px;
}
.literal-list .see-all-icon-active {
  background-color: #424242 !important;
  color: white !important;
}
.literal-list .top-action-bar {
  margin-bottom: 1.8em;
}
.literal-list .top-action-bar #titles {
  margin-top: 0.2rem;
}
.literal-list {
  margin-bottom: 5%;
}
.literal-list .slider-arrow {
  display: none;
}
.literal-list .list-track::-webkit-scrollbar {
  display: none;
}
.literal-list .list-track {
  -ms-overflow-style: none;
}
.literal-list .list-track .literal-list-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #1D1C1D;
  padding: 1.33em;
  margin-bottom: 10px;
}
.literal-list .list-track .img-wrapper {
  width: 20%;
}
.literal-list.grid .list-track {
  margin-left: calc(-1 * var(--HALF_GAP));
  margin-right: calc(-1 * var(--HALF_GAP));
  display: grid;
  grid-template-columns: repeat(var(--COLS), var(--DIVIDED_WIDTH));
}
.literal-list.grid .list-track .img-wrapper {
  width: 100%;
}
.literal-list.grid .list-track .literal-list-item {
  display: block;
  background-color: transparent;
  padding: 0;
  margin: 0;
  position: relative;
}
.literal-list.grid .list-track .literal-list-item .grow-box .image {
  width: calc(100% - var(--GRID-GAP));
  height: calc(100% - var(--GRID-GAP));
  top: var(--HALF_GAP);
  left: var(--HALF_GAP);
  transition-property: width, height, top, left;
  transition-duration: 0.15s;
  transition-timing-function: ease;
}
.literal-list.grid .list-track .literal-list-item .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  opacity: 0;
  padding: 10px;
  transition-property: opacity;
  transition-duration: 0.15s;
  transition-timing-function: ease;
  font-size: 14px;
  text-align: center;
}
.literal-list.grid .list-track .literal-list-item .buttons {
  visibility: hidden;
  margin-top: 10px;
}
.literal-list.grid .list-track .literal-list-item:hover .image {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.literal-list.grid .list-track .literal-list-item:hover .buttons {
  visibility: visible;
  width: 100%;
}
.literal-list.grid .list-track .literal-list-item:hover .buttons button {
  width: 100%;
}
.literal-list.grid .list-track .literal-list-item:hover .overlay {
  opacity: 1;
}
.literal-list.grid.slider .list-track {
  grid-auto-flow: column;
  grid-auto-columns: var(--DIVIDED_WIDTH);
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
}
.literal-list.grid.slider .list-track:not(.animating) .literal-list-item {
  scroll-snap-align: start;
}
@media (min-width: 576px) {
  .literal-list.grid.slider .slider-arrow {
    display: none;
  }
  .literal-list.grid.slider .slider-arrow.visible {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .literal-list.grid.slider .slider-arrow {
    width: 2.66em;
    height: 2.66em;
    background-color: #FFFFFF;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    border: none;
    position: absolute;
    top: calc(50% - 1.33em);
  }
  .literal-list.grid.slider .slider-arrow.go-left {
    left: -1.33em;
  }
  .literal-list.grid.slider .slider-arrow.go-right {
    right: -1.33em;
  }
}

@media screen and (max-width: 600px) {
  .literal-list__dropdown {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 400px) {
  .chracter-btn__group {
    width: 100% !important;
    justify-content: flex-end;
  }
  .literal-list-item-sm {
    height: 6rem !important;
  }
  .literal-list-item-text {
    padding-top: 0rem;
  }
}