:root {
	--backgroundColor: #f5f5f5;
	--cardColor: #fff;
	--cardBorderRadius: 1.563em;
	--cardBoxShadow: rgb(173 173 173) 0 0 0.125em, rgba(50, 50, 93, 0.25) 0 3.125em 6.25em -1.25em, rgba(0, 0, 0, 0.3) 0 1.875em 3.75em -1.875em;
	--separatorColor: #d4d4d4;
	--labelTextColor: #454545;
	--lightLabelTextColor: #656565;
	--inputBorderColor: #9e9e9e;
	--inputBackgroundColor: #eee;
	--focusShadowColor: #CA6F75;
	--buttonColor: #BC4C56;
	--buttonColorOver: #CA6F75;
	--buttonTextColor: #fff;
	--smallGap: 0.375em;
	--dropdownItemBackgroundColor: #fff;
	--dropdownItemBackgroundColorOver: #FF6877;
	--dropdownItemBackgroundColorDown: #E05C68;
	--footerTextColor: #d4d4d4;
	--errorBackgroundColor: #f8d7da;
	--errorBorderColor: #f5c2c7;
	--errorTextColor: #a30000;
	--successBackgroundColor: #d1e7dd;
	--successBorderColor: #badbcc;
	--successTextColor: #0f5132;
	--smallFontSize: 0.938em;
}

html, body, a, label, input, h1, h2, h3, h4, hr, ul, li {
	font-weight: 500;
	line-height: 130%;
	padding: 0;
	margin: 0;
}

html, body {
	background-color: var(--cardColor);
}

body {
	overscroll-behavior: contain;
	font-family: 'Open Sans', sans-serif;
	color: var(--labelTextColor);
}

hr {
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: var(--separatorColor);
}

b {
	font-weight: 700;
}

.k-dp-flex {
	display: flex;
}

.k-flex-1 {
	flex: 1 1 auto;
}

.k-flex-0 {
	flex: 0 0 auto;
}

.k-fd-column {
	flex-direction: column;
}

.k-ai-stretch {
	align-items: stretch;
}

.k-ai-center {
	align-items: center;
}

.k-jc-center {
	justify-content: center;
}

.k-jc-end {
	justify-content: flex-end;
}

.k-jc-space-around {
	justify-content: space-around;
}

.k-jc-space-between {
	justify-content: space-between;
}

.k-fw-wrap {
	flex-wrap: wrap;
}

.k-gap-default {
	gap: var(--smallFontSize);
}

.k-gap-small {
	gap: var(--smallGap);
}

.k-login-view-wrapper {
	background-color: var(--backgroundColor);
	overflow: auto;
}

.k-login-view {
    min-height: 100vh;
	min-height: 100dvh;
	z-index: 1;
}

.k-login-card {
	flex: 1 1 37vw;
	min-width: 23.5em;
	background-color: var(--cardColor);
	gap: var(--cardBorderRadius);
	z-index: 2;
}

.k-login-card[aria-busy="true"] * {
	cursor: progress;
}

.k-login-card-header {
	flex: 0 0 3.125em;
	gap: 1vw;
}

.k-login-logo {
	background-repeat: no-repeat;
	background-position: center left;
	background-size: contain;
}

.k-header-wrapper {
	font-size: 1.5em;
	text-align: center;
}

.k-form-content {
	width: 19em;
	gap: var(--smallFontSize);
}

.k-login-card[aria-busy="true"] .k-form-content {
    display: none;
}

.k-form-content h1 {
	font-size: 1.875em;
}

.k-form-content h2 {
	font-size: 1.5em;
}

.k-form-content h4 {
	font-size: var(--smallFontSize);
}

.k-form-group {
	gap: 0.313em;
}

@media screen and (min-width: 480px) {
		html, body {
			background-color: var(--backgroundColor);
		}

    .k-login-view-wrapper {
        padding: 8vh 8vw;
    }

    .k-login-view {
        height: auto;
        min-height: 84vh;
        border-radius: var(--cardBorderRadius);
        box-shadow: var(--cardBoxShadow);
    }

    .k-login-card {
        padding: 4vh 4vw;
        border-radius: var(--cardBorderRadius);
    }
}

@media screen and (min-width: 768px) {
	.k-login-view {
		background-image: url('../image/login-bg-almondtree.jpg');
    	background-color: #E8EAE7;
		background-size: cover;
		background-attachment: fixed;
		background-repeat: no-repeat;
		background-position: center;
	}

	.k-login-image{
        flex: 1 1 47vw;
	}

	.k-login-card {
	    border-radius: 0 var(--cardBorderRadius) var(--cardBorderRadius) 0;
	}
}

/* Footer */

.k-login-footer-row {
	padding: var(--smallGap) 0;
	flex-wrap: wrap;
}

.k-login-footer-label {
	font-size: 0.75em;
	color: var(--footerTextColor);
}

.k-login-footer-separator {
	font-size: 1em;
	color: var(--footerTextColor);
	margin: 0 0.5em;
}

.k-login-footer-link {
	font-size: 0.75em;
	color: var(--footerTextColor);
	text-decoration: none;
}

.k-login-footer-link:hover {
	color: var(--footerTextColor);
	text-decoration: underline;
}

.k-login-footer-link:hover:active {
	color: var(--footerTextColor);
	text-decoration: underline;
}

.k-login-footer-link:focus {
	text-decoration: underline;
}

/* Locale Dropdown */

.k-locale-dropdown-wrapper {
	min-width: 8em;
}

.k-locale-dropdown {
	height: 2.1em;
}

.k-locale-dropdown > .k-locale-item {
	height: 100%;
	color: var(--footerTextColor);
	border: thin solid transparent;
	border-radius: 50vh;
	padding: 0 0.625em;
}

.k-locale-dropdown > .k-locale-item > .k-locale-item-flag {
	opacity: 0;
}

.k-login-card[aria-busy="false"] .k-locale-dropdown:hover > .k-locale-item > .k-locale-item-flag,
.k-main-header .k-locale-dropdown:hover > .k-locale-item > .k-locale-item-flag {
	opacity: 1;
	transition: opacity 0.3s ease 0s;
}

.k-login-card[aria-busy="false"] .k-locale-dropdown .k-locale-item:hover,
.k-main-header .k-locale-dropdown .k-locale-item:hover {
    color: var(--labelTextColor);
}

.k-locale-dropdown i {
	font-size: 1.25em;
}

.k-locale-list-wrapper {
	display: none;
	padding-top: 0.5em;
}

.k-locale-list {
	margin: 0;
	padding: 0;
	position: relative;
	overflow: hidden;
	list-style-type: none;
	background-color: var(--dropdownItemBackgroundColor);
	border-radius: 0.625em;
	box-shadow: rgb(173 173 173) 0 0 0.125em, rgb(0 0 0 / 15%) 0 0.25em 0.625em;
	z-index: 10;
}

.k-login-card[aria-busy="false"] .k-locale-dropdown:hover > .k-locale-item,
.k-main-header .k-locale-dropdown:hover > .k-locale-item {
	border-color: var(--labelTextColor);
	color: var(--labelTextColor);
	transition: border-color 0.3s ease 0s;
}

.k-login-card[aria-busy="false"] .k-locale-dropdown:hover .k-locale-list-wrapper,
.k-main-header .k-locale-dropdown:hover .k-locale-list-wrapper {
	display: block;
}

.k-locale-list-item {
	background-color: var(--dropdownItemBackgroundColor);
	transition: background-color 0.3s ease 0s;
}

.k-locale-list-item:hover {
	background-color: var(--dropdownItemBackgroundColorOver);
}

.k-locale-list-item:hover:active {
	background-color: var(--dropdownItemBackgroundColorDown);
}

.k-locale-item {
	gap: 0.35em;
	color: var(--labelTextColor);
	padding: 0.625em;
	text-decoration: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-webkit-user-select: none;
}

.k-locale-item-flag {
	width: 1.5em;
	height: 1.125em;
}

.k-locale-item-label {
	font-size: var(--smallFontSize);
	line-height: 1;
}

/* Inputs */

.k-input {
	height: 2.5em;
	background-color: var(--inputBackgroundColor);
	border-width: thin;
	border-style: solid;
	border-color: var(--inputBorderColor);
	border-radius: 0.25em;
	color: var(--labelTextColor);
	font-size: 1em;
	padding: 0.25em 0.5em;
	transition: background-color 0.3s ease 0s, border-color 0.3s ease 0s, box-shadow 0.3s ease 0s;
}

.k-input[aria-invalid="true"] {
	background-color: var(--errorBackgroundColor);
}

.k-input:focus {
	box-shadow: 0 0 0.25em var(--focusShadowColor);
	outline: none;
	border-color: var(--buttonColor);
}

.k-password-input {
	padding-right: 2.1rem;
}

.k-password-hint {
	margin-left: -2.1rem;
	width: 2.1rem;
	text-align: center;
	font-size: 1.2em;
	cursor: pointer;
}

/* Checkbox Label */

.k-checkbox-label {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0.313em;
	font-size: var(--smallFontSize);
	cursor: pointer;
}

/* Checkbox / Radio */

.k-input[type="checkbox"], .k-input[type="radio"] {
	width: 1.1em;
	height: 1.1em;
	padding: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.k-input[type="checkbox"]:checked, .k-input[type="radio"] {
	background-color: var(--buttonColor);
	border-color: var(--buttonColor);
}

.k-input[type="radio"] {
	border-radius: 100%;
}

.k-input[type="checkbox"]:checked {
	background-image: url('../image/korona-checkbox-checkmark.svg');
}

.k-input[type="radio"]:checked {
	background-image: url('../image/korona-radio-dot.svg');
}

.k-centered-text {
	text-align: center;
}

/* Select */

.k-select {
	height: 2.5em;
	display: flex;
	align-items: center;
	background-color: var(--inputBackgroundColor);
	background-image: url('../image/korona-select-angle-down.svg');
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 16px 12px;	border-width: thin;
	border-style: solid;
	border-color: var(--inputBorderColor);
	border-radius: 0.25em;
	color: var(--labelTextColor);
	font-size: 1em;
	padding: 0.25em 0.5em;
	transition: background-color 0.3s ease 0s, border-color 0.3s ease 0s, box-shadow 0.3s ease 0s;
}

.k-select:focus {
	box-shadow: 0 0 0.25em var(--focusShadowColor);
	outline: none;
	border-color: var(--buttonColor);
}

/* Buttons */

.k-button-base {
	min-height: 1.875em;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	padding: var(--smallGap) var(--smallFontSize);
	gap: var(--smallGap);
	font-size: 1em;
	line-height: 1;
	border-radius: 50vh;
	border-width: thin;
	border-style: solid;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	transition: background-color 0.3s ease 0s, border-color 0.3s ease 0s, color 0.3s ease 0s;
}

.k-button-base:focus {
	box-shadow: 0 0 0.25em var(--focusShadowColor);
	outline: none;
	border-color: var(--buttonColor);
}

.k-button-base:disabled {
    opacity: 0.5;
}

.k-button-default {
	background-color: transparent;
	border-color: var(--buttonColor);
	color: var(--buttonColor);
}

.k-button-default:hover {
	border-color: var(--buttonColorOver);
	color: var(--buttonColorOver);
}

.k-button-default:hover:active {
	background-color: var(--buttonColor);
	border-color: var(--buttonColor);
	color: var(--buttonTextColor);
}

.k-button-base i {
	font-size: 1.425em;
}

.k-button-primary {
	background-color: var(--buttonColor);
	border-color: var(--buttonColor);
	color: var(--buttonTextColor);
}

.k-button-primary:hover {
	background-color: var(--buttonColorOver);
	border-color: var(--buttonColorOver);
	color: var(--buttonTextColor);
}

.k-button-primary:hover:active {
	background-color: transparent;
	border-color: var(--buttonColor);
	color: var(--buttonColor);
}

.k-button-large {
	min-height: 2.7em;
}

.k-button-default svg {
    fill: var(--buttonColor);
	transition: fill 0.3s ease 0s;
}

.k-button-default:hover svg {
	fill: var(--buttonColorOver);
}

.k-button-default:hover:active svg {
	fill: var(--buttonTextColor);
}

.k-button-primary svg {
    fill: var(--buttonTextColor);
	transition: fill 0.3s ease 0s;
}

.k-button-primary:hover svg {
	fill: var(--buttonTextColor);
}

.k-button-primary:hover:active svg {
	fill: var(--buttonColor);
}

/* button links */

.k-link-button {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 0.25em;
	text-decoration: none;
}

.k-link-button i {
	font-size: 0.85em;
	color: var(--labelTextColor);
}

.k-link-button label {
	font-size: 0.75em;
	color: var(--labelTextColor);
}

.k-link-button:hover label {
	text-decoration: underline;
}

/* Nav Links */

.k-nav-link {
	font-size: var(--smallFontSize);
}

.k-nav-link a {
	color: var(--labelTextColor);
	cursor: pointer;
	display: inline-block;
	text-decoration: underline;
}

.k-nav-link a:hover, .k-nav-link a:focus {
	color: var(--lightLabelTextColor);
	text-decoration: underline;
}

.k-nav-link a:hover:active {
	color: var(--buttonColor);
	text-decoration: underline;
}

/* Label */

.k-label {
	font-size: var(--smallFontSize);
	white-space: normal;
}

/* Messages */

.k-message {
	padding: 0.5em;
	border-width: 1px;
	border-style: solid;
	border-radius: 0.25em;
	text-align: center;
}

.k-error-message {
	background-color: var(--errorBackgroundColor);
	border-color: var(--errorBorderColor);
	color: var(--errorTextColor);
}

.k-success-message {
	background-color: var(--successBackgroundColor);
	border-color: var(--successBorderColor);
	color: var(--successTextColor);
}

/* Loading Indicator */

.k-loader {
	font-size: 6em;
}

.k-login-card[aria-busy="false"] .k-loader {
	display: none;
}

/* Form */

.subtitle {
	color: var(--lightLabelTextColor);
}

.required {
	color: var(--buttonColor);
}

/* OL, UL */
.k-decimal-list, .k-disc-list {
	padding-left: 1em;
  margin-bottom: var(--smallFontSize);
}

.k-decimal-list {
	list-style-type: decimal;
}

.k-disc-list {
	list-style-type: disc;
}

.k-decimal-list ::marker, .k-disc-list ::marker {
	content: unset;
}

.k-decimal-list p, .k-disc-list p {
	margin-bottom: var(--smallFontSize);
}