.display-message {
  height: 100%;
  width: 100%;
  position: relative;
  text-align: center;
  overflow: hidden;

  &.chat-offline {
    .display-message-block {
      height: 100%;
    }
  }

  .display-message-close {
    position: absolute;
    right: 15px;
    top: 15px;

    &:hover {
      cursor: pointer;
      color: $chat-text-inverse;

    }
  }

  .display-message-block {
    width: 100%;
    max-height: 300px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    padding: 15px;

    .dropdown-container {
      margin: auto;
      width: 130px;

    }
  }

  .display-message-title {
    font-size: 1.25rem;
    font-weight: bold;
    margin: 10px 0 15px;

  }

  .display-message-text {
    font-size: 1.125rem;
    margin: 0.5rem 0;

    a:not(.button) {
      cursor: pointer;
      color: $chat-secondary;

      &:hover {
        color: $chat-secondary-dark;
      }

    }

    .button {
      margin-top: 10px;
      display: inline-block;

    }
  }

  .icon-img {
    animation-name: ChatBounceIn;
    animation-duration: 0.75s;
  }

  .disabled-message-icon {
    font-size: 4rem;
  }
}