/* Contents:
 * 
 * 01 COMMON THINGS [ typography + variables ]
 * 02 ICONS
 * 03 NAVIGATION 
 * 04 FORMS 
 * 05 PAGE HEADER
 * 06 PAGE FOOTER
 * 07 PAGE CONTENTS
 * 08 MODULS 
 * 09 GRID
 * 10 COLORS
 * 11 CUSTOM STYLES
 * 12 BOOTSTRAP OVERRIDES
 */


/*** 01 COMMON THINGS [ typography + variables ] ***/
/**___ Variables ___**/
:root {
	--white-color: #fcfcfb;
	--off-white-color: #e6f2ff; /* was #e7ecea (light grey); switched to light blue */
	--gray-color: #bfbfbf;

	--primary-color: #285a34;
	--primary-color-bright: #2e964d;
	--secondary-color: #ce724a;
	--tertiary-color: #f8c44b;
}

.primary {
	color: var(--primary-color);
}

.secondary {
	color: var(--secondary-color);
}

.tertiary {
	color: var(--tertiary-color);
}

.white {
	color: var(--white-color);
}

.gray {
	color: var(--gray-color);
}

.back-primary {
	background-color: var(--primary-color);
}

.back-primary.translucent {
	background-color: color-mix(in srgb, var(--primary-color), transparent 75%);
}

.back-white {
	background-color: var(--white-color);
}

/**___ FONT ___**/

/* fontAwesome */
@font-face {
	font-family: 'FontAwesome';
	src: url('../fonts/fontAwesome/fontawesome-webfont.eot?v=4.3.0');
	src: url('../fonts/fontAwesome/fontawesome-webfont.eot?#iefix&v=4.3.0') format('embedded-opentype'),
		url('../fonts/fontAwesome/fontawesome-webfont.woff2?v=4.3.0') format('woff2'),
		url('../fonts/fontAwesome/fontawesome-webfont.woff?v=4.3.0') format('woff'),
		url('../fonts/fontAwesome/fontawesome-webfont.ttf?v=4.3.0') format('truetype'),
		url('../fonts/fontAwesome/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* Basic Body styling */
body {
	font-weight: 400;
	font-size: 15px;
	line-height: 1.5;
	max-width: 1920px;
	margin: auto;
}

/* Correct footer placement */
body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

body > main {
	flex:1;
}

/* Default Link styling */
a {
	text-decoration: none;
	color: var(--primary-color-bright);
}
a:hover {
	cursor: pointer;
	color: var(--primary-color);
}

strong,
b {
	font-weight: 600;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 600;
}

h1 {
	font-size: 1.4em;
}

h2 {
	font-size: 1.3em;
	margin-top: 0em;
}

h3 {
	font-size: 1.2em;
}

h4 {
	font-size: 1.1em;
}

h5,
h6 {
	font-size: 1em;
}

h4,
h5,
h6 {
	margin: 0;
}

h3+h5,
h5+h4 {
	margin-top: 0.3em;
}

/**/
h4+p {
	margin-top: 0.75em
}

h6+p {
	margin-top: 0;
}

p {
	margin: 0.5em 0;
}

p+h5,
p+h4,
p+h6 {
	margin: 0.7em 0 0.3em;
}

p+h2,
p+h3 {
	margin: 1.2em 0 0.8em;
}

h3>a:after {
	content: '»';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto 0;
	height: 1em;
	line-height: 90%;
}

/* max-width is set for ie8 */
h3>a {
	font-size: 1em;
	padding-right: 1em;
	position: relative;
	text-decoration: underline;
	max-width: 90%;
}

h3>a:hover {
	text-decoration: none;
}

@media all and (min-width: 768px) {
	body {
		font-size: 14px;
	}

	p+h5,
	p+h6 {
		margin: 1em 0 0.5em;
	}

	h1 {
		font-size: 1.8em;
	}

	h2 {
		font-size: 1.8em;
		margin-top: 0em;
	}

	h3 {
		font-size: 1.57em;
	}

	h4 {
		font-size: 1.29em;
	}
}

@media all and (min-width: 992px) {
	body {
		font-size: 16px;
	}

	h1 {
		font-size: 2em;
	}

	h2 {
		font-size: 2em;
	}

	h3 {
		font-size: 1.57em;
	}

	h4 {
		font-size: 1.29em;
	}

	a {
		padding: 0;
	}

	.md-text-right {
		text-align: right;
	}
}

small {
	font-size: 0.9em;
}

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

.text-right {
	text-align: right;
}

.block-center {
	margin-right: auto;
	margin-left: auto;
}

.list-centered {
	float: left;
	left: 50%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	width: auto;
}

.list-centered>li {
	right: 50%;
	text-align: center;
	width: auto;
}

.nowrap {
	white-space: nowrap;
}

.reset-nowrap {
	white-space: normal;
}

.reset-font-weight {
	font-weight: 400;
}

ul {
	list-style: outside none none;
	margin: 0;
	padding: 0;
}

.review-comment {
	padding: 15px;
	margin: 0.5em 0;
}

.review-type {
	text-transform: uppercase;
	background-color: var(--primary-color);
	font-size: 60%;
}

.col-description {
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-color: var(--off-white-color) transparent;
}

/*** 02 ICONS _________________***/

/**___ social network icons ___**/
.icon-link {
	display: inline-block;
	font-size: 2em;
	height: 2em;
	line-height: 3em;
	overflow: hidden;
	padding-left: 1.5em;
	position: relative;
	text-indent: -9999px;
}

.icon-after:after {
	font-family: "FontAwesome";
	font-size: 2em;
	vertical-align: -10%;
	margin-left: 0.25em;
	margin-right: 0.25em;
}

.icon-after-twitter:after,
.icon-link-twitter:before {
	color: #55acee;
	content: '\f099';
}

.icon-after-google-plus:after,
.icon-link-google-plus:before {
	color: #dd4b39;
	content: '\f0d5';
}

.icon-after-facebook:after,
.icon-link-facebook:before {
	color: #3b5999;
	content: '\f230';
}

.icon-after-smile:after,
.icon-after-frown:after {
	font-size: 1.5em;
	line-height: 1em;
}

.icon-after-smile:after {
	content: '\f118';
}

.icon-after-frown:after {
	content: '\f119';
}


.icon:before {
	font-family: "FontAwesome";
}

.icon-flow:before {
	padding-right: 0.5em;
}

.icon-attention:before {
	content: "\f06a";
}

.icon-check:before {
	content: "\f058";
}

/*** 03 NAVIGATION _______________ ***/
/* Specific styling for menu items */
.nav > li > a[title="Kontakt"][href="/kontakt/"] {
    color: #ce7249 !important;
}
.nav > li > a[title="Für Verbraucher"][href*="/content/verbraucher"] {
    color: #245530 !important;
}
.nav > li > a[title="FAQ"][href="/#faq"] {
    color: #245530 !important;
}
header .gallery {
	display: flex;
}
header .gallery img {
	width: 20%;
}

.navbar-container {
	transform: translateX(-50%);
}
.navbar-container.translate-down {
	transform: translate(-50%, 50%);
}

/**___ mobile menu ___**/
#mobile-menu-wrapper {
	float: left;
	width: 10%;
}

#mobile-menu-wrapper+.search-form {
	width: 89%;
	float: right;
}

.icon-bar {
	border-radius: 1px;
	display: block;
	position: relative;
	height: 2px;
	width: 80%;
	background: #fff;
}

.mobile-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	padding: 1.5em 15px;
	width: 100%;
	z-index: 2;
}

.mobile-menu.nav-pills>li {
	float: none;
	display: block;
	border-top: 1px solid #6a8da4;
	margin-left: 2px;
}

.mobile-menu>li:last-child {
	border-bottom: 1px solid #6a8da4;
}

.mobile-menu>li.spacer {
	height: 2.3em;
}

.mobile-menu.nav>li>a {
	display: block;
	white-space: normal;
}

/* bootstrap rewrites */
.nav>li>a,
.nav>li>span {
	padding: 0.3em 1em 0.4em;
	display: inline-block;
	font-weight: 600;
	white-space: nowrap;
	/*ie 8*/
}

.nav-pill-highlighted {
	font-weight: 600;
}

.pagination-nav {
	padding: 1em 0 0;
}

.pagination-nav nav {
	margin: 0 -15px;
}

/* TODO write special class for efficiency */
#more-slider-nav.pagination-nav {
	padding: 0;
}

#sort-nav>h4 {
	float: left;
}

#sort-nav select {
	margin: 0.2em 0.4em;
}

#sort-nav {
	padding-bottom: 0.5em;
}

.pagination-nav .nav,
#sort-nav .nav {
	padding-left: 0;
}

/** TODO: better solution for problem alphabetical filter nav and wraps and li + li = margin-left **/
.pagination-nav .nav-pills>li:first-child {
	margin-left: 2px;
}

.pagination-nav .nav-pills>li {
	margin-bottom: 2px;
}

.alphabetical-nav>li>a,
.alphabetical-nav>li.active>span,
.alphabetical-nav>li.inactive>span {
	width: 3em;
	text-align: center;
}

.filter-nav>.nav-pills>li {
	float: none;
	display: inline-block;
	vertical-align: middle;
}

/**/

@media all and (min-width: 768px) {
	.pagination-nav .nav {
		text-align: left;
		font-size: 0.9em !important;
	}

	.pagination-nav p {
		margin: 0.3em 0;
		text-align: left;
	}
}


/*** 04 FORMS _________________***/
form {
	position: relative;
}

label {
	display: block;
	font-weight: 400;
}

input,
textarea {
	width: 99%;
	border: 1px solid;
}

input[type=radio],
input[type=checkbox],
input[type=submit] {
	width: auto;
}

textarea {
	min-height: 200px;
}

abbr[title] {
	border-bottom: none;
}

.form-required {
	font-size: 0.8em;
}

.form-messages {
	font-weight: bold;
}

.has-error label {
	font-weight: bold;
}

.form-cover-loading {
	background-image: url(/app2/img/loading.gif);
	background-repeat: no-repeat;
	background-position: center center;
}

/**___ buttons ___**/
.btn {
	border-color: transparent;
}

.btn.btn-small {
	font-size: 0.9em;
	padding: 0.3em 0.7em;
}

.btn.btn-xxl {
	display: block;
	font-size: 1.57em;
	text-align: center;
}

.btn-link-style {
	background: transparent;
	border: none;
	padding: 0.5em 0;
}

.btn-link-style:hover {
	text-decoration: underline;
}

/**___ sp rating form ___**/
.rating-input-group {
	display: inline-block;
}

.rating-input-group>* {
	float: right;
}

.radio-icon,
.rating-wording {
	display: inline-block;
	position: relative;
	width: auto;
	border: none;
}

.rating-wording {
	line-height: 2.25em;
	padding-left: 0.5em;
}

.radio-icon {
	position: absolute;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;
}

.radio-icon+label {
	display: inline-block;
	padding-left: 2.25em;
	position: relative;
	width: 0;
}

.radio-icon+label:before {
	cursor: pointer;
	font-family: "FontAwesome";
	font-size: 1.5em;
	position: relative;
	margin-left: -1.25em;
}

.radio-icon:focus {
	outline: none;
}

/**___ search form ___**/
.search-form {
	position: relative;
	width: 100%;
	height: 100%;
}

.search-form-query {
	display: block;
	padding: 0.5em 25% 0.5em 1em;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.search-form-btn {
	position: absolute;
	top: 0;
	right: 0;
	height: 100% !important;
}

/*** 05 PAGE HEADER________________ ***/
#main-header-home {
	display: none;
	margin-left: -15px;
	position: relative;
	top: 30%;
}

#main-header-home>.logo-row {
	width: auto;
	padding: 10px 15px 0 15px;
	max-width: 290px;
}

#main-header-home>.logo-row>a {
	font-weight: bolder;
	color: #fff
}

#main-header-home>.search-row {
	position: relative;
	max-width: 60%;
	padding: 15px
}

#main-header {
	padding: 0.5em 0 1em;
	border-bottom: 1px solid;
}

#main-header h2 {
	margin-bottom: 0
}

#main-header img.logo {
	margin: 0;
	max-height: 32px;
}

.user-area {
	position: absolute;
	top: 0;
	right: 0;
}

@media all and (max-width: 767px) {

	#main-header-home {
		display: none !important;
	}

	#main-header {
		display: block !important;
	}
}

@media all and (min-width: 768px) {
	#main-header img.logo {
		margin: -10px 0 0;
		max-height: 44px;
	}

	#home #main-header-home {
		display: block;
	}

	#home #main-header {
		display: none;
	}

	#main-header {
		padding: 1.3em 0;
	}

	#main-header {
		height: 85px;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 100;
		border-bottom: 1px solid #bbb;
		max-width: 1920px;
		margin: auto;
	}

	.anchor {
		position: relative;
		top: -96px;
		left: 0;
	}
}

@media all and (min-width: 992px) {
	#main-header {
		padding: 1em 0;
	}

	#main-header img.logo {
		margin: 0;
		max-height: 48px;
	}
}

@media all and (min-width: 1200px) {
	#main-header img.logo {
		margin: -6px 0 0;
	}
}

/**___ content header ___**/
.home img {
	max-width: 100%;
	max-height: auto;
}

#content-header-box {
	position: relative;
	height: 100%;
	clear: both;
}

#content-header-h1 {
	position: absolute;
	left: 0;
	max-width: 100%;
	max-height: 3.2em;
}

#service-provider #content-header-h1 {
	width: 80%;
}

.content-header-h1-bg {
	position: relative;
	max-width: 100%;
	min-height: 1.3em;
	display: inline-block;
	/*float: left;*/
	padding: 0 15px;
}

@media all and (min-width: 768px) {
	#content-header-bg {
		margin-top: 5px;
		margin-bottom: 0;
		height: 240px;
	}

	#content-header-h1 {
		bottom: 0.5em;
		top: inherit;
	}

	#home #content-header-bg {
		margin-top: 0;
		background-position: center 0;
	}
}

@media all and (min-width: 1200px) {

	#content-header-bg.map,
	#content-header-bg {
		height: 240px;
	}

	.ie #content-header-bg {
		background-size: auto 100%;
	}
}


/*** 06 PAGE FOOTER __________________***/
#main-footer {
	padding: 2em 0;
	font-size: 0.9em;
}

.no-decoration {
	text-decoration: none
}

#main-footer img {
	max-width: 100%;
	height: auto;
}

/*** 07 PAGE CONTENTS _________________***/

/**___ common ___**/


article+section,
article+aside {
	margin-top: 2em;
}

.eye-catcher {
	border-left: 15px solid;
}

.nav-list>li {
	white-space: nowrap;
	overflow: hidden;
	/* aarcos test this in mobile */
	text-overflow: ellipsis;
	display: inline-block;
	max-width: 100%;
}

.nav-list>li {
	display: block;
}

.content-padding-top {
	padding-top: 2em
}

.content-padding-bottom {
	padding-bottom: 2em
}

.no-top-margin {
	margin-top: 0;
}

@media (min-width: 768px) {
	.fixed-header-margin {
		margin-top: 75px;
	}
}


/**___ home ___**/

/** image boxes -> nav trade, nav cites, nav teaser **/
.teaser-item {
	padding-top: 1em;
	padding-bottom: 1em;
	margin-bottom: 1em;
}

.teaser-header-bg {
	position: relative;
	margin-bottom: 1em;
	background-image: url(/app2/img/subtrade/subtrade-min-saturation.jpg);
}

.teaser-header-bg,
.nav-header-bg {
	display: block;
	padding-top: 20%;
	padding-bottom: 0;
	background-size: cover;
	-moz-background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

#teaser-img-finanzberater {
	background-position: 0 0;
}

#teaser-img-baufinanzierung {
	background-position: 0 20%;
}

#teaser-img-steuerberater {
	background-position: 0 40%;
}

#teaser-img-versicherungsmakler {
	background-position: 0 60%;
}

#teaser-img-zahnarzt {
	background-position: 0 80%;
}

#teaser-img-osteopathie {
	background-position: 0 100%;
}

#nav-dienstleistungen,
#nav-auto-motorrad-verkehr,
#nav-bauen-renovieren,
#nav-bildung,
#nav-bio,
#nav-computer-elektronik,
#nav-einkaufen-bestellen,
#nav-essen-trinken,
#nav-garten,
#nav-gesundheit,
#nav-hobby-freizeit-reisen,
#nav-hochzeit,
#nav-pflege,
#nav-recht-geld,
#nav-schoenheit-wellness,
#nav-sport-fitness,
#nav-tiere,
#nav-unternehmensbedarf,
#nav-vereine,
#nav-verleih-vermietung,
#nav-werbung-medien {
	background-image: url('../img/categories/categories-min-saturation.jpg');
}

#nav-dienstleistungen {
	background-position: 0 0%;
}

#nav-auto-motorrad-verkehr {
	background-position: 0 5%;
}

#nav-bauen-renovieren {
	background-position: 0 10%;
}

#nav-bildung {
	background-position: 0 15%;
}

#nav-bio {
	background-position: 0 20%;
}

#nav-computer-elektronik {
	background-position: 0 25%;
}

#nav-einkaufen-bestellen {
	background-position: 0 30%;
}

#nav-essen-trinken {
	background-position: 0 35%;
}

#nav-garten {
	background-position: 0 40%;
}

#nav-gesundheit {
	background-position: 0 45%;
}

#nav-hobby-freizeit-reisen {
	background-position: 0 50%;
}

#nav-hochzeit {
	background-position: 0 55%;
}

#nav-pflege {
	background-position: 0 60%;
}

#nav-recht-geld {
	background-position: 0 65%;
}

#nav-schoenheit-wellness {
	background-position: 0 70%;
}

#nav-sport-fitness {
	background-position: 0 75%;
}

#nav-tiere {
	background-position: 0 80%;
}

#nav-unternehmensbedarf {
	background-position: 0 85%;
}

#nav-vereine {
	background-position: 0 90%;
}

#nav-verleih-vermietung {
	background-position: 0 95%;
}

#nav-werbung-medien {
	background-position: 0 100%;
}

#nav-aachen,
#nav-augsburg,
#nav-berlin,
#nav-bonn,
#nav-bremen,
#nav-dresden,
#nav-duesseldorf,
#nav-frankfurt-am-main,
#nav-freiburg-im-breisgau,
#nav-hamburg,
#nav-hannover,
#nav-koeln,
#nav-leipzig,
#nav-luebeck,
#nav-magdeburg,
#nav-mainz,
#nav-muenchen,
#nav-muenster,
#nav-nuernberg,
#nav-stuttgart {
	background-image: url('../img/cities/cities-min-saturation.jpg');
}

#nav-aachen {
	background-position: 0 0%;
}

#nav-augsburg {
	background-position: 0 5%;
}

#nav-berlin {
	background-position: 0 10%;
}

#nav-bonn {
	background-position: 0 15%;
}

#nav-bremen {
	background-position: 0 20%;
}

#nav-dresden {
	background-position: 0 25%;
}

#nav-duesseldorf {
	background-position: 0 30%;
}

#nav-frankfurt-am-main {
	background-position: 0 35%;
}

#nav-freiburg-im-breisgau {
	background-position: 0 40%;
}

#nav-hamburg {
	background-position: 0 45%;
}

#nav-hannover {
	background-position: 0 50%;
}

#nav-koeln {
	background-position: 0 55%;
}

#nav-leipzig {
	background-position: 0 60%;
}

#nav-luebeck {
	background-position: 0 65%;
}

#nav-magdeburg {
	background-position: 0 70%;
}

#nav-mainz {
	background-position: 0 75%;
}

#nav-muenchen {
	background-position: 0 80%;
}

#nav-muenster {
	background-position: 0 85%;
}

#nav-nuernberg {
	background-position: 0 90%;
}

#nav-stuttgart {
	background-position: 0 95%;
}

/**___ hybrid, category, city, search ___**/
.shorten-review-details {
	font-size: 0.9em;
	font-weight: 600;
	margin: -2px -15px 0;
	padding: 0.0em 15px;
	position: relative;
	border-top: 2px solid #fff;
}

.shorten-review-details>.star-ratio {
	font-size: 1.3em;
	margin-right: 1em;
}

#refine-search-box:target~.toggle-content {
	display: block !important;
}

#resultMap {
	height: 23em;
	border: 2px solid;
}

.cover-close-btn {
	float: right;
	display: none;
	padding: 0em 0.7em 0.3em;
}


/**___ service provider ___**/

/* opening hours */
.o-day {
	display: inline-block;
	width: 2em;
}

.sp-logos {
	padding: 15px;
}

@media all and (min-width: 768px) {

	.sp-eye-catcher {
		max-height: 300px;
		max-width: 20%;
		position: absolute;
		bottom: 0;
		right: 0;
		margin-bottom: -0.7em;
		width: auto;
		z-index: 2;
	}

	.sp-eye-catcher {
		max-width: 30%;
		padding: 15px;
	}
}

@media all and (min-width: 1200px) {

	.sp-eye-catcher,
	.sp-logo-wrapper {
		max-height: 400px;
	}
}


/**___ static pages ___**/
ol {
	padding-left: 1rem;
}
ol li {
	margin: 12px 0;
}

/* service provider info page */
ul.list-style-check>li {
	margin: 0.5em 0 0.5em 25px;
}

ul.list-style-check>li:before {
	content: '\f00c';
	font-family: "FontAwesome";
	margin-left: -27px;
	padding-right: 10px;
}

.icon-before:before {
	font-family: "FontAwesome";
	content: "";
	position: absolute;
	top: 0.25em;
	left: 15px;
	vertical-align: -10%;
}

.icon-before {
	padding-left: 3em;
}

.icon-before-star:before {
	content: "\f005";
}

.icon-before-chart:before {
	content: "\f012";
}

.icon-before-search:before {
	content: "\f002";
}

/* TODO REMOVE when layout is changed to layout with header image */
nav .nav-links li {
	display: inline-block;
	margin-left: -15px;
}

/**/

blockquote {
	display: block;
	font-style: italic;
	margin: 0;
	padding: 1.5em 15px 0.5em 3em;
	position: relative;
}

blockquote:before {
	content: "\201C";
	font-family: Georgia, serif;
	font-size: 60px;
	font-weight: 600;
	position: absolute;
	top: 0;
	left: 5px;
}

blockquote+strong {
	display: block;
	text-align: right;
	font-size: 0.9em;
}

blockquote+strong>a {
	font-weight: 400;
}

.blockquote-list>li {
	padding: 0.5em 15px;
	border-bottom: 1px solid #fff;
}

.toggle-header:before {
	font-family: "FontAwesome";
	content: '\f0d7';
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto 0;
	height: 0.5em;
	line-height: 0.5em;
	left: 15px;
}

.toggle-header.close:before {
	content: '';
}

/* TODO cleanup!!! do not double same value */
.toggle-header-left-padding {
	padding-left: 25px;
}

.toggle-header {
	position: relative;
	padding: 0 0 0 25px;
}

a.toggle-header {
	position: relative;
	display: block;
	padding: 0 0 0 35px;
}

.toggle-content {
	display: none;
	border-top: 1px dotted var(--off-white-color);
}

.toggle-header:target+.toggle-content {
	display: block;
}

h4.quotes-toggle-header {
	font-size: 1.2em;
	line-height: 1.3em;
	margin: 0 -15px;
	padding: 0.5em 0 0.5em 45px;
	background: var(--off-white-color);
	border-bottom: 1px solid #fff;
}

h4.quotes-toggle-header small {
	font-weight: 400;
}

.quotes-toggle-content {
	margin: 0 -15px;
	background: var(--off-white-color);
	border-top: none;
	border-bottom: 1px solid #fff;
}

.quotes-toggle-content blockquote {
	margin-left: -15px;
}

/*** 08 MODULS ***/

/**___ modul cookie box ___**/
#cookiebox {
	bottom: 0;
	font-size: 16px;
	left: 0;
	line-height: 24px;
	min-height: 24px;
	padding: 10px 0;
	position: fixed;
	text-align: center;
	width: 100%;
	z-index: 100;
}

#cookiebox .close {
	height: 24px;
	margin-left: 10px;
	vertical-align: middle;
	width: 24px;
}

#cookiebox a {
	text-decoration: underline;
}

/**___ modul cover ___**/
.cover {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	cursor: pointer;
}

a.cover {
	margin: 0;
	padding: 0;
}

.cover+nav {
	position: relative;
	z-index: 2;
}

/*___ modul confirm ___*/
.confirm {
	border: 1px solid;
	display: none;
	height: 9em;
	margin: auto;
	max-width: 100%;
	max-height: 100%;
	padding: 0.5em 15px;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	overflow: auto;
	width: 300px;
	z-index: 99;
}

.confirm>h5 {
	padding-right: 2em;
}

.confirm.form-confirm {
	height: auto;
	margin-top: 0;
	max-height: none;
	position: relative;
	overflow: visible;
	font-size: 0.9em;
}

.confirm-content {
	height: auto;
	margin: 2em 0 0.5em;
	max-height: none;
}

.btn-close {
	position: absolute;
	top: 0;
	right: 0;
	padding: 0.25em 0.75em
}

/**___ modul video ___**/
.btn-play {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 0;
	height: 0;
	padding: 30px 0 0 60px
}

.btn-play:before {
	font-family: "FontAwesome";
	content: '\f16a';
	font-size: 60px;
	position: absolute;
	top: 0;
	left: 0;
	margin-top: -30px;
}

/**___ modul slider ___**/
.slider {
	position: relative;
	height: auto;
}

.slider-viewport {
	position: relative;
	overflow: hidden;
	white-space: nowrap;
}

.slider-canvas {
	position: relative;
	display: block;
	left: 0;
	width: auto;
}

.slider-canvas>.slide {
	display: inline-block;
	margin: 0;
}

.slide>iframe {
	border: none;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

/* content-slider */
.slider-canvas>.anchor {
	display: inline-block;
}

.slider-canvas>.anchor {
	position: static;
	height: 0;
	overflow: visible;
}

/* pure css fallback (gallery slider) */
.no-js .slider-canvas>.img-parent:last-child {
	display: block;
	left: 0;
}

.no-js .slider-canvas>.img-parent {
	display: none;
	position: relative;
	top: 0;
	left: 100%;
}

.no-js .slider-canvas>*:target~.img-parent:last-child {
	display: none;
	left: 100%;
}

.slider-canvas>*:target+.img-parent,
.slider-canvas>*:target+.img-parent:last-child {
	display: block;
	left: 0;
}

/** end of pure css fallback **/

.slider-button {
	color: #fff;
	background: transparent;
	border: none;
	height: 100%;
	opacity: 0.75;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
	/*filter: alpha(opacity=75);*/
	position: absolute;
	top: 0;
	text-shadow: 1px 0 3px rgb(50, 107, 67);
	width: 30px;
}

.slider-button:hover,
.slider-button:active,
.slider-button:focus {
	border: none;
	color: rgb(50, 107, 67);
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	/*filter: alpha(opacity=100);*/
	outline: 0;
	text-shadow: 0 0px 8px #fff;
}

.slider-button:before {
	font-family: "FontAwesome";
	;
	font-size: 60px;
	position: relative;
	left: 0;
	/*vertical-align: center;*/
}

.slider-button-right {
	right: 0;
}

.slider-button-right:before {
	content: '\f105';
}

.slider-button-left {
	left: 0;
}

.slider-button-left:before {
	content: '\f104';
}

@media all and (min-width:768px) {
	.slider-button {
		color: rgb(50, 107, 67);
		opacity: 0.3;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
		/*filter: alpha(opacity=30);*/
	}

	.slider-button-right {
		margin-right: -30px;
		padding-right: 0;
	}

	.slider-button-left {
		margin-left: -30px;
		padding-left: 0;
	}
}


/*** 09 GRID ________________________________***/
.divider-bold {
	border-width: 4px !important;
}

@media all and (max-width: 767px) {
	.xs-clearfix {
		clear: both;
	}
}

@media all and (max-width: 991px) {
	.sm-clearfix {
		clear: both;
	}
}

@media all and (min-width: 768px) {
	.container {
		max-width: 94%;
	}

	.container .container {
		width: 100%;
		max-width: 100%;
	}

}

.img-parent {
	position: relative;
	display: block;
	height: 0;
	padding: 75% 0 0 0;
	width: 100%;
	overflow: hidden;
	margin-top: 15px;
	margin-bottom: 15px;
	border: 1px solid;
}

.img-parent>a,
.img-parent>.img-responsive {
	position: absolute;
	display: block;
	max-width: 100%;
	max-height: 100%;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}

/*** 10 COLORS ____________________ ***/

/**___ text ___**/

/* darkgrey - common text-color */
body,
.suggestheader,
.text-color,
.main-action-bg input,
.eye-catcher header h3 {
	color: #486071;
}

@media (max-width: 767px) {
	h1.visible-xs-block+h2 {
		color: #486071;
	}
}

/* grey */
.icon-star,
.notation {
	color: #768894;
}

/* lightgrey */
blockquote:before {
	color: #bfcdd7;
}

/* gold */
/* TODO css solution is not needed when using js, seperated for ie8 */
.icon-star.active,
.radio-icon:hover~.icon-star,
.radio-icon:checked~.icon-star {
	color: var(--primary-color);
}

.nav-pill-highlighted,
h1,
h2,
h3,
h3>a,
h3>a:hover,
h3>a:focus,
h3>a:active {
	color: var(--primary-color);
}

/* gold on darkblue */
.main-action-bg a.nav-pill-highlighted {
	color: #F8C44B
}

/* white */
.cover-close-btn,
#cookiebox,
#cookiebox a,
#cookiebox a:hover,
#cookiebox a:focus,
.main-action-bg,
.main-action-bg a,
.main-action-bg a:hover,
.main-action-bg a:focus,
.btn,
.btn:hover,
.btn:focus {
	color: var(--white-color);
}

/* darkblue */
.btn.btn-link-style:active,
.btn.btn-link-style:focus,
.btn.btn-link-style:hover,
a:focus,
.main-action-bg a.nav-pill-highlighted:hover {
	color: rgb(50, 107, 67);
}

/* green, red -> feedback colors */
textarea:focus+.icon-attention,
input:focus+.icon-attention,
.has-error {
	color: #B00339;
}

.has-error>input,
.has-error>textarea,
.has-error>select {
	border-color: #B00339;
}

.has-error .selectbg {
	border-color: #B00339;
}

:-moz-ui-invalid:not(output) {
	box-shadow: 0;
}

textarea:focus+.icon-check,
input:focus+.icon-check,
.has-success {
	color: #007A4A;
}

.has-success>input,
.has-success>textarea .has-success>select {
	border-color: #007A4A;
}

.has-success .selectbg {
	border-color: #007A4A;
}

.inherit-color {
	color: inherit;
}


/**___ borders ___**/

/* grey medium */
#main-header,
.img-parent,
input,
textarea {
	border-color: #bfcdd7;
}

#main-header,
.img-parent,
input,
textarea {
	border-color: #bfcdd7;
}



/* blue medium */
input:focus,
textarea:focus {
	border-color: #407eab;
}

.has-success>textarea {
	border-color: #007A4A;
}

.confirm {
	border-color: #4b96cc #1d384d #1d384d #4b96cc;
}

/**___ background ___**/

/* lightgrey */
body,
.blockquote,
.eye-catcher>.kde-item,
.editorial-bg .kde-item,
.editorial-bg .eye-catcher,
.kde-item-bg-2,
#reviews-overview .bar,
#more-slider-nav.pagination-nav a.active,
#more-slider-nav.pagination-nav a:hover,
#more-slider-nav.pagination-nav a:active,
#more-slider-nav.pagination-nav a:focus,
.nav-toggler.active,
.nav-toggler:hover,
/* bootstraps rewrites */
.nav>li>a:hover,
.nav>li>a:focus {
	background-color: var(--off-white-color);
}

/* gold */
#reviews-overview .bar>.bar-filled {
	background-color: #2C5DA7;
}

/* darkblue */
.nav-toggler.active .icon-bar,
.nav-toggler:hover .icon-bar,
.main-action-bg {
	background-color: rgb(50, 107, 67);
}

/* white */
.sp-eye-catcher,
.sp-logos,
.editorial-bg .eye-catcher .kde-item,
.confirm,
.content-header-h1-bg,
.teaser-item,
.kde-item,
.eye-catcher,
.editorial-bg {
	background-color: var(--white-color);
}

/* darkblue + alpha */
.map-cover {
	background-color: rgba(42, 91, 124, 0.1);
}

/* with gradient filter map is not covered*/
.ie8 .map-cover {
	background-color: rgb(50, 107, 67);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
}

.cover-close-btn,
#main-header-home>.logo-row,
#main-header-home>.search-row {
	background-color: rgba(76, 125, 94, 0.89);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#D92a5b7c, endColorstr=#D92a5b7c);
}

/* white + alpha */
.form-cover {
	background-color: rgba(255, 255, 255, 0.7);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#80ffffff, endColorstr=#80ffffff);
}

#cookiebox {
	background-color: #3d3d3d;
}

/**___ text and background combinations ___**/
/* white on medium grey */
.alphabetical-nav>li.inactive>span {
	background-color: #bfcdd7;
	color: #fff;
}

.suggestitem.active,
.pagination-nav li a {
	background: #326B43;
	color: #fff;
}

.pagination-nav li.active a,
.pagination-nav li.active a:hover,
.pagination-nav li a:hover,
.pagination-nav li a:active,
.pagination-nav li a:focus,
.pagination-nav li a.active,
#sort-nav li.active a,
#sort-nav li.active a:hover,
#sort-nav li a:hover {
	background: #fff;
	color: #326B43;
}


.btn-default {
	background: rgb(50, 107, 67) none repeat scroll 0% 0%;
	border-color: rgb(47, 143, 76) #1E5A12 #1E5A12 rgb(47, 143, 76);
}

.btn-default:hover {
	background: rgb(50, 107, 67) none repeat scroll 0% 0%;
	border-color: #1E5A12 rgb(47, 143, 76) rgb(47, 143, 76) #1E5A12;
}

.btn-highlighted {
	background: #ce7249;
	border-top-color: #ce7249;
	border-right-color: #ce7249;
	border-bottom-color: #ce7249;
	border-left-color: #ce7249;
}

.btn-highlighted:hover {
	background: #1C3E73;
	border-top-color: #1C3E73;
	border-right-color: #1C3E73;
	border-bottom-color: #1C3E73;
	border-left-color: #1C3E73;
}


/* 2015-07-28 rb - start */

.kde-item .gallery {
	margin: 5px 0;
}

.kde-item .gallery ul {}

.kde-item .gallery ul:after {
	content: ".";
	clear: both;
	display: block;
	visibility: hidden;
	height: 0px;
}

.kde-item .gallery ul li {
	float: left;
	margin: 0px 8px 0px 0;
}

.kde-item .gallery ul li img {
	margin: 4px 0px 4px 0;
}

/* 2015-07-28 rb - end */

/*** 11 COOKIE LAW ***/

#_lcms_banerCookies {
	width: 100%;
	min-height: 30px;
	position: fixed;
	z-index: 10000;
	bottom: 0px;
	left: 0px;
}

#_lcms_banerCookies {
	background: #7179E8;
	background: rgb(113, 121, 232) transparent;
	background: rgba(113, 121, 232, 0.8);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#1570A6, endColorstr=#7179E8);
	/* IE 6/7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#1570A6, endColorstr=#7179E8)";
	/* IE8 */
}

#_lcms_banerCookies * {
	color: #FFFFFF;
	font-size: 12px;
	margin: 0;
	padding: 0;
}

#_lcms_wrapCookies {
	position: relative;
}

#_lcms_banerCookies p {
	padding-top: 10px;
	padding-bottom: 10px;
	padding: 10px 90px 10px 10px;
	margin: 0 auto;
}

#_lcms_banerCookies a:hover {
	color: #000;
}

#_lcms_cookieClose {
	position: absolute;
	display: block;
	top: 5px;
	right: 10px;
	cursor: pointer;
	padding-left: 30px;
	line-height: 25px;
	height: 25px;
	background: url(../images/close-icon.png) 0px -25px no-repeat;
}

#_lcms_cookieClose:hover {
	color: #000;
	background-position: 0px 0px;
}

/*** 12 LOGIN FORM ***/

.form-signin {
	max-width: 330px;
	padding: 15px;
	margin: 0 auto;
}

.form-signin .form-signin-heading,
.form-signin .checkbox {
	margin-bottom: 10px;
}

.form-signin .checkbox {
	font-weight: normal;
}

.form-signin .form-control {
	position: relative;
	height: auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 10px;
	font-size: 16px;
}

.form-signin .form-control:focus {
	z-index: 2;
}

.form-signin input[type="email"] {
	margin-bottom: -1px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
	margin-bottom: 10px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

#inputEmail2 {
	margin-bottom: 10px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}

.logout:before {
	font-family: "FontAwesome";
	font-size: 1.5em;
	position: relative;
	line-height: 1em;
	padding-right: 0.5em;
	vertical-align: -10%;
}

.logout:before {
	content: '\f235';
}

/** added by alberto **/
.selectbg {
	width: 100%;
	border: 1px solid #ccc;
	background-color: #fff;
}

.selectbg option {
	padding: 2px 5px 2px 5px;
}

.qq-upload-button {
	float: right;
}

.row-height {
	max-height: 100px;
	overflow: hidden;
}

/* Autocomplete L&F */
.autocomplete {
	position: relative;
}

div#category-selector {
	margin: -22px 0;
}

span.input-group-addon {
	cursor: pointer;
}

.tt-menu {
	width: 500px;
	margin: 12px 0;
	padding: 8px 0;
	background-color: #fff;
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, 0.2);
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	position: absolute;
	top: 100%;
	left: 0px;
	z-index: 100;
	display: none;
}

.tt-suggestion {
	padding: 3px 20px;
	font-size: 18px;
	line-height: 24px;
}

.tt-suggestion:hover {
	cursor: pointer;
	color: #fff;
	background-color: #0097cf;
}

.tt-suggestion p {
	margin: 0;
}

/* Advert view. */
span.checkbox-yes {
	display: inline-block;
	height: 25px;
	width: 26px;
	background: url(../images/checkbox.png) 0px 0px no-repeat;
	vertical-align: middle;
}

span.checkbox-no {
	display: inline-block;
	height: 25px;
	width: 26px;
	background: url(../images/checkbox.png) -26px 0px no-repeat;
	vertical-align: middle;
}

/*** 11 CUSTOM STYLES ***/
.btn.secondary {
	color: var(--white-color);

    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}

.btn.secondary:hover,
.btn.secondary:focus {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn.primary {
	background: var(--primary-color);
}
.btn.primary:hover,
.btn.primary:focus {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}

.hover-darken:hover {
	filter: brightness(95%);
}

.hover-scale:hover {
	transform: scale(1.02);
	transition: .25s ease-in-out;
}

.pointer {
	cursor: pointer;
}

.vertical-center {
	/* necessary for the progress bars inside a .col element because d-flex cannot be used */
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

.w-fit {
	width: fit-content;
}

/*** 12 BOOTSTRAP OVERRIDES ***/
.carousel-control-next, .carousel-control-prev {
	width: 4%;
}

.carousel-indicators {
	margin-inline: auto;
	margin-bottom: 0;
}

.nav-item {
	border-right: 1px solid var(--off-white-color);
	padding-inline: 12px;
}
.nav-item:last-child {
	border: 0;
}

.card {
	background-color: var(--white-color);
}