

/* Test inlezen containerlijsten */


.CntNo_detected{
    font-weight: bold;
}

.ContLine {
    font-size: 15px;
}

.NonContLine {
    font-size: 15px;
}

.ContNo_no_match {
    background-color: #F55243;
    font-size: 15px;
}

.ContNo_match {
    background-color: #72F872;
    font-size: 15px;
}



/* =====================================*/

html,
 body {
   height: 100%;
   padding: 0;
   margin: 0;
   font-family: Arial, Helvetica, sans-serif;
 }

.MyWaitscreen {
    position: absolute;
    left: 0;
    top: 0;
    /*background: rgba(207, 207, 207, 0.5); }*/
}

hr {
    display: block;
    margin-top: 0em;
    margin-bottom: 0em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 1px;
}

.FileName {
    color: black;
    background-color: #DEDEDE;
    font-weight: bold;
    font-style: italic;
    margin-top:0.1em;
    margin-bottom: 0.1em;
}

.ReportHeader {
    padding: 0em;
    margin-top:1.5em;
    margin-bottom:0em;
}

.ReportFooter {
    padding: 0em;
    margin-top:0em;
    margin-bottom:1.5em;
}

.ReportTableCSV {
    border-style: none;   /* none, double */
    border-width: 1px;
    margin-top: 1em;
}

.ReportTableXML {
    border-style: none;   /* none, double */
    border-width: 1px;
    margin-top: 1em;
}

.ReportTableEDI {
    border-style: double;   /* none, double */
    border-width: 1px;
    margin-top: 1em;
}

@media print {
    .noprint {
        display: none !important;
    }
}

#tabs {
    margin-top: 1em;
}

#tabs li .ui-icon-close {
     float: left;
     margin: 0.4em 0.2em 0 0;
     cursor: pointer;
}

.MyButton {
    padding: .2em 1em !important;
}

.MyTabs {
    padding: .15em 1em !important;
}

/* horizontal panel ==============================*/

.flex-master {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    flex-grow: 1;
    height: 100%;
}

.page-header {
    flex: 0 0 auto;
    /* no grow no shrink */
    background: #535353;
    color: white;
    padding: 25px;
    font-size: 3em;
    font-weight: bold;
}

.page-content {
    /* grow and shrink vertically */
    flex: 1 1 auto;

    /* new horizontal flex container */
    display: flex;
    flex-direction: row;

    /* IMPORTANT: Required for FireFox
      to ensure vertical sizing is constrained.
      Not sure why this is required - it should
      be inherited.
    */
    overflow: auto;
}

.sidebar-left {
    /* should stay fixed except for resizing  */
    flex: 0 0 auto;
    width: 50%;         / was 40 *25px*/
    background: #F0F0F0;
    padding: 5px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
}

.splitter {
    /* should stay fixed size */
    flex: 0 0 auto;
    width: 5px;
    cursor: col-resize;
    background: #7A7A7A url(img/vertical.png) center center no-repeat;
}

.main-content {
    /* grow & shrink horizontally */
    flex: 1 1 auto;
    overflow:auto;
    background: white;
    padding: 5px;
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
}

.tabs {
    height: 100%;
    max-height: calc(100% - 65px);
    border-style: solid;
    border-width: 1px;
    margin-left: 0.2em;
    margin-right: 0.2em;
}

/* compare tabs different collor */
.tabs_compare {
    background: #DEDEDE;
}



.file-tabs {
    height: 100%;
    max-height: calc(100% - 40px);
    padding: 0.6em 0.6em !important;
}

.file-container {
    height: calc(100% - 0.2em);
}

.source-container,
.report-container {
    border-style: solid;
    border-width: 1px;
}

.source-spinner {
    border-style: solid;
    /* border-top: 1px; */
    /* border-bottom: 1px; */
    border-width: 1px;
    border-left: 0px;
    border-right: 0px;
}

/* Error and warning messages and counters =====================*/

.message-error {
    color: red !important;
}

.message-error-counter {
    color: red !important;
    background-color: yellow;
}

.message-warning,
.message-warning-counter {
    color: green !important;
}


/* Tooltip selectable text =====================================*/

.my-tooltip {
    cursor: help;           /*pointer, help*/
    /*color: green !important;*/
    /*font-weight: bold;*/
    /*font-style: italic;*/
    text-decoration: none;
    border-bottom: 1px dashed black;            /*dotted, double dashed*/
}

.my-tooltip-error {
    color: red;
    background-color: yellow;
}

span.nl::before {             /* Simulate line break in Tooltip */
    content: '\a';
  white-space: pre;
}


/* Tooltip CCS based ==============================================*/


/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
    cursor: help;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
    visibility: visible;
}

/* Tooltip text */
.tooltip .tooltiptext {
    visibility: hidden;
    width: 325px;                     /* was 120 */
    /*max-width: 300px;*/
    background-color: white;          /* black */
    color: black;                     /* #fff */
    text-align: left;
    padding: 8px;                   /* 5px 0; */
    border-radius: 6px;
    border-style: solid;
    border-width: 2px;
    border-color: lightgrey;
    box-shadow: 1px 1px 1px  1px grey;
    /* Position the tooltip text next */
    /*
    position: absolute;
    z-index: 1;
    */

    /* Position the tooltip: bottom*/
    position: absolute;
    z-index: 999;          /* 1 */
    top: 175%;            /* 100% */
    left: 50%;
    margin-left: -20px;   /* Use half of the width (325/2), to center the tooltip */
}

/* changed format / position tooltip right side screen */
.tooltip .right {
    margin-left: -325px;   /* Use half of the width (325/2), to center the tooltip */
}


/* Start PowerdBy panel ===================================*/

.PowerdBy {
    text-align: right;
    padding-right: 10px;
    color: #B0B0B0;
    font-size: 50%;
}

a.PowerdByLink:link {
    color:#575757;
    text-decoration: none;
}

a.PowerdByLink:visited {
    color:#B0B0B0;
}

a.PowerdByLink:hover {
    font-weight: bold;
    color:#575757;
    font-size:175%;            /* 130% */
    /*text-decoration: underline;*/
}

a.PowerdByLink:active {
    color:#575757;
    text-decoration: none;
}

.VersionNumberLeft {
    text-align: left;
    font-size: 50%;
    padding-left: 10px;
    color: #B0B0B0;
}


/* Compare REC23 SummaryTable */
.SummaryTable_red {
    background-color: #F55243;
}
.SummaryTable_green {
    background-color: #72F872;
}

