.window:not([role="tabpanel"]) { position: fixed; z-index:99; min-width: 380px; min-height: 520px; width:max(560px, 50vw); resize: both; overflow-y:scroll; overflow-x:visible; display: flex; flex-flow: column nowrap; justify-content: space-between; } @media (max-width: 600px) { .window:not([role="tabpanel"]) { left: 0; width: calc(100% - 6px); } } .window { flex-grow: 1; flex-shrink: 0; } .window-body { flex-grow: 1; display: flex; flex-flow: column nowrap; } /* tab menu fix */ menu[role="tablist"] > li > a { padding: 6px; margin: 0; } iframe { opacity: 0; position: fixed; left: 100%; } /* Media player */ #album { background: black; width: 100%; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; } #album h1, #album h2 { color: white; margin: 0; } #album h1 { font-size: 2rem; } #album h2 { font-size: 1.5rem; font-weight: normal; } #album img { max-width: 256px; } input[type="range"] { margin: 8px 0; } input[type="range"]::-moz-range-track { background: #aaa; height: 12px; } input[type="range"]::-moz-range-thumb { height: 15px; width: 15px; transform: unset; background: transparent; border: 3px solid lightgray; border-bottom-color: darkgrey; } /* Clippy */ .clippy { position: fixed; z-index:99; right: 5px; bottom: 0px; display: flex; flex-flow: column nowrap; align-items: flex-end; width: 256px; } .clippy .body { background: lightyellow; color: black; padding: 10px; border-radius: 10px; border: 1px solid black; position: relative; } .clippy .body.hide { display: none; } .clippy .body::after { content: ""; position: absolute; bottom: -13px; left: 128px; border-width: 13px 17px 0; border-style: solid; border-color: lightyellow transparent; display: block; width: 0; } .clippy .body::before { content: ""; position: absolute; bottom: -14px; left: 126px; border-width: 14px 19px 0; border-style: solid; border-color: black transparent; display: block; width: 0; } .clippy .body button { background: lightyellow; border: 1px #999 solid; border-radius: 2px; box-shadow: none; margin-top: 5px; } .clippy img { width: 128px; }