.rates-table {
	border-collapse: collapse;
	font-size: 14px;
	line-height: 20px;
	text-align: right;
}

.rates-table th {
	text-align: right;
	font-weight: normal;
	white-space: nowrap;
}

.rates-table th,
.rates-table td {
	padding: 3px 5px;
	text-align: right;
}

.rates-table th:first-child,
.rates-table td:first-child {
    padding-left: 0;
}

.rates-table th:last-child,
.rates-table td:last-child {
    padding-right: 0;
}

.rmod-example-value-set input,
.rates-section textarea,
.rates-section .editable-number {
	border: 1px solid var(--input-text-border);
	text-align: right;
	padding: 1px 3px;
	min-height: 20px;
	background-color: var(--input-text-background);
	min-width: 80px;
	color: var(--text-color);
	font-size: 14px;
}

.rmod-example-value-set input {
	width: 100%;
	text-align: left;
	color: inherit;
}

.placeholder {
	display:none;
}

.rates-modelle {
	display:flex;
	margin-bottom:20px;
}

.rates-modelle-spalte-1 {
	margin-right: 10px;
}

.rates-modelle-spalte-2 {
	margin-left: 10px;
}

.rates-modelle-spalte {
	width: calc(50% - 10px);
}

.rates-modell-inaktiv {
	opacity: 0.2;
}

.rates-modelle .rm-modell {
	text-align: left;
}

td.rmod-example-modifikator,
td.rmod-example-value,
td.rm-example {
	color: rgb(70, 130, 180);
}

.rates-zinskurve {
	position:relative;
	
	min-height: 400px;
}

.rates-info {
	display:none;
	position: absolute;
	left: 0;
	top: 5px;
	width: 175px;
	margin-left: 33px;
	border: 1px solid black;
	background: var(--box-background);
	color: var(--comment-color);
	padding: 10px;
	z-index: 1
}

.rates-info li,
.rates-info p {
    margin: 0;
    font-size: 12px;
}

.rates-info li {
	margin-left: 10px;
}

.rates-info li :first-child,
.rates-info p :first-child {
	color: var(--text-color);
}

.rates-info h5 {
    font-size: 14px;
	margin-bottom: 10px;
}

.rates-info .ri-modell,
.rates-info .ri-zins {
	font-size: 14px;
	color: var(--text-color);
	margin: 5px 0;
}

.rim-total {
	margin-top: 10px;
}

.rates-info span[data-name] {
	float:right;
} 

.rates-info.visible {
	display:block;
}

.rates-zinskurve-bandbreite-low,
.rates-zinskurve-bandbreite-high {
	stroke: none;
	stroke-width: 1px;
}

.rates-zinskurve-bandbreite-low-max {
	stroke: rgba(0,200,0,0.5);
}

.rates-zinskurve-bandbreite-high-max {
	stroke: rgba(200,0,0,0.5);
}

.rates-zinskurve-bandbreite-low {
	fill: rgba(0,200,0,0.5);
}

.rates-zinskurve-bandbreite-high {
	fill: rgba(200,0,0,0.5);
}

.rates-zinskurve-basiszins {
	stroke: black;
}

.rates-zinskurve-model.focused .rates-zinskurve-basiszins {
	stroke-width: 2px;
}

.rates-zinskurve-model.focused .rates-zinskurve-bandbreite-high-max {
	stroke: rgba(200,0,0,1);
	stroke-width: 2px;
}

.rates-zinskurve-model.focused .rates-zinskurve-bandbreite-high {
	stroke: rgba(200,0,0,1);
	stroke-width: 2px;
}

.rates-zinskurve-model.focused .rates-zinskurve-bandbreite-low {
	stroke: rgba(0,200,0,1);
	stroke-width: 2px;
}

.rates-zinskurve-model.focused .rates-zinskurve-bandbreite-low-max {
	stroke: rgba(0,200,0,1);
	stroke-width: 2px;
}

.rates-zinskurve-model {
	transition: opacity 0.5s ease;
}

.rates-zinskurve-model-inaktiv {
	opacity:0;
}

.rates-zinskurve-example {
	stroke: black;
	stroke-width: 0.5px;
	fill: rgb(70, 130, 180);
}

.rates-zinskurve-example.invisible {
	opacity: 0;
}

.ff-chart-zinskurve .rates-zinskurve-example {
	opacity: 0.3;
}

.ff-chart-zinskurve .active .rates-zinskurve-example {
	opacity: 1;
}

g.active > circle.rates-zinskurve-example {
	fill: rgb(0, 76, 109);
}

g.current > circle.rates-zinskurve-example {
	fill: rgb(255, 0, 70);
}

.rates-zinskurve-example:hover,
.rates-zinskurve-example.focused {
	cursor:pointer;
	stroke: white;
	stroke-width: 1px;
	z-index: 10;
}

.rmod-config {
	height: 0;
	padding: 0;
	box-sizing: border-box;
	overflow:hidden;
}

.rates-modifikator-config-range .rmod-config {
	display:flex;
}

.rmod-punkte {
	flex: 2;
}

.rmod-punkte .rates-table {
	margin: 0;
}

.rmod-kurve-not-sorted-error {
    background-color: rgba(100,100,100,0.95);
    display: none;
    position: absolute;
    color: orange;
    font-size: 20px;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-top: 100px;
    text-align: center;
    box-sizing: border-box;
}

.rmod-kurve-not-sorted-error .btn {
	margin-top: 20px;
}

.rmod-kurve-not-sorted .rmod-kurve-not-sorted-error {
	display:block;
}

.rmod-punkte thead .rmodc-kriterium {
	text-align: right;
}

.rmod-kriterium {
	width: 100%;
}

.rmod-kriterium-wrapper {
	display:flex;
}

.rmod-kriterium-info {
	flex: 1;
	font-size: 16px;
	line-height: 1.2;
}

.rmod-kurve {
	width: 50%;
	min-height: 300px;
	margin-left: 30px;
	border-left: 1px solid var(--box-progress-separator);
	background-color: var(--box-background);
	position: relative;
}

.rates-modifikatoren.rates-table {
	width: 100%;
} 

.rates-modifikatoren .btn-group {
	margin-right: 20px;
}

.rates-modifikator-config > td {
	padding:0
}

.rates-modifikator.active > tr,
.rates-modifikator.active > tr > td,
.rates-modifikator.active {
	display: block;
}

.rates-modifikator.active {
	position: absolute;
	left: -10px;
	width: 100%;
	z-index: 1;
    background-color: var(--box-background);
    box-shadow: 0 0 10px var(--text-color);
	padding: 10px 20px 20px 90px;
	box-sizing: border-box;
}

.rates-modifikator.active .rmod-config {
	height:auto;
	margin-top: 20px;
}

.rates-modifikator.active .rmod-kriterium-wrapper .btn-group {
	margin-right: 16px;
}

tbody.active .rmod-kriterium {
	font-size: 20px;
	line-height: 1.2;
	
	color: var(--text-color);
}

tbody .rmod-kriterium {
	line-height: 38px;
}

.active .rmod-kriterium [data-name="remove"],
.active .rmod-kriterium [data-name="copy"] {
	display: none;
}

.active .rmod-kriterium [data-name="edit"] {
	position: absolute;
	left: 0;
	top: 0;
	margin: 15px;
}

.active .rmod-kriterium [data-name="edit"] .ff-i:before {
	content: '\0047';
}

.rates-modifikator .rates-modifikator-info {
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
}

.rmod-example-dot {
	stroke: rgb(70, 130, 180);
	fill: white;
}

.rmod-kurve-linie {
	stroke: rgb(70, 130, 180);
	fill: none;	
}

.rates-table .rt-main {
	text-align: left;
	width: 100%;
	white-space: nowrap;
}

.rmod-kriterium-label {
	font-weight: bold;
}

.rates-modifikator .rates-table thead {
	display: none;
}

.rmod-kriterium-minmax {
	float: right;
	font-weight: bold;
	text-align: right;
}

.rmod-kriterium-minmax-abschlag { color: green; }
.rmod-kriterium-minmax-zuschlag { color: red; }

.rates-modifikator-config .rates-table thead,
.rates-modifikator-conditions .rates-table thead {
	display: table-header-group;
}

.rmod-conditions-label {
	font-size: smaller;
	margin: 0;
}

.rates-modifikator.active .rmod-conditions-label {
	display: none;
}

.rmod-conditions-label:after {
	content: '';
	clear: both;
	display: block;
}

.rmod-conditions-label dt {
	clear: both;
	float: left;
}

.rmod-conditions-label dt:after {
	content: ': ';
}

.rmod-conditions-label dd {
	margin-left: 5px;
	margin-right: 20px;
	float:left;
}

.rmod-config .rates-table .form-group,
.rmod-config .rates-table h5 {
	text-align:left;
} 

.rmod-example-modifikator,
.rmod-example-value {
	
}

.rmod-modifikator,
.rmodc-modifikator {
	
}

.rmod-werte .rmodc-kriterium textarea {
	width: 100%;
	height: 50px;
	text-align: left;
}

.rmod-werte .rates-table {
	margin: 0;
}

.rmod-boolean {
	display: flex;
	padding: 0 10px;
}

.rmod-boolean > * {
	flex: 1;
}

.rmod-boolean > span {
	text-align: left;
	line-height: 20px;
}

.rates-help {
	opacity: 0.8;
	margin-top: 15px;
	text-align: left;	
}

.rates-example-item {
	display: inline-block;
	padding-left: 30px;
}

.rates-e-i-description {
	opacity: 0.8
}

.rates-example-item h5 {
	font-size: 18px;
	line-height: 20px;
	font-weight: normal;
	color: var(--title-color);
}

.rates-example-item:before {
	width: 8px;
	height: 8px;
	margin: 5px;
	margin-left: -20px;
	content: '.';
	font-size: 0;
	display: block;
	float: left;
	border: 0.5px solid black;
	border-radius: 50%; 
}

.rates-zinskurve .rates-zinskurve-model g:nth-of-type(1) circle  { fill: red; }
.flowform-list li:nth-child(1) .rates-example-item:before { background-color: red; }

.rates-zinskurve .rates-zinskurve-model g:nth-of-type(2) circle  { fill: green; }
.flowform-list li:nth-child(2) .rates-example-item:before { background-color: green; }

.rates-zinskurve .rates-zinskurve-model g:nth-of-type(3) circle  { fill: blue; }
.flowform-list li:nth-child(3) .rates-example-item:before { background-color: blue; }

.rates-zinskurve .rates-zinskurve-model g:nth-of-type(4) circle { fill: cyan; }
.flowform-list li:nth-child(4) .rates-example-item:before { background-color: cyan; }

.rates-zinskurve .rates-zinskurve-model g:nth-of-type(5) circle { fill: magenta; }
.flowform-list li:nth-child(5) .rates-example-item:before { background-color: magenta; }

.rates-zinskurve .rates-zinskurve-model g:nth-of-type(6) circle { fill: yellow; }
.flowform-list li:nth-child(6) .rates-example-item:before { background-color: yellow; }


.rate-ranking-own {
	color: var(--highlight-color);
}

.rates-table {
	position: relative;
}

.rate-ranking-details {
	text-align: left;
	position: absolute;
	top: 0;
	left: 0;
	background: white;
	width: 100%;
	border: 1px solid black;
	box-shadow: 2px 2px 20px black;
	padding: 10px;
}

.rate-ranking-details .ff-i-close {
	float: right;
}

.konfiguration-aktivierung {
	/* margin-bottom: 20px !important; */
}