YTG Chat CSS - First Concept

::-webkit-scrollbar {
    display: none;
}

body {
    background-color: rgba(0,0,0,0);
    margin: 0;
    overflow: hidden;
    color: #fff !important;
    width: 100%;
}

.live-chat-page {
    background: rgba(0,0,0,0);
}

.live-chat-widget #comments-scroller {
    border: none;
    -webkit-mask-image: -webkit-gradient(linear, left 20%, left top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
}

#live-comments-controls {
    display: none;
}

@-webkit-keyframes FadeOut {
  0%, 100% {
    opacity: 0;
  }
  5%, 95% {
    opacity: 1;
  }
}

.live-chat-widget .comment {
    width: 90%;
    background: rgba(0,0,0,0.3) !important;
    margin-bottom: 10px;
    border: 2px solid rgba(255,255,255,0.5);
    border-radius: 10px;
    -webkit-animation-name: FadeOut;
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 10s;
    -webkit-animation-fill-mode: both;
}

.live-chat-widget .accent-bar {
    display: none;
}

.live-chat-widget .comment .author a {
    font-size: 1.2em;
    color: #56E8AB !important;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

.live-chat-widget .comment-text {
    font-size: 1.2em;
    color: #fff;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}