@charset "UTF-8";
/* CSS Document */
/***** Absatzgestaltung *****/
video {
	border: 1px solid #ccc;
}


@media screen and (min-width: 576px) {
html {
	font-size: 14px;
}

.mod_article.claimbox p{
	font-size: 2.941em;
	line-height: 3.529rem;
}

.haupttext {
	max-width: 1416px;
}

.haupttext .einleitung p{
	font-family: Merriweather;
	max-width: 1416px;
	margin: 0 auto;
}

.einleitung.schmal{
	max-width: 1240px;
	margin: 0 auto;
}

.haupttext p{
	max-width: 1270px;
	margin: 0 auto;
	font-family: FFNettoStdLight;
}

.mod_article.kontaktbox p{
font-size: 2.941em;
}

.mod_article .adresseKontakt p{
	font-size: 1.7059rem;
}
.pin {
	text-align: right;
}

.headerBox {
  height: 800px;
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
}

.headerText {
	float: right;
	margin: 100px 30px 0 0;
	color: #000;
}

.wolf-header .headerText p {
	font-size: 1.2em;
	line-height: 1.4em;
}

.wolf-header .headerText h1 a {
	color: #000;
}

.wolf-header .headerText h1 a span {
	color: #e4003a;
	background:none;
}

.wolf-header .headerBox .emblem {
  position: absolute;
  top: 34px;
  left: -69px;
}

@media screen and (max-width: 575px) {
html {
	font-size: 10px;
}

html #mainNavi.responsive a,
html #mainNavi.responsive strong {
	line-height: 3rem;
	font-size: 1.525rem;
	padding-left: 1rem;
}

.mod_article.claimbox p{
	font-size: 2.75rem;
	line-height: 3.529rem;
}
}
/***** Ende Media-Querys *****/

body {
	font-family: Merriweather;
	color: #7c7c7b;
}

strong {
	font-family: Merriweather;
	font-weight: 800;
}

h1 {
	font-size: 2.9rem;
	font-family: Merriweather;
	font-weight: 800;
	color: #e4003a;
}

.fs-40{
	font-size: 2.353rem;
}

.fs-25,
.mod_article .fs-25 p{
	font-size: 1.470rem;
}

.fs-17{
	font-size: 1rem;
	line-height: 1rem;
}

.fc-kontrast,
.fc-kontrast:hover{
	color: #e4003a;
}

.fc-inverted,
.fc-inverted:hover{
	color: #fff;
}

.kontrast-inverted{
	color: #fff;
	background: #e4003e;
	padding: 7px;
}

.nachhaltigkeit .fc-kontrast,
.nachhaltigkeit .fc-kontrast:hover,
.nachhaltigkeit .einleitung strong,
.nachhaltigkeit .ce_text span{
	color: #93c124;
	text-decoration-color: #93c124;
}

.nachhaltigkeit .wolf-header .kontrast-inverted{
	color: #fff !important;
	background: #93c124;
	padding: 7px;
}

.nachhaltigkeit .wolf-header h1 a {
	color: #93c124;
}

#header .mod_navigation .level_1 .nachhaltigkeit.active strong,
#header .mod_navigation .level_1 .nachhaltigkeit :hover {
	color: #93c124;
}

a:hover {
	text-decoration: none;
}

.scroll {
	opacity: 0.3;
	margin-top: 1.176rem;
}

label {
	margin-bottom: 0;
	margin-top: 0.66rem;
	font-size: 1.25rem;
}

.hochgestellt {
	font-size: 60%;
	vertical-align: 0.75rem;
}

@media screen and (max-width: 575px) {

.mod_article p {
	font-size: 2.353rem;
}
}

@media screen and (min-width: 576px) and (max-width: 767px){

.mod_article p {
	font-size: 1.75rem;
}
}

@media screen and (min-width: 768px) and (max-width: 1199px){

.mod_article p {
	font-size: 1.25rem;
}
}

@media screen and (min-width: 1340px) and (max-width: 1499px){

.mod_article p {
	font-size: 1.25rem;
}
}

@media screen and (min-width: 1500px) and (max-width: 1649px){

.mod_article p {
	font-size: 1.5rem;
}
}

@media screen and (min-width: 1650px) and (max-width: 1849px){

.mod_article p {
	font-size: 1.75rem;
}
}

@media screen and (min-width: 1850px) {

.mod_article p {
	font-size: 2rem;
}
}


.mod_article h2 {
	font-size: 2.353rem;
	font-family: FFNettoStdBold;
	color: #e4003a;
}

.kontaktdaten a {
	color: #fff;
}

.wolf-header h1 a,
.content-slider h1 a,
.backlink a{
	color: #e4003a;
}

/***** Slider und Header *****/
.wolf-header-pic img {
	padding: 0;
}

@media screen and (min-width: 50px){
	.slider-wrapper,
	.wolf-header,
	.wolf-header-pic img {
	    margin-top: 151px;
	}
}

@media screen and (max-width: 499px){
	.slider-wrapper,
	.wolf-header,
	.wolf-header-pic img {
	    margin-top: 100px;
	}
}

@media screen and (max-width: 380px){
	.content-slider img,
	.wolf-header img {
		max-width: 320px;
	}
}

@media screen and (min-width: 1280px) and (max-width: 1499px) {
	.content-slider img,
	.wolf-header img {
		max-width: 730px;
	}

	.content-slider h1,
	.wolf-header h1 {
		font-size: 2rem;
		margin-top: 45px !important;
	}

	.content-slider p,
	.wolf-header p{
		font-size: 1.25rem !important;
	}

	.content-slider .name,
	.wolf-header .name{
		font-size: 2rem !important;
	}

	.content-slider .fs-40,
	.wolf-header .fs-40{
		font-size: 2rem !important;
	}
}

@media screen and (min-width: 1500px){
	.content-slider img,
	.wolf-header img {
		max-width: 930px;
	}
	
	#h1Behelf{
		font-size: 2.8rem;
	}
	
	.kleingedruckt p{
		font-size: 1.4rem;
	}
}

@media screen and (max-width: 551px) {
.noHeader {
	margin-top: 100px;
}
}

@media screen and (min-width: 551px) and (max-width: 992px){
.noHeader{
	margin-top: 175px;
}
}

@media screen and (min-width: 992px) {
.noHeader {
	margin-top: 200px;
}
}

.content-slider h1,
.wolf-header h1{
	margin-top: 90px;
}

.content-slider p,
.wolf-header p {
	font-size: 1.706rem;
	line-height: 2.118rem;
}

.name{
	font-size: 2.353rem;
	font-family: FFNettoStdBold;
	color: #e4003a;
}

.content-slider img,
.wolf-header img {
	padding-top: 6px;
}


.slider-control .slider-menu b.active {
  color: #e4003a;
	opacity: 0.68;
}



@media screen and (min-width: 1280px){
.slider-control {
	  height: 0px;
	}

	.slider-control .slider-menu{
	 	top:-100px;
	}

	.slider-control .slider-menu b {
		font-size: 5rem;
		letter-spacing: -0.5rem;
	}

 .slider-control a {
		display: none;
	}
}

@media screen and (max-width: 1279px){
	.slider-control a{
		margin-top: -800px;
		color: #e4003a;
		font-size: 4rem;
		font-weight: bold;
		text-decoration: none;
	}

	.slider-control .slider-menu {
		display: none;
	}

	.content-slider img,
	.wolf-header img{
		margin-bottom: 2rem;
	}

}

@media screen and (max-width: 575px){
.slider-control a{
	margin-top: -500px;
	color: #e4003a;
	font-size: 4rem;
	font-weight: bold;
	text-decoration: none;
}
}

/***** Layout *****/
header {
	position: fixed;
	width: 100%;
	z-index: 1000;
	background: #fff;
}

header .naviHeader .container,
footer .container {
	max-width: 1452px;
}

.container {
	max-width: 1536px;
}

.bgKontrastfarbe {
	background: #e4003a;
	color: #fff;
}

footer {
	background: #1d1d1b;
}

.icon img {
	display: block;
	margin: 0 auto;
}

.iconbox{
	text-align: center;
}

.icon figure,
.slider-wrapper figure,
.wolf-header figure {
	margin: 0;
}

.info a,
.info a:link,
.info a:hover {
	color: #fff;
	text-decoration: none;
}

/**** Modul Logo ****/
.logo {
	width: 187px;
	height: auto;
}

@media screen and (max-width: 551px){
	.logo {
		max-width: 120px;
		height: auto;
	}
}

/**** Modul Telefonnummer ****/
.telefonNr:link,
.telefonNr:hover,
.telefonNr:active {
	color: #7c7c7b;
	font-family: FFNettoStdBold;
	text-decoration: none;
	display: inline-block;
	padding-top: 70px;
}

/**** Stimmungsbilder ****/
.stimmungsbilder .ce_image {
	padding:0;
}

/***** Vieportabhängige Styles *****/

@media screen and (min-width: 991px) {
/**** Header-Bereich ****/
#header {
	padding-top: 2rem;
	box-shadow: 0 3px 5px 0 #ccc;
}

/**** Hauptnavigation Desktop ****/
/*** Hack für die Toggle-Navi – Positionierung im Sliderbereich ***/
#mainNavi{
	display: none;
}
/***/

#header .mod_navigation {
	padding: 63px 0 0 0;
}

#header .mod_navigation ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
	display: block;
}

#header .mod_navigation li {
	float: left;
	width: auto;
	margin-right: 2.8235rem;
}

#header .mod_navigation li.last {
	margin-right: 0;
}

#header .mod_navigation a,
#header .mod_navigation strong {
	display: block;
	color: #7c7c7b;
	font-family: Merriweather;
	text-transform: uppercase;
	text-decoration: none;
}

#header .mod_navigation .active,
#header .mod_navigation .trail {
	color: #e4003a;
	font-family: Merriweather;
	font-weight: 800;
}

#header .mod_navigation a:hover,
#header .mod_navigation a:focus {
	color: #e4003a;
	text-decoration: none;
}
}

@media screen and (max-width: 991px) {
/**** Header-Bereich ****/
#header {
	padding-top: 1rem;
	border-bottom: 2px solid #e4003a;
}

/**** Mobile Navigation ****/
#toggleBox {

}

#toggleBox img {
	width: 34px;
	height: auto;
}

#header .mod_navigation,
#mainNavi{
	display: none;
}

#mainNavi.responsive {
	background: #fff;
	color: #7c7c7b;
	margin-top: 133px;
	padding-left: 0;
	display: block;
	position: fixed;
	z-index: 1000;
	opacity: 0.9;
	overflow: inherit;
}

#mainNavi.responsive ul {
	list-style-type: none;
	margin: 1rem 0 0 0;
	padding-left:0;
	display: block;
	background: #fff;
}

#mainNavi.responsive li.sibling,
#mainNavi.responsive li.active,
#mainNavi.responsive li {
		padding-left: 2rem;
	}

#mainNavi.responsive a,
#mainNavi.responsive strong {
	display: block;
	color: #7c7c7b;
	line-height: 2.25rem;
	font-size: 1.125rem;
	text-decoration: none;
	text-transform: uppercase;
}

#mainNavi.responsive .active,
#mainNavi.responsive .trail {
	color: #e4003a;
	font-weight: normal;
}
}

/**** Positionierung der mobilen Navi *****/
@media screen and (min-width: 576px) and (max-width: 992px){
#mainNavi.responsive {
	background: #fff;
	color: #7c7c7b;
	margin-top: 133px;
	padding-left: 0;
	display: block;
	position: fixed;
	z-index: 1000;
	opacity: 0.9;
	overflow: inherit;
}
}

@media screen and (min-width: 552px) and (max-width: 575px){
#mainNavi.responsive {
	background: #fff;
	color: #7c7c7b;
	margin-top: 126px;
	padding-left: 0;
	display: block;
	position: fixed;
	z-index: 1000;
	opacity: 0.9;
	overflow: inherit;
}
}

@media screen and (min-width: 320px) and (max-width: 551px){
#mainNavi.responsive {
	background: #fff;
	color: #7c7c7b;
	margin-top: 85px;
	padding-left: 0;
	display: block;
	position: fixed;
	z-index: 1000;
	opacity: 0.9;
	overflow: inherit;
}
}


/***** Footer-Navigation *****/

@media screen and (min-width: 768px) {
footer {
	display: inline-block;
}

#footers .mod_customnav {
	padding-top: 50px;
}

#footers .mod_customnav ul {
	list-style-type: none;
	padding: 0;
	margin: 0 0 0 100px;
	display: block;
}

#footers .mod_customnav li {
	float: left;
	width: auto;
	margin-right: 2.8235rem;
}

#footers .mod_customnav li.last {
	margin-right: 0;
}

#footers .mod_customnav a,
#footers .mod_customnav strong {
	display: block;
	color: #7c7c7b;
	font-family: FFNettoStdBold;
	text-transform: uppercase;
	text-decoration: none;
}

#footers .mod_customnav .active,
#footers .mod_customnav .trail {
	color: #e4003a;
	font-weight: bold;
}

#footers .mod_customnav a:hover,
#footers .mod_customnav a:focus {
	color: #e4003a;
	text-decoration: none;
}
}

@media screen and (max-width: 767px) {
	#footers .mod_customnav {
		padding: 25px 0 20px 0;
	}

	#footers .mod_customnav ul {
		list-style-type: none;
		padding: 0;
		margin: 0 0 0 0px;
		display: block;
	}

	#footers .mod_customnav li {
		clear: both;
		width: auto;
		margin-right: 0;
	}

	#footers .mod_customnav li.last {
		margin-right: 0;
	}

	#footers .mod_customnav a,
	#footers .mod_customnav strong {
		display: block;
		color: #7c7c7b;
		font-weight: normal;
		text-transform: uppercase;
		text-decoration: none;
	}

	#footers .mod_customnav .active,
	#footers .mod_customnav .trail {
		color: #e4003a;
		font-weight: bold;
	}

	#footers .mod_customnav a:hover,
	#footers .mod_customnav a:focus {
		color: #e4003a;
		text-decoration: none;
	}
	html #footers .mod_customnav a,
	html #footers .mod_customnav strong {
		font-size: 2rem;
		line-height: 4rem;
		text-align: center;
	}

}

/**** Partner-Segment *****/
@media screen and (min-width: 992px) {
	.partnerLogo {
		height: 100px;
		width: auto;
		padding: 0 1rem 0 1rem;
		border-right: 1px solid #e4003a;
	}

	.partnerLogo.first {
		border-left: 1px solid #e4003a;
	}

	.produktbild {
		height: 6rem;
		width: auto;
	}
	.mod_article p.info {
		width: 6rem;
		margin: 0 auto;
		font-size: 1rem;
	}

}

@media screen and (max-width: 991px) {
	.partnerLogo {
		height: 7rem;
		width: auto;
	}

	.partnerLogo.first {
		border-left: 0;
	}

	.partnerLogo.last {
		margin-top: 5rem;
	}

	.mod_article p.info {
		width: 6rem;
		margin: 0 auto;
		font-size: 1rem;
	}

}

@media screen and (max-width: 365px) {
	h1 {
		hyphens: auto;
	}
}

.container-fluid.full-width {
	padding: 0;
}

/****** Formatierung Formulare *****/
[type=text],
[type=email],
[type=tel],
.textarea {
	width: 100%;
	font-size: 1.66rem;
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

.multiselect {
	width: 100%;
	font-size: 1.66rem;
	margin-top: 0;
	margin-bottom: 0.5rem;
}

.widget-explanation{
	max-width: 50%;
	float: left;
}

.widget-submit{
	max-width: 50%;
	float: right;
}

.widget-explanation p{
	font-size: 1.66rem;
}

.submit {
	width: 60px;
}

/***** Bildergalerie *****/
.galerie .ce_image {
	padding: 0;
}

.galerie .ce_image figure{
	margin: 0;
}

.kontaktdaten {
	display: flex;
}

@media screen and (min-width: 320px) and (max-width: 575px) {

.mod_article .kontaktdaten p{
	font-size: 2rem;
}
}

@media screen and (min-width: 576px) and (max-width: 767px) {

.mod_article .kontaktdaten p{
	font-size: 1.5rem;
}
}

@media screen and (min-width: 1340px) {

.mod_article .kontaktdaten p{
	font-size: 1rem;
}
}

/*.galerie .ce_image {
	border: 1px solid #eee;
}*/


.galerie .col-lg-3,
.galerie .col-lg-6,
.galerie .col-md-6,
.galerie .col-xl-3
 {
	padding-left: 0px;
	padding-right: 0px;
}

.mailBildlink img{
	margin-right: 190px;
}

.kontaktdaten p{
	margin-bottom: 0;
}

.kontaktdaten .image_container {
    padding-top: 0.5rem;
}

@media screen and (min-width: 320px) and (max-width: 575px) {

.galerie .kontaktdaten li {
	font-size: 1.7rem;
}

.galerie .kontaktdaten ul li.person::before {
	content: url(../../media/symbole/wolf-at.png);
	vertical-align: -20px;
	margin-right: 10px;
}

.galerie .kontaktdaten li.titel {
	margin-left: 48px;
	margin-top: -20px;
}

.galerie .kontaktdaten li.telefon {
	margin-left: 48px;
	margin-top: 15px;
}
}

@media screen and (min-width: 576px) and (max-width: 1024px){

.galerie .kontaktdaten li {
	font-size: 1.7rem;
}

.galerie .kontaktdaten ul li.person::before {
	content: url(../../media/symbole/wolf-at.png);
	vertical-align: -10px;
	margin-right: 10px;
}

.galerie .kontaktdaten li.titel {
	margin-left: 48px;
	margin-top: -15px;
}

.galerie .kontaktdaten li.telefon {
	margin-left: 48px;
	margin-top: 15px;
}
}

@media screen and (min-width: 1025px) and (max-width: 1199px){

.kontaktdaten {
	display: none;
}

.galerie div.team:hover + div,
div.kontaktdaten:hover {
	display: flex;
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
}

.galerie .kontaktdaten li {
	font-size: 1.7rem;
}

.galerie .kontaktdaten ul li.person::before {
	content: url(../../media/symbole/wolf-at.png);
	vertical-align: -10px;
	margin-right: 10px;
}

.galerie .kontaktdaten li.titel {
	margin-left: 48px;
	margin-top: -15px;
}

.galerie .kontaktdaten li.telefon {
	margin-left: 48px;
	margin-top: 15px;
}

.galerie .mailBildlink{
	text-align: left !important;
}

.mailBildlink img{
	margin-left: 46px;
}
}

@media screen and (min-width: 1200px) and (max-width: 1599px){

.kontaktdaten {
	display: none;
}

.galerie div.team:hover + div,
div.kontaktdaten:hover {
	display: flex;
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
}

.galerie .kontaktdaten li {
	font-size: 1.25rem;
}

.galerie .kontaktdaten ul li.person::before {
	content: url(../../media/symbole/wolf-at.png);
	vertical-align: -10px;
	margin-right: 10px;
}

.galerie .kontaktdaten li.titel {
	margin-left: 48px;
	margin-top: -15px;
}

.galerie .kontaktdaten li.telefon {
	margin-left: 48px;
	margin-top: 15px;
}

.galerie .mailBildlink{
	text-align: left !important;
}

.mailBildlink img{
	margin-left: 46px;
}
}

@media screen and (min-width: 1600px) {

.kontaktdaten {
	display: none;
}

.galerie div.team:hover + div,
div.kontaktdaten:hover {
	display: flex;
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
}

.galerie .kontaktdaten li {
	font-size: 1.7rem;
}

li.person{
	margin-top: 2rem;
}

.galerie .kontaktdaten ul li.person::before {
	content: url(../../media/symbole/wolf-at.png);
	vertical-align: -10px;
	margin-right: 10px;
}

.galerie .kontaktdaten li.titel {
	margin-left: 48px;
	margin-top: -15px;
}

.galerie .kontaktdaten li.telefon {
	margin-left: 48px;
	margin-top: 15px;
}

.galerie .mailBildlink{
	text-align: left !important;
}

.mailBildlink img{
	margin-left: 46px;
}
}
