@font-face {
    font-family: "MuseoSlab";
    src: url(../fonts/Museo_Slab/Museo_Slab_300.ttf);
}

@font-face {
    font-family: "Roboto";
    src: url(../fonts/Roboto/Roboto-Regular.ttf);
}

body {
    font-family: Arial, Helvetica, sans-serif;
}

table.table {
    line-height: 30px;
    font-size: 16px;
}

.actioncell {
    white-space: nowrap;
}

.tablescroller {
    overflow-x: scroll;
}

@media (min-width: 768px) {
    .tablescroller {
        overflow-x: auto;
    }
}

table.table th {
    white-space: nowrap;
}

.btn-sm {
    --bs-btn-font-size: 0.8em;
}

.feather {
    width: 16px;
    height: 16px;
    vertical-align: text-bottom;
}

/*
   * Sidebar
   */

.sidebar {
    position: fixed;
    top: 0;
    /* rtl:raw:
    right: 0;
    */
    bottom: 0;
    /* rtl:remove */
    left: 0;
    z-index: 100;
    /* Behind the navbar */
    padding: 48px 0 0;
    /* Height of navbar */
    box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.1);
    overflow-y: scroll;
}

@media (max-width: 991px) {
    .sidebar {
        top: 2rem;
    }
}

.sidebar-sticky {
    position: relative;
    top: 0;
    height: calc(100vh - 48px);
    padding-top: 0.5rem;
    overflow-x: hidden;
    overflow-y: auto;
    /* Scrollable contents if viewport is shorter than content. */
}

.sidebar .nav-link {
    font-weight: 500;
    color: #333;
}

.sidebar .nav-link .feather {
    margin-right: 4px;
    color: #727272;
}

.sidebar .nav-link.active {
    color: #2470dc;
}

.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
    color: inherit;
}

.sidebar-heading {
    font-size: 0.75rem;
    text-transform: uppercase;
}

.form-control,
.form-select {
    border-radius: 0px;
    background-color: #f3f8fb;
}

/*
   * Navbar
   */

.navbar-brand {
    /* padding-top: .75rem;
    padding-bottom: .75rem; */
    font-size: 1rem;
    background-color: rgba(0, 0, 0, 0.25);
    box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25);

}

@media (max-width: 991px) {
    .navbar-brand {
        margin-top: 7px;
        margin-bottom: 8px;
    }
}

.navbar .navbar-toggler {
    top: 0.25rem;
    right: 1rem;
}

.navbar .form-control {
    padding: 0.75rem 1rem;
    border-width: 0;
    border-radius: 0;
}

.form-control-dark {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.1);
}

.form-control-dark:focus {
    border-color: transparent;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.25);
}

.col-form-label,
.form-label {
    font-weight: bold;
}

.input-group button {
    border-radius: 0px;
}

#sidebarMenu {
    font-size: 20px;
}

#sidebarMenu button {
    font-size: 23px;
    font-weight: 500;
    color: #466075;
}

.sidebarMenulink {
    font-size: 18px;
}


.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.btn-toggle {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.5rem;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.65);
    background-color: transparent;
    border: 0;
}

.btn-toggle:hover,
.btn-toggle:focus {
    color: rgba(0, 0, 0, 0.85);
    background-color: #d2f4ea;
}

.btn-toggle::after {
    width: 1.25em;
    line-height: 0;
    content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
    transition: transform 0.35s ease;
    transform-origin: 0.5em 50%;
}

.btn-toggle[aria-expanded="true"] {
    color: rgba(0, 0, 0, 0.85);
}

.btn-toggle[aria-expanded="true"]::after {
    transform: rotate(90deg);
}

.btn-toggle-nav a {
    display: inline-flex;
    padding: 0.1875rem 0.5rem;
    margin-top: 0.125rem;
    margin-left: 1.25rem;
    text-decoration: none;
    color: #466075 !important;
}

.btn-toggle-nav a:hover,
.btn-toggle-nav a:focus {
    background-color: #d2f4ea;
}

@media ((min-width: 1590.01px) and (max-width: 1750px)) {
    #sidebarMenu button {
        font-size: 21px;
    }

    .sidebarMenulink {
        font-size: 16px;
    }

    table.table {
        line-height: 48px;
        font-size: 17px;
    }
}

@media ((min-width: 1460.01px) and (max-width: 1590px)) {
    #sidebarMenu button {
        font-size: 19px;
    }

    .sidebarMenulink {
        font-size: 14px;
    }

    table.table {
        line-height: 48px;
        font-size: 16px;
    }
}

@media ((min-width: 1330.01px) and (max-width: 1460px)) {
    #sidebarMenu button {
        font-size: 17px;
    }

    .sidebarMenulink {
        font-size: 12px;
    }

    table.table {
        line-height: 48px;
        font-size: 16px;
        /*15*/
    }
}

@media ((min-width: 1260.01px) and (max-width: 1330px)) {
    #sidebarMenu button {
        font-size: 15px;
    }

    .sidebarMenulink {
        font-size: 11px;
    }

    table.table {
        line-height: 48px;
        font-size: 16px;
        /*14*/
    }
}

@media ((min-width: 992px) and (max-width: 1260px)) {
    #sidebarMenu button {
        font-size: 13px;
        /*11*/
    }

    .sidebarMenulink {
        font-size: 12px;
        /*10*/
    }

    table.table {
        line-height: 48px;
        font-size: 16px;
        /*13*/
    }

    .btn-toggle-nav a {
        margin-left: 0.5rem;
    }
}

@media ((min-width: 500.01px) and (max-width: 991.98px)) {
    table.table {
        line-height: 48px;
        font-size: 14px;
        /*12*/
    }

    .table.table> :not(caption)>* {
        border-width: var(--bs-border-width) 0 !important;
    }

    table.table> :not(caption)>*>* {
        border-width: 0 var(--bs-border-width) !important;
    }
}

@media (max-width: 500px) {
    table.table {
        line-height: 48px;
        font-size: 14px;
        /*10*/
    }

    .table.table> :not(caption)>* {
        border-width: var(--bs-border-width) 0 !important;
    }

    table.table> :not(caption)>*>* {
        border-width: 0 var(--bs-border-width) !important;
    }
}


.bold {
    font-weight: bold !important;
}

.border-bo-field {
    padding: 6px 12px;
    border-radius: 5px;
    margin-top: 10px;
}

.callout {
    --bs-link-color-rgb: var(--bd-callout-link);
    --bs-code-color: var(--bd-callout-code-color);
    padding: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    color: var(--bd-callout-color, inherit);
    background-color: var(--bd-callout-bg, var(--bs-gray-100));
    border-left: 0.25rem solid var(--bd-callout-border, var(--bs-gray-300));
}

.callout-info {
    --bd-callout-color: var(--bs-info-text-emphasis);
    --bd-callout-bg: var(--bs-info-bg-subtle);
    --bd-callout-border: var(--bs-info-border-subtle);
}

.callout-warning {
    --bd-callout-color: var(--bs-warning-text-emphasis);
    --bd-callout-bg: var(--bs-warning-bg-subtle);
    --bd-callout-border: var(--bs-warning-border-subtle);
}

.callout-danger {
    --bd-callout-color: var(--bs-danger-text-emphasis);
    --bd-callout-bg: var(--bs-danger-bg-subtle);
    --bd-callout-border: var(--bs-danger-border-subtle);
}

.hover-row:hover {
    background-color: rgb(236, 236, 236);
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #233f8f;
    --bs-btn-border-color: #233f8f;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #0b5ed7;
    --bs-btn-hover-border-color: #0a58ca;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #0a58ca;
    --bs-btn-active-border-color: #0a53be;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #233f8f;
    --bs-btn-disabled-border-color: #233f8f;
}

.callout-success {
    border-left-color: #bfe0c6;
    background-color: #d4edda;
}

h1.modul_headline {
    text-transform: uppercase;
    color: #466075;
}

th,
th a,
th a:active,
th a:focus,
th a:hover {
    color: #466075 !important;
    text-decoration: none;
}

th a:hover {
    text-decoration: underline;
}

.active>.page-link,
.page-link.active {
    z-index: 3;
    background-color: #303c5e;
    border-color: #303c5e;
}

.navbar-brand {
    font-size: 1rem;
    background-color: #303c5e;
    box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25);
    text-align: center;
}

.bg-dark {
    background-color: #303c5e !important;
}

.btn-logout {
    color: #fff;
}

.table-striped>tbody>tr:nth-of-type(2n + 1)>* {
    --bs-table-bg-type: #f3f8fb;
}

.table-striped>tbody>tr:nth-of-type(2n + 1).table-danger>* {
    --bs-table-bg-type: #e7c2c5;
    /*f8d7da*/
}

.form-control-dark .btn-secondary {
    color: #fff;
    background-color: #6c757d;
    border-color: #6c757d;
}

.menu-admin-name {
    margin-top: 0.125rem;
    margin-left: 0.5rem;
    text-decoration: none;
    text-decoration-color: currentcolor;
    color: #466075 !important;
    font-size: 1rem;
    font-weight: bold;
}

.border-bo-field {
    padding: 6px 12px;
    border-radius: 0px;
    margin-top: 10px;
}

.menu-profile {
    margin-left: 0.5rem;
}

.menu-profile button {
    border: none;
    border-radius: 50%;
    background-color: #303c5e;
    padding: 10px;
}

.menu-profile button:hover,
.menu-profile button:active {
    background-color: #303c5e;
}

.menu-profile button a {
    color: #fff;
    text-decoration: none;
}

.datalist-like-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    /* background-color: white;
    border: 1px solid #ccc;
    padding: 0.5em 2em 0.5em 0.5em;
    border-radius: 4px; */
    font-size: 1em;
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='10'%3E%3Cpolygon points='7,10 0,0 14,0' fill='%23333'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.5em center;
    background-size: 1em;
    cursor: pointer;
}

/* ****************************************
searchable dropdown START
**************************************** */
ul.searchable-dropdown {
    position: absolute;
    z-index: 1000;
    width: 49%;
    max-height: 200px;
    overflow-y: auto;
    cursor: pointer;
}

input.searchable-dropdown {
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-chevron-down' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708'/></svg>") no-repeat right 0.75rem center,
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-search' viewBox='0 0 16 16'><path d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/></svg>") no-repeat left 0.75rem center;
    background-size: 0.8rem, 0.8rem;
    padding-left: 2rem;
    padding-right: 2rem;
}

/* ****************************************
searchable dropdown END
**************************************** */