/***************************************
*** Definiert den Aufbau des Checkouts
***************************************/
.kassenskin_checkout {
	position: relative;
	float: left;
	width: 100%;
	height: calc(100% - 30px);
	background-color: inherit;
}
.checkout_dialog {
	position: relative;
	float: left;
	width: 100%;
	height: 100%;
	background: inherit;
}
.checkout_dialog_content {
	position: relative;
	float: left;
	width: 100%;
	height: calc(100% - 54px);
	background-color: white;
}
.checkout_dialog_header {
	position: relative;
	float: left;
	width: calc(100% - 30px);
	min-height: 25px;
	padding: 30px 5px 30px 30px;
	font-size: 18px;
	font-weight: bold;
	background-color: inherit;
}
.checkout_dialog_data {
	position: relative;
	float: left;
	width: calc(100% - 30px);
	padding: 0px 0px 0px 30px;
	background-color: inherit;
}
.checkout_buttons {
	position: absolute;
	width: 100%;
	height: 54px;
	bottom: 0px;
	background-color: inherit;
}

/**************************************
 *** Dialog zur Auswahl der Zahlart
 **************************************/
.checkout_paymethods {
	position: relative;
	float: left;
	width: 100%;
}
.checkout_paymethod_header {
	display: block;
	font-weight: bold;
	padding-left: 10px;
	padding-bottom: 10px;
}

/** DIV in denen die externen und internen Zahlarten angezeigt werden */
#checkout_external_paymethods, 
#checkout_internal_paymethods {
	position: relative;
	float: left;
	width: 100%;
	padding-bottom: 20px;
}

/** DIV in dem die Buttons und der Scrollbar der externen Zahlarten angezeigt werden */
/** In der normalen Ansicht können 3 Buttons pro Zeile angezeigt werden */
#checkout_external_paymethod_table {
	width: calc(3 * 200px + 60px);
	height: 100%;
	max-height: 220px;
}

#checkout_external_paymethod_table {
	height: 100%;
	max-height: 290px;
}

/** In der großem Ansicht können 4 Buttons pro Zeile angezeigt werden */
@media only screen and (width : 1366px){
	#checkout_external_paymethod_table {
		width: calc(4 * 200px + 70px);
	}
}

/** DIV in dem die externen Zahlarten angezeigt werden */
#checkout_external_paymethod_content {
	max-height: inherit;
	margin-left: 0px;
}

/** DIV in dem die internen Zahlarten angezeigt werden */
#checkout_internal_paymethod_table {
	position: relative;
	float: left;
	width: 100%;
}

/** DIV in dem die Checkbox für die Tischrabatte und die Teilzahlungen angezeigt werden */
.checkout_paymethod_info {
	position: absolute;
	bottom: 0px;
	width: calc(100% - 30px);
	height: 96px;
	padding-left: 30px;
}

/** DIV in dem die Checkbox für die Tischrabatte angezeigt wird */
.checkout_checkbox_div {
	position: relative;
	float: left;
	width: 100px;
	padding-left: 10px;
	padding-bottom: 10px;
	white-space: nowrap;
}
.checkout_checkbox_header {
	padding-bottom: 10px;
	font-size: 16px;
	font-weight: bold; 
}
.checkout_reduction_checkbox {
	margin-left: 25px;
}

/** DIV in dem die Teilzahlungen angezeigt werden */
.checkout_part_payments {
	position: absolute;
	top: 12px;
	right: 10px;
	width: 350px;
	height: 60px;
	padding: 5px;
	background-color: white;
	border-color: black;
	border-style: inset;
	border-width: 2px;
	overflow: hidden;
}
.checkout_part_payments_content {
	float: left;
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	overflow-y: hidden;
}
.checkout_part_payments_scrollbar {
	float: left;
	width: 40px;
}
.checkout_part_payments_row {
	height: 20px;
	font-size: 12px;
	font-weight: normal;
}
.part_payments_name {
	float: left;
}
.part_payments_amount {
	float: right;
}

/*******************************************
 **** Dialog zur Auswahl eines Hotelgastes
 *******************************************/
.checkout_guest_button {
	position: relative;
	float: left;
	width: 280px;
	height: 55px;
	cursor: pointer;
	margin: 5px;
	padding: 3px 0px 0px 10px;
	border-top: 2px solid #9cf;
	border-left: 2px solid #9cf;
	border-right: 2px solid #369;
	border-bottom: 2px solid #369;
	background-image:-moz-linear-gradient(270deg, #fff ,#4775A2); 
 	background-image:-webkit-linear-gradient(270deg, #fff ,#4775A2);  
	background: -o-linear-gradient(top, #fff, #4775A2);
	background: -ms-linear-gradient(top, #fff 30%, #4775A2 100%); 
}
.checkout_guest_button_inaktiv {
	cursor: default;
	background-image:-moz-linear-gradient(270deg, #fff ,#C7D6E3); 
 	background-image:-webkit-linear-gradient(270deg, #fff ,#C7D6E3);  
	background: -o-linear-gradient(top, #fff, #C7D6E3);
	background: -ms-linear-gradient(top, #fff 30%, #C7D6E3 100%);
}

/****************************************
 **** Dialog zur Auswahl eines Hausbons
 ****************************************/

/******************************************
 **** Dialog zur Auswahl eines Gutscheins
 ******************************************/

/********************************************
**** Dialog zur Auswahl eines Tischrabatten
********************************************/

/** DIV in dem die Buttons mit den Tischrabatten angezeigt werden */
/** In der normalen Ansicht können 2 Buttons pro Zeile angezeigt werden */
#checkout_reduction_buttons {
	width: calc(2 * 300px + 60px);
	margin-top: 50px;
}

/** In der großem Ansicht können 3 Buttons pro Zeile angezeigt werden */
@media only screen and (width : 1366px){
	#checkout_reduction_buttons {
		width: calc(3 * 300px + 60px);
	}
}

/************************************
**** Dialog mit der Zusammenfassung 
*************************************/

/** DIV in dem die Zusammenfassung des Vorgangs angezeigt wird */
#checkout_summary_data {
	display: grid;
	justify-content: center;
}
#checkout_summary_sequence {
	font-size: 18px;
	min-height: 120px;
}
/** DIV in dem die aktuelle Zahlart angezeigt wird */
#checkout_summary_paymethod {
	font-size: 20px;
}
#checkout_summary_total_amount {
	font-weight: bold;
}
#checkout_summary_reduction {
}
#checkout_summary_brutto_amount {
	font-weight: bold;
	border-bottom-color: black;
	border-bottom-style: inset;
	border-bottom-width: 1px;
	margin-bottom: 10px;
}
#checkout_summary_payment {
	height: auto;
	padding: 5px 0 5px 0;
}
#checkout_summary_current_amount {
	display: inline-block;
	text-align: right;
	vertical-align: middle;
	width: 80px;
	height: 25px;
	font-size: 16px;
	font-weight: bold;
	border-color: black;
	border-style: inset;
	border-width: 2px;
}
#checkout_summary_open_amount {
	display: flex;
	align-items: center;
	height: 35px;
	font-weight: bold;
	border-top-color: black;
	border-top-style: inset;
	border-top-width: 1px;
	margin-top: 10px;
}
.checkout_summary_content {
	position: relative;
	float: left;
	width: 650px;
	padding: 10px 10px 50px 10px;
}
.checkout_summary_row {
	float: left;
	width: 100%;
	height: 30px;
}
.checkout_summary_description {
	float: left;
	width: calc(100% - 150px);
}
.checkout_summary_value {
	float: left;
	width: 150px;
	text-align: right;
}

.checkout_summary_paymethod_description {
	float: left;
	width: 250px;
	font-weight: bold;
}
.checkout_summary_paymethod_value {
	float: left;
	width: 300px;
}
#checkout_summary_okay_button_div {
	position: absolute;
	bottom: 75px;
	width: 100%;
	display: flex;
	justify-content: center;
}
#checkout_lottery_code {
	margin-top: 0px;
}