/* variables */
:root {
	--blue: #4A8BEE;
	--green: green;
}

/* overall */
html, body { height: 100%; }
body { font-family: Arial, Verdana; font-size: 13px; }
.blue { color: var(--blue) !important; }
.bg_blue { background-color: var(--blue); color: #fff; }

/* nav.menu: logo */
nav.menu #logo { margin: 20px auto; position: relative; text-align: center; }
nav.menu #logo a { display: inline-block; padding: 7px 10px; color: #fff; outline: 1px solid #3c3c3c; }

/* nav.menu: main */
nav.menu { background-color: #303030; position: fixed; top: 0; left: 0; height: 100vh; white-space: nowrap; font-size: 12px; z-index: 22; width: 220px; overflow: hidden; }
nav.menu ul { list-style: none; margin: 20px 0; padding: 0; }
nav.menu ul li { border-bottom: 1px solid #3c3c3c; position: relative; }
nav.menu ul li:after { content: ''; display: none; background-color: var(--blue); position: absolute; width: 5px; height: calc(100% + 2px); top: -1px; right: 0; }
nav.menu ul li:hover, nav.menu ul li.act { background-color: #3c3c3c; }

nav.menu ul li.act:after { display: block; }


nav.menu ul li a { text-decoration: none; display: list-item; padding: 10px 0 10px 15px; color: #eee; text-transform: uppercase; } 
nav.menu ul li.last { border-bottom: none; }

/* nav.menu: footer */
nav.menu .footer { position: absolute; bottom: 0; left: 0; width: 100%; border-top: 1px solid #3c3c3c; padding: 6px 0; }
nav.menu .footer div { display: grid; grid-template-columns: repeat(3, 1fr); }
nav.menu .footer div a { color: #666; text-decoration: none; text-align: center; padding: 2px; font-size: 14px; }
nav.menu .footer div a:hover { color: #eee; }
nav.menu .footer div a:nth-of-type(2) { border: 1px solid #3c3c3c; border-width: 0 1px; }



/* master layout */
main { width: calc(100% - 220px); padding: 20px 20px 60px; background: #f8f8f8; margin-left: 220px; overflow-y: auto; min-height: 100vh; }
aside { display: none; width: 380px; background: #eee; position: fixed; right: 0; top: 0; height: 100vh; overflow-y: auto; padding: 20px; }

body.sidebar main { width: calc(100% - 380px - 220px); }
body.sidebar aside { display: block; }

/* main */
h1, h2 { letter-spacing: 1px; text-transform: uppercase; color: #676768; font-size: 26px; }
h1, h2.toolbar { margin: -20px -20px 20px; padding: 15px 20px; border-bottom: 1px solid #E8E9EB; }
h2 {  margin-top: 60px; }

h1 a { color: #ccc; text-decoration: none; margin-right: 15px; }
h1 a:hover, h1 a.act { color: #676768; }

/* tabs */
aside header { margin: -20px -20px 20px; padding: 20px;  }
.tabs { background: #E8E9EA; height: 62px; vertical-align: middle; display: flex; justify-content: space-around; }
.tabs > button { text-decoration: none; font-size: 14px; text-transform: uppercase; padding: 2px; color: #bbb; background: none; border: none; }
.tabs > button:hover, .tabs > button.act { color: #676768; }
.tabs > button.act { border-bottom: 2px solid #f55b07; }

/* buttons */
.ico { border: none; background-color: transparent; font-size: 12px; line-height: 1; color: #555; text-decoration: none; padding: 0; text-align: left; }
.ico i { font-size: 15px; padding-right: 8px; }
.ico:hover, .ico.act { color: var(--blue); }
.ico:disabled { color: #ccc; }
table .ico i { font-size: 18px; }

/* buttons (toolbar) */
.buttons { background-color: #F1F2F5; margin: -20px -20px 20px; padding: 5px 20px; border-bottom: 1px solid #E8E9EB; display: flex; align-items: center; height: 40px; }
.buttons .ico { margin-right: 25px; display: flex; align-items: center; }
.buttons .ico:last-child { margin-right: 0; }

.buttons-middle { border-top: 1px solid #E8E9EB; margin-top: -5px; }

/* forms */
label { color: #868686; text-transform: uppercase; font-size: 12px; margin: 15px 0 4px; display: inline-block; }
input, textarea, select { padding: 6px; border: 1px solid #E5E5E5; }
input, select, textarea { width: 100%; }
textarea { min-height: 70px; }
select { padding: 5px 2px; }

input[type="submit"], button.submit { width: auto; padding: 8px 12px; background: none; border: 2px solid #E5E5E5; margin-top: 15px; text-transform: uppercase; }
input[type="submit"]:hover:not([disabled]), button.submit:hover:not([disabled]), button.small:hover:not([disabled]), button.submit.act { background: #f55b07; border-color: #f55b07; color: #fff; transition: all 200ms; }
input.small, button.small { border: 2px solid #e5e5e5; background: #f5f5f5; padding: 5px 10px; }

input:disabled, button:disabled { background: none !important;  }
select:disabled { background: #f8f8f8; }

label input, label textarea, label select { margin-top: 4px; }

input[type="search"] { -webkit-appearance: searchfield; }
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: searchfield-cancel-button; }

/* forms - dl, dt, dd */
dl { display: grid; grid-template-columns: 180px 1fr; grid-column-gap: 20px; margin-bottom: 20px; }
dt { padding-top: 8px; }
dt label { all: unset; font-size: 12px; text-transform: uppercase; color: #868686; cursor: default; }

dd { margin: 0; display: grid; grid-column-gap: 20px; grid-row-gap: 10px; grid-template-columns: 1fr; }
dd.c2 { grid-template-columns: repeat(2, 1fr); }
dd.c3 { grid-template-columns: repeat(3, 1fr); }
dd.c4 { grid-template-columns: repeat(4, 1fr); }
dd.c5 { grid-template-columns: repeat(5, 1fr); }
dd.c6 { grid-template-columns: repeat(6, 1fr); }
dd.c7 { grid-template-columns: repeat(7, 1fr); }

dl.dd { margin-left: 200px; }


/* grid */
.grid { display: grid; grid-template-columns: 1fr; grid-gap: 20px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }


/* misc */
#loading { background-color: #f55b07; padding: 5px 10px; position: absolute; left: 700px; top: -200px; z-index: 100; color: #fff; animation: none; opacity: 0; }
#loading.act { top: 18px; animation: shake 2000ms linear infinite; opacity: 1; transition-delay: 1s; }

/* library */
/*aside .library { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px; }
aside .library > a { border: 1px solid #ccc; height: 120px; position: relative; background: no-repeat center center; background-size: cover; }
aside .library .title, aside .library .options { display: none; position: absolute; }
aside .library > a:hover .title, aside .library > a:hover .options { display: block; }
aside .library > a .title { left: 0; top: 0; width: 100%; background-color: rgba(0, 0, 0, .3); color: #fff; padding: 5px; }
aside .library > a .options { left: 5px; bottom: 5px; }

aside .library > a:after { font-family: FontAwesome; color: #fff; background-color: #ccc; font-size: 40px; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
aside .library > a[data-type="folder"]:after { content: "\f114"; }*/




aside .library { font-size: 12px; }
aside .library .item { display: grid; grid-template-columns: 60px 1fr; background-color: #fff; min-height: 50px; margin-bottom: 10px; box-shadow: 1px 1px 5px rgba(0, 0, 0, .1); position: relative; }
aside .library .item .th { background: #ccc no-repeat center center; background-size: cover; box-shadow: inset 0 0 6px 0 rgba(0, 0, 0, .2); }
aside .library .item .title { padding: 0 8px; display: flex; align-items: center; }
aside .library .item .title button, #library_list button.folder { padding: 0; border: none; background: none; font-weight: bold; }
aside .library .item .options { position: absolute; left: 0; top: 0; width: 60px; height: 100%; background-color: #ccc; display: none; }
aside .library .item:hover .options { display: flex; align-items: center; justify-content: center; }
aside .library .item:hover .options button { padding: 4px; }
aside .library .item:hover .options button i { padding: 0; }

aside .library .item .th:after { font-family: FontAwesome; color: #fff; background-color: #ccc; font-size: 20px; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
aside .library .item[data-type="folder"] .th:after { content: "\f114"; }













/* tables */
main table thead th { border: none; }
main table tbody td { /*background: #F6F6F6;*/ border-bottom: 1px solid #E8E9EB; }
main table.dataTable tbody td { background: #F6F6F6; color: #555; }
main table tbody td a { color: var(--blue); text-decoration: none; }

/* data tables*/
table.dataTable { border-collapse: collapse !important; }
main table.dataTable th { padding: 10px 5px; font-weight: normal; color: #000; }
main table.dataTable td { padding: 5px; }
main table.dataTable thead th { border-bottom-color: #ccc; }
.dataTables_wrapper .dataTables_filter label { margin: 0 0 15px; }
.dataTables_wrapper .dataTables_filter input { width: 200px; }

/* table: sidebar */
aside table { background: #eee; color: #676768; }
aside table thead tr th { border-bottom: 1px solid #ddd; color: #333; font-weight: normal; padding: 8px 3px; }
aside table tbody tr td { border-bottom: 1px solid #e8e8e8; padding: 4px 3px; }
aside table tbody tr:hover td { background-color: #e8e8e8; }
aside table tr { font-size: 12px; }

/* table: sidebar (dates in logs and tasks) */
aside table td.ts { border-left: 3px solid transparent; }
aside table td.ts .time { display: block; }
aside table td.ts .date { color: #ccc; }
aside table tr:hover td.ts { color: #f55b07; }
aside table tr:hover td.ts .date { color: #f55b07; }

aside table tr.selected td.ts { border-left-color: #f55b07; }



/* table: sidebar */
table.simple { color: #676768; }
table.simple thead tr th { border-bottom: 1px solid #ddd; color: #333; font-weight: bold; padding: 8px 4px; }
table.simple tbody tr td { border-bottom: 1px solid #e8e8e8; padding: 4px 0; }
/*table.simple tbody tr:hover td { background-color: #e8e8e8; }*/
table.simple tr { font-size: 12px; }

table.simple-light thead tr th { border-bottom: 1px solid #f2f2f2; }
table.simple-light tbody tr td { border-bottom: 1px solid #f8f8f8; }

table.simple-high th, table.simple-high td { padding: 0 !important; height: 35px; }

table.simple-padding th, table.simple-padding td { padding: 7px !important; }
/*aside table tr:nth-of-type(even) { background: #f1f1f1; border-bottom: 1px solid #eee; }*/








/* breadcrumbs */
.bc { padding: 5px; position: relative; }
.bc:before { content: "\f114"; font-family: FontAwesome; color: #888; font-size: 19px; position: absolute; left: 0; top: 3px; }
.bc ul { margin: 0; padding: 0 0 0 25px; }
.bc li { display: inline-block; margin: 0 10px 5px 0; position: relative; }
.bc li a:after { content: "\00bb"; margin-left: 10px; }
.bc li:last-of-type a:after { content: ''; margin-left: 0; }

.bc li ul { position: absolute; top: 15px; left: -5px; margin: 0; background: #fff; padding: 0; display: none; z-index: 10; }
.bc li:hover ul, .bc li.dragover ul { display: block; }
.bc li ul li { display: block; border: 1px solid #ccc; border-top: none; border-bottom-color: #eee; min-width: 200px; list-style: none; margin: 0; }
.bc li ul li:first-of-type { border-top: 1px solid #ccc; }
.bc li ul li:last-of-type { border-bottom: 1px solid #ccc; }
.bc li ul li a { display: list-item; padding: 7px; }
.bc li ul li a:hover { background: #f6f6f6; }

aside .bc { margin-bottom: 10px; font-size: 12px; }












.mce-tinymce { width: 100% !important; }






sup { color: #ccc; margin-left: 10px; }






.GOL { width: 100%; }
.GOL_list .GOL_item, .GOL_list .GOL_head { min-width: 700px; width: 100%; background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,.1); margin-bottom: 10px;   display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; justify-content: flex-start; align-content: center; align-items: center;
}
.GOL_list .GOL_item { border-right: 4px solid #ccc; }
.GOL_list .GOL_item > div, .GOL_list .GOL_head > div { padding: 0 5px; }
.GOL_list .th { width: 50px; height: 50px; padding: 0 !important; background: #bbb no-repeat center center; background-size: cover; flex-grow: 0; flex-shrink: 0; }
/*.GOL_list .th.folder { background-image: url('../img/ico/folder.png'); background-size: 70%; display: flex; }*/
.GOL_list .th:after,
.GOL_grid .GOL_item .th:after,
.ds_sidebar a span.th:after,
.collection_item td span.th:after
	{ font-family: FontAwesome; color: #fff; font-size: 26px; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }

/* th - icons */
.th-folder:after { content: "\f114"; }
.th-rss:after { content: "\f09e"; }
.th-collection:after { content: "\f00a"; }
.th-doc:after { content: "\f1c2"; }
.th-xls:after { content: "\f1c3"; }
.th-audio:after { content: "\f001"; }
.th-scroll:after { content: "\f035"; }
.th-rtf:after { content: "\f031"; }
.th-stream:after { content: "\f043"; }
.th-action:after { content: "\f0e7"; }
.th-unknown:after { content: "\f128"; }

/* converting, error */
.GOL_item.ERROR .th:after { content: "\f071" !important; }
.GOL_item.QUEUED .th:after { content: "\f110" !important; }


/* with real thumbs */
.th-image:hover:after, .th-video:hover:after, .th-html:hover:after, .th-ppt:hover:after { background-color: #bbb; }
.th-image:hover:after { content: "\f03e";  } /* alt: f1c5 */ 
.th-video:hover:after { content: "\f03d"; } /* alt: f1c8 */
.th-html:hover:after { content: "\f121"; }
.th-ppt:hover:after { content: "\f1c4"; }

.GOL_list .check { width: 30px; flex-grow: 0; flex-shrink: 0; }
.GOL_list .name { width: 300px; flex-grow: 2; }
.GOL_list .tags { width: 100px; flex-grow: 1; }
.GOL_list .options { text-align: right; width: 170px; flex-grow: 0; flex-shrink: 0; }
.GOL_list .options button { margin-right: 0; }
.GOL_list .resolution { width: 100px; flex-grow: 0; flex-shrink: 0; }
.GOL_list .last_modified { width: 100px; flex-grow: 0; flex-shrink: 0; }

.GOL_item.ERROR .name { color: #aaa; }
.GOL_item.QUEUED .name { color: #aaa; }



.GOL_grid .GOL_head { display: none; }
.GOL_grid .GOL_body { display: flex; flex-wrap: wrap; }
.GOL_grid .GOL_item { height: 300px; min-width: 300px; max-width: 500px; flex-grow: 1; position: relative; margin: 0 20px 20px 0; box-shadow: 0 0 20px rgba(0,0,0,.2); }
.GOL_grid .GOL_item .th { height: 100%; background: #ccc no-repeat center center; background-size: cover; }
.GOL_grid .GOL_item .th:after { font-size: 80px; }

/*.GOL_grid .GOL_item .th-folder { height: 100%; background-image: url('../img/ico/folder.png'); background-size: 50%; }*/

.GOL_grid .GOL_item .th img { display: none; }
.GOL_grid .GOL_item .th span { display: none; }
.GOL_grid .GOL_item .name { position: absolute; color: #fff; top: 0; padding: 10px 15px; width: 100%; height: 100%; z-index: 1; background: linear-gradient(to bottom,  rgba(0,0,0,.2) 0%, rgba(255,255,255,0) 15%); }
.GOL_grid .GOL_item .name a { width: 100%; height: 100%; display: block; }
.GOL_grid .GOL_item .tags { display: none; }
.GOL_grid .GOL_item .options { position: absolute; bottom: 0; left: 0; z-index: 2; background-color: #fff; width: 100%; text-align: center; }
/*.GOL_grid */.GOL_item .options br { display: none; }
.GOL_grid .GOL_item .options button { width: auto; overflow-x: hidden; padding: 1px 3px; }
/*.GOL_grid */.GOL_item .options button span { display: none; } /* turn off labels */
.GOL_grid .GOL_item .checkbox { position: absolute; top: 0; right: 0; width: 30px; height: 30px; background-color: #fff; z-index: 2; border: 5px solid #fff; }
.GOL_grid .GOL_item .checkbox.act { background-color: #f55b07; }
.GOL_grid .GOL_item .list_only { display: none; }


.GOL_item.selected .checkbox, tr.selected td button.checkbox, tr.checked td button.checkbox { background: #ccc; }




.GOL_grid .GOL_body .w400 { width: auto; } 



button.checkbox { width: 16px !important; height: 16px; display: block; background-color: #fff; border: 1px solid #ccc; padding: 0; }
button.checkbox.act { background: #ccc; }

.GOL_grid .GOL_item button.checkbox { width: 30px !important; }






/* TERMINALS */

/* DATA TABLES */
div.dataTables_filter { float: none !important; text-align: left !important; width: 300px !important; } 
div.dataTables_filter input { margin-left: 0 !important; } 










/* DS: library */
#sidebar_ds_content input[type="search"] { display: block; padding: 5px; margin-bottom: 10px; }

.sidebar_ds_nav { margin: 10px 0 10px; }
.sidebar_ds_nav a { font-weight: bold; padding: 6px 10px; background: #f4f4f4 !important; }
.sidebar_ds_content a { display: flex; align-items: center; position: relative; margin-bottom: 10px; border-right: 4px solid #ccc; background: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.1); text-decoration: none; color: #333; }
.sidebar_ds_content a span.th { width: 60px; height: 60px; flex-shrink: 0; background: #ccc no-repeat center center; background-size: cover; margin-right: 10px; }
.sidebar_ds_content a span.remove { position: absolute; top: -9px; right: -10px; font-size: 12px; background: #999; color: #fff; border-radius: 50%; display: none; width: 20px; height: 20px; text-align: center; padding-top: 3px; }
.sidebar_ds_content a:hover span.remove { display: block; }

.sidebar_ds_content a.FOLDER { border-color: darkgrey; }
.sidebar_ds_content a.MEDIAITEM { border-color: pink; }
.sidebar_ds_content a.ACTION { border-color: #4B3DFF; }
.sidebar_ds_content a.COLLECTION { border-color: greenyellow; display: none !important; }

.sidebar_ds_content a.IMAGE { border-color: #FFEBD5; }
.sidebar_ds_content a.VIDEO { border-color: #87C121; }
.sidebar_ds_content a.AUDIO { border-color: #F5C007; }
.sidebar_ds_content a.DOC { border-color: #262427; }
.sidebar_ds_content a.HTML { border-color: #FFEBD5; }
.sidebar_ds_content a.STREAM { border-color: #18CFE5; }
.sidebar_ds_content a.RSS { border-color: #f55b07; }
.sidebar_ds_content a.SCROLL { border-color: #9F7F5E; }
.sidebar_ds_content a.RTF { border-color: #9B93FF; }


/* DS: library / toolbar */
.library_toolbar { border: 1px solid #dedede; border-width: 1px 0; background: #e8e8e8; height: 52px; margin: -21px -20px 20px; text-align: center; }
.library_toolbar .buttons { margin: 0; padding: 0; background: none; border: none; }
.library_toolbar .buttons button { border: none; background: none; padding: 5px; text-align: center; margin: 0 5px; }
.library_toolbar .buttons button * { vertical-align: text-bottom; }
.library_toolbar .buttons button i { font-size: 16px; margin-right: 3px; }
.library_toolbar .buttons button:hover, .library_toolbar .buttons button.act { color: #f55b07; }

/* DS: library / toolbar / library_add */
#sidebar_library_dropdown { position: absolute; top: 105px; left: 20px; background: #fdfdfd; z-index: 10000; list-style: none; text-align: left; width: 310px; margin: 0; padding: 10px; box-shadow: 1px 1px 5px rgba(0,0,0,.2); }
#sidebar_library_dropdown li { margin: 0; padding: 0; }
#sidebar_library_dropdown li a { padding: 7px; border-bottom: 1px solid #eee; margin: 0; display: list-item; }
#sidebar_library_dropdown li.last a { border-bottom: none; }

/* DS: library sort */
#library_sort { background: #fff; border: 1px solid #e5e5e5; height: 29px; text-align: center; }
#library_sort button { border: none; background: none; padding: 0; height: 100%; }
#library_sort button.act { color: #f55b07; }



/* dropzone */
#my-awesome-dropzone input[type="file"] { display: none }
.dz-default.dz-message { border: 1px solid #dedede; background: #e8e8e8; text-align: center; padding: 30px 10px; cursor: pointer; margin-bottom: 20px; }

.dz-preview { background: #fff; width: 100% !important; box-shadow: 0 0 5px rgba(0,0,0,0.1); margin: 0 0 10px !important; height: 60px; }

.dz-image { width: 60px; height: 60px; background: #ddd url('../img/ico_uploading.gif') no-repeat center 15px; position: absolute; top: 0; left: 0; }
.dz-details { width: calc(100% - 75px); position: absolute; top: 5px; left: 70px; }
.dz-details .dz-size { color: #fff; position: absolute; top: 40px; left: -70px; background: #999; width: 60px; text-align: center; font-weight: normal !important; }
.dz-details .dz-size strong { font-weight: normal !important; }
.dz-details .dz-filename { max-width: 220px; max-height: 32px; overflow: hidden; }

.dz-preview .dz-progress { border: none !important; width: calc(100% - 80px); position: absolute; bottom: 5px; right: 10px; height: 5px !important; background: #eee; }
.dz-preview .dz-progress .dz-upload { background: #999 !important; }

.dz-remove { position: absolute; top: 0; right: 0; background: #f55b07; color: #fff; padding: 2px 4px; display: none; text-decoration: none !important; font-size: 12px; }
.dz-preview:hover .dz-remove { display: block; }

/*.signio_error .dz-progress { display: none !important; }*/
.signio_error .dz-image { background: #ddd url('../img/ico_uploading_error.png') no-repeat center 11px !important; }
.signio_error .dz-error-message { position: absolute; bottom: 5px; left: 70px; color: #fff !important; background-color: #BD362F; padding: 1px 3px; font-size: 11px; }


/* dropzone - library */
.dz { padding: 20px; background-color: #fdfdfd; border: 1px solid #E8E9EB; text-align: center; position: relative; }
.dz .dz-preview  { position: relative; margin-top: 20px !important; height: 30px; box-shadow: none; }
.dz .dz-image, .dz .dz-error-message, .dz .dz-success-mark, .dz-error-mark, .dz .dz-size { display: none; }
.dz .dz-details { position: static; width: 100%; }
.dz .dz-progress { width: 100%; height: 5px; right: 0; bottom: 0; }

.dz .dz-upload { display: block; background-color: #f6f6f6; height: 5px; width: 0%; }
.dz .dz-filename { text-align: left; position: absolute; line-height: 30px; left: 2px; height: 100%; }

/*#fonts_msg { margin-top: 20px; background: #f55b07; color: #fff; padding: 10px; }*/




.multiselect { background: #eee; padding: 1px 4px; }
.multiselect.selected { background: #555; color: #fff; }

/* cart, library, actions */
a.selectable.selected { background-color: #FFFFE0 !important; }









/* tooltips */
[data-tt]:after { content: attr(data-tt); position: absolute; top: -15px; background-color: #000; padding: 4px 6px; color: #fff; font-size: 13px; border-radius: 3px; font-family: 'Roboto'; z-index: 100000000; display: none; }
[data-tt]:hover:after { display: block; }
.GOL_list button.ico { position: relative; }

.options button[data-tt]:last-of-type:after { left: -35px; }
td button.ico[data-tt] { margin-right: 0; } /* dla ikon w tabelach bez widocznych napisów (ściśnięte) */ 

/* overwrite */
/*.select2-container--default .select2-selection--multiple { border-radius: 0; border-color: #e5e5e5; min-height: 29px; }*/
/*.select2-container--default.select2-container--focus .select2-selection--multiple { border-color: #aaa; }*/
/*.select2-container--default .select2-selection--multiple .select2-selection__choice { border-radius: 0; border-color: #e5e5e5; background: #f1f1f1; }*/












.status, .state { font-size: 11px; color: #fff; padding: 2px 4px; display: inline-block; border-radius: 3px; }
.status--1 { background-color: #ddd; color: red; }
.status-0 { background-color: red; }
.status-1 { background-color: green; }
.status-2 { background-color: grey; }
.status-3 { background-color: grey; }
.status-4 { background-color: grey; }

.state-0 { background-color: green; }
.state-1 { background-color: red; }
.state-2 { background-color: blue; }







/* ? */
#copy_to_clipboard { position: absolute; top: -666px; left: -666px; }
button.link, input[type="submit"].link { background: none; border: none; margin: 0; padding: 0; }
th { text-align: left; min-width: 35px; }



/* pagination */

.pagination { display: flex; margin: 15px 0; list-style: none; padding: 0; } 
.pagination a { align-items: flex-start; padding: 4px 8px; text-decoration: none; background-color: #333; color: #fff; margin-right: 1px; } 
.pagination a:hover, .pagination a.act { background-color: red; cursor: pointer; }

.pagination li.active a { background: red; }
th.asc:after { content: ' \2191'; }
th.desc:after { content: ' \2193'; } 








.dropdown { position: relative; }
.dropdown ul { position: absolute; display: none; background: #fff; list-style: none; padding: 0; z-index: 10; border: 1px solid #ddd; border-bottom: 0; }
.dropdown ul li { padding: 4px 8px; border-bottom: 1px solid #ddd; }
.dropdown:hover ul { display: block; }






#ghost { padding: 15px 20px; border-radius: 3px; position: absolute; top: -100vh; right: 0; z-index: 2; display: none; background: #fff; border: 2px solid #ccc; }
#ghost.act { display: block; }

/* quick logs */
#quick_logs { position: fixed; bottom: 10px; right: -1000px; padding: 20px; background-color: #fff; border: 1px solid #E8E9EB; box-shadow: 1px 1px 5px rgba(0, 0, 0, .0.5); min-width: 700px; transform: translateX(0); transition: transform 500ms; }
#quick_logs.act { transform: translateX(-1010px); transition: transform 500ms; }

#quick_logs h3 { margin-top: 0; background: #f9f9f9; margin: -20px -20px 20px; padding: 10px 10px; font-size: 14px; }
#quick_logs h3 a { font-size: 12px; color: #f55b07; margin-left: 10px; }

#quick_logs .time { display: block; }
#quick_logs .close { position: absolute; top: -1px; right: 0; width: 37px; height: 38px; line-height: 37px; background-color: #E8E9EB; color: #fff; border: none; }
#quick_logs .close:hover { background-color: #ddd; }
#quick_logs tbody tr:last-of-type td { border-bottom: none; }



/* popup */
#popup { display: flex; position: fixed; top: -200vh; left: 0; width: 100vw; height: 100vh; justify-content: center; align-items: center; transform: translate(0, 0); z-index: 25;  }
#popup.act { transform: translate(0, 200vh); background-color: rgba(255,255,255,0.3); transition: transform 200ms cubic-bezier(0.19, 1, 0.22, 1); }
#popup h2:first-of-type { margin-top: 0; background: #f9f9f9; margin: -20px -20px 20px; padding: 15px 20px; font-size: 18px; }
#popup label:first-of-type { margin-top: 2px; }

#popup h2:first-of-type a { margin-right: 30px; }
#popup h2:first-of-type a.act { border-bottom: 2px solid #f55b07; }

#popup_content { max-height: 100vh; }

#popup.over_main { width: 1100px; height: 100vh; left: 50px; top: 0; }
#popup.over_main.act { background-color: none; transform: none; }
#popup.over_main > div { width: calc(100% - 40px); height: calc(100% - 40px); /*box-shadow: none;*/ max-width: 100%; padding: 20px; }


#popup h3 { border-bottom: 1px solid #e5e5e5; font-size: 18px; color: #676768; text-transform: uppercase; padding-bottom: 7px; margin-top: 30px; }







.popup2 { position: absolute; z-index: 1000; top: 50%; left: 50%; width: 600px; min-height: 400px; margin-left: -300px; margin-top: -350px; padding: 20px; background: #fff; box-shadow: 0 0 20px rgba(0,0,0,.2); }



#popup > div { background-color: #fff; padding: 20px; box-shadow: 0 0 30px rgba(0,0,0,0.2); min-width: 100px; min-height: 200px; max-width: 95%; position: relative; }
#popup .close { background-color: #f0f0f0; position: absolute; width: 52px; height: 52px; line-height: 52px; top: 0; right: 0; display: block; text-align: center; color: #ddd; font-size: 20px; }
#popup .close:hover { background-color: #f55b07; color: #fff; }


/* popup: nav (additional navigation) */
.popup_nav { line-height: 170%; margin-right: -5px; } 
.popup_nav li { border-bottom: 1px solid #eee; } 
.popup_nav li a { display: list-item; padding: 5px 8px; }
.popup_nav li:hover { border-bottom-color: #f55b07; }
.popup_nav li:hover a { color: #f55b07; }
.popup_nav li.act a { background: #fafafa; }
.popup_nav li.act:hover { border-bottom-color: #eee; color: #000; }

.popup_nav li:first-of-type { border-top: 1px solid #fff; }
.popup_nav li.act:first-of-type { border-top-color: #eee; }






/* VENDORS */
.dataTables_empty { vertical-align: middle; }

.dataTables_paginate { margin-top: 20px; float: none !important; text-align: left !important; }
.paginate_button { border: 1px solid #ddd !important; padding: 5px 10px !important; border-radius: 0 !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled) { border-color: #303030 !important; background: none !important; color: #000 !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button.current { border-color: #303030 !important; background: #303030 !important; color: #fff !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { color: #fff !important; background: #303030 !important; }



/* FEATURES */
#features_list { position: absolute; top: -21px; min-width: 200px; max-height: 300px; overflow-y: auto; padding: 10px; border: 1px solid #E8E9EB; background-color: #F1F2F5; }
#features_list ul { list-style: none; margin: 0; padding: 0; }
#features_list li { margin-bottom: 5px; }
#features_list li:last-of-type { margin-bottom: 0; }
#features_list li a { display: list-item; padding: 5px; text-decoration: none; color: #555; }
#features_list li a:hover { color: var(--blue); }