/* =============================================================
DMS Bitte UI Theme
============================================================= */

/* Bitte Field
============================================================= */

.bitte-field {
	position: relative;
	display: inline-block;
	width: 100%;
}

.bitte-field:not(:last-child) {
	margin-bottom: 3rem;
}

.bitte-field.compact:not(:last-child) {
	margin-bottom: 2rem;
}

/* Bitte Label (h-type h3)
============================================================= */

.bitte-field .bitte-label {
	display: inline-block;
	width: 100%;
	margin: 0 0 1rem 0;
}

.bitte-field .bitte-label:empty {
	display: none;
}

.bitte-field .bitte-label .label {
	font-family: "Charis", serif;
	font-style: normal;
	font-weight: 400;
	font-size: 1.75rem;
	line-height: 2.25rem;
	letter-spacing: 0rem;
	color: #626D75;
	text-transform: none;
}

@media screen and (max-width: 63.9375em) {
	.bitte-field .bitte-label .label {
		font-size: 1.625rem;
		line-height: 2.125rem;
	}
}

@media screen and (max-width: 47.9375em) {
	.bitte-field .bitte-label .label {
		font-size: 1.5rem;
		line-height: 2rem;
	}
}

.bitte-field.label-h4 .bitte-label .label {
	font-family: 'Open Sans', sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: 1.375rem;
	line-height: 1.625rem;
	letter-spacing: 0rem;
	color: #6d7983;
	text-transform: none;
}

.bitte-field.label-h5 .bitte-label .label {
	font-family: 'Open Sans', sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: .875rem;
	line-height: 1.375rem;
	letter-spacing: .125rem;
	color: #374960;
	text-transform: uppercase;
}

.bitte-field.white .bitte-label .label {
	color: #374960;
}

.bitte-field.white-label .bitte-label .label {
	color: #ffffff;
}

.bitte-field .bitte-label .required-indicator {
	font-family: "Charis", serif;
	font-style: normal;
	font-weight: 400;
	font-size: 1.75rem;
	line-height: 2.25rem;
	color: #bf5700;
	margin-left: .25rem;
}

.bitte-field .bitte-label .instructions {
	font-family: 'Open Sans';
	font-size: .875rem;
	line-height: 1.125rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .0625rem;
	color: #727272;
	margin-left: .25rem;
}

/* Bitte UI
============================================================= */

.bitte-field .bitte-ui {
	position: relative;
	display: inline-block;
	width: 100%;
}

/* Bitte Message
============================================================= */

.bitte-field .bitte-message {
	position: relative;
	border-radius: 1rem;
	padding: 1rem 1.5rem;
	font-size: 1.125rem;
	line-height: 1.625rem;
	margin-bottom: 1rem;
}

.bitte-field.invalid .bitte-message {
	background-color: #FFF6F6;
	border: .0625rem solid #B70A09;
	color: #B70A09;
}

.bitte-field .bitte-message:empty {
	display: none;
}

/* Button
============================================================= */

.bitte-ui-button .button {
	display: inline-block;
	width: 100%;
	min-width: auto;
	padding: 1.1875rem;
	border-radius: 2.125rem;
	text-align: center;
	font-size: 1.25rem;
	line-height: 1.75rem;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	color: #ffffff;
	background-color: #005f86;
	white-space: nowrap;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	overflow: visible;
}

.bitte-ui-button.compact .button {
	font-size: 1rem;
	line-height: 1.5rem;
	padding: .8125rem 1.625rem;
	width: auto;
}

.bitte-ui-button .button:hover {
	background-color: #00466b;
}

.bitte-ui-button .button:active {
	background-color: #003f5f;
}

/* Input & Textarea
============================================================= */

.bitte-field input,
.bitte-field textarea {
	width: 100%;
	max-width: 100%;
	background-color: #E8EAEC;
	padding: 1rem 1.5rem;
	color: #000000;
	font-size: 1.125rem;
	line-height: 2.125rem;
}

.bitte-field input {
	height: 4.125rem;
}

.bitte-field ::-webkit-input-placeholder {color: #696969; opacity: 1;}
.bitte-field :-moz-placeholder {color: #696969; opacity: 1;}
.bitte-field ::-moz-placeholder {color: #696969; opacity: 1;}
.bitte-field :-ms-input-placeholder {color: #696969; opacity: 1;}

.bitte-field.white input {
	background-color: #ffffff;
}

.bitte-field.white ::-webkit-input-placeholder {color: #767676; opacity: 1;}
.bitte-field.white :-moz-placeholder {color: #767676; opacity: 1;}
.bitte-field.white ::-moz-placeholder {color: #767676; opacity: 1;}
.bitte-field.white :-ms-input-placeholder {color: #767676; opacity: 1;}

.bitte-ui-input.compact input {
	height: 3.125rem;
	line-height: 1.5rem;
	font-size: 1rem;
	padding: .8125rem 1rem;
}

/* Radio
============================================================= */

.bitte-field.bitte-ui-radio {
	margin-bottom: 1rem;	
}

.bitte-field .radiogroup {
	margin-bottom: 2rem;
}

.bitte-field .radiogroup .radio-container {
	display: block;
	margin-bottom: 1rem;
}

.bitte-field .radiogroup .radio {
	font-size: .875rem;
	line-height: 1.125rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .0625rem;
	color: #727272;
	cursor: default;
	overflow: visible;
}

.bitte-field .radiogroup .radio:focus {
	box-shadow: none; 
}

.bitte-field .radiogroup .radio:before {
	content: '';
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	border: .0625rem solid #696969;
	display: inline-block;
	vertical-align: middle;
	overflow: visible;
	margin: .1875rem;
	margin-right: 1rem;
}

.bitte-field .radiogroup .radio.focus:before {
	box-shadow: 0 0 0 .1875rem rgba(131,192,253,.75);
}

.bitte-field .radiogroup .radio.checked:before {
	background-color: #616C7B;
	border: .0625rem solid #696969;
	box-shadow: 0 0 0 0.375rem #ffffff inset;
}

.bitte-field .radiogroup .radio.focus.checked:before {
	background-color: #616C7B;
	border: .0625rem solid #696969;
	box-shadow: 0 0 0 .1875rem rgba(131,192,253,.75),
				0 0 0 0.375rem #ffffff inset;
}

/* Inline-Check
----------------------------- */

.bitte-field.inline-check .radiogroup {
	margin-bottom: 1rem;
}

.bitte-field.inline-check .radiogroup .radio-container {
	display: inline-block;
	margin: 0;
}

.bitte-field.inline-check .radiogroup .radio-container {
	margin-right: 3rem;
	margin-bottom: 1rem;
}

.bitte-field.inline-check.compact .radiogroup .radio-container {
	margin-right: 1.5rem;
	margin-bottom: 1rem;
}


.bitte-field.inline-check .radiogroup .radio.checked:before {
	background-color: #ffffff;
	border: .0625rem solid #696969;
	box-shadow: none;
	/* Base64-Encoded 'checkmark' icon, colored green */
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAVhJREFUeNrsmN0JwjAURqMTOEJH0B0cQF990ol0g/rkqw4g6AiO4AiO4A1EKNLWtEnzU8+BEASRnM80N7dKAQAAAAAAAAAA/BWTnBa7PKlCppWMmYynjMt1o15/EYDIb2XaG/kPOoS1hPDo+7vTjOTLL3lNYUIZ7w6oyLex6LsLpiOQVzU7I/8AOshrxnUGdJQ/uFSCSebyR5HfRT0EZcH6+dtWnkO9qGcO8s4ByILnMt1qDqGdLO6YuryPM+DccAKXRihpeacAzL9ftHzFKoSY8q47wKb2toYQW941ANvaWxtCCvJOAZjae+gTQiryvspgacqgDR+RJOS9XYQ6hqBSkfd6E/QcQhB571dhTyEEkx+kF3AMIaj8YM1QzxCCyw/aDXYMIYr84O2wZQjR5IO8D/gRQlT5YC9EGkKILh8sgEr3uDIf7yJ/VwAAAAAAAAAAABCatwADALfeffnAMh7XAAAAAElFTkSuQmCC');
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.bitte-field.inline-check .radiogroup .radio.focus.checked:before {
	background-color: #ffffff;
	border: .0625rem solid #696969;
	box-shadow: 0 0 0 .1875rem rgba(131,192,253,.75);
}

/* Dropdown
============================================================= */

.bitte-ui-dropdown .dropdown-button {
	font-size: 1.125rem;
	line-height: 2.125rem;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-color: #E8EAEC;
	color: #696969;
	padding: 1rem 4.125rem 1rem 1.5rem;
	width: 100%;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	cursor: default;
}

.bitte-ui-dropdown.compact .dropdown-button {
	font-size: 1rem;
	line-height: 1.5rem;
	padding: .8125rem 3.125rem .8125rem 1rem;
}

.bitte-ui-dropdown.white .dropdown-button {
	background-color: #ffffff;
}

.bitte-ui-dropdown .dropdown-button:after {
	content: '';
	position: absolute;
	top: 1.3125rem;
	right: 1.3125rem;
	width: 1.5rem;
	height: 1.5rem;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAASpJREFUeNrslL0NwjAQhR0mgA0YgRFgA0YgPU1qCipqhERvNmCEMAIbMEIyAmfJaVBIzvE7IaH3Saf82LHfZ1txjhBCCCGEkF9RaDuW+8NSLjupVurmr6cWGUTG38rlKDWXekhVmjlmCYO/4gTncC/vVsDwYWHuUmHMbqHumm9nyjn8x3NYpRohEcP7nqY15AjJBCFs86U5bPFGtvoJDt+xGDtGhXKiJq46TEIRvpUxF6gjVA20JR+n2NePdLug/0KjK6bZiRi+HthRF/9yJVQAIYEOnyyQI2ERfpLAFAmr8JMFUiTivUn4LIEECWcVPltAKeGswkMEMiSyw8MEJkhAwkMFEiRg4eECCgloeBOBAQl4eDOBHgmT8OYECSnvCCGEEEII+UveAgwALXqWBd9TWUsAAAAASUVORK5CYII=');
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.bitte-ui-dropdown.compact .dropdown-button:after {
	top: 1rem;
	right: 1rem;
	width: 1.125rem;
	height: 1.125rem;
}

.bitte-ui-dropdown .dropdown-button.has-value {
	color: #000000;
}

.bitte-ui-dropdown .dropdown-menu {
	position: absolute;
	width: 100%;
	z-index: 1;
	background-color: #616d7a;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	padding: .5rem 0;
	max-height: 22rem;
	overflow: auto;
	display: none;
}

.bitte-ui-dropdown .dropdown-menu.is-active {
	display: block;
}

.bitte-ui-dropdown .dropdown-menu .dropdown-label {
	background-color: #ffffff;
	color: #777777;
	padding: .25rem 1.5rem;
}

.bitte-ui-dropdown .dropdown-menu .dropdown-item {
	width: 100%;
	text-align: left;
	font-size: 1.125rem;
	line-height: 2.125rem;
	color: #ffffff;
	padding: .25rem 2.5rem;
	cursor: default;
}

.bitte-ui-dropdown.compact .dropdown-menu .dropdown-item {
	font-size: 1rem;
	line-height: 1.5rem;
	padding: .25rem 2.25rem;
}

.bitte-ui-dropdown .dropdown-menu .dropdown-item:hover {
	background-color: #444e58;
}

.bitte-ui-dropdown .dropdown-menu .dropdown-item:focus {
	background-color: #252E38;
	box-shadow: none;
}

.bitte-ui-dropdown .dropdown-menu .dropdown-item.checked:before {
	content: '\2713';
	display: inline-block;
	width: 1rem;
	margin-left: -1.5rem;
	margin-right: .5rem;
}

/* Combobox
============================================================= */

.bitte-ui-combobox .listbox {
	position: absolute;
	width: 100%;
	z-index: 1;
	background-color: #616d7a;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	padding: .5rem 0;
	max-height: 22rem;
	overflow: auto;
	display: none;
}

.bitte-ui-combobox .listbox.is-active {
	display: block;
}

.bitte-ui-combobox .listbox .option {
	width: 100%;
	text-align: left;
	font-size: 1.125rem;
	line-height: 2.125rem;
	color: #ffffff;
	padding: .25rem 2.5rem;
	cursor: default;
	display: none;
}

.bitte-ui-combobox .listbox .option:hover {
	background-color: #444e58;
}

.bitte-ui-combobox .listbox .option:focus {
	background-color: #252E38;
	box-shadow: none;
}

.bitte-ui-combobox .listbox .option.match {
	display: block;
}

/* Uberselect
============================================================= */

.bitte-ui-uberselect .uberselect {
	position: relative;
}

.bitte-ui-uberselect .uberselect-button {
	background-color: #E8EAEC;
	padding: .75rem 4.125rem .75rem .75rem;
	width: 100%;
	text-align: left;
	cursor: default;
	min-height: 4.125rem;
}

.bitte-ui-uberselect.compact .uberselect-button {
	padding: .25rem 3.125rem .25rem .25rem;
	min-height: 3.125rem;
}

.bitte-ui-uberselect .button-wrapper {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	background-color: #E8EAEC;
	padding: .75rem 4.125rem .75rem .75rem;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	font-size: 1.125rem;
	line-height: 2.125rem;
}

.bitte-ui-uberselect.compact .button-wrapper {
	font-size: 1rem;
	line-height: 2rem;
	padding: .25rem 3.125rem .25rem .25rem;
}

.bitte-ui-uberselect.white .button-wrapper {
	background-color: #ffffff;
}

.bitte-ui-uberselect .button-wrapper:after {
	content: '';
	position: absolute;
	top: 1.3125rem;
	right: 1.3125rem;
	width: 1.5rem;
	height: 1.5rem;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAASpJREFUeNrslL0NwjAQhR0mgA0YgRFgA0YgPU1qCipqhERvNmCEMAIbMEIyAmfJaVBIzvE7IaH3Saf82LHfZ1txjhBCCCGEkF9RaDuW+8NSLjupVurmr6cWGUTG38rlKDWXekhVmjlmCYO/4gTncC/vVsDwYWHuUmHMbqHumm9nyjn8x3NYpRohEcP7nqY15AjJBCFs86U5bPFGtvoJDt+xGDtGhXKiJq46TEIRvpUxF6gjVA20JR+n2NePdLug/0KjK6bZiRi+HthRF/9yJVQAIYEOnyyQI2ERfpLAFAmr8JMFUiTivUn4LIEECWcVPltAKeGswkMEMiSyw8MEJkhAwkMFEiRg4eECCgloeBOBAQl4eDOBHgmT8OYECSnvCCGEEEII+UveAgwALXqWBd9TWUsAAAAASUVORK5CYII=');
	background-size: 100% 100%;
	background-position: center center;
	background-repeat: no-repeat;
}

.bitte-ui-uberselect.compact .button-wrapper:after {
	top: 1rem;
	right: 1rem;
	width: 1.125rem;
	height: 1.125rem;
}

.bitte-ui-uberselect .button-wrapper .placeholder {
	display: inline-block;
	margin: .25rem;
	padding: .3125rem .5rem;
	line-height: 1.5rem;
	color: #696969;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: default;
}

.bitte-ui-uberselect.compact .button-wrapper .placeholder {
	padding: .3125rem .5rem;
}

.bitte-ui-uberselect .button-wrapper .selection-tag {
	position: relative;
	display: inline-block;
	color: #ffffff;
	background-color: #444e58;
	padding: .3125rem 2rem .3125rem .75rem;
	margin: .25rem;
	border-radius: .5rem;
	line-height: 1.5rem;
	text-align: left;
}

.bitte-ui-uberselect.compact .button-wrapper .selection-tag {
	padding: .3125rem 1.5rem .3125rem .75rem;
}

.bitte-ui-uberselect .button-wrapper .selection-tag:after {
	position: absolute;
	content: '\00d7';
	top: 0;
	right: 0;
	width: 2rem;
	height: 100%;
	font-size: 1.5rem;
	line-height: 2rem;
	text-align: center;
}

.bitte-ui-uberselect.compact .button-wrapper .selection-tag:after {
	font-size: 1.125rem;
	width: 1.5rem;
}

.bitte-ui-uberselect .dropdown-container {
	position: absolute;
	width: 100%;
	z-index: 1;
	background-color: #616d7a;
	display: none;
}

.bitte-ui-uberselect .dropdown-container .input-container {
	position: relative;
	padding: 1rem 1rem .5rem 1rem;
}

.bitte-ui-uberselect.compact .dropdown-container .input-container {
	padding: .75rem .75rem .375rem .75rem;
}

.bitte-ui-uberselect .dropdown-container .input-container:after {
	content: '';
	position: absolute;
	top: 2.3125rem;
	right: 2.3125rem;
	width: 1.5rem;
	height: 1.5rem;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAkhJREFUeNrsmN1twjAQgAMTMEIyAWxQ2CBMAAxQUV77UnjpK0gdIGxANiBMQJigjJBu0LN0D2lqXy72hbhqTrIiNSW+73x/viDopZf/LQPbH66eX0N4TGGNYU0qr++wbrCy5OM99woAFF/CY4HKc0TB7ADk2CkAKK6svG+guA5kAyDpwwHQ6kr5kcCeB4DYPAwAlU+ET/4IEKvWAZjKF7ByXF+loA4fATGo8fkz4TY5BmdK/H4Na0nZyDW4KYAzEbAqGA/M+FHfOBkMoU4vgm8VtgBDwnWmhNUO3A3gfzN4zFDZqiioF5cTGBr+viAs3/jIsZjNDK/XYLCRGECpwv7y+SaWN0DsDKcQS56AyXV2EjXA4EpPkgC6jxUSFRSDNdO8mkgChIaUKSWXtgG4m9qKaHc6DP64cAHGgnuGbQPcJX2UaYy7JMBNZzXsbSQklowLHUBmqpiummOLEkomiaGhYuqOdImNma3yquK+GV6n0kFsqronh77lZLC+uhdYxwDVTn8aNlSbzbnTBgROiH4ncgGg0uiGSINXUGxbdxro81dCeSfrc66U+5p+vUD/vZUyyQj7qZiZ851uZZxLfVJzLZQQawjuWMVbCFYrgdODuaGXbzROobbBmGmnmcP7QIQptrBQPEJDrCQhrIa7mH1iDNZJoB/u5lhh02qmYcyb2O40CDoSKYjOAKQgOgWQgOgcwBXCCwAXCG8AmBDz6njHq0s9WpiqE2vvpxIMCP/HKgTExesY0MREXHKbC4Btg1566eWHfAswAJHj66WMV5k4AAAAAElFTkSuQmCC');
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.bitte-ui-uberselect.compact .dropdown-container .input-container:after {
	width: 1.125rem;
	height: 1.125rem;
	top: 1.8125rem;
	right: 1.8125rem;
}

.bitte-ui-uberselect .dropdown-container .input-container .input {
	padding-right: 4.125rem;
}

.bitte-ui-uberselect.compact .dropdown-container .input-container .input {
	height: 3.125rem;
	font-size: 1rem;
	line-height: 2rem;
	padding: .75rem 1rem;
	padding-right: 3.125rem;
}

.bitte-ui-uberselect .listbox {
	background-color: #616d7a;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	padding: .5rem 0;
	max-height: 22rem;
	overflow: auto;
}

.bitte-ui-uberselect.compact .listbox {
	padding: .25rem 0;
	max-height: 15.5rem;
}

.bitte-ui-uberselect .listbox.is-active {
	display: block;
}

.bitte-ui-uberselect .listbox .option {
	width: 100%;
	text-align: left;
	font-size: 1.125rem;
	line-height: 2.125rem;
	color: #ffffff;
	padding: .25rem 2.5rem;
	cursor: default;
	display: none;
}

.bitte-ui-uberselect.compact .listbox .option {
	font-size: 1rem;
	line-height: 1.5rem;
	padding: .25rem 2.25rem;
}

.bitte-ui-uberselect .listbox .option:hover {
	background-color: #444e58;
}

.bitte-ui-uberselect .listbox .option:focus {
	background-color: #252E38;
	box-shadow: none;
}

.bitte-ui-uberselect .listbox .option.match {
	display: block;
}

.bitte-ui-uberselect .listbox .option.checked:before {
	content: '\2713';
	display: inline-block;
	width: 1rem;
	margin-left: -1.5rem;
	margin-right: .5rem;
}

.bitte-ui-uberselect.compact .listbox .option.checked:before {
	margin-left: -1.375rem;
	margin-right: .375rem;
}

.bitte-ui-uberselect .listbox .no-results {
	width: 100%;
	text-align: left;
	font-size: 1.125rem;
	line-height: 2.125rem;
	color: #ffffff;
	padding: .25rem 2.5rem;
	cursor: default;
	font-style: italic;
	display: none;
}

.bitte-ui-uberselect.compact .listbox .no-results {
	font-size: 1rem;
	line-height: 1.5rem;
	padding: .25rem 2.25rem;
}
