.desktop { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: fixed; top: 0; left: 0; right: 0; bottom: 0; } .window-area, .task-bar { position: relative; display: block; } .window-area { height: 100%; position: relative; } .task-bar { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; height: 42px; background-color: #053046; } .task-bar .task-bar-section { height: 100%; width: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .task-bar .task-bar-item { position: relative; display: block; width: 48px; height: 40px; margin: 0; padding: 0; background-color: transparent; border: none; cursor: default; color: #ffffff; vertical-align: middle; text-align: center; min-width: 0; outline: none; } .task-bar .task-bar-item * { display: block; margin: 8px 12px; height: 24px; width: 24px; font-size: 18px; line-height: 24px; vertical-align: middle; } .task-bar .task-bar-item:hover { background-color: rgba(255, 255, 255, 0.1); } .task-bar .task-bar-item.active { background-color: rgba(255, 255, 255, 0.3); } .task-bar .task-bar-item.started::after { display: block; content: ""; position: absolute; bottom: 0; left: 5px; right: 5px; height: 3px; background-color: #5ebdec; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .task-bar .task-bar-item.started:hover::after { left: 1px; right: 1px; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .task-bar .task-bar-item:active, .task-bar .task-bar-item.focus, .task-bar .task-bar-item:focus { -webkit-box-shadow: none!important; box-shadow: none!important; } .task-bar.icons-small { height: 30px; padding: 0; } .task-bar.icons-small .task-bar-item { width: 16px; height: 16px; margin: 0 8px; } .task-bar a.task-bar-item { color: #ffffff; } .task-bar a.task-bar-item:hover { color: #ffffff; } .start-menu { padding: 1px; border-top: 1px rgba(255, 255, 204, 0.1) solid; border-right: 1px rgba(255, 255, 204, 0.1) solid; bottom: 100%; background-color: #004d6f; color: #ffffff; display: block; position: absolute; float: left; width: auto; margin: 0; list-style: none inside none; z-index: 1000; -webkit-box-shadow: 2px -2px 5px 0px rgba(0, 0, 0, 0.75); box-shadow: 2px -2px 5px 0px rgba(0, 0, 0, 0.75); } .start-menu-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .start-menu .sys-buttons { width: 48px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .start-menu .explorer { width: 220px; } .ani-swoopInTop { -webkit-animation-name: swoopInTop; animation-name: swoopInTop; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; } .ani-swoopOutTop { -webkit-animation-name: swoopOutTop; animation-name: swoopOutTop; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; } @-webkit-keyframes swoopInTop { 0% { opacity: 0; -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: scaleY(1.5) translate3d(0, -400px, 0); transform: scaleY(1.5) translate3d(0, -400px, 0); } 40% { opacity: 1; -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); -webkit-transform: scaleY(1.2) translate3d(0, 0, 0); transform: scaleY(1.2) translate3d(0, 0, 0); } 65% { -webkit-transform: scaleY(1) translate3d(0, 20px, 0); transform: scaleY(1) translate3d(0, 20px, 0); } 100% { -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); -webkit-transform: scaleY(1) translate3d(0, 0, 0); transform: scaleY(1) translate3d(0, 0, 0); } } @keyframes swoopInTop { 0% { opacity: 0; -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: scaleY(1.5) translate3d(0, -400px, 0); transform: scaleY(1.5) translate3d(0, -400px, 0); } 40% { opacity: 1; -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); -webkit-transform: scaleY(1.2) translate3d(0, 0, 0); transform: scaleY(1.2) translate3d(0, 0, 0); } 65% { -webkit-transform: scaleY(1) translate3d(0, 20px, 0); transform: scaleY(1) translate3d(0, 20px, 0); } 100% { -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); -webkit-transform: scaleY(1) translate3d(0, 0, 0); transform: scaleY(1) translate3d(0, 0, 0); } } @-webkit-keyframes swoopOutTop { 0% { -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); -webkit-transform: scaleY(1) translate3d(0, 0, 0); transform: scaleY(1) translate3d(0, 0, 0); } 40% { opacity: 1; -webkit-transform: scaleY(1) translate3d(0, 20px, 0); transform: scaleY(1) translate3d(0, 20px, 0); } 60% { -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); -webkit-transform: scaleY(1.2) translate3d(0, 0, 0); transform: scaleY(1.2) translate3d(0, 0, 0); } 100% { opacity: 0; -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: scaleY(1.5) translate3d(0, -400px, 0); transform: scaleY(1.5) translate3d(0, -400px, 0); } } @keyframes swoopOutTop { 0% { -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); -webkit-transform: scaleY(1) translate3d(0, 0, 0); transform: scaleY(1) translate3d(0, 0, 0); } 40% { opacity: 1; -webkit-transform: scaleY(1) translate3d(0, 20px, 0); transform: scaleY(1) translate3d(0, 20px, 0); } 60% { -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); -webkit-transform: scaleY(1.2) translate3d(0, 0, 0); transform: scaleY(1.2) translate3d(0, 0, 0); } 100% { opacity: 0; -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: scaleY(1.5) translate3d(0, -400px, 0); transform: scaleY(1.5) translate3d(0, -400px, 0); } } @font-face { font-family: 'Discordinated'; src: url('https://kckarnige.github.io/femboi_owo/DISCORDINATED.woff2') format('woff2'), url('https://kckarnige.github.io/femboi_owo/DISCORDINATED.woff') format('woff'); font-weight: normal; font-style: normal; } :root { --window-buttons: var(--header-secondary); --cord-color: var(--header-primary); --armcord-color: #7289da; --titlebar-color: var(--background-tertiary); } .base-3dtUhz, .sidebar-2K8pFh { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; overflow: hidden; border-top-left-radius: 8px; } div.menubar[role="menubar"] { width: 0px; } .window-title:after { content: "Cord"; color: var(--cord-color) !important; font-weight: normal; font-size: 14px; font-family: Discordinated; } .window-title:before { content: "ARM"; color: var(--armcord-color); font-weight: normal; font-size: 14px; font-family: Helvetica, sans-serif; } .window-title { font-size: 0px !important; margin-left: initial !important; transform: translate(10px, 2px); } .titlebar { background: var(--titlebar-color) !important; font-family: Verdana, Geneva, Tahoma, sans-serif; } .titlebar .window-controls-container .window-icon { background: var(--window-buttons) !important; } .notice-3bPHh-.colorDefault-22HBa0 { display: none; } .window-caption { background:#2c2f33 }