
.is-total-box
{
	padding: 25px 0 10px 0;
	font-family: my-new-regular-font, sans-serif;
	font-size: 14px;
}

.is-redesigned .is-total-amount-box
{
	width: 33%;
	text-align: center;
	float: left;
}

.is-redesigned .is-big-amount
{
	padding: 9px 9px 9px 9px;
	font-size: 28px;
}

#the-reduction-report
{
	margin: 0 0 30px 0;
}

/*#the-event-detail  .is-category-switch,*/
#the-event-detail .is-category-switch,
#the-reduction-report .is-category-switch,
.is-category-switch
{
	margin: 25px 0 0 0;
	padding: 0 0 0 39px;
	font-family: my-new-regular-font, sans-serif;
	font-size: 14px;
}

/*#the-event-detail  .is-category-switch:before,*/
#the-event-detail .is-category-switch:before,
#the-reduction-report .is-category-switch:before,
.is-category-switch:before
{
	margin: 0 9px 0 -39px;
	content: '';
	width: 25px;
	height: 25px;
	background-image: url('./image/payout-grid.png');
	background-repeat: no-repeat;
	background-position: 50px 50px;
	display: inline-block;
	float: left;
}

#the-event-detail .is-category-switch.is-repc:before,
#the-reduction-report .is-category-switch.is-repc:before,
.is-category-switch.is-repc:before
{
	background-position: -50px -200px;
}

#the-event-detail .is-category-switch.is-rent:before,
#the-reduction-report .is-category-switch.is-rent:before,
.is-category-switch.is-rent:before
{
	background-position: -100px -200px;
}

#the-event-detail .is-category-switch.is-towc:before,
#the-reduction-report .is-category-switch.is-towc:before,
.is-category-switch.is-towc:before
{
	background-position: -150px -200px;
}

#the-event-detail .is-category-switch.is-hold:before,
#the-reduction-report .is-category-switch.is-hold:before,
.is-category-switch.is-hold:before
{
	background-position: -200px -200px;
}

#the-event-detail .is-category-switch.is-regc:before,
#the-reduction-report .is-category-switch.is-regc:before,
.is-category-switch.is-regc:before
{
	background-position: -250px -200px;
}

#the-event-detail .is-category-switch.is-othe:before,
#the-reduction-report .is-category-switch.is-othe:before,
.is-category-switch.is-othe:before
{
	background-position: -300px -200px;
}

#the-event-detail .is-category-switch.is-stal:before,
#the-reduction-report .is-category-switch.is-stal:before,
.is-category-switch.is-stal:before
{
	background-position: -350px -200px;
}

#the-event-detail .is-category-switch.is-rcvr:before,
#the-reduction-report .is-category-switch.is-rcvr:before,
.is-category-switch.is-rcvr:before
{
	background-position: -400px -200px;
}

#the-event-detail .is-category-switch.is-cost:before,
#the-reduction-report .is-category-switch.is-cost:before,
.is-category-switch.is-cost:before
{
	background-position: -300px -300px;
}

/* REDUCTION */
/*#the-event-detail  .is-category-switch.is-frgn:before,*/
#the-event-detail .is-category-switch.is-frgn:before,
#the-reduction-report .is-category-switch.is-frgn:before,
.is-category-switch.is-frgn:before
{
	background-position: 0px -300px;
}

#the-event-detail .is-category-switch.is-tmln:before,
#the-reduction-report .is-category-switch.is-tmln:before,
.is-category-switch.is-tmln:before
{
	background-position: -200px -200px;
}

#the-event-detail .is-category-switch.is-pntg:before,
#the-reduction-report .is-category-switch.is-pntg:before,
.is-category-switch.is-pntg:before
{
	background-position: -50px -300px;
}

#the-event-detail .is-category-switch.is-admn:before,
#the-reduction-report .is-category-switch.is-admn:before,
.is-category-switch.is-admn:before
{
	background-position: -150px -350px;
}

#the-event-detail .is-category-switch.is-dspl:before,
#the-reduction-report .is-category-switch.is-dspl:before,
.is-category-switch.is-dspl:before
{
	background-position: -400px -350px;
}

#the-event-detail .is-category-switch.is-gfsf:before,
#the-reduction-report .is-category-switch.is-gfsf:before,
.is-category-switch.is-gfsf:before
{
	background-position: -350px -350px;
}

#the-event-detail .is-category-switch.is-sndr:before,
#the-reduction-report .is-category-switch.is-sndr:before,
.is-category-switch.is-sndr:before
{
	background-position: -300px -350px;
}

#the-event-detail .is-category-switch.is-tstd:before,
#the-reduction-report .is-category-switch.is-tstd:before,
.is-category-switch.is-tstd:before
{
	background-position: -250px -350px;
}

#the-event-detail .is-category-switch.is-clng:before,
#the-reduction-report .is-category-switch.is-clng:before,
.is-category-switch.is-clng:before
{
	background-position: -200px -350px;
}

#the-event-detail .is-category-switch.is-vipc:before,
#the-reduction-report .is-category-switch.is-vipc:before,
.is-category-switch.is-vipc:before
{
	background-position: -100px -300px;
}

#the-event-detail .is-category-switch.is-rate:before,
#the-reduction-report .is-category-switch.is-rate:before,
.is-category-switch.is-rate:before
{
	background-position: -150px -300px;
}

#the-event-detail .is-category-switch.is-down:before,
#the-reduction-report .is-category-switch.is-down:before,
.is-category-switch.is-down:before
{
	background-position: -200px -300px;
}

#the-event-detail .is-category-switch.is-lwyr:before,
#the-reduction-report .is-category-switch.is-lwyr:before,
.is-category-switch.is-lwyr:before
{
	background-position: -250px -300px;
}

#the-event-detail .is-category-switch.is-rsdl:before,
#the-reduction-report .is-category-switch.is-rsdl:before,
.is-category-switch.is-rsdl:before
{
	background-position: -300px -300px;
}

#the-event-detail .is-category-switch.is-docc:before,
#the-reduction-report .is-category-switch.is-docc:before,
.is-category-switch.is-docc:before
{
	background-position: -350px -300px;
}

#the-event-detail .is-category-switch.is-chrg:before,
#the-reduction-report .is-category-switch.is-chrg:before,
.is-category-switch.is-chrg:before
{
	background-position: -400px -300px;
}

#the-event-detail .is-category-switch.is-rrpa:before,
#the-reduction-report .is-category-switch.is-rrpa:before,
.is-category-switch.is-rrpa:before
{
	background-position: -450px -300px;
}

#the-event-detail .is-category-switch.is-trns:before,
#the-reduction-report .is-category-switch.is-trns:before,
.is-category-switch.is-trns:before
{
	background-position: 0px -350px;
}

#the-event-detail .is-category-switch.is-mprt:before,
#the-reduction-report .is-category-switch.is-mprt:before,
.is-category-switch.is-mprt:before
{
	background-position: -50px -350px;
}

#the-event-detail .is-category-switch.is-tchd:before,
#the-reduction-report .is-category-switch.is-tchd:before,
.is-category-switch.is-tchd:before
{
	background-position: -100px -350px;
}

#the-event-detail .is-category-switch + div,
.is-category-switch + div
{
	display: none;
	/*padding: 0 0 10px 0;*/
}

/*.is-redesigned .is-stream-box .is-editor-switch,*/
/*.is-redesigned .is-stream-box .is-not-editable*/
.is-redesigned .is-stream-box .is-transaction,
.is-transaction
{
	margin: 0 0 0 65px;
	padding: 9px 0 0 0px;
	border-left: solid 1px silver;
}

.is-redesigned .is-stream-box .is-transaction.is-editor,
.is-transaction.is-editor
{
}

.is-redesigned .is-stream-box .is-transaction:before,
.is-transaction:before
{
	margin: 2px 0 0 -5px;
	width: 9px;
	height: 9px;
	float: left;
	content: '';
	border-radius: 5px;
	border: solid 1px silver;
	background: white;
}

.is-redesigned .is-stream-box .is-transaction.is-editor:before,
.is-transaction.is-editor:before
{
	margin: 8px 0 0 -5px;
}

#the-event-detail .is-amount-table,
.is-amount-table
{
	width: 300px;
	padding: 0 0 5px 0;
}

#the-event-detail .is-amount-table td,
.is-amount-table td
{
	font-family: my-new-regular-italic-font, sans-serif;
	font-size: 14px;
}

#the-event-detail .is-amount-table .is-small-cell,
.is-amount-table .is-small-cell
{
	width: 100px;
}

#the-event-detail .is-amount-table .is-description-cell,
.is-amount-table .is-description-cell
{
	padding: 0 0 0 20px;
	text-align: left;
}

#the-event-detail .is-amount-table .is-amount-cell,
.is-amount-table .is-amount-cell
{
	padding: 0 0 0 20px;
	text-align: right;
	white-space: nowrap;
}

#the-event-detail .is-quantifydoc
{
	color: black;
}

#the-event-detail .is-amount-table .is-amount-cell.is-payout,
.is-amount-table .is-amount-cell.is-payout
{
	color: black;
}

#the-event-detail .is-amount-table .is-amount-cell.is-payout:before,
.is-amount-table .is-amount-cell.is-payout:before
{
	content: '';
}

#the-event-detail .is-date-input
{
	width: 100px;
	color: black;
	background-color: white;
	font-family: my-new-regular-italic-font, sans-serif;
	font-size: 14px;
	padding: 5px 10px 3px 10px;
	margin: 1px 0 4px 0;
	border-radius: 6px;
	border-width: 1px;
	border-style: solid;
	border-color: lightgrey;
}

#the-event-detail .is-amount-input
{
	text-align: right;
	width: 100px;
	color: black;
	background-color: white;
	font-family: my-new-regular-italic-font, sans-serif;
	font-size: 14px;
	padding: 5px 10px 3px 10px;
	margin: 1px 0 4px 0;
	border-radius: 6px;
	border-width: 1px;
	border-style: solid;
	border-color: lightgrey;
}

#the-event-detail .is-caption-input
{
	width: 300px;
	height: 50px;
	color: black;
	background-color: white;
	font-family: my-new-regular-italic-font, sans-serif;
	font-size: 14px;
	padding: 5px 10px 3px 10px;
	margin: 1px 0 4px 0;
	border-radius: 6px;
	border-width: 1px;
	border-style: solid;
	border-color: lightgrey;
}

.is-category-switch .is-actionable
{
	padding: 5px 0 0 0;
}

.is-actionable .is-progress
{
	height: 25px;
	background: white;
}

.is-category-switch .is-actionable .is-progress
{
	height: 4px;
}

.is-actionable .is-progress .is-green
{
	height: 25px;
	background: #18a15f;
	float: left;
	text-align: right;
	color: white;
	font-family: my-new-bold-italic-font, sans-serif;
}

.is-category-switch .is-actionable .is-progress .is-green
{
	height: 5px;
}

.is-timeline .is-progress .is-green
{
	background: white;
	border-bottom: 1px dashed darkgrey;
	border-right: 1px solid darkgrey;
}

.is-actionable .is-progress .is-yellow
{
	height: 25px;
	background: gold;
	float: left;
	color: black;
	text-align: center;
	font-family: my-new-bold-italic-font, sans-serif;
}

.is-category-switch .is-actionable .is-progress .is-yellow
{
	height: 5px;
}

.is-timeline .is-progress .is-yellow
{
	background: white;
	border-bottom: 1px dashed darkgrey;
	border-right: 1px solid darkgrey;
}

.is-actionable .is-progress .is-red
{
	height: 25px;
	background: Crimson;
	float: left;
	color: white;
	font-family: my-new-bold-italic-font, sans-serif;
}

.is-category-switch .is-actionable .is-progress .is-red
{
	height: 5px;
}

.is-timeline .is-progress .is-red
{
	background: white;
	border-bottom: 1px dashed darkgrey;
}

.is-actionable .is-dash
{
	width: 2px;
	height: 25px;
	border-left: 2px dotted white;
	position: relative;
	top: -25px;
}

.is-category-switch .is-actionable .is-dash
{
	height: 5px;
	top: -4px;
}

.is-actionable .is-arrow
{
	background-repeat: no-repeat;
	width: 20px;
	height: 10px;
	background-image: url('./image/pointer.png');
	padding: 12px 0 0 0;
	position: relative;
	top: -21px;
}

.is-actionable .is-no-arrow
{
	height: 8px;
}

.is-category-switch .is-actionable .is-arrow
{
	top: -1px;
}

.is-big-light
{
	margin: 0 0 0 39px;
}

.is-big-light h3
{
	margin: 0 0 5px 0;
}

.is-big-light div
{
	width: 36px;
	height: 36px;
	float: left;
	border-radius: 18px;
	margin: 0 16px 7px 0;

	border: solid 1px gainsboro;
	background: white;
}

.is-big-light div.is-red.is-on
{
	border-color: Crimson;
	background: Crimson;
}

.is-big-light div.is-yellow.is-on
{
	border-color: gold;
	background: gold;
}

.is-big-light div.is-green.is-on
{
	border-color: #18a15f;
	background: #18a15f;
}

#the-reduction-report table td
{
	padding: 2px 7px 2px 7px;
}

#the-reduction-report table td:nth-child(3)
{
	text-align: right;
}

#the-reduction-report .is-pie-chart-box
{
	padding: 0 0 0 39px;
}

/* THE OLD PIE CHART  */

.is-old-pie-chart
{
	display: none;
}

#the-payout-pie-chart,
#the-reduction-pie-chart
{
	width: 250px;
	height: 250px;
	float: left;
	margin: 0 30px 0 0;
}

/* pie chart fix setting */
.is-slice
{
	position: absolute;
	width: 250px;
	height: 250px;
	clip: rect(0px, 250px, 250px, 125px);
	border-radius: 125px;
	transition: all 0.8s ease-out;
}

.is-slice-inner
{
	position: absolute;
	width: 250px;
	height: 250px;
	clip: rect(0px, 125px, 250px, 0px);
	border-radius: 125px;
	-webkit-backface-visibility: hidden;
	transition: all 0.8s ease-out;
}

/* PIE CHART COLORS */

/* Abschleppkosten->AH */
.is-legend-square.is-towc,
.is-towca > .is-slice-inner,
.is-towcb > .is-slice-inner
{
	background: wheat;
}

/*An-/Abmeldekosten->AH*/
.is-legend-square.is-regc,
.is-regca > .is-slice-inner,
.is-regcb > .is-slice-inner
{
	background: Darkcyan;
}

/* Auslandsschaden ->*/
.is-legend-square.is-frgn,
.is-frgna > .is-slice-inner,
.is-frgnb > .is-slice-inner
{
	background: Aquamarine;
}

/* Beilackierung */
.is-legend-square.is-pntg,
.is-pntga > .is-slice-inner,
.is-pntgb > .is-slice-inner
{
	/*background: indigo;*/
}

/* Großkundenrabatt */
.is-legend-square.is-vipc,
.is-vipca > .is-slice-inner,
.is-vipcb > .is-slice-inner
{
	background: Brown;
}

/*Gutachtenkosten, Sachverständigenkosten*/
.is-legend-square.is-docc,
.is-docca > .is-slice-inner,
.is-doccb > .is-slice-inner
{
	background: tomato;
}

/* Haftungsquote */
.is-legend-square.is-rate,
.is-ratea > .is-slice-inner,
.is-rateb > .is-slice-inner
{
	background: Burlywood;
}

/*Mietwagenkosten->AH*/
.is-legend-square.is-rent,
.is-renta > .is-slice-inner,
.is-rentb > .is-slice-inner
{
	background: Darkorchid;
}

/*Nutzungsausfall*/
.is-legend-square.is-down,
.is-downa > .is-slice-inner,
.is-downb > .is-slice-inner
{
	background: Cadetblue;
}

/*Rechtsanwaltskosten*/
.is-legend-square.is-lwyr,
.is-lwyra > .is-slice-inner,
.is-lwyrb > .is-slice-inner
{
	background: Coral;
}

/*Reparaturkosten->AH*/
.is-legend-square.is-repc,
.is-repca > .is-slice-inner,
.is-repcb > .is-slice-inner
{
	background: Crimson;
}

/*Restwertabzüge*/
.is-legend-square.is-rsdl,
.is-rsdla > .is-slice-inner,
.is-rsdlb > .is-slice-inner
{
	background: Cornflowerblue;
}

/*Standgebühren->AH*/
.is-legend-square.is-stal,
.is-stala > .is-slice-inner,
.is-stalb > .is-slice-inner
{
	background: darkseagreen;
}

/*Stundenverrechnungssätze*/
.is-legend-square.is-chrg,
.is-chrga > .is-slice-inner,
.is-chrgb > .is-slice-inner
{
	background: Darkgoldenrod;
}

/*UPE-Aufschläge*/
.is-legend-square.is-rrpa,
.is-rrpaa > .is-slice-inner,
.is-rrpab > .is-slice-inner
{
	background: steelblue;
}

/*Verbringungskosten*/
.is-legend-square.is-trns,
.is-trnsa > .is-slice-inner,
.is-trnsb > .is-slice-inner
{
	background: darkorchid;
}

/*Vorhaltekosten->AH*/
.is-legend-square.is-hold,
.is-holda > .is-slice-inner,
.is-holdb > .is-slice-inner
{
	background: Darkblue;
}

/*Wertminderung*/
.is-legend-square.is-mprt,
.is-mprta > .is-slice-inner,
.is-mprtb > .is-slice-inner
{
	background: darkseagreen;
}

/*Wiederbeschaffungskosten*/
.is-legend-square.is-rcvr,
.is-rcvra > .is-slice-inner,
.is-rcvrb > .is-slice-inner
{
	background: tan;
}

/*Sonstige technische Abzüge (Reduction)*/
.is-legend-square.is-tchd,
.is-tchda > .is-slice-inner,
.is-tchdb > .is-slice-inner
{
	background: mediumvioletred;
}

/*sonstige (Payout)*/
.is-legend-square.is-othe,
.is-othea > .is-slice-inner,
.is-otheb > .is-slice-inner
{
	background: purple;
}

/* THE NEW PIE CHART */

/*prepare variables*/
:root
{
	--segment1: 100;
	--segment2: 100;
	--segment3: 100;
	--segment4: 100;
	--segment5: 100;
	--segment6: 100;
	--segment7: 100;
	--segment8: 100;
	--segment9: 100;
	--segment10: 100;
	--segment11: 100;
	--segment12: 100;
	--segment13: 100;
	--segment14: 100;
	--segment1-color: wheat;
	--segment2-color: Darkcyan;
	--segment3-color: Aquamarine;
	--segment4-color: indigo;
	--segment5-color: Brown;
	--segment6-color: tomato;
	--segment7-color: Burlywood;
	--segment8-color: Darkorchid;
	--segment9-color: Cadetblue;
	--segment10-color: Coral;
	--segment11-color: Crimson;
	--segment12-color: Cornflowerblue;
	--segment13-color: darkseagreen;
	--segment14-color: Darkgoldenrod;
}

.is-new-pie-chart
{
	/* Basic layout */
	display: inline-block;
	width: 250px;
	height: 250px;
	float: left;
	margin: 0 30px 0 0;
	border-radius: 50%;

	/* fixes a minor clipping issue in Chrome */
	background-origin: border-box;

	/* function*/
	background-image: conic-gradient(
		var(--segment1-color) calc(3.6deg * var(--segment1, 100)),
		var(--segment2-color) 0 calc(3.6deg * var(--segment2, 100)),
		var(--segment3-color) 0 calc(3.6deg * var(--segment3, 100)),
		var(--segment4-color) 0 calc(3.6deg * var(--segment4, 100)),
		var(--segment5-color) 0 calc(3.6deg * var(--segment5, 100)),
		var(--segment6-color) 0 calc(3.6deg * var(--segment6, 100)),
		var(--segment7-color) 0 calc(3.6deg * var(--segment7, 100)),
		var(--segment8-color) 0 calc(3.6deg * var(--segment8, 100)),
		var(--segment9-color) 0 calc(3.6deg * var(--segment9, 100)),
		var(--segment10-color) 0 calc(3.6deg * var(--segment10, 100)),
		var(--segment11-color) 0 calc(3.6deg * var(--segment11, 100)),
		var(--segment12-color) 0 calc(3.6deg * var(--segment12, 100)),
		var(--segment13-color) 0 calc(3.6deg * var(--segment13, 100)),
		var(--segment14-color) 0
	);
}

/* small screen */
@media screen and (max-width: 600px)
{
	.is-payout-box
	{
		width: 100%;
	}

	.is-redesigned .is-big-amount
	{
		/*padding: 9px 9px 9px 9px;*/
		font-size: 18px;
	}

	.is-redesigned .is-total-box
	{
		padding: 0 0 0 0;
		/*font-family: my-new-regular-font, sans-serif;*/
		/*font-size: 14px;*/
	}
}

@media print
{
	.is-pie-chart-box,
	.is-category-switch,
	.is-big-light,
	.is-total-box
	{
		page-break-inside: avoid;
	}
}

/* css hack for IE 10 and IE 11*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active)
{
	.is-new-pie-chart
	{
		display: none;
	}

	.is-old-pie-chart
	{
		display: inline-block;
	}
}

/* css hack for microsoft edge*/
@supports (-ms-ime-align:auto)
{
	.is-new-pie-chart
	{
		display: none;
	}

	.is-old-pie-chart
	{
		display: inline-block;
	}
}

.is-event-payout-detail-box
{
	/*default hidden; shows up when switch clicked*/
	display: none;
	border: solid 1px silver;
	border-radius: 6px;
	margin: 0px 0 25px 0;
	padding: 0px 15px 19px 15px;

	/*for triangle*/
	position: relative;
}

.is-event-payout-detail-box:before
{
	/*for triangle*/
	border-color: silver transparent;
	content: '';
	position: absolute;
	bottom: -11px;
	left: 10px;
	border-width: 11px 11px 0;
	border-style: solid;
	display: block;
	width: 0;
}

.is-event-payout-detail-box:after
{
	/*for triangle*/
	border-color: white transparent;
	content: '';
	position: absolute;
	bottom: -10px;
	left: 11px;
	border-width: 10px 10px 0;
	border-style: solid;
	display: block;
	width: 0;
}

.is-event-payout-detail-box.is-triangle-top:before
{
	/* the grey triangle that gives the border */
	top: -11px;
	bottom: auto;
	right: auto;
	left: 6px;
	border-width: 0 11px 11px;
}

.is-event-payout-detail-box.is-triangle-top:after
{
	/* the white triangle before the grey one */
	top: -9px;
	bottom: auto;
	right: auto;
	left: 8px;
	border-width: 0 9px 9px;
}

.is-payout-filter-box
{
	border: solid 1px silver;
	padding: 19px 19px 29px 19px;
	margin: 0 0 19px 0;
}

.is-payout-filter-box .is-left
{
	float: left;
	margin-right: 9px;
}

.is-payout-filter-box .is-rubric
{
	font-weight: bold;
	margin-bottom: 4px;
}

/*payout report***************************************************************/
#the-payout-report-table td
{
	border-top: solid 1px black;
	padding: 6px 12px 7px 12px;
}

/*amount cell*/
#the-payout-report-table td:nth-child(2),
#the-payout-report-table td:nth-child(3),
#the-payout-report-table td:nth-child(4),
#the-payout-report-table td:nth-child(5),
#the-payout-report-table td:nth-child(6)
{
	text-align: right;
}

#the-payout-report-table td:nth-child(2),
#the-payout-report-table td:nth-child(4),
#the-payout-report-table td:nth-child(6)
{
	border-left: solid 1px black;
}

/*header*/
#the-payout-report-table tr:nth-child(1) td
{
	border-top: solid 1px transparent;
	font-size: 18px;
	text-align: left;
	padding: 12px 12px 12px 12px;

}

/*footer*/
#the-payout-report-table tr:last-child td
{
	border-bottom: double 3px black;
	font-size: 18px;
	padding: 12px 12px 12px 12px;
}
