/**start**/ @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Roboto+Mono:ital,wght@0,400;0,700;1,400;1,700&family=Roboto:ital,wght@0,400;0,700;1,400;1,700'); /* Default */ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,400;0,700;1,400;1,700&family=Noto+Sans+Arabic:wght@400;700&family=Noto+Sans+Hebrew:wght@400;700&family=Noto+Sans+SC:wght@400;700&family=Noto+Sans+Symbols:wght@400;700&family=Noto+Sans+Symbols+2:wght@400;700'); /* Extensions */ :root { --font-site: Manrope,'Noto Sans','Noto Sans Arabic','Noto Sans Hebrew','Noto Sans SC', Helvetica,Arial,sans-serif; --font-cms: Manrope,'Noto Sans','Noto Sans Arabic','Noto Sans Hebrew','Noto Sans SC', Helvetica,Arial,sans-serif; --font-body: var(--font-site); --font-mono: 'Roboto Mono', Consolas,Menlo,Monaco,'Lucida Console','Liberation Mono','DejaVu Sans Mono','Bitstream Vera Sans Mono','Courier New',monospace,sans-serif; --font-serif: Georgia,serif; --font-symbol: 'Noto Sans Symbols','Noto Sans Symbols 2',sans-serif; --text: #444444; --text-light: #c0c0c0; --back: #f5f5f5; --back-detail: #e5e5e5; --back-nested: #e1e1e1; --back-super: #444444; --highlight: #009cff; --highlight-soft: #008dcf; --input: #c0c0c0; --input-hover: #bdbdbd; --input-focus: #86bad9; --input-edit-background: #fffcf9; --input-background-selected: #e1e1e1; --input-placeholder: #aaaaaa; --input-text: #000000; --input-text-disabled: #6d6d6d; --input-element-height: 2.2em; --input-element-padding: 0.4em; --button: #000000; --button-text: #ffffff; --button-border: #000000; --button-hover: var(--button); --button-hover-border: #2e2e2e; --button-focus: var(--button); --button-focus-border: #0096ff; --button-disabled: #a4a4a4; --button-disabled-border: #a4a4a4; --button-selected: #ffffff; --button-selected-border: var(--back-detail); --button-selected-text: #000000; } body { --view-height: 100vh; } /* RESET */ :host(default) { /* START include in shadow DOM */ } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; outline: 0; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, dl, ul { list-style: none; } pre { } blockquote, q { quotes: none; } blockquote::before, blockquote::after, q::before, q::after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /* FireFox button style */ *[type=button]::-moz-focus-inner, *[type=submit]::-moz-focus-inner, *[type=reset]::-moz-focus-inner { padding: 0; border: 0 none; } /* FireFox image placeholder */ img:-moz-loading { visibility: hidden; } /* Webkit style */ *[type=button], *[type=submit], input[type=text], input[type=password], input[type=search], input[type=date], input[type=number], textarea, select { -webkit-appearance: none; appearance: none; border-radius: 0; } *[type=button]:focus, *[type=submit]:focus, input[type=text]:focus, input[type=password]:focus, input[type=search]:focus, input[type=date]:focus, input[type=number]:focus, textarea:focus, select:focus { -webkit-tap-highlight-color: transparent; outline: none; } /* Do not force fieldset size in relation to its contents */ fieldset { min-width: 0px; } abbr { border-bottom: 1px dotted black; } sup { font-size: 0.75em; vertical-align: super; line-height: 0; } sub { font-size: 0.75em; vertical-align: sub; line-height: 0; } em { font-style: italic; } i { font-style: italic; } strong { font-weight: bold; } b { font-weight: bold; } ins { text-decoration: underline; } del { text-decoration: line-through; } small { font-size: 0.8em; } big { font-size: 1.2em; } :host(default) { /* END include in shadow DOM */ } /* INTERFACE */ textarea, .body-content, select, input[type=text], input[type=password], input[type=search], input[type=date], input[type=number] { font-family: var(--font-mono); font-size: 1.2rem; height: var(--input-element-height); padding: 0px var(--input-element-padding); margin: 0px; border: 1px solid var(--input); background-color: #ffffff; color: var(--input-text); vertical-align: middle; box-sizing: border-box; } option, optgroup { font-family: inherit; font-size: inherit; font-style: normal; background-color: inherit; color: inherit; text-align: left; } optgroup { font-weight: bold; } input[type=text], input[type=password], input[type=search], input[type=date] { width: 300px; } input[type=number] { width: 80px; } textarea, .body-content { line-height: 1.4em; width: 300px; padding: 0.6em 0.6em; height: 6em; resize: both; } .body-content { overflow: auto; width: 400px; height: 7em; line-height: 1.5; font-size: 1.4rem; } select { overflow: hidden; text-overflow: ellipsis; line-height: 1.4em; } select[multiple] { min-height: 6em; height: auto; } select[multiple] option:checked { background-color: var(--input-background-selected); } textarea, .body-content, select, input[type=text], input[type=password], input[type=search], input[type=date], input[type=number], .tags > ul > li { border-radius: 2px; box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08) inset; transition: box-shadow 0.2s ease-in-out, border 0.2s ease-in-out, background-color 0.2s ease-in-out; } textarea:hover, .body-content:hover, select:hover, input[type=text]:hover, input[type=password]:hover, input[type=search]:hover, input[type=date]:hover, input[type=number]:hover, .tags > ul > li:hover { border: 1px solid var(--input-hover); box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2) inset; } textarea:focus, .body-content:focus-within, select:focus, input[type=text]:focus, input[type=password]:focus, input[type=search]:focus, input[type=date]:focus, input[type=number]:focus { border: 1px solid var(--input-focus); box-shadow: 0 0 3px 0 rgba(149, 200, 232, 0.6) inset; } textarea:disabled, .body-content:disabled, select:disabled, input[type=text]:disabled, input[type=password]:disabled, input[type=search]:disabled, input[type=date]:disabled, input[type=number]:disabled { color: var(--input-text-disabled); } input[type=radio], input[type=checkbox] { border: 0px; height: auto; vertical-align: middle; padding: 0px; margin: 0px; } *[type=button], *[type=submit] { font-family: inherit; background-color: var(--button); border: 1px solid var(--button-border); border-radius: 2px; color: var(--button-text); font-size: 11px; font-weight: bold; height: 2.5em; padding: 0px 1.1em 0px 1.1em; margin: 8px 0px; vertical-align: middle; cursor: pointer; box-sizing: border-box; } *[type=button]:hover, *[type=submit]:hover { background-color: var(--button-hover); border-color: var(--button-hover-border); } *[type=button]:active, *[type=submit]:active { background-color: var(--button-focus); border-color: var(--button-focus-border); } *[type=button]:disabled, *[type=submit]:disabled { background-color: var(--button-disabled); border-color: var(--button-disabled-border); } *[type=button].selected, *[type=submit].selected { background-color: var(--button-selected); color: var(--button-selected-text); border-color: var(--button-selected-border); } *[type=submit].invalid { width: 0px !important; height: 0px !important; border: 0px !important; margin: 0px !important; padding: 0px !important; } select ~ *[type=button]:not(.data), input[type]:not([type=hidden]):not([type=button]):not([type=submit]) ~ *[type=button]:not(.data), label ~ *[type=button]:not(.data), select ~ *[type=submit], input[type]:not([type=hidden]):not([type=button]):not([type=submit]) ~ *[type=submit], label ~ *[type=submit] { display: inline; height: 2.4em; margin-top: 0px; margin-bottom: 0px; padding: 0px 0.7em 0px 0.7em; } *[type=button].data { margin: 0px; border: 0px; } *[type=button].data, *[type=button].data:hover, *[type=button].data:active { text-transform: lowercase; display: inline-block; vertical-align: middle; font-size: 10px; font-weight: bold; color: #ffffff; height: 1.7em !important; padding: 0px 6px; } *[type=button].data.add, *[type=button].data.add:hover, *[type=button].data.add:active { background-color: #3d9400; } *[type=button].data.del, *[type=button].data.del:hover, *[type=button].data.del:active { background-color: #fd5c4d; } *[type=button].data.edit, *[type=button].data.edit:hover, *[type=button].data.edit:active { background-color: #4c8efa; } *[type=button].data.neutral, *[type=button].data.neutral:hover, *[type=button].data.neutral:active { background-color: #7c7c7c; } *[type=button].data.view, *[type=button].data.view:hover, *[type=button].data.view:active { display: inline-block; width: 17px; height: 17px !important; background: transparent url('/CMS/css/images/icons/search.svg') no-repeat; background-size: 100% 100%; vertical-align: middle; line-height: 1 !important; padding: 0px; cursor:pointer; } input[type=range] { width: 150px; vertical-align: middle; } input[type=range] + input[type=number] { width: 50px; } label { display: inline-block; vertical-align: middle; } .input { display: inline; vertical-align: middle; } input[type] + input[type], *[type=button] + input[type], select + input[type], textarea + input[type], .input + input[type], input[type] + *[type=button], *[type=button] + *[type=button], select + *[type=button], textarea + *[type=button], .input + *[type=button], input[type]+ select, *[type=button] + select, select + select, textarea + select, .input + select, input[type] + textarea, *[type=button] + textarea, select + textarea, textarea + textarea, .input + textarea, input[type] + .input, *[type=button] + .input, select + .input, textarea + .input, .input + .input { margin-left: 4px; } input[type] + label, *[type=button] + label, select + label, textarea + label, .input + label, label + label, label + input[type], label + *[type=button], label + select, label + textarea, label + .input { margin-left: 5px; } .split + input[type], .split + *[type=button], .split + select, .split + textarea, .split + .input, input[type] + .split, *[type=button] + .split, select + .split, textarea + .split, .input + .split, .split + .split, .split + label, label + .split { margin-left: 6px; } * + *[type=button].data, *[class] + *[type=button].data, input[type] + *[type=button].data, *[type=button] + *[type=button].data, select + *[type=button].data, textarea + *[type=button].data, .input + *[type=button].data, .split + *[type=button].data, label + *[type=button].data, *[type=button].data + *[type=button].data, *[type=button].data + input[type], *[type=button].data + *[type=button], *[type=button].data + select, *[type=button].data + textarea, *[type=button].data + .input, *[type=button].data + .split, *[type=button].data + label { margin-left: 6px; } input[type=hidden], input[type=hidden]:first-child + input[type], input[type=hidden]:first-child + *[type=button], input[type=hidden]:first-child + select, input[type=hidden]:first-child + textarea, input[type=hidden]:first-child + label, input[type=hidden]:first-child + .input, input[type=hidden]:first-child + .split, input[type=hidden]:first-child + *[type=button].data, input[type=hidden]:first-child + input[type=hidden] + input[type], input[type=hidden]:first-child + input[type=hidden] + *[type=button], input[type=hidden]:first-child + input[type=hidden] + select, input[type=hidden]:first-child + input[type=hidden] + textarea, input[type=hidden]:first-child + input[type=hidden] + label, input[type=hidden]:first-child + input[type=hidden] + .input, input[type=hidden]:first-child + input[type=hidden] + .split, input[type=hidden]:first-child + input[type=hidden] + *[type=button].data, input[type].hide, *[type=button].hide, select.hide, textarea.hide, .input.hide, .split.hide, .hide:first-child + input[type], .hide:first-child + *[type=button], .hide:first-child + select, .hide:first-child + textarea, .hide:first-child + label, .hide:first-child + .input, .hide:first-child + .split, .hide:first-child + *[type=button].data, *[type=submit].invalid + input { margin-left: 0px; } *[type=submit], *[type=button] { margin-left: 0px; } input[type=radio] + span, input[type=checkbox] + span, input[type=radio] + input[type=hidden] + span, input[type=checkbox] + input[type=hidden] + span, label > input[type] + span, label > .input + span, label > select + span { margin-left: 4px; vertical-align: middle; } span.input-split > span { padding-left: 4px; display: inline-block; box-sizing: border-box; } span.input-split > span:first-child { padding-left: 0px; } span.split { display: inline; vertical-align: middle; border-left: 1px solid #000000; } menu { margin: 8px 0px; } menu *[type=button], menu *[type=submit] { display: inline-block; margin: 0px; } menu > *[type=button] + *[type=button], /* Single line */ menu > *[type=submit] + *[type=submit] { margin-left: 4px; } menu > *[type=submit][name] + *[type=submit]:not([name]), menu > *[type=submit][name] + *[type=submit].save, menu > *[type=submit]:not([name]):not(.hide) + *[type=submit][name], menu > *[type=submit].save:not(.hide) + *[type=submit][name] { margin-left: 8px; } menu > div { margin: -2px !important; } /* Multi line */ menu > div > *[type=button], menu > div > *[type=submit], menu > div > *[type=button] + *[type=button], menu > div > *[type=submit] + *[type=submit], menu > div > *[type=button].hide + *[type=button], menu > div > *[type=submit].hide + *[type=submit] { margin: 2px; } menu.select *[type=button], menu.select *[type=submit], .tabs > ul li { clip-path: url('data:image/svg+xml;utf8,#clip'); clip-path: polygon(5px 0px, 100% 0%, 100% 100%, 0px 100%, 0px 5px); -webkit-clip-path: polygon(5px 0px, 100% 0%, 100% 100%, 0px 100%, 0px 5px); background-image: url('data:image/svg+xml;utf8,'); background-repeat: no-repeat; } menu.select *[type=button].selected, menu.select *[type=submit].selected, .tabs > ul li.selected { background-image: url('data:image/svg+xml;utf8,'); } .toolbox { z-index: 99999; position: absolute; pointer-events: none; } .toolbox > * { pointer-events: initial; } fieldset > ul > li > label:first-child + * > input[type], fieldset > ul > li > label:first-child + * > *[type=button], fieldset > ul > li > label:first-child + * > textarea, fieldset > ul > li > label:first-child + * > select, fieldset > ul > li > label:first-child + * > .input { display: inline-block; margin-top: 0px; margin-bottom: 0px; vertical-align: middle; } fieldset > ul > li > label:first-child + * > .options { margin: 0px; } fieldset > ul > li > label:first-child + section.info { margin: 0px; } ul.sorter > li > div > input[type], ul.sorter > li > div > *[type=button], ul.sorter > li > div > textarea, ul.sorter > li > div > select, ul.sorter > li > div > .input, ul.sorter > li > ul > li > input[type], ul.sorter > li > ul > li > *[type=button], ul.sorter > li > ul > li > textarea, ul.sorter > li > ul > li > select, ul.sorter > li > ul > li > .input, ul.sorter > li > ul > li > div > input[type], ul.sorter > li > ul > li > div > *[type=button], ul.sorter > li > ul > li > div > textarea, ul.sorter > li > ul > li > div > select, ul.sorter > li > ul > li > div > .input { display: inline-block; margin-top: 0px; margin-bottom: 0px; vertical-align: middle; } .input-error, .input-error[type=hidden] + input, .input-error[type=hidden] + div + input { border: 1px solid #e2d0d0 !important; background-color: #fcf0f0 !important; color: #280b0b !important; } div.labeler, div.labeler .data[type=button] { position: relative; } div.labeler .data[type=button] { margin: 0px; } div.labeler .data[type=button] + .data[type=button] { margin-left: 2px; } input.multi + label { margin-left: 8px; } *[type=button].pulse, *[type=submit].pulse, a.pulse, .a.pulse, .pulse { background-color: var(--highlight); } *[type=button].pulse-from, *[type=submit].pulse-from, a.pulse-from, .a.pulse-from, .pulse-from { } *[type=button].pulse, *[type=submit].pulse { border-color: var(--highlight); } *[type=button].pulse-from, *[type=submit].pulse-from { } div.filebrowse > .select > label > input[name=catch], input[type=search], input.autocomplete { background-image: url('/CMS/css/images/icons/search.svg'); background-repeat: no-repeat; background-position: left var(--input-element-padding) center; background-size: 15px 15px; padding-left: calc(15px + (var(--input-element-padding) * 2)); } input.waiting { background-image: url('/CMS/css/images/loading.gif'); } input[type=search].select { background-image: url('/CMS/css/images/icons/link.svg'); cursor: pointer; } input[type=date], input.date, input.datepicker { background-image: url('/CMS/css/images/icons/date.svg'); background-repeat: no-repeat; background-position: left var(--input-element-padding) center; background-size: 15px 15px; padding-left: calc(15px + (var(--input-element-padding) * 2)); } input[type=date], input.date, input.datepicker { width: 9.4em; } input.date-time { width: 4em; } select:not([multiple]) { background-image: url('/CMS/css/images/icons/down.svg'); background-repeat: no-repeat; background-position: right var(--input-element-padding) center; background-size: 9px 9px; padding-right: calc(9px + (var(--input-element-padding) * 2)); } img.enlarge { cursor: pointer; } .tags { margin: 8px 0px; white-space: normal; } .tags:not(.list) > ul:not(:empty) { margin: -3px !important; } .tags > ul:empty { margin: 0px; } .tags > ul > li { display: inline-block; margin: 3px; white-space: nowrap; background-color: #ffffff; font-size: 1.2rem; height: var(--input-element-height); border: 1px solid var(--input); box-sizing: border-box; } .tags.list > ul > li { display: block; width: max-content; margin: 0px; margin-top: 4px; } .tags.list > ul > li:first-child { margin-top: 0px; } .tags > ul > li > span { display: inline-block; vertical-align: middle; line-height: 1em; height: 100%; padding: 0.5em /* tweak to match font */ var(--input-element-padding); overflow: hidden; text-overflow: ellipsis; font-family: var(--font-mono); box-sizing: border-box; } .tags > ul > li > span:first-child > span { vertical-align: baseline; } .tags > ul > li > span:first-child span.icon { height: 9px; } .tags > ul > li > span + span:last-child { padding-right: calc(var(--input-element-padding) * 1.5); } .tags > ul > li > span.handler { padding-top: 0px; padding-bottom: 0px; cursor: pointer; user-select: none; } .tags > ul > li > span.handler .icon svg { width: 10px; } .tags > ul > li > span.handler:hover .icon { color: var(--input-focus); } .tags > ul > li > span.handler > span:first-child + span { display: none; } .tags.plus > ul > li > span.handler > span:first-child { display: none; } .tags.plus > ul > li > span.handler > span:first-child + span { display: inline-block; } .tags > ul > li.min > span.handler > span:first-child { display: inline-block; } .tags > ul > li.min > span.handler > span:first-child + span { display: none; } .tags > ul > li.plus > span.handler > span:first-child { display: none; } .tags > ul > li.plus > span.handler > span:first-child + span { display: inline-block; } .tags.content > span.icon { margin-right: 5px; color: #666666; } .tags.content > span.icon svg { height: 1.3em; } .tags.content a { color: #666666; text-decoration: none; font-size: 1.1rem; } .tags.content a + a { margin-left: 4px; } .tags.content a:hover { color: #000000; text-decoration: underline; } div.autocomplete.tags { margin: 0px; font-family: var(--font-mono); } div.autocomplete.tags + input[type=search] { margin-left: 0px; } div.autocomplete.tags > ul > li { font-size: 1.1rem; } div.autocomplete.tags:not(.list) > ul:not(:empty) { margin: -2px !important; margin-bottom: 2px !important; } div.autocomplete.tags:not(.list) > ul > li { margin: 2px; } div.autocomplete.tags.list > ul:not(:empty) { margin-bottom: 4px; } div.autocomplete.tags > ul > li > span { } div.autocomplete.tags > ul > li > span:first-child { max-width: 500px; } div.autocomplete.tags.order > ul > li > span:first-child { cursor: ew-resize; } input.autocomplete::-webkit-search-decoration, input.autocomplete::-webkit-search-cancel-button, input.autocomplete::-webkit-search-results-button, input.autocomplete::-webkit-search-results-decoration { display: none; } input.autocomplete::-ms-clear { display: none; } ul.dropdown { position: absolute; border: 1px solid #c0c0c0; background-color: #ffffff; padding: 2px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3); z-index: 999; box-sizing: border-box; } ul.dropdown > li { } ul.dropdown > li > a { display: block; color: #000000; line-height: 1.5; padding: 0.3em var(--input-element-padding); text-decoration: none; white-space: nowrap; } ul.dropdown > li > a.active { background-color: var(--highlight); color: #ffffff; } div.filebrowse > .select { position: relative; overflow: hidden; margin: 0px; } div.filebrowse > .select > input[type=file] { display: none; } div.filebrowse > .select > label { margin-left: 0px; } div.filebrowse > .select > label > span { display: block; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; } div.filebrowse > progress { width: 100%; margin-top: 4px; box-sizing: border-box; } div.filebrowse > ul > li { display: block; margin-top: 4px; line-height: 1; font-size: 1.1rem; } .placeholder { color: var(--input-placeholder); } .tabs { margin: 12px 0px; } .tabs > ul { position: relative; line-height: 1; } .tabs > ul.big { margin: -2px -2px 2px -2px !important; } /* Multi line */ .tabs > ul ul:not(:empty) { margin: 2px 4px 4px 4px; } .tabs > ul li { display: inline-block; text-align: center; vertical-align: bottom; margin-left: 4px; background-color: var(--button); border: 1px solid var(--button-border); border-radius: 2px 2px 0px 0px; } .tabs > ul li:first-child { margin-left: 0px; } .tabs > ul li.selected { background-color: var(--button-selected); border-color: var(--button-selected-border); } .tabs > ul li.no-tab { background-color: transparent; border: 0px; background-image: none; clip-path: none; } .tabs > ul li > a { display: inline-block; color: var(--button-text); text-decoration: none; font-weight: bold; font-size: 1.1rem; padding: 5px 4px; vertical-align: middle; } .tabs > ul li > a > span { display: block; } .tabs > ul li > a > span > span { display: inline-block; } .tabs > ul li > a span[class*=icon-] { font-size: 14px; line-height: 11px; } .tabs > ul li > a > span + span { margin-top: 2px; } .tabs > ul li.selected > a { color: var(--button-selected-text); text-decoration: none; } .tabs > ul li > span { display: none; margin: 4px; vertical-align: middle; } .tabs > ul li > a + span, .tabs > ul li.no-tab > span:first-child { margin-left: 0px; } .tabs > ul li.no-tab > span:last-child { margin-right: 0px; } .tabs > ul li.no-tab > span { margin-top: 0px; } .tabs > ul li > span > span { vertical-align: middle; } .tabs > ul li.active > span, .tabs > ul li > span:first-child { display: inline-block; } .tabs > ul > li { vertical-align: bottom; padding: 2px 6px 3px 6px; border-bottom-width: 0px; margin-bottom: -1px !important; } .tabs > ul.big > li { border-bottom-width: 1px; margin: 2px !important; } .tabs > ul > li > ul:not(:empty) { margin: 0px; } .tabs > ul li.sorting { top: auto; } .tabs > ul > li.sorting { top: auto; bottom: 0px; } .tabs > ul.sorting li > a { cursor: ew-resize; } .tabs > div { padding: 12px; border: 1px solid var(--back-detail); background-color: #ffffff; } .tabs > div > *:first-child, .tabs > div > *:first-child > *:first-child, .tabs > div > *:not(menu):first-child > *:first-child > *:first-child { margin-top: 0px; } .tabs > div > *:last-child, .tabs > div > *:last-child > *:last-child, .tabs > div > *:not(menu):last-child > *:last-child > *:last-child { margin-bottom: 0px; } .tabs > div > *:first-child:empty + *, .tabs > div > *:first-child:empty + * > *:first-child { margin-top: 0px; } .tabs > div > *:has(+ *:last-child:empty), .tabs > div > *:has(+ *:last-child:empty) > *:last-child { margin-bottom: 0px; } .overlay .popup {} .overlay .popup.message > div, .overlay .popup.confirm > div { display: inline-block; padding-left: 20px; position: relative; vertical-align: top; } .overlay .popup.message > .icon svg, .overlay .popup.confirm > .icon svg { height: 25px; vertical-align: top; } .overlay .popup.message > div > *:first-child, .overlay .popup.confirm > div > *:first-child { margin-top : 0px; } .overlay .popup.message > div > *:last-child, .overlay .popup.confirm > div > *:last-child { margin-bottom: 0px; } .overlay .popup > menu { text-align: right; margin: 0px; margin-top: 10px; } .hide-edit:not(.hide) + * { display: none !important; } .hide-edit.hide + * { } .hide-edit.hide + span, .hide-edit.hide + div { vertical-align: middle; cursor: pointer; } input[id^="hide-show"] { display: none; } input[id^="hide-show"]:checked ~ *:not(label) + label { display: none; } input[id^="hide-show"]:not(:checked) ~ *.hide-show, input[id^="hide-show"]:not(:checked) ~ *:not(label) + label + label { display: none; } div.handle { position: absolute; display: block; right: 0px; top: 0px; cursor: move; z-index: 1; color: #aaaaaa; } div.handle > .icon svg { height: 10px; vertical-align: top; } .hide { display: none !important; } .album > table { vertical-align: middle; border-collapse: separate; border-spacing: 10px; width: 100%; table-layout: fixed; } .album > table td { padding: 0px; text-align: center; line-height: 1; } .album > table td img { display: inline-block; max-width: 100%; } .album > img, .album > figure, .album > table td > img, .album > table td > figure { cursor: pointer; } .album-viewer { position: relative; } .album-viewer[data-items="1"] > nav { display: none; } .album-viewer > nav > button { display: none; } .album-viewer:hover > nav > button { display: block; } .album-viewer > div { margin-top: 10px; } nav.album-items > button { position: absolute; width: 30px; height: 3.5rem; top: 15%; color: #000000; background-color: #ffffff; cursor: pointer; text-align: center; margin: 0px; padding: 0px; border: 0px; border-radius: 0px; } nav.album-items > button > .icon svg { height: 45%; } nav.album-items > button.prev { left: 0px; border-top-right-radius: 2px; border-bottom-right-radius: 2px; } nav.album-items > button.next { right: 0px; border-top-left-radius: 2px; border-bottom-left-radius: 2px; } nav.album-items > button:hover { color: #000000; background-color: #ffffff; } iframe.preview { width: 900px; height: 100%; } /* BODY CONTENT */ .body { color: var(--text); line-height: 1.5; font-size: 1.4rem; } .body a, .body a:link, .body a:visited, .body a:active, .body a:hover, .body .a { text-decoration: underline; color: var(--text); } .body a:hover, .body .a:hover { color: var(--highlight); } .body div > img, .body div > object, .body div > video, .body div > iframe { display: block; } .body img, .body object, .body video { max-width: 100%; } .body figure, .body blockquote, .body iframe, .body object, .body video, .body table { margin: 12px 0px; } .body p img, .body p object, .body p video, .body figure > img, .body figure > object, .body figure > video { display: inline-block; } .body figure > img + img, .body figure > object + object, .body figure > video + video { margin-left: 10px; } .body figure > iframe, .body figure > object, .body figure > video, .body figure > table { margin: 0px; } .body figure.embed { width: fit-content; } .body figure.embed *:first-child { margin-top: 0px !important; } .body figure.embed *:last-child, .body figure.embed *:has(+ script:last-child) { margin-bottom: 0px !important; } .body figure .album { margin: 10px; margin-left: -10px !important; margin-right: -10px !important; } .body figure .album:first-child { margin-top: 0px; } .body figure .album:last-child { margin-bottom: 0px; } .body figure .album > table { margin: -10px 0px !important; } .body .album > figure { display: inline-block; } .body .album > figure figurecaption { display: none; } .body ul { margin: 6px 0px; list-style-type: disc; margin-left: 20px; } .body ol { margin: 6px 0px; list-style-type: decimal; margin-left: 20px; } .body pre, .body code { background-color: var(--back); font-family: var(--font-mono); } .body pre { padding: 6px 12px; white-space: pre-wrap; } .body code { padding: 1px 3px; } .body pre > code { display: block; white-space: pre; overflow-x: auto; padding: 0px; } .body aside.left { float: left; margin: 2px 15px 15px 0px; } .body aside.right { float: right; margin: 2px 0px 15px 15px; } .body .nowrap { white-space: nowrap; } .body > *:first-child { margin-top: 0px; } .body > *:last-child { margin-bottom: 0px; } p.info.body, section.info.body { font-size: inherit; } /* TABLE */ td, th { padding: 3px; vertical-align: middle; } th { font-weight: bold; font-size: 14px; text-align: left; } th.split { padding: 0px; } th.split hr { margin: 4px 0px; } td.max, th.max { } td.limit, th.limit { } table.display td, table.list td, table.display th, table.list th { white-space: nowrap; box-sizing: border-box; overflow: hidden; } table.display td, table.list td { text-overflow: ellipsis; } table.display th > div, table.display th > span, table.list th > div, table.list th > span { vertical-align: top; } table.display th > span:not(.icon), table.list th > span:not(.icon) { display: inline-block; width: 100%; overflow: hidden; text-overflow: ellipsis; } table.display th > span:not(.icon) > span, table.list th > span:not(.icon) > span { } table.display td > p, table.list td > p { overflow: hidden; text-overflow: ellipsis; } table.display td > p:first-child, table.list td > p:first-child { margin-top: 0px; } table.display td > p:last-child, table.list td > p:last-child { margin-bottom: 0px; } table.display td.menu, table.list td.menu, table.display th.menu, table.list th.menu { text-align: right; } table.display tbody tr, table.list tbody tr { border-bottom: 1px solid #f1f1f1; } table.display tbody tr:first-child, table.list tbody tr:first-child { border-top: 1px solid #f1f1f1; } table.display tbody tr:nth-child(odd), table.list tbody tr:nth-child(odd) { } table.display tbody tr:hover, table.list tbody tr:hover { background: #f5f5f5; } table.display tbody tr > td.empty, table.list tbody tr > td.empty { text-align: center; } table.display.color tbody tr, table.list.color tbody tr { border-bottom: 2px solid #ffffff; } table.display.color tbody tr:first-child, table.list.color tbody tr:first-child { border-top: 0px; } table.display.color tbody tr:last-child, table.list.color tbody tr:last-child { border-bottom: 0px; } table.display.color tbody tr > td.empty, table.list.color tbody tr > td.empty { border-top: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1; } table tbody tr[data-method]:hover { cursor: pointer; } table.list td span.icon, table.display td span.icon { color: #aaaaaa; } table.list td span.icon:not([data-category]) svg, table.display td span.icon:not([data-category]) svg { max-height: 14px; } table.display th { padding: 2px 18px 8px 10px; cursor: pointer; position: relative; } table.display th.disable-sort { padding-right: 10px; } table.display th > span.icon { position: relative; left: 3px; } table.display th > span.icon svg { width: 10px; height: auto; } table.display th > span.icon svg:first-child { vertical-align: top; opacity: 0.2; } table.display th > span.icon svg:first-child ~ svg { vertical-align: middle; opacity: 1; } table.display th[data-sort*="asc"] > span.icon svg:first-child, table.display th[data-sort*="desc"] > span.icon svg:first-child { display: none; } table.display th:not([data-sort*="asc"]) > span.icon svg:first-child + svg { display: none; } table.display th:not([data-sort*="desc"]) > span.icon svg:first-child + svg + svg { display: none; } table.display th.disable-sort > span.icon { display: none; } table.display td { padding: 6px 10px; } table.list th { padding: 4px 50px 8px 4px; } table.list td { padding: 4px 50px 4px 4px; } table.list th:last-child, table.list td:last-child { padding-right: 3px; } .datatable { margin: 12px 0px; } .datatable > .options { margin-top: 0px; display: flex; flex-flow: row nowrap; align-items: center; } .datatable > .options > div { white-space: nowrap; } .datatable > .options > div:first-child { flex: 1 1 auto; } .datatable > .options > div:first-child input[type=search] { max-width: 250px; } .datatable > .options > div + div { flex: 0 1 auto; text-align: right; padding-left: 20px; } .datatable > .options > div > .count { display: inline-block; margin-left: 10px; vertical-align: middle; } .datatable > .options > div > menu.paginate { display: inline-block; margin: 0px; line-height: 1; } .datatable > .options > div > menu.paginate > *[type=button] { height: 20px; padding: 0px; display: inline-block; } .datatable > .options > div > menu.paginate > *[type=button] { padding-left: 5px; padding-right: 5px; } .datatable > .options > div > menu.paginate > *[type=button]:first-child, .datatable > .options > div > menu.paginate > *[type=button]:last-child { padding-left: 6px; padding-right: 6px; } .datatable > .options > div > menu.paginate > *[type=button] > span.icon svg { height: 10px; } .datatable > .options > div > menu.paginate > span { display: inline-block; margin: 0px 2px; } .datatable > .options > div > menu.paginate > span::before { display: inline-block; content: "…"; } .datatable > table { margin: 0px auto; } /* OTHER */ .tooltip { position: absolute; z-index: 9999999; border: 1px solid #7f7f7f; background: #ffffff; padding: 5px 8px; border-radius: 2px; font-size: 0.95em; overflow: hidden; box-sizing: border-box; } .tooltip h1 { font-size: 1em; margin: 2px 0px; } .tooltip ul, .tooltip dl { margin: -2px 0; display: table; border-collapse: separate; border-spacing: 0px 2px; } .tooltip ul > li, .tooltip dl > div { display: table-row; } .tooltip ul > li > label:first-child, .tooltip dl > div > dt { display: table-cell; vertical-align: top; padding-right: 8px; text-align: right; white-space: nowrap; } .tooltip ul > li > label:first-child + *, .tooltip dl > div > dt + dd { display: table-cell; } .tooltip ul > li > label:first-child + *.limit, .tooltip dl > div > dt + dd.limit { overflow: hidden; text-overflow: ellipsis; max-width: 300px; } .tooltip ul > li > label:first-child + ul { display: table; } .tooltip ul > li > label:first-child:empty, .tooltip dl > div > dt:empty { padding: 0px; width: 0px; } .tooltip ul > hr { margin: 1px 0px; border: 0px; } .tooltip > *:first-child { margin-top: 0px; } .tooltip > *:last-child { margin-bottom: 0px; } .record { margin: 8px 0px; } .record > dl { margin: -6px 0 !important; display: table; border-collapse: separate; border-spacing: 0px 6px; } .record > dl > div { display: table-row; } .record > dl > div > * { display: table-cell; vertical-align: top; } .record > dl > div > dt { white-space: nowrap; padding-right: 15px; } .record > dl > div > dd > .tabs { margin: 0px; } .record > dl > div > dd img { max-width: 100%; } .record > dl > div > dd > p, .record > dl > div > dd > pre { margin: 0px; padding: 8px; background-color: var(--back); box-sizing: border-box; } .options { padding: 14px; margin: 12px 0px; background-color: var(--back); } .options > *:first-child { margin-top: 0px; } .options > *:last-child { margin-bottom: 0px; } .options.nested { margin: 0px; padding: 12px; border: 1px solid var(--back-detail); background-color: #ffffff; } p.info, section.info { position: relative; padding: 14px; margin: 10px auto; background-color: #000000; color: #ffffff; } p.info > *:first-child, section.info > *:first-child { margin-top: 0px; } p.info > *:last-child, section.info > *:last-child { margin-bottom: 0px; } .options p.info, .options section.info { padding: 10px; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .attention { background-color: #fffbd8 !important; color: #000000 !important; } .alert { background-color: #ffd9d9 !important; color: #000000 !important; } .tip { background-color: #eeeeee !important; color: #000000 !important; } .options .tip { background-color: #ffffff !important; } table .info > span { vertical-align: middle; } table .info > span.icon { cursor: pointer; } table .info > span + span { margin-left: 4px; } small.identifier { margin-left: 0.6em; font-size: 1rem; font-family: var(--font-mono) } small.identifier::before { content: "("; margin-right: 0.1em; } small.identifier::after { content: ")"; margin-left: 0.1em; } .fieldsets { margin: 8px 0px; } .fieldsets > div { margin: -6px !important; } .fieldsets > div > fieldset { display: inline-block; margin: 6px !important; } .fieldsets > div > fieldset.full { max-width: calc(100% - 12px); box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } @-moz-document url-prefix() { .fieldsets > div > fieldset.full { display: table-cell; } } .fieldsets > div > fieldset.full > div, .fieldsets > div > fieldset.full > ul { max-width: 100%; overflow-x: auto; } .overlay { position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: 100; padding: 60px; text-align: center; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .overlay > div:first-child { position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background-color: rgba(0, 0, 0, 0.2); } body > .overlay > div:first-child { position: fixed; } .overlay > .dialog { position: relative; display: inline-block; margin: 0px auto; text-align: left; background-color: #ffffff; padding: 15px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .overlay > .dialog > nav { display: none; position: absolute; top: -23px; right: 0px; line-height: 1; } .overlay.active > .dialog > nav { display: block; } .overlay > .dialog > nav > *[type=button] { width: 18px; height: 18px; padding: 0px; margin: 0px; display: inline-block; } .overlay > .dialog > nav > *[type=button] > span.icon svg { height: 9px; } .overlay > .dialog > nav > *.next { margin-right: 12px; } .overlay > .dialog > nav > *.prev { margin-right: 4px; } .overlay > .dialog > .content h1:first-child { margin-top: 0px; } .overlay > .dialog > .content > *[type=submit] { float: right; margin: 5px 0px; } .overlay > .dialog > .content img, .overlay > .dialog > .content video { vertical-align: middle; } .overlay > .dialog > .content > *:first-child, .overlay > .dialog > .content > *:first-child:not(.toolbox) > *:first-child, .overlay > .dialog > .content > *:first-child:not(.toolbox) > *:first-child > *:first-child, .overlay > .dialog > .content > .toolbox + *, .overlay > .dialog > .content > .toolbox + * > *:first-child, .overlay > .dialog > .content > .toolbox + * > *:first-child > *:first-child, .overlay > .dialog > .content > .popup > *:first-child > *:first-child > *:first-child, .overlay > .dialog > .content > .popup > form:first-child > *:first-child > *:first-child > *:first-child { margin-top: 0px; } .overlay > .dialog > .content > *:last-child, .overlay > .dialog > .content > *:last-child > *:last-child, .overlay > .dialog > .content > *:last-child > *:last-child > *:last-child, .overlay > .dialog > .content > .popup > *:last-child > *:last-child > *:last-child, .overlay > .dialog > .content > .popup > form:first-child > *:last-child, .overlay > .dialog > .content > .popup > form:first-child > *:last-child > *:last-child, .overlay > .dialog > .content > .popup > form:first-child > *:last-child > *:last-child > *:last-child { margin-bottom: 0px; } .overlay > .dialog > .content > *:first-child:empty + *, .overlay > .dialog > .content > .toolbox + *:empty + * { margin-top: 0px; } .overlay > .dialog > .content > *:has(+ *:last-child:empty) { margin-bottom: 0px; } .overlay > .dialog > .content table.display { max-width: 0px; display: table; } body.overlaying > .container, body.overlaying > #cms-body, body.overlaying > #cms-header, *:not(body).overlaying > *:not(.overlay), .overlaying > .overlay:not(.active) > .dialog { } .overlay.fit-width > .dialog, .overlay.fit > .dialog { max-width: calc(100vw - 120px); } body > .overlay.fit-width, body > .overlay.fit { max-width: 100vw; } body > .overlay.fit-width > .dialog, body > .overlay.fit > .dialog { max-width: 100%; } .overlay.fit > .dialog { max-height: calc(100vh - 120px); } body > .overlay.fit { max-height: 100vh; } body > .overlay.fit > .dialog { max-height: 100%; } body > .overlay.full-width, body > .overlay.full { width: 100vw; max-width: 100%; } .overlay.full-width > .dialog, .overlay.full-width > .dialog > .content, .overlay.full-width > .dialog > .content > .popup, .overlay.full > .dialog, .overlay.full > .dialog > .content, .overlay.full > .dialog > .content > .popup { width: 100%; } body > .overlay.full { height: 100vh; } body > .overlay.full.ratio { height: auto; } .overlay.full > .dialog, .overlay.full > .dialog > .content, .overlay.full > .dialog > .content > .popup { height: 100%; } .overlay.force-full-width > .dialog { width: calc(100vw - 120px); } .overlay.fit-width > .dialog > .content img, .overlay.fit > .dialog > .content img, .overlay.full > .dialog > .content img, .overlay.force-full-width > .dialog > .content img, .overlay.fit-width > .dialog > .content video, .overlay.fit > .dialog > .content video, .overlay.full > .dialog > .content video, .overlay.force-full-width > .dialog > .content video { max-width: 100%; } .overlay.fit > .dialog > .content img, .overlay.full > .dialog > .content img, .overlay.fit > .dialog > .content video, .overlay.full > .dialog > .content video { max-height: 100%; } ul.select > li { margin-top: 2px; } ul.select.diverse > li { margin-top: 12px; } ul.select > li:first-child { margin-top: 0px; } ul.select > li > label > * { vertical-align: middle; display: inline-block; } ul.select > li > label > input + div { margin-left: 5px; } ul.sorter > li { margin-top: 5px; display: flex; flex-flow: row nowrap; } ul.sorter.diverse > li { margin-top: 12px; } ul.sorter > li:first-child { margin-top: 0px; } ul.sorter > li > span, ul.sorter > li > div, ul.sorter > li > ul { display: inline-block; vertical-align: middle; white-space: nowrap; flex: 0 1 auto; } ul.sorter > li > ul > li + li { margin-top: 5px; } ul.sorter.full > li > ul > li { display: inline-block; } ul.sorter.full > li > ul > li + li { margin-top: 0px; margin-left: 5px; } ul.sorter > li > div > *, ul.sorter > li > ul > li > * { vertical-align: middle; } ul.sorter > li > ul > li .body-content { white-space: normal; } ul.sorter > li > span, ul.sorter span.handle { position: relative; cursor: ns-resize; padding-right: 5px; } ul.sorter > li > span:last-child, ul.sorter span.handle:last-child { padding-right: 0px; padding-left: 5px; } ul.sorter > li > span { vertical-align: top; } ul.sorter > li > span::before { content: ''; display: block; height: calc(50% - (12px / 2)) /* 12px is icon height */; min-height: 0px; max-height: 6px; } ul.sorter > li > span > span.icon, ul.sorter span.handle > span.icon { color: #000000; } ul.sorter > li > span > span.icon svg, ul.sorter span.handle > span.icon svg { height: 12px; } ul.sorter > li > span span.handle, ul.sorter > li > div span.handle { vertical-align: middle; display: inline-block; } ul.sorter.state-single > li > span, ul.sorter.state-single span.handle, ul.sorter.state-single > li > span:last-child, ul.sorter.state-single span.handle:last-child { display: none; } select.state-empty:not([multiple]) { width: 100px; } select.state-placeholder:not([multiple]):not(:checked) { color: var(--input-placeholder); } select.state-placeholder:not([multiple]):not(:checked) option, select.state-placeholder:not([multiple]):not(:checked) optgroup { color: var(--input-text); } ul.sorter:not(.state-single) select.state-empty { width: unset; } menu.sorter { margin: 0px; text-align: left; } menu.sorter button.order { height: 1.7em; font-size: 10px; padding: 0px 5px; } menu.sorter button.order > span { } menu.sorter button.order > span svg { height: 8px; } ul > li.sortsorter-placeholder { opacity: 0; } div.tool-extras { position: absolute; margin-right: 8px; margin-top: 8px; white-space: nowrap; } div.tool-extras > * { display: inline-block; cursor: pointer; opacity: 0.36; } div.tool-extras > *:hover { opacity: 1; } div.tool-extras > button { height: 20px; padding: 0px 6px; margin: 0px; } div.tool-extras > button > span.icon svg { height: 10px; } div.tool-extras > button:not(.hide) + button { margin-left: 4px; } div.tool-extras > .fullscreen:not(.minimize) > span.icon:first-child + span.icon { display: none; } div.tool-extras > .fullscreen.minimize > span.icon:first-child { display: none; } div.tool-extras > .tools.active:not(:hover) { opacity: 0.15; } .tool-extras-placeholder { display: inline-block; vertical-align: middle; border: 0 !important; padding: 0 !important; background-color: var(--back-nested) !important; } textarea.tool-extras-big, input.tool-extras-big, .input.tool-extras-big, .editor-content.tool-extras-big > div { width: 100% !important; min-height: 600px !important; } body.in-fullscreen div.tool-extras-big { width: 100%; height: 100%; top: 0px; right: 0px; bottom: 0px; right: 0px; position: fixed; z-index: 101; } body.in-fullscreen { overflow: hidden; } div.tool-extras-class-editor-inline { margin-right: 0px; margin-top: 0px; } .editor-content { display: inline-block; } .editor-content > menu { margin: 0px 0px 8px 0px; text-align: left; } .editor-content > menu button > span { } .editor-content.inline > menu { margin-bottom: 4px; } .editor-content.inline > menu button { height: 20px; padding: 0px 6px; } .editor-content.inline > menu button > span { } .editor-content.inline > menu button > span svg { height: 10px; } .editor-content > div { position: relative; overflow: auto; padding: 0px; background-color: var(--input-edit-background); } .editor-content textarea, .editor-content pre code { width: 100% !important; padding: 15px !important; height: auto; font-size: 1.4rem; line-height: 1.5; text-size-adjust: none; font-family: var(--font-mono); border: 0; margin: 0; top: 0; left: 0; position: absolute; overflow: hidden; background: transparent; box-sizing: border-box; } .editor-content textarea { z-index: 2; height: auto; box-shadow: none; resize: none; text-fill-color: transparent; -webkit-text-fill-color: transparent; } .editor-content pre { white-space: pre-wrap; word-wrap: break-word; } .editor-content pre code { z-index: 1; } .editor-content textarea { color: #000000; } .editor-content pre code { color: var(--text); } .editor-content[data-tools=""] > div { background-color: #ffffff; } .editor-content > menu button.heading > span, .editor-content > menu button.bold > span, .editor-content > menu button.italic > span { font-size: 14px; } .editor-content.inline > menu button.heading > span, .editor-content.inline > menu button.bold > span, .editor-content.inline > menu button.italic > span { font-size: 12px; } .editor-content > menu button.heading > span { font-weight: bold; } .editor-content > menu button.heading > span > span:first-child + span + span { font-size: 0.8em; } .editor-content > menu button.heading > span > span:first-child + span + span + span { font-size: 0.6em; } .editor-content > menu button.bold > span { font-weight: bold; } .editor-content > menu button.italic > span { font-weight: normal; font-style: italic; font-size: 16px; } .editor-content.inline > menu button.italic > span { font-size: 14px; } .editor-content > menu button.quote > span svg { height: 12px; } .editor-content.inline > menu button.quote > span svg { height: 9px; } .regex > span:first-child::before, .regex > span:first-child + input + span::before { content: "/"; font-size: 1.3em; vertical-align: middle; } .regex > span:first-child + input + span + input + span::before { content: ":"; font-size: 1.3em; vertical-align: middle; } .regex > span:first-child::before { margin-right: 4px; } .regex > span:first-child + input + span { margin: 0px 4px; } .regex > span:first-child + input + span + input + span { margin: 0px 4px; } .regex > input[name$="[flags]"] { width: 35px; } .regex > label > input[name$="[enable]"] + span { letter-spacing: 2px; } .token.comment, .token.prolog, .token.doctype, .token.cdata { color: slategray; } .token.punctuation { color: #999; } .namespace { opacity: .7; } .token.property, .token.tag, .token.boolean, .token.number, .token.constant, .token.symbol, .token.deleted { color: #c60000; } .token.selector, .token.attr-name, .token.string, .token.char, .token.builtin, .token.inserted { color: #6ba100; } .token.operator, .token.entity, .token.url, .language-css .token.string, .style .token.string { color: #9a6e3a; background: hsla(0, 0%, 100%, .5); } .token.atrule, .token.attr-value, .token.keyword { color: #777777; } .token.function, .token.class-name { color: #DD4A68; } .token.regex, .token.important, .token.variable { color: #e90; } .token.important, .token.bold { font-weight: bold; } .token.italic { font-style: italic; } .token.entity { cursor: help; } .token.cc1100punctuation { color: #999999; } .token.cc1100tag { color: #009cff; } .token.cc1100tag-attribute { color: #777777; } .token.cc1100flag { color: #009cff; } .token.cc1100variable, .token.cc1100variable-value { color: #009cff; } /* ICONS */ span.icon, span[class*=icon-] { display: inline-block; } span.icon svg, span[class*=icon-] svg { height: 16px; width: auto; fill: currentColor; vertical-align: middle; } span.icon[data-category="full"], button > span.icon, .tags > ul > li > span.handler .icon { height: 100%; } span.icon[data-category="full"] svg, .tags > ul > li > span.handler .icon svg, button > span.icon svg, button > span.icon-text { position: relative; top: 50%; transform: perspective(1px) translateY(-50%); vertical-align: top; } button > span.icon-text:first-child { display: inline-block; margin-right: 5px; } button > span.icon-text:last-child { display: inline-block; margin-left: 5px; } button > span.icon svg { height: 14px; } span.icon[data-category="direction"] { padding: 0em 0.4em; } span.icon[data-category="direction"] svg { height: 0.8em; max-width: 0.8em; } span.icon[data-category="status"] svg { height: auto; width: 14px; } span.icon[data-category="increase"] svg { } span.icon ~ sup, span[class*=icon-] ~ sup, span.icon ~ sub, span[class*=icon-] ~ sub { vertical-align: middle; font-weight: bold; background-color: #ffffff; color: #000000; padding: 1px 2px; margin-left: -5px; border-radius: 2px; line-height: 1; position: absolute; } span.icon ~ sup > span, span[class*=icon-] ~ sup > span, span.icon ~ sub > span, span[class*=icon-] ~ sub > span { display: block; } span.icon:hover + sup, span[class*=icon-]:hover + sup, span.icon:hover + sub, span[class*=icon-]:hover + sub { } @font-face { font-family: 'icons-fontawesome-brands'; src: url('/CMS/css/fonts/fa-brands-400.eot'); src: url('/CMS/css/fonts/fa-brands-400.eot?#iefix') format('embedded-opentype'), url('/CMS/css/fonts/fa-brands-400.woff') format('woff'), url('/CMS/css/fonts/fa-brands-400.woff2') format('woff2'), /*url('/CMS/css/type/filename.otf') format('opentype'),*/ url('/CMS/css/fonts/fa-brands-400.ttf') format('truetype'); font-style: normal; font-weight: normal; } span[class*=icon-fontawesome-] { font-family: icons-fontawesome-brands; } .icon-fontawesome-facebook::before { content: "\f09a"; } .icon-fontawesome-twitter::before { content: "\f099"; } .icon-fontawesome-youtube::before { content: "\f167"; } .icon-fontawesome-instagram::before { content: "\f16d"; } .icon-fontawesome-linkedin::before { content: "\f08c"; } .icon-fontawesome-mastodon::before { content: "\f4f6"; } /* FEEDBACK */ body > .result { position: fixed; z-index: 99999; pointer-events: none; } body > .result > div { position: relative; display: table; padding: 10px; margin: 0px auto; margin-top: 10px; pointer-events: auto; } body > .result > div:first-child { margin-top: 0px; } body > .result > div > ul > li { margin-top: 10px; display: flex; flex-flow: row nowrap; align-items: baseline; } body > .result > div > ul > li:first-child { margin-top: 0px; } body > .result > div > ul > li > * { vertical-align: top; flex: 0 1 auto; } body > .result > div > ul > li > label, body > .result > div > ul > li > div { display: inline-block; } body > .result > div > ul > li > div { margin-left: 10px; color: #ffffff; white-space: pre-wrap; } body > .result > div > ul > li > div > a { color: #ffffff; text-decoration: underline; } body > .result > div > ul > li > div code { font-family: var(--font-mono); } body > .result > div > ul > li > label, body > .result > div > ul > li:first-child > div { padding: 2px 10px; background-color: #ffffff; font-size: 1.4rem; font-weight: bold; color: inherit; } body > .result > .alert { color: #a00000 !important; background-color: #a00000 !important; } body > .result > .attention { color: #ffb400 !important; background-color: #ffb400 !important; } body > .result > .status { color: #00ccff; background-color: #00ccff; } body > .result > .mediate { color: #000000; background-color: #000000; } body > .result > .loading { background-color: #e0e0e0; } body > .result > .loading span { display: block; width: 16px; height: 11px; background: url('/CMS/css/images/loading.gif') no-repeat 0px 0px; } /* MESSAGE */ body > .system { position: relative; top: 0px; left: 0px; } body > .system > div { box-sizing: border-box; text-align: center; font-size: 1.6rem; } body > .system > div > p:first-child > span.icon { vertical-align: middle; margin-right: 10px; } body > .system > div > p:first-child > span.icon svg { height: 30px; } body > .system > div > p { display: inline-block; vertical-align: middle; margin: 12px 16px; } body > .system > .important { color: #ffffff; background-color: #ffb400; } :root { } /* GERERAL */ html { font-size: 62.5%; } /* Ensure body will stretch along with its content */ body { --font-body: var(--font-site); display: flex; flex-flow: column nowrap; align-content: stretch; align-items: stretch; justify-content: flex-start; position: relative; font-family: var(--font-body); color: #000000; background: #ffffff; line-height: 1.26; font-size: 12px; font-size: 1.2rem; } body.framed { overflow-y: hidden; } p { margin: 8px 0px; } figure { text-align: center; } figurecaption { display: block; margin: 6px 0px 0px 0px; text-align: left; } pre { margin: 12px 0px; } blockquote { margin: 8px 0px; padding: 6px; quotes: "“" "”" "‘" "’"; } blockquote::before { content: open-quote; font-size: 16px; font-weight: bold; line-height: 12px; } blockquote::after { content: close-quote; font-size: 16px; font-weight: bold; line-height: 12px; } blockquote header { font-weight: bold; } blockquote header::after { content: ":"; } h1 { font-size: 20px; font-weight:bold; margin: 8px 0px; } h2 { font-size: 16px; font-weight:bold; margin: 8px 0px; } h3 { font-size: 14px; font-weight:bold; margin: 4px 0px; } h4 { font-size: 12px; font-weight:bold; margin: 4px 0px; } legend { font-size: 14px; font-weight:bold; margin: 2px 0px; } a, a:link, a:visited, a:active, a:hover, .a { cursor: pointer; color: inherit; text-decoration: none; } a:hover, .a:hover { color: var(--highlight); text-decoration: underline; } a.more, a.more:link, a.more:visited, a.more:active, a.more:hover, .a.more { color: var(--highlight); text-decoration: none; } a.more:hover, .a.more:hover { text-decoration: underline; } ::selection { color: #ffffff; background-color: var(--highlight); text-fill-color: currentColor; -webkit-text-fill-color: currentColor; } ::-moz-selection { color: #ffffff; background-color: var(--highlight); text-fill-color: currentColor; -webkit-text-fill-color: currentColor; } hr { margin: 8px 0px; border: 0px; border-bottom: 4px solid #000000; } .mod > *:first-child, .mod > *:first-child:not(.toolbox) > *:first-child, .mod > *:first-child:not(.toolbox) > *:first-child > *:first-child, .mod > .toolbox + *, .mod > .toolbox + * > *:first-child, .mod > .toolbox + * > *:first-child > *:first-child { margin-top: 0px; } .mod > *:last-child, .mod > *:last-child > *:last-child, .mod > *:last-child > *:last-child > *:last-child { margin-bottom: 0px; } .mod > *:first-child:empty + *, .mod > *:first-child:empty + * > *:first-child, .mod > .toolbox + *:empty + *, .mod > .toolbox + *:empty + * > *:first-child { margin-top: 0px; } .mod > *:has(+ *:last-child:empty), .mod > *:has(+ *:last-child:empty) > *:last-child { margin-bottom: 0px; } /* Hide any additional html elements added at the end of the document, except named (class) elements */ .container ~ *:not([class]) { position: absolute; height: 0px; width: 0px; font-size: 0px; overflow: hidden; } /* TEMPLATE */ .container { position: relative; } .container, .site { -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .container:after, .site:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; font-size: 0px; } /* Basic modular positioning */ .back, .con, .mod { float: left; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; } .overlay .mod { float: none; } /* Helps absolute positionsing inside modules, otherwise set position to static on specific modules for parent positioning */ .mod { position: relative; } /* Clear height presence of empty mods and backs, but preserve closing margin of a closing div, to preserve width template needs a min-height */ .back:empty, .mod:empty { margin-top: 0px !important; height: 0px !important; } .back { background: #ffffff; } /* MOD ADAPTATION */ /* INTERFACE */ textarea { width: 250px; } .body-content { width: 700px; height: 450px; } fieldset > ul > li > label + *[type=submit], fieldset > ul > li > label + *[type=button], fieldset > ul > li > label + div > input.invalid + *[type=submit], fieldset > ul > li > label + div > input.invalid + *[type=button] { margin: 0px; width: 100%; } fieldset > ul > li > label:first-child + * input[type=text], fieldset > ul > li > label:first-child + * input[type=search], fieldset > ul > li > label:first-child + * input[type=password], fieldset > ul > li > label:first-child + * textarea { width: 100%; } fieldset > ul > li > label:first-child + * > input[type], fieldset > ul > li > label:first-child + * > *[type=button], fieldset > ul > li > label:first-child + * > textarea, fieldset > ul > li > label:first-child + * > select, fieldset > ul > li > label:first-child + * > .input { display: inline-block; margin-top: 0px; margin-bottom: 0px; } fieldset > ul > li > label:first-child + * > .options { margin: 0px; } .options fieldset > ul > li > label:first-child + input[type=text], .options fieldset > ul > li > label:first-child + input[type=search], .options fieldset > ul > li > label:first-child + input[type=password], .options fieldset > ul > li > label:first-child + * input[type=text], .options fieldset > ul > li > label:first-child + * input[type=search], .options fieldset > ul > li > label:first-child + * input[type=password] { width: 250px; } .options fieldset > ul > li > label:first-child + input.date, .options fieldset > ul > li > label:first-child + input.datepicker, .options fieldset > ul > li > label:first-child + * input.date, .options fieldset > ul > li > label:first-child + * input.datepicker { width: 9.4em; } .options fieldset > ul > li > label:first-child + input.date-time, .options fieldset > ul > li > label:first-child + * input.date-time { width: 4em; } .options fieldset > ul > li > label:first-child + textarea, .options fieldset > ul > li > label:first-child + * textarea { width: 250px; } .options fieldset > ul > li > label:first-child + * .regex > input[name$="[flags]"] { width: 35px; } ul.sorter > li > div > input.date, ul.sorter > li > div > input.datepicker, ul.sorter > li > ul > li > input.date, ul.sorter > li > ul > li > input.datepicker { width: 9.4em; } ul.sorter > li > div > input.date-time, ul.sorter > li > ul > li > input.date-time { width: 4em; } .network { text-align: center; overflow-x: auto; overflow-y: hidden; } .network .node { display: block; } .network .node > h4 { margin: 0px; background-color: var(--back-nested); padding: 0px 8px; height: 2.3em; line-height: 2.3em; } .network .node > h4 + div { display: block; vertical-align: top; } .network .node > h4 + div > fieldset > * { text-align: left; } .network > .node, .network .node > div + div { display: inline-block; vertical-align: top; white-space: nowrap; } .network .node > div + div > div { display: inline-block; white-space: nowrap; vertical-align: top; } .network .node > div + div > div + div { margin-left: 10px; } /* TABLE */ table.display td, table.list td, table.display th, table.list th { max-width: 300px; } table.display { width: 100%;} td.max, th.max { width: 100%; } td.limit, th.limit { max-width: 300px; } table.list th, table.list td { padding-right: 20px; } table.list tbody tr:hover { background: #eeeeee; } /* OTHER */ fieldset > legend { margin-top: 0px; margin-bottom: 5px; } fieldset > legend > * { display: inline-block; vertical-align: middle; } fieldset > ul { margin: -5px 0px !important; display: table; vertical-align: middle; border-collapse: separate; border-spacing: 0px 5px; } fieldset > ul > li { display: table-row; height: 100%; } fieldset > ul > li > label:first-child { display: table-cell; vertical-align: top; padding: 2px 15px 2px 0px; text-align: right; width: 1%; white-space: nowrap; height: 100%; } /* fieldset > ul > li > label:first-child::before { content: ''; display: block; height: calc(40% - (1em / 2)); min-height: 2px; max-height: 6px; } */ fieldset > ul > li > label:first-child + * { display: table-cell; width: 100%; vertical-align: middle; margin-left: 0px; border-spacing: 0px; } fieldset > ul > li > label:first-child:empty { padding: 0px; width: 0%; } .options fieldset { margin: 8px 0px; vertical-align: top; } .options fieldset fieldset { margin: 0px; margin-left: 30px; } .options fieldset .options *:not(li) > fieldset { margin-left: 0px; } .options fieldset fieldset > *:first-child { margin-top: 0px; } .options fieldset fieldset > *:last-child { margin-bottom: 0px; } .options fieldset > ul { position:relative; display: inline-block; margin-left: 5px; } .options fieldset > ul:first-child, .options fieldset > legend + ul { margin-left: 0px; } .options fieldset > ul > li > label:first-child { text-align: left; width: auto; } .options fieldset > ul > li > label:first-child + * { display: inline-block; width: auto; } .options fieldset > ul > li > label:first-child + span, .options fieldset > ul > li > label:first-child + div { display: table-cell; } time.date, time.time { font-family: var(--font-serif); font-size: 1.2rem; color: #999999; line-height: 1; } time.date span { display: block; text-align: justify; } time.time span { display: inline-block; } time.time span + span { margin-left: 2px; } /* BBCODE */ .tab {margin-left: 2.5em;} img.resized {width: 450px;} span.center { display: block; text-align: center; } span.center img { margin: 0px auto; } /* ICONS */ /* ERROR */ body > .result { top: 20px; left: 20px; right: 20px; } .minicolors { position: relative; display: inline-block; z-index: 1; } .minicolors-focus { z-index: 2; } .minicolors.minicolors-theme-default .minicolors-input { margin: 0; border: solid 1px #CCC; font: 14px sans-serif; width: 65px; height: 16px; border-radius: 0; box-shadow: inset 0 2px 4px rgba(0, 0, 0, .04); padding: 2px; margin-right: -1px; } .minicolors-theme-default.minicolors .minicolors-input { vertical-align: middle; outline: none; } .minicolors-theme-default.minicolors-swatch-left .minicolors-input { margin-left: -1px; margin-right: auto; } .minicolors-theme-default.minicolors-focus .minicolors-input, .minicolors-theme-default.minicolors-focus .minicolors-swatch { border-color: #999; } .minicolors-hidden { position: absolute; left: -9999em; } .minicolors-swatch { position: relative; width: 20px; height: 20px; text-align: left; background: url(/CMS/css/support/jquery.minicolors.png) -80px 0; border: solid 1px #CCC; vertical-align: middle; display: inline-block; } .minicolors-swatch SPAN { position: absolute; width: 100%; height: 100%; background: none; box-shadow: inset 0 9px 0 rgba(255, 255, 255, .1); display: inline-block; } /* Panel */ .minicolors-panel { position: absolute; top: 26px; left: 0; width: 173px; height: 152px; background: white; border: solid 1px #CCC; box-shadow: 0 0 20px rgba(0, 0, 0, .2); display: none; } .minicolors-position-top .minicolors-panel { top: -156px; } .minicolors-position-left .minicolors-panel { left: -83px; } .minicolors-position-left.minicolors-with-opacity .minicolors-panel { left: -104px; } .minicolors-with-opacity .minicolors-panel { width: 194px; } .minicolors .minicolors-grid { position: absolute; top: 1px; left: 1px; width: 150px; height: 150px; background: url(/CMS/css/support/jquery.minicolors.png) -120px 0; cursor: crosshair; } .minicolors .minicolors-grid-inner { position: absolute; top: 0; left: 0; width: 150px; height: 150px; background: none; } .minicolors-slider-saturation .minicolors-grid { background-position: -420px 0; } .minicolors-slider-saturation .minicolors-grid-inner { background: url(/CMS/css/support/jquery.minicolors.png) -270px 0; } .minicolors-slider-brightness .minicolors-grid { background-position: -570px 0; } .minicolors-slider-brightness .minicolors-grid-inner { background: black; } .minicolors-slider-wheel .minicolors-grid { background-position: -720px 0; } .minicolors-slider, .minicolors-opacity-slider { position: absolute; top: 1px; left: 152px; width: 20px; height: 150px; background: white url(/CMS/css/support/jquery.minicolors.png) 0 0; cursor: crosshair; } .minicolors-slider-saturation .minicolors-slider { background-position: -60px 0; } .minicolors-slider-brightness .minicolors-slider { background-position: -20px 0; } .minicolors-slider-wheel .minicolors-slider { background-position: -20px 0; } .minicolors-opacity-slider { left: 173px; background-position: -40px 0; display: none; } .minicolors-with-opacity .minicolors-opacity-slider { display: block; } /* Pickers */ .minicolors-grid .minicolors-picker { position: absolute; top: 70px; left: 70px; width: 10px; height: 10px; border: solid 1px black; border-radius: 10px; margin-top: -6px; margin-left: -6px; background: none; } .minicolors-grid .minicolors-picker SPAN { position: absolute; top: 0; left: 0; width: 6px; height: 6px; border-radius: 6px; border: solid 2px white; } .minicolors-picker { position: absolute; top: 0; left: 0; width: 18px; height: 2px; background: white; border: solid 1px black; margin-top: -2px; } /* Inline controls */ .minicolors-inline .minicolors-input, .minicolors-inline .minicolors-swatch { display: none; } .minicolors-inline .minicolors-panel { position: relative; top: auto; left: auto; display: inline-block; } /* * Bootstrap Theme (theme: 'bootstrap') * */ /* Input styles */ .minicolors-theme-bootstrap .minicolors-input { padding: 4px 6px; padding-left: 30px; background-color: white; border: 1px solid #CCC; border-radius: 3px; color: #555; font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 14px; height: 19px; margin: 0; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); } /* When the input has focus */ .minicolors-theme-bootstrap.minicolors-focus .minicolors-input { border-color: #6fb8f1; box-shadow: 0 0 10px #6fb8f1; outline: none; } /* Swatch styles */ .minicolors-theme-bootstrap .minicolors-swatch { position: absolute; left: 4px; top: 4px; z-index: 2; } /* Handle swatch position (left = default / right) */ .minicolors-theme-bootstrap.minicolors-swatch-position-right .minicolors-input { padding-left: 6px; padding-right: 30px; } .minicolors-theme-bootstrap.minicolors-swatch-position-right .minicolors-swatch { left: auto; right: 4px; } /* Panel styles */ .minicolors-theme-bootstrap .minicolors-panel { top: 28px; z-index: 3; } /* Handle panel positions (top / left) */ .minicolors-theme-bootstrap.minicolors-position-top .minicolors-panel { top: -154px; } .minicolors-theme-bootstrap.minicolors-position-left .minicolors-panel { left: -63px; } /* Don't forget to adjust the left position in case the opacity slider is visible! */ .minicolors-theme-bootstrap.minicolors-position-left.minicolors-with-opacity .minicolors-panel { left: -84px; } .mapscroller { position: relative; width: 100%; height: 100%; overflow: hidden; } .mapscroller > .draw { position: relative; width: 100%; height:100%; overflow: hidden; } .mapscroller > .draw > .background { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; background-color: #f8f8f9; } .mapscroller > .draw > .background > img { position: absolute; width: 100%; height: 100%; } .mapscroller > .draw > .map { position: absolute; width: 100%; height: 100%; } .mapscroller > .draw > .map img { max-width: none !important; max-height: none !important; } .mapscroller > .draw > .map img, .mapscroller > .draw > .map image, .mapscroller > .draw > .map .img { position: absolute; } .mapscroller > .draw > .map .img { overflow: hidden; } .mapscroller > .draw > .map > div, .mapscroller > .draw > .map > div > div, .mapscroller > .draw > .map > div > svg { position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; } .mapscroller > .draw > .paint { position: absolute; left: 0px; top: 0px; } .mapscroller > .draw > .paint > svg, .mapscroller > .draw > .paint > canvas { width: 100%; height: 100%; position: absolute; } .mapscroller > .draw { cursor: grab; cursor: -webkit-grab; cursor: -moz-grab; } .mapscroller.moving > .draw { cursor: grabbing; cursor: -webkit-grabbing; cursor: -moz-grabbing; } .mapscroller > .controls { } .mapscroller > .controls button, .mapscroller > .controls label { margin: 0px; padding: 0px; border: 0; border-radius: 0px; height: 2em; background-color: transparent; color: #000000; text-align: center; cursor: pointer; } .mapscroller > .controls > .attribution { position: absolute; bottom: 0px; right: 0px; } .mapscroller > .controls > .attribution > ul { display: flex; flex-flow: row; padding: 5px 8px; line-height: 1; background: rgba(245, 245, 245, 0.75); color: #000000; font-size: 1rem; white-space: nowrap; } .mapscroller > .controls > .attribution > ul > li:not(.hide) ~ li:not(.hide) { margin-left: 4px; } .mapscroller > .controls > .attribution > ul > li:not(.hide) ~ li:not(.hide)::before { content: "-"; margin-right: 4px; } .mapscroller > .controls > .attribution > ul > li > p { display: inline-block; margin : 0px; } .mapscroller > .controls > .attribution > ul:empty, .mapscroller > .controls > .attribution > ul:not(:has(> li:not(.hide))) { display: none; } .mapscroller > .controls > .main { position: absolute; top: 40px; left: 40px; pointer-events: none; } .mapscroller > .controls > .main > * { pointer-events: auto; } .mapscroller > .controls > .main .zoomer { width: fit-content; padding: 6px; background: rgba(128, 128, 128, 0.35); } .mapscroller > .controls > .main .zoomer > button { display: block; width: 24px; height: 5px; background-color: #e7e7e7; } .mapscroller > .controls > .main .zoomer > button + button { margin-top: 6px; } .mapscroller > .controls > .main .zoomer > button.plus { height: 18px; } .mapscroller > .controls > .main .zoomer > button.min { height: 18px; } .mapscroller > .controls > .main .zoomer > button .icon svg { width: 10px; } .mapscroller > .controls > .main .layers { width: fit-content; margin-top: 20px; pointer-events: none; } .mapscroller > .controls > .main .layers > div { padding: 6px; background: rgba(128, 128, 128, 0.35); vertical-align: top; display: inline-block; pointer-events: auto; } .mapscroller > .controls > .main .layers > div:first-child label { width: 24px; background-color: #e7e7e7; } .mapscroller > .controls > .main .layers > div:first-child:has(label input:not(:checked)) + div { display: none; } .mapscroller > .controls > .main .layers > div:first-child:has(label input:checked) + div { display: inline-block; } .mapscroller > .controls > .main .layers > div:first-child + div { margin-left: 6px; } .mapscroller > .controls > .main .layers ul { display: table; padding: 4px 10px; border-spacing: 0px 6px; background-color: #e7e7e7; font-size: 1.1rem; } .mapscroller > .controls > .main .layers ul > li { display: table-row; } .mapscroller > .controls > .main .layers ul > li > * { display: table-cell; } .mapscroller > .controls > .main .layers ul > li input[type=range] { width: 100px; } .mapscroller > .controls > .main .layers ul > li > div:first-child + div { padding-left: 10px; } .mapscroller > .controls > .main .layers ul > li > div:first-child + div > p { display: inline-block; margin : 0px; } .mapscroller > .controls > .main .zoomer > button:hover, .mapscroller > .controls > .main .zoomer > button.active, .mapscroller > .controls > .main .layers label:hover { background-color: #ffffff; } .label-popup .options fieldset > ul > li > label:first-child + * textarea { width: 400px; height: 100px; } .label-popup menu { text-align: center; } .logout { height: 30px; line-height: 30px; padding: 0px 15px; text-align:center; font-weight:bold; color: #ffffff; background-color: #000000; float: right;} .logout:hover { background-color: #ffffff; } .logout li { display: inline-block; margin-left: 12px; } .logout li > a, .logout li > .a, .logout li.info > div { line-height:1; display: inline-block; vertical-align: middle; text-decoration: none; } .logout a:not(:hover), .logout .a:not(:hover) { color: #ffffff; } .logout a:hover, .logout .a:hover { text-decoration: underline; } .logout li > a > sup { margin-top: -4px; } .logout li:first-child, .logout li.logout-options { margin-left: 0px; } .logout li.logout-options > span { margin-left: 5px; vertical-align: middle; } .logout li.logout-options > span:first-child { margin-left: 0px; } .logout li.logout-options { display: none; } .logout li.info { text-align: left; } .logout li.info > div > span { display: block; line-height: 1.1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .logout li.info > div > span:first-child { font-size: 10px; } .logout li.info > div > span:first-child + span { } .mod.register_by_user { } .mod.register_by_user fieldset > ul > li > label:first-child + * input[name=address] { width: 115px; } .mod.register_by_user fieldset > ul > li > label:first-child + * input[name=address_nr] { width: 30px; } .mod.register_by_user fieldset > ul > li > label:first-child + * input[name=zipcode] { width: 60px; } .mod.register_by_user fieldset > ul > li > label:first-child + * input[name=zipcode_l] { width: 30px; } .mod.register_by_user fieldset > ul > li > label:first-child + * .password-url { font-family: var(--font-mono); cursor: pointer; } .mod.register_by_user fieldset > ul > li > label:first-child + * .password-url.pulse { background-color: transparent; color: var(--highlight); } .account .select input[name=lang_code] + span > img { margin-right: 4px; } .messaging .conversations > tbody tr.unread > td:first-child, .messaging .conversations > tbody tr.unread > td:first-child + td { font-weight: bold; } .messaging .conversations > tbody td + td:last-child { text-align: right; } .messaging .conversations > tbody td span.body { color: #aaaaaa; font-size: inherit; } .messaging .conversation { margin-top: 10px; } .messaging .conversation > fieldset { margin: 12px 0px; } .messaging .conversation input.autocomplete-multi { width: 175px; } .messaging .conversation > ul { } .messaging .conversation > ul > li { margin-top: 10px; margin-right: 20%; } .messaging .conversation > ul > li:first-child { margin-top: 0px; } .messaging .conversation > ul > li.own { margin-right: 0px; margin-left: 20%; } .messaging .conversation > ul > li > cite { display: block; } .messaging .conversation > ul > li.own > cite { text-align: right; } .messaging .conversation > ul > li > cite > span:first-child { font-weight: bold; } .messaging .conversation > ul > li.own > cite > span:first-child { display: none; } .messaging .conversation > ul > li > cite > span:first-child + span { display: inline-block; margin-left: 5px; } .messaging .conversation > ul > li > cite + div { margin-top: 5px; padding: 10px 10px; background-color: #ffffff; } .messaging .conversation > .compose textarea { width: 100%; height: 150px; } .mod.api_configuration input[name*=time_amount] { width: 60px; } .api_configuration fieldset > ul > li > label:first-child + section { margin: 0px; width: 600px; } .api_configuration fieldset > ul > li > label:first-child + div input[name*=identifier_url] { width: 400px; } .sitemap > ul { display: inline-block; vertical-align: top; margin-right: 30px; } .sitemap > ul:last-child { margin-right: 0px; } .sitemap > ul > li:first-child { font-weight: bold; } .sitemap > ul > li:empty { display: none; } .header { position: relative; } .toolbar { line-height: 1; } .toolbar.movable { position: absolute; height: 0px; } .toolbar > div.project { display: inline-block; text-align:center; font-weight: bold; height: 26px; line-height: 26px; vertical-align: bottom; } .toolbar > div.project > span { } .toolbar > div.project > span + span.a { text-decoration: none; margin-left: 6px; } .toolbar > div.project > span + span.a svg { width: 11px; height: auto; margin-bottom: 1px; } .toolbar > div.project > span + span.a:not(:hover) { color: #000000; } .toolbar > ul { display: inline-block; height: 26px; vertical-align: bottom; border: 2px solid #000000; text-align:center; font-weight: bold; } .toolbar > div.project + ul { margin-left: 14px; } .toolbar > ul + ul { margin-left: 5px; } .toolbar li { display: inline-block; height: 100%; margin: 0; vertical-align: top; } .toolbar li > span.a { text-decoration: none; } .toolbar li.geo, .toolbar li.soc, .toolbar li.time, .toolbar li.export, .toolbar li.analyse { padding: 0px 9px; } .toolbar li.pulse { } .toolbar li.soc, .toolbar li.time { padding-left: 2px; } .toolbar li.settings { background-color: #000000; padding: 0px 5px; } .toolbar li.settings > span:not(:hover) { color: #ffffff; } .toolbar li.settings sup { margin-left: -4px; margin-top: -4px; } .toolbar li.settings sub { margin-left: -4px; margin-top: 21px; } .toolbar li.settings sup[data-size="2"] { margin-top: -8px; } .toolbar li.settings sup[data-size="3"] { margin-top: -15px; } .toolbar li.time > span.icon svg { height: 14px; } .toolbar li.export > span.icon svg { height: 14px; } .toolbar li.analyse > span.icon svg { height: 15px; } .toolbar ul.analytics > li.settings > span > span.icon svg { margin: 0px 1px; height: 15px; } .footer { position: relative; } .herder .visualise { margin: 50px 0px; } .herder .visualise ul { text-align: center; } .herder .visualise ul > li { display: inline-block; } .herder .visualise ul > li > span.a { text-decoration: none; } .herder .visualise ul > li > span.a svg { height: 5.0rem; } .herder .visualise ul > li + li { margin-left: 4rem; } .herder .interact { margin: 50px 0px !important; } .herder .interact figure + figure { margin-top: 40px; } .herder .interact .dial { position: relative; width: 300px; height: 300px; margin-left: auto; margin-right: auto; cursor: pointer; } .herder .interact .dial .master { position: absolute; top: 0; left: 0; bottom: 0; right: 0; border-radius: 100%; background-color: #000000; } .herder .interact .dial .slice { position: absolute; top: 0; left: 0; bottom: 0; right: 0; border-radius: 100%; clip: rect(0px, 300px, 300px, 150px); } .herder .interact .dial .inner { position: absolute; top: 0; left: 0; bottom: 0; right: 0; border-radius: 100%; clip: rect(0px, 150px, 300px, 0px); transform: rotate(40deg); background-color: #ffffff; } .herder .interact .dial .cover { position: absolute; top: 60px; left: 60px; bottom: 60px; right: 60px; border-radius: 100%; background-color: #ffffff; } .herder .interact .dial .toggle { position: absolute; top: 100px; left: 100px; bottom: 100px; right: 100px; display: inline-block; vertical-align: middle; text-align: center; } .herder .interact .dial .toggle > span { font-size: 1.4rem; font-weight: bold; } .herder .interact .dial[data-mode=scroll] .toggle > span:first-child + span { display: none; } .herder .interact .dial[data-mode=seek] .toggle > span:first-child { display: none; } .herder .interact .slider { position: relative; width: 300px; height: 60px; margin-left: auto; margin-right: auto; cursor: pointer; } .herder .interact .slider .inner { position: absolute; top: 0; left: 0; bottom: 0px; width: 50px; } .herder .interact .slider .steps { position: absolute; top: 0; left: 0; bottom: 0px; } .herder .interact .slider .steps > div { display: inline-block; margin-left: 3px; height: 100%; width: 2px; background-color: #000000; } .search form > input[type=search] { border-top-right-radius: 0px; border-bottom-right-radius: 0px; } .search form > input[type=submit] { margin-left: 0px; border-top-left-radius: 0px; border-bottom-left-radius: 0px; } .search dl { margin-top: 20px; } .search dl > dt { margin-top: 12px; } .search dl > dt > a { font-size: 1.4rem; font-weight: bold; } .search dl > dt > .hits { font-size: 1rem; display: inline-block; } .search dl > dt > .link { display: block; margin-top: 4px; } .search dl > dd { color: #666666; margin-top: 8px; } .search dl > dd em { font-style: normal; font-weight: bold; color: var(--text); background-color: #fffc5b; } .search dl > dt > a em { font-style: normal; } .search_box { text-align: right; } .search_box form > input[type=search] { width: 125px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; } .search_box form > button[type=submit] { margin-left: 0px; border-top-left-radius: 0px; border-bottom-left-radius: 0px; } .language ul > li { display: inline-block; } .language ul > li:not(:first-child)::before { content: "/"; margin: 0px 0.15em; } .dashboard > div { width: 100%; display: flex; flex-flow: row nowrap; min-height: 40px; } .dashboard > div > ul { flex: 1 1 100%; vertical-align: top; overflow: hidden; margin-top: 0px !important; margin-bottom: 0px !important; margin-right: 0px !important; } .dashboard > div > ul:first-child { margin-left: 0px !important; } .dashboard > div > ul > li { margin-left: 0px !important; margin-right: 0px !important; margin-bottom: 0px !important; } .dashboard > div > ul > li:first-child { margin-top: 0px !important; } .dashboard > div > ul > li h3 { font-size: 12px; margin: 0px; padding: 0px 4px; color: #ffffff; background-color: #00497e; line-height: 24px; } .dashboard > div > ul > li h3 > span { vertical-align: middle; } .dashboard > div > ul > li:not(.locked) h3 > span { cursor: move; } .dashboard > div > ul > li h3 > ul { float: right; } .dashboard > div > ul > li h3 > ul > li { cursor: pointer; display: inline-block; vertical-align: middle; margin-left: 4px; } .dashboard > div > ul > li h3 > ul > li.size { width: 14px; height: 14px; background: url(/css/images/widget_buttons_w.png) no-repeat 0px 0px; } .dashboard > div > ul > li.min h3 > ul > li.size { background-position: -14px 0px; } .dashboard > div > ul > li.min > div { display: none; } .dashboard > div > ul > li h3 > ul > li a { display: block; width: 14px; height: 14px; background: url(/css/images/widget_buttons_w.png) no-repeat -28px 0px; } .dashboard > div > ul > li > div { padding: 4px; padding-bottom: 0px; } .contact_form form { overflow: hidden; } .contact_form form fieldset textarea { height: 200px; } .contact_info > ul { float: left; width: 225px; } .contact_info > ul li { line-height: 18px; } .contact_info > ul .split { height: 14px; } .contact_info > ul li > span { display: inline-block; vertical-align: middle; } .contact_info > ul li > span:first-child { width: 24px; text-align: left;} .contact_map > div { width: 100%; height: 500px; } .blog { } .blog > article { position: relative; overflow: hidden; margin-top: 20px; } .blog > article + h1 { margin-top: 25px; } .blog > article > time { display: inline-block; vertical-align: top; padding: 8px; } .blog > article > h1 { display: inline-block; vertical-align: top; margin: 0px; margin-left: 10px; margin-top: 10px; max-width: calc(100% - 100px); box-sizing: border-box; } .blog > article > h1 > a, .blog > article > h1 > a:hover { text-decoration: none; color: #000000; } .blog > article > cite { display: block; } .blog > article > section.body { margin-top: 15px; } .blog > article > section.body .more { margin-left: 4px; } .blog > article > div.tags { margin-top: 15px; } .blog > article > a { display: block; text-align: right; white-space: nowrap; } .blog > article > a > span { display: inline-block; text-decoration: inherit; } .blog > article > a > span + span { margin-left: 5px; } .blog .nextprev { text-align: center; margin: 40px 0px 0px 0px; font-size: 14px; font-weight: bold; } .blog .nextprev > a > span.icon svg { height: 0.9em; } .blog .nextprev > a > span.icon { color: var(--highlight); } .blog .nextprev > a > span + span { margin-left: 10px; } .blog .nextprev > a > span:not(.icon) { vertical-align: middle; } .blog .nextprev > a.prev + a.next { margin-left: 40px; } .blog_post_comments .comment { position: relative; margin: 10px 0px 0px 0px; background-color: #eeeeee; } .blog_post_comments .comment:first-child { margin-top: 0px; } .blog_post_comments .comment > div:first-child { float: left; position: relative; margin-top: 10px; } .blog_post_comments .comment > div:first-child + div { padding: 10px 14px 10px 14px; min-height: 50px; margin-left: 90px; } .blog_post_comments .comment > div:first-child + div > cite { margin: 4px 0px; display: block; font-size: 1.4rem; font-weight: bold; } .blog_post_comments .comment > div:first-child + div > div { margin-top: 4px; } .blog_post_comments time { display: block; } .blog_post_comments time span:first-child, .blog_post_comments time span:first-child + span, .blog_post_comments time span:first-child + span + span { display: inline-block; font-size: 11px; line-height: 11px; } .blog_post_comments time span:first-child ~ span { margin-left: 3px; } .blog_post_comments > span.a.more { display: block; } .blog_post_comments form { display: none; margin: 20px 0px; } .blog_post_comments form textarea { height: 100px; } .blog_post_comments form + div { margin: 20px 0px; } .blog.titles ul, .blog.comments ul { margin: 0px; padding: 0px; list-style: none } .blog.titles li a, .blog.comments li a { display: block; min-height: 22px; line-height: 22px; border-bottom: 1px dashed #c0c0c0; color: #000000; text-decoration: none; } .blog.titles li:first-child a, .blog.comments li:first-child a { border-top: 1px dashed #c0c0c0; } .blog.titles li a span, .blog.comments li a span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .blog.titles li a > span:first-child, .blog.comments li a > span:first-child { float:left; margin-right: 6px; text-align: center; color: #ffffff; font-weight: bold; width: 4px; height: 22px; } .blog.titles li a:hover, .blog.comments li a:hover { text-decoration: none;} .blog.titles li a:hover > span:first-child, .blog.comments li a:hover > span:first-child { background-color: #c0c0c0;} .blog.titles li a:hover > span + span, .blog.comments li a:hover > span + span { color: #666666;} .blog.comments li a { height: 38px;} .blog.comments li a > span:first-child { height: 38px;} .blog.comments li a > span + span > span + span { margin-top: -6px;} .blog_tag_cloud { } .blog_tag_cloud > div { margin: 8px 0px 0px 0px; text-align: justify; } .blog_tag_cloud > div a { display: inline-block; color: #000000; text-decoration: none; vertical-align: middle; line-height: 1.25; margin: 3px 0px; padding: 3px 4px; max-width: 100%; box-sizing: border-box; background-color: #e1e1e1; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .blog_tag_cloud > div a + a { margin-left: 3px; } .blog_tag_cloud > div:last-child > a:last-child { margin-bottom: 3px; } .blog_tag_cloud > div a:hover { color: #666666; text-decoration: none; } .blog_tag_cloud > div a > sup { margin-left: 2px; } .blog_tag_cloud > div > input[id^=hide-show] ~ label { margin-left: 5px; } .blog_tag_cloud > div { font-size: 1.0rem; } .blog_tag_cloud > div a > span { font-size: calc(150% + 1.0rem); } .blog_tag_cloud > div a > sup { font-size: calc(100% + 0.9rem); } .documentation > nav.breadcrumbs > a > span.icon { padding: 0 5px; } .documentation > nav.breadcrumbs > a > span.icon > svg { height: 10px; } .documentation > nav.breadcrumbs > a > span:not(.icon) { vertical-align: middle; } .documentation > nav.breadcrumbs > a:hover { text-decoration: none; } .documentation > nav.breadcrumbs > a:hover > span:not(.icon) { text-decoration: underline; } .documentation > nav.nextprev { display: flex; justify-content: space-between; margin-top: 40px; } .documentation > nav.nextprev a > span:not(.icon) { vertical-align: middle; } .documentation > nav.nextprev a > span.icon svg { height: 0.8em; } .documentation > nav.nextprev a > span + span { margin-left: 10px; } .documentation_overview > section { margin-bottom: 20px; } .documentation_overview ul li a span.indentation { width: 10px; display: inline-block;} .form form > div + fieldset { margin-top: 10px; } .form li.field_address span.input-split > span:first-child { width: 60%; } .form li.field_address span.input-split > span:first-child + span { width: 25%; } .form li.field_address span.input-split > span:first-child + span + span { width: 15%; } .images { } .images > .album > table { width: 100%; border-spacing: 10px 10px; } .images > .album > table td { vertical-align: top; text-align: center; } .images > .album > table td img[data-original] { background-color: #f5f5f5; width: 100%; height: 150px; } .images > .album > table td figurecaption { display: none; } .data_entry > .tabs > div > menu button .icon + span { margin-left: 4px; } .data_entry > .tabs > div > menu button .icon > svg { height: 12px; } .data_entry .datatable > .options .count > sup { margin-left: 0.1em; font-size: 1em; cursor: default; } .entry fieldset.object > ul { display: block; } .entry fieldset > ul > li > label:first-child + div.definition > .media-preview, .entry fieldset > ul > li > label:first-child + div.definition > fieldset ul.sorter > li > div > .media-preview { margin-bottom: 5px; } .entry fieldset > ul > li > label:first-child + div.definition > div.show { display: inline-block; vertical-align: middle; } .entry fieldset > ul > li > label:first-child + div.definition > div.show > .text_tags { margin: 0px; } .entry fieldset > ul > li > label:first-child + div.definition > fieldset { margin-left: 0px; } .entry fieldset.object > ul > li > label:first-child + div.name-plain > input[name=object_name_plain].default { width: 500px; } .entry fieldset.object > ul > li > label:first-child + div.definition > input[type=text].default, .entry fieldset.object > ul > li > label:first-child + div.definition > fieldset ul.sorter > li > div > input[type=text].default, .entry fieldset.object > ul > li > label:first-child + div.definition input.autocomplete, .entry fieldset.object > ul > li > label:first-child + div.definition > textarea { width: 450px; } .entry fieldset.object > ul > li > label:first-child + div.definition > input[type=number], .entry fieldset.object > ul > li > label:first-child + div.definition > fieldset ul.sorter > li > div > input[type=number] { width: 150px; } .entry fieldset.object > ul > li > label:first-child + div.definition > input[name$="[url]"], .entry fieldset.object > ul > li > label:first-child + div.definition > fieldset ul.sorter > li > div > input[name$="[url]"] { width: 325px; } .entry fieldset.object > ul > li > label:first-child + div.definition > textarea {height: 100px; } .entry fieldset.object > ul > li > label:first-child + div.definition > textarea.body-content, .entry fieldset.object > ul > li > label:first-child + div.definition > .editor-content > .body-content { width: 750px; height: 200px; } .entry fieldset.object > ul > li > label:first-child + div.definition.options.nested > div > *:first-child { margin-top: 0px; } .entry fieldset.object > ul > li > label:first-child + div.definition.options.nested > div > *:last-child { margin-bottom: 0px; } .entry.object-subs fieldset > ul > li > label:first-child + div input[type=text].default, .entry.object-subs fieldset > ul > li > label:first-child + div input.autocomplete, .entry.object-subs fieldset > ul > li > label:first-child + div input[type=search], .entry.object-subs fieldset > ul > li > label:first-child + div textarea { width: 300px; } .entry.object-subs fieldset > ul > li > label:first-child + div textarea.body-content, .entry.object-subs fieldset > ul > li > label:first-child + div .editor-content > .body-content { width: 350px; height: 150px; } .entry.object-subs fieldset li.date-section > div > input[name*="[offset_amount]"], .entry.object-subs fieldset div.date-section > span > input[name*="[offset_amount]"], .entry.object-subs fieldset li.date-section > div > input[name*="[period_amount]"], .entry.object-subs fieldset div.date-section > input[name*="[period_amount]"] { width: 50px; } .entry fieldset .media-preview { border: 1px dashed #000000; padding: 8px; overflow: hidden; width: 80px; height: 80px; } .entry fieldset .media-preview:hover { resize: both; } .entry fieldset .media-preview > img, .entry fieldset .media-preview > video, .entry fieldset .media-preview > object, .entry fieldset .media-preview > iframe { width: 100%; height: 100%; object-fit: scale-down; } .entry fieldset.object > ul > li[data-object_description_id="-1"] > label:first-child + div.definition > fieldset input[type=number] { width: 80px; } .entry fieldset.object > ul > li[data-object_description_id="-2"] > label:first-child + div.definition > fieldset input[type=number] { width: 50px; } .entry fieldset.object > ul > li[data-object_description_id="-10"], .entry fieldset.object > ul > li[data-object_description_id="-10"] > label:first-child + div.definition { display: block; } .entry fieldset.object > ul > li[data-object_description_id="-10"] > label:first-child + div.definition .template textarea { width: 800px; height: 300px; } .entry.object-subs fieldset.full div.definition textarea, .entry.object-subs fieldset.full div.definition textarea.body-content, .entry.object-subs fieldset.full div.definition .editor-content .body-content { height: 3em; } .entry.object-subs fieldset div.location-section > * + span, .entry.object-subs fieldset div.location-section > span > span + span, .entry.object-subs fieldset li.location-section div > span + span, .entry.object-subs fieldset li.location-section div > span + select, .entry.object-subs fieldset div.location-section > span + select, .entry.object-various fieldset div.location-section > * + span, .entry.object-various fieldset div.location-section > span > span + span, .entry.object-various fieldset li.location-section div > span + span, .entry.object-various fieldset li.location-section div > span + select, .entry.object-various fieldset div.location-section > span + select, .entry.object-subs fieldset div.date-section > * + span, .entry.object-subs fieldset li.date-section div > span + span, .entry.object-subs fieldset li.date-section div > span + select, .entry.object-subs fieldset div.date-section > span + select, .entry.object-various fieldset div.date-section > * + span, .entry.object-various fieldset li.date-section div > span + span, .entry.object-various fieldset li.date-section div > span + select, .entry.object-various fieldset div.date-section > span + select { margin-left: 4px; } .entry.object-subs fieldset > legend > span > span { vertical-align: middle; } .entry.object-subs fieldset.added > legend:before, .entry.object-subs fieldset li.added > ul:before { content:"+++"; margin-right: 4px; font-weight: bold; } .entry.object-subs fieldset.deleted > legend:before, .entry.object-subs fieldset li.deleted > ul:before { content:"---"; margin-right: 4px; font-weight: bold; } .entry.object-subs fieldset.deleted .del, .entry.object-subs fieldset li.deleted .del { display: none; } .entry .object h1 > .icon.a, .entry.object h1 > .icon.a, .entry fieldset.object > ul > li > label:first-child > .icon.a, .entry.object-subs fieldset > legend > .icon.a, .entry.object-subs fieldset > ul > li > label:first-child > .icon.a { margin-left: 0.3em; } .entry .object h1 > .icon.a svg, .entry.object h1 > .icon.a svg, .entry fieldset.object > ul > li > label:first-child > .icon.a svg, .entry.object-subs fieldset > legend > .icon.a svg, .entry.object-subs fieldset > ul > li > label:first-child > .icon.a svg { height: 1em; } .entry.object-subs > .tags { margin: 0px; } .entry.object-subs > .object-subs.fieldsets:has(> div:empty) { display: none; } .entry.sources ul.sorter > li > div > input.autocomplete { width: 500px; } .entry.sources ul.sorter > li > div > input.autocomplete + input[type=text] { width: 200px; } .entry.history ul.select label > div > div { display: inline-block; font-family: var(--font-mono); font-size: 1.2rem; background-color: #ffffff; padding: 0.6em; max-width: 800px; max-height: 400px; overflow: auto; white-space: pre-wrap; word-wrap: break-word; } .entry.history ul.select label > div > div > .record { margin: 0px; } .entry.history ul.select label > div > span { display: block; margin-top: 4px; } .entry.history ul.select li.selected label > div > div { border: 2px solid var(--highlight); } .entry select option { max-width: 320px; overflow: hidden; text-overflow: ellipsis; } .entry.select-object select { max-width: 500px; } .discussion .discussion-content > .body { background-color: #f5f5f5; padding: 15px; } .discussion .editor-content { display: block; } .discussion .editor-content > .body-content { width: 100%; min-width: 800px; } .view_type_object .overview h1 > span { vertical-align: middle; } .view_type_object .referenced .statistics > ul { max-width: 1000px; } .view_type_object .referenced .statistics > ul > li { display: inline-block; margin: 10px; } .view_type_object .dynamic-object-descriptions td p { margin: 0; } .filter fieldset ul > li > div > input[name*=object_sub_location_radius], .filter fieldset ul > li.extra > div > input[type=number], .filter fieldset ul > li.extra > div > ul > li > input[type=number], .filter fieldset input[type=number][name*="[object_sub][relationality]"] { width: 50px; } .filter fieldset input[type=number][name*="[operator_extra]"] { width: 50px; } .filter h3 { margin: 8px 0px; } .filter .tags { margin: 0px; } .filter .object-descriptions.fieldsets:has(> div:empty), .filter .object-sub-details.fieldsets:has(> div:empty), .filter .object-sub-descriptions.fieldsets:has(> div:empty), .filter .external-references.fieldsets:has(> div:empty) { display: none; } .point.labmap { height: 750px; } .filter-storage ul > li > label:first-child + div > textarea[name=plain] { width: 400px; height: 300px; } .ingest-source.template > div:first-of-type input[name$="[name]"], .ingest-source.template > div:first-of-type select[name$="[source_id]"], .ingest-source.template > div:first-of-type select[name$="[type_id]"] { width: 400px; } .ingest-source.template > div:not(:first-of-type) select:nth-of-type(1), .ingest-source.template > div:not(:first-of-type) select:nth-of-type(3) { width: 200px; } .ingest-source.template fieldset > ul > li > label:first-child + * input[name*="[query_value]"], .ingest-source.template fieldset > ul > li > label:first-child + * input[name*="[filter_value]"] { width: 400px; } .ingest-source.template fieldset > ul > li > label:first-child + * input[name*=value_split] { width: 20px; } .ingest-source.template fieldset > ul > li > label:first-child + div > section:first-child { margin-top: 0px; } .ingest-source.template fieldset > ul > li > label:first-child + div > section:last-child { margin-bottom: 0px; } .ingest-source.template-process .options > fieldset > ul.results > li:nth-child(even) { background-color: rgba(0, 0, 0, 0.03); } .ingest-source.template-process .options > fieldset > ul.results > li > label:before { display: none; } .ingest-source.template-process .options > fieldset > ul.results > li > label { padding: 0 8px; text-align: right; vertical-align: middle;} .ingest-source.template-process .options > fieldset > ul.results > li > .fieldsets > div { margin: -4px !important; } .ingest-source.template-process .options > fieldset > ul.results > li > .fieldsets > div > fieldset { background-color: var(--back-nested); padding: 4px 8px; margin: 4px !important;} .ingest-source.template-process .options > fieldset > ul.results > li > .fieldsets > div > fieldset label { line-height: 26px; } .reconcile.template-process ul.results > li > blockquote { quotes: none; display: block; width: max-content; margin: 12px 0px; padding: 0px; font-family: var(--font-mono); } .reconcile.template-process ul.results > li > fieldset, .reconcile.template-process ul.results > li > .fieldsets, .reconcile.template-process ul.results > li > menu { margin-left: 30px; } .reconcile.template-process ul.results > li > fieldset > .tabs { margin: 0px; } .reconcile.template-process ul.results > li > fieldset > .editor-content { display: block; } .reconcile.template-process ul.results > li > fieldset > .editor-content > .body-content { width: 100%; } .reconcile.template-process ul.results > li > fieldset > .text_tags .page > .body { flex: 0 0 70%; } .reconcile.template-process ul.results > li > fieldset > .text_tags .page > .marginalia { flex: 0 0 30%; max-width: none; } .reconcile.template-process ul.results > li > .fieldsets > div { margin: -4px !important; } .reconcile.template-process ul.results > li > .fieldsets > div > fieldset { background-color: #e1e1e1; padding: 4px 8px; margin: 4px !important; } .reconcile.template-process ul.results > li > .fieldsets > div > fieldset label, .reconcile.template-process ul.results > li > .fieldsets > div > fieldset span.a { line-height: 26px; } .reconcile.template-process ul.results > li > .fieldsets > div > fieldset > div > label, .reconcile.template-process ul.results > li > .fieldsets > div > fieldset > div > .input { display: inline-block; } .reconcile.template-process ul.results > li > .fieldsets > div > fieldset blockquote { quotes: none; display: block; margin: 0px 0px 4px 0px; padding: 4px 8px; font-family: var(--font-mono); background-color: #f5f5f5; } .data_model .definition > fieldset .sorter textarea { width: 450px; height: 100px; } .data_model .object-descriptions > ul.sorter > li + li, .data_model .object-sub-descriptions > ul.sorter > li + li { margin-top: 25px; } .data_model .object-sub-details > .sorter > li > div > fieldset { margin: 0px; } .data_model .object-descriptions > ul.sorter > li > ul > li > div.reference_mutable, .data_model .object-sub-descriptions > ul.sorter > li > ul > li > div.reference_mutable { vertical-align: top; } .data_model .object-description-options:empty { display: none; } .data_model .object-description-options fieldset > ul > li > label:first-child + div > input[name$="[separator]"] { width: 75px; } .data_model .object-sub-details fieldset .tabs > div > div > fieldset { margin-left: 0px; } .data_model .definition > fieldset > ul > li > label:first-child + [name=label] { width: 120px; } .condition fieldset > ul > li > label:first-child + * input[name$="[image][url]"] + img { max-height: 20px; } .network.type { margin: 0px auto; padding-bottom: 14px; } .network.type .node > h4 + div { display: inline-block; text-align: left; } .network.type .node > div > fieldset > legend { font-weight: normal; } .network.type .node > div > fieldset > legend > span:last-child { font-weight: bold; } .network.type .node > div > fieldset > legend > span::after { content: "-"; margin: 0px 4px; } .network.type .node > div > fieldset > legend > span:last-child::after { content: none; } .network.type .node > div > fieldset { margin: 0px; } .network.type .node > div > fieldset select { max-width: 250px; } .network.type .node:not(.inactive) > div + div { margin-left: 10px; } .network.type .node > div + div > div > label { display: inline-block; margin: 5px 5px; } .network.type .node > div + div > div > label > input[type=checkbox] { display: block; margin: 1px auto 0px auto; } .network.type .node > div + div > div > label > .icon, .network.type .node > div + div > div > label > .icon { display: block; margin: 1px auto -3px auto; } .network.type .node > div + div > div > fieldset { margin: 10px 10px; } .network.type .node > div + div > div > fieldset > div { display: inline-block; text-align: left; } .network.type .node > div + div > div > fieldset ul.inactive > li > select + label, .network.type .node > div + div > div > fieldset ul.inactive > li + li { display: none; } .network.type .node > div + div > div > fieldset select { text-align: left; font-family: var(--font-mono), var(--font-symbol); } .network.type .node > div + div > div > fieldset select.state-placeholder:not(:checked), .network.type .node > div + div > div > fieldset select.state-placeholder > option:last-child { text-align: center; } .network.type .node.inactive > div { display: none; } .value-type-module.music_notation input[type=text] { max-width: 200px; } .value-type-module.music_notation textarea[name$="\[code\]"] { width: 350px; } .value-type-module.music_notation .image { max-width: 500px; } .value-type-module.music_notation .image.rendering { opacity: 0.2; } .data_import .import-log-template td input + span { vertical-align: middle; margin-left: 5px; } .data_import .import-log-template input.del { pointer-events: none; } .data_linked_data fieldset > ul > li > label:first-child + div textarea { height: 300px; width: 600px; } .data_linked_data fieldset > ul > li > label:first-child + div textarea[name=description] { height: 100px; width: 450px; } .data_linked_data fieldset > ul > li > label:first-child + div textarea[name=response] { height: 150px; white-space: pre; } .data_linked_data fieldset > ul > li > label:first-child + div textarea[name=response].active { height: 500px; } .data_linked_data fieldset > ul > li > label:first-child + div input[name=url], .data_linked_data fieldset > ul > li > label:first-child + div input[name=url_options], .data_linked_data fieldset > ul > li > label:first-child + div input[name=response_uri_template] { width: 450px; } .data_linked_data fieldset > ul > li > label:first-child + ul input[name^=url_headers][name$="[key]"] { width: 200px; } .data_linked_data fieldset > ul > li > label:first-child + ul input[name^=url_headers][name$="[value]"] { width: 300px; } .data_linked_data fieldset > ul > li > label:first-child + div input[name=response_uri_value], .data_linked_data fieldset > ul > li > label:first-child + div input[name=response_label_value], .data_linked_data fieldset > ul > li > label:first-child + ul input[name^=response_values][name$="[value]"] { width: 600px; } .data_linked_data fieldset > ul > li > label:first-child + div input[name=response_uri_value] + select, .data_linked_data fieldset > ul > li > label:first-child + div input[name=response_label_value] + select, .data_linked_data fieldset > ul > li > label:first-child + ul input[name^=response_values][name$="[value]"] + select { max-width: 500px; } .data_linked_data fieldset > ul > li > label:first-child + div select[name$="conversion_output_identifier"]:empty, .data_linked_data fieldset > ul > li > label:first-child + ul select[name$="[conversion_output_identifier]"]:empty { display: none; } .data_linked_data fieldset > ul > li > label:first-child + section { width: 600px; } .data_linked_data fieldset > ul > li > label:first-child + div textarea[name=input_placeholder] { height: 120px; white-space: pre; } .data_linked_data fieldset > ul > li > label:first-child + div textarea[name=output_placeholder] { height: 120px; white-space: pre; } .data_pattern_pairs code { font-family: var(--font-mono); padding: 4px 8px; background-color: var(--back-nested); } .frame [name="frame[area][geo_scale]"] { width: 50px; } .visual-settings fieldset > ul > li > label:first-child + * textarea[name="visual_settings[settings][geo_advanced]"], .visual-settings fieldset > ul > li > label:first-child + * textarea[name="visual_settings[social][settings][social_advanced]"] { height: 160px; width: 275px; } .visual-settings fieldset > ul > li > label:first-child + input[type="number"], .visual-settings fieldset > ul > li > label:first-child + * input[type="number"] { width: 70px; } .visual-settings fieldset > ul > li > label:first-child + * input[type="number"][name*="opacity"] { width: 60px; } .visual-settings fieldset > ul > li > label:first-child + * input[name="visual_settings[capture][settings][size][width_pixels]"], .visual-settings fieldset > ul > li > label:first-child + * input[name="visual_settings[capture][settings][size][height_pixels]"] { width: 70px; } .visual-settings fieldset > ul > li > label:first-child + section { margin: 0px; } .visualise.toolbar.movable { top: 0px; right: 50%; } .visualise.toolbar.movable ul > li.settings { display: none; } .scope-storage ul > li > label:first-child + div > textarea[name=plain] { width: 400px; height: 300px; } .analysis fieldset > ul > li > label:first-child + div > section { margin: 0px; } .analysis fieldset > ul > li > label:first-child + div > section + * { margin-top: 4px; } .custom_projects ul.select > li > label > div .info.icon.a { margin-left: 0.1em; } .custom_projects ul.select > li > label > div .info.icon.a svg { height: 1em; } .custom_projects ul.select > li > label > div .info.icon.a + span { margin-left: 0.4em; font-style: italic; } .custom_projects ul.select > li > label > div .info.icon.a + span + span { margin-left: 0.4em; } .project-overview { height: 100%; display: flex; flex-flow: column nowrap; align-content: flex-start; } .project-overview > div:last-child { flex: 1 1 auto; overflow: hidden; } .project-overview > div:last-child > svg { width: 100%; height: 100%; } .project-overview > div:last-child > svg .box { cursor: pointer; } .project-overview > div:last-child > svg .connect-boxes > circle, .project-overview > div:last-child > svg .connect-lines > path { pointer-events: none; } .popup > form.storage fieldset ul > li > div > small { display: inline-block; } .popup > form.storage fieldset ul > li > div > small:empty { display: none; } .popup > form.storage fieldset > ul > li:has(> section:empty) { display: none; } .options fieldset > ul > li > label:first-child + textarea[name="css"] { width: 1200px; height: 600px; } .publish_instances fieldset > ul > li > label:first-child + div > textarea.body-content, .publish_instances fieldset > ul > li > label:first-child + div > .editor-content > .body-content { height: 250px; } .publish_instances fieldset > ul > li > label:first-child + div[id*="publish_instances:archive-"] > select:has(> option:checked[value=""]) ~ * { display: none; } .presentation_instances .options > .fieldsets > div > fieldset:not(.instance-list) { display: block; } .presentation_instances .options > .fieldsets { margin-bottom: 50px; } .presentation_instances fieldset > ul > li > label:first-child + textarea { height: 300px; width: 600px; } .presentation_instances fieldset > ul > li > label:first-child + textarea[name=description] { height: 100px; width: 450px; } .presentation_instances fieldset > ul > li > label:first-child + textarea[name=response] { height: 150px; } .presentation_instances fieldset > ul > li > label:first-child + section { margin: 0px; width: 600px; } .ui { display: flex; flex-flow: column nowrap; align-content: flex-start; flex: 1 1 100%; position: relative; min-height: 100vh; background-color: #f3f3f3; } body.framed .ui { min-height: var(--view-height); } .ui menu.buttons { position: relative; width: 100%; margin: 0 0 5px 0; padding: 0; text-align: right; } .ui menu.buttons button { display: inline-block; height: 40px; width: 40px; margin: 0px 5px 5px 0px; padding: 0; border: 0; border-radius: 0; background-color: #ccc; } .ui menu.buttons button:first-child { margin-top: 0px; } .ui menu.buttons button span { color: #fff; } .ui menu.buttons button.in-selection { color: #fff; background-color: #0096e4; } .ui menu.buttons button:hover { color: #fff; background-color: #0096e4; text-decoration: none; } .ui .labmap.soc .legends > figure.selected-node dl span { pointer-events: none; } .ui.fullscreen > * { display: none; } .ui.fullscreen > .overlay { display: block; } .ui.fullscreen > .project-dynamic-data { display: flex; } .ui.fullscreen > .project-dynamic-data > .tools { display: none; } .ui > a.return { position: fixed; left: 0px; top: 0px; width: 60px; height: 60px; z-index: 1; } .ui > a.return > span { text-align: center; width: 100%; } .ui > a.return > span > svg { height: 30%; } .ui > .header-info { position: relative; width: 100%; margin: 0; padding: 0; box-sizing: border-box; background-color: #555; } .ui > .header-info > h1 { max-width: 90vw; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0px; line-height: 60px; padding: 0 95px 0 70px; font-size: 20px; font-weight: bold; color: #fff; box-sizing: border-box; } .ui > .header-info > h1:hover { text-decoration: none; } .ui > .header-info > span { position: absolute; right: 0px; top: 0px; width: 60px; height: 100%; line-height: 60px; font-weight: bold; background-color: #0096e4; color: #fff; text-align: center; } .ui > .header-info > span svg { height: 50%; } .ui > .header-info > span:hover { text-decoration: none; } .ui > label { display: none; } .ui > input { display: none; } .ui .datatable { background-color: #fdfdfd; } .ui .datatable tr.a:hover { background-color: #eee; text-decoration: none; color: #000; } .ui .datatable button, .ui .paginate button { border: 0; border-radius: 0; background-color: rgba(255,255,255,0.3); display: inline-block;} .ui .paginate button { background-color: #ccc; } .ui .paginate button.selected { background-color: rgba(255,255,255,0.1); color: #333; } .ui > .fixed-view-container:empty { display: none; } .ui > .fixed-view-container:not(:empty) ~ * { display: none; } .ui > .fixed-view-container { position: fixed; display: block; z-index: 15; top: 0; right: 0; left: 0; height: 100%; background-color: #efefef; } .ui > .fixed-view-container > div { position: absolute; left: 0; top: 0; right: 0; height: 100%; overflow-y: scroll; } .ui > .fixed-view-container > div .head { position: absolute; left: 0; top: 0; right: 0; margin: 0; background-color: #efefef; height: 50px;} .ui > .fixed-view-container > div .head button.close { position: absolute; top: 0; right: 0; border: 0; margin: 0; } .ui > .fixed-view-container > div .head + div { margin: 100px 60px 160px 60px; } .ui > .fixed-view-container > div .url { text-align: center; } .ui > .fixed-view-container > div button { width: 50px; height: 50px; border: 0; border-radius: 0; margin: 20px; padding: 0; background-color: rgba(0,0,0, 0.3); } .ui > .fixed-view-container > div button > span { width: 36px; color: #fff; font-size: 20px; } .ui > .fixed-view-container > div input { height: 50px; line-height: 50px; font-size: 20px; width: 80vw; max-width: 1000px; } .ui > .fixed-view-container > div .tabs { } .ui > .fixed-view-container > div .tabs > ul > li { background-color: rgba(0,0,0,0.3); border: 0; border-radius: 0; padding: 10px; background-image: none; clip-path: none; -webkit-clip-path: none; } .ui > .fixed-view-container > div .tabs > ul li.selected { background-color: #fefefe; } .ui > .fixed-view-container > div .tabs > ul li > a { font-size: 14px; } .ui > .fixed-view-container > div .tabs > div { background-color: #fefefe; line-height: 20px; border: 0; } .ui > nav > ul li.projects-nav { background-color: #a3ce6c; } .ui > nav > ul li.projects-nav > span { display: none; } .ui > nav > ul li.projects-nav ul { width: 100%; height: 50px; background-color: #f3f3f3; color: #555; padding-left: 50px; box-sizing: border-box; white-space: nowrap; } .ui > nav > ul li.projects-nav ul li { position: relative; display: inline-block; height: 50px; cursor: pointer; box-sizing: border-box; } .ui > nav > ul li.projects-nav ul li span.project-name { display: table-cell; height: 50px; padding: 8px 20px; vertical-align: bottom; text-align: center; font-weight: bold; font-size: 14px; box-sizing: border-box; } .ui > nav > ul li.projects-nav ul li span.project-amount { position: absolute; top: 10px; right: -5px; display: block; padding: 0 5px; height: 15px; min-width: 20px; border-radius: 8px; background-color: #eaeaea; text-align: center; font-size: 10px; line-height: 15px; color: #aaa; } .ui > nav > ul li.projects-nav ul li:hover, .ui > nav > ul li.projects-nav ul li.active { border-bottom: solid #0096e4 4px; } .ui > nav > ul li.projects-nav ul li:hover span.project-amount, .ui > nav > ul li.projects-nav ul li.active span.project-amount { background-color: #ddd; color: #444; } .ui > nav > ul > li.project-dynamic-nav[data-set="true"] { display: none; } .ui > nav > ul > li.project-dynamic-nav ul li.project-help { position: relative; background-color: #a3ce6c; width: 100%; } .ui > nav > ul > li.project-dynamic-nav[data-object_active="true"] ul li.project-help, .ui > nav > ul > li.project-dynamic-nav[data-object_active="true"] ul li.project-scenarios, .ui > nav > ul > li.project-dynamic-nav[data-object_active="true"] ul li.project-types { display: none; } @media all and (min-width : 1120px) { .ui > nav > ul.scroll { padding-top: 50px; } .ui > nav > ul.scroll li.projects-nav { position: absolute !important; top: 60px; left: 0px; right: 0px; height: 50px; } .ui > nav > ul.scroll li.projects-nav > span { display: block; position: absolute; top: 10px; bottom: 10px; z-index: 3; cursor: pointer; height: 30px; width: 30px; text-align: center; background-color: #aaa; color: #eaeaea; border-radius: 50px; } .ui > nav > ul.scroll li.projects-nav > span svg { height: 30%; } .ui > nav > ul.scroll li.projects-nav > span.prev { left: 10px; } .ui > nav > ul.scroll li.projects-nav > span.next { right: 10px; } .ui > nav > ul.scroll li.projects-nav ul { max-width: 100%; padding-left: 40px; overflow-x: scroll; scrollbar-width: none; -ms-overflow-style: none; } .ui > nav > ul.scroll li.projects-nav ul::-webkit-scrollbar { width: 0; height: 0; } .ui > nav > ul.scroll li.projects-nav ul li:last-child { margin-right: 40px; } } .ui > nav > ul > li.project-dynamic-nav ul li.project-help { display: flex; flex-wrap: wrap; justify-content: center; align-content: flex-start; } .ui > nav > ul > li.project-dynamic-nav ul li.project-help > div { background-color: #0096e4; padding: 10px 20px; margin: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; line-height: 20px; font-weight: bold; color: #fff; } .ui > nav > ul > li.project-dynamic-nav ul li.project-help > div:hover { background-color: #0096e4; color: #fff; text-decoration: none; } .ui > nav > ul > li.project-dynamic-nav ul li.project-filters + .project-types, .ui > nav > ul > li.project-dynamic-nav ul li.project-help + .project-types, .ui > nav > ul > li.project-dynamic-nav ul li.project-filters + .project-scenarios, .ui > nav > ul > li.project-dynamic-nav ul li.project-help + .project-scenarios { margin-top: 50px; } .ui > nav > ul > li.project-dynamic-nav > ul > li:last-child:not(.project-filters) { margin-bottom: 20px; } .ui > nav > ul > li.project-dynamic-nav ul li.project-types, .ui > nav > ul > li.project-dynamic-nav ul li.project-scenarios { display: flex; flex-wrap: wrap; justify-content: center; align-content: flex-start; } .ui > nav > ul > li.project-dynamic-nav ul li.project-types > div, .ui > nav > ul > li.project-dynamic-nav ul li.project-scenarios > div { position: relative; display: flex; align-items: center; justify-content: center; margin: 15px 15px 0px 0px; line-height: 45px; padding: 0 30px 0 20px; background-color: #ddd; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; font-weight: bold; } .ui > nav > ul > li.project-dynamic-nav ul li.project-types > div + div, .ui > nav > ul > li.project-dynamic-nav ul li.project-scenarios > div:last-child { margin-right: 0px; } .ui > nav > ul > li.project-dynamic-nav ul li.project-types > div > span.icon, .ui > nav > ul > li.project-dynamic-nav ul li.project-scenarios > div > span.icon { background-color: #0096e4; color: #fff; width: 25px; height: 25px; padding-left: 1px; border-radius: 25px; text-align: center; margin-right: 15px; line-height: 22px; } .ui > nav > ul > li.project-dynamic-nav ul li.project-types > div > span.icon svg, .ui > nav > ul > li.project-dynamic-nav ul li.project-scenarios > div > span.icon svg { height: 10px; } .ui > nav > ul > li.project-dynamic-nav ul li.project-types > div:hover, .ui > nav > ul > li.project-dynamic-nav ul li.project-scenarios > div:hover { background-color: #0096e4; color: #fff; text-decoration: none;} .ui > nav > ul > li.project-dynamic-nav ul li.project-types > div:hover > span.icon, .ui > nav > ul > li.project-dynamic-nav ul li.project-scenarios > div:hover > span.icon { background-color: #fff; color: #0096e4; } .ui > .project-dynamic-data { position: relative; flex: 1; display: flex; flex-wrap: nowrap; flex-direction: column; height: 100%; max-width: 100%; } .ui > .project-dynamic-data > .tools { width: 100%; margin: 0; background-color: #a3ce6c; box-sizing: border-box; } .ui > .project-dynamic-data > .tools.no-filter { display: none; } .ui > .project-dynamic-data > .data { flex: 2; position: relative; display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: center; height: 100%; max-width: 100%; } .ui > .project-dynamic-data > .data > .objects { position: relative; flex: 3 1 100%; max-width: 100%; } .ui > .project-dynamic-data > .data > .object { position: relative; flex: 2 1 100%; box-sizing: border-box; max-width: 40vw; } .ui > .project-dynamic-data > .tools[data-object_active="true"] + .data > .objects[data-display_mode="list"] { max-width: 60vw; } .ui > .project-dynamic-data > .tools[data-object_active="true"] + .data.fullscreen-object > .objects { display: none; } .ui > .project-dynamic-data > .data.fullscreen-object > .object { position: relative; min-width: 100%; padding: 30px; background-color: #f3f3f3; } .ui > .project-dynamic-data > .data > .objects:empty, .ui > .project-dynamic-data > .data > .object:empty { flex: 0; display: none; } .ui > .project-dynamic-data > .data > .objects:empty + .object { max-width: 90vw; border-top: 4px solid #f3f3f3;} .ui > .project-dynamic-data > .data > .object-thumbnail-container { display: none; } .ui > .project-dynamic-data > .tools > div { display: flex; justify-content: center; } .ui > .project-dynamic-data > .tools > div > div { background-color: rgba(255,255,255, 0.8); padding: 0; margin: 10px 5px; white-space: nowrap; } .ui > .project-dynamic-data > .tools > div > div > span { white-space: nowrap; text-align: center; font-weight: bold; display: inline-block; vertical-align: middle; color: #444; line-height: 36px; margin: 2px; margin-right: 0px; padding: 0 12px; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .ui > .project-dynamic-data > .tools > div > div > span:last-child { margin-right: 2px; } .ui > .project-dynamic-data > .tools > div > div > span > span:first-child { padding-right: 8px; } .ui > .project-dynamic-data > .tools > div > div > span:hover { text-decoration: none; } .ui > .project-dynamic-data > .tools > div > div.visualisation-buttons > span.active, .ui > .project-dynamic-data > .tools > div > div.visualisation-buttons > span:hover { background-color: #0096e4; color: #fff; } .ui > .project-dynamic-data > .tools > div > div.result-info, .ui > .project-dynamic-data > .tools > div > div.controls { background-color: transparent; } .ui > .project-dynamic-data > .tools > div > div.result-info > span:first-child:not(:last-child) { padding-right: 5px; } .ui > .project-dynamic-data > .tools > div > div.result-info > span.set + span.amount { padding-left: 0; } .ui > .project-dynamic-data > .tools > div > div.result-info > span > span:first-child { padding-right: 3px; } .ui > .project-dynamic-data > .tools > div > div.result-info > span, .ui > .project-dynamic-data > .tools > div > div.controls > span { background-color: rgba(255,255,255, 0.4); margin: 2px 0;} .ui > .project-dynamic-data > .tools > div > div.controls > span:hover { color: #444; } .ui > .project-dynamic-data > .tools .new-data { display: none } .ui > .project-dynamic-data > .data > .objects > div.no-data ~ * { display: none !important; } .ui > .project-dynamic-data > .data > .objects > input { display: none; } .ui > .project-dynamic-data > .data > .objects > label { position: absolute; z-index: 1; cursor: pointer; } .ui > .project-dynamic-data > .data > .objects { display: flex; flex-wrap: wrap; justify-content: center; align-content: flex-start; } .ui > .project-dynamic-data > .data > .objects > .overlay-grid { position: absolute; z-index: 1; } .ui > .project-dynamic-data > .data > .objects > input:not(:checked) + label { display: block; width: 160px; height: 30px; right: 20px; top: 260px; } .ui > .project-dynamic-data > .data > .objects > input:not(:checked) + label > span:first-child { display: block; width: 100%; line-height: 30px; text-align: center; background-color: #0096e4; color: #fff; letter-spacing: 2px; text-transform: uppercase; } .ui > .project-dynamic-data > .data > .objects > input:not(:checked) + label > span:last-child { display: none; } .ui > .project-dynamic-data > .data > .objects > input:not(:checked) + label + div.overlay-grid-next-prev { position: absolute; display: block; height: 30px; right: 20px; top: 20px; z-index: 1; } .ui > .project-dynamic-data > .data > .objects > input:not(:checked) + label + div.overlay-grid-next-prev > span { cursor: pointer; display: inline-block; text-align: center; height: 25px; width: 25px; color: #fff; background-color: #0096e4; } .ui > .project-dynamic-data > .data > .objects > input:not(:checked) + label + div.overlay-grid-next-prev > span:first-child { margin-right: 5px; } .ui > .project-dynamic-data > .data > .objects > input:not(:checked) + label + div + div.overlay-grid { width: 160px; height: 200px; top: 50px; right: 20px; } .ui > .project-dynamic-data > .data > .objects > input:not(:checked) + label + div + div.overlay-grid > .object-thumbnail { position: absolute; top: 20px; left: 10px; z-index: 1;} .ui > .project-dynamic-data > .data > .objects > input:not(:checked) + label + div + div.overlay-grid > .object-thumbnail:nth-of-type(2) { width: 150px; top: 10px; left: 5px; z-index: 2; } .ui > .project-dynamic-data > .data > .objects > input:not(:checked) + label + div + div.overlay-grid > .object-thumbnail:nth-of-type(1) { width: 160px; top: 0px; left: 0px; z-index: 3; } .ui > .project-dynamic-data > .data > .objects > input:checked + label { width: 60px; height: 60px; right: 20px; top: 20px; background-color: #fff; } .ui > .project-dynamic-data > .data > .objects > input:checked + label > span:first-child { display: none; } .ui > .project-dynamic-data > .data > .objects > input:checked + label > span:last-child {display: block; width: 100%; height: 100%; text-align: center; background-color: #0096e4; color: #fff; } .ui > .project-dynamic-data > .data > .objects > input:checked + label + div { display: none; } .ui > .project-dynamic-data > .data > .objects > input:checked + label + div + div.overlay-grid { left: 20px; top: 20px; right: 60px; display: flex; flex-wrap: wrap; justify-content: center; align-content: flex-start; } .ui > .project-dynamic-data > .data > .objects[data-display_mode="grid"] { padding: 50px; } .ui > .project-dynamic-data > .data > .objects .object-thumbnail { position: relative; display: inline-block; width: 140px; height: 170px; background-color: #ededed; margin: 0px 55px 55px 0px; border: 1px solid #d0d0d0; } .ui > .project-dynamic-data > .data > .objects .object-thumbnail:last-child { margin-right: 0px; } .ui > .project-dynamic-data > .data > .objects .object-thumbnail .image { margin: 4px 4px 0 4px; width: calc(100% - 8px); height: 131px; background-repeat: no-repeat; background-position: center 10%; background-size: cover; } .ui > .project-dynamic-data > .data > .objects .object-thumbnail .image span { height: 100%; display: flex; align-items: center; justify-content: center; font-size: 3em; font-family: serif; } .ui > .project-dynamic-data > .data > .objects .object-thumbnail .name { position: absolute; bottom: 0px; width: 100%; min-height: 35px; max-height: 100%; display: flex; overflow: hidden; justify-content: center; align-items: center; box-sizing: border-box; background-color: #ededed; padding: 5px; text-align: center; vertical-align: middle; color: #000; } .ui > .project-dynamic-data > .data > .objects .object-thumbnail:hover { text-decoration: none; background-color: #0096e4; border-color: #0096e4; } .ui > .project-dynamic-data > .data > .objects .object-thumbnail:hover .image span, .ui > .project-dynamic-data > .data > .objects > .object-thumbnail:hover .name { color: #fff; background-color: #0096e4; } .ui > .project-dynamic-data > .data > .objects > button { display: block; width: 20%; margin: 20px 40% 20px 40%; text-align: center; background-color: rgba(255,255,255, 0.3); padding: 20px; box-sizing: border-box; border: 0; font-weight: bold; color: #444; } .ui > .project-dynamic-data > .data > .objects > button:hover { text-decoration: none; background-color: #0096e4; color: #fff; } .ui > .project-dynamic-data > .data > .objects > [data-visualisation_type] { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; flex: 2; height: 100%; } .ui > .project-dynamic-data > .data > .objects > .tabs.list-view { position: relative; margin: 5px; width: 100%; max-width: 98vw; } .ui > .project-dynamic-data .tabs.list-view > ul > li { background-color: #f5f5f5; border: 0; border-radius: 0; padding: 5px 10px; background-image: none; clip-path: none; -webkit-clip-path: none; } .ui > .project-dynamic-data .tabs.list-view > ul > li.selected { background-color: #ddd; } .ui > .project-dynamic-data .tabs.list-view > ul > li a { color: #444; } .ui > .project-dynamic-data .tabs.list-view > div { position: relative; padding: 0; border: 0; } .ui > .project-dynamic-data .tabs.list-view > div > div { position: relative; width: 100%; } .ui > .project-dynamic-data .tabs.list-view > div > div div.options { background-color: #ddd; } .ui > .project-dynamic-data > .data > .object { background-color: #eee; } .ui > .project-dynamic-data > .data > .object > div { position: relative; background-color: #eee; padding-bottom: 20px; height: auto; } .ui > .project-dynamic-data > .data.fullscreen-object > .object.show-explore-visualisations { padding: 0px; } .ui > .project-dynamic-data > .data > .object.show-explore-visualisations > div.has-explore-visualisations { display: flex; } .ui > .project-dynamic-data > .data > .object.show-explore-visualisations > div.has-explore-visualisations > div { position: relative; flex: 2 1 100%; box-sizing: border-box; } .ui > .project-dynamic-data > .data > .object.show-explore-visualisations > div.has-explore-visualisations > div:first-child { margin: 0px; } .ui > .project-dynamic-data > .data > .objects:empty + .object.show-explore-visualisations { border: 0px; } .ui > .project-dynamic-data > .data > .object > div .tabs { margin: 15px; } .ui > .project-dynamic-data > .data > .object > div > div:not(.tabs) > ul { padding: 12px; } .ui .head { margin: 0px; position: relative; background-color: #777; display: flex; justify-content: space-between; width: 100%; } .ui .head > .object-thumbnail-image { display: block; margin: 0; padding: 0; height: 60px; width: 60px; min-width: 60px; background-repeat: no-repeat; background-position: center 10%; background-size: cover; } .ui .head > h1 { position: relative; flex-grow: 2; color: #efefef; margin: 0; min-height: 60px; line-height: 35px; font-size: 20px; padding: 12px 20px; box-sizing: border-box; } .ui .head > .navigation-buttons { position: relative; white-space: nowrap; } .ui .head > .navigation-buttons > button { border: 0; width: 60px; height: 60px; border-radius: 0; margin: 0; padding: 0; background-color: #555; display: inline-block;} .ui .head > .navigation-buttons > button > span { color: #fff; } .ui > .project-dynamic-data > .data > .object > div menu.buttons { width: auto; display: block; position: absolute; right: 20px; z-index: 1; } .ui > .project-dynamic-data > .data > .object > div > div > menu.buttons { top: 80px; } .ui > .project-dynamic-data > .data > .object .combined-filters { position: relative; display: flex; flex-wrap: wrap; align-content: flex-start; } .ui > .project-dynamic-data > .data > .object .combined-filters > div { position: relative; display: flex; flex-wrap: nowrap; padding: 5px; margin: 0 15px 10px 0; background-color: #fff; } .ui > .project-dynamic-data > .data > .object .combined-filters > div > input { margin-right: 5px; } .ui > .project-dynamic-data > .data > .object .combined-filters > div > * { padding: 5px; } .ui > .project-dynamic-data > .data > .object .tabs.object-view > ul > li { background-color: transparent; border: 0; background-image: none; border-radius: 0; padding: 0; clip-path: none; -webkit-clip-path: none; } .ui > .project-dynamic-data > .data > .object .tabs.object-view > ul > li.selected { border: 0; } .ui > .project-dynamic-data > .data > .object .tabs.object-view > ul > li.selected a { background-color: rgba(255,255,255,0.7);} .ui > .project-dynamic-data > .data > .object .tabs.object-view > ul > li.no-data a { background-color: rgba(255,255,255,0.35); pointer-events: none; } .ui > .project-dynamic-data > .data > .object .tabs.object-view > ul > li > a { position: relative; font-size: 14px; padding: 10px; background-color: #aaa; margin-right: 10px; } .ui > .project-dynamic-data > .data > .object .tabs.object-view > ul.big > li > a { margin-bottom: 8px; } .ui > .project-dynamic-data > .data > .object .tabs.object-view > ul > li > a > span { line-height: 14px; } .ui > .project-dynamic-data > .data > .object .tabs.object-view > ul > li > a > span.amount { position: absolute; top: -10px; right: -15px; display: block; padding: 0 5px; height: 15px; min-width: 20px; border-radius: 8px; background-color: #0096e4; text-align: center; font-size: 10px; line-height: 15px; color: #fff; } .ui > .project-dynamic-data > .data > .object .tabs.object-view > div { margin-top: 1px; background-color: rgba(255,255,255,0.7); border: 0; } .ui > .project-dynamic-data > .data > .object .tabs.object-view > div > ul::after, .ui > .project-dynamic-data > .data > .object > div > div > ul::after { content: " "; display: block; height: 0; clear: both; } .ui > .project-dynamic-data > .data > .object ul > li.object-descriptions { position: relative; } .ui > .project-dynamic-data > .data > .object ul > li.media > span { margin: 0 10px 10px 0; box-sizing: border-box; display: inline-block; } .ui > .project-dynamic-data > .data > .object ul > li.media > span object, .ui > .project-dynamic-data > .data > .object ul > li.media > span iframe { width: 600px; height: 600px; } .ui > .project-dynamic-data > .data > .object ul > li.media > span img, .ui > .project-dynamic-data > .data > .object ul > li.media > span video, .ui > .project-dynamic-data > .data > .object ul > li.media > span object, .ui > .project-dynamic-data > .data > .object ul > li.media > span iframe { max-height: 40vh; max-width: 100%; } .ui > .project-dynamic-data > .data > .object ul > li.related-media { display: flex; flex-wrap: wrap; } .ui > .project-dynamic-data > .data.fullscreen-object > .object ul > li.related-media { float: right; clear: left; margin-top: 50px; width: 340px; padding: 10px 0 0 10px; justify-content: flex-end;} .ui > .project-dynamic-data > .data.fullscreen-object > .object ul > li.related-media ~ li { max-width: calc(100% - 350px); } .ui > .project-dynamic-data > .data > .object ul > li.related-media > div { width: 150px; height: 150px; display: inline-block; margin: 0 10px 10px 0; background-repeat: no-repeat; background-position: center 10%; background-size: cover; background-color: #bbb; } .ui > .project-dynamic-data > .data > .object ul > li.related-media > div > span { width: 100%; text-align: center; color: #fff; } .ui > .project-dynamic-data > .data > .object ul > li.related-media > div > span > svg { height: 25%; } .ui > .project-dynamic-data > .data > .object ul > li.keywords span { display: inline-block; padding: 10px; margin: 0 10px 10px 0;} .ui > .project-dynamic-data > .data > .object ul > li.keywords span:hover { color: #fff; background-color: #0096e4; text-decoration: none; } .ui > .project-dynamic-data > .data > .object ul li.object-descriptions dl { display: table; border-spacing: 0px 8px; } .ui > .project-dynamic-data > .data > .object ul li.object-descriptions dl > div, .ui > .project-dynamic-data > .data > .object ul li.object-description { display: table-row; } .ui > .project-dynamic-data > .data > .object ul li.object-descriptions dt, .ui > .project-dynamic-data > .data > .object ul li.object-description > label { display: table-cell; padding-right: 10px; font-family: var(--font-mono); vertical-align: middle; } .ui > .project-dynamic-data > .data > .object ul li.object-description > label { padding: 4px 10px 4px 0px; } .ui > .project-dynamic-data > .data > .object ul li.object-description > div { padding: 4px 0px 4px 0px; } .ui > .project-dynamic-data > .data > .object ul li:not(.object-description) + li.object-description > label, .ui > .project-dynamic-data > .data > .object ul li:not(.object-description) + li.object-description > div { padding-top: 8px; } .ui > .project-dynamic-data > .data > .object ul li.object-description:has(+ li:not(.object-description)) > label, .ui > .project-dynamic-data > .data > .object ul li.object-description:has(+ li:not(.object-description)) > div { padding-bottom: 8px; } .ui > .project-dynamic-data > .data > .object ul li.object-descriptions dt > span, .ui > .project-dynamic-data > .data > .object ul li.object-description > label > span { margin-left: 5px; } .ui > .project-dynamic-data > .data > .object ul li.object-descriptions dd, .ui > .project-dynamic-data > .data > .object ul li.object-description > div { display: table-cell; } .ui > .project-dynamic-data > .data > .object ul li.object-descriptions dd > span.a, .ui > .project-dynamic-data > .data > .object ul li.object-description > div > span.a { display: inline-block; border-bottom: 1px #444 dashed; padding: 2px 3px; margin-bottom: 3px; } .ui > .project-dynamic-data > .data > .object ul li.object-descriptions dd > span.a + span.a, .ui > .project-dynamic-data > .data > .object ul li.object-description > div > span.a + span.a { margin-left: 10px;} .ui > .project-dynamic-data > .data > .object ul li.object-descriptions dd > span.a:hover, .ui > .project-dynamic-data > .data > .object ul li.object-description > div > span.a:hover { text-decoration: none; background-color: #0096e4; color: #fff; } .ui > .project-dynamic-data > .data > .object ul li.text_tags dd div + p, .ui > .project-dynamic-data > .data > .object ul li.text_tags > div div + p { display: none;} .ui > .project-dynamic-data > .data > .object ul li.text_tags dd > div, .ui > .project-dynamic-data > .data > .object ul li.text_tags > div > div { background-color: #fff; padding: 10px; } .ui > .project-dynamic-data > .data > .object ul li.text_tags dd > div > ul, .ui > .project-dynamic-data > .data > .object ul li.text_tags > div > div > ul { display: none;} .ui > .project-dynamic-data > .data > .object ul li.text_tags dd > div.tabs > div, .ui > .project-dynamic-data > .data > .object ul li.text_tags > div > div.tabs > div { padding: 0px; background-color: #fff; border: 0px;} .ui > .project-dynamic-data > .data > .object ul li.text_tags dd span.tag, .ui > .project-dynamic-data > .data > .object ul li.text_tags > div span.tag { white-space: nowrap; } .ui > .project-dynamic-data > .data > .object ul li.external dd, .ui > .project-dynamic-data > .data > .object ul li.external > div { max-width: 80%; } .ui > .project-dynamic-data > .data > .object ul li.external dd > a, .ui > .project-dynamic-data > .data > .object ul li.external > div > a { display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; padding: 4px 40px 4px 10px; margin: 0 3px 3px 0; font-size: 1.4rem; color: #444444; background: url("/CMS/css/images/icons/linked.svg") no-repeat scroll right 15px center / 10px 10px #efefef;} .ui > .project-dynamic-data > .data > .object ul li.external dd > a:hover, .ui > .project-dynamic-data > .data > .object ul li.external > div > a:hover { color: #fff; text-decoration: none; background-color: #0096e4; } .ui > .project-dynamic-data > .data > .object ul li.reversed_collection_resource_path dd > span.a, .ui > .project-dynamic-data > .data > .object ul li.reversed_collection_resource_path dd > span.a + span.a, .ui > .project-dynamic-data > .data > .object ul li.reversed_collection_resource_path > div > span.a, .ui > .project-dynamic-data > .data > .object ul li.reversed_collection_resource_path > div > span.a + span.a { margin: 0; } .ui > .project-dynamic-data > .data > .object ul li dd .album, .ui > .project-dynamic-data > .data > .object ul li > div .album { } .ui > .project-dynamic-data > .data > .object ul li dd .album > figure, .ui > .project-dynamic-data > .data > .object ul li > div .album > figure { display: inline-block; margin: 16px 24px 0 0; padding: 0; width: 235px; height: 147px; } .ui > .project-dynamic-data > .data > .object ul li dd .album > figure div > img, .ui > .project-dynamic-data > .data > .object ul li > div .album > figure div > img { width: 235px; height: 147px; object-fit: cover; } .ui > .project-dynamic-data > .data > .object ul li dd .album > figure > figurecaption, .ui > .project-dynamic-data > .data > .object ul li > div .album > figure > figurecaption { display: none; } .ui > .project-dynamic-data > .data > .object ul > li.object-subs .tabs { max-width: 35vw; } .ui > .project-dynamic-data > .data.fullscreen-object > .object ul > li.object-subs .tabs, .ui > .project-dynamic-data > .data > .objects:empty + .object ul > li.object-subs .tabs { max-width: 80vw; } .ui > .project-dynamic-data > .data > .object ul > li.object-subs > .tabs { max-width: 35vw; margin: 10px 0;} .ui > .project-dynamic-data > .data > .object ul > li.object-subs > .tabs > ul > li, .ui > .project-dynamic-data > .data > .object ul > li.object-subs > .tabs > ul > li.selected { clip-path: none; -webkit-clip-path: none; background-image: none; border: 0; } .ui > .project-dynamic-data > .data > .object ul > li.object-subs > .tabs > ul > li { background-color: #aaa; } .ui > .project-dynamic-data > .data > .object ul > li.object-subs > .tabs > ul > li.selected { background-color: #fff; } .ui > .project-dynamic-data > .data > .object ul > li.object-subs > .tabs > div { border: 0; } .ui > .project-dynamic-data > .data > .object ul > li.object-subs > .tabs table.display td { /* white-space: normal; overflow: auto; text-overflow: unset; max-width: 35vw; */ } .ui > .project-dynamic-data > .data .object .object-thumbnail { width: calc(100% - 30px); height: 50px; background-color: #fff; margin: 15px; box-sizing: border-box; } .ui > .project-dynamic-data > .data .object-thumbnail-container .object-thumbnail > div, .ui > .project-dynamic-data > .data .object .object-thumbnail > div { display: flex; height: 100%; overflow: hidden; } .ui > .project-dynamic-data > .data .object-thumbnail-container .image, .ui > .project-dynamic-data > .data .object .object-thumbnail .image { display: inline-block; width: 50px; height: 100%; background-repeat: no-repeat; background-position: center 10%; background-size: cover; background-color: #bbb; } .ui > .project-dynamic-data > .data .object-thumbnail-container .image span, .ui > .project-dynamic-data > .data .object .object-thumbnail .image span { height: 100%; display: flex; align-items: center; justify-content: center; font-size: 3em; font-family: serif; } .ui > .project-dynamic-data > .data .object-thumbnail-container .name, .ui > .project-dynamic-data > .data .object .object-thumbnail .name { width: calc(100% - 50px); max-width: 500px; height: 100%; color: #000; display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 16px; vertical-align: middle; margin: 0; padding: 0; padding-left: 20px; box-sizing: border-box;} .ui > .project-dynamic-data > .data .object-thumbnail-container .name span, .ui > .project-dynamic-data > .data .object .object-thumbnail .name span { line-height: 50px; } .ui > .project-dynamic-data > .data .object-thumbnail:hover, .ui > .project-dynamic-data > .data .object .object-thumbnail:hover { text-decoration: none; color: #fff; } .ui > .project-dynamic-data > .data .object-thumbnail .object-definitions, .ui > .project-dynamic-data > .data .object .object-thumbnail .object-definitions { display: none; } .ui > .project-dynamic-data > .data > .object .explore-object { background-color: #efefef; padding: 20px; } .ui > .project-dynamic-data > .data > .object .explore-object > div { height: calc(var(--view-height) - 300px); } .ui > .project-dynamic-data > .data > .object .explore-object > div .labmap > .controls .timeline .buttons { display: none; } .ui > .selections-container.view, .ui > .selections-container.list > div { background-color: #0096e4; } .ui > .selections-container { z-index: 10; width: 20vw; min-width: 300px; } .ui > .selections-container.list { min-width: 100px; } .ui > .selections-container.view { position: absolute; left: 0; top: 0px; min-height: 100%; } .ui > .selections-container.view .head { background-color: rgba(0,0,0,0.2); } .ui > .selections-container.view .head button { background-color: rgba(0,0,0,0.3); } .ui > .selections-container.view menu.buttons button { background-color: rgba(255,255,255,0.3); margin: 5px 5px 0 0; } .ui > .selections-container.view menu.buttons button:hover { background-color: #fff; } .ui > .selections-container.view menu.buttons button:hover span { color: #0096e4; } .ui > .selections-container.view menu.buttons button.add-selection { position: absolute; left: 5px; } .ui > .selections-container.view menu.buttons button.add-selection span { font-size: 14px; } .ui > .selections-container.view menu.buttons > span { display: block; margin: 0; text-align: center; margin-top: 10px; } .ui > .selections-container.view menu.buttons > span > button { background-color: #fff;} .ui > .selections-container.view menu.buttons > span > button > span { color: #0096e4; font-size: 20px; } .ui > .selections-container.view menu.buttons > span > input { width: calc(100% - 10px); margin: 5px; font-size: 20px; } .ui > .selections-container.view > h3 { margin-top: 25px; color: #fff; } .ui > .selections-container.view > p, .ui > .selections-container.view > ul.external > li > div > div > .name > span, .ui > .selections-container.view > ul.external > li > div > h4, .ui > .selections-container.view > ul.external > li > div > p { color: #fff; } .ui > .selections-container.view > h3, .ui > .selections-container.view > p, .ui > .selections-container.view > ul.external > li { padding: 10px 25px; } .ui > .selections-container.view > ul.external > li > div > div > .image { margin: 0; width: 50px; height: 50px; display: inline-block; background-repeat: no-repeat; background-position: center 10%; background-size: cover; background-color: #bbb; } .ui > .selections-container.view > ul.external > li > div > div > .name { display: inline-block; width: calc(100% - 50px); line-height: 50px; display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #fff; font-size: 14px; vertical-align: top; margin: 0; box-sizing: border-box; background-color: rgba(0,0,0, 0.1); padding: 0 5px; } .ui > .selections-container.view > ul.external > li > div > div.no-image > .name { width: 100%; } .ui > .selections-container.view .options { background-color: transparent; width: 100%; margin-top: 25px; padding: 0; position: relative;} .ui > .selections-container.view .options fieldset > ul { width: 100%; } .ui > .selections-container.view .options fieldset > ul > li { width: 100%; display: block; padding: 10px 25px; box-sizing: border-box;} .ui > .selections-container.view .options fieldset > ul > li:first-child > input { font-size: 20px; } .ui > .selections-container.view .options fieldset > ul > li > input[type="text"], .ui > .selections-container.view .options fieldset > ul > li > textarea { width: 100%; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li { width: 100%; position: relative; margin-bottom: 20px; display: table;} .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > span { color: #fff; display: table-cell; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div { display: table-cell; position: relative; height: 80px; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div { display: table; table-layout: fixed; position: relative; width: 100%; height: 80px; background-color: rgba(0,0,0, 0.1); padding: 5px; box-sizing: border-box; margin: 0; padding: 0; border-collapse: collapse; border: 0;} .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div > div.object-thumbnail { width: calc(100% - 30px); height: 80px; display: inline-block; vertical-align: top; position: relative; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div > div.object-thumbnail .image { width: 80px; height: 80px; display: inline-block; background-repeat: no-repeat; background-position: center 10%; background-size: cover; background-color: #bbb; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div > div.object-thumbnail .name { width: calc(100% - 100px); height: 30px; line-height: 30px; color: #fff; display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; vertical-align: top; margin: 5px 0 0 10px; box-sizing: border-box; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div > div.object-thumbnail.no-image .name { width: calc(100% - 35px); margin-left: 5px; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div > input { width: calc(100% - 45px); height: 30px; display: inline-block; margin: 5px 0 0 5px; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div > button { width: 30px; height: 30px; position: absolute; top: 5px; right: 5px; background-color: rgba(255,255,255,0.3); border: 0; border-radius: 0; margin: 0; padding: 0;} .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div > button:hover { background-color: #fff; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div > button:hover span { color: #0096e4; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div > textarea { width: calc(100% - 90px); height: 35px; position: absolute; bottom: 5px; right: 5px; resize: none; } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div > div.no-image + button + textarea { width: calc(100% - 10px); } .ui > .selections-container.view .options fieldset > ul > li > ul.sorter > li > div > div.heading > textarea { width: calc(100% - 10px); } .ui > .selections-container.list { position: fixed; bottom: 10px; left: 10px; } .ui > .selections-container.list > div { margin-top: 10px; cursor: pointer; padding: 0 10px; height: 30px; } .ui > .selections-container.list > div > span { display: inline-block; width: 30px; text-align: right; color: #fff; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; line-height: 30px; font-weight: bold; } .ui > .selections-container.list > div > span:first-child { width: calc(20vw - 50px); min-width: 50px; text-align: left; } .ui .selections-hover { display: block; position: absolute; width: 250px; background-color: #ccc; } .ui .selections-hover > div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; line-height: 30px; color: #fff; padding: 0 5px; font-weight: bold; cursor: pointer;} .ui .selections-hover > div.in-selection, .ui .selections-hover > div:hover { color: #fff; background-color: #0096e4; text-decoration: none; } .ui .hover { display: block; position: absolute; width: 150px; height: 150px; background-color: #a3ce6c; pointer-events: none;} .ui .hover:after, .ui .hover:before { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } .ui .hover:after { border-color: rgba(136, 183, 213, 0); border-top-color: #a3ce6c; border-width: 10px; margin-left: -10px; } .ui .hover .image { width: 100%; height: 95px; background-repeat: no-repeat; background-position: center 10%; background-size: cover; background-color: rgba(255,255,255, 0.3); } .ui .hover .image span { height: 100%; display: flex; align-items: center; justify-content: center; font-size: 3em; font-family: serif; color: #fff; } .ui .hover .name { width: 100%; height: 35px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box; padding: 5px; line-height: 25px; text-align: center; vertical-align: middle; color: #fff; font-weight: bold;} .ui .hover .object-definitions { display: none; } .ui .hover .ref-count { position: relative; width: 100%; display: flex; background-color: rgba(255,255,255, 0.3); justify-content: center; } .ui .hover .ref-count > div { position: relative; width: 100%; height: 15px; margin: 0; padding: 0; display: flex; justify-content: center;} .ui .hover .ref-count > div span { color: #fff; line-height: 15px; padding: 0 5px; font-weight: bold; text-align: center; vertical-align: middle;} .ui .hover .ref-count > div span.arrow { font-size: 20px; line-height: 12px; padding: 0; } @media all and (max-width : 1120px) { .ui.responsive-layout-enabled { padding-top: 60px; box-sizing: border-box; } .ui.responsive-layout-enabled > .fixed-view-container > div > .head + div { margin: 70px 20px 160px 20px; } .ui.responsive-layout-enabled > .header-info { position: fixed; top: 0; left: 0; right: 0; z-index: 2; } .ui.responsive-layout-enabled > label { cursor: pointer; display: block; position: fixed; left: 15px; top: 0px; line-height: 60px; text-align: center; font-size: 20px; color: #fff; z-index: 4; } .ui.responsive-layout-enabled > nav { display: none; } .ui.responsive-layout-enabled > input:checked + nav { display: block; position: fixed; top: 60px; left: 0px; right: 0; bottom: 0; background-color: rgba(0,0,0,0.1); z-index: 4; } .ui.responsive-layout-enabled > nav > ul { width: 90%; max-width: 500px; height: 100%; background-color: #a3ce6c; display: block; overflow-y: auto;} .ui.responsive-layout-enabled > nav > ul li.projects-nav ul { width: 100%; min-height: 50px; height: auto; background-color: rgba(255,255,255,0.5); padding: 10px 10px 0 10px; box-sizing: border-box; white-space: normal; } .ui.responsive-layout-enabled > nav > ul li.projects-nav ul li { position: relative; display: inline-block; cursor: pointer; box-sizing: border-box; margin-right: 10px; margin-bottom: 8px; height: 30px; background-color: #fff; color: #666; } .ui.responsive-layout-enabled > nav > ul li.projects-nav ul li span.project-name { display: table-cell; height: 30px; padding: 0px 10px; line-height: 30px; text-align: center; font-weight: bold; font-size: 14px; box-sizing: border-box; } .ui.responsive-layout-enabled > nav > ul li.projects-nav ul li span.project-amount { display: none;} .ui.responsive-layout-enabled > nav > ul li.projects-nav ul li:hover, .ui.responsive-layout-enabled > nav > ul li.projects-nav ul li.active { border: 0; background-color: #0096e4; color: #fff; } .ui.responsive-layout-enabled > nav > ul li.projects-nav ul li:hover span.project-amount, .ui.responsive-layout-enabled > nav > ul li.projects-nav ul li.active span.project-amount { background-color: #444; color: #fff; } .ui.responsive-layout-enabled > nav > ul li.project-dynamic-nav[data-set="true"] { display: block; } .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-filters { position: relative; top: auto; left: auto; height: auto; display: inline-block; padding: 5px; box-sizing: border-box; } .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-filters[data-active="true"] ~ li, .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-filters[data-object_active="true"] ~ li { display: block; } .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav[data-object_active="true"] ul li.project-help, .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav[data-object_active="true"] ul li.project-scenarios, .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav[data-object_active="true"] ul li.project-types { display: flex; } .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul { margin: 0; padding: 0; } .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-help, .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-types, .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-scenarios { margin: 30px 0; } .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-help > div, .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-types > div, .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-scenarios > div { color: #fff; display: block; width: 100%; margin: 0; margin-bottom: 2px; background-color: rgba(255,255,255,0.2); box-sizing: border-box; } .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-types > div > span.icon, .ui.responsive-layout-enabled > nav > ul > li.project-dynamic-nav ul li.project-scenarios > div > span.icon { display: none; } .ui.responsive-layout-enabled > .project-dynamic-data > .tools { position: fixed; top: 60px; left: 0; right: 0; z-index: 2; } .ui.responsive-layout-enabled > .project-dynamic-data > .tools > div { margin: 5px 0 5px 0; } .ui.responsive-layout-enabled > .project-dynamic-data > .tools > div > div > span { padding: 0 10px; line-height: 31px; } .ui.responsive-layout-enabled > .project-dynamic-data > .tools > div > div:not(:first-child) > span > span:first-child { display: none; } .ui.responsive-layout-enabled > .project-dynamic-data > .data { margin-top: 65px; } .ui.responsive-layout-enabled > .project-dynamic-data > .tools[data-active="false"] + .data, .ui.responsive-layout-enabled > .project-dynamic-data > .tools[data-object_active="true"] + .data { margin-top: 0px; } .ui.responsive-layout-enabled > .project-dynamic-data > .tools[data-object_active="true"], .ui.responsive-layout-enabled > .project-dynamic-data > .tools[data-object_active="true"] + .data > .objects { display: none; } .ui.responsive-layout-enabled > .project-dynamic-data > .data > .objects[data-display_mode="list"] { max-width: 98vw; padding: 0; } .ui.responsive-layout-enabled > .project-dynamic-data > .data .tabs > div .datatable > .options > div > .count { display: none; } .ui.responsive-layout-enabled > .project-dynamic-data > .data > .objects[data-display_mode="grid"] { padding-top: 20px; } .ui.responsive-layout-enabled > .project-dynamic-data > .data > .objects > .object-thumbnail { margin: 0 20px 20px 0; } .ui.responsive-layout-enabled > .project-dynamic-data > .data > .objects:empty + .object, .ui.responsive-layout-enabled > .project-dynamic-data > .data > .object { border-top: 4px solid #f3f3f3; max-width: 100vw; padding: 0; } .ui > .project-dynamic-data > .data > .object-thumbnail-container { display: flex; position: fixed; right: 0; left: 0; bottom: 0; height: 80px; z-index: 3; background-color: #eee; padding: 15px; box-sizing: border-box; } .ui > .project-dynamic-data > .data > .object-thumbnail-container:empty { display: none; } .ui.responsive-layout-enabled > .project-dynamic-data > .data > .object ul > li.object-subs .tabs { max-width: 90vw; } .ui > .project-dynamic-data > .data > .object-thumbnail-container > div { width: calc(100% - 60px); display: flex; box-sizing: border-box; height: 50px; background-color: #fff; } .ui > .project-dynamic-data > .data > .object-thumbnail-container button { margin-left: 10px; display: inline-block; width: 50px; height: 50px; background-color: #ddd; color: #444; line-height: 25px; text-align: center; vertical-align: middle; border: 0;} .ui.responsive-layout-enabled > .project-dynamic-data > .data div.head > h1 { font-size: 17px; } .ui.responsive-layout-enabled > .project-dynamic-data > .data .explore-object > div { height: calc(var(--view-height) - 100px); } .ui.responsive-layout-enabled > .project-dynamic-data > .data .objects .labmap > .controls .timeline { bottom: 0px } .ui.responsive-layout-enabled > .project-dynamic-data > .data .objects .labmap > .controls .timeline > div { max-width: 100%; width: 100%; box-sizing: border-box; } .ui.responsive-layout-enabled > input:checked + nav + div + .selections-container { display: none; } .ui.responsive-layout-enabled > .selections-container.view { position: absolute; left: 0; top: 0px; right: 0px; width: 100%; } .ui.responsive-layout-enabled > .selections-container.list { bottom: 5px; left: 5px; } .ui.responsive-layout-enabled > .selections-container.list > div { margin-top: 5px; cursor: pointer; padding: 0 5px; height: 25px; } .ui.responsive-layout-enabled > .selections-container.list > div > span { line-height: 25px; } } @media all and (max-width : 700px) { .ui.responsive-layout-enabled > .project-dynamic-data > .data > .objects > .tabs > div > div div.options > div:first-child > * { display: none; } .ui.responsive-layout-enabled > .project-dynamic-data > .data > .object > div menu.buttons { float: none; } .ui.responsive-layout-enabled > .project-dynamic-data > .data.fullscreen-object > .object ul > li.related-media { float: none; width: auto; margin: 0; padding: 0; justify-content: start; } .ui.responsive-layout-enabled > .selections-container.list { bottom: 5px; left: 0px; width: auto; min-width: auto; } .ui.responsive-layout-enabled > .selections-container.list > div > span { width: auto; } .ui.responsive-layout-enabled > .selections-container.list > div > span:first-child { display: none; } .ui.responsive-layout-enabled > .project-dynamic-data > .data .objects .labmap > .controls .timeline > div input.date, .ui.responsive-layout-enabled > .project-dynamic-data > .data .objects .labmap > .controls .timeline > div span.split { display: none; } } .ui li[class*="type-"] { background-color: rgba(255, 255, 255, 0.75); } /* set default colour for elements expecting a type colour */ .ui nav li.project-dynamic-nav ul li.project-filters[data-active="true"] ~ li, .ui nav li.project-dynamic-nav ul li.project-filters[data-object_active="true"] ~ li { display: none; } .ui nav li.project-filters { position: relative; background-color: #a3ce6c; width: 100%; z-index: 2; } .ui nav li.project-filters.search { height: 100px; } .ui nav li.project-filters.search > div { position: absolute; top: 25px; left: 0px; width: 100%; display: flex; justify-content: center; padding: 0 5px; box-sizing: border-box; } .ui nav li.project-filters.search > div .select-types { } .ui nav li.project-filters.search > div .select-types input { display: none; } .ui nav li.project-filters.search > div .select-types > input:not(:checked) + label + ul { display: none; } .ui nav li.project-filters.search > div .select-types > input:checked + label + ul { display: block; } .ui nav li.project-filters.search > div .select-types > label { cursor: pointer; width: 150px; height: 50px; background-color: #0096e4; box-sizing: border-box; margin: 0; vertical-align: top; line-height: 50px;} .ui nav li.project-filters.search > div .select-types > label > div:nth-of-type(1) { display: inline-block; width: calc(100% - 50px); height: 100%; box-sizing: border-box; } .ui nav li.project-filters.search > div .select-types > label > div:nth-of-type(1) > span { display: inline; color: #fff; font-size: 14px; font-weight: bold; letter-spacing: 2px; text-transform: uppercase; } .ui nav li.project-filters.search > div .select-types > label > div:nth-of-type(1) > span:nth-of-type(1) { padding-left: 10px; } .ui nav li.project-filters.search > div .select-types > label > div:nth-of-type(2) { display: inline-block; width: 50px; height: 100%; box-sizing: border-box; } .ui nav li.project-filters.search > div .select-types > label > div:nth-of-type(2) > span { display: none; color: #fff; width: 50px; height: 50px; box-sizing: border-box; text-align: center; } .ui nav li.project-filters.search > div .select-types > label > div:nth-of-type(2) > span > svg { height: 15%; } .ui nav li.project-filters.search > div .select-types > input:not(:checked) + label > div:nth-of-type(2) > span:nth-of-type(1) { display: inline-block; } .ui nav li.project-filters.search > div .select-types > input:checked + label > div:nth-of-type(2) > span:nth-of-type(2) { display: inline-block; } .ui nav li.project-filters.search > div .select-types > ul { position: relative; width: 150px; margin-top: 5px; display: block; overflow-x: hidden; overflow-y: auto; background-color: rgba(238, 238, 238, 0.9); padding: 10px 10px 0 10px; box-sizing: border-box; } .ui nav li.project-filters.search > div .select-types > ul > li { margin-bottom: 10px; box-sizing: border-box; height: 20px; } .ui nav li.project-filters.search > div .select-types > ul > li > label { cursor: pointer; display: inline-block; width: 100%; line-height: 20px; margin: 0; box-sizing: border-box;} .ui nav li.project-filters.search > div .select-types > ul > li > label > span.type-name { display: inline-block; width: calc(100% - 20px); font-weight: normal; } .ui nav li.project-filters.search > div .select-types > ul > li > label > span.icon { display: none; color: #333; width: 20px; height: 20px; text-align: center; box-sizing: border-box; border: 1px solid #333; border-radius: 20px; } .ui nav li.project-filters.search > div .select-types > ul > li > label > span.icon > svg { height: 35%; } .ui nav li.project-filters.search > div .select-types > ul > li > input:checked + label > span.type-name { font-weight: bold; } .ui nav li.project-filters.search > div .select-types > ul > li > input:checked + label > span.icon { display: inline-block; } .ui nav li.project-filters.search > div .select-types > ul > li > input:not(:checked) + label > span.icon { display: none; } .ui nav li.project-filters.search > div .form-element { flex: 1 1 10px; min-width: 10px; max-width: 80vw; margin: 0 5px; } .ui nav li.project-filters.search > div .form-element .input { box-sizing: border-box; display: inline-block; width: 100%; min-width: 200px; vertical-align: top; height: 50px; padding: 0 0 0 50px; background: url("/CMS/css/images/icons/search.svg") no-repeat scroll 20px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui nav li.project-filters.search > div .form-element .input .active-input { display: flex; overflow: hidden; max-width: 70%; box-sizing: border-box; margin: 0px; padding: 0px; height: 50px; float: left; } .ui nav li.project-filters.search > div .form-element .input .active-input > div { display: inline-block; min-width: 30px; box-sizing: border-box; white-space: nowrap; margin: 10px 3px; padding: 0px 5px; height: 30px; font-size: 16px; line-height: 30px; vertical-align: middle;} .ui nav li.project-filters.search > div .form-element .input .active-input > div.string { background-color: #ccc; } .ui nav li.project-filters.search > div .form-element .input .active-input > div > span { display: inline-block; } .ui nav li.project-filters.search > div .form-element .input .active-input > div > span:first-child { width: calc(100% - 24px); overflow: hidden; text-overflow: ellipsis; } .ui nav li.project-filters.search > div .form-element .input .active-input > div > span.icon { cursor: pointer; border-left: 1px solid #444; margin-left: 5px; padding: 0 3px 0 6px; vertical-align: top; } .ui nav li.project-filters.search > div .form-element .input .active-input > div > span.icon svg { height: 11px; } .ui nav li.project-filters.search > div .form-element .input .set-input { overflow: auto; margin-right: 50px; height: 50px; min-width: 30%;} .ui nav li.project-filters.search > div .form-element .input .set-input input { width: 100%; box-shadow: none; display: inline-block; padding: 0px; background-color: transparent; font-size: 16px; height: 50px; border: 0px; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; } .ui nav li.project-filters.search > div button { width: 50px; height: 50px; background-color: #0096e4; border: 0; text-align: center; vertical-align: middle; } .ui nav li.project-filters.search > div button span { color: #fff; } .ui nav li.project-filters.search > div button span svg { height: 50%; } .ui nav li.project-filters .results { position: relative; width: 100%; min-width: 200px; margin-top: 5px; display: block; overflow-x: hidden; overflow-y: auto; background-color: rgba(238, 238, 238, 0.75); } .ui nav li.project-filters .results:empty { display: none; } .ui nav li.project-filters .results .object-thumbnail { position: relative; width: 100%; background-color: rgba(238, 238, 238, 0.5); margin: 3px 0 2px 10px; height: 50px; white-space: nowrap; overflow: hidden;} .ui nav li.project-filters .results .object-thumbnail > div { position: relative; width: 100%; vertical-align: middle; height: 50px; } .ui nav li.project-filters .results .object-thumbnail > div > div { position: relative; box-sizing: border-box; display: inline-block; vertical-align: middle; height: 50px; } .ui nav li.project-filters .results .object-thumbnail > div > div.image { width: 50px; background-color: #ddd; background-repeat: no-repeat; background-position: center 10%; background-size: cover; } .ui nav li.project-filters .results .object-thumbnail > div > div.image span { height: 100%; display: flex; align-items: center; justify-content: center; font-size: 3em; font-family: serif; } .ui nav li.project-filters .results .object-thumbnail > div > div.name { max-width: calc(100% - 80px); margin-left: 5px; line-height: 50px; font-size: 18px; overflow: hidden; text-overflow: ellipsis;} .ui nav li.project-filters .results .object-thumbnail > div > div.object-definitions { display: none; } .ui nav li.project-filters .results ul.keywords { display: flex; } .ui nav li.project-filters .results ul.keywords > li { overflow: hidden; } .ui nav li.project-filters .results ul.keywords > li > ul { display: flex; flex-flow: wrap; white-space: normal; vertical-align: top; padding: 5px; } .ui nav li.project-filters .results ul.keywords > li > ul > li { cursor: pointer; display: inline-block; padding: 4px 8px; margin: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ui nav li.project-filters .results ul.keywords > li > ul > li:not(.separator):not(.info) { max-width: 40%; } .ui nav li.project-filters .results ul.keywords li.info { cursor: default; display: flex; justify-content: space-between; width: 100%; } .ui nav li.project-filters .results ul.keywords li.info span { padding: 4px 0px; } .ui nav li.project-filters .results ul.keywords li.info span.hide-options { cursor: pointer; padding: 4px 8px; background-color: rgba(255,255,255,0.5); } .ui nav li.project-filters .results ul.keywords .separator { display: none; cursor: default; font-variant: small-caps; } .ui nav li.project-filters .results > p { padding: 10px; cursor: pointer; } @media all and (max-width : 1120px) { .ui.responsive-layout-enabled > nav li.project-filters.search > div { position: relative; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > input, .ui.responsive-layout-enabled > nav li.project-filters.form > div > label { display: none; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div { position: relative; width: 100%; box-sizing: border-box; flex-direction: column; background-color: #a3ce6c;} .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element { flex: 0; background-color: rgba(255, 255, 255, 0.1); padding: 5px; height: auto; margin: 0 5px 10px 5px; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element:first-child { margin-top: 10px; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input { display: block; background: none; padding: 0; margin: 0; height: auto; white-space: normal; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > .active-input + label { display: none; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > .set-input { height: 40px; margin: 0; padding: 0 0 0 40px; background: url("/CMS/css/images/icons/search.svg") no-repeat scroll 10px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > .set-input input { width: 100%; box-shadow: none; display: inline-block; padding: 0px; background-color: transparent; font-size: 14px; height: 40px; border: 0; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > .active-input { background: none; padding: 0; margin: 0; display: inline; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > .active-input > div { display: inline-block; min-width: 30px; width: auto; max-width: 100%; overflow: hidden; box-sizing: border-box; white-space: nowrap; margin: 0 5px 5px 0px; background-color: #eee; padding: 0 0 0 5px; height: 30px; font-size: 16px; line-height: 30px; vertical-align: middle;} .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > .active-input > div span:first-child { display: inline-block; width: auto; max-width: calc(100% - 30px); color: #333; font-size: 14px; padding: 0 4px; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > .active-input > div span.icon { cursor: pointer; background-color: #ddd; color: #444; padding: 0 6px; border: 0; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > .active-input > div span.icon svg { height: 11px; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > input { display: none; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > .active-input + label + input + label { display: inline-block; border: 2px solid #0096e4; order: 4; padding: 0; cursor: pointer; white-space: nowrap; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > input + label > span { display: inline-block; font-weight: bold; font-size: 10px; padding: 5px; color: #333; box-sizing: border-box; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); transition: background-color 100ms ease; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > input:not(:checked) + label > span:first-child { background-color: #0096e4; color: #fff; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element .input > input:checked + label > span:last-child { background-color: #0096e4; color: #fff; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input { display: flex; height: 40px; padding: 0px; box-sizing: border-box; white-space: nowrap; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > label { order: 2; font-family: var(--font-mono); display: inline-block; font-size: 14px; height: 40px; border: 0; margin: 0; padding: 10px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.6); } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > input + label { cursor: pointer; height: 40px; width: 50px; margin: 0; border-left: 1px solid rgba(0, 0, 0, 0.1); line-height: 20px; text-align: center; font-weight: bold; font-size: 12px; color: #333; box-sizing: border-box; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); transition: background-color 100ms ease; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > label:nth-of-type(3) { color: rgba(0, 0, 0, 0.6); order: 1; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > input:checked + label { background-color: #0096e4; color: #fff; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element[data-value-type="int"] .input { display: flex; height: 40px; margin: 0 10px 0 0; white-space: nowrap; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element[data-value-type="int"] .input > label { order: 1; display: inline-block; font-size: 14px; height: 40px; border: 0; line-height: 40px; color: rgba(0, 0, 0, 0.6); padding: 0 10px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.6); } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .form-element[data-value-type="int"] .input > input { order: 2; width: 60px; box-shadow: none; display: inline-block; padding: 0px; background-color: transparent; font-size: 14px; height: 40px; border: 0; padding: 10px; background-color: rgba(255, 255, 255, 0.6); } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .results { margin-top: 0px; background-color: rgba(255, 255, 255, 0.6); } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div .results > p { display: none; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div > .form-element > .date { display: flex; white-space: normal; flex-wrap: wrap; align-content: flex-start; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div > .form-element > .date > input { display: inline-block; box-shadow: none; display: inline-block; font-size: 14px; height: 40px; width: calc(100% - 75px); margin: 0 0 5px 0; padding: 0 0 0 40px; border: 0; background: url("/CMS/css/images/icons/date.svg") no-repeat scroll 10px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) { order: 2; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) { order: 4; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) + label { order: 1; } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) + label, .ui.responsive-layout-enabled > nav li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) + label { margin-left: 0px; width: 75px; height: 40px; font-weight: bold; letter-spacing: 2px; font-size: 12px; padding: 0 0 0 10px; line-height: 40px; box-sizing: border-box; color: #333; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); } .ui.responsive-layout-enabled > nav li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) + label { order: 3; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form { height: 100px; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div { position: absolute; width: 100%; box-sizing: border-box; display: flex; flex-direction: row; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div { width: 100%; box-sizing: border-box; display: flex; flex-direction: row; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element { flex: 1; padding: 10px; height: auto; margin: 0 10px 0 0; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element:first-child { margin-top: 0px; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input { display: flex; background: none; padding: 0; margin: 0; height: auto; white-space: normal; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > .active-input + label { display: none; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input.button { justify-content: right; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input.button > button { cursor: pointer; height: 40px; margin: 0 10px 0 0; padding: 0 40px; background-color: rgba(255, 255, 255, 0.6); white-space: nowrap; border: 0; font-size: 14px; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > .set-input { order: 2; height: 40px; margin: 0 10px 0 0; padding: 0 0 0 40px; background: url("/CMS/css/images/icons/search.svg") no-repeat scroll 10px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > .set-input input { width: 100%; box-shadow: none; display: inline-block; padding: 0px; background-color: transparent; font-size: 14px; height: 40px; border: 0; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > .active-input { order: 3; background: none; padding: 0; margin: 0; display: inline-block; height: auto; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > .active-input > div { display: inline-block; min-width: 30px; width: auto; box-sizing: border-box; white-space: nowrap; margin: 0 5px 5px 0px; background-color: #eee; padding: 0 0 0 5px; height: 30px; font-size: 16px; line-height: 30px; vertical-align: middle;} .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > .active-input > div span:first-child { width: auto; color: #333; font-size: 14px; padding: 0 4px; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > .active-input > div span.icon { cursor: pointer; background-color: #ddd; color: #444; padding: 0 6px; border: 0; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > .active-input > div span.icon svg { height: 11px; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > input { display: none; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > .active-input + label + input + label { display: inline-block; border: 2px solid #0096e4; order: 4; padding: 0; height: 23px; cursor: pointer; white-space: nowrap; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > input + label > span { display: inline-block; font-weight: bold; font-size: 10px; padding: 5px; color: #333; box-sizing: border-box; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); transition: background-color 100ms ease; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > input:not(:checked) + label > span:first-child { background-color: #0096e4; color: #fff; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element .input > input:checked + label > span:last-child { background-color: #0096e4; color: #fff; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input { display: flex; height: 40px; padding: 0px; box-sizing: border-box; white-space: nowrap; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > label { order: 2; font-family: var(--font-mono); display: inline-block; font-size: 14px; height: 40px; border: 0; margin: 0; padding: 10px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.6); } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > input + label { cursor: pointer; height: 40px; width: 50px; margin: 0; border-left: 1px solid rgba(0, 0, 0, 0.1); line-height: 20px; text-align: center; font-weight: bold; font-size: 12px; color: #333; box-sizing: border-box; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); transition: background-color 100ms ease; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > label:nth-of-type(3) { color: rgba(0, 0, 0, 0.6); order: 1; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > input:checked + label { background-color: #0096e4; color: #fff; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element[data-value-type="int"] .input { height: 40px; margin: 0 10px 0 0; white-space: nowrap; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element[data-value-type="int"] .input > label { order: 1; display: inline-block; font-size: 14px; height: 40px; border: 0; line-height: 40px; color: rgba(0, 0, 0, 0.6); padding: 0 10px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.6); } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .form-element[data-value-type="int"] .input > input { order: 2; width: 60px; box-shadow: none; display: inline-block; padding: 0px; background-color: transparent; font-size: 14px; height: 40px; border: 0; padding: 10px; background-color: rgba(255, 255, 255, 0.6); } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .results { margin-top: 0px; background-color: rgba(255, 255, 255, 0.6); } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div .results > p { display: none; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div > .form-element > .date { display: flex; white-space: normal; flex-wrap: nowrap; align-content: flex-start; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div > .form-element > .date > input { display: inline-block; box-shadow: none; font-size: 14px; height: 40px; max-width: 200px; margin: 0 0 5px 0; padding: 0 0 0 40px; border: 0; background: url("/CMS/css/images/icons/date.svg") no-repeat scroll 10px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) { order: 2; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) { order: 4; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) + label { order: 1; } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) + label, .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) + label { margin-left: 5px; width: 75px; height: 40px; font-weight: bold; letter-spacing: 2px; font-size: 12px; padding: 0 0 0 10px; line-height: 40px; box-sizing: border-box; color: #333; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); } .ui:not(.responsive-layout-enabled) nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) + label { order: 3; } } @media all and (min-width : 1120px) { .ui > nav.left { display: block; position: absolute; top: 60px; width: 20vw; overflow: visible; height: calc(100% - 60px); z-index: 2; } .ui > nav.left + .project-dynamic-data { padding-left: 20vw; box-sizing: border-box; } .ui > nav.left + .project-dynamic-data > .data > .objects > .tabs.list-view { max-width: 78vw; } .ui > nav.left > ul li.projects-nav ul { padding-left: 5px; height: auto; white-space: normal; } .ui > nav.left > ul li.projects-nav ul li { height: auto; } .ui nav > nav > ul > li.project-dynamic-nav ul li.project-filters[data-active="true"] ~ li { display: none; } .ui nav li.project-filters.form > div { display: flex; justify-content: flex-start; height: auto; min-height: 46px; font-family: var(--font-mono); } .ui nav li.project-filters.form > div > input { display: none; } .ui nav li.project-filters.form > div > label:first-child { cursor: pointer; margin: 5px 0 0 5px; height: 36px; line-height: 36px; padding: 0 15px; font-weight: bold; letter-spacing: 2px; color: #333; text-transform: uppercase; background-color: #fff; } .ui nav li.project-filters.form > div > input + label { margin: 5px 0 0 0; cursor: pointer; background-color: #fff; height: 36px; } .ui nav li.project-filters.form > div > input + label > span { display: none; background-color: #0096e4; color: #fff; width: 36px; height: 36px; box-sizing: border-box; text-align: center; padding-top: 10px; } .ui nav li.project-filters.form > div > input + label > span > svg { width: 50%; } .ui nav li.project-filters.form > div > input:not(:checked) + label > span:first-child { display: inline-block; } .ui nav li.project-filters.form > div > input:checked + label > span:last-child { display: inline-block; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div { display: flex; margin: 0 0 0 5px; padding: 0; width: auto; position: relative; top: 0; white-space: normal; flex-wrap: wrap; align-content: flex-start; min-height: 36px; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element { flex: 0 1 auto; margin: 5px 0 0 0; min-width: 0px; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input { display: flex; background: none; min-width: 0px; padding: 0px; width: auto; height: auto; white-space: normal; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > button { display: none; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > .active-input { order: 2; display: inline-block; height: 36px; max-width: 100%; overflow: visible; white-space: normal; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > .active-input:not(:empty) { background-color: rgba(255, 255, 255, 0.6); padding: 5px; margin-right: 5px; box-sizing: border-box; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > .active-input > div { width: auto; display: inline-block; margin: 3px 3px 0 0; padding: 0; height: auto; line-height: 1; background-color: #fff; vertical-align: middle; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > .active-input > div span:first-child { width: auto; height: 100%; vertical-align: middle; font-size: 12px; line-height: 18px; background-color: #fff; padding: 0 4px; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > .active-input > div span.icon { display: none; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > .set-input { display: none; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > input { display: none; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > label { order: 1; display: inline-block; height: 36px; line-height: 36px; padding: 0 15px; font-weight: bold; letter-spacing: 2px; text-transform: uppercase; background-color: #0096e4; color: #fff;} .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > input + label { display: none; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element .input > .active-input:empty + label { display: none; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element[data-value-type="int"], .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element[data-value-type="boolean"] { margin-right: 5px; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element[data-value-type="boolean"] .input > label { display: none; margin: 0px; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element[data-value-type="boolean"] .input > input:checked + label { pointer-events: none; order: 2; display: inline-block; background-color: rgba(255, 255, 255, 0.6); color: #333; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element[data-value-type="boolean"] .input > input:checked + label + input + label + label, .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element[data-value-type="boolean"] .input > input:checked + label + label { display: inline-block; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element[data-value-type="int"] .input > label { display: none; pointer-events: none; order: 1; margin: 0px; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .form-element[data-value-type="int"] .input > input { display: none; pointer-events: none; order: 2; height: 36px; width: 60px; padding: 10px; background-color: rgba(255, 255, 255, 0.6); color: #333; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .results { display: none; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date { display: inline-block; display: flex; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date > input { background-color: rgba(255, 255, 255, 0.6); width: 90px; min-width: 10px; border: 0; height: 36px; padding: 0 10px; margin: 0; pointer-events: none; text-align: center; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date > input + label { display: inline-block; height: 36px; line-height: 36px; padding: 0 15px; font-weight: bold; letter-spacing: 2px; text-transform: uppercase; background-color: #0096e4; color: #fff; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date > input:first-child { order: 2; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date > input:nth-of-type(2) { order: 4; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date > input:first-child + label { order: 1; margin-left: 0px; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date > input:nth-of-type(2) + label { order: 3; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date > input:placeholder-shown, .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date > input:placeholder-shown + label { display: none; } .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date > input:nth-of-type(3), .ui nav li.project-filters.form > div > input:not(:checked) + label + div .date > input:nth-of-type(3) + label { display: none; } .ui nav li.project-filters.form > div > input:checked + label + div { position: absolute; width: 30%; min-width: 800px; left: 5px; top: 41px; box-sizing: border-box; flex-direction: column; background-color: #fff; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element { flex: 0; background-color: #a3ce6c; padding: 10px; height: auto; margin: 0 10px 10px 10px; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element:first-child { margin-top: 10px; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input { display: flex; background: none; padding: 0; margin: 0; height: auto; white-space: normal; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > .active-input + label { display: none; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input.button { justify-content: right; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input.button > button { white-space: nowrap; border: 0; font-size: 12px; cursor: pointer; padding: 4px 8px; font-family: var(--font-mono); background-color: rgba(255,255,255,0.9); } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > .set-input { order: 2; height: 40px; margin: 0 10px 0 0; padding: 0 0 0 40px; background: url("/CMS/css/images/icons/search.svg") no-repeat scroll 10px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > .set-input input { width: 100%; box-shadow: none; display: inline-block; padding: 0px; background-color: transparent; font-size: 14px; height: 40px; border: 0; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > .set-input input::placeholder { } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > .active-input { order: 3; background: none; padding: 0; margin: 0; display: inline-block; height: auto; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > .active-input > div { display: inline-block; min-width: 30px; width: auto; box-sizing: border-box; white-space: nowrap; margin: 0 5px 5px 0px; background-color: #eee; padding: 0 0 0 5px; height: 30px; font-size: 16px; line-height: 30px; vertical-align: middle;} .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > .active-input > div span:first-child { width: auto; max-width: 150px; color: #333; font-size: 12px; padding: 0 4px; display: inline-block; overflow-x: hidden; text-overflow: ellipsis;} .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > .active-input > div span.icon { cursor: pointer; background-color: #ddd; color: #666; padding: 0 6px; border: 0; vertical-align: top; width: 22px; box-sizing: border-box; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > .active-input > div span.icon svg { height: 11px; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > input { display: none; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > .active-input + label + input + label { display: inline-block; border: 2px solid #0096e4; order: 4; padding: 0; height: 23px; cursor: pointer; white-space: nowrap; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > input + label > span { display: inline-block; font-family: var(--font-mono); font-weight: bold; font-size: 10px; padding: 5px; color: #333; box-sizing: border-box; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); transition: background-color 100ms ease; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > input:not(:checked) + label > span:first-child, .ui nav li.project-filters.form > div > input:checked + label + div .form-element .input > input:checked + label > span:last-child { background-color: #0096e4; color: #fff; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="int"] .input, .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="boolean"] .input { display: flex; height: 40px; padding: 0px; box-sizing: border-box; white-space: nowrap; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="int"] .input > label, .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="boolean"] .input > label { order: 2; font-family: var(--font-mono); display: inline-block; font-size: 14px; height: 40px; border: 0; margin: 0; padding: 10px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.6); } .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="boolean"] .input > input + label { cursor: pointer; height: 40px; width: 50px; margin: 0; border-left: 1px solid rgba(0, 0, 0, 0.1); line-height: 20px; text-align: center; font-weight: bold; font-size: 12px; color: #333; box-sizing: border-box; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); transition: background-color 100ms ease; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="boolean"] .input > label:nth-of-type(2) { } .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="boolean"] .input > label:nth-of-type(3) { color: rgba(0, 0, 0, 0.6); order: 1; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="boolean"] .input > input:checked + label { background-color: #0096e4; color: #fff; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="int"] .input > label { color: rgba(0, 0, 0, 0.6); order: 1; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="int"] .input > input { display: inline-block; box-shadow: none; border: 0; border-radius: 0; order: 3; height: 40px; width: 60px; background-color: rgba(255, 255, 255, 0.6); margin: 0; padding: 10px; box-sizing: border-box; font-size: 14px; } .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="int"] .input > input:hover, .ui nav li.project-filters.form > div > input:checked + label + div .form-element[data-value-type="int"] .input > input:focus { box-shadow: none; border: 0; border-radius: 0; } .ui nav li.project-filters.form > div > input:checked + label + div .results { margin-top: 0px; background-color: rgba(255, 255, 255, 0.6); } .ui nav li.project-filters.form > div > input:checked + label + div .results > p { display: none; } .ui nav li.project-filters.form > div > input:checked + label + div .date { display: flex; white-space: normal; flex-wrap: wrap; align-content: flex-start; } .ui nav li.project-filters.form > div > input:checked + label + div .date > input { display: inline-block; box-shadow: none; display: inline-block; font-size: 14px; height: 40px; width: auto; margin: 0; padding: 0 0 0 40px; border: 0; background: url("/CMS/css/images/icons/date.svg") no-repeat scroll 10px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui nav li.project-filters.form > div > input:checked + label + div .date > input:nth-of-type(1) { order: 2; } .ui nav li.project-filters.form > div > input:checked + label + div .date > input:nth-of-type(2) { order: 4; } .ui nav li.project-filters.form > div > input:checked + label + div .date > input:nth-of-type(1) + label { order: 1; margin-left: 0px; } .ui nav li.project-filters.form > div > input:checked + label + div .date > input:nth-of-type(1) + label, .ui nav li.project-filters.form > div > input:checked + label + div .date > input:nth-of-type(2) + label { height: 40px; font-weight: bold; letter-spacing: 2px; font-size: 12px; padding: 0 0 0 10px; line-height: 40px; box-sizing: border-box; color: #333; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); } .ui nav li.project-filters.form > div > input:checked + label + div .date > input:nth-of-type(2) + label { order: 3; } .ui nav li.project-filters.form > div > input:checked + label + div .date > input:nth-of-type(3) { display: none; } .ui nav li.project-filters.form > div > input:checked + label + div .date > input:nth-of-type(3) + label { order: 5; position: relative; height: 40px; width: 40px; background-color: #0096e4; cursor: pointer; text-align: center; } .ui nav li.project-filters.form > div > input:checked + label + div .date > input:nth-of-type(3) + label > span.icon { color: #fff; height: 20px; margin-top: 10px;} .ui nav li.project-filters.form > div > input:checked + label + div .date > input:nth-of-type(3) + label > span.icon > svg { height: 100%; } .ui nav.top li.project-filters.form { height: 100px; } .ui nav.top li.project-filters.form > div { position: absolute; width: 100%; box-sizing: border-box; display: flex; flex-direction: row; } .ui nav.top li.project-filters.form > div > div { width: 100%; box-sizing: border-box; display: flex; flex-direction: row; } .ui nav.top li.project-filters.form > div > div .form-element { flex: 1; padding: 10px; height: auto; margin: 0 10px 0 0; } .ui nav.top li.project-filters.form > div > div .form-element:first-child { margin-top: 0px; } .ui nav.top li.project-filters.form > div > div .form-element .input { display: flex; background: none; padding: 0; margin: 0; height: auto; white-space: normal; } .ui nav.top li.project-filters.form > div > div .form-element .input > .active-input + label { display: none; } .ui nav.top li.project-filters.form > div > div .form-element .input.button { justify-content: right; } .ui nav.top li.project-filters.form > div > div .form-element .input.button > button { white-space: nowrap; border: 0; font-size: 12px; cursor: pointer; padding: 4px 8px; font-family: var(--font-mono); background-color: rgba(255,255,255,0.9); } .ui nav.top li.project-filters.form > div > div .form-element .input > .set-input { order: 2; height: 40px; margin: 0 10px 0 0; padding: 0 0 0 40px; background: url("/CMS/css/images/icons/search.svg") no-repeat scroll 10px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui nav.top li.project-filters.form > div > div .form-element .input > .set-input input { width: 100%; box-shadow: none; display: inline-block; padding: 0px; background-color: transparent; font-size: 14px; height: 40px; border: 0; } .ui nav.top li.project-filters.form > div > div .form-element .input > .active-input { order: 3; background: none; padding: 0; margin: 0; display: inline-block; height: auto; } .ui nav.top li.project-filters.form > div > div .form-element .input > .active-input > div { display: inline-block; min-width: 30px; width: auto; box-sizing: border-box; white-space: nowrap; margin: 0 5px 5px 0px; background-color: #eee; padding: 0 0 0 5px; height: 30px; font-size: 16px; line-height: 30px; vertical-align: middle;} .ui nav.top li.project-filters.form > div > div .form-element .input > .active-input > div span:first-child { width: auto; color: #333; font-size: 14px; padding: 0 4px; } .ui nav.top li.project-filters.form > div > div .form-element .input > .active-input > div span.icon { cursor: pointer; background-color: #ddd; color: #444; padding: 0 6px; border: 0; } .ui nav.top li.project-filters.form > div > div .form-element .input > .active-input > div span.icon svg { height: 11px; } .ui nav.top li.project-filters.form > div > div .form-element .input > input { display: none; } .ui nav.top li.project-filters.form > div > div .form-element .input > .active-input + label + input + label { display: inline-block; border: 2px solid #0096e4; order: 4; padding: 0; height: 23px; cursor: pointer; white-space: nowrap; } .ui nav.top li.project-filters.form > div > div .form-element .input > input + label > span { display: inline-block; font-weight: bold; font-size: 10px; padding: 5px; color: #333; box-sizing: border-box; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); transition: background-color 100ms ease; } .ui nav.top li.project-filters.form > div > div .form-element .input > input:not(:checked) + label > span:first-child { background-color: #0096e4; color: #fff; } .ui nav.top li.project-filters.form > div > div .form-element .input > input:checked + label > span:last-child { background-color: #0096e4; color: #fff; } .ui nav.top li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input { display: flex; height: 40px; padding: 0px; box-sizing: border-box; white-space: nowrap; } .ui nav.top li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > label { order: 2; font-family: var(--font-mono); display: inline-block; font-size: 14px; height: 40px; border: 0; margin: 0; padding: 10px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.6); } .ui nav.top li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > input + label { cursor: pointer; height: 40px; width: 50px; margin: 0; border-left: 1px solid rgba(0, 0, 0, 0.1); line-height: 20px; text-align: center; font-weight: bold; font-size: 12px; color: #333; box-sizing: border-box; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); transition: background-color 100ms ease; } .ui nav.top li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > label:nth-of-type(3) { color: rgba(0, 0, 0, 0.6); order: 1; } .ui nav.top li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > input:checked + label { background-color: #0096e4; color: #fff; } .ui nav.top li.project-filters.form > div > div .form-element[data-value-type="int"] .input { height: 40px; margin: 0 10px 0 0; white-space: nowrap; } .ui nav.top li.project-filters.form > div > div .form-element[data-value-type="int"] .input > label { order: 1; display: inline-block; font-size: 14px; height: 40px; border: 0; line-height: 40px; color: rgba(0, 0, 0, 0.6); padding: 0 10px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.6); } .ui nav.top li.project-filters.form > div > div .form-element[data-value-type="int"] .input > input { order: 2; width: 60px; box-shadow: none; display: inline-block; padding: 0px; background-color: transparent; font-size: 14px; height: 40px; border: 0; padding: 10px; background-color: rgba(255, 255, 255, 0.6); } .ui nav.top li.project-filters.form > div > div .results { margin-top: 0px; background-color: rgba(255, 255, 255, 0.6); } .ui nav.top li.project-filters.form > div > div .results > p { display: none; } .ui nav.top li.project-filters.form > div > div > .form-element > .date { display: flex; white-space: normal; flex-wrap: nowrap; align-content: flex-start; } .ui nav.top li.project-filters.form > div > div > .form-element > .date > input { display: inline-block; box-shadow: none; font-size: 14px; height: 40px; max-width: 200px; margin: 0 0 5px 0; padding: 0 0 0 40px; border: 0; background: url("/CMS/css/images/icons/date.svg") no-repeat scroll 10px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) { order: 2; } .ui nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) { order: 4; } .ui nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) + label { order: 1; } .ui nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) + label, .ui nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) + label { margin-left: 5px; width: 75px; height: 40px; font-weight: bold; letter-spacing: 2px; font-size: 12px; padding: 0 0 0 10px; line-height: 40px; box-sizing: border-box; color: #333; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); } .ui nav.top li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) + label { order: 3; } .ui nav.left li.project-filters.form > div > div { position: relative; width: 100%; box-sizing: border-box; flex-direction: column; background-color: #a3ce6c;} .ui nav.left li.project-filters.form > div > div .form-element { flex: 0; background-color: rgba(255, 255, 255, 0.1); padding: 5px; height: auto; margin: 0 5px 10px 5px; } .ui nav.left li.project-filters.form > div > div .form-element:first-child { margin-top: 10px; } .ui nav.left li.project-filters.form > div > div .form-element .input { display: block; background: none; padding: 0; margin: 0; height: auto; white-space: normal; } .ui nav.left li.project-filters.form > div > div .form-element .input > .active-input + label { display: none; } .ui nav.left li.project-filters.form > div > div .form-element .input.button { text-align: right; } .ui nav.left li.project-filters.form > div > div .form-element .input.button > button { white-space: nowrap; border: 0; font-size: 12px; cursor: pointer; padding: 4px 8px; font-family: var(--font-mono); background-color: rgba(255,255,255,0.9); } .ui nav.left li.project-filters.form > div > div .form-element .input > .set-input { height: 40px; margin: 0; padding: 0 0 0 40px; background: url("/CMS/css/images/icons/search.svg") no-repeat scroll 10px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui nav.left li.project-filters.form > div > div .form-element .input > .set-input input { width: 100%; box-shadow: none; display: inline-block; padding: 0px; background-color: transparent; font-size: 14px; height: 40px; border: 0; } .ui nav.left li.project-filters.form > div > div .form-element .input > .active-input { background: none; padding: 0; margin: 0; display: inline; } .ui nav.left li.project-filters.form > div > div .form-element .input > .active-input > div { display: inline-block; min-width: 30px; width: auto; max-width: 100%; overflow: hidden; box-sizing: border-box; white-space: nowrap; margin: 0 5px 5px 0px; background-color: #eee; padding: 0 0 0 5px; height: 30px; font-size: 16px; line-height: 30px; vertical-align: middle;} .ui nav.left li.project-filters.form > div > div .form-element .input > .active-input > div span:first-child { display: inline-block; width: auto; max-width: calc(100% - 30px); color: #333; font-size: 14px; padding: 0 4px; } .ui nav.left li.project-filters.form > div > div .form-element .input > .active-input > div span.icon { cursor: pointer; background-color: #ddd; color: #444; padding: 0 6px; border: 0; } .ui nav.left li.project-filters.form > div > div .form-element .input > .active-input > div span.icon svg { height: 11px; } .ui nav.left li.project-filters.form > div > div .form-element .input > input { display: none; } .ui nav.left li.project-filters.form > div > div .form-element .input > .active-input + label + input + label { display: inline-block; border: 2px solid #0096e4; order: 4; padding: 0; cursor: pointer; white-space: nowrap; } .ui nav.left li.project-filters.form > div > div .form-element .input > input + label > span { display: inline-block; font-weight: bold; font-size: 10px; padding: 5px; color: #333; box-sizing: border-box; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); transition: background-color 100ms ease; } .ui nav.left li.project-filters.form > div > div .form-element .input > input:not(:checked) + label > span:first-child { background-color: #0096e4; color: #fff; } .ui nav.left li.project-filters.form > div > div .form-element .input > input:checked + label > span:last-child { background-color: #0096e4; color: #fff; } .ui nav.left li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input { display: flex; height: 40px; padding: 0px; box-sizing: border-box; white-space: nowrap; } .ui nav.left li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > label { order: 2; font-family: var(--font-mono); display: inline-block; font-size: 14px; height: 40px; border: 0; margin: 0; padding: 10px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.6); } .ui nav.left li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > input + label { cursor: pointer; height: 40px; width: 50px; margin: 0; border-left: 1px solid rgba(0, 0, 0, 0.1); line-height: 20px; text-align: center; font-weight: bold; font-size: 12px; color: #333; box-sizing: border-box; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); transition: background-color 100ms ease; } .ui nav.left li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > label:nth-of-type(3) { color: rgba(0, 0, 0, 0.6); order: 1; } .ui nav.left li.project-filters.form > div > div .form-element[data-value-type="boolean"] .input > input:checked + label { background-color: #0096e4; color: #fff; } .ui nav.left li.project-filters.form > div > div .form-element[data-value-type="int"] .input { display: flex; height: 40px; margin: 0 10px 0 0; white-space: nowrap; } .ui nav.left li.project-filters.form > div > div .form-element[data-value-type="int"] .input > label { order: 1; display: inline-block; font-size: 14px; height: 40px; border: 0; line-height: 40px; color: rgba(0, 0, 0, 0.6); padding: 0 10px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.6); } .ui nav.left li.project-filters.form > div > div .form-element[data-value-type="int"] .input > input { order: 2; width: 60px; box-shadow: none; display: inline-block; padding: 0px; background-color: transparent; font-size: 14px; height: 40px; border: 0; padding: 10px; background-color: rgba(255, 255, 255, 0.6); } .ui nav.left li.project-filters.form > div > div .results { margin-top: 0px; background-color: rgba(255, 255, 255, 0.6); width: 40vw; max-width: 750px; } .ui nav.left li.project-filters.form > div > div .results > p { display: none; } .ui nav.left li.project-filters.form > div > div > .form-element > .date { display: flex; white-space: normal; flex-wrap: wrap; align-content: flex-start; } .ui nav.left li.project-filters.form > div > div > .form-element > .date > input { display: inline-block; box-shadow: none; display: inline-block; font-size: 14px; height: 40px; width: calc(100% - 75px); margin: 0 0 5px 0; padding: 0 0 0 40px; border: 0; background: url("/CMS/css/images/icons/date.svg") no-repeat scroll 10px center / 20px 20px rgba(255, 255, 255, 0.6); white-space: nowrap; } .ui nav.left li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) { order: 2; } .ui nav.left li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) { order: 4; } .ui nav.left li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) + label { order: 1; } .ui nav.left li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(1) + label, .ui nav.left li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) + label { margin-left: 0px; width: 75px; height: 40px; font-weight: bold; letter-spacing: 2px; font-size: 12px; padding: 0 0 0 10px; line-height: 40px; box-sizing: border-box; color: #333; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.6); } .ui nav.left li.project-filters.form > div > div > .form-element > .date > input:nth-of-type(2) + label { order: 3; } } .presentation { font-family: pixel; font-variant: normal; font-size: 8px; font-smooth: never; -webkit-font-smoothing: none;} .presentation .custom-html .legend { padding: 20px; position: fixed; top: 20px; right: 20px; z-index: 15; vertical-align: top; background-color: rgba(0, 0, 0, 0.6); color: #fff; width: 350px; } .presentation .custom-html .legend > ul > li { margin-top: 10px; padding-left: 10px; vertical-align: top; } .presentation .custom-html .legend > ul > li > span { display: inline-block; padding-left: 10px; width: 320px; } .presentation .custom-html .legend > ul > li > div { display: inline-block; width: 8px; height: 8px; border-radius: 8px; vertical-align: top; } .presentation .custom-html .legend > ul > li > div.creation { background-color: #3e47ef; } .presentation .custom-html .legend > ul > li > div.collection { background-color: #f23d3d; } .presentation .presentation-header { position: fixed; top: 20px; left: 20px; z-index: 15; vertical-align: top; } .presentation .presentation-header div.text { display: inline-block; width: 350px; min-height: 200px; vertical-align: top; background-color: rgba(0, 0, 0, 0.6); padding: 20px; box-sizing: border-box; color: #fff; } .presentation .presentation-header div.text > * { overflow: hidden; text-overflow: ellipsis; } .presentation .presentation-header div.text h1 { font-size: 16px; } .presentation .presentation-header div.text h2 { font-size: 8px; font-weight: bold; } .presentation .presentation-header div.text p { line-height: 20px; } .presentation .presentation-header div.image { display: inline-block; margin-left: 20px; width: 140px; height: 200px; background-size: cover; background-position: center center; } .presentation .visualisation-container { position: fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: -5; } .presentation .language-switch { position: fixed; bottom: 0; right: 80px; z-index: 15; height: 148px; } .presentation .language-switch > menu > ul > li > button > span.icon-play { display: none; } .presentation .language-switch > menu > ul > li > button > span.code { font-family: arial; font-size: 15px; text-transform: uppercase; } .presentation menu > ul > li { display: inline-block; margin-right: 30px; width: 100px; height: 130px; text-align: center; } .presentation menu > ul > li > button[type="button"] { border: 2px solid #bc0031; background-color: #bc0031; display: block; width: 50px; height: 50px; margin: 25px 25px 5px 25px; background-size: cover; } .presentation menu > ul > li > span { display: block; width: 100%; height: 45px; color: #fff; overflow: hidden; text-overflow: ellipsis; padding: 5px; box-sizing: border-box; vertical-align: top; } .presentation .navigation-container { position: fixed; bottom: 0; left: 90px; z-index: 15; height: 310px; } .presentation .navigation-container > div > label { margin: 0 0 10px 35px; height: 20px; display: block; color: #fff; font-size: 16px; line-height: 20px; } .presentation .navigation-container > div > menu { margin: 0 0 10px 10px; height: 130px; display: block; } .presentation .visualisation-container .labmap > .map > .draw > .background { background-color: transparent; } .presentation .visualisation-container .labmap .legends, .presentation .visualisation-container .labmap > .map > .controls, .presentation .visualisation-container .labmap .buttons { display: none; } .presentation .visualisation-container .labmap .timeline { bottom: calc(100% - 120px); top: 50px; left: 0; right: 0;} .presentation .visualisation-container .labmap .timeline > div { background-color: transparent; width: calc(100% - 200px); max-width: 7000px; } .presentation .visualisation-container .labmap .timeline > div > .slider > div { height: 33px; } .presentation .visualisation-container .labmap .timeline > div > .slider > div > button { display: none; } .presentation .visualisation-container .labmap .timeline > div > .slider > div > .bar { background-color: transparent; border-top: 1px solid #aaa; border-bottom: 1px solid #aaa; } .presentation .visualisation-container .labmap .timeline > div > .slider > div > .bar > div { background-color: #eee; } .presentation .visualisation-container .labmap .timeline > div > .slider > div > .bar > div > .handler { background-color: transparent; } .presentation .visualisation-container .labmap .timeline > div > .slider > div > .bar > div > .handler > time { top: -32px; font-size: 16px; background-color: #eee; color: #000; } .presentation .visualisation-container .labmap .timeline > div > .slider > div > .bar > div > .handler > time:after { border-top-color: #eee; } .presentation .visualisation-container .labmap .timeline { display: none; } .presentation .visualisation-container .labmap .slider > div + div { display: none; } .presentation .con-dial .dial { position: fixed; bottom: 67px; right: 553px; width: 72px; height: 72px; z-index: 5; } .presentation .con-dial .dial .master { position: absolute; top: 0; left: 0; bottom: 0; right: 0; border-radius: 100%; background-color: #eee; } .presentation .con-dial .dial .slice { position: absolute; top: 0; left: 0; bottom: 0; right: 0; border-radius: 100%; clip: rect(0px, 72px, 72px, 36px); } .presentation .con-dial .dial .inner { position: absolute; top: 0; left: 0; bottom: 0; right: 0; border-radius: 100%; clip: rect(0px, 36px, 72px, 0px); -webkit-transform: rotate(40deg); -moz-transform: rotate(40deg); transform: rotate(40deg); background-color: #bc0031; } .presentation .con-dial .dial .cover { position: absolute; top: 18px; left: 18px; bottom: 18px; right: 18px; border-radius: 100%; background-color: #000;} .presentation .con-slider .slider { position: fixed; bottom: 88px; right: 742px; width: 96px; height: 18px; z-index: 5; background-color: #eee;} .presentation .con-slider .slider .inner { position: absolute; top: 0; left: 0; bottom: 0px; width: 50px; background-color: #bc0031; } .presentation .con-slider .slider .unit { position: absolute; top: 0; left: 3px; bottom: 0px; width: 143px; color: #646464; font-variant: small-caps; } .presentation .con-slider .slider, .presentation .con-dial .dial { display: none; } /* HOME STYLE */ :root { --nodegoat-green: #a3ce6c; --nodegoat-green-rgb: 163,206,108; --nodegoat-blue: #009cff; --nodegoat-dark: #131617; --button: var(--nodegoat-dark); --button-hover: var(--nodegoat-dark); --button-focus: var(--nodegoat-dark); } @font-face { font-family: 'pixel'; src: url('/css/fonts/Unibody8Pro-Regular.eot'); src: url('/css/fonts/Unibody8Pro-Regular.eot?#iefix') format('embedded-opentype'), url('/css/fonts/Unibody8Pro-Regular.woff') format('woff'), /*url('/css/type/filename.otf') format('opentype'),*/ url('/css/fonts/Unibody8Pro-Regular.ttf') format('truetype'); font-style: normal; font-weight: normal; } body { background-color: #a3ce6c; } h1 { margin: 10px 0px; } hr { border-bottom-width: 1px; } /* TEMPLATE */ .site { width: auto !important; min-width: 850px; max-width: 1250px; padding: 0px 20px; } .page-login .site .mod a.nodegoat-logo { display: block; width: 187px; height: 200px; margin: 80px auto 40px auto; background-image: url('/css/images/nodegoat.svg'); background-size: 187px 200px; background-repeat: no-repeat; } .page-login .back { background-color: transparent; } .page-login .back .mod.login section.info { width: 400px; margin: 0 auto; margin-bottom: 40px; padding: 20px; box-sizing: border-box; } .page-login .back .mod.login form { width: 400px; margin: 0 auto; background-color: rgba(255, 255, 255, 0.6); padding: 50px; box-sizing: border-box; } .page-login .back .mod.login + .mod nav { width: 400px; margin: 0 auto; } .dir-login .site { max-width: 1500px; } /* MOD ADAPTATION */ .header { position: relative; height: 150px; } .header > a { position: absolute; bottom: 0px; left: 0px; width: 126px; height: 135px; margin-top: 10px !important; background-image: url('/css/images/nodegoat.svg'); background-size: contain; background-repeat: no-repeat; vertical-align: bottom; z-index: 1; } .header > a + span { position:absolute; height: 17px; width: 118px; bottom: 0px; background-color: rgba(255, 255, 255, 0.6); z-index: 0; } .header > a + span + span { display: none; } .navigation { position: absolute; top: 55px; left: 200px; } .navigation > nav ul li { display: inline-block; padding: 10px 20px; font-weight: 800; border-radius: 2px; background-color: rgba(255, 255, 255, 0.6);} .navigation > nav ul li a:hover, .navigation ul li.active a:hover { } .navigation > nav > ul { } .navigation > nav > ul > li { font-size: 16px; } .navigation > nav > ul > li:hover { background-color: #ffffff; } .navigation > nav > ul > li + li { margin-left: 45px; } .navigation > nav > ul > li a { display: inline-block; text-align: center; color: var(--nodegoat-dark); text-decoration:none; } .navigation > nav > ul > li.active { background-color: #009cff; } .navigation > nav > ul > li.active a { color: #fff; } .navigation > nav > ul > li a[href] { background-repeat: no-repeat; } .navigation > nav > ul > li a[href="/login/data"], .navigation > nav > ul > li a[href="/login/model/"], .navigation > nav > ul > li a[href="/login/management/"] { background-size: 18px 18px; background-position: left center; padding-left: 28px; } .navigation > nav > ul > li a[href="/login/data"] { background-image: url('data:image/svg+xml;utf8,'); } .navigation > nav > ul > li.active a[href="/login/data"] { background-image: url('data:image/svg+xml;utf8,'); } .navigation > nav > ul > li a[href="/login/management/"] { background-image: url('data:image/svg+xml;utf8,'); } .navigation > nav > ul > li.active a[href="/login/management/"] { background-image: url('data:image/svg+xml;utf8,'); } .navigation > nav > ul > li a[href="/login/model/"] { background-image: url('data:image/svg+xml;utf8,'); } .navigation > nav > ul > li.active a[href="/login/model/"] { background-image: url('data:image/svg+xml;utf8,'); } .navigation > nav > ul + ul { margin-top: 14px; } .navigation > nav > ul + ul > li { font-size: 14px; font-weight: 800; padding: 4px 16px; } .navigation > nav > ul + ul > li + li { margin-left: 22px; } .navigation > nav > ul + ul > li a[href] { height: auto; padding: 0px; } .toolbar a:hover, .toolbar .a:hover, .logout a:hover, .logout .a:hover { color: var(--highlight); } .toolbar a:not(:hover), .toolbar .a:not(:hover), .logout a:not(:hover), .logout .a:not(:hover) { color: var(--nodegoat-dark); } .logout { position: absolute; top: 0px; right: 0px; padding: 0px 30px; color: var(--nodegoat-dark); background-color: rgba(255, 255, 255, 0.6); border-radius: 0 0 2px 2px;} .toolbar { position: absolute; right: 0px; bottom: 0px; } .toolbar > div.project { } .toolbar > ul { border: 2px solid #ffffff; border-radius: 2px 2px 0px 0px; border-bottom: 0px; } .toolbar > ul + ul { margin-left: 10px; } .toolbar li.geo, .toolbar li.soc, .toolbar li.time, .toolbar li.export, .toolbar li.analyse { background-color: rgba(255, 255, 255, 0.6); } .toolbar li.pulse { background-color: #66cbff; color: var(--nodegoat-dark); } .toolbar li.settings { background-color: #ffffff; color: var(--nodegoat-dark); } .toolbar li.settings:not(:first-child) { border-left: 2px solid #fff; } .toolbar li.settings.pulse { background-color: #0096e4; } .toolbar li.settings.pulse-from { background-color: #66cbff; } /* #006498 */ .toolbar li.settings > .a { color: var(--nodegoat-dark); } .toolbar li.settings > span:not(:hover) { color: var(--nodegoat-dark); } .toolbar li.settings.pulse > span, .toolbar li.settings.pulse-from > span { color: #ffffff; } .toolbar li.settings sup, .toolbar li.settings sub { background-color: #009cff; color: #ffffff; } span.icon ~ sup, span.icon ~ sub { background-color: #fafafa; color: var(--nodegoat-dark); } .images { background-color: #fafafa; } .account form > ul { max-width: 350px; } .login > h1 { display: none; } .login > h1 + section { margin-top: 0px; } .entry.object-subs div > fieldset, .entry.object-subs > fieldset, .entry.object-various > fieldset, .filter .fieldsets > div > fieldset, .data_import .rows > div > div > fieldset > fieldset, .data_model .object-sub-details > .sorter > li > div > fieldset, .data_model .import_confirm .options #tab-object-sub .options > fieldset { background-color: var(--back-nested); padding: 5px 10px 10px 10px; } .entry.object-various > fieldset, .filter .object-descriptions.fieldsets > div > fieldset, .filter .object-sub-descriptions.fieldsets > div > fieldset, .filter .external-references.fieldsets > div > fieldset { padding: 6px 10px; } .data_import .rows > div > div > fieldset > fieldset > legend, .entry.object-subs div > fieldset > legend, .entry.object-subs > fieldset > legend, .filter .object-sub-details.fieldsets > div > fieldset > legend, .data_model .object-sub-details > .sorter > li > div > fieldset > legend, .data_model .import_confirm .options #tab-object-sub .options > fieldset > legend { background-color: var(--back-nested); padding: 0.5em 10px 0.5em 10px; margin-left: -10px; margin-bottom: 0px; line-height: 1; } .data_import .rows > div > div > fieldset > fieldset > legend + *, .entry.object-subs div > fieldset > legend + *, .entry.object-subs > fieldset > legend + *, .filter .object-sub-details.fieldsets > div > fieldset > legend + *, .data_model .object-sub-details > .sorter > li > div > fieldset > legend + *, .data_model .import_confirm .options #tab-object-sub .options > fieldset > legend + * { margin-top: 0px; } .data_import .rows > div > div > fieldset > fieldset > *:last-child, .entry.object-subs div > fieldset > *:last-child, .entry.object-subs > fieldset > *:last-child, .filter .fieldsets > div > fieldset > *:last-child, .data_model .object-sub-details > .sorter > li > div > fieldset > *:last-child, .data_model .import_confirm .options #tab-object-sub .options > fieldset > *:last-child { margin-bottom: 0px; } .options fieldset .entry.object-subs > fieldset, .options fieldset .entry.object-various fieldset { display: inline-block; margin-left: 0px; } .view_type_object.object-sub h2, .view_type_object .referenced .statistics > ul > li > h2 { background-color: #f5f5f5; margin: 0px; padding: 0.5em 10px; display: inline-block; line-height: 1; } .view_type_object.object-sub .record, .view_type_object .referenced .statistics > ul > li > .record { background-color: #f5f5f5; margin: 0px; padding: 8px 10px; } .network .node > h4.pulse, .network.type .node > h4 + div.pulse { background-color: #66cbff; } .network.type .node > h4 + div { background-color: var(--back-nested); padding: 0px 12px 12px 12px; } .network.type .node > h4 + div > fieldset > legend { margin-bottom: 8px; } .network.type .node > div + div > div > label > .icon[data-category="direction"] svg { height: 5px; } .network.type .node > h4 > span:first-child { display: none; margin-right: 0.5em; height: inherit; vertical-align: top; } .network.type .node > h4 > span:first-child::before { content: ''; display: block; width: 1.1em; height: 1.1em; box-sizing: border-box; background-color: currentColor; border: 0.2em solid #ffffff; border-radius: 50%; position: relative; top: calc(50% - (1.1em / 2)); } .tabs > ul li > a .icon[data-category="direction"] { color: #ffffff; } .tabs > ul li.selected > a .icon[data-category="direction"], table.display thead .icon[data-category="direction"], table.display tbody .icon[data-category="direction"] { color: #000000; } table.display th.analysis > span > span { } table.display th.analysis > span > span.analysis-workspace { text-decoration: underline; } table.display th.analysis > span > span + span::before { content: "|"; padding: 0px 3px; } table.display td.analysis { font-size: 1.1rem; } div.analysis-object > span > span { } div.analysis-object > span.analysis-workspace { text-decoration: underline; } div.analysis-object > span + span::before { content: "|"; padding: 0px 4px; } .text_layout.body, .text_tags.body, .text_tags .body { position: relative; display: inline-block; background-color: #f5f5f5; padding: 10px; width: 100%; white-space: normal; box-sizing: border-box; } .text_tags .body span.tag-active { padding: 1px; border-width: 1px; margin: -2px; border-style: solid; border-radius: 2px; } .text_tags .body + .marginalia { position: relative; display: inline-block; padding-left: 3px; font-style: oblique; vertical-align: top;} .text_tags .body + .marginalia > p { position: absolute; display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; padding: 0;} .text_tags .body + .marginalia > p span { opacity: 0.7; display: inline-block; } .text_tags .body + .marginalia > p.tag-active { padding-top: 2px; padding-bottom: 2px; margin-top: -2px; margin-bottom: -2px; } .text_tags .body + .marginalia > p.tag-active span { padding: 1px; border-width: 1px; margin-top: -2px; margin-bottom: -2px; border-style: solid; border-radius: 2px; opacity: 1 !important; } .text_layout.body + p, .text_tags.body + p, .text_tags .body + p, .text_tags .page + p { display: block; font-size: 0.9em; color: #7e7e7e; } .text_tags .page { display: flex; flex-flow: row nowrap; } .text_tags .page > .body { flex: 0.8 0.8 auto; width: auto; } .text_tags .page > .marginalia { flex: 0.2 0.2 20%; max-width: 250px; } .data_entry > .tabs { margin-bottom: 20px; } .data_viewer .record > dl > div > dd { max-width: 800px; overflow-wrap: break-word; } .data_viewer .record > dl > div > dd > span.icon, .data_viewer .record > dl > div > dd ul > li span.icon { display: inline-block; color: var(--text); margin-left: 4px; margin-right: 2px; } .data_viewer .record > dl > div > dd > span.icon svg, .data_viewer .record > dl > div > dd ul > li span.icon svg { height: 12px; } .data_viewer .record > dl > div > dd > span.a, .data_viewer .record > dl > div > dd ul > li span.a { text-decoration: underline; text-decoration-color: currentColor; text-decoration-style: dashed; text-decoration-thickness: 1px; text-underline-offset: 4px; display: inline-block; padding-bottom: 2px; } .data_viewer .record > dl > div > dd > span.a:not(:hover), .data_viewer .record > dl > div > dd ul > li span.a:not(:hover) { text-decoration-color: var(--text); } .data_viewer .record > dl > div > dd > span.a:hover > span[style] { color: inherit !important; } .data_viewer .record > dl > div > dd > ul ul { margin-left: 20px; } .data_viewer .record > dl > div > dd > div { display: inline-block; } .data_viewer .record > dl > div > dd > div.analysis-object > span + span::before { content: "|"; } .data_viewer .record > dl > div > dd > div > img { display: block; } .data_viewer .record > dl > div > dd object, .data_viewer .record > dl > div > dd iframe { width: 800px; height: 600px; } .data_viewer .record > dl > div > dd .tabs.text_layout > ul + div, .data_viewer .record > dl > div > dd .tabs.text_tags > ul + div { min-width: 600px; white-space: nowrap; } .data_viewer .record > dl > div > dd div.album { display: grid; grid-auto-flow: column; justify-content: start; justify-items: center; align-items: start; gap: 8px; } .data_viewer .record > dl > div > dd div.album > img, .data_viewer .record > dl > div > dd div.album > video { object-fit: contain; } .data_viewer .record > dl > div > dd div.album > object { width: 100%; height: 100%; min-width: 300px; min-height: 400px; } /* CUSTOM & BODY CONTENT */ .body > figure, .body *:not(.album) > figure { padding: 25px; background-color: #fafafa; } .body > figure figurecaption, .body *:not(.album) > figure figurecaption { margin-top: 20px; } .body h1, .body h2 { margin-top: 0.9em; color: #000000; } .body table.details th { padding: 5px 8px; } .body table.details td { padding: 8px; } .body table.details td p { margin: 6px 0px; } .body table.details td > *:first-child { margin-top: 0px; } .body table.details td > *:last-child { margin-bottom: 0px; } .body table.details tr:nth-child(odd) { background-color: #f9f9f9; } .body table.details th { background-color: var(--highlight); color: #ffffff; } /* INTERFACE */ section.info { background-color: var(--nodegoat-dark); } *[type=button].pulse, *[type=submit].pulse, a.pulse, .a.pulse, .pulse { background-color: #0096e4; } *[type=button].pulse-from, *[type=submit].pulse-from, a.pulse-from, .a.pulse-from { background-color: #006498; } *[type=button].pulse, *[type=submit].pulse { border-color: #008ed7; } *[type=button].pulse-from, *[type=submit].pulse-from { border-color: #005885; } input[type=hidden]:not([value=""]):not([value="null"]):not([value="[]"]) + *[type=button]::after { margin-left: 4px; content: "●"; font-size: 0.7em; position: relative; bottom: 0.1em; line-height: 0; } input[type=text].colorpicker, fieldset > ul > li > label:first-child + * input[type=text].colorpicker, .options fieldset > ul > li > label:first-child + * input[type=text].colorpicker { width: 65px; margin-right: 4px; } .user-name { font-style: italic; } .sub-name::before { content: "["; padding-right: 0.14em; } .sub-name::after { content: "]"; padding-left: 0.14em; } .dynamic-references-name { font-style: italic; } .view_type_object .overview h1 > small, .entry .object h1 > small, .entry.object h1 > small, .data_model > .tabs form > h1 > small, .custom_projects > form > h1 > small, .project-overview > div > h1 > small, .public_interfaces > form > h1 > small, .popup > form.storage fieldset ul > li > div > small, .popup > form[data-method*="handle_"] > h2 > small { display: block; margin-top: 1px; vertical-align: middle; font-size: 1.1rem; font-weight: normal; font-family: var(--font-mono); } .popup > form.storage fieldset ul > li > div > small { display: inline-block; } .view_type_object .overview h1 > small::before, .entry .object h1 > small::before, .entry.object h1 > small::before, .data_model > .tabs form > h1 > small::before, .custom_projects > form > h1 > small::before, .project-overview > div > h1 > small::before, .public_interfaces > form > h1 > small::before, .popup > form.storage fieldset ul > li > div > small::before, .popup > form[data-method*="handle_"] > h2 > small::before { content: "("; margin-right: 0.14em; } .view_type_object .overview h1 > small::after, .entry .object h1 > small::after, .entry.object h1 > small::after, .data_model > .tabs form > h1 > small::after, .custom_projects > form > h1 > small::after, .project-overview > div > h1 > small::after, .public_interfaces > form > h1 > small::after, .popup > form.storage fieldset ul > li > div > small::after, .popup > form[data-method*="handle_"] > h2 > small::after { content: ")"; margin-left: 0.14em; } .view_type_object .overview h1 > small > span + span::before, .entry .object h1 > small > span + span::before, .entry.object h1 > small > span + span::before { content: "/"; margin-left: 0.28em; margin-right: 0.28em; } .display td img.enlarge { background-color: var(--back-nested); border: 2px solid var(--back-nested); } .display td img.enlarge + img.enlarge { margin-left: 2px; } .tschuifje > div:first-child { height: 22px; } .tschuifje > div:first-child > button { display: inline-block; width: 22px; height: 22px; margin: 0; padding: 0; } .tschuifje > div:first-child > button > span.icon svg { height: 10px; } .tschuifje > div:first-child > .bar { position: relative; display: inline-block; vertical-align: middle; background-color: #e1e1e1; height: 100%; margin: 0px; width: calc(100% - 44px); } .tschuifje > div:first-child > .bar > div { position: absolute; z-index: 1; display: inline-block; top: 0px; left: right: 0px; left: 0px; background-color: #666666; height: 100%; cursor: grab; cursor: -webkit-grab; cursor: -moz-grab; } .tschuifje > div:first-child > .bar > div > .handler { position: absolute; width: 8px; top: 0px; height: 100%; background-color: #000000; cursor: col-resize; } .tschuifje > div:first-child > .bar > div > .handler.left { left: -8px; } .tschuifje > div:first-child > .bar > div > .handler.right { right: -8px; } .tschuifje > div:first-child > .bar > div > .handler > time { position: absolute; top: -2.2rem; font-size: 1rem; color: #ffffff; background-color: #000000; padding: 2px 4px; pointer-events: none; white-space: nowrap; } .tschuifje > div:first-child > .bar > div > .handler > time::after, .tschuifje > div:first-child > .bar > div > .handler > time::before { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; } .tschuifje > div:first-child > .bar > div > .handler > time::after { border-top-color: #000000; border-width: 6px; margin-left: -6px; } .tschuifje > div:first-child > .bar > div > .day { position: absolute; left: 0px; top: 0px; height: 100%; width: 1px; background-color: #ff0000; cursor: col-resize; } .tschuifje > div:first-child > .bar > div > .day > time { position: absolute; bottom: -2.2rem; font-size: 1rem; color: #ffffff; background-color: #000000; padding: 2px 4px; pointer-events: none; white-space: nowrap; } .tschuifje > div:first-child > .bar > div > .day > time::after, .tschuifje > div:first-child > .bar > div > .day > time::before { top: 0; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; } .tschuifje > div:first-child > .bar > div > .day > time::before { top: -12px; border-bottom-color: #000000; border-width: 6px; margin-left: -6px; } .tschuifje > div:first-child + div { position: relative; float: left; margin-top: 8px; } .tschuifje > div:first-child + div input[name=amount] { width: 50px; } .tschuifje > div:first-child + div button.play > span.icon svg, .tschuifje > div:first-child + div button.pause > span.icon svg, .tschuifje > div:first-child + div button.stop > span.icon svg { height: 10px; } .tschuifje.moving .bar { cursor: grabbing; cursor: -webkit-grabbing; cursor: -moz-grabbing; } .tschuifje.moving.resize .bar { cursor: col-resize; } .tschuifje.moving .bar > div, .tschuifje.moving .bar > div > .handler { cursor: inherit; } /* VISUALISATION */ .labmap.plot circle { } /* OTHER */ .tooltip { max-width: none; } .tooltip ul > li > label:first-child + *, .tooltip dl > div > dt + dd { white-space: nowrap; } .record > dl > div > dt { font-weight: bold; } fieldset > ul > li > label:first-child { color: #000000; font-weight: bold; font-size: 14px; } /* BBCODE */ /* PAGE */ body .container { flex: 1 1 100vh; display: flex; flex-flow: row wrap; align-content: stretch; align-items: flex-start; justify-content: flex-start; } body.framed .container { flex: 1 1 100%; } body .container > .site { flex: 1 1 auto; } body .container > .full { flex: 0 0 100%; align-self: flex-end; } .container > .full.footer { position: relative; height: auto; margin-top: 100px; background-color: #f5f5f5; } .container > .full.footer > .site { width: 100% !important; padding: 20px 0; } .container > .full.footer .body { color: #666666; } .container > .full.footer .body a:not(:hover) { color: #666666; } .container > .full.footer .mod { font-size: 11px; text-align: center; } .container > .full.footer .mod > a.nodegoat-logo { display: block; width: 60px; height: 60px; margin: 0px auto 15px auto; background-color: #a3ce6c; background-image: url('/css/images/nodegoat.svg'); background-size: 37px 39px; background-repeat: no-repeat; background-position: 11px 10px; } .container > .full.footer .mod > p { margin: 0px; } .container > .full.footer .mod > a + p > * { vertical-align: middle; } .container > .full.footer .mod > a + p + p { font-size: 0.9em; opacity: 0.6; margin-top: 4px; } .container > .full.footer .mod a.LAB1100 { display: inline-block; margin-left: 5px; width: 70px; height: 14px; background-image: url('/CMS/css/images/lab1100.svg'); background-repeat: no-repeat; background-size: contain; } .page-viewer .container:after { padding-bottom: 0px; } .page-viewer .full .site { min-width: 100%; max-width: 100%; padding: 0px; } .page-publication { background-color: #ffffff; } .page-publication .full .site { padding: 0px; } .labmap { position: relative; width: 100%; height:100%; overflow: hidden; } .labmap > .map { position: relative; width: 100%; height:100%; overflow: hidden; z-index: 1; } .labmap .map .paint > *, :host(.host.labmap-paint) > * { position: absolute; left: 0px; top: 0px; } .labmap.plot > .controls .legends > figure.object-sub-details, .labmap.line > .controls .legends > figure.object-sub-details { margin-top: 0px; } .labmap.soc > .controls .legends > figure.types { margin-top: 0px; } .labmap.plot > .controls .legends > figure.types, .labmap.line > .controls .legends > figure.types { display: none; margin-top: 0px; } .labmap.soc > .controls .legends > figure.object-sub-details { display: none; margin-top: 0px; } .labmap.soc > .controls .legends > figure.selected-node dt, .labmap.soc > .controls .legends > figure.selected-node dd { white-space: nowrap; max-width: 150px; overflow: hidden; text-overflow: ellipsis; } .labmap.soc > .controls .legends > figure.selected-node span { cursor: pointer; } .labmap.soc > .controls .legends > figure.selected-node > span { display: block; white-space: nowrap; width: 200px; overflow: hidden; text-overflow: ellipsis;} .labmap.soc > .controls .legends > figure.search-nodes > ul { max-width: 190px; } .labmap.soc > .controls .legends > figure.search-nodes > ul > li { text-align: left; } .labmap.soc > .controls .legends > figure.search-nodes > ul > li > a { overflow: hidden; text-overflow: ellipsis; } .labmap.soc > .controls .legends > figure.run-layout { text-align: right; } .labmap.soc > .controls .legends > figure.run-layout:not(.running) > select + button + button { display: none; } .labmap.soc > .controls .legends > figure.run-layout.running > select + button { display: none; } .labmap.soc > .controls .legends > figure.run-layout > div:first-child > p { margin-top: 0px; } .labmap.soc div.hover-node-label, .labmap.soc div.top-node-label { position: absolute; display: block; padding: 2px; font-size: 1.1rem; background: rgba(245, 245, 245, 0.6); white-space: nowrap; } .labmap.soc div.top-node-label { max-width: 120px; overflow: hidden; text-overflow: ellipsis; } .labmap.soc .background, .labmap.line .background { background-color: #fafafa; } .labmap.plot .paint.hovering, .labmap.soc .paint.hovering, .labmap.line .paint.hovering { cursor: pointer; } .labmap.soc { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; } .labmap.soc > .controls .legends > figure button, .labmap.line > .controls .legends > figure button { background-color: transparent; color: #aaaaaa; border: 0; } .labmap.line > .controls .legends > figure button { padding: 2px; margin: 0; margin-right: 5px; height: 10px; vertical-align: top; } .labmap.line > .controls .legends > figure button.active { color: #000000; } .labmap.soc > .controls .legends > figure button svg { height: 10px; } .labmap > .controls { } .labmap > .controls fieldset > ul { margin: -2px 0; border-spacing: 0px 2px; } .labmap > .controls fieldset > ul > li > label:first-child { font-size: 1.1rem; font-weight: normal; } .labmap > .controls .options { border: 0px; margin: 0px; } .labmap > .controls .geo, .labmap > .controls .soc { position: absolute; padding: 10px; background: rgba(128, 128, 128, 0.35); z-index: 1; font-size: 1.1rem; } .labmap > .controls .geo { bottom: 40px; left: 40px; } .labmap > .controls .soc { top: 140px; right: 40px; } .labmap > .controls .timeline { position: absolute; bottom: 40px; width: 100%; text-align: center; } .labmap > .controls .timeline > div { display: inline-block; position: relative; text-align: left; width: calc(100% - 500px); min-width: 450px; max-width: 700px; padding: 10px; background: rgba(128, 128, 128, 0.35); z-index: 1; } .labmap > .controls .timeline .slider { position: relative; z-index: 1; } .labmap > .controls .timeline .buttons { position: relative; float: right; margin-top: 8px; } .labmap > .controls .timeline .buttons input { margin: 0px; } .labmap > .controls .legends { position: absolute; top: 40px; right: 40px; z-index: 1; pointer-events: none; } .labmap > .controls .legends > figure { margin: 0px; margin-top: 10px; float: right; clear: both; padding: 10px; font-size: 1.1rem; background: rgba(245, 245, 245, 0.75); pointer-events: auto; } .labmap > .controls .legends > figure dl { margin: -5px 0; display: table; border-collapse: separate; border-spacing: 0px 5px; } .labmap > .controls .legends > figure dl > div { display: table-row; } .labmap > .controls .legends > figure dl > div > dt { display: table-cell; vertical-align: middle; text-align: right; white-space: nowrap; } .labmap > .controls .legends > figure dl > div > dt + dd { display: table-cell; vertical-align: middle; padding-left: 8px; } .labmap > .controls .legends > figure dl > div > dt + dd > span { display: inline-block; width: 50px; height: 5px; } .labmap > .controls .legends > figure.types dl > div, .labmap > .controls .legends > figure.object-sub-details dl > div, .labmap > .controls .legends > figure.conditions dl > div { cursor: pointer; } .labmap > .controls .legends > figure.types dl > div[data-state="0"], .labmap > .controls .legends > figure.object-sub-details dl > div[data-state="0"], .labmap > .controls .legends > figure.conditions dl > div[data-state="0"] { opacity: 0.3; } .labmap > .controls .legends > figure.metrics-container { display: table-row;text-align: left; white-space: nowrap; vertical-align: top; } .labmap > .controls .legends > figure.metrics-container > ul { display: table-cell; display: inline-block; vertical-align: top; margin-right: 3px; } .labmap > .controls .legends > figure.metrics-container > ul > li { width: 150px; overflow: hidden; text-overflow: ellipsis; padding: 3px; cursor: pointer; } .labmap > .controls .legends > figure.metrics-container > ul > li:hover { background-color: #eeeeee; } .labmap > .controls .legends > figure.metrics-container > span { display: table-cell; cursor: pointer; width: 15px; height: 15px; display: inline-block; vertical-align: top;} .labmap > .controls .legends > figure.metric { min-width: 150px; margin: 0; padding: 0; } .labmap > .controls .legends > figure.metric > span { cursor: move; line-height: 20px; display: block; width: 100%; } .labmap > .controls .legends > figure.metric > span:active { cursor: all-scroll; } .labmap > .controls .legends > figure.metric > div > span { padding: 5px; margin: 5px; background-color: #eee; cursor: pointer; } .labmap > .controls .legends > figure.metric > div > span:hover { background-color: #aaaaaa; color: #fff; } .labmap > .controls .legends > figure.metric > div > span.active { background-color: #000000; color: #fff; } .labmap > .controls .legends > figure.metric > .result { padding: 5px; } .labmap > .controls .legends > figure.metric > .result > ul > li span { display: inline-block; width: 25px; } .labmap > .controls .legends > figure.metric > .result > ul > li span.name { white-space: nowrap; width: 150px; overflow: hidden; text-overflow: ellipsis; } .labmap > .controls .legends > figure.metric.repositioned { position: fixed; } .labmap[data-tools=""] > .controls .timeline, .labmap[data-tools=""] > .map > .controls > .main, .labmap.soc[data-tools=""] > .controls .legends > figure.search-nodes, .labmap.soc[data-tools=""] > .controls .legends > figure.run-layout { display: none; } #template-3 .site { width: 1000px; margin: 0px auto; } #template-3 .back-spacing { margin: 0px; border-width: 0px; } #template-3 .mod-spacing { margin: 20px; border-width: 20px; } #template-3 #mod-0_0 { width: calc(100% - 0px); margin-top: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 0px; } #template-3 #back-1 { width: calc(100% - 0px); margin-top: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 0px; } #template-3 #mod-0_1 { width: calc(100% - 40px); margin-left: 20px; margin-right: 20px; margin-top: 20px; margin-bottom: 20px; } #template-3 #full-3 { } #template-3 #mod-0_2 { width: calc(100% - 40px); margin-top: 0px; margin-left: 20px; margin-right: 20px; margin-top: 0px; margin-bottom: 0px; } #template-7 .site { width: 1000px; margin: 0px auto; } #template-7 .back-spacing { margin: 0px; border-width: 0px; } #template-7 .mod-spacing { margin: 20px; border-width: 20px; } #template-7 #mod-0_0 { width: calc(100% - 0px); margin-top: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 0px; } #template-7 #back-1 { width: calc(100% - 0px); margin-top: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 0px; } #template-7 #mod-0_1 { width: calc(50% - 40px); margin-left: 20px; margin-right: 20px; margin-top: 20px; margin-bottom: 20px; } #template-7 #mod-1_1 { width: calc(50% - 40px); margin-left: 20px; margin-right: 20px; margin-top: 20px; margin-bottom: 20px; } #template-7 #full-4 { } #template-7 #mod-0_2 { width: calc(100% - 40px); margin-top: 0px; margin-left: 20px; margin-right: 20px; margin-top: 0px; margin-bottom: 0px; } #template-13 .site { width: 1000px; margin: 0px auto; } #template-13 .back-spacing { margin: 0px; border-width: 0px; } #template-13 .mod-spacing { margin: 20px; border-width: 20px; } #template-13 #mod-0_0 { width: calc(100% - 0px); margin-top: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 0px; } #template-13 #back-1 { width: calc(100% - 0px); margin-top: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 0px; } #template-13 #mod-0_1 { width: calc(100% - 80px); margin-top: 40px; margin-left: 40px; margin-right: 40px; margin-top: 40px; margin-bottom: 40px; } #template-13 #full-3 { } #template-13 #mod-0_2 { width: calc(100% - 40px); margin-top: 0px; margin-left: 20px; margin-right: 20px; margin-top: 0px; margin-bottom: 0px; } #template-17 .site { width: 1000px; margin: 0px auto; } #template-17 .back-spacing { margin: 0px; border-width: 0px; } #template-17 .mod-spacing { margin: 0px; border-width: 0px; } #template-17 #full-0 { } #template-17 #mod-0_0 { width: calc(100% - 0px); margin-top: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 0px; } /**end**/