@import '../../variables.scss';

.container {
  font-size: 14px;
  color: $white;
  font-family: 'Roboto';
  letter-spacing: 1.5px;

  li {
    display: inline-block;
    margin: 5px 0;
    width: 25%;
    font-family: 'Courier';

    section {
      display: inline-block;
      vertical-align: middle;
      color: $white;

      &:nth-child(1) {
        width: 15%;
        text-align: center;
        opacity: 0.5;
      }

      &:nth-child(2) {
        width: calc(85% - 10px);
        margin: 0 5px;
      }
    }
  }

  .word {
    margin: 0 3px;
    background-color: #1c1e26;
    outline: 0;
    border: none;
    padding: 10px;
    color: $white;

    &.valid {
      color: $green;
    }

    &.invalid {
      color: $red;
    }
  }
}