﻿/**
 * (en) Uniform design of form elements
 * (de) Einheitliche Standardformatierungen für Formular-Elemente
 *
 * @copyright			Copyright 2015, crossbase mediasolution GmbH
 * @version				1.0
 */

@-webkit-keyframes progress {
	from {}
	to {
		width: 50%
	}

}

@keyframes progress {
	from {}
	to {
		width: 50%
	}

}

@media screen {
	/*------------------------------------------------------------------------------------------------------*/
	/* (en) Custom HTML5 Progress Styling */
	/* (de) Progressbar */
	/*------------------------------------------------------------------------------------------------------*/
	.check-state {
		position: absolute;
		right: 12px;
		top: 8px;
	}

	progress {
		appearance: none;
		-moz-appearance: none;
		-webkit-appearance: none;
		border: none;
		/* Firefox and Opera. */
		width: 100%;
		height: 3px;
		color: #e1121a;
	}

	progress::-webkit-progress-bar {
		background-color: #e6e6e6;
	}

	/* Chrome */
	progress::-webkit-progress-value {
		background-color: #e1121a;
	}

	/* Firefox */
	progress::-moz-progress-bar {
		background-color: #e1121a;
	}

	/* IE, Edge */
	progress::-ms-fill {
		border: none;
	}

	.invalidTextInput,
	.invalidSelect {
		border: 1px solid red;
		border-radius: 0;
	}

	.invalidCheckbox {
		border: 1px solid red !important;
	}

	form i.fa.fa-warning {
		display: block;
		position: absolute;
		right: 5px;
		top: 7px;
		color: red;
	}

	form i.fa.fa-check {
		display: block;
		position: absolute;
		right: 5px;
		top: 7px;
		color: green;
	}

	/* (en) format form element label and containers */
	/* (de) Formatierung von Form-Element Bezeichnungen und Containern */
	/*------------------------------------------------------------------------------------------------------*/
	button {
		font-family: 'Neue Helvetica W01', Helvetica, Arial, sans-serif;
		appearance: none;
		background: transparent;
		cursor: pointer;
		outline: none;
		border: none;
		text-align: left;
		color: #333333;
	}

	button.no-text {
		min-width: 38px;
		text-align: center;
	}

	button.text-only {
		color: #bf1815;
		-webkit-transition: color 0.3s ease 0s;
		transition: color 0.3s ease 0s;
	}

	button.text-only:hover {
		color: #ff6601;
	}

	label {
		position: relative;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
	}

	label.float-left {
		margin-right: 4px;
		float: left;
	}

	.select2-style-label {
		line-height: 24px;
	}

	.select2-style-label label {
		display: inline;
	}

	.select2-style-input,
	.select2-style-result {
		display: block;
		position: relative;
		font-size: 100%;
		line-height: 22px;
		border-radius: 0;
		padding: 4px 8px;
		margin-bottom: 24px;
		background: #ffffff;
		color: #333333;
		border: 1px solid #e0e0e0;
	}

	.select2-style-result {
		display: inline-block;
		margin: 0 0 0 8px;
	}

	.select2-style-input.icon-button {
		padding-right: 44px;
	}

	.select2-style-input.icon-button.lg-input {
		padding-right: 44px;
	}

	.select2-style-input.icon-button.lg-input input {
		font-size: 18px;
		line-height: 24px;
	}

	.select2-style-input.icon-button.lg-input button {
		height: 34px;
		width: auto;
	}

	.select2-style-input.icon-button.lg-input button[class*='icon']:before {
		font-size: 18px;
		line-height: 24px;
	}

	::-webkit-input-placeholder {
		color: rgba(0, 0, 0, 0.4);
	}

	:-moz-placeholder {
		color: rgba(0, 0, 0, 0.4);
	}

	::-moz-placeholder {
		color: rgba(0, 0, 0, 0.4);
	}

	:-ms-input-placeholder {
		color: rgba(51, 51, 51, 0.8);
	}

	input:required {
		box-shadow: none;
	}

	input:invalid {
		box-shadow: none;
	}

	.error-text,
	.button-link{
		color: #e1121a;
	}

	input:-webkit-autofill,
	input:-webkit-autofill:hover,
	input:-webkit-autofill:focus,
	textarea:-webkit-autofill,
	textarea:-webkit-autofill:hover,
	textarea:-webkit-autofill:focus,
	select:-webkit-autofill,
	select:-webkit-autofill:hover,
	select:-webkit-autofill:focus {
		-webkit-text-fill-color: #333;
		-webkit-box-shadow: 0 0 0 30px #f8f8f8 inset;
	}

	/* (en) format info icons in form element containers	*/
	/* (de) Formatierung von Info-Icons in Form-Element Containern */
	/*------------------------------------------------------------------------------------------------------*/
	.select2-style-input.inline-icon {
		padding: 4px 8px 4px 32px;
	}

	.select2-style-input.inline-icon .fa,
	.select2-style-input.inline-icon .far,
	.select2-style-input.inline-icon .fal {
		position: absolute;
		left: 12px;
		top: 8px;
		border-color: transparent;
	}

	/* (en) format radio und checkbox elements	*/
	/* (de) Formatierung von Radio- und Checkbox-Elementen */
	/*------------------------------------------------------------------------------------------------------*/
	.checkbox-radio-group {
		margin: 0 0 18px 0;
	}

	input[type='radio'],
	input[type='checkbox'] {
		position: absolute;
		left: 4px;
		top: 4px;
		opacity: 0;
		cursor: pointer;
		z-index: 1;
	}

	.select-img input[type='radio'],
	.select-img input[type='checkbox'] {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		opacity: 0;
		cursor: pointer;
		z-index: 2;
	}

	input[type='radio']+span,
	input[type='checkbox']+span {
		cursor: pointer;
	}

	input[type='radio']+span:before,
	input[type='checkbox']+span:before {
		font-family: 'Font Awesome 5 Free';
		font-weight: 400;
		font-size: 22px;
		line-height: 26px;
		padding-left: 2px;
		display: inline-block;
		width: 22px;
		-webkit-transition: color 0.3s ease 0s;
		transition: color 0.3s ease 0s;
	}

	input[type='radio']+span:hover:before,
	input[type='checkbox']+span:hover:before {
		/* (de) nicht verwendet, da Mobile Safari Checkboxen im Hintergrund nicht erkennt */
		/* (de) not used because mobile safari does not recognize checkboxes in background */
		/*color: #ff6601;*/
	}

	input[type='radio']+span:before {
		content: '\f111';
		/* circle-blank */
	}

	input[type='radio']:checked+span:before {
		content: '\f192';
		/* circle */
	}

	input[type='checkbox']+span:before {
		content: '\f0c8';
		/* check-empty */
	}

	input[type='checkbox']:checked+span:before {
		content: '\f14a';
		/* check */
	}

	.checkbox,
	.radio {
		margin: 0;
		position: relative;
		display: block;
		line-height: 24px;
	}

	.checkbox:after,
	.radio:after {
		/*content: '\00a0';*/
	}

	.checkbox > span,
	.radio > span,
	.checkbox > div,
	.radio > div {
		margin: 0 0 6px 36px;
		display: inline-block;
	}

	.checkbox label,
	.radio label {
		background: #fff;
		border: 1px solid #e0e0e0;
		border-radius: 0;
		cursor: pointer;
		height: 22px;
		width: 22px;
		position: absolute;
		z-index: 1;
		top: 0;
		-webkit-transition: background-color 0.3s ease 0s;
		transition: background-color 0.3s ease 0s;
	}

	.checkbox.select-img label,
	.radio.select-img label {
		background: transparent;
		box-shadow: none;
		cursor: pointer;
		height: auto;
		width: auto;
		position: relative;
	}

	.radio label {
		border-radius: 100%;
	}

	.radio.select-img label {
		border: none;
		border-radius: 0;
		display: block;
	}

	.checkbox label::after,
	.radio label::after {
		background: transparent;
		border-color: #009600;
		border-style: none none solid solid;
		border-width: medium medium 3px 3px;
		content: "";
		height: 6px;
		width: 10px;
		left: 5px;
		top: 5px;
		opacity: 0;
		position: absolute;
		/* Force Hardware Acceleration */
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transform: translateZ(0) rotate(-45deg);
		transform: translateZ(0) rotate(-45deg);
		-webkit-transition: opacity 0.3s ease 0s;
		transition: opacity 0.3s ease 0s;
	}

	.checkbox.select-img label::after,
	.radio.select-img label::after {
		display: none;
	}

	.radio label::after {
		border-style: solid;
		border-width: 3px;
		border-radius: 100%;
		height: 6px;
		width: 6px;
	}

	.checkbox label:hover,
	.radio label:hover {
		background: #fff;
	}

	.checkbox.select-img label:hover,
	.radio.select-img label:hover {
		background: transparent;
	}

	.checkbox label:hover::after,
	.radio label:hover::after {
		/*opacity: 0.4;*/
	}

	.checkbox.select-img label:hover::after,
	.radio.select-img label:hover::after {
		opacity: 0;
	}

	.checkbox.select-img input[type="checkbox"]:checked+label,
	.radio.select-img input[type="radio"]:checked+label {
		background: transparent;
	}

	.checkbox input[type="checkbox"]:checked+label::after,
	.radio input[type="radio"]:checked+label::after {
		opacity: 1;
	}

	.checkbox input[type="checkbox"]:disabled + label,
	.radio input[type="radio"]:disabled + label,
	.checkbox input[type="checkbox"]:disabled + label:hover,
	.radio input[type="radio"]:disabled + label:hover {
		background: #f8f8f8;
		border: 1px solid #e0e0e0
	}

	.checkbox input[type="checkbox"]:checked:disabled + label::after,
	.radio input[type="radio"]:checked:disabled + label::after,
	.checkbox input[type="checkbox"]:checked:disabled + label:hover::after,
	.radio input[type="radio"]:checked:disabled + label:hover::after {
		border-color: rgba(112, 112, 112, 0.5);
	}

	.checkbox input[type="checkbox"]:disabled + label::after,
	.radio input[type="radio"]:disabled + label::after,
	.checkbox input[type="checkbox"]:disabled + label:hover::after,
	.radio input[type="radio"]:disabled + label:hover::after {
		border-color: transparent;
	}

	.checkbox input[type="checkbox"]:checked+label::after,
	.radio input[type="radio"]:checked+label::after {
		opacity: 1;
	}

	.checkbox.select-img input[type="checkbox"]:checked+label::after,
	.radio.select-img input[type="radio"]:checked+label::after {
		opacity: 0;
	}

	.checkbox.select-img input+label > img+img,
	.radio.select-img input+label > img+img {
		display: none;
		position: absolute;
		top: 0;
		left: 0;
	}

	.checkbox.select-img input[type="checkbox"]:checked+label > img+img,
	.radio.select-img input[type="radio"]:checked+label > img+img {
		display: block;
	}

	.checkbox.float-left,
	.radio.float-left {
		float: left;
		margin: 0 36px 30px 0;
	}

	/* (en) format radio und checkbox toggle-elements	*/
	/* (de) Formatierung von Radio- und Checkbox-Elementen im Toggle-Style */
	/*------------------------------------------------------------------------------------------------------*/


	.checkbox-switch {
		margin: 0 0 6px 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	}

	.checkbox-switch > span {
		display: inline-block;
		height: 24px;
		line-height: 24px;
		vertical-align: top;
		padding: 0 0 0 6px;
	}

	.switch-area {
		position: relative;
		display: inline-block;
		width: 50px;
		height: 24px;
		box-sizing: border-box;
		vertical-align: top;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
	}

	/* Hide default HTML checkbox */
	.switch-area input {
		opacity: 0;
		width: 100%;
		height: 100%;
		position: static;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

	}

	/* The slider */
	.switch-area .slider {
		position: absolute;
		cursor: pointer;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: #fff;
		border: 1px solid #e0e0e0;
		-webkit-transition: .4s;
		transition: .4s;
	}

	.switch-area input[type="checkbox"] + .slider::before {
		position: absolute;
		content: "";
		height: 12px;
		width: 12px;
		left: 4px;
		bottom: 4px;
		padding: 0;
		border: 1px solid #e1121a;
		background-color: #e1121a;
		-webkit-transition: .4s;
		transition: .4s;
	}

	.switch-area input[type="checkbox"]:checked + .slider {
		background-color: #e1121a;
		border: 1px solid #e1121a;
	}

	.switch-area input[type="checkbox"]:checked + .slider {
		border: 1px solid #e1121a;
	}

	.switch-area input[type="checkbox"]:checked + .slider::before {
		-webkit-transform: translateX(26px);
		-ms-transform: translateX(26px);
		transform: translateX(26px);
		border: 1px solid #fff;
		background-color: #fff;
	}

	/* Rounded sliders */

	.checkbox-switch.round .switch,
	.checkbox-switch.round .slider {
		border-radius: 24px;
	}
	.checkbox-switch.round .slider::before {
		border-radius: 50%;
	}

	/* (en) basic format of form elements */
	/* (de) Grundlagende Formatierung von Form-Elementen */
	/*------------------------------------------------------------------------------------------------------*/
	.select2-style-input input,
	.select2-style-input input:focus,
	.select2-style-input input:hover,
	.select2-style-input select,
	.select2-style-input select:focus,
	.select2-style-input select:hover,
	.select2-style-input textarea,
	.select2-style-input textarea:focus,
	.select2-style-input textarea:hover {
		line-height: 22px;
		min-height: 22px;
		background: transparent;
		border: none;
		width: 100%;
		padding: 0;
		margin: 0;
		font-family: 'Neue Helvetica W01', Helvetica, Arial, sans-serif;
		color: #333333;
		outline: none;
	}

	select+span::after,
	.searchbox input+span::after,
	.select2-style-input input+span::after,
	.select2-style-input input+ul+span::after,
	.select2-style-input select+span::after,
	.select2-style-input textarea+span::after {
		visibility: hidden;
		display: block;
		content: '';
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		box-sizing: border-box;
		transition: all 0.3s ease;
		box-shadow: inset 0 0 8px rgba(0, 0, 0, 0);
		border-radius: 0;
		cursor: text;
	}

	.select2-style-input select+span::after {
		z-index: -1;
	}

	select:focus+span::after,
	.searchbox input:focus+span::after,
	.select2-style-input input:focus+span::after,
	.select2-style-input input:focus+ul+span::after,
	.select2-style-input select:focus+span::after,
	.select2-style-input textarea:focus+span::after {
		visibility: visible;
		box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
	}

	.select2-style-input.textarea textarea,
	.select2-style-input.textarea:focus textarea,
	.select2-style-input.textarea:hover textarea {
		height: 88px;
	}

	textarea.textarea-noresize {
		resize: none;
	}

	.select2-style-input select,
	.select2-style-input select:focus,
	.select2-style-input select:hover {
		padding: 0;
		height: 24px;
		line-height: 24px;
	}

	.invalid,
	.invalid * {
		background: red !important;
		color: #fff !important;
	}

	[class*='select2'] .hide.fas {
		position: absolute;
		top: 8px;
		right: 4px;
	}

	/* (en) format of button elements */
	/* (de) Grundlagende Formatierung Schaltflächen-Elementen */
	/*------------------------------------------------------------------------------------------------------*/
	br+.button {
		margin-top: 6px;
	}

	.button,
	a.button:visited,
	a.button:active,
	a.button:focus {
		font-family: 'Neue Helvetica W01', Helvetica, Arial, sans-serif;
		display: inline-block;
		line-height: 22px;
		height: 32px;
		vertical-align: bottom;
		border-radius: 0;
		padding: 4px 12px;
		background: #e1121a;
		border: 1px solid #e1121a;
		color: #fff;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;
		box-sizing: border-box;
		cursor: pointer;
	}

	.button.button-small,
	.button.button-small:focus,
	.button.button-small:active,
	.button.button-small:visited {
		padding: 2px 12px;
		font-size: 12px;
		height: 28px;
		line-height: 22px;
	}

	.button:hover,
	a.button:hover {
		background: #bf1815;
		color: #fff;
		border: 1px solid #bf1815;
	}

	.button-inactive,
	.button-inactive:active,
	.button-inactive:focus,
	.button-inactive:visited,
	.button[disabled],
	.button[disabled]:active,
	.button[disabled]:focus,
	.button[disabled]:visited,
	.button[disabled]:hover {
		font-family: 'Neue Helvetica W01', sans-serif;
		line-height: 22px;
		border-radius: 0;
		padding: 4px 12px;
		background: #ffffff;
		color: rgba(112, 112, 112, 0.5);
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		cursor: default;
		display: inline-block;
		border: 1px solid #e0e0e0;
	}

	.button-inactive:hover,
	.button[disabled]:hover {
		background: #ffffff;
		color: rgba(112, 112, 112, 0.5);
	}

	.button-secondary,
	.button-secondary:active,
	.button-secondary:focus,
	.button-secondary:visited {
		font-family: 'Neue Helvetica W01', sans-serif;
		line-height: 22px;
		border-radius: 0;
		padding: 4px 12px;
		background: #ececee;
		color: #a0a6ad;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		display: inline-block;
		border: 1px solid #ececee;
	}

	.button-secondary:hover {
		background: #ececee;
		color: #a0a6ad;
		border: 1px solid #ececee;
	}


	div[class*=select2-style-button] {
		font-size: 0;
		overflow: visible;
	}

	div[class*=select2-style-button].float-col {
		font-size: inherit;
	}

	div[class*=select2-style-button] > * {
		font-size: 15px;
	}

	.select2-style-button-box > * {
		margin: 0 24px 24px 0;
		text-align: left;
	}

	.select2-style-button-box > br {
		margin: 0;
	}

	.select2-style-button-box-right {
		text-align: right;
	}

	.select2-style-button-box-right > * {
		margin: 0 0 24px 24px;
		text-align: left;
	}

	.select2-style-button-box-center > * {
		margin: 0 12px 24px 12px;
	}

	div[class*=select2-style-button] > span {
		display: inline-block;
		padding: 4px 6px;
	}

	.select2-style-button-box-center,
	.select2-style-button-box-center *,
	.select2-style-button-100-center *,
	.select2-style-button-100-center {
		text-align: center;
	}

	.select2-style-button-100 > *,
	.select2-style-button-100 > [class*=button],
	.select2-style-button-100 > [class*=button]:active,
	.select2-style-button-100 > [class*=button]:focus,
	.select2-style-button-100-center > *,
	.select2-style-button-100-center > [class*=button],
	.select2-style-button-100-center > [class*=button]:active,
	.select2-style-button-100-center > [class*=button]:focus {
		display: block;
		margin: 0 0 24px 0;
	}

	.select2-style-button-100 > button,
	.select2-style-button-100-center > button {
		width: 100%;
	}

	.select2-style-button-with-input {
		display: inline-block;
		position: absolute;
		right: -1px;
		top: -1px;
	}

	.float-col.select2-style-button-box > a,
	.float-col.select2-style-button-box > span {
		margin-top: 4px;
	}

	/* (en) format file upload element */
	/* (de) Formatierung des File-Upload Elements */
	/*------------------------------------------------------------------------------------------------------*/
	.select2-style-input.upload-button {
		padding-left: 160px;
	}

	.select2-style-button-with-file-upload {
		display: inline-block;
		position: absolute;
		left: -1px;
		top: -1px;
		border-radius: 0;
	}

	.select2-style-input input.file-upload-element {
		position: absolute;
		top: 0;
		left: 0;
		margin: 0;
		padding: 0;
		font-size: 15px;
		height: 32px;
		opacity: 0;
		filter: alpha(opacity=0);
		cursor: pointer !important;
	}

	.upload-delete .select2-style-button-box {
		position: absolute;
		right: -1px;
		top: -1px;
	}

	.upload-delete .select2-style-button-box > *,
	.half-padding .upload-delete .select2-style-button-box > * {
		margin: 0;
	}

	/* (en) format select element */
	/* (de) Formatierung des Select-Elements */
	/*------------------------------------------------------------------------------------------------------*/
	select {
		visibility: hidden;
	}

	.custom-select {
		position: relative;
		z-index: 1;
		padding: 4px 8px;
		height: 22px;
		display: block;
	}

	.custom-select:before {
		display: block;
		font-family: 'Font Awesome 5 Free';
		font-weight: 400;
		content: '\f107';
		font-size: 1em;
		height: 100%;
		line-height: 2.3em;
		padding: 0 0.625em;
		position: absolute;
		top: 0;
		right: 0;
		text-align: center;
		width: 1em;
		z-index: -1;
		color: #333333;
		border-radius: 0;
	}

	.custom-select select {
		visibility: visible;
		background: transparent;
		display: inline-block;
		width: 100%;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		cursor: pointer;
	}

	.custom-select select::-ms-expand {
		display: none;
		/* to ie 10 */
	}

	.custom-select select:focus {
		outline: none;
	}

	:-moz-any(.custom-select):before {
		/* this is necessary for overcome the caret default browser */
		/*background: #ffffff;*/
		pointer-events: none;
		/* https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events	*/
		z-index: 1;
		/* this is necessary for overcome the pseudo element */
	}

	/* (en) format elements in form GUIs */
	/* (de) Formatierung von Elementen in Formular-GUIs */
	/*------------------------------------------------------------------------------------------------------*/
	.grid-element {
		margin-bottom: 24px;
	}

	.half-padding .grid-element,
	.half-padding .float-col > label,
	.half-padding .float-col > span,
	.half-padding .searchbox-wrapper,
	.half-padding .select2-container,
	.half-padding .select2-style-input,
	.half-padding .select2-style-result,
	.half-padding [class*=select2-style-button] > span,
	.half-padding .select2-style-button [class*=button],
	.half-padding .select2-style-button-box [class*=button],
	.half-padding .select2-style-button-box-right [class*=button],
	.half-padding .select2-style-button-100 [class*=button],
	.half-padding .select2-style-button-100-center [class*=button],
	.half-padding .flow-inline .select2-style-label,
	.half-padding .flow-inline .select2-style-label-right,
	.half-padding .flow-inline .select2-style-label-center {
		margin-bottom: 12px;
	}

	.half-padding .checkbox-radio-group {
		margin-bottom: 6px;
	}

	.half-padding .select2-style-button-box-right > * {
		margin-left: 12px;
	}

	.half-padding .select2-style-button-box > * {
		margin-right: 12px;
	}

	.half-padding .select2-style-button-box-middle {
		margin: 0;
	}

	.grid-favorite-wrapper {
		padding-right: 35px;
		position: relative;
	}

	.grid-favorite,
	.grid-favorite[class*="tooltip-area"],
	.grid-favorite[class*="tooltip-popover"] {
		position: absolute;
		right: -1px;
		top: 3px
	}

	[class*="tooltip-area"].grid-favorite-pane {
		position: absolute;
		right: -4px;
		top: 2px
	}

	.form-group,
	.form-group * {
		white-space: nowrap;
		text-align: left;
	}

	.form-group > * {
		padding: 0 12px 0 0;
		display: inline-block;
	}

	.form-group .select2-style-input {
		display: inline-block;
		width: 28px;
		overflow: inherit;
		padding: 0 4px;
	}

	table .form-group *,
	table .form-group .select2-style-input {
		margin: 0;
	}

	div[class*="select2-style-button"] .form-group {
		display: inline;
	}

	table .form-group .amount-controls {
		position: relative;
		padding: 0 14px 0 0;
	}

	table .form-group button {
		color: #bf1815;
	}

	table .form-group button:hover {
		color: #bf1815;
	}

	table .form-group .amount-controls > * {
		display: inline-block;
		position: absolute;
		left: 0;
		line-height: 8px;
	}

	table .form-group .amount-controls span.fa,
	table .form-group .amount-controls span.far,
	table .form-group .amount-controls span.fal {
		line-height: 8px;
	}

	table .form-group .amount-controls .up {
		top: 0;
	}

	table .form-group .amount-controls .down {
		bottom: 0;
	}

	/* (en) format elements in Inline-Flow Sections */
	/* (de) Formatierung von Elementen Inline-Flow Bereichen */
	/*------------------------------------------------------------------------------------------------------*/
	.flow-inline {
		margin: 0;
		font-size: 0;
	}

	.flow-inline::before,
	.flow-inline::after {
		content: '';
		display: table;
	}

	.flow-inline::after {
		clear: both;
	}

	.flow-inline.flow-center {
		text-align: center;
	}

	.flow-inline.flow-right {
		text-align: right;
	}

	.flow-inline > li {
		display: inline-block;
		vertical-align: top;
		text-align: left;
	}

	.flow-inline > li + li {
		padding-left: 12px;
	}

	.flow-inline li > * {
		display: inline-block;
		vertical-align: middle;
		overflow: visible;
	}

	.flow-inline > li > * > * {
		font-size: 15px;
		vertical-align: middle;
	}

	.flow-inline .select2-style-label {
		margin: 0 12px 24px 0;
		line-height: 32px;
		height: 32px;
	}

	.flow-inline .select2-style-label-right {
		margin: 0 0 24px 12px;
		line-height: 32px;
		height: 32px;
	}

	.flow-inline .select2-style-label-center {
		margin: 0 0 24px 0;
		line-height: 32px;
		height: 32px;
	}

	.flow-inline .select2-container {
		width: auto;
		min-width: 72px;
	}

	.flow-inline .checkbox > span,
	.flow-inline .radio > span {
		margin: 0 30px 6px 30px
	}

	/* (en) format form elements in head area */
	/* (de) Formatierung von Form-Elementen im Head-Bereich */
	/*------------------------------------------------------------------------------------------------------*/
	.nav-top-toggle .select2-style-button-box .button {
		border-radius: 0;
		margin: 0;
		width: 42px;
		height: 50px;
	}

	#nav-top > [class*=select2-style] .button,
	#nav-top > [class*=select2-style] .select2-container {
		margin-bottom: 0;
	}

	.nav-top-toggle .button,
	#nav-top > [class*=select2-style] .button {
		background: #fff;
		border-color: #e0e0e0;
		padding: 2px 6px;
		color: #e1121a;
		display: inline-block;
	}

	#nav-top > [class*=select2-style] .button:hover {
		color: #bf1815;
		background: #f8f8f8;
	}

	#nav-top > .select2-style-drop {
		width: 160px;
		margin: 0 0 0 24px;
	}

	.half-padding #nav-top > .select2-style-drop {
		margin: 0 0 0 12px;
	}

	#nav-top [class*=select2-style-],
	#nav-top merkliste-element-wrapper,
	#nav-top merkliste-element-wrapper + a {
		display: inline-block;
		vertical-align: top;
	}

	#nachrichtSendenForm .select2-style-input,
	#kontaktForm .select2-style-input,
	#loginForm .select2-style-input,
	#requestPasswordForm .select2-style-input {
		height: auto;
	}

	#nachrichtSendenForm .select2-style-input label.error,
	#kontaktForm .select2-style-input label.error,
	#loginForm .select2-style-input label.error,
	#requestPasswordForm .select2-style-input label.error {
		color: red;
	}

	.fluid-width-video-wrapper {
		padding-top: 50% !important;
	}

	/* (en) format upload area */
	/* (de) Formatierung des Upload-Bereichs */
	/*------------------------------------------------------------------------------------------------------*/
	.upload-area {
		background: #fff;
		border-radius: 0;
		height: 288px;
		overflow-y: auto;
		margin: 0 0 12px 0;
		padding: 6px;
		position: relative;
	}

	.upload-area .upload-field-label {
		position: absolute;
		display: block;
		left: 0;
		right: 0;
		top: 50%;
		text-align: center;
		opacity: 0.5;
	}

	.upload-area > ul {
		font-size: 0;
		line-height: 0;
		margin: 0 0 6px 0 !important;
		background: #fff;
	}

	.upload-area > ul:after {
		clear: both;
		content: '';
		display: table;
	}

	.upload-area > ul > li {
		float: left;
	}

	.upload-area ul > li > div {
		background: #fff;
		border-radius: 0;
		box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
		display: inline-block;
		font-size: 15px;
		height: 120px;
		width: 120px;
		margin: 6px;
		padding: 6px;
		position: relative;
		text-align: center;
		vertical-align: bottom;
		-webkit-transition: background 1s;
		transition: background 1s;
	}

	.upload-area ul > li > .upload-error {
		background: #dc6b58;
	}

	.upload-area ul > li > div > div {
		padding: 2px;
		background: #fff;
		border-radius: 0;
		height: 80px;
		line-height: 80px;
		position: relative
	}

	.upload-area ul > li > div img {
		max-height: 60px;
		vertical-align: middle;
	}

	.upload-area ul > li > div [class*=icon] {
		text-align: center;
		background: #fff;
	}

	.upload-area ul > li > div [class*=icon]:before {
		font-family: 'Font Awesome 5 Free';
		font-weight: 400;
		font-weight: normal;
		line-height: 22px;
		padding-right: 6px;
	}

	.upload-area ul > li > div p {
		position: absolute;
		bottom: 6px;
		left: 6px;
		line-height: normal;
		white-space: nowrap;
		overflow: hidden;
		margin: 0;
		text-align: left;
		text-overflow: ellipsis;
		max-width: 90%;
		-webkit-transition: color 1s;
		transition: color 1s;
	}

	.upload-area ul > li > .upload-error p {
		color: #fff;
	}

	.upload-area ul > li > div > div .upload-meter {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
	}

	.upload-area ul > li > div > div .upload-meter > span {
		border-radius: 0;
		height: 4px;
		min-height: 4px;
		width: 0;
		display: block;
		background: #bf1815;
		position: relative;
		overflow: hidden;
		-webkit-transition: width 2s;
		transition: width 2s;
		/*-webkit-animation: progress 2s 1 forwards;
		animation: progress 2s 1 forwards;*/
	}

	.upload-meter-button {
		cursor: default;
		position: relative;
		min-width: 150px;
	}

	.upload-meter-button:hover {
		background: #e1121a;
	}

	.upload-meter-button:after {
		content: '\00a0';
	}

	.upload-meter-button .button-progress-text {
		position: absolute;
		left: 0;
		right: 0;
		z-index: 1;
		display: block;
		margin: 0 !important;
		text-align: center;
	}

	.upload-meter-button .button-progress {
		white-space: nowrap;
		position: absolute;
		top: 0;
		left: 0;
		border-radius: 0;
		width: 0;
		height: 100%;
		display: block;
		margin: 0 !important;
		background: #bf1815;
		-webkit-transition: width 2s;
		transition: width 2s;
		/*-webkit-animation: progress 2s 1 forwards;
		animation: progress 2s 1 forwards;*/
	}

	/* (en) format expandable input */
	/* (de) Formatierung expandierender Input-Felder */
	/*------------------------------------------------------------------------------------------------------*/
	.searchbox-wrapper {
		width: 100%;
		overflow: hidden;
		margin: 0 0 24px 0;
	}

	.searchbox {
		position: relative;
		min-width: 42px;
		width: 0;
		height: 34px;
		float: right;
		overflow: hidden;
		border-radius: 0;
		-webkit-transition: width 0.3s;
		transition: width 0.3s;
		box-sizing: border-box;
		border: 1px solid transparent;
	}

	.searchbox-input {
		border-radius: 0;
		color: #333333;
		display: block;
		font-size: 100%;
		line-height: 24px;
		margin-bottom: 24px;
		overflow: hidden;
		padding: 4px 44px 2px 8px;
		position: relative;
		border: 1px solid #e0e0e0;
		box-sizing: border-box;
	}

	.searchbox .select2-style-button-with-input {
		top: 0;
		right: 0;
	}

	.searchbox-input input {
		border: none;
		background: transparent;
		width: 100%;
		outline: none;
	}

	.searchbox .searchbox-submit {
		width: 20px;
		height: 20px;
		display: block;
		position: absolute;
		right: 0;
		top: 0;
		margin: 0;
		border: 0;
		outline: none;
		line-height: inherit;
		text-align: center;
		cursor: pointer;
		border-radius: 0;
	}

	.searchbox-open {
		width: 100%;
	}

	.searchbox-open .searchbox-input {
		display: block;
	}

	/* (en) Dropdown Button */
	/* (de) Auswahlliste Schaltfläche */
	/*------------------------------------------------------------------------------------------------------*/
	.dropdown {
		position: relative;
		display: inline-block;
	}

	.dropdown-100 {
		position: relative;
		display: block
	}

	.dropdown-button {
		background: #e1121a;
		color: #fff;
		padding: 4px 32px 4px 8px;
		cursor: pointer;
		margin: 0 0 24px 0;
		line-height: 24px;
		border-radius: 0;
		transition: all ease 0.3s;
		-webkit-transition: all ease 0.3s;
	}

	.dropdown-100 .dropdown-button {
		display: block;
		width: 100%;
	}

	.dropdown-button::after {
		font-family: 'Font Awesome 5 Free';
		font-weight: 400;
		content: '\f107';
		position: absolute;
		right: 10px;
		top: 6px;
		width: auto;
		text-align: left;
		background: transparent;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transition: transform 300ms ease 0s;
		-webkit-transition: -webkit-transform 300ms ease 0s;
		transition: -webkit-transform 300ms ease 0s;
		transition: transform 300ms ease 0s, -webkit-transform 300ms ease 0s;
		transform: rotate(0deg);
	}

	.dropdown-button.ellipsis-v-icon {
		padding: 4px 8px;
	}

	.dropdown-button.ellipsis-v-icon::after {
		content: '';
	}

	.dropdown-button:hover {
		background: #bf1815;
	}

	.show .dropdown-button {
		border-radius: 0;
	}

	.show .dropdown-button::after {
		-webkit-transform: rotate(-179.999deg);
		transform: rotate(-179.999deg);
	}

	.dropdown-content {
		display: none;
		position: absolute;
		margin: -24px 0 0 0;
		background: #ffffff;
		border-radius: 0;
		min-width: 160px;
		box-shadow: 5px 5px 4px 0 rgba(0, 0, 0, 0.2);
		z-index: 1;
		overflow: hidden;
		white-space: nowrap;
		border: 1px solid #e0e0e0;
		box-sizing: border-box;
	}

	.dropdown-content > button,
	.dropdown-content > a,
	.dropdown-content > span,
	.dropdown-content > a:visited,
	.dropdown-content > a:focus,
	.dropdown-content > a:active {
		color: #333333;
		padding: 4px 8px;
		text-decoration: none;
		display: block;
	}

	.dropdown-content > a:hover,
	.dropdown-content > button:hover {
		background: #bf1815;
		color: #fff;
		border-color: transparent;
	}

	.dropdown-content .checkbox {
		display: inline-block;
		height: 18px;
	}

	.show .dropdown-content {
		display: block;
	}

	.select2-style-dropdown .dropdown {
		margin: 0 24px 0 0;
	}

	.select2-style-dropdown .dropdown-content {
		min-width: 100%;
	}

	/* (en) Ripple-Effekt on Buttons */
	/* (de) Ripple-Effekt auf Schaltflächen */
	/*------------------------------------------------------------------------------------------------------*/
	[class*='select2-style-button'] > [class*='button'],
	.slider-wrapper h1 a,
	.filter-item .button {
		position: relative;
		overflow: hidden;
		/*transform: translate3d(0, 0, 0);*/
	}

	[class*='select2-style-button'] > [class*='button']:after,
	.slider-wrapper h1 a:after,
	.filter-item .button:after {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		pointer-events: none;
		background-image: radial-gradient(circle, #000 20%, transparent 20.01%);
		background-repeat: no-repeat;
		background-position: 50%;
		transform: scale(10, 10);
		opacity: 0;
		transition: transform .5s, opacity 1s;
	}

	[class*='select2-style-button'] > [class*='button']:active:after,
	.slider-wrapper h1 a:active:after,
	.filter-item .button:active:after {
		transform: scale(0, 0);
		opacity: .2;
		transition: 0s;
	}

	/* (en) reCAPTCHA formatting */
	/* (de) reCAPTCHA Formatierung */
	/*------------------------------------------------------------------------------------------------------*/
	.recaptcha {
		margin: 0;
	}

	.recaptcha-right {
		text-align: right;
	}

	[class*=recaptcha] > #rc-imageselect,
	[class*=recaptcha] > .g-recaptcha {
		transform: scale(0.76);
		-webkit-transform: scale(0.76);
		transform-origin: 0 0;
		-webkit-transform-origin: 0 0;
	}

	.recaptcha-right > #rc-imageselect,
	.recaptcha-right > .g-recaptcha {
		transform-origin: 100% 0;
		-webkit-transform-origin: 100% 0;
		display: inline-block;
	}

	[class*=recaptcha] .dropdown-content {
		padding: 6px;
	}

}


/*------------------------------------------------------------------------------------------------------*/


/* (en) Media Query 980 */


/* (de) Media Query 980 */


/*------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 980px) {
	#nav-top > [class*=select2-style] {
		float: none;
		display: inline-block;
		vertical-align: top;
	}

	#nav-top > .select2-style-drop,
	.half-padding #nav-top > .select2-style-drop {
		margin: 0 6px 12px 6px;
	}

	.half-padding .select2-style-button-box-right > * {
		margin-left: 6px;
		margin-right: 6px;
	}

	/*#nav-top > .select2-style-drop,
	.half-padding #nav-top > .select2-style-drop {
		margin: 0 12px 12px 0;
	}*/

	/*#nav-top > [class*=select2-style-button],
	.half-padding #nav-top > [class*=select2-style-button] {
		margin: 0 0 12px 0;
	}*/

	/*#nav-top > [class*=select2-style] .button,
	.half-padding #nav-top > [class*=select2-style] .button {
		margin: 0 12px 0 0;
	}*/

	.select2-style-button-box-right > * {
		margin: 0 0 12px 12px;
	}
}


/*------------------------------------------------------------------------------------------------------*/


/* (en) Media Query 850 */


/* (de) Media Query 850 */


/*------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 850px) {

	.list-to-select {
		display: none;
		margin: 12px 24px;
	}

	.linearize-level-1 .flow-inline.flow-right {
		text-align: left;
	}

	.linearize-level-1.flow-inline > li {
		display: block;
	}

	.linearize-level-1.linearize-center .flow-inline,
	.linearize-level-1.linearize-center .flow-inline.flow-right {
		text-align: center;
	}

	.form-group,
	.form-group * {
		text-align: center;
	}

	.select2-style-button-box-right > * {
		margin: 0 0 12px 12px;
	}
}


/*------------------------------------------------------------------------------------------------------*/


/* (en) Media Query 560 */


/* (de) Media Query 560 */


/*------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 560px) {
	.grid-element,
	.float-col > label,
	.float-col > span,
	.searchbox-wrapper,
	.select2-container,
	.select2-style-input,
	.select2-style-result,
	[class*=select2-style-button] > span,
	.select2-style-button [class*=button],
	.select2-style-button-box [class*=button],
	.select2-style-button-box-right [class*=button],
	.select2-style-button-box-center [class*=button],
	.select2-style-button-100 [class*=button],
	.select2-style-button-100-center [class*=button],
	.flow-inline .select2-style-label,
	.flow-inline .select2-style-label-right,
	.flow-inline .select2-style-label-center {
		margin-bottom: 12px;
	}

	.checkbox-radio-group {
		margin-bottom: 6px;
	}

	.select2-style-button-box > * {
		margin: 0 12px 12px 0;
	}

	.select2-style-button-box-right > * {
		margin: 0 0 12px 12px;
	}

	.select2-style-button-100 > *,
	.select2-style-button-100-center > * {
		margin: 0 0 12px 0;
	}

	.grid-element {
		margin-bottom: 12px;
	}

	.linearize-level-2.linearize-center .flow-inline,
	.linearize-level-2.linearize-center .flow-inline.flow-right {
		text-align: center;
	}

	.linearize-level-2 .flow-inline.flow-right {
		text-align: left;
	}

	.linearize-level-2.flow-inline > li {
		display: block;
	}

	.list-to-select.select2-style-input.custom-select {
		margin-bottom: 12px;
	}

	[class*=select2-style-button] > [class*=button].linearize,
	[class*=select2-style-button] > span.linearize,
	[class*=dropdown].linearize,
	[class*=dropdown].linearize .button,
	[class*=dropdown].linearize button {
		display: block;
		margin-left: 0;
		margin-right: 0;
		text-align: center;
	}

	[class*=select2-style-button] > button[class*=button].linearize {
		width: 100%;
	}

	.checkbox-radio-group.float .float-col {
		width: 100%;
		margin: 0 0 4px 0;
	}

	.select2-style-dropdown .dropdown {
		display: block;
		margin: 0;
	}

	.dropdown-button {
		width: 100%;
	}

	.list-to-select {
		margin: 12px;
	}

}
