@font-face { font-family: "Cyberfall"; src: url(https://dr0p.it/Clgl.otf) format("opentype"); } body { margin: 0em auto 3em auto; background-color: #0B111D; color: #fff; font-family: "Cyberfall"; font-size: 12px; } a { color: #00ffed; } a:hover { color: #00b4ef; } .return { text-align: center; border-bottom: 2px solid #154d71; width: 100%; margin: 0 auto; background: #121323; top: 0; } .controls { text-align: center; color: #00ffed; width: 888px; margin: 0 auto; background: #121323; padding-top: 0; margin-top: 35px; border: 2px solid #154d71; } .navbar { margin: 0 auto; width: 100%; border: 0; padding-top: 5px; padding-bottom: 5px; font-weight: bold; position: fixed; overflow: visible; z-index: 999; background-color: #0b111d; border-bottom: 2px solid #207ea4; text-align: center; top: 0; } .medium, .thumbnail { display: flex; justify-content: center; margin-top: 5px; background: #121323; border: 2px solid #154d71; padding: 5px; } .panel { margin-bottom: 0; background-color: rgb(18, 19, 35); border: 2px solid #154D71; border-radius: 0px; padding-left: 10px; padding-right: 10px; width: 25%; position: relative; min-height: 1px; } input, select, textarea { border: 1px double #00edff; background: #282A2E; color: #f1e3ce; font-family: 'Hack', monospace, sans-serif; font-size: 80%; } .thumb { border: 2px solid #207ea4; } .plyr--video .plyr__controls { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 0px 0px 0px; background: rgb(11, 17, 29); border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; color: #00edff; transition: opacity .3s cubic-bezier(0.12, 0.63, 0.25, 1); } .plyr--audio .plyr__controls button.tab-focus:focus, .plyr--audio .plyr__controls button:hover, .plyr__play-large { background: #0b111d; color: #00edff; border-radius: 0; } .plyr__progress--played, .plyr__volume--display { z-index: 1; color: #00edff; background: 0 0; transition: none; } .plyr input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; margin-top: -4px; position: relative; height: 16px; width: 16px; background: #0b111d; border: 1px solid #00edff; border-radius: 100%; transition: background .2s ease,border .2s ease,transform .2s ease; box-shadow: 0 1px 1px rgba(0,0,0,.15), 0 0 0 1px rgba(0,0,0,.15); box-sizing: border-box; } .plyr input[type=range]:active::-webkit-slider-thumb { background: #0b111d; border-color: #00edff; transform: scale(1.25) } /* Feuerfick */ .plyr input[type="range"]::-moz-range-thumb { position: relative; height: 16px; width: 16px; background: #0b111d; border: 2px solid #00edff; border-radius: 100%; transition: background .2s ease, border .2s ease, transform .2s ease; box-shadow: 0 1px 1px rgba(0, 0, 0, .15), 0 0 0 1px rgba(0, 0, 0, .15); box-sizing: border-box; } .plyr input[type=range]:active::-moz-range-thumb { background: #0b111d; border-color: #00edff; transform: scale(1.25) } .plyr--video .plyr__controls button.tab-focus:focus, .plyr--video .plyr__controls button:hover { background: #154d71; color: #00edff; border-radius: 0; } .plyr--audio .plyr__controls { padding: 0; border-radius: inherit; background: rgb(11, 17, 29); border: 0; color: #00edff; width: 300px; padding-right: 5; height: 32px; } .plyr--audio .plyr__controls button.tab-focus:focus, .plyr--audio .plyr__controls button:hover, .plyr__play-large { background: #154d71; color: #00edff; border-radius: 0; }