@keyframes lightthrob { from { opacity: 1; } to { opacity: 0.5; } } @font-face { font-family: Coda; src: local("Coda"), url("fonts/Coda-Regular.ttf"); } #login-panel { font-family: 'Coda', mono; position: absolute; left: 0; top: calc(50% - 1rem); width: 100%; animation: alternate ease-in infinite 2s lightthrob; } #login-panel * { box-sizing: border-box; } #login-panel #greeting { display: none; } #login-panel > h1 { position: absolute; text-align: right; width: calc(50% - 1rem); } #login-panel #user-display { text-transform: lowercase; } #login-panel .fa-user-circle { display: none; } #login-panel input[type=password] { width: calc(50% - 1rem); position: absolute; right: 0; border: none; } #login-panel input[type=password]::placeholder { opacity: 0; } #power-panel, #session-panel { opacity: 0; transition: opacity 1s; } #power-panel:hover, #session-panel:hover { opacity: 1; } #clock-panel { visibility: hidden; } #ui-container { background-color: black; } #ui-container.white { background-color: white; } #ui-container.white #login-panel { color: black; } #ui-container.white input[type=password] { color: black; } /*# sourceMappingURL=style.css.map */