@import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700);
html{font-family:'Roboto', sans-serif;font-size:13px;color:#222;background:#eee}body{margin:0;-webkit-font-smoothing:antialiased}#app>div{display:flex;flex-direction:column;height:100vh}a{color:#24a20b;text-decoration:none}a:hover{text-decoration:underline}#header{flex:0 0 53px;display:flex;flex-direction:row;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,0.2);z-index:2}#header .title{flex:0 0 200px;display:flex;justify-content:center;align-items:center}#header .title .logo svg{width:110px}#main{flex-grow:1;display:flex;flex-direction:row;overflow:scroll}#content{flex:1 1 0;display:flex;flex-direction:column;overflow:scroll;padding-top:8px}#sidebar-left{flex:0 0 200px;width:200px;order:-1;display:flex;flex-direction:column;padding-top:8px;border-right:1px solid #e1e1e1}#sidebar-right{flex:0 0 250px;display:flex;flex-direction:column;background:#fafafa;overflow:scroll;padding-top:8px;border-left:1px solid #e1e1e1}#layout-about{display:flex;align-items:center;justify-content:center}#layout-about .ico{margin:10px 0}#layout-about .ico svg{fill:#24a20b;width:250px}#layout-about .contact{font-size:14px;margin:10px 0}#layout-about .link{font-size:14px;margin:10px 0}.grid-item-drag{position:absolute;left:0;top:0;transform:translate(-100%, -100%);width:80px;height:25px;line-height:25px;background-color:#24a20b;color:white;border-radius:1px;padding:6px;text-align:center}#message{display:flex;flex-direction:column;align-items:center;position:fixed;top:0;left:50%;transform:translateX(-50%);z-index:9000}#message .message-info,#message .message-error{position:relative;border-radius:2px;box-shadow:0 1px 4px rgba(0,0,0,0.4);margin-bottom:6px}#message .message-info .message-ico,#message .message-error .message-ico{display:flex;justify-content:center;align-items:center;position:absolute;top:0;right:0;width:24px;height:24px;border-radius:50%;cursor:pointer}#message .message-info .message-ico svg,#message .message-error .message-ico svg{width:16px;height:16px;fill:#fff}#message .message-info{background-color:#ffff6c}#message .message-info .message-text{padding:6px}#message .message-error{background-color:#f00;color:#fff}#message .message-error .message-text{padding:6px 24px 6px 6px}#layout-error{display:flex;align-items:center;justify-content:center;font-size:30px;color:#666}#event-layout .header .control{flex:1 0 0;display:flex;flex-direction:row;justify-content:flex-start;align-items:center}#event-layout .header .control .search{flex:1 0 0;display:flex;flex-direction:row;align-items:center;background:#eee;border-radius:4px;padding:7px}#event-layout .header .control .search .ico-search{fill:#000;opacity:0.54;width:20px;height:20px;margin-right:5px}#event-layout .header .control .search input[type="text"]{flex:1 0 0;font-size:16px;height:24px;border:none;padding:0 5px;outline:none;background:transparent}#event-layout .header .control .search input[type="text"]::-webkit-input-placeholder{color:#000;opacity:0.54}#event-layout .header .control .actions{display:flex;flex-direction:row;align-items:center;margin-left:5px}#event-layout .header .control .actions input[type="range"]{width:80px;height:20px;padding:6px;outline:none;background:transparent;border-radius:2px;cursor:pointer;-webkit-appearance:none}#event-layout .header .control .actions input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;height:20px;width:8px;background:#757575;margin-top:-8px;border-radius:2px;box-shadow:0 0 3px 0 rgba(0,0,0,0.2)}#event-layout .header .control .actions input[type="range"]:hover::-webkit-slider-thumb{background:#24a20b}#event-layout .header .control .actions input[type="range"]::-webkit-slider-runnable-track{height:5px;background:#eee;border-radius:4px}#event-layout .header .control .actions a{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin:0 2px;border-radius:2px}#event-layout .header .control .actions a svg{fill:rgba(0,0,0,0.54);width:20px;height:20px}#event-layout .header .control .actions a:hover{background:#eee}#event-layout .header .control .actions a:hover svg{fill:#000}#event-layout .header .control .actions a.active{background:#24a20b}#event-layout .header .control .actions a.active svg{fill:#fff}#event-layout .header .control .modules{display:flex;flex-direction:row;align-items:center;margin-left:2px;padding-left:2px;border-left:2px solid #eee}#event-layout .header .control .modules a{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin:0 2px;border-radius:2px}#event-layout .header .control .modules a svg{fill:rgba(0,0,0,0.54);width:20px;height:20px}#event-layout .header .control .modules a:hover{background:#009fdf}#event-layout .header .control .modules a:hover svg{fill:#000}#event-layout .header .control .modules a:hover svg{fill:#fff}#event-layout .menu{user-select:none}#event-layout .menu .new{display:flex;align-items:center;justify-content:center;padding:0 0 10px 0}#event-layout .menu .new .button{width:96px;height:27px;line-height:27px;font-size:11px;font-weight:bold;border-radius:2px;text-align:center;background-color:#24a20b;color:#fff;cursor:pointer}#event-layout .menu .new .button:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,0.24),0 0 2px 0 rgba(0,0,0,0.12)}#event-layout .menu .items{flex-grow:1;overflow-y:scroll;margin-right:8px}#event-layout .menu .items .event{display:flex;flex:0 0 40px;flex-direction:row;align-items:center;color:#222;height:40px;text-decoration:none;overflow:hidden;white-space:nowrap}#event-layout .menu .items .event .border{flex:0 0 4px;width:4px;height:24px}#event-layout .menu .items .event svg{width:20px;height:16px;opacity:0.54;margin:0 6px}#event-layout .menu .items .event.active{color:#24a20b;font-weight:bold}#event-layout .menu .items .event.active .border{background-color:#24a20b}#event-layout .menu .items .event.active svg{fill:#24a20b;opacity:1}#event-layout .menu .items .event.active:hover{background-color:transparent}#event-layout .menu .items .event.active:hover .border{background-color:#24a20b}#event-layout .menu .items .event:hover{text-decoration:none;background-color:#e1e1e1}#event-layout .menu .items .event:hover .border{background-color:#646464}#event-layout .menu .items .event.drag-over{background-color:rgba(36,162,11,0.2);color:white}#event-layout .menu .items .event.drag-over svg{fill:white;opacity:1}#event-layout .tab{display:flex;flex:40px 0 0;line-height:40px;border-bottom:1px solid #e1e1e1;margin-bottom:20px}#event-layout .tab .tab-item{flex-grow:1;text-align:center;margin:0 6px;color:rgba(0,0,0,0.54);font-weight:500;cursor:pointer;border-bottom:4px solid transparent}#event-layout .tab .tab-item.active{color:#24a20b}#event-layout .tab .tab-item.active,#event-layout .tab .tab-item:hover{border-bottom-color:#24a20b}#event-layout .grid .group{margin-bottom:12px}#event-layout .grid .group-header{border-bottom:4px solid #24a20b;padding:8px 0 4px 0;margin:0 8px 8px 8px}#event-layout .grid .group-items{margin-bottom:8px}#event-layout .grid .item{display:inline-block;background-color:#fff;margin:0 0 8px 8px;border-radius:1px;box-shadow:0 1px 1px 0 rgba(0,0,0,0.2);user-select:none}#event-layout .grid .item:hover{box-shadow:0 2px 8px 0 rgba(0,0,0,0.25)}#event-layout .grid .item.selected{background-color:#24a20b;box-shadow:0 2px 8px 0 rgba(0,0,0,0.25);color:#fff}#event-layout .grid .item .item-header{display:flex;flex-direction:row;height:20px;overflow:hidden}#event-layout .grid .item .item-markers{display:flex;flex-direction:row;align-items:center;padding:0 3px}#event-layout .grid .item .item-markers .item-marker{width:10px;height:10px;margin:0 3px 0 0;font-size:8px}#event-layout .grid .item .item-date{flex-basis:100%;font-size:11px;padding:3px;overflow:hidden;text-overflow:ellipsis;text-align:right}#event-layout .grid .item .item-time{font-size:12px;font-weight:bold;padding:3px}#event-layout .grid .item .item-thumbnail{background-color:#fafafa;position:relative;overflow:hidden}#event-layout .grid .item .item-thumbnail-content{width:100%;height:100%;display:inline-flex;align-items:center;justify-content:center}#event-layout .grid .item .item-thumbnail-content svg{width:50%;height:50%;fill:#a6a6a6}#event-layout .grid .item .item-thumbnail-image{position:absolute;border:0}#event-layout .grid .item .item-thumbnail-loading{display:inline-flex;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}#event-layout .grid .item .item-thumbnail-loading svg{width:40px;height:40px}#event-layout .grid .item .item-thumbnail-duration{font-size:10px;color:#fff;background-color:rgba(0,0,0,0.54);border-radius:2px;padding:2px 5px;position:absolute;right:8px;bottom:8px}#event-layout .grid .item .item-thumbnail-video-preview{display:inline-flex;align-items:center;justify-content:center;position:absolute;right:5px;top:5px;width:26px;height:26px;background-color:rgba(0,0,0,0.2);border-radius:50%;cursor:pointer}#event-layout .grid .item .item-thumbnail-video-preview>span{width:20px;height:20px}#event-layout .grid .item .item-thumbnail-video-preview>span svg{fill:#fff;width:20px;height:20px}#event-layout .grid .item .item-thumbnail-video-preview:hover{background-color:#24a20b}#event-layout .grid .item .item-thumbnail-warning{display:inline-flex;align-items:center;justify-content:center;position:absolute;left:5px;top:5px;width:26px;height:26px;background-color:rgba(0,0,0,0.2);border-radius:50%}#event-layout .grid .item .item-thumbnail-warning>span{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;color:white;background-color:#ffa700;border-radius:50%;font-weight:bold}#event-layout .grid .item .item-thumbnail-position{display:inline-flex;position:absolute;bottom:0;left:0;right:0;height:6px;background-color:rgba(0,0,0,0.2);overflow:hidden}#event-layout .grid .item .item-thumbnail-position>span{position:absolute;display:inline-flex;width:6px;transform:translate(-50%, 0);top:0;bottom:0;background-color:red}#event-layout .grid .item .item-footer{display:flex;flex-direction:row;height:40px}#event-layout .grid .item .item-footer-left{display:flex;flex-direction:column;justify-content:center;flex-grow:1;overflow:hidden;padding:0 8px 0 3px}#event-layout .grid .item .item-footer-right{display:flex;flex-direction:row;justify-content:center;align-items:center}#event-layout .grid .item .item-download>span{display:inline-flex;justify-content:center;align-items:center;width:24px;height:24px;margin:0 3px;background-color:#eee;border-radius:50%}#event-layout .grid .item .item-download>span:hover svg{fill:#000}#event-layout .grid .item .item-download>span svg{width:18px;height:18px}#event-layout .grid .item .item-download.origin svg{fill:#24a20b}#event-layout .grid .item .item-download.encoded svg{fill:#7441a9}#event-layout .grid .item .item-progress{display:inline-flex;justify-content:center;align-items:center;width:24px;height:24px;margin:0 3px;background-color:#eee;border-radius:50%}#event-layout .grid .item .item-progress svg{width:18px;height:18px}#event-layout .grid .item .item-progress.origin svg{fill:none;stroke:#24a20b}#event-layout .grid .item .item-progress.encoded svg{fill:none;stroke:#7441a9}#event-layout .grid .item .item-title,#event-layout .grid .item .item-location{display:flex;align-items:center;height:18px}#event-layout .grid .item .item-title .input-view,#event-layout .grid .item .item-location .input-view{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#event-layout .grid .item .item-title .input-view:hover,#event-layout .grid .item .item-location .input-view:hover{cursor:pointer;text-decoration:underline}#event-layout .grid .item .item-title .input-empty,#event-layout .grid .item .item-location .input-empty{opacity:0.5}#event-layout .grid .item .item-title .input-empty:hover,#event-layout .grid .item .item-location .input-empty:hover{cursor:pointer;text-decoration:underline}#event-layout .grid .item .item-title .input-edit,#event-layout .grid .item .item-location .input-edit{flex-grow:1;border:none;border-radius:1px;box-shadow:inset 0 0 1px rgba(0,0,0,0.5);background-color:rgba(255,255,255,0.9);font-size:13px;outline:none;padding:1px}#event-layout .grid .empty{align-self:center;display:flex;flex-direction:column;align-items:center;padding-top:96px}#event-layout .grid .empty .error{color:#666;font-size:16px}#event-layout .grid .empty .error-ico{margin-bottom:8px}#event-layout .grid .empty .error-ico svg{width:60px;height:60px;fill:rgba(255,0,0,0.7)}#event-layout .grid .empty .loading{padding-top:45px}#event-layout .grid .empty .loading svg{width:30px;height:30px}#event-layout .grid .empty .no-files{display:flex;justify-content:center;align-items:center;width:120px;height:120px;border-radius:50%;background-color:#fafafa}#event-layout .grid .empty .no-files svg{width:72px;height:72px;opacity:0.2}#event-layout .detail .group{padding:0 6px;line-height:30px}#event-layout .detail .group-header{color:#757575}#event-layout .detail .group-warning{background-color:#ffa700;color:white;padding:3px;margin:6px 0;text-align:center;line-height:normal}#event-layout .detail .group-title{font-size:20px}#event-layout .detail .group-title.one-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#event-layout .detail .group-comment{font-size:11px;color:#757575}#event-layout .detail .group-summary{display:flex;flex-direction:row;align-items:center;cursor:pointer}#event-layout .detail .group-summary:hover{background-color:#e1e1e1}#event-layout .detail .group-summary .card-ico{display:inline-flex}#event-layout .detail .group-summary .card-ico svg{width:14px;height:14px;opacity:0.54}#event-layout .detail .group-summary .card-ico.uploading svg{fill:#24a20b;opacity:1}#event-layout .detail .group-summary .card{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-grow:1;margin-left:3px}#event-layout .detail .group-summary .card-count{font-weight:bold;font-size:11px;padding:0 6px}#event-layout .detail .group-markers{display:flex;flex-direction:row;justify-content:center}#event-layout .detail .group-markers .item-marker-wrapper{display:inline-flex;justify-content:center;align-items:center;width:22px;height:22px;margin:0 1px;cursor:pointer;border:1px solid transparent;border-radius:50%}#event-layout .detail .group-markers .item-marker-wrapper.enabled{background-color:#E0E0E0;border-color:#999999}#event-layout .detail .group-markers .item-marker-wrapper:hover{box-shadow:0 0 2px rgba(0,0,0,0.5)}#event-layout .detail .group-markers .item-marker-wrapper .item-marker{width:16px;height:16px;font-size:10px}#event-layout .detail .group-thumbnail{align-self:center;width:100%}#event-layout .detail .group-line{display:flex;flex-direction:row}#event-layout .detail .group-label{flex:0 0 70px}#event-layout .detail .group-value{flex-grow:1;width:160px}#event-layout .detail .group-remove{display:flex;justify-content:center;align-items:center}#event-layout .detail .group-remove .button{width:96px;height:27px;line-height:27px;font-size:11px;font-weight:bold;border-radius:2px;text-align:center;background-color:red;color:#fff;cursor:pointer}#event-layout .detail .group-remove .button:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,0.24),0 0 2px 0 rgba(0,0,0,0.12)}#event-layout .detail .group-mac{color:inherit}#event-layout .detail .group-download{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#event-layout .detail .group-download>span{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;margin-right:6px;vertical-align:text-bottom}#event-layout .detail .group-download>span svg{width:14px;height:14px;fill:#fff}#event-layout .detail .group-download.origin{color:#24a20b}#event-layout .detail .group-download.origin>span{background-color:#24a20b}#event-layout .detail .group-download.encoded{color:#7441a9}#event-layout .detail .group-download.encoded>span{background-color:#7441a9}#event-layout .detail .delimiter{margin:10px 6px 0 6px;padding-bottom:10px;border-top:1px solid #e1e1e1}#event-layout .detail .editable{display:flex}#event-layout .detail .editable .input-view:hover{cursor:pointer;text-decoration:underline}#event-layout .detail .editable .input-empty{opacity:0.5}#event-layout .detail .editable .input-empty:hover{cursor:pointer;text-decoration:underline}#event-layout .detail .editable .input-edit{flex-grow:1;font-size:20px;padding:6px;outline:none}#event-layout .item-marker{display:inline-flex;justify-content:center;align-items:center;border:1px solid;border-radius:50%;color:#fff;user-select:none}#event-layout .item-marker.number{background-color:#4e4e4e;border-color:#444}#event-layout .item-marker.red{background-color:#fb6360;border-color:#fb3c39}#event-layout .item-marker.orange{background-color:#f6a756;border-color:#f4912c}#event-layout .item-marker.yellow{background-color:#f3cf5f;border-color:#f0c337}#event-layout .item-marker.green{background-color:#71cb5f;border-color:#4ebf38}#event-layout .item-marker.blue{background-color:#57b7f0;border-color:#2da6ed}#event-layout .item-marker.purple{background-color:#cf87de;border-color:#c36ad6}#event-layout .item-marker.gray{background-color:#a4a4a7;border-color:#8e8e91}#layout-loading{display:flex;align-items:center;justify-content:center}#layout-loading .loading svg{width:30px;height:30px}#login-layout{display:flex;align-items:center;justify-content:center;background-color:#fff}#login-layout .login-card{display:flex;align-items:center;justify-content:center;flex-direction:column;background-color:#f7f7f7;box-shadow:0 2px 2px rgba(0,0,0,0.3);border-radius:2px;padding:40px 0;width:360px}#login-layout .login-card .logo{margin-bottom:15px}#login-layout .login-card .logo svg{width:250px}#login-layout .login-card .login{display:flex;flex-direction:column;justify-content:center}#login-layout .login-card .login .error{color:#f00;margin:5px 0;text-align:center;padding:5px 0;width:274px}#login-layout .login-card .login input[type="text"],#login-layout .login-card .login input[type="password"]{font-size:14px;margin:5px 0;padding:0 8px;width:274px;height:36px;border:1px solid #d9d9d9;border-top:1px solid #c0c0c0}#login-layout .login-card .login input[type="submit"]{margin:5px 0;width:100%;border:1px solid #1d8009;color:#fff;font-weight:bold;text-shadow:0 1px rgba(0,0,0,0.1);background:#24a20b -webkit-linear-gradient(top, #24a20b, #1c8208);text-align:center;height:36px;border-radius:3px;transition:all 0.218s;user-select:none;cursor:default}#login-layout .login-card .login input[type="submit"]:hover{border:1px solid #145807;color:#fff;text-shadow:0 1px rgba(0,0,0,0.3);background:#24a20b -webkit-linear-gradient(top, #24a20b, #1a7309);text-decoration:none;transition:all 0.0s;box-shadow:0 1px 1px rgba(0,0,0,0.1)}#overlay-monitor-layer{display:flex;justify-content:center;align-items:center;position:fixed;padding:5%;top:0;left:0;right:0;bottom:0}#overlay-monitor{position:relative;width:100%;height:100%;display:flex;flex-direction:column;background-color:#fff;border-radius:2px;box-shadow:0 4px 8px rgba(0,0,0,0.32),0 8px 40px rgba(0,0,0,0.4);padding:24px}#overlay-monitor .loading{display:flex;align-items:center;justify-content:center;height:100%}#overlay-monitor .loading svg{width:30px;height:30px}#overlay-monitor .devices{overflow-y:scroll}#overlay-monitor .devices .device{display:inline-block;margin:0 0 8px 8px;width:325px;height:320px;background-color:#eee;border-radius:1px;box-shadow:0 1px 1px 0 rgba(0,0,0,0.2)}#overlay-monitor .devices .device:hover{box-shadow:0 2px 8px 0 rgba(0,0,0,0.25)}#overlay-monitor .devices .device .title{color:rgba(0,0,0,0.54);font-size:16px;font-weight:500;line-height:30px;background-color:#e1e1e1;cursor:pointer;padding:6px}#overlay-monitor .devices .device.selected .title{background-color:#24a20b;color:#fff}#overlay-monitor .devices .device .base,#overlay-monitor .devices .device .modem{margin:6px}#overlay-monitor .devices .device .line{display:flex;flex-direction:row;line-height:20px}#overlay-monitor .devices .device .line .label{flex:0 0 125px}#overlay-monitor .devices .device .line .value,#overlay-monitor .devices .device .line .value1,#overlay-monitor .devices .device .line .value2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#overlay-monitor .devices .device .line .value{flex:0 0 200px}#overlay-monitor .devices .device .line .value1{flex:0 0 100px}#overlay-monitor .devices .device .line .value2{flex:0 0 100px}#new-event-form input[type="text"]{border-radius:1px;border:1px solid #d9d9d9;border-top:1px solid #c0c0c0;height:25px;width:250px;font-size:13px;padding:1px 8px;outline:none}#layout-not-found{display:flex;align-items:center;justify-content:center}#layout-not-found .title{font-size:18px}#layout-not-found .link{font-size:14px;margin:10px 0}#overlay{display:flex;flex-direction:column;justify-content:center;align-items:center;position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.6);z-index:1000}#overlay-dialog{background-color:#fff;border-radius:2px;box-shadow:0 4px 8px rgba(0,0,0,0.32),0 8px 40px rgba(0,0,0,0.4);padding:24px}#overlay-dialog-header{display:flex;flex-direction:row;margin-bottom:20px}#overlay-dialog-header .title{flex-grow:1;font-size:18px}#overlay-dialog-header .close{display:flex;justify-content:center;align-items:center;width:24px;height:24px;opacity:0.7;cursor:pointer}#overlay-dialog-header .close svg{fill:#000;width:20px;height:20px}#overlay-dialog-buttons{display:flex;justify-content:flex-end;margin-top:24px}#overlay-dialog-buttons input[type="button"],#overlay-dialog-buttons input[type="submit"]{border:1px solid transparent;border-radius:2px;min-width:64px;font-weight:bold;line-height:30px;outline:none;text-align:center;margin:0 8px;padding:0 16px}#overlay-dialog-buttons input[type="button"]:not([disabled]),#overlay-dialog-buttons input[type="submit"]:not([disabled]){cursor:pointer}#overlay-dialog-buttons input[type="button"]:not([disabled]):hover,#overlay-dialog-buttons input[type="submit"]:not([disabled]):hover{box-shadow:0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.12),0 1px 5px 0 rgba(0,0,0,0.2)}#overlay-dialog-buttons input[type="button"][disabled],#overlay-dialog-buttons input[type="submit"][disabled]{opacity:0.5}#overlay-dialog-buttons input[type="button"]{background-color:#fff;color:rgba(0,0,0,0.87)}#overlay-dialog-buttons input[type="submit"]{background-color:#24a20b;color:#fff}#overlay-dialog-buttons input[type="submit"].alert{background-color:#f00}#overlay-loading svg{width:30px;height:30px}#user{flex:0 0 250px;display:flex;flex-direction:column;justify-content:center;align-items:flex-end}#user>div{margin-right:5px}#user a{font-size:12px}#user .name{margin-bottom:2px;overflow:hidden;font-size:12px;font-weight:bold}#user .delimiter{color:#24a20b;opacity:0.54;margin:0 3px;user-select:none}#audio-preview-layer{display:flex;justify-content:center;align-items:center;padding:5%;position:fixed;top:0;left:0;right:0;bottom:0}#audio-preview-center{position:relative;width:100%;height:80px}#audio-preview-container{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#000}#audio-preview-close{display:flex;justify-content:center;align-items:center;position:absolute;top:8px;right:8px;width:24px;height:24px;background-color:rgba(0,0,0,0.6);border-radius:50%;cursor:pointer}#audio-preview-close svg{fill:#fff;width:20px;height:20px}#audio-preview-close:hover{background-color:#000}#audio-preview-close:hover svg{fill:#f00}#audio-preview-loading{display:inline-flex;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}#audio-preview-loading svg{width:40px;height:40px}#audio-preview-error{display:flex;flex-direction:row;align-items:center;justify-content:center;position:absolute;left:0;right:0;top:0;bottom:0}#audio-preview-error .ico{margin-right:12px}#audio-preview-error .ico svg{width:24px;height:24px;fill:#f00}#audio-preview-error .message{color:#666;font-size:16px}#audio-preview-position{position:absolute;left:0;right:0;bottom:36px;height:8px;cursor:pointer;overflow:hidden}#audio-preview-position .progress{position:absolute;left:0;right:0;bottom:0;height:3px;background-color:rgba(255,255,255,0.2)}#audio-preview-position:hover .progress{height:8px}#audio-preview-position .position{position:absolute;display:inline-flex;top:0;bottom:0;background-color:red}#audio-preview-control{display:flex;flex-direction:row;align-items:center;position:absolute;left:0;right:0;bottom:0;height:36px}#audio-preview-control .ico{width:24px;height:24px;margin:0 6px;cursor:pointer}#audio-preview-control .ico svg{width:24px;height:24px;fill:#fff}#audio-preview-control .ico svg:hover{fill:#f00}#audio-preview-control .time{color:#fff;margin-left:6px;user-select:none}#video-preview-layer{display:flex;justify-content:center;align-items:center;padding:5%;position:fixed;top:0;left:0;right:0;bottom:0}#video-preview-close{display:flex;justify-content:center;align-items:center;position:absolute;top:8px;right:8px;width:24px;height:24px;background-color:rgba(0,0,0,0.6);border-radius:50%;cursor:pointer}#video-preview-close svg{fill:#fff;width:20px;height:20px}#video-preview-close:hover{background-color:#000}#video-preview-close:hover svg{fill:#f00}#video-preview-loading{display:inline-flex;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}#video-preview-loading svg{width:40px;height:40px}#video-preview-error{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:0;right:0;top:0;bottom:0}#video-preview-error .ico{margin-bottom:8px}#video-preview-error .ico svg{width:60px;height:60px;fill:#f00}#video-preview-error .message{color:#666;font-size:16px}#video-preview-quality{position:absolute;left:0;top:0;background-color:rgba(255,0,0,0.8);color:white;font-weight:bold;padding:20px}#video-preview-center{position:relative;width:100%;height:100%}#video-preview-container{position:absolute;top:0;left:0;right:0;bottom:0}#video-preview-player{width:100%;height:100%;background-color:#000}#video-preview-position{position:absolute;left:0;right:0;bottom:36px;height:8px;cursor:pointer;overflow:hidden}#video-preview-position .progress{position:absolute;left:0;right:0;bottom:0;height:3px;background-color:rgba(255,255,255,0.2)}#video-preview-position:hover .progress{height:8px}#video-preview-position .position{position:absolute;display:inline-flex;top:0;bottom:0;background-color:red}#video-preview-control{display:flex;flex-direction:row;align-items:center;position:absolute;left:0;right:0;bottom:0;height:36px;background-color:rgba(0,0,0,0.6)}#video-preview-control .ico{width:24px;height:24px;margin:0 6px;cursor:pointer}#video-preview-control .ico svg{width:24px;height:24px;fill:#fff}#video-preview-control .ico svg:hover{fill:#f00}#video-preview-control .time{color:#fff;margin-left:6px;user-select:none}