/*
https://utopia.fyi/type/calculator
*/

@font-face {
    font-family: 'geomanistregular';
    src: url('/font/geomanist-regular-webfont.eot');
    src: url('/font/geomanist-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/font/geomanist-regular-webfont.woff2') format('woff2'),
         url('/font/geomanist-regular-webfont.woff') format('woff'),
         url('/font/geomanist-regular-webfont.ttf') format('truetype'),
         url('/font/geomanist-regular-webfont.svg#geomanistregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'geomanistbold';
    src: url('/font/geomanist-medium-webfont.eot');
    src: url('/font/geomanist-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('/font/geomanist-medium-webfont.woff2') format('woff2'),
         url('/font/geomanist-medium-webfont.woff') format('woff'),
         url('/font/geomanist-medium-webfont.ttf') format('truetype'),
         url('/font/geomanist-medium-webfont.svg#geomanistbold') format('svg');
    font-weight: normal;
    font-style: normal;
    
}



:root {
  --green: #005050;
  --grey: #f2eee4;
  --white: #ffffff;
  --black: #000000;
  --orange:#ffafaf;
  --red:#FF5C5C;
  --red:#FF7300;
  --hoover:#5D5D5D;
  --maxwidth: 1140px;
  --maxwidth: 1340px;
  --fontweight:regular;
  
  /* Font Size https://utopia.fyi/type/calculator */
  --f1: clamp(1.88rem, calc(1.14rem + 3.66vw), 3.75rem); /* 30 - 60% */
  --f2: clamp(1.25rem, calc(0.76rem + 2.44vw), 2.50rem); /* 20 - 40 */
  --f3: clamp(1.25rem, calc(1.01rem + 1.22vw), 1.88rem); /* 20 - 30 */
  --default: clamp(1.00rem, calc(0.93rem + 0.37vw), 1.19rem); /* 16 - 19 */
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}


body {
  font-family: 'geomanistregular';
  font-size: var(--default);
  letter-spacing: 1px;
  line-height: 130%;
  width:100%;
  background-color:#ffffff;
}


/* Helpers */ 
a:link, a:visited{
  color: var(--green);
  text-decoration:none;
}
a:hover, a:active{
  color: var(--green);
  color: var(--red);
  color: var(--hoover);
  text-decoration:none;
}
a.active{
  font-family: 'geomanistbold' ! important;
  font-weight: var(--fontweight);
  color: var(--red);
}
strong{
  font-family: 'geomanistbold';
  font-weight: var(--fontweight);
}
.show{
  display:block !important;
}
.hide{
  display:none; 
}
.staging{
  position: absolute;
  z-index: 11;
  text-align: center;
  width: 100%;
  background-color: yellow;
}


.ratio:after{
  padding-top: 56.25%;
  /* 16:9 ratio */
  display: block;
  content: '';
}
.row{
	clear:both;
}
.left, .right{
  float:left;
  width:50%;
}
strong{
	
}
.clear{
	clear:both;
}
h1, h2, h3{
  font-weight:normal; 
}



/* Header & Menu */
.page-header{
	
}
.page-header-inner{
  page-header-inner
}
.trigger-menu-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  transition: transform 0.8s;
  background: var(--grey);
  z-index:4;
}
.menu-inner{
  width:100%;
  max-width: var(--maxwidth);
  margin:0 auto; 
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-content: center;
}
.header-left{
  display:flex;
  justify-content: space-between;
  align-items: center;
  width:80%;
}
.logo-holder{
  width:clamp(12.50rem, calc(10.06rem + 12.20vw), 18.75rem);
  min-width:150px;
  transition: 0.3s;
  padding-right:50px; /* fluid */
}
.logo-holder img{
  width:100%;
}
.menu-holder{
  position:relative; 
  width:200px;	
}
.menu-holder button {
  background: transparent;
  border: none;
  cursor: pointer;
  outline: none;
}
.menu-holder img{
  width:75px; /* fluid */
}
.menu-eck{
  width: 175px !important;
  position:absolute;
  bottom:-35px;
  left:-50px;
  z-index:6;
  display:none; 
}
.menu-open .menu-eck{
  display:block;
}
.lang-holder{
  width: 100px;
  position:relative; 
  font-size: var(--default);
  top:-15px;
}
.lang-holder .lang-href{
  text-align:center;
}
.lang-holder img{
  width: 40px;
  position: relative;
  top: 15px;
}
.lang-holder ul{
  display:none; 
  list-style:none; 
  margin-left: 35px;
  background-color: var(--grey);
  width: 100px;
  position: absolute;
  z-index:3;
}
.lang-holder ul li{
  margin: 0;
  border-bottom: 1px solid #000000;
  padding: 10px 15px 5px 10px;
}
.lang-holder ul.open{
  display:block;
}

.icon-holder{
  width:200px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: left;
  align-items: flex-start; 
}
.icon-holder div{
  position:relative; 
}
.icon-holder img{
  height:50px;
}
.icon-holder .icon-label{
  width:100%;
  text-align:center;
  display:block;
  position:absolute; 
  top:-5px;
  left:10px;
  font-family: 'geomanistbold';
  font-weight: var(--fontweight);
}
.basket-counter, .list-counter{
  position: absolute !important;
  top: -10px;
  font-weight: bold;
  left: 0px;
  width: 100%;
}
.basket-counter span, .list-counter span{
  display: block;
  margin: 0 auto;
  text-align: center;
  width:30px;
  height:30px;
  border:1px solid var(--green);
  border-radius:50px;
  background-color: #ffffff;
}
.idwk{
  position:relative; 
  top:-20px;
}
/* Suche */
.search-holder{
  width:100%;
  margin-top:0px;
}
.search-wrapper{
  position:relative;
  display: flex; 
  justify-content: flex-end;
}
.search-wrapper form{
  width:300px;	
}
.search-wrapper input{
  border:1px solid var(--black);
  border:1px solid #CAC0C0;
  width:100%;
  padding:10px 15px;
}
.search-wrapper .submit-icon{
  position:absolute;
  top: -7px;
  right: -5px;
  width: 50px;
  border: none;
  background: transparent;
  background-image: url(/image/frontend/Lupe_01_Gruen.svg);
  background-repeat: no-repeat;
  background-size: cover;
}
.search-h{
    padding:15px 0 35px 0 !important; 
  }

.pulse {
  color: red;
  font-size: 50px;
  animation: heart-pulse 3s 2 ease-out;
}

@keyframes heart-pulse {
  0% {
    transform: scale(1); /* scaling to 0 */
  }
  25% {
    transform: scale(1.4); /* increasing the size */
  }
  75% {
    transform: scale(0.6); /* increasing the size */
  }
  100% {
    transform: scale(1); /* decreasing the size */
  }
}


/* Shrinkstuff */
#menushrink.shrink .logo-holder{
  width:150px;
}
#menushrink.shrink .menu-holder img{
  width:50px;
}
#menushrink.shrink .icon-holder img{
  height:30px;
}
#menushrink.shrink .menu-eck{
  display:none; 
}
/* Scroll header effect */
.scroll-down .trigger-menu-wrapper {
  transform: translate3d(0, -100%, 0);
}

.scroll-up .trigger-menu-wrapper {
  transform: none;
}

.scroll-up:not(.menu-open) .trigger-menu-wrapper {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.35);
}


/*
.menu-open {
  overflow: hidden;
}

.menu-open .trigger-menu-wrapper {
  background: transparent;
}

.menu-open .page-header .nav-holder {
  display: block;
}


*/





.nav-holder {
  position: fixed;
  top: 0px;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  text-align: left;
  overflow: auto;
  z-index: 3;
  background: white; 
  padding-top:125px;
}
.menu-open .nav-holder {
  display:block;
}

/***  Navigation Menu Main ***/
.navigation{
  margin: 0 auto; 
  max-width: var(--maxwidth);
  background-color:#ffffff;
}
.navigation-inner{
  padding:50px 15px 100px 15px; 
}
.navigation-item{
 margin-bottom: 25px;
 margin-top: 25px; 
}
.navigation .nav1{
  font-size: var(--f3);
  display:flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: center;
  font-family: 'geomanistbold';
  font-weight: var(--fontweight);
}
.img-holder{
  width:100px;
}
.label-holder{
  width:auto; 
  padding-top:50px;
  max-width:210px;
}
.navigation .nav2{
  font-size: var(--f3);
  color: var(--black);
  font-family: 'geomanistbold';
  font-weight: var(--fontweight);
  padding-bottom:20px;
}
.navigation .nav3{
  font-size: font-size: var(--default);
}
.navigation .nav1.open{
  color: var(--black);
}
.navigation .nav2.open{
  color: var(--black);
}
.navigation .nav3.open{
  font-family: 'geomanistbold';
  font-weight: var(--fontweight);
}
.navigation-sub{
  display:flex;
  flex-wrap: wrap;
  display:none; 
  padding-top:75px;
}
.navigation-sub.open{
  display:flex;
}
.navigation-item img{
  height:120px;
}
.navigation-item a{
}
.sub-item{
  margin-right:50px;
}
.navigation-label{
  position: relative;
  top: -55px;
  left: -30px;
  font-family: 'geomanistbold';
  font-weight: var(--fontweight);
}
.navigation .sub-item ul{
  margin:0;
  list-style:none; 
  padding-bottom:50px;
  padding-top:15px;
}
.navigation .sub-item ul li{
  margin:0;
  border-bottom:1px solid #000000;
  padding:10px 15px 5px 0px;
}

.superflex{
  display:flex;
  flex-wrap:wrap;
  justify-content: space-around;
  align-content: space-around;
  align-items: center;
  align-content: center;
}
.superflex .navigation-item{
  flex-basis:50%;
  text-align:center;
  padding-top:50px;
}
.superflex .navigation-item:nth-child(5) img{
  position:relative;
  left:-15px;
}
.superflex .img-holder{
  width:100%;
}
.superflex .label-holder{
  width:100%;
  max-width:100%;
  text-align:center;
  padding-top:30px;
  padding-bottom:30px;
  padding: 30px 5vw;
  line-height:130%;
}



/*** Slider Swiper***/
.swiper {
  /*width: var(--maxwidth);*/
  width:100%;
}

.swiper-wrapper{
  
}
.swiper-slide{
  cursor:move;
  background-repeat:no-repeat;
  background-position: center;
  background-size: cover;
  /*padding-top:56.25%;*/
  max-height:95vh;
  height:95vh;
  overflow:hidden; 
}
.swiper-overlay{
  position:absolute;
  color:#ffffff;
  top:50%;
  transform: translateY(-45%);
  left:50%;
  margin-left: calc(var(--maxwidth)/2 - var(--maxwidth));
  width:var(--maxwidth);
  /*height:clamp(12.50rem, calc(2.74rem + 48.78vw), 37.50rem); *//* 200 - 600 */
}
.swiper-slide h1{
  font-family: 'geomanistbold';
  font-weight: var(--fontweight);
  font-size: var(--f1);
  line-height:115%;
  margin:0;
  max-width:500px;
  /*text-shadow: 0 1px 6px #000,0 -1px 1px #fff;*/
}
.swiper-slide p{
  font-size: var(--f2);
  margin:0 0px 20px 0;
  line-height:115%;
  max-width:650px;
  /*text-shadow: 0 1px 4px #000,0 -1px 1px #fff;*/
}
.swiper-pagination{
  position:relative;
  bottom:-5px !important;
}
.swiper-pagination-bullet{
  width: 80px;
  height:15px;
  border-radius: 0;	
}
.swiper-pagination-bullet-active{
  background: var(--green);
}


/*** Keyvisual ***/
.keyvisual-h{
  position:relative;
  display:flex;
}
.keyvisual{
  position:relative; 
  width:100%;
  background-repeat:no-repeat;
  background-position: center;
  background-size: cover;
  height:100vh;
  max-height:95vh;
  height:52vh;
  overflow:hidden; 
}
.keyvisual img{
  width:100%;
}
.keyvisual-icon{
  position:absolute;
  left:50%;
  margin-left: calc(var(--maxwidth)/2 - var(--maxwidth));
  width:var(--maxwidth);
  display:flex;
  align-items: center;
  bottom:40px;
}
.keyvisual-icon img{
  width: var(--f1);
  margin-right:25px;
}
.keyvisual-title{
  font-family: 'geomanistbold';
  font-weight: var(--fontweight);
  color: var(--white);
  font-size: var(--f1);
}


/*** Breadcrumb ***/
.breadcrumb-h{
  position:relative;
  max-width:var(--maxwidth);
  margin:0 auto; 
}
.breadcrumb{
  padding:25px 0;
}
.breadcrumb a:last-child{
  color: var(--black);
}

/*** Teaser ***/
.teaser-h{
  position:relative;
  max-width:var(--maxwidth);
  margin:0 auto; 	
}
.teaser{
  padding:0px;
}
.teaser h2{
  font-size: var(--f3);
  margin: 35px 0 5px 0;
}
.teaser p{
  max-width:750px;
  padding: 15px 0 15px;
}
.teaser ul{
  margin-left:25px;
}
.smaller-h{
  max-width:700px;
}
.smaller-h img{
  max-width:700px;
  margin-top:25px;
}

/*** Filter ***/
.filter-h{
  position:relative;
  max-width:var(--maxwidth);
  margin:0 auto; 
}
.filters{
  display: flex;
  align-items: flex-start;
  padding-bottom:50px; /* ToDo */
}
.filter{
  
}
#filter{
  scroll-margin-top: 115px;	
}
.filter h3{
  padding-left:10px;
  margin-right:35px;
  cursor: pointer;
  color: var(--green);
}
.filter h3 img{
  position:relative; 
  width:35px;
  top:10px;
  left:-10px;
}
.filter-list{
  position:absolute; 
  top:-10000px;
  left:-100000px;	
}
.filter-list.show{
  position:relative; 
  top:0;
  left:0;
}
.filter ul{
  list-style: none;
  margin-left: 0px;
  margin-right:25px;
  padding-top:25px;
}
.filter ul li{
  padding:4px 10px 4px 0;
  border-bottom:1px solid var(--black);
}
.filter ul li:first-child{
  border-top:1px solid var(--black);
}
.filter ul li a{
}
.filter ul li a:hover, .filter ul li a:active {
}
.filter ul li.selected a{
  font-family: 'geomanistbold';
  font-weight: var(--fontweight);
}
.filter .delete{
  font-style:italic;
}

/*** Brand and Subbrand ***/
.brand-holder{
  width:100%;
  padding-top:25px;
  padding-bottom:20px;
  margin-bottom:50px;
}
.brand-inner{
  display:flex;
  flex-wrap: wrap;
  align-items: flex-start;
  /*
  padding-bottom: 50px;
  margin-bottom: 25px;
  */
  margin:0 auto;
  max-width: var(--maxwidth);
}
.brand-image{
  width: 20%;
  padding-right:25px;
}
.brand-image img{
  width:100%;
  width: calc(100% - 1vw);
}
.brand-text{
  max-width:700px;
}
.brand-text h2{
  font-family: 'geomanistbold';
  font-weight: var(--fontweight);
  margin-bottom: 15px;
}
.brand-text p{
	
}
.subbrandinfo{
  padding-top:10px;
}

.zeb1 .subbrand, .brand-holder.zeb1{
  background-color: var(--grey);
}
.zeb0 .subbrand, .brand-holder.zeb0{
  background-color: #ffffff;
}
.subbrand{
  margin-top:25px;
  padding:50px 25px;
  display:none; 
}
.subbshow{
  display:block;
  transition-duration: 2s;
  transition-timing-function: linear;
  transition-delay: 1s;
}


/*** Producs ***/
.product-holder{
	/*
  margin:0 auto;
  max-width: var(--maxwidth);
  */
}
.product-group{
  margin-top:-25px;
}
.product-group.zeb1{
  background-color:var(--grey);
}
.product-group.zeb0{
  background-color:#ffffff;
}
.product-inner{
  margin:0 auto;
  max-width: var(--maxwidth);
  display:flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  border-top: 1px solid var(--black);
  /*margin-bottom: 25px;*/
  padding-bottom: 25px;
  padding-top:25px;
}
.product-group:nth-last-child(-n+1) .product-inner{
  margin-bottom: 0px;
}
.product-image, .product-items{
  margin:0 auto;
  max-width: var(--maxwidth);
}
.product-image{
  width:20%;
}
.product-image img{
  width: calc(100% - 1vw);
}
.product-items{
  width:80%;
}
.product-thead, .product{
  display:flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;	
}
.product-thead{
  font-family: geomanistbold;
  font-weight: var(--fontweight);
  padding:0 0px 10px 0;
}
.product{
  border-bottom:1px solid #E0E0E0;
  padding:5px 0;
}
.product.no-border{
  border-bottom:none; 
}
.product:last-of-type{
  border-bottom:none;
}
.product>div{
  padding:0 10px 0 0;
}
.product:last-child{
  /*border:none;*/
}
.product-nr{
  flex: 0 0 10%;
  max-width:110px;
  word-wrap:break-word;
}
.product-title{
  flex: 0 0 20%;
  word-wrap:break-word;
}
.product-packing{
  flex: 0 0 10%;
  word-wrap:break-word;
}
.product-text{
  flex: 0 0 20%;
  word-wrap:break-word;
  max-width: 20%;
}
.product-spannste{
  flex: 0 0 15%;
  word-wrap:break-word;
}
.product-price{
  max-width: 160px;
  min-width: 150px;
  display:flex;
  flex-wrap: no-wrap;
  align-items: center;
  padding:0;
  flex: 0 0 20%;
}
.product-price a img{
  width:45px;
}
.price-label{
  background-color: var(--green);
  color: #ffffff;
  font-weight: var(--fontweight);
  padding:8px;
  min-width: 71px;
  text-align: right;
}
.pla{
  display:none; 
}


/* Content Site */
.content-h .teaser-h{
  background-color: #ffffff;
}
.content-h .navigation{
  background-color: var(--grey);
}






/* Footer Navigation */
footer{
  text-align:center;
  background-color:var(--green);
  color: #ffffff;
  padding-bottom: 50px;
}
.footer-holder{
  max-width: var(--maxwidth); 
  margin:0 auto; 
  display:flex;
  flex-wrap:wrap;
  align-content: center;
  justify-content: center;
  padding-top:50px;
}
.foot-first, .foot-second{
  width:100%;
}
footer a:link, footer a:visited {
    color: #ffffff;
    text-decoration: none;
}
.footer-first{
  width:50%;
}
.footer-second{
  width:50%;
}

/* YouTube */
.video-container {
  position: relative;
  padding-bottom: 56.25%; /*16:9*/
  padding-top: 30px; 
  height: 0; 
  overflow: hidden;
  margin-top:10px;
  margin-left: 60px;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

 
/* Shop */
.space-top{
  margin-top:150px;
}
.shop-h{
}
.shop-inner{
  margin:0 auto;
  max-width: var(--maxwidth);
  margin-bottom: 25px;
  padding-bottom: 25px;
  padding-top:25px;	
}
.shop-h h1{
  margin-bottom:50px;
}
.link-primary{
  font-family: geomanistbold;
}

.shop-h fieldset{
  border:none;
}
.shop-h form{
  margin-top:25px;
}
#address-plush h2{
  margin-bottom:25px;
}
.shop-h .row{
  clear:both;
  padding-bottom:10px;
}
.shop-h .left, .shop-h .right, .col-md-2, .col-md-9 {
  float:left;
  width:50%;
  margin:0; padding:0;
  box-sizing: border-box;	
}
.shop-h .left, .col-md-2{
  max-width:150px;
  text-align:right;
  padding-right:25px;
}
.shop-h .right, .col-md-9 {
  padding-bottom:8px;
  max-width:300px;
}
.shop-h .right input, .shop-h .right textarea, .col-md-9 input {
  width:100%;
  font-size: var(--default);
  padding: 6px 3px;
}
.shop-h .right input[type='checkbox']{
  width:10px;
}
.shop-h .right input.plz{
  max-width:60px;
}
.shop-h input[type='submit'], .shop-h .btn-primary{
  margin-top: 20px;
  color: var(--green);
  width: 200px;
  height:25px;
  padding:12px 5px 35px 5px;
  font-family: geomanistbold;
}
.offset-md-2{
  padding-left:150px;
}
.shop-h .hrefback{
  display:block;
  margin-top:27px;
}
.shop-h a:link, .shop-h a:visited{
  
}
.shop-h a:hover, .shop-a a:active{
  
}

.shop-border{
  color:#DCDAD5;
  margin: 55px 0px;
}

.is-invalid{
  border:1px solid red;
  height:30px;
}
form.is-invalid{
  border:none; 
  height:auto; 
}
.product-table{
  margin-top:15px;
  width:100%;
  border-collapse:collapse;
}
.product-table th {
  text-align:left;
  border-bottom:1px solid #000000;
  padding:10px;
}
.product-table .quant{
  width:50px;
  padding: 8px 3px;
}
.product-table img{
  height:60px;
  padding-top:5px;
}
.product-table img.redeye{
	height:40px;
	position:relative; 
	top:13px;
}
.product-table tr:nth-child(even) {
  background-color: #f2f2f2;
}
.product-table td:nth-child(4){
  text-align:center;
}
.product-table th:nth-child(2) {
  
}
.product-table th:nth-child(4), .product-table td:nth-child(5) {
  text-align:right;
}
.product-table .img {
  background-color:#ffffff;
  padding:3px 0; 
  padding-right:5px;
}
.product-table td:nth-child(5) {
	font-weight:bold;
}
.product-table td:nth-child(6) {
  text-align:center;
}
.info{
  opacity: 0.65;
  padding: 15px 0;
}
.chf{
	
}
.chf-strike{
  text-decoration: line-through;
  padding-right:10px;
}
.portocost td, .totalcost td{
  font-weight:bold;
  text-align:right;
}
.notbold td{
  font-weight:normal !important;
}
.portocost td{
  font-weight:normal;
}
.portocost td, .totalcost td{
  margin-top:15px;
  padding-top: 10px; 
  padding-bottom: 10px; 
  border-top:1px solid #000000;
}
.alert{
  border: 1px solid #000000;
  max-width: 500px;
  padding: 25px;
  margin: 0 0 15px 0;
  background-color: #F1171B;
}
.alert button{
  display:none; 
}
.confirm-h h2{
  margin-top:45px;
  margin-bottom:10px;
}
.confirm-h .right{
  max-width:500px;
}
.confirm-h textarea{
  height:100px;
  padding:10px;
  margin-bottom:10px;
}

.address-h .left{
  max-width:250px;	
}
.address-h .right{
  max-width:400px;	
}
.change-link{
  padding:25px 0; 
}
.line{
  border-bottom: 1px solid var(--black); 
}
#address-plush{
  display:none; 
}
.relup{
  position:relative; 
  top: -20px;
}
.icon-trash{
  width:25px;
  height:auto !important;
}

/* Neu 2025 */
.navigation-inner .usricon{
 flex-basis: 100%;
 text-align: left;
 margin: 0;
 padding: 0;	
 display: none; 
}
.navigation-inner .usricon img{
  height: 50px;
  left: 0 !important; 
}
.navigation-inner .usricon .label-holder{
  display: inline;
  text-align: left;
  padding: 0;
  position: relative;
  top: -13px;	
}


/* Responsive */
@media only screen and (max-width: 1500px) {
  :root {
    --maxwidth: calc(100% - 25px);
  }
  body::before,
  body::after {
    content: '';
    position: fixed;
    top: 0;
    right: 0;
    border-color: transparent;
    border-style: solid;
    z-index:345678;
  }
  body::before {
    border-width: 1.5em;
  }
  body::after {
    border-radius: 0.4em;
    border-width: 1.35em;
    border-right-color: black;
    border-top-color: black;
  }
  .relup{
    display:none;
  }
  .swiper-overlay{
    padding-left: 1em;
  }
}

/* RED */
@media only screen and (max-width: 1050px) {
  body::after {
    border-right-color: red;
    border-top-color: red;
  }
  :root {
    --maxwidth: calc(100% - 25px);
  }
  .product-nr{
    flex: 0 0 20%;
    order: 1;
  }
  .product-title{
    flex: 0 0 52%;
    order: 2;
  }
  .product-packing{
    flex: 0 0 20%;
    order:4;
  }
  .product-text{
    flex: 0 0 52%;
    order:5;
  }
  .product-spannste{
    flex: 0 0 28%;
    order: 3;
  }
  .product-price{
    flex: 0 0 28%;
    order:6;
  }
  .product-thead{
    display:none; 
  }
  .menu-holder, .icon-holder{
    width: auto;
  }
  .swiper-overlay{
    padding-left: 0.3em;
  }
}
 
@media only screen and (max-width: 923px) {
   body::after {
    border-right-color: green;
    border-top-color: green;
  }
  .menu-inner{
    flex-wrap:wrap;
  }
  .header-left{
    width:100%;
  }
  .search-holder{
    width:100%;
  }
  .search-wrapper{
    justify-content:center;
  }
  .search-wrapper form{
    position:relative;
    width:100%;
    padding-bottom:25px;
    max-width:500px;
  }
  .icon-holder img {
    height: 35px;
  }
  .logo-holder{
    padding-right:10px;
  }
  .menu-open .menu-eck {
    display: none;
  }
  .nav-holder {
    padding-top:175px;
  }
  
} 

@media only screen and (max-width: 800px) {
   body::after {
    border-right-color: yellow;
    border-top-color: yellow;
  }
}
@media only screen and (max-width: 720px) {
   body::after {
    border-right-color: blue;
    border-top-color: blue;
  }
  .product-image{
    flex: 0 0 50%;
    text-align:center;
  }
  .product-image img {
    width:225px;
  }
  .product-items {
    flex: 1 1 50%;
  }
  .product-nr{
    flex: 0 0 100%;
  }
  .product-title{
    flex: 0 0 100%;
  }
  .product-packing{
    flex: 0 0 100%;
  }
  .product-text{
    flex: 0 0 100%;
    max-width: 100%;
  }
  .product-spannste{
    flex: 0 0 100%;
  }
  .product-price{
    flex: 0 0 100%;
  }
  .product-thead{
    display:none; 
  }
  .pla{
    display:inline; 
  }
}
@media only screen and (max-width: 550px) {
  body::after {
    border-right-color: pink;
    border-top-color: pink;
  }
  .product-image{
    flex: 0 0 100%;
    text-align:center;
  }
  .product-items {
    flex: 0 0 100%;
  }
  
}
@media only screen and (max-width: 440px) {
   body::after {
    border-right-color: silver;
    border-top-color: silver;
  }
  .menu-holder img{
    width:45px;
  }
  .lang-holder{
    /*display:none;*/ 
  }
  .icon-holder{
    display: none; 
  }
  .navigation-inner .usricon{
    display: flex; 
  }
  .swiper-slide h1{
    max-width:75%;
  }
  .superflex .navigation-item{
    flex-basis:100%;
  }
  .foot-first, .foot-second{
    width:100%;
    text-align:center;
  }
  .brand-image {
    width: 80%;
    padding-right: 0px;
    margin: 0 auto; 
  }
  .product-image img {
    width: 100%;
  }
}
@media only screen and (max-width: 350px) {
	body::after {
     border-right-color: brown;
     border-top-color: brown;
    }
}