html {
    height: 100%; /* added */
    min-height: 100%;
    font-size: 62.5%;
}
body{
    height: 100%; /* added */

    background-color: transparent;
    background-image: url("/navGfx/MSA_back.png"), linear-gradient(#fff 50%, #e2e6f0);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
}
a{
    text-decoration: none;
    color: #495057;
}
a:hover {
    text-decoration: none;
    color: #4561A2;
}

.mwr-5{
    max-width: 5rem;
}
.mwr-7{
    max-width: 7rem;
}
.mwr-10{
    max-width: 10rem;
}
.mwr-20{
    max-width: 20rem;
}
.pb-10{
    padding-bottom: 10rem;
}

/* Allgemein */
.red{
    color: #ff0000;
}
.hand{
    cursor: pointer;
}
.noselect {
    -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; /* Non-prefixed version, currently  supported by Chrome, Opera and Firefox */
}
.nowrap{
    white-space: nowrap;
}

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}
/* Haupt Container */
#middleApp{ /* added */
    height: 100%;
}
#layoutTheme{ /* added */
    height: 100%;
}


/* Navigation */
.nav-top-container{
    height: 5rem; /* added */

    width:100%;
    background-color: #ffffff;
    background-image: linear-gradient(rgba(0, 57, 185, 0.75) 0%, #4561A2);
    border-bottom: 0.1rem solid #292ebf;
    -webkit-box-shadow: 0 1rem 1.6rem 0 rgba(0,0,0,0.15);
    -moz-box-shadow: 0 1rem 1.6rem 0 rgba(0,0,0,0.15);
    box-shadow: 0 1rem 1.6rem 0 rgba(0,0,0,0.15);
    /*z-index: 1000;*/
}
.nav-top-container.remote-topbar{
    height: 7rem; /* added */
}
.nav-top-container.topbar-extended{
    height: 7.7rem; /* added */
}
.nav-top-container.topbar-extended.remote-topbar{
    height: 9.7rem; /* added */
}
.nav-top-logo{
    height: 5rem;
    padding: .5rem;
}
.nav-top-btn-group{
    height: 4rem;
}
.nav-top-btn-group>.nav-top-btn:first-child {
    border-radius: .6rem 0 0 .6rem;
}
.nav-top-btn-group>.nav-top-btn:last-child {
    border-radius: 0 .6rem .6rem 0;
    border-right: 1px solid #fff;
}
.nav-top-btn{
    position: relative;
    border-left: 1px solid #fff;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    border-radius: inherit;
    height: inherit;
    text-align: center;
    background-image: linear-gradient(#c5d1ef, #a9c5ef 60%, #c5d1ef);

    background-repeat: no-repeat;
    cursor: pointer;

}
.nav-top-btn:hover {
    background-image: linear-gradient(#ffffff, #ff8700 60%, #f07d00);

    margin-bottom: 2px;
}
.nav-top-btn.active{
    background-image: linear-gradient(#f07d00, #ff8700 60%, #f07d00);

    margin-bottom: 2px;
}
.nav-top-btn img{
    border-radius: inherit;
    height: inherit;
    padding: 0.5rem;
    filter: brightness(20%) ;
}
.nav-top-btn:hover img{
    filter: unset;

}
.nav-top-btn.active img{
    filter: unset;

}
.input-group-sm>.form-control.nav-top-filter-input{
    border-right: 0;
    border-radius: 0;
    border-top-left-radius: .4rem;
    border-bottom-left-radius: .4rem;
    /*max-width: 10rem;*/
}

/* Fremdanmeldung*/
.remoteLogin{
    padding-left: 1rem;
    color: #721c24;
    background-color: #f8d7da;
    border-bottom-color: #f5c6cb;
    white-space: nowrap;
    height: 2rem;
    overflow: hidden;
    border-radius: 0.5rem;
}

/* breadcump */
.breadcrump-container{
    color: #fff;
}
.breadcrump-hamburger{
    font-size: 2rem;
    cursor: pointer;
}
.breadcrump-breadcrump{
    direction: rtl;
    text-align: left;


    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    min-width: 0;
}
.breadcrump-breadcrump > div {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}
.breadcrump-breadcrump > div > a {
    color: #fff;
}
.breadcrump-breadcrump > div > a:before {
    content: ' > ';
}
.breadcrump-breadcrump > div > a:first-child:before {
    content: '';
}
.breadcrump-breadcrump > div > a:last-child {
    font-weight: bold;
}

/* filter */
#filterInput{
    min-width: 20rem;
}
#filterInputContainer > .dropdown-menu{
    max-width: 24rem;
    overflow-x: hidden;
}

/* body */
.body-container{
    height: calc(100% - 5rem);/* added */
    overflow:auto;
}
.body-container.topbar-extended{
    height: calc(100% - 7.7rem);/* added */
}
.body-page-container{
    height:100%;/* added */
}
.body-page-content-container{
    height:100%;/* added */
    overflow:auto; /* added */
    /*width: 0;*/

}

/* subnav */
.subnav-menue{
    writing-mode: vertical-rl;
    color: #fff;
    /*background-color: #292ebf;*/
    background-image: linear-gradient(#4561A2 0%, rgba(0, 57, 185, 0.75));
    border-right: 1px solid #4561A2;
    border-bottom: 1px solid #4561A2;
    border-bottom-right-radius:  .6rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    -webkit-box-shadow: 0 .5rem .8rem 0 rgba(0,0,0,0.15);
    -moz-box-shadow: 0 .5rem .8rem 0 rgba(0,0,0,0.15);
    box-shadow: 0 .5rem .8rem 0 rgba(0,0,0,0.15);
    cursor:pointer;
}
.subnav-container{
    background-color: #fff;
    border-right: 1px solid #4561A2;
    border-bottom: 1px solid #4561A2;
    border-bottom-right-radius:  .6rem;
    -webkit-box-shadow: 0 .5rem .8rem 0 rgba(0,0,0,0.15);
    -moz-box-shadow: 0 .5rem .8rem 0 rgba(0,0,0,0.15);
    box-shadow: 0 .5rem .8rem 0 rgba(0,0,0,0.15);
    min-width: min-content;

    max-height:100%;
    overflow:auto;
    white-space: nowrap;

}
.subnav-element{
    color: #495057;
    padding-top: .2rem;
    padding-bottom: .2rem;
    padding-right: 2rem;
    white-space: nowrap;
    max-width: 25rem;
    overflow: hidden;
}
.subnav-element:hover{
    color: #4561A2;
    background-color: #e6e8f1;
}
.subnav-arrow{
    padding-top: .4rem;
    padding-right: .2rem;
    width: 1.8rem;
    min-width: 1.8rem;
    font-size: 1rem;
}
.subnav-element.active{
    color: #4561A2;
    background-color: #e6e8f1;

}
.subnav-element.active > .subnav-arrow{
    padding-right: .4rem;
    transform: rotate(90deg);
}
.subnav-element.active >.subnav-text{
    font-weight: bold;
}
.subnav-level-0{

}
.subnav-level-1 > .subnav-arrow{
    margin-left: 1rem;
}
.subnav-level-2 > .subnav-arrow{
    margin-left: 2rem;
}
.subnav-level-3 > .subnav-arrow{
    margin-left: 3rem;
}

/* Tabs */
.hdltabs {
    /*min-width: 40rem;*/
    max-width: 100%;
}
.hdltabs .nav-tabs {
    border-bottom: 1px solid #4561A2;
}

.hdltabs .nav-tabs .nav-link.active, .hdltabs .nav-tabs .nav-item.show .nav-link {
    color: #fff;
    background-color: #4561A2;
    border-color: #dee2e6 #dee2e6 #4561A2;
}
.hdltabs .nav-tabs .nav-link {
    border-color: #e9ecef;
    border-bottom-color: #4561A2;
    background-color: #f8fbfd;
    font-weight: 500;
    font-size: 1.4rem;
}
.hdltabs .nav-tabs .nav-link {
    color: #212529;
}
.hdltabs .nav-tabs > li.red > a {
    background-color: #fba8a8;
}
.hdltabs .nav-tabs > li.red > a.active {
    background-color: #ff0000;
}

.hdltabs .nav-tabs .nav-link:hover, .hdltabs .nav-tabs .nav-link:focus {
    border-color: #4561A2;
}

.hdltabs .tab-content{
    border-right: 1px solid #4561A2;
    border-left: 1px solid #4561A2;
    border-bottom: 1px solid #4561A2;
    border-bottom-right-radius: .5rem;
    border-bottom-left-radius: .5rem;


}



/* contentnav */
.contentnav-btn{
    border: 1px solid #4561A2;
    border-radius: .6rem;
    width: 12rem;
    height: 12rem;
    -webkit-box-shadow: 0 .5rem .8rem 0 rgba(0,0,0,0.15);
    -moz-box-shadow: 0 .5rem .8rem 0 rgba(0,0,0,0.15);
    box-shadow: 0 .5rem .8rem 0 rgba(0,0,0,0.15);
    margin: 1rem;
    background-color: #fff;
    align-self: stretch;
}
.contentnav-btn img{
    max-width: 100%;
    max-height: 100%;
    padding: .5rem;
}
.contentnav-btn:hover{
    -webkit-transform: scale(1.6);
    -ms-transform: scale(1.6);
    transform: scale(1.6);
    transition: .1s ease;
}
.contentnav-img-container{
    width: 100%;
    height:100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    padding: .5rem;
}
.contentnav-btn > .titlebar{
    background-image: linear-gradient(#ffffff 0%, #4561A2 20%, #4561A2);
    color:#ffffff;
    /*text-transform: uppercase !important;*/
    font-weight: bold !important;
    font-size: 1.2rem;
    line-height: 1.2rem;
    border-bottom-left-radius: .6rem;
    border-bottom-right-radius: .6rem;
    word-break: break-word;
    padding-top: .6rem;
}
.contentnav-btn > .titlebar div{
    word-break: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
    /*height: 4rem;*/
    min-height: 4rem;
    align-self: stretch;
}
.contentnav-btn > .titlebar.noImage{
    border-radius: .6rem;
    line-height: 1.6rem;
}
.contentnav-btn:hover{
    border-color: #ff8700;
    -webkit-box-shadow: 0 .2rem .4rem 0 rgba(0,0,0,0.15);
    -moz-box-shadow: 0 .2rem .4rem 0 rgba(0,0,0,0.15);
    box-shadow: 0 .2rem .4rem 0 rgba(0,0,0,0.15);
}
.contentnav-btn:hover > .titlebar{
    background-image: linear-gradient(#ffffff, #ff8700 60%, #f07d00);;
}

.contentnav-icon-container{
    /*height: 5rem;*/
}
.contentnav-icon-container > .contentnav-icon-img-container{
    min-width:6rem;
}
.contentnav-icon-container img{
    max-height:2rem;
    max-width: 2rem;
}

/* Tables */
.table-bordered {
    border-top-right-radius: .5rem;
    border-top-left-radius: .5rem;
    border:  0;
    border-collapse: separate;
    border-spacing: 1px;
    background-color: #4561A2;
}
.table thead th {
    border-bottom: 2px solid #4561A2;
    color: #fff;
    background-color: #4561A2;
}
.table thead th a {
    color: #fff;
}
.table thead th:first-child {
    border-top-left-radius: .5rem;
}
.table thead th:last-child {
    border-top-right-radius: .5rem;
}
.table tbody {
    background-color: #fff;
}
.table.noTh > tbody tr:first-child td:first-child{
    border-top-left-radius: .5rem;
}
.table.noTh > tbody tr:first-child td:last-child {
    border-top-right-radius: .5rem;
}
.table-bordered th, .table-bordered td {
    border:  0;
}
.zoomTr img{
}
/*.zoomTr:hover img{*/
/*    transform: translateX(-7.5rem) scale(10);*/
/*    transition: .1s ease;*/

/*    -webkit-box-shadow: 0 .2rem .4rem 0 rgba(0,0,0,0.15);*/
/*    -moz-box-shadow: 0 .2rem .4rem 0 rgba(0,0,0,0.15);*/
/*    box-shadow: 0 .2rem .4rem 0 rgba(0,0,0,0.15);*/
/*}*/
.zoomTr:hover td{
    background-color: #fce27f;
}
.table th, .table td {
    padding: .5rem;
    border-top: 1px solid #4561a2;
}

.previewImageParentContainer{
    max-width:60rem;
    overflow-y: hidden;
}
.previewImageContainer{
    border: 1px solid #4561A2;
    border-radius: .6rem;
    background-color: #ffffff;
}

/* Bestand */
.stockIcon-small{
    max-height: 1.4rem;
    vertical-align: baseline;
    padding-right: .2rem;
    padding-left: .2rem;
}

/* Fieldset */
fieldset legend{
    font-weight: bold;
    width: auto;
    padding: 0 0.6rem;
    font-size: 2rem;
    margin-bottom: -0.6rem;
}

.glyphicon-spin {
    font-size: 30px;
    -webkit-animation: spin 1000ms infinite linear;
    animation: spin 1000ms infinite linear;
}
.glyphicon-spin-sm {
    font-size: 15px;
    -webkit-animation: spin 1000ms infinite linear;
    animation: spin 1000ms infinite linear;
}
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

.form-control::-webkit-input-placeholder {
    color: #bec6cc;
}
.form-control:-moz-placeholder {
    color: #bec6cc;
}
.form-control::-moz-placeholder {
    color: #bec6cc;
}
.form-control::placeholder {
    color: #bec6cc;
}
.form-control:-ms-input-placeholder {
    color: #bec6cc;
}

/* Modal */
.modal {
    text-align: center;

    padding: 0!important;
}
.modal::before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}
.modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
}
.modal-content {
    border: 1px solid #4561a2;
}
.modal-header {
    padding: .5rem;
    background-color: #4561a2;
    color: #fff;
    min-height: .32rem;
}
.modal-header > .modalclose{
    text-align: center;

    color: #fff;
    font-weight: bold;
    position: absolute;
    width: 3rem;
    height: 3rem;
    line-height: 2.4rem;
    right: 1rem;
    cursor: pointer;
    font-size: 3rem;
    background-image: linear-gradient(#e12b31, #C71C22 60%, #b5191f);
    border-radius: .6rem;
}
.modal-title {
    padding-right: 5rem;
}


.tox-statusbar__branding{
    display:none;
}



/* kleiner als md */
@media (max-width: 768px) {
    .nav-top-container {
        height: 9.5rem; /* added */
    }
    .nav-top-container.topbar-extended{
        height: 12.2rem; /* added */
    }
    .body-container{
        height: calc(100% - 9.5rem);/* added */
    }
    .body-container.topbar-extended{
        height: calc(100% - 12.2rem);/* added */
    }
    .nav-top-logo{
        height: 5rem;
    }
}

/* IE 11 fix */
@media all and (-ms-high-contrast:none) {
    .contentnav-btn > .titlebar{
        word-break: break-all;
    }
    .subnav-container{
        min-width: 25rem;
    }
}
/* Edge fix */
_:-ms-lang(x),_:-webkit-full-screen, .contentnav-btn > .titlebar{
    word-break: break-all;
}
_:-ms-lang(x),_:-webkit-full-screen, .subnav-container{
    min-width: 25rem;
}
/* fix für X in IE input Feldern*/
::-ms-clear {
    display: none;
}