.BackgroundColor1_Productlist,.BackgroundColor2_Productlist {
  width: 25%;
  display: inline-block;
  vertical-align: top;
  background-color: #fff;
  padding: 0 !important;
}
.BackgroundColor1_Productlist .image > a,.BackgroundColor2_Productlist .image > a {
  padding-bottom: 100%;
}
.BackgroundColor1_Productlist .product .image,.BackgroundColor2_Productlist .product .image {
  height:inherit;
}
.BackgroundColor1_Productlist .image > a > img,.BackgroundColor2_Productlist .image > a > img {
    position: absolute;
    top: 50%;
    color: transparent;
    transform: translateY(-50%);
}

.webshop-productlist .ProductList_Custom_UL li form .product .image.ExtraImg a img{
  opacity: 1;
}

.webshop-productlist .ProductList_Custom_UL li form .product .image.ExtraImg a img.ExtraImg{
  opacity: 0;
}

.webshop-productlist .ProductList_Custom_UL li form .product:hover .image.ExtraImg a img.ExtraImg{
  opacity: 1;
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-out;
	animation-duration: 0.2s;
}

.webshop-productlist .ProductList_Custom_UL li form .product:hover .image.ExtraImg a img:not(.ExtraImg){
  opacity: 0;
	animation-name: fadeOutOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-out;
	animation-duration: 0.2s;
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes fadeOutOpacity {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}


.BackgroundColor1_Productlist, .BackgroundColor2_Productlist {
  padding:0px;
}

.BackgroundColor1_Productlist form,.BackgroundColor2_Productlist form {
  height: 100%;
  width:100%;
}

span.ShowAllCats{
  padding: 15px;
  border: 1px solid #ddd;
  display: block;
  width: fit-content;
  margin-bottom: 50px;
  font-weight: bold;
  cursor: pointer;
}

span.ShowAllCats:hover{
  background-color: #f1f1f1;
}

body{
  -webkit-overflow-scrolling: touch;
  overflow-y: scroll;
  webkit-overflow-scrolling: auto;
}

.CategoryContainer{
  width: 100%;
  /*! margin-top: 35px; */
}

.CategoryContainer:empty{
  display:none;
}

.webshop-productlist .ProductGroup{
  margin: 0px 0px 20px;
}

.webshop-productlist .SubCats_Categories_UL{
  display: flex;
  flex-direction: row;
  padding: 0;
  list-style-type: none;
  flex-wrap: wrap;
  gap: 2%;
  margin:0px;
}

.SubCats_Categories_Container h2{
  margin: 20px 0px 10px 0px;
}

.ProductGroup{
  display: block;
  width: 100%;
  position: relative;
}

body.webshop-productlist .ProductGroup .SubCats_Categories_UL > li {
  margin: 0 1% 10px;
  float: none !important;
  border:none;
  margin: 0px;
  width:calc(12.75% - 2%) !important;
  flex-shrink: 0;
}

body.webshop-productlist .ProductGroup.Border .SubCats_Categories_UL > li {
  margin-bottom:10px;
}

body.webshop-productlist .ProductGroup.Border .SubCats_Categories_UL > li .productgroup{
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
}

body.webshop-productlist .ProductGroup.Border .SubCats_Categories_UL > li .image{
  padding:5px;
  border:solid 1px rgba(229, 229, 229, 1);
  border-radius: 5px;
}

body.webshop-productlist .ProductGroup.Border .SubCats_Categories_UL > li .image img{
  background:none;
}

.ProductGroupBrandsContainer{
  padding: 0;
  margin: 30px -1% 20px;
  list-style-type: none;
}

.ProductGroupBrandsContainer .SubCats_Categories_UL{
  gap: 1% !important;
  display: flex;
}

.ProductGroupBrandsContainer .SubCats_Categories_UL > li{
  flex: 0 0 13.83% !important;
  float: none !important;
  margin: 0 1% 2% !important;
  display: flex !important;
  vertical-align: top !important;
  align-items: center !important;
  justify-content: center !important;
}

.ProductGroupBrandsContainer .SubCats_Categories_UL > li .image{
  width:100%;
  display: block;
  height:auto;
}

.ProductGroupBrandsContainer .SubCats_Categories_UL li .image img{
  border-radius: 0;
  width:100%;
}

.productgroup_partner_brands{
  padding: 20px;
  display: flex;
  margin: 0;
  width:100%;
}

@media (max-width: 880px){
  .ProductGroupBrandsContainer .SubCats_Categories_UL > li{
      flex: 0 0 22.2% !important;
  }
}

@media (max-width: 600px){
  .ProductGroupBrandsContainer .SubCats_Categories_UL > li{
      flex: 0 0 30.66% !important;
  }
}

@media (max-width: 400px){
  .ProductGroupBrandsContainer .SubCats_Categories_UL > li{
      flex: 0 0 47.5% !important;
  }
}

body.webshop-productlist .filterpanel .Brands{
  display: flex;
  margin: 0px 1% 0% 0px;
  border: 1px solid #ddd;
  border-radius: 5px;
  max-height: 45px;
}
@media (pointer: fine){
  body.webshop-productlist .filterpanel .Brands:hover{
    background-color: #f5f5fa;
  }
}

body.webshop-productlist .filterpanel .Brands.Active{
  background-color: #f5f5fa;
  border: 2px solid #00c700;
}

body.webshop-productlist .filterpanel .Brands a{
    display: flex;
}

body.webshop-productlist .filterpanel .Brands a.AllBrands{
  border: 1px solid #ddd;
  padding: 12px;
  cursor: pointer;
  border-radius: 5px;
  -ms-user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  margin: 0px 1% 2% 0px;
  display: block;
  width: fit-content;
  text-decoration: none;
}

body.webshop-productlist .filterpanel .Brands a.AllBrands p{
  margin:0px;
  font-weight: bold;
}

body.webshop-productlist .filterpanel .Brands a img{
  display: block;
  width: 100%;
  height: 45px;
}

body.webshop-productlist .ProductGroup .SubCats_Categories_UL.ShowAll{
  flex-wrap: wrap;
  margin: 0px 0px 40px;
}

body.webshop-productlist .ProductGroup .SubCats_Categories_UL:not(.OldDesign) > li:nth-of-type(n+9) {
  display: none;
}

body.webshop-productlist .ProductGroup .SubCats_Categories_UL.ShowAll > li:nth-of-type(1n+9){
  display: inline-block;
}

body.webshop-productlist .ProductGroup .SubCats_Categories_UL > li:empty{
  display:none !important;
}

.SubCats_Categories_UL li .image{
  min-height: unset;
}
@media (pointer: fine){
  .SubCats_Categories_UL li .productgroup:hover img{
    background-color: #004f6d;
  }

  .SubCats_Categories_UL li .productgroup:hover .name{
    text-decoration: underline;
  }
}

.SubCats_Categories_UL li .image img{
  background-color: #b7d6e1;
  border-radius: 5px;
  margin-bottom: 5px;
}

.SubCats_Categories_UL li .name{
  position:unset;
}

.SubCats_Categories_UL li .name a{
  color: #2e2e2e;
  background-color: unset;
  font-weight: normal;
}

@media (pointer: fine){
  .SubCats_Categories_UL > li:hover .name a {
    background-color: unset;
  }
}

.ShowMoreCategories{
  font-weight: bold;
  margin: 10px 0px 25px;
  display: block;
}
@media (pointer: fine){
  .ShowMoreCategories:hover{
    text-decoration: underline;
    cursor: pointer;
  }
}

.cat-description .img > img {
    width: 100%;
}
.product_frame{
    border: 10px solid #000;
}
.variantSelectorColor .circle {
    border: 1px solid #ddd;
    border-radius: 50%;
    padding: 5px;
    line-height: 25px;
    align-self: center;
}
.bar{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 8px 0;
    background-color: #000;
    color: white;
    font-size: 14px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.bar_content{
    display: block; /* Important to give the content a width */
    width: 100%;
    transform: translateX(100%); /* Animation start out of the screen */

/* Add the animation */
    animation: move 8s linear infinite /* infinite make reapeat the animation indefinitely */;
}

/* Create the animation */
@keyframes move {
    to { transform: translateX(-100%); }
}
.special_campaign{
    width: 100%;
    height: auto;
    min-height: 50px;
    color: white;
    font-size: 18px;
    font-weight: 600;
    line-height: 16px;
    padding: 16px;
    background-color: #d99b59;
    text-transform: uppercase;
    margin-bottom: 20px;
    letter-spacing: 0.5px;
}
@media (max-width: 1439px) and (min-width: 600px) {
    .special_campaign{
        font-size: 15px;
        line-height: 15px;
        padding: 14px;
}
}
@media (max-width: 599px){
    .special_campaign{
        font-size: 15px;
        line-height: 22px;
        padding: 10px;
        text-align: center;
}
}
.campaignBanner {
    /*background: rgb(252, 241, 138);
    background: -moz-linear-gradient( top, rgba(252, 241, 138, 1) 0%, rgba(241, 218, 54, 1) 100% );
    background: -webkit-linear-gradient( top, rgba(252, 241, 138, 1) 0%, rgba(241, 218, 54, 1) 100% );
    background: linear-gradient( to bottom, rgba(252, 241, 138, 1) 0%, rgba(241, 218, 54, 1) 100% );
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#fcf18a", endColorstr="#f1da36", GradientType=0 );
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.2);*/
}
.campaignBanner .expire {
    -webkit-border-radius: 0;
    border-radius: 0;
    background-color: #000;
    color: rgba(255, 255, 255, 1);
   -webkit-animation: flickerAnimation 2s infinite;
   -moz-animation: flickerAnimation 2s infinite;
   -o-animation: flickerAnimation 2s infinite;
    animation: flickerAnimation 2s infinite;
    display: inline-block !important;
}
.colorImgContainer img {
    max-height: 650px;
}
.product_jw_bad .ribbon,#n-left .ribbon,.productFlexContainer .ribbon,.productcard .ribbon, #productcard-left .ribbon  {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    /* overflow: hidden; */
    width: 80px;
    height: 80px;
    text-align: right;
}
.product_jw_bad .ribbon span,#n-left .ribbon span,.productFlexContainer .ribbon span,.productcard .ribbon span, #productcard-left .ribbon span {
    font-size: 14px;
    font-weight: bold;
    color: #000;
    text-decoration: none;
    text-align: center;
    width: 110px;
    line-height: 35px;
    height: 35px;
    display: block;
    background: #79a70a;
    background: linear-gradient(#fcf18a 0%, #f1da36 100%);
    box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    position: absolute;
    top: 5px;
    left: 5px;
    border-radius: 5%;
}
@media (max-width: 600px){
    .product_jw_bad .ribbon span,#n-left .ribbon span,.productFlexContainer .ribbon span,.productcard .ribbon span, #productcard-left .ribbon span {
    font-size: 14px;
    width: 110px;
    line-height: 30px;
    height: 30px;
}
}

@media only screen and (hover: hover) {
  .SubCats_Categories_UL {
    scrollbar-color: #999 transparent;
  }
}

@media (max-width: 1440px){

  .webshop-productlist .SubCats_Categories_UL{
    overflow-x: auto;
    flex-wrap: nowrap;
  }

  body.webshop-productlist .ProductGroup .SubCats_Categories_UL > li{
    width: 18.4% !important;
    display: inline-block !important;
  }
}

@media (max-width: 1024px) {

  body.webshop-productlist .ProductGroup .SubCats_Categories_UL > li{
    width: 18.4% !important;
  }
}

@media (max-width: 880px) {

  body.webshop-productlist .filterpanel .Brands{
    margin: 10px 0px;
  }

  h1, .Heading_Productmenu, .Heading_Terms, .Heading_Profile, .Heading_AdvancedSearchPage, .Heading_ShowBasket_Master, #checkout-container h1.checkout-headline, aside .header, .Heading_B2Blogin, .SubCatsProcuctsHeading, .Heading_Customer, .Heading_ProductList, .Heading_Favorites, .Heading_OrderStep4{
    font-size: 1.6rem;
  }

  .SubCats_Categories_UL{
    margin: 15px 0% 0px;
  }

  body.webshop-productlist .ProductGroup .SubCats_Categories_UL > li{
    width: 32% !important;
    margin-bottom:10px;
  }
}

@media (max-width: 600px) {
    .SubCats_Categories_UL{
      margin: 0px;
    }

    body.webshop-productlist .ProductGroup .SubCats_Categories_UL > li{
      width: 46% !important;
    }
}