/*

1. globale Styles
2. Haupt-Navigation
	Mobile Navigation
	große Screens wenn kein Touchscreens
	Hamburger Menü-Button
	jQuery-UI Autocomplete (Suchfeld)
	
3. Bootstrap Tooltips

###### FARBEN #######

	Schrift:			#333;
	Lenz-blau:			#0067ac
	Magenta:			#e6007e
	Schwarzer-BG		#111
	Graue-Trennlinien	#e5e7e9
	
	
###### WICHTIG #######

	Die Haupt-Navigation darf keine Inline-Styles
	im HTML enthalten, da diese beim Resize-Event
	per JavaScript gelöscht werden
	
*/

/* ##### globale Styles ##### */

@font-face {
	font-family: 'Montserrat';
	src: url('../fonts/Montserrat-ExtraBold.ttf');
}
@font-face { 
  font-family: 'Yanone Kaffeesatz'; 
    src: url('../fonts/YanoneKaffeesatz-Regular.ttf'); 
} 

body {
	color: #333;
	background: white;
}

/*
h1, h2, h3, h4, h5, h6 {
	font-family: Times, serif;
	font-weight: normal;
	color: #0067ac;
}
*/


h1, h3, h4, h5, h6 {
	font: normal 1.5rem 'Yanone kaffeesatz';
	font-weight: normal;
	color: #0067ac;
	/*letter-spacing: 1pt;
	text-transform: uppercase;*/

}


h2{
	font: normal 1.2rem 'Yanone kaffeesatz';
	color: #0067ac;
}

h2 .mag{
	font: normal 1.2rem 'Yanone kaffeesatz';
	color: #e2007a;
}

a, a:visited, a:active {
	color: #0067ac;
	text-decoration: none;
}

a:hover {
	color: #e2007a;
	text-decoration: none;
}

hr.gray {
	border-top: 1px solid #ccc;
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

hr.blu {
	border-top: 1px solid #0067ac;
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}


/* H2 nach horizontaler Linie */
hr.gray + div.row > div > h2, hr.gray + div.row > div > h3 {
	margin-top: 0.5rem;
}

.italic {
	font-style: italic;
}

p {
	text-align: justify;
}

.form-control {
	border: 1px solid #0067ac;
}

main {
	margin-top: 121px;
	
}


.content {
	min-height: 50vh;
	padding-top: 25px;
	margin-bottom: 50px;
}



/* ##### Ende globale Styles ##### */


body > .page-header {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  z-index: 100;
  background-color: #fff;
  border-bottom: 1px solid #e5e7e9;
}

.mobile-nav-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: none;
	z-index: 99;
	background: rgba(0, 0, 0, 0.5);
}

.mobile-nav-overlay.show {
	display: block;
	opacity: 1;
	cursor: pointer;
}

.carousel-indicators li {
	height: 7px;
}


#nav-main {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	position: relative;
}

#nav-main a, #nav-main button {
	color: #333;
}

#nav-main a:hover, #nav-main a:visited {
	color: #333;
	text-decoration: none;
}

@media all and (max-width: 576px) {
	#nav-main.container {
		padding-right: 0px;
		padding-left: 0px;
	}
}

#nav-main *:not(input):focus, #nav-main *:not(input):active {
	outline: 0;
	box-shadow: none;
}

#nav-main .nav-brand, #nav-logo {
	border: 0;
	outline: 0;
	margin: 0;
	padding: 0;
	box-shadow: none;
}

#nav-main #nav-toggle-btn:focus, #nav-main #nav-toggle-btn:active {
	outline: 0;
	box-shadow: none;
}

#nav-logo {
	width: 190px;
	height: 70px;
	margin-top: 25px;
	margin-bottom: 25px;
	-webkit-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}


/* PDF-png 14 x 14--------------------*/
#nav-pdf {
	width: 32px;
	height: 16px;
	margin-top: 20px;
	margin-bottom: 25px;
	-webkit-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}
/*--------------------*/


#nav-logo.tiny-header {
	width: 140px;
	height: 52px;
	margin-top: 15px;
	margin-bottom: 15px;
}

#nav-main .dropdown-header {
	padding: 0.5rem 1rem;
}

#nav-main ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#nav-main .nav-content .nav-header-btn {
	text-transform: uppercase;
	font-weight: bold;
	padding: 0.5rem;
}



/* Mobiles Menü (Standard) */

#nav-toggle-btn {
	display: block;
	position: absolute;
	right: 15px;
	top: 50%;
	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, SizingMethod='auto expand')";
	-moz-transform:    translateY(-50%);
    -o-transform:      translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform:         translateY(-50%);
}

#nav-main .nav-search-desktop, #nav-main .nav-header {
	width: 100%;
	position: relative;
}

#nav-search-btn {
	display: none;
}
#nav-search-btn-2 {
	position: absolute;
	display: block;
	top: 1px;
	right: 0px;
}

#search-input {
	width: 100%;
	display: inline-block;
	padding: 0.5rem 1rem;
	padding-right: 60px;
	height: calc(1.5em + 1rem + 2px);
	font-size: 1.25rem;
	line-height: 1.5;
	margin-bottom: 15px;
}

#nav-main .nav-content {
	display: block;
	visibility: hidden;
	position: fixed;
	width: 375px;
	max-width: 100%;
	top: 121px;
	right: -375px;
	background-color: #fff;
	overflow-x: hidden;
	overflow-y: scroll;
	height: 0px;
	padding: 15px;
	-webkit-transition: visibility .35s ease-in-out, right .35s ease-in-out;
	-o-transition: visibility .35s ease-in-out, right .35s ease-in-out;
	transition: visibility .35s ease-in-out, right .35s ease-in-out;
}

#nav-main .nav-content.show {
	visibility: visible;
	right: 0px;
}

#nav-main .nav-header {
	display: block;
}

#nav-main .nav-header:last-child {
	padding-bottom: 25px;
}

#nav-main .nav-content .nav-header-btn {
	width: 100%;
	text-align: left;
}

#nav-main .nav-content .nav-header-btn .fa-caret-down {
	display: none;
}

#nav-main .nav-content .nav-header-btn .fa-angle-right {
	position: absolute;
	right: 17px;
	top: 11px;
	font-size: 1.25rem;
	-webkit-transition: -webkit-transform 0.5s;
	transition: -webkit-transform 0.5s;
	-o-transition: transform 0.5s;
	transition: transform 0.5s;
	transition: transform 0.5s, -webkit-transform 0.5s;
}

#nav-main .nav-content .nav-header-btn.open .fa-angle-right {
	-moz-transform:    rotate(90deg);
	-o-transform:      rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}
#nav-main .nav-content .nav-header-btn.open {
	color: #ffffff;
	background-color: #0067ac;
}

#nav-main .nav-content .nav-header-btn.open + .nav-dropdown {
	padding-top: 15px;
	padding-bottom: 10px;
}

#lang-select-header {
	padding-right: 10px;
}

#nav-main .nav-dropdown {
	display: none;
}

#nav-main .mega-sub {
	display: none;
}

#nav-main .nav-mega-btn {
	width: 100%;
	font-weight: bold;
	position: relative;
	text-align: left;
	color: #0067ac;
	cursor: pointer;
	padding-left: 1rem;
}

#nav-main .nav-content .nav-mega-btn .fa-angle-right {
	position: absolute;
	right: 17px;
	top: 9px;
	font-size: 1.25rem;
	-webkit-transition: -webkit-transform 0.5s;
	transition: -webkit-transform 0.5s;
	-o-transition: transform 0.5s;
	transition: transform 0.5s;
	transition: transform 0.5s, -webkit-transform 0.5s;
}

#nav-main .nav-content .nav-mega-btn.open .fa-angle-right {
	-moz-transform:    rotate(90deg);
	-o-transform:      rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}

#nav-main .nav-content .nav-header li:not(:last-child) .nav-mega-btn.open + .mega-sub {
	padding-bottom: 5px;
}

#nav-main ul.mega-sub li > a {
	padding: 0.5rem 2rem;
}

/*
#nav-main .nav-link.aktiv {
	position: relative;
	cursor: default;
	background-color: #fff;
	color: #e6007e !important;
	font-weight: bold;
	padding-right: 3px !important;
	padding-left: 27px !important;
}
#nav-main .nav-link:before {
	position: absolute;
	top: 0.575rem;
	left: 0px;
	content: '\f105';
	font-family: 'Font Awesome 5 Free';
	font-size: 1rem;
	line-height: inherit;
	color: #e6007e;
	opacity: 0;
	visibility: hidden;
}
	
#nav-main .nav-link.aktiv:before {
	left: 1rem;
	font-weight: bold;
	opacity: 1;
	color: #e6007e;
	visibility: visible;
	transition: all 0.3s;
}
*/

#nav-main .nav-link.aktiv {
	position: relative;
	cursor: default;
	background-color: #fff;
	color: #e2007e !important;
	font-weight: bold;
}

#nav-main .nav-link.aktiv:before {
	margin-right: 5px;
	content: '\f105';
	font-family: 'Font Awesome 5 Free';
	font-size: 1rem;
	line-height: inherit;
	color: #e2007e;
	font-weight: bold;
}

#nav-main .mega-sub .nav-link {
	position: relative;
}

/* Lenz-Logos in der Navigation */

#nav-main .nav-link.nav-logo {
	position: relative;
}

#nav-main img.nav-logo {
	position: absolute;
	right: 15px;
	top: -3px;
	margin: 0 5px 0 0;
	width: 50px;
	height: 35px;
}

/* Ende Lenz-Logos in der Navigation */
	
#nav-main .mega-sub .spacer {
	display: none;
}
	
	
#nav-main .nav-header-btn.selected {
	border: 1px solid #0067ac;
}

/* kleine Screens */

@media all and (max-width: 576px) {
	#nav-toggle-btn {
		right: -15px;
	}
}


/* #### große Screens wenn kein Touchscreens #### */

@media (min-width: 992px) and (pointer: fine) and (hover: hover) {
	
	#nav-toggle-btn {
		display: none;
	}
	
	.dm-order-last {
		-ms-flex-order: 13;
		order: 13;
	}
	
	#nav-search-btn {
		display: block;
		position: absolute;
		width: 60px;
		height: 50px;
		border-radius: 7px;
		right: 15px;
		top: 50%;
		-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, SizingMethod='auto expand')";
		-moz-transform:    translateY(-50%);
		-o-transform:      translateY(-50%);
		-webkit-transform: translateY(-50%);
		transform:         translateY(-50%);
	}
	
	#nav-search-btn.aktiv {
		color: #fff;
		background-color: #e6007e;
	}
	
	#nav-search-btn-2 {
		display: none;
	}
	
	#nav-main .nav-content {
		display: flex;
		visibility: visible;
		position: static;
		padding: 0;
		margin: 0;
		margin-left: auto;
		margin-right: 65px;
		width: auto;
		overflow: hidden;
		height: auto;
		-ms-flex-item-align: center !important;
		align-self: center !important;
	}
	
	#lang-select-header {
		display: none;
	}
	
	#nav-main .nav-content .nav-header-btn {
		position: static;
		padding: 0.375rem 0.65rem;
		font-size: 0.95rem;
		width: auto;
		text-align: center;
	}
	
	#nav-main .nav-content .nav-header-btn .fa-caret-down {
		display: inline-block;
		padding-left: 5px;
	}
	
	#nav-main .nav-content .nav-header-btn .fa-angle-right {
		display: none;
	}

	#nav-main li.nav-header {
		position: static;
		display: inline-flex;
		width: auto;
		padding-bottom: 0;
	}
	
	#nav-main .nav-header:last-child {
		padding-bottom: 0;
	}
	
	#nav-main .nav-content > li.nav-search-desktop {
		position: absolute;
		right: 80px;
		background-color: #fff;
		z-index: 101;
		padding-right: 5px;
		height: auto;
		min-height: 60px;
		text-align: right;
		width: 0px;
		opacity: 0;
		display: none;
	}

	#search-input {
		max-width: 300px;
		display: inline-block;
		padding: 0.375rem 0.75rem;
		height: calc(1.5em + 0.75rem + 2px);
		font-size: 1rem;
		line-height: 1.5;
	}
	
	#nav-main .nav-dropdown {
		position: absolute;
		display: none;
		top: 90%;
		background-color: #fff;
		z-index: 108;
		min-width: 10rem;
		border-top: 2px solid #e6007e;
		border-top: 2px solid #e6007e;
		border-radius: 5px;
		border-top-left-radius: 0px;
		border-top-right-radius: 0px;
		-webkit-box-shadow: 0px 5px 5px 0px rgba(207,207,207,1);
		-moz-box-shadow: 0px 5px 5px 0px rgba(207,207,207,1);
		box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.15);
		padding: 20px;
	}
	
	#nav-main .nav-mega-menue, #nav-main ul.mega-sub {
		overflow-x: hidden;
	}
	
	#nav-main .nav-link, #nav-main ul.mega-sub li > a {
		position: relative;
		padding: 0.375rem 1rem;
		margin-bottom: 2px;
		white-space: 	nowrap;
		overflow: 		hidden;
		text-overflow: ellipsis;
	}
	
	#nav-main .mega-sub {
		display: block;
	}
	
	#nav-main .nav-mega-btn {
		width: 100%;
		font-weight: bold;
		position: static;
		text-align: left;
		color: #333;
		cursor: default;
		padding: 0.375rem 0.75rem;
	}
	
	#nav-main .nav-mega-btn span {
		max-width: 100%;
		white-space: 	nowrap;
		overflow: 		hidden;
		text-overflow: ellipsis;
	}
	
	#nav-main .nav-dropdown.nav-mega-menue {
		left:0; right:0; width:100%;
		-webkit-transform: none;
		transform: none;
		padding: 0;
		margin: 0;
		display: none;
		table-layout: fixed;
	}
	
	#nav-main .nav-dropdown.nav-mega-menue > li {
		display: table-cell;
		width: 25%;
		height: 100%;
		padding: 20px;
		vertical-align:top;
	}
	
	#nav-main .nav-dropdown.nav-mega-menue > li:not(:last-child) {
		border-right: 1px solid #e5e7e9;
	}
	
	#nav-main .nav-mega-menue .nav-mega-btn span {
		font-size: 1.25rem;
		font-weight: bold;
	}
	
	#nav-main .nav-mega-menue .nav-mega-btn i.fas {
		display: none;
	}
	
		
	/* aktiven Menü-Header hervorheben */
	
	#nav-main .nav-header-btn > span {
		position: relative;
	}
	
	#nav-main .nav-header-btn > span:before, 
	#nav-main .nav-header-btn > span:after {
		position: absolute;
		-webkit-transition: all 0.35s ease;
		transition: all 0.35s ease;
	}
	
	#nav-main .nav-header-btn > span:before {
		bottom: -7px;
		left: 0;
		display: block;
		height: 4px;
		width: 0%;
		content: "";
		background-color: #e6007e;
	}
	
	#nav-main .nav-header-btn > span:after {
		left: 0;
		top: 0;
		padding: 0.5em 0;
		position: absolute;
		color: #ffffff;
		white-space: nowrap;
		max-width: 0%;
		overflow: hidden;
	}
	
	#nav-main .nav-header-btn:hover > span:before, 
	#nav-main .nav-header-btn.aktiv > span:before {
		opacity: 1;
		width: 100%;
		left: 0;
	}
	
	#nav-main .nav-header-btn:hover > span:after, 
	#nav-main .nav-header-btn.aktiv > span:after {
		max-width: 100%;
	}
	
	
	#nav-main .nav-header-btn.selected > span:before {
		opacity: 1;
		width: 100%;
		left: 0;
	}
	
	#nav-main .nav-header-btn.selected > span:after {
		max-width: 100%;
	}
	
	#nav-main .nav-header-btn.selected {
		border: 0;
	}
	
	/* Ende aktiven Menü-Header hervorheben */
	
	/* Menü-Hover und aktives Menü */
		
	#nav-main .nav-link:before {
		position: absolute;
		top: 0.425rem;
		left: 0px;
		content: '\f105';
		font-family: 'Font Awesome 5 Free';
		font-size: 1rem;
		line-height: inherit;
		color: #e6007e;
		opacity: 0;
		visibility: hidden;
	}
	
	#nav-main .nav-link.aktiv:before, 
	#nav-main .nav-link:hover:before {
		left: 1rem;
		font-weight: bold;
		opacity: 1;
		color: #e6007e;
		visibility: visible;
		transition: all 0.3s;
	}

	#nav-main .nav-link:hover {
		text-decoration: none;
		padding-right: 3px !important;
		color: #e6007e !important;
		padding-left: 27px !important;
		background-color: #fff;
		transition: all 0.3s;
	}

	#nav-main .nav-link.aktiv, 
	#nav-main .nav-link.aktiv:hover {
		cursor: default;
		background-color: #fff;
		color: #e6007e !important;
		font-weight: bold;
		padding-right: 3px !important;
		padding-left: 27px !important;
	}
	
	#nav-main .mega-sub .spacer {
		display: list-item;
	}
	
	#nav-main img.nav-logo {
		right: -5px;
	}

}

/* #### Ende große Screens wenn kein Touchscreens #### */

/* ##### Anfang Hamburger Menü-Button ##### */

#nav-main .hamburger {
  background: #fff;
  width: 52px;
  height: 48px;
  position: relative;
  cursor: pointer;
  overflow: hidden;
  display: inline-block;
}

#nav-main .hamburger span i {
  width: 35px;
  height: 6px;
  background: #00030a;
  position: absolute;
  left: 15%;
  border-radius: 3px;
}

#nav-main .hamburger .span1 i, #main-nav .hamburger .span2 i, #main-nav .hamburger .span3 i {
  position: absolute;
}

#nav-main .hamburger .spanf:nth-child(1) i {
  top: 25%;
}

#nav-main .hamburger .spans:nth-child(2) i {
  top: 50%;
}

#nav-main .hamburger .spant:nth-child(3) i {
  top: 75%;
}

#nav-main .hamburger .span1:nth-child(1) i {
  top: 50% !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865474, M12=-0.7071067811865477, M21=0.7071067811865477, M22=0.7071067811865474, SizingMethod='auto expand')";
  -moz-transform:    rotate(45deg);
  -o-transform:      rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition: -webkit-transform 0.25s;
  transition: -webkit-transform 0.25s;
  -o-transition: transform 0.25s;
  transition: transform 0.25s;
  transition: transform 0.25s, -webkit-transform 0.25s;
}

#nav-main .hamburger .span2:nth-child(2) i {
  left: 65px;
}

#nav-main .hamburger .span3:nth-child(3) i {
  top: 50% !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865483, M12=0.7071067811865467, M21=-0.7071067811865467, M22=0.7071067811865483, SizingMethod='auto expand')";
  -moz-transform:    rotate(-45deg);
  -o-transform:      rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: -webkit-transform 0.25s;
  transition: -webkit-transform 0.25s;
  -o-transition: transform 0.25s;
  transition: transform 0.25s;
  transition: transform 0.25s, -webkit-transform 0.25s;
}

/* ##### Ende Hamburger Menü-Button ##### */


/* jQuery-UI Autocomplete (Suchfeld) */

	.ui-autocomplete-loading {
		background: white url('images/ui-anim_basic_16x16.gif') 80% center no-repeat;
	}
	.ui-autocomplete {
		max-height: 250px;
		overflow-y: auto;
		overflow-x: hidden;
		padding-bottom: 10px;
	}
	.ui-autocomplete li a {
		font-weight: normal;
		color: #7594b0;
		display: block;
		width: 100%;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.ui-autocomplete {
		font-size: 1rem;
	}
	.ui-autocomplete.autocomplete-mobile li a {
		font-size: 1.2rem;
		padding-top: 0.375rem;
		padding-bottom: 0.375rem;
	}
	.ui-autocomplete li a:hover, .ui-autocomplete li a:hover span, 
	.ui-autocomplete .ui-menu-item-wrapper.ui-state-active {
		color: #ffffff;
		background-color: #e6007e;
		text-decoration: none;
	}
	.ui-autocomplete li span {
		font-weight: bold;
		color: #e6007e;
	}

/* Ende jQuery-UI Autocomplete */

/* #### ENDE Navigation #### */

/* #### Page-Header (Hero-IMG und Überschrift) #### */

#page-header {
	width: 100%;
	height: auto;
	background-size: cover;
	background-position: center;
	position: relative;
	min-height: 250px;
	height: 35vh;
	margin-bottom: 2rem;
}

#page-header > .container {
	padding: 0;
}

#page-header .page-titel-header h1 {
	position: absolute;
	margin-left: 15px;
	bottom: -1.1rem;
	font-size: 3rem;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	color: #fff;
	opacity: 0.7;
	margin-bottom: 0;
	text-shadow:    
		-1px -1px 0 rgba(17,17,17,0.4),  
		1px -1px 0 rgba(17,17,17,0.4),
		-1px 1px 0 rgba(17,17,17,0.4),
		1px 1px 0 rgba(17,17,17,0.4), 
		5px 5px 2px rgba(17,17,17,0.75);
	letter-spacing: -1px;
	transform: scaleY(1.25);
	text-transform: uppercase;
}

@media screen and (max-width: 991.99px) {
	#page-header {
		min-height: 200px;
		height: 30vh;
		margin-bottom: 1.75rem;
	}
	#page-header .page-titel-header h1 {
		font-size: 2.5rem;
		bottom: -0.85rem;
	}
}

@media screen and (max-width: 575.99px) {
	#page-header {
		min-height: 175px;
		height: 30vh;
		margin-bottom: 1.5rem;
	}
	#page-header .page-titel-header h1 {
		font-size: 1.75rem;
		bottom: -0.5rem;
	}
}




/* ##### Footer ##### */

footer {
	font-size: 0.9rem;
}

footer a, footer a *, footer address, footer a:visited {
	color: silver;
}

footer a:hover, footer a:hover * {
	color: #fff;
	text-decoration: none;
}

footer .footer-top {
	background-color: #000;
	padding-top: 30px;
	padding-bottom: 30px;
}

footer .footer-top i {
	margin-right: 12px;
}

@media (max-width: 767.99px) {
	footer .footer-top .footer-logo {
		text-align: center;
		margin-bottom: 25px;
	}
	footer .footer-top address {
		-ms-flex-pack: center !important;
		justify-content: center !important;
	}
}

@media (max-width: 767.99px) {
	footer .footer-top address {
		width: 50%;
	}
}

footer .footer-location-link {
	cursor: pointer;
}

footer .footer-bottom {
	background-color: #000;
}

footer .footer-bottom {
	padding-top: 15px;
	padding-bottom: 15px;
	color: #fff;
}

#lenz-map {
	min-height: 400px;
	height: 65vh;
	width: 100%;
	flex: 1;
	border: 1px solid #0067ac;
	border-radius: 7px;
}

#modalmap .btn-blue {
	background-color: #0067ac;
	color: #fff;
	min-width: 150px;
}

#modalmap .btn-blue:hover {
	font-weight: bold;
}

#modalmap .modal-header {
	padding: 1rem 1.5rem 0.375rem 1.5rem;
}

#modalmap .modal-footer {
	padding-bottom: 1.5rem;
}

#modalmap .close {
	position: relative;
	font-size: 2.5rem;
	bottom: 6px;
}

@media (hover: hover) {
	.modal-open {
		overflow-y: auto;
		padding:0 !important;
	}
}


/* ##### Ende Footer ##### */

.content .card {
	margin-bottom: 25px;
}

.content .card .truncated {
	min-width: 0;
}

ul.feature-list {
	padding-left: 0px;
	margin-bottom: 0px;
}

.feature-list {
	padding-bottom: 15px;
}
.feature-list li {
	list-style: none;
	margin-left: 1rem;
}
.feature-list li::before {
	content: "•";
	font-size: 1.4rem;
	color: #0067ac;
	font-weight: bold;
	display: inline-block;
	width: 1rem;
	margin-left: -1rem;
}
.feature-list li {
	line-height: 1.4rem;
	padding-bottom: 0.375rem;
}

.btn-blue, a.btn-blue {
	background-color: #0067ac;
	min-width: 120px;
	color: #fff;
}
.btn-blue:hover, a.btn-blue:hover {
	color: #fff;
	font-weight: bold;
}

.span-lenz {
	font-style: italic;
	font-weight: bold;
	color: #e6007e;
}

.error-msg {
	color: #e2007a;
	font-size: 1.25rem;
	font-weight: bold;
}

.embed-responsive-6by4::before {
  padding-top: 66.67%;
}


/* ####### Preislisten und Shop-Formular ########### */

	template {
		display: none;
	}

	#preisliste .bstmenge {
		width: 100%;
		max-width: 65px;
		display: inline-block;
		padding: 0.15rem 0.5rem;
		font-size: 1rem;
		font-weight: 400;
		line-height: 1.5;
		color: #495057;
		background-color: #fff;
		background-clip: padding-box;
		border: 1px solid #ccc;
		border-radius: 0.25rem;
		transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	}
	#preisliste .bstmenge:focus {
		color: #495057;
		background-color: #fff;
		border-color: #80bdff;
		outline: 0;
		box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
	}

	#shop-form {
		width: 100%;
		border: 0;
		padding: 0;
		margin: 0;
	}
	
	#shop-form .bg-blue {
		width: 100%;
		background-color: #d9e3ef;
		border: 1px solid #ccc;
		padding: 15px;
	}
	
	#shop-form .form-header {
		color: #0067ac;
		font-weight: bold;
		padding: 0px 0px 15px 0px;
		font-style: italic;
		display: inline-block;
		padding-left: 0.75rem;
	}
	
	#shop-form .bg-blue i {
		display: inline-block;
		padding-left: 5px;
	}
	
	#shop-form .hr {
		border: 0;
		width: 100%;
		border-top: 1px solid #ccc;
		margin-top: 15px;
		margin-bottom: 15px;
		height: 0px;
	}
	
	#shop-form .form-control {
		border: 1px solid #0067ac;
		color: #000;
	}
	
	#shop-form .cbwrapper {
		position: relative;
		padding-left: 40px;
	}
	
	#shop-form .cbwrapper input[type='checkbox'] {
		position: absolute;
		width: 1.1rem;
		height: 1.1rem;
		left: 15px;
		top: 3px;
		border: 1px solid #0067ac;
		cursor: pointer;
	}
	
	#shop-form .legende {
		font-size: 0.85rem;
	}
	
	#bestelltab {
		background-color: #fff;
		border: 1px solid #ccc;
	}
	
	#bestellliste {
		background-color: #fff;
		border: 0;
		border-right: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
	}
	
	#bestellliste .row.header {
		display: none;
	}
	
	#bestellliste .row.header span {
		font-weight: bold;
		white-space: 	nowrap;
		overflow: 		hidden;
	}
	
	#bestellliste .row.body:nth-child(odd) {
		background-color: rgba(0, 0, 0, 0.05);
	}
	
	#bestellliste > .row div {
		padding: 0.75rem;
		padding-top: 1.5rem;
		border-top: 1px solid #ccc;
		border-left: 1px solid #ccc;
		position: relative;
	}
	
	#bestellliste .row.body span {
		display: block;
		position: absolute;
		font-size: 0.75rem;
		opacity: 0.75;
		font-style: italic;
		top: 0.25rem;
		left: 0.75rem;
	}
	
	#bestellliste > .row.body div:nth-child(5) {
		font-weight: bold;
	}
	#bestellliste > .row.body div:nth-child(5) span {
		font-weight: normal;
	}
	
	#bestellliste > .row.footer div {
		padding-top: 0.75rem;
	}
	
	@media (min-width: 768px) {
		#bestellliste .row.header {
			display: flex;
		}
		#bestellliste .row.body span {
			display: none;
		}
		#bestellliste > .row div {
			padding-top: 0.75rem;
		}
		#bestellliste > .row.body div:nth-child(5) {
			font-weight: normal;
		}
	}
	@media (min-width: 992px) {
		.col-lg-small {
			-ms-flex: 0 0 12.5%;
			flex: 0 0 12.5%;
			max-width: 12.5%;
		}
		.col-lg-large {
			-ms-flex: 0 0 50%;
			flex: 0 0 50%;
			max-width: 50%;
		}
		.col-lg-footer {
			-ms-flex: 0 0 87.5%;
			flex: 0 0 87.5%;
			max-width: 87.5%;
		}
	}
	
	#widerrufsbelehrung {
		background-color: #fff;
		padding: 15px;
		display: none;
		margin-bottom: 15px;
		border-radius: 0.25rem;
		border: 1px solid #ccc;
	}
	
	#floatingInputX {
		/* Spam-Check-Feld */
		display: none;
	}

	
	/* Floating Form-Labels aus Bootstrap 5.0beta */
	/* ########################################## */
	
		.form-floating {
			color: #000;
			position: relative;
		}
		.form-floating > .form-control,
		.form-floating > .form-select {
		  height: calc(3.5rem + 2px);
		  padding: 1rem 0.75rem;
		  border: 1px solid #0067ac;
		  color: #000;
		}
		.form-floating > label {
		  position: absolute;
		  top: 0;
		  left: 0;
		  height: 100%;
		  padding: 1rem 0.75rem;
		  pointer-events: none;
		  border: 1px solid transparent;
		  transform-origin: 0 0;
		  transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out;
		}
		.form-floating > .form-control.filled {
			padding-top: 1.625rem;
			padding-bottom: 0.625rem;
		}
		.form-floating > .form-control ~ label.filled {
			opacity: 0.65;
			transform: scale(0.80) translateY(-0.6rem) translateX(0.15rem);
			font-style: italic;
		}

	/* Ende Floating Form-Labels */
	
	@media (hover: hover) {
		.modal-open {
			overflow-y: auto;
			padding:0 !important;
		}
	}

/* ####### Ende Preislisten und Shop-Formular ########### */

/*--------------------------------------------------------------*/

.standard {
	color: #333;
}

.standardbold {
	font-weight: bold;
	color: #333;
}

.silver {
	color: #888;
}

.silverbold {
	font-weight: bold;
	color: #888;
}

.gold {
	color: #b8860b;
}


.goldbold {
	font-weight: bold;
	color: #b8860b;
}


.mag {
	color: #e2007a;
}

.magbold {
	color: #e2007a !important;
	font-weight: bold;
}

.imgright {
	float: right  !important;
	border: 1px solid #e2007a;
	margin: 5px 0 5px 10px;
}


.imgleft {
	float: left  !important;
	border: 1px solid #e2007a;
	margin: 5px 10px 10px 0;
}

.imgrightnob {
	float: right  !important;
	border: 0;
	margin: 5px 0 0 10px;
}

.imgleftnob {
	float: left  !important;
	border: 0;
	margin: 5px 10px 10px 0;
	max-width: 1200px;
}

/* ------------ Presseseite------------- */

#abslinkzip a .bold {
	font-weight: bold;
}

#abslinkzip a, #abslinkzip a:link {
	display: block;
	min-height: 95px;
	height: auto;
}

#abslinkzip a:link {
	display: block;
	color: black;
	font-size: 100%;
	text-decoration: none;
	text-transform: none;
}

#abslinkzip a:visited {
	display: block;
	color: black;
	font-size: 100%;
	text-decoration: none;
	text-transform: none;
}

#abslinkzip a:active {
	display: block;
	color: black;
	font-size: 100%;
	text-decoration: none;
	text-transform: none;
}

#abslinkzip a:hover {
	display: block;
	color: #e2007a;
	font-size: 100%;
	text-decoration: none;
	text-transform: none;
	background-image: url(../img/bg_download_zip.jpg);
	/*font-weight: bold;*/
}



/* ###### Preisliste und Web-Shop ########## */

	#preisliste td, #preisliste th {
		font-size: 1rem;
	}
	#preisliste .desktop-header th {
		font-size: 1rem;
	}
	#preisliste .desktop-header th:nth-child(4) {
		text-align: right;
	}
	#preisliste .plist-header {
		padding: 0;
	}
	#preisliste .plist-header button {
		font-weight: bold;
		color: #0067ac;
		background-color: #fff;
		font-size: 1rem;
		width: 100%;
		position: relative;
		text-align: left;
		padding: 0.75rem;
		border: 0 !important;
		outline: 0 !important;
		cursor: default;
	}
	#preisliste .plist-header button i.fas {
		position: absolute;
		right: 1.25rem;
		top: 0.85rem;
		font-size: 1.25rem;
		-webkit-transition: -webkit-transform 0.25s;
		transition: -webkit-transform 0.25s;
		-o-transition: transform 0.25;
		transition: transform 0.25s;
		transition: transform 0.25s, -webkit-transform 0.25s;
		display: none;
	}
	#preisliste .plist-header.open button i.fas {
		-moz-transform:    rotate(90deg);
		-o-transform:      rotate(90deg);
		-webkit-transform: rotate(90deg);
		transform: rotate(90deg);
	}
	#preisliste .collapse-header {
		cursor: default;
		scroll-snap-margin-top: 100px;
		scroll-margin-top: 100px;
	}
	
	@media screen and (max-width: 576px) {
		#preisliste th, #preisliste td {
			padding: 0.375rem;
		}
		#preisliste th.plist-header button {
			padding: 0.75rem 0.375rem;
		}
	}
	
	#preisliste tr td {
		vertical-align: middle;
	}
	#preisliste tr td:nth-child(1), #preisliste tr td:nth-child(4) {
		white-space: nowrap;
	}
	#preisliste tr td:nth-child(3) {
		vertical-align: middle;
		text-align: center;
	}
	#preisliste tr td:nth-child(3) > img {
		width: 45px;
		height: auto;
		max-width: 100%;
		position: relative;
		vertical-align: middle;
		bottom: 2px;
		cursor: pointer;
	}
	#preisliste tr td:nth-child(4) {
		text-align: right;
		vertical-align: middle;
	}
	
	#preisliste .collapse-body .sub-header {
		display: none;
	}
	
	@media screen and (max-width: 767.99px) {
		#preisliste .desktop-header {
			display: none;
		}
		#preisliste .collapse-body .sub-header {
			display: table-row;
			font-size: 0.9rem;
		}
		#preisliste .collapse-body .sub-header th:nth-child(4) {
			text-align: right;
		}
		#preisliste .plist-header button i.fas {
			display: block;
		}
		#preisliste .collapse-header {
			cursor: pointer;
		}
		#preisliste .collapse-body {
			display: none;
		}
		#preisliste .collapse-body.open {
			display: table-row-group;
		}
		#preisliste .plist-header button {
			cursor: pointer;
		}
		#preisliste .plist-header button span {
			display: inline-block;
			max-width: 90%;
			overflow: hidden; 
            white-space: nowrap; 
            text-overflow: ellipsis; 
		}
		#preisliste .plist-header.open button {
			background-color: #0067ac;
			color: #fff;
		}	
	}
	@media screen and (max-width: 420px) {
		.container.table-container {
			padding-left: 5px;
			padding-right: 5px;
		}
	}
	
	/* ###### Ende Preisliste und Web-Shop ########## */
	
	
	/* ###### Artikel-Info-Box ########## */
	
	.floating-img-right {
		width: 100%;
	}
	.floating-img-right img {
		width: 100%;
		height: auto;
		border: 1px solid #d9d9d9;
		border-radius: 0.5rem;
	}
	.floating-img-right a.lightbox-img {
		cursor: default;
	}
	.floating-img-right a.lightbox-img:nth-child(n+2), .lightbox a.lightbox-img:nth-child(n+2) {
		display: none;
	}
	.artikel-box {
		margin-bottom: 0.5rem;
	}
	.artikel-box .border-oben {
		border: 0;
		height: 1px;
		margin-top: 0.5rem;
		margin-bottom: 15px;
		width: 100%;
		background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	}
	.artikel-box .border-feature-info {
		margin-bottom: 0px;
		margin-top: 0px;
		border: 0;
		height: 1px;
		background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	}
	.artikel-box .border-unten {
		border: 0;
		height: 1px;
		margin-top: 15px;
		margin-bottom: 15px;
		display: none;
		background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	}
	.artikel-img {
		display: none;
		
	}
	.artikel-img-mobile img {
		width: 100%;
		height: auto;
		border: 1px solid #d9d9d9;
		border-radius: 0.5rem;
		margin-bottom: 0.5rem;
		margin-top: 0.25rem;
	}
	.info-table {
		width: 100%;
		border: 0px;
		border-collapse: separate;
		line-height: 1.375rem;
		border-spacing: 0px;
	}
	.info-table td {
		white-space: nowrap;
	}
	.info-table td:nth-child(1) {
		width: 15%;
	}
	.info-table td:nth-child(2) {
		padding-left: 10px;
		width: 15%;
	}
	.info-table td:nth-child(3) {
		width: 70%;
		text-align: right;
	}
	
	.status-icon {
		width: 45px;
		height: auto;
		max-width: 100%;
		position: relative;
		vertical-align: middle;
		bottom: 2px;
		cursor: pointer;
	}

	.feature-icon-box .feature-icon {
		cursor: pointer;
	}
	
	.feature-icon {
		width: 24px;
		height: 24px;
		margin-top: 0.25rem;
	}
	.btn-artikel-info {
		position: relative;
		border: 1px solid #333;
		color: #333;
		border-radius: 0.375rem;
		margin-top: 0.5rem;
	}
	
	.btn-artikel-info i {
		padding-left: 0.5rem;
		transition: transform 0.25s;
		
	}
	.btn-artikel-info span {
		position: relative;
		display: inline-block;
		top: -2px;
		font-size: 0.9rem;
	}
	
	.btn-artikel-info.open i {
		transform: scaleY(-1);
	}
	
	.feature-info {
		display: none;
	}
	.feature-info [class*="col-"] {
		padding-bottom: 0.5rem;
		white-space: nowrap;
		overflow: hidden;
	}
	
	.feature-info img {
		position: relative;
		vertical-align: middle;
		bottom: 2px;
		margin-right: 0.375rem;
	}
	
	.artikel-btn-box {
		text-align: center;
	}
	
	.custom-artikel .artikel-img {
		display: block;
	}
	.artikel-img-mobile {
		display: block;
	}
	
	.floating-right {
		float: right;
	}
	
	.img-border {
		border: 1px solid #d9d9d9;
		border-radius: 0.5rem;
	}
	
	@media all and (max-width: 769.99px) {
		.feature-icon {
			width: 24px;
			height: 24px;
		}
		.custom-artikel .artikel-img img {
			padding: 0.5rem 15px 0.5rem 15px;
		}
		.floating-right {
			float: none;
		}
	}
	
	@media all and (min-width: 768px) {
		.floating-img-right {
			width: 50%;
			float: right;
			margin-left: 25px;
		}
		.floating-img-right a.lightbox-img {
			cursor: pointer;
		}
		.artikel-img-mobile {
			display: none;
		}
		.artikel-img {
			display: block;
			width: 28.75%;
			height: auto;
			max-width: 100%;
			border: 1px solid #d9d9d9;
			border-radius: 0.5rem;
			text-align: center;
			overflow: hidden;
			margin-right: 15px;
		}
		.artikel-img img {
			width: auto;
			height: auto;
			max-width: 100%;
		}
	}
	@media all and (min-width: 992px) {
		.floating-img-right {
			width: 40%;
		}
		.feature-icon {
			width: 28px;
			height: 28px;
		}
		.art-beschreibung {
			min-height: 3rem;
		}
		.artikel-btn-box {
			text-align: left;
		}
	}
	
	.artikel-box .artikel-logo {
		display: inline-block;
		border: 1px solid #e2007a;
		margin: 5px 0 5px 10px;
		width: 85px;
		height: auto;
		vertical-align: middle;
		border-radius: 0.15rem;
	}
	.artikel-box .promote {
		vertical-align: middle;
	}
	.artikel-box .promote div {
		font-size: 0.85rem;
		display: inline-block;
		padding-top: 10px;
	}
	
	/* ###### Ende Artikel-Info-Box ########## */
	

		
/* ########### Notwendige Stile aus der alten Webseite ############# */
	
	
/* Datum Einträge Startseite */

.date {
	font-family: Times, serif;
	font-size: 100%;
	font-weight: normal;
	color: black !important;
	text-align: left;
	height: auto;
	margin: 0;
	padding: 0;
	}

h1 .date {
	/*
	font-size: 60%;
	color: #666;
	text-align: left;
	margin-left: 10px;
	margin-top: 3px;
	*/

	font-size: 90%;
	font-weight: normal;
	color: #666;
	text-align: right;
	/*margin-right: 30px; - für Pfeil rechts*/
	margin-right: 0px;
	float: right;
	margin-top: 3px;
	}

/* Ende Datum Einträge Startseite */


/* Absatzformate Startseite */

#abslinkindex a {
	display: block;
	min-height: 95px;
	height: auto;
	}

#abslinkindex a:link {
	display: block;
	color: black;
	font-size: 100%;
	text-decoration: none;
	text-transform: none;
	}

#abslinkindex a:visited {
	display: block;
	color: black;
	font-size: 100%;
	text-decoration: none;
	text-transform: none;
	}

#abslinkindex a:active {
	display: block;
	color: black;
	font-size: 100%;
	text-decoration: none;
	text-transform: none;
	}

#abslinkindex a:hover {
	color: #e2007a;
	display: block;
	font-size: 100%;
	text-decoration: none;
	text-transform: none;
	background-image: none;
	background-color: #ffffee;
	}

#abslinkindex-e a:hover {
	color: #e2007a;
	display: block;
	font-size: 100%;
	text-decoration: none;
	text-transform: none;
	background-image: none;
	background-color:transparent;
	}



/* End Absatzformate Startseite */


/* Linien */
hr, hr.solid {
	border: none;
	border-bottom: 1px solid #ddd;
	background-color: #ddd;
	height: 1px;
	margin-left: 5px;
	width: 97%;
}

hr.grey{
	border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));	
}

hr.blu{
	border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(51, 102, 255, 0), rgba(51, 102, 255, 0.5), rgba(51, 102, 255, 0));	
}

hr.mag{
	border: 0;
    height: 1px;
    background-image: linear-gradient(to right, RGBA(226,0,122,0), RGBA(226,0,122,1), RGBA(226,0,122,0));	
}
	
/* End Linien */

/* Formate FS */
	
.edition, .emotion{
	color:#e2007a;
	font: italic bold 100% Georgia, "Times New Roman", Times, serif;
}

p.left{
	text-align: left;
}
