/* Page
   --------  */

body {
   position:relative;

/* Bisque 	FF E4 C4 	255 228 196 
   -----------------------------  */
   background-color:#FFE4C4;
   background-color:rgba(255, 228, 196, 0.6);
   background-color:rgba(255, 228, 196, 0.3);
   background-color:rgba(255, 228, 196, 0.1);
   font-family: 'Open Sans', sans-serif;
}
body.product {
  /*
    background-image: url(/res/test_background-texture-141716974.jpg);
    background-size:cover;
    background-attachment: fixed;
  */
}


html {
  overflow-y:scroll;  
}
main, header#pageheader, footer {
  display:block;
  margin:0;
  padding:0;
}

/* General
   --------  */
a {
  transition: color 0.1s ease-out;
  /* color: #353535;  */
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
}
a:hover {
  transition: color 0.1s ease-out;  
  /* color: #6b6b6b; */
  color:  #50473f;
  color:  rgba(80, 71, 63, 0.7);
}
.ts-a:after{ content:"@"; }
.ts-b:after{ content:"."; }

/* HEADER: Logo, Brand
   ----------------------- */
nav.navbar {
  background-color: #fff;

}
a.navbar-brand#brand {
  position: absolute;
  right:0;
  top:0;
  display:block;
  /*
  height:181px;
  width: 531px;
  */
  height:136px;
  width: 398px;  
  padding:8px;
  background-color:#fff;
  /*
  box-shadow: 10px 10px 5px silver;  
  box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.4);
  */
  box-shadow: 10px 10px 5px #50473f; 
  box-shadow: 10px 10px 5px rgba(80, 71, 63, 0.8);
}
img#logo {
  height:100%;
  width:100%;
}

/* HEADER: Main Menu
   ----------------------- */
#header-menu {
  position:relative;
}
#cmenu.row {
  position:static;
}
span.menutoggle {
  display: none;
  position: absolute;
  top:0;
  Left:0;
} 
   
/* x */
span.menutoggle::before { 
  content:"\f00d" 
}

/* Bar menu */
span.menutoggle::before {
  content:"\f0c9";  
}

ul#main-menu {
  z-index: 1100;
  list-style: none; 
  margin:0; 
  margin-top:80px;
  margin-top:120px;
  margin-top:140px;  
  margin-top:80px;
  padding:0;
}
ul#main-menu  > li {
  position:relative;
  float: left;
  cursor:pointer;
  font-weight: 400;
}
ul#main-menu  > li  a {
  padding: 0 0 0 0;
  margin: 0 20px 0 20px;  
  margin: 0 20px 0 0;
  text-decoration: none;  
}
ul#main-menu  > li a:hover {
  text-decoration: underline;
}
ul#main-menu  > li.selected > a {
  text-decoration: none;
  color:  rgba(80, 71, 63, 0.8);
}
ul#main-menu  > li.selected > a:hover {
  text-decoration: underline;
  color:  rgba(80, 71, 63, 0.8);
}

ul#main-menu  li ul {
  position: absolute;
  display:none;
  min-width:400px;
  list-style: none; 
  margin:0; 
  padding: 15px 10px 15px 10px ;
  padding: 20px 15px 20px 20px ; 
  padding: 25px 15px 30px 30px ; 

  box-shadow: 10px 10px 5px #50473f; 
  box-shadow: 10px 10px 5px rgba(80, 71, 63, 0.8);  
}
ul#main-menu > li > ul > li {
  margin: 3px 0 3px 0;
}

ul#main-menu > li > ul > li a {
  position:relative;
}

ul#main-menu > li > ul > li:hover a::before, ul#main-menu > li > ul > li.selected a::before  {
  font-family: 'FontAwesome';
  content: "\f100";
  content: "\f101";
  position: absolute;
  left: -12px;
  top:-1px;
}
ul#main-menu > li > ul > li.selected a {
  text-decoration: none;
}
ul#main-menu > li > ul > li.selected a:hover {
  text-decoration: underline;
}

ul#main-menu  li:hover ul { 
  display:block;
  background-color: #fff;
}

/* HEADER: Language
   ---------------- */
header#pageheader a#lang-de {
  top: 12px;
  left:12px;
  font-family: 'Mulish', sans-serif;
  font-size:18px;
  line-height:26px;  
}
header#pageheader a.lang {
  color:  rgba(80, 71, 63, 0.6);
  font-weight:400;
}
header#pageheader a.lang.selected {
  color:  rgba(80, 71, 63, 1);
  font-weight:700;
}
header#pageheader a#lang-en {
  top: 12px;
  left: 52px; 
  left: 42px;
  font-family: 'Mulish', sans-serif;  
  font-size:18px;
  line-height:26px; 
}
header#pageheader a#lang-de:hover{

}
header#pageheader a#lang-en:hover{

}
/* HEADER: Social Icons
   --------------------- */
header#pageheader a.socialicon {
  position: absolute;
  top:22px;
  font-size:26px;
  line-height:26px;
  font-size:24px;
  line-height:24px;
  text-decoration:none;
}
header#pageheader a.socialicon span {
  position: absolute;
  display:none;
  text-align:left;
  font-size:16px; 
  
  white-space: nowrap;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  line-height: 18px;
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
  
  border: 1px solid grey;
  border-radius: 4px;
  padding:0px 4px;
  background-color: white;
  text-align:right;
  border: 1px solid grey;
  border-radius: 4px;
  
  width: auto;
  top:32px;
  left: 0;
} 
header#pageheader a.lang:hover span {
  display:block;
  color:  rgba(80, 71, 63, 1);
  font-weight:normal;
}
header#pageheader a.title {
  display: none;
}

/* Phone */
header#pageheader a#phone {
  top: 12px;
  left:100px;  
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
}
header#pageheader a#phone:hover {
  color:  rgba(80, 71, 63, 0.6);
}
header#pageheader a#phone:hover span {
  display:block;
  color:  rgba(80, 71, 63, 1);
}
/* E-Mail */
header#pageheader a#email {
  top: 12px;  
  left:136px;
  left:134px;  
  cursor:pointer;
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
}
header#pageheader a#email:hover {
  color:  rgba(80, 71, 63, 0.6);
}
header#pageheader a#email:hover span {
  display:block;
  color:  rgba(80, 71, 63, 1);
}

/* Print */
header#pageheader a#print {
  top: 12px;  
  left:172px; 
  left:168px;  
  cursor:pointer;
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
}
header#pageheader a#print:hover {
  color:  rgba(80, 71, 63, 0.6);
}
header#pageheader a#print:hover span {
  display:block;
  color:  rgba(80, 71, 63, 1);
}

/* other */
header#pageheader a#facebook {
  right:12px;
  display: none;
}
header#pageheader a#twitter {
  right:-16px;
  display: none;  
}

div.search {
  position: absolute;
  top: 4px;  
  left:235px; 
}

.searchTerm {
  width: 250px;
  border: 3px solid #9e0098;
  border: 1px solid rgba(80, 71, 63, 0.5);
  padding: 1px 3px;
  margin: 2px;
  outline: none;
  color: rgba(80, 71, 63, 0.8); 
}
.searchTerm:focus{
  border: 1px solid rgba(80, 71, 63, 0.7);
  color: rgba(80, 71, 63, 0.9);  
}
.searchButton {
  position:relative;
  top:3px;
  left:3px;
  border:none;
  background: none;
  text-align: center;
  color: rgba(80, 71, 63, 0.5);
  cursor: pointer;
  font-size:24px;
  margin:0;
  padding:0;
}
.searchButton:hover {
  color: rgba(80, 71, 63, 0.9);
}





/* Headerbar 
   ---------- */
#headerbar {
  background-color: #c32f2d;
  background-color: rgb(195, 47, 45);
  color: #fff;
  padding-top: 1vh;
  
  padding: 50px 0 25px 0;
  padding: 15px 0 15px 0;
}
#headerbar h1, #headerbar h2 {
  color: white;
}

/* Content
   ------- */
main {
  min-height: 180px;
}
main h1 {
  font-family: 'Mulish', sans-serif;
  color: #000;
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
  font-size: 44px;
  font-weight:700;
  line-height: 1.2em;
  padding: 1em 0 0.5em 0;
  margin: 0 0 0 0;
}
main h2 {
  font-family: 'Mulish', sans-serif;
  color: #000;
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
  font-size: 32px;
  font-weight:700;
  line-height: 1.2em;
  padding: 1em 0 0.5em 0;
  margin: 0 0 0 0;  
}
main h3 {
  font-family: 'Mulish', sans-serif;
  color: #000;
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
  font-size: 28px;
  font-weight:500;
  line-height: 1.2em;
  padding: 0.5em 0 0.25em 0;
  margin: 0 0 0 0;  
}
main p {
  font-family: 'Open Sans', sans-serif; 
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);  
}

#slideritem01 {
  background-image: url(/res/preview_642307195.png);
  background-size: cover;
  height:60vh;
  box-sizing: border-box;
}
.theSlicksliderItem {
  padding: 8vh 30vw 5vh 10vw;
  text-align:left;  
}
.theSlicksliderCaption {
  padding: 5vh 5vw 3vh 5vw;
  background-color: rgb(195, 47, 45);
  background-color: rgba(195, 47, 45, 0.8);
  text-align:left;
}
.theSlicksliderItem h1 {
  font-family: 'Mulish', sans-serif;
  color: #fff;
  font-size: 8vh;
  font-weight:700;
  line-height: 1.1em;
  padding: 0 0 0 0;
}
.theSlicksliderItem p {
  font-family: 'Mulish', sans-serif;
  color: #fff;
  font-size: 5vh;
  line-height: 1.2em;
  padding: 0 0 0 0;
}

/* Slider swiper
   ------------ */
.pslider {
  height:400px;
  height:450px;
  height:450px;
  width: 475px;
  padding: 15px 15px 5px 15px;
  border: 1px solid #50473f;
  border: 1px solid rgba(80, 71, 63, 0.6);
  margin: 0 0 15px 0;
}
.swiper-button-next, .swiper-button-prev {
  color:  #50473f;
  color:  rgba(80, 71, 63, 0.0);
}
.mySwiper2:hover .swiper-button-next, .mySwiper2:hover .swiper-button-prev {
  color:  #50473f;
  color:  rgba(80, 71, 63, 0.6);
}
.mySwiper2:hover .swiper-button-next:hover, .mySwiper2:hover .swiper-button-prev:hover {
  color:  #50473f;
  color:  rgba(80, 71, 63, 0.8);
}

.swiper-button-prev {
  left: 10px;
  right: auto;
}
.swiper {
  width: 445px;
  height: 340px;
  margin-left: 0;
  margin-right: 0;
}

.swiper-slide {
  background-size: cover;
  background-position: center;
}

.mySwiper2 {
  height: 80%;
  width: 445px;
}

.mySwiper {
  height: 20%;
  box-sizing: border-box;
  padding: 10px 0;
}
.mySwiper img {
  cursor: pointer;
}
.mySwiper .swiper-slide {
  width: 25%;
  height: 100%;
  opacity: 0.4;
}

.mySwiper .swiper-slide-thumb-active {
  opacity: 1;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Section Welcome
   ---------------- */
section#welcome {
  padding-top:25px;
  padding-bottom:75px;
}

section#welcome h2 {
  font-family: 'Mulish', sans-serif;
  color: #000;
  color: #50473f;
  color: rgba(80, 71, 63, 1);
  font-size: 32px;
  font-size: 36px;
  font-weight: 700;
  line-height: 1.2em;
  padding: 1em 0 0.5em 0;
  margin: 0 0 0 0;
}

/* Section Main Home
   ---------------- */

section#home-main {
  background-color:#FFE4C4;
  background-color:rgba(255, 228, 196, 0.9);
  
  background-color:  #50473f;
  background-color:  rgba(80, 71, 63, 0.7);
  color:#fff;
  background-color:  #fff;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-attachment: fixed;
  background-image: url(/res/stock-photo-fresh-baked-bread-and-wheat-ears-on-a-wooden-background-1906578136.jpg);
  background-size: cover;
}

section#home-main .overlay {
  padding-top:50px;  
  background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
  background: rgba(80, 71, 63,  0.6) none repeat scroll 0 0;
  background: rgba(80, 71, 63,  0.7) none repeat scroll 0 0;  
  padding-bottom:100px; 
  
}

section#home-main h1, section#home-main h2 , section#home-main h3 {
  color: #fff;
} 
section#home-main a, section#home-main a {
  color: #fff;
}

section#home-main h3 {
  font-family: 'Mulish', sans-serif;
  color: #fff;
  font-size: 32px;
  font-weight: 500;
  line-height: 1.2em;
  padding: 0.5em 0 0.75em 0;
  margin: 0 0 0 0;
}
section#home-main ul {
  list-style: none;
  margin: 0;
  padding: 0 0 0 15px;
}

section#home-main li {

}
section#home-main li a, section#home-main a {
  list-style: none;
  color: #fff;
  text-decoration: none;  
  position:relative;
}
section#home-main li:hover a, section#home-main a:hover li {
  color:  #fff;
  text-decoration: underline;
}
section#home-main h3 {
  text-decoration: none !important;  
}
section#home-main li:hover a::before, section#home-main li.active a::before {
  font-family: 'FontAwesome';
  content: "\f100";
  content: "\f101";
  position: absolute;
  left: -12px;
  top:-1px;  
}


/* Section Teaser Home
   ------------------ */
   
section#teaser {
  padding-top:50px;  
  padding-bottom:25px; 
  transition: all 1s;
  opacity:1.0;
}
section#teaser.pale {
  opacity:0.3;
  transition: all 1s;
}
section#teaser .col-md-4 {

}
section#teaser .col-md-4 .teaserwrap {

  border: 1px solid #50473f;
  border: 1px solid rgba(80, 71, 63, 0.6);
  padding: 0 0 15px 0;
}
section#teaser h3 {
    font-family: 'Mulish', sans-serif;
    color: #000;
    color: #50473f;
    color: rgba(80, 71, 63, 1);
    font-size: 32px;
    font-size: 28px;    
    font-weight: 500;
    line-height: 1.2em;
    padding: 0.5em 0 0.5em 0;
    margin: 0 0 0 0;
    text-align: center;
}
section#teaser p {
    text-align: center;
}
#rteaser .col-md-4 img {
  width:80%;
  height:auto;
  display: block;
  margin: 0 auto;
}
#rteaser h1 a, #rteaser h2 a, #rteaser h3 a {
  text-decoration:none;
}

#rteaser:hover {
  cursor:pointer;
  color:  #50473f;
  color:  rgba(80, 71, 63, 0.7);  
}
.teaserwrap:hover p, .teaserwrap:hover h3 a {
  color:  #50473f;
  color:  rgba(80, 71, 63, 0.7) !important; 
}
#rteaser a:hover {
  color:  #50473f;
  color:  rgba(80, 71, 63, 0.7);
}
#rteaser img {

  -webkit-transition: all .2s ease;
  -moz-transition: all .2s ease;
  transition: all .2s ease;  
}
#rteaser .teaserwrap:hover img {
  transform: scale(1.05, 1.05);
  overflow:hidden;
  
}


/* Breadcrumb
   ------------ */
ul#bread_crumb {
  list-style: none;
  padding-left:0;
  padding: 7px 0 0 0;
}
ul#bread_crumb li {
  display: inline;
}
ul#bread_crumb li a {
  text-decoration: none;
}
ul#bread_crumb li a:hover {
  text-decoration: underline;
}
ul#bread_crumb li.bread_crumb_home::before {
  font-family: 'FontAwesome';
  content: "\f015";
  padding: 0 8px 0 0;
}
ul#bread_crumb li.bread_crumb_item::before {
  font-family: 'FontAwesome';
  content: "\f100";
  content: "\f101";
  padding: 0 8px 0 8px;
}
/*
  <   
  << "\f100"
  >
  >> "\f101"
*/




/* Productmenü
   ------------ */
ul.productmenu {
  list-style: none;
  padding-left:0;
}
ul.productmenu a {
  text-decoration: none;
}
ul.productmenu li {
  list-style: none;
  position: relative;
}
ul.productmenu > li {
padding: 1px 0 2px 0;  
}
ul.productmenu ul {
  display: none;
}
ul.productmenu ul.expanded {
  display: block;
}
ul.productmenuL2 {
  list-style: none;
  padding-left:1rem;
}
ul.productmenuL3 {
  list-style: none;
  padding-left:1rem;
}
ul.productmenuL4 {
  list-style: none;
  padding-left:1rem;
}
ul.productmenu li:hover a {
  text-decoration: underline;
}
ul.productmenu li:hover a::before, ul.productmenu li.active a::before  {
  font-family: 'FontAwesome';
  content: "\f100";
  content: "\f101";
  position: absolute;
  left: -12px;
  top:1px;
}
ul.productmenu li:hover {

}
ul.productmenu li.active {
  font-weight: 600;
}

#contentBody {
  position:relative;
}
main.product {

}

/* pMeta - Produkttools 
   --------------------- */

div#pMeta {
  position:absolute;
  top: 88px;
  top: 150px;
  right: 90px;
  z-index:1000;
  width:auto;
}
#pMeta a {
  position:relative;
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
}
#pMeta a::before {
  font-family: 'FontAwesome';
  position: absolute;
  /*
  font-size: 22px;
  line-height: 22px;
  */
  font-size: 24px;
  line-height: 24px;
  left: 0;
  top:0;
}
#pMeta a:hover {
  color: rgba(80, 71, 63, 0.6);
}

#pMeta a#pCheck::before  {
  content: "\f096";
  left:0;
  top:0;
}
#pMeta a#pCheck:hover::before  {
  content: "\f046";
}
#pMeta a#pCheck.checked::before  {
  content: "\f046";
}
#pMeta a#pPrint::before  {
content: "\f02f";
  left: 32px;
}
#pMeta a#pDownload::before  {
  content: "\f019";
  left: 0;
  left: 64px;
}
#pMeta .p-anfrage {
  position:absolute;
  top: 100px;
  top: 393px;
  right:-75px;
  white-space: nowrap;
}
.btn-secondary {
    color: #fff;
    background-color: #5c636a;
    border-color: #565e64;
}
.btn-secondary {
    color: #fff;
    background-color: rgba(80, 71, 63, 1);
    border-color: rgba(80, 71, 63, 0.8);
}
.btn-secondary:hover, .btn-secondary.active,.btn-secondary:active, .btn-secondary.dropdown-toggle, .btn-secondary:visited, .btn-secondary:focus {
    color: #fff;
    background-color: rgba(80, 71, 63, 0.8);
    border-color: rgba(80, 71, 63, 0.6);
}
.btn-secondary:focus {
    box-shadow: 0 0 0 0;
}


/* pMeta - Hilfetext 
   ------------------ */

#pMeta a span {
  display: none;
  white-space: nowrap;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  line-height: 18px;
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
  position:absolute;
  top:28px;
  right:0;
  border: 1px solid grey;
  border-radius: 4px;
  padding:0px 4px;
  background-color: white;
  text-align:right;
  border: 1px solid grey;
  border-radius: 4px;
}
#pMeta a#pCheck span {
  right:-30px;
}
#pMeta a#pPrint span {
  right:-60px;
}
#pMeta a#pDownload span {
  right:-90px;
}
#pMeta a:hover span {
  display: block;
}





.product_list {
  
}

a.link_list_item {
  display:block;
  padding: 15px 15px 15px 15px;
  border: 1px solid #50473f;
  border: 1px solid rgba(80, 71, 63, 0.6);
  margin: 0 0 15px 0;
  float:left;
}
.link_list_item:hover {
  background-color:rgba(255, 228, 196, 0.4);
  background-color:rgba(255, 228, 196, 0.3);
}

.list_item {
  clear:both;

}
.list_item:hover {

}
.list_item h3 {
padding: 0 0 0.25em 0;
}
.list_item_body {
  float:left;
  position:relative;
}

.list_item_body img {
  width: 20%;
  height: auto;
  float:left;
  -webkit-transition: all .1s ease;
  -moz-transition: all .1s ease;
  transition: all .1s ease;  
}
.list_item_body:hover img {
  width: 20%;
  height: auto;
  float:left;
  transform: scale(1.04, 1.04);
  overflow:hidden;
  
}
.list_item_body p.kurzbeschreibung {
  width: 80%;
  height: auto;
  padding: 0;
  padding-left:5%;
  padding-right:2%;
  float:left;
  margin:0;
}
.list_item_body p:hover {
  
}
.list_item_body p.link {
  width: 80%;
  height: auto;
  padding: 0;
  padding-left:5%;
  padding-right:2%;
  float:right;
  text-align:right;
  margin:0;
    position:absolute;
    bottom:-5px;
    right: 2%;
}

a.link_list_item {
  text-decoration: none;
}
a:hover .list_item_body p.link {
  text-decoration: underline;
}
a .list_item h3 {
  text-decoration: none;
}
a:hover .list_item h3 {
  text-decoration: none;
}





/* Prefooter
   ------- */

div.prefooter {
  padding-top: 5vh;
  padding-bottom: 5vh;
}

/* Footer
   ------- */
footer.mainfooter {
  background-color: #c32f2d;
  background-color: rgb(195, 47, 45);
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.2) 5%, rgba(255, 255, 255, 0.1) 10%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.3) 95%);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.2) 5%, rgba(0, 0, 0, 0.1) 10%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 95%);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.1) 5%, rgba(0, 0, 0, 0.2) 10%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.2) 90%, rgba(0, 0, 0, 0.1) 95%);
  color: #fff;
  padding-top: 5vh;
}
footer h3 {
  margin-top:1.5rem;  
  font-size: 24px;
  margin-bottom:2rem;
  color: #fff;  
}
footer #copyright {
  margin-top:20px;
  margin-bottom:2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;  
}  
footer a {
  color: #fff;
}
footer #copyright p {
}

footer #copyright ul  {
  list-style: none;
  padding:0;
  margin:0;
}
footer #copyright ul li {
  float:left;
  padding: 0 0 0 0;
}
footer #copyright ul li  a {

}
footer #copyright ul li:after {
  content: "|";
  padding: 0 10px;
}
footer #copyright ul li:last-child:after {
  content: "";
  padding: 0 0;
}









