body { font-family: monospace; } img { image-rendering: crisp-edges; image-rendering: pixelated; } .text_white { color: white; } .text_blue { color: blue; } .text_green { color: green; } .text_red { color: red; } .text_orange { color: orange; } .text_yellow { color: yellow; } .text_pink { color: pink; } .text_cyan { color: cyan; } .text_rainbow { background-color: #fff; background-image: repeating-linear-gradient(to right, red 0% 8%, orange 8% 16%, yellow 16% 24%, green 24% 32%, blue 32% 40%, red 40% 48%, orange 48% 56%, yellow 56% 64%, green 64% 72%, blue 72% 80%, red 80% 88%, orange 88% 96%, yellow 96% 100%); background-size: 40% 40%; background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: rainbow 4s linear infinite; } @keyframes rainbow_alt { 0%, 100% { background-position: 0 0; } 50% { background-position: 400% 0; } } @keyframes rainbow { 0% { background-position: 0 0; } 100% { background-position: 400% 0; } } #client_chatcontainer { filter: none; } @keyframes bg-scrolling { 0% { background-position: 0 0; } 100% { background-position: 5px 5px; } } #client_name { display: none; padding: 0 0.45em; height: 5.2%; min-width: 3.25em; text-justify: distribute; letter-spacing: 0.075em; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAFElEQVQImWNgYGDYjAVTV/A/w2YAfxQSe53wkNkAAAAASUVORK5CYII=) repeat; animation: bg-scrolling 0.2s infinite linear; left: 0; top: 60.4%; border-color: rgba(0, 255, 0, 0.5); border-style: ridge groove groove ridge; border-width: 0.2em; border-radius: 0.2em; position: absolute; z-index: 1; } #client_chat { font-size: 1em; display: none; width: 98.4375%; width: calc(100% - 0.275em); margin: auto; height: 31.25%; border-color: rgba(0, 255, 0, 0.5); border-style: ridge groove groove ridge; border-width: 0.15em; border-radius: 0.3em; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAFElEQVQImWNgYGDYjAVTV/A/w2YAfxQSe53wkNkAAAAASUVORK5CYII=) repeat; animation: bg-scrolling 0.2s infinite linear; top: 66.5%; position: absolute; word-break: keep-all; overflow-wrap: break-word; text-align: left; overflow: hidden; scroll-behavior: smooth; } #client_chat p { padding: 1% 3.13%; margin: 1px; line-height: 97%; } #client_chatwaiting { display: block; right: -6px; bottom: 0.24em; width: 1em; position: absolute; animation: idling 0.4s linear infinite; } @keyframes idling { 0% { right: -4px; } 50% { right: -8px; } 100% { right: -4px; } } #evi_name { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAFElEQVQImWNgYGDYjAVTV/A/w2YAfxQSe53wkNkAAAAASUVORK5CYII=) repeat; animation: bg-scrolling 0.2s infinite linear; } #evi_desc { flex: 1 auto; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAFElEQVQImWNgYGDYjAVTV/A/w2YAfxQSe53wkNkAAAAASUVORK5CYII=) repeat; animation: bg-scrolling 0.2s infinite linear; } #client_menu { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAFElEQVQImWNgYGDYjAVTV/A/w2YAfxQSe53wkNkAAAAASUVORK5CYII=) repeat; animation: bg-scrolling 0.2s infinite linear; overflow-y: auto; height: 100%; } @keyframes shutter-effect { 0% { background-position: 0 0; } 100% { background-position: 0 4px; } } #client_iccontrols { width: 100%; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAFElEQVQImWNgYGDYjAVTV/A/w2YAfxQSe53wkNkAAAAASUVORK5CYII=) repeat; animation: bg-scrolling 0.2s infinite linear; } .menu_text { color: #7b2900; background-color: #f7f7f7; border-radius: 3px; padding: 0 4px; } .menu_icon { display: inline-block; width: 1.5em; height: 1.5em; background-color: black; border: 2px ridge green; border-radius: 2px; margin-bottom: 2px; } .client_button { min-width: 6em; margin: 1px; padding: 6px 2px; cursor: pointer; text-align: center; color: green; background-color: #000; border: green solid 1px; } #client_log { color: white; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAFElEQVQImWNgYGDYjAVTV/A/w2YAfxQSe53wkNkAAAAASUVORK5CYII=) repeat; animation: bg-scrolling 0.2s infinite linear; }