/*
 * $Header$
 *
 *
 * COPYRIGHT (c) 2004 by eXept Software AG
 *              All Rights Reserved
 *
 * This software is furnished under a license and may be used
 * only in accordance with the terms of that license and with the
 * inclusion of the above copyright notice.   This software may not
 * be provided or otherwise made available to, or used by, any
 * other person.  No title to or ownership of the software is
 * hereby transferred.
 */

@import "schemes/aidymo/aidymo_variables.css";

/* ------------------------------------------- COMMON TAG ELEMENTS */
html {
    margin: 0px 0px 0px 0px;
}

body {
    background-color: #FFFFFF;
    font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
    font-size: var(--commonFontSize);
    padding: 0px;
    margin: 0px;
    color: var(--commonFontColor);
}

object {
    pointer-events: none;
}

.bgWhite {
    background-color: #FFFFFF;
}

.pageRootDiv {
    width: 100%;
}

.pageDiv {
    padding-top: 4px;
    padding-left: 4px;
    padding-right: 4px;
    background-color: #FFFFFF; /* suppress being transparent */
}


.pageLeft,
.pageRight {
    position: relative;
}

.pageCenterColumn {
    position: relative;
}

.loginPageFooter {
    padding: 8px 0px;
    text-align: right;
    left: 0px;
    right: 0px;
    position: absolute;
    bottom: 0px;
}

.loginPageFooter img {
    position: relative;
    top: 3px;
}

.pageCenterContentPadded,
.invisibleTableStretched td.pageCenterContentPadded {
    padding: 40px 0px;
    text-align: center;
}

.pageLeftContent,
.pageRightContent {
    position: absolute;
    overflow: hidden;
    z-index: 10;
    top: 0px;
    bottom: 0px;
}
.pageLeftContentAddOnIfFullPageList,
.pageRightContentAddOnIfFullPageList {
    overflow: inherit;
}

.areaLeftAndRightTable {
    table-layout: fixed;
    height: 100%;
}

.pageLeft,
.pageRight,
.pageRightContent {
    width: 9px; /* same in .fullPageList */
}

.areaLeftFrame,
.areaRightFrame,
.pageFooterTopBorder {
    border-style: solid;
    border-color: var(--commonColorDark);
}

.areaLeftFrame,
.areaRightFrame {
    width: 4px;
}

.areaLeftFrame {
    border-width: 0px 1px 0px 0px;
}
.areaRightFrame {
    border-width: 0px 0px 0px 1px;
}

.moduleMenuCellDisabled {
    color: var(--moduleItemDisabledColor);
}

.areaLeftContent {
    background-color: #FFFFFF;
}
.areaLeftContent,
.invisibleTableStretched td.areaLeftContent {
    padding: 4px;
}
.areaLeftContentIfListAndNoNavigationMenu,
.invisibleTableStretched td.areaLeftContentIfListAndNoNavigationMenu {
    padding-left: 5px; // for firefox we need 1 pixel more to cover the background
}


.areaContentPaddingV,
.invisibleTableStretched td.areaContentPaddingV {
    padding-top: 4px;
}
.areaContentPaddingH,
.invisibleTableStretched td.areaContentPaddingH {
    padding-left: 4px;
}

.listOperations,
.pageLeftContent,
.pageRightContent,
.areaContentPaddingV,
.areaContentPaddingH {
    background-color: #ffffff;
}

.pageFooter,
.pageFooterIfFullPageList {
    /* the footer is initial hidden
       show it when its position has been set
       otherwise the footer flickers through the page */
    visibility: hidden;
}
.pageFooter {
    position: relative;
    bottom: 0px;
}

.pageFooterIfFullPageList {
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
}

.pageFooterContent {
    background-color: #FFFFFF; /* suppress being transparent */
    position: absolute;
    left: 0px;
    right: 0px;
    padding: 0px 4px;
}

.pageFooterTopBorder {
    border-width: 0px 0px 1px 0px;
}

.fullPageList {
    position: absolute;
    z-index: -100;
    left: 9px; /* same in .pageLeft */
    right: 0px;
}

.fullPageListHeadColumn {
    position: sticky;
    z-index: 1;
    background-color: #EEEEEE;
}

.fullPageListHeadSeparator {
    position: absolute;
    right: 0px;
    bottom: 0px;
    width: 7680px; /* 8k display */
    height: 1px;
    background-color: #FFFFFF;
}

.fullPageListLastRow {
    height: 4px;
}

.fullPageListRemainingSpaceColumn {
    height: 33px; // as height as the footer, this fixes the scroll position when history back
}

.listRemoveColumnDragTargetDiv,
.listRemoveColumnDragTargetDiv > div {
    height: 40px;
}

.listRemoveColumnDragTargetDiv {
    position: absolute;
    top: -40px;
    right: 0px;
    left: 0px;
    display: none;
    text-align: center;
    background-color: #EEEEEE;
}

.listRemoveColumnDragTargetDiv img {
    position: relative;
    top: 4px;
}

.listToggleAllMenu {
    display: none;
}

.artefactSubmitBar {
    position: sticky;
    z-index: 100;
    top: 0px;
    background-color: white;
    padding: 4px 0px;
}

/* ------------------------------------------- additional css classes to be added if required */
.pageRootDivAddOnIfFullPageList {
    position: fixed;
}

.areaTabsDivAddOnIfFullPageList {
    position: relative;
}

.pageLeftOrRightAddOnIfFullPageList {
    z-index: -2;
}

.pageLeftWidth {
    width: 9px; /* 9 because of the 1px vertical line (border) */
}

.pageLeftWidthIfNavigationMenu {
    width: 160px;
}

.pageCenterContentDivAddOnIfFullPageList {
    position: absolute;
    right: 0px;
    left: 0px;
}

.listTableIfFullPageList {
    padding-right: 9px; /* same in .pageRight */
}

.areaLeftAndRightFrameIfFullPageList {
    height: 5000px;
}

.areaTabsTable {
    display: block;
    overflow: hidden;
}

.checkToggleInList,
th .checkToggleInList {
    position: relative;
    top: 1px;
}

.checkToggleInList {
    margin: -2px 0px 0px 0px;
}

th .checkToggleInList {
    margin: -1px 0px 2px 0px;
}





.copyrightArea {
    padding: 4px;
}

.copyrightText,
.copyrightText2 {
    text-align: center;
}

.listNavigationTable {
    table-layout: fixed;
}

.pageContentColumn {
    margin: 5px;
}
.targetHeadlineContentFrame .smallFont {
    font-size: 10px;
    color: black;
    font-weight: normal;
    position: relative;
    top: 2px;
}
.targetHeadlineContentFrame .chartOptionImage {
    margin-bottom: -4px;
}
.editChartHighlightText {
    color: #BF0000;
}

form {
    display: inline;
    margin: 0px;
    padding: 0px;
}
thead,
.thead {
    font-weight: bold;
}

code {
    display: block;
    align: left;
    text-align: left;
}

.paddedContentDiv {
    padding: 20px;
}

a {
    text-decoration: none;
    cursor: hand;
    cursor: pointer;
}
a:hover {
    text-decoration: underline;
}
a:disabled {
    cursor: arrow;
    cursor: default;
}

a.sortByAnchor {
    color: var(--listTableHeaderFontColor);
    font-weight: bold;
}
a > img {
    border: 0px solid #FFFFFF;
}

img.logo {
    margin-top: 2px;
    margin-left: 2px;
}













.noWrap {
    white-space: nowrap;
}

.inlineTable {
    display: inline-block;
}

.textAreaLight {
    width: 100%;
    height: 50px;
    font-size: var(--commonFontSize);
    font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
}
.textAreaNoStyleReadOnly {
}

/* ------------------------------------------- CLASSES input */
.inputTable {
    width: 100%;
}
.inputEdit {
    position: relative;
}
.inputEdit > .ui-datepicker-trigger {
    position: absolute;

    right: -4px;
    top: 2px;
}
.inputEdit > .helpIconWithToolTip {
    position: absolute;
    margin-top: 0px;
    right: -3px;
    top: 2px;
}
.inputEdit > .inputFileField {
    position: absolute;
    margin-top: 0px;
    right: -3px;
    top: 2px;
}

.inputFileField {
    position: relative;
    overflow: hidden;
    display: inline-block;
}
.inputFileInput {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: -2;

    opacity: 0;
    -moz-opacity:0 ;
    filter:alpha(opacity: 0);

    text-align: right;

    cursor: hand;
    cursor: pointer;
}
.inputFileInput[disabled] {
    cursor: arrow;
}
.inputFileButton {
    position: relative;
    z-index: 1;
}
.inputFileForm {
    display: inline;
}
.inputFileIFrame {
    display: none;
}

.widthFixOfInputEdit,
.widthFixOfInputText,
.widthFixOfInputPassword {
    width: 5px;
}

.textBasedFieldContent {
    display: inline-block;
    padding-top: 4px;
}

input[type=Radio].inline {
    position: relative;
    top: 1px;
}

/* ####################################### icon and mouse over box */
.iconMouseOverWrapper {
    white-space: nowrap;
    display: inline-block;
    position: relative;
}
.iconMouseOverBoxRight,
.iconMouseOverBoxLeft {
    position: absolute;
    display: none;
    z-index: 999;
    top: 0px;

    padding: 4px;
    border: 1px solid #cfcfcf;                  /* lightGrey */
    background-color: #f8f8f8;                  /* veryLightGrey */
}
.iconMouseOverBoxLeft {
    top: 9px;
    right: 8px;
}
.iconMouseOverBoxRight {
    left: 16px;
}

.parameterMouseOverBox {
    width: 700px;
}
.attachmentsMouseOverBox {
    width: 240px;
}
.operationToggleColumn {
    width: 1%;
}

/* ------------------------------------------- CLASSES special */
.ui-datepicker-trigger {
    cursor: hand;
    cursor: pointer;
}
.helpIconWithToolTip {
    position: relative;
    display: inline-block;
    font-weight: normal;
    margin-top: -10px;
    cursor: help;
    top: 1px;
}
.help {
    cursor: help;
}

.addWebResourceButton {
    width: 100px;
}
.commentByProjectDemand {
    padding: 4px 0px;
}
.attachmentsLabel {
    text-align: right;
    padding-top: 2px;
    align: right;
}
.verticalSeparating {
    height: 6px;
}
.verticalPadded {
    padding: 2px 0px;
}
.bottomPadded {
    padding-bottom: 2px;
}
.topPadded {
    padding-top: 2px;
}
.topPaddedBig {
    padding-top: 4px;
}


/* ------------------------------------------- common boxes */
.infoBox,
.warningBox {
    padding: 10px;
    text-align: left;
    font-size: 10px;
    display: block;
    margin-bottom: 10px;
}
.infoBox > .title,
.warningBox > .title {
    font-size: 12px;
    font-weight: bold;
    padding-bottom: 10px;
}
.warningBox {
    border: 1px solid #666666;
    background-color: #EAEA00;
    color: #555555;                    /* darkGrey */
}

/* ------------------------------------------- CLASSES inline elements */
.editSpecCompareHint,
.editSpecCompareHint a {
    color: #da70d6; /* #da70d6; */
}

.success,
.inlineSuccess,
.inlineSuccess a {
    display: inline-block;
    color: #00AA00;
}

.hardInfo
.inlineHardInfo,
.inlineHardInfo a {
    color: #000000;
    font-weight: bold;
}
.inlineHardInfo,
.inlineHardInfo a {
    display: inline-block;
}

.warning,
.inlineWarning,
.inlineWarning a {
    color: #999000;                     /* yellowSlightlyDarkened */
    font-weight: bold;
}
.inlineWarning,
.inlineWarning a {
    display: inline-block;
}

.hardWarning,
.inlineFail,
.accountValueLT0,
.inlineHardWarning,
.inlineHardWarning a {
    color: #CC0000;
    font-weight: bold;
}
.inlineHardWarning,
.inlineHardWarning a {
    display: inline-block;
}

img.inlineStateImage {
    margin-top: -1px;
    margin-left: -2px;
    margin-right: 1px;
}
img.inlineCommentImage {
    margin-top: -1px;
    margin-left: -1px;
    margin-right: 1px;
}

.inlineImage {
    position: relative;
    top: 0px;
    margin-top: -3px;
    margin-bottom: -3px;
}
.inlineOperation {
    white-space: nowrap;
}
.inlineOperationAnchor {
    cursor: pointer;
    cursor: hand;
}
.disabled {
    color: var(--commonColorNormal);
}
.disabledInline {
    color: var(--commonColorNormal);
}
.disabledInlineOperation {
    white-space: nowrap;
    color: var(--commonColorNormal);
}

.workflowRendererDragAndDropGrid,
.interfaceLayoutDragAndDropGrid {
    margin-top: -10px;
    margin-left: -2px;
    position: relative;
    top: 4px;
}

.interfaceLayoutDragAndDropGrid {
    left: 3px;
}

/* ------------------------------------------- CLASSES common */
span.artefactLink,
a.artefactLink,
.artefactLink,
span.artefactLink:hover,
a.artefactLink:hover,
.artefactLink:hover,
span.artefactLink:visited,
a.artefactLink:visited,
.artefactLink:visited {
    color: var(--commonFontColor);
}

.floatingDivRight,
.floatingDiv {
    display: inline-block;
}
.floatingDivRight {
    float: right;
}
.floatingDiv {
    float: left;
}
.floatingDivTerminator {
    clear: both;
}
.togglesWithinFloatingDivs > .floatingDiv {
    padding-top: 6px;
    padding-right: 6px;
}

/* ------------------------------------------- COMMON WIDTH */
.fixWidth {
    width: 200px;
}
.fixWidthTiny {
    width: 100px;
}
.fixWidthSmallX {
    width: 130px;
}
.fixWidthSmall {
    width: 160px;
}
.fixWidthLarge {
    width: 240px;
}
.fixWidthVeryLarge {
    width: 300px;
}

.fullWidth {
    width: 100%;
}

/* ------------------------------------------- TABLE IN EDIT */
th {
    color: var(--listTableHeaderFontColor);
}

.tableInEdit {
    width: 100%;
    background-color: #f6f6f6;
}

.tableInEdit > tr > td,
.tableInEdit > tbody > tr > td,
.tableInEdit > tr > th,
.tableInEdit > tbody > tr > th {
    align: left;
    text-align: left;
    vertical-align: top;
    border-top: 1px solid #cfcfcf;              /* lightGrey */
}
.tableInEdit > tr > th:first-child,
.tableInEdit > tbody > tr > th:first-child,
.tableInEdit > tr > td:first-child,
.tableInEdit > tbody > tr > td:first-child {
    padding-left: 4px;
}
.tableInEdit > tr > th:last-child,
.tableInEdit > tbody > tr > th:last-child,
.tableInEdit > tr > td:last-child,
.tableInEdit > tbody > tr > td:last-child {
    padding-right: 4px;
    border-right: 1px solid #cfcfcf;            /* lightGrey */
}
.tableInEdit > tr > td,
.tableInEdit > tbody > tr > td,
.tableInEdit > tr > th,
.tableInEdit > tbody > tr > th,
.tableInEdit > tr > th.notFirst,
.tableInEdit > tbody > tr > th.notFirst,
.tableInEdit > tr > td.notFirst,
.tableInEdit > tbody > tr > td.notFirst {
    padding: 2px;
    padding-top: 4px;
    padding-bottom: 4px;
}
.tableInEdit > tr > td.noTopBorder,
.tableInEdit > tbody > tr > td.noTopBorder,
.tableInEdit > tr > th.noTopBorder,
.tableInEdit > tbody > tr > th.noTopBorder {
    border-top: 0px solid #cfcfcf;              /*  lightGrey */
}
.tableInEdit .noPadding {
    padding: 0px 0px 0px 0px;
}
.tableInEdit .noHeightHack {
    font-size: 0px;
}
.tableInEdit .paddingRowSmall,
.invisibleTable .paddingRowSmall,
.invisibleTableStretched .paddingRowSmall {
    height: 8px;
}
.tableInEdit .paddingRowMedium,
.invisibleTable .paddingRowMedium,
.invisibleTableStretched .paddingRowMedium {
    height: 16px;
}
.tableInEdit .paddingRowLarge,
.invisibleTable .paddingRowLarge,
.invisibleTableStretched .paddingRowLarge {
    height: 24px;
}
.paddedLeftColumn,
.tableInEdit .paddedLeftColumn {
    padding-left: 4px;
}

.verticalSplitter,
.tableInEdit .verticalSplitter {
    width: 4px;
}

.horizontalSplitter,
.tableInEdit .horizontalSplitter {
    height: 4px;
}

.tableInEdit .inlineCheckBox {
    position: relative;
    top: 2px;
    margin-top: -2px;
}
.tableInEdit .inlineImage {
    position: relative;
    top: 1px;
    margin-top: -3px;
    margin-bottom: -3px;
}

.separatorBackground,
.separatorBackgroundInNestedTable {
    background-color: #cfcfcf;              /* lightGrey */
    position: relative;
    height: 14px;
}

.separatorBackground {
    top: 2px;
    margin-left: -2px;
    margin-right: -1px;
}

.separatorBackgroundInNestedTable {
    top: -1px;
    margin-right: -2px;
}

.invisibleTableStretched {
    width: 100%;
}
.invisibleTable,
.invisibleTableStretched {
    border-width: 0px;
    border-spacing: 0px;
    border-style: none;
    border-collapse: separate;
}
.invisibleTable > thead > tr > th,
.invisibleTable > tbody > tr > th,
.invisibleTable > tr > th,
.invisibleTableStretched > thead > tr > th,
.invisibleTableStretched > tbody > tr > th,
.invisibleTableStretched > tr > th,
.invisibleTable > thead > tr > td,
.invisibleTable > tbody > tr > td,
.invisibleTable > tr > td,
.invisibleTableStretched > thead > tr > td,
.invisibleTableStretched > tbody > tr > td,
.invisibleTableStretched > tr > td {
    padding: 0px;
    vertical-align: top;
}

.left,
.tableInEdit td.left,
.invisibleTable td.left,
.invisibleTableStretched td.left {
    align: left;
    text-align: left;
}
.right,
.tableInEdit td.right,
.invisibleTable td.right,
.invisibleTableStretched td.right {
    align: right;
    text-align: right;
}
.center,
.tableInEdit td.center,
.invisibleTable td.center,
.invisibleTableStretched td.center {
    margin-left: auto;
    margin-right: auto;
    align: center;
    text-align: center;
}
.top,
.tableInEdit .top,
.invisibleTable .top,
.invisibleTableStretched .top {
    vertical-align: top;
}
.middle
.tableInEdit .middle,
.invisibleTable .middle,
.invisibleTableStretched .middle {
    vertical-align: middle;
}
.bottom,
.tableInEdit td.bottom,
.invisibleTable td.bottom,
.invisibleTableStretched td.bottom {
    vertical-align: bottom;
}


.listTable {
    width: 100%;
}
.listTable > tr > th,
.listTable > tr > td,
.listTable > thead > tr > th,
.listTable > thead > tr > td,
.listTable > tbody > tr > th,
.listTable > tbody > tr > td {
    align: left;
    text-align: left;
    padding-left: var(--listTableColumnPadding);
    padding-top: var(--listTableColumnPadding);
    padding-bottom: var(--listTableColumnPadding);
}
.listTable > tr > th:first-child,
.listTable > tr > td:first-child,
.listTable > tbody > tr > th:first-child,
.listTable > tbody > tr > td:first-child {
    padding-left: 3px;
}
.listTable > tr > th:last-child,
.listTable > tr > td:last-child,
.listTable > tbody > tr > th:last-child,
.listTable > tbody > tr > td:last-child {
    align: right;
    text-align: right;
    padding-right: 3px;
}
.listTable > tr:nth-child(odd),
.listTable > tbody > tr:nth-child(odd) {
    background: var(--listTableOddRowBackgroundColor);
}
.listTable > tr.listRowWithLink:hover,
.listTable > tbody > tr.listRowWithLink:hover {
    cursor: pointer;
    background: #cccccc;
}
.asHeightAsContent,
.listTable td.asHeightAsContent,
.listTable th.asHeightAsContent,
.tableInEdit td.asHeightAsContent,
.tableInEdit th.asHeightAsContent,
.invisibleTable td.asHeightAsContent,
.invisibleTable th.asHeightAsContent,
.invisibleTableStretched td.asHeightAsContent,
.invisibleTableStretched th.asHeightAsContent {
    height: 1px;
}
.asWidthAsContent,
.listTable td.asWidthAsContent,
.listTable th.asWidthAsContent,
.tableInEdit td.asWidthAsContent,
.tableInEdit th.asWidthAsContent,
.invisibleTable td.asWidthAsContent,
.invisibleTable th.asWidthAsContent,
.invisibleTableStretched td.asWidthAsContent,
.invisibleTableStretched th.asWidthAsContent {
    white-space: nowrap;
    width: 1px;
}
.listTable th,
.listTable tr th,
.listTable thead tr th {
    word-break: keep-all;
}
.listTable .hierarchicalToggleColumn,
.listTable .moveUpDownColumn {
    white-space: nowrap;
    width: 1px;
}
.listTable .hierarchicalToggleColumn {
    padding-right: 3px;
}
.listTable .moveUpDownColumn {
    padding-right: 0px;
}
.listTable .hierarchicalToggleColumn img {
    position: relative;
    top: 1px;
}
.listTable .hierarchicalToggleHeadColumn img {
    position: relative;
    top: 3px;
}



.emptyColumn {
    width: 30%;
}
.paddedTable > tr > td,
.paddedTable > tbody > tr > td {
    padding-left: 4px;
}
.paddedTable > tr > td:first-child,
.paddedTable > tbody > tr > td:first-child {
    padding-left: 0px;
}

/* ------------------------------------------- PAGE STRUCTURE CONTAINER */

.area,
.paddedArea {
    border-top: 0;
    border-right: 1px solid var(--commonColorDark);
    border-left: 1px solid var(--commonColorDark);
    border-bottom: 1px solid var(--commonColorDark);
}

.paddedArea {
    padding: 40px;
    align: center;
    text-align: center;
}

.navigationMenuIcon {
    height: 16px;
    width: 16px;
    padding-right: 4px;
    margin: -3px 0px;
}
.navigationItemTable .monochromIcon {
    filter: var(--commonFontColorFilter);
}
.activeNavigationItem .monochromIcon {
    filter: var(--highlightColorLightFilter);
}

.smallIcon {
    width: 16px;
    height: 16px;
}

.navigationMenuColumn {
    padding-right: 4px;
    width: 150px;
}
.navigationMenuMinWidthDiv {
    width: 70px;
}

.collapsedRow {
    display: none;
}
.expandedRow {
}

.shownNavigationItem {
    margin-top: 2px;
    margin-left: 2px;
    margin-right: 2px;
    margin-bottom: 2px;
}




.titleArea {                                /* wrapping div of .titleAreaTable */
    align: center;
}
.titleAreaTable {                           /* expeccoNET logo  |  project filter, roles  |  database info, active session */
    layout: fixed;
    width: 100%;
}
.areaComponentTable {                       /* the area table  |  on the left side is the navigation menu  |  on the right, the list or edit content */
    // layout: fixed;
    width: 100%;
    padding: 0;
    margin: 0;
}
.operationButtonsDiv {                      /* the div around the operation buttons  |  for both buttons, those from list view and those from edit view */
    padding: 4px 0px;
}



.operationSummary {
    padding: 20px;
    align: center;
    text-align: center;
}
.operationSummaryTable {
    width: 400px;
    margin-left: auto;
    margin-right: auto;
}
.operationSummaryTitle {
    align: left;
    text-align: left;
    font-size: 14px;
    font-weight: bold;
    padding-bottom: 10px;
}
.operationSummaryArtefactListTitle {
    font-size: 12px;
    padding-bottom: 2px;
}



/* ------------------------------------------- artefactFormTable */
.artefactFormDiv {
    padding: 0px 20px;
}
.artefactFormTable {
    width: 100%;
}
.artefactFormTable > tr > td,
.artefactFormTable > thead > tr > td,
.artefactFormTable > tbody > tr > td {
    padding: 0px 2px;
}
.artefactFormTable > tr > td:first-child,
.artefactFormTable > thead > tr > td:first-child,
.artefactFormTable > tbody > tr > td:first-child {
    padding-left: 0px;
}
.artefactFormTable > tr > td:last-child,
.artefactFormTable > thead > tr > td:last-child,
.artefactFormTable > tbody > tr > td:last-child {
    padding-right: 0px;
}

.entryFormLabel { /* without padding */
    font-weight: bold;
    color: #555555;
}
.entryFormColumn,
.entryFormLabelColumn,
.entryFormLabelColumnInvalidValue,
.entryFormLabelColumnDiffersFromArtefactToCompare {
    vertical-align: top;
    position: relative;
    top: 4px;
}

.entryFormLabelColumn,
.entryFormLabelColumnInvalidValue,
.entryFormLabelColumnDiffersFromArtefactToCompare {
    align: right;
    text-align: right;
}

.entryFormDataColumn,
.entryFormDataColumnForArtefactToCompare {
    vertical-align: top;
}
.entryFormDataColumn > span,
.entryFormDataColumn > a {
    display: inline-block;
    margin-top: 4px;
}
.entryFormDataColumnForArtefactToCompare {
    margin-top: 1px;
    margin-bottom: 20px;
    border-left: 3px solid #da70d6; /* #da70d6; editSpecCompareHint */
    padding-left: 1px;
}

.label {
    font-weight: bold;
}

.label,
.labelLink,
.labelLink:hover,
.labelLink:active,
.labelLink:focus,
.labelLink:visited,
.activeNavigationItem,
.activeNavigationItem a,
.inactiveNavigationItem,
.inactiveNavigationItem a {
    color: var(--commonFontColor);
}
.disabledNavigationItem {
    cursor: default;
    color: var(--commonColorNormal);
}

.entryFormLabelColumnInvalidValue,
.entryFormLabelColumnInvalidValue .labelLink {
    font-weight: bold;
    text-color: red;
    color: red;
}
.entryFormLabelColumnDiffersFromArtefactToCompare,
.entryFormLabelColumnDiffersFromArtefactToCompare .labelLink {
    font-weight: bold;
    text-color: #da70d6; /* #da70d6 same as editSpecCompareHint */
    color: #da70d6; /* #da70d6 same as editSpecCompareHint */
}
.emptyRow {
    height: 22px;
    align: left;
    text-align: left;
    color: #555;
    font-style: italic;
}

.emptyRowInvisible {
    display: none;
}
/* ------------------------------------------- COMMON STUFF FOR UI */
.comment_headline {
    margin-bottom: 6px;
}

/* ------------------------------------------- FIELD BUILDER STUFF */

.fieldValidationReport,
.fieldWarningReport,
.fieldInformationReport {
    width: auto;
    padding: 15px;
}
.fieldValidationReport {
    background: #fcc;
    border: 1px solid #d77;
}
.fieldInformationReport {
    background: #ccccff;
    border: 1px solid #5555ff;
}
.fieldWarningReport {
    background: #FFFFCE;
    border: 1px solid #8C8C00;
}

.fieldValidationReport .fieldReportTitle,
.fieldValidationReport .fieldReportLabel,
.fieldWarningReport .fieldReportTitle,
.fieldWarningReport .fieldReportLabel,
.fieldInformationReport .fieldReportTitle,
.fieldInformationReport .fieldReportLabel {
    font-weight: bold;
}
.fieldValidationReport li,
.fieldWarningReport li,
.fieldInformationReport li {
    padding-top: 10px;
    padding-left: 20px;
    list-style: none;
}
.fieldValidationReport ul,
.fieldWarningReport ul,
.fieldInformationReport ul {
    margin: 0;
    padding: 0;
}
.fieldValidationReport .artefactLink,
.fieldWarningReport .artefactLink,
.fieldInformationReport .artefactLink {
    color: var(--highlightColorNormal);
}

/* ------------------------------------------- ACCOUNTING STUFF */


.tableHeadline {
    color: var(--listTableHeaderFontColor);
}

.tableHeadline a {
    color: var(--listTableHeaderFontColor);
}






.plusMinusColumn {
    width: 20px;
    padding: 4px;
}


/* ------------------------------------------- test reservation */
.pane {
    layout: fixed;
    min-width: 201px;
    background-color: #EEEEEE;
    border-right: 1px solid #FFFFFF;
}
.pane[name="time"] {
    min-width: 71px;
}
.paneHeader {
    height: 31px;
    padding: 2px;
    background-color: #CCCCCC;
    border-bottom: 1px solid #FFFFFF;
}
.paneBody {
    position: relative;
}

.paneRow {
    overflow: hidden;
    border-bottom: 1px solid #FFFFFF;
}
.paneRow:last-child {
    border-bottom: 1px solid #EEEEEE;
}

/* ------------------------------------------- */
/* <1>e</1> <2>x<2> <3>pecco<3> <4>NET<4> <5>(R)<5> */

.appTitle1,
.appTitle2,
.appTitle3,
.appTitle4 {
    font-weight: bold;
}

.appTitle1,
.appTitle3,
.appTitle4,
.appTitle5 {
    color: #3E7EA0;
}
.appTitle2 {
    color: #000000;
    text-decoration: underline;
}
.appTitle5 {
    position: relative;
    font-weight: bold;
    font-size: 20px;

    top: -28px;
    left: 12px;
}
.titleStatus1 {
	vertical-align: bottom;
	align: right;
	text-align: right;
}
.titleStatus1Upper {
	align: right;
	text-align: right;
}
.titleStatus1Lower {
	align: right;
	text-align: right;
}

.titleStatus2 {
	vertical-align: bottom;
	align: right;
}
.titleStatus2Upper {
	text-align: right;
}
.titleStatus2Lower {
	align: left;
	text-align: left;
}
.titleLabel {
    font-weight: bold;
    color: #555555;                             /* darkGrey */
}
.documentGenerationTime {
	display: none;
}

.accountValueLow {
	font-weight: bold;
//        background: #FF0000;   /* red */
//        color: #000000;
	color: #FF0000;          /* red */
}

.accountValueMedium {
	font-weight: bold;
//        background: #FFFF00;   /* yellow */
//        color: #000000;
	color: #7F7F00;          /* yellow-darkened */
}

.accountValueNormal {
//        background: #0000FF;   /* green */
//        color: #000000;
	color: #007F00;          /* green-darkened */
}

/* ------------------------------------------- */

.moduleMenuPost,
.moduleMenuPostPost,
.noModuleMenuDiv,
.areaTabsDivPost {
    display: none;
}

table.moduleMenuTable {
    width: 100%;
    border: 0;
}

.moduleMenuCell table {
	margin-left: auto;
	margin-right: auto;
}

.moduleMenuCellMiddleTop {
	text-align: center;
}
.moduleMenuCellMiddleBottom {
	text-align: center;
    white-space: nowrap;
}

.moduleMenuCellPassive {
	padding: 2px;
}
.moduleMenuCellActive {
	padding: 2px;
}
.moduleMenuCellDisabled {
	padding: 2px;
}

.moduleMenuCellLeft , .moduleMenuCellRight {
	display: none;
}

/* ------------------------------------------- */

td.areaTabActive {
	padding-left: 4px;
}
td.areaTabInactive {
	padding-left: 4px;
}
td.areaTabLast {
    width: 100%;
}
.areaTabActive img,
.areaTabActive object,
.areaTabInactive img,
.areaTabInactive object {
    position: relative;
    top: -5px;
    left: -5px;
    margin: -8px -1px;
}

/* ------------------------------------------- */


.noModuleArea {
	padding: 0;
	margin: 0;
	padding-bottom: 4px;
}

/* ------------------------------------------- */

.activeNavigationItem {
    background-color: var(--commonColorNormal);
}
.inactiveNavigationItem {
    background-color: var(--commonColorLight);
}
.disabledNavigationItem {
    background-color: var(--commonColorLight);
}


.activeNavigationItem,
.inactiveNavigationItem,
.disabledNavigationItem {
    padding: 2px;
}

/* ------------------------------------------- */

.helpTextDiv {
	width: 100% ;
}

.helpTextFrame {
	background-color: #FFFFFF;
	color: #000000;
	width: 100% ;
	height: 450px ;
}

/* ------------------------------------------- */

.settingsTable {
	border: 0;
	width: 100%;
}

.settingsLabelColumn {
    padding-right: 2px;
}
form input[type=checkbox] {
	margin-left: 0;
}

.rowSeparatorInRolesForm {
	height: 10px;
}

.rowSeparatorInSettings {
	height: 3px;
}

/* ------------------------------------------- */

.boxFrameInEditor {
    border: 1px solid var(--commonColorDark);
}

.headColInBoxFrameInEditor {
    border-right: 1px solid #EAEAEA;
    border-bottom: 1px solid #888888;
}

.lastHeadColInBoxFrameInEditor {
    border-bottom: 1px solid #888888;
}

.colInBoxFrameInEditor {
    border-right: 1px solid #EAEAEA;
    border-bottom: 1px solid #EAEAEA;
}

/* ------------------------------------------- */

table.listTableTitleTable , table.listTableControlTable {
	border: 0;
	width: 100%;
}


.keyValueTableHeadColumn1 {
    border-right: 1px solid #888888;
    border-bottom: 1px solid #555555;            /* darkGrey */
    font-weight: bold;
    text-align: left;
    padding: 2px;
    color: #555555;
}

.keyValueTableHeadColumn2 {
    border-bottom: 1px solid #555555;       /* darkGrey */
    font-weight: bold;
    text-align: right;
    padding: 2px;
    color: #555555;                           /* darkGrey */
}

.keyValueTableColumn1 {
    border-right: 1px solid #888888;
    border-bottom: 1px solid #888888;
}

.keyValueTableColumn1_bottom {
    border-right: 1px solid #888888;
    border-bottom: 1px solid #000000;
}

.keyValueTableColumn2 {
    border-bottom: 1px solid #888888;
    text-align: right;
}
.keyValueTableColumn2_bottom {
    border-bottom: 1px solid #000000;
    text-align: right;
}

.keyValueTableColumn3 {
    text-align: left;
}

.keyValueTableColumn4 {
    text-align: right;
}

.keyValueTableColumn5 {
    border-bottom: 1px solid #888888;
    text-align: left;
}
.keyValueTableColumn5_bottom {
    border-bottom: 1px solid #000000;
    text-align: left;
}

.tablePrintButton {
	text-align:     right;
}

.tableFilter {
	text-align:     right;
	float:right;
	/*width:          400px;*/
}

.tableFilter2 {
	text-align:     right;
}

.tableTitle {
	font-size: 13px;
}

th.tableTitle {
	text-align: left;
	padding: 2px;
}

th.tableFilter {
	text-align: right;
	padding: 2px;
}


.tableFilterInput {
	padding: 0px;
	text-align: right;
}
.tableFilterInputLeft {
	padding: 0px;
}
.tableFilterInputMiddle1 {
	padding: 0px;
	padding-top: 2px;
	padding-right: 2px;
	padding-left: 4px;
	background-color: #FFFFFF;
	border: 0px solid #FFFFFF;
	margin: 0px;
	vertical-align: middle;
}
.tableFilterInputMiddle1 select {
	font-size: 0.7em;
	padding: 0px;
	margin: 0px;
	vertical-align: middle;
	color: #9F9F9F;
	border: 0px solid #FFFFFF;
	border-left: 1px solid #CFCFCF;
	background-color: #FFFFFF;
}

.tableFilterInputMiddle2 {
	padding: 0px;
	background-color: #FFFFFF;
}
.tableFilterInputMiddle2 input {
	border: 0px solid #FFFFFF;
}
.tableFilterInputMiddle3 {
	padding: 0px;
	background-color: #FFFFFF;
}
.tableFilterInputMiddle4 {
	padding: 0px;
	background-color: #FFFFFF;
}
.tableFilterInputMiddle3 select {
	font-size: 0.7em;
	padding: 0px;
	margin: 0px;
	vertical-align: center;
	color: #9F9F9F;
	border: 0px solid #FFFFFF;
	border-left: 1px solid #CFCFCF;
	background-color: #FFFFFF;
}
.tableFilterInputMiddle4 select {
	font-size: 0.7em;
	padding: 0px;
	margin: 0px;
	vertical-align: center;
	color: #9F9F9F;
	border: 0px solid #FFFFFF;
	background-color: #FFFFFF;
}
.tableFilterInputRight {
	padding: 0px;
}


.listTableRow1 {
	background-color: #FFFFFF;
	background-color: #aaaaaa;
}

.listTableRow2 {
	background-color: #ECECEC;
	background-color: #aaaaaa;
}

.listTableRow1 td {
	background-color: #FFFFFF;
	padding-top: 2px;
	padding-bottom: 2px;
	margin: 1px;
	padding: 1px;
}
.listTableRow2 td {
	background-color: #ECECEC;
	padding-top: 2px;
	padding-bottom: 2px;
	margin: 1px;
	padding: 1px;
}

.artefactEditControlDiv {
	padding-top: 4px;
	padding-bottom: 4px;
}

.artefactEditControlItem {
	padding: 2px;
	margin-left: auto;
	margin-right: auto;
	align: center;
}
.artefactEditControlItem input {
	width: 100%;
}

.disabledArtefactEditControlItem {
	padding: 2px;
	margin-left: auto;
	margin-right: auto;
	align: center;
}

/* ------------------------------------------- */

.commentListTableRow td {
	border-top: 1px dashed #000000;
}

.commentFirstListTableRow td {
}

/* ------------------------------------------- */

.artefactFormDiv {
    min-width: 600px;
}

.settingsDiv {
	min-width: 400px;
/*        overflow: hidden; */
}

/* ------------------------------------------- */

.formSubmitTableRightCell {
    text-align: right;
    align: right;
}

.formPreviousButtonColumn {
	valign: middle;
}
.formPreviousButtonColumnTable {
	valign: middle;
}
.formPreviousButtonMiddleColumn {
	valign: middle;
}

.formSubmitButtonColumn {
	valign: middle;
}
.formSubmitButtonColumnTable {
	valign: middle;
}
.formSubmitButtonMiddleColumn {
	valign: middle;
}

.formNextButtonColumn {
	valign: middle;
}
.formNextButtonColumnTable {
	valign: middle;
}
.formNextButtonMiddleColumn {
	valign: middle;
}

/* ------------------------------------------- */

.pingStateOk {
    color: #00BF00;                 /* greenSlightlyDarkened */
}
.pingStateUnreachable,
.pingStateUnknown {
    color: #BF5F00;                 /* orangeSlightlyDarkened */
}
.pingStateInQueue,
.pingStateConnecting {
    color: #FF7F00;                 /* orangeNormal */
}
.pingStateDisabled {
    font-weight: bold;
    color: #00A0C8;
}
.pingStateIncompatibleExpecco,
.pingStateLicenseBecameInvalid,
.pingStateNoTestCenterLicense,
.pingStateError {
    font-weight: bold;
    color: #BF0000;                 /* redSlightlyDarkened */
}



.highPrioHighlightText .inlineOperationAnchor,
.highPrioHighlightText {
    font-weight: bold;
    color: #BF0000;                 /* redSlightlyDarkened */
}



.ratingLowest {
    font-weight: bold;
    color: #5F5F5F;
}
.ratingLow {
    font-weight: bold;
    color: #00A0C8;
}
.ratingNormal {
    font-weight: bold;
    color: #00C8A0;
}
.ratingMedium {
    font-weight: bold;
    color: #FF7F00;
}
.ratingHigh {
    font-weight: bold;
    color: #FF0000;
}
.ratingHighest {
    font-weight: bold;
    color: #FF007F;
}
.ratingUltraHigh {
    font-weight: bold;
    color: #FF007F;
}

.ratingLowestBox {
    background-color: #5F5F5F;
}
.ratingLowBox {
    background-color: #00A0C8;
}
.ratingNormalBox {
    background-color: #00C8A0;
}
.ratingMediumBox {
    background-color: #FF7F00;
}
.ratingHighBox {
    background-color: #FF0000;
}
.ratingHighestBox {
    background-color: #FF007F;
}
.ratingUltraHighBox {
    background-color: #FF007F;
}

.severityLow {
	font-weight: bold;
	color: #00A0C8;
}
.severityMedium {
	font-weight: bold;
	color: #FF7F00;
}
.severityHigh {
	font-weight: bold;
	color: #FF0000;
}

.defectSeverityEnhancement {
	font-weight: bold;
	color: #00C8A0;
}
.defectSeverityTrivial {
	font-weight: bold;
	color: #00A0C8;
}
.defectSeverityMinor {
	font-weight: bold;
	color: #FF7F00;
}
.defectSeverityNormal {
	font-weight: bold;
	color: #FF7F00;
}
.defectSeverityMajor {
	font-weight: bold;
	color: #FF0000;
}
.defectSeverityCritical {
	font-weight: bold;
	color: #FF007F;
}

.defectSeverityBlocker {
	font-weight: bold;
	color: #FF007F;
}

.actionItemStateOpen {
	font-weight: bold;
	color: #FF0000;
}
.actionItemStateClosed {
	// font-weight: bold;
	// color: #5F5F5F;
}
.actionItemStateInProgress {
	font-weight: bold;
	color: #00C8A0;
}

.meetingStateCancelled {
	font-weight: bold;
	color: #FF0000;
}

.meetingStateFinished {
	// font-weight: bold;
	color: #5F5F5F;
}

.meetingStateRejected {
	// font-weight: bold;
	color: #FF5F5F;
}

.meetingStateReDated {
	// font-weight: bold;
	color: #9F2F2F;
}

.meetingStateFixed {
	// font-weight: bold;
	color: #5F5F5F;
}

.requirementStateOpen {
	font-weight: bold;
	color: #7F0000;
}
.requirementStateProposed {
	font-weight: bold;
	color: #7F0000;
}

.requirementStateAnalystAssigned {
	font-weight: bold;
	color: #7F0000;
}

.requirementStateOnAnalysis {
	font-weight: bold;
	color: #7F0000;
}

.requirementStateNeedsMoreInfoForAnalysis {
	font-weight: bold;
	color: #0000FF;
}

.requirementStateAnalyzed {
	font-weight: bold;
	color: #7F0000;
}

.requirementStateDuplicate {
	font-weight: bold;
	color: #3F3F3F;
}

.requirementStateEstimationAccepted {
	font-weight: bold;
	color: #7F0000;
}

.requirementStateEstimationRejected {
	font-weight: bold;
	color: #FF0000;
}

.requirementStateDeveloperAssigned {
	font-weight: bold;
	color: #9F5F00;
}

.requirementStateOnDevelopment {
	font-weight: bold;
	color: #9F5F00;
}

.requirementStateNeedsMoreInfoForDevelopment {
	font-weight: bold;
	color: #0000FF;
}

.requirementStateDeveloped {
	font-weight: bold;
	color: #EF6F00;
}

.requirementStateTesterAssigned {
	font-weight: bold;
	color: #EF6F00;
}

.requirementStateOnTesting {
	font-weight: bold;
	color: #EF6F00;
}

.requirementStateNeedsMoreInfoForTesting {
	font-weight: bold;
	color: #0000FF;
}

.requirementStateDevelopmentRejected {
	font-weight: bold;
	color: #FF0000;
}

.requirementStateVerified {
	font-weight: bold;
	color: #007F00;
}

.requirementStateInstalled {
	font-weight: bold;
	color: #007F00;
}

.requirementStateCancelled {
	font-weight: bold;
	color: #3F3F3F;
}

.requirementStateClosed {
	font-weight: bold;
	color: #3F3F3F;
}
.requirementStateInProgress {
	font-weight: bold;
	color: #00C8A0;
}
.defectStateOpen {
	font-weight: bold;
	color: #FF0000;
}
.defectStateReopened {
	font-weight: bold;
	color: #FF007F;
}
.defectStateClosed {
	// xxfont-weight: bold;
	// xxcolor: #5F5F5F;
}
.defectStateInProgress {
	font-weight: bold;
	color: #00C8A0;
}

.testCaseStateSuccess {
	font-weight: bold;
	color: #009F00;
}
.testCaseStatePartialSuccess {
	font-weight: bold;
	color: #FF7F00;
}
.testCaseStateNeverRun {
	font-weight: bold;
	color: #5F5F5F;
}
.testCaseStateFailure {
	font-weight: bold;
	color: #FF0000;
}
.testCaseStateNotExecutable {
	font-weight: bold;
	color: #FF0000;
}
.testCaseStateUndecided {
	font-weight: bold;
	color: #5F5F5F;
}
.testCaseStateExecuting {
	font-weight: bold;
	color: #5F5F3F;
}
.testCaseStateError {
	font-weight: bold;
	color: #FF0000;
}
.overallStatusOk{
	font-weight: bold;
	color: #009F00;
}
.overallStatusNeverExecuted{
	font-weight: bold;
	color: #5F5F5F;
}
.overallStatusFailed{
	font-weight: bold;
	color: #FF0000;
}
.overallStatusConnecting{
	font-weight: bold;
	color: #FF0000;
}
.overallStatusUnreachable{
	font-weight: bold;
	color: #5F5F5F;
}
.overallStatusExecuting{
	font-weight: bold;
	color: #5F5F3F;
}
.overallStatusError{
	font-weight: bold;
	color: #FF0000;
}
.projectStateOpen {
	// xxfont-weight: bold;
	// xxcolor: #FF0000;
}
.projectStateApplied {
	// xxfont-weight: bold;
	// xxcolor: #FF0000;
}
.projectStateAuthorized {
	// xxfont-weight: bold;
	// xxcolor: #FF0000;
}
.projectStateDeclined {
	// xxfont-weight: bold;
	// xxcolor: #FF0000;
}
.projectStatePaused {
	// xxfont-weight: bold;
	// xxcolor: #FF0000;
}
.projectStateStopped {
	// xxfont-weight: bold;
	// xxcolor: #FF0000;
}
.projectStateKilled {
	// xxfont-weight: bold;
	// xxcolor: #FF0000;
}
.projectStateInProgress {
	// xxfont-weight: bold;
	// xxcolor: #00C8A0;
}
.projectStateInProgress {
	font-weight: bold;
	color: #00C8A0;
}
.projectStateFinished {
	// xxfont-weight: bold;
	// xxcolor: #5F5F5F;
}

.pingStatusUnreachable {
	// xxfont-weight: bold;
	color: #FF0000;
}

.mitigationPlanTrue {
	font-weight: bold;
	color: #00C8A0;
}
.mitigationPlanFalse {
	font-weight: bold;
	color: #FF0000;
}

.htmlarea .statusBar {
	display: none;
}

.htmlarea iframe {
	width: 100%;
}

.errorMessage {
	font-weight: bold;
	color: #FF0000;
}

.informationMessage {
	font-weight: bold;
}


/* ------------------------------------------- */

.noCapability{
	font-weight: bold;
	color: #009F00;
}

.disabledFieldCapability{
	font-weight: bold;
	color: #FF0000;
}

.invisibleFieldCapability{
	font-weight: bold;
	color: #FF0000;
}

.ownerCapability{
	font-weight: bold;
	color: #EF6F00;
}

.responsibleCapability{
	font-weight: bold;
	color: #EF6F00;
}

.ownerOrResponsibleCapability{
	font-weight: bold;
	color: #EF6F00;
}


/* ------------------------------------------- */

.noteIconAnchor {
	border: 0;
	text-decoration: none;
}

.noteTextAnchor {
	border: 1px solid #6688CC;
	margin: 2px;
	font: 9px caption;
	font-weight: bold;
	text-decoration: none;
	background: #CCEEFF;
	color: #000077;
	text-align: center;
}

.note a {
	text-decoration: none;
}

.note a:hover {
	text-decoration: none;
}

.notebody {
	display:block;
	border: 1px solid #666666;
	color: #000000;
	background: #EEEEEE;
	position:absolute;
	z-index: +10;
	width:300px;
	padding: 2px;
	left: 100px;
	font-size: 12px;
}

.notetitle {
	font-weight: bold;
	background: #CCCCCC;
	color: #000000;
	border-bottom: 1px dashed #666666;
	padding: 1px;
	width: 100%;
	margin: 0;
	font-size: 13px;
}

.notehidden {
	display: none;
}

.notevisible {
	display: block;
/*
 position:absolute;
 left:0px;
 right:450px;
 bottom:250px;
*/
	position:relative;
	right:420px;
	z-index: +10;
}

.fc_main {
	background: #DDDDDD;
	border: 1px solid #000000;
	font-family: Verdana;
	font-size: 10px;
}
.fc_date {
	border: 1px solid #D9D9D9;
	cursor:pointer;
	font-size: 10px;
	text-align: center;
}
.fc_dateHover, TD.fc_date:hover {
	cursor:pointer;
	border-top: 1px solid #FFFFFF;
	border-left: 1px solid #FFFFFF;
	border-right: 1px solid #999999;
	border-bottom: 1px solid #999999;
	background: #E7E7E7;
	font-size: 10px;
	text-align: center;
}
.fc_wk {
	font-family: Verdana;
	font-size: 10px;
	text-align: center;
}
.fc_wknd {
	color: #FF0000;
	font-weight: bold;
	font-size: 10px;
	text-align: center;
}
.fc_head {
	background: #000066;
	color: #FFFFFF;
	font-weight:bold;
	text-align: left;
	font-size: var(--commonFontSize);
}



.negativeListBox {
    border: 1px solid #666666;
    background-color: #EAEA00;
    padding: 10px;
}
.positiveListBox {
    padding: 10px;
}
.listBoxHeadline {
    font-size: 12px;
}
.operationConfirmationHeadline {
    font-size: 12px;
    font-weight: bold;
    // text-decoration: underline; - no; only links are !!!!
}



.warningHeadline {
	font-size: 12px;
}

.informationBox {
	border: 1px solid #666666;
	background-color: #dddddd;
	color: #555555;            /* darkGrey */
	padding: 10px;
	text-align: left;
	font-weight: bold;
	font-size: 10px;
	display:block;
}

.testExecutionDetailsStateName {
    height: 26px;
}

.skillTable {
    width: 100%;
}
.addSkilldescriptionTable {
    width: 100%;
}
.hand {
    cursor: pointer;
    cursor: hand;
}

.testEquipmentBlocked {
    color: #FF0000;
//    font-weight: bold;
}
.testEquipmentNotBlocked {
//    color: #5F5F5F;
//    font-weight: bold;
}
.testEquipmentStateBlocked {
    color: #FF0000;
    font-weight: bold;
}
.testEquipmentStateReserved {
    color: #7F0000;
    font-weight: bold;
}
.testEquipmentStateAvailable {
    color: #009F00;
    font-weight: bold;
}
.noneTestEquipment {
    color: #FF0000;
    font-weight: bold;
}
.mismatchWithExpecco {
    color: #FF0000;
    font-weight: bold;
}



.horizontalRuleInFilterMenu {
    color: #888888;
    background-color: #888888;
    height: 1px;
    border: 0px;
}

.comboBoxInFilterMenu {
    width: 160px;
}
.filterMenuDefinitionColumn {
    vertical-align: top;
}

.highlightedSelectOption {
    color: #000000;
}
.normalSelectOption {
    color: #999999;
}
.highlightedComboBoxInFilterMenu {
    color: #000000;
//    width: 160px;  -- there is NO REASON to fix that boxes size (and especially not too small) !!!!!!
}
.normalComboBoxInFilterMenu {
    color: #999999;
//    width: 160px;  -- there is NO REASON to fix that boxes size (and especially not too small) !!!!!!
}



.selectCollectionViaCheckBoxDiv {
    // layout:fixed;
    border:1px solid #777777;
    padding:0px 5px;
    overflow-y:scroll;
    overflow-x:hidden;
}

.reachMaxNumberOfConcurrentExecutions{
	font-weight: bold;
	color: #FF0000;
}

.notEnoughFreeDiskSpaceForTestExecution{
	font-weight: bold;
	color: #FF0000;
}

.commentTextArea {
    margin-top: 2px;
    width: 100%;
    height: 100px;
    rows: 5;
}

.commentTextAreaDiv_HaveTo {
    color: #555555;                /* darkGrey */
    font-weight:bold;
}

.commentTextAreaDiv_Please {
    color: #555555;                  /* darkGrey */
    font-weight:bold;
}

.popupDivTitle {
    border-left: 2px ;
    border-top: 2px ;
    border-right: 2px ;
    font-weight: bold;
    font-size: 12px;
    padding-left: 5px;
    text-align: left;
    align: left;
}
.popupDivTitle td {
    background: transparent;
}
.popupTdTitle {
    border-left: 2px ;
    border-top: 2px ;
    border-right: 2px ;
    font-weight: bold;
    font-size: 12px;
}
.popupTd {
    border: 1px ;
}
.popupDiv {
    border: 1px ;
    padding: 5px;
}
.warning_text {
    color: red;
}
.success_text {
    color: green;
}


/* ######################################## default styles ##################################### */

.activeUser {
    font-weight: bold;
    font-style: italic;
}

.select_option_enabled,
.edit_input_enabled,
.file_input_enabled
    {
	color: #000000;
	text-color: #000000;
    }

.select_option_disabled,
.edit_input_disabled,
.file_input_disabled
    {
	color: #999999;
	text-color: #999999;
    }

.select_option_selected_option_is_nil_text,
.edit_input_value_is_nil_text,
.file_input_value_is_nil_text
    {
	color: #999999;
	text-color: #999999;
    }

.select_option_highlighted
    {
	color: #ff0000;
	text-color: #ff0000;
    }

.file_input_span
    {
	position: relative;
    }
.file_input_div
    {
	display: inline-block;
	position: relative;
    }
.file_input_submit
    {
	position: absolute;
	z-index: 4;
	left: 0px;
	top: -7px;
    }
.file_input_raw
    {
	position: absolute;
	z-index: 2;
	height: 24px;
	left: 0px;
	top: 0px;
	-moz-opacity: 0;
	filter: alpha(opacity:0);
	opacity: 0;
    }
.file_input_div input[type=button],
.file_input_div input[type=submit] {
    width: 100px;
}

/* ######################################## list headline ##################################### */
.input_within_headline_span {
    position: relative;
}
.input_within_headline_span select,
.input_within_headline_span input
    {
	background-color: #eeeeee;
	border-style: inset;
	border-width: 1px;
	border-height: 1px;
	width: 170px;
    }

.div_right_float {
    display: inline-block;
    float: right;
}

.search_text_input {
    position: absolute;
    z-index: 5;
    left: 0px;
    top: -2px;
}
.search_text_input input {
    width: 149px;
    border-width: 1px 0px 1px 1px;
    border-height: 1px 0px 1px 1px;
}

.filter_show_hide_icon {
    cursor: pointer;
    cursor: hand;
    position: absolute;
    z-index: 10;
    right: 25px;
    top: 0px;
}
.search_icon {
    cursor: pointer;
    cursor: hand;
    position: absolute;
    z-index: 10;
    right: 25px;
    top: 5px;
}

.action_link a {
    color: #0000ff;
}

.input_full_width input, .input_full_width select {
    width: 100%;
}

.pre_execution_table {
    width: 100%;
    border: 0px;
}
.pre_execution_table th {
    border: 0px;
    padding: 3px;

    align: left;
    text-align: left;
}
.pre_execution_table td {
    border-color: #dddddd;
    border-style: solid;
    padding: 3px;

    align: left;
    text-align: left;

    vertical-align: top;
}
.pre_execution_table tr {
    border: 1px;
}

.input_within_list_opertions_span select
    {
	background-color: #eeeeee;
	border-style: inset;
	border-width: 1px;
	border-height: 1px;
	width: 170px;
    }

.add_remove_list_spec_add_table {
    width: 100%;
    border-width: 0px;
    border-spacing: 0px;
    border-style: none;
    border-collapse: separate;
}
.add_remove_list_spec_add_table td {
    border-width: 0px;
    padding: 0px;
    border-style: none;
}
.add_remove_list_spec_add_table_right_column {
    width: 35px;
    align: right;
    text-align: right;
    vertical-align: top;
}

.add_remove_list_spec_list_table {
    width: 100%;
    border-width: 0px;
    border-spacing: 0px;
    border-style: none;
    border-collapse: separate;
}
.add_remove_list_spec_list_table td {
    border-width: 0px;
    padding: 1px;
    border: 1px solid #dddddd;
    vertical-align: top;
}
.add_remove_list_spec_list_table_right_column {
    width: 32px;
    align: right;
    text-align: right;
    vertical-align: top;
}

.field_builder_label_column {
    vertical-align: top;

    align: right;
    text-align: right;
    color: #555555;              /* darkGrey */
    font-weight: bold;
    white-space: nowrap;
}
.field_builder_widget_column {
    vertical-align: top;
    align: left;
    text-align: left;
}


/* ####################################### user input       */
.test_reservation_user_input_div {
    padding: 10px;
}
.test_reservation_user_input_label {
    align: right;
    text-align: right;
    padding: 2px;
    vertical-align: middle;
}
.test_reservation_user_input_field {
    align: left;
    text-align: left;
    vertical-align: middle;
}
.test_reservation_user_input_splitter {
    width: 20px;
}

/* ####################################### wrapper divs     */
.test_reservation_table {
    position: relative;
}
.test_reservation_table_area {
    background-color: #f5f5f5;
    position: absolute;
}

/* ####################################### common           */
.test_reservation_separator {
    border-top: 1px solid #ffffff;
    width: 100%;
}

/* ####################################### pane/column      */
.test_reservation_wrapper {
    float: left;
    display: inline;
    white-space: nowrap;
}
.test_reservation {
    float: left;
    display: inline;
    background-color: #e5e5e5;
    border-right: 1px solid #ffffff;
    white-space: nowrap;
}
.test_reservation_head {
    height: 25px;
    padding: 2px;
    overflow: hidden;
    background-color: #d5d5d5;
}
.test_reservation_content {
    position: relative;
//    overflow: hidden;
}

/* fancy tooltips */

.tool {
  position: relative;   /* this is key */
  cursor: help;
}
.tool:hover {
  z-index: 999;
}
/* tooltip will display on :hover event */

.tool .tip {
  position: absolute;
  display: none;      /* so is this */
}

.tool:hover .tip {
  display: block;
  z-index: 1001;
  position: absolute;
  top: 1.6em;
  left: 4em;
  width: auto;
  padding: 3px 7px 4px 6px;
  border: 1px solid #336;
  background-color: #f7f7ee;
  text-align: left;
  color: #000000;
}

.tool:hover .tip:hover {
  z-index: 1001;
}



/* ####################################### enums */
.processStateSuccess,
.processStateWaiting {
    color: #00BF00;                 /* greenSlightlyDarkened */
}
.processStateBusy {
    font-weight: bold;
    color: #FF7F00;                 /* orangeNormal */
}
.processStateOff,
.processStateError {
    font-weight: bold;
    color: #BF0000;                 /* redSlightlyDarkened */
}




.dashboardTable > thead > tr > td,
.dashboardTable > tbody > tr > td,
.dashboardTable > tr > td {
    padding-left: 4px;
}
.dashboardTable > thead > tr > td:first-child,
.dashboardTable > tbody > tr > td:first-child,
.dashboardTable > tr > td:first-child {
    padding-left: 0px;
}



.sliderInputField {
    width: 30px;
}



.navigationItemTable {
    width: 100%;
    border: 1px solid var(--commonColorDark);
    font-weight: bold;
}

.connectStateColumn {
    align: center;
    text-align: center;
    height: 18px;
    vertical-align: top;
}

.stakeHolderSpecDescriptionLine {
    font-style: italic;
}

.toggleSelect {
    background-color: white;
    border: 1px solid #ABADB3;
    overflow-y: scroll;
    color: black;
}
.toggleSelectItem {
    cursor: pointer;
}
.toggleSelectItem:hover {
    background-color: #3399FF;
    color: white;
}

.connectionStatusIconDiv {
    padding-top: 4px;
    padding-left: 2px;
}

.headerColumn,
.headerColumnWithLogo,
.headerColumnWithSelectBox {
    padding-top: 6px;
}

.headerColumnWithLogo {
    width: 260px;
}
.headerColumnWithSelectBox {
    // take all possible width
    // width: 320px;
}


.dashboardExplorerItemTable .dashboardExplorerPlusMinusColum {
    position:relative;
    top: 0px;
    padding-left: 4px;
    width: 12px;
}
.dashboardExplorerItemTable .dashboardExplorerArtefactTypeIconColum {
    padding-bottom: -1px;
}
.dashboardExplorerItemTable .dashboardExplorerArtefactTypeIconColum img {
    position:relative;
    top:1px;
}
.dashboardExplorerItemTable .dashboardExplorerArtefactLabelColum {
    position: relative;
    top: 0px;
    padding-left: 3px;
}
.dashboardExplorerItemTable .dashboardExplorerArtefactValidationColum {
    position: relative;
    top: 1px;
    padding-left: 2px;
}

.dashboardExplorerChildrenDiv {
    padding-left:16px;
}

.mce-content-body {
    background-color: white;
}


.listToggleAllMenu,
.customColumnsMenuInEdit {
    position: absolute;
    text-align: left;
    z-index: 1;
    border: 1px solid var(--commonColorDark);
    padding: 4px;
    background-color: white;
}

.customColumnsMenuInEdit {
    top: 20px;
    right: 4px;
}
.customColumnsMenuInEdit checkbox {
    position: relative;
    left: 20px;
}


.fullHeightWidthForBodyFix {
    position: fixed;
    z-index: -100;
    height: 100%;
    width: 100%;
}

.dropTargetWhenMouseOver,
.customFieldsArea_interfaceLayout .dropTargetWhenMouseOver .field,
.customFieldsArea_interfaceLayout .dropTargetWhenMouseOver .specialField {
    background-color: #D1E8FF;
}
.dragableItem:hover,
.customFieldsArea_interfaceLayout .dragableItem:hover .field,
.customFieldsArea_interfaceLayout .dragableItem:hover .specialField {
    cursor: all-scroll;
    background-color: #D1E8FF;
}
.dragableItemHandCursor .dragableItem:hover {
    cursor: pointer;
}

.clickableCheckboxString {
    cursor: pointer;
    user-select: none;
}
.clickableString {
    cursor: pointer;
}
.clickableString:hover {
    text-decoration: underline;
}

.textBreakByWordAndEachCharacter {
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    word-break: break-word;
}


.overlay_table {
    width: 100%;
    height: 100%;

    position: fixed;
    z-index: 9999;

    border-collapse: collapse;
    border-spacing: 0;

    display: none;
}
.overlay_cover_cell {
    background: rgba(0, 0, 0, 0.6);
}
.overlay_content_row {
    height: 1%;
}
.overlay_content_cell {
    width: 1%;
    padding: 0px;
}




.waitingOverlay .overlay_cover_cell {
    background: rgba(0, 0, 0, 0.1);
}
.waitingOverlay .overlay_content_cell {
    background-color: white;
}
.waitingOverlayDiv {
    align: center;
    text-align: center;
    font-family: Verdana;
    font-size: 14px;
    color: #555555;
    font-weight: bold;
    padding-top: 8px;
    padding-left: 6px;
    padding-right: 6px;
    padding-bottom: 4px;
    border: 2px solid #555555;
}






.customFieldsArea_interfaceLayout .availableFieldsDiv {
    background-color: #efefef;                 /* veryLightGrey2 */
    padding: 4px;
}
.customFieldsArea_interfaceLayout .field,
.customFieldsArea_interfaceLayout .specialField {
    border: 1px solid #cfcfcf;
    background-color: #ffffff;
    height: 20px;
    line-height: 20px;
}
.customFieldsArea_interfaceLayout .specialField {
    background-color: #efefef;
}
.customFieldsArea_interfaceLayout .fieldIcon {
    position: relative;
    top: 2px;
}
.customFieldsArea_interfaceLayout .fieldIconColumn {
    padding-left: 2px;
}
.customFieldsArea_interfaceLayout .fieldPencilColumn {
    padding-top: 2px;
    padding-right: 1px;
}
.customFieldsArea_interfaceLayout .targetInterfaceColumn {
    width: 250px;
}
.customFieldsArea_interfaceLayout .layoutTable {
    background-color: #efefef;
}
.customFieldsArea_interfaceLayout .operationColumn {
    padding-top: 3px;
    color: #555555;
    font-size: 12px;
    font-weight: bold;
}
.customFieldsArea_interfaceLayout .operationDiv {
    padding: 3px;
}
.customFieldsArea_interfaceLayout .insertNewRow {
    position: relative;
    background-color: white;
    width: 120px;
    height: 22px;
    overflow: hidden;
}
.customFieldsArea_interfaceLayout .insertNewRowBorderTop,
.customFieldsArea_interfaceLayout .insertNewRowMaskTop,
.customFieldsArea_interfaceLayout .insertNewRowBorderBottom,
.customFieldsArea_interfaceLayout .insertNewRowMaskBottom {
    position: absolute;
    right: 0px;
    width: 0px;
    height: 0px;
}
.customFieldsArea_interfaceLayout .insertNewRowBorderTop {
  top: 0px;
  border-top: 13px solid #cfcfcf;
  border-left: 13px solid transparent;
}
.customFieldsArea_interfaceLayout .insertNewRowBorderBottom {
  top: 9px;
  border-bottom: 13px solid #cfcfcf;
  border-left: 13px solid transparent;
}
.customFieldsArea_interfaceLayout .insertNewRowMaskTop {
  top: 0px;
  border-top: 12px solid #efefef;
  border-left: 12px solid transparent;
}
.customFieldsArea_interfaceLayout .insertNewRowMaskBottom {
  top: 10px;
  border-left: 12px solid transparent;
  border-bottom: 12px solid #efefef;
}
.customFieldsArea_interfaceLayout .insertNewRowContainer {
    width: 130px;
    height: 20px;
    border: 1px solid #cfcfcf;
    border-left: 0px solid #cfcfcf;
    line-height: 20px;
}
.customFieldsArea_interfaceLayout .notAGroupFieldInset {
    width: 20px;
}

.arrow {
    cursor: arrow;
    cursor: default;
}

.additionalComboBoxListItemContent,
.shortIdInSelectBox {
    color: #BBBBBB;
}
.shortIdInSelectBox {
    font-size: 8px;
}
.additionalNavigationEntryContent,
.additionalComboBoxListItemContent {
    font-size: 10px;
    font-weight: normal;
}
.additionalComboBoxListItemContent {
    font-style: italic;
}
.additionalNavigationEntryContent .clickableString,
.additionalComboBoxListItemContent .clickableString {
    color: blue;
}

.filterableSelectBox_dropDownRow[listItemSelected="true"] .additionalComboBoxListItemContent,
.filterableSelectBox_dropDownRow[listItemSelected="true"] .shortIdInSelectBox {
    color: #EEEEEE;
}

.editRowMinHeight {
    height: 22px;
}

.descriptionTextInEdit {
    font-size: var(--commonFontSize);
}

.hintItsYourTurn {
    color: #FF7F00;         /* orangeNormal */
    font-weight: bold;
    font-size: 20px;
    margin: 10px 0px 0px 0px;
}
.hintItsYourTurnAdditionalInfo {
}

.newCreatedArtefactRow {
    -webkit-animation: newCreatedArtefact 1s 3; /* Safari 4+ */
    -moz-animation:    newCreatedArtefact 1s 3; /* Fx 5+ */
    -o-animation:      newCreatedArtefact 1s 3; /* Opera 12+ */
    animation:         newCreatedArtefact 1s 3; /* IE 10+, Fx 29+ */
}

@-webkit-keyframes newCreatedArtefact {
    0%, 0% {
	background-color: white;
    }
    50%, 50% {
	background-color: yellow;
    }
    100%, 100% {
	background-color: white;
    }
}

.highlightProjectFilter {
    color: #CC0000;                     /* fontHardWarning  */
}

.svgCircleDiv {
    position: relative;
    display: inline-block;
}
.svgCircleText {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    text-align: center;
}
.svgCircle {
    margin-bottom: -3px;
}

.moduleIcon {
    width: 32px;
    height: 32px;
}
.moduleIcon[monochrom=true][isDisabledModule=true] {
    filter: var(--moduleItemDisabledFilter);
}


/* ##### PERCENTAGE CIRCLE ##### */
.percentageCircleBg,
.percentageCircleFg {
    fill:none;
}
.percentageCircleBg {
    stroke: var(--commonColorVeryLight);
}
.percentageCircleFg {
    stroke: var(--highlightColorLight);
}
.svgCircleText {
    color: var(--highlightColorLight);
    font-size: 11px;
    letter-spacing: -1px;
    left: -2px;
    top: -1px;
}


/* ##### MISC ##### */
.playButtonInList {
    margin-top: -2px;
    margin-left: -2px;
    margin-bottom: -5px;
    width: 26px;
    height: 26px;
    filter: var(--highlightColorLightFilter);
    cursor: pointer;
}
.playButtonInList:hover {
    filter: var(--highlightColorNormalFilter);
}
.playButtonInListAnchor {
    padding-top: 7px;
}


/* ##### Login Page ##### */
.loginPageColumn {
    width: 400px;
}
.loginPageVrColumn {
    position: relative;
    height: 400px;
}
.loginPageVrColumn,
.loginPageVr {
    width: 3px;
}
.loginPageVr {
    position: absolute;
    top: 30px;
    bottom: 30px;
}
.loginPageHr {
    height: 1px;
}
.loginPageVr,
.loginPageHr {
    background-color: var(--commonColorNormal);
}
.loginPageVrAsText{
    color: var(--commonColorNormal);
}

.loginPageColumnRightContent {
    padding: 30px;
    text-align: left;
}
.loginPageInput {
    width: 180px;
}


/* ##### input widgets ##### */
input[type=button],
input[type=submit],
input[type=edit],
input[type=text],
input[type=password],
.inputBorder,
.textAreaReadOnly {
    border-radius: var(--boxRadius);
    -moz-border-radius: var(--boxRadius);
    -webkit-border-radius: var(--boxRadius);
}

input[type=edit],
input[type=text],
input[type=password],
.inputBorder,
.inputBorderWithoutHover,
.textAreaReadOnly {
    border-width: 1px;
    border-style: solid;
}

input[type=button],
input[type=submit] {
    border-width: 1px;
    /* border-style: solid; dont be solid, let the browser do the 3d border */
}

input[type=edit],
input[type=text],
input[type=password],
.inputBorder,
.inputBorderWithoutHover {
    border-color: var(--inputBorderColor);
}

input[type=edit]:hover,
input[type=text]:hover,
input[type=password]:hover,
.inputBorder:hover {
    border-color: var(--inputBorderHoverColor);
}

input[type=edit][disabled],
input[type=edit][disabled]:hover,
input[type=text][disabled],
input[type=text][disabled]:hover,
input[type=password][disabled],
input[type=password][disabled]:hover,
input[type=button][disabled],
input[type=button][disabled]:hover,
input[type=submit][disabled],
input[type=submit][disabled]:hover,
input[type=checkbox][disabled],
input[type=checkbox][disabled]:hover,
input[type=radio][disabled],
input[type=radio][disabled]:hover,
select[disabled],
select[disabled]:hover,
.inputBorder[disabled],
.inputBorder[disabled]:hover {
    border: 1px solid var(--inputBorderDisabledColor);
    cursor: default;
}

input[type=button],
input[type=checkbox],
input[type=submit],
input[type=radio],
select {
    cursor: hand;
    cursor: pointer;
}

.textAreaReadOnly {
    border-color: var(--inputBorderDisabledColor);
    /* background-color: #f8f8f8; veryLightGrey -> use white to be compatible to images within a text area */
    background-color: #ffffff;
}

.textAreaReadOnly,
.inputBorder {
    padding: 2px;
}

input[type=edit],
input[type=text],
input[type=password] {
    padding-left: 2px;
}

input[type=edit],
input[type=text],
input[type=password],
.inputFont {
    font-family: Verdana;
    font-size: var(--commonFontSize);
}

input[type=edit],
input[type=text],
input[type=password] {
    height: 16px;
}

input[type=button] {
    height: 22px;
}

input[type=checkbox],
input[type=radio] {
    margin-left: 0px;
    margin-right: 0px;
}

select {
    height: 20px;
    font-size: 12px;
}
select[size] {
    height: auto;
}

textarea {
    height: 80px;
}

.disabledLabel {
    color: var(--commonColorNormal);
}


.navigationItemLink,
.inactiveNavigationItem a {
    /* to be able to use the middle button
       on the whole item width, not only over text */
    display: inline-block;
    width: 100%;
}



.centerEditWrapper {
    text-align: center;
    padding-top: 40px;
    padding-bottom: 40px;
}
.centerEditBox {
    display: inline-block;
    text-align: left;
    min-width: 700px;
}
.centerEditTitle {
    background-color: var(--commonColorNormal);
    color: var(--highlightColorLight);
    font-size: 14px;
    font-weight: bold;
    padding: 3px;
}
.centerEditContent {
    margin-top: 20px;
}
.centerEditFooter {
    margin-top: 40px;
}


.userDataInputTable tr td:first-child {
    text-align: right;
}

.colorBoxTable tr td,
.colorBoxTable thead tr td,
.colorBoxTable tbody tr td {
    background-size: 100% 100%;
    background-repeat: repeat-x;
}