@import "dataTables.responsive.1.0.4.css";

.fluidanchor {
    top: -60px;
    position: relative;
}

.select-search {
    background-color: white;

    padding: .275rem .75rem .175rem .75rem;

    border: 1px solid #ced4da;
}

.filter_aktiv {

    border-color: #0dcaf0 !important;
    border-width: 3px;


}


.datatable-searchbar-select {
    float: left;
    margin-right: 15px;
    font-size: 18px;
    width: 80px;
}

.datatable-header-info i {
    color: white;
    font-size: 28px;
    margin-right: 15px

}

.datatable-header-info select {
    font-size: 18px;
    width: 260px;

}

.wbo-button {
    border-color: rgb(206, 212, 218);
    border-radius: 4px;
    border-width: 1px;
    padding: 4px;
    padding-left: 1px;
    padding-right: 1px;
    margin: 2px;
    font-size: 11px;
    line-height: 10px;
    min-width: 55px;
    height: 55px;

}

.wbo-button .form-switch {
    padding: 4px !important;
}


.select-search .select2-selection {
    border: none;

}

.select-search label {
    color: #212529;
    font-size: 14px;


}

.select-search .select2-selection__arrow {
    display: none;
}

.btn-small {
    padding: .1rem .325rem;
}

.bg-grey {
    background-color: #d1cfcf !important;
}

.bg-light-grey {
    background-color: #eaeaea !important;
}


.not-premium-tr {
    background-color: #ccc !important;
}

.not-premium-tr:hover {
    background-color: #ccc !important;
}

/*test fix für labels die zeilenumbruch zu früh machen*/
.form-floating > label {
    white-space: nowrap !important;
}


/**Responsive Datatable plugin  style */
/*inline mode*/
table.dataTable.dtr-inline.collapsed tbody td:first-child::before, table.dataTable.dtr-inline.collapsed tbody th:first-child::before {
    font-family: "Font Awesome 5 Pro";
    color: #000 !important;
    font-size: 24px !important;
    content: '\f0d7' !important;
    height: 20px !important;
    width: 20px !important;
    border-radius: 4px !important;
    left: 27% !important;
    top: 50% !important;
    transform: translate(0%, -50%) !important;
    padding: 2px 4px 5px !important;
    line-height: unset !important;
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;

}

table.dataTable.dtr-inline.collapsed tbody tr.parent td:first-child::before, table.dataTable.dtr-inline.collapsed tbody tr.parent th:first-child::before {
    font-family: "Font Awesome 5 Pro";
    color: #000 !important;
    font-size: 24px !important;
    content: '\f0d8' !important;
    background-color: transparent !important;

}

/*column mode*/
table.dataTable.dtr-column tbody td.control:before,
table.dataTable.dtr-column tbody th.control:before,
tbody .dt-control.dt-dropdown-responsive::before {
    font-family: "Font Awesome 5 Pro";
    color: #000 !important;
    font-size: 24px !important;
    content: '\f0d7' !important;
    height: 20px !important;
    width: 20px !important;
    border-radius: 4px !important;
    left: 27% !important;
    top: 50% !important;
    transform: translate(0%, -50%) !important;
    padding: 2px 4px 5px !important;
    line-height: unset !important;
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
}

table.dataTable.dtr-column tbody tr.parent td.control:before,
table.dataTable.dtr-column tbody tr.parent th.control:before,
tbody .dt-control.dt-dropdown-responsive.open:before {
    font-family: "Font Awesome 5 Pro";
    color: #000 !important;
    font-size: 24px !important;
    content: '\f0d8' !important;
    background-color: transparent !important;
}


table.dataTable tr.child ul li {
    white-space: unset !important;
}


/* Media query to change table layout for smaller screens */
@media (max-width: 868px) {
    /* Force table to display as block */
    .modal {
        margin-top: 100px;
    }

    .table-container {
        overflow-x: auto;
        display: block;
    }

    /* Make table headers display as block */
    .custom-datatable th {
        display: block;
        text-align: left;
    }

    /* Make table cells display as block */
    .custom-datatable td {
        display: block;
        text-align: left;
        border: none;
    }

    /* Hide table row borders */
    .custom-datatable tr {
        border-bottom: 1px solid #ddd;
    }
}


@media screen and (max-width: 1000px) {
    .hide_ipad {
        display: none;
    }

}

@media screen and (max-width: 500px) {
    .hide_ipad {
        display: none;
    }

    .hide_phone {
        display: none;
    }

}

.burger_button {
    float: left;
    background-color: transparent;
    background-repeat: no-repeat;
    border: none;
    cursor: pointer;
    overflow: hidden;
    outline: none;
}

.burger_text {
    margin-top: 10px;
    float: right;
    text-transform: capitalize;
}

.burger_button_li {
    border-bottom: 1px solid black;
}

select, input, textarea {
    margin-bottom: 10px;
}

.p-3 {


    border-radius: 2px;
    margin: 10px;
}

#one, #one2 {
    margin-top: 5px;
}

legend {
    font-size: 22px;
    font-weight: normal !important;
    color: #c9ecff;
    background-color: #CBDDE7;
    margin-left: -15px;
    margin-top: -15px;
    margin-right: -25px;
    padding: 15px;

    width: calc(100% + 30px);

}

.btn-primary, .btn-secondary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color);
}

.bg-primary {
    background-color: var(--primary-color) !important;
}

.bg-secondary {
    background-color: var(--primary-color) !important;
}


.btn-secondary.active {
    background-color: var(--green-color) !important;
    border: var(--green-color) !important;
}

.bg-green {
    background-color: var(--green-color) !important;
}

.border-primary {
    border-color: var(--primary-color) !important;
}

.mastergroup {
    text-decoration: underline;
}

.bottomfixed {
    position: fixed;
    z-index: 5;
    bottom: 0px;
    left: 0px;


    padding-right: 5%;
}

.new_entry_resp {
    color: white;
    font-weight: bold;
    margin-top: 0px !important;
    background-color: #043149 !important;
    padding: 10px !important;
    padding-left: 15px !important;
    min-height: 33px !important;
    width: 100% !important;
    margin-right: 0px !important;
}

.savediv {
    background-color: #ddd;
    width: 230px;
    float: right;
    padding: 10px;
    border-radius: 10px 10px 0px 0px;
    border: 1px dotted #666;
}

#check_adr {
    border: 1px dotted #666;
    border-radius: 5px;
    height: 50x;
    padding: 10px;

}

h1 {
    font-weight: normal;
    text-decoration: normal;
    color: #000;
    text-transform: none !important;
    font-size: 26px !important;
    font-family: Arial !important;
    letter-spacing: auto !important;
}

#centercontainer {
    width: 100% !important;
    background: none !important;
    text-align: left !important;
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}

.container, .container-fluid {
    background-color: rgba(255, 255, 255, 0.9);
    padding-bottom: 10px;
    margin-bottom: 0px !important;


}

body {
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}

input:valid {

}

input:invalid {
    border: 3px solid tomato;
}

#nav {
    margin: auto !important;
 
}
#top-bar-logo-resp{
	width:180px;
}
#responsive-top-bar {
    position: fixed;
    font-size: 30px !important;
    top: 0;
    left: 0;
    width: 100vw;
    background-color: #043149;
    color: white;

    z-index: 9999;
}

/*black_logo_contrast_christmas.png für Weihnachten*/
#menulayer {
    width: 100% !important;

    background-image: url(../images/black_logo_contrast.png);
    background-size: auto 40px;
    background-repeat: no-repeat;
    background-position: 20px;

}

#newhead {
    background-image: none;

}

.fa-layers-counter-dash {
    background-color: tomato;
    border-radius: 5px;
    margin-top: -10px;
    font-size: 20px;
    color: #fff;
    padding: 5px;
}

.featherlight iframe {
    /* position */
    position: absolute;

    /* dimensions */
    width: 100%;


    /* styling */
    border: none;
}


.featherlight-iframe .featherlight-content {
    /* dimensions: 1140px prevents iframe from spanning the full width of the browser */
    max-width: 1140px;
    width: 100%;
    /* spacing */
    margin: 0;
    padding: 0;
}

.featherlight-iframe .featherlight-inner {
    /* positioning */
    display: block;
    float: left;
    position: relative;

}

.featherlight .featherlight-inner:after {
    /* dimensions */
    content: "";
    float: left;
    width: 100%;
    padding-top: 57%;
    display: block;
    position: relative;
}

input:valid {

}

input:invalid {
    border: 3px solid tomato;
}

.sameW {
    width: 40px;
    text-align: center;
}

.fluidlink {
    color: black;
    text-decoration: underline;
}

.fluidlink:hover {
    color: blue;
    text-decoration: underline;
}

.bigsize {
    font-size: 32px !important;
    margin-left: 1%;
}

.menuleisteFluid {
    text-align: center;
}

.minilist {
    font-size: 14px;
    max-height: 400px;
    overflow-y: scroll;
    margin-bottom: -25px;
}

.accordion {
    margin-left: -15px;
    margin-right: -15px;
}

.p-3 .accordion-body {
    font-size: 14px;
}

.table-cellspacing td {
    padding-left: 10px;
    padding-right: 10px;

}

.width_100 {
    width: 100%;
}

.vertical-align {
    vertical-align: middle;
}

.icon_wrapper {
    /*display: flex;*/
    /*flex-direction: row;*/
    /*justify-content: flex-end !important;*/

}

.burger_container {
    /*order:1;*/
}


.inputs-responsive select,
.inputs-responsive input,
.inputs-responsive textarea {
    width: 100% !important;
    box-sizing: border-box;
}

.fs-small {
    font-size: small;
}

/*flex button, muss ein .btn sein,  wie in einstellungen.umsatz.kasse.php in button-row ,
alle items haben gleiche breite und verteilen sich immer schön gleichmäßig + verhalten responsive  */
.flex-button {
    flex-grow: 1 !important;
    flex-shrink: 1 !important;
    flex-basis: 0 !important;
}

.mw-16em {
    max-width: 16em !important;
}

.mw-12em {
    max-width: 12em !important;
}

.mw-8em{
    max-width: 8em !important;
}

:root {
    /*COLORS*/
    --primary-color: #043149;
    --green-color: #029203;
    --light-blue-hover-color: #C7E8FA;
}


/*bootstrap5 breakpoint media queries */

/* Extra small devices (<576px) */
@media screen and (max-width: 575.98px) {
    .vmax-120-xs {
        width: 120vmax !important;
    }
}

/*Small devices (landscape phones, 576px and up)*/
@media screen and (min-width: 576px) {
    #responsive-top-bar {
        display: block;
    }

    .featherlight iframe {
        width: 100%;
    }

    .featherlight-iframe .featherlight-content {
        width: 100%;
    }

    .w-sm-30 {
        width: 30%;
    }

    .w-sm-0 {
        width: 0% !important;
    }

    .w-sm-25 {
        width: 25% !important;
    }

    .w-sm-50 {
        width: 50% !important;
    }

    .w-sm-75 {
        width: 75% !important;
    }

    .w-sm-100 {
        width: 100% !important;
    }


    .inputs-responsive select,
    .inputs-responsive input,
    .inputs-responsive textarea {

    }

    .vmax-120-sm {
        width: 120vmax !important;
    }


}

/*Medium devices (tablets, 768px and up)*/
@media screen and (min-width: 868px) {
    #responsive-top-bar {
        display: none;
    }

    .featherlight iframe {
        width: 100%;
    }

    .featherlight-iframe .featherlight-content {
        width: 100%;
    }

    .w-md-0 {
        width: 0% !important;
    }

    .w-md-25 {
        width: 25% !important;
    }

    .w-md-50 {
        width: 50% !important;
    }

    .w-md-75 {
        width: 75% !important;
    }

    .w-md-100 {
        width: 100% !important;
    }


    .inputs-responsive select,
    .inputs-responsive input,
    .inputs-responsive textarea {
        width: 50% !important;
        box-sizing: border-box;
    }

    .vmax-120-md {
        width: 120vmax !important;
    }

}

/*Large devices (desktops, 992px and up)*/
@media screen and (min-width: 992px) {

    .featherlight iframe {
        width: revert-layer;
    }

    .featherlight-iframe .featherlight-content {
        width: revert-layer;
    }

    .w-lg-0 {
        width: 0% !important;
    }

    .w-lg-25 {
        width: 25% !important;
    }

    .w-lg-50 {
        width: 50% !important;
    }

    .w-lg-75 {
        width: 75% !important;
    }

    .w-lg-100 {
        width: 100% !important;
    }


    .inputs-responsive select,
    .inputs-responsive input,
    .inputs-responsive textarea {
        width: 50% !important;
        box-sizing: border-box;
    }

    .w-revert-lg {
        width: revert !important;
    }

}

/* X-Large devices (large desktops, 1200px and up)*/
@media screen and (min-width: 1200px) {

    .w-xl-0 {
        width: 0% !important;
    }

    .w-xl-25 {
        width: 25% !important;
    }

    .w-xl-50 {
        width: 50% !important;
    }

    .w-xl-75 {
        width: 75% !important;
    }

    .w-xl-100 {
        width: 100% !important;
    }

    .w-revert-xl {
        width: revert;
    }

}

/*XX-Large devices (larger desktops, 1400px and up)*/
@media screen and (min-width: 1400px) {
}