.services li .item { padding: 4px; font-size: 20px; width: 300px; border-color: transparent; margin-right: auto !important; display: block; text-align: left; border-left-width: 3px; border-left-style: solid; border-color: transparent; } .services { position: fixed; left: 0; bottom: 0; right: 0; top: 150px; padding-top: 50px; } .services li { color: transparent; margin-top: 5px; margin-bottom: 5px; } .services li .item a { color: white !important; text-decoration: none; transition: color 200ms; } .services li.selected .item a { text-decoration: none; } .services:not(.services-settings) li.selected .item { background-color: rgba(0, 255, 153, 0.25); backdrop-filter: blur(10px); border-radius: 10px; animation-direction: alternate-reverse; position: relative; z-index: 9999999999; animation-duration: 3s; animation-name: border-overlay; animation-fill-mode: both; animation-iteration-count: infinite; } .services.services-settings li.selected .item { border-color: #00ff99; background-color: rgba(0, 255, 153, 0.25); animation-direction: alternate-reverse; animation-duration: 3s; animation-name: border-overlay2; animation-fill-mode: both; animation-iteration-count: infinite; border-top-right-radius: 10px; border-bottom-right-radius: 10px; } @keyframes border-overlay { 0% { background-color: rgba(0, 255, 102, 0.25); } 100% { background-color: rgba(0, 204, 255, 0.25); } } @keyframes border-overlay2 { 0% { border-color: #00ff66; background-color: rgba(0, 255, 102, 0.25); } 100% { border-color: #00ccff; background-color: rgba(0, 204, 255, 0.25); } } .services li .item { margin-left: 12.5px; transition: margin-left 200ms, background-color 200ms, border 200ms; } .services li .help { color: white; margin-left: 5px; display: inline-block; font-size: 12px; position: relative; top: -2.5px; opacity: 0; transition: opacity 200ms; } .services li .help.exit { color: #ff6969; } .services li.selected .help { opacity: 1; } #copyright { color: rgba(255, 255, 255, .5); position: fixed; bottom: 30px; right: 30px; text-align: right; font-size: 12px; } .setting-status { float: right; } #notice { color: white; position: fixed; top: 20px; right: 20px; width: 180px; text-align: right; font-size: 14px; } #scroll { display: block; text-align: center; color: white; padding-top: 100vh; padding-bottom: 100vh; } .cred-title { color: yellow; } .cred-content { color: white; } .technical { color: cyan; } .item-icon { filter: invert(1); vertical-align: middle; }