.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;
  --COLS: max(var(--MIN_COLS), calc(var(--MAX_COLS) - 4));
  --HALF_GAP: calc(var(--GRID-GAP) / 2);
  --DIVIDED_WIDTH: calc(100% / var(--COLS));
  position: relative;
  margin-bottom: 5%; }
  .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; }
  @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); } }
  @media (max-width: 576px) {
    .literal-list.slider {
      --DIVIDED_WIDTH: calc(100% / var(--COLS) - 2%); } }
  .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 .slider-arrow {
    display: none; }
  .literal-list .list-track {
    -ms-overflow-style: none; }
    .literal-list .list-track::-webkit-scrollbar {
      display: 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: .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: .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;
      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.visible {
        display: flex;
        justify-content: center;
        align-items: center; }
      .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; } }