/* Colors,size and other general definitions */

/*
Fix for MacOS "Scroll-Overflow" problem
http://stackoverflow.com/questions/12046315/
*/
html {
    overflow: hidden;
    height: 100%;
}

body {
    height: 100%;
    position: fixed;
}

html,body{height:100%;width: 100%;}


/* IE - Image scale hack */
img {
    -ms-interpolation-mode: bicubic;
}

h5{
    margin-bottom: 0.75em;
}

.fontstd{
    font-family:Arial,Helvetica !important;
}

.gold                   { color:#F6AC00;                }
.gold_bg                { background-color:#F6AC00;     }

/* 'Table' rows */
.even                   { background-color:#EFEFEF;     }
.odd                    { background-color:#FAFAFA;     }

.form-required          {color:#0A0A0A;}

.no-horpad{
    padding-left: 0 !important;
    padding-right: 0 !important;
}


footer{
    height: 15px;
    position: fixed;
    width: 100%;
    background-color: white;
    bottom: 0px;
    color: whitesmoke;
    border-top: 1px solid grey;
    z-index: 1000;
    background-color: #999;
}

.content{
    padding-left: 30px;
    margin-right:30px;
}


header{
    width:100%;
    background:darkslategrey;
    border-bottom: 5px #ffac40 solid;
}

li.bp1{
    margin-bottom: 20px;
}


.doublebutton{
    height: 45px;
    line-height: 49px;
    width:100%;
}

/*
body.wjt{
    background: rgba(16,26,57,1);
    background: -moz-linear-gradient(top, rgba(16,26,57,1) 0%, rgba(149,218,243,1) 50%, rgba(61,190,230,1) 51%, rgba(16,26,57,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(16,26,57,1)), color-stop(50%, rgba(149,218,243,1)), color-stop(51%, rgba(61,190,230,1)), color-stop(100%, rgba(16,26,57,1)));
    background: -webkit-linear-gradient(top, rgba(16,26,57,1) 0%, rgba(149,218,243,1) 50%, rgba(61,190,230,1) 51%, rgba(16,26,57,1) 100%);
    background: -o-linear-gradient(top, rgba(16,26,57,1) 0%, rgba(149,218,243,1) 50%, rgba(61,190,230,1) 51%, rgba(16,26,57,1) 100%);
    background: -ms-linear-gradient(top, rgba(16,26,57,1) 0%, rgba(149,218,243,1) 50%, rgba(61,190,230,1) 51%, rgba(16,26,57,1) 100%);
    background: linear-gradient(to bottom, rgba(16,26,57,1) 0%, rgba(149,218,243,1) 50%, rgba(61,190,230,1) 51%, rgba(16,26,57,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#101a39', endColorstr='#101a39', GradientType=0 );
    background-repeat: no-repeat;
    background-color: #101a39;
}*/

body.wjt{
    background-image: url('../../img/krueger_gruppe_small.png');
    background-repeat: no-repeat;
    background-color: white;
    /*background-size: 25%;*/
    background-position: 50% 10%;
    width: 100%;
}


div.logo-customer{
    background: url('../../img/krueger_logo.png') no-repeat;
    background-size: contain;
    width: 100%;
    height: 100px;
    background-position: center center;
    margin-top: 50px;
    text-align: center;
    padding-top: 80px;
}

form.wjt{
    /*background-color: rgba(255,255,255,0.9);
    box-shadow: 3px 9px 25px 0px;
    padding: 10px;
    margin-top: 50px;
    display: block;
    min-height: 455px;*/
}


img.brandlogo{
    margin-right: 10px;
    margin-left: 5px;
    margin-top:     -5px;
    width:250px;
}

a.navbar-brand{
    line-height: 35px;
    position: absolute;
    left: 0px;
}


#wrapper{
    height: 100%;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f3f3f3+50,ededed+51,ffffff+100;White+Gloss+%232 */
    background: rgb(255,255,255); /* Old browsers */
    background: -moz-linear-gradient(-45deg,  rgba(255,255,255,1) 0%, rgba(243,243,243,1) 50%, rgba(237,237,237,1) 51%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

    margin-top: 0px;
    padding-left: 5px;
    padding-right: 5px;
}

#wrapper-admin{
    height: 100%;
    overflow-y:auto;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f3f3f3+50,ededed+51,ffffff+100;White+Gloss+%232 */
    background: rgb(255,255,255); /* Old browsers */
    background: -moz-linear-gradient(-45deg,  rgba(255,255,255,1) 0%, rgba(243,243,243,1) 50%, rgba(237,237,237,1) 51%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

    margin-top: 0px;
    padding-left: 5px;
    padding-right: 5px;
}

.grayscale,
.grayscale_passive{
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
    -webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */
    -webkit-backface-visibility: hidden; /* Fix for transition flickering */
}


/* ## WJT ################################################################### */

nav.navbar{
    margin-bottom: 0;
    height: 90px;
    padding: 2px 0px;
    padding-bottom: 1px;
    background-color: #FFFFFF;

    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    border-color: #e7e7e7;
    border-bottom-width: 3px;
}

/* Bootstrap override */
.navbar-default {
    background-color: initial;
    border-color: initial;
}

#wrapper-admin nav.navbar{
    background-color: slategrey;
}


#page-wrapper {
    height:100%;
    overflow:hidden;
}

#page-wrapper div.row{
    height:100%;
}

#dashboard-content{
    height: 100%;
    overflow: scroll;
}

nav ul.nav{
    margin-top: -4px;
}

ul.nav.navbar-customer-selector > li{
    left: -20px;
    position: absolute;
}

a.navbar-brand{
    padding-top: 5px;
    padding-left: 5px;
    margin-left: 5px;
    line-height: 40px;
    /* height: 71px; */
    position: absolute;
    /*margin-top: 5px;*/
    line-height: 25px;
}

.navbar-title{
    left: 5px;
    position: fixed;
    top: 7px;
    color: white;
}

nav.navbar-wjt > a{
    /*margin-left: 75px;
    margin-top: 8px;*/
}

.navbar-top-links li a {
    min-height: 40px;
    line-height: 30px;
}

a.customer-choice{
    height: 50px;
    margin: 0;
    padding: 5px;
    text-align: center;
}

.wjt-button{
    background-color: rgba(72,71,71,0.9);
    width: 50px;
    height: 60px;
    line-height: 50px;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /* border-right: 4px groove white; */
    padding-right: 0px;
    /* padding-left: 15px; */
}
.wjt-button > i{
    color:whitesmoke;
}

.wjt-button:hover > i{
    color:orange;
}


.wjt-round-corner{
    border-top-right-radius: 20px;
}

#switchUser{
    /* width: 125px; */
    top: 2px;
    /* position: absolute; */
    /* right: 400px; */
    background-color: darkred;
    /* left: 243px; */
    height: 25px;
    /* margin-left: 25px; */
    width: 100%;
    /* height: 20px; */
    color: white;
}

#wjtDetailContainer{
    /*background-color: #FFF;*/
}

#wjtDetailContainer .wjt-block:last-of-type .wjt-block-content{
    margin-bottom: 200px;
}

#wjtDetailContainer > div.wjt-column-content{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#feffff+0,e6f1f7+100 */
    background: #feffff; /* Old browsers */
    background: -moz-linear-gradient(left,  #feffff 0%, #e6f1f7 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #feffff 0%,#e6f1f7 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #feffff 0%,#e6f1f7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffff', endColorstr='#e6f1f7',GradientType=1 ); /* IE6-9 */

}

.wjt-col{
    height:100%;
    overflow-y: scroll;
    overflow-x: hidden;
    border-right: 4px solid grey;
}


.wjt-col.noflow{
    overflow: hidden;
}

.round-corner-topright{
    border-top-right-radius: 50px;
}

.wjt-category-tile,
.wjt-job-tile{
    padding: 5px;
    border: none;
    border-right: 1px solid white;
    background-color: rgba(50,50,50,0.05);
    height: 110px;
}

.wjt-job-info{

}


.wjt-job-tile *:hover {
    cursor: pointer;
}

.wjt-job-tile div.tile-content{
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    height: 100%;
    width: 100%;
}

.wjt-job .wjt-workflow-todo-logo{
    /*position: absolute;
    right: 5px;
    bottom: 5px;*/
}

.wjt-job.ds-selected{
    background-color:#ffdd3c;
    background:#ffdd3c;
    cursor: pointer;

}

.todo-PM{color:green; }
.todo-DS{color:#6d1f80;}
.todo-AG{color:rosybrown;}


.wjt-jobcontrol{

}

.wjt-jobcontrol li{
    width:50px;
    height:50px;
}

.wjt-job-workflow{
    /*bottom: 2px;
    position: absolute;
    right: 45px;
    width: 35px;*/
}

.wjt-approval-workflow{
    /*position: absolute;
    right: 45px;
    bottom: 8px;
    width:35px;*/
}

.wjt-approval-workflow > .approver{
    padding: 2px;
    display: block;
    background-color: red;
    color: white;
    width: 100%;
    text-align: center;
    font-weight: bold;
    border-radius: 5px;
    margin-bottom: 0px;
    min-height: 15px;
    margin-bottom: 1px;
    margin-top:2px;
}

.wjt-job-history{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,a3a3a3+100&0+0,0.65+100 */
    background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(163,163,163,0.65) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(163,163,163,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(163,163,163,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6a3a3a3',GradientType=0 ); /* IE6-9 */
    background-color: white;

    min-height: 30px;
    margin-top: 10px;
}

.approver.PENDING   {background-color:dimgrey;}
/*.approver-pending   {background-color:orange;}*/
.approver.APPROVED   {background-color:#A1C500;}
.approver.DENIED      {background-color:darkred;color:blanchedalmond;}


.wjt-category-tile.ds-selected div.tile-image,
.wjt-category-tile:hover div.tile-image{
    opacity: 0.5;
}

.tile-icon{
    height: 100%;
    width: 100%;
    text-align: center;
    line-height: 1.8em;
    margin-left: 7px;
    color: white;
}

.wjt-category-divider{
    width:100%;
    height:30px;
    border-top:1px solid grey;
    background-size: contain;
    background-position-x: left;
    background-position-y: center;
    background-repeat: no-repeat;
    padding-left: 30px;
    line-height: 30px;
    font-size: 1.7em;
}

.wjt-category-divider:hover{
    cursor:pointer;
    background-color:#ffdd3c;
}

.aldisued{
    background-image:url(../img/logos/logo_aldi_süd.png);
}

.aldinord{
    background-image:url(../img/logos/logo_aldi_nord.png);
}

.wjt-job-body{

}

.wjt-job-body .wjt-category-tile{
    height: 95px;
    background-color: white;
    border:none;
}

/* WJT Left col - Tab logos */
.tablogo{
    width:50px;
    width: 50px;
    height: 30px;
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
}

/* the customer id as referenced in the database */
.customer-1 { background-image:url('../../img/customers/radeberger-gruppe-logo-mini.jpg');   }
/*.customer-2 { background-image:url('../../img/customers/rewe-logo-mini.png');      }*/
/*.customer-3 { background-image:url('../../img/customers/logo_plb_mini.png');       }*/

nav.column-view-modes{}

#wjtCategoryContainer{
    overflow:hidden;
}

.wjt-column-header{
    background-color: lightgrey;
}

#wjtCategoryContainer .wjt-column-header{
    position: fixed;
    width: 16.66666667%;
    left: 15px;
    z-index:0;
    padding:0;
    height:30px;
    padding-left: 50px;
}

#wjtCategoryContainer.wjt-col-collapsed .wjt-column-header{
    width:initial;
}

#wjtCategoryContainer div.tab-content{

}


#wjtCategoryContainer .wjt-column-content{
    position: fixed;
    top: 70px;
    overflow-y: scroll;
    height: 91%;
    overflow-x: hidden;
    width: 16.2%;
}

#wjtCategoryContainer.wjt-col-collapsed .wjt-column-content{
    left: 65px;
    background-color: rgba(255,255,255,0.91);
    z-index: 10;
    /* border: 1px solid; */
    box-shadow: 2px 2px 10px -2px;
    border-top-right-radius: 30px;
}

.button-category-window{
    position: absolute;
    top: 300px;
    left: 0px;
    visibility: hidden;
}

.wjt-col-collapsed .button-category-window{
    visibility: visible;
}


.wjt-column-header div.customer{
    margin-top: 3px;
    background-position: center center;
    background-repeat: no-repeat;
    border-top-right-radius: 10px;
    /* border-top-left-radius: 10px; */
    position: absolute;
    height: 50px;
    /* border-radius: 50px; */
    width: 50px;
    background-size: 70%;
    /* z-index: 10000000; */
    margin-left: 0px;

    background-color: whitesmoke;
    box-shadow: 2px -4px 9px -4px;
}

.wjt-column-header div.customer:nth-child(2){
    margin-left: 50px;
}

.wjt-column-header div.customer.ds-selected:nth-child(2){
   /* margin-left: 60px;*/
}

.wjt-column-header div.customer:nth-child(3){
    margin-left:100px;
}

.wjt-column-header div.customer.ds-selected:nth-child(3){
    box-shadow: -4px -5px 9px -4px;
}

.wjt-col-collapsed .wjt-column-header div.customer{
    left: 0;
    top: 65px;
    margin-left:0px;
}

.wjt-col-collapsed .wjt-column-header div.customer:nth-child(2){
    left: 0;
    top: 125px;
    margin-left:0px;
}

.wjt-col-collapsed .wjt-column-header div.customer:nth-child(3){
    left: 0;
    top: 185px;
    margin-left:0px;
}



.wjt-column-header div.customer:hover{
    cursor: pointer;
    background-color:rgba(255,255,255,0.5);
}

.wjt-column-header div.customer.ds-selected{
    height: 60px;
    width: 60px;
    z-index: 10;
}

.wjt-col-collapsed .wjt-column-header div.customer.ds-selected{
    width:50px;
}

#wjtJobContainer{

    overflow-y: hidden;
    height: 100%;
}


#wjtJobContainer .wjt-column-content{
    height: 100%;
    overflow-y: scroll;
    padding-bottom: -200px;
}

#wjtJobContainer .wjt-column-header,
#wjtRecipientContainer .wjt-column-header{
    height:30px;
    padding:5px;
}

#wjtJobContainer .wjt-column-header *,
#wjtCategoryContainer .wjt-column-header *{
    font-size: 10px;
    margin-top: 0px;
}

#wjtJobContainer .wjt-column-content > .wjt-job-multi:last-of-type{
    margin-bottom: 250px;
}

#wjtCategoryContainer.wjt-col-collapsed{
    width: 50px;
}

#wjtRecipientContainer{
    border-right:none;
}

#wjtRecipientContainer.wjt-col-collapsed .wjt-recipient{
    padding:0;
}
#wjtRecipientContainer.wjt-col-collapsed .wjt-recipient .company{
    display: none;
}

#wjtRecipientContainer.wjt-col-collapsed .wjt-recipient .name{
    display: none;
}

#wjtRecipientContainer.wjt-col-collapsed .wjt-recipient .name-short{
    margin-top:15px;
}
#wjtRecipientContainer.wjt-col-collapsed .wjt-recipient .icon{
    font-size: 2em;
    text-align: center;
    margin-left: 0px;
    opacity: 0.3;
}

#wjtRecipientContainer.wjt-col-collapsed .wjt-column-footer{
    bottom: 70px;
    padding: 0;
    /* border-bottom: 0px solid white; */
}

#wjtRecipientContainer.wjt-col-collapsed #wjtTheSaveButton{
    padding: 0;
    margin: 0;
    width: 100%;
    margin-bottom: 5px;
    height: 100px;
}

#wjtRecipientContainer.wjt-col-collapsed #wjtTheCancelButton{
    padding: 0;
    margin: 0;
    width: 100%;
    height: 50px;
}

#wjtRecipientContainer.wjt-col-collapsed .wjt-column-footer{
    background-color: transparent;
    border-top:none;
}

/* Last job in list has margin bottom */
#wjtJobContainer .wjt-job.wjt-job-standard:last-of-type,
#wjtJobContainer .wjt-job.wjt-job-standard:last-child{
    margin-bottom: 100px;
}

#wjtJobContainer .wjt-job-multi .wjt-job.wjt-job-standard:last-of-type{
    margin-bottom: 0px;
}

.wjt-block.user-r .wjt-block-header{
    background-color: lightgrey;
}

.wjt-block.has-unsaved-changes .wjt-block-header{
    /*border-left:20px solid orange;*/
    background-color: orange;
}

.wjt-block-standard{
    border-right: 1px solid lightgrey;
    border-left: 1px solid lightgrey;
    margin-bottom: 10px;
    /*background-color: white;*/
    /* border: 1px solid grey; */
    /* margin-bottom: 10px; */
    /*padding-bottom: 10px;*/
    /* border-top: 2px solid grey; */
    /* border-bottom: 2px solid grey; */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#feffff+0,d2ebf9+100;Blue+3D+%2312 */
    background: #feffff; /* Old browsers */
    background: -moz-linear-gradient(left,  #feffff 0%, #d2ebf9 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #feffff 0%,#d2ebf9 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #feffff 0%,#d2ebf9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffff', endColorstr='#d2ebf9',GradientType=1 ); /* IE6-9 */

}

.wjt-block-spinner{
    right: 60px;
}

.wjt-block-spinner

.wjt-block-spinner > *{
    display:none;
}

.wjt-block-files-wrapper{
    margin-bottom: 10px;
}

.wjt-block-files-list{
    height:75px;
    background-color: #F5F5F5;
}

.wjt-block-files-list > .result-row{
    height:100%;
}
.file-frame,
.wjt-block-files-list .file-frame{
    border-right: 0px dotted white;
    height: 100%;
    border: 1px solid white;
    border-left: none;
    border-top: none;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #DDD;
}

div#messagecontainer{
    max-height: 600px;
    overflow-y: auto;
    overflow-x: hidden;
    width: 100%;
}

ul.communication-entries{
    font-size: 0.8em;
}

ul.communication-entries > li:first-child{
    border: none;
    margin-bottom: 20px;
    border-bottom: 2px dashed lightgray;
    border-left: 30px solid grey;
    min-height: 100px;
}

div.messages > ul li:first-child,
.message.historyclosed > ul li:first-child{
    display: block;
    background-color: whitesmoke;
}


.messages > ul li{
    display:block;
}

.messages.historyclosed > ul li{
    display: none;
}

#wrap-recipients{
    margin-top: 10px;
    height: 35px;
    margin-bottom: 10px;
}



.history-files{
    height:100px;
}
.history-files .file-frame{
    overflow: hidden;
    /*width: 50px;
    height: 50px;
    float:left;*/
}

.file-frame:hover{
    cursor:pointer;
}

.file-frame.button-function{
    background: cornflowerblue;
    border: 1px solid white;
    color: white;
}


/*.btn{
    padding: 2px 12px;
}

.btn-small{
    padding: 2px 5px;
}*/

.btn-fileoption{
   position: absolute;
    bottom:-25px;
}

.btn-fileoption.hover-file{
    bottom: 0px;
}

.btn-fileoption.btn-fileoption-1{
    left:0%;
}

.btn-fileoption.btn-fileoption-2{
    left:33.32%;
}

.btn-fileoption.btn-fileoption-3{
    left:66.65%;
}


.col-md-6.btn-fileoption.btn-fileoption-2{
    left:50%;
}


/* Other frame(s) */
.btn-frameoption{
    position: absolute;
    bottom:-25px;
}

.btn-frameoption.hover-frame{
    bottom: 0px;
}

.btn-frameoption.btn-frameoption-1{
    left:0%;
}

.btn-frameoption.btn-frameoption-2{
    left:33.32%;
}

.btn-frameoption.btn-frameoption-3{
    left:66.65%;
}

.btn-frameoption:hover{
    color:#ffdd3c;
}


.ds-address-blimp .btn-frameoption-1{
    bottom: 0;
    margin-left:100%;
    height: 100%;
    width: 20%;
    background-color: rgba(51, 122, 183,0.85);
    border-color: rgba(46, 109, 164,0.85);
    font-size: 2em;
}
.ds-address-blimp .btn-frameoption-2 {
    bottom: 0;
    margin-left: 100%;
    height: 100%;
    width: 20%;
    background-color: rgba(51, 122, 183, 0.85);
    border-color: rgba(46, 109, 164, 0.85);
    font-size: 2em;
}
.ds-address-blimp .btn-frameoption.hover-frame{
    margin-left:80%;
}




.wjt-block-history{
    color: whitesmoke;
    background-color: darkgray;
    opacity: 0.8;
    max-height: 500px;
    overflow-y: auto;
}
.history-block{
    color:black;
}

.history-block p{
    margin:0;
}

form.INTERNAL div.newmsg-wrapper #blockCommunicationRecipients{
    display: none;
}
/*.file-frame.button-function:hover{

}*/

.navbar-header{
    font-size: 1.3em;
    color: white;
}


/* Approval block */

.approval-headline{
    color: white;
    background-color: #B1CDFF;
    height: 25px;
    line-height: 25px;
    padding-left: 15px;
    border-bottom: 1px solid black;
    border-top-right-radius: 10px;
}

.approval-step{
    min-height: 65px;
    border-top: 1px dashed grey;
    background-color: whitesmoke;
    border-left: 10px solid;
}

.approval-step.APPROVED{
    border-left: 10px solid #A1C500;
    background-color:lightgrey;
}

.approval-step.DENIED{
    border-left-color: red;
}

.approval-step.PENDING{
    border-left-color: grey;
}

.approval-step.SKIPPED{
    background-color:darkgray;
}

.approval-step.result{
    border-top:2px solid black;
}

.approval-step.topstep{
    border-top:none;
}

.approval-step > .iterator{
    text-align:center;
}

.approval-step > .iterator > span{
    font-size: 2em;
    color: grey;
    margin-bottom:20px;
}


.approval-step.current-step > .iterator > span{
    color: green;
    font-weight: bold;
}

.approval-step > .iterator label{
}

.approval-step.current-step{
    background-color: #ffdd3c;
}

.approval-step.current-step > .iterator{
    color:black;
}

.approval-remover:hover{
    color:red;
    cursor: pointer;
}

.approval-remover.disabled:hover{
    cursor:initial;
    color:initial;
}

.approval-entry-delete{
    opacity: 0.4;
}

.approval-entry-delete span.approval-remover{
    /*display: none;*/
    color:blue;
}

.approval-remover{

}

.approval-wrapper{
    /*border: 1px solid grey;*/
}

.approver-name{
    height: 20px;
    line-height: 15px;
    background-color: #AAA;
    color: white;
    font-weight: bold;
    padding-top: 2px;
}

.approver-option{
    background-color:#AAA;
    border-bottom: 1px solid lightgrey;
    height:20px;
    text-align: right;
}

.approver-data{
    background-color: #aaa;
    height: 20px;
    border-right: 1px solid lightgrey;
}

.approver-datetime{
    /* margin-top: 1px; */
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    height: 20px;
    line-height: 19px;
    background-color: #AAA;
    color: white;
    border-bottom: 1px solid lightgrey;
}

.approval-todo-wrapper{
    border-left: 1px solid grey;
    min-height: 100px;
}

.approval-todo-entry{
    height: 40px;
    margin-bottom: 5px;
}

.approval-todo-entry.external .approval-state{
    background-color:#84afd5;
}

#approval-panel{
    margin-bottom: 10px;
    border-bottom: 1px solid;
}


.label-default.approver-datetime{
    background-color: #AAA;
}

.label-primary.approver-datetime{
    background-color: #84afd5;
}

#WjtBlockApproval{
    /*min-height: 100px;*/
}


.approval-result-combined{
    min-height: 70px;
    border-bottom: 1px solid lightgrey;
    text-align: center;
    line-height: 64px;
}

.approval-initial   {background-color:dimgrey;}
.approval-pending   {background-color:orange;}
.approval-success   {background-color:darkgreen;}
.approval-fail      {background-color:darkred;color:blanchedalmond;}

.approval-header{
    height: 40px;
    width: 100%;
    background-color: #CCC;
}

.approval-entry{
    min-height:50px;
    background-color: magenta;
    overflow: hidden;
}

.approval-entry .entry-state{
    float:left;
    margin-top: 3px;
}

.approval-entry .entry-name{
    font-size: 1.5em;
    font-weight: bold;
    float: right;
    color: #555;
}



.approval-entries{
    margin-top:5px;
}

.approval-state{
    height: 20px;
    line-height: 20px;
    text-align: center;
    color: white;
    background:#AAA;
}

.approval-area-approval,
.approval-area-extconfirm{
    margin-top:5px;
}

.approval-area-approval{
    cursor: pointer;
}

/* ApprovalEntry Block */
.approval-entry-choice{
    cursor: pointer;
}

.approval-entry-choice:hover{

}

.approval-file,
.approval-info{
    cursor: pointer;
}


.approval-approver-select{

}

.approval-approver-select .external-todo-option{
    color:#337ab7;
}

.approval-history,
.approval-history .header,
.approval-history .header p{
    color:#333;
}

.approval-history .panel{
    text-align: right;
}

.approval-history .panel-heading{
    height:125px;
}

.approval-history .panel-heading span{
    text-align:right;
}

.approval-history .file-frame{
    height: 100px;
    width: 100px;
    margin-left: -15px;
}

div.alert{
    min-height: 45px;
}

div.alert > span.fa{
    display: block;
    float: left;
    margin-top: 2px;
    margin-left: 2px;
}

div.alert span.infolabel{
    display: block;
    float: left;
    line-height: 35px;
    margin-left: 10px;
}

ul.approval-entries{

    margin-top: 0;

    list-style: none;
    font-size: 1.25em;
}


/* The job compact view */
#wjtJobContainer.wjt-job-compact .wjt-job{
    height:30px;
    overflow: hidden;
}

#wjtJobContainer.wjt-job-compact .wjt-job .wjt-workflow-todo-logo{
    visibility: hidden;
}

.wjt-job-standard{
    /*width: 100%;*/
    background: #feffff; /* Old browsers */
    background: -moz-linear-gradient(left,  #feffff 0%, #d2ebf9 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #feffff 0%,#d2ebf9 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #feffff 0%,#d2ebf9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffff', endColorstr='#d2ebf9',GradientType=1 ); /* IE6-9 */
    margin-bottom: 3px;
    border: none;
    border-bottom: 1px solid cornflowerblue;
    border-left: 1px solid cornflowerblue;
    border-right: 1px solid cornflowerblue;
    border-top-right-radius: 10px;
}

.wjt-job-multi{
    display: inline-block;
    border-bottom: 25px solid cornflowerblue;
    /* border-bottom-left-radius: 20px; */
    border-bottom-right-radius: 20px;
    border-left: 3px solid cornflowerblue;
    width: 100%;
}

.wjt-job-minimal{
    border-bottom: 1px solid white;
}

.wjt-job-multi .wjt-job-standard,
.wjt-job-multi > .wjt-job-standard{
    margin-bottom: 0px;
    border-right: 0px none;
    border-bottom: 1px dotted grey;
}

.wjt-job-multi > .wjt-job-standard{

}

.wjt-job-multi > .wjt-job-standard > .wjt-job-body{
    background-color: #B1CDFF;
}

.wjt-job-standard:hover{
    box-shadow: 2px 3px 2px -3px;
}

.wjt-job-header,
.wjt-job-multi-header{
    /*height: 25px;*/
    background-color: cornflowerblue;
    border-top-right-radius: 10px;
    box-shadow: 0px 0px 6px 1px grey;
    margin-bottom: 1px;
}

.wjt-job-id{
    position: absolute;
    right: 5px;
    /*top: 28px;*/
    height: 10px;
}


div.wjt-job-locked > .wjt-job-header{
    background-color:grey;
}

.wjt-job-header.rightcol{
    padding: 2px 5px;
}

.wjt-job-title{
    margin-left: 8px;
    line-height: 32px;
}

.wjt-job-rightcol .wjt-job-title{
    font-weight:bold;
    margin-right: 80px;
}

#wjt-col-detail div.wjt-job-header{
    /*height: 35px;*/
    /* margin-top: 5px; */
    /* margin-left: 5px; */
    border-top-right-radius: 10px;
    /*box-shadow: 0px 2px 6px 1px black;*/
    margin-bottom:0px;

}

.wjt-job-multi .wjt-job-header{
    padding-left: 35px;
    background-color:  #A6C6FF;
    border-top-right-radius: 0px;
    display:none;
}

.wjt-job-multi > .wjt-job-standard{
    margin-bottom: 0px;
    /*height: 85px;*/
    border-right: 0px none;
}

.wjt-job-multi .wjt-job-tile{
    /*height: 95px;*/
}

.wjt-job-multi .wjt-job-headertext{
    /* display: none;*/
}


.wjt-job-icon{
    margin-top: -2px;
    /* font-size: 3.5em; */
    position: absolute;
    left: 10px;
    top: 5px;
    font-size: 1.5em;
    color: whitesmoke;
}

.wjt-job-breadcrumb{
    font-size: 0.7em;
    font-style: italic;
}

.wjt-job-multi .wjt-job-breadcrumb{
    display: none;
}

.wjt-job-multi .wjt-job-id{
    top:5px;
}

.wjt-job-option button{
    width: 30px;
    padding: 0;
    height: 26px;
    border-radius: 0;
    border: none;
    background-color: rgba(255,255,255,0) !important;
    color: white;
    font-size: 1.2em;
}

.wjt-job-option{
    position: absolute;
    top: 5px;
    right: 10px;
    font-size: 0.8em;
    text-align: right;
}

.wjt-column-header{
    font-size: 0.9em;
    /*background-color: rgba(245, 245, 245, 0.5);*/
    /*padding: 5px;*/
}

.wjt-column-collapser{
    width: 50px;
    height: 50px;
    padding: 0;
    border-top-right-radius: 10px;
    border: none;
    position: absolute;
    bottom: 0px;
    left: 0px;
    background-color: rgba(72,71,71,0.9);
    margin-bottom: 15px;
    z-index:1000;
}

.wjt-column-collapser:hover{
    background-color: rgba(72,71,71,1);
    color:whitesmoke;
}

.wjt-col-collapsed{
    width: 50px;
    background-color: rgba(73,73,72,0.7);
}

#wrapper.wjt-col-collapse-1 .wjt-col-collapsed{
    position: absolute;
}

#wrapper.wjt-col-collapse-4 .wjt-col-collapsed{
    position: absolute;
}

.left{
    left:0px;
}

.right{
    right:0px;
}


#wrapper.wjt-col-collapse-1{
    margin-left:50px;
}

#wrapper.wjt-col-collapse-4{
    margin-right:50px;
}

.wjt-job-indicators{
    height:100%;
    line-height: 1.75em;
}

.wjt-job-indicator{
    width: 100%;
    border-radius: 11px;
    height: 90%;
    border-right: 2px solid;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0px;
}

^

.wjt-job-rightcol{
    border-bottom: 1px dashed white;
    padding-bottom: 5px;
    background-color:#B1CDFF;
}


#wjt-job-image-zoomarea{
    position: absolute;
    height: 300px;
    width: 300px;
    border: 1px solid grey;
    background-color: rgba(255,255,255,0.5);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

ul.dropdown-menu span.fa{
    display: inline-block;
    padding-right:10px;
    width:25px;
}

.wjt-job-headertext,
.wjt-job-multi-headertext{
    font-size: 1em;
    color:white;
    max-height: 100%;
    /*overflow: hidden;*/
}

.wjt-column-footer{
    font-size: 0.9em;
    background-color: rgba(245, 245, 245, 0.7);
    padding: 5px;
    /* position: fixed; */
    bottom: 15px;
    width: 100%;
    border-top: 1px solid;
    position: absolute;
    background-color: rgba(255,255,255,0.5);
    padding-top: 10px;
    border-top: 1px solid white;
}

.wjt-loader{
    position: absolute;
    height: 50px;
    padding: 5px;
    bottom: -50px;
    text-align: center;
    background-color: rgba(50,50,50,0.8);
    width: 100%;
    color: white;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    /* border: 0px solid white; */
}

.wjt-loader.show{
    bottom:0px;
    box-shadow: 5px -5px 135px 15px;
}

.wjt-job-details{

}

.wjt-job-details-text{
    padding-right: 30px;
}

.wjt-job-deadlines{
    background-color: rgba(0,0,0,0.1);
    border-top-right-radius: 10px;
    height:50px;
}

.deadline-header {
    border-bottom:1px solid grey;
    margin-top:0px;
    margin-bottom:10px;
    display: block;
}

.deadline-row{
    height: 25px;
    overflow: hidden;
}

.deadline-date{
    font-size: 0.6em;
    font-weight: bold;
}

.deadline-ok{
    color:greenyellow;
}

.deadline-notice{
    color:RGB(254,247,160);
}

.deadline-warning{
    color:orange;
}

.deadline-alert{
    color:red;
}

.deadline-missed{
    color: darkslateblue;
}

.deadline-empty{
    color:lightgrey;
}

.deadline-well{
    min-height: 60px;
    margin-bottom: 5px;
    padding: 2px;
}

.deadline-label{
    height: 25px;
    overflow: hidden;
}

.wjt-job div.job-indicator-area{
    height:50px;
}

.wjt-job div.job-indicator-area > div.row{
    height:100%;
}

div.job-indicator-area div.job-indicator{
    padding-left: 5px;
    height: 100%;
    padding-top: 10%;
    padding-right: 0px;
}

.step-onhold{
    text-align: center;
    line-height: 45px;
}


/* WJT-Block */

.wjt-block-wrapper{
    /*background: white;*/
}


.wjt-block-button,
.wjt-block-togglebutton{
    width: 80%;
    height: 30px;
    margin-bottom: 5px;
}

.wjt-block-button span,
.wjt-block-togglebutton span{
    display: none;
}

.wjt-block-button:hover span,
.wjt-block-togglebutton:hover span {
    display: block;
    text-align: center;
}


.button-dblheight{
    height:60px;
}

.wjt-block-header{
    width: 100%;
    background-color: #B1CDFF;
    line-height: 25px;
    color: white;
    height: 27px;
    border-top-right-radius: 5px;
    border-left: 10px solid #B1CDFF;
    padding-right: 5px;
}

/*.wjt-block-header:hover{
    cursor:pointer;
    background-color:white;
    color:blue;
}*/

.wjt-block-icon{
    width: 30px;
    text-align: center;
    height: 35px;
    /* background-color: #337ab7; */
    float: left;
    margin-top: -4px;
    /* transform: rotate(336deg); */
    display: inline-block;
    /* font-size: 1.1em; */
    color: #FAFAFA;
    /* border: 1px solid white; */
    /* margin-left: 2px; */
    padding-top: 3px;
    background-color: #8EB6FF;
    border-radius: 30px;
    width: 35px;
    padding-top: 7px;
    margin-left: -7px;
}

.wjt-block-icon > div:hover{
    color:cornflowerblue;
    cursor: pointer;
}

.wjt-block-title{
    float: left;
    margin-left: 10px;
}

.wjt-block-handle{
    float: right;
    width: 30px;
    text-align: center;
}

.wjt-block-handle:hover{
    color: #337ab7;
}

.wjt-block-header > span{
    font-size: 1.2em;
}

.wjt-block-content{
    padding-top: 10px;
    background-color: transparent;
}
.wjt-block-content.collapsed{
    opacity: 0;
    height: 0px;
    padding: 0;
}

.wjt-block-option-wrapper{
    position: fixed;
    right: 5px;
    width: 75px;
}

/*.wjt-block-option-wrapper .bottom-options{
    position: fixed;
    width: 75px;
    bottom: 30px;
    right: 5px;
}*/
.bottom-options{
    width: 100%;
    text-align: center;
}

/* Specific block's css */
.wjt-block-briefing-form{
    min-height: 80px;
}

.wjt-form-element{
    margin-bottom:10px;
    font-size: 0.9em;
    line-height: 1.6em;
}

.wjt-form-element label{
    font-size:0.83em;
}



.bs-nopad{
    padding:0px;
}

.dropdown-menu{
    left: inherit;
    right:0%;
}

.datetimepicker.dropdown-menu{
    width:220px;
}
.dropdown-menu.dropdown-narrow{
    min-width:100px;
}


.new-job-button{
    width: 125px;
    background-color: chocolate;
    margin-top: 2px;
}

.userFormLabel{
    width:100px;
}

.userFormMultipleSelect {
    width:100px;
    height:150px;
}

.wjt-recipient{
    background-color: cornsilk;
    padding: 7px;
    border-bottom: 1px dotted #CCC;
}

.wjt-recipient:hover{
    cursor: pointer;
    background-color: rgba(255,255,255,0.5);
}

.wjt-recipient .company{
    font-style: italic;
    color: #888;
}

.wjt-recipient .icon{
    position: absolute;
    left: 5px;
}

.wjt-recipient .icon:hover{
    color:white;
    cursor: pointer;
}

.wjt-recipient .user{
    margin-left:15px;
}

select.recipient-list{
    width: 100%;
    position: absolute;
    top: 5px;
}

/* WJT Dialog Bootstrap overrides*/


@media (min-width: 1200px){
    #jobCreateDialog > .modal-dialog{
        width:1100px;
    }

    #jobEditDialog > .modal-dialog{
        width:1100px;
    }

    #jobExtendDialog > .modal-dialog{
        width:800px;
    }

    #wjtAddressbookModal > .modal-dialog{
        width:1100px;
    }
}


@media (min-width: 992px) and (max-width: 1199px){

    #jobCreateDialog > .modal-dialog{
        width:800px;
    }

    #jobEditDialog > .modal-dialog{
        width:800px;
    }

    #jobExtendDialog > .modal-dialog{
        width:600px;
    }
}

.modal-spinner{
    position: absolute;
    right: 50px;
    font-size: 1.5em;
    top: 10px;
}



#selectMaterial{
    height:365px;
}
label.error{
    /*display: none;*/
}

#btnNewComm{
    /* margin-top: 17px; */
    border-left: 1px dotted;
    /* height: 37px; */
    /* margin-right: 5px; */
    text-align: center;
}

#btnPrintHistory{
    margin-bottom: 0px;
}

/* BS - Step Timeline */

.bs-wizard {}

.bs-wizard {border-bottom: solid 1px #e0e0e0; padding: 0 0 10px 0;}
.bs-wizard > .bs-wizard-step {padding: 0; position: relative;}
.bs-wizard > .bs-wizard-step + .bs-wizard-step {}
.bs-wizard > .bs-wizard-step .bs-wizard-stepnum {color: #595959; font-size: 16px; margin-bottom: 5px;}
.bs-wizard > .bs-wizard-step .bs-wizard-info {color: #999; font-size: 14px;}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot {position: absolute; width: 30px; height: 30px; display: block; background: #fbe8aa; top: 45px; left: 50%; margin-top: -15px; margin-left: -15px; border-radius: 50%;}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {content: ' '; width: 14px; height: 14px; background: #fbbd19; border-radius: 50px; position: absolute; top: 8px; left: 8px; }
.bs-wizard > .bs-wizard-step > .progress {position: relative; border-radius: 0px; height: 8px; box-shadow: none; margin: 20px 0;}
.bs-wizard > .bs-wizard-step > .progress > .progress-bar {width:0px; box-shadow: none; background: #fbe8aa;}
.bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {width:100%;}
.bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {width:50%;}
.bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {width:0%;}
.bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {width: 100%;}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {background-color: #f5f5f5;}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {opacity: 0;}
.bs-wizard > .bs-wizard-step:first-child  > .progress {left: 50%; width: 50%;}
.bs-wizard > .bs-wizard-step:last-child  > .progress {width: 50%;}
.bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot{ pointer-events: none; }

.bs-wizard-label{
    margin-bottom:20px;
}

.bs-wizard div.progress, .bs-wizard-dot{

}

.bs-wizard-info{

}

/* BS - Transition fix */

.bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {

    transition-timing-function: linear;

    transition-duration: .25s;

    width:100%;

}

.bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {

    transition-timing-function: linear;

    transition-delay: .25s;

    transition-duration: .25s;

    width:50%;

}

/* Tree multiselect */


div.tree-multiselect div.selected{
    display: none;
}

div.tree-multiselect div.selections > div.section{
    padding: 5px 5px;
    line-height: 20px;
}

div.tree-multiselect div.title{
    font-size: 1.2em;
    font-weight: bold;
    cursor: pointer;
}

div.tree-multiselect div.title:hover{
    color:darkcyan;
}

div.tree-multiselect span.collapse-section{
    width: 10px;
    display: inline-block;
    margin-right: 5px;
    display: none;
}


div.tree-multiselect input[type=checkbox]{
    margin-right: 10px;
    cursor: pointer;
}

div.tree-multiselect div.section > div.item{
    margin-left: 15px;
}

div.tree-multiselect div.section > div.section{
    margin-left:30px;
}

/* jQuery UI Overrrides */
.ui-widget{
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}


/* Fileupload */

.fileupload-area{
    text-align: center;
    font-family: Helvetica Neue, Arial;
    font-size: 1.2em;
    background: white;
    border: 1px dashed;
    line-height: 3em;
}

.fileupload-area:hover{
    cursor:pointer;
}

.fileupload-commence-btn{
    cursor: pointer;
    display: inline-block;
    margin-left: 10px;
    border-left: 1px dotted;
    padding-left: 10px;
}

.fileupload-commence-btn-new {
    cursor: pointer;
    display: inline-block;
}

.file-upload-list{
    padding-left: 5px;
    padding-right: 5px;
}

.file-header{
    margin-bottom: 5px;
    padding-left: 30px !important;
    background-color: #DDD;
    padding: 2px;
    margin-top: -10px;
}


.fileupload-commence-btn:hover{
    color:darkcyan;
}

.fileupload-progressbar{
    height: 28px;
    background: green;
    transition: width 0.75s;
    -webkit-transition: width 0.75s;
    background: #d2ff52;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(left, #d2ff52 0%, #91e842 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#d2ff52), color-stop(100%,#91e842));
    background: -webkit-linear-gradient(left, #d2ff52 0%,#91e842 100%);
    background: -o-linear-gradient(left, #d2ff52 0%,#91e842 100%);
    background: -ms-linear-gradient(left, #d2ff52 0%,#91e842 100%);
    background: linear-gradient(to right, #d2ff52 0%,#91e842 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#91e842',GradientType=1 );
    /* border: 1px solid black; */
    /* border-radius: 5px 5px 5px 25px; */
    margin-top: 15px;
    margin-bottom: 15px;
}

.progress_info{
    margin-top: -15px;
    margin-left: 10px;
    font-size: 0.8em;
    text-align: right;
    margin-bottom: 5px;
}

.uploader.info{
    opacity: 0;
    height: 0;
}

.uploader.info.upload-active{
    opacity:1;
    height:60px;
}


.cbTest{
    position: absolute;
    right: 38px;
    top: 25px;
}

/* Dashboard */
div.dash-bg{
background-image('/img/krueger_gruppe_small.png');
}

/* Fancytree / Category tree tweaks */
#tabs{
    border: 0 none;
    padding: 0;
}
#tabs > ul{
    position: fixed;
    z-index: 5;
    border: 0;
    background-color: white;
}

li.tab-krüger{
    background-color:rgba(8,27,83,1) !important;
}

li.tab-k-fee{
    background-color:rgba(255,255,255,1) !important;
}

ul.fancytree-ext-wide {
    border: none;
    overflow-x: hidden;
}

ul.fancytree-container{
    font-size: 1.1em;
    line-height: 1.4em;
}

img.fancytree-icon + span.fancytree-title{
    line-height:3.25em;
    font-weight:bold;
}

.ui-tabs .ui-tabs-nav li {
    height:37px;
}

.wjt-category-tree{
    margin-top: 30px;
    font-size: 0.8em;
    margin-top: 0;
}

.wjt-category-tree > ul{
    /*background-color: #DBE8FF;*/
    color: #444;
    /*margin-top: 68px;*/
    margin-left: -5px;
    margin-right: -5px;
}

.ui-fancytree{
    height:100%;
}

img.fancytree-icon{
    height: 3.5em;
    width: auto;
    max-width: 70px;
    line-height:3.5em;
}


.fancytree-title {
    /*position:relative !important;*/
    /*left: -4em !important;*/

}



.fancytree-level-1  > .fancytree-title {
    font-size: 12pt !important;
    padding-left: 2.8em !important;
}



.fancytree-level-2 > img.fancytree-icon{
    max-width: 100px;
}

.fancytree-level-2 >  .fancytree-title {
    position:relative !important;
    padding-left: 0em !important;
    font-size: 11pt;
    margin-top: auto;

}


.fancytree-level-3 >  .fancytree-title {
    /*position:relative !important;
    padding-left:6em !important;*/
}


.fancytree-level-4 >  .fancytree-title {
    position:relative !important;
    /* padding-left:6em !important;*/

}

.fancytree-plain.fancytree-container span.fancytree-node.fancytree-active span.fancytree-title {
    background-color: transparent !important;
    border: 0px;
    color: #000000;
    font-weight:bold;
}

.fancytree-plain.fancytree-container.fancytree-ext-wide span.fancytree-node.fancytree-active {
    color: #000000 !important;
}

.fancytree-plain.fancytree-container span.fancytree-title:hover {
    background-color: transparent !important;
    font-weight: bold;
}


#ui-id-1 span.fancytree-level-3 span.fancytree-title,
#ui-id-2 span.fancytree-level-3 span.fancytree-title,
#ui-id-3 span.fancytree-level-3 span.fancytree-title {
    padding-left: 6em !important;
}

#ui-id-1 span.fancytree-level-4 span.fancytree-title,
#ui-id-2 span.fancytree-level-4 span.fancytree-title,
#ui-id-3 span.fancytree-level-4 span.fancytree-title{
    padding-left:0em !important;
}


ul.fancytree-ext-wide span.fancytree-node > span.icon-caret-down{
    display: none;
}

ul.fancytree-container{
    background-color:transparent;
}




/* */
/* table address info */

table.table-addressinfo{
    border: 1px solid;
    border-collapse: collapse;
    width:100%;
}

table.table-addressinfo th {
    padding: 2px;
    border: 1px solid #CCCCCC;
    background-color: #F8F8F8;
    border-collapse: collapse;
}

table.table-addressinfo td {
    padding: 2px;
    border: 1px solid #CCCCCC;
    background-color: #F8F8F8;
    border-collapse: collapse;
}


.addressbook input[type="text"] {
    height: 14px;
    font-size: 10px;
    line-height: 14px;
}

.textvertical {



}

.thinlabel{
    font-size: 1.4em;
    color: grey;
    font-weight: lighter;
    transform: rotate(270deg);
    position: absolute;
    left: -9px;
    /* margin-bottom: 38px; */
    margin-left: 0px;
    color: whitesmoke;
    letter-spacing: 3px;
    top: 100px;
}

.thinlabel2{
    transform: rotate(270deg);
    font-size: 1.2em;
    z-index: 1;
    display: inline-block;
    float: left;
    margin-bottom: 0px;
    margin-left: -30px;
    color: white;
    background-color: black;
    padding: 5px;
    margin-top: 33px;
    border-top-left-radius: 10px;
    width: 110px;
    font-weight: lighter;
    letter-spacing: 1px;
    border-top-right-radius: 5px;
    background-color: grey;
    padding-left: 10px;
}

.comm{

}




.vcenter {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.mt-100 {
    margin-top:100px;
}


/* Override for DSFW value */
.margintop{
    margin-top:10px;
}

/* Bootstrap overrrides */
.form-group-sm {
    margin-bottom: 10px;
    height: 30px;
}

.nav-tabs > li{
    min-width: 50px;
    min-height: 50px;
    width:33%;
}

.nav-tabs > li > a{
    min-height: 50px;
    padding: 0;
    width: 100%;
}

.nav-tabs > li > a:hover{
    background-color:rgba(255,255,255,0.5);
}


.dl_label{
    height: 30px;
    line-height: 30px;
}



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

.popover{
    color: black;
}

.medium-well{
    height:130px;
    border-bottom-left-radius: 10px;
}

.medium-well input[type=text]{
    width:110px;
}

/* BS - OVerrrides */
.well-label{
    margin-top: -8px;
    margin-left: -15px;
}

.well-label small{
    width:100px;
}

.well-colors{
    height:100px;
}

.form-horizontal div.checkbox-sm{
    min-height: 20px;
}

.nav > li > a {
    padding: 5px 15px;
    /*color: white;*/
}



.navbar{
    min-height:30px;
}

.app-title{
    position: fixed;
    top: 5px;
    left: 5px;
    color: black;
    margin-top: 0PX;
}

.app-version{
    position: fixed;
    top: 5px;
    right: 5px;
    color: black;
    margin-top: 0PX;
}

#aUsergroup{
    height: 485px;
}



/* SB-ADmin overrides */
.chat li.left .chat-body {
    margin-left: 60px;
}


/* FF fixings */

.input-group select {
    padding:0 !important;
}


.address-spacer{
    display: inline-block;
    width:20px;
    color:lightgrey;
}

/* Menu CSS reset shit */

* {
    margin: 0;
    padding: 0;
    font-size: inherit;
    color: inherit;
    box-sizing: inherit;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased;
}

*:focus { outline: none; }

html { box-sizing: border-box; }

a { text-decoration: none; }

button {
    background-color: transparent;
    border: 0;
    cursor: pointer;
}

.navigation-bar, .navigation-bar .navbox-tiles, .navbox-trigger, .navbox-tiles .tile, .navbox-tiles .tile .icon .fa, .navbox-tiles .tile .title {
    -webkit-transition: all .3s;
    transition: all .3s;
}

.navbox .navbox-info.navbox-title{
    height: 30px;
    text-align: right;
    line-height: 30px;
}

.navbox-tiles:after {
    content: '';
    display: table;
    clear: both;
}

/* Menu styles */
.navigation-bar {
    position: absolute;
    z-index: 1000;
    top: 0px;
    /*background-color: rgba(72,71,71,0.9);*/
    left: 0px;
}

.navigation-bar .bar {
    /*background-color: #252525;*/
    /*width: 100%;
    height: 100%;*/
    position: absolute;
    left: -15px;
}

.navigation-bar .navbox {
    visibility: hidden;
    opacity: 0;
    position: absolute;

    z-index: 1;
    -webkit-transform: translateY(-200);
    -ms-transform: translateY(-200);
    transform: translateY(-200);
    -webkit-transition: all .2s;
    transition: all .2s;
    top: 50px;
    height: 100%;
    width: 500px;
    left: -15px;
}

.navbox .navbox-info{
    color: whitesmoke;
    font-weight: bold;
    text-rendering: optimizeLegibility;
    background-color: rgba(72,71,71,0.95);
    width: 100%;
    display: block;
    text-align: center;
    padding-bottom: 20px;
    height: 50px;
    border-bottom: 1px dotted grey;

}

.navigation-bar .navbox-tiles {
    -webkit-transform: translateY(-200);
    -ms-transform: translateY(-200);
    transform: translateY(-200);
    background-color: rgba(72,71,71,0.95);

}

.navigation-bar.navbox-open .navbox-trigger { background-color: #484747; }

.navigation-bar.navbox-open .navbox {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, transform .3s;
    background-color: rgba(72,71,71,0.9);
    border-top-right-radius: 25px;
}

.navigation-bar.navbox-open .navbox-tiles {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}

.navbox-trigger {
    background-color: rgba(72,71,71,0.9);
    width: 65px;
    height: 60px;
    line-height: 50px;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    padding-right: 0px;
    padding-left: 15px;
}

.navbox-trigger .fa {
    font-size: 20px;
    color: #fff;
}

.navbox-trigger:hover { background-color: #484747; }

.navbox {
    background-color: #484747;
    width: 100%;
    max-width: 380px;
    -webkit-backface-visibility: initial;
    backface-visibility: initial;
}

.navbox-tiles {
    width: 100%;
    padding: 25px;
}

.navbox-tiles .tile {
    display: block;
    background-color: #3498db;
    width: 30.3030303030303%;
    height: 0;
    padding-bottom: 29%;
    float: left;
    border: 2px solid transparent;
    color: #fff;
    position: relative;
}

.navbox-tiles .tile .icon {
    width: 100%;
    height: 100%;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
}

.navbox-tiles .tile .icon .fa {
    font-size: 35px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-backface-visibility: initial;
    backface-visibility: initial;
}

.navbox-tiles .tile .title {
    padding: 5px;
    font-size: 12px;
    position: absolute;
    bottom: 0;
    left: 0;
}

.navbox-tiles .tile:hover {
    border-color: #fff;
    text-decoration: none;
}

.navbox-tiles .tile.noaccess:hover {
    border-color:transparent;
    cursor: default ;
}

.navbox-tiles .tile:not(:nth-child(3n+3)) {
    margin-right: 4.54545454545455%;
}

.navbox-tiles .tile:nth-child(n+4) { margin-top: 15px; }

@media screen and (max-width: 370px) {

    .navbox-tiles .tile .icon .fa { font-size: 25px; }

    .navbox-tiles .tile .title {
        padding: 3px;
        font-size: 11px;
    }

}
#tableAddress > thead > tr th{
    height:0px;
}

.navbox-tiles .tile.noaccess{
    background-color:gray !important;
}

#view-job-filter-status{
    padding-left: 0px;
    padding-right: 0px;
}

#view-job-filter-status li{
    cursor: pointer;
}

#view-job-filter-status .pagination{
    margin-bottom: 0px;
}

.job-filter-additional{
    padding-right: 0px;
    text-align: right;
}

/* Bootstap pagination style override */
.pagination-sm > li > a, .pagination-sm > li > span {
    padding: 2px 6px;
    line-height: 1.5;
    border-radius: 65px;
}

.navbar-default > ul{
    margin-top:100px;
}

.navbar-default .navbar-brand {
    color:whitesmoke;
}

.table-hover > tbody > tr:hover {

    background-color:#ffdd3c;
    background:#ffdd3c;
    cursor: pointer;
}



h4.welltitle{
    margin-top: -9px;
    background-color: white;
    height: 20px;
    line-height: 20px;
    margin-left: -8px;
    padding-left: 10px;
    margin-right: -9px;
}


#wrapper-admin #page-wrapper > div:first-child {
    margin-top:65px;
}


#blockDispatchBuyerRecipientsInput_tagsinput{
    height:50px !important;
    min-height:50px !important;
}


ul.extcomm-list{
    padding-left:0px;
}

ul.extcomm-list > li{
    background-color: rgba(0,0,0,.2);
    /*height: 100px;*/
    border-top-right-radius: 10px;
    padding: 5px;
    display: block;
    border-bottom: 1px dotted grey;
}

.extcomm-header{
    margin-left: -5px;
    margin-right: -5px;
    margin-top: -5px;
    border-top-right-radius: 10px;
}

.recipient-badge{
    margin-bottom: 2px;
}

#blockCommunicationRecipientsInput_tagsinput {
    width: 100% !important;
    min-height: 50px !important;
    height: 50px !important;
    /* margin-bottom: 10px !important; */
    margin-left: -15px;
}


.regform{
    margin-bottom: 100px;
}

table.job-data{

}

table tr.even{
    background-color:RGBA(255,255,255,0.8);
}

table tr.odd{
    background-color:RGBA(255,255,255,0.5);
}
.wjt-job-rightcol{
    /*height: 155px;*/
}

table.job-data tr:first-child td{
    padding-top:5px;
}

.job-data .groupheader{
    font-weight: bold;
    background-color: lightgray;
}

.approval-button-label{
    position: relative;
    bottom: 5px;
    left: 5px;
}

.approver-data .popover{
    min-width: 150px;
    width: 20rem;
}

/* Shopping cart */
.button-cart{
    z-index: 20;
    right: 52px;
}

#cart-menu{
    position: absolute;
    top: -4px;
    color: white;
    right: 35px;
}

#cart-content{
    position: absolute;
    width: 600px;
    min-height: 50px;
    background-color: rgba(255,255,255,.9);
    right: 0;
    top: 48px;
    padding-bottom: 10px;
    border: 1px solid black;
    overflow: hidden;
}

.cart-files{
    list-style: none;
    padding: 10px;
}

ul.cart-files{
    max-height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
}

.cart-files li{
    background-color: rgba(255,255,255,1);
    color: rgb(35, 48, 64);
    height: 85px;
    border-top: 1px solid grey;
    padding: 5px;
}

.cart-fil.cart-placeholder{
    height:30px;
}

.cart-files div.thumb-mini{
    height: 75px;
    /* width: 75px; */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}

.cart-files .file-datablock{
    text-align: left;
}

.cart-files .label{
    text-align: left;
    font-size: 16px;
    overflow-x: hidden;
}

.cart-files .remove{
    margin-top: 7px;
}


#cart-download {
    width: 50%;
    height: 50px;
    background-color: rgba(35, 48, 64,.85);
    position: absolute;
    left: 0;
}

#cart-order {
    width: 34%;
    height: 50px;
    background-color: #0F9E5E;
}


#cart-clear {
    width: 50%;
    height: 50px;
    background-color: #902b2b;
    position: absolute;
    right: 0;
}

.thumb-cart{
    height: 75px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}


.buttonbar.cart{
    height:40px;
}
.buttonbar.cart button{
    line-height:40px;
}

#num-cart-files {
    left: 25px;
    top: 25px;
}

#cart-files{
    margin-top:-1px;
}


.dmd-category > img{
    height:30px;
}

.dmd-category:hover > img{
    height:40px;
}

.dmd-category.lvl-2{
    font-weight: normal;
    line-height: 40px;
    padding: 5px 5px;
    height: 40px;
}

#dmd-categories > ul{
    margin-top:0px;
}

.dmd-category > span {
    width: 100%;
    padding-left:5px;
    overflow-x: hidden;
    position: absolute;
}

ul#dmd-categories > ul {
    margin-left: -10px;
}

/* Login */

strong { font-weight: 500; }

a, a:focus {
    color: #4aaf51;
    text-decoration: none;
    -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; transition: all .3s;
}

a:hover{
    cursor: pointer;
}

h1, h2 {
    margin-top: 0px;
    /*font-size: 38px;*/
    font-weight: 100;
    color: #555;
    /*line-height: 50px;*/
}

h3 {
    font-size: 22px;
    font-weight: 300;
    color: #555;
    line-height: 30px;
}

img { max-width: 100%; }

::-moz-selection { background: #4aaf51; color: #fff; text-shadow: none; }
::selection { background: #4aaf51; color: #fff; text-shadow: none; }


.btn-link-1 i {
    padding-right: 5px;
    vertical-align: middle;
    font-size: 20px;
    line-height: 20px;
}


/***** Top content *****/

.inner-bg {
    padding: 350px 0 170px 0;
}

.top-content .text {
    color: #fff;
}

.top-content .text h1 { color: #fff; }

.top-content .description {
    margin: 20px 0 10px 0;
}

.top-content .description p { opacity: 0.8; }

.top-content .description a {
    color: #fff;
}
.top-content .description a:hover,
.top-content .description a:focus { border-bottom: 1px dotted #fff; }

.form-box {
    margin-top: 35px;
}

.form-top {
    overflow: hidden;
    padding: 0 25px 15px 25px;
    background-color: rgba(128,128,128,.05);
    -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
    text-align: left;

}

.form-top-left {
    float: left;
    width: 75%;
    padding-top: 25px;
}

.form-top-left h3 { margin-top: 0; }

.form-top-right {
    float: left;
    width: 25%;
    padding-top: 5px;
    font-size: 66px;
    color: #ddd;
    line-height: 100px;
    text-align: right;
}

.form-bottom {
    padding: 25px 25px 30px 25px;
    background: #eee;
    -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;
    text-align: left;
}

#formblock-login{


}

.form-bottom form textarea {
    height: 100px;
}

.form-bottom form button.btn {
    width: 100%;
}

.form-bottom form .input-error {
    border-color: #4aaf51;
}

.social-login h3 {
    color: #fff;
}


/***** Media queries *****/

@media (min-width: 992px) and (max-width: 1199px) {}

@media (min-width: 768px) and (max-width: 991px) {}

@media (max-width: 767px) {

    .inner-bg { padding: 60px 0 110px 0; }

}

@media (max-width: 415px) {

    h1, h2 { font-size: 32px; }

}

body.login{
    background-color:white;
    /*background-image: url('../../img/krueger_gruppe_small.png');
    background-repeat: no-repeat;
    background-size: 35%;
    background-position: 50% 10%;
    width: 100%;*/
}

#login-button{
    border:1px solid lightgrey;
}

#login-button:hover{
    background-color:darkgray;
}

.form-logo{
    background-image: url(../../img/logos/radeberger-gruppe-logo.png);
    /* background-color: #f7f7f7; */
    background-repeat: no-repeat;
    /* background-size: 100%; */
    background-position: 50% 50%;
    width: 100%;
    height: 260px;
    margin-bottom: 4px;
    background-size: contain;
}


#wrapper-admin nav button.dropdown-toggle{
    WIDTH: 150px;
    margin-top: -2px;
    height: 33px;
    opacity: 0;
}

span.labels{
    position: absolute;
    right: 10px;
    /* top: 8px; */
    /* display: block; */
    /* width: 100%; */
    margin-top: -5px;
}

span.labels .badge.inactive{
    background-color:#AAA;
}


span.badges .badge.inactive.ds-selectable{
    background-color:#404040;
}


.progress-bar-info{
    position: absolute;
    background-color:transparent;
    border: 0;
    left: 24px;
    color:black;
}

.deadline-phase{
    width: 100%;
    display: inline-block;
}

.deadline-block{
    margin-bottom:10px;
}

.input-group-sm > .form-control{
    padding:3px 10px;
}

#view-job-filter-deadline{
    height:25px;
}

#view-job-filter-deadline li span{
    width:20px;
    height:20px;
}

#view-job-filter-deadline li:hover{
    cursor: pointer;
}


.wjt-job-button{
    background-color: rgba(0,0,0,.5);
    border-bottom-left-radius: 5px;
    text-align: center;
    padding: 0;
    border-left: 1px solid darkgray;
}

.wjt-job-button:hover{
    background-color: rgba(0,0,0,1);
}

.advanter-jobno-status{
    position: absolute;
    right: 100px;
    background-color: rgba(255,255,255,.3);
    padding: 5px;
    top: 2px;
}


/* IE 10+ specific styles */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

    /* Fixes job column exceeding page height limit for whatever reasons */
    #wjtJobContainer .wjt-column-content{
        height: 91%;
    }
}


.wjt-job-button.advanter{
    position: absolute;
    right: 0;
    width: 25px;
    height: 24px;
    line-height: 16px;
    padding-left: 7px;
}

.file-frame {
    min-height: 35px;
    min-width: 75px;
}