/* Styles for front page */

#main.front .folder > .header > .content-count {
  display: none;
}

#main.front .folder > .header {
    background-color: rgb(219,218,217);
}

#main.front .folder.toplevel > .header > .name {
  font-size: 20pt;
}
/* Styles for config page */

#main.config .settings-section {
  margin-bottom: 1em;
}

.settings-section .settings-value label {
  width: 400px;
  display: inline-block;
  vertical-align: top;
}

.settings-section .settings-value {
  margin-top: 0.1em;
  margin-bottom: 0.1em;
}

.settings-section .settings-value > input,
.settings-section .settings-value > select,
.settings-section .settings-value > div,
.settings-section .settings-value > textarea {
  width: 300px;
  display: inline-block;
}
.settings-section .settings-value > textarea {
  height: 10em;
}
/* Styles for journal page */

.journal {
    table-layout: fixed;
    width: 100%;
}

.journal .deleted > input[type="text"] {
    font-style: italic;
    color: rgb(180, 180, 180);
}

.journal input[type="text"] {
    background-color: transparent;
    border: none;
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.journal thead input[type="text"] {
    background-color: transparent;
    border: 1px solid white;
    color: white;
    padding-left: 2px;
}
.journal .date {
  font-weight: normal;
  display: inline-block;
  border: 1px solid white;
  width: 110px;
  margin-right: 5px;
  height: 16pt;
  padding-left: 2px;
}
.journal .filter-date-container span {
  color: white;
}
.journal .filter-date-container .reset {
  cursor: pointer;
}
.journal td {
  padding: 2px 10px;
}

.journal thead td {
  font-weight: bold;
  background: rgb(90,90,90);
  color: white;
}

.journal tbody {
  background: rgb(220,220,220);
}
/* Styles for statistics page */

.statistics table
{
    clear: left;
    text-align: left;
    border: 1px dotted gray;
    border-radius: 3px;
    background-color: white;
    padding: 5px;
}

.statistics table.statistic-entries tr th
{
    font-weight: normal;
    min-width: 380px;
    padding-right: 20px;
    padding-bottom: 2px;
}
.statistics table.statistic-entries tr td
{
    min-width: 400px;
}

.statistics table#most-used-folders tr > *,
.statistics table#empty-folder-list tr > *
{
    padding-right: 20px;
}
.statistics table#most-used-folders tr > :last-child,
.statistics table#empty-folder-list tr > :last-child
{
    padding-right: 0;
}

.statistics table#empty-folder-list tr > :last-child
{
    min-width: 400px;
}

.statistics canvas {
    float: left;
}

.statistics ul.bar-legend
{
    position: relative;
    top: 20px;
    left: 20px;
    list-style: none;
    white-space: nowrap;
}

.statistics ul.bar-legend li span
{
    display: inline-block;
    width: 1em;
    height: 1em;
    border-radius: 3px;
    margin-right: 5px;
}
/* Styles for profile page */

#notify-on-custom-selector > div {
    margin-left: 18px;
}

.required_field_marker {
    color: red;
}
/*
 * User management page
 *
 */

#pUserManagement tr {
    vertical-align: top;
    text-align: left;
}

#pUserManagement form.user-pages label {
    display: block;
}

#pUserManagement .new-entry {
    background-color: rgb(180, 220, 180);
}

/*
 * Both
 *
 */

.add_new_user,
.user_management_list {
    margin-top: 0.5em;
}

/*
 * Adding new users
 *
 */

.add_new_user {
    display: inline-block;
    background-color: white;
    border-radius: 4px;
    border: 1px dotted rgb(90,90,90);
}

.add_new_user > div {
    margin-bottom: 5px;
}
.add_new_user > div:last-child {
    margin-bottom: 0;
}

.add_new_user label {
    min-width: 300px;
    display: inline-block;
    vertical-align: top;
}

.add_new_user input[type="text"],
.add_new_user input[type="password"],
.add_new_user textarea {
    width: 180px;
}
.add_new_user input[type="submit"] {
    padding: 2px 7px 2px;
}
.add_new_user .radio {
    margin: 10px 0 10px 5px;
}
.add_new_user .radio label {
    min-width: 295px;
}
.add_new_user .radio > div {
    margin-bottom: 5px;
}
.add_new_user .radio > div:last-child {
    margin-bottom: 0;
}

/*
 * Managing existing users
 *
 */

.user_management_list thead {
    background-color: rgb(90,90,90);
}

.user_management_list thead th {
    color: white;
}

.user_management_list tbody {
    background-color: rgb(220, 220, 220);
}
.user_management_list tbody tr:hover {
    background-color: rgb(213, 213, 213);
}

.user_management_list td {
  padding: 4px 10px;
}
.user_management_list th {
  padding: 4px 10px;
}

.user_management_list td.active {
  text-align: center;
}

.user_management_list .name {
    min-width: 400px;
}
.user_management_list .name .p_user_mgm,
.user_management_list .name .p_statistics,
.user_management_list .name .p_config,
.user_management_list .name .p_econfig {
    font-weight: bold;
}
.user_management_list .name img {
    position: relative;
    top: 2px;
}

.user_management_list .privileges > a.clickable {
    color: rgb(150, 150, 150);
}

.user_management_section:not(:empty) {
    margin-top: 1.5em;
}

.add_new_user .error {
    margin: 5px 0 10px;
}
/* Styles for downloads */

.download-file p label {
    display: inline-block;
    width: 100px;
    font-weight: bold;
}

.download-file {
    width: 400px;
    margin: auto;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid rgb(90,90,90);
}

.download-pw, .download-link {
    text-align: left;
    display: table;
    margin-left: auto;
    margin-right: auto;
}
.download-pw > img,
.download-pw > div,
.download-pw > form {
    display: table-cell;
}

.download-pw img,
.download-link img {
    margin-right: 10px;
}

.download-pw .pw-protected {
    margin-top: 0;
    vertical-align: top;
}

.download-link a {
    display: inline-block;
    vertical-align: top;
}
/* Styles for help page */

.help-page .section:first-child h1:first-child {
    margin-top: 0;
}

.help-page .section h1 {
    font-size: 22px;
}

.help-page .subsection {
  margin: 15px 0px;
  padding: 1px 10px;
  border: 1px dotted rgb(90,90,90);
  border-radius: 4px;
  background-color: #fefefe;
}

.help-page .subsection h2 {
    font-weight: bold;
    font-size: 17px;
}

.help-page .subsection h3 {
    font-style: italic;
}

.help-page .icon.help {
    position: relative;
    top: 9px;
    margin-right: 4px;
    margin-left: 4px;
}
.help-page .icon.help.small {
    top: 3px;
    margin-right: 2px;
    margin-left: 2px;
}

.help-page dl {
    padding-left: 2em;
}
.help-page dl dt {
    display: list-item;
    list-style-type: disc;
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 5px;
}
.help-page dl dd p:first-child {
    margin-top: 0;
}

.help-page dd > .info,
.help-page dd > .warning {
    max-width: 500px;
    margin-left: 2em;
}

.help-folder {
  border: 1px solid rgb(90,90,90);
}


/* Styles for home */
.notext > span {
  display: none;
}

#webattach .close_button {
    border: none;
    background-color: rgb(200,200,200);

    background-image: url('../../img/cross-dark.png');
    background-repeat: no-repeat;
    background-position: center;

    width: 16px;
    height: 16px;

    margin: 5px;

    position: absolute;
    top: 0;
    right: 0;

    cursor: pointer;

    z-index: 10;

    /* hide text */
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

/*
 * Both
 *
 */

.file > .name .filename.editable form,
.folder > .header > .name.editable form {
    margin: 0;
    padding: 0;
}

.file > .name .filename.editable form input,
.folder > .header > .name.editable form input {
    font-family: sans-serif;
    font-size: 14px;
    font-weight: bold;
    border: 0;
    margin: 0;
    padding: 0;
}

.file > .name .filename.editable form button[type="submit"],
.folder > .header > .name.editable form button[type="submit"] {
    margin-left: 2px;
    margin-right: 2px;
}

/*
 * Files
 *
 */

.file > .name .filename.editable {
    display: inline-block;
}

.file > .name {
    font-weight: bold;
    margin-left: 5px;
}
.file > .name span {
    vertical-align: center;
    text-decoration: none;
}

.file .url {
    border-right: 1px solid gray;
    padding-right: 10px;
    margin-right: 5px;
}
.file .url input {
    background: none;
    display: inline-block;
    vertical-align: top;
    border: none;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0px;
    margin: 0;
    width: 300px;
}
.file .url img {
    margin-left: 5px;
}

.content .files .file .size {
    display: inline-block;
    border-right: 1px solid gray;
    padding-right: 10px;
    margin-right: 10px;
}

.file .timeperiod {
    display: inline-block;
    border-right: 1px solid gray;
    padding-right: 10px;
    margin-right: 10px;
}
.timeperiod .date.changeable {
    cursor: pointer;
}
.timeperiod .icon {
    top: 1px;
    margin: 0 0 0 3px;
}

.file .actions {
    min-width: 81px;
    text-align: right;
}

.file .actions > .action {
    margin-right: 5px;
}

.file {
  border: 1px solid rgb(180,180,180);
  overflow: hidden;
}
.file:hover {
    background-color: rgb(230, 230, 230);
}

.file-controls {
    float: right;
}

.file-controls * {
    display: inline-block;
}

.files .file {
    margin: 2px 5px 0;
    padding: 3px 0;
}
.files .file, .subfolders .folder {
    display: block;
    margin-left: 13px;
    width: auto;
}

.content .files .file .name > *,
.content .files .file .actions > *,
.content .files .file .timeperiod,
.content .files .file .size,
.content .files .file .url > * {
  display: inline-block;
  vertical-align: top;
  position: relative;
  top: 2px;
}

/*
 * Folders
 *
 */

.folder > .header > .content-count {
    display: block;
    margin-top: 3px;
    margin-left: 41px;
}

.folder > .header > .actions {
    float: right;
    margin-right: 5px;
}

.folder > .header > .actions > div {
  display: inline-block;
  margin-right: 10px;
}

.folder > .header > .child {
    background-color: rgb(200,200,200);
    border-radius: 10px;
    margin-left: 41px;
    margin-right: 50px;
    min-width: 35%;
    padding-right: 26px;
    float: right;
    color: rgb(90,90,90);
    clear: both;
    position: relative;
}
.folder > .header > .child h1:first-child {
    margin-top: 0;
}
.folder > .header > .child > * {
    background-color: white;
    border-right: 1px solid black;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}
.folder > .header > .child * {
    position: relative;
    color: rgb(90,90,90);
}

.folder > .content {
    margin-left: 13px;
    border-left: 1px solid rgb(90,90,90);
}

.new_folder img, .new_folder span {
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}
.new_folder span {
    margin-left: 10px;
}

.folder {
    margin: 4px 0px;
}

.folder > .header {
    padding: 5px 0px;
    overflow: hidden;
}

.folder > .header > * {
    vertical-align: middle;
    display: inline-block;
}

.folder > .header > .toggle {
    margin-right: 5px;
}

.folder > .header > .name {
    font-weight: bold;
    margin: 0 15px;
}


.folder {
    background-color: rgb(240,240,240);
    border-radius: 6px 6px 0 0;
    margin-right: 5px;
}

.folder.toplevel {
    border: 1px solid rgb(90,90,90);
}

.folder > .header {
    background-color: rgb(219,218,217);
    border-radius: 6px 6px 0 0;
    border-bottom: 1px solid rgb(90,90,90);
}

.folder .content .folder > .header {
    border-radius: 6px 6px 0 0;
    border: 1px solid rgb(90,90,90);
}

.folder > .content {
    padding-bottom: 5px;
}
.folder .folder > .content {
    border-bottom: 1px solid rgb(90,90,90);
    border-right: 1px solid rgb(90,90,90);
}

.folder > .header > .action {
    display: inline-block;

    background-repeat: no-repeat;
    background-position: center;
    width: 16px;
    height: 16px;

    margin-right: 5px;
    margin-left: 5px;

    /* hide text */
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}
.folder > .header > .action.closed {
    background-image: url('../../img/plus-dark.png');
}
.folder > .header > .action.open {
    background-image: url('../../img/minus-dark.png');
}

/* sub folders and file content */

.subfolders > .entry > .fs_tree {
    top: 21px;
}

.entry {
    width: 100%;
}
.entry > .file {
    margin-bottom: 2px;
}
.entry > .fs_tree {
    display: block;
    vertical-align: top;
    width: 13px;
    border: none;
    border-top: 1px solid rgb(90,90,90);
    height: 1px;
    position: relative;
    top: 18px;
}

.entry > * {
    display: inline-block;
}

.new-entry > .file {
    background-color: rgb(200, 240, 200);
}
.new-entry > .file:hover {
    background-color: rgb(190, 230, 190);
}

/*
 * Rights management
 *
 */

.user_management {
    padding: 10px;
}

.user_management form {
    border: 1px dotted rgb(90,90,90);;
    padding: 5px;
    margin: 0 0 0 20px;
    display: inline-block;
}

.user_management .user_list {
    list-style-type: none;
    padding-left: 0;
    margin-bottom: -5px;
}

.user_management .user_list form {
    position: relative;
    display: block;
    margin: 5px;
    max-width: 500px;
}
.user_management .user_list form > input[type="submit"],
.user_management .user_list form > label {
    display: block;
}
.user_management .user_list form > input[type="submit"] {
    margin-top: 5px;
    font-size: 14px;
}

.user_management .user_list li {
    margin-bottom: 5px;
}

.user_management .user_list a {
    cursor: pointer;
}

/* style for different rights */
.user_management .user_list .username .name {
    font-style: italic;
}
.user_management .user_list .username.can_write .name {
    font-style: normal;
}
.user_management .user_list .username.can_ewrite .name,
.user_management .user_list .username.can_delete .name,
.user_management .user_list .username.can_edelete .name,
.user_management .user_list .username.can_protect .name,
.user_management .user_list .username.can_crypto .name {
    font-style: normal;
    font-weight: bold;
}

.user {
  overflow: hidden;
  border: 1px solid rgb(90,90,90);
  border-radius: 5px;
  padding: 5px;
}

.user > * {
  display: inline;
}

.user > .remove_user img {
    position: relative;
    top: 2px;
    padding-right: 5px;
}

.user > .actions {
    margin-left: 10px;
    float: right;
}
.user > .actions .action {
  margin-left: 5px;
}

.user > .actions .remove_user img {
  width: 16px;
  height: 16px;
  vertical-align: middle;
}

.user > .actions .expand_custom:not(:empty) {
    display: inline-block;
    padding-left: 5px;
    font-size: 18px;
    position: relative;
    top: 2px;
    width: 16px;
    height: 16px;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center;
}

.user > .actions .expand_custom:not(.open) {
    background-image: url('../../img/plus-dark.png');
}
.user > .actions .expand_custom.open {
    background-image: url('../../img/minus-dark.png');
}

.user > .child form.user_administration label {
    display: inline-block;
    width: 200px;
}
.user > .child form.user_administration input[type="password"],
.user > .child form.user_administration input[type="text"] {
    width: 200px;
}

/*
 * File Upload
 *
 */

.folder .files .action img {
  margin-right: 5px;
  vertical-align: top;
}

.folder .files .action span {
  text-decoration: underline;
  vertical-align: top;
}

.folder > .header > .child .fileupload {
    padding: 2px;
    margin: 0;
}
.folder > .header > .child .fileupload .info {
    margin: 0;
}

.fileupload .file > div {
  /* display: block; */
}

.folder > .header {
    position: relative;
}

.folder > .header.droparea {
    position: relative;
}

/* Upload notification for drag & drop */

.folder > .header:before,
.folder > .header:after {
    opacity: 0;
    position: absolute;
    display: none;
}
.folder > .header.droparea:before {
    content: attr(data-uploadcaption);
    color: #205791;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    vertical-align: bottom;
    z-index: 1;
}
.folder > .header.droparea.current:before {
    color: #264409;
}
.folder > .header.droparea:after {
    content: "\A";
    /*border-radius: 15px;*/
    border: 2px dotted #205791;
    /*background: rgba(0,0,0,0.15);*/
}
.folder > .header.droparea.current:after {
    border: 2px dotted #264409;
}

.folder > .header.droparea:before,
.folder > .header.droparea:after {
    display: inline-block;
    opacity: 1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 3px;
    padding: 5px;
    padding-right: 20px;
}
.folder > .header > .actions {
    opacity: 1;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.folder > .header.droparea > .actions,
.folder > .header.droparea > .content-count
 {
    opacity: 0.2;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

.folder > .header > .child .fileupload .file {
    margin-top: 5px;
    width: 95%;
    padding: 10px;
    background: rgb(230,230,230);
}
.folder > .header > .child .upload-queue > .file:last-child {
    border-radius: 0 0 0 6px;
}

.folder > .header > .child .fileupload .file .name {
    display: inline-block;
    font-weight: bold;
    background-color: transparent;
    border: none;
    width: 300px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.folder > .header > .child .fileupload .file .actions {
    white-space: nowrap;
    float: right;
}

.folder > .header > .child .fileupload .file .actions div {
    display: inline-block;
}

.folder > .header > .child .fileupload .file .actions .progress {
  vertical-align: top;
}

.folder > .header > .child .fileupload .file .actions .progress .progress-bar {
    margin-left: 5px;
    background-color: white;
    display: inline-block;
    border: 1px solid rgb(90,90,90);
    width: 60px;
    height: 14px;
    position: relative;
}
.folder > .header > .child .fileupload .file .actions .progress .progress-bar > .progress-value {
    display: block;
    height: 14px;;
    background: rgb(120,120,120);
    position: absolute;
    top: 0;
    left: 0;
}

.folder > .header > .child .fileupload .file .actions .upload-button {
    vertical-align: top;
    margin-left: 5px;
}

.upload-controls {
    margin-bottom: 5px !important;
}

.fileuploadbutton {
    top: 0;
    display: inline-block;
    margin-right: 10px;
    background-color: rgb(200,200,200);
    border-radius: 5px;
    border: 1px solid rgb(90,90,90);
    padding: 5px 15px;
}
.folder > .header > .child .fileuploadbutton > input {
    cursor: pointer;
    margin: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.folder > .header .delete_folder {
    margin-left: 20px;
}