html {
  background-attachment: fixed;
  background-image: url(/fileadmin/Bilder/Mini-Fill/Mini-Fill-8_Liter-Trichter_mit_Doppelauslauf.jpg);
  background-image: url(/fileadmin/Bilder/Mini-Fill/Mini-Fill-8_Liter-Trichter_mit_Doppelauslauf-v3.jpg);
  background-size: cover;
}

body {
  background-color: rgba(255, 255, 255, 0.85);
  color:  #2c2014; 
  color:  rgba(44, 32, 20, 1);  
}


/* General stuff
   -------------- */
.ts-a:after{ content:"@"; }
.ts-b:after{ content:"."; }

/* Fonts (general)
   ------------------------ */
h1, h2, h3 {
  font-family: 'Mulish', sans-serif;
  color:  #2c2014;  
  color:  rgba(44, 32, 20, 1);  
}
p, li, table {
  font-family: 'Open Sans', sans-serif; 
  color:  #2c2014;  
  color:  rgba(44, 32, 20, 1);  
}
a {
  transition: color 0.1s ease-out;
  /* 
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
  */
  color:  #2c2014; 
  color:  rgba(44, 32, 20, 0.8);
}
a:hover {
  transition: color 0.1s ease-out; 
  /*   
  color:  #50473f;
  color:  rgba(80, 71, 63, 0.6);
  */
  color:  #2c2014;
  color:  rgba(44, 32, 20, 0.6);  
}
a.active {
  color:  #2c2014;  
  color:  rgba(44, 32, 20, 1);
}


/* the Header
   ------------ 
*/

#the-header {
  border-bottom: 0px solid #c32f2d;
  height: 148px;
  margin: 0 0 0 0;
  /* background-color: rgba(255, 255, 255, 0.7); */
  z-index: 1000 !important;
  position:relative;
  background: #fff;
  height:120px; 
  height:130px;   
}

#the-header .container-fluid .row .col-md-3 {
  position: relative;
}

#the-header a.product-brand {
  font-family: "Quintessential", serif;
  font-family: "Telex", sans-serif;  
  font-size:72px;
  font-weight: 900;
  font-weight: 500;  
  display:block;
  white-space: nowrap;
  position:absolute;
  top: 16px;
  left:-30px;
  letter-spacing: -2px;  
}
/*
body#pid1 #the-header a.product-brand {
  font-family: "Telex", sans-serif;
  font-size:72px;
  font-weight: 900;
  font-weight: 500;
  display:block;
  white-space: nowrap;
  position:absolute;
  top: 16px;
  left:-30px;
}

body#pid15 #the-header a.product-brand {
  font-family: "Rambla", sans-serif;
  font-size:72px;
  font-weight: 900;
  font-weight: 500;
  display:block;
  white-space: nowrap;
  position:absolute;
  top: 16px;
  left:-30px;
}
*/
#the-header a.product-brand:hover {
  text-decoration: none;
}
#the-header a#product.product-brand::after {
  background-color: rgb(195, 47, 45);
  content: "";
  position: absolute;
  width: 300px;
  width: 271px;
  width: 255px;
  display: block;
  height: 5px;
  bottom: -10px;
  bottom: -5px;
  bottom: 7px;
}

#the-header a.navbar-brand {
  position:absolute;
  top: 10px;
  right:-30px;
   
  box-shadow: 10px 10px 5px #50473f; 
  box-shadow: 10px 10px 5px rgba(80, 71, 63, 0.8);
  
  right:-40px;
  top:0;
  
  height:181px;
  width: 531px;
  
  height:160px;
  width:472px;

  right:-50px;
  top:2px;

  height:146px;
  width:431px;
  
  height:136px;
  width:421px;  
 
 background-color: #fff;
 padding: 5px;
 padding: 7px 7px 7px 7px;
 top: 5px;
}

img#logo {
  height:100%;
  width:100%;
}

#pid1 #the-header {
  position: absolute;
  position: relative;
  top: 0;
  z-index: 1000;
  width:100%;
} 

/* Breadcrumb
   ------------ */
ul#breadcrumb {
  list-style: none;
  padding-left:0;
  padding: 7px 0 0 0;
}
ul#breadcrumb li {
  display: inline;
}
ul#breadcrumb li a {
  text-decoration: none;
}
ul#breadcrumb li a:hover {
  text-decoration: underline;
}
ul#breadcrumb li.breadcrumb_home::before {
  font-family: 'FontAwesome';
  content: "\f015";
  padding: 0 8px 0 0;
}
ul#breadcrumb li.breadcrumb_item::before, ul#breadcrumb li.breadcrumb_item_active::before {
  font-family: 'FontAwesome';
  content: "\f100";
  content: "\f101";
  padding: 0 8px 0 8px;
}

/* main-menu
   --------- */
   
span#mtoggle {
  display:none;
}   
   
ul#main-menu {
  list-style: none;
  padding-left:0;
  padding: 2.6em 0 5em 0;
}
ul#main-menu a {
  text-decoration: none;
}
ul#main-menu li {
  list-style: none;
  position: relative;
  
  line-height:18px;
  margin: 4px 0;
  
  /* F.K. Version 02 */
  margin: 7px 0;  
}
ul#main-menu > li {
padding: 1px 0 2px 0;  

}

ul#main-menu .nav-link {
	display: block;
	padding: .5rem 1rem;
	padding: 0 0;  
}
ul#main-menu li ul {
  margin: 0 0 0 0;
  padding: 0 0 0 0.75rem;
}
ul#main-menu li.spacer {
  padding: 5px 0 5px 0
}
ul#main-menu li.spacer a {
  display:none;
}
ul#main-menu li:hover > a  {
  color:  rgba(44, 32, 20, 0.6);
}
ul#main-menu li.active > a  {
  color:  rgba(44, 32, 20, 1);
}
ul#main-menu li a:hover::before {
  font-family: 'FontAwesome';
  content: "\f100";
  content: "\f101";
  position: absolute;
  left: -12px;
  top:1px;
  top:0;
}
ul#main-menu li.active > a::before {
  font-family: 'FontAwesome';
  content: "\f100";
  content: "\f101";
  position: absolute;
  left: -12px;
  top:1px;
  top:0;
}

span.anfrageAnzahl.anfrageTrue {
  position:relative; 
  top: -5px;
  right: 0px;
  display:inline-block;
  font-size: 10px;
  line-height: 14px;
  text-align:center;
  vertical-align: middle;
  color: #fff;
  width: 16px;
  height: 16px;
  background-color: green;
  border: 1px solid darkgreen;
  border-radius: 50%; /* Erzeugt den Kreis */  
}

/* Home -Layer and Spot
   --------------------- */
#home_layer {
  position: absolute;
  top:0;
  left:0;
  height:100%;
  width:100%;
  /*
  background-color: rgba(78, 78, 80, 0.6);
  background-color: rgba(78, 78, 80, 0.4);  
  */
   background-image: radial-gradient( 
      rgba(78, 78, 80, 0.4) 30%, 
      rgba(78, 78, 80, 0.3) 50%,
      rgba(78, 78, 80, 0.2) 80%,
      rgba(78, 78, 80, 0.1) 100%
   ); 
  z-index:920; 

  position: absolute;
  top: 148px;
  top:120px;
  top: 130px;
  height: 70vh;  
}
#home_spot {
  position: absolute;
  top: 0;
  left: 0;
  z-index:950;  
  height: 100vh;
  width: 100%;
  padding: 37vh 10vw 0vh 10vw; 
  
  position: absolute;
  top: 148px;
  top:120px;
  top: 130px;
  left: 0;
  z-index:950;  
  height: 70vh;
  width: 100%;
  padding: 37vh 10vw 0vh 10vw; 
  padding: 10vh 10vw 0vh 10vw;
  padding: 10vh 10vw 0vh 10vw;  
  
  top: 55vh;
  height: 15vh;
}
#home_spot h1 {
  font-family: Railway, sans-serif;
	font-size: 64px;
	font-weight: 500;
	margin-bottom: 1rem;
	width: 100%;
	text-align: center;
  color: #fff;
}
#home_spot h2 {
  font-family: Railway, sans-serif;
	font-size: 32px;
	font-weight: 500;
	margin-bottom: 2rem;
	width: 100%;
	text-align: center;
  color: #fff;
}
#home_spot h3 {
  font-family: Railway, sans-serif;
	font-size: 24px;
	font-weight: 500;
	margin-bottom: 2rem;
	width: 100%;
	text-align: center;
  color: #fff;
}
#home_spot p {
  font-family: Roboto, sans-serif;
	font-size: 18px;
	font-weight: 500;
  margin-top: 3rem;
  margin-top: 0;  
	margin-bottom: 1rem;
	width: 100%;
	text-align: center;
  color: #fff;
  
	width: 80%;
  margin: 0 auto 1rem auto;   
  
}



/* Sartpage Version 02 PID 26
   -------------------------- */
#pid26 #stage {
  width:100vw;
  width:100%;
  height:70vh; 
}   
   
#pid26 .product-brand {
  display:none !important;
}
#pid26 #the-header {
  z-index: 1000 !important;
  position:relative;
  background: #fff;
  height:120px;
} 

#pid26 #the-header a.navbar-brand {
  left: 0;
  top:5px;
}

#pid26 .theSlicksliderItem {
  height: 70vh;
}
#pid26 #home_layer {
  position: absolute;
  top: 148px;
  top:120px;
  height: 70vh;
}
#pid26 #theSlickslider {
  margin: 0 0 10px 0;
  
  width:100vw;
  width:100%;
  height:70vh;  
  
}
#pid26 #home_spot {
  position: absolute;
  top: 148px;
  top:120px;
  left: 0;
  z-index:950;  
  height: 70vh;
  width: 100%;
  padding: 37vh 10vw 0vh 10vw; 
  padding: 10vh 10vw 0vh 10vw;
  padding: 10vh 10vw 0vh 10vw;
}


/* Stage, Slider
   -------------- */

#pid1 #stage {
  width:100vw;
  width:100%;
  height:70vh;   
}
#pid1 stage .row {
  height:100vh;
}

#theStage {

}

div#adown {
	position: absolute;
	left: 0;
	bottom: 35px;
	text-align: center;
	width: 100%;
  
	top:120px;
  padding-top: 65vh;  
  
}
#pid26 div#adown {
	top:120px;
  padding-top: 65vh;
}

a#downunder {
  margin: 0 auto;
  z-index:1200; 
  position: relative;  
}
a#downunder::before {
	content: "";
	width: 0;
	height: 0;
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;
	border-top: 18px solid #fff;
	clear: both;
	position: relative;
	top: 0;
	left: 1px;
}
a#downunder:hover:before {
  border-top: 18px solid #a5a5a5;   
}
#pid1 #theSlickslider {
  width:100vw;
  width:100%;
  height:100vh;
}
#pid1 #theSlickslider {
  margin: 0 0 85px;
}

.theSlicksliderItem {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center top;
	height: 100vh;
  height: 70vh;  
}

/* Image Protection 
#theSlickslider-off {
  background-image: url(/typo3conf/ext/fip_sitepack4u/Resources/Public/Images/bg_fetsch-ip_protected.png);
  background-repeat: no-repeat;
  background-size: cover;
}
#theSlickslider-off picture, #theSlickslider-off img {
  position: absolute;
  width:100%;
  height:auto;
  top:50%;
  left:50%;
  z-index:1200;
}
*/

#theSlickslider button.slick-prev {
 display: none !important;
}
#theSlickslider button.slick-next {
 display: none !important;
}
#startContent h3 a {
  color: rgba(44, 32, 20, 1);
}


/*  ---- */










div.mf-standard-page {
  
}
div.mf-standard-page img {
  width:100%;
  height: auto;

}

div.mf-standard-page div.frame-width50ph {
  width:50%;
  float:left;  
}
div.mf-standard-page div.frame-width100ph {
  width:100%;
  float:left;  
}

/* 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-size: 40px;
  font-size: 32px;
  font-weight:700;
  line-height: 1.2em;
  padding: 1em 0 0.5em 0;
  margin: 0 0 0 0;
}
main h1.pageTitleContent {
  padding: 0.1em 0 0.5em 0;
  color:  rgba(44, 32, 20, 1);
}
main.product h1.pageTitleContent {
  font-size: 28px;
}
main h2 {
  font-family: 'Mulish', sans-serif;
  color: #000;
  color:  #50473f;
  color:  rgba(80, 71, 63, 1);
  color:  rgba(44, 32, 20, 1);
  font-size: 32px;
  font-size: 28px;
  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);
  color:  rgba(44, 32, 20, 1);
  font-size: 28px;
  font-size: 24px;
  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);  
  color:  rgba(44, 32, 24, 1); 
  color:  rgba(44, 32, 20, 1);
  
}
main table {
  color:  rgba(44, 32, 20, 1);
}
/*
FaRBE IM mAIN KÖNNTE ETWAS DUNKLER SEIN
rgba(80, 71, 63, 1);
*/

/* Product Overview List 
   ----------------------- */
main.productOverview {
  
}

div.productOverviewList {
  
}
div.productOverviewList h1 {
 font-size:28px;
}
div.productOverviewList h2 {
 font-size:26px;
}
div.productOverviewList div.list_item {
  width: 45%;
  padding: 0 2%;
  margin: 0 1% 1% 0;
  float:left;
  position:relative;
  border: 1px solid #2c2014;   
}
/* JP: 6.3.2026 */
div.productOverviewList div.list_item:nth-of-type(2n+1) {
  clear:left;
}
div.productOverviewList div.list_item h3.productOverview {
 font-size:18px;
 height: 57px;
 font-weight: bold;
}
div.productOverviewList div.list_item img {
  width: 100%;
  height: auto;
  border: 0px solid #2c2014; 
  padding-bottom: 11px;
}
div.productOverviewList div.list_item p.kurzbeschreibung {
  position:absolute;
  bottom: 41px;
  bottom: 45px;  
  width:90%;
  padding:3%;
  background: #fff;
  opacity:0;
  transition: opacity 0.6s ease-out;
  border: 1px solid #2c2014; 
}
div.productOverviewList div.list_item p.kurzbeschreibung:hover {
  opacity:1;
  cursor:pointer;
}

div.productOverviewList div.list_item  a.addToCart {
  text-align: right;
}
div.productOverviewList div.list_item p.link {
  width:100%;
  display:flex;
  justify-content: flex-end;
  cursor:pointer;
}
div.productOverviewList div.list_item p.link a.addToCart {
  margin-left: auto;
}
div.productOverviewList div.list_item p.link button.addToCart {
  margin-left: auto;
  cursor:pointer;
}

div.productOverviewList div.list_item p.link button.addToCart span.premove {
  display: none;
}

div.productOverviewList div.list_item p.link button.addToCart span.padd {
  display: inline;
}
div.productOverviewList div.list_item p.link button.addToCart.remove span.premove {
  display: inline;
}
div.productOverviewList div.list_item p.link button.addToCart.remove span.padd {
  display: none;
}
div.productOverviewList div.list_item p.productData {
  width:100%;
  display:flex;
  justify-content: flex-end;
}
div.productOverviewList div.list_item p.productData span.productPrice {
  margin-left: auto;
  position:relative;
  cursor: pointer;
}
div.productOverviewList div.list_item p.productData span.productPrice:hover {
  
}

div.productOverviewList div.list_item p.productData span.productPrice span.priceHint {
  position: absolute;
  right: 0;
  top: 5px;
  opacity: 0;
  transition: opacity 0.6s ease-out;  
  display:none;
  white-space: nowrap;
  background: #fff;
  font-weight: normal;  
}
div.productOverviewList div.list_item p.productData span.productPrice:hover span.priceHint {
  position: absolute;
  left: 0;
  top: 20px;
  opacity: 1;
  display:block;
  background: #fff;
  cursor: pointer;
  width:auto;
  overflow:visible;
}

div.productOverviewList div.list_item.itemSelected::after {
  font-family: 'FontAwesome';
  content: "\f046";  
  position: absolute;
  right: 7px;
  top:8px;
  color:green;
}

/* Product.html
   -------------- */

div.product-details {
  
}
div.product-details h1 {
  font-size: 28px;
}
div.product-details h2 {
  font-size: 26px;
}

div.product-details.checked::after {
  font-family: 'FontAwesome';
  content: "\f046";
  font-size:22px;  
  position: absolute;
  right: 7px;
  top:8px;
  
  right: 0px;
  top:8px;
  color:green;
}


div.product-details table.pOptions {
 /* width: 230px; */
 min-width: 215px;
 position:absolute;
 top:47px;
 right: -5px;
  
}
div.product-details table.pOptions td.mf-currency {
  text-align: right;
}

div.product-details table.pOptions td.price-hint {
  font-size: 14px;
  color:  rgba(44, 32, 20, 0.8);  
}

div.product-details button.p-anfrage {
  position:absolute;
  right: 0;
  top: 452px;
  cursor: pointer;
}

div.product-details button.p-anfrage span.premove {
  display: none;
}

div.product-details button.p-anfrage span.padd {
  display: inline;
}
div.product-details button.p-anfrage.remove span.premove {
  display: inline;
}

div.product-details button.p-anfrage.remove span.padd {
  display: none;
}

button.btn-warning.remove {
  background-color: rgba(255, 193, 7, 0.7);
  border-color: rgba(255, 193, 7, 0.8);
}

div.mfinterest-item a {
  margin-left:15px;
  position:relative;
}

div.mfinterest-item a:before {
  font-family: 'FontAwesome';
  content: "\f100";
  content: "\f101";
  position: absolute;
  left: -12px;
  top:0px;
}

div.product-details a.back-link {
 position:relative;
 margin-left: 20px;
}
div.product-details a.back-link::before  {
  font-family: 'FontAwesome';
  content: "\f100";
  content: "\f101";
  position: absolute;
  left: -12px;
  top:-1px;
}

/* TYPO3 FORM FRAMEWORK 2025, 2026 
   ------------------------------- */
form div.form-group {

}
form div.form-group label.form-label {
  width:25%;
  float:left;
  display:block;
  margin:7px 0 0 0;
  clear:left;
  line-height:22px;
}
form div.form-group label.form-label + div.input {
  width:70%;
  width:75%;  
  float:left;
  display:block;
  margin:0 0 15px 0;
}
form div.form-group textarea.xxlarge.form-control {
  min-height: 130px;
}
form div.form-group div.input div.form-text {
  display:none;  
}
form div.actions {
  clear:left;
}
form div.form-group div.captcha {

  float:left;
  display:block;
  margin:0 0 15px 0;
  width:75%; 
}
form div.form-group div.captcha img {
  width: auto;
  padding: 0;
  vertical-align:top;
}


form div.form-group div.captcha + input {
  width:70%;
  width:75%;  
  margin-left:25%;
  float:left;
  display:block;
  margin: 0 0 15px 25%;
}
form div.form-group div.captcha + input + div.form-text {
  display:none;  
}
form div.form-group div.captcha + input + div.form-text.error {
  display:block;  
  color:red; 
}
main form h2 {
  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;
  padding: 0.5em 0 0.8em 0;
  margin: 0 0 0 0;
}
form div.btn-group button.btn-primary {
  color: #fff;
  background-color: rgba(80, 71, 63, 1);
  border-color: rgba(80, 71, 63, 0.8);  
}
form div.btn-group button.btn-primary:hover {
color: #fff;
  background-color: rgba(80, 71, 63, 0.8);
  border-color: rgba(80, 71, 63, 0.6);
}
form div.clearfix {
  clear: left;
}
form .form-control {
 
}
form#anfrageformular-24 textarea#anfrageformular-24-textarea-2 {
  display:none;
}
form#anfrageformular-24 label.form-label[for="anfrageformular-24-textarea-2"] {
  display:none;
}
form#anfrageformular-24 label.form-label[htmlFor="anfrageformular-24-textarea-2"] {
  display:none;
}
#pageContent form button[type="submit"] {
  cursor: pointer;
}

/* Sitemap
   -------- */

.frame-type-menu_sitemap ul {
  list-style: none;
  padding-left: 1rem;
}
.frame-type-menu_sitemap > ul {
  padding-left:0;
}
.frame-type-menu_sitemap ul a {
 text-decoration: none;
  color:  #2c2014; 
  color:  rgba(44, 32, 20, 1); 
}
.frame-type-menu_sitemap ul a:hover {
 text-decoration: underline;
  color:  #2c2014; 
  color:  rgba(44, 32, 20, 0.6); 
}
.frame-type-menu_sitemap ul li {
  position:relative;
}
.frame-type-menu_sitemap ul li a:hover::before {
  font-family: 'FontAwesome';
  content: "\f100";
  content: "\f101";
  position: absolute;
  left: -12px;
  top:1px;
  top:0;
}





/* 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 h2 {
  color: #fff;
}

footer h3 {
  margin-top:1.5rem;  
  font-size: 24px;
  margin-bottom:2rem;
  color: #fff;  
}
footer p, footer ul, footer table {
  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 a:hover {
  color: #fff;
  /* color: rgba(80, 71, 63, 0.7); */
  color: rgba(255, 255, 255, 0.5);
}
footer #copyright p {
  color: #fff;  
}

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 {
  color: #fff;
}
footer #copyright ul li:after {
  content: "|";
  padding: 0 10px;
  color: #fff;
}
footer #copyright ul li:last-child:after {
  content: "";
  padding: 0 0;
  color: #fff;
}
footer #contentFooter .col-md-8 {
  padding-left: 146px;
  padding-left: 50px;
}