/*
Theme Name: 	BIZ
Theme URI: 		http://xeit.ch
Version: 		1.0
Author: 		Robert Baumgartner, Xeit GmbH
Author URI: 	http://xeit.ch
*/



/*** Sensible Defaults ***/

@import "css/reset.css";
@import "css/fonts/ArialBlack.css";
@import "js/lightbox/css/lightbox.min.css";

@keyframes animate-hand {
	0% { transform: rotate(-30deg) translateX(0) translateY(0); }
	20% {  }
	40% { transform: rotate(-30deg) translateX(-55%) translateY(-100%) scale(1); }
	45% { transform: rotate(-30deg) translateX(-55%) translateY(-100%) scale(0.9); }
	50% { transform: rotate(-30deg) translateX(-55%) translateY(-100%) scale(1); }
	60% {  }
	80% { transform: rotate(-30deg) translateX(0) translateY(0); }
	100% { transform: rotate(-30deg) translateX(0) translateY(0);  }
}

@keyframes animate-circle {
	0% {  }
	20% {   }
	42% {  opacity: 0; }
	43% { transform: scale(1); opacity: 1; }

	70% { transform: scale(3); opacity: 0 };
	71% { transform: scale(1); opacity: 0; }
}

div,
article,
section,
header,
footer,
nav,
li					{ position:relative; }
body 				{ background:#fff; }


* {
	box-sizing: border-box;
	-webkit-font-smoothing: antialiased;
	   -moz-font-smoothing: antialiased;
	        font-smoothing: antialiased;
}

html, body {
	font-family: Arial, sans-serif;
	font-weight: normal;
	font-size: 13px;
	line-height: 135%;
	overflow-x: hidden;
	background: #fafafa;
}

	@media (min-width: 450px) {
		html, body {
			font-size: 13px;
			line-height: 135%;
		}
	}

	@media (min-width: 1000px) {
		html, body {
			font-size: 14px;
			line-height: 135%;
		}
	}

	@media (min-width: 1400px) {
		html, body {
			font-size: 16px;
			line-height: 135%;
		}
	}

header {
	height: 14vw;
	width: 100%;
	background: #d1d1cf;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
}

	body.home header { background: transparent; }
	body.home header a.logo,
	body.home header a.back { display: none; }

	@media (min-width: 450px) {
		header {
			height: 4.25rem;
		}
	}

	@media (min-width: 1400px) {
		header {
			height: 5.5rem;
		}
	}

	header .left {
		float: left;
		display: flex;
		flex-flow: row wrap;
	}

	header .nav {
		float: right;
		display: flex;
		flex-flow: row wrap;
	}

	header a {
		display: block;
		width: 14vw;
		height: 14vw;
		cursor: pointer;
		position: relative;
	}

		@media (min-width: 450px) {
			header a {
				width: 4.25rem;
				height: 4.25rem;
			}
		}

		@media (min-width: 1400px) {
			header a {
				width: 5.5rem;
				height: 5.5rem;
			}
		}

	header a.logo {
		background: #fff url(css/img/icon_logo.svg) no-repeat center center;
		background-size: cover;
		width: 14vw;
		height: 14vw;
	}

		@media (min-width: 450px) {
			header a.logo {
				width: 4.25rem;
				height: 4.25rem;
			}
		}

		@media (min-width: 1400px) {
			header a.logo {
				width: 5.5rem;
				height: 5.5rem;
			}
		}


	header a.back {
		background: #fff url(css/img/icon_back.svg) no-repeat center center;
		background-size: cover;
	}

		.page-template-page-home header a.back { pointer-events: none; }
		.page-template-page-home header a.back svg path { fill: #fff !important; }

		body[class*='page-template-page-beratungsangebot'] header a.back svg path { fill: #407CCA !important; }

		body[class*='page-template-page-berufe-studiengaenge'] header a.back svg path { fill: #AAAD00 !important; }

		body[class*='page-template-page-bildung-arbeit'] header a.back svg path { fill: #edaa00 !important; }

	header a.shelves {
		background: url(css/img/icon_shelves.svg) no-repeat center center;
		background-size: cover;
	}

	header a.consultation {
		background: url(css/img/icon_consultation.svg) no-repeat center center;
		background-size: cover;
	}

	header a.search {
		background: url(css/img/icon_search.svg) no-repeat center center;
		background-size: cover;
	}

	header a.help {
		background: url(css/img/icon_help.svg) no-repeat center center;
		background-size: cover;
	}

	header .nav a span {
		font-weight: bold;
		font-size: 11px;
		color: #717171;
		position: absolute;
		bottom: -2em;
		width: 120%;
		left: -10%;
		text-align: center;
		pointer-events: none;
		display: none;
	}

		@media (min-width: 1400px) {
			header .nav a span {
				font-size: 12px;
			}
		}

.view {
	padding: 22vw 3vw 3vw 3vw;
	min-height: 100vh;
/* 	background: url(css/img/bg.jpg) repeat left top; */
	background: #fafafa;
}

	.view.wide {
		padding: 22vw 3vw 3vw 3vw;
	}

	@media (min-width: 450px) {
		.view {
			padding: 7rem 2.6vw 5.5vw 5.5vw;
		}

		.view.wide {
			padding: 7rem 2.6vw 5.5vw 2.6vw;
		}
	}

	@media (min-width: 1400px) {
		.view {
			padding: 8rem 2.125vw 5.5vw 5.5vw;
		}

		.view.wide {
			padding: 8rem 2.125vw 5.5vw 2.125vw;
		}
	}

/*
.spacing-up {
	margin-top: 1rem;
}
*/

	@media (min-width: 450px) {
		.spacing-up {
			margin-top: 2.5rem;
		}
	}

.flex-content {
	display: flex;
	flex-flow: row wrap;
}

/*
	@media (max-width: 799px) {
		.page-template-page-berufe-studiengaenge-subcategory .flex-content {
			display: flex;
			flex-direction: column-reverse;
		}
	}

	@media (max-width: 1399px) {
		.page-template-page-berufe-studiengaenge-subcategory .flex-content {
			flex-direction: column-reverse;
		}
	}
*/

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

	.left-align-last:after {
		content: "";
		flex: auto;
	}

	.full-height {

	}

	.flex-content .main {
		width: 100%;
	}

		@media (min-width: 450px) {
			.flex-content .main {
				width: 78%;
			}
		}

	.flex-content .main-wide {
		width: 100%;
	}

		@media (min-width: 450px) {
			.flex-content .main-wide {
				width: 62.5%;
			}
		}

		@media (min-width: 1400px) {
			.flex-content .main-wide {
				width: 72.2%;
			}
		}

	.flex-content .main-narrow {
		width: 100%;
	}

		@media (min-width: 450px) {
			.flex-content .main-narrow {
				width: 62.5%;
			}
		}

		@media (min-width: 1400px) {
			.flex-content .main-narrow {
				width: 57.2%;
			}
		}

	.flex-content .sidebar {
		width: 100%;
		display: none;
	}

		@media (min-width: 800px) {
			.flex-content .sidebar {
				width: 18%;
				display: block;
			}
		}

		@media (min-width: 1400px) {
			.flex-content .sidebar {
				width: 15%;
			}
		}

		@media (max-width: 1399px) {
			.page-template-page-beratungsangebot .sidebar { display: none; }
		}

	.flex-content .left-nav {
		width: 100%;
	}

		@media (min-width: 450px) {
			.flex-content .left-nav {
				width: 30%;
				margin-right: 7%;
			}
		}

		@media (min-width: 1400px) {
			.flex-content .left-nav {
				width: 22%;
				margin-right: 5.8%;
			}
		}

	.flex-content .flex-main {
		width: 100%;
		padding: 1rem;
		color: #7f7f7f;
		border-bottom: 2px dotted #fff;
	}

		@media (min-width: 800px) {
			.flex-content .flex-main {
				padding: 3.125rem;
			}
		}

		@media (min-width: 1000px) {
			.flex-content .flex-main {
				width: 50%;
				border-bottom: 0;
				border-right: 2px dotted #fff;
				min-height: 76vh;
				padding: 3.125rem;
			}
		}


		@media (min-width: 1400px) {
			.flex-content .flex-main {
				width: 40%;
				border-bottom: 0;
				border-right: 4px dotted #fff;
				min-height: 76vh;
				padding: 3.125rem;
			}
		}

		.flex-content .flex-main h1 {
			color: #fff;
			margin-bottom: 1em;
		}

		.flex-content .flex-main img.map {
			width: 100%;
			height: auto;
			margin-top: 3.125rem;
			/* background: #fff;
			border-radius: 3px; */
			padding: 0.3em;
			/* box-shadow: 0 0 0.5em rgba(0,0,0,0.2); */
		}

	.flex-content .flex-meta {
		width: 100%;
		padding: 1rem;
		border-bottom: 2px dotted #fff;
	}

		@media (min-width: 800px) {
			.flex-content .flex-meta {
				width: 50%;
				padding: 3.125rem 2rem;
				border-bottom: 0;
				border-right: 2px dotted #fff;
			}
		}

		@media (min-width: 1000px) {
			.flex-content .flex-meta {
				width: 25%;
				padding: 3.125rem 2rem;
				border-bottom: 0;
				border-right: 2px dotted #fff;
			}
		}

		@media (min-width: 1400px) {
			.flex-content .flex-meta {
				width: 20%;
				padding: 3.125rem 2rem;
				border-bottom: 0;
				border-right: 4px dotted #fff;
			}
		}

		.flex-content .flex-meta a {
			color: #fff;
			text-decoration: none;
		}

		.flex-content .flex-meta .related,
		.flex-content .flex-meta > .links:first-child,
		.flex-content .flex-videos h4:first-child {
			margin-top: 3.125rem;
		}

		.flex-content .flex-meta .links a {
			margin-bottom: 1rem;
			display: inline-block;
		}

	.flex-content .flex-videos {
		width: 100%;
		padding: 1rem 1rem 5rem 1rem;
	}

		@media (min-width: 800px) {
			.flex-content .flex-videos {
				width: 50%;
				padding: 3.125rem 2rem 5rem 2rem;
			}
		}

		@media (min-width: 1000px) {
			.flex-content .flex-videos {
				width: 25%;
				padding: 3.125rem 2rem 5rem 2rem;
			}
		}

		@media (min-width: 1400px) {
			.flex-content .flex-videos {
				width: 20%;
				padding: 3.125rem 2rem 5rem 2rem;
			}
		}

	.flex-content .flex-image {
		width: 20%;
		background-size: cover;
		background-position: center center;
	}

	.flex-content .flex-mobile-image {
		display: none;
	}

	.flex-content .flex-topic {
		width: 100vw;
		left: -3vw;
	}

		@media (min-width: 450px) {
			.flex-content .flex-topic {
				left: -2.6vw;
			}
		}

		@media (min-width: 800px) {
			.flex-content .flex-topic.flex-content {
				flex-direction: row;
			}
		}

		@media (min-width: 1400px) {
			.flex-content .flex-topic {
				width: 50%;
				min-height: 100%;
				left: auto;
			}
		}

		body[class*='page-template-page-berufe-studiengaenge'] .flex-content .flex-topic,
		body[class*='page-template-page-berufe-studiengaenge'] .flex-content .flex-location,
		body[class*='page-template-page-berufe-studiengaenge'] .flex-content .flex-main,
		body[class*='page-template-page-berufe-studiengaenge'] .flex-content .flex-meta,
		body[class*='page-template-page-berufe-studiengaenge'] .flex-content .flex-videos,
		body[class*='page-template-page-berufe-studiengaenge'] .flex-content .flex-image { background-color: #d4d680; }

		body[class*='page-template-page-bildung-arbeit'] .flex-content .flex-topic,
		body[class*='page-template-page-bildung-arbeit'] .flex-content .flex-location,
		body[class*='page-template-page-bildung-arbeit'] .flex-content .flex-main,
		body[class*='page-template-page-bildung-arbeit'] .flex-content .flex-meta,
		body[class*='page-template-page-bildung-arbeit'] .flex-content .flex-videos,
		body[class*='page-template-page-bildung-arbeit'] .flex-content .flex-image { background-color: #f6d480; }

		body[class*='page-template-page-beratungsangebot'] .flex-content .flex-topic,
		body[class*='page-template-page-beratungsangebot'] .flex-content .flex-location,
		body[class*='page-template-page-beratungsangebot'] .flex-content .flex-main,
		body[class*='page-template-page-beratungsangebot'] .flex-content .flex-meta,
		body[class*='page-template-page-beratungsangebot'] .flex-content .flex-videos,
		body[class*='page-template-page-beratungsangebot'] .flex-content .flex-image { background-color: #9fbde4; }


		body[class*='single-questionnaire'] .flex-content .flex-topic,
		body[class*='single-questionnaire'] .flex-content .flex-location,
		body[class*='single-questionnaire'] .flex-content .flex-main,
		body[class*='single-questionnaire'] .flex-content .flex-meta,
		body[class*='single-questionnaire'] .flex-content .flex-videos,
		body[class*='single-questionnaire'] .flex-content .flex-image {
			background-color: #9fbde4;
			color: #fff;
		}

		.single-questionnaire .flex-content p {
			color: #fff
		}

h1 {
	font-family: 'Arial Black', Arial, sans-serif;
	font-weight: normal;
	font-size: 1.11rem;
	line-height: 110%;
	letter-spacing: -0.015em;
}

	@media (min-width: 450px) {
		h1 {
			font-size: 2.0625rem;
			line-height: 110%;
		}
	}

	@media (max-width: 449px) {
		h1 br {
			display: none;
		}
	}

	h1.placeholder {
		display: none;
		pointer-events: none;
	}

		@media (min-width: 800px) {
			h1.placeholder {
				display: block;
			}
		}


	h1.main-title {
		display: block;
	}

		@media (min-width:450px) {
			h1.main-title {
				display: none;
			}
		}

h4 {
	font-family: 'Arial Black', Arial, sans-serif;
	margin-bottom: 1em;
	line-height: 110%;
}

	body[class*='page-template-page-berufe-studiengaenge'] h4 { color: #aaad00 !important; }

	body[class*='page-template-page-bildung-arbeit'] h4 { color: #EDAA00 !important; }

	body[class*='page-template-page-beratungsangebot'] h4 { color: #407CCA !important; }

.content p {
	margin-bottom: 1.3rem;
}

.flex-topic .topic {
	padding: 6vw;
	width: 100%;
}

	@media (min-width: 800px) {
		.flex-topic .topic {
			padding: 2.25rem;
			width: 66.66%;
		}
	}

	.topic h1 {
		color: #fff;
		padding-bottom: 1em;
		display: none;
	}

		@media (min-width: 450px) {
			.topic h1 {
				display: block;
			}
		}

	body[class*='page-template-page-bildung-arbeit'] .topic h1 { color: #edaa00; }

	body[class*='page-template-page-beratungsangebot'] .topic h1 { color: #407CCA; }

	.topic p {
		color: #393939;
		line-height: 135%;
	}

	.topic .content {

	}

		@media (min-width: 800px) {
			.topic .content {
				overflow-x: auto;
				height: 44.5vh;
			}
		}



	.topic .meta {
		border-top: 4px dotted #fff;
		margin: 1rem 0 0 0;
		padding: 1rem 0 0 0;
		flex-direction: column;
	}

		@media (min-width: 450px) {
			.topic .meta {
				flex-direction: row;
			}
		}

		.topic .meta .related {
			width: 100%;
			padding-bottom: 6vw;
			border-bottom: 4px dotted #fff;
			margin-bottom: 6vw;
		}

		.topic .meta .links {
			width: 100%;
		}

		.flex-meta .links + .links,
		.flex-meta .related + .links {
			margin-top: 3rem;
		}

		@media (min-width: 450px) {
			.topic .meta .related {
				width: 50%;
				padding-right: 1.5rem;
				overflow-x: hidden;
				overflow-y: auto;
				padding-bottom: 0;
				margin-bottom: 0;
				border-bottom: 0;
			}

			.topic .meta .links {
				width: 50%;
				overflow-x: auto;
			}
		}

		.topic .meta .related ul li a,
		.topic .meta .links ul li a {
			color: #fff;
			text-decoration: none;
/*
			overflow: hidden;
			text-overflow: ellipsis;
*/
			display: inline-block;
			white-space: nowrap;
		}

		.topic .meta .related ul,
		.topic .meta .links ul {
			color: #fff;
			list-style-type: square;
			padding-left: 15px;
		}

.subcategory-title {
	display: block;
}

	@media (min-width: 450px) {
		.subcategory-title {
			display: none;
		}
	}

.flex-topic .image {
	width: 100%;
	height: 50vw;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

	@media (min-width: 800px) {
		.flex-topic .image {
			width: 33.33%;
			height: auto;
		}
	}


	.flex-location .location-meta {
		height: calc(100% - 50vh);
	}

		@media (max-width: 499px) {
			.flex-location .location-meta {
				flex-direction: column;
			}
		}

		@media (min-width: 500px) {
			.flex-location .location-meta.flex-content {
				flex-direction: row !important;
			}
		}

		.flex-location .location-meta .shelf {
			width: 100%;
			color: #393939;
			padding: 6vw;
		}

			@media (min-width: 500px) {
				.flex-location .location-meta .shelf {
					width: 42%;
					padding: 0 1.5rem;
					border-right: 4px dotted #fff;
					margin: 1rem 0;
					height: auto;
/* 					height: calc(100% - 2rem); */
				}
			}

			.flex-location .location-meta .shelf::after {
				content: "";
				position: absolute;
				width: 4.25rem;
				height: 3.125rem;
				left: 0;
				bottom: -1rem;
				background: url(css/img/shelf-pattern.svg) no-repeat left bottom;
				display: none;
			}

				@media (min-width: 450px) {
					.flex-location .location-meta .shelf::after {
						display: block;
					}
				}

			.shelf .request-consultation,
			.flex-videos .request-consultation {
				font-size: 0.875rem;
				line-height: 110%;
				font-family: 'Arial Black', Arial, sans-serif;
				color: #fff;
				text-decoration: none;
				padding: 0.75rem 0.75rem 0.75rem 5rem;
				cursor: pointer;
				position: relative;
				display: block;
				margin: 0 auto;
				width: 100%;
				bottom: -4rem;
			}

				@media (min-width: 450px) {
					.shelf .request-consultation,
					.flex-videos .request-consultation {
						margin: 1rem auto;
					}
				}

			body[class*='page-template-page-berufe-studiengaenge'] .flex-videos .request-consultation { background: #aaad00 !important; }

			body[class*='page-template-page-bildung-arbeit'] .flex-videos .request-consultation { background: #EDAA00 !important; }

			body[class*='page-template-page-beratungsangebot'] .flex-videos .request-consultation { background: #407CCA !important; }

			@media (min-width: 500px) {
				.shelf .request-consultation,
				.flex-videos .request-consultation {
					position: absolute;
					bottom: 1rem;
					left: 1rem;
					right: 1rem;
					margin: 0;
					width: auto;
				}
			}

			@media (min-width: 800px) {
				.shelf .request-consultation,
				.flex-videos .request-consultation {
					position: absolute;
					/* bottom: 3.125rem; */
					bottom: 2rem;
					left: 2rem;
					right: 2rem;
					margin: 0;
					width: auto;
				}
			}

			.shelf .request-consultation::before,
			.flex-videos .request-consultation::before {
				content: "";
				position: absolute;
				display: block;
				width: 2.75rem;
				height: 70%;
				background: url(css/img/consultation.svg) no-repeat center center;
				background-size: contain;
				left: 1rem;
				top: 50%;
				transform: translateY(-50%);
			}


		.flex-location .location-meta .videos {
			width: 100%;
			padding: 6vw;
		}

			@media (min-width: 500px) {
				.flex-location .location-meta .videos {
					width: 58%;
					margin: 1rem 0;
					padding: 0 1.5rem;
				}
			}

			.flex-videos .videos-holder {
				display: flex;
				flex-flow: row wrap;
			}

			.flex-videos .video-item {
				width: 60%;
				margin-bottom: 0.75rem;
				display: block;
				background-size: 120% auto;
				background-size: cover;
				background-position: center center;
				position: relative;
				cursor: pointer;
			}

				.flex-videos .video-item::after {
					content: "";
					padding-top: 60%;
					display: block;
				}

				.flex-videos .video-item::before {
					content: "";
					display: block;
					width: 2.5rem;
					height: 2.5rem;
					background: url(css/img/video-play.svg) no-repeat center center;
					background-size: 100% 100%;
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translateX(-50%) translateY(-50%);
				}

		@media (max-width: 500px) {
			.flex-videos .video-item {
				width: 50%;
				width: calc(50% - 0.3rem);
				margin-right: 0.6rem;
			}

			.flex-videos .video-item:nth-child(2n) {
				margin-right: 0;
			}
		}

		@media (min-width: 500px) and (max-width: 800px) {
			.flex-videos .video-item {
				width: 33.33%;
				width: calc(33.33% - 0.6rem);
				margin-right: 0.6rem;
			}

			.flex-videos .video-item:nth-child(2n) {
				margin-right: 0;
			}
		}

.sidebar-box {
	margin-bottom: 1.375rem;
}

	.sidebar-box .label {
		text-align: left;
		background: #79a3d9;
		padding: 1rem 1rem 1rem 3rem;
		color: #fff;
		line-height: 125%;
		position: relative;
	}

		.sidebar-box .label::before {
			content: "";
			display: block;
			position: absolute;
			bottom: 0;
			left: 0;
			width: 2rem;
			height: 2rem;
			background: url(css/img/cover_pattern_beratung.svg) no-repeat left top;
			background-size: 100% auto;
		}

.biz-contact-compact {
	background: #79a3d9;
	padding: 1rem;
	color: #fff;
}

	.biz-contact-compact .contact-mini-pic {
		background: #eee;
		box-shadow: 0 0.5rem 2.5rem rgba(0,0,0,0.1);
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
		background-image: url(css/img/avatar.png);
		width: 20%;
		position: absolute;
		top: 0;
		left: 0;
	}

		.biz-contact-compact .contact-mini-pic::after {
			content: "";
			padding-top: 100%;
			display: block;
		}

	.biz-contact-compact .next-dates {

	}

		.biz-contact-compact .next-dates li {
			margin: 1em 0;
			padding-left: 25%;
			position: relative;
			min-height: 3.2em;
		}

.biz-contact-person-holder {

}

.biz-contact-person {
	margin-bottom: 5rem;
}

	.biz-contact-person-holder.has-multiple .biz-contact-person {
		display: none;
	}

		.biz-contact-person-holder.has-multiple .biz-contact-person:first-child {
			display: block;
		}

	.biz-contact-person+.biz-contact-compact {
		margin-top: -3rem;
	}

	.biz-contact-person .image {
		background: #eee;
		box-shadow: 0 0.5rem 2.5rem rgba(0,0,0,0.1);
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
	}

		.biz-contact-person .image::after {
			content: "";
			padding-top: 100%;
			display: block;
		}


.biz-request-consultation {
	margin-top: 2rem;
}

	.sidebar-box.biz-request-consultation .label {
		padding: 1.2rem 1rem;
	}

	.sidebar-box.biz-request-consultation .label::before {
		width: 3rem;
		height: 2.25rem;
		background: url(css/img/consultation.svg) no-repeat center center;
		background-size: contain;
		left: 0.625rem;
		top: 50%;
		transform: translateY(-50%);
	}

	.sidebar-box.biz-request-consultation .label::after { display: none; }

.area-slider {
	width: 100%;
	margin-bottom: 0;
	padding-bottom: 2rem;
	box-shadow: 0 0 0.5rem rgba(0,0,0,0.2);
}

	@media (min-width: 450px) {
		.area-slider {
			margin-bottom: 0;
			padding-bottom: 4rem;
			background: #fff;
			box-shadow: 0 0 4rem rgba(0,0,0,0.2);
		}
	}

	.area-slider .next,
	.area-slider .prev {
		width: 3rem;
		height: 3rem;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: auto 70%;
		display: block;
		cursor: pointer;
		z-index: 99;
	}


	.area-slider .next {
		right: 0;
		background-image: url(css/img/arrow-no-handle_next.svg);
	}

	.area-slider .prev {
		left: 0;
		background-image: url(css/img/arrow-no-handle_prev.svg);
	}



	@media (min-width: 750px) {
		.area-slider .prev {
			left: -3rem;
			background-image: url(css/img/area_back.svg);
			background-size: contain;
		}

		.area-slider .next {
			right: -3rem;
			background-image: url(css/img/area_next.svg);
			background-size: contain;
		}
	}

	.area-slider .image {
		width: 100%;
		height: auto;
		position: relative;
		background-color: #ccc;
	}


		body[class*='page-template-page-berufe-studiengaenge'] .area-slider .image { background-color: #c4c64d !important; }
		body[class*='page-template-page-bildung-arbeit'] .area-slider .image { background-color: #f3c44d !important; }
		body[class*='page-template-page-beratungsangebot'] .area-slider .image { background-color: #79a3da !important; }

		@media (min-width: 450px) {
			body[class*='page-template-page-berufe-studiengaenge'] .area-slider .image { background-color: #AAAD00 !important; }
			body[class*='page-template-page-bildung-arbeit'] .area-slider .image { background-color: #EDAA00 !important; }
			body[class*='page-template-page-beratungsangebot'] .area-slider .image { background-color: #407CCA !important; }
		}

		.area-slider .image .img {
			position: absolute;
			top: 0;
			right: 0;
			width: 50%;
			height: 100%;
			background-size: cover;
			background-repeat: no-repeat;
			background-position: right top;
		}

			@media (min-width: 450px) {
				.area-slider .image .img {
					width: 100%;
					left: 0;
					right: auto;
				}
			}

	.area-slider .image::after {
		content: "";
		padding-top: 33%;
		display: block;
	}

		@media (min-width: 450px) {
			.area-slider .image::after {
				padding-top: 100%;
			}
		}

		.area-slider .image .cover {
			position: absolute;
			width: 33%;
			height: 100%;
			top: 0;
			right: 17%;
			z-index: 9;

		}

			@media (min-width: 450px) {
				.area-slider .image .cover {
					width: 100%;
					height: 100%;
					right: auto;
					left: 0;
				}
			}

			body[class*='page-template-page-berufe-studiengaenge'] .area-slider .image .cover { fill: #c4c64d !important; }
			body[class*='page-template-page-bildung-arbeit'] .area-slider .image .cover { fill: #f3c44d !important; }
			body[class*='page-template-page-beratungsangebot'] .area-slider .image .cover { fill: #79a3da !important; }

			.area-slider .image .cover::after {
				content: "";
				position: absolute;
				width: 2rem;
				height: 4rem;
				bottom: -2rem;
				left: -152%;
				background: url(css/img/cover_pattern_berufe.svg) no-repeat left bottom;
				background-size: 100% auto;
				display: block;
			}

				body[class*='page-template-page-berufe-studiengaenge'] .area-slider .image .cover::after { background-image: url(css/img/cover_pattern_berufe.svg); }
				body[class*='page-template-page-bildung-arbeit'] .area-slider .image .cover::after { background-image: url(css/img/cover_pattern_bildung.svg); }
				body[class*='page-template-page-beratungsangebot'] .area-slider .image .cover::after { background-image: url(css/img/cover_pattern_beratung.svg); }

				@media (min-width: 450px) {
					body[class*='page-template-page-berufe-studiengaenge-category'] .area-slider .image .cover::after,
					body[class*='page-template-page-bildung-arbeit-category'] .area-slider .image .cover::after,
					body[class*='page-template-page-beratungsangebot-category'] .area-slider .image .cover::after {
						height: 4rem;
						bottom: 0;
					}
				}

			@media (min-width: 450px) {
				.area-slider .image .cover::after {
					display: block;
					width: 4rem;
					height: 8rem;
					bottom: -4rem;
					left: 0;
				}
			}

			.area-slider .image .cover h1 {
				color: #fff;
				position: absolute;
				bottom: 1rem;
				left: -140%;
				right: 1rem;
				margin-left: 0;
				margin-right: 1rem;
				font-size: 1rem;
				line-height: 100%;
				padding-left: 2rem;
			}

				@media (min-width: 450px) {
					.area-slider .image .cover h1 {
						left: 1rem;
						margin-left: 4rem;
						padding-left: 0;
					}
				}

				@media (min-width: 450px) {
					.area-slider .image .cover h1 {
						font-size: 1.5rem;
					}
				}

	.area-slider .left-nav-categories {
		padding: 1rem 2rem;
		margin-top: 0;
		margin-bottom: -3rem;
	}


ul.left-nav-categories-mobile,
ul.left-nav-categories-reduced {
	display: flex;
	align-items: flex-start;
	flex-wrap: nowrap;
	margin-bottom: 3vw;
}

ul.left-nav-categories-mobile {
	display: none;
}

ul.left-nav-categories-reduced {
	display: none;
	margin-bottom: 1rem;
	margin-top: 1rem;
}

	@media (min-width: 450px) {
		ul.left-nav-categories-mobile {
			display: none;
		}

		ul.left-nav-categories-reduced {
			display: flex;
		}
	}

		ul.left-nav-categories-mobile li,
		ul.left-nav-categories-reduced li {
			background: #ddd; /* $$$ get proper color from AI ***/
			height: 6px;
			text-indent: -1000px;
			overflow: hidden;
			display: block;
			width: 40%;
			margin: 0 1px;
		}

		ul.left-nav-categories-reduced li {
			margin: 0 0.5rem;
			height: 4px;
		}

			body[class*='page-template-page-berufe-studiengaenge'] ul.left-nav-categories-mobile li.current,
			body[class*='page-template-page-berufe-studiengaenge'] ul.left-nav-categories-reduced li.current { background: #aaad00; }
			body[class*='page-template-page-bildung-arbeit'] ul.left-nav-categories-mobile li.current,
			body[class*='page-template-page-bildung-arbeit'] ul.left-nav-categories-reduced li.current { background: #edaa00; }
			body[class*='page-template-page-beratungsangebot'] ul.left-nav-categories-mobile li.current,
			body[class*='page-template-page-beratungsangebot'] ul.left-nav-categories-reduced li.current { background: #407CCA; }

			ul.left-nav-categories-mobile li a,
			ul.left-nav-categories-reduced li a {
				display: block;
				position: absolute;
				width: 100%;
				height: 100%;
				top: 0;
				left: 0;
				text-indent: -1000px;
				overflow: hidden;
			}

ul.left-nav-categories {
	margin-top: 1.5rem;
	font-size: 0.9rem;
	display: none;
}

	@media (min-width: 450px) {
		ul.left-nav-categories {
			display: block;
		}
	}

	ul.left-nav-categories li {
		font-family: 'Arial Black', Arial, sans-serif;
		color: #b2b2b2;
		border-bottom: 1px solid #b2b2b2;
	}

		ul.left-nav-categories li a {
			display: block;
			padding: 0.4rem 2rem 0.4rem 0;
			text-decoration: inherit;
			font-size: 0.9rem;
		}

			@media (min-width: 1400px) {
				ul.left-nav-categories li a {
					font-size: 0.875rem;
					padding: 0.4rem 2rem 0.4rem 0;
				}
			}

		body[class*='page-template-page-berufe-studiengaenge'] ul.left-nav-categories li.current { color: #aaad00; }
		body[class*='page-template-page-bildung-arbeit'] ul.left-nav-categories li.current { color: #edaa00; }
		body[class*='page-template-page-beratungsangebot'] ul.left-nav-categories li.current { color: #407CCA; }

		ul.left-nav-categories li a .arrow {
			display: block;
			position: absolute;
			right: 0;
			width: 1rem;
			height: 1rem;
			top: 50%;
			transform: translateY(-50%);
		}

			ul.left-nav-categories li a .arrow svg path { fill: #b2b2b2; }

			body[class*='page-template-page-berufe-studiengaenge'] ul.left-nav-categories li.current .arrow svg path { fill: #aaad00; }
			body[class*='page-template-page-bildung-arbeit'] ul.left-nav-categories li.current .arrow svg path { fill: #edaa00; }
			body[class*='page-template-page-beratungsangebot'] ul.left-nav-categories li.current .arrow svg path { fill: #407CCA; }



@media (max-width: 450px) {
	body.page-template-page-berufe-studiengaenge .flex-content,
	body.page-template-page-berufe-studiengaenge-category .flex-content,
	body.page-template-page-bildung-arbeit .flex-content,
	body.page-template-page-bildung-arbeit-category .flex-content,
	body.page-template-page-beratungsangebot .flex-content,
	body.page-template-page-beratungsangebot-category .flex-content {
		display: block;
	}

	body.page-template-page-berufe-studiengaenge .main-wide,
	body.page-template-page-berufe-studiengaenge-category .main-wide,
	body.page-template-page-bildung-arbeit .main-narrow,
	body.page-template-page-bildung-arbeit-category .main-narrow,
	body.page-template-page-beratungsangebot .main-narrow,
	body.page-template-page-beratungsangebot-category .main-narrow,
	body.page-template-page-beratungsangebot-category .main-wide {
		background: #d4d57f;
		padding: 7vw 5vw 5vw 5vw;
		/*
		left: -3vw;
		width: 100vw;
		min-height: calc(100vh - 65vw);
		*/
		min-height: calc(100vh - 66vw);
		position: relative;
	}

		body.page-template-page-bildung-arbeit .main-narrow,
		body.page-template-page-bildung-arbeit-category .main-narrow { background: #f5d47f; }

		body.page-template-page-beratungsangebot .main-narrow,
		body.page-template-page-beratungsangebot-category .main-narrow,
		body.page-template-page-beratungsangebot-category .main-wide { background: #9FBDE4; }

	body.page-template-page-berufe-studiengaenge .main-wide::before,
	body.page-template-page-berufe-studiengaenge-category .main-wide::before,
	body.page-template-page-bildung-arbeit .main-narrow::before,
	body.page-template-page-bildung-arbeit-category .main-narrow::before,
	body.page-template-page-beratungsangebot .main-narrow::before,
	body.page-template-page-beratungsangebot-category .main-narrow::before,
	body.page-template-page-find-shelves .shelves-toggle::before,
	.overlay.questioniare-overlay .helpbox-content::before,
	.overlay.help .helpbox-content::before,
	.overlay.youtube-video .video-content::before,
	.overlay.search .search-form-holder::before,
	body.page-template-page-beratungsangebot-beratung .consultationbox-content::before {
		content: "";
		position: absolute;
		top: 0;
		width: 100%;
		height: 2vw;
		left: 0;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+0&1+0,0.3+0,0+100 */
		background: -moz-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
		z-index: 9;
	}
}


a.home-link {
	color: inherit;
	text-decoration: none;
	width: 100%;
	box-shadow: 0 0.4rem 2rem rgba(0,0,0,0.2);
	margin-top: 4vw;
	background: #fff;
	position: relative;
	padding-bottom: 3rem;
}

	@media (min-width: 800px) {
		a.home-link {
			width: 23vw;
			margin-top: 10vh;
			padding-bottom: 4rem;
			padding-bottom: 4rem;
		}

		body.home .sidebar {
			padding-top: 10vh;
		}
	}

	@media (min-width: 1400px) {
		a.home-link {
			width: 21.375vw;
			margin-right: 1.5625vw;
			margin-top: 15vh;
		}

		body.home .sidebar {
			padding-top: 15vh;
		}
	}

	a.home-link:nth-child(3n) {
		margin-right: 0;
	}

	a.home-link .image {
		display: block;
		background: #fff;
		width: 100%;
		position: relative;
	}

		a.home-link .image .img {
			position: absolute;
			width: 40%;
			height: 100%;
			right: 0;
			background-position: center center;
			background-size: cover;
			background-repeat: no-repeat;
			opacity: 0.4;
		}

			@media (min-width: 800px) {
				a.home-link .image .img {
					width: 100%;
					height: 100%;
					right: auto;
				}
			}

		a.home-link .image::after {
			content: "";
			padding-top: 40%;
			display: block;
		}

			@media (min-width: 800px) {
				a.home-link .image::after {
					padding-top: 100%;
				}
			}

		a.home-link .image .cover {
			position: absolute;
			width: 40%;
			height: 100%;
			top: 0;
			right: 0;
			z-index: 9;
		}

			@media (min-width: 800px) {
				a.home-link .image .cover {
					width: 100%;
					height: 100%;
					left: 0;
					right: auto;
				}
			}

			a.home-link.home-link-14 .image { background-color: #c4c64d }
			a.home-link.home-link-58 .image { background-color: #f3c44d }
			a.home-link.home-link-11 .image { background-color: #79a3da }

			@media (min-width: 800px) {
				a.home-link.home-link-14 .image { background-color: #aaad00 }
				a.home-link.home-link-58 .image { background-color: #edaa00 }
				a.home-link.home-link-11 .image { background-color: #407cca }
			}

			a.home-link.home-link-14 .image .cover svg path { fill: #c4c64d }
			a.home-link.home-link-58 .image .cover svg path { fill: #f3c44d }
			a.home-link.home-link-11 .image .cover svg path { fill: #79a3da }

			a.home-link .image .cover .title {
				position: absolute;
				color: #fff;
				font-family: 'Arial Black', Arial, sans-serif;
				left: -140%;
				margin-left: 3rem;
				right: 1.5rem;
				bottom: 1rem;
				font-size: 1.11rem;
				line-height: 110%;
			}

				@media (min-width: 450px) {
					a.home-link .image .cover .title {
						font-size: 1.6rem;
					}
				}

				@media (min-width: 800px) {
					a.home-link .image .cover .title {
						left: 5rem;
						right: 1.5rem;
						bottom: 1.5rem;
						top: auto;
						font-size: 1rem;
						margin-left: 1rem;
					}
				}

				@media (min-width: 1000px) {
					a.home-link .image .cover .title {
						left: 5rem;
						right: 1.5rem;
						bottom: 1.5rem;
						top: auto;
						font-size: 1.25rem;
						margin-left: 1.5rem;
					}
				}

				@media (min-width: 1400px) {
					a.home-link .image .cover .title {
						font-size: 1.5rem;
						line-height: 110%;
						left: 2.75rem;
						right: 1.5rem;
						bottom: 1.5rem;
						margin-left: 3rem;
					}
				}

			a.home-link .image::before {
				content: "";
				width: 3rem;
				height: 6rem;
				position: absolute;
				bottom: -3rem;
				left: 0rem;
				z-index: 19;
				background-size: 100% auto;
				background-repeat: no-repeat;
				background-position: left bottom;
			}

				a.home-link.home-link-14 .image::before { background-image: url(css/img/cover_pattern_berufe.svg); }
				a.home-link.home-link-58 .image::before { background-image: url(css/img/cover_pattern_bildung.svg); }
				a.home-link.home-link-11 .image::before { background-image: url(css/img/cover_pattern_beratung.svg); }



				@media (min-width: 800px) {
					a.home-link .image::before {
						width: 4rem;
						height: 8rem;
						bottom: -4rem;
						background-position: left bottom;
					}
				}

	a.home-link .arrow {
		width: 1rem;
		height: 1rem;
		position: absolute;
		bottom: 1rem;
		right: 1rem;
		z-index: 99;
	}

		@media (min-width: 800px) {
			a.home-link .arrow {
				width: 2rem;
		height: 2rem;
				bottom: 1rem;
				right: 0.75rem;
				top: auto;
				transform: none;
			}
		}


		a.home-link.home-link-14 .arrow svg path { fill: #aaad00 }
		a.home-link.home-link-58 .arrow svg path { fill: #edaa00 }
		a.home-link.home-link-11 .arrow svg path { fill: #407cca }


a.box-link {
	color: inherit;
	text-decoration: none;
}

	@media (max-width: 449px) {
		a.box-link.mobile-list-compact,
		a.box-link.mobile-list-slim {
			border-top: 1px solid #fff;
			border-bottom: 1px solid #fff;
			margin-top: -1px;
			display: block;
		}

		a.box-link.mobile-list-slim {
			padding: 0.4rem 0;
		}
	}

	@media (min-width: 450px) {
		a.box-link {
			width: 27vw;
		    margin-right: 2vw;
		    margin-bottom: 2vw;
		    box-shadow: 0 0.2rem 0.6rem rgba(0,0,0,0.2);
		}
	}

	@media (min-width: 1000px) {
		a.box-link {
			width: 18vw;
		    margin-right: 1.15vw;
		    margin-bottom: 1.15vw;
		}
	}

	@media (min-width: 1400px) {
		a.box-link {
			width: 15.3vw;
			margin-right: 1.5vw;
			margin-bottom: 1.5vw;
		}
	}

	@media (max-width: 999px) {
		.main-wide a.box-link:nth-child(2n),
		.main-narrow a.box-link:nth-child(2n) {
			margin-right: 0;
		}
	}

	@media (min-width: 1000px) and (max-width: 1399px) {
		.main-wide a.box-link:nth-child(3n),
		.main-narrow a.box-link:nth-child(3n) {
			margin-right: 0;
		}
	}

	@media (min-width: 1400px) {
		.main-wide a.box-link:nth-child(4n) {
			margin-right: 0;
		}
	}


	a.box-link .image {
		display: block;
		background: #fff;
		width: 100%;
		position: relative;
	}

		@media (max-width: 449px) {
			a.box-link.mobile-list-compact .image {
				display: none;
			}
		}

		@media (max-width: 449px) {
			a.box-link.mobile-list-slim .image {
				background: transparent;
			}
		}

		@media (min-width: 450px) {
			body[class*='page-template-page-berufe-studiengaenge'] a.box-link .image { background: #AAAD00 !important; }

			body[class*='page-template-page-bildung-arbeit'] a.box-link .image { background: #edaa00 !important; }

			body[class*='page-template-page-beratungsangebot'] a.box-link .image { background: #407cca !important; }
		}

		a.box-link .image::after {
			content: "";
			padding-top: 100%;
			display: block;
		}

		@media (max-width: 449px) {
			a.box-link .image::after {
				display: none;
			}
		}

		a.box-link .image .img {
			position: absolute;
			width: 100%;
			height: 100%;
			background-position: center center;
			background-size: cover;
			background-repeat: no-repeat;
			opacity: 0.8;
		}

			@media (max-width: 449px) {
				a.box-link.mobile-list-slim .image .img {
					display: none;
				}
			}

		a.box-link .image .cover {
			position: absolute;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			z-index: 9;
		}

			@media (max-width: 449px) {
				a.box-link.mobile-list-slim .image .cover {
					position: relative;
				}

				a.box-link.mobile-list-slim .image .cover svg {
					display: none;
				}
			}

			@media (min-width: 450px) {
				body[class*='page-template-page-berufe-studiengaenge'] a.box-link .image .cover { fill: #c4c64d !important; }

				body[class*='page-template-page-bildung-arbeit'] a.box-link .image .cover { fill: #f3c44d !important; }

				body[class*='page-template-page-beratungsangebot'] a.box-link .image .cover { fill: #79a3da !important; }
			}


			a.box-link .image .cover .arrow {
				width: 1.3125rem;
				height: 1.3125rem;
				position: absolute;
				bottom: -2.3125rem;
				right: 1rem;
				display: block;
			}


				body[class*='page-template-page-berufe-studiengaenge'] a.box-link .image .cover .arrow path { fill: #aaad00 !important; }
				body[class*='page-template-page-bildung-arbeit'] a.box-link .image .cover .arrow path { fill: #f3c44d !important; }
				body[class*='page-template-page-beratungsangebot'] a.box-link .image .cover .arrow path { fill: #79a3da !important; }


			a.box-link .image .cover .number {
				position: absolute;
				bottom: 1rem;
				left: 1.5rem;
				right: 1.5rem;
				display: block;
				font-family: 'Arial Black', Arial, sans-serif;
				color: #fff;
				font-size: 1rem;
			}

				a.box-link .image .cover .number i {
					font-size: 1em;
					display: inline-block;
					width: 1.8rem;
					color: #AAAD00;
				}

				@media (min-width: 450px) {
					a.box-link .image .cover .number {
						font-size: 0.875rem;
					}

					a.box-link .image .cover .number i {
						font-size: 1.7rem;
						color: #fff;
					}
				}

			@media (max-width: 449px) {
				a.box-link .image .cover .number {
					position: relative;
					left: auto;
					right: auto;
					bottom: auto;
					top: auto;
				}
			}

	a.box-link .label {
		font-size: 1rem;
		font-family: 'Arial Black', Arial, sans-serif;
		letter-spacing: -0.02em;
		line-height: 100%;
		display: block;
		padding: 0.5rem 0 0.5rem 2rem;
		text-overflow: ellipsis;
		overflow: hidden;
		color: #fff;
	}

		@media (max-width: 449px) {
			a.box-link.mobile-list-compact .label {
				position: relative;
			}

			a.box-link.mobile-list-compact .label br {
				display: none;
			}

			a.box-link.mobile-list-compact .label::before {
				content: "";
				width: 1.5rem;
				height: 1.1rem;
				left: 0;
				position: absolute;
				background: url(css/img/arrow.svg) no-repeat left center;
				background-size: 60% auto;
			}
		}

		@media (min-width: 450px) {
			a.box-link .label {
				background: #fff;
				padding: 0.625rem 3rem 0.625rem 0.8rem;
				height: 3.2rem;
				font-size: 0.875rem;
			}
		}

		@media (min-width: 1400px) {
			a.box-link .label {
				height: 3.2rem;
			}
		}


		@media (min-width: 450px) {
			body[class*='page-template-page-berufe-studiengaenge'] a.box-link .label { color: #AAAD00 !important; }
			body[class*='page-template-page-bildung-arbeit'] a.box-link .label { color: #edaa00 !important; }
			body[class*='page-template-page-beratungsangebot'] a.box-link .label { color: #407cca !important; }
		}


		body a.box-link .label.label-reduced {
			font-family: Arial, sans-serif;
			font-weight: normal;
			color: #8e8e8e !important;
			line-height: 125%;
			padding-right: 3.5rem;
			position: relative;
		}

			@media (max-width: 449px) {
				body a.box-link.mobile-list-slim .label.label-reduced {
					color: #AAAD00 !important;
				}
			}

		a.box-link .label.label-reduced .arrow {
			width: 1.5rem;
			height: 1.5rem;
			position: absolute;
			right: 1rem;
			top: 50%;
			transform: translateY(-50%);
			display: block;
		}

			body[class*='page-template-page-berufe-studiengaenge'] a.box-link .label.label-reduced .arrow svg path { fill: #AAAD00 !important; }

			body[class*='page-template-page-bildung-arbeit'] a.box-link .label.label-reduced .arrow svg path { fill: #edaa00 !important; }

			@media (max-width: 449px) {
				body[class*='page-template-page-berufe-studiengaenge'] a.box-link .label.label-reduced .arrow svg path { fill: #fff !important; }

			body[class*='page-template-page-bildung-arbeit'] a.box-link .label.label-reduced .arrow svg path { fill: #fff !important; }
			}

.virtual-keyboard {
	display: none;
	background: #c6c6c6;
	height: 352px;
	width: 845px;
	position: fixed;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%) translateY(100%);
	padding: 26px 0 0 0;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	user-select: none;
	z-index: 9999;
	opacity: 0;
	-webkit-transition: all 400ms cubic-bezier(0.275, 1, 0.610, 0.820); /* older webkit */
	-webkit-transition: all 400ms cubic-bezier(0.275, 1.580, 0.610, 0.820);
	   -moz-transition: all 400ms cubic-bezier(0.275, 1.580, 0.610, 0.820);
	     -o-transition: all 400ms cubic-bezier(0.275, 1.580, 0.610, 0.820);
	        transition: all 400ms cubic-bezier(0.275, 1.580, 0.610, 0.820); /* custom */

	-webkit-transition-timing-function: cubic-bezier(0.275, 1, 0.610, 0.820); /* older webkit */
	-webkit-transition-timing-function: cubic-bezier(0.275, 1.580, 0.610, 0.820);
	   -moz-transition-timing-function: cubic-bezier(0.275, 1.580, 0.610, 0.820);
	     -o-transition-timing-function: cubic-bezier(0.275, 1.580, 0.610, 0.820);
	        transition-timing-function: cubic-bezier(0.275, 1.580, 0.610, 0.820); /* custom */
}

	@media (min-width: 1400px) {
		.virtual-keyboard {
			display: block;
		}
	}

	.virtual-keyboard.visible {
		transform: translateX(-50%) translateY(0%);
		opacity: 1;
	}

	.virtual-keyboard .close {
		position: absolute;
		width: 2.25rem;
		height: 2.25rem;
		right: 0.75rem;
		top: 0.75rem;
		background: url(css/img/keyboard-close.svg) no-repeat center center;
		background-size: 58.33333333%;
		cursor: pointer;
		z-index: 9;
	}

	.virtual-keyboard .row {
		display: flex;
		flex-flow: row wrap;
		justify-content: center;
	}

	.virtual-keyboard .key {
		background: #393939;
		font-size: 1.125rem;
		color: #c6c6c6;
		width: 55px;
		height: 48px;
		border-radius: 4px;
		line-height: 48px;
		text-align: center;
		margin: 4px 3.5px;
		box-shadow: 0 0.3em 1em rgba(0,0,0,0.4);
		cursor: pointer;
		position: relative;
	}

		.virtual-keyboard .key:active {
			box-shadow: none;
			background: #333;
		}

	.virtual-keyboard .key.uppercase::after {
		content: "";
		height: 0.8rem;
		width: 0.8rem;
		background: url(css/img/uppercase.svg) no-repeat center center;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translateX(-50%) translateY(-50%);
		opacity: 0.5;
	}
		.virtual-keyboard .key.uppercase.upper-on::after {
			opacity: 1;
		}

	.virtual-keyboard .key.spacebar {
		width: 310px;
	}

	.virtual-keyboard .key.delete {
		width: 90px;
		text-transform: uppercase !important;
		font-weight: bold;
		letter-spacing: 0.1em;
		color: #acacac;
		font-size: 0.9rem;
	}

.overlay.questionnaire-overlay {
	display: none;
}

.overlay.visible.questionnaire-overlay {
	display: block;
}

.overlay {
	position: fixed;
	z-index: 999;
	top: 0;
	left: 0;
	width: 100%;
	opacity: 0;
	background: #FAFAFA;
	pointer-events: none;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

	.overlay.visible {
		opacity: 1;
		pointer-events: all;
	}

/*
	@media (max-width: 1399px) {
		.overlay.view.wide {
			padding: 7rem 5.5vw 5.5vw 5.5vw
		}
	}
*/

	.overlay.wide .overlay-wrap {
		width: 100%;
		margin: 0 auto;
		height: 100%;
	}

		@media (min-width: 1400px) {
			.overlay.wide .overlay-wrap {
				width: 90%;
				margin: 0 auto;
			}
		}

	.overlay.view {
		padding-bottom: 0;
	}

	.overlay.appointment,
	.overlay.questionnaire-result {
		background: rgba(255,255,255,0.8);
	}

.search-form-holder {
	background: #e5e5e5;
	height: calc(100vh - 10rem);
	overflow: hidden;
}

	.search-form-holder #search {
		font-size: 2.0625rem;
		line-height: 110%;
		color: #407cca;
		outline: none;
		width: 90%;
		max-width: 845px;
		margin: 0 auto;
		display: block;
		border: 0;
		background: #fff;
		padding: 1.875rem;
		margin-top: 1.875rem;
	}

	.search-form-holder .searchresults {
		height: 90vh;
		width: 90%;
		max-width: 845px;
		margin: 0 auto;
		margin-top: 0.375rem;
		background: #fff;
		overflow: hidden;
		overflow-y: auto;
	}

	.search-form-holder .close {
		width: 2.25rem;
		height: 2.25rem;
		z-index: 9;
		position: absolute;
		right: 1rem;
		top: 1rem;
		background: url(css/img/close.svg) no-repeat center center;
		background-size: 58.333333%;
		cursor: pointer;
	}

	.search-form-holder .no-search-results {
		font-size: 2rem;
		padding: 4rem 2rem;
		text-align: center;
		color: #ccc;
	}

	.search-form-holder .searchresults ol {
		padding: 0.21rem 0;
	}

		.search-form-holder .searchresults ol li {
			margin: 0.5625rem 0;
		}

			.search-form-holder .searchresults ol li a {
				display: block;
				padding: 0 2rem 0 4rem;
				height: 2rem;
				line-height: 2rem;
				text-decoration: none;
				color: 393939;
			}

				.search-form-holder .searchresults ol li a::before {
					content: "";
					position: absolute;
					left: 0.75rem;
					width: 2rem;
					height: 2rem;
					top: 0;
					background: #ececec url(css/img/arrow.svg) no-repeat center center;
					background-size: 52% 52%;
				}

				.search-form-holder .searchresults ol li:hover a::before {
					background-color: #407cca;
				}

	@media (max-width: 449px) {
		.overlay.search > .overlay-wrap {
			left: -3vw;
			width: 100vw;
		}

		.overlay.search .search-title {
			height: auto;
			background: #fff;
			padding: 0.5rem 0;
			margin: 0 3vw;
			box-shadow: 0 0 0.5rem rgba(0,0,0,0.2);
		}

			.overlay.search .search-title h1 {
				color: #407cca;
				line-height: 110%;
				padding-left: 3rem;
				float: none;
			}

			.overlay.search .search-title::after {
				content: "";
				display: block;
				position: absolute;
				left: 0;
				top: 0;
				height: 100%;
				width: 2.16rem;
				background: url(css/img/icon_search.svg) no-repeat center center;
			}

		.overlay.search .search-form-holder.spacing-up {
			background: #ECECEC;
			padding: 6vw;
			min-height: calc(100vh - 14vw - 12vw - 3rem );
			margin: 0 3vw 3vw 3vw;
			box-shadow: none;
		}

			.overlay.search .search-form-holder #search {
				width: 100%;
				font-size: 1.2rem;
				padding: 1rem;
				margin: 0;
			}

			.overlay.search .searchresults {
				margin: 3vw 0 0 0;
				width: 100%;
			}

			.overlay.search .search-form-holder .searchresults ol li a {
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

		.overlay.search .close {
			display: none;
		}
	}

.appointmentbox {
	background: #9FBDE4;
	width: 100%;
	max-width: 540px;
	padding: 2rem 8rem 0.5rem 2rem;
	box-shadow: 0 0 2rem rgba(0,0,0,0.3);
	position: absolute;
	bottom: 370px;
	left: 50%;
	transform: translateX(-50%);
	color: #fff;
}

	@media (max-width: 1200px) {
		.appointmentbox {
			bottom: 50%;
			transform: translateX(-50%) translateY(50%);
		}
	}

	.appointmentbox .success {
		background: #73b887;
		padding: 0.5rem;
		color: #fff;
		margin-bottom: 0.5rem;
		display: none;
	}

		.appointmentbox.done .success {
			display: block;
		}

	.appointmentbox.error {
		background: #e3a0a3;
	}

	.appointmentbox .close {
		width: 2.25rem;
		height: 2.25rem;
		z-index: 9;
		position: absolute;
		right: 0.75rem;
		top: 0.75rem;
		background: url(css/img/keyboard-close.svg) no-repeat center center;
		background-size: 58.33333%;
		cursor: pointer;
	}

		@media (min-width: 1400px) {
			.appointmentbox .close {
				width: 2.25rem;
				height: 2.25rem;
			}
		}

	.appointmentbox h4 {
		color: #fff;
	}

	.appointmentbox .appointment-time {
		background: rgba(255,255,255,0.2);
		padding: 1rem;
		width: 100%;
		margin-bottom: 0.5rem;
		color: #2d5384;
	}

	.appointmentbox input[type='text'] {
		font: inherit;
		background-color: #fff;
		color: #407CCA;
		padding: 1rem;
		width: 100%;
		margin-bottom: 0.5rem;
		outline: none;
		border: 0;
	}

	.appointmentbox input[type='submit'] {
		font: inherit;
		background-color: #407CCA;
		color: #fff;
		padding: 1rem 4rem;
		margin: 0 auto;
		outline: none;
		border: 0;
		display: block;
	}


@media (max-width: 449px) {
	body.page-template-page-beratungsangebot-beratung > .view > h1 {
		background: #79a3d9;
		color: #fff;
		padding: 0.5rem 1rem 0.5rem 3rem;
		box-shadow: 0 0 0.5rem rgba(0,0,0,0.2);
		position: relative;
	}

	body.page-template-page-beratungsangebot-beratung > .view > h1::before {
		content: "";
		height: 100%;
		width:  2.16rem;
		background: #f09;
		top: 0;
		left: 0;
		position: absolute;
		display: block;
		background: url(css/img/cover_pattern_beratung.svg) no-repeat center top;
		background-size: 100% auto;
	}
}

.consultationbox {
	background: #9FBDE4;
	width: 100%;
}

	.consultationbox-content {
		padding: 0;
	}

		@media (min-width: 450px) {
			.consultationbox-content {
				padding: 6vw;
			}
		}

		@media (min-width: 800px) {
			.consultationbox-content {
				padding: 4.5rem 2rem;
			}
		}

	.consulation-services-list {
		display: block;
	}

		@media (min-width: 450px) {
			.consulation-services-list {
				display: flex;
				flex-flow: row wrap;
				padding: 0.5rem 0;
				border-bottom: 1px solid #fff;
			}
		}

		.consulation-services-list.header {
			font-family: 'Arial Black', Arial, sans-serif;
			color: #407CCA;
			border-bottom: 0;
			margin-bottom: 1rem;
			display: none;
		}

			@media (min-width: 450px) {
				.consulation-services-list.header {
					display: flex;
				}
			}

			.consulation-services-list.header div {
				color: #407CCA;
			}


		.consultation_title {
			font-family: 'Arial Black', Arial, sans-serif;
			color: #fff;
			background: #79a3d9;
			padding: 3vw 18vw 3vw 6vw;
			border-bottom: 1px solid #fff;
		}

			@media (max-width: 449px) {
				.consultation_title {
					cursor: pointer;
				}

				.consultation_title::after {
					content: "";
				    display: block;
				    position: absolute;
				    width: 6vw;
				    height: 6vw;
				    right: 6vw;
				    top: 50%;
				    transform: translateY(-50%) rotate(90deg);
				    background: url(css/img/arrow-no-handle_next.svg) no-repeat center center;
				}
			}

			@media (min-width: 450px) {
				.consultation_title {
					width: 20%;
					padding: 0 1rem 0 0;
					background: none;
					border-bottom: 0;
				}
			}

		.consultation_target_group {
			color: #407CCA;
			border-bottom: 1px solid #407CCA;
			padding: 0.5rem 6vw;
		}

			@media (min-width: 450px) {
				.consultation_target_group {
					width: 25%;
					padding: 0 1rem 0 0;
					border-bottom: none;
				}
			}

		.consultation_time {
			color: #407CCA;
			border-bottom: 1px solid #407CCA;
			padding: 0.5rem 6vw;
		}

			@media (min-width: 450px) {
				.consultation_time {
					width: 25%;
					padding: 0 1rem 0 0;
					border-bottom: none;
				}
			}

		.consultation_cost {
			color: #407CCA;
			border-bottom: 1px solid #407CCA;
			padding: 0.5rem 6vw;
		}

			@media (min-width: 450px) {
				.consultation_cost {
					width: 20%;
					padding: 0 1rem 0 0;
					border-bottom: none;
				}
			}

		.consultation_actions {
			padding: 0.5rem 6vw;
		}

			@media (min-width: 450px) {
				.consultation_actions {
					width: 10%;
					position: relative;
					padding: 0;
				}
			}

		@media (max-width: 449px) {
			.consulation-services-list .consultation_target_group,
			.consulation-services-list .consultation_time,
			.consulation-services-list .consultation_cost,
			.consulation-services-list .consultation_actions {
				display: none;
			}

			.consulation-services-list:nth-child(2) .consultation_target_group,
			.consulation-services-list:nth-child(2) .consultation_time,
			.consulation-services-list:nth-child(2) .consultation_cost,
			.consulation-services-list:nth-child(2) .consultation_actions {
				display: block;
			}
		}

	.book-consultation-icon {
		display: block;
		position: relative;
		width: 2.5rem;
		height: 1.5rem;
		background: url(css/img/icon_mail.svg) no-repeat left center;
		cursor: pointer;
	}

	@media (min-width: 450px) {
		.book-consultation-icon {
			position: absolute;
			transform: translateY(-50%);
			top: 50%;
			right: 0;
			background-position: right center;
		}

		.answer-text .book-consultation-icon  {
			position: relative;
			transform: none;
			top: auto;;
			right: auto;
			background-position: left center;
			margin-top: 1rem;
		}
	}


	.consulationbox-closing-text {
		color: #407CCA;
		margin: 2rem 0 0 0;
	}

.helpbox {
	background: #e5e5e5;
	width: 100%;
}

	.helpbox .helpbox-title {
		height: 4.25rem;
	}

		@media (min-width: 450px) {
			.helpbox .helpbox-title {
				height: 4.25rem;
			}
		}

		@media (min-width: 1400px) {
			.helpbox .helpbox-title {
				height: 5.5rem;
			}
		}

		.helpbox .helpbox-title h1 {
			font-family: 'Arial Black', Arial, sans-serif;
			color: #fff;
			line-height: 4.25rem;
		}

			@media (min-width: 1400px) {
				.helpbox .helpbox-title h1 {
					line-height: 5.5rem;
				}
			}

		.helpbox .close {
			width: 2.25rem;
			height: 2.25rem;
			z-index: 9;
			position: absolute;
			right: 1rem;
			top: 1rem;
			background: url(css/img/close.svg) no-repeat center center;
			background-size: 58.333333%;
			cursor: pointer;
		}


	.helpbox-content {
		padding: 6vw;
	}

	.helpbox-content-list {
		color: #8E8E8E;
	}

		@media (min-width: 800px) {
			.helpbox-content {
				padding: 4.5rem;
			}

			.helpbox-content-list {
				font-size: 1.5rem;
				margin: 0 auto;
			}
		}

	.helpbox-content-list ul {

	}

	.helpbox-content-list ul li {

	}

		.helpbox-content-list ul li a {
			display: block;
			padding: 0.5rem 2rem 0.5rem 3rem;
			line-height: 2rem;
			text-decoration: none;
			cursor: pointer;
			border-bottom: 1px solid #C6C6C6;
		}

		.helpbox-content-list ul li a::before {
			content: "";
			position: absolute;
			left: 0rem;
			width: 2rem;
			height: 2rem;
			top: 50%;
			transform: translateY(-50%);
			background: #407cca url(css/img/arrow.svg) no-repeat center center;
			background-size: 52% 52%;
		}


	@media (max-width: 449px) {
		.helpbox {
			border: none;
			box-shadow: none;
			background: transparent;
		}

		.overlay.help > .overlay-wrap > h1 {
			background: #fff;
			padding: 0.5rem 0 0.5rem 3rem;
			position: relative;
			box-shadow: 0 0 0.5rem rgba(0,0,0,0.2);
			line-height: 110%;
		}

			.overlay.help > .overlay-wrap > h1::after {
				content: "";
				display: block;
				position: absolute;
				height: 100%;
				width: 2.16rem;
				background: url(css/img/icon_help.svg) no-repeat center center;
				top: 0;
				left: 0;
			}

		.overlay.help > .overlay-wrap > .flex-content {

		}

		.overlay.help .helpbox-title {
			height: auto;
			background: transparent;
			padding: 0 6vw 6vw 6vw;
		}

			.overlay.help .helpbox-title h1 {
				color: #407cca;
				line-height: 120%;
				padding-left: 4rem;
				min-height: 3rem;
				float: none;
			}

			.overlay.help .helpbox-title::after {
				left: 6vw;
				right: auto;
				height: 3rem;
				width: 3rem;
				background-image: url(css/img/icon_help_black.svg);
			}

		.overlay.help .helpbox-content {
			background: #ECECEC;
			padding: 6vw;
			min-height: calc(100vh - 14vw - 12vw - 3rem );
		}

		.overlay.help .close {
			display: none;
		}
	}


.videobox {
	background: #e5e5e5;
	width: 100%;
}

	.videobox .videobox-title {
		height: 4.25rem;
	}

		@media (min-width: 450px) {
			.videobox .videobox-title {
				height: 4.25rem;
			}
		}

		@media (min-width: 1400px) {
			.videobox .videobox-title {
				height: 5.5rem;
			}
		}

		.videobox .videobox-title h1 {
			font-family: 'Arial Black', Arial, sans-serif;
			color: #fff;
			line-height: 4.25rem;
		}

			@media (min-width: 1400px) {
				.videobox .videobox-title h1 {
					line-height: 5.5rem;
				}
			}

		.videobox .close {
			width: 2.25rem;
			height: 2.25rem;
			z-index: 9;
			position: absolute;
			right: 1rem;
			top: 1rem;
			background: url(css/img/close.svg) no-repeat center center;
			background-size: 58.333333%;
			cursor: pointer;
		}




	.videobox-content {
		padding: 6vw;
	}

	.videobox-content-list {
		color: #8E8E8E;
	}

		@media (min-width: 800px) {
			.videobox-content {
				padding: 4.5rem;
			}

			.videobox-content-list {
				font-size: 1.5rem;
				margin: 0 auto;
			}
		}

	.videobox-content-list ul {

	}

	.videobox-content-list ul li {

	}

		.videobox-content-list ul li a {
			display: block;
			padding: 0.5rem 2rem 0.5rem 3rem;
			line-height: 2rem;
			text-decoration: none;
			cursor: pointer;
			border-bottom: 1px solid #C6C6C6;
		}

		.videobox-content-list ul li a::before {
			content: "";
			position: absolute;
			left: 0rem;
			width: 2rem;
			height: 2rem;
			top: 50%;
			transform: translateY(-50%);
			background: #407cca url(css/img/arrow.svg) no-repeat center center;
			background-size: 52% 52%;
		}


	@media (max-width: 449px) {
		.videobox {
			border: none;
			box-shadow: none;
			background: transparent;
		}

		.overlay.youtube-video > .overlay-wrap > h1 {
			background: #fff;
			padding: 0.5rem 0 0.5rem 3rem;
			position: relative;
			box-shadow: 0 0 0.5rem rgba(0,0,0,0.2);
			line-height: 110%;
		}

			.overlay.youtube-video > .overlay-wrap > h1::after {
				content: "";
				display: block;
				position: absolute;
				height: 100%;
				width: 2.16rem;
				background: url(css/img/icon_help.svg) no-repeat center center;
				top: 0;
				left: 0;
			}

		.overlay.youtube-video > .overlay-wrap > .flex-content {

		}

		.overlay.youtube-video .videobox-title {
			height: auto;
			background: transparent;
			padding: 0 6vw 6vw 6vw;
		}

			.overlay.youtube-video .videobox-title h1 {
				color: #407cca;
				line-height: 120%;
				padding-left: 4rem;
				min-height: 3rem;
				float: none;
			}

			.overlay.youtube-video .videobox-title::after {
				left: 6vw;
				right: auto;
				height: 3rem;
				width: 3rem;
				background-image: url(css/img/icon_help_black.svg);
			}

		.overlay.youtube-video .videobox-content {
			background: #ECECEC;
			padding: 6vw;
			min-height: calc(100vh - 14vw - 12vw - 3rem );
		}


	}


	.youtube-video-holder {
		width: 100%;
		background: #000;
		position: relative;
	}

		.youtube-video-holder::after {
			content: "";
			display: block;
			padding-top: 56.25%;
		}

		.youtube-video-holder iframe {
			position: absolute;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
		}


.shelves-finder {
	min-height: 100%;
	width: 100%;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

	.shelves-finder .shelves-finder-title {
		background: #407cca;
		height: 4.25rem;
		width: 100%;
		padding-left: 2rem;
	}

		@media (min-width: 450px) {
			.shelves-finder .shelves-finder-title {
				height: 4.25rem;
			}
		}

		@media (min-width: 1400px) {
			.shelves-finder .shelves-finder-title {
				height: 5.5rem;
			}
		}

		.shelves-finder .shelves-finder-title h1 {
			font-family: 'Arial Black', Arial, sans-serif;
			color: #fff;
			line-height: 4.25rem;
		}

			@media (min-width: 1400px) {
				.shelves-finder .shelves-finder-title h1 {
					line-height: 5.5rem;
				}
			}

		.shelves-finder .shelves-finder-title::after {
			content: "";
			display: block;
			background: url(css/img/icon_shelves.svg) no-repeat center center;
			background-size: cover;
			width: 4.25rem;
			height: 4.25rem;
			position: absolute;
			top: 0;
			right: 0;
		}

			@media (min-width: 450px) {
				.shelves-finder .shelves-finder-title::after {
					width: 4.25rem;
					height: 4.25rem;
				}
			}

			@media (min-width: 1400px) {
				.shelves-finder .shelves-finder-title::after {
					width: 5.5rem;
					height: 5.5rem;
				}
			}


.shelves-finder .map {
	position: absolute;
	width: 100%;
	width: calc(100% - 1rem);
	top: 0;
	left: 100%;
	background: #fff;
	margin-left: 1rem;
	display: none;
	border: 1rem solid #fff;
	box-shadow: 0 0 1rem rgba(0,0,0,0.1);
}

	.shelves-finder.active-shelf .map {
		display: block;
	}

	.shelves-finder .map img {
		width: 100%;
		height: auto;
	}

.shelves-toggle {
	display: flex;
	flex-flow: row wrap;
	width: 80%;
}

	.shelves-topic {
		width: 100%;
		margin-bottom: 3rem;
		padding: 3.125rem;
	}

	.shelves-topic.topic-jobs {
		background: #c3c54c;
	}

	.shelves-topic.topic-studies {
		background: #f2c34c;
	}

	@media (min-width: 1100px) {
		.shelves-topic {
			width: 50%;
			margin-bottom: 0;
		}
	}

	.shelves-topic-title {
		font-family: 'Arial Black', Arial, sans-serif;
		color: #fff;
		margin-top: 0.5rem;
		margin-bottom: 1.5rem;
		padding-left: 1rem;
		font-size: 1.5rem;
	}

	@media (max-width: 449px) {
		.shelves-topic-title {
			cursor: pointer !important;
			position: relative;
			pointer-events: all !important;
			z-index: 9999;
		}

		.shelves-topic-list ol li a {
			cursor: pointer !important;
			position: relative;
			pointer-events: all !important;
			z-index: 9999;
		}
	}

	.shelves-topic-list {

	}

		.shelves-topic-list ol {
			padding-right: 0.5rem;
		}

			.shelves-topic-list ol li {
				padding: 0.3rem 0.3rem 0.1rem 1rem;
				cursor: pointer;
				font-family: 'Arial Black', Arial, sans-serif;
				border-bottom: 1px solid #fff;
			}

			.shelves-topic-list ol li a {
				text-decoration: none;
			}

			.shelves-topic-list ol li span {
				display: inline-block;
				overflow: hidden;
			}

			.shelves-topic-list ol li span.num {
				color: #fff;
				width: 1.5rem;
			}

			.shelves-topic-list ol li span.title {
				width: calc(100% - 4rem);
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				color: #fff;
			}

			.shelves-topic-list ol li span.arrow {
				position: absolute;
				right: 0.3rem;
				top: 50%;
				transform: translateY(-50%);
				width: 2rem;
				height: 1.8rem;
				background: url(css/img/forward.svg) no-repeat right center;
				background-size: 50% auto;
			}


	.shelves-finder.active-shelf {
		width: 50%;
	}

		.shelves-finder.active-shelf .shelves-topic {
			width: 100%;
		}


	@media (max-width: 449px) {

		.shelves-toggle {
			width: 100%;
		}

		.shelves-topic {
			padding: 0;
		}

		.shelves-finder .shelves-topic-title {
			font-size: 1rem;
		}

		body.page-template-page-find-shelves > .view > h1 {
			padding: 0.5rem 0 0.5rem 3rem;
			background: #fff;
			position: relative;
			box-shadow: 0 0 0.5rem rgba(0,0,0,0.2);
		}

		body.page-template-page-find-shelves > .view > h1::before {
			content: "";
			position: absolute;
			display: block;
			height: 100%;
			width: 2.16rem;
			top: 0;
			left: 0;
			background: url(css/img/icon_shelves.svg) no-repeat center center;
		}

		body.page-template-page-find-shelves .shelves-finder.spacing-up {
			margin-top: 0;
		}

		.flex-content.shelves-finder {
			background: transparent;
		}

		.shelves-finder .shelves-finder-title {
			height: auto;
			background: transparent;
			padding: 0 6vw 6vw 6vw;
		}

			.shelves-finder .shelves-finder-title h1 {
				color: #407cca;
				line-height: 120%;
				padding-left: 4rem;
				min-height: 3rem;
			}

			.shelves-finder .shelves-finder-title::after {
				left: 6vw;
				right: auto;
				height: 3rem;
				width: 3rem;
				background-image: url(css/img/icon_shelves_black.svg);
			}

		.flex-content.shelves-finder .shelves-toggle {
			padding: 0;
			background: #ECECEC;
			display: block;
		}

		.shelves-finder.active-shelf .shelves-topic {
			margin: 0 !important;
		}

		.shelves-finder .shelves-topic {
			margin: 0;
		}

		.shelves-finder .shelves-topic-title {
			margin: 0;
			padding: 3vw 18vw 3vw 6vw;
			color: #fff;
			background: #444;
		}

			.shelves-finder .shelves-topic-title::after {
				content: "";
				display: block;
				position: absolute;
				width: 6vw;
				height: 6vw;
				right: 6vw;
				top: 50%;
				transform: translateY(-50%) rotate(90deg);
				background: url(css/img/arrow-no-handle_next.svg) no-repeat center center;
				pointer-events: none;
			}


			.shelves-finder .shelves-topic-title.topic-jobs { background: #AAAD00 }
			.shelves-finder .shelves-topic-title.topic-studies { background: #EDAA00 }
			.shelves-finder .shelves-topic-title.topic-consultation { background: #407CCA }

		.shelves-finder .shelves-topic-list ol {
			padding: 3vw 0;
		}

		.shelves-finder .shelves-topic-list ol li,
		.shelves-finder .shelves-topic-list ol li:nth-child(even) {
			background: transparent;
			padding: 1vw 6vw;
			margin-top: -1px;
			border-bottom: 0;
		}


		.shelves-topic .shelves-topic-list {
			display: none;
		}

		.shelves-topic:nth-child(1) .shelves-topic-list {
			display: none;
		}

		.shelves-finder .shelves-topic-list ol li::before,
		.shelves-finder .shelves-topic-list ol li::after {
			content: "";
			display: block;
			position: absolute;
			left: 6vw;
			right: 6vw;
			height: 1px;
			background: #fff;
			top: 0;
		}

			.shelves-finder .shelves-topic-list ol li::after {
				top: auto;
				bottom: 0;
			}

		.shelves-finder .shelves-topic-list ol li span.num {
			width: 3.5rem;
			padding-left: 2rem;
			line-height: 1.3rem;
		}

		.shelves-finder .shelves-topic-list ol li span.arrow {
			height: 1.3rem;
			width: 1.3rem;
			right: auto;
			left: 6vw;
			background: #407cca url(css/img/arrow.svg) no-repeat center center;
			background-size: 52% 52%;
		}

		.shelves-finder.active-shelf {
			width: 100% !important;
		}

		.shelves-finder .map {
			position: relative !important;
			margin: 0 !important;
			margin-left: 0 !important;
			background: #fff;
			left: 0 !important;
			width: 100% !important;

		}

		.shelves-topic {
			background: #ccc !important;
		}
	}

.overlay.browser {

}

	.overlay.browser iframe {
		width: 100%;
		height: 80vh;
		margin-top: 2.5rem;
	}

	.overlay.browser .close {
		width: 2.25rem;
		height: 2.25rem;
		z-index: 9;
		position: absolute;
		right: 1rem;
		top: 1rem;
		background: url(css/img/close.svg) no-repeat center center;
		background-size: 58.333333%;
		cursor: pointer;
	}

.logo-big {
	width: 80%;
	background: url(css/img/logo-big.svg) no-repeat left top;
	background-size: contain;
}


	@media (min-width: 500px) {
		.logo-big {
			width: 60%;
		}
	}

	@media (min-width: 800px) {
		.logo-big {
			width: 33.33%;
		}
	}

	.logo-big::after {
		content: "";
		display: block;
		padding-top: 24%;
	}

/* Colors */
.c-standard { color: #407cca; }
.c-blue { color: #407CCA; }
.c-green { color: #AAAD00; }
.c-yellow { color: #edaa00; }

.t-indent { }

@media (min-width: 1400px) {
	.t-indent {
		margin-left: 27.8%;
	}
}

/*
 * Full width: 1478px
 * 1st Indent: 412px

/* Helper Classes */

.clear { clear: both; }
strong { font-family: 'Arial Black', Arial, sans-serif; }
em { font-style: italic; }
a, a:link, a:visited, a:hover, a:focus { color: inherit; }

.mobile-only { display: block; }
	@media (min-width: 450px) {
		.mobile-only {
			display: none !important;
		}
	}

@media (min-width: 1600px) {
	.touch-hand {
		width: 10rem;
		height: 10rem;
		background: url(css/img/touch.svg) no-repeat center center;
		background-size: contain;
		position: fixed;
		transform: rotate(-30deg);
		transform-origin: top center;
		z-index: 99;
		pointer-events: none;
		display: none;
		bottom: 4rem;
		right: 15rem;

	}

	.touch-hand.visible {
		animation: 6000ms ease 0s normal none infinite animate-hand;
		display: block;
	}


	.touch-hand-circle {
		content: "";
		border: 8px solid #B3B3B3;
		width: 50px;
		height: 50px;

		border-radius: 100%;
		z-index: 9;
		opacity: 0;
		z-index: 9;
		position: fixed;
		bottom: 17rem;
		right: 28.7em;

		transition: all 0.2s ease-in-out;
		pointer-events: none;

		display: none;
	}

	.touch-hand-circle.visible {
		animation: 6000ms ease 0s normal none infinite animate-circle;
		display: block;
	}

}


.questionnaire-holder {
	/* border: 2px solid #fff; */
	margin: 2rem 0 0 0;
	position: relative;
	width: 100%;

}

	.questionnaire-tagline {
		text-transform: uppercase;
		font-size: 0.8em;
		line-height: 100%;
		letter-spacing: 0.1em;
		margin-bottom: 0.75em;
		display: block;
		padding: 1rem 1rem 0.5rem 1rem;
	}

	.questionnaire-item {
		box-shadow: 0 0 2em rgba(0,0,0,0.1);
		background: #467bbf;
		color: #fff;
		display: block;
		pointer-events: none;
		opacity: 0;
		transform: translateY(0%);
		transition: all 0.3s ease-in-out;
		position: absolute;
		width: 100%;
	}

	.questionnaire-item.current {
		pointer-events: all;
		opacity: 1;
		z-index: 999;
		transform: translateY(0);
		position: absolute;
	}

	.questionnaire-item.answered {
		pointer-events: none;
		opacity: 0;
		transform: translateY(-30%);
	}


	.questionnaire-item .question,
	.questionnaire-item .answer-text {
		font-size: 1em;
		line-height: 120%;
		font-weight: 700;
		padding: 1rem;
		padding-top: 0rem;
	}

		@media (min-width: 750px) {
			.questionnaire-item .question,
			.questionnaire-item .answer-text {
				font-size: 1.25rem;
				line-height: 120%;
				padding: 2rem;
			}
		}

	.questionnaire-item .answer-text {
		display: none;
	}

	.questionnaire-item .answer-text.current {
		display: block;
	}

	.questionnaire-item .answers {
		margin: 2rem 0 0 0;
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between;
		padding: 1rem;
		background: rgba(255,255,255,0.1);
	}


		@media (min-width: 750px) {
			.questionnaire-item .answers {
				margin: 4rem 0 0 0;
				padding: 1.5rem 2rem;
			}
		}

	.questionnaire-item .answer {
		cursor: pointer;
		background: #fff;
		color: #467bbf;
		font-weight: bold;
		font-size: 1.2rem;
		display: block;
		padding: 0.5em 1em;
		border-radius: 0.25rem;

		transition: all 0.2s ease-in-out;
	}

		.questionnaire-item .answer:hover {
			transform: scale(1.05);
		}


.questionnaire-start-button {
	text-decoration: underline;
	cursor: pointer;
}


	.questionnaire-overlay .close {
		width: 2.25rem;
		height: 2.25rem;
		z-index: 9;
		position: absolute;
		right: 1rem;
		top: 1rem;
		background: url(css/img/close.svg) no-repeat center center;
		background-size: 58.333333%;
		cursor: pointer;
	}


.questionnaire-box {
	position: relative;
}


.overlay.questionnaire-overlay {
	/* background: transparent; */
	padding: 1.5rem;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 90%;
	max-width: 700px;
	box-shadow: 0 0 3em rgba(0,0,0,0.2);
	transform: translateX(-50%) translateY(-50%);
	z-index: 999999;
	max-height: 90vh;
	overflow: auto;
}

	@media (max-width: 600px) {
		.overlay.questionnaire-overlay {
			font-size: 14px;
			line-height: 130%;
			padding: 1rem;
		}

		.overlay.questionnaire-overlay .close {
			top: 0;
			right: 0;
			width: 1.5rem;
			height: 1.5rem;
		}

		.overlay.questionnaire-overlay h1 {
			/* word-break: break-all; */
		}
	}

	.overlay.questionnaire-overlay h1 {
		padding-right: 3rem;
		margin-bottom: 0.5em;
	}

	.overlay.questionnaire-overlay .close {
		top: 0;
	}