@charset "utf-8";

.lf-progress { appearance: none; width: 100%; height: 4px; border-radius: 3px; cursor: pointer; }

.lf-progress:focus { outline: none; border: none; }

.lf-progress::-webkit-slider-thumb { height: 13px; width: 13px; border: 0px; border-radius: 50%; background: rgb(15, 204, 206); cursor: pointer; appearance: none !important; }

.lf-player-container :focus { outline: 0px; }

.lf-popover { position: relative; }

.lf-popover-content { display: inline-block; position: absolute; opacity: 1; visibility: visible; transform: translate(0px, -10px); box-shadow: rgba(0, 0, 0, 0.26) 0px 2px 5px 0px; transition: all 0.3s cubic-bezier(0.75, -0.02, 0.2, 0.97) 0s; }

.lf-popover-content.hidden { opacity: 0; visibility: hidden; transform: translate(0px, 0px); }

.lf-player-btn-container { display: flex; align-items: center; }

.lf-player-btn { cursor: pointer; fill: rgb(153, 153, 153); width: 14px; }

.lf-player-btn.active { fill: rgb(85, 85, 85); }

.lf-popover { position: relative; }

.lf-popover-content { display: inline-block; position: absolute; background-color: rgb(255, 255, 255); opacity: 1; transform: translate(0px, -10px); box-shadow: rgba(0, 0, 0, 0.26) 0px 2px 5px 0px; transition: all 0.3s cubic-bezier(0.75, -0.02, 0.2, 0.97) 0s; padding: 10px; }

.lf-popover-content.hidden { opacity: 0; visibility: hidden; transform: translate(0px, 0px); }

.lf-arrow { position: absolute; z-index: -1; content: ""; bottom: -9px; border-style: solid; border-width: 10px 10px 0px; }

.lf-left-align, .lf-left-align .lfarrow { left: 0px; right: unset; }

.lf-right-align, .lf-right-align .lf-arrow { right: 0px; left: unset; }

.lf-text-input { border: 1px solid rgb(204, 204, 204); border-radius: 5px; padding: 3px; width: 60px; margin: 0px; }

.lf-color-picker { display: flex; flex-direction: row; justify-content: space-between; height: 90px; }

.lf-color-selectors { display: flex; flex-direction: column; justify-content: space-between; }

.lf-color-component { display: flex; flex-direction: row; font-size: 12px; align-items: center; justify-content: center; }

.lf-color-component strong { width: 40px; }

.lf-color-component input[type="range"] { margin: 0px 0px 0px 10px; }

.lf-color-component input[type="number"] { width: 50px; margin: 0px 0px 0px 10px; }

.lf-color-preview { font-size: 12px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding-left: 5px; }

.lf-preview { height: 60px; width: 60px; }

.lf-popover-snapshot { width: 150px; }

.lf-popover-snapshot h5 { margin: 5px 0px 10px; font-size: 0.75rem; }

.lf-popover-snapshot a { display: block; text-decoration: none; }

.lf-popover-snapshot a::before { content: "⥼"; margin-right: 5px; }

.lf-popover-snapshot .lf-note { display: block; margin-top: 10px; color: rgb(153, 153, 153); }

.lf-player-controls > div { margin-right: 5px; margin-left: 5px; }

.lf-player-controls > div:first-child { margin-left: 0px; }

.lf-player-controls > div:last-child { margin-right: 0px; }