﻿.p-2 {
    padding: 0;
}

body {
    padding-top: 45px;
    padding-bottom: 0px;
}

.bg {
    background-image: url("../images/Login_Background.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 0;
}


/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

.container {
    max-width: none;
}

/*CSS AB HIER */
/* IconMatrix */
.icon-matrix {
    background-image: url("../images/IconMatrix_Beloxx.png");
    height: 30px;
    width: 30px;
    flex-shrink: 0;
}

    .icon-matrix.LoginUserIcon {
        margin-right: 20px;
        background-position-y: 0;
        background-position-x: 0;
    }

    .icon-matrix.LoginPWIcon {
        background-position-y: 0;
        background-position-x: -30px;
        margin-right: 20px;
    }

    .icon-matrix.LoginButtonIcon {
        background-position-y: 0;
        background-position-x: -60px;
    }

    .icon-matrix.LoginExitIcon {
        background-position-y: 0;
        background-position-x: -90px;
    }

    .icon-matrix.SaveIcon {
        background-position-y: 0;
        background-position-x: -120px;
    }

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.SaveIcon {
    background-position-y: 0;
    background-position-x: -150px;
}

.icon-matrix.ChangePWIcon {
    background-position-y: 0;
    background-position-x: -180px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.ChangePWIcon {
    background-position-y: 0;
    background-position-x: -210px;
}

.icon-matrix.AddIcon {
    background-position-y: -30px;
    background-position-x: 0;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.AddIcon {
    background-position-y: -30px;
    background-position-x: -30px;
}

.icon-matrix.ShowLockIcon {
    background-position-y: -30px;
    background-position-x: -60px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.ShowLockIcon {
    background-position-y: -30px;
    background-position-x: -90px;
}

.icon-matrix.CopyLockIcon {
    background-position-y: -30px;
    background-position-x: -120px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.CopyLockIcon {
    background-position-y: -30px;
    background-position-x: -150px;
}

.icon-matrix.AssignLockIcon {
    background-position-y: -30px;
    background-position-x: -180px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.AssignLockIcon {
    background-position-y: -30px;
    background-position-x: -210px;
}

.icon-matrix.DeleteIcon {
    background-position-y: -60px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.DeleteIcon,
.icon-matrix.DeleteIcon:hover {
    background-position-y: -60px;
    background-position-x: -30px;
}

.icon-matrix.UndoIcon {
    background-position-y: -60px;
    background-position-x: -60px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.UndoIcon {
    background-position-y: -60px;
    background-position-x: -90px;
}

.icon-matrix.DesignViewIcon {
    background-position-y: -60px;
    background-position-x: -120px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.DesignViewIcon {
    background-position-y: -60px;
    background-position-x: -150px;
}

.icon-matrix.ExportListIcon {
    background-position-y: -60px;
    background-position-x: -180px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.ExportListIcon {
    background-position-y: -60px;
    background-position-x: -210px;
}

.icon-matrix.logOutIcon {
    padding: 10px;
    background-position-y: -90px;
    background-position-x: 0px;
}

.navbar .btn:hover {
    background-color: transparent;
    background-position-y: -90px;
    background-position-x: -30px;
}

.icon-matrix.PrintIcon {
    background-position-y: -90px;
    background-position-x: -60px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.PrintIcon {
    background-position-y: -90px;
    background-position-x: -90px;
}

.icon-matrix.GenerateIcon {
    background-position-y: -90px;
    background-position-x: -120px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.GenerateIcon {
    background-position-y: -90px;
    background-position-x: -150px;
}

.icon-matrix.LockHistoryIcon {
    background-position-y: -90px;
    background-position-x: -180px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.LockHistoryIcon {
    background-position-y: -90px;
    background-position-x: -210px;
}

.icon-matrix.AssignRemoveIcon {
    background-position-y: -120px;
    background-position-x: 0px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.AssignRemoveIcon {
    background-position-y: -120px;
    background-position-x: -30px;
}

.icon-matrix.NewKeyUserIcon {
    background-position-y: -120px;
    background-position-x: -60px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.NewKeyUserIcon {
    background-position-y: -120px;
    background-position-x: -90px;
}

.icon-matrix.SendTanIcon {
    background-position-y: -120px;
    background-position-x: -120px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.SendTanIcon {
    background-position-y: -120px;
    background-position-x: -150px;
}

.icon-matrix.LockHistorysIcon {
    background-position-y: -120px;
    background-position-x: -180px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.LockHistorysIcon {
    background-position-y: -120px;
    background-position-x: -210px;
}

.icon-matrix.SendTanLockUserIcon {
    background-position-y: -150px;
    background-position-x: 0px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.SendTanLockUserIcon {
    background-position-y: -150px;
    background-position-x: -30px;
}

.icon-matrix.ImportIcon {
    background-position-y: -150px;
    background-position-x: -60px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.ImportIcon {
    background-position-y: -150px;
    background-position-x: -90px;
}

.icon-matrix.ActivateKeyUserIcon {
    background-position-y: -150px;
    background-position-x: -120px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.ActivateKeyUserIcon {
    background-position-y: -150px;
    background-position-x: -150px;
}

.icon-matrix.ChangeContactTypeIcon {
    background-position-y: -150px;
    background-position-x: -180px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.ChangeContactTypeIcon {
    background-position-y: -150px;
    background-position-x: -210px;
}

.icon-matrix.AssignRunIcon {
    background-position-y: -180px;
    background-position-x: 0px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.AssignRunIcon {
    background-position-y: -180px;
    background-position-x: -30px;
}

.icon-matrix.DeactivateIcon {
    background-position-y: -180px;
    background-position-x: -60px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.DeactivateIcon {
    background-position-y: -180px;
    background-position-x: -90px;
}

.icon-matrix.UserKeyHistoryIcon {
    background-position-y: -180px;
    background-position-x: -120px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.UserKeyHistoryIcon {
    background-position-y: -180px;
    background-position-x: -150px;
}

.icon-matrix.CodeHistoryIcon {
    background-position-y: -180px;
    background-position-x: -180px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.CodeHistoryIcon {
    background-position-y: -180px;
    background-position-x: -210px;
}

.icon-matrix.StatusIcon {
    background-position-y: -210px;
    background-position-x: 0px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.StatusIcon {
    background-position-y: -210px;
    background-position-x: -30px;
}

.icon-matrix.BatteryStatusIcon {
    background-position-y: -210px;
    background-position-x: -60px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.BatteryStatusIcon {
    background-position-y: -210px;
    background-position-x: -90px;
}

.icon-matrix.DefaultTextIcon {
    background-position-y: -210px;
    background-position-x: -120px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.DefaultTextIcon {
    background-position-y: -210px;
    background-position-x: -150px;
}

.icon-matrix.ActivateIcon {
    background-position-y: -210px;
    background-position-x: -180px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.ActivateIcon {
    background-position-y: -210px;
    background-position-x: -210px;
}

.icon-matrix.InviteIcon {
    background-position-y: -240px;
    background-position-x: 0px;
}

.btn-secondary:not(:disabled):not(.disabled):hover .icon-matrix.InviteIcon {
    background-position-y: -240px;
    background-position-x: -30px;
}

/* IconMatrix == ENDE ================== */


h4 {
    margin-bottom: 20px;
}

.row .col form {
    max-width: 450px;
    padding: 20px;
}

/* Button-Syles */

.btn-secondary {
    display: flex;
    align-items: center;
    background-color: rgb(231,231,231);
    color: black;
    border-color: rgb(170,170,170);
    width: 100%;
    padding: 0;
    height: 32px;
}


.button-text {
    margin-left: 20px;
    white-space: nowrap;
    margin-right: 20px;
}

.btn-secondary:not(:disabled):not(.disabled):hover {
    background-color: rgb(210,210,210);
    color: black;
    border-color: rgb(170,170,170);
    width: 100%;
}

.btn-secondary:not(:disabled):not(.disabled).active,
.btn-secondary:not(:disabled):not(.disabled):active,
.show > .btn-secondary.dropdown-toggle {
    background-color: rgb(200,200,200);
    color: black;
}

    .btn-secondary:not(:disabled):not(.disabled).active:focus,
    .btn-secondary:not(:disabled):not(.disabled):active:focus,
    .show > .btn-secondary.dropdown-toggle:focus {
        box-shadow: none;
    }

.btn-secondary.focus, .btn-secondary:focus {
    box-shadow: none;
}


/* =================== */


/* Main-Navbar */

.navbar {
    background-color: rgb(0,74,120);
    padding-top: 0;
    padding-bottom: 0;
}

    .navbar select {
        width: 150px;
    }

.nav-item:first-child {
    margin-left: 1.5rem;
}

.nav-item:hover,
.nav-item.active {
    background-color: rgb(21,135,206);
}


.navbar-light .navbar-nav .nav-link,
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .active > .nav-link {
    color: white;
}



.btn-primary {
    background-color: rgb(0,74,120);
    border: none;
}

    .btn-primary:hover {
        background-color: rgb(0,74,120);
    }

/* ======= */

/* Untermenu-Nav */

a {
    color: black;
}

    a:hover {
        color: rgb(100,100,100);
    }

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background-color: white;
    color: black;
}
/* ======= */

/* Eingabe Display */

#DetailSection label {
    font-weight: 500;
    width: 130px;
    margin-bottom: 0;
    font-size: 0.8rem;
}

.toolbar label {
    justify-content: flex-start;
    width: 120px;
}


/* Eingabe Display + Input */
.form-control {
    max-width: 250px;
    border-radius: 0;
}

    .form-control.w-100 {
        max-width: none;
    }

    .form-control.bigtextarea {
        height: 500px;
    }

.form-group .form-control {
    min-width: 250px;
}

    .form-group .form-control.w130 {
        width: 130px;
        min-width: 130px;
    }

div.form-control {
    border: none;
    margin: 1px 0;
    background-color: transparent;
}

select.form-control {
    text-overflow: ellipsis;
}

.form-check {
    width: 250px;
    padding-left: 0;
}

/* ======= */
/* Login-Seite */
.btn {
    border-radius: 0;
}

.btn-primary:hover {
    background-color: rgb(21,135,206);
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
    background-color: transparent;
    color: black;
    border: solid 1px rgb(0,74,120);
}

    .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus {
        box-shadow: none;
    }

.btn-primary.focus, .btn-primary:focus {
    box-shadow: none;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: rgb(170,170,170);
}

/* ======= */

.bootstrap-table td {
    padding-top: 0.2rem !important;
    padding-bottom: 0.2rem !important;
    font-size: 1rem;
}


.bootstrap-table td {
    white-space: nowrap;
}

.fixed-table-container thead th .th-inner,
.fixed-table-container tbody td .th-inner {
    padding: 4px;
}

.fixed-table-container thead th .sortable {
    padding-right: 30px;
}



.page-item.active .page-link {
    background-color: #004a78;
    border-color: #004a78;
}

.page-link {
    color: #000;
}





/*Eigene CSS Klassen*/
.side-nav {
    background-color: #dbdde0;
    width: 210px;
    min-width: 210px;
}

@media (max-width: 576px) {
    .side-nav {
        width: 100px;
        min-width: 100px;
        font-size: x-small;
    }
}

.Platzhalter {
    cursor: pointer;
}

#DetailSection {
    z-index: 1;
    background-color: #dbdde0;
}

    #DetailSection > .container {
        overflow: auto;
    }


.RowParent > td {
    background-color: rgb(0,74,120);
    color: #fff;
}




.custom-combobox {
    position: relative;
    display: inline-block;
}

.custom-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    padding: 0;
}

.custom-combobox-input {
    margin: 0;
    padding: 5px 10px;
}

/* Scrollable bootstrap table */
.header-fixed {
    width: 100%
}

    .header-fixed > thead,
    .header-fixed > tbody,
    .header-fixed > thead > tr,
    .header-fixed > tbody > tr,
    .header-fixed > thead > tr > th,
    .header-fixed > tbody > tr > td {
        display: block;
    }

        .header-fixed > tbody > tr:after,
        .header-fixed > thead > tr:after {
            content: ' ';
            display: block;
            visibility: hidden;
            clear: both;
        }

    .header-fixed > tbody {
        overflow-y: auto;
        height: 250px;
    }

.header-fixed-8 > tbody > tr > td,
.header-fixed-8 > thead > tr > th {
    width: 12.5%;
    float: left;
}

.header-fixed-7 > tbody > tr > td,
.header-fixed-7 > thead > tr > th {
    width: 14.28%;
    float: left;
}

.header-fixed-6 > tbody > tr > td,
.header-fixed-6 > thead > tr > th {
    width: 16.66%;
    float: left;
}

.header-fixed-5 > tbody > tr > td,
.header-fixed-5 > thead > tr > th {
    width: 20%;
    float: left;
}

.header-fixed-4 > tbody > tr > td,
.header-fixed-4 > thead > tr > th {
    width: 25%;
    float: left;
}

.header-fixed-3 > tbody > tr > td,
.header-fixed-3 > thead > tr > th {
    width: 33.33%;
    float: left;
}