@font-face{font-family:Cairo;src:url(../Cairo-Regular.ttf) format("truetype")}*{outline:none}body,span{font-family:Cairo,sans-serif}body{margin:0}*{-ms-overflow-style:none;scrollbar-width:none}.working #player::-webkit-media-controls-fullscreen-button,.working #player::-webkit-media-controls-play-button,.working #player::-webkit-media-controls-volume-control-container,::-webkit-scrollbar{display:none}#player{background:#000;height:100vh;-o-object-fit:fill;object-fit:fill;overflow:scroll;position:fixed;width:100vw}#video-player{cursor:none;height:100vh;position:relative}#playlist{bottom:40px;display:none;grid-template-columns:repeat(6,1fr);height:120px;left:0;margin:0;overflow-y:auto;padding:1rem;position:absolute;transition:.5s;width:100%;z-index:99;grid-gap:1rem}#playlist .item{background-color:#000;background-position:50%;background-size:cover;border-radius:15px;cursor:pointer;height:6rem;opacity:.7;overflow:hidden;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}#playlist .item.active,#playlist .item:hover{opacity:1;outline:3px double #000}#playlist .item .name{bottom:.8em;color:#fff;display:inline-block;font-size:16px;left:1em;max-width:86%;position:absolute;text-shadow:1px 1px 2px #000,-1px 1px 2px #000,1px -1px 2px #000,-1px -1px 2px #000}#playlist .item.active:after{background-color:green;border-radius:100%;content:"";display:inline-block;height:6px;margin-left:4px;position:absolute;right:1rem;top:1rem;width:6px}#controls{display:none;flex-direction:column;gap:15px;position:fixed;right:15px;top:15px;z-index:100}#controls button{border:2px solid #000;border-radius:50px;height:45px;width:45px}#controls button svg{height:100%;width:100%}#controls button:hover svg{fill:#fff}#controls button:hover{background:#000;color:#fff}