body { margin: 0; padding: 15px 20px; min-height: 99%; width: 100%; min-width: 550px; color: #519975; background: #211D1B; font-family: cursor, monospace; overflow-x: hidden; } ::selection { color: #211830; background-color: #519975; } ::-moz-selection { color: #211830; background-color: #519975; } textarea { left: -1000px; position: absolute; } b { font-weight: bold; text-decoration: underline; } /* Cursor Start */ .cursor { font-size: 12px; color: #73ABAD; background-color: #73ABAD; position: relative; opacity: 1; height: 1.5em; width: 10px; max-width: 10px; transform: translateY(4px); overflow: hidden; text-indent: -5px; display: inline-block; text-decoration: blink; animation: blinker 1s linear infinite; } @keyframes blinker { 50% { opacity: 0; } } #command { cursor: text; height: 50px; color: #73ABAD; } #liner { line-height: 1.3em; margin-top: -2px; animation: show 0.5s ease forwards; animation-delay: 1.2s; opacity: 0; } #liner::before { color: #519975; content: "visitor@asadqi.com:~$"; } #liner.password::before { content: "Password:"; } #liner.who::before { content: "Please specify a name:"; } @keyframes show { from { opacity: 0; } to { opacity: 1; } } /* Cursor End */ p { display: block; line-height: 1.3em; margin: 0; overflow: hidden; white-space: nowrap; margin: 0; letter-spacing: 0.05em; animation: typing 0.5s steps(30, end); } .no-animation { animation: typing 0 steps(30, end); } .margin { margin-left: 20px; } @keyframes typing { from { width: 0; } to { width: 100%; } } .index { color: #DCDCCC; } .color2 { color: #B89076; } .command { color: #73ABAD; text-shadow: 0 0 5px #73ABAD; } .error { color: #B89076; } .white { color: #fff; } .inherit, a { color: #9C8394; } a { text-decoration: inherit; } a:hover { background: #73ABAD; color: #211830; } a:focus { outline: 0; }