body {
   
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-color: #fff;
}

#headertable:hover {
    background-color: aliceblue;
    color: #043381;
}

#bodycontent {
    background-color: #fff;
    /*padding:2px 13px 0px 13px;*/
    padding: 0.07849293563579278vw 0.5102040816326531vw 0vw 0.5102040816326531vw;
    max-width: /*575px;*/ 126.65198237885463vw;
}

table {
    border-collapse: collapse;
    border-spacing: 0px;
    border: 1px solid #ddd;
    border: 1px solid #ddd;
    background-color: white;
    color: #043381;
    overflow-x: auto;
    width: 60%;
}

#flex-container {
    width: 1800px;
}
/*Modal*/
.modal-header,
.modal-footer {
    border: none !important;
}

.modal-dialog {
    height: 100% !important; /* required */
    margin: 0 0.8px !important;
    padding: 8px 0 !important;
    overflow-y: auto !important; /* required */
    width: 100%;
    position: center;

    @media (min-width: 4sm) {
        margin: 0 auto !important;
        padding: 1.75rem 0 !important;
        max-width: initial !important; // overwrite default max-width
        width: fit-content !important; // flexible width
        min-width: 1500px !important; // makes it fat enough by default
    }
}

.modal-content {
    max-height: 100% !important; /* required */
    width: auto;
}

.modal-body {
    padding-top: 0 !important;
    overflow-y: auto !important; /* required */
}

.table > :not(caption) > * > * {
    padding: .5rem .5rem;
    background-color: var(--bs-table-bg);
    border-bottom-width: 1px;
    box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg)
}

.table > tbody {
    vertical-align: inherit
}

.table > thead {
    vertical-align: bottom
}

.table > :not(:last-child) > :last-child > * {
    border-bottom-color: currentColor
}

.caption-top {
    caption-side: top
}

.table-sm > :not(caption) > * > * {
    padding: .25rem .25rem
}

.table-bordered > :not(caption) > * {
    border-width: 1px 0
}

    .table-bordered > :not(caption) > * > * {
        border-width: 0 1px
    }

.table-borderless > :not(caption) > * > * {
    border-bottom-width: 0
}

.table-striped > tbody > tr:nth-of-type(odd) {
    --bs-table-accent-bg: var(--bs-table-striped-bg);
    color: var(--bs-table-striped-color)
}

.table-active {
    --bs-table-accent-bg: var(--bs-table-active-bg);
    color: var(--bs-table-active-color)
}

.table-hover > tbody > tr:hover {
    --bs-table-accent-bg: var(--bs-table-hover-bg);
    color: var(--bs-table-hover-color)
}

.table-primary {
    --bs-table-bg: #cfe2ff;
    --bs-table-striped-bg: #c5d7f2;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #bacbe6;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #bfd1ec;
    --bs-table-hover-color: #000;
    color: #000;
    border-color: #bacbe6
}

.table-secondary {
    --bs-table-bg: #e2e3e5;
    --bs-table-striped-bg: #d7d8da;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #cbccce;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #043381;
    --bs-table-hover-color: #000;
    color: #000;
    border-color: #cbccce
}

/*Um alle Items der navbar nach rechts zu shiften außer das Nav-Brand(Logo) */
.navbar-nav {
    margin-left: auto;
}

li {
    list-style-type: none;
}

@media (max-width: 575px) {
    table {
        border-collapse: collapse;
        border-spacing: 0.125em;
        width: /*575px;*/ 126.65198237885463vw;
        border: /*1px*/ 2.1744791666666665vw solid #ddd;
        background-color: white;
        color: #043381;
        overflow-x: auto;
        font-size: 3.3769100169779285vw;
    }
}

@media (min-width: 575px) {
    #offcanvasWithBothOptions {
        min-width: 17.692852087756545vw;
        max-width: 17.692852087756545vw;
    }

    #normaltable {
        padding-left: -0.125em;
    }

    #conovertab {
        max-width: 150px 11.25em;
        margin-left: 35px;
        overflow-x: auto;
    }
}