@charset "utf-8";
/* CSS Document */

* {
padding: 0;
margin: 0;
}


body {
padding: 0;
margin: 0;
background: #fff;
box-sizing: border-box;
font-family: 'Roboto-Regular', sans-serif;
color: #39361a;
font-size: 1.2em;
line-height: 1.2em;


}


/********************** FONTS  ***********************/


@font-face {
  font-family: "Oswald-Regular";
  src: url("/templates/caterei/fonts/Oswald-Regular.woff") format("woff");
}

@font-face {
  font-family: "Oswald-SemiBold";
  src: url("/templates/caterei/fonts/Oswald-SemiBold.woff") format("woff");
}

@font-face {
  font-family: "Roboto-Regular";
  src: url("/templates/caterei/fonts/Roboto-Regular.woff") format("woff");
}

@font-face {
  font-family: "Roboto-Medium";
  src: url("/templates/caterei/fonts/Roboto-Medium.woff") format("woff");
}


/********************** HEADER  ***********************/

.header-wrapper {
	position: absolute;
    position: fixed;
	top: 0;
    left: 0;
	width: 100%;
    height: auto;
    z-index: 9000;
    
	}

.header {
	position: relative;
    display: block;
    margin: 0 auto 0;
    width: 100%;
    max-width: 1400px;
	height: 210px;
    background: rgba(255, 255, 255, 0.95);
	}


@media(max-width:700px) {
.header {
height: 160px;
    
    
	
	
    }
}


.logo {
	position: absolute;
	top: 30px;
	left: 20px;
	width: 265px;
	height: auto;
    z-index: 99999;
	}


.logopic {
	width: 100%;
	max-width: 265px;
	height: auto;
	
}

@media(max-width:700px) {
.logopic {
	max-width: 200px;
    
    
	
	
    }
}

.navigation {
	position: absolute;
	right: 0px;
	top: 120px;
	width: 100%;
	max-width: 800px;
	height: 30px;
	text-align: right;
	
}


@media(max-width:1070px) {
.navigation {
	 max-width: 100%;
    top: 100px;
    text-align: left;
    
	
	
    }
}


@media(max-width:700px) {
.navigation {
	 top: 80px;
    
	
	
    }
}


/********************** NAVIGATION ***********************/

div#maximenuck112 li > a, div#maximenuck112 li > span {
    font-family: 'Oswald-SemiBold' !important;
    font-size: 1.4em !important;
line-height: 1.2em !important;
}


div#maximenuck112 ul.maximenuck li.level1.parent > a::after, div#maximenuck112 ul.maximenuck li.level1.parent > span.separator::after {
    display: none !important;
}


div#maximenuck112.maximenuckh ul.maximenuck li.maximenuck.level1 li.maximenuck > a span.titreck, div#maximenuck112.maximenuckh ul.maximenuck li.maximenuck.level1 li.maximenuck > span.separator span.titreck, div#maximenuck112 li.maximenuck.maximenuflatlistck:not(.level1) span.titreck, div#maximenuck112 .maxipushdownck li.maximenuck > a span.titreck, div#maximenuck112 .maxipushdownck li.maximenuck > span.separator span.titreck {
    font-family: 'Oswald-Regular' !important;
}



div#maximenuck112 a:focus {  outline-width: 2px; outline-style: dashed; outline-color: #989d53 !important;}

div#maximenuck112.maximenuckh ul.maximenuck li.maximenuck.level1 > a:focus span.titreck, div#maximenuck93.maximenuckh ul.maximenuck li.maximenuck.level1 > span.separator span.titreck {
    outline-width: 2px; outline-style: dashed; outline-color: #39361a !important; 
   
}



div#maximenuck112.maximenuckh ul.maximenuck li.maximenuck.level1 li.maximenuck > a:focus span.titreck, div#maximenuck112.maximenuckh ul.maximenuck li.maximenuck.level1 li.maximenuck > span.separator span.titreck, div#maximenuck112 li.maximenuck.maximenuflatlistck:not(.level1) span.titreck, div#maximenuck112 .maxipushdownck li.maximenuck > a span.titreck, div#maximenuck112 .maxipushdownck li.maximenuck > span.separator span.titreck {
    outline-width: 2px; outline-style: dashed; outline-color: #39361a !important; color: #39361a !important;
   
}


[data-id="maximenuck112"] .mobilemenuck-item > .level1 a {
    text-decoration: none !important;
}

[data-id="maximenuck112"] .mobilemenuck-item > .level1 a:hover {
    color: #fff !important;
}

[data-id="maximenuck112"] .mobilemenuck-item > .level2 a {
    text-decoration: none !important;
}

[data-id="maximenuck112"] .mobilemenuck-item > .level2 a:hover {
    color: #fff !important;
}


.mobilemenuck-backbutton {
    display: block;
    color: #fff !important;
    cursor: pointer;
    margin: 15px 0 0 15px;
    border: 2px solid #fff;
    padding: 5px;
    width: 45px;
   
}

.uk-scope .uk-link, .uk-scope a {
  color: #989d53 !important;
 
}


/********************** SUJET ***********************/

.sujet {
	position: relative;
    margin: 210px auto 0;
    width: 100%;
    max-width: 1400px;
    height: auto;
    min-height: 300px;
}


@media(max-width:1400px) {
.sujet {
	 padding: 0 25px 0 25px;
    box-sizing: border-box;
	
	
    }
}

@media(max-width:700px) {
.sujet {
	 margin: 180px auto 0;
    
	
	
    }
}


/********************** BILDER ***********************/


.bild {
width: 100%;
    height: auto;
    
}

.gridbild {
width: 100%;
height: 300px;
    
}

@media(max-width:960px) {
.gridbild {
	height: auto;
	
	
    }
}

.pic-ansprechpartner {
width: 100%;
max-width: 900px;
    height: auto;

    
}

.iconbild {
width: 100%;
max-width: 150px;
    height: auto;
    
}

.footerpic {
width: 100%;
max-width: 400px;
    height: auto;
    margin-top: 30px;

    
}


/********************** GRID ***********************/


.transparent {
    width: 100%;
    height: auto;
    text-align: center;
    
}


.blau {
    width: 100%;
    height: auto;
    min-height: 300px;
    background: #87ccd7;
    text-align: center;
	
}

.gruen {
    width: 100%;
    height: auto;
    min-height: 300px;
    background: #acd3b4;
    text-align: center;
	
}

.braun {
    width: 100%;
    height: auto;
    min-height: 300px;
    background: #debc78;
    text-align: center;
	
}

.zinober{
    width: 100%;
    height: auto;
    min-height: 300px;
    background: #ec8f79;
    text-align: center;
	
}

.braun-ansprech {
    width: 100%;
    height: auto;
    min-height: 150px;
    background: #38361b;
    padding: 20px 10px 20px 10px;
    color: #fff;
    box-sizing: border-box;
    
}

.inspiration {
    width: 100%;
    height: auto;
    background: #38361b;
    padding: 20px 10px 30px 10px;
    color: #fff;
    box-sizing: border-box;
    
}


.grau {
    width: 100%;
    padding: 35px 25px 25px 25px;
    height: auto;
    background: #f0f0f0;
    box-sizing: border-box;
   
	
}

.bg-newsletter {
    width: 100%;
    padding: 35px 25px 25px 25px;
    height: auto;
    background: #39361a;
    box-sizing: border-box;
    text-align: left;
   
	
}



/********************** BUTTONS ***********************/


.button-weiss {
    background: transparent;
    margin-top: 40px;
    padding: 10px 30px 10px 30px;
    border: 1px solid #fff;
    color: #fff !important;
    text-decoration: none !important;
    font-family: 'Oswald-SemiBold';
    font-size: 1.125rem;
    line-height: 1.2rem;
    transition: 0.5s;
    text-align: center;
}

.button-weiss:hover {
    border: 1px solid #38361c;
    background: #38361c;
   
    
        
}


.button {
    background: transparent;
    margin-top: 40px;
    padding: 7px 25px 7px 25px;
    border: 1px solid #39361a;
    color: #39361a !important;
    text-decoration: none !important;
    font-family: 'Oswald-SemiBold';
    font-size: 0.9rem;
    line-height: 1.2rem;
    transition: 0.5s;
    text-align: center;
}

.button:hover {
    border: 1px solid #38361c;
    background: #38361c;
   
    
        
}


.button-invers {
    background: transparent;
    margin-top: 40px;
    padding: 7px 25px 7px 25px;
    border: 1px solid #efefef;
    color: #fff !important;
    text-decoration: none !important;
    font-family: 'Oswald-SemiBold';
    font-size: 0.9rem;
    line-height: 1.2rem;
    transition: 0.5s;
    text-align: center;
}

.button-invers:hover {
    border: 1px solid #fff;
    background: #989d53;
    color: #fff !important;
   
    
        
}

/********************** BREADCRUMBS ***********************/




.breadcrumbs {
	position: relative;
    padding: 0;
    margin: 0 auto 0;
    width: 100%;
    max-width: 1400px;
    height: auto;
    min-height: 30px;
 
}

@media(max-width:1400px) {
.breadcrumbs {
	 padding: 0 0 0 25px;
    box-sizing: border-box;
	
	
    }
}


.breadcrumb {
		font-size: 0.938rem;

}


.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0;
  margin-bottom: 1rem;
  list-style: none;
}

.breadcrumb-item + .breadcrumb-item {
  padding-left: 0.5rem;
}
.breadcrumb-item + .breadcrumb-item::before {
  float: left;
  padding-right: 0.5rem;
  color: #6d757e;
  content: var(--breadcrumb-divider, "/") /* rtl: var(--breadcrumb-divider, "/") */;
}
.breadcrumb-item.active {
  color: #484f56;
}



/********************** CONTENT ***********************/




.content-wrapper {
	position: relative;
    padding: 0;
    margin: 0 auto 0;
    width: 100%;
    max-width: 1400px;
    height: auto;
    box-sizing: border-box;
    text-align: center;
    
 
}


.content-full {
	position: relative;
    margin: 0 auto 0;
    padding: 30px 0 80px 0;
    width: 100%;
    max-width: 1400px;
    height: auto;
    box-sizing: border-box;
    text-align: center;
    
 
}


@media(max-width:1400px) {
.content-full {
	 padding: 30px 25px 80px 25px;
	
	
    }
}


.content {
	position: relative;
    margin: 0 auto 0;
    padding: 60px 25px 60px 25px;
    width: 100%;
    max-width: 1200px;
    height: auto;
    box-sizing: border-box;
    text-align: center;
         
}





/********************** FOOTER***********************/


.footer {
	position: relative;
    margin: 0 auto 0;
    text-align: center;
    width: 100%;
    max-width: 1400px;
	 height: auto;
    min-height: 250px;
	background: #989d53;
    padding: 10px;
    box-sizing: border-box;
	
}

/************ AKKORDION ***************/

.accordion {

  background-color: transparent;
  font-family: 'Oswald-Regular';
color: #989d53;
  cursor: pointer;
  padding: 18px;
  width: auto;
  border: none;
  text-align: center;
  outline: none;
  font-size: 24px;
  transition: 0.4s;
}

.accordion:hover {
  background-color: #989d53;
        color: #fff;
}

.panel {
  padding: 0 18px;
  background-color: transparent;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}


/************ FORMULAR ***************/
	

.formdiv {
margin: 20px auto 0;
font-family: 'Oswald-Regular';
padding: 15px;
color: #39361a;
font-weight: 300;
max-width: 800px;
width: 100%;
min-height: 500px;
height: auto;

}


.formrow {
width: 100%;
height: auto;
text-align: left;


}

.formrow:after {
  content: "";
  clear: left;
	display: table;
}


.formleft {
float: left;
text-align: left;
width: 70%;
height: auto;
	padding-top: 5px;
padding-bottom: 5px;}


.line {
text-align: left;
width: 100%;
height: 1px;
border-top: 1px dotted #4f4f4f;
}

.formright {
position: relative;
float: right;
text-align: right;
width: 30%;
height: auto;
padding-top: 5px;
padding-bottom: 5px;



}

.summenwrapper {
width: auto;
float: right;
box-sizing: border-box;
	

}

.dropdown
{
  font-family: 'Oswald-Regular';
  font-weight: 300;
  font-size: 14px;
  line-height: 10px;
  color: #4f4f4f;
  border: 1px solid #ccc;
   height: 30px;
  padding: 2px 12px 2px 12px;
	background: transparent;
	width: 150px;
	
	
}



.inputleft {
float: left;
text-align: left;
width: 50%;
height: auto;
padding-top: 5px;
padding-bottom: 5px;
box-sizing: border-box;
min-width: 150px;

	
}

.inputright {
float: left;
text-align: left;
width: 50%;
height: auto;
padding-top: 5px;
padding-bottom: 5px;
box-sizing: border-box;
		
	
}

.textinput
{
  font-family: 'Oswald-Regular';
  font-weight: 300;
  font-size: 14px;
  line-height: 20px;
  color: #4f4f4f;
  border: 1px solid #ccc;
  width: 250px;
  height: 25px;
  padding: 2px 6px 2px 6px;
	background: transparent;
  	
}

.textkl {
	font-family: 'Oswald-Regular';
	font-size: 20px;
	color: #4f4f4f;
	font-weight: 300;
	line-height: 24px;
	
}

.textklgruen {
	font-family: 'Oswald-Regular';
	font-size: 20px;
	color: #989d53;
	font-weight: 300;
	line-height: 24px;
	
}


a.textkl:link { color: #4f4f4f; text-decoration:underline !important }
a.textkl:visited { color: #4f4f4f; text-decoration:underline !important }
a.textkl:hover { color: #4f4f4fc; text-decoration:underline !important }
a.textkl:focus { color: #4f4f4f; text-decoration:underline !important}
a.textkl:active { color: #4f4f4f; text-decoration:underline !important}

.buttonform
{
  font-family: 'Oswald-Regular';
  font-size: 1.2rem;
   color: #fff;
  border: 1px solid #ccc;
  width: 150px;
 height: auto;
  padding: 8px 3px 8px 3px;
  background: #4f4f4f;
  margin-top: 24px;
  cursor: pointer;
 }

.buttonform:hover
{
  background: #989d53;
  color: #fff;
 transition: all 0.3s ease 0s;
  
}



/********************** LINKS ***********************/

a:link,a:visited
{
  color: #989d53;
  text-decoration:underline;
	
}

a:hover,a:active
{
  color: #989d53 !important;
  text-decoration:underline;
}


a:focus {
  outline-width: 2px;
  outline-style: dashed;
  outline-color: #989d53;
}


/********************** LISTEN ***********************/

.list-wrapper
{
  positione: relative;
width: 100%;
    max-width: 1400px;
    height: auto;
  
}




ul {
list-style-type: disc;
list-style-position: outside;
margin-left: 20px;
    
    }


dl dt {
 float:left;
 width:5em;
 font-weight:bolder;
    text-align: left !important;
   }

dl dd {
 padding-left:5em;
    padding-bottom: 1.2em;
    text-align: left !important;
 }

/********************** HEADLINES ***********************/


h1 {
	color: #38361c;
    font-family: 'Oswald-SemiBold';
    font-size: 3rem;
    line-height: 3rem;
    text-align: center;
    text-transform: uppercase;

}


@media(max-width:700px) {
   h1 {
	font-size: 2rem;
    line-height: 2rem;
	
	
    }
}


h2 {
	color: #38361c;
    font-family: 'Oswald-SemiBold';
    font-size: 2rem;
    line-height: 2rem;
    text-align: center;

}


@media(max-width:700px) {
   h2 {
	font-size: 1.8rem;
    line-height: 1.8rem;
	
	
    }
}


h3 {
	color: #38361c;
    font-family: 'Roboto-Medium';
    font-size: 1.2rem;
    line-height: 2.0rem;
    text-align: center;

}

.h3.weiss {
	color: #fff;
    font-family: 'Roboto-Medium';
    font-size: 1.4rem;
    line-height: 1.6rem;
    text-align: center;

}




.h1.weiss {
	color: #fff;
    font-family: 'Oswald-SemiBold';
    font-size: 3rem;
    line-height: 3.2rem;
    text-align: center;

}


@media(max-width:700px) {
   .h1.weiss {
	font-size: 2rem;
    line-height: 2rem;
	
	
    }
}


h4 {
	color: #989d53;
    font-family: 'Oswald-Regular';
    font-size: 1.2rem;
    line-height: 1.2rem;
    text-align: center;

}


.text-weiss {
font-family: 'Roboto-Regular', sans-serif;
color: #fff !important;

}

a.text-weiss:link { color: #fff !important; text-decoration:underline !important }
a.text-weiss:visited { color: #fff !important; text-decoration:underline !important }
a.text-weiss:hover { color: #38361c !important; text-decoration:underline !important }
a.text-weiss:focus { color: #38361c !important; text-decoration:underline !important}
a.text-weiss:active { color: #38361c !important; text-decoration:underline !important}


.text-weiss-subheader {
font-family: 'Roboto-Regular', sans-serif;
    font-size: 1.6rem;
    line-height: 2.4rem;
color: #fff !important;

}


.footerline {
font-family: 'Oswald-Regular', sans-serif;
color: #fff !important;

}

a.footerline:link { color: #fff !important; text-decoration:underline !important }
a.footerline:visited { color: #fff !important; text-decoration:underline !important }
a.footerline:hover { color: #fff !important; text-decoration:underline !important }
a.footerline:focus { color: #fff !important; text-decoration:underline !important}
a.footerline:active { color: #fff !important; text-decoration:underline !important}

.footerlinesmall {
font-family: 'Oswald-Regular', sans-serif;
font-size: 0.8rem;
color: #fff !important;

}

a.footerlinesmall:link { color: #fff !important; text-decoration:underline !important }
a.footerlinesmall:visited { color: #fff !important; text-decoration:underline !important }
a.footerlinesmall:hover { color: #fff !important; text-decoration:underline !important }
a.footerlinesmall:focus { color: #fff !important; text-decoration:underline !important}
a.footerlinesmall:active { color: #fff !important; text-decoration:underline !important}