:root {
    --main-page-width: 1870px;
    --search-bgcol-notfound: #f00;
    --table-border-color: black;
}

.strikethrough-italic td {
    text-decoration: line-through !important;
    font-style: italic !important;
}

#attachvoucherdiv {
    width: 600px; /* eksempelbredde, kan være hvilken som helst værdi */
    position: absolute;
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
}

::selection {
    background: #ffb7b7; /* WebKit/Blink Browsers */
}

.catsel{
    font-weight:bold !important;
}
.category-row td a{
    color: #000;
    font-weight:normal;
}

.hidden-input {
    transition: filter 0.3s; /* Gør overgangen blødere */
    filter: blur(3px);
}

.hidden-input:focus {
    filter:none;
}

.hidden {
    display: none !important;
}

.clicklink{
}

.clicklink:hover{
    cursor: pointer !important;
}

.boldtext{
    font-weight: bold !important;
}

.billingblockactive{
    background-color: #bbb !important;
    color: #000 !important;
}

.billingblock{
    background-color: #ddd;
    color: #aaa;
}

.hideheadline{
    font-weight: bold !important;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; 
}

.drafttemp2 td a, .drafttemp2 td{
    font-style: italic !important;
    color:#444 !important;
}

.treven .blr {
    background-color: #d8d8d8;
}

.blr {
    background-color: #d1d1d1;
}

.hideheadline:hover{
    cursor: pointer !important;
}

[contenteditable] {
    outline: 0px solid transparent;
}

.modemleasenone td{
    background-color: #eee;
}

.modemleaseok td{
    background-color: #afa;
}

.modemleaseerror td{
    background-color: #faa;
}

.modempendingopen{
    background-color:#ee5555;    
}

.modemclosed{
    background-color:#ee5555;    
}

.horizon:hover  {background-color:#f8f8f8;}

.warncolor{
    color: red !important;
}

.btnfactory{
    color: #c00;
}

.btnreprov{
    color: #080;
}

.btnreboot{
    color: #800;
}

.positivenumber{
    color: green;
}

.terminal{
    background-color: #555;
    border: 2px solid #222;
    padding: 5px;
    color: #c7c7c7;
    font-family: monospace;
    font-size: 0.9em;
}

.piinspectobject{
    background-color: #fff;
    padding:4px;
    border:1px solid #000000;
}

.yswarning {
    height: auto;
    color: black;
    background: none !important;
    background-color: indianred !important;
}

.moveinfoheader {
    color: green;
    background: none !important;
    background-color: #fff !important;
}

.moveinfo {
    background: none !important;
    background-color: #9f9 !important;
}


.copy{
    content: url("/img/copy.png");
    height: 13px;
    margin-right: 4px;
    cursor: pointer;
}

.processinstancedisplay{
    background:#FFFFFF;
    border:1px solid #000000;
}

.inputbackground{
    background-color: white;
}

.discount{
    color: black;
    background-color:#ff0;
}

.taskbackground{
    background-color: #fff;
}

.taskbackground INPUT, .taskbackground TEXTAREA{
    width: 300px !important;
}

.taskbackground TR {
    background-color:transparent;
    background-image:none !important;
}

.accitem{
    color: black;
}

.changedfield{
    background-color: #bfb;
    color: black;
}

.micrograph{
    border:0px solid #c3c3c3;
    opacity:0.8;
}

.tableseperator{
    background-color: white;
}

.processpopup{
    -webkit-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    -moz-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    
}

.standardpopup{
    -webkit-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    -moz-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    
}

body{
    position:relative;
    font-size:100%;
    font-family:'Open Sans';
    margin-left: 0px;
    margin-right:0px;
    margin-top:0px;
}

#newnote{
    width: 1000px;
    padding: 10px;
    margin: 10px;
}

#popup2content{
    position:relative;
    top:0;left:0;width:100%;height:100%;
}
#closedediv2{
    padding-top:10px;
    padding-right:10px;
}
#popuphead2{
    z-index:1;
}

.scroll-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100;
    overflow: hidden; /* Prevent background page scrolling */
}

.scroll-popup-content {
    height: auto;
    max-height: 70%;
    max-width: 70%;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    flex: 1 1 auto; /* Allow content to shrink or grow within constraints */
    overflow: auto; /* Enable scrolling for content exceeding bounds */
    display: flex; /* Ensure the content respects the constraints */
    flex-direction: column; /* Stack content vertically */
}

.hovertable tr:hover td{
    background-color: #a8a8a8;
}

.hover_trs td{
    background-color: #a8a8a8;
}


.DragContainer {
    FLOAT: left; WIDTH: 100px; border: 1px solid red;
}
.OverDragContainer {
    FLOAT: left; WIDTH: 100px;
}
.OverDragContainer {
    BACKGROUND-COLOR: #aeaeae;
}
.DragBox {text-align: left;  border: 1px #000 solid; padding: 2px 2px 2px 2px; FONT-SIZE: 10px; MARGIN-BOTTOM: 5px; WIDTH: calc(100% - 10px); CURSOR: pointer; FONT-FAMILY: verdana, tahoma, arial; BACKGROUND-COLOR: #eee}

.OverDragBox{   border: #000 1px solid; padding: 2px 2px 2px 2px;FONT-SIZE: 10px; MARGIN-BOTTOM: 5px;   WIDTH: calc(100% - 10px); CURSOR: pointer; FONT-FAMILY: verdana, tahoma, arial; BACKGROUND-COLOR: #eee}



.DragDragBox {  BORDER-RIGHT: #000 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #000 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 10px; MARGIN-BOTTOM: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #000 1px solid; WIDTH: 224px; CURSOR: pointer; PADDING-TOP: 2px; BORDER-BOTTOM: #000 1px solid; FONT-FAMILY: verdana, tahoma, arial; BACKGROUND-COLOR: #eee}
.miniDragBox {  BORDER-RIGHT: #000 5px solid; PADDING-RIGHT: 2px; BORDER-TOP: #000 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 10px; MARGIN-BOTTOM: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #000 1px solid; WIDTH: 224px; CURSOR: pointer; PADDING-TOP: 2px; BORDER-BOTTOM: #000 1px solid; FONT-FAMILY: verdana, tahoma, arial; BACKGROUND-COLOR: #eee}
.OverDragBox {  text-align: left; BACKGROUND-COLOR: #bbbbbb}
.DragDragBox {  BACKGROUND-COLOR: #dddddd;}
.DragDragBox {
    filter: opacity(50%);
    background-color: #dddddd;
}

#maintable th A{
    color: #fff;
}

.maintable th A{
    color: #fff;
}

.tablesorter_neutral A{
    color: #eee;
}
.tablesorter_asc A{
    color: #fff;
}
.tablesorter_desc A{
    color: #fff;
}
.tablesorter_neutral{
    font-size: 13px;
    background-color: #777;
    padding: 4px;
    white-space: normal;
    cursor: pointer;
}

.tablesorter_neutral_left{
    font-size: 13px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
    background: #f6f8f9 no-repeat center left;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAACXBIWXMAAAsTAAALEwEAmpwYAAADGGlDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjaY2BgnuDo4uTKJMDAUFBUUuQe5BgZERmlwH6egY2BmYGBgYGBITG5uMAxIMCHgYGBIS8/L5UBFTAyMHy7xsDIwMDAcFnX0cXJlYE0wJpcUFTCwMBwgIGBwSgltTiZgYHhCwMDQ3p5SUEJAwNjDAMDg0hSdkEJAwNjAQMDg0h2SJAzAwNjCwMDE09JakUJAwMDg3N+QWVRZnpGiYKhpaWlgmNKflKqQnBlcUlqbrGCZ15yflFBflFiSWoKAwMD1A4GBgYGXpf8EgX3xMw8BSMDVQYqg4jIKAUICxE+CDEESC4tKoMHJQODAIMCgwGDA0MAQyJDPcMChqMMbxjFGV0YSxlXMN5jEmMKYprAdIFZmDmSeSHzGxZLlg6WW6x6rK2s99gs2aaxfWMPZ9/NocTRxfGFM5HzApcj1xZuTe4FPFI8U3mFeCfxCfNN45fhXyygI7BD0FXwilCq0A/hXhEVkb2i4aJfxCaJG4lfkaiQlJM8JpUvLS19QqZMVl32llyfvIv8H4WtioVKekpvldeqFKiaqP5UO6jepRGqqaT5QeuA9iSdVF0rPUG9V/pHDBYY1hrFGNuayJsym740u2C+02KJ5QSrOutcmzjbQDtXe2sHY0cdJzVnJRcFV3k3BXdlD3VPXS8Tbxsfd99gvwT//ID6wIlBS4N3hVwMfRnOFCEXaRUVEV0RMzN2T9yDBLZE3aSw5IaUNak30zkyLDIzs+ZmX8xlz7PPryjYVPiuWLskq3RV2ZsK/cqSql01jLVedVPrHzbqNdU0n22VaytsP9op3VXUfbpXta+x/+5Em0mzJ/+dGj/t8AyNmf2zvs9JmHt6vvmCpYtEFrcu+bYsc/m9lSGrTq9xWbtvveWGbZtMNm/ZarJt+w6rnft3u+45uy9s/4ODOYd+Hmk/Jn58xUnrU+fOJJ/9dX7SRe1LR68kXv13fc5Nm1t379TfU75/4mHeY7En+59lvhB5efB1/lv5dxc+NH0y/fzq64Lv4T8Ffp360/rP8f9/AA0ADzT6lvFdAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAAlUlEQVR42lSNuw5BURRE15z4Fq9ERUWlI/gjpV8iV6IRlURxK8nlU5xjNOc+dHtm9qzRHgPwdl9GmAMAgWx/eZr8BBAMvBwZKFK2PgEqJ8aCiSJ3qw4qJ0YyIGaKXHOrN1TdN7BQB9XciFaFh1uuOfuUAWGqyC2Lwom1GtRcHy4WhROb7gYslTg6spX5C2ClxK5jw28AD3M9hange3sAAAAASUVORK5CYII=');
    padding: 4px 20px 4px 4px;
    white-space: normal;
    cursor: pointer;
    padding-left: 16px !important;
}
thead .tablesorter_asc{
    background-color: #777 !important;
    padding: 4px !important;
    cursor: pointer;
}
thead .tablesorter_desc{
    background-color: #777 !important;
    padding: 4px !important;
    cursor: pointer;
}

.whitebg{
    background-color:white;
}

#mainmenusmall{
    display:none;
}
#submenusmall{
    display:none;
}

#topmenutoggle{
    display:none;
}
#submenutoggle{
    display:none;
}
#newsearchtools{
    display:none;
}

.clearboxpadding{
    padding:0 10%;
}

.mainpagemaxwidth{
    max-width:var(--main-page-width);
    margin:auto;
}

#footerlogo{
    float:right;
    text-align:right;
    padding: 20px 30px 0 0;
}

#footerlogo span{
    font-weight:bold;
    font-size:14px;
    padding-right:0;
}

#findbg{
    z-index: 1000;
}

#mainfind{
    position:absolute;
    top:75px;
    width:100%;
    max-width:var(--main-page-width);
    margin:auto;
    
    height:calc( 100% - 75px );
    display:none;
    padding:0;
    z-index: 30;
    background-color:#fff;
}
.findtab{
    padding:5px;
    padding-left:25px;
    height:70px;
    float:left;
    width:900px;
}
.findtab select, .findtab input{
    width:335px;
}

.inputdisabled{
    color:#bbb !important;
    border-color: #eee;
    background-color: #eee !important;
}
input[data-locked], select[data-locked], textarea[data-locked] {
    color: #555555;
}


.nodisplay{
    display:none;
}

.findtype{
    padding:25px;
    background-color:#fff;
    height:30px;
    float:left;
    width:35%;
    font-size:40px;
    font-weight:bold;
}
.scrollable{
    width:100%;
    height: calc( 100% - 120px );
    overflow:auto;
    margin:0;
    padding:0;
    background-color:#fff;
}
.header01{
    background-color:#fff;
    height:40px;
}

.scrollableplaceholder{
    display:none;
    margin:0;
    padding:0;
    background-color:#fff;
}

.accexpired{
    font-style: italic;
    text-shadow: 0px 0px 4px #f00, 0px 0px 4px #f00, 0px 0px 4px #f00,0px 0px 4px #f00, 0px 0px 4px #f00, 0px 0px 4px #f00, 0px 0px 4px #f00, 0px 0px 8px #f00, 0px 0px 8px #f00;
    color:#fff;
    font-weight:bold;
}

.wifiicon {
    float:right;
    position:relative;
    margin-right:2px;
}
.wifiicon .wifitext {
    font-size:10px;
    font-weight:bold;
    color:white;
    position:absolute;
    bottom:-1px;
    right:-1px;
    width:12px;
}

.filtericon1{
    height:10px;
    margin-right:2px;
}

.stdform label{
    display:inline-block;
}

.stdform span{
    display:inline-block;
    width:150px;
}

.smalltextnote{
    font-size:8px;
}

.stdform select, input{
    width:240px;
}

.fixedbuttons input[submit], button{
    width:110px;
}

.right{
    text-align:right;
}

.tdrb{
    background-color:red;
    color:white;
}

.ar{
    text-align:right;
}

.radio-group {
    border: 1px solid #999;
    display: inline-block;
    margin: 5px;
    border-radius: 3px;
    overflow: hidden;
    font: bold 11px/14px 'Open Sans';
    background: #eeeeee;
}

.radio-group input[type=radio] {
    position: absolute;
    visibility: hidden;
    display: none;
}

.radio-group label {
    color: #999;
    display: inline-block;
    cursor: pointer;
    font-weight: bold;
    padding: 1px 20px;
}

.radio-group input[type=radio]:checked + label {
    color: white;
    background: #999;
    margin-right: -3px;
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.6);
}

.radio-group label + input[type=radio] + label {
    border-left: 1px solid #999;
}

#maintable .tre{
    background-color: #d8d8d8;
}

#maintable .sel{
    background-color: #e8e8e8;
}


.maintable .sel td{
    background-color: #e8e8e8;
}

.maintable .selfi td{
    background-color: #e8e8e8;
    
    font-style: italic;
    color:#555;
}


.ws{
    visibility:collapse;
}
.maintable th{
    background-color:#777;
    color: white;
    font: .8em 'Open Sans';
    font-weight:bold;
    text-align:left;
    padding: 3px 4px 3px 4px;
}

.maintable td{
    font: .8em 'Open Sans';
    padding: 1px 4px 1px 4px;
    cursor: default;
    line-height: 2;
}

#maintable th{
    background-color:#777;
    color: white;
    font: .8em 'Open Sans';
    font-weight:bold;
    text-align:left;
    padding: 3px 4px 3px 4px;
}

#maintable td{
    font: .8em 'Open Sans';
    padding: 3px 4px 3px 4px;
    cursor: default;
}

#maintableedit th{
    background-color:white;
    font: .8em 'Open Sans';
    font-weight:bold;
    text-align:left;
    padding: 3px 4px 3px 4px;
}

#maintableedit td{
    font: .8em 'Open Sans';
    padding: 3px 4px 3px 4px;
    cursor: default;
}


.hltr td{
    font: .8em 'Open Sans';
    font-weight:bold;
}

.b1{
    font-weight:bold;
}

.noselect{
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.maintable a{
    cursor: pointer;
}

.maintable .treven, .stripedtr:nth-child(even of :not(.hidden)){
    background-color: #d8d8d8;
}

.maintable .trheadline td{
    font-weight:bold;
    background-color:white;
}

.maintable .trwhite td{
    background-color:white;
}
.maintable .trwhite td:nth-child(2){
    padding-left:20px;
}

.maintable .trgrey td{
    background-color:#aaa;
}



.maintable .fadeditalic td{
    font-style: italic;
    color:#555;
}

.maintable .trwhiteitalic td{
    font-style: italic;
    background-color:white;
}

.maintable .trwhiteitalic td:nth-child(2){
    padding-left:20px;
}

.maintable .trsum td{
    background-color:#ddd;
}

.dimmedtext{
    color:#777 !important;
}

.dimmedtext a{
    color:#777 !important;
}

.dimmedtd td{
    color:#666;
}

.dimmedtd td{
    color:#666;
}

.maintable{
    width:100%;
    margin-top:5px;
    border:2px solid #a0a0a0;
    background-color:white;
    margin:5px 0 0 0;
}

.maintablewhite{
    width:100%;
    padding:0px 15px 0px 15px;
}

.maintablewhite td{
    font:13px 'courier';
}


#maintable a{
    cursor: pointer;
}

#maintable .treven{
    background-color: #d8d8d8;
}

#maintable .trwarn{
    background-color: #e9aab4;
}

#maintable .trheadline td{
    font-weight:bold;
    background-color:white;
}

#maintable .trwhite td{
    background-color:white;
}
#maintable .trwhite td:nth-child(2){
    padding-left:20px;
}

#maintable .trgrey td{
    background-color:#aaa;
}

#maintable .trwhiteitalic td{
    font-style: italic;
    background-color:white;
}
#maintable .trwhiteitalic td:nth-child(2){
    padding-left:20px;
}

#maintable .trsum td{
    background-color:#ddd;
}

#maintable tr{
    background-color: #cdcccd;
}

#maintable input,select{
    width: 100%;
}

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

.maintable tr, .stripedtr{
    background-color: #e8e8e8;
}

#maintable2 th{
    background-color:white;
    font: .8em 'Open Sans';
    font-weight:bold;
    text-align:left;
    padding: 3px 4px 3px 4px;
}

#maintable2 td{
    font: .8em 'Open Sans';
    padding: 3px 4px 3px 4px;
}

#maintable2 .trgrey td{
    background-color:#aaa;
}

#maintable2 .trgrey tr{
    background-color:#aaa;
}

#maintable2 .treven{
    background-color: #d8d8d8;
}

#maintable2 tr{
    background-color: #d8d8d8;
}

.sortfield{
    display: inline-block;
    text-decoration: none;
    width: 100%;
    height: 100%;
}
.tablesorter_neutral .sortfield::after{
    content: " \25b2\25bc";
    font-size: 0.65em;
    opacity: 0.55;
    vertical-align: middle;
}
.tablesorter_asc .sortfield::after{
    content: " \25b2";
    font-size: 0.65em;
    opacity: 0.9;
    vertical-align: middle;
}
.tablesorter_desc .sortfield::after{
    content: " \25bc";
    font-size: 0.65em;
    opacity: 0.9;
    vertical-align: middle;
}

#maintable2{
    width:100%;
    margin-top:5px;
    border:2px solid #a0a0a0;
    background-color:white;
    margin:5px 0 0 0;
}

#contentfooterright{
    float:right;
    margin: 5px 0px 0 0;
    padding:0;
}

#contentfooterleft{
    float:left;
    margin: 5px 0px 0 0;
    padding:0;
}

#contentheaderright{
    float:right;
    margin: 0 0 0 0;
}

#contentheaderleft{
    float:left;
    margin: 0px 0px 0 0;
}

.buttonleft{
    float:left;
    margin: 0 1px;
}

#maintable{
    width:100%;
    border:2px solid #a0a0a0;
    margin:0 0 0 0;
}

#pcontent{
    background-color:#eee;
    width:100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    /*margin:22px 0 0 22px;*/
    font: .8em 'Open Sans';
    padding:15;
}

.pgraphboxouterborder3{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding:10px;
    width:33.3%;
    float:left;
}

.pgraphboxouter{
    background-color: #fff;
}

@media (max-width: 5930px) {
    
    
    .pgraphboxouterborderfull2{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width:100%;
        padding:10px;
        float:left;
    }
    
    .pgraphboxouterborder2{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width:50%;
        padding:10px 10px;
        float:left;
    }
    
    .keepspacingclean{
        padding:10px 10px;
    }
    
    .pgraphboxouter2{
        background-color:#fff;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        /*margin:22px 0 0 22px;*/
        font: .8em 'Open Sans';
        width:100%;
        height:390px;
        margin:0px;
        position: relative;
        padding:10px 20px 10px 10px;
        border:1px solid #aaa;
    }
    
    .pgraphboxouternoheight2{
        background-color:#fff;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        /*margin:22px 0 0 22px;*/
        width:100%;
        margin:0px;
        position: relative;
        padding:10px 20px 10px 10px;
        border:1px solid #aaa;
    }
    
    .pgraphboxouternoheightnocolor2{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        /*margin:22px 0 0 22px;*/
        width:100%;
        margin:0px 0px 10px 0px;
        position: relative;
        padding:10px 20px 10px 10px;
    }
    
    .pgraphbox2{
        background-color:#fff;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        /*margin:22px 0 0 22px;*/
        font: .8em 'Open Sans';
        height:300px;
        
        width:95%;
        margin:0 10px 10px 20px;
        position: absolute;bottom: 0;left:0;
        
        padding:0px;
        font-family:verdana;
        font-size:11px;
        border:0px;
    }
}


@media (max-height: 500px) {
    
    .processpopup{
        position : fixed;
        width : 700px;
        overflow:auto;
        top:0;
        left : 50%;
        height:100%;
        transform : translate(-50%, 0%);
        border:1px solid #ddd;
        background-color: white;
    }
    .standardpopup{
        position : fixed;
        width : 500px;
        overflow:auto;
        padding:10px;
        top:0;
        left : 50%;
        height:100%;
        transform : translate(-50%, 0%);
        background-color: white;
    }
}
@media (min-height: 501px) {
    .processpopup{
        position : fixed;
        width : 700px;
        max-height:100%;
        overflow:auto;
        
        top : 50%;
        left : 50%;
        transform : translate(-50%, -50%);
        border:1px solid #ddd;
        background-color: white;
    }
    
    
    .standardpopup{
        position : fixed;
        width : 500px;
        max-height: 100%;
        overflow: auto;
        padding: 10px;
        top : 50%;
        left : 50%;
        transform : translate(-50%, -50%);
        background-color: white;
    }
    
}

@media (max-width: 770px) {
    .pgraphboxouterborder3{
        width:100%;
    }
    
    
    #processstartinfo{
        width:100%;
        height: 600px;
        top:0;
        bottom:0;
        left:0;
        right:0;
        margin:auto;
        display:inline-block;
        z-index:1;
    }
    
    .pa_docwindowfullheight{
        height:100vh;
    }
    .pa_docwindow{
        top:0;
        left:0;
        position:fixed;
        padding:0 5px 0 0;
        margin:0;
        width:100%;
        z-index:100;
        
        font-family:'Open Sans';
        font-weight:normal;
        font-size:.9em;
        -webkit-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
        -moz-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
        box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    }
    
    .nomobile{
        display:none;
    }
    
    .pa_30_70_70{
        padding:10px;
    }
    
    .pa_30_70_30{
        padding:10px;
    }
    
    input[type=button].modernButton {
        font-size: 24px;
        font-weight:normal;
        width: 200px;
        height: 50px;
        border-radius: 20px;
        background-color: green;
        color:white;
        padding:20px;
    }
    
    label.modernInput {
        z-index:1;
        position:relative;
        top:20px;
        left:20px;
        background-color:white;
        display: inline-block;
        font-size:24px;
        color:#C8C8C8;
    }
    
    input.modernInput {
        border:0;
        outline: lightgray solid 1px;
        padding-left: 10px;
        
        height:70px;
        border-radius:10px;
        color: grey;
        font-size:24px;
    }
    
    textarea.modernInput {
        padding:20px 0px;
        padding-left: 10px;
        border:0;
        width:300px;
        outline: lightgray solid 1px;
        border-radius:10px;
        color: grey;
        font-size:24px;
    }
    
    select.modernInput {
        height: 70px;
        border:0;
        width:300px;
        outline: lightgray solid 1px;
        padding-left: 10px;
        
        border-radius:10px;
        color: grey;
        font-size:24px;
        padding-left: 5px;
        background-color:field;
    }
    
    .pa_20_80_80{
        float:right;
        padding:10px;
    }
    .pa_20_80_20{
        float:right;
        padding:10px;
    }
    
}
@media (min-width: 771px) {
    
    .pgraphboxouterborder3{
        width:50%;
    }
    
    .widedstable td:nth-child(even),.widedstable th:nth-child(even) {
    }
    select{
        font: normal 11px/11px 'Open Sans';
        border: 1px solid #dedede;
        -webkit-border-radius: 1px;
        -moz-border-radius: 1px;
        border-radius: 1px;
    }
    
    .modernInputWrapper {
        position: relative;
        margin: 10px;
    }
    
    input[type=button].modernButton {
        font-size: 18px;
        font-weight:normal;
        width: 160px;
        height: 40px;
        text-align: center;
        border-radius: 8px;
        border-color: #c3c3c3;
        background: linear-gradient(90deg, #efefef, #e0e0e0);
        color:#333;
        margin:10px;
    }
    
    input[type=button].modernButtonReady:hover {
        cursor:pointer;
    }
    
    input.modernInput[type="search"] {
        border:0;
        outline: lightgray solid 1px;
        height:40px;
        padding-left: 10px;
        
        border-radius:10px;
        color: grey;
        font-size:14px;
    }
    
    input.modernInput[type="number"] {
        text-align: center;
        height: 40px;
        border:0;
        width:150px;
        outline: lightgray solid 1px;
        border-radius:10px;
        color: grey;
        padding-left: 10px;
        font-size:18px;
        margin-bottom: 10px;
    }
    
    label.modernInput {
        z-index:1;
        position:absolute;
        background-color:white;
        display: inline-block;
        font-size:16px;
        color:#C8C8C8;
        top: -0.8em;
        left: 0.7em;
        padding: 0 5px;
    }
    
    input.modernInput {
        border:0;
        outline: lightgray solid 1px;
        height:40px;
        padding-left: 10px;
        margin-bottom: 10px;
        border-radius:10px;
        color: grey;
        font-size:14px;
        width: 250px;
    }
    
    textarea.modernInput {
        border:0;
        width:400px;
        outline: lightgray solid 1px;
        border-radius:10px;
        padding: 10px;
        
        color: grey;
        font-size:14px;
    }
    
    select.modernInput {
        height: 40px;
        border:0;
        width:250px;
        outline: lightgray solid 1px;
        border-radius:10px;
        color: grey;
        padding-left: 10px;
        margin-bottom: 10px;
        font-size:18px;
    }
}

@media (max-width: 930px) {
    .pa_kvsetduo ul li{
        width:100%;
    }
    .pa_kvsetduo ul li:nth-child(even) {
        background-color: #d8d8d8;
    }
    
    .pa_kvset ul li{
        width:100%;
    }
}
@media (min-width: 931px) {
    .pa_kvsetduo ul li{
        width:50%;
    }
    
    .pa_kvsetduo ul li:nth-child(4n+3), .pa_kvsetduo ul li:nth-child(4n) {
        background-color: #d8d8d8;
    }
    
    .pa_kvset ul li{
        width:100%;
    }
    
    
    .pa_kvset input, .pa_kvset select{
        width:100%;
    }
    
    .pa_kvset ul li:nth-child(2n+1), .pa_kvset ul li:nth-child(2n) {
        background-color: #d8d8d8;
    }
    
}


@media screen and (max-width: 1000px) {
    
    .pgraphboxouterborder2{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width:100%;
        padding:10px;
        float:left;
    }
    .pgraphboxouter2{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        /*margin:22px 0 0 22px;*/
        font: .8em 'Open Sans';
        width:100%;
        position: relative;
        height:390px;
        margin:0;
        padding:10px 20px 10px 10px;
        border:1px solid #aaa;
    }
    
    .pgraphbox2{
        background-color:#fff;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        /*margin:22px 0 0 22px;*/
        font: .8em 'Open Sans';
        width:95%;
        margin:0 10px 10px 20px;
        position: absolute;bottom: 0;left:0;
        height:300px;
        padding:0;
        font-family:verdana;
        font-size:11px;
        border:0;
    }
}

@media (max-width: 1330px) {
    
    .clearboxpadding{
        padding:0 5%;
    }
    
    .pgraphboxouterborder{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width:100%;
        padding:10px;
        float:left;
    }
    .pgraphboxouter{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        /*margin:22px 0 0 22px;*/
        font: .8em 'Open Sans';
        width:100%;
        height:390px;
        margin:0;
        padding:10px 20px 10px 10px;
        border:1px solid #aaa;
    }
    
    .pgraphbox{
        background-color:#fff;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        font: .8em 'Open Sans';
        width:95%;
        margin:0 10px 10px 20px;
        position: absolute;bottom: 0;left:0;
        height:300px;
        padding:0px;
        font-family:verdana;
        font-size:11px;
        border:0px;
    }
    .pa_docwindowfullheight{
        height:80vh;
    }
    
    
    .pa_docwindow{
        border:0px solid red;
        background-color:#fff;
        color:black;
        top:5vh;
        left:5%;
        position:fixed;
        padding:0px;
        margin:0px;
        width:90%;
        z-index:100;
        
        font-family:'Open Sans';
        font-weight:normal;
        font-size:.9em;
        -webkit-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
        -moz-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
        box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    }
    
    .pa_confwindow{
        width:490px;
    }
    
    .pa_30_70_70{
        padding:10px;
    }
    .pa_30_70_30{
        padding:10px;
    }
    
    .pa_20_80_80{
        width:calc(80% - 20px);
        float:right;
        padding:10px;
    }
    .pa_20_80_20{
        width:calc(20% - 20px);
        float:left;
        padding:10px;
    }
}
@media (min-width: 1331px) {
    .pa_docwindowfullheight{
        height:80vh;
    }
    .pa_docwindow{
        border:0px solid red;
        background-color:#fff;
        color:black;
        top:5%;
        right:40px;
        position:fixed;
        padding:10px;
        margin:0;
        width:1200px;
        /*#		height:80vh;*/
        z-index:1;
        
        font-family:'Open Sans';
        font-weight:normal;
        font-size:.9em;
        -webkit-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
        -moz-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
        box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    }
    .pa_confwindow{
        width:490px;
    }
    .pa_30_70_70{
        width:calc(70% - 20px);
        float:right;
        padding:10px;
    }
    .pa_30_70_30{
        width:calc(30% - 20px);
        float:left;
        padding:10px;
    }
    
    .pa_20_80_80{
        width:calc(80% - 20px);
        float:right;
        padding:10px;
    }
    .pa_20_80_20{
        width:calc(20% - 20px);
        float:left;
        padding:10px;
    }
}

@media (max-width: 1469px){
    .editcustomer_table{
        width: 1000px;
    }
    .editcustomer_right_td{
        display: none;
    }
    .editcustomer_td2_process_div, .editcustomer_td2_toolbox_div{
        display: block;
    }
}

@media (min-width: 1470px){
    .pgraphboxouterborder3{
        width:33.3%;
    }
    
    .editcustomer_table{
        width: 1470px;
    }
    .editcustomer_right_td{
        display: table-cell;
    }
    .editcustomer_td2_process_div, .editcustomer_td2_toolbox_div{
        display: none;
    }
}

@media (max-width: 1930px) {
    
    .clearboxpadding{
        padding:0 10%;
    }
    
    .pgraphboxouterborderfull{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width:100%;
        padding:10px;
        float:left;
    }
    
    .pgraphboxouterborder{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width:50%;
        padding:10px;
        float:left;
    }
    .pgraphboxouter{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        /*margin:22px 0 0 22px;*/
        font: .8em 'Open Sans';
        width:100%;
        height:390px;
        margin:0px;
        position: relative;
        padding:10px 20px 10px 10px;
        border:1px solid #aaa;
    }
    
    .pgraphbox{
        background-color:#fff;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        font: .8em 'Open Sans';
        height:300px;
        
        width:95%;
        margin:0 10px 10px 20px;
        position: absolute;bottom: 0;left:0;
        
        padding:0px;
        font-family:verdana;
        font-size:11px;
        border:0px;
    }
}
@media (min-width: 1931px) {
    .pgraphboxouterborderfull{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width:100%;
        padding:10px;
        float:left;
    }
    
    .pgraphboxouterborder{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding:10px;
        width:33.3%;
        float:left;
    }
    
    .pgraphboxouter{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        position: relative;
        font: 0.8em 'Open Sans';
        width:100%;
        height:390px;
        padding:10px 20px 10px 10px;
        font-family:verdana;
        font-size:11px;
        border:1px solid #ccc;
    }
    
    .pgraphbox{
        background-color:#fff;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        /*margin:22px 0 0 22px;*/
        font: .8em 'Open Sans';
        
        width:95%;
        margin:0 10px 10px 20px;
        position: absolute;bottom: 0;left:0;
        
        height:300px;
        padding:0;
        font-family:verdana;
        font-size:11px;
        border:0px;
    }
}


#innerpcontent{
    background-color:#ccc;
    border:1px solid #aaa;
    width:100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    /*margin:22px 0 0 22px;*/
    font: .8em 'Open Sans';
    padding:15px;
}

#pcontentspacer{
    width:100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding:22;
}

#toptoolboxseperator{
    float:left;
    width:4px;
    background-color:black;
    height:60px;
}

#toptoolboxleft{
    padding:15px 0 0px 22px;
    float:left;
    width:425px;
    font: .8em 'Open Sans';
}

#toptoolboxright{
    padding:15px 0 0px 22px;
    float:left;
    margin-left:10px;
    font: .8em 'Open Sans';
}

#toptoolboxrightlarge{
    padding:0 0 0 22px;
    float:left;
    margin-left:10px;
    font: .8em 'Open Sans';
}

#toptoolboxrightsmall{
    width:250px;
    float:left;
    margin-left:10px;
    font: .8em 'Open Sans';
}

#ph1{
    padding:0 0 0 22px;
    display: inline-block;
    font-size:16px;
    margin:0;
    font-weight:bold;
}

#ph2{
    padding:0 0 0 5px;
    margin:0;
    display: inline-block;
    font-size:22px;
    font-weight:bold;
}

#searchtypetext{
    padding:0 0 0 5px;
    margin:0;
    display: inline-block;
    font-size:22px;
    font-weight:bold;
}

#blackheader{
    margin:0 0 2px 22px;
    height:9px;
    width: -moz-calc(100% - 44px);
    width: -webkit-calc(100% - 44px);
    width: calc(100% - 44px);
    background-color:black;
}
#redheader{
    margin:5px 0 0px 22px;
    height:4px;
    width:395px;
    background-color:#e14557;
}

.redbg{
    /*	background-color:pcontentspacer;*/
    text-shadow: 0 0 4px #f00, 0 0 4px #f00, 0 0 4px #f00,0 0 4px #f00, 0 0 4px #f00, 0 0 4px #f00, 0 0 4px #f00, 0 0 8px #f00, 0 0 8px #f00;
    color:#fff;
    font-weight:bold;
}

.grnbg{
    /*	background-color:pcontentspacer;*/
    text-shadow: 0 0 4px #090, 0 0 4px #090, 0 0 4px #090,0 0 4px #090, 0 0 4px #090, 0 0 4px #090, 0 0 4px #090, 0 0 8px #090, 0 0 8px #090;
    color:#fff;
    font-weight:bold;
}

.yelbg {
    text-shadow: 0 0 5px #990, 0 0 6px #aa0, 0 0 7px #cc2, 0 0 8px #dd0, 0 0 9px #ee0, 0 0 10px #ff0;
    color: #fff; /* Changed to black for better contrast */
    font-weight: bold;
}

.orbg{
    text-shadow: 0 0 4px #fa0, 0 0 4px #fa0, 0 0 4px #fa0,0 0 4px #fa0, 0 0 4px #fa0, 0 0 4px #fa0, 0 0 4px #fa0, 0 0 8px #fa0, 0 0 8px #fa0;
    /*	background-color:red;*/
    color:#fff;
    font-weight:bold;
}

.linone{
    list-style-type : none;
    margin: 0px;
    padding: 0px;
}

.btnselected {
    background: #f4f4f4;
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#efefef', endColorstr='#f8f8f8'); /*  IE */
    background: linear-gradient(90deg,  #efefef, #f8f8f8);
    border-color: #c7c7c7 #c3c3c3 #bebebe;
    text-shadow: 0 1px 0 #fdfdfd;
    -webkit-box-shadow: 0 1px 1px #ebebeb, inset 0 1px 0 #f3f3f3;
    -moz-box-shadow: 0 1px 1px #ebebeb, inset 0 1px 0 #f3f3f3;
    box-shadow: 0 1px 1px #ebebeb, inset 0 1px 0 #f3f3f3;
    color:#888;
}
button, input[type=submit], input[type=reset], input[type=button]{
    display: inline-block;
    text-decoration: none;
    margin:2px;
    width:auto;
    font: bold 11px/11px 'Open Sans';
    padding: 4px 14px;
    border: 1px solid #dedede;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: #f5f5f5;
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#f0f0f0'); /*  IE */
    background: linear-gradient(90deg,  #f9f9f9, #f0f0f0);
    border-color: #cecece #c8c8c8 #c3c3c3;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    -webkit-box-shadow: 0 1px 1px #eaeaea, inset 0 1px 0 #fbfbfb;
    -moz-box-shadow: 0 1px 1px #eaeaea, inset 0 1px 0 #fbfbfb;
    box-shadow: 0 1px 1px #eaeaea, inset 0 1px 0 #fbfbfb;
}

button:disabled, input[type=submit]:disabled, input[type=reset]:disabled, input[type=button]:disabled{
    color: #999;
}

.disabled {
    cursor: not-allowed;
    color:#555;
}

input[type=checkbox], input[type=radio]{
    border: 1px solid #dedede;
    width     : 12px;
    margin    : 2px 3px;
    padding   : 0;
    font-size : 1em;
}

button:hover, input[type=submit]:hover, input[type=reset]:hover, input[type=button]:hover{
    background: #f4f4f4;
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#efefef', endColorstr='#f8f8f8'); /*  IE */
    background: linear-gradient(90deg,  #efefef, #f8f8f8);
    border-color: #c7c7c7 #c3c3c3 #bebebe;
    text-shadow: 0 1px 0 #fdfdfd;
    -webkit-box-shadow: 0 1px 1px #ebebeb, inset 0 1px 0 #f3f3f3;
    -moz-box-shadow: 0 1px 1px #ebebeb, inset 0 1px 0 #f3f3f3;
    box-shadow: 0 1px 1px #ebebeb, inset 0 1px 0 #f3f3f3;
}

#navbar{
    background-color: #bbb;
}

#navcontainer{
    padding: 0 22px 0 22px;
    margin: 0;
    border-size:0;
    background-color: #bbb;
    max-width: calc(var(--main-page-width) - 44px);;
    margin:auto;
}
#navcontainer ul{
    padding: 0;
    margin: 0;
    border-size:0;
    list-style-type: none;
}

#navcontainer ul li {
    display: inline;
    padding:0;
    margin:0;
    float:left;
    border-size:0;
}

#navcontainer ul li a{
    font-family: 'Open Sans';
    text-decoration: none;
    display:inline-block;
    text-align:center;
    padding: 8px 20px;
    margin:0;
    color: #000;
    background-color: #bbb;
    font-size: 13px !important;
    font-weight:normal;
    border-width:0;
}

#navcontainer ul li.selected a{
    background-color: #fff;
    border-color:#fff;
}

#navcontainer ul li.selected a:hover{
    background-color: #fff;
}


#topmenu{
    padding:0;
    margin:0;
}

#subnavcontainer{
    margin:6px 0 0 0;
    padding:2px 0 0 22px;
    float:left;
    bottom:0;
}

#subnavcontainer ul{
    margin: 0;
    padding: 0;
    list-style-type: none;
    border-width:0;
}

#subnavcontainer ul li {
    display: inline;
    padding:0;
    margin:0;
    border-width:0;
}

#subnavcontainer ul li a{
    font-family: 'Open Sans';
    text-decoration: none;
    display:inline-block;
    text-align:center;
    padding: 3px 8px;
    margin:0;
    color: #000;
    font-size: 11px !important;
    font-weight:normal;
    border-width:0;
}
/* defined ul style, to avoid it using style from html that was included like eg. via notat //mk freshdeskticket: 1208 */
.subnavcontainer_ul{
    font-size: 100%;
    font-family: 'Open Sans';
}

#subnavcontainer ul li.selected a{
    font-weight:bold;
}


#subnavcontainer ul li a:hover{
    color: #000;
    background-color: #ddd;
}

#searchtools {
    float:right;
    padding: 3px 22px 3px 0;
}

#searchtools ul{
    margin: 0;
    list-style-type: none;
    text-align: left;
}

#searchtools ul li {
    display: inline;
    float:right;
}

#searchtools ul li input{
    display:inline-block;
    width:150px;
    padding: 4px 14px;
    margin:0;
    color: #000;
    font-size: .7em;
    border-width:1px;
    border-color:#999;
    border-style:solid;
}

.searchnotfound{
    color: white !important;
    background-color: red;
}

#profileicon, .profileicon {
    margin: 6px 0 4px 4px;
    height:24px;
    float:right;
}

.news-bell-wrapper {
    position: relative;
    float: right;
    text-decoration: none;
    color: inherit;
    overflow: visible;
}
.news-bell-wrapper .fa-bell {
    margin: 6px 0 4px 4px;
    height: 24px;
    font-size: 20px;
    line-height: 24px;
    display: block;
}
.news-bell-badge {
    position: absolute;
    top: 6px;
    right: -2px;
    width: 10px;
    height: 10px;
    background-color: #e53935;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #bbb;
    z-index: 10;
    pointer-events: none;
}
.theme-dark .news-bell-badge,
html.theme-dark .news-bell-badge {
    box-shadow: 0 0 0 2px #4d565f;
}

.news-bell-has-new .fa-bell {
    animation: news-bell-ring 2.5s ease-in-out 3;
}
@keyframes news-bell-ring {
    0%,
    100% {
        transform: rotate(0deg) scale(1);
    }
    5% {
        transform: rotate(-12deg) scale(1.1);
    }
    10% {
        transform: rotate(12deg) scale(1.05);
    }
    15% {
        transform: rotate(-8deg) scale(1.08);
    }
    20% {
        transform: rotate(8deg) scale(1.02);
    }
    25%,
    100% {
        transform: rotate(0deg) scale(1);
    }
}

.news-popup-title {
    font-weight: bold;
    padding: 8px 12px;
    border-bottom: 1px solid #ddd;
    margin-bottom: 8px;
}
.news-popup-list {
    max-height: 350px;
    overflow-y: auto;
}
.news-popup-loading {
    padding: 20px;
    text-align: center;
}
.news-card {
    background: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 12px;
    margin-bottom: 10px;
}
.news-card-title {
    font-weight: bold;
    margin-bottom: 6px;
}
.news-card-content {
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 6px;
    white-space: pre-wrap;
    word-wrap: break-word;
}
.news-card-date {
    font-size: 11px;
    color: #666;
}

.news-popup-window {
    background-color: #fff;
}

#logoninfo{
    padding: 10px 4px 4px 0;
    margin:0;
    float:right;
    font-size: .7em;
    color:white;
    font-weight:normal;
}

#navcontainer ul li a:hover{
    color: #000;
    background-color: #ddd;
}
#cleardiv{
    clear: both;
}
.cleardiv{
    clear: both;
}

#profilewindow{
    padding:0px;
    text-align:right;
    font-family:'Open Sans';
    font-weight:normal;
    font-size:13px;
}

#profilewindow a{
    font-family:'Open Sans';
    font-weight:bold;
    font-size:13px;
}

#profilewindow ul{
    list-style-type: none;
    padding: 0;
    margin: 0;
}

#profilewindow li{
    margin: 0;
}

.alertwindow, .alertwindowdraggable {
    border-width:0px;
    background-color:#fff;
    color:black;
    padding:4px;
    margin:0px;
    font-family:'Open Sans';
    font-weight:normal;
    font-size:.9em;
}

#alertwindow {
    text-align:center;
}

#alertwindow p{
    font-weight:bold;
    color:black;
}

#alertwindow button{
    margin-right:5px;
}

#alertbar{
    position:absolute;
    background-color:#c00;
    height:15px;
    width:100%;
    z-index:100;
    color:white;
    font-family:'Open Sans';
    font-weight:bold;
    font-size:.9em;
    padding:5px 0 10px 0;
    margin:0px;
    text-align:center;
    display:none;
}

#alertbarok{
    position:absolute;
    background-color:#070;
    height:15px;
    width:100%;
    z-index:100;
    color:white;
    font-family:'Open Sans';
    font-weight:bold;
    font-size:.9em;
    padding:5px 0 10px 0;
    margin:0px;
    text-align:center;
    display:none;
}

.boxshadow{
    -webkit-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    -moz-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.65);
}

.newdialogwindow{
    border:0px solid black;
    background-color:#fff;
    color:black;
    top:0;
    left:0;
    padding:10px;
    margin:0px;
    font-family:'Open Sans';
    font-weight:normal;
    font-size:.9em;
    -webkit-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    -moz-box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
    box-shadow: 4px 0px 24px -6px rgba(0,0,0,0.75);
}

.newdialogwindow a{
    font-weight:normal;
    font-size:.9em;
    color:#222;
    text-decoration: none;
}

.newdialogwindow form fieldset{
    border-width:0px;
    border-color:white;
    padding:2px;
    color:white;
}
.newdialogwindow form input,select{
}
.newdialogwindow form button{
    margin-top:5px;
    margin-right:5px;
}

.newdialogwindow form fieldset legend{
    border-width:0px;
    border-color:white;
    padding:2px;
    color:white;
}




/* Checkbox start */

.checkboxth{
    width:50px;
    text-align:right;
}

.filters input[type=checkbox] {
    display: none;
}

.filters .icon{
    text-align: center;
    display: inline-block;
    vertical-align: top;
    padding:1px;
    margin: 3px 4px 0 3px;
}

.filters .icon .fa{
    visibility: hidden;
}

.filters input[type=checkbox]:checked + .icon .fa {
    visibility: visible;
}


/* IE8 and lower disabling hack because it does not support the :checked selector */

.filters input[type=checkbox]{
    display: inline\9;
}

.filters .icon {
    display: none\9;
}

/* Optional */

.filters{
    /* prevent accidental selection when clicking */
    user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
}

.filters label {
    cursor: pointer;
}


/* Checkbox styling */

.filters input {
    margin: 0 .1em; /* Use something similar to .icon */
}

.filters .icon {
    background-color:#fff;
    border: 1px solid;
    border-color: #dadada #e9e9e9 #e9e9e9 #dadada;
    border-radius: .3em;
    text-align: center;
    font-size: .7em;
    color: #666;
    margin: 0 .1em;
    height: 0.9em;
    width: 0.9em;
    padding: 0.10em;
    line-height: 1.1em;
    margin:0.3em;
    margin-right:6px;
    /**
    * Values for height, width and line-height
    * may need to be adjusted depending on your font.
    */
}


.filters .colored {
    border: 0;
    font-size: 1em;
    color: #fff;
    margin: 0 .1em;
    height: 1em;
    width: 1em;
    padding: 0.10em;
    line-height: 1.1em;
    margin:0.3em;
    margin-right:6px;
}

/* Inline menu styling */



/* Checlbox slut */

.pa_kvsetclear{
    margin:0px;
    overflow: hidden;
}

.pa_kvsetclear ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.pa_kvsetclear ul li{
    float:left;
}

.pa_kvsetclear h3{
    margin: 0;
    padding: 2px 3px 2px 3px;
    font: 13px 'Open Sans';
    font-weight:bold;
}

.pa_kvsetclear ul li div:nth-child(1){
    float:left;
    padding:3px 4px 3px 4px;
    font: 13px 'Open Sans';
}

.pa_kvsetclear ul li div:nth-child(2){
    float:right;
    padding:3px 4px 3px 4px;
    font: 13px 'Open Sans';
}
.pa_kvsetclear ul li{
    width:100%;
}
.pa_kvsetclear ul li:nth-child(2n+1), .pa_kvset ul li:nth-child(2n) {
}


.pa_kvset{
    border:2px solid #a0a0a0;
    margin:0px;
    overflow: hidden;
}

.pa_kvset ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.pa_kvset ul li{
    background-color: #cdcccd;
    float:left;
}

/* Processes box (gui_generateAccountingProcessesTable) - the list runs to a
   few thousand pixels on installations with many processes, so cap it and let
   it scroll instead of pushing the rest of the page down. */
.pa_kvset.processeslist {
    /* Matches the 18px the br separators give the other boxes in this
       column - only bottom, or the br before the first box doubles it. */
    margin: 0 0 18px 0;
    max-height: 80vh;
    overflow-y: auto;
    scrollbar-width: thin;
}

/* Header stays put while the list scrolls under it. z-index because the
   process buttons below have their own backgrounds. */
.pa_kvset.processeslist h3 {
    position: sticky;
    top: 0;
    z-index: 1;
}

.pa_kvsetduo{
    border:2px solid #a0a0a0;
    margin:0px;
    overflow: hidden;
}

.pa_kvsetduo ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.pa_kvsetduo ul li{
    background-color: #cdcccd;
    float:left;
}


.pa_kvset3070 ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.pa_kvset3070 ul li input, .pa_kvset3070 ul li select{
    width:100%;
}

.pa_kvset3070 ul li{
    width:100%;
    overflow:hidden;
}

.pa_kvset3070 ul li div:nth-child(1){
    float:left;
    border:0px solid red;
    padding:3px 0 3px 0;
    width:29%
}

.pa_kvset3070 ul li div:nth-child(2){
    float:right;
    border:0px solid green;
    padding:3px 0 3px 0;
    width:69%
}


#address_container{
    border-style: solid;
    border-color: black;
    border-width:0 0 1px 0;
    padding:0;
}

/* basic-legacy.css has fieldset{margin:0 0 8px 0 !important}, which the inline
   margin:0 on the element cannot beat - scoped to the fieldset so the tables
   and divs elsewhere that share this id keep their spacing. The padding puts
   6px between the last row and the bottom border, which basic-legacy sets to
   0 !important as well. The background matches the rows so the strip reads as
   part of the list rather than a gap; basic-legacy forces fieldsets
   transparent. */
fieldset#address_container {
    margin: 0 !important;
    padding: 0 0 6px 0 !important;
    background-color: #cdcccd !important;
    /* Match the .pa_kvset boxes: their border is #a0a0a0, not the black
       basic-legacy forces on every fieldset. Sides off so the block sits flush
       with the rows around it. */
    border-color: #a0a0a0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    /* The Kontakt header below the block closes it off instead. */
    border-bottom: 0 !important;
}

/* .pa_kvset h3 is #555; basic-legacy paints fieldset legends #333. */
fieldset#address_container > legend {
    background-color: #555 !important;
}

@media (min-width: 931px) {
    /* Same width where .pa_kvset ul li switches to #d8d8d8. */
    fieldset#address_container {
        background-color: #d8d8d8 !important;
    }
}

/* Space above the Adresseinfo header. The fieldset is a block formatting
   context sitting below the floated rows, so its own margin-top is swallowed
   by the float clearance - clear the wrapper first, then its padding is what
   actually moves the header down. */
#address_container_wrap {
    clear: both;
    padding-top: 6px;
    /* Same row colour as the fieldset below it, so the strip reads as part of
       the list rather than the darker .bi_re backdrop showing through. */
    background-color: #cdcccd;
}

@media (min-width: 931px) {
    #address_container_wrap {
        background-color: #d8d8d8;
    }
}

#address_container legend{
    margin: 0;
    padding: 2px 3px 2px 3px;
    font: 13px 'Open Sans';
    font-weight:bold;
    color: white;
    background-color:#555;
    width:100%;
}


.pa_kvsetduo h3{
    margin: 0;
    padding: 2px 3px 2px 3px;
    font: 13px 'Open Sans';
    font-weight:bold;
    color: white;
    background-color:#555;
}

.pa_kvsetduo H3 A{
    color:white;
}

.pa_kvsetduo ul li div:nth-child(1){
    border:0px solid red;
    float:left;
    padding:3px 4px 3px 4px;
    font: 13px 'Open Sans';
}

.pa_kvsetduo ul li div:nth-child(2){
    border:0px solid green;
    float:right;
    padding:3px 4px 3px 4px;
    font: 13px 'Open Sans';
}


.pa_kvset h2{
    margin: 0;
    padding: 2px 3px 2px 3px;
    font: 13px 'Open Sans';
    font-weight:normal;
    line-height: 22px;
}

.pa_kvset h3{
    color: white;
    background-color:#555;
    margin: 0;
    padding: 2px 3px 2px 3px;
    font: 13px 'Open Sans';
    font-weight:bold;
}

.pa_kvset ul li div:nth-child(1){
    border:0px solid red;
    float:left;
    padding:3px 4px 3px 4px;
    font: 13px 'Open Sans';
}

.pa_kvset ul li div:nth-child(2){
    width:60%;
    float:right;
    padding:3px 4px 3px 4px;
    font: 13px 'Open Sans';
}

/* Align pacalendar-wrapped inputs with plain inputs in .pa_kvset cells. */
.pa_kvset .pac:not(.pac-popup){
    padding-left: 0;
    padding-top: 0;
}

#buttonpanel1{
    display:none;
    margin:0 0 0 0;
}

#buttonpanel1 button{
    padding:4px 0 4px 0;
    width:85px;
}

#buttonpanel2{
    display:none;
    text-align:right;
    margin:0 0 0 0;
}
#buttonpanel2 button{
    padding:4px 0 4px 0;
    width:72px;
}

#dimmer
{
    background:#000;
    opacity:0.5;
    position:fixed; 
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:none;
    z-index:0;
}

.pa_kvset ul li div:nth-child(2){
    float: right;
    text-align:right;
    padding:2px 4px 2px 4px;
    line-height: 20px;
}
.pa_kvset ul li div:nth-child(1){
    line-height: 20px;
}

.pa_kvset ul li{
    height: 26px;
}

/* Field text sat above the label baseline: 11px Verdana centred in an 18px
   box lands 3px higher than 13px Open Sans on the label's 20px line (2px for
   selects). Nudged with position/top so the fixed 26px row height is
   unaffected - vertical-align would grow the line box.
   Matched by exclusion: not every field carries a type attribute, and the one
   that does not was left behind by an input[type=text] selector. */
.pa_kvset ul li input:not([type=radio]):not([type=checkbox]):not([type=hidden]):not([type=submit]):not([type=button]):not([type=reset]):not([type=file]) {
    position: relative;
    top: 3px;
}

.pa_kvset ul li select {
    position: relative;
    top: 2px;
}

/* Radios carry no text of their own, so centre them on the label's x-height
   rather than its baseline - same 26px row, so nudged the same way. */
.pa_kvset ul li input[type=radio] {
    position: relative;
    top: 4px;
}

/* basic-legacy.css restyles every field inside a fieldset - 13px Open Sans,
   a flat 1px grey border, its own padding, all !important - which stands the
   Adresseinfo fields 22px tall with a border no other row has. This block is
   only a fieldset so it can carry a legend, so put its fields back on the
   list's own metrics; the shared nudge above then lands them on the label
   baseline like everywhere else. */
#address_container li input:not([type=radio]):not([type=checkbox]):not([type=hidden]):not([type=submit]):not([type=button]):not([type=reset]):not([type=file]) {
    font: 11px Verdana, Arial, sans-serif !important;
    padding: 0 2px 1px !important;
    /* revert hands the border back to the browser default the other inputs
       draw, rather than guessing at its inset shading. */
    border: revert !important;
}

#address_container li select {
    font: 11px 'Open Sans', sans-serif !important;
    padding: 0 !important;
    /* Selects are not on the UA default anywhere - this is the `select` rule
       further up, which basic-legacy overrides inside a fieldset. */
    border: 1px solid #dedede !important;
}

.warningmessage{
    text-align: center;
    font-weight: bold;
    background-color: yellow;
    color: black;
}

.pa_tooltip {
    width: auto;
    padding: 4px;
    border: 1px solid #ccc;
    box-shadow: 0 0 3px rgba(0, 0, 0, .3);
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .3);
    border-radius: 3px;
    -webkit-border-radius: 3px;
    position: absolute;
    top: 5px;
    color: black;
    left: 20px;
    display: none;
    background-color: white;
    white-space: nowrap;
    z-index: 100;
}

.infoicon {
    cursor: pointer;
    display: block;
}

.infoicon:hover+.pa_tooltip {
    display: block;
}

.pa_tooltip:hover {
    display: block;
}

.plaintable td{
    background-color: white !important;
    color: black;
}

.plaintable a:visited, .plaintable a:link{
    color:black;
}

.plaintable_color{
    color:black;
}

.highlightrow td{
    background-color: white;
}

.operation_error {
    color: red;
    font-weight: 600 !important;
}

.operation_warning {
    color: darkorange;
    font-weight: 600 !important;
}

.operation_ok {
    color: darkgreen;
    font-weight: 600 !important;
}

.subtitle {
    background-color: #ff8888 !important;
    color: black !important;
    text-align: center !important;
}


.errorlog > tbody > tr > td:last-child, .operation_status > tbody > tr > td:last-child {
    text-align: right;
}

.errorlog > tbody > tr > td:first-child {
    width: 140px;
    min-width: 140px;
    max-width: 140px;
    
}

.errorlog > tbody > tr > td:nth-last-child(2) > div, .divHeaderSmall {
    width: 240px;
    min-width: 240px;
    max-width: 240px;
    overflow-x: hidden !important;
    direction: rtl;
}

.errorlog > tbody > tr > td:nth-last-child(3) {
    width: 10000px;
}


.errorlog > tbody > tr > td:nth-last-child {
    width: 140px;
    min-width: 140px;
    max-width: 140px;
}

.errorlog > tbody > tr > td {
    vertical-align: top;
    text-align: left;
}

.errorlogsmall > td > div, .divHeaderSmall {
    overflow-x: hidden !important;
    overflow-y: hidden !important;
    height: 18px !important;
    max-height: 18px !important;
    border: none;
    padding: 0;
}

.errorlogsmall > td, .errorlogsmall > td > div {
    cursor: pointer;
}

.errorLogSearchDirection {
    color:green;
}

#errorLogSearchString {
    background-color: white;
    transition: background-color 100ms linear;
}

#errorLogSearchStringNotFound {
    background-color: red;
    transition: background-color 100ms linear;
}

.errorlogHighlighted {
    background-color: #fd0 !important;
}

#th_status_last_child {
    text-align: right !important;
}

.clickable {
    cursor: pointer !important;
}

.clickable:hover {
    text-decoration: underline;
}

.ignoreButton {
    font-size-adjust: 0.45;
    padding-top: 2px;
    padding-bottom: 2px;
    margin-top: 0;
    margin-bottom: 0;
}

.fromto-input-container,
.address-input-container,
.zipcity-input-container {
    display: flex;
    gap: 5px;
    width: 100%;
}

.fromto-input-container input,
.address-input-container input,
.zipcity-input-container input {
    flex-grow: 0;
    flex-shrink: 1;
    min-width: 0;
    box-sizing: border-box;
}

/* Address input specifics */
.address-input-container input:nth-child(1) {
    flex-basis: 50%;
}

.address-input-container input:nth-child(2),
.address-input-container input:nth-child(3) {
    flex-basis: 15%;
}

.address-input-container input:nth-child(4) {
    flex-basis: 20%;
}

/* Zip/City input specifics */
.zipcity-input-container input:nth-child(1) {
    flex-basis: 30%;
}

.zipcity-input-container input:nth-child(2) {
    flex-basis: 70%;
}

/* From to input specifics */
.fromto-input-container input:nth-child(1) {
    flex-basis: 50%;
}

.fromto-input-container input:nth-child(2) {
    flex-basis: 50%;
}

.filter-form-container {
    width: 90%;
}

.filter-form-container label {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
    gap: 5px;
}

.filter-form-container label span {
    width: 150px;
    margin-right: 5px;
    white-space: nowrap;
}

.filter-form-container input,
.filter-form-container select {
    flex: 1;
    width:100%;
}

#joblists{
    position:fixed;
    bottom:0;
    left:0;
}
.joblistitem{
    border:1px solid #ddd;
    background-color:#eee;
    width:350px;
    height:26px;
    margin:2px;
    border-radius: 10px;
}
.joblistitem div:first-child{
    float:left;
    height:26px;
    padding:0;
    margin:2px;
    font-size:15px;
}

.joblistitem div:last-child{
    float:right;
    height:26px;
    padding:0;
    margin:2px;
}

.massinput {
    width: 100%;
    height: 400px;
    margin-bottom: 10px;
    margin-top: 10px;
}

.submitbuttons {
    text-align: right;
}

.spacedTop {
    padding-top: 10px;
}

.secrets-value{
    max-width: 150px;
    text-overflow: ellipsis;
    overflow-x: clip;
}

.margin-top-10{
    margin-top: 10px;
}

.searchBoxElement, .searchBoxElement::selection {
    background-color: white;
    border: 1px solid #aaa;
    position: absolute;
    max-height: 297px;
    overflow-x: hidden;
    overflow-y: auto;
    margin: 0;
    padding: 0;
    
    list-style: none;
    z-index: 30;
    -ms-overflow-style: auto;
    scrollbar-width: thin;
}

.searchBoxElement span {
    padding: 0 5px;
}

.searchBoxElement li, .searchBoxElement li span::selection {
    background-color: white;
    color: black;
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    padding: 4px 0 4px 0;
}

.searchBoxElement li.selected, .searchBoxElement li.selected span::selection{
    background-color: #2064d4;
    color: white;
    cursor: default;
}

.refineText{
    height: 19px;
    text-align: left;
    padding: 2px 2px 2px 4px;
    border: 1px solid black;
    background-image: url("/img/dropdown.svg");
    background-size: 14px;
    background-clip: padding-box;
    background-repeat: no-repeat;
    background-position-y: center;
    background-position-x: right;
}

.sidebar {
    box-sizing: border-box;
    width: 160px;
    flex-shrink: 0;
    position: sticky;
    top: 0;
    background: #fff;
    border: 1px solid #ccc;
    padding: 10px;
    box-shadow: 4px 0 24px -6px rgba(0,0,0,0.75);
}

#sidebar-list a {
    display: inline-block;
    text-decoration: none;
    padding: 2px 8px;
}

.threecolumn-wrapper {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
    margin: 0 auto;
    min-width: 800px;
}


.reconciled {
    background-color: #ddd;
    text-decoration: line-through;
}

.removeReconciliation {
    background-color: red !important;
    color: red;
}

.confirmReconcile {
    color: green;
}

.suggestReconcile {
    color: #abefed;
}

.historyFavicon {
    height: 17px;
}

.historyFaviconSmall {
    height: 16px;
    padding-right: 5px;
    cursor: pointer;
}

.overlayContainer {
    width: 17px;
    height: 17px;
    position: relative;
    overflow: visible;
    float: left;
    margin: 3px 4px 0 0;
}

.baseAnchor {
    position: absolute;
    top: 0;
    left: 0;
}

.favoriteOverlay {
    width: 700px;
    position: absolute;
    left: calc(-700px + 17px);
    z-index:12;
}

.favoriteOverlayTop {
    font-weight: bold;
    background-color:white;
    height: 19px;
    width: 19px;
    left: -2px;
    top: 0;
    z-index: 15;
}

.favoriteOverlayMenu {
    top: -4px;
    left: calc(-700px - 14px);
    background-color:white;
    padding: 10px 16px 10px 16px;
    overflow-y: auto;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.2);
}

.favoriteOverlayMenu > div > h3 {
    font-size: 100%;
}

.favoriteSpan {
    width: calc(700px - 40px);
    overflow: hidden;
}


.historyNote {
    font-size: 80%;
    font-style: italic;
}

.hiddenOverlay {
    visibility: hidden;
    opacity: 0;
    animation: fadeIn 1s;
    transition: visibility 0.15s, opacity 0.10s linear;
}

.visibleOverlay {
    visibility: visible;
    opacity: 1;
    transition: visibility 0s, opacity 0.10s linear;
}

.popup, .popup::selection {
    box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.2);
    position: fixed;
    background-color: #ddd;
    border: 1px solid #ccc;
    padding: 3px 5px;
    border-radius: 4px;
    display: none;
    transition: all 1.5s ease-in-out;
    z-index: 500;
    font-size: 100%;
}
/* Error modal overlay */
#pa-error-modal-overlay {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    justify-content: center;
    align-items: center;
}

#pa-error-modal-overlay .pa-error-modal {
    background: #fff;
    border-radius: 8px;
    padding: 24px 28px;
    max-width: 700px;
    width: 90%;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
    position: relative;
}

#pa-error-modal-overlay .pa-error-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

#pa-error-modal-overlay .pa-error-modal-header h3 {
    margin: 0;
    color: #c0392b;
}

#pa-error-modal-overlay .pa-error-modal-close {
    cursor: pointer;
    font-size: 22px;
    color: #888;
    padding: 0 4px;
}

#pa-error-modal-overlay .pa-error-modal-body {
    white-space: pre-wrap;
    word-wrap: break-word;
    font-family: inherit;
    font-size: 13px;
    line-height: 1.6;
    margin: 0;
    color: #333;
}


/* Clearhaus missing transaction section in error modal */
.ch-missing {
    padding: 15px;
    background: #f8f8f8;
    border-top: 1px solid #ddd;
}

.ch-missing h4 {
    margin: 0 0 10px 0;
    color: #333;
}

.ch-missing table {
    margin-bottom: 12px;
    color: #222;
}

.ch-missing-actions {
    display: flex;
    gap: 20px;
}

.ch-missing-action {
    flex: 1;
    padding: 12px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.ch-missing-action h5 {
    margin: 0 0 8px 0;
    color: #333;
}

.ch-missing-action p {
    font-size: 11px;
    color: #555;
    margin: 0 0 8px 0;
}

.ch-missing-action label {
    color: #333;
}

.ch-missing-action input[type="text"] {
    width: 100%;
    margin: 4px 0 8px 0;
}

/* Email queue status */
.emailqueue-status-ready   { color: #2a7a2a; font-weight: bold; }
.emailqueue-status-running { color: #b07000; font-weight: bold; }
.emailqueue-status-failed  { color: #cc0000; font-weight: bold; }

.salesperson-hint { color:#888; font-size:0.9em; }

.ruleoperator {
    font-style: italic;
    font-size: 70%;
    list-style-type: none;
    margin-left: -18px;
    padding: 0;
}

.rulepopup {
    position: fixed;
    min-width: 500px;
    max-height: 90%;
    overflow: auto;
    padding: 10px;
    top: 5%;
    left: calc(50% - 250px);
    background-color: white;
    box-shadow: 4px 0 24px -6px rgba(0,0,0,0.75);
    z-index: 20;
}

#draghead {
    padding: 6px;
    text-align: center;
    cursor: grab;
    background-color: rgb(85, 85, 85);
    color: rgb(255, 255, 255);
}

/* Billing filter toolbox rows (cutransactions + blinvoicescustomer) */
.cu-filter-row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-bottom: 6px; }
.cu-filter-row:last-child { margin-bottom: 0; }
.cu-filter-row > label { display: inline-flex; align-items: center; white-space: nowrap; }
.cu-filter-row .cu-date-label > span { display: inline-block; width: auto; margin-right: 6px; white-space: nowrap; }
.cu-filter-row .cu-date-label > input[type=text] { width: 100px; }
.cu-filter-row .cu-date-sep { margin: 0 6px; color: #888; }
.cu-filter-row > input[type=submit] { width: auto; }


/* -- Customer search dropdown (pa_search.js) -- */
#searchtools ul li {
    position: relative;
}

.search-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 2px);
    right: 0;
    width: 505px;
    max-width: 90vw;
    /* Fallback only - pa_search.js sets max-height from the room below the input. */
    max-height: calc(100vh - 120px);
    overflow-y: auto;
    background-color: #fff;
    border: 1px solid #999;
    border-radius: 3px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    z-index: 3000;
    text-align: left;
    scrollbar-width: thin;
}
.search-dropdown.visible {
    display: block;
}

.search-dropdown-section {
    padding: 4px 0;
}
.search-dropdown-section + .search-dropdown-section {
    border-top: 1px solid #e2e2e2;
}

.search-dropdown-header {
    padding: 8px 14px 4px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #888888;
}

#search-dropdown .search-result-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    cursor: pointer;
    /* Rows are <a> now - strip the link look (global A:link sets bold
       and a color), keep the row look. Selector is id-qualified so it
       outweighs that A:link rule. */
    color: inherit;
    text-decoration: none;
    font-weight: normal;
}
.search-result-item:hover,
.search-result-item.selected {
    background-color: #eef4ff;
}

.result-star {
    flex-shrink: 0;
    /* Visual icon is small (12px) but the click target is enlarged via
       padding so the star is easy to hit. Negative margin cancels the
       vertical padding so the row height stays the same. */
    width: 32px;
    padding: 8px 0;
    margin: -8px 0;
    text-align: center;
    font-size: 12px;
    color: #cccccc;
    cursor: pointer;
}
.result-star:hover,
.result-star.is-favorite {
    color: #f5b301;
}

/* Customer details and note stacked on their own lines */
.result-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.result-text {
    font-size: 13px;
    color: #222222;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.result-note {
    font-size: 10px;
    color: #999999;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Rows without a note stay on a single line */
.result-note:empty {
    display: none;
}

/* Favorite note (customerhistory.chnote) - shown on the row, edited in place */
.result-note-edit {
    flex-shrink: 0;
    /* Same enlarged hit area trick as .result-star */
    width: 24px;
    padding: 8px 0;
    margin: -8px 0;
    text-align: center;
    font-size: 11px;
    color: #cccccc;
    cursor: pointer;
}
.result-note-edit:hover {
    color: #4a76c8;
}

#search-dropdown .result-note-input {
    width: 100%;
    box-sizing: border-box;
    margin-top: 1px;
    min-width: 0;
    padding: 1px 4px;
    font-size: 10px;
    font-family: inherit;
    color: #222222;
    background-color: #fff;
    border: 1px solid #999;
    border-radius: 2px;
}

.search-result-item.editing-note .result-note {
    display: none;
}

.search-dropdown-empty {
    padding: 16px 14px;
    font-size: 13px;
    color: #999999;
    text-align: center;
}


/* Text-file inline previews (used in /files preview column and CRM ticket thumbnails) */
.txt-preview-cell {
    font-size: 8px;
    line-height: 1.2;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    width: 200px;
    overflow: hidden;
    margin: 0;
    background: #f8f8f8;
    border: 1px solid #ddd;
    padding: 2px;
    white-space: pre-wrap;
}

.txt-preview-thumb {
    font-size: 8px;
    line-height: 1.2;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    margin: 0;
    padding: 2px;
    text-align: left;
    white-space: pre-wrap;
    overflow: hidden;
}

.txt-preview-icon {
    font-size: 16px;
}

#productstats-table thead th {
    vertical-align: bottom;
    text-align: center !important;
}
#productstats-table tbody td:not(:first-child),
#productstats-table tfoot td:not(:first-child) {
    text-align: center !important;
}

/* Email integration: fallback comparison + help text (dark overrides in darkmode.css) */
.fallback-title {font-weight: bold; }
.fallback-cmp { display: block; margin-top: 4px; font-size: 0.8em; color: #777; }
.fallback-cmp.differ { color: #ff8100; font-weight: bold; }