body {font-family:Work Sans,Arial;padding:0;margin:0;font-size:14px;}
#header {padding:0;margin:0}

#navi_topbar {color:white;background:#303030;height:2em;padding-top:0.6em;padding-left:1em;padding-right:1em;font-size:110%;}
#navi_topbar a {color:white;text-decoration:none;}
#navi_topbar li {display:inline-block;text-transform: uppercase;padding-left:0.5em;padding-right:0.5em;}
#navi_topbar .navi_top {float:left;}
#navi_topbar .navi_user {float:right;}
#navi_topbar .navi_language {float:right;}
#navi_topbar ul {padding:0;margin:0}

.navi_top_sub {padding-left:1em;}
.navi_top_sub li {display:inline-block;padding-left:0.5em;padding-right:0.5em;padding-top:0.2em;}
.navi_top_sub a {color:black;text-decoration:none;text-transform: uppercase;}

td.navi_left {display:table-cell;padding:0.4em 0 0 0.4em;margin:1em 1em 0 0 ;border-right:solid 1px #e0e0e0;width:200px;}

.main {margin:0 1.5em;}

h1 {padding:0;margin:0 0 8px 0;font-size:180%;color:#af272f;}
h2 {padding:0;margin:0 0 8px 0;font-size:160%;}
.login{border: solid 1px #808080;margin-left:auto;margin-right:auto;box-shadow:2px 2px 12px #bbb;width:300px;padding:16px;background:#f8f8f8;}
.login h1 {background-color:#ffffff;color:#af272f;margin:-16px -16px 16px -16px;padding:16px;border-bottom:solid 1px gray}
dddd.login h1 {background-color:#af272f;color:white;margin:-16px -16px 16px -16px;padding:16px;}
.login label {font-size:90%;color:#808080;display:block;margin-top:6px;}
.login input[type="text"] {width:100%;}
.login input[type="password"] {width:100%;}
.login button {float:right;}

/* data table */
td.dt_select,th.dt_select {width:1.5em;text-align:center;}
table.content {border-collapse: collapse;border-spacing:0 0;width:100%; background: #fbfbfb;}
table.content a {color:black;text-decoration:none;}
table.content thead {background:#dedede;}
table.content,table.content  th,table.content  td {border: 1px solid #dedede;padding:0;margin:0;}
table.content td {padding:0.3em;}
table.content tr {cursor:pointer;}
table.content tr:nth-of-type(even) { background: #f7f7f7;}
table.content tr.selected {background: #e0e0e0;}



button {border:solid 1px #b0b0b0;padding:0.5em 1em;font-weight:bold;background:#f8f8f8;margin-left:-1px;border-radius:3px 3px;}

fieldset {border: none;padding:1em;margin:0;;}
fieldset hr {margin-bottom:1.5em;}
label {font-size:90%;color:black;display:block;margin-top:6px;}

.formelement {display:inline-block;}

ul.pager {font-size:100%;padding:0;}
ul.pager li,ul.pager dd {display:inline-block;border-radius:2px;background-color:#f0f0f0;padding:3px 5px 3px 4px;}
ul.pager li.right {float:right;display:block;background:white;}
ul.pager dl {margin:0;padding:0;}
ul.pager dd,ul.pager dt {display:inline-block;margin-left:0.2em;}
ul.pager dt {background:white;border:none;}
ul.pager a {text-decoration:none;color:black;}
ul.pager li.current a,ul.pager  dd.active a {text-decoration:none;color:white;}
ul.pager li.current,ul.pager dd.active {background-color:#808080;color:white;}


hr {border:none;border-bottom:solid 1px #e0e0e0;}


textarea {width:50em;height:8em;}
.formelement select {min-width:100px;}

fieldset.section {padding:1em 0 0 1em;margin:0;}
fieldset.section legend {margin:0;padding:0;font-weight:bold;margin-left:-1em;padding-top:1em;margin-bottom:-1em;border-bottom:solid 1px #808080;min-width:40em;}

#bugs_description {width:100%;height:6em;}
#bugs div.formelement_textarea {width:100%;}

.list span {background:#e0e0e0;border-radius:3px;margin-right:0.5em;}

span.username {background:#e8e8e8;border:solid 1px #d0d0d0;border-radius:3px;padding:0.05em 0.4em;}


.navi_side h1 {padding:0;margin:0 1em 0 1em;font-size:1.2em;font-weight:bold;border-bottom:solid 1px #d0d0d0}
nav.navi_side {padding:0;margin:0 1em 0 1em;}
ul.navi_side {margin:0;padding:0.5em 0 0 0.5em;}
.navi_side li {display:block;padding-left:1.5em;padding-right:0.5em;padding-top:0.1em;padding-bottom:0.1em;}
.navi_side a {color:black;text-decoration:none;}

.navi_side li {background:url(/sso/icons/18/normal/devices/computer.png) center left no-repeat;line-height:18px;vertical-align:center;}

.navi_folder {margin:0;padding:0em 0 0 1em;}
.navi_folder ol {margin:0;padding:0;}
.navi_folder h1 {border-bottom: solid 1px #e0e0e0;margin:0 0.5em 0.1em 0;padding:0 0 0.1em 0;font-size:1em;}
.navi_left {background-repeat:no-repeat;display:block;padding:0 0 0 22px;margin:0.1em 0 0 0.5em;line-height:20px;vertical-align:middel;}
.navi_left a {color:black;text-decoration:none;}

.input_files_file_remove {text-decoration: line-through;}
.input_files_file {display:inline-block;}
.input_files_file input[type=file] {width:8em;}


.checkresult_ok {color:green;}
.checkresult_error {color:red;}
.checkresult_detail {color:gray;border:solid 1px #808080;display:inline-block;padding:0 0.3em ;margin-left:0.5em;border-radius:0.2em;background:#f0f0f0;}

.message_error  {color:white;border:solid 1px #800000;display:inline-block;padding:0.1em 0.6em ;border-radius:0.2em;margin-bottom:0.3em;background:#800000;width:100%}
.message_ok  {color:white;border:solid 1px #008000;display:inline-block;padding:0.1em 0.6em ;border-radius:0.2em;margin-bottom:0.3em;background:#008000;width:100%}


td.datatable_mail_quota {text-align:right;}
td.datatable_mail_usage {text-align:right;}
td.datatable_filestorage_quota {text-align:right;}
td.datatable_filestorage_usage {text-align:right;}

.info-box {border-radius:2px;background-color:#f8f8f8;border:solid 1px #c0c0c0;font-size:80%;color:#606060;padding:0.5em;}

button.multiple_delete {padding:1px;}



@font-face {
    font-family: 'Material Icons';font-style: normal;font-weight: 400;
    src: url(/en/fonts/MaterialIcons-Regular.eot); /* For IE6-8 */
    src: local('Material Icons'),
    local('MaterialIcons-Regular'),
    url(/en/fonts/MaterialIcons-Regular.woff2) format('woff2'),
    url(/en/fonts/MaterialIcons-Regular.woff) format('woff'),
    url(/en/fonts/MaterialIcons-Regular.ttf) format('truetype');
}
.material-icons {
    font-family: 'Material Icons';font-weight: normal;font-style: normal;font-size: 1em;
    display: inline-block;line-height: 1;text-transform: none;letter-spacing: normal;
    word-wrap: normal;white-space: nowrap;direction: ltr;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    vertical-align: text-bottom;
}

html,body {width:100%;height:100%;margin:0;padding:0;}
html,body,input,select,textarea,button{font-family: 'Work Sans';font-style: normal;font-weight: 400;font-size:16px;}
h1,h2,h3,h4 {padding:0;margin:0;}

.logo {width:160px;margin-left:20px;vertical-align:middle;}
.maincontent {padding:1em;}

/*          FORM           */
.formelement {display:inline-block;}
button {border-radius:0.3em;background:#565656;color:white;font-size:1.0em;border:none;padding:0.2em 0.6em;min-width:7em;}
label {display:block;font-size:0.8em;color:#606060;margin-top:3px;}
label.left {display:inline-block;}
input {font-size:1em;}
.showconditionhide {opacity:50%;}
fieldset {border:none;}
fieldset.section {border:solid 1px #e0e0e0;margin-top:0.5em;}
fieldset.section legend {font-size:0.8em;font-weight:bold;color:#606060}
form h2 {color:#af272f;font-size:1.25em;border-bottom:solid 1px #e0e0e0;margin-bottom:0.3em;}

/*         LOGIN  FORM     */
#login{border: solid 1px #808080;margin-left:auto;margin-right:auto;box-shadow:2px 2px 12px #bbb;width:300px;padding:16px;background:#f8f8f8;}
#login h2 {background-color:#ffffff;color:#af272f;margin:-16px -16px 16px -16px;padding:16px;border-bottom:solid 1px gray}
#login fieldset {padding:0;margin:0;border:none;}
#login .formelement {width:100%;}
#login label {font-size:90%;color:#808080;display:block;margin-top:6px;}
#login input {padding:0;margin:0;box-sizing: border-box;}
#login input[type="text"] {width:100%;}
#login input[type="password"] {width:100%;}
#login button {float:right;}

/*          NAVI         */
.top {border-bottom:1px solid #e0e0e0;background:#303030;color:white;}
.top .navi li a {text-decoration:none;color:white;}

.navi {margin:0;}
.navi li {display:inline-block;font-size:16px;}
.navi li a {display:inline-block;text-decoration:none;color:black;padding: 10px 10px 10px 10px;}
.navi li a.active {font-weight:bold;}

.navi_top {display:inline-block;padding-left:0.5em;}
.navi_user {display:inline-block;float:right;}
.navi_language {display:inline-block;float:right;}

.navi_main {display:inline-block;}
.mainmenu{border-bottom:1px solid #d0d0d0;}

.navi_main a:hover {background-color:#f0f0f0;}
.navi_top a:hover {background-color:#505050;}
.navi_user a:hover {background-color:#505050;}
.navi_language a:hover {background-color:#505050;}

.navi_main li {position:relative;}
.navi_main li:hover ul {display: block;}
.navi_main li ul    {display:none;
   position: absolute;top: 0;
   left: 0;right:0;margin: 0;padding:0;
   margin-top:2.4em;
   border:1px solid #e0e0e0;
    border-top:none;
    background-color:#ffffff;
}
.navi_main li ul a {padding-bottom:0.2em;padding-top:0.2em;}

.navi_top_sub li {text-align:center;}
.navi_top_sub li.active {border-bottom:1px solid red;}

.navi_folder li.active a {font-weight:bold;}

/*          TABLE           */
table.datatable {width:100%;border-collapse: collapse;}
table.datatable-checkbox-col td:first-child {width:2em;text-align:center;}
table.datatable-checkbox-col th:first-child {width:2em;text-align:center;}
table.datatable th {background:#808080;color:white;padding:0;margin:0;}
table.datatable th a {color:white;text-decoration:none;}
table.datatable td {border:solid 1px #e0e0e0;}
table.datatable th {border:solid 1px #a0a0a0;}
table.datatable tr:nth-child(odd) td {background-color:#f8f8f8;}

/*           MENU             */
.menu {padding-bottom:0.5em;}
.menu-action {display:inline-block;position:relative;cursor:pointer;}
.menu-action-haschildren > button::after {content: "\25BE";float:right}
.menu-action-haschildren:hover > button::after {content: "\25B4";float:right}
.menu-action-disabled {opacity:0.5;cursor:default}
.sub-action {display:none;position:absolute;left:0;top:1.5em;background-color:white;border:solid 1px #f0f0f0;}
.sub-action .menu-action {padding-top:0.5em;}
.menu-action:hover .sub-action {display:block;}

/* formats */

.object_key {padding-right: 5px;}
.object_key {font-weight:bold;}
.object_val {padding-right: 5px;}
.object_val::after {content: ", ";}
.object_val:last-of-type::after {content: "";}

.debug {display:inline-block;font-size:0.9em;}
.debug * {vertical-align:top;}
.debug-type {display:inline-block;border-radius:0.3em;background:#a0a0a0;color:white;font-size:0.8em;padding:2px 4px;text-transform: uppercase;margin:1px;}
.debug-object {border-radius:0.3em;border:solid 1px #e0e0e0;}
.debug-object-key {display:table-cell;border-radius:0.3em;background:#e0e0e0;color:#606060;font-size:0.8em;padding:1px 2px;border: solid 1px white;border-left: solid 8px white;}
.debug-object-val {display:table-cell;}
.debug-object-entry {display:table-row;}
.debug-int > .debug-type {background-color:#e1a025;}
.debug-float > .debug-type {background-color:#16acb5;}
.debug-string > .debug-type {background-color:#93e155;}
.debug-array > .debug-type {background-color:#e15555;}
.debug-object > .debug-type {background-color:#5577e1;column-span: all;display:table-row;}
.debug-void {background-color:#e0e0e0;}

/* popup */
#popup {display: none;position: fixed;z-index: 1;left: 0;top: 0;width: 100%;height: 100%;overflow: auto;
  background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.4);}
#popup-inner {background-color: #fefefe;margin: 15% auto;padding: 20px;border: 1px solid #888;width: 80%;min-height:5em;}
#popup-content {}
#popup-close {float: right;}  
#popup-close button {width:24px;height:24px;font-size: 18px;font-weight: bold;min-width:0;padding:0;}
/* message */
#message {display: none;position: fixed;z-index: 1;left: 0;top: 0;width: 100%;height: 100%;overflow: auto;
  background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.4);}
#message-inner {background-color: #fefefe;margin: 15% auto;padding: 20px;border: 1px solid #888;width: 80%;min-height:5em;}
#message-content {}
#message-close {float: right;}  
#message-close button {width:24px;height:24px;font-size: 18px;font-weight: bold;min-width:0;padding:0;}
.message-error #message-inner {background:red;color:white;}
.message-success #message-inner {background:green;color:white;}
.message-warning #message-inner {background:orange;color:white;}

.pager span {display:inline-block;border-radius: 0.3em;
    background: #b0b0b0;
    color: white;
    font-size: 1.0em;
    border: none;
    padding: 0.1em 0.3em;
    min-width: 1em;
    text-align:center;
}

button.multi-item-delete {font-size:12px;height:1.8em;width:auto;min-width:auto;margin-bottom:2px;}
button.multi-item-add {font-size:12px;height:1.8em;width:auto;min-width:auto;margin-bottom:2px;}