/* Grundkonfiguration Ränder setzen */
* {
    padding: 0;
    margin: 0;
    box-sizing: 0;
}

body {
    margin-bottom: 3rem;
	margin-left: 15px;
	margin-right: 15px;
}

/* Logo im Header einrichten - Schrift hinter dem Logo ziehen */
img.header{
	float:left;
}

/* Menüleiste */
.nav-bar button {
    height: 30px;
    padding: 2px 10px;
    background-color: lightgreen;
    color: black;
}

/* Style The Dropdown Button */
.dropbtn {
	background-color: transparent;
	color: #b10000;
	text-decoration: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
	position: relative;
	display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	min-width: max-content;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 100;
}

/* Links inside the dropdown */
.dropdown-content a {
	color: black;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #f1f1f1}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
	display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
	background-color: #3e8e41;
}

/*

a {
    color: #b10000;
}

a:hover {
    color: #7a0202;
}

.logo {
    max-width: 300px;
}

h1 {
    font-size: 30px;
    margin-bottom: 1.5rem;
}

h2 {
    font-size: 20px;
    margin-bottom: 1rem;
}

label {
    font-weight: 500;
    margin-bottom: 5px;
}

.btn-primary {
    background-color: #b10000;
    border-color: #b10000;
    font-size: 16px;
    padding: 7px 15px;
}

.btn-primary:hover {
    background-color: #7a0202 !important;
    border-color: #7a0202 !important;
}

.form-check-input:checked {
    background-color: #b10000;
    border-color: #b10000
  }
*/

/* Spaltenanzeige für die letzten Spalten ausblenden */
.dt-button[data-cv-idx="0"],.dt-button[data-cv-idx="1"],.dt-button[data-cv-idx="20"],.dt-button[data-cv-idx="21"] {
/*    display: none !important; */
}

/* Abgewählte Spalten in der Spaltenauswahl */
button.dt-button.buttons-columnVisibility:not(.active) {
    color: red;
    text-decoration: line-through;
}

/* Optionen für die Bedingungen der letzen Spalten ausblenden */
option[value="20"], option[value="21"] {
    display: none;
}

/* Eingabefelder im Modal ausrichten */
.col-xs-9 input {
    width: 90%;
    height: 30px;
    margin: 10px 0;
    padding: 2px;
}

.col-xs-3 label {
    display: flex;
    align-items: center;
    height: 30px;
    margin: 10px 0;
    padding: 2px;
}

/* Buttons über der Tabelle verschieben */
div.dt-buttons {
/*    margin-left: 15px; */
}
div#ks-buttons {
    display: inline-block;
}
div.dt-button-collection.two-column {
    width: 600px !important;
}
.dt-button-collection.dropdown {
/*    width: 300px; */
    width: auto;
}
/* Tabellenzeilen farblich anpassen in Abhängigkeit der Tage zum Event */

.mark_green {
    background-color: green !important;
	color : white !important;
}

.mark_0 {
    background-color: darkred !important;
	color : white !important;
}

.mark_1 {
    background-color: red !important;
	color : white !important;
}

.mark_3 {
    background-color: orangered !important;
	color : white !important;
}

.mark_5 {
    background-color: coral !important;
    color: white !important;
}

.mark_10 {
    background-color: orange !important;
/*	color : white !important; */
}

.mark_14 {
    background-color: lightgoldenrodyellow !important;
/*	color : white !important; */
}

.mark_empty {
    background-color: green;
    background-image: repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(0,0,0,.5) 5px, rgba(0,0,0,.5) 7px);
}

td button {
    color: black;
}

/* Sortierung im Header anzeigen */
th[class*="tab_col"][class*="sorting_desc"],
th[class*="tab_col"][class*="sorting_desc"],
th[class*="tab_col"][class*="sorting_asc"],
th[class*="tab_prot"][class*="sorting_desc"],
th[class*="tab_prot"][class*="sorting_asc"] {
    background-color: palegreen !important;
}

/* Datumseingabefelder formatieren */
.datefield {
	width: 100px !important;
}

span.col-label {
    display: inline-block;
    width: 145px;
}

span.col-label-sm {
    display: inline-block;
    width: 100px;
}


span.dele-label {
    display: inline-block;

}
div#dele_prot_items{
	margin-left: 5px;
	margin-right: 5px;
}

#deledate_error{
	display: block;
	margin-left: 155px;
}
[class*="_error"] {
	color: red;
} 

.tab_col_price,
.tab_col_extra,
.tab_col_totalprice,
.tab_col_voucher,
.tab_col_difference,
.tab_col_ek_ticket,
.tab_col_ek_hotel,
.tab_col_ek_extras {
    text-align: right;
}

#price,
#extra,
#totalprice,
#voucher,
#difference,
#ek_ticket,
#ek_hotel,
#ek_extras,
#menge{
	width: 100px;
}

div#filterView{
    background: lightgreen;
    display: inline-block;
    padding: 5px 10px;
    margin-bottom: 5px;
}

div#sortView {
    background: lightgreen;
    padding: 5px 10px;
    margin-bottom: 5px;
    display: block;
    width: fit-content;
}

div#tableBuchungen_length {
    background: lightgreen;
    padding: 10px 10px 5px;
    margin-bottom: 5px;
}

#tableBuchungen_info{
	font-weight: bold;
}

div#tableBuchungen_length label{
	font-weight: normal;
}

div.dt-button-collection.three-column {
    width: 850px;
}


.hidebutton {
    visibility: hidden;
}

.three-column #endfilter {
    width: 840px;
}

.two-column #endfilter {
    width: 590px;
}

input[type="file"] {
	display: block;
	margin: 2em;
	padding: 2em;
	border: thin dotted;
	background: #fff;
}

form {
	margin: 1em;
	padding: 1em;
	border: thin dotted;
	background: #ddd;
}

form button {
    padding: 2px 10px;
}

/* ############################### */
select {
    padding: 0px 5px 0px 0px;
}

[class*="Block"] {
    border-bottom: 1px solid grey;
    padding: 10px 5px 5px;
    margin-bottom: 10px;
}

.Block1 {
    background-color: lightblue;
}

.Block2 {
    background-color: lightgreen;
}

.Block3 {
    background-color: lightgrey;
}

.Block4 {
    background-color: lightyellow;
}

*[id^='rechnummer']{
	margin-bottom: 20px;
}

.col-fields input {
    width: 210px;
}
input#bemerkung {
    width: 1002px;
}

/* Filter-Modal anpassen */
.ks-button {
    display: block;
    width: 100%;
    margin-bottom: 10px;
}

.modal-dialog.modal-md {
    width: 750px;
}

.datefilterheader {
    margin-bottom: 10px;
    text-align: center;
    background-color: #eee;
    padding: 0px 5px;
    height: 24px;
    display: block;
}

.spacer {
    height: 24px;
    margin-bottom: 10px;
}

.col-xs-6 span.col-label {
    margin-bottom: 10px;
}

h1.header {
    margin-left: 15px;
    margin-top: 10px;
    font-size: 24px;
}