/* global settings */
* { font-family: "EFSans","Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif; font-weight: inherit; font-size: inherit; color: inherit; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smooth: always; }
html, body { font-weight: normal; font-size: 19px; font-weight: normal; color: black; height: 100%; min-height: 100%; margin: 0; padding: 0; line-height: 1.5; background-color: white; }
select::-ms-expand { display: none; }
*[ng-cloak] { display: none; }

/* remove focus and active states (chrome, firefox) */
*:active, *:focus, a:active, a:focus, button:active, button:focus { outline: none; text-decoration: none; }

:root
{
	--component-label-pos:							column;
	--component-font:								"EFSans","Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
	--component-font-size:							20px;
	--component-label-align: 						start;
	--component-item-align: 						start;
	--component-label-margin:						0 0 5px 15px;
	--component-label-font-weight: 					600;
	--component-label-font-size:					15px;
	--component-label-color:						#003899;
	--component-margin:								0 0 20px 0;

	--component-text-color: 						#003899;
	--component-background-color:					#E5E4E4;
	--component-placeholder-color:					#9e9e9e;
	--component-border-size:						2px;
	--component-border-color:						#003899;
	--component-numberplate-border-color:			#003899;
	--component-focus-text-color: 					#003899;
	--component-focus-background-color:				#E5E4E4;
	--component-focus-placeholder-color:			#9e9e9e;
	--component-invalid-text-color: 				#003899;
	--component-invalid-background-color:			#E5E4E4;
	--component-invalid-placeholder-color:			#9e9e9e;

	--component-button-padding:						10px 40px 13px 40px;
	--component-button-text-color: 					white;
	--component-button-background-color:			#003899;
	--component-button-border-radius:				20px;
	--component-button-border-size:					0;
	--component-button-disabled-text-color: 		#9C9D9C;
	--component-button-disabled-background-color:	#E2E1E3;
	--component-button-disabled-border-size:		0;

	--component-button-hover-background-color:		#4c74b8;
	--component-button-hover-border-size:			0;
}

input-field.input-field div input, select-field.select-field div input { border-left-width: 0!important; border-right-width: 0!important;
			border-top-width: 0!important; }
select-field.select-field div .select-field-caret { border-left-width: 0!important; border-right-width: 0!important;
			border-top-width: 0!important; }
.number-plate-field input-field.number-plate-field-input div input { border-left-width: 2px!important; border-right-width: 2px!important;
			border-top-width: 2px!important; }

.checkbox-labeltext { font-weight: bold!important; font-size: 20px!important; display: block; padding-top: 0px!important; padding-bottom: 10px!important; }
.checkbox-infotext { font-size: 17px!important; color: black!important; display: block; padding-top: 0px!important; padding-bottom: 20px!important; }

.checkbox-field input:not(:checked) + label::before, .checkbox-field input:checked + label::before {
	top: 5px; transform: none; }
.checkbox-field input:not(:checked) + label::after, .checkbox-field input:checked + label::after { top: 10px; transform: none; }


a { color: #003899; text-decoration: underline; }
a:hover, a:visited, a:active, a:focus { color: #c3dc81; text-decoration: underline; cursor: pointer; }
figure a { text-decoration: none; color: inherit; }
figure a:hover { text-decoration: none; color: inherit; }
figure img, figure video { max-width: 100%; width: 100%; }
em { font-weight: 600; font-style: normal; }
strong { font-weight: bold; font-style: normal; }
h1, h2, h3, h4, h5, h6 { padding: 0; margin: 0; font-weight: normal; line-height: 1.4; }
h1 { font-size: 42px; color: #003899; margin-bottom: 1em; font-weight: normal; }
h2 { font-size: 36px; color: #003899; margin-bottom: 0.7em; font-weight: normal; }
h3 { font-size: 40px; color: #003899; margin-bottom: 0.7em; font-weight: 800; font-family: "Candela"; }
h4 { font-size: 19px; color: #294a7d; margin-bottom: 0.7em; font-weight: bold; }
hr { height: 2px; background-color: #dbdbdb; border: none; margin-top: 30px;  margin-bottom: 30px; }

.link-button { background-color: #294a7d; font-size: 18px; font-weight: bold; color: white; padding: 10px 20px 8px 20px; border-radius: 4px; text-decoration: none; }
.link-button:hover, .link-button:active, .link-button:visited, .link-button:focus { text-decoration: none; color: white; }

.link-button-bright { background-color: #c3dc81; }

.wizard-body ul { margin-left: 25px; margin-bottom: 20px; }
.wizard-body li { margin-bottom: 10px; }

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* generic layout */
.content { max-width: 100vw; min-height: 100vh; position: relative; background-color: white; overflow-x: hidden; }
.page-container { }
.page-inner { min-height: 100vh; }
.page { max-width: 100vw; margin: 0 auto 0 auto; font-size: 19px; padding-top: 0; }
.mainpage {}
.subpage {}
article { margin-bottom: 150px; }
article > h1, article > h2 { margin-left: auto; margin-right: auto; padding: 0 calc((100vw - 1600px) / 2) 0 calc((100vw - 1600px) / 2); }

article > .grid-row, article > .grid-row-wide { margin: 0 -50px 0 -50px; padding: 0 calc((100vw - 1600px) / 2) 0 calc((100vw - 1600px) / 2); }
article .grid-row > .grid-col-1, article .grid-row > .grid-col-2, article .grid-row > .grid-col-3, article .grid-row > .grid-col-4, article .grid-row > .grid-col-5, article .grid-row > .grid-col-6, article .grid-row > .grid-col-7, article .grid-row > .grid-col-8, article .grid-row > .grid-col-9, article .grid-row > .grid-col-10, article .grid-row > .grid-col-11, article .grid-row > .grid-col-12
	{ padding-left: 50px; padding-right: 50px; float: left; min-height: 1px; }

.section-colspan-2-cols-3 { width: calc(200% - -100px); }

section { max-width: 1600px; margin-left: auto; margin-right: auto; }
.paragraph { margin-bottom: 3em; }
.paragraph-content {}
.paragraph p { margin-bottom: 25px; }
.paragraph em { font-style: normal; font-weight: bold; }
.paragraph-content ul { list-style: disc; padding: 0; margin: 0; list-style-position: inside; }
/*.paragraph-content ul li { background: url(../img/bulletpoint.svg) no-repeat 3px 9px; padding-left: 20px; }*/
.paragraph-content ul li { padding-left: 0px; margin-bottom: 0px; }
︎
/* page/section/paragraph images */
.img-variant-desktop {}
.img-variant-phone { display: none!important; }

.page-img-list {}
.section-img-list { max-width: 100%; }
.section-img-list img { max-width: 100%; }
.paragraph-img-list { margin-top: 2em; margin-bottom: 4em; }
.img-list {}
.img-title { display: block; }
.img-subtitle { display: block; }
.img-description {}
.img-list-single {}

article > .row-dark { background-color: #ededed; padding-top: 65px; margin-bottom: 100px; }
article > .row-big-margin { margin-bottom: 200px; }

.row-dark a { color: #294a7d; }
a:hover, a:visited, a:active, a:focus { color: #294a7d; }


/* download files */
.file-list img { display: none; }
.file-list { margin-top: 1em; }
.file-list > a { text-decoration: none; font-weight: bold; color: #004486; display: block; margin-bottom: 0.5em; }
.file-list > a:hover { text-decoration: none; }
.file-list .file-title:before { content: "\f15c"; font-family: "Font Awesome 5 Pro"; color: #f19000; padding-right: 0.6em; font-size: 24px; display: inline-block; }
.download-file .file-title:before { content: "\f019"; }

/* image viewer */
.image-viewer { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; background-color: rgba(0,0,0,0.7); display: none; z-index: 100; }
.image-viewer-box { width: 100vw; height: 100vh; text-align: center; }
.image-viewer-img { max-width: 100vw; max-height: 100vh; display: inline-block; display: inline-block; position: relative; top: 50%; transform: translateY(-50%); }
.image-viewer-box img { max-width: 100vw; max-height: 90vh; }
.image-viewer-close { width: 32px; height: 32px; position: absolute; right: -32px; top: -32px; background: url(../img/close_white.svg) no-repeat 0 0; }
.image-viewer-close:hover { background-image: url(../img/close_orange.svg); }

/* loading indicator */
.loading { display: none; }
.loading-outer { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; display: flex; z-index: 10000; justify-content: center; align-items: center; user-select: none; }
.loading-inner { width: 120px; height: 120px; background-color: rgba(255,255,255,0.8); padding: 10px; border-radius: 60px; }
@keyframes loading_anim {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}
.page-loading img { transform: rotate(0deg); animation-name: loading_anim; animation-duration: 1s; animation-timing-function: steps(12, end);
					animation-delay: 0; animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: none;
					animation-play-state: running; }

/* video */
.video-img-list { position: relative; cursor: pointer; }
.video-img-list figure:before { content: ""; background: url(../img/play-small.svg) no-repeat; width: 75px; height: 75px; position: absolute; left: 0; right: 0; margin: 0 auto 0 auto; top: calc(50% - 37px); z-index: 2; }
.video-img-list:hover figure:before { background-image: url(../img/play-small-full.svg); }
.video-img-list figure.video-started:before { display: none; }

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* header */
header { width: 100%; }
.logo-nav-area { width: 100%; margin: 0 auto 0 auto; position: fixed; z-index: 1000; transition: all 0.25s ease-out; background-color: white; }
.logo-nav-area-inner { padding: 10px calc((100vw - 1600px) / 2) 0 calc((100vw - 1600px) / 2); font-size: 26px; transition: all 0.25s ease-out; }
.header-nav-line { display: flex; flex-direction: row; }
.logo-area-spacer { flex: 1 1 auto; }

/* minimized header */
.header-scroll .logo-nav-area { box-shadow: 0 1px 10px rgba(0,0,0,0.4); }
.header-scroll .logo-area { margin-top: -44px; }

/* cookie banner */
.cookie-banner { background-color: #004486; color: white; font-size: 19px; display: none; position: fixed; margin: 0 auto 0 auto; bottom: 0; height: 200px; width: 100%; z-index: 1000; }
.cookie-banner-inner { max-width: 1290px; margin: 0 auto 0 auto; padding: 35px 0% 75px 0; }
.cookie-buttons { margin-top: 20px; }
.cookie-banner a { border: 1px solid white; background-color: #f19000; color: white; width: auto; height: 2em; padding: 4px 20px 6px 20px; margin-right: 20px; text-decoration: none; transition: all 0.35s ease-out; display: inline-block; margin-bottom: 10px; }
.cookie-banner a:hover { text-decoration: none; opacity: 1; }
.cookie-banner button { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid white; background-color: #f19000; color: white; width: auto; height: 2em; display: inline-block; padding: 4px 20px 6px 20px; margin-right: 20px; cursor: pointer; transition: all 0.35s ease-out; margin-bottom: 10px; }
.cookie-banner button:hover { opacity: 1; }

/* logo */
.logo-area { margin-top: 0; transition: margin-top 0.25s ease-out; }
.logo-area img { max-width: calc(100vw - 30px); }
.logo-default img { width: 530px; max-width: calc(100vw - 50px); }
.logo { display: inline-block; }

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* navigation */
.mini-nav-area { }
.nav-close-button { display: none; position: absolute; right: 25px; top: 25px; width: 32px; height: 32px; background: no-repeat url(../img/close.svg); border: none; }
.nav-close-button:hover { background-image: url(../img/close_white.svg); }
.main-nav-top {}

/* language selector */
.language-selector { text-align: center; font-weight: 600; font-size: 16px; padding: 10px 1em 10px 1em; }
.language-selector a { color: #294a7d; text-decoration: none; text-transform: capitalize; padding-left: 0.8em; padding-right: 0.8em; display: inline-block; cursor: pointer; }
.language-selector a:hover { color: #7ba9ff; }
.language-selector .lang-active { color: #89A7FD; }

/* menu button, hamburger button */
.main-nav { position: relative; }
.main-nav a { font-size: 16px; font-weight: 600; color: white; text-decoration: none; }
.main-nav a:hover { text-decoration: none; color: white; }
.main-nav-top { font-size: 16px; font-weight: 600; font-style: normal; color: #294a7d; display: flex; flex-direction: row; padding: 10px 5px 10px 15px; cursor: pointer; }
.main-nav-top span { color: #294a7d; }
.main-nav-top.nav-open { background-color: #294a7d; border-top-left-radius: 6px; border-top-right-radius: 6px; color: white; }
.main-nav-top:hover span { color: #294a7d; }
.main-nav-top.nav-open span, .main-nav-top.nav-open:hover span { color: white; }
.nav-button { display: block; position: relative; width: 24px; height: 8px; transition: all 0.2s ease-out; margin-top: 9px; margin-left: 18px; top: 0; }
.nav-button-bar { background-color: #294a7d; width: 24px; height: 2px; position: absolute; left: 0; transform-origin: 0 0; transition: all 0.2s ease-out; }
.nav-button-bar1 { top: 0; transition: all 0.2s ease-out; }
.nav-button-bar2 { top: 6px; transition: all 0.2s ease-out; }
.main-nav-top.nav-open .nav-button { top: -1px; height: 8px; margin-top: 6px; }
.main-nav-top.nav-open .nav-button .nav-button-bar { background-color: white; }
.main-nav-top.nav-open .nav-button .nav-button-bar1 { width: 19px; transform: rotate(45deg); }
.main-nav-top.nav-open .nav-button .nav-button-bar2 { width: 19px; transform: rotate(-45deg) translate(-6px,4px); }
.main-nav-top:hover .nav-button { top: -2px; height: 12px; }
.main-nav-top:hover .nav-button .nav-button-bar1 { top: 0; }
.main-nav-top:hover .nav-button .nav-button-bar2 { top: 10px; }
.main-nav-top.nav-open:hover .nav-button { top: -1px; height: 8px; }
.main-nav-top.nav-open:hover .nav-button .nav-button-bar1 { top: 0; }
.main-nav-top.nav-open:hover .nav-button .nav-button-bar2 { top: 6px; }

/* main navigation */
.nav-close-button { display: none; }
.main-nav-container { }
.nav-open .main-nav-container { }
.nav-img-description { display: none; }
.main-nav-items { display: none; background-color: #294a7d; position: absolute; right: 0; border-radius: 6px; border-top-right-radius: 0; width: 425px; }
.main-nav-items a { display: inline-block; font-size: 20px; line-height: 1.5; }
.main-nav-items a:hover { }
.main-nav-items a span { display: inline-block; }
.main-nav-items .nav-level0 { }
.main-nav-items .nav-level0 > ul { list-style: none; margin: 0; padding: 45px 20px 40px 20px; width: auto; }
.main-nav-items .nav-level0 > ul > li { border-bottom: 1px solid #799acd; padding: 14px 33px 16px 13px; }
.main-nav-items .nav-level0 > ul > li:first-child { border-top: 1px solid #799acd; }
.main-nav-items .nav-level0 > ul > li a span { padding-left: 40px; background: url(../img/arrow_white2.svg) no-repeat 0px 0px; }
.main-nav-items .nav-level0 > ul > li a:hover span { background: url(../img/arrow_white2_rollover.svg) no-repeat 0px 0px; }
.main-nav-items .nav-level0 > ul > li.nav-active-path { }
.main-nav-items .nav-level0 > ul > li.nav-active-path a, .main-nav .nav-level0 > ul > li:hover a { }
.nav-open .main-nav-items { display: block; }

/* tablet navigation */
.main-nav-tablet { display: none; }
@media (hover: none)
{
	.main-nav-tablet { display: block; }
	.main-nav-desktop { display: none; }
	.main-nav .nav-level0 > ul > li ul.nav-open { display: block; }
}

/* inline menu */
.inline-menu { margin-bottom: 5em; }
.inline-menu a { display: inline-block; font-size: 20px; line-height: 1.5; color: #294a7d; font-weight: 600; }
.inline-menu a:hover { }
.inline-menu a span { display: inline-block; }
.inline-menu ul { list-style: none; margin: 0; padding: 0; width: auto; max-width: 500px; }
.inline-menu ul li { border-bottom: 2px solid #e6e6e6;  padding: 14px 33px 16px 13px; }
.inline-menu ul li:first-child { border-top: 2px solid #e6e6e6; }
.inline-menu ul li a span { padding-left: 40px; background: url(../img/arrow_blue2.svg) no-repeat 0px 0px; }
.inline-menu ul li a:hover span { background: url(../img/arrow_green2_rollover.svg) no-repeat 0px 0px; color: #a3c93d; }

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* footer */
footer { background-color: #294a7d; height: 50px; position: absolute; bottom: 0; width: 100vw; }
.footer-container { padding: 10px calc((100vw - 1600px) / 2) 0 calc((100vw - 1600px) / 2);  }
.footer-nav { color: white; font-size: 18px; font-weight: normal; max-width: 1600px; }
.footer-nav a { color: white; text-decoration: underline; }
.footer-nav ul { display: flex; flex-direction: row; }
.footer-nav li { margin-left: 3em;  }
.footer-nav li:first-child { margin-left: 0;  }

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* forms */

/* button */
/*button.button-primary { background-color: #a3c93d; color: black; padding: 10px 40px 10px 40px; font-size: 19px; font-weight: 600; line-height: normal; border-radius: 6px; font-size: 19px; }*/
/*button.button-primary:disabled, button.button-primary:hover:disabled { background-color: #e6e6e6; color: #969696; }*/
/*button.button-primary:hover { background-color: #c3dc81; }*/
/*button.button-primary:active { position: relative; top: 1px; }*/
/*button.button-primary:active:disabled { top: 0; }*/

/* required marker */
.no-required-marker .input-field[required] label:after, .no-required-marker .radio-field[required] label:after,
	.no-required-marker .field-group[required] label:after { content: ""; }

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* wizard */
.wizard-container { padding: 10px calc((100vw - 1600px) / 2) 0 calc((100vw - 1600px) / 2); }
.wizard { color: black; font-size: 18px; font-weight: normal; max-width: 1600px; position: relative; z-index: 1; }
.demo-badge:before { content: "DEMO"; position: absolute; font-size: 450px; font-weight: bold; color: #d0d0d0; opacity: 0.25;
					left: 0; top: 100px; display: block; width: 100%; text-align: center; z-index: 0;
					transform-origin: center center; transform: rotate(-30deg); }

.wizard-header { font-size: 16px; font-weight: bold; width: 100%; }
.wizard-header ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: row; width: 100%; border-top: 8px solid #003899; padding-top: 14px; }
.wizard-header li { flex: 1 1 auto; }
.wizard-header-title { display: flex; flex-direction: row; align-items: center; cursor: default; }
.wizard-header-num { flex: none; color: #969696; border: 2px solid #dbdbdb; width: 36px; height: 36px; border-radius: 18px; display: block; text-align: center; line-height: 31px; margin-right: 15px; margin-left: 10px;}
.wizard-header-text { flex: none; color: #969696; display: block; }
.wizard-progress { height: 12px; background-color: #dbdbdb; margin-top: 13px; position: relative; }
.wizard-progress-arrow-l { position: absolute; right: -4px; top: -2px; height: 5px; width: 20px; background-color: white; transform: rotate(50deg); z-index: 2; }
.wizard-progress-arrow-r { position: absolute; right: -4px; top: -2px; height: 5px; width: 20px; background-color: white; transform: translate(0px,11px) rotate(-50deg); z-index: 2; }
.wizard-header li:last-child .wizard-progress-arrow-l, .wizard-header li:last-child .wizard-progress-arrow-r { display: none; }

.done .wizard-header-title { cursor: pointer; }
.done .wizard-header-num { color: #003899; border-color: #89A7FD; }
.done .wizard-header-text { color: #003899; }
.done .wizard-progress { height: 18px; background-color: #89A7FD; margin-top: 10px; }
.done .wizard-progress-arrow-l, .done .wizard-progress-arrow-r { right: -9px; top: 1px; }

.active .wizard-header-num { color: #003899; border-color: #64B276; }
.active .wizard-header-text { color: #003899; }
.active .wizard-progress { height: 18px; background-color: #64B276; margin-top: 10px; }
.active .wizard-progress-arrow-l, .done .wizard-progress-arrow-r { right: -9px; top: 1px; }

.wizard-header-top { display: flex; flex-direction: row; align-items: baseline; position: relative; }
.wizard-header-top-info { flex: none; background-color: #a3c93d; border-top-left-radius: 8px; border-top-right-radius: 8px; color: white;
						  font-weight: 400; font-size: 28px; display: inline-block; padding: 10px 35px 0 35px; }
.wizard-header-top-logo { flex: 1 1 auto; text-align: right; }
.wizard-header-top-logo span { color: #294a7d; font-weight: 400; font-size: 15px; padding-right: 10px; }
.wizard-header-top-logo img { position: relative; top: 6px; }

.wizard-body { margin-top: 50px; font-size: 19px; position: relative; z-index: 1; }
.wizard-body p { margin-bottom: 30px; hyphens: auto; }
.wizard-tab { display: none; }
.wizard-tab-content { }
.wizard-tab-inner { display: flex; flex-direction: row; }
.wizard-tab-left { flex: 1 1 0; margin-right: 38px; }
.wizard-tab-right { flex: 1 1 0; margin-left: 38px; }
.wizard-tab.active { display: block; }
.wizard-inline-buttons { display: flex; flex-direction: row; margin-top: 20px; }

.info-box { background-color: #eaf7c5; border: 2px solid #a0c92a; border-radius: 6px; padding: 20px 40px 20px 90px; margin-bottom: 80px; background-image: url(../img/icon_exclamationmark_green.svg); background-repeat: no-repeat; background-position: 24px center; }

/* prev/next buttons */
.wizard-buttons { position: fixed; background-color: white; bottom: 0; left: 0; width: 100vw; margin-top: 10px; padding: 0 calc((100vw - 1600px) / 2) 0 calc((100vw - 1600px) / 2); z-index: 10; }
.wizard-buttons-inner { display: flex; flex-direction: row; padding-top: 30px; padding-bottom: 30px; border-top: 2px solid #dbdbdb; }
.wizard-button-left { flex: 1 1 0; display: flex; flex-direction: row; justify-content: flex-start; }
.wizard-button-right { flex: 1 1 0; display: flex; flex-direction: row; justify-content: flex-end; }

/* Tab location */
.location-selector a { display: inline-block; font-size: 20px; line-height: 1.5; color: #294a7d; font-weight: 600; cursor: pointer; }
.location-selector a:hover {  }
.location-selector a span { display: inline-block; padding: 2px 0 2px 33px; }
.location-selector { list-style: none; margin: 0; padding: 0; width: auto; max-width: 500px; margin-bottom: 50px; }
.location-selector li { border-bottom: 2px solid #e6e6e6;  padding: 12px 33px 14px 0; }
.location-selector li:first-child { border-top: 2px solid #e6e6e6; }
.location-selector li a span { padding-left: 40px; background: url(../img/arrow_blue2.svg) no-repeat 0px 0px; }
.location-selector li a:hover span { background: url(../img/arrow_green2_rollover.svg) no-repeat 0px 0px; color: #a3c93d; }
.location-selector li.selected a span { padding-left: 40px; background: url(../img/icon_checked.svg) no-repeat 0px 0px; color: #a3c93d; }
.wizard .map_background { position: relative; }

/* Tab personal data */
.personal-data-proxy, .personal-data-first, .personal-data-second { display: none; }
.personal-data-proxy.active, .personal-data-first.active, .personal-data-second.active { display: block; }
.birthday-error { font-weight: 600; color: #b81616; }

/* Tab health data */
.health-data-first, .health-data-second { display: none; }
.health-data-first.active, .health-data-second.active { display: block; }
.health-data-first .radio-field, .health-data-second .radio-field { margin-bottom: 35px; }
.health-data-first .radio-field .group-label, .health-data-second .radio-field .group-label { padding-left: 0; }

/* Tab appointment */
.appointment-found, .appointment-selector, .appointment-preference, .appointment-notfound { display: none; }
.appointment-found.active, .appointment-notfound.active, .appointment-preference.active, .appointment-selector.active { display: block; }
.appointment-info-box { border: 2px solid #a3c93d; border-radius: 16px; padding: 15px 45px 15px 45px; display: inline-block; margin-bottom: 30px; }
.appointment-info-date, .appointment-info-time { font-size: 25px; font-weight: 600; }

.button-calendar { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; cursor: pointer; background-color: transparent;
					border-bottom: 2px solid #e6e6e6; border-top: 2px solid #e6e6e6; padding: 12px 33px 14px 0;
					font-size: 20px; line-height: 1.5; color: #294a7d; font-weight: 600; }
.button-calendar span { padding-left: 40px; background: url(../img/calendar_blue.svg) no-repeat 0px -2px; }
.button-calendar:hover span { background: url(../img/calendar_green.svg) no-repeat 0px -2px; color: #96c222; }

.calendar-hide { display: none; }
.calendar-months { display: flex; flex-direction: row; margin-bottom: 50px; }
.calendar-month { flex: 1 1 0; max-width: 350px; margin-right: 25px; }
.calendar-month-header { font-weight: bold; font-size: 19px; text-align: center; color: #969696; display: flex; flex-direction: row; }
.calendar-month-prev, .calendar-month-next { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; cursor: pointer;
											 width: 20px; height: 25px; background-repeat: no-repeat; background-color: transparent; }
.calendar-month-prev { background-image: url(../img/arrow_left_green.svg); }
.calendar-month-next { background-image: url(../img/arrow_right_green.svg); }
.calendar-month-prev:hover { background-image: url(../img/arrow_left_green_rollover.svg); }
.calendar-month-next:hover { background-image: url(../img/arrow_right_green_rollover.svg); }
.calendar-month-prev:disabled { background-image: url(../img/arrow_left_gray.svg); }
.calendar-month-next:disabled { background-image: url(../img/arrow_right_gray.svg); }
.calendar-month-prev:disabled:hover { background-image: url(../img/arrow_left_gray.svg); }
.calendar-month-next:disabled:hover { background-image: url(../img/arrow_right_gray.svg); }
.calendar-month-name { flex: 1 1 0; }
.calendar-current-month .calendar-month-next { display: none; } /* show on mobile devices, if only current month is visible */

.calendar-dow-list { display: flex; flex-direction: row; }
.calendar-dow { flex: 1 1 0; max-width: 48px; margin: 10px 2px 5px 2px; font-weight: 600; font-size: 14px; text-align: center; color: #969696; }
.calendar-container { display: flex; flex-direction: column; }
.calendar-line { display: flex; flex-direction: row; border-top: 1px solid #969696; padding-top: 8px; padding-bottom: 8px; }
.calendar-day-empty { flex: 1 1 0; max-width: 48px; height: 52px; margin: 1px 2px 1px 2px; }
.calendar-day { flex: 1 1 0; max-width: 48px; height: 52px; margin: 1px 2px 1px 2px; border-radius: 4px; padding-top: 4px; font-weight: 600; font-size: 16px; text-align: center; cursor: pointer; }
.calendar-day.free { background-color: #a3c93d; color: black; }
.calendar-day.occupied { background-color: #e6e6e6; color: #969696; cursor: default; }
.calendar-day.reserved { background-color: #c3dc81; color: white; }
.calendar-day.active { background-color: #294a7d; color: white; }

.calendar-time { }
.calendar-time-description { display: none; }
.calendar-time-header { color: #a3c93d; font-weight: bold; font-size: 19px; padding: 0 0 0 65px; }
.calendar-time-body { display: flex; flex-direction: row; flex: 1 1 0; }
.calendar-hour-list { display: flex; flex-direction: column; padding-right: 10px; }
.calendar-hour { height: 59px; margin: 1px 2px 1px 2px; font-weight: 600; font-size: 14px; text-align: right; color: #969696; position: relative; top: -12px; }
.calendar-time-inner { display: flex; flex-direction: column; flex: 1 1 0; }
.calendar-time-line { display: flex; flex-direction: row; flex: 1 1 0; border-top: 1px solid #969696; padding: 8px 20px 8px 20px; }
.calendar-time-entry { flex: 1 1 0; height: 42px; margin: 1px 2px 1px 2px; border-radius: 4px; padding-top: 9px; font-weight: 600; font-size: 14px; text-align: center; cursor: pointer; }
.calendar-time-entry.free { background-color: #a3c93d; color: black;  }
.calendar-time-entry.occupied { background-color: #e6e6e6; color: #969696; cursor: default; }
.calendar-time-entry.reserved { background-color: #c3dc81; color: white; cursor: pointer; }
.calendar-time-entry.active { background-color: #294a7d; color: white; cursor: pointer; }

/* Tab confirm */
.confirm-appointment, .appointment-confirmed, .add-to-waitinglist, .added-to-waitinglist { display: none; }
.confirm-appointment.active, .appointment-confirmed.active, .add-to-waitinglist.active, .added-to-waitinglist.active { display: block; }
.wizard-info-table { width: 100%; }
.wizard-info-table .col0 { font-size: 14px; color: #294a7d; font-weight: 600; width: 200px; }
.wizard-info-table .col1 { font-size: 18px; line-height: 1.5; height: 30px; }

.button-download { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; cursor: pointer; background-color: transparent;
					border-bottom: 2px solid #e6e6e6; border-top: 2px solid #e6e6e6; padding: 12px 33px 14px 0;
					font-size: 20px; line-height: 1.5; color: #294a7d; font-weight: 600; }
.button-download span { padding-left: 40px; background: url(../img/download_document_blue.svg) no-repeat 0px -2px; }
.button-download:hover span { background: url(../img/download_document_green.svg) no-repeat 0px -2px; color: #96c222; }

/*
light gray 		#e6e6e6
med gray		#dbdbdb
dark gray		#969696
dark green 		#a3c93d
light green 	#c3dc81
dark blue 		#294a7d
*/

.address { margin-left: 0; margin-top: 25px; font-weight: 600; }

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* pages */

/* map */
.map { position: relative; width: 100%; cursor: pointer; min-height: 250px; }
.map_background { position: absolute; top: 0; left: 0; width: 100%; z-index: 0; }
.map_foreground { position: absolute; top: 0; left: 0; width: 100%; z-index: 1; }
.map_location { position: absolute; top: 0; left: 0; width: 100%; z-index: 3; }
.map_location-active { position: absolute; top: 0; left: 0; width: 100%; z-index: 4; display: none; }
.map_location-area { position: absolute; top: 0; left: 0; width: 100%; z-index: 2; }

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* responsive */
@media only screen and (max-width: 1700px)
{
	article > h1, article > h2 { padding-left: 50px; padding-right: 50px; }
	article > .grid-row, article > .grid-row-wide { padding-left: 50px; padding-right: 50px; }
	.logo-nav-area-inner { padding-left: 50px; padding-right: 50px; }
	.footer-container { padding-left: 50px; padding-right: 50px; }
	.wizard-container { padding-left: 50px; padding-right: 50px; }
	.wizard-buttons { padding-left: 50px; padding-right: 50px; }
	.demo-badge:before { font-size: 400px; top: 100px; }
}

@media only screen and (max-width: 1200px)
{
	/* single calendar month */
	.calendar-current-month .calendar-month-next { display: block; }
	.calendar-next-month { display: none; }
	.demo-badge:before { font-size: 350px; top: 100px; }
}

@media only screen and (max-width: 1100px)
{
	.wizard-header { font-size: 14px; }
	.wizard-header-num {  margin-right: 8px; }
	.demo-badge:before { font-size: 300px; top: 100px; }
}

@media only screen and (max-width: 1024px)
{
	/* smaller screen border margin */
	article > h1, article > h2 { padding-left: 25px; padding-right: 25px; }
	article > .grid-row, article > .grid-row-wide { padding-left: 25px; padding-right: 25px; }
	.logo-nav-area-inner { padding-left: 25px; padding-right: 25px; }
	.footer-container { padding-left: 25px; padding-right: 25px; }
	.wizard-container { padding-left: 25px; padding-right: 25px; }
	.wizard-buttons { padding-left: 25px; padding-right: 25px; }
	.demo-badge:before { font-size: 250px; top: 100px; }
}

@media only screen and (max-width: 900px)
{
	h1 { font-size: 38px; }
	h2 { font-size: 32px; }
	h3 { font-size: 32px; }
	/* compact wizard header */
	.wizard-header { font-size: 16px; position: relative; }
	.wizard-header ul { border-bottom: 8px solid #a3c93d; padding-top: 14px; padding-bottom: 10px; }
	.wizard-header li { flex: 1 1 auto; }
	.wizard-header-title { display: flex; flex-direction: row; align-items: center; justify-content: center; }
	.wizard-header-num { flex: none; background-color: white; margin-right: 0; margin-left: 0; position: relative; z-index: 1; }
	.wizard-header-text { flex: none; display: none; position: absolute; left: 0; bottom: 15px; text-align: center; width: 100%; }
	.wizard-header .active .wizard-header-text { display: block; }
	.wizard-progress { top: -36px; }
	/* single col */
	article > h1, article > h2 { padding-left: 40px; padding-right: 40px; }
	article > .grid-row, article > .grid-row-wide { padding-left: 40px; padding-right: 40px; }
	article .grid-row > .grid-col-6, article .grid-row > .grid-col-3 { float: none; width: auto; }
	.section-colspan-2-cols-3 { width: 100%; }
	.section-colspan-4-cols-3 { width: 100%; }
	.logo-nav-area-inner { padding-left: 40px; padding-right: 40px; }
	.footer-container { padding-left: 40px; padding-right: 40px; }
	.wizard-container { padding-left: 40px; padding-right: 40px; }
	.wizard-buttons { padding-left: 40px; padding-right: 40px; }
	.map { display: none; }
	.wizard { padding-bottom: 50px; }
	.wizard-tab-inner { display: block; }
	.wizard-tab-left { flex: none; margin-right: 0; }
	.wizard-tab-right { flex: none; margin-left: 0; }
	.confirm-appointment hr { background-color: transparent; }
	.confirm-appointment .wizard-tab-right { border-top: 2px solid #dbdbdb; margin-top: 10px; padding-top: 30px; }
	.appointment-found .wizard-tab-right { border-top: 2px solid #dbdbdb; margin-top: 40px; padding-top: 40px; }
	.row-dark .section-col1 h3 { display: none; }
	/* double calendar month */
	.calendar-current-month .calendar-month-next { display: none; }
	.calendar-next-month { display: block; }
	.demo-badge:before { font-size: 300px; top: 250px; transform: rotate(-50deg); }
}

@media only screen and (max-width: 768px)
{
	.wizard-buttons-inner { padding-top: 20px; padding-bottom: 20px; }
	.logo-nav-area { position: absolute; }
	.header-scroll .logo-nav-area { box-shadow: none; }
	.header-scroll .logo-area { margin-top: 0; }
	.demo-badge:before { font-size: 250px; top: 300px; transform: rotate(-55deg); }
}

@media only screen and (max-width: 750px)
{
	.header-scroll .language-selector { display: none; }
	.wizard-header-top-logo span { font-size: 8px; padding-right: 5px; }
	.wizard-header-top-logo img { position: relative; top: 3px; width: 97px; }
	.demo-badge:before { font-size: 225px; top: 300px; transform: rotate(-55deg); }
}

@media only screen and (max-width: 600px)
{
	/* smaller screen border margin */
	article > h1, article > h2 { padding-left: 25px; padding-right: 25px; }
	article > .grid-row, article > .grid-row-wide { padding-left: 25px; padding-right: 25px; }
	.logo-nav-area-inner { padding-left: 25px; padding-right: 25px; }
	.footer-container { padding-left: 25px; padding-right: 25px; }
	.wizard-container { padding-left: 25px; padding-right: 25px; }
	.wizard-buttons { padding-left: 25px; padding-right: 25px; }
}

@media only screen and (max-width: 550px)
{
	.wizard-header-top-logo span { display: none; }
	.demo-badge:before { font-size: 190px; top: 300px; transform: rotate(-55deg); left: -50px; }
}

@media only screen and (max-width: 475px)
{
	.wizard-header-top-logo img { top: 3px; width: 60px; }
	.demo-badge:before { font-size: 170px; top: 300px; transform: rotate(-55deg); }
}

@media only screen and (max-width: 428px)
{
	.wizard-header-top-logo img { display: none; }
	.demo-badge:before { font-size: 150px; top: 300px; transform: rotate(-55deg); }
}

@media only screen and (max-width: 414px)
{
	.main-nav-items { width: 100vw; right: -25px; border-top-right-radius: 6px; }
	.language-selector { padding-left: 0; padding-right: 0; }
	.appointment-info-box { padding: 15px 25px 15px 25px; margin-bottom: 30px; }
	.appointment-info-date, .appointment-info-time { font-size: 21px; }
	.wizard-buttons-inner { padding-top: 20px; padding-bottom: 20px; }
	.wizard-info-table .col0 { width: 140px; }
	.calendar-time-header { font-size: 17px; }
}

@media only screen and (max-width: 390px)
{
	article > h1, article > h2 { padding-left: 15px; padding-right: 15px; }
	article > .grid-row, article > .grid-row-wide { padding-left: 15px; padding-right: 15px; }
	.logo-nav-area-inner { padding-left: 15px; padding-right: 15px; }
	.footer-container { padding-left: 15px; padding-right: 15px; }
	.wizard-container { padding-left: 15px; padding-right: 15px; }
	.wizard-buttons { padding-left: 15px; padding-right: 15px; }
	.main-nav-top > span { display: none; }
	.language-selector a { padding-left: 0.5em; padding-right: 0.8em; }
	.demo-badge:before { font-size: 150px; top: 300px; transform: rotate(-55deg); left: -30px; }
}

@media only screen and (max-width: 360px)
{
	.birthday .input-field.inline { margin-right: 2px; }
	.wizard-header-top-info { font-size: 22px; display: inline-block; padding: 10px 20px 0 20px; }
}

@media only screen and (max-width: 320px)
{
	.language-selector a { padding-left: 0.5em; padding-right: 0.5em; }
	.demo-badge:before { font-size: 130px; top: 300px; transform: rotate(-55deg); left: -20px; }
}