@charset "UTF-8";
/*
	***NOTICE**********************************
	the main.scss only gets compiled to main.css if you have a watcher.
	see etc/bash.bashrc for its function: "sasswatch".
	You can call it easily via console.
	
	The bootstrap files are not being watched permanently as they take too long to compile.
	If you make changes on the _variables.scss you need to call the compiler manually via:
	"sasswatch_bootstrap" in your console.
	
	Please do not change any other scss from bootstrap except _variables.scss
	***NOTICE**********************************
*/
/* lato-300 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  /* all eot files are damaged. the online font converter caused this. the eot files are not needed.  */
  src: url("fonts/Lato/lato-v17-latin-300.woff2") format("woff2"), url("fonts/Lato/lato-v17-latin-300.woff") format("woff"), url("fonts/Lato/lato-v17-latin-300.ttf") format("truetype"), url("fonts/Lato/lato-v17-latin-300.svg#Lato") format("svg");
  /* Legacy iOS */
}

/* lato-regular 400 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  /* all eot files are damaged. the online font converter caused this. the eot files are not needed.  */
  src: url("fonts/Lato/lato-v17-latin-regular.woff2") format("woff2"), url("fonts/Lato/lato-v17-latin-regular.woff") format("woff"), url("fonts/Lato/lato-v17-latin-regular.ttf") format("truetype"), url("fonts/Lato/lato-v17-latin-regular.svg#Lato") format("svg");
  /* Legacy iOS */
}

/* lato-700 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  /* all eot files are damaged. the online font converter caused this. the eot files are not needed.  */
  src: url("fonts/Lato/lato-v17-latin-700.woff2") format("woff2"), url("fonts/Lato/lato-v17-latin-700.woff") format("woff"), url("fonts/Lato/lato-v17-latin-700.ttf") format("truetype"), url("fonts/Lato/lato-v17-latin-700.svg#Lato") format("svg");
  /* Legacy iOS */
}

/* Catamaran 700 */
@font-face {
  font-family: 'Catamaran';
  /* all eot files are damaged. the online font converter caused this. the eot files are not needed.  */
  src: url("fonts/Catamaran/Catamaran-Bold.woff2") format("woff2"), url("fonts/Catamaran/Catamaran-Bold.woff") format("woff"), url("fonts/Catamaran/Catamaran-Bold.ttf") format("truetype"), url("fonts/Catamaran/Catamaran-Bold.svg#Catamaran-Bold") format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

/* hagebau-helles-rot */
/* Fix Bootstrap .modal compatibility with jQuery UI Autocomplete, see http://stackoverflow.com/questions/10957781/google-maps-autocomplete-result-in-bootstrap-modal-dialog */
/* top scroller button */
/*zoom overlay on pds*/
/* Störer */
/* facet refinement slider */
/* feedback colors */
/* specific color variables */
/*
 * Allocation of color and typography variables to the page elements
 */
/*
 * BEGIN: html, body, whole page
 */
/*
 * END: html, body, whole page
 */
/*
 * BEGIN: Header
 */
/* Viewport: XS */
/* Viewport: SM */
/*
 * END: Header
 */
/*
 * BEGIN: navigation
 */
/*
 * END: navigation
 */
/*
 * BEGIN: categoryListPage
 */
/*
 * END: categoryListPage
 */
/*
 * BEGIN: searchResultListPage
 */
/*
 * END: searchResultListPage
 */
/*
 * BEGIN: productListPage
 */
/*
 * END: productListPage
 */
/* page elements */
/*
 * BEGIN: PDS
 */
/*
 * END: PDS
 */
/*
 * BEGIN: WISHLIST
 */
/*
 * END: WISHLIST
 */
/*
 * BEGIN: myAccount
 */
/* Viewport: XS */
/*
 * END: myAccount
 */
/*
 * BEGIN: Checkout
 */
/*
 * END: Checkout
 */
/*
 * BEGIN: breadcrumb
 */
/*
 * END: breadcrumb
 */
/*
 * BEGIN: icons and buttons and form elements
 */
/*
 * END: icons and buttons and form elements
 */
/*
 * BEGIN: footer
 */
/* Viewport: XS */
/*
 * END: footer
 */
/*
 * BEGIN: styles of components
 */
/*
 * END: styles of components
 */
/*
* BEGIN: Slider
 */
/*
* END Slider
 */
/*
 * BEGIN: styles navigation
 */
/* Viewport: XS */
/*
 * END: styles navigation
 */
/*  specific XS colors */
/* datepicker */
/*direct order*/
.text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: inherit;
  font-weight: 400;
  line-height: 1.1;
  color: inherit;
}

h1 small,
h1 .small, h2 small,
h2 .small, h3 small,
h3 .small, h4 small,
h4 .small, h5 small,
h5 .small, h6 small,
h6 .small,
.h1 small,
.h1 .small, .h2 small,
.h2 .small, .h3 small,
.h3 .small, .h4 small,
.h4 .small, .h5 small,
.h5 .small, .h6 small,
.h6 .small {
  font-weight: normal;
  line-height: 1;
  color: #777777;
}

h1 small,
h1 .small, .h1 small,
.h1 .small,
h2 small,
h2 .small, .h2 small,
.h2 .small,
h3 small,
h3 .small, .h3 small,
.h3 .small {
  font-size: 65%;
}

h4, .h4,
h5, .h5,
h6, .h6 {
  margin-top: 10.5px;
  margin-bottom: 10.5px;
}

h4 small,
h4 .small, .h4 small,
.h4 .small,
h5 small,
h5 .small, .h5 small,
.h5 .small,
h6 small,
h6 .small, .h6 small,
.h6 .small {
  font-size: 75%;
}

h1, .h1 {
  font-size: 24px;
}

h2, .h2 {
  font-size: 18px;
}

h3, .h3 {
  font-size: 16px;
}

h4, .h4 {
  font-size: 16px;
}

h5, .h5 {
  font-size: 14px;
}

h6, .h6 {
  font-size: 14px;
}

p {
  margin: 0 0 10.5px;
}

.lead {
  margin-bottom: 21px;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.4;
}

@media (min-width: 768px) {
  .lead {
    font-size: 21px;
  }
}

small,
.small {
  font-size: 85%;
}

mark,
.mark {
  background-color: #fcf8e3;
  padding: .2em;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.text-center {
  text-align: center;
}

.text-justify {
  text-align: justify;
}

.text-nowrap {
  white-space: nowrap;
}

.text-lowercase {
  text-transform: lowercase;
}

.text-uppercase {
  text-transform: uppercase;
}

.text-capitalize {
  text-transform: capitalize;
}

.font-normal {
  font-weight: 400;
}

.font-bold {
  font-weight: bold;
}

.font-bolder {
  font-weight: bolder;
}

.font-light {
  font-weight: 300;
}

.font-lighter {
  font-weight: 200;
}

.text-muted {
  color: #777777;
}

.text-primary {
  color: #428bca;
}

a.text-primary:hover {
  color: #3071a9;
}

.text-success {
  color: #3c763d;
}

a.text-success:hover {
  color: #2b542c;
}

.text-info {
  color: #31708f;
}

a.text-info:hover {
  color: #245269;
}

.text-warning {
  color: #8a6d3b;
}

a.text-warning:hover {
  color: #66512c;
}

.text-danger {
  color: #a94442;
}

a.text-danger:hover {
  color: #843534;
}

.bg-primary {
  color: #fff;
}

.bg-primary {
  background-color: #428bca;
}

a.bg-primary:hover {
  background-color: #3071a9;
}

.bg-success {
  background-color: #dff0d8;
}

a.bg-success:hover {
  background-color: #c1e2b3;
}

.bg-info {
  background-color: #d9edf7;
}

a.bg-info:hover {
  background-color: #afd9ee;
}

.bg-warning {
  background-color: #fcf8e3;
}

a.bg-warning:hover {
  background-color: #f7ecb5;
}

.bg-danger {
  background-color: #f2dede;
}

a.bg-danger:hover {
  background-color: #e4b9b9;
}

.page-header {
  padding-bottom: 9.5px;
  margin: 42px 0 21px;
  border-bottom: 1px solid #eeeeee;
}

ul,
ol {
  margin-top: 0;
  margin-bottom: 10.5px;
}

ul ul,
ul ol,
ol ul,
ol ol {
  margin-bottom: 0;
}

.list-unstyled, .facet_block {
  padding-left: 0;
  list-style: none;
}

.list-inline {
  padding-left: 0;
  list-style: none;
  margin-left: -5px;
}

.list-inline > li {
  display: inline-block;
  padding-left: 5px;
  padding-right: 5px;
}

dl {
  margin-top: 0;
  margin-bottom: 21px;
}

dt,
dd {
  line-height: 1.5;
}

dt {
  font-weight: 600;
}

dd {
  margin-left: 0;
}

.dl-horizontal dd:before, .dl-horizontal dd:after {
  content: " ";
  display: table;
}

.dl-horizontal dd:after {
  clear: both;
}

@media (min-width: 768px) {
  .dl-horizontal dt {
    float: left;
    width: 160px;
    clear: left;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dl-horizontal dd {
    margin-left: 180px;
  }
}

abbr[title],
abbr[data-original-title] {
  cursor: help;
  border-bottom: 1px dotted #777777;
}

.initialism {
  font-size: 90%;
  text-transform: uppercase;
}

blockquote {
  padding: 10.5px 21px;
  margin: 0 0 21px;
  font-size: 17.5px;
  border-left: 5px solid #eeeeee;
}

blockquote p:last-child,
blockquote ul:last-child,
blockquote ol:last-child {
  margin-bottom: 0;
}

blockquote footer,
blockquote small,
blockquote .small {
  display: block;
  font-size: 80%;
  line-height: 1.5;
  color: #777777;
}

blockquote footer:before,
blockquote small:before,
blockquote .small:before {
  content: '\2014 \00A0';
}

.blockquote-reverse,
blockquote.pull-right {
  padding-right: 15px;
  padding-left: 0;
  border-right: 5px solid #eeeeee;
  border-left: 0;
  text-align: right;
}

.blockquote-reverse footer:before,
.blockquote-reverse small:before,
.blockquote-reverse .small:before,
blockquote.pull-right footer:before,
blockquote.pull-right small:before,
blockquote.pull-right .small:before {
  content: '';
}

.blockquote-reverse footer:after,
.blockquote-reverse small:after,
.blockquote-reverse .small:after,
blockquote.pull-right footer:after,
blockquote.pull-right small:after,
blockquote.pull-right .small:after {
  content: '\00A0 \2014';
}

address {
  margin-bottom: 21px;
  font-style: normal;
  line-height: 1.5;
}

.clearfix:before, header .main-logo:before, .clearfix:after, header .main-logo:after {
  content: " ";
  display: table;
}

.clearfix:after, header .main-logo:after {
  clear: both;
}

.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.pull-right {
  float: right !important;
}

.pull-left {
  float: left !important;
}

.hide {
  display: none !important;
}

.show {
  display: block !important;
}

.invisible {
  visibility: hidden;
}

.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.hidden {
  display: none !important;
  visibility: hidden !important;
}

.affix {
  position: fixed;
}

/** Flexbox mixins - Start **/
/** Flexbox mixins - End **/
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: 'Catamaran', sans-serif;
  margin: 0 0 10px;
  padding: 0;
  font-weight: bold;
}

h1.center, h2.center, h3.center, h4.center, h5.center, h6.center,
.h1.center, .h2.center, .h3.center, .h4.center, .h5.center, .h6.center {
  text-align: center;
}

h1, .h1 {
  font-size: 28px;
  line-height: 32px;
}

h2, .h2 {
  font-size: 22px;
  line-height: 26px;
}

h3, .h3 {
  font-size: 18px;
  line-height: 22px;
}

h4, .h4 {
  font-size: 16px;
  line-height: 20px;
}

h5, .h5 {
  font-size: 14px;
  line-height: 20px;
}

h6, .h6 {
  font-size: 12px;
  line-height: 16px;
}

html,
body,
p {
  font-size: 12px;
  line-height: 16px;
}

.infotext {
  font-size: 12px;
  line-height: 16px;
  color: #595858;
}

@media (min-width: 320px) {
  h1, .h1 {
    font-size: calc(28px + 4 *  ((100vw - 320px) / 880));
    line-height: 32px;
  }
  h2, .h2 {
    font-size: calc(22px + 2 * ((100vw - 320px) / 880));
    line-height: 26px;
  }
  h3, .h3 {
    font-size: calc(18px + 2 *  ((100vw - 320px) / 880));
    line-height: 22px;
  }
  h4, .h4 {
    font-size: calc(16px + 2 *  ((100vw - 320px) / 880));
    line-height: 20px;
  }
  h5, .h5 {
    font-size: calc(14px + 2 *  ((100vw - 320px) / 880));
    line-height: 20px;
  }
  h6, .h6 {
    font-size: calc(12px + 2 *  ((100vw - 320px) / 880));
    line-height: 16px;
  }
  html,
  body,
  p {
    font-size: calc(12px + 2 *  ((100vw - 320px) / 880));
    line-height: 24px;
  }
}

@media (min-width: 1200px) {
  h1, h2, h3, h4, h5, h6,
  .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Catamaran', sans-serif;
    font-weight: 700;
  }
  h1, .h1 {
    font-size: 32px;
    line-height: 36px;
  }
  h2, .h2 {
    font-size: 24px;
    line-height: 32px;
  }
  h3, .h3 {
    font-size: 20px;
    line-height: 28px;
  }
  h4, .h4 {
    font-size: 18px;
    line-height: 24px;
  }
  h5, .h5 {
    font-size: 14px;
    line-height: 20px;
  }
  h6, .h6 {
    font-size: 14px;
    line-height: 22px;
  }
  html,
  body,
  p {
    font-size: 14px;
    line-height: 24px;
  }
}

a {
  color: #3e4954;
  text-decoration: none;
}

@media (hover: hover) {
  a:hover {
    color: #127f3e;
  }
}

.template-pages-product-hagebauProductLayoutPage h2.h1 {
  margin-top: 20px;
  margin-bottom: 40px;
  padding-top: 30px;
  text-align: center;
}

.productDetail {
  background-color: white;
}

@media (min-width: 768px) {
  .productDetail {
    /* fix missing 1px on right side */
  }
  .productDetail > .col-sm-4 {
    width: 33.33334%;
  }
}

.productDetail label {
  line-height: normal;
  font-size: 14px;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 0;
}

.productDetail h1.product-name, .productDetail .h1.product-name {
  max-height: 4.5em;
  overflow: hidden;
  word-break: break-word;
  hyphens: auto;
}

.productDetail .no-image-image {
  border: 2px solid #e2E3E4;
  width: 100%;
}

.productDetail .light-text a {
  color: #595858;
}

.productDetail .light-text a:hover {
  color: #127f3e;
}

.productDetail .icon-arrow-right {
  color: inherit;
  font-weight: bold;
  font-size: 10px;
  padding-left: 5px;
}

.productDetail .select-wrapper select {
  font-size: 12px;
}

.productDetail .product-producer-image img {
  max-height: 30px;
}

.productDetail .product-image-wrapper {
  padding: 0 40px 0 5px;
}

.productDetail .product-image-wrapper .zoomContainer {
  z-index: 997;
}

.productDetail .product-image-wrapper .product-producer-image {
  margin-bottom: 10px;
}

.productDetail .product-image-wrapper .productImage {
  position: relative;
  width: 100%;
}

.productDetail .product-image-wrapper .hooks {
  right: -4px;
}

.productDetail .product-image-wrapper .hazardous-material-overlay {
  position: relative;
  margin-bottom: 5px;
  z-index: 2;
  width: 100%;
}

.productDetail .product-image-wrapper .hazardous-material-overlay .hazard-overlay-small {
  display: inline-block;
  width: 48px;
  height: 48px;
  position: relative;
  overflow: hidden;
  margin-left: 5px;
}

.productDetail .product-image-wrapper .hazardous-material-overlay .hazard-overlay-small .hazard-image {
  height: 48px;
  width: 64px;
  position: absolute;
  left: -8px;
}

@media (max-width: 768px) {
  .productDetail .product-image-wrapper .hazardous-material-overlay {
    text-align: center;
  }
}

.productDetail .product-image-wrapper .certificates {
  left: -4px;
  position: absolute;
  padding: 0;
  z-index: 2;
  font-size: 14px;
}

.productDetail .product-image-wrapper .certificates li {
  color: white;
  list-style: none;
  margin-top: 8px;
  overflow: hidden;
  line-height: 20px;
  overflow: hidden;
  padding: 5px 10px;
  text-align: center;
}

.productDetail .product-image-wrapper .certificates li img {
  max-width: 100px;
  max-height: 100px;
}

.productDetail .product-image-wrapper .product-image-note-col {
  padding-top: 2px;
}

.productDetail #product-nav-slider .slick-prev {
  left: -30px;
}

.productDetail #product-nav-slider .slick-next {
  right: -30px;
}

.productDetail .product-details-wrapper {
  padding: 0 10px 0 0;
}

.productDetail .product-code {
  font-size: 10px;
}

.productDetail .selling-points .sp-list {
  padding-inline-start: 18px;
  line-height: 20px;
}

.productDetail .selling-points .tabHead.hazardous-material {
  color: #3e4954;
  display: block;
  width: 100%;
  text-decoration: none;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  position: relative;
}

.productDetail .selling-points .tabHead.hazardous-material:hover {
  color: #3e4954;
  text-decoration: none;
}

.productDetail .selling-points .hazardous-material-description table {
  table-layout: fixed;
}

.productDetail .selling-points .hazardous-material-description td {
  padding-bottom: 0;
}

@media (max-width: 768px) {
  .productDetail .selling-points table {
    word-break: break-all;
    hyphens: auto;
  }
}

.productDetail .product-attributes-wrapper {
  padding: 15px 20px 0 20px;
  background-color: #F6F7F9;
}

.productDetail .productActionContainer .quantityContainer {
  margin-bottom: 15px;
}

.productDetail .location-wrapper {
  min-height: 48px;
  margin-bottom: 15px;
}

.productDetail .locationStockLink {
  color: #3e4954;
}

.productDetail .locationStockLink:hover {
  color: #3e4954;
  text-decoration: none;
}

.productDetail #your-price-caption,
.productDetail #consumer-price-caption-fallback {
  font-weight: bold;
}

.productDetail .old-price {
  padding-left: 5px;
  font-size: 14px;
  text-decoration: line-through;
  font-weight: normal;
}

.productDetail .big-price {
  padding-left: 5px;
  text-transform: none;
  font-size: 18px;
  font-weight: bold;
  color: #de0019;
}

.productDetail .big-price-unit {
  color: #3e4954;
}

.productDetail #base-price-caption,
.productDetail #base-price {
  font-size: 12px;
}

.productDetail #js-your-price {
  margin-bottom: 25px;
}

.productDetail .bulk-wrapper {
  font-size: 12px;
  text-align: left;
}

.productDetail .bulk-wrapper #bulk-price-header {
  margin-bottom: 5px;
}

.productDetail .bulk-wrapper #bulk-price-content {
  padding-left: 0;
}

.productDetail .bulk-wrapper #bulk-price-footer {
  margin-top: 5px;
  font-weight: bold;
  padding-bottom: 10px;
}

.productDetail .addToCartButton {
  text-transform: uppercase;
}

.productDetail #addToCartLayer {
  padding: 15px;
}

.productDetail #addToCartLayer .popupCartItem {
  padding-top: 10px;
  text-align: center;
}

.productDetail #addToCartLayer .popupCartItem .itemThumb {
  display: inline-block;
  vertical-align: middle;
  width: 45%;
}

.productDetail #addToCartLayer .popupCartItem .itemDesc {
  display: inline-block;
  width: 45%;
}

.productDetail #addToCartLayer .links {
  padding-top: 10px;
  text-align: center;
}

.productDetail .panel-body .gpsr {
  font-size: smaller;
  line-height: 1.3em;
}

.productDetail .liveStocks.positive,
.popover .liveStocks.positive {
  color: #127f3e;
}

.productDetail .liveStocks.negative,
.popover .liveStocks.negative {
  color: #f9b409;
}

.productDetail .liveStocks.negative .availability-outofstock-localization,
.popover .liveStocks.negative .availability-outofstock-localization {
  color: #de0019;
}

.productDetail .liveStocks span.stock-comment-text,
.popover .liveStocks span.stock-comment-text {
  color: #3e4954;
  font-weight: normal;
}

.productDetail .liveStocks span.separator-pipe,
.popover .liveStocks span.separator-pipe {
  width: 0;
  /* Use only border style */
  margin-left: 5px;
  margin-right: 5px;
  border: 1px inset;
  /* This is default border style for <hr> tag */
}

.productDetail .liveStocks span:not(.replacement-time):not(.replacement-time-localization):not(.stock-warehouse-name):not(.replacement-time-info),
.popover .liveStocks span:not(.replacement-time):not(.replacement-time-localization):not(.stock-warehouse-name):not(.replacement-time-info) {
  position: relative;
  display: inline-block;
}

.productDetail .liveStocks span:not(.replacement-time):not(.replacement-time-localization):not(.stock-warehouse-name):not(.replacement-time-info) i,
.popover .liveStocks span:not(.replacement-time):not(.replacement-time-localization):not(.stock-warehouse-name):not(.replacement-time-info) i {
  position: absolute;
  top: 0px;
  left: 0px;
}

.productDetail .liveStocks span.replacement-time-info,
.popover .liveStocks span.replacement-time-info {
  display: block;
}

.productDetail .liveStocks span.batch-stock-available,
.popover .liveStocks span.batch-stock-available {
  font-weight: bold;
}

.productDetail .liveStocks span.batch-stock-not-available,
.popover .liveStocks span.batch-stock-not-available {
  font-weight: bold;
}

.popover .liveStocks {
  margin-bottom: 5px;
}

.popover .liveStocks span {
  font-size: 12px;
}

.productDetail .liveStocks,
.popover .liveStocks {
  margin-bottom: 0;
  display: flex;
  justify-content: flex-start;
  align-content: flex-start;
}

.productDetail .liveStocks span,
.popover .liveStocks span {
  font-size: 14px;
  font-weight: bold;
  color: black;
}

/* tabs style for collapse and accordion */
.productDetail .product-tabs-collapse {
  padding: 0;
  margin-bottom: 30px;
  color: #3e4954;
  background-color: white;
}

.productDetail .product-tabs-collapse .panel {
  border: 0;
}

.productDetail .product-tabs-collapse .panel-body {
  padding: 10px 10px 5px 10px;
  font-size: 14px;
}

.productDetail .product-tabs-collapse a.tabHead {
  color: #3e4954;
  background-color: #F6F7F9;
  display: block;
  width: 100%;
  text-decoration: none;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  text-align: left;
  padding-left: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  position: relative;
}

.productDetail .product-tabs-collapse a.tabHead:hover {
  color: #3e4954;
  text-decoration: none;
}

.productDetail .product-tabs-collapse a.tabHead .icon-plus {
  float: right;
  padding-top: 15px;
  color: #e3172f;
}

.productDetail .product-tabs-collapse a.tabHead .icon-plus:before,
.productDetail .product-tabs-collapse a.tabHead .icon-plus:after {
  content: '';
  position: absolute;
  right: 15px;
  top: 15px;
  width: 15px;
  background: #e3172f;
  height: 1px;
  transform: rotate(0deg);
  transition: transform 0.2s ease-in-out;
}

.productDetail .product-tabs-collapse a.tabHead.collapsed .icon-plus:after {
  transform: rotate(90deg);
  transition: transform 0.2s ease-in-out;
}

.productDetail .product-tabs-collapse .productDescriptionText .productFeatureClasses .download-tap-wrapper {
  overflow-wrap: break-word;
  overflow-y: auto;
  max-height: 400px;
  outline: none;
}

.productDetail .product-tabs-collapse .productDescriptionText .productFeatureClasses .download-tap-wrapper:focus {
  outline: 2px solid;
  outline-offset: 2px;
}

.productDetail .product-tabs-collapse .productDescriptionText .productFeatureClasses .download-tap-wrapper::-webkit-scrollbar-track {
  background: #595858;
}

.productDetail .product-tabs-collapse .productDescriptionText .productFeatureClasses .download-tap-wrapper::-webkit-scrollbar-thumb {
  background: #595858;
  border-radius: 4px;
}

.productDetail .product-tabs-collapse .productDescriptionText .productFeatureClasses .download-tap-wrapper::-webkit-scrollbar-thumb:hover {
  background: #595858;
}

.productDetail .product-tabs-collapse .product-downloads-list {
  margin: 10px 0 20px 0;
  padding-left: 10px;
}

.productDetail .product-tabs-collapse .product-downloads-list li {
  list-style: none;
  padding-bottom: 5px;
}

.productDetail .product-tabs-collapse .product-downloads-list li a {
  display: inline-block;
  padding-left: 10px;
  position: relative;
  overflow-wrap: break-word;
}

.productDetail .product-tabs-collapse .product-downloads-list li a:before {
  position: absolute;
  left: 0;
}

.productDetail .product-tabs-collapse .productFeatureClasses table {
  width: 100%;
  margin: 0;
  table-layout: fixed;
}

.productDetail .product-tabs-collapse .productFeatureClasses table tr {
  border-bottom: 1px solid #F6F7F9;
}

.productDetail .product-tabs-collapse .productFeatureClasses table td {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 24px !important;
  overflow-wrap: break-word;
  width: 50%;
}

.productDetail .product-tabs-collapse .productFeatureClasses table .attrib {
  padding-left: 0;
}

.productDetail .prohibis-product-hook {
  display: flex;
  align-items: center;
  padding: 5px 10px;
  color: white;
  background-color: #127f3e;
}

.productDetail .prohibis-product-hook i {
  margin-right: 10px;
}

/*  medium VP */
@media (min-width: 768px) {
  .main-product-image {
    cursor: pointer;
  }
  .main-img-container {
    position: relative;
  }
  .main-img-container .main-product-image-zoom {
    display: block;
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 40px;
    height: 40px;
    font-size: 40px;
    line-height: 1;
    cursor: pointer;
    z-index: 2;
  }
  #accordion .panel-body > div {
    overflow-y: auto;
    max-height: 240px;
  }
  .product-attributes-wrapper {
    min-height: 440px;
  }
  .row-flex {
    display: flex;
    flex-wrap: wrap;
  }
  .row-flex > [class^="col-"] {
    float: none;
  }
  .row-flex .col-order-1 {
    order: 1;
  }
}

@media (min-width: 768px) and (max-width: 969px) {
  .productDetail .productActionContainer .quantityContainer .btn {
    display: none;
  }
  .productDetail #addToCartButton {
    font-size: 0;
  }
  .productDetail #addToCartButton i {
    padding: 0;
    float: none;
  }
  .productDetail .addToWishlistButton .btn {
    padding: 0 10px;
  }
}

/* medium VP */
@media (max-width: 969px) {
  .zoomContainer {
    display: none;
  }
  .productDetail label,
  .productDetail .selling-points,
  .productDetail .old-price,
  .productDetail #consumer-price-caption,
  .productDetail .product-tabs-collapse .panel-body,
  .productDetail .other-location,
  .productDetail .liveStocks span {
    font-size: 12px;
  }
  .productDetail #base-price-caption,
  .productDetail #base-price {
    font-size: 10px;
  }
  .productDetail .product-image-wrapper #product-nav-slider .slick-prev {
    left: -25px;
  }
  .productDetail .product-image-wrapper #product-nav-slider .slick-next {
    right: -25px;
  }
}

/* small VP */
@media (max-width: 767px) {
  .main-product-image-zoom {
    display: none;
  }
  .productDetail .product-image-wrapper {
    padding: 0 5px;
    margin-bottom: 25px;
  }
  .productDetail .product-details-wrapper {
    padding: 0 5px;
  }
  .productDetail .product-producer-image {
    margin-bottom: 10px;
  }
  .productDetail .product-code {
    font-size: 12px;
  }
  .productDetail .product-attributes-wrapper {
    background-color: white;
  }
  .addToCartWrapper {
    background-color: white;
    bottom: 75px;
    left: 0;
    margin: 5px auto 0 auto !important;
    z-index: 100;
    position: fixed;
    width: 100vw;
    padding: 3px 0;
    border-top: 1px solid #f0f0f0;
  }
  .addToCartWrapper #productAddToCartPanel {
    float: right;
    margin-bottom: 0 !important;
  }
  .addToCartWrapper #productAddToCartPanel #addToCartForm {
    width: 100%;
  }
  .addToCartWrapper #addToCartButton i {
    display: inline;
  }
  .addToCartWrapper .addToWishlistButton {
    float: left;
  }
}

@media (max-width: 767px) {
  #product-main-slider {
    width: 100%;
    aspect-ratio: 409/307;
  }
  .productImage {
    width: 100%;
    aspect-ratio: 355/267;
  }
  .certificates li {
    padding: 10px;
  }
}

@media (min-width: 1200px) {
  #product-main-slider .main-product-image {
    width: 100%;
    aspect-ratio: 355/267;
  }
  .certificates li {
    padding: 10px;
  }
}

.category-page {
  padding: 0 5px;
}

@media (max-width: 767px) {
  .category-page .category-list-item:nth-child(2n+3) {
    clear: both;
  }
}

@media (max-width: 969px) {
  .category-page .banner img {
    width: 100%;
  }
}

.category-navigation ul {
  list-style: none;
  padding-left: 0px;
  margin: 0;
}

.category-navigation .number-of-products::before {
  content: "\00a0";
}

.category-navigation .navigation-heading {
  margin: 0px 0px 5px 0px;
  font-weight: 400;
  font-size: 18px;
}

.category-navigation .level12 {
  font-weight: 300;
  font-weight: 400;
}

.category-navigation .level12 .number-of-products {
  display: inline;
}

.category-navigation .level1 {
  margin-bottom: 5px;
}

.category-navigation .level1 .number-of-products {
  display: none;
}

.category-navigation .level2 {
  padding: 15px 0 10px 10px;
  background: #fff;
  font-size: 14px;
}

.category-navigation .level2:not(.sub-category) {
  text-transform: uppercase;
}

.category-navigation .subcategories {
  padding: 10px 5px 10px 10px;
  background: #fff;
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 10px;
}

.category-navigation .subcategories li {
  margin: 0px 0px 15px 10px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  display: block;
}

.category-navigation .subcategories .active {
  color: #000;
}

.category-navigation .current-category a:not(.btn) {
  color: #000;
}

.category-navigation .btn-function {
  border: 1px solid #f0f0f0;
  background: #595858;
  line-height: 50px;
}

.category-navigation .btn-function:hover, .category-navigation .btn-function:focus, .category-navigation .btn-function.focus, .category-navigation .btn-function:active {
  border-color: #3e4954;
  background-color: white;
}

.category-item {
  display: block;
  font-size: 16px;
  text-align: center;
  border: 1px solid #f0f0f0;
  margin-bottom: 4%;
  overflow: hidden;
  background-color: white;
}

.category-item a:before {
  display: inline;
  content: none;
}

.category-item a:hover {
  text-decoration: none;
}

.category-item .img-container {
  display: block;
  position: relative;
  padding-bottom: 75%;
  width: 100%;
  overflow: hidden;
}

.category-item .img-container img {
  display: block;
  position: absolute;
  width: 100%;
}

.category-item .category-name {
  word-wrap: break-word;
  height: 55px;
  padding-top: 5px;
  margin: 0px;
  display: block;
}

/*----------------------- START Mixins -------------------------*/
/*----------------------- END Mixins -------------------------*/
/*----------------------- START Page Basis -------------------------*/
.page-productList .page-background.ptm,
.page-search .page-background.ptm {
  background-color: #f0f0f0;
}

/*----------------------- END Page Basis -------------------------*/
/*----------------------- START Header -------------------------*/
.category-header {
  text-align: center;
  padding-bottom: 30px;
  background: #f0f0f0;
  border-left: 5px solid #f0f0f0;
  border-right: 5px solid #f0f0f0;
}

.category-header .category-name {
  margin: 25px 0 5px 0;
  text-align: center;
}

.parallax-wrapper .category-header {
  color: #fff;
  background: rgba(0, 0, 0, 0.6);
  padding-bottom: 45px;
}

.parallax-wrapper .category-header .breadcrumb-row,
.parallax-wrapper .category-header .breadcrumb {
  background-color: #f0f0f0;
}

@media (hover: hover) {
  .parallax-wrapper .category-header .breadcrumb-row a:hover,
  .parallax-wrapper .category-header .breadcrumb a:hover {
    color: #127f3e;
  }
}

.page-search .paginationBar .pagination-wrapper,
.page-productList .paginationBar .pagination-wrapper {
  height: 110px;
}

.paginationBar {
  vertical-align: middle;
  line-height: 40px;
  height: 110px;
}

.paginationBar .sticked {
  z-index: 999;
  background: #f0f0f0;
  border-bottom: 5px solid #f0f0f0;
}

.paginationBar .list-view-switcher,
.paginationBar .sortinResults,
.paginationBar .page-size-form,
.paginationBar .pagination {
  width: 190px;
  margin: 0 auto;
  font-size: 12px;
}

.paginationBar .list-view-switcher li a,
.paginationBar .page-size-form label,
.paginationBar .sortinResults select {
  font-size: 12px;
}

.paginationBar .pagination-label {
  margin: 10px 0 -5px 0;
  font-weight: 300;
  display: block;
  color: #595858;
}

.paginationBar [class^="icon-arrow-"] {
  color: inherit;
  font-weight: 700;
  font-size: 16px;
}

.paginationBar .list-view-switcher {
  padding-left: 0;
  line-height: 40px;
}

.paginationBar .list-view-switcher li {
  display: inline-block;
}

.paginationBar .list-view-switcher li i {
  font-size: 18px;
}

.paginationBar .list-view-switcher li i:before {
  padding: 0;
}

.paginationBar .list-view-switcher li a {
  line-height: 38px;
}

.paginationBar .list-view-switcher li .btn i {
  float: none;
  padding: 0;
}

.paginationBar .page-size-wrapper input {
  display: none;
}

.paginationBar .page-size-wrapper .page-size-label {
  min-width: 38px;
  padding: 0 12px;
}

@media (max-width: 767px) {
  .page-search .paginationBar,
  .page-productList .paginationBar {
    height: 60px;
  }
  .page-search .paginationBar .pagination-wrapper .pagination,
  .page-productList .paginationBar .pagination-wrapper .pagination {
    float: right;
  }
  .page-search .paginationBar,
  .page-productList .paginationBar {
    height: 0;
  }
  .page-search .paginationBar .sticked,
  .page-productList .paginationBar .sticked {
    border: none;
  }
  .page-search .paginationBar .pagination-wrapper,
  .page-productList .paginationBar .pagination-wrapper {
    height: 0;
  }
  .page-search .paginationBar .pagination-wrapper .pagination,
  .page-productList .paginationBar .pagination-wrapper .pagination {
    right: 0;
    width: 100%;
  }
  .page-search .paginationBar .pagination-wrapper .pagination li,
  .page-productList .paginationBar .pagination-wrapper .pagination li {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .page-search .paginationBar .pagination-wrapper .pagination .numberInput,
  .page-productList .paginationBar .pagination-wrapper .pagination .numberInput {
    line-height: 26px;
    height: 30px;
  }
  .parallax-wrapper .category-header {
    height: 170px;
  }
  .category-header .breadcrumb-row {
    margin-left: 0;
    margin-right: 0;
  }
  .category-header .breadcrumb-row .breadcrumb {
    padding: 5px 0;
  }
  .category-header .category-name {
    margin: 25px 0 5px 0;
  }
  .mobile-pagination:not(.pagination) {
    position: fixed;
    bottom: 75px;
    width: 50% !important;
    z-index: 1000;
    padding: 10px;
    height: 50px;
    border-top: 1px solid #f0f0f0;
    background: #fff;
    margin-left: -5px;
  }
  .filter-facet-mobile-action {
    display: flex;
    margin-bottom: 10px;
    justify-content: center;
  }
  .filter-facet-mobile-action #filter-facet-popup-handle {
    background-color: #000;
    color: #fff;
    height: 40px;
    line-height: 40px;
    border: none;
  }
  .filter-facet-mobile-action.mobile-pagination {
    right: 0;
  }
  .page-search .mobile-pagination,
  .page-productList .mobile-pagination {
    margin-left: 0;
  }
}

.totalResults strong {
  font-weight: 500;
}

/*----------------------- END Header -------------------------*/
/*----------------------- START Product List -------------------------*/
.product-lister-wrapper {
  padding-bottom: 5px;
}

@media (min-width: 768px) {
  .product-lister-wrapper {
    padding: 0 10px 5px 10px;
  }
}

@media (max-width: 969px) {
  .productList.styleList .productListItem .gridView {
    display: block !important;
    visibility: visible !important;
  }
  .productList.styleList .productListItem .gridView .product-base-price-value {
    color: #595858;
  }
  .productList.styleList .productListItem .listView {
    display: none !important;
  }
}

.productList.styleList .productListItem {
  width: 100%;
  padding-bottom: 5px;
}

.productList.styleGrid .productListItem .gridView {
  display: block !important;
  visibility: visible !important;
}

.productList.styleGrid .productListItem .gridView .product-base-price-value {
  color: #595858;
}

.productList.styleGrid .productListItem .listView {
  display: none !important;
}

.productList.styleGrid:after, .productList.styleGrid:before {
  display: none;
}

.productList.styleGrid .productListItem {
  margin: 0;
  padding: 0 5px 5px 0;
  height: auto;
}

@media (min-width: 768px) {
  .productList.styleGrid .productListItem {
    width: 33.333%;
  }
}

@media (min-width: 970px) {
  .productList.styleGrid .productListItem {
    width: 25%;
  }
}

@media (max-width: 767px) {
  .productList.styleGrid .productListItem {
    width: 50%;
  }
}

.productList {
  flex-wrap: wrap;
  margin-bottom: 0;
  display: flex;
  display: -ms-flexbox;
  display: -webkit-flex;
}

@media (min-width: 768px) {
  #resultsList.styleGrid .productListItem:hover {
    height: unset;
    margin-bottom: -60px;
    /* prevent the button more from influencing the height of the other tiles */
  }
  #resultsList.styleGrid .productListItem:hover .gridView {
    transform: scale(1.05);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    transition: transform .1s ease .1s;
    z-index: 100;
    height: calc(100% - 57px);
  }
  #resultsList.styleGrid .productListItem:hover:only-child {
    margin-bottom: -7px;
  }
  #resultsList.styleGrid .productListItem:hover:only-child .gridView {
    height: calc(100% - 3px);
  }
  #resultsList.styleGrid .productListItem:hover .button-more {
    display: inline-block;
  }
}

.productListItem {
  transition: all .2s ease, margin-bottom 0ms ease;
  height: auto;
}

.gridView {
  position: relative;
  width: 100%;
  height: 100%;
  line-height: 20px;
}

.gridView .priceContainer {
  display: flex;
  flex-direction: column;
  height: 47px;
  font-weight: bold;
  font-size: 22px;
  line-height: 22px;
}

.gridView .priceContainer .no-price {
  font-size: 14px;
}

@media (min-width: 500px) and (max-width: 768px) {
  .gridView .priceContainer {
    display: block;
    height: unset;
  }
}

.gridView .button-more {
  width: 100%;
}

.gridView .panel1 {
  height: 80px;
  border-top: 1px solid #f6f7f9;
  border-bottom: 1px solid #f6f7f9;
}

.gridView .productName {
  word-wrap: break-word;
  vertical-align: middle;
  text-align: left;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  hyphens: auto;
  height: 60px;
}

.gridView .productImage img {
  position: relative;
  aspect-ratio: 228/171;
  width: 100%;
  object-fit: cover;
}

.gridView .productStockContainer {
  height: 40px;
  font-weight: bold;
}

.gridView .productVariants {
  font-weight: bold;
  height: 20px;
  margin-top: 10px;
}

.gridView .basePriceContainer {
  font-size: 12px;
  font-weight: normal;
  height: 20px;
}

.productList .listView {
  padding: 0 10px;
  margin: 0;
  min-height: 125px;
}

.productList .listView:hover {
  text-decoration: none;
}

.productList .listView .section-1,
.productList .listView .section-2,
.productList .listView .section-3 {
  margin-top: 15px;
  margin-bottom: 15px;
}

.productList .listView .section-3 {
  padding-left: 0;
}

.productList .listView .section-1 .hooks {
  margin-top: 40px;
  margin-left: -10px;
}

.productList .listView .section-1 .hooks li {
  padding-top: 5px;
  padding-bottom: 5px;
}

.productList .listView .section-1 .productName p {
  line-height: 1.4em;
  max-height: 4.2em;
  overflow: hidden;
}

.productList .listView .section-1 .productCode {
  font-size: 10px;
  color: #595858;
}

.productList .listView .section-1 .productDetailsLink {
  font-size: 12px;
}

.productList .listView .section-2 .productDimension:not(.select-wrapper) label {
  font-size: 12px;
  margin: 0;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.productList .listView .section-3 .productPriceContainer .productPriceLive {
  font-size: 12px;
  font-weight: bold;
}

.productList .listView .section-3 .productPriceContainer .productPriceBase {
  font-size: 10px;
  color: #595858;
}

.productList .listView .section-3 .productPriceContainer .productPriceBase p {
  font-size: 12px;
}

.productListItem .productStockLevel .icon-arrow-right {
  color: #de0019;
  font-size: 8px;
  padding-left: 5px;
}

.page-search .productList .listView .section-1:has(.productImage), .page-productList .productList .listView .section-1:has(.productImage) {
  width: 10%;
  padding-right: 0;
}

.page-search .productList .listView .offers, .page-productList .productList .listView .offers {
  width: 90%;
}

.page-search .productList .listView .offers .section-1, .page-productList .productList .listView .offers .section-1 {
  padding-left: 5px;
}

.page-search .productList .listView .offers .section-1 .productName p, .page-productList .productList .listView .offers .section-1 .productName p {
  line-height: 20px;
  max-height: 60px;
  font-weight: bold;
}

.page-search .productList .listView .offers .section-1 .productStockLevel, .page-productList .productList .listView .offers .section-1 .productStockLevel {
  padding: 0;
}

.page-search .productList .listView .offers .section-1 .productStockLevel p.stock-title, .page-productList .productList .listView .offers .section-1 .productStockLevel p.stock-title {
  display: none;
}

.page-search .productList .listView .offers .section-1 .productStockLevel p.stock-default-warehouse, .page-productList .productList .listView .offers .section-1 .productStockLevel p.stock-default-warehouse {
  font-weight: bold;
}

.page-search .productList .listView .offers .section-1 .productStockLevel .light-text, .page-productList .productList .listView .offers .section-1 .productStockLevel .light-text {
  font-weight: normal;
}

.page-search .productList .listView .offers .quantityContainer, .page-productList .productList .listView .offers .quantityContainer {
  padding-right: 0;
}

.page-search .productList .listView .offers .section-3, .page-productList .productList .listView .offers .section-3 {
  padding-right: 0;
}

.page-search .productList .listView .offers .section-3 label, .page-productList .productList .listView .offers .section-3 label {
  font-size: 12px;
  line-height: 20px;
  margin: 0;
}

.page-search .productList .listView .offers .section-3 .addToWishlistButton, .page-productList .productList .listView .offers .section-3 .addToWishlistButton {
  text-overflow: clip;
  padding: 0;
  margin: auto;
}

.page-search .productList .listView .offers .section-3 .productPriceContainer, .page-productList .productList .listView .offers .section-3 .productPriceContainer {
  line-height: 20px;
}

.page-search .productList .listView .offers .section-3 .productPriceBase p, .page-productList .productList .listView .offers .section-3 .productPriceBase p {
  margin: 0;
}

.page-search .productList .listView .productVariants, .page-productList .productList .listView .productVariants {
  font-weight: bold;
  line-height: 20px;
}

.page-search .resultsListWrapper--grid, .page-productList .resultsListWrapper--grid {
  --cls-adjustment-factor: 60px;
}

@media (max-width: 969px) {
  .page-search .resultsListWrapper--grid, .page-productList .resultsListWrapper--grid {
    --cls-adjustment-factor: 90px;
  }
}

@media (max-width: 768px) {
  .page-search .resultsListWrapper--grid, .page-productList .resultsListWrapper--grid {
    --cls-adjustment-factor: 120px;
  }
}

/*----------------------- END Product List -------------------------*/
/*----------------------- START Stocklevel -------------------------*/
.productStockLevel {
  font-size: 12px;
}

.productStockLevel .stock-default-warehouse {
  line-height: 18px;
  display: flex;
  align-items: baseline;
}

.productStockLevel p {
  margin-bottom: 5px;
}

.productStockLevel .stock-message {
  font-weight: bold;
  display: inline-flex;
  align-items: baseline;
}

.productStockLevel span.other-stock {
  cursor: pointer;
}

.productStockLevel span.other-stock:hover {
  color: #127f3e;
}

.productStockLevel .popover-title {
  font-size: 12px;
  font-weight: 700;
}

.productStockLevel .popover-content {
  font-size: 12px;
}

/*----------------------- END Product List -------------------------*/
/*----------------------- START Footer -------------------------*/
.category-footer {
  padding: 40px 0;
}

.parallax-wrapper .category-footer {
  background: rgba(0, 0, 0, 0.6);
  padding: 40px 0;
  color: #fff;
  background-position: bottom;
}

.category-page .category-footer {
  margin: 0 -5px;
}

/*----------------------- END Footer -------------------------*/
.page-account .wishlist-list .row-heading {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 0 !important;
}

.page-account .wishlist-list .row-heading h4 {
  width: 100%;
  text-align: center;
  margin-bottom: 20px !important;
}

.page-account .wishlist-list .list-entries .js-panel-details {
  background-color: white;
  padding: 0 20px;
}

.page-account .wishlist-list .list-entries .expanded .entry-wrapper {
  background-color: white;
  border-top: 2px solid #f0f0f0;
  border-bottom: none;
}

.page-account .wishlist-list .list-entries .expanded .js-panel-details {
  padding: 0 20px 10px 20px;
}

.page-account .wishlist-list .list-entries .expanded .sortable-list-entry {
  border-bottom: 1px solid #DADADA;
  margin-top: 20px;
}

.page-account .wishlist-list .list-entries .expanded .detail-wishlist-link.plus-icon:not(.mobile)::after {
  transform: rotate(180deg);
}

.page-account .wishlist-list .list-entries .entry-wrapper {
  background: white;
  background-clip: padding-box;
  padding: 10px 0;
}

.page-account .wishlist-list .list-entries #editWishlistForm {
  background-color: #f0f0f0;
  padding: 20px;
}

.page-account .wishlist-list .list-entries #editWishlistForm .wishlist-details-action-wrapper {
  width: 100%;
  list-style-type: none;
  /* Remove bullet */
}

.page-account .wishlist-list .list-entries #editWishlistForm .wishlist-details-action-wrapper .add-wishlist-to-cart-form:after {
  content: "\e905";
  font-size: 20px;
  margin-left: 0;
}

.page-account .wishlist-list .list-entries #editWishlistForm .wishlist-details-action-wrapper #submitFormButton:after {
  content: "\e962";
}

.page-account .wishlist-list .list-entries #editWishlistForm .addToWishlistContainer {
  margin-top: 7px;
}

.page-account .wishlist-list .list-entries #editWishlistForm .addToWishlistContainer .edit-wishlist-entry-delete i,
.page-account .wishlist-list .list-entries #editWishlistForm .addToWishlistContainer .edit-wishlist-entry-undo i {
  font-size: 18px;
}

.page-account .wishlist-list .list-entries #editWishlistForm .addToWishlistContainer .edit-wishlist-entry-delete:hover,
.page-account .wishlist-list .list-entries #editWishlistForm .addToWishlistContainer .edit-wishlist-entry-undo:hover {
  cursor: pointer;
}

.page-account .wishlist-list .list-entries #editWishlistForm .required {
  color: #3e4954;
}

.page-account .wishlist-list .list-entries .list-entry {
  border-top: 2px solid #f0f0f0;
}

.page-account .wishlist-list .list-entries .list-entry .localMessage {
  margin-bottom: 20px;
}

.page-account .wishlist-list .wishlish-delete-whole .js-wishlist-cancel-submit:after,
.page-account .wishlist-list .wishlish-delete-whole .js-wishlist-cancel-delete:after {
  content: "";
}

.page-account .wishlist-list .wishlish-delete-whole .js-wishlist-cancel-submit:not(.js-wishlist-cancel-submit),
.page-account .wishlist-list .wishlish-delete-whole .js-wishlist-cancel-delete:not(.js-wishlist-cancel-submit) {
  background-color: transparent;
  color: #3e4954;
  border: 1px solid #3e4954;
}

.page-account .wishlist-list .create-wishlist-form .js-new-wishlist-submit:after {
  content: "\e962";
}

.page-account .wishlist-list .create-wishlist-form .required {
  color: #3e4954;
}

.page-account .detail-wishlist-link.plus-icon:not(.mobile) {
  position: relative;
}

.page-account .detail-wishlist-link.plus-icon:not(.mobile)::before, .page-account .detail-wishlist-link.plus-icon:not(.mobile)::after {
  position: absolute;
  content: '';
  width: 15px;
  height: 1px;
  top: 20px;
  right: 20px;
  background-color: #000;
  transition: transform 0.2s ease-in-out;
}

.page-account .detail-wishlist-link.plus-icon:not(.mobile)::after {
  transform: rotate(90deg);
}

.page-account .list-wrapper .list-table-heading {
  background-color: white;
}

.deleted-edit-wishlist-entry {
  background-color: #f0f0f0;
}

.deleted-edit-wishlist-entry .fadeable-item {
  opacity: 0.5;
}

.edit-wishlist-entry-undo {
  display: none;
  margin-top: 0;
}

.edit-wishlist-item .quantityInputContainer .error .help-inline {
  width: 230px;
  padding-top: 45px;
}

@media (max-width: 969px) {
  .edit-wishlist-item .productActionContainer .quantityContainer .quantityInputButtonContainer > button {
    display: none;
  }
}

.edit-wishlist-item .consumer-price-caption {
  float: none;
}

.edit-wishlist-item .productPriceContainer p {
  margin-bottom: 0;
}

@media (min-width: 970px) {
  .edit-wishlist-item .productPriceContainer {
    padding-right: 20px;
  }
}

.wishlist-entry-add-to-cart .displayed-loading-icon {
  background-color: transparent;
  width: auto !important;
  float: none;
  line-height: inherit;
  height: inherit;
}

.wishlist-details-header .details-heading {
  margin-bottom: 10px;
  overflow: hidden;
}

.wishlist-details-header .details-description {
  text-transform: none;
  margin-bottom: 10px;
  overflow: hidden;
}

.edit-wishlist-entries {
  padding: 0;
}

.edit-wishlist-entries .sortable-list-entry {
  list-style: none;
}

.wishlist-table .sharedListItems {
  margin-top: 20px;
}

@media (min-width: 768px) {
  .edit-wishlist-entries .sortable-list-entry,
  .wishlist-table .ui-sortable-handle .entry-wrapper {
    cursor: move;
  }
  .edit-wishlist-entries .sortable-list-entry:hover, .edit-wishlist-entries .sortable-list-entry:focus,
  .wishlist-table .ui-sortable-handle .entry-wrapper:hover,
  .wishlist-table .ui-sortable-handle .entry-wrapper:focus {
    background-color: #f0f0f0;
  }
  .edit-wishlist-item .productPriceContainer {
    text-align: right;
  }
}

@media (min-width: 768px) and (max-width: 970px) {
  .quantityInputContainer.full-width {
    margin-left: 25%;
  }
  .productDimensionTag {
    margin-left: 23.5%;
  }
}

@media (max-width: 767px) {
  .edit-wishlist-item .consumer-price-caption {
    display: block;
  }
  .edit-wishlist-item .productPrice span {
    float: left;
  }
  .list-table-heading {
    margin-top: 5px;
  }
  .wishlist-list .addToCartContainer,
  .wishlist-list .productPriceContainer {
    float: right;
  }
  .quantityInputContainer .quantityContainer,
  .quantityInputContainer .unitContainer {
    margin-left: 25%;
  }
  .productDimensionTag {
    margin-left: 23.5%;
  }
}

/* ************* */
/* all viewports */
/* ************* */
/* site cockpit - default */
.site-cockpit__container hr {
  border-color: #d4d4d5;
  margin: 18px 0 20px 0;
}

.site-cockpit__container .light-text-color {
  color: #595858;
}

.site-cockpit__container .address-select-loader__container {
  bottom: 1px;
  left: 1px;
  width: calc(100% - 2px);
  height: 38px;
  position: absolute;
  background-color: #fff;
}

.site-cockpit__container .address-select-loader__container .address-select-loader {
  height: 32px;
  /* use the existing spinner-48-resource and make it smaller */
  margin-left: auto;
  margin-right: auto;
  display: block;
  margin-top: 3px;
}

/* site cockpit - overview  page */
.site-cockpit__overview .select-wrapper {
  margin: 0 auto;
  max-width: 360px;
}

/* site cockpit - address information */
.site-address__container {
  background-color: white;
  padding: 20px;
  float: left;
}

.site-address__details-container dl {
  overflow: hidden;
  margin: 0;
}

.site-address__details-container dt {
  width: 40%;
  overflow: hidden;
  color: #6c6c6c;
}

.site-address__details-container dd {
  width: 60%;
  line-break: anywhere;
  color: #595858;
}

.site-address__details-container dd:after {
  content: "\a";
  white-space: pre;
}

.site-address__details-container dt,
.site-address__details-container dd {
  float: left;
  line-height: 28px;
  font-weight: inherit;
}

.site-address__details-container .highlight-text {
  font-weight: 700;
  color: #3e4954;
}

.site-address__price-container dl {
  overflow: hidden;
  margin: 10px 0 0 0;
}

.site-address__price-container dt {
  width: 45%;
  overflow: hidden;
}

.site-address__price-container dd {
  width: 55%;
  line-break: anywhere;
  text-align: right;
}

.site-address__price-container dt,
.site-address__price-container dd {
  float: left;
  font-weight: inherit;
}

.site-address__action-container .btn i {
  float: none;
  padding-left: 0;
  padding-right: 10px;
}

/* site cockpit - address content */
.site-address__content-container {
  background-color: white;
  float: right;
  padding: 20px;
  /* article content */
  /* document content */
}

.site-address__content-container .side-address__tabs-container {
  margin: -20px -20px 0 -20px;
}

.site-address__content-container .hr-list-item--top {
  margin: 20px 0;
}

.site-address__content-container .hr-list-item--inside {
  margin: 10px 0;
}

.site-address__content-container ul.pagination {
  margin-bottom: 0;
}

.site-address__content-container #article-search-selector-wrapper .btn-cancel {
  padding: 0 10px;
  display: none;
}

.site-address__content-container #article-search-selector-wrapper select[data-chosen] ~ .btn-cancel {
  display: block;
  pointer-events: all;
}

.site-address__content-container #article-search-selector-wrapper .chosen-drop {
  margin-top: -38px;
}

.site-address__content-container #article-search-selector-wrapper .chosen-search {
  margin: 0;
}

.site-address__content-container #article-search-selector-wrapper .chosen-search input {
  height: 38px;
  margin: 0;
  margin-top: 0;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  background-color: transparent;
}

.site-address__content-container #article-search-selector-wrapper .chosen-results {
  margin-top: 8px;
  margin-bottom: 6px;
}

.site-address__content-container .site-article-list-item .icon-download {
  padding-right: 8px;
  font-size: 15px;
}

.site-address__content-container .site-article-list-item .product-buy-again i {
  display: inline-block;
}

.site-address__content-container .site-article-list-item .product-buy-again.closed .label-open {
  display: inline-block;
}

.site-address__content-container .site-article-list-item .product-buy-again.closed .label-close {
  display: none;
}

.site-address__content-container .site-article-list-item .product-buy-again:not(.closed) .label-open {
  display: none;
}

.site-address__content-container .site-article-list-item .product-buy-again:not(.closed) .label-close {
  display: inline-block;
}

.site-address__content-container .site-article-list-item .product-buy-again:not(.closed) i:before {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.site-address__content-container .site-article-list-item .product-buy-again p {
  display: inline-block;
}

.site-address__content-container .site-article-list-item .product-buy-again i {
  padding-right: 8px;
  font-size: 8px;
  display: inline-block;
}

.site-address__content-container .site-article-list-item .data-sheet-loader {
  left: calc(50% - 8px);
  position: absolute;
  top: 21px;
}

.site-address__content-container .site-article-list-item .col--add-to-cart .btn {
  padding: 0;
}

.site-address__content-container .site-article-list-item .stock-title {
  display: none;
}

.site-address__content-container .site-article-list-item .other-stock-wrapper {
  margin-bottom: 5px;
}

.site-address__content-container .site-article-list-item .col--details-bottom {
  display: none;
}

.site-address__content-container .site-article-list-item .col--product-item-price,
.site-address__content-container .site-article-list-item .col--product-total-price {
  line-height: 18px;
  padding-top: 2px;
}

.site-address__content-container .site-article-list-item .col--product-item-price > span,
.site-address__content-container .site-article-list-item .col--product-total-price > span {
  display: block;
}

.site-address__content-container .site-article-list-item .col--product-item-price .base-price-caption__container,
.site-address__content-container .site-article-list-item .col--product-item-price .consumer-price-caption__container {
  /* the 'invisible' class is required on product detail page. since we use the same javascript-logic, this class must be override here with display:none */
  display: none;
}

.site-address__content-container .site-article-list-item .price-via-js__big-price,
.site-address__content-container .site-article-list-item .big-price-unit {
  display: inline-block;
}

.site-address__content-container .site-address__document-container .description-heading__container,
.site-address__content-container .site-address__document-container .col--document-filter-site,
.site-address__content-container .site-address__document-container .col--document-filter-date-from,
.site-address__content-container .site-address__document-container .col--document-filter-date-to,
.site-address__content-container .site-address__document-container .col--document-filter-search,
.site-address__content-container .site-address__document-container .col--page-size-container,
.site-address__content-container .site-address__document-container .col--mobile-pagination-container {
  display: none;
}

.site-address__content-container .site-address__document-container .documents div.document-filter {
  margin-top: 0;
}

.site-address__content-container .site-address__document-container .col--pagination-container {
  width: 100%;
}

.site-address__content-container .site-address__document-container .documents-list {
  background-color: #f0f0f0;
}

.site-address__content-container .site-address__document-container .documents-list .entry-wrapper {
  background: white;
  background-clip: padding-box;
  border-bottom: 3px solid transparent;
  padding: 10px 0;
}

.site-address__content-container .site-address__document-container .documents-list .list-entry.expanded {
  border-top: 3px solid #3e4954;
  border-bottom: 3px solid #3e4954;
}

.site-address__content-container .site-address__document-container .documents-list .list-entry.expanded .entry-wrapper {
  border-top: 0 !important;
}

.site-address__content-container .site-address__document-container .documents-list .list-entry.expanded .details {
  border-bottom: 0 !important;
}

/* ************** */
/* *** min SM *** */
/* ************** */
@media (min-width: 768px) {
  /* site cockpit - default */
  /* site cockpit - overview  page */
  .site-cockpit__text-container {
    margin: 80px 28% 40px 28%;
  }
  .site-cockpit__overview {
    min-height: 300px;
  }
  /* site cockpit - address information */
  .site-address__container {
    width: 285px;
    background-color: white;
  }
  .site-address__container .chosen-drop {
    min-width: 400px;
    display: inline-table;
    padding-top: 8px;
    box-shadow: 0 -4px 4px -4px #595858;
  }
  /* site cockpit - address content */
  .site-address__content-container {
    width: calc(100% - 305px);
    background-color: white;
  }
  .site-address__filter-container--product .site-address__filter-sort .select-wrapper {
    max-width: 245px;
  }
  .site-address__filter-container--document .select-wrapper {
    max-width: 245px;
  }
  [class^="site-address__filter-container"] .filter-pagination-wrapper {
    float: right;
    display: none;
  }
  [class^="site-address__filter-container"] .filter-pagination-wrapper .prev i,
  [class^="site-address__filter-container"] .filter-pagination-wrapper .next i {
    font-size: 16px;
  }
  [class^="site-address__filter-container"] .pagination-label {
    text-align: right;
    display: block;
    padding-right: 43px;
  }
  /* article content */
  .site-article-list-item .product-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .site-article-list-item .col--add-to-cart {
    padding-left: 0;
  }
  .site-article-list-item .col--product-buy-again {
    text-align: right;
  }
  .site-article-list-item .col--details-bottom {
    float: right;
  }
  .site-address__content-container {
    /* css for paging */
  }
  .site-address__content-container .results-list .list-item {
    display: none;
  }
  .site-address__content-container .results-list {
    /* support 300 items at 10 items per page */
  }
  .site-address__content-container .results-list.js-paging-1 .list-item:nth-child(n+1):nth-child(-n+10) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-2 .list-item:nth-child(n+11):nth-child(-n+20) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-3 .list-item:nth-child(n+21):nth-child(-n+30) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-4 .list-item:nth-child(n+31):nth-child(-n+40) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-5 .list-item:nth-child(n+41):nth-child(-n+50) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-6 .list-item:nth-child(n+51):nth-child(-n+60) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-7 .list-item:nth-child(n+61):nth-child(-n+70) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-8 .list-item:nth-child(n+71):nth-child(-n+80) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-9 .list-item:nth-child(n+81):nth-child(-n+90) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-10 .list-item:nth-child(n+91):nth-child(-n+100) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-11 .list-item:nth-child(n+101):nth-child(-n+110) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-12 .list-item:nth-child(n+111):nth-child(-n+120) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-13 .list-item:nth-child(n+121):nth-child(-n+130) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-14 .list-item:nth-child(n+131):nth-child(-n+140) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-15 .list-item:nth-child(n+141):nth-child(-n+150) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-16 .list-item:nth-child(n+151):nth-child(-n+160) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-17 .list-item:nth-child(n+161):nth-child(-n+170) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-18 .list-item:nth-child(n+171):nth-child(-n+180) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-19 .list-item:nth-child(n+181):nth-child(-n+190) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-20 .list-item:nth-child(n+191):nth-child(-n+200) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-21 .list-item:nth-child(n+201):nth-child(-n+210) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-22 .list-item:nth-child(n+211):nth-child(-n+220) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-23 .list-item:nth-child(n+221):nth-child(-n+230) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-24 .list-item:nth-child(n+231):nth-child(-n+240) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-25 .list-item:nth-child(n+241):nth-child(-n+250) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-26 .list-item:nth-child(n+251):nth-child(-n+260) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-27 .list-item:nth-child(n+261):nth-child(-n+270) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-28 .list-item:nth-child(n+271):nth-child(-n+280) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-29 .list-item:nth-child(n+281):nth-child(-n+290) {
    display: block;
  }
  .site-address__content-container .results-list.js-paging-30 .list-item:nth-child(n+291):nth-child(-n+300) {
    display: block;
  }
  /* document content */
  .site-address__document-container .document-filter {
    width: 50%;
    display: inline-block;
    float: left;
  }
  .site-address__document-container .document-filter .col--document-filter-types {
    width: 100%;
  }
  .site-address__document-container .document-filter .col--document-filter-types .select-wrapper {
    max-width: 245px;
  }
  .site-address__document-container .account-pagination {
    width: 50%;
    display: inline-block;
    float: right;
    vertical-align: inherit;
    line-height: inherit;
    height: inherit;
  }
  .site-address__document-container .account-pagination .pagination {
    font-size: inherit;
  }
  .site-address__document-container .account-pagination .pagination-label {
    margin-top: 0;
    max-width: 100%;
    width: 100%;
    margin-bottom: 5px;
    font-weight: 400;
    color: inherit;
  }
  .site-address__document-container .accountContentPane {
    clear: both;
  }
  .site-address__document-container .list-entry.expanded .details .js-decrease-quantity,
  .site-address__document-container .list-entry.expanded .details .js-increase-quantity {
    display: none;
  }
}

/* **************** */
/* min SM to max SM */
/* **************** */
@media (min-width: 768px) and (max-width: 969px) {
  .col--product-quantity .quantityContainer,
  .col--product-quantity .unitContainer {
    width: 100%;
  }
}

/* ******************* */
/* min MD to max 1150px */
/* ******************* */
@media (min-width: 970px) and (max-width: 1150px) {
  .site-article-list-item .col--product-quantity .quantityContainer .quantityInputButtonContainer > button.btn {
    display: none;
  }
}

/* ******************* */
/* min SM to max 870px */
/* ******************* */
@media (min-width: 768px) and (max-width: 870px) {
  .site-article-list-item .col--product-quantity .quantityContainer .quantityInputButtonContainer > button.btn {
    display: none;
  }
}

/* ************** */
/* *** max XS *** */
/* ************** */
@media (max-width: 767px) {
  /* site cockpit - default */
  /* site cockpit - overview  page */
  .site-cockpit__text-container {
    margin: 60px 10px 40px 10px;
  }
  /* site cockpit - address information */
  /* site cockpit - address content */
  .site-address__content-container {
    /* article content */
  }
  .site-address__content-container [class^="site-address__filter-container"] {
    margin-bottom: 20px;
  }
  .site-address__content-container .site-article-list-item .col--product-total-price {
    text-align: right;
  }
  .site-address__content-container .site-article-list-item .col--add-to-cart {
    margin-top: 5px;
  }
  /* document content */
}

/**
Styling for HWF in MyAccount
 */
#userAccountContent .Switch.loading {
  opacity: 0.3;
  pointer-events: none;
  cursor: wait;
}

#userAccountContent.accountEditCraftsmanfinder .craftsmanfinder-logo {
  width: 130px;
  height: 100px;
  border: 1px solid #595858;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;
  padding: 0;
  color: #595858;
}

#userAccountContent.accountEditCraftsmanfinder .craftsmanfinder-logo img {
  object-fit: contain;
  max-height: 100%;
}

#userAccountContent.accountEditCraftsmanfinder.accountEditCraftsmanfinder form {
  background-color: white;
  padding: 20px 10px;
}

#userAccountContent.accountEditCraftsmanfinder.accountEditCraftsmanfinder form textarea {
  resize: vertical;
}

#userAccountContent.accountEditCraftsmanfinder .description {
  max-width: 100%;
}

form#editCraftsmanfinderForm .row > * {
  padding: 0 20px;
}

form#editCraftsmanfinderForm input[name="logo"]::-webkit-file-upload-button, form#editCraftsmanfinderForm input[name="logo"]::file-selector-button {
  display: none;
}

/**
Styling for HWF Such - CMS Seite
 */
body.template-pages-craftsman-search {
  /**
  overwrites
   */
  /**
  overwrites end
  */
}

body.template-pages-craftsman-search label[for="craftsmanSearchBtn"] {
  visibility: hidden;
}

body.template-pages-craftsman-search label {
  margin-bottom: 0;
}

body.template-pages-craftsman-search #craftsmanSearchBtn {
  display: flex;
  width: 100%;
  justify-content: center;
  padding: 0 40%;
}

body.template-pages-craftsman-search #craftsmanSearchBtn::after {
  content: '';
}

body.template-pages-craftsman-search #craftsmanSearchBtn .i {
  padding-left: 15px;
}

@media (min-width: 768px) {
  body.template-pages-craftsman-search #craftsmanSearchBtn {
    min-width: 100px;
    width: 100px;
  }
}

body.template-pages-craftsman-search .headline {
  text-align: center;
}

body.template-pages-craftsman-search .description {
  text-align: center;
}

body.template-pages-craftsman-search .craftsmanfinder-search {
  display: flex;
  flex-direction: column;
}

body.template-pages-craftsman-search .craftsmanfinder-search__form {
  background-color: white;
  margin-bottom: 20px;
  padding-bottom: 20px;
}

@media (min-width: 768px) {
  body.template-pages-craftsman-search .craftsmanfinder-search__form {
    margin-bottom: 0;
    padding-bottom: 0;
  }
}

body.template-pages-craftsman-search .craftsmanfinder-search__form > div {
  padding: 10px 20px 0 20px;
}

body.template-pages-craftsman-search .craftsmanfinder-search__form > div:first-of-type {
  padding-top: 20px;
}

@media (max-width: 320px) {
  body.template-pages-craftsman-search .craftsmanfinder-search__form > div:last-of-type {
    padding-top: 0;
    padding-bottom: 20px;
  }
}

@media (min-width: 768px) {
  body.template-pages-craftsman-search .craftsmanfinder-search__form > div {
    padding: 20px 0px 20px 20px;
  }
}

body.template-pages-craftsman-search .craftsmanfinder-search .paginationBar {
  height: auto;
  margin-bottom: 20px;
}

@media (min-width: 768px) {
  body.template-pages-craftsman-search .craftsmanfinder-search .paginationBar {
    display: none;
  }
}

body.template-pages-craftsman-search .craftsmanfinder-search .paginationBar .col--mobile-pagination-container {
  display: none;
}

body.template-pages-craftsman-search .craftsmanfinder-search__results {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
}

@media (min-width: 768px) {
  body.template-pages-craftsman-search .craftsmanfinder-search__results {
    gap: 0;
  }
}

body.template-pages-craftsman-search .craftsmanfinder-search__results input[type='radio'] {
  display: none;
}

body.template-pages-craftsman-search .craftsmanfinder-search__results .entry {
  background-color: white;
  padding: 10px;
}

body.template-pages-craftsman-search .craftsmanfinder-search__results .entry > div {
  margin-bottom: unset;
}

@media (min-width: 768px) {
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry {
    padding: 20px;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry > div {
    margin-bottom: 20px;
  }
}

body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .logo {
  display: flex;
  justify-content: center;
  align-items: center;
  max-height: 80%;
}

body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .logo img {
  height: auto;
  max-height: 100%;
  max-width: 100%;
}

body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .contact .name {
  text-align: center;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .contact .email {
  overflow-wrap: break-word;
  word-wrap: break-word;
  min-width: inherit;
}

body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .contact-link {
  display: inline-flex;
  align-items: center;
}

body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .contact-link i {
  width: 15px;
  display: block;
  font-size: 16px;
  text-align: center;
  margin-right: 15px;
}

body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .profile > span,
body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .gewerk > span {
  text-decoration: underline;
  font-weight: bold;
}

@media (max-width: 768px) {
  @keyframes fade-in {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry-wrapper {
    grid-column: span 1;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry-wrapper.expanded {
    grid-column: 1 / -1;
    /* Expand across all columns */
    animation: expandColumn 1s ease;
  }
  @keyframes expandColumn {
    0% {
      grid-column: span 1;
    }
    100% {
      grid-column: 1 / -1;
    }
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry-wrapper:first-child {
    display: none;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry {
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 200px;
    cursor: pointer;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .contact-details {
    display: flex;
    flex-direction: column;
    gap: 10px;
    animation: fade-in 1s ease-in-out;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .contact-details,
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .profile,
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .gewerk {
    opacity: 0;
    display: none;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry-wrapper.expanded .entry {
    flex: 1;
    height: auto;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry-wrapper.expanded .entry .contact-details,
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry-wrapper.expanded .entry .profile,
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry-wrapper.expanded .entry .gewerk {
    display: block;
    opacity: 1;
    animation: fade-in 0.75s ease-in-out;
  }
}

@media (min-width: 768px) {
  body.template-pages-craftsman-search .craftsmanfinder-search__results {
    display: flex;
    flex-direction: column;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry-wrapper {
    position: relative;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry-wrapper::after {
    content: '';
    display: block;
    margin: 0 20px;
    border-bottom: 1px solid #DADADA;
    background-color: white;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry-wrapper:last-of-type::after {
    margin: 0 20px 20px;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 1fr 2fr 3fr 1fr;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry > div:first-child {
    min-width: 130px;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry > div:nth-child(2) {
    min-width: 180px;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry > div:nth-child(3) {
    min-width: 230px;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry > div:nth-child(4) {
    min-width: 100px;
    text-align: right;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .logo img {
    width: 8.125rem;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .contact .name {
    text-align: left;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .gewerk {
    text-align: right;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .profile > span,
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .gewerk > span {
    display: none;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .contact-details,
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .profile,
  body.template-pages-craftsman-search .craftsmanfinder-search__results .entry .gewerk {
    display: initial;
  }
  body.template-pages-craftsman-search .craftsmanfinder-search__results .gewerk ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
  }
}

.select2-container[data-custom-dropdown="delivery-modes"] .select2-search {
  display: none;
}

.select2-container[data-custom-dropdown="customerIds"] .custom-search-field-for-customerIds {
  width: 85% !important;
  max-width: 100%;
}

.page-cartPage .availability-outofstock-localization {
  color: #de0019;
}

.page-cartPage span.stock-comment-text {
  display: none;
}

.page-cartPage span.separator-pipe {
  display: none;
}

.page-cartPage #idsCallbackForm {
  display: inline-block;
  margin-right: 20px;
}

@media (max-width: 1199px) {
  .page-cartPage #idsCallbackForm {
    width: 100%;
  }
}

.page-cartPage .offerRequestButton,
.page-cartPage .callbackButton,
.page-cartPage .checkoutButton {
  width: 100%;
}

.page-cartPage .offerRequestButton:after {
  content: none;
}

.page-cartPage .cartContent {
  background-color: white;
}

.page-cartPage .cartItemHeader {
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
}

.page-cartPage .cartItems {
  display: block;
  flex-wrap: unset;
}

.page-cartPage .cartItems i {
  font-size: 16px;
  color: #3e4954;
}

.page-cartPage .cartItems .madatoryFollowupProductItem,
.page-cartPage .cartItems .cartItem {
  border-bottom: 1px solid #f0f0f0;
}

.page-cartPage .cartItems .cartItem {
  height: 100%;
  background-color: white;
  min-height: 130px;
}

.page-cartPage .cartItems .cartItem .section-4 .item-price-value,
.page-cartPage .cartItems .cartItem .section-4 .no-price {
  line-height: 40px;
}

.page-cartPage .cartItems .cartItem .productStockLevel .icon-arrow-right {
  font-size: 12px;
  padding-left: 2px;
}

.page-cartPage .cartItems .cartItem .stock-title {
  display: none;
}

.page-cartPage .cartItems .cartItem .productImage .img-responsive {
  margin: 0;
}

.page-cartPage .cartItems .cartItem .productName {
  overflow: hidden;
}

.page-cartPage .cartItems .cartItem .productItemPriceContainer .product-base-price {
  padding-top: 10px;
}

.page-cartPage .cartItems .cartItem .productItemPriceContainer .product-base-price .product-base-price-value {
  white-space: nowrap;
}

.page-cartPage .cartItems .cartItem .productStockContainer .productStockLevel .stock-info {
  font-size: 14px;
  font-weight: normal;
  color: #3e4954;
}

.page-cartPage .cartItems .cartItem .other-stock i {
  margin-right: 5px;
  font-size: 8px;
  line-height: 22px;
}

.page-cartPage .cartItems .cartItem .updateQuantityProduct,
.page-cartPage .cartItems .cartItem .remove {
  display: inline-block;
  line-height: 40px;
}

.page-cartPage .cartItems .cartItem .remove {
  padding-left: 4px;
}

.page-cartPage .cartItems .madatoryFollowupProductItem .productName,
.page-cartPage .cartItems .madatoryFollowupProductItem .section-3,
.page-cartPage .cartItems .madatoryFollowupProductItem .section-4 {
  color: #595858;
}

.page-cartPage .cartItems .madatoryFollowupProductItem .productInfo {
  color: #de0019;
  font-weight: bolder;
}

.page-cartPage .cartItems .delivery-bottom {
  background-color: white;
  margin-bottom: 5px;
}

.page-cartPage .cartItems .delivery-bottom .section-1 .form-group {
  float: right;
}

.page-cartPage .orderTotals {
  text-align: right;
  line-height: 45px;
}

.page-cartPage .orderTotals .bg-white {
  border-bottom: 1px solid #f0f0f0;
}

.page-cartPage .orderTotals .deliveryNote {
  font-size: 11px;
  text-align: center;
  border-top: 3px double #f0f0f0;
  color: #595858;
}

.page-cartPage .orderTotals .total {
  font-size: 15px;
}

.page-cartPage .shipping {
  line-height: 25px;
}

.page-cartPage .shipping .form-group {
  float: left;
}

.page-cartPage .pseudo-checkbox {
  margin-right: 10px;
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .page-cartPage .section-4,
  .page-cartPage .productItemPriceContainer {
    padding-left: 5px;
  }
  .page-cartPage .productItemPriceContainer .price {
    text-align: right;
    min-width: 70px;
    display: inline-block;
  }
  .page-cartPage .action-container--right {
    text-align: right;
  }
}

@media (min-width: 970px) {
  .page-cartPage .callbackButton,
  .page-cartPage .offerRequestButton,
  .page-cartPage .checkoutButton {
    max-width: 250px;
    display: inline-block;
  }
  .page-cartPage .callbackButton,
  .page-cartPage .offerRequestButton {
    margin-right: 20px;
  }
  .page-cartPage .continueButton {
    max-width: 250px;
  }
}

@media (max-width: 969px) {
  .page-cartPage .cartContent {
    padding: 10px;
  }
  .page-cartPage .action-container--right {
    padding-top: 0;
  }
}

/* START XS-Viewport */
@media only screen and (max-width: 767px) {
  .page-cartPage {
    /* hide content */
  }
  .page-cartPage .productDetailsWrapper > .productStockLevel {
    display: none;
  }
  .page-cartPage .cartItems .delivery.row .section-3 {
    padding-left: 20px;
  }
  .page-cartPage .cartItems .delivery.row .section-3 .form-group {
    width: 50%;
  }
  .page-cartPage .cartItems .delivery-bottom .section-1 .form-group {
    float: left;
  }
  .page-cartPage .cartItems .buttonContainer {
    bottom: 4px;
    text-align: right;
  }
  .page-cartPage .cartItems .productStockContainer {
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 15px;
  }
  .page-cartPage .cartItems .productItemUpdateContainer {
    border-bottom: 1px solid #f0f0f0;
  }
  .page-cartPage .cartItems .section-4 {
    padding-top: 5px;
  }
  .page-cartPage .cartItems .totalAmount {
    padding-top: 3px;
  }
}

/* END XS-Viewport */
@media (max-width: 969px) {
  .page-cartPage .productStockContainer {
    line-height: 22px;
    margin-bottom: 20px;
  }
  .page-cartPage .offerRequestButton,
  .page-cartPage .callbackButton,
  .page-cartPage .checkoutButton {
    margin-top: 20px;
  }
}

.registrationForm {
  margin-top: 30px;
}

.registrationForm .headline {
  padding-bottom: 20px;
  border-bottom: 1px solid #f0f0f0;
}

.registrationForm input,
.registrationForm input[type="text"],
.registrationForm input[type="email"],
.registrationForm input[type="tel"],
.registrationForm .select-wrapper {
  /*width: 400px;*/
}

.registrationForm .form-actions {
  margin: 20px 0;
}

@media (max-width: 767px) {
  .registrationForm label {
    float: inherit;
  }
  .registrationForm input {
    width: 100%;
  }
}

.checkout-login-tabContent {
  background-color: white;
  padding: 20px;
}

.checkout-login-tabContent hr {
  border-color: #d4d4d5;
}

#guestcheckout-tag .userOuting {
  background-color: white;
  padding: 20px;
  width: 100%;
}

#guestcheckout-tag .userOuting .subline-text {
  padding-top: 10px;
  padding-bottom: 20px;
  border-bottom: 1px solid #595858;
}

.guestCheckoutMain {
  /* fake radio button with check icon */
}

.guestCheckoutMain .section-label {
  min-height: 40px;
}

.guestCheckoutMain label.radio-check .radio-button {
  position: relative;
}

.guestCheckoutMain label.radio-check .radio-button i.radio-inner {
  background-color: transparent;
}

.guestCheckoutMain label.radio-check .radio-button i.radio-inner:after {
  font-family: 'hagebau-icomoon';
  font-size: 16px;
  position: absolute;
  right: -2px;
  top: -4px;
  content: '\e906';
}

/* ####################################################################### */
/* ############################### @MEDIA ################################ */
/* ####################################################################### */
@media (min-width: 970px) {
  #guestcheckout-tag .subline-text {
    min-height: 65px;
  }
  #guestCheckoutForm .fieldsRow {
    display: flex;
    flex-wrap: wrap;
  }
}

@media (max-width: 969px) {
  #guestcheckout-tag .toggle-off h3:after {
    font-family: 'hagebau-icomoon';
    font-size: 8px;
    padding-left: 10px;
    vertical-align: middle;
    position: absolute;
    right: 30px;
    content: "\e90a";
  }
  #guestcheckout-tag .toggle-off .userOutingInner {
    display: none;
  }
  #guestcheckout-tag .toggle-on h3:after {
    font-family: 'hagebau-icomoon';
    font-size: 8px;
    padding-left: 10px;
    vertical-align: middle;
    position: absolute;
    right: 30px;
    content: "\e90b";
  }
  #guestcheckout-tag .toggle-on .userOutingInner {
    display: block;
  }
  .guestCheckoutMain .second-section {
    padding-top: 20px;
  }
}

.delivery-mode-option.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.page-articleDetailsPage .sponsoredLabel {
  top: 10px;
  position: relative;
  background-color: #fff;
  display: inline-block;
  line-height: 37px;
  padding-left: 10px;
  padding-right: 10px;
}

.page-articleDetailsPage .breadcrumb-image-wrapper img {
  filter: brightness(70%);
  width: 100%;
  height: 100%;
  object-fit: cover;
  max-height: 350px;
}

.page-articleDetailsPage .breadcrumb-image-wrapper .sponsoredLabel {
  position: absolute;
  top: 20px;
  left: 20px;
}

.page-articleDetailsPage .breadcrumb-image-wrapper .breadcrumb-row {
  background-color: transparent;
  width: calc(100% - 20px);
}

.page-articleDetailsPage .breadcrumb-image-wrapper .breadcrumb-row .breadcrumb {
  background-color: transparent;
}

.page-articleDetailsPage .breadcrumb-image-wrapper .breadcrumb-row .breadcrumb > li {
  display: inline-block;
  float: none;
}

.page-articleDetailsPage .breadcrumb-image-wrapper .breadcrumb-row .breadcrumb li:before,
.page-articleDetailsPage .breadcrumb-image-wrapper .breadcrumb-row .breadcrumb li a {
  color: #000;
}

.page-articleDetailsPage .section2 .yCmsComponent:first-child {
  border-top: 1px solid #DFDFDF;
}

.page-articleDetailsPage .section2 .yCmsComponent:last-child {
  border-bottom: 1px solid #DFDFDF;
}

.page-articleDetailsPage .section3 .yCmsContentSlot .yCmsComponent:first-child {
  margin-top: 0px !important;
}

.awsArticleDetailsContent .centered-image {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
}

.awsArticleDetailsContent .light-text-color {
  color: #595858;
}

.awsArticleDetailsContent .updatedAt {
  display: none;
}

.awsArticleDetailsContent .icon.stars {
  color: #FFC107;
}

.awsArticleDetailsContent .separator {
  padding-left: 10px;
  padding-right: 10px;
}

.awsArticleDetailsContent .article-content > *:not(h1):not(h2):not(h3) {
  margin-bottom: 40px;
}

.awsArticleDetailsContent .article-content img {
  display: block;
  height: auto;
  margin: 0 auto;
}

.awsArticleDetailsContent .article-content img:not(.product-link .image-container img) {
  width: 800px;
  max-width: 100%;
}

.awsArticleDetailsContent .article-content .row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.awsArticleDetailsContent .article-content .row .pull-right {
  order: 2;
}

.awsArticleDetailsContent .article-content .row.articleGalleryRow {
  align-items: flex-start;
}

.awsArticleDetailsContent .article-content .rowslider {
  margin-bottom: 40px;
  visibility: hidden;
}

.awsArticleDetailsContent .article-content .rowslider.slick-initialized {
  visibility: visible;
}

.awsArticleDetailsContent .article-content .rowslider.expandable .slick-slide {
  cursor: pointer;
}

.awsArticleDetailsContent .article-content .rowslider button.slick-minimize {
  top: 0;
  height: 40px;
  rotate: -90deg;
}

.awsArticleDetailsContent .article-content .rowslider button.slick-minimize span {
  position: absolute;
  font-size: x-large;
  left: 20px;
  bottom: -4px;
}

@media (min-width: 970px) {
  .awsArticleDetailsContent .article-content .rowslider button.slick-minimize span {
    bottom: 2px;
  }
}

.awsArticleDetailsContent .article-content .rowslider button.slick-prev,
.awsArticleDetailsContent .article-content .rowslider button.slick-next {
  opacity: 1;
}

@media (min-width: 970px) {
  .awsArticleDetailsContent .article-content .rowslider button.slick-prev:before,
  .awsArticleDetailsContent .article-content .rowslider button.slick-next:before {
    top: 0;
    transform: translateY(100%);
  }
}

.awsArticleDetailsContent .article-content .rowslider button.slick-prev {
  left: -5px;
}

.awsArticleDetailsContent .article-content .rowslider button.slick-next {
  right: 5px;
}

.awsArticleDetailsContent .article-content .rowslider .slick-list {
  width: 91%;
  margin-left: auto;
  margin-right: auto;
}

.awsArticleDetailsContent .article-content .rowslider .slick-slide {
  padding-left: 15px;
  padding-right: 15px;
}

.awsArticleDetailsContent .article-content .rowslider .slick-slide figure {
  text-align: center;
}

.awsArticleDetailsContent .article-content .rowslider img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 4/3;
}

.awsArticleDetailsContent .author-box {
  border: solid 10px #DFDFDF;
  background: #fff;
  margin: 0 0 40px;
  padding: 30px;
}

.awsArticleDetailsContent .author-box .col-md-2 {
  padding: 0;
}

.awsArticleDetailsContent .author-box .image-box {
  border: 1px solid transparent;
  height: 130px;
  width: 130px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  overflow: hidden;
}

.awsArticleDetailsContent .author-box img {
  display: block;
  max-width: 100%;
  height: auto;
  position: relative;
  transform: translateY(-50%);
  top: 50%;
}

.awsArticleDetailsContent .author-box .author-info-wrapper span {
  display: inline-block;
}

.awsArticleDetailsContent .author-box .author-info-wrapper p {
  margin-bottom: 0;
}

.awsArticleDetailsContent .aws-products-wrapper,
.awsArticleDetailsContent .js-content-product-slider {
  margin-bottom: 40px;
}

.awsArticleDetailsContent .aws-products-wrapper .products-slider-wrapper,
.awsArticleDetailsContent .js-content-product-slider .products-slider-wrapper {
  visibility: hidden;
}

.awsArticleDetailsContent .aws-products-wrapper .products-slider-wrapper.slick-initialized,
.awsArticleDetailsContent .js-content-product-slider .products-slider-wrapper.slick-initialized {
  visibility: visible;
}

.awsArticleDetailsContent .aws-products-wrapper .products-slider-wrapper button.slick-prev,
.awsArticleDetailsContent .aws-products-wrapper .products-slider-wrapper button.slick-next,
.awsArticleDetailsContent .js-content-product-slider .products-slider-wrapper button.slick-prev,
.awsArticleDetailsContent .js-content-product-slider .products-slider-wrapper button.slick-next {
  opacity: 1;
}

.awsArticleDetailsContent .aws-products-wrapper .products-slider-wrapper button.slick-prev,
.awsArticleDetailsContent .js-content-product-slider .products-slider-wrapper button.slick-prev {
  left: -5px;
}

.awsArticleDetailsContent .aws-products-wrapper .products-slider-wrapper button.slick-next,
.awsArticleDetailsContent .js-content-product-slider .products-slider-wrapper button.slick-next {
  right: -5px;
}

.awsArticleDetailsContent .aws-products-wrapper .products-slider-wrapper .slick-track,
.awsArticleDetailsContent .js-content-product-slider .products-slider-wrapper .slick-track {
  display: flex;
}

.awsArticleDetailsContent .aws-products-wrapper .products-slider-wrapper .slick-slide,
.awsArticleDetailsContent .js-content-product-slider .products-slider-wrapper .slick-slide {
  padding: 10px 10px 30px 10px;
  flex-wrap: nowrap;
  display: flex;
  height: auto;
  align-items: center;
  justify-content: center;
  transition: all .2s ease, margin-bottom 0ms ease;
}

@media (min-width: 768px) {
  .awsArticleDetailsContent .aws-products-wrapper .products-slider-wrapper .slick-slide:hover img,
  .awsArticleDetailsContent .js-content-product-slider .products-slider-wrapper .slick-slide:hover img {
    transform: scale(1.05);
  }
  .awsArticleDetailsContent .aws-products-wrapper .products-slider-wrapper .slick-slide:hover .product-item,
  .awsArticleDetailsContent .js-content-product-slider .products-slider-wrapper .slick-slide:hover .product-item {
    box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.3);
    transition: all .1s ease .1s;
  }
}

.awsArticleDetailsContent .aws-products-wrapper .product-item-wrapper,
.awsArticleDetailsContent .js-content-product-slider .product-item-wrapper {
  padding: 0 10px;
  margin-top: 3px;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item-wrapper .product-link,
.awsArticleDetailsContent .js-content-product-slider .product-item-wrapper .product-link {
  width: 100%;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item-wrapper .product-link .productPriceLive,
.awsArticleDetailsContent .js-content-product-slider .product-item-wrapper .product-link .productPriceLive {
  height: 50px;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item,
.awsArticleDetailsContent .js-content-product-slider .product-item {
  background-color: #fff;
  height: 100%;
  position: relative;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .image-container,
.awsArticleDetailsContent .js-content-product-slider .product-item .image-container {
  padding: 20px 20px 0;
  position: relative;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .middle-wrapper,
.awsArticleDetailsContent .js-content-product-slider .product-item .middle-wrapper {
  padding: 0 20px 20px;
  margin-bottom: 0;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .bottom-wrapper,
.awsArticleDetailsContent .js-content-product-slider .product-item .bottom-wrapper {
  border-top: 1px solid #f0f0f0;
  padding: 10px 20px 15px;
  position: absolute;
  bottom: 0;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .product-name,
.awsArticleDetailsContent .js-content-product-slider .product-item .product-name {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  hyphens: auto;
  height: 80px;
  line-height: 22px;
  margin-bottom: 0;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .productVariants,
.awsArticleDetailsContent .js-content-product-slider .product-item .productVariants {
  padding-top: 10px;
  border-top: 1px solid #f6f7f9;
  line-height: 20px;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .stock-info,
.awsArticleDetailsContent .js-content-product-slider .product-item .stock-info {
  line-height: 20px;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .stock-info .positive,
.awsArticleDetailsContent .js-content-product-slider .product-item .stock-info .positive {
  color: #127f3e;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .stock-info .negative,
.awsArticleDetailsContent .js-content-product-slider .product-item .stock-info .negative {
  color: #f9b409;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .consumer-price-caption,
.awsArticleDetailsContent .js-content-product-slider .product-item .consumer-price-caption {
  display: none;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .priceContainer,
.awsArticleDetailsContent .js-content-product-slider .product-item .priceContainer {
  display: flex;
  flex-direction: column;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .price,
.awsArticleDetailsContent .js-content-product-slider .product-item .price {
  float: left;
  font-size: 20px;
  line-height: 26px;
  font-weight: 700;
  margin-top: auto;
  margin-bottom: auto;
}

.awsArticleDetailsContent .aws-products-wrapper .product-item .button-more,
.awsArticleDetailsContent .js-content-product-slider .product-item .button-more {
  margin-top: 5px;
}

@media (min-width: 970px) {
  .article-content *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(.banner .image-wrapper span) {
    font-size: 16px;
    line-height: 28px;
  }
  .awsArticleList.styleGrid .contentListItem {
    width: 33.33333%;
    height: auto;
  }
  .awsArticleList.styleGrid .contentListItem:nth-child(3n+1) {
    padding-right: 10px;
  }
  .awsArticleList.styleGrid .contentListItem:nth-child(3n+2) {
    padding-right: 10px;
    padding-left: 10px;
  }
  .awsArticleList.styleGrid .contentListItem:nth-child(3n+3) {
    padding-left: 10px;
  }
  .awsArticleList.styleGrid .contentListItem .listView {
    min-height: 500px;
    height: 100%;
  }
  .awsArticleList.styleGrid .contentListItem .section-one {
    width: 100%;
    padding: 0;
  }
  .awsArticleList.styleGrid .contentListItem .section-two {
    width: 100%;
    padding: 20px;
  }
  .awsArticleList.styleGrid .contentListItem .image-box {
    min-height: 240px;
  }
  .awsArticleList.styleGrid .contentListItem .img-article-list {
    height: 100%;
    width: auto;
  }
}

@media (max-width: 969px) {
  .breadcrumb-image-wrapper .sponsoredLabel {
    margin-top: 10px;
  }
  .awsArticleDetailsContent .author-box .author-img-wrapper {
    margin-bottom: 20px;
  }
  .awsArticleDetailsContent .author-box .image-box {
    margin-left: auto;
    margin-right: auto;
  }
  .awsArticleList.styleGrid .contentListItem {
    width: 100%;
  }
}

.page-articleListPage .breadcrumb-row {
  visibility: hidden;
}

.page-articleListPage #dynamicHeroBanner {
  margin-bottom: 30px;
}

.page-articleListPage #dynamicHeroBanner h3 {
  margin-bottom: -10px;
}

.page-articleListPage #dynamicHeroBanner img {
  display: block;
  max-width: 100%;
  max-height: 100%;
}

.breadcrumb-image-wrapper {
  position: relative;
}

.breadcrumb-image-wrapper .yCmsContentSlot.section1 img {
  filter: brightness(70%);
}

.breadcrumb-image-wrapper .yCmsContentSlot.section1.filled + .breadcrumb-row {
  position: absolute;
  bottom: 5px;
  left: 50%;
  transform: translateX(-50%);
  background-color: transparent;
}

.breadcrumb-image-wrapper .yCmsContentSlot.section1.filled + .breadcrumb-row .breadcrumb {
  background-color: transparent;
}

.breadcrumb-image-wrapper .yCmsContentSlot.section1.filled + .breadcrumb-row .breadcrumb li:before,
.breadcrumb-image-wrapper .yCmsContentSlot.section1.filled + .breadcrumb-row .breadcrumb li a {
  color: #fff;
}

.topic-image-wrapper {
  position: relative;
  overflow: hidden;
  height: 350px;
}

.topic-image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
  filter: brightness(0.8);
}

.topic-image-wrapper .text-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  text-align: center;
  background: rgba(0, 0, 0, 0.6);
  padding: 16px;
}

.topic-image-wrapper .topic-headline {
  display: block;
}

.awsArticleListContent .paginationBar {
  height: unset;
}

.awsArticleListContent .paginationBar .js-sticky-wrapper.unsticked,
.awsArticleListContent .paginationBar .js-sticky-wrapper.sticked {
  position: relative;
  margin-left: 0;
  width: unset;
  top: 0 !important;
  z-index: auto;
}

.awsArticleListContent .paginationBar .pagination-wrapper {
  height: unset;
}

.awsArticleListContent .paginationBar .pagination-wrapper > .col-sm-3 {
  width: 33.3333%;
}

.awsArticleListContent .paginationBar .pagination-wrapper label {
  margin-top: 0;
}

.awsArticleListContent .heading-pagination .pagination-wrapper {
  display: none;
}

.awsArticleListContent .pagination-bottom-container .sort-order,
.awsArticleListContent .pagination-bottom-container .pagesize {
  visibility: hidden;
}

.awsArticleListContent .centered-image {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
}

.awsArticleListContent #facet-filter-side.facet-filter-wrapper {
  background-color: transparent;
  padding-top: 0;
}

.awsArticleListContent #facet-filter-side.facet-filter-wrapper .facet {
  border-top: 1px solid #dfdfdf;
  border-bottom: 1px solid #dfdfdf;
  margin: 0;
}

.awsArticleListContent #facet-filter-side.facet-filter-wrapper .facet a.refinementToggle {
  width: -webkit-fill-available;
  color: inherit;
  border-right: none;
  border-left: none;
  border-top: 1px solid #f0f0f0;
  border-bottom: 1px solid #f0f0f0;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
}

.awsArticleListContent #facet-filter-side.facet-filter-wrapper .facetHead {
  padding: 5px 5px 5px 0;
}

.awsArticleListContent #facet-filter-side.facet-filter-wrapper .facetHead:not(.active) {
  margin: 0 !important;
}

.awsArticleListContent #facet-filter-side.facet-filter-wrapper .facetHead svg {
  rotate: 90deg;
}

.awsArticleListContent #facet-filter-side.facet-filter-wrapper .facetHead.active svg {
  rotate: 270deg;
}

.awsArticleListContent #facet-filter-side.facet-filter-wrapper .facetHead a {
  font-weight: bold;
  font-size: 16px;
}

.awsArticleListContent .topic-wrapper {
  margin-bottom: 50px;
}

.awsArticleListContent .topic-slider-wrapper {
  visibility: hidden;
  height: 260px;
}

.awsArticleListContent .topic-slider-wrapper.slick-initialized {
  visibility: visible;
}

.awsArticleListContent .topic-slider-wrapper button.slick-prev,
.awsArticleListContent .topic-slider-wrapper button.slick-next {
  opacity: 1;
}

.awsArticleListContent .topic-slider-wrapper button.slick-prev {
  left: -5px;
}

.awsArticleListContent .topic-slider-wrapper button.slick-next {
  right: 5px;
}

.awsArticleListContent .topic-slider-wrapper .topic-item {
  width: 220px;
  height: 260px;
  margin: 10px 20px 15px 0;
  box-shadow: 1px 3px 10px -3px #000;
}

.awsArticleListContent .topic-slider-wrapper .image-container {
  position: relative;
  overflow: hidden;
  background-color: #3e4954;
  width: 220px;
  height: 260px;
}

.awsArticleListContent .topic-slider-wrapper .image-topic-slider {
  height: 100%;
  width: 100%;
  object-fit: cover;
  filter: brightness(0.8);
}

.awsArticleListContent .topic-slider-wrapper .topic-name {
  position: absolute;
  bottom: 20px;
  left: 10px;
  color: #fff;
  font-size: 24px;
  line-height: 30px;
}

.awsArticleListContent .topic-slider-wrapper .slick-list:after,
.awsArticleListContent .topic-slider-wrapper .slick-list:before {
  pointer-events: none;
  content: '';
  position: absolute;
  height: 100%;
  width: 8%;
  z-index: 10;
}

.awsArticleListContent .topic-slider-wrapper .slick-list:after {
  top: 0;
  right: 0;
  background-image: linear-gradient(to right, rgba(244, 245, 246, 0), #f0f0f0);
}

.awsArticleListContent .topic-slider-wrapper .slick-list:before {
  left: 0;
  background-image: linear-gradient(to left, rgba(244, 245, 246, 0), #f0f0f0);
}

.awsArticleList.styleList .contentListItem, .connected-article-component.styleList .contentListItem {
  width: 100%;
}

.awsArticleList .contentListItem .listView, .connected-article-component .contentListItem .listView {
  overflow: hidden;
}

.awsArticleList .contentListItem .sponsoredLabel, .connected-article-component .contentListItem .sponsoredLabel {
  background-color: #fff;
  position: absolute;
  display: inline-block;
  top: 20px;
  left: 20px;
  line-height: 37px;
  padding-left: 10px;
  padding-right: 10px;
}

.awsArticleList .contentListItem .image-box, .connected-article-component .contentListItem .image-box {
  position: relative;
  overflow: hidden;
}

.awsArticleList .contentListItem .img-article-list, .connected-article-component .contentListItem .img-article-list {
  height: 100%;
  object-fit: cover;
}

.awsArticleList .contentListItem .light-text-color, .connected-article-component .contentListItem .light-text-color {
  color: #595858;
}

.awsArticleList .contentListItem .separator, .connected-article-component .contentListItem .separator {
  padding-left: 10px;
  padding-right: 10px;
}

.awsArticleList .contentListItem .action-wrapper, .connected-article-component .contentListItem .action-wrapper {
  margin-left: -10px;
}

.awsArticleList .contentListItem .action-wrapper .btn, .connected-article-component .contentListItem .action-wrapper .btn {
  min-width: unset;
  padding-left: 10px;
  padding-right: 10px;
}

.awsArticleList .contentListItem .action-wrapper .btn:after, .connected-article-component .contentListItem .action-wrapper .btn:after {
  margin-left: 10px;
}

.awsArticleList .listView:not(.premium), .connected-article-component .listView:not(.premium) {
  background-color: transparent;
}

.awsArticleList .listView:not(.premium) .action-wrapper .btn, .connected-article-component .listView:not(.premium) .action-wrapper .btn {
  border-color: transparent;
  background-color: transparent;
}

.awsArticleList .listView:not(.premium) .action-wrapper .btn:hover, .awsArticleList .listView:not(.premium) .action-wrapper .btn:focus, .awsArticleList .listView:not(.premium) .action-wrapper .btn.focus, .awsArticleList .listView:not(.premium) .action-wrapper .btn:active, .connected-article-component .listView:not(.premium) .action-wrapper .btn:hover, .connected-article-component .listView:not(.premium) .action-wrapper .btn:focus, .connected-article-component .listView:not(.premium) .action-wrapper .btn.focus, .connected-article-component .listView:not(.premium) .action-wrapper .btn:active {
  border-color: transparent;
  background-color: transparent;
}

.awsArticleList .listView.premium, .connected-article-component .listView.premium {
  background-color: #fff;
  box-shadow: 1px 0px 10px -3px #5E5F61;
}

.contentListItem .titleBreak {
  height: 100px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.contentListItem .previewBreak {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: 7em;
  max-height: 7em;
  position: relative;
  line-height: 1.75em;
}

.contentListItem .previewBreak::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2em;
  pointer-events: none;
}

.contentListItem .section-one {
  height: 265px;
}

@media (max-width: 768px) {
  .contentListItem .section-one {
    height: 300px;
  }
  .contentListItem .previewBreak {
    height: 7em;
    max-height: 7em;
    line-height: 1.75em;
  }
}

@media (min-width: 970px) {
  .awsArticleListContent {
    margin-left: 0;
  }
  .awsArticleListContent .heading-pagination {
    padding-left: 0;
  }
  .awsArticleListContent .pagination-wrapper .select-wrapper,
  .awsArticleListContent .pagination-wrapper .dropdown-fake {
    background-color: transparent;
  }
  .awsArticleListContent .pagination-wrapper .select-wrapper:hover, .awsArticleListContent .pagination-wrapper .select-wrapper:focus, .awsArticleListContent .pagination-wrapper .select-wrapper.focus, .awsArticleListContent .pagination-wrapper .select-wrapper:active,
  .awsArticleListContent .pagination-wrapper .dropdown-fake:hover,
  .awsArticleListContent .pagination-wrapper .dropdown-fake:focus,
  .awsArticleListContent .pagination-wrapper .dropdown-fake.focus,
  .awsArticleListContent .pagination-wrapper .dropdown-fake:active {
    background-color: transparent;
  }
  .awsArticleListContent .facet-nav-col {
    padding-left: 30px;
  }
  .awsArticleListContent .topic-slider-wrapper {
    padding-left: 0;
  }
  .awsArticleList.styleList .contentListItem .listView {
    min-height: 265px;
  }
  .awsArticleList.styleList .contentListItem .section-one {
    padding-left: 0;
    padding-right: 20px;
  }
  .awsArticleList.styleList .contentListItem .section-two {
    padding: 20px 20px 5px 0;
  }
  .awsArticleList.styleList .contentListItem .image-box {
    min-height: 265px;
  }
}

@media (max-width: 969px) {
  .awsArticleListContent .heading-pagination {
    padding-right: 20px;
    margin-bottom: 20px;
  }
  .awsArticleListContent .mobile-pagination {
    display: block;
    position: relative;
    width: 100% !important;
    height: auto;
    background-color: inherit;
    margin-left: 0;
    padding: 0 10px;
  }
  .awsArticleListContent .facet-filter-wrapper {
    display: block;
  }
  .awsArticleListContent .pagination-bottom-container {
    margin: 0;
  }
  .awsArticleListContent .topic-heading {
    padding-left: 10px;
  }
  .awsArticleList {
    margin-left: 0;
    margin-right: 0;
  }
  .awsArticleList .contentListItem .listView {
    min-height: 258px;
  }
  .awsArticleList .contentListItem .section-one {
    padding: 0;
  }
  .awsArticleList .contentListItem .section-two {
    padding: 5px 20px 10px;
  }
  .awsArticleList .contentListItem .image-box {
    height: 240px;
  }
  .awsArticleList .contentListItem .date-wrapper {
    margin-bottom: 10px;
  }
}

@media (max-width: 767px) {
  .awsArticleListContent .paginationBar .pagination-wrapper > .current-page {
    width: 100%;
  }
}

.mobile-aws-filter .facetHead {
  margin-bottom: 10px;
}

.mobile-aws-filter .facetHead a {
  font-weight: bold;
  font-size: 16px;
}

.mobile-aws-filter .facetValues {
  overflow: hidden;
  transition: max-height 0.5s ease-in-out;
  transition: opacity 0.5s linear;
  max-height: 10000px;
  opacity: 1;
  font-size: 14px;
}

.mobile-aws-filter .facetValues.slide-up {
  max-height: 0;
  opacity: 0;
}

.mobile-aws-filter .pseudo-checkbox {
  display: block;
  top: 15px;
}

.mobile-aws-filter .pseudo-checkbox .checkbox {
  float: right;
}

@media (max-width: 969px) {
  .awsArticleList .contentListItem, .connected-article-component .contentListItem {
    margin-bottom: 15px;
    padding-bottom: 15px;
    position: relative;
  }
  .awsArticleList .contentListItem::after, .connected-article-component .contentListItem::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 15px;
    right: 15px;
    height: 1px;
    background-color: #dfdfdf;
  }
  .awsArticleList .contentListItem .listView, .connected-article-component .contentListItem .listView {
    min-height: auto;
  }
  .awsArticleList .contentListItem .section-one, .connected-article-component .contentListItem .section-one {
    height: auto;
    margin-bottom: 15px;
  }
  .awsArticleList .contentListItem .section-two, .connected-article-component .contentListItem .section-two {
    padding: 0 15px 15px;
  }
  .awsArticleList .contentListItem .image-box, .connected-article-component .contentListItem .image-box {
    max-height: 240px;
    overflow: hidden;
  }
  .awsArticleList .contentListItem .img-article-list, .connected-article-component .contentListItem .img-article-list {
    height: auto;
    object-fit: cover;
  }
  .awsArticleList .contentListItem .date-wrapper,
  .awsArticleList .contentListItem .author-wrapper, .connected-article-component .contentListItem .date-wrapper,
  .connected-article-component .contentListItem .author-wrapper {
    margin-bottom: 10px;
  }
  .awsArticleList .contentListItem .title, .connected-article-component .contentListItem .title {
    font-size: 18px;
    line-height: 1.3;
    margin-bottom: 10px;
  }
  .awsArticleList .contentListItem .description, .connected-article-component .contentListItem .description {
    font-size: 14px;
    line-height: 1.5;
  }
  .awsArticleList .contentListItem .action-wrapper, .connected-article-component .contentListItem .action-wrapper {
    margin-top: 15px;
  }
}

@media (max-width: 969px) {
  .awsArticleListContent .heading-pagination .heading {
    margin-top: -30px;
  }
}

@media (min-width: 768px) {
  .awsArticleListContent #facet-filter-top {
    display: none;
  }
}

@media (min-width: 970px) {
  .page-articleListPage .filter-facet-mobile-action {
    display: none;
  }
}

@media (max-width: 969px) {
  .page-articleListPage .filter-facet-mobile-action {
    position: fixed;
    bottom: 0;
    margin-left: -10px;
    margin-bottom: 0;
    width: 100%;
    padding: 10px;
    height: 50px;
    background: white;
    border-top: 1px solid #f4f5f6;
    display: flex;
    z-index: 1000;
  }
  .page-articleListPage .filter-facet-mobile-action #filter-facet-popup-handle {
    line-height: 30px;
    max-width: 60%;
    height: 30px;
    margin: 0 auto;
    font-size: 16px;
  }
}

.productListItem .listView,
.productListItem .gridView {
  background-color: white;
}

.hooks {
  position: absolute;
  margin: 25px 0 0 0;
  padding: 0;
  z-index: 2;
  font-size: 14px;
}

.hooks li {
  color: white;
  list-style: none;
  margin-top: 8px;
  overflow: hidden;
  line-height: 20px;
  overflow: hidden;
  padding: 5px 10px;
  background-color: #de0019;
  text-align: center;
}

.hooks li.hook-variant-grau {
  background-color: #a3a3a3;
  color: white;
}

.hooks li.hook-variant-rot {
  background-color: #de0019;
  color: white;
}

.hooks li.hook-variant-gruen {
  background-color: #2f9e49;
  color: white;
}

.hooks li.hook-variant-orange {
  background-color: #f9b409;
  color: #282828;
}

.hooks li.hook-variant-blau {
  background-color: #005caf;
  color: white;
}

.hooks li.hook-variant-lila {
  background-color: #6a1b9a;
  color: white;
}

.hooks li.hook-variant-dunkelgrau {
  background-color: #282828;
  color: white;
}

.hooks li.hook-variant-hellgrau {
  background-color: #f4f5f6;
  color: #282828;
}

.stock-message.positive {
  color: #127f3e;
}

.stock-message.negative {
  color: #f9b409;
}

.pagination {
  padding: 0;
  text-align: center;
}

.pagination li {
  display: inline-block;
  list-style: none;
  padding: 0 5px;
}

.pagination li.margin-left {
  margin-left: 47px;
}

.pagination li.margin-right {
  margin-right: 47px;
}

.pagination li a i {
  font-size: 14px;
}

.pagination li a:hover {
  text-decoration: none;
}

.pagination li a:before {
  content: none;
}

.pagination li input {
  width: 40px;
  text-align: center;
  padding-right: 5px;
  padding-left: 5px;
}

html[data-useragent*='MSIE 10.0'] .dropdown-fake {
  display: none;
}

.slider-range-wrapper {
  overflow-x: hidden;
}

.ui-slider.ui-slider-horizontal {
  border-bottom: 5px solid #D2D2D3;
  margin: 20px 10px 30px;
  position: relative;
}

.ui-slider.ui-slider-horizontal::before {
  content: '';
  position: absolute;
  left: -10px;
  height: 5px;
  width: 10px;
  background-color: #D2D2D3;
}

.ui-slider.ui-slider-horizontal::after {
  content: '';
  position: absolute;
  right: -10px;
  height: 5px;
  width: 10px;
  background-color: #D2D2D3;
}

.ui-slider.ui-slider-horizontal .ui-slider-handle {
  display: inline-block;
  cursor: default;
  position: absolute;
  z-index: 2;
  bottom: 8px;
  outline: 0;
}

.ui-slider.ui-slider-horizontal .btn-from {
  left: -10px;
}

.ui-slider.ui-slider-horizontal .btn-from::before {
  content: '';
  position: absolute;
  right: 20px;
  top: 7px;
  height: 5px;
  width: 770px;
  background-color: #F4F5F6;
}

.ui-slider.ui-slider-horizontal .btn-till {
  right: -10px;
}

.ui-slider.ui-slider-horizontal .btn-till::after {
  content: '';
  position: absolute;
  left: 20px;
  top: 7px;
  height: 5px;
  width: 770px;
  background-color: #F4F5F6;
}

.ui-slider.ui-slider-horizontal .btn-slider-wrapper {
  position: relative;
}

.ui-slider.ui-slider-horizontal .btn-slider {
  position: absolute;
  display: inline-block;
  height: 20px;
  width: 20px;
  background-color: #000;
  border: 1px solid #000;
  border-radius: 50%;
}

.mark-on-hover-radio:hover i.icon-check {
  display: block;
}

.mark-on-hover-radio:hover i.radio-inner {
  display: block;
}

@media (max-width: 767px) {
  .hooks li {
    padding: 10px;
  }
}

@media (min-width: 1200px) {
  .hooks li {
    padding: 10px;
  }
}

.select-wrapper .select2-container {
  line-height: 38px;
  width: 100%;
  min-width: 75px;
  padding-right: 0;
  padding-left: 10px;
  display: block;
  background-color: inherit;
  border: 1px solid #595858;
  color: #3e4954;
  height: 40px;
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  font-size: 14px;
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.select-wrapper .select2-container:focus, .select-wrapper .select2-container:active, .select-wrapper .select2-container:hover {
  border-color: #3e4954;
  background-color: transparent;
  color: #3e4954;
}

.select-wrapper .select2-container .select2-selection__rendered {
  display: block;
}

.select-wrapper .select2-container span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}

.select-wrapper .select2-container * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.select2-results__options {
  list-style: none;
  padding: 0;
}

.select2-results__options li {
  position: relative;
  padding-left: 10px;
  width: 100%;
}

.select2-results__options li:hover {
  background-color: #3875d7;
  background-image: -webkit-gradient(linear, 50% 0, 50% 100%, color-stop(20%, #3875d7), color-stop(90%, #2a62bc));
  background-image: -webkit-linear-gradient(#3875d7 20%, #2a62bc 90%);
  background-image: -moz-linear-gradient(#3875d7 20%, #2a62bc 90%);
  background-image: -o-linear-gradient(#3875d7 20%, #2a62bc 90%);
  background-image: linear-gradient(#3875d7 20%, #2a62bc 90%);
  color: #fff;
}

.select2-dropdown {
  position: absolute;
  top: 100%;
  z-index: 1010;
  width: 100%;
  border: 1px solid #595858;
  border-top: 0;
  background: #fff;
  color: #3e4954;
  padding-right: 0;
  padding-left: 0;
  font-size: 14px;
  cursor: pointer;
  max-height: 25vh;
  overflow-y: scroll;
  overflow-x: hidden;
}

.select2-dropdown .select2-search {
  margin: 0 10px;
}

.select2-dropdown .select2-search input {
  width: 95%;
  height: 35px;
  margin: 3px 0;
  padding: 5px 10px;
}

.select-wrapper,
.multiple-select-wrapper {
  position: relative;
  background-color: transparent;
}

.select-wrapper select,
.select-wrapper .multiselect.dropdown-toggle,
.select-wrapper.facet .dropdown__facet-head,
.multiple-select-wrapper select,
.multiple-select-wrapper .multiselect.dropdown-toggle,
.multiple-select-wrapper.facet .dropdown__facet-head {
  border: 1px solid #595858;
  color: #3e4954;
  background-color: transparent;
  display: block;
  width: 100%;
  height: 40px;
  min-width: 75px;
  padding-right: 0px;
  padding-left: 10px;
  font-size: 14px;
  cursor: pointer;
  -webkit-border-radius: 0;
  -o-appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.select-wrapper select.disabled,
.select-wrapper select option[disabled],
.select-wrapper .multiselect.dropdown-toggle.disabled,
.select-wrapper .multiselect.dropdown-toggle option[disabled],
.select-wrapper.facet .dropdown__facet-head.disabled,
.select-wrapper.facet .dropdown__facet-head option[disabled],
.multiple-select-wrapper select.disabled,
.multiple-select-wrapper select option[disabled],
.multiple-select-wrapper .multiselect.dropdown-toggle.disabled,
.multiple-select-wrapper .multiselect.dropdown-toggle option[disabled],
.multiple-select-wrapper.facet .dropdown__facet-head.disabled,
.multiple-select-wrapper.facet .dropdown__facet-head option[disabled] {
  opacity: 0.5 !important;
  background-color: #f0f0f0 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  -moz-appearance: none !important;
  color: #595858;
}

.select-wrapper select option.not-available,
.select-wrapper .multiselect.dropdown-toggle option.not-available,
.select-wrapper.facet .dropdown__facet-head option.not-available,
.multiple-select-wrapper select option.not-available,
.multiple-select-wrapper .multiselect.dropdown-toggle option.not-available,
.multiple-select-wrapper.facet .dropdown__facet-head option.not-available {
  color: #595858;
}

.select-wrapper select:focus,
.select-wrapper .multiselect.dropdown-toggle:focus,
.select-wrapper.facet .dropdown__facet-head:focus,
.multiple-select-wrapper select:focus,
.multiple-select-wrapper .multiselect.dropdown-toggle:focus,
.multiple-select-wrapper.facet .dropdown__facet-head:focus {
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  outline: none;
  -moz-outline: none;
  -moz-user-focus: none;
  outline: 0;
}

.select-wrapper select:hover,
.select-wrapper .multiselect.dropdown-toggle:hover,
.select-wrapper.facet .dropdown__facet-head:hover,
.multiple-select-wrapper select:hover,
.multiple-select-wrapper .multiselect.dropdown-toggle:hover,
.multiple-select-wrapper.facet .dropdown__facet-head:hover {
  background-color: transparent;
  color: #3e4954;
}

.select-wrapper select,
.multiple-select-wrapper select {
  padding-right: 28px;
}

.select-wrapper:hover select, .select-wrapper.active select,
.multiple-select-wrapper:hover select,
.multiple-select-wrapper.active select {
  cursor: pointer;
  border-color: #3e4954;
  background-color: transparent;
  color: #3e4954;
}

.select-wrapper:hover .dropdown-fake, .select-wrapper.active .dropdown-fake,
.multiple-select-wrapper:hover .dropdown-fake,
.multiple-select-wrapper.active .dropdown-fake {
  background-color: transparent;
  color: #3e4954;
}

.select-wrapper:hover .dropdown-fake i, .select-wrapper.active .dropdown-fake i,
.multiple-select-wrapper:hover .dropdown-fake i,
.multiple-select-wrapper.active .dropdown-fake i {
  color: #3e4954;
}

.select-wrapper .dropdown-fake,
.multiple-select-wrapper .dropdown-fake {
  position: absolute;
  right: 2px;
  top: 2px;
  background-color: transparent;
  cursor: pointer;
  height: 36px;
  pointer-events: none;
  text-align: center;
  line-height: 36px;
  padding: 0 6px;
}

.select-wrapper .dropdown-fake i,
.multiple-select-wrapper .dropdown-fake i {
  color: inherit;
  font-weight: bold;
  font-size: 8px;
}

/* multiple select wrapper by bootstrap-multiselect.js */
.multiple-select-wrapper .btn-group {
  display: block;
}

.multiple-select-wrapper .dropdown-fake {
  z-index: 10;
  right: 0px;
}

.multiple-select-wrapper .multiselect.dropdown-toggle {
  width: 100%;
  background-color: transparent;
  box-shadow: none;
  overflow: hidden;
}

.multiple-select-wrapper .multiselect-selected-text {
  display: block;
  line-height: 40px;
  text-align: left;
  font-weight: 400;
  margin-right: 25px;
  overflow: hidden;
}

.multiple-select-wrapper .multiselect-container.dropdown-menu {
  top: 38px;
  width: 100%;
}

.multiple-select-wrapper .multiselect-container.dropdown-menu li {
  margin: 0;
}

.multiple-select-wrapper .multiselect-container.dropdown-menu li.checkbox.active i.icon-check {
  display: block;
  color: #fff;
}

.multiple-select-wrapper .multiselect-container.dropdown-menu li > a {
  padding: 2px 15px;
}

.multiple-select-wrapper .multiselect-container.dropdown-menu .pseudo-checkbox {
  text-align: left;
  margin: 0;
}

.multiple-select-wrapper .multiselect-container.dropdown-menu label.checkbox {
  width: unset;
  height: unset;
  border: 0;
  margin: 0;
}

input,
textarea {
  outline: none;
  color: #3e4954;
  border: 1px solid #595858;
  background-color: transparent;
  font-size: 14px;
  line-height: 38px;
}

input:active, input:hover, input:focus,
textarea:active,
textarea:hover,
textarea:focus {
  border-color: #3e4954;
  background-color: transparent;
  color: #3e4954;
}

input[disabled],
textarea[disabled] {
  opacity: 0.5 !important;
  background-color: #f0f0f0 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  -moz-appearance: none !important;
}

input[readonly],
textarea[readonly] {
  cursor: not-allowed !important;
  pointer-events: none !important;
  -moz-appearance: none !important;
}

input {
  height: 40px;
}

input[type=text], input[type=password], input[type=email], input[type=tel], input[type=number], input[type=file] {
  width: 100%;
  padding-right: 10px;
  padding-left: 10px;
}

input[type=file] {
  height: 100%;
  line-height: 100%;
  padding: 8px;
}

input.inputError {
  border: 1px solid red;
}

input::placeholder {
  color: #595858;
}

input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #595858;
}

input::-moz-placeholder {
  /* Firefox 19+ */
  color: #595858;
}

input:-ms-input-placeholder {
  /* IE 10+ */
  color: #595858;
}

input:-moz-placeholder {
  /* Firefox 18- */
  color: #595858;
}

.input-wrapper {
  position: relative;
}

.input-wrapper .datepicker-calendar {
  position: absolute;
  right: 1px;
  top: 1px;
  background-color: transparent;
  cursor: pointer;
  height: 38px;
  pointer-events: none;
  text-align: center;
  line-height: 38px;
  padding: 0 5px;
}

.input-wrapper .datepicker-calendar i {
  font-size: 20px;
}

.numericError {
  background: #fff none repeat scroll 0 0;
  border: 1px solid red;
  font-size: 12px;
  margin-top: 5px;
  padding: 0 5px;
  position: absolute;
  text-align: left;
  width: 200px;
  z-index: 10;
}

.numericError:before {
  border-bottom: 5px solid red;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  height: 0;
  width: 0;
  position: absolute;
  left: 0;
  top: -5px;
  content: " ";
}

.pseudo-checkbox {
  position: relative;
  line-height: 20px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  margin-bottom: 20px;
}

.pseudo-checkbox input[type="checkbox"],
.pseudo-checkbox input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.pseudo-checkbox .checkbox {
  margin: 0 10px 0 0;
  padding: 0;
  display: inline-block;
  width: 18px;
  height: 18px;
  border: 1px solid #595858;
  vertical-align: middle;
}

.pseudo-checkbox .checkbox i.icon-check {
  display: none;
  position: absolute;
  color: #3e4954;
  font-size: 16px;
  left: 0px;
  top: 0px;
}

.pseudo-checkbox .radio-button {
  margin: 0 10px 0 0;
  padding: 0;
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 1px solid #595858;
  border-radius: 10px;
}

.pseudo-checkbox .radio-button i.radio-inner {
  display: none;
  position: absolute;
  width: 14px;
  height: 14px;
  background-color: #3e4954;
  border-radius: 10px;
  left: 3px;
  top: 3px;
}

.pseudo-checkbox .radio-button i.icon-check {
  display: inline-block;
  visibility: hidden;
  vertical-align: baseline;
}

.pseudo-checkbox input[disabled] ~ span,
.pseudo-checkbox input[disabled] ~ span i.radio-inner,
.pseudo-checkbox input[disabled] ~ span i.icon-check {
  color: #ccc;
}

.pseudo-checkbox:hover {
  cursor: pointer;
}

.pseudo-checkbox .real-label {
  vertical-align: top;
}

.pseudo-checkbox input[type="checkbox"]:checked ~ span.checkbox i.icon-check {
  display: block;
}

.pseudo-checkbox input[type="radio"]:checked ~ span.radio-button i.radio-inner {
  display: block;
}

.pseudo-checkbox input[type="radio"]:checked ~ span.radio-button i.icon-check {
  visibility: visible;
}

label.pseudo-checkbox-block {
  width: 100%;
  border: 1px solid #595858;
  padding: 7px 10px 10px 10px;
  cursor: pointer;
  background-color: transparent;
}

label.pseudo-checkbox-block:hover {
  border: 1px solid #3e4954;
}

label.pseudo-checkbox-block:hover .radio-button,
label.pseudo-checkbox-block:hover .checkbox-button {
  border: 1px solid #3e4954;
}

label.pseudo-checkbox-block input[type="radio"],
label.pseudo-checkbox-block input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

label.pseudo-checkbox-block .radio-button,
label.pseudo-checkbox-block .checkbox-button {
  width: 18px;
  height: 18px;
  border: 1px solid #ccc;
  border-radius: 50%;
  display: inline-block;
  margin: 2px 20px 0 0;
  vertical-align: middle;
  position: relative;
  float: left;
}

label.pseudo-checkbox-block i.radio-inner {
  display: none;
  position: absolute;
  width: 10px;
  height: 10px;
  background-color: #3e4954;
  border-radius: 50%;
  left: 3px;
  top: 3px;
}

label.pseudo-checkbox-block i.icon-check {
  display: none;
  position: absolute;
  color: #3e4954;
  font-size: 16px;
  left: 1px;
  top: -2px;
}

label.pseudo-checkbox-block .real-label {
  vertical-align: top;
  display: flex;
}

label.pseudo-checkbox-block input[type="radio"]:checked ~ span.radio-button i.radio-inner {
  display: block;
}

label.pseudo-checkbox-block input[type="checkbox"]:checked ~ span.checkbox-button i.icon-check {
  display: block;
}

/* Input Range */
.inputRangeWrapper input[type=range] {
  -webkit-appearance: none;
  /* Hides the slider so that custom slider can be made */
  width: 100%;
  /* Specific width is required for Firefox. */
  background: transparent;
  /* Otherwise white in Chrome */
  border: 0;
  /* Custom Style for Thumb - Special styling for WebKit/Blink */
  /* Custom Style for Thumb - All the same stuff for Firefox */
  /* Custom Style for Thumb - All the same stuff for IE */
  /* Custom Style for Track - Special styling for WebKit */
  /* Custom Style for Track - All the same stuff for Firefox */
  /* Custom Style for Track - All the same stuff for IE */
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .inputRangeWrapper input[type=range] {
    height: 90px;
  }
}

.inputRangeWrapper input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
}

.inputRangeWrapper input[type=range]:focus {
  outline: none;
  /* Removes the blue border. */
}

.inputRangeWrapper input[type=range]::-ms-track {
  width: 100%;
  cursor: pointer;
  /* Hides the slider so custom styles can be added */
  background: transparent;
  border-color: transparent;
  color: transparent;
}

.inputRangeWrapper input[type=range]::-webkit-slider-thumb {
  border: 1px solid #3e4954;
  border-radius: 0;
  background-color: #fff;
  cursor: default;
  height: 38px;
  width: 14px;
  -webkit-appearance: none;
  margin-top: -18px;
  /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
}

.inputRangeWrapper input[type=range]:hover::-webkit-slider-thumb {
  background-color: #3e4954;
}

.inputRangeWrapper input[type=range]::-moz-range-thumb {
  border: 1px solid #3e4954;
  border-radius: 0;
  background-color: #fff;
  cursor: default;
  height: 38px;
  width: 14px;
}

.inputRangeWrapper input[type=range]:hover::-moz-range-thumb {
  background-color: #3e4954;
}

.inputRangeWrapper input[type=range]::-ms-thumb {
  border: 1px solid #3e4954;
  border-radius: 0;
  background-color: #fff;
  cursor: default;
  height: 38px;
  width: 14px;
  margin-top: 0;
}

.inputRangeWrapper input[type=range]:hover::-ms-thumb {
  background-color: #3e4954;
}

.inputRangeWrapper input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 1px;
  cursor: default;
  background: #3e4954;
  border: 0;
}

.inputRangeWrapper input[type=range]::-moz-range-track {
  width: 100%;
  height: 1px;
  cursor: default;
  background: #3e4954;
  border: 0;
}

.inputRangeWrapper input[type=range]::-ms-track {
  width: 100%;
  height: 1px;
  cursor: default;
  background: #3e4954;
  border: 0;
}

/* CSS specific to iOS devices */
@supports (-webkit-touch-callout: none) {
  input,
  textarea {
    /* set the font size in inputs to 16px to prevent ios from automatically zoom in */
    font-size: 16px;
  }
}

input[type="checkbox"]:focus ~ .checkbox,
input[type="radio"]:focus ~ .radio-button,
select.time-select:focus {
  outline: 2px solid #3e4954;
  border-color: #3e4954;
  background: #f0f0f0;
}

.productActionContainer .quantityContainer .btn {
  /* DO NOT REMOVE */
  position: relative;
  display: inline-block;
  z-index: 10;
  /* DO NOT REMOVE */
  border-color: #595858;
  height: 40px;
  width: 40px;
  min-width: 40px;
  font-size: 14px;
  line-height: 1.5;
  color: #3e4954;
  padding: 0;
}

.productActionContainer .quantityContainer .btn.js-increase-quantity {
  float: right;
}

.productActionContainer .quantityContainer .btn.js-decrease-quantity {
  float: left;
}

.productActionContainer .quantityContainer .quantityInputContainer {
  width: auto;
  position: relative;
  display: block;
  height: 40px;
}

.productActionContainer .quantityContainer .quantityInputContainer .qtyInput {
  display: block;
  position: absolute;
  text-align: center;
}

.productActionContainer .unitSingle {
  padding: auto 0;
  height: 40px;
  line-height: 40px;
  border: 1px solid #595858;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 10px;
}

.productActionContainer .quantityContainer .btn,
.productActionContainer .quantityContainer input,
.productActionContainer .select-wrapper,
.productActionContainer .select-wrapper .dropdown-fake,
.productActionContainer .unitSingle {
  background-color: transparent;
}

/* detailed button color association */
a.btn:before {
  content: none;
}

button,
.btn {
  padding-top: 0;
  padding-bottom: 0;
  margin: 0;
  padding: 0 20px 0 20px;
  height: 40px;
  line-height: 38px;
  max-width: 100%;
  text-decoration: none;
  font-size: 14px;
  color: #3e4954;
  background-color: transparent;
  border-color: #3e4954;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: all .2s ease-in-out;
}

button i,
.btn i {
  color: #3e4954;
  line-height: 38px;
}

button i.center,
.btn i.center {
  float: none;
  padding: 0;
}

button:hover, button:focus, button.focus, button:active,
.btn:hover,
.btn:focus,
.btn.focus,
.btn:active {
  box-shadow: 0 0 10px -4px black;
  background-color: transparent;
  color: #3e4954;
  border-color: #3e4954;
}

button:hover i, button:focus i, button.focus i, button:active i,
.btn:hover i,
.btn:focus i,
.btn.focus i,
.btn:active i {
  color: #3e4954;
}

button.large,
.btn.large {
  line-height: 48px;
  font-size: 18px;
  /* 18px */
}

.btn-icon-right {
  text-align: left;
  padding-right: 65px;
}

.btn-icon-right i {
  float: right;
  margin-right: -40px;
}

.btn-primary:after,
.btn-secondary:after,
.btn-function:after,
.btn-ghost-icon:after {
  content: "\e908";
  font-family: 'hagebau-icomoon' !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  vertical-align: middle;
  font-size: 15px;
  margin-left: 20px;
  float: right;
  /* Better Font Rendering =========== */
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.back-btn:after {
  margin-left: 0;
  margin-right: 20px;
  float: left;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.addToCartButton:after,
#addToCartButton:after,
.addToCart:after,
.addToWishlistButton:after,
.addToWishlist:after,
.direct-order-add-to-cart:after,
.siteSearchSubmit:after,
.quantityContainer .btn:after,
.pagination-wrapper .btn:after,
.tabButton:after,
.downloadListItem .actions .btn:after,
.page-bom .btn:after,
.modal .userLogout .btn:after,
.addToCartContainer .wishlist-entry-add-to-cart:after,
.addToCartContainer .btn:after,
.addToWishlistContainer .btn:after,
.approverDecisionButton:after,
.btn-no-decoration:after,
.carousel-component .slick-slide .btn:after,
.site-address__action-container .btn:after,
.site-article-list-item .btn[value="cart"]:after,
.facet-filter__submit-btn:after,
#facet-filter-top .applied-filter-wrapper .btn:after,
.mobile-facet-wrapper .applied-filter-wrapper .btn:after,
#category-facet-popup-handle:after,
#filter-facet-popup-handle:after {
  content: none;
}

.btn-primary {
  min-width: 200px;
  border-color: #000;
  color: white;
  background-color: #000;
}

.btn-primary.btn-v2 {
  border-color: #5E5F61;
  background-color: #5E5F61;
}

.btn-primary i {
  float: right;
  padding-left: 10px;
  color: white;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active {
  background-color: #000;
  color: white;
  border-color: #000;
}

.btn-primary:hover i, .btn-primary:focus i, .btn-primary.focus i, .btn-primary:active i {
  color: white;
}

.btn-primary:disabled, .btn-primary[disabled] {
  color: white;
  background-color: #595858;
  border-color: #595858;
}

.btn-secondary {
  min-width: 200px;
  border-color: white;
  color: #000;
  background-color: white;
}

.btn-secondary i {
  float: right;
  padding-left: 10px;
  color: #000;
}

.btn-secondary:hover, .btn-secondary:focus, .btn-secondary.focus, .btn-secondary:active {
  background-color: white;
  color: #000;
  border-color: white;
}

.btn-secondary:hover i, .btn-secondary:focus i, .btn-secondary.focus i, .btn-secondary:active i {
  color: #000;
}

.btn-secondary:disabled, .btn-secondary[disabled] {
  color: white;
  background-color: #595858;
  border-color: #595858;
}

.btn-function {
  background-color: white;
  color: #3e4954;
  border: 1px solid #3e4954;
}

.btn-function i {
  float: right;
  padding-left: 10px;
  color: #3e4954;
}

.btn-function:hover, .btn-function:focus, .btn-function.focus {
  background-color: white;
  color: #3e4954;
  border-color: #3e4954;
}

.btn-function:hover i, .btn-function:focus i, .btn-function.focus i {
  color: #3e4954;
}

.btn-function.active, .btn-function:active {
  box-shadow: none;
  background: #000;
  color: white;
  border: 1px solid #000;
}

.btn-function.active i, .btn-function:active i {
  color: white;
}

.btn-function.active:hover, .btn-function:active:hover {
  cursor: default;
}

.btn-ghost {
  min-width: 200px;
  color: #3e4954;
  background-color: transparent;
  border-color: #3e4954;
}

.btn-ghost i {
  float: right;
  padding-left: 10px;
  color: #3e4954;
  line-height: 38px;
}

.btn-ghost:hover, .btn-ghost:focus, .btn-ghost.focus, .btn-ghost:active {
  background-color: transparent;
  color: #3e4954;
  border-color: #3e4954;
}

.btn-ghost:hover i, .btn-ghost:focus i, .btn-ghost.focus i, .btn-ghost:active i {
  color: #3e4954;
}

.btn-ghost:disabled, .btn-ghost[disabled] {
  color: #595858;
  background-color: white;
  border-color: #595858;
}

.btn-ghost-dark {
  min-width: 200px;
  color: white;
  background-color: transparent;
  border-color: white;
}

.btn-ghost-dark i {
  float: right;
  padding-left: 10px;
  padding-right: 10px;
  color: white;
}

.btn-ghost-dark:hover, .btn-ghost-dark:focus, .btn-ghost-dark.focus, .btn-ghost-dark:active {
  box-shadow: 0 0 10px -4px black;
  background-color: transparent;
  color: white;
  border-color: white;
}

.btn-ghost-dark:hover i, .btn-ghost-dark:focus i, .btn-ghost-dark.focus i, .btn-ghost-dark:active i {
  color: white;
}

.btn-ghost-dark:disabled, .btn-ghost-dark[disabled] {
  color: #595858;
  background-color: transparent;
  border-color: #595858;
}

.btn-block {
  min-width: 0;
}

.btn-height-auto {
  height: auto;
}

.btn-calendar {
  border: 1px solid #000;
  background: none;
  color: white;
  display: block;
  line-height: 38px;
  text-align: center;
}

.btn-calendar i:before {
  padding: 0;
}

.scannerNoResult {
  min-width: 160px;
  padding: 0 9px 0 10px;
}

@media (max-width: 969px) {
  .sm-full-size {
    float: none;
    margin-right: 0px !important;
    margin-left: 0px !important;
    width: 100% !important;
  }
}

@media (max-width: 767px) {
  .xs-full-size {
    float: none;
    margin-right: 0px !important;
    margin-left: 0px !important;
    width: 100% !important;
  }
}

.slick-next,
.slick-prev {
  font-family: 'hagebau-icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  /* Better Font Rendering =========== */
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-dots li.slick-control-button button {
  width: auto;
  height: auto;
  padding: 10px;
  margin: 0 0 0 10px;
  line-height: 1.2;
  background: none;
  border: 0;
  border-radius: unset;
  color: inherit !important;
}

.slick-dots li.slick-control-button button.paused {
  color: #de0019 !important;
}

.slick-next:before {
  content: '\e91a';
}

.slick-prev:before {
  content: "\e919";
}

.slick-slider-single-image {
  visibility: hidden;
  position: relative;
  aspect-ratio: 418/207;
  width: 100%;
  opacity: 0;
}

.slick-slider-single-image.loaded {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s ease;
}

.slick-slider-single-image.loaded.height-set {
  aspect-ratio: auto;
}

.slick-slider-four-images {
  visibility: hidden;
  opacity: 0;
  min-height: 100px;
}

.slick-slider-four-images.loaded {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.3s ease;
}

.slick-slider-four-images.loaded.height-set {
  aspect-ratio: auto;
}

.slick-slider-navigated-single {
  visibility: hidden;
}

.slick-slider-nav-slider {
  visibility: hidden;
}

.zoomContainer {
  z-index: 997;
}

.slick-pause-button,
.slick-play-button {
  cursor: pointer;
  display: inline-block;
  width: 100px;
  border: none;
  padding: 0 20px 0 10px;
}

.slick-pause-button:hover,
.slick-play-button:hover {
  box-shadow: none;
}

.slick-pause-button.paused,
.slick-play-button.paused {
  color: #000;
}

@media (max-width: 767px) {
  .zoomContainer {
    display: none;
  }
}

.slick-slider {
  margin: 0 0px 5px 0px;
}

.slick-slider button.slick-next,
.slick-slider button.slick-prev {
  width: 35px;
  height: 80px;
  display: inline-block;
  position: absolute;
  top: calc(50% - 40px);
  z-index: 10;
  opacity: 0;
  border: none;
  overflow: hidden;
  cursor: pointer;
  background-color: transparent;
  outline: none;
}

.slick-slider button.slick-next:focus, .slick-slider button.slick-next:active, .slick-slider button.slick-next:hover,
.slick-slider button.slick-prev:focus,
.slick-slider button.slick-prev:active,
.slick-slider button.slick-prev:hover {
  outline: 0;
  box-shadow: none;
}

.slick-slider button.slick-next:before,
.slick-slider button.slick-prev:before {
  font-size: 10px;
}

.slick-slider button.slick-prev {
  background: radial-gradient(64px 64px at 0px 40px, #fff 49%, transparent 50%), radial-gradient(70px 62px at -2px 40px, rgba(40, 40, 40, 0.1) 48%, transparent 56%);
  left: -10px;
}

.slick-slider button.slick-prev:before {
  left: 10px;
  position: absolute;
  top: 22px;
}

.slick-slider button.slick-next {
  background: radial-gradient(64px 64px at 40px 40px, #fff 49%, transparent 50%), radial-gradient(70px 62px at 42px 40px, rgba(40, 40, 40, 0.1) 48%, transparent 56%);
  right: -10px;
}

.slick-slider button.slick-next:before {
  right: 10px;
  position: absolute;
  top: 22px;
}

.slick-slider:hover button {
  opacity: 1;
}

.slick-slider a:not(.btn) {
  display: block;
}

.slick-slider a:before {
  display: block;
  content: '';
}

.slick-slider img {
  width: 100%;
}

.slick-controls-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

.slick-dots {
  width: auto;
  padding: 0px;
  margin: 10px 0;
  text-align: center;
}

.slick-dots li {
  position: relative;
  display: inline-block;
  overflow: visible;
  margin: 0 5px;
  border-radius: 100%;
}

.slick-dots li.slick-control-button {
  margin-left: -5px;
}

.slick-dots button {
  background-color: #3e4954;
  position: relative;
  vertical-align: middle;
  width: 6px;
  min-width: 6px;
  height: 6px;
  border: 1px solid #3e4954;
  padding: 0px;
  margin: 0px;
  visibility: visible;
  cursor: pointer;
  opacity: 1;
  color: transparent !important;
  border-radius: 100%;
}

.slick-dots button:hover {
  color: transparent;
}

.slick-dots button:focus {
  outline: none;
}

.slick-dots .slick-active button {
  width: 10px;
  height: 10px;
  border: 2px solid #3e4954;
}

.main-product-slider .slick-dots {
  margin-top: -40px;
}

.carousel-component .slick-slider button {
  margin-top: -20px;
}

.image-gallery-nav-slick img {
  padding-left: 5px;
  padding-right: 5px;
}

#product-nav-slider {
  width: 85%;
  margin-top: 4%;
  margin-left: auto;
  margin-right: auto;
  border: none;
}

#product-nav-slider a {
  padding: 2px;
  border: 1px solid transparent;
  margin: 1px 2px;
}

#product-nav-slider .first-slide {
  border: 1px solid #000;
}

#product-nav-slider .first-slide img {
  opacity: 0.7;
}

#product-nav-slider .slick-active:hover {
  border: 1px solid #000;
}

#product-nav-slider button {
  opacity: 1;
  color: #3e4954;
}

#product-nav-slider .slick-next {
  right: -50px;
  text-align: right;
}

#product-nav-slider .slick-prev {
  left: -30px;
  text-align: left;
}

.productList.slick-slider .slick-next,
.productList.slick-slider .slick-prev {
  color: #3e4954;
}

@media (max-width: 969px) {
  #product-nav-slider button {
    height: 20px;
    font-size: 10px;
    margin-top: -10px;
    line-height: 20px;
    width: 25px;
  }
  #product-nav-slider .slick-prev {
    left: -25px;
  }
  #product-nav-slider .slick-next {
    right: -25px;
  }
  .productImage .slick-prev {
    left: -5px;
  }
  .productImage .slick-next {
    right: -5px;
  }
  .slick-slider button.slick-next,
  .slick-slider button.slick-prev {
    opacity: 1;
  }
  .slick-slider-four-images {
    min-height: unset !important;
  }
}

@media (min-width: 970px) {
  .js-content-product-slider button.slick-next:before,
  .js-content-product-slider button.slick-prev:before {
    top: 0;
    transform: translateY(100%);
  }
}

/* override slick slider styles */
.slick-arrow.slick-minimize:before {
  content: '';
}

/* used for text with product slider next to it */
.article-productslider-container {
  display: flex;
}

.article-productslider-container .article-productslider-text {
  width: 100%;
}

.article-productslider-container .article-productslider-products {
  width: 0;
  visibility: hidden;
}

.article-productslider-container .article-productslider-products .js-content-product-slider {
  min-height: 0;
  margin-bottom: 0;
}

.article-productslider-container .article-productslider-products .js-content-product-slider .slick-slider {
  margin: 0;
}

.article-productslider-container .article-productslider-products .js-content-product-slider .slick-slider .slick-list {
  margin: 0;
  padding: 0;
}

.article-productslider-container .article-productslider-products .js-content-product-slider .slick-slider .slick-track {
  margin-bottom: 0;
}

.article-productslider-container .article-productslider-products .js-content-product-slider .slick-slider .slick-track .slick-slide {
  padding-bottom: 0;
}

.article-productslider-container.loaded .article-productslider-text {
  width: 50%;
}

.article-productslider-container.loaded .article-productslider-products {
  width: 50%;
  visibility: visible;
}

@media (max-width: 969px) {
  .article-productslider-container {
    flex-direction: column;
  }
  .article-productslider-container.loaded .article-productslider-text,
  .article-productslider-container.loaded .article-productslider-products {
    width: 100%;
  }
}

@font-face {
  font-family: 'hagebau-icomoon';
  font-weight: normal;
  font-style: normal;
  font-display: block;
  src: url("fonts/hagebau-icomoon.eot?9cb6i7");
  src: url("fonts/hagebau-icomoon.eot?9cb6i7#iefix") format("embedded-opentype"), url("fonts/hagebau-icomoon.ttf?9cb6i7") format("truetype"), url("fonts/hagebau-icomoon.woff?9cb6i7") format("woff"), url("fonts/hagebau-icomoon.svg?9cb6i7#icomoon") format("svg");
}

@font-face {
  font-family: 'Font Awesome 5 Brands';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("fonts/fa-brands-400.eot");
  src: url("fonts/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("fonts/fa-brands-400.woff2") format("woff2"), url("fonts/fa-brands-400.woff") format("woff"), url("fonts/fa-brands-400.ttf") format("truetype"), url("fonts/fa-brands-400.svg#fontawesome") format("svg");
}

.fab {
  font-family: 'Font Awesome 5 Brands';
  font-weight: 400;
}

.fa-facebook-f:before {
  content: "\f39e";
}

@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("fonts/fa-regular-400.eot");
  src: url("fonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("fonts/fa-regular-400.woff2") format("woff2"), url("fonts/fa-regular-400.woff") format("woff"), url("fonts/fa-regular-400.ttf") format("truetype"), url("fonts/fa-regular-400.svg#fontawesome") format("svg");
}

.far {
  font-family: 'Font Awesome 5 Free';
  font-weight: 400;
}

.btn .small-icon, .btn .very-small-icon {
  vertical-align: baseline;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'hagebau-icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: middle;
  font-size: 20px;
  /* Better Font Rendering =========== */
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* start icons whitelabel v2 */
.icon-advantage1:before {
  content: "\e922";
}

.icon-advantage2:before {
  content: "\e923";
}

.icon-lock:before {
  content: "\e924";
}

.icon-thumbs-up:before {
  content: "\e925";
}

.icon-cart-v2:before,
.icon-ccart-v2:before {
  content: "\e927";
}

.icon-ccart2:before {
  content: "\e928";
}

.icon-info:before {
  content: "\e929";
}

.icon-contact:before {
  content: "\e92a";
}

.icon-list:before {
  content: "\e92b";
}

.icon-pdf:before {
  content: "\e92e";
}

.icon-xls:before {
  content: "\e92f";
}

.icon-gif:before {
  content: "\e930";
}

.icon-tif:before {
  content: "\e931";
}

.icon-jpg:before {
  content: "\e932";
}

.icon-png:before {
  content: "\e933";
}

.icon-doc:before {
  content: "\e935";
}

.icon-minus:before {
  content: "\e92c";
}

.icon-plus:before {
  content: "\e92d";
}

.icon-split:before {
  content: "\e61b";
}

.icon-video:before {
  content: "\e620";
}

.icon-talk:before {
  content: "\e936";
}

.icon-direct-order:before {
  content: "\e937";
}

.icon-marker-v2:before {
  content: "\e938";
}

.icon-mouse:before {
  content: "\e939";
}

.icon-pencil:before {
  content: "\270e";
}

.icon-play:before {
  content: "\e934";
}

/* remove padding-right for some icons */
.mini-cart .icon-cart-v2:before {
  padding-right: 0;
}

.siteSearchSubmit:before {
  padding-right: 0;
}

.advantage-list i:before {
  padding-right: 0;
}

/* ends icons whitelabel v2 */
/* start icons whitelabel v3 */
.icon-benefit-medal:before {
  content: "\e900";
}

.icon-benefit-ssl:before {
  content: "\e901";
}

.icon-benefit-truck:before {
  content: "\e902";
}

.icon-menu:before {
  content: "\e904";
}

.icon-cart:before,
.icon-ccart:before {
  content: "\e905";
}

.icon-check:before {
  content: "\e906";
}

.icon-cancel:before,
.icon-close:before {
  content: "\e907";
}

.icon-cta-arrow:before {
  content: "\e908";
}

.icon-download:before {
  content: "\e909";
}

.icon-arrow-down:before {
  content: "\e90a";
}

.icon-arrow-up:before {
  content: "\e90b";
}

.icon-arrow-down.small-icon,
.icon-arrow-up.small-icon {
  font-size: 10px;
}

.icon-arrow-down.very-small-icon,
.icon-arrow-up.very-small-icon {
  font-size: 6px;
}

.icon-arrow-left:before {
  content: "\e919";
}

.icon-arrow-right:before {
  content: "\e91a";
}

.icon-arrow-left.small-icon,
.icon-arrow-right.small-icon {
  font-size: 14px;
}

.icon-arrow-left.very-small-icon,
.icon-arrow-right.very-small-icon {
  font-size: 10px;
}

.icon-navigation-arrow-down:before {
  content: "\e913";
}

.icon-navigation-arrow-up:before {
  content: "\e914";
}

.icon-calendar:before {
  content: "\e90c";
}

.icon-event-info:before {
  content: "\e90d";
}

.icon-time:before {
  content: "\e90e";
}

.icon-grid:before {
  content: "\e90f";
}

.icon-list:before {
  content: "\e910";
}

.icon-logout:before {
  content: "\e911";
}

.icon-mail:before {
  content: "\e912";
}

.icon-telephone:before,
.icon-phone:before {
  content: "\e915";
}

.icon-marker:before,
.icon-pin:before {
  content: "\e916";
  font-weight: bold;
}

.icon-building:before {
  content: "\e946";
}

.icon-search:before {
  content: "\e917";
}

.icon-shopping-list:before {
  content: "\e918";
}

.icon-user:before {
  content: "\e91b";
}

.icon-glasses:before,
.icon-preview:before {
  content: "\e91c";
}

.expanded .icon-glasses:before,
.icon-preview-closed-eye:before {
  content: "\e93a";
}

.icon-whitelabel-eckesvg:before {
  content: "\e91d";
}

.icon-refresh:before {
  content: "\e926";
}

.icon-bin:before,
.icon-garbage:before {
  content: "\e921";
}

.icon-qr:before {
  content: "\e93e";
}

.icon-disk:before {
  content: "\e962";
}

.icon-filter:before {
  content: "\ea5b";
  font-size: 14px;
}

/* ends icons whitelabel v3 */
/* start icons new account dashboard */
.icon-banking:before {
  content: "\e942";
}

.icon-benefit-winch:before,
.icon-address-management:before {
  content: "\e903";
}

.icon-approval:before {
  content: "\e943";
}

.icon-profile:before {
  content: "\e944";
}

.icon-liability:before {
  content: "\e945";
}

.icon-user-management:before {
  content: "\e940";
}

.icon-bom:before {
  content: "\e941";
}

.icon-open-items:before {
  content: "\e94f";
}

.icon-budget:before {
  content: "\e93b";
}

.icon-export:before {
  content: "\e93c";
}

.icon-profit-report:before {
  content: "\e93d";
}

.icon-globe:before {
  content: "\e93f";
}

/* ends icons new account dashboard */
/* extend external icon font - font-awesome */
.icon.fa {
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: middle;
  font-size: 20px;
  letter-spacing: .2em;
  /* Better Font Rendering =========== */
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon.fa:before {
  padding-right: 5px;
}

.icon.fa.fa-building:before {
  content: "\f1ad";
  font-style: normal;
  padding-right: 0px;
}

.icon.fa.stars_0:before {
  content: "\f006\f006\f006\f006\f006";
}

.icon.fa.stars_0_5:before {
  content: "\f123\f006\f006\f006\f006";
}

.icon.fa.stars_1:before {
  content: "\f005\f006\f006\f006\f006";
}

.icon.fa.stars_1_5:before {
  content: "\f005\f123\f006\f006\f006";
}

.icon.fa.stars_2:before {
  content: "\f005\f005\f006\f006\f006";
}

.icon.fa.stars_2_5:before {
  content: "\f005\f005\f123\f006\f006";
}

.icon.fa.stars_3:before {
  content: "\f005\f005\f005\f006\f006";
}

.icon.fa.stars_3_5:before {
  content: "\f005\f005\f005\f123\f006";
}

.icon.fa.stars_4:before {
  content: "\f005\f005\f005\f005\f006";
}

.icon.fa.stars_4_5:before {
  content: "\f005\f005\f005\f005\f123";
}

.icon.fa.stars_5:before {
  content: "\f005\f005\f005\f005\f005";
}

.panel-group .panel-title a::before {
  content: none;
}

.panel-group .panel-heading {
  border-top: 1px solid #ddd;
  background-color: #FFFFFF;
}

.panel-group .panel-heading:first-child {
  border-top: 0px;
}

.panel-group .accordion .accordion-icon-expanded {
  display: inline;
  line-height: 20px;
  padding-right: 10px;
}

.panel-group .accordion .accordion-icon-collapsed {
  display: none;
}

.panel-group .collapsed .accordion-icon-expanded {
  display: none;
}

.panel-group .collapsed .accordion-icon-collapsed {
  display: inline;
  line-height: 20px;
  padding-right: 10px;
}

@media (min-width: 970px) {
  #main-nav-wrapper {
    font-family: Catamaran, sans-serif;
    font-weight: bold;
    min-height: 45px;
    background-color: #fff;
    z-index: 1001;
    max-width: 100%;
  }
  #main-nav-wrapper .direct-order a {
    color: #3e4954;
    position: relative;
    line-height: 45px;
    font-size: 18px;
    float: right;
    margin-right: 20px;
    z-index: 1;
  }
  #main-nav-wrapper .direct-order a i {
    font-size: 32px;
  }
  #main-nav-wrapper .direct-order a:hover {
    color: #3e4954;
  }
  #main-nav-wrapper .yCmsContentSlot {
    position: relative;
    padding-left: 0px;
  }
  #main-nav-wrapper ul {
    margin: 0;
    padding: 0;
  }
  #main-nav-wrapper li {
    display: inline-block;
  }
  #main-nav-wrapper .yCmsComponent:first-child .La {
    padding-left: 5px;
  }
  #main-nav-wrapper .yCmsComponent:last-child .La {
    padding-right: 5px;
  }
  #main-nav-wrapper .La {
    padding: 0 15px;
    line-height: 45px;
    height: 45px;
  }
  #main-nav-wrapper .La:hover .navigation-menu {
    max-height: 1000px;
  }
  #main-nav-wrapper .La a {
    display: inline-block;
    color: #3e4954;
    font-size: 18px;
    font-weight: 700;
  }
  #main-nav-wrapper .La a:hover {
    color: #3e4954;
  }
  #main-nav-wrapper .Lb a {
    font-size: 14px;
    color: #3e4954;
    font-weight: normal;
  }
  #main-nav-wrapper .Lc a {
    font-size: 13px;
    color: #3e4954;
    font-weight: normal;
  }
  #main-nav-wrapper .navigation-menu {
    position: absolute;
    top: 45px;
    z-index: 9999;
    background-color: white;
    box-shadow: inset 0px -1px #fff;
    line-height: 1.5em;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out;
  }
  #main-nav-wrapper .navigation-menu .main-navigation-menu {
    overflow: hidden;
    float: left;
  }
  #main-nav-wrapper .navigation-menu .main-navigation-menu .navigation-column {
    float: left;
    display: inline-block;
    overflow: hidden;
    border-right: 1px solid #f0f0f0;
    margin-right: -1px;
    border-left: 1px solid #f0f0f0;
    padding-left: 20px;
    padding-right: 10px;
  }
  #main-nav-wrapper .navigation-menu .main-navigation-menu .navigation-column .Lb {
    text-transform: none;
    font-weight: normal;
    overflow: hidden;
    margin-bottom: 10px;
    width: 100%;
  }
  #main-nav-wrapper .navigation-menu .main-navigation-menu .navigation-column .Lc li {
    width: 100%;
    padding-left: 20px;
    font-size: 13px;
  }
  #main-nav-wrapper .navigation-menu .main-navigation-menu .navigation-column .Lc li:first-child {
    margin-top: 10px;
  }
  #main-nav-wrapper .navigation-menu .main-navigation-menu .navigation-column .Lc li:last-child {
    margin-bottom: 30px;
  }
  #main-nav-wrapper .navigation-menu .main-navigation-menu .left-column {
    border-left: none;
  }
  #main-nav-wrapper .navigation-menu .main-navigation-menu .left-column .Lb {
    padding-left: 0px;
  }
  #main-nav-wrapper .navigation-menu .main-navigation-menu .last-column {
    border-right: none;
  }
  #main-nav-wrapper .navigation-menu .main-navigation-menu .last-main-column {
    border-right: none;
  }
  #main-nav-wrapper .navigation-menu .other-categories {
    float: right;
    border-right: 0px;
    line-height: 150%;
    border-left: 1px solid #f0f0f0;
    padding-left: 20px;
    overflow: hidden;
  }
  #main-nav-wrapper .navigation-menu .other-categories .Lb {
    width: 100%;
    font-weight: normal;
    margin-bottom: 15px;
    text-transform: none;
  }
  #main-nav-wrapper .navigation-menu .other-headline {
    margin-bottom: 15px;
  }
  #main-nav-wrapper .navigation-menu a:hover {
    color: #127f3e;
  }
  #main-nav-wrapper .show-all a {
    text-transform: lowercase;
    font-weight: normal;
    color: #127f3e;
    font-size: 13px;
  }
}

@media (max-width: 969px) {
  #main-nav-wrapper {
    display: none;
  }
  #mobile-main-nav {
    position: relative;
    top: 0;
    float: left;
    width: 100%;
    background-color: white;
    box-shadow: 0 0 10px -4px black;
    font-size: 14px;
    margin: 0;
    padding: 0;
    overflow-y: auto;
  }
  #mobile-main-nav .h2 {
    padding-left: 5px;
    padding-right: 5px;
  }
  #mobile-main-nav li {
    padding: 0 10px;
    list-style: none;
    height: 50px;
    line-height: 48px;
    border-bottom: 1px solid #f0f0f0;
  }
  #mobile-main-nav li:last-child {
    border-color: #3e4954;
  }
  #mobile-main-nav li:hover {
    background-color: #f0f0f0;
  }
  #mobile-main-nav li.topCategory {
    font-weight: 400;
    text-transform: uppercase;
  }
  #mobile-main-nav li.back {
    padding: 0;
  }
  #mobile-main-nav li.back span {
    line-height: 49px;
    display: inline-block;
    background-color: #f0f0f0;
    float: right;
    width: calc(70%);
  }
  #mobile-main-nav li.back .h2 {
    margin: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
  #mobile-main-nav li.back i {
    float: left;
    padding: 0 10px;
  }
  #mobile-main-nav li a {
    display: inline-block;
    line-height: 48px;
    width: 100%;
    color: #3e4954;
  }
  #mobile-main-nav li a:before {
    content: none;
  }
  #mobile-main-nav li a:hover {
    text-decoration: none;
    color: #127f3e;
  }
  #mobile-main-nav i {
    line-height: 48px;
    float: right;
  }
}

body {
  /* 	prevent scrolling from gray bar hack */
  overflow-x: hidden;
}

#checkoutProgress {
  font-weight: 700;
  background-color: white;
  display: flex;
  place-content: flex-end;
}

#checkoutProgress ul {
  list-style-type: none;
  padding: 0;
  line-height: 31px;
  display: inline;
  margin: 0;
}

#checkoutProgress ul li:not(:last-child) {
  padding-right: 10px;
}

#checkoutProgress ul a:before {
  content: none;
}

#checkoutProgress ul a:hover {
  text-decoration: none;
}

#checkoutProgress ul > .step {
  display: table-cell;
  border-bottom: 1px solid #D4D4D5;
  transition: .25s ease-out;
  transition-property: padding-bottom;
}

#checkoutProgress ul > .active {
  font-weight: 700;
  color: #3e4954;
  box-shadow: inset 0px 0px 0px 0px #939393;
  border-bottom: 3px solid #939393;
}

#checkoutProgress ul > .disabled,
#checkoutProgress ul > .visited {
  color: #595858;
}

#checkoutProgress ul > .disabled a,
#checkoutProgress ul > .visited a {
  color: #595858;
}

#checkoutProgress ul > .disabled i,
#checkoutProgress ul > .visited i {
  color: #000;
  font-weight: 700;
  font-size: 12px;
}

#checkoutProgress ul .circle {
  display: inline-block;
  line-height: 27px;
  border: 2px solid #D4D4D5;
  height: 31px;
  width: 31px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  text-align: center;
}

#checkoutProgress ul .circle i,
#checkoutProgress ul .circle span {
  padding: 0;
  vertical-align: baseline;
}

#checkoutProgress ul .status-count {
  display: initial;
}

#checkoutProgress ul .step-name {
  padding-left: 5px;
}

#checkoutProgress ul li:first-child {
  order: 1;
}

#checkoutProgress ul li:nth-child(2) {
  order: 2;
}

#checkoutProgress ul li:nth-child(3) {
  order: 3;
}

#checkoutProgress ul li:last-child {
  order: 4;
}

@media (min-width: 970px) {
  .checkout-progress-wrapper {
    text-align: right;
  }
  #checkoutProgress ul {
    max-width: 700px;
  }
  #checkoutProgress ul > .step {
    padding-bottom: 10px;
  }
}

@media (max-width: 969px) {
  .checkout-progress-wrapper {
    text-align: center;
  }
  #checkoutProgress ul {
    min-width: 320px;
    margin: 0 auto;
    text-align: center;
    text-align: -webkit-center;
    text-align: -moz-center;
  }
  #checkoutProgress ul > .step {
    padding-bottom: 6px;
  }
}

@media (max-width: 400px) {
  #checkoutProgress {
    font-size: 13px;
  }
}

.breadcrumb-row {
  background-color: #f0f0f0;
  text-align: center;
  line-height: unset;
}

.breadcrumb {
  margin: 0;
  padding: 10px 5px 10px 5px;
  display: inline-block;
}

.breadcrumb .breadcrumb-prefix {
  float: left;
  display: block;
}

.breadcrumb li {
  line-height: unset;
  color: #3e4954;
}

.breadcrumb li:before {
  content: none;
}

.breadcrumb li a {
  color: #3e4954;
}

.parallax-wrapper .breadcrumb {
  margin: 0;
  padding: 10px 5px 5px 5px;
}

/*  background color classes for styling via cmscockpit */
.modul-highlight-grey {
  background-color: #e6e6e6;
}

.modul-highlight-ocre {
  background-color: #e1bc7b;
}

/* CMSImageComponent */
.cmsimage .img-responsive {
  margin: 0 auto;
}

.nav_column h2 {
  text-align: left;
}

.facet_block li {
  padding-top: 10px;
  padding-bottom: 10px;
}

.item_container h2, .item_container .h2 {
  text-align: left;
}

.pagetop-link {
  display: inline-block;
  margin: 0 0 40px 0;
}

.slick-slide > .description {
  display: none;
}

.yCmsComponent .componentImageContainer[src^='data:image'] {
  height: 300px;
  background-color: rgba(0, 0, 0, 0.2);
}

table,
.table {
  width: 100%;
}

table thead,
.table thead {
  background-color: #e6e6e6;
}

table td,
.table td {
  padding-top: 15px;
  padding-bottom: 15px;
}

.account-table,
.account-table-wishlist {
  height: 40px;
}

.account-table .sticked,
.account-table-wishlist .sticked {
  z-index: 998;
  background-color: #f6f7f9;
  border-bottom: 1px solid #595858;
  left: 0;
  right: 0;
  margin: 0 auto;
  opacity: 0.8;
}

.account-table .sticked .myaccount-item-header,
.account-table-wishlist .sticked .myaccount-item-header {
  background-color: transparent;
  border-color: transparent;
  padding-left: calc(25% + 2.5px);
}

.table-grid-border {
  border-bottom: 1px solid #CCC;
  width: 100%;
  float: left;
}

.table-grid {
  padding: 0;
  border-bottom: 1px solid #f0f0f0;
}

.table-grid .table-grid-entry {
  float: left;
  padding: 0;
  width: 100%;
  line-height: 20px;
  font-weight: 400;
}

.table-grid .table-grid-entry:nth-child(odd) {
  background-color: rgba(255, 255, 255, 0.4);
}

.table-grid .table-grid-entry:nth-child(odd):hover {
  background-color: #fff;
}

.table-grid .table-grid-entry:nth-child(even) {
  background-color: #fff;
}

.table-grid .table-grid-entry.disabled {
  cursor: not-allowed;
}

.table-grid .table-grid-entry [for^="collapse-toggle"] {
  display: block;
}

.table-grid .table-grid-entry div[class^="col-"] {
  padding-top: 10px;
  padding-bottom: 10px;
  min-height: 40px;
}

.table-grid .table-entry-moreInfo div[class^="col-"] {
  padding-top: 5px;
  padding-bottom: 0;
  min-height: initial;
}

.table-grid .table-entry-moreInfo {
  border-top: 1px solid #f0f0f0;
  margin-top: 1px;
  padding: 15px 5px 10px;
}

.table-grid .table-entry-moreInfo .headline {
  text-transform: uppercase;
  margin-bottom: 10px;
  font-size: 13px;
}

.table-grid .table-grid-entry:not(:last-child) .table-entry-moreInfo {
  border-bottom: 1px solid #f0f0f0;
}

.myaccount-item .table-entry-moreInfo {
  border-top: 1px solid #e2e3e4;
  margin-top: 15px;
  padding: 15px 5px 10px;
}

/* Styling for the collapse menu in the table */
.hb-collapse {
  max-height: 600px;
  overflow: hidden;
  transition: max-height 0.3s ease-in-out;
}

[id^="collapse-toggle-"] {
  display: none;
}

[id^="collapse-toggle-"]:checked ~ .hb-collapse {
  max-height: 0;
  transition: max-height 0.3s cubic-bezier(0, 1, 0.5, 1);
}

[id^="collapse-toggle-"]:checked ~ [for^="collapse-toggle-"]::after {
  transform: rotate(90deg);
}

[for^="collapse-toggle-"]:not(.mobile) {
  position: relative;
  margin: 0;
  cursor: pointer;
}

[for^="collapse-toggle-"]:not(.mobile)::before, [for^="collapse-toggle-"]:not(.mobile)::after {
  position: absolute;
  content: '';
  width: 15px;
  height: 1px;
  top: 20px;
  right: 20px;
  background-color: #000;
  transition: transform 0.2s ease-in-out;
}

/*
 * Classes for the responsive design
 */
@media (max-width: 767px) {
  .account-table .sticked .myaccount-item-header,
  .account-table-wishlist .sticked .myaccount-item-header {
    padding-left: 0;
  }
  [for^="collapse-toggle-"] {
    position: relative;
    margin: 0;
    cursor: pointer;
  }
  [for^="collapse-toggle-"]::before, [for^="collapse-toggle-"]::after {
    position: absolute;
    content: '';
    width: 15px;
    height: 1px;
    top: 20px;
    right: 20px;
    background-color: #000;
    transition: transform 0.2s ease-in-out;
  }
}

@media (min-width: 768px) {
  .table-grid-entry .mobile + .hb-collapse {
    display: none;
  }
}

button.close {
  float: right;
  opacity: 1;
  z-index: 10;
  min-width: 10px;
}

button.close i {
  color: #3e4954;
}

button.close:hover, button.close:focus, button.close.focus, button.close:active {
  opacity: 1;
  background-color: white;
}

button.close:hover i, button.close:focus i, button.close.focus i, button.close:active i {
  color: #3e4954;
}

.modal-content {
  overflow: auto;
  max-height: 100vh;
  position: absolute;
  overflow-x: hidden;
  width: 100%;
}

.modal-content .modal-header {
  padding-top: 30px;
  padding-bottom: 10px;
}

.modal-content .modal-header h1, .modal-content .modal-header h2, .modal-content .modal-header h3 {
  display: inline-block;
}

.modal-content .modal-header span.h1 {
  margin-bottom: 10px;
}

.modal-content .modal-body .headline {
  margin-bottom: 10px;
}

.modal-content .modal-footer {
  border-top: none;
}

.modal-content .modal-loading-spinner {
  text-align: center;
  padding: 50px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.modal-content #globalMessages .alert,
.modal-content .globalMessages .alert {
  margin-bottom: 10px;
}

.modal-content .allstockspopup {
  margin: 15px;
}

.modal-content .allstockspopup .modal-header {
  margin-bottom: 10px;
}

.modal-content .allstockspopup .stock-message {
  font-weight: bold;
  display: inline-flex;
  align-items: baseline;
}

.modal-content .accordion-icon-expanded {
  padding-top: 3px;
}

.modal-content .productListItemHeader {
  background-color: #F4F5F6;
  line-height: 28px;
  font-size: 12px;
  margin: 0 10px;
}

.modal-content .productListItemHeader .quantityHeader {
  padding-right: 20px;
  text-align: right;
}

.modal-content .productListItem {
  padding: 20px 0;
}

.modal-content .productListItem .productImage img {
  border: 1px solid #F4F5F6;
}

.modal-content div[id^=item-]:not(#item-0) {
  border-top: 1px solid #D4D4D5;
}

.modal-content .followUpProducts {
  background-color: #F4F5F6;
  margin: 0 -9px 0 -10px;
}

.modal-content .followUpProducts .header {
  padding: 20px 0;
  border-bottom: 1px solid #D4D4D5;
}

.modal-content .followUpProducts .productListItem {
  -webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
}

.modal-content .followUpProducts .productListItem.success-error {
  background-color: #de0019;
}

.modal-content .followUpProducts .productListItem .productName,
.modal-content .followUpProducts .productListItem .price {
  margin-bottom: 10px;
}

.modal-content .followUpProducts .productListItem .price {
  padding-right: 30px;
}

.modal-content .followUpProducts.mandatory {
  background-color: #fff;
  margin-top: 10px;
  margin-bottom: 10px;
}

.modal-content .followUpProducts.mandatory .alert-hint {
  border: 1px solid #de0019;
}

.modal-content .followUpProducts.mandatory .alert-hint .header {
  color: #f0f0f0;
  background: #de0019;
  padding: 20px 25px;
}

.modal-content .followUpProducts.mandatory .alert-hint .header .message {
  padding-left: 15px;
}

@media (min-width: 970px) {
  .modal-content .productListItem .quantity {
    padding-right: 30px;
    text-align: right;
  }
  .modal-content .followUpProducts .productListItem .quantity {
    padding-right: 10px;
    text-align: left;
  }
  .modal-content .followUpProducts .productListItem .price {
    text-align: right;
  }
  .modal-content .followUpProducts.mandatory {
    padding: 0 20px;
  }
  .modal-content .followUpProducts.optional {
    padding: 0;
  }
  .modal-content .followUpProducts.optional .header {
    padding-left: 20px;
    padding-right: 20px;
  }
  .modal-content .followUpProducts.optional .productListItem {
    margin: 0 20px;
  }
  .modal-content .productListItem {
    margin: 0 10px;
  }
  .modal-content .productListItem .addFollowToCartButton {
    min-width: 160px;
  }
}

@media (min-width: 1200px) {
  .modal-open .account-table .sticked,
  .modal-open .account-table-wishlist .sticked {
    left: -15px;
  }
}

@media (max-width: 969px) {
  .modal-content .productListItem .productImage {
    padding-right: 0;
  }
  .modal-content .productListItem .productName {
    padding-bottom: 10px;
  }
  .modal-content .productListItem .addFollowToCartButton {
    min-width: 100%;
  }
  .modal-content .followUpProducts {
    padding: 0 10px;
  }
}

@media (max-width: 550px) {
  .modal-content .productListItem .quantityInputButtonContainer button {
    display: none;
  }
}

.popover-title {
  background-color: white;
  text-transform: none;
  padding-left: 0;
  padding-right: 0;
  padding-top: 14px;
  margin-left: 14px;
  margin-right: 14px;
  line-height: 20px;
}

.popover-title,
.popover-content {
  font-size: 12px;
}

.product-references-component .popover {
  min-width: 330px;
}

.msg {
  color: white;
  position: relative;
}

.msg.success {
  background-color: #127f3e;
}

.msg.information {
  background-color: #5E5F61;
}

.msg.error {
  background-color: #de0019;
}

.msg .inner-msg {
  display: inline-block;
  border-left: 1px solid white;
  padding: 10px;
  margin-left: 39px;
}

.msg i {
  position: absolute;
  top: 15px;
  left: 10px;
}

.direct-order-container {
  display: none;
  width: 100%;
  margin-top: 10px;
}

.direct-order-container div, .direct-order-container ul {
  padding: 0;
  margin: 0;
}

.direct-order-container .direct-order-title-container {
  padding: 20px;
}

.direct-order-container .direct-order-info-container {
  display: block;
  position: relative;
  padding: 30px 30px;
  margin: 0 10px 0 10px;
}

.direct-order-container .direct-order-info-container i {
  position: absolute;
  top: 35px;
  left: 0px;
}

.direct-order-container .globalMessages {
  margin-top: 20px;
}

.direct-order-form {
  padding: 0 20px;
}

.direct-order-form .direct-order-content-container {
  padding: 20px;
  min-height: 270px;
}

.direct-order-form .direct-order-product-container {
  overflow-x: hidden;
  display: none;
  margin-top: 20px;
}

.direct-order-form .direct-order-search-container {
  overflow: hidden;
  margin-bottom: 20px;
}

.direct-order-form .direct-order-search-container .direct-order-search-term {
  width: 100%;
  margin: 0 auto;
  padding-left: 15px;
}

.direct-order-form .direct-order-search-container ul {
  left: 20px !important;
  background: white;
  list-style-type: none;
  max-height: 8em;
  overflow-y: auto;
  position: absolute;
  border: 1px solid #f0f0f0;
  border-top: none;
}

.direct-order-form .direct-order-search-container ul li {
  padding: 5px 15px;
  position: relative;
}

.direct-order-form .direct-order-search-container ul li:hover, .direct-order-form .direct-order-search-container ul li.ui-state-focus {
  background: #f0f0f0;
  cursor: pointer;
}

.direct-order-form .direct-order-search-container ul li:hover .productAdd, .direct-order-form .direct-order-search-container ul li.ui-state-focus .productAdd {
  display: block;
  padding-top: 10px;
}

.direct-order-form .direct-order-search-container ul li:before {
  content: "› ";
  top: 15px;
  position: absolute;
}

.direct-order-form .direct-order-search-container ul li .productAdd {
  display: none;
}

.direct-order-form .direct-order-controls-container .direct-order-add-to-cart {
  display: block;
  float: right;
  width: 260px;
  padding: 0 20px;
}

.direct-order-form .direct-order-product-tile {
  height: auto;
  min-height: 125px;
  margin: 10px 0 0 0;
  padding-top: 15px;
  overflow: hidden;
  border-top: 1px solid #f0f0f0;
}

.direct-order-form .direct-order-product-tile .direct-order-details {
  border-right: 1px solid #f0f0f0;
  margin-right: -1px;
}

.direct-order-form .direct-order-product-tile .direct-order-product-image-container {
  padding: 10px;
}

.direct-order-form .direct-order-product-tile .direct-order-product-image-container img {
  max-width: 100%;
}

.direct-order-form .direct-order-product-tile .direct-order-product-content-container,
.direct-order-form .direct-order-product-tile .direct-order-product-classifications-container,
.direct-order-form .direct-order-product-tile .direct-order-product-pricing-container,
.direct-order-form .direct-order-product-tile .direct-order-product-dimension-container,
.direct-order-form .direct-order-product-tile .stock-message {
  padding: 0 10px;
  overflow: hidden;
}

.direct-order-form .direct-order-product-tile .direct-order-product-dimension-container .productDimensions {
  margin-bottom: 6px;
}

.direct-order-form .direct-order-product-tile .direct-order-product-dimension-container .direct-order-quantity {
  margin-right: 10px;
  text-align: center;
}

.direct-order-form .direct-order-product-tile .direct-order-product-dimension-container .unitCol > .select-wrapper {
  margin-left: 10px;
}

.direct-order-form .direct-order-product-tile .direct-order-product-dimension-container .unitCol > span {
  line-height: 38px;
}

.direct-order-form .direct-order-product-tile .direct-order-product-dimension-container label {
  font-weight: 300;
  margin-bottom: 2px;
}

.direct-order-form .direct-order-product-tile .price-close {
  border-left: 1px solid #f0f0f0;
}

.direct-order-form .direct-order-product-tile .direct-order-product-controls-container .close {
  top: 10px;
}

.direct-order-form .direct-order-product-tile .direct-order-product-classifications-container ul {
  list-style-type: none;
}

/* Fix Bootstrap .modal compatibility with jQuery UI Autocomplete,
see http://stackoverflow.com/questions/10957781/google-maps-autocomplete-result-in-bootstrap-modal-dialog */
.ui-autocomplete {
  z-index: 2052 !important;
}

/* small VP sm */
@media (max-width: 969px) {
  .direct-order-product-content-container,
  .direct-order-product-classifications-container,
  .direct-order-product-pricing-container {
    padding: 10px;
    overflow: hidden;
  }
  .direct-order-product-content-container p,
  .direct-order-product-classifications-container p,
  .direct-order-product-pricing-container p {
    margin-bottom: 5px;
  }
}

/* small VP sm */
@media (max-width: 767px) {
  .direct-order-container {
    /* .direct-order-search-container */
    /* .direct-order-controls-container */
  }
  .direct-order-container .h3 {
    text-align: center;
    margin-top: 30px;
  }
  .direct-order-container .direct-order-form {
    padding: 0;
  }
  .direct-order-container .direct-order-info-container {
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
  }
  .direct-order-container .direct-order-content-container {
    border: none !important;
    padding: 20px 5px;
  }
  .direct-order-container .direct-order-product-container {
    height: auto !important;
    overflow: visible !important;
    display: none;
  }
  .direct-order-container .direct-order-product-tile {
    border: none !important;
  }
  .direct-order-container .direct-order-product-pricing-container {
    padding-top: 10px !important;
    margin-top: 5px;
    min-height: 50px;
  }
  .direct-order-container .remove {
    padding: 10px 10px 0 0 !important;
    margin-top: 5px;
  }
  .direct-order-container .price-close,
  .direct-order-container .stocklevel-container {
    background-color: #f0f0f0;
  }
  .direct-order-container .stock-message {
    margin-top: 10px;
    padding-top: 5px !important;
  }
  .direct-order-container .price-close {
    padding-bottom: 10px;
  }
  .direct-order-container .direct-order-product-pricing-container {
    border-left: none !important;
    padding-left: 20px;
    margin-bottom: 10px;
  }
  .direct-order-container .direct-order-product-pricing-container label {
    float: left;
    margin: auto 5px auto 0;
    line-height: 40px;
  }
  .direct-order-container .direct-order-search-container {
    margin: 0 auto !important;
    width: 90% !important;
  }
  .direct-order-container .direct-order-search-container .direct-order-search-field {
    border-top: 1px solid #f0f0f0;
    padding-top: 15px;
    margin-top: 15px;
  }
  .direct-order-container .direct-order-controls-container .direct-order-add-to-cart {
    width: 90% !important;
    clear: both;
    float: none !important;
    margin: auto;
  }
}

/* @media (max-width: $screen-xs-max) */
/* ********* */
/* variables */
/* ********* */
/* ***************** */
/* facet value color */
/* ***************** */
.facet .facet-values--color .pseudo-checkbox {
  /* fallback color value, if class is not defined */
  /* define colors */
  /* default icon check color (including fallback color dot) */
  /* override the icon check color */
}

.facet .facet-values--color .pseudo-checkbox [class*="facet__value-color--"] {
  background: linear-gradient(to right top, #fff 0, #fff 10%, #f2f2f2 0, #f2f2f2 23%, #fff 0, #fff 36%, #f2f2f2 0, #f2f2f2 48.5%, #fff 0, #fff 63%, #f2f2f2 0, #f2f2f2 75%, #fff 0, #fff 90%, #f2f2f2 0, #f2f2f2);
  border-color: #808080;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--anthrazit {
  background: #28282D;
  border-color: #28282D;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--beige {
  background: #cccc99;
  border-color: #cccc99;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--blau {
  background: #0000FF;
  border-color: #0000FF;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--braun {
  background: #993300;
  border-color: #993300;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--gelb {
  background: #FFFF00;
  border-color: #FFFF00;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--grau {
  background: #808080;
  border-color: #808080;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--gruen,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--grün {
  background: #008000;
  border-color: #008000;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--bunt,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--mehrfarbig {
  background: linear-gradient(to right top, #7e3906 0, #7e3906 10%, #cccc99 0, #cccc99 23%, #8d0083 0, #8d0083 36%, #198504 0, #198504 48.5%, #334982 0, #334982 63%, #ffd229 0, #ffd229 75%, #ee9201 0, #ee9201 90%, #d52b1e 0, #d52b1e);
  border-color: #808080;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--orange {
  background: #FF8300;
  border-color: #FF8300;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--rot {
  background: #FF0000;
  border-color: #FF0000;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--schwarz {
  background: #000000;
  border-color: #000000;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--silber {
  background: #C0C0C0;
  border-color: #C0C0C0;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--transparent {
  background: #f2f2f2;
  border-color: #f2f2f2;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--weiss,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--weiß {
  background: #FFFFFF;
  border-color: #808080;
}

.facet .facet-values--color .pseudo-checkbox [class*="facet__value-color--"] i.icon-check {
  color: #808080;
}

.facet .facet-values--color .pseudo-checkbox .facet__value-color--anthrazit i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--beige i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--blau i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--braun i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--grau i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--gruen i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--grün i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--bunt i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--mehrfarbig i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--orange i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--rot i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--schwarz i.icon-check,
.facet .facet-values--color .pseudo-checkbox .facet__value-color--silber i.icon-check {
  color: #FFFFFF;
}

/* ******************* */
/* //facet value color */
/* ******************* */
/* ******* */
/* General */
/* ******* */
.facet-filter-wrapper .filter-header {
  text-align: left;
  font-weight: 400;
  margin: 0 0 10px 0;
  padding: 0 15px 0 0;
  text-transform: none;
  display: inline-block;
  color: #a3a3a3;
  line-height: 28px;
}

.facet-filter-wrapper .active-facetvalue > a {
  color: #000;
}

.facet-search {
  margin-top: 5px;
  margin-bottom: 10px;
}

/* facet-filter */
.facet-filter-wrapper {
  background: white;
}

.facet-filter .facet .facetValues {
  overflow: hidden;
}

.facet-filter .facet .facetValues ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.facet-filter .facet .facetValues label {
  font-weight: 400;
}

.facet-filter .facet .range-facet {
  overflow: hidden;
}

.facet-filter .link-facet--show-more {
  text-decoration: underline;
  color: #000;
}

.facet-filter .link-wrapper-facet--show-more {
  order: 8;
  /* high order -> so that it is the last element after the page load */
  height: 38px;
  margin: 5px 5px;
}

.facet-filter .link-wrapper-facet--show-more .link-facet--show-more {
  line-height: 38px;
}

/* //facet-filter */
/* slider value */
.slider-values {
  width: 100%;
  line-height: 40px;
  margin-bottom: 10px;
}

.slider-values .field {
  display: inline-block;
}

.slider-values .field input {
  display: inline-block;
  width: 60px;
  padding: 0 5px;
  text-align: center;
}

.slider-values .field span {
  display: inline-block;
}

.slider-values .field span.mid {
  text-align: center;
}

.slider-values .text-center {
  position: absolute;
  left: 50%;
  margin-left: -8px;
  text-transform: none;
}

/* //slider value */
.mobile-facet-filter .filter-action,
.mobile-facet-filter .headline {
  display: none;
}

#facet-mobile-form {
  margin-bottom: 20px;
}

.applied-filter-wrapper {
  margin-bottom: 30px;
}

.applied-filter-wrapper .btn {
  width: 100%;
  position: relative;
  padding-left: 40px;
}

.applied-filter-wrapper .btn i {
  position: absolute;
  left: 10px;
  line-height: 38px;
}

#mobileSort {
  margin-bottom: 40px;
}

/* ********* */
/* //General */
/* ********* */
/* ***************** */
/* facet-filter-side */
/* ***************** */
#facet-filter-side {
  padding: 15px 20px;
}

#facet-filter-side .facet-filter > .facet:not(:first-child) {
  margin-top: 20px;
}

#facet-filter-side .facet {
  width: 100%;
}

#facet-filter-side .facet .facetHead {
  margin-bottom: 20px;
  font-size: 13px;
  text-overflow: ellipsis;
  overflow: hidden;
}

#facet-filter-side .facet .facetHead i {
  padding-right: 10px;
  font-size: 16px;
  float: right;
}

#facet-filter-side .facetValues {
  overflow: hidden;
  transition: max-height 0.5s ease-in-out;
  transition: opacity 0.5s linear;
  max-height: 10000px;
  opacity: 1;
  font-size: 14px;
}

#facet-filter-side .facetValues.slide-up {
  max-height: 0px;
  opacity: 0;
}

#facet-filter-side .facet.categories .hidden-level1 {
  display: none;
}

#facet-filter-side .facet.categories .link-facet-category-container--go-back {
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 8px;
  padding-bottom: 8px;
}

#facet-filter-side .facet.categories .link-facet-category-container--go-back i {
  padding-right: 10px;
  font-size: 8px;
}

#facet-filter-side .facet.categories .facetHead,
#facet-filter-side .facet.categories .parent-category > li {
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 8px;
}

#facet-filter-side .facet.categories .siblings > li {
  margin-bottom: 8px;
  border-bottom: 1px solid transparent;
}

#facet-filter-side .facet.categories .real-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  font-weight: 400;
  margin-bottom: 8px;
}

#facet-filter-side .facet.categories .siblings > li:last-child > a > .real-label,
#facet-filter-side .facet.categories .siblings > li:last-child > .real-label {
  margin-bottom: 0;
}

#facet-filter-side .facet.categories .siblings > li:first-child {
  margin-top: 15px;
}

#facet-filter-side .facet.categories .siblings.level2 {
  margin-left: 20px;
}

#facet-filter-side .facet.categories .siblings.level3 {
  margin-left: 20px;
}

#facet-filter-side .facet.categories .active-facetvalue > a .real-label,
#facet-filter-side .facet.categories .selected-category-path > a .real-label {
  font-weight: 700;
}

/* ******************* */
/* //facet-filter-side */
/* ******************* */
/* **************** */
/* facet-filter-top */
/* **************** */
#facet-filter-top {
  padding: 20px;
  background-color: white;
  /* //.facet.select-wrapper */
}

#facet-filter-top .facet-filter {
  margin: -5px -5px;
}

#facet-filter-top .filter-flex {
  display: flex;
  flex-direction: column;
}

#facet-filter-top .filter-flex-bottom {
  display: flex;
  margin-top: 10px;
  flex-direction: column;
}

#facet-filter-top .filter-flex-bottom .submit-container {
  width: 100%;
  border-top: 1px solid #f4f5f6;
  padding-top: 10px;
}

#facet-filter-top .filter-flex-bottom .submit-container button[type="submit"] {
  width: 40%;
  margin: 0 auto;
}

#facet-filter-top .facet.select-wrapper {
  display: inline-block;
  margin: 5px 5px;
  position: inherit;
  /* facets, but not color */
  /* facet color */
  /* //facet color */
}

#facet-filter-top .facet.select-wrapper:not(.active) .dropdown__facet-values {
  display: none;
}

#facet-filter-top .facet.select-wrapper.active .dropdown-fake i {
  transform: rotate(180deg);
  padding-top: 2px;
  display: inline-block;
}

#facet-filter-top .facet.select-wrapper.active .dropdown__facet-head {
  font-weight: 700;
  border-color: transparent;
  border-bottom-color: #fff;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  padding-right: 41px;
}

#facet-filter-top .facet.select-wrapper.active .dropdown__facet-values {
  display: inline-block;
  box-shadow: 3px 8px 8px rgba(0, 0, 0, 0.3);
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-head {
  display: block;
  position: relative;
  padding-right: 42px;
  line-height: 38px;
  min-width: 80px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values {
  position: absolute;
  background-color: #fff;
  z-index: 50;
  padding: 10px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.single-select:not(.facet-values--color) .pseudo-checkbox {
  margin-bottom: 8px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.single-select .facet-filter__submit-btn {
  height: 0;
  border: 0;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.multi-select:not(.facet-values--color) .pseudo-checkbox {
  margin-bottom: 10px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) {
  min-width: 220px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .facet-block {
  max-height: 326px;
  overflow-y: auto;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .facet-block > li:not(:last-child) {
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 10px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .facet-block:last-child {
  margin-bottom: 0;
  border-bottom: none;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .pseudo-checkbox span.checkbox {
  width: 16px;
  height: 16px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .pseudo-checkbox span.checkbox i {
  font-size: 14px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .pseudo-checkbox span.checkbox ~ span.real-label {
  line-height: 18px;
  vertical-align: middle;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .pseudo-checkbox span.radio-button {
  width: 18px;
  height: 18px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .pseudo-checkbox span.radio-button i {
  width: 12px;
  height: 12px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .pseudo-checkbox span.radio-button ~ span.real-label {
  line-height: 18px;
  vertical-align: top;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .text__middle {
  width: calc(100% - 154px);
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .text__right {
  min-width: 30px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.facet-values--color {
  width: 293px;
  padding-top: 20px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.facet-values--color .facet-block {
  display: flex;
  flex-wrap: wrap;
}

#facet-filter-top .facet.select-wrapper.facet-sorting .dropdown__facet-values {
  padding-top: 2px;
}

#facet-filter-top .facet.select-wrapper .facet-filter__submit-btn {
  min-width: 200px;
  margin-top: 10px;
}

#facet-filter-top .applied-filter-wrapper {
  border-top: 1px solid #f0f0f0;
  margin-top: 10px;
  margin-bottom: 0;
  padding-top: 10px;
}

#facet-filter-top .facet.categories .hidden-level1 {
  display: none;
}

#facet-filter-top .facet.categories .facetHead,
#facet-filter-top .facet.categories .parent-category > li:not(:last-child) {
  border-bottom: 1px solid #f0f0f0;
}

#facet-filter-top .facet.categories .siblings > li {
  margin-bottom: 8px;
  border-bottom: 1px solid transparent;
}

#facet-filter-top .facet.categories .real-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  font-weight: 400;
  margin-bottom: 8px;
}

#facet-filter-top .facet.categories .siblings > li:last-child > a > .real-label,
#facet-filter-top .facet.categories .siblings > li:last-child > .real-label {
  margin-bottom: 0;
}

#facet-filter-top .facet.categories .siblings > li:first-child {
  margin-top: 15px;
}

#facet-filter-top .facet.categories .siblings.level2 {
  margin-left: 20px;
}

#facet-filter-top .facet.categories .siblings.level3 {
  margin-left: 20px;
}

#facet-filter-top .facet.categories .active-facetvalue > a .real-label,
#facet-filter-top .facet.categories .selected-category-path > a .real-label {
  font-weight: 700;
}

.awsArticleListContent #facet-filter-top .facet-sorting {
  display: none;
}

/* ****************** */
/* //facet-filter-top */
/* ****************** */
/* ********************************** */
/* facet-filter-top AND mobile-facets */
/* ********************************** */
#facet-filter-top,
.mobile-facet-wrapper {
  /* //.facet.select-wrapper */
}

#facet-filter-top .btn:not(.facet-filter__submit-btn),
.mobile-facet-wrapper .btn:not(.facet-filter__submit-btn) {
  width: max-content;
  background-color: #f0f0f0;
  border-color: #f0f0f0;
  height: 28px;
  line-height: 28px;
  margin-bottom: 5px;
}

#facet-filter-top .btn:not(.facet-filter__submit-btn):after,
.mobile-facet-wrapper .btn:not(.facet-filter__submit-btn):after {
  content: none;
}

#facet-filter-top .btn:not(.facet-filter__submit-btn) i,
.mobile-facet-wrapper .btn:not(.facet-filter__submit-btn) i {
  line-height: 28px;
  font-size: 10px;
}

#facet-filter-top .btn-remove-filter,
.mobile-facet-wrapper .btn-remove-filter {
  padding-left: 10px;
  padding-right: 20px;
  margin-left: 10px;
}

#facet-filter-top .btn-remove-filter span,
.mobile-facet-wrapper .btn-remove-filter span {
  font-weight: 400;
}

#facet-filter-top .btn-remove-filter i,
.mobile-facet-wrapper .btn-remove-filter i {
  position: relative;
  padding-left: 0;
  right: -5px;
}

#facet-filter-top .btn-remove-all-filters,
.mobile-facet-wrapper .btn-remove-all-filters {
  padding-left: 30px;
  padding-right: 10px;
}

#facet-filter-top .btn-remove-all-filters i,
.mobile-facet-wrapper .btn-remove-all-filters i {
  padding-left: 0;
}

#facet-filter-top .facet-filter,
.mobile-facet-wrapper .facet-filter {
  display: flex;
  display: -ms-flexbox;
  display: -webkit-flex;
  flex-wrap: wrap;
}

#facet-filter-top .facet,
.mobile-facet-wrapper .facet {
  order: 5;
  /* set default order for all facets */
}

#facet-filter-top .facet[data-facet-code="warehouse"],
.mobile-facet-wrapper .facet[data-facet-code="warehouse"] {
  order: 3;
  /* override default order to lower value */
}

#facet-filter-top .facet.facet-sorting,
.mobile-facet-wrapper .facet.facet-sorting {
  order: 2;
  /* override default order to lower value (lower than warehouse) */
}

#facet-filter-top .facet.categories,
.mobile-facet-wrapper .facet.categories {
  order: 3;
}

#facet-filter-top .facet.select-wrapper,
.mobile-facet-wrapper .facet.select-wrapper {
  /* facets, but not color */
  /* facet color */
  /* //facet color */
  /* sorting facet */
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .text__middle,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .text__middle {
  text-transform: none;
  text-align: center;
  display: inline-block;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .text__right,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .text__right {
  text-transform: none;
  text-align: center;
  display: inline-block;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) input[type="radio"]:checked ~ span.real-label,
#facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) input[type="checkbox"]:checked ~ span.real-label,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) input[type="radio"]:checked ~ span.real-label,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) input[type="checkbox"]:checked ~ span.real-label {
  font-weight: 700;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.facet-values--color .facet-block > li,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values.facet-values--color .facet-block > li {
  display: inline-block;
  width: 68px;
  padding: 0 2px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.facet-values--color .pseudo-checkbox,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values.facet-values--color .pseudo-checkbox {
  margin-bottom: 18px;
  display: block;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.facet-values--color span.checkbox,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values.facet-values--color span.checkbox {
  display: block;
  height: 36px;
  width: 36px;
  border-width: 1px;
  border-style: solid;
  border-radius: 50%;
  margin: 0 auto;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.facet-values--color span.checkbox i.icon-check,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values.facet-values--color span.checkbox i.icon-check {
  left: 11px;
  top: 11px;
  font-size: 12px;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.facet-values--color .real-label-wrapper,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values.facet-values--color .real-label-wrapper {
  text-align: center;
  width: 100%;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.facet-values--color .real-label,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values.facet-values--color .real-label {
  font-size: 12px;
  line-height: 15px;
  display: block;
  white-space: normal;
  margin-top: 2px;
  word-break: break-word;
}

#facet-filter-top .facet.select-wrapper .dropdown__facet-values.facet-values--color .value-count,
.mobile-facet-wrapper .facet.select-wrapper .dropdown__facet-values.facet-values--color .value-count {
  display: block;
}

#facet-filter-top .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item,
.mobile-facet-wrapper .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item {
  margin-bottom: 5px;
  padding-top: 10px;
}

#facet-filter-top .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item.selected .real-label,
.mobile-facet-wrapper .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item.selected .real-label {
  font-weight: 700;
}

#facet-filter-top .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item .real-label,
.mobile-facet-wrapper .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item .real-label {
  cursor: pointer;
  margin-bottom: 0;
}

#facet-filter-top .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item:focus, #facet-filter-top .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item:active, #facet-filter-top .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item:hover,
.mobile-facet-wrapper .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item:focus,
.mobile-facet-wrapper .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item:active,
.mobile-facet-wrapper .facet.select-wrapper.facet-sorting .facet-block .custom-option.facet-value-item:hover {
  background-color: #f0f0f0;
}

/* ************************************ */
/* //facet-filter-top AND mobile-facets */
/* ************************************ */
/* ************* */
/* mobile-facets */
/* ************* */
.modal-header-category .close,
.modal-header-filter .close {
  line-height: 20px;
  /* make the area to click the close button larger */
  padding: 10px;
  height: 42px;
  margin-right: -10px;
  margin-top: -10px;
}

.modal-header-category .close i,
.modal-header-filter .close i {
  line-height: 20px;
  font-size: 16px;
}

.modal-content.modal-facets {
  min-height: 100vh;
}

@media (max-width: 767px) {
  #facet-filter-top {
    padding: 10px 15px;
    position: fixed;
    height: 100%;
    width: 100%;
    bottom: 0;
    right: 0;
    z-index: 2000;
  }
  #facet-filter-top .filter-flex {
    height: 80%;
    flex-direction: column;
    overflow-y: scroll;
  }
  #facet-filter-top .filter-flex .flex-padding {
    padding: 5px;
  }
  #facet-filter-top .filter-flex-bottom {
    display: flex;
    flex-direction: row;
  }
  #facet-filter-top .filter-flex-bottom .submit-container {
    width: 100%;
  }
  #facet-filter-top .filter-flex-bottom .submit-container button[type="submit"] {
    width: 100%;
  }
  #facet-filter-top .mobile-filter-header {
    height: 45px;
    margin-top: 10px;
  }
  #facet-filter-top .mobile-filter-header .mobile-remove-all-filters {
    margin-left: 20%;
    font-weight: bold;
    text-decoration: underline;
  }
  #facet-filter-top .mobile-filter-header .close {
    line-height: 20px;
    /* make the area to click the close button larger */
    padding: 10px;
    height: 42px;
    margin-right: 0;
    margin-top: -10px;
  }
  #facet-filter-top .mobile-filter-header .close i {
    line-height: 20px;
    font-size: 16px;
  }
  #facet-filter-top .facet {
    width: 100%;
    font-size: 14px;
  }
  #facet-filter-top .facet.active-filters::before {
    content: '';
    position: absolute;
    left: 0px;
    width: 10px;
    height: 38px;
    background-color: #000;
  }
  #facet-filter-top .facet.select-wrapper {
    position: relative;
  }
  #facet-filter-top .facet.select-wrapper,
  #facet-filter-top .facet .facet-block > li:not(:last-child),
  #facet-filter-top .facet .parent-category > li:not(:last-child),
  #facet-filter-top .facet .siblings > li:not(:last-child) {
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 8px;
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-head {
    position: relative;
    display: flex;
    align-items: center;
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-head .facet-title {
    align-self: start;
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-head .facet-applied-filters-wrapper {
    display: flex;
    flex-wrap: wrap;
    padding-top: 5px;
    width: 100%;
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-head::after {
    font-family: 'hagebau-icomoon' !important;
    content: "\e91a";
    font-size: 8px;
    float: right;
  }
  #facet-filter-top .facet .real-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    font-weight: 400;
  }
  #facet-filter-top .facet.facet-sorting .facetHead {
    display: flex;
    justify-content: space-between;
  }
  #facet-filter-top .facet.facet-sorting .facetHead::after {
    content: none;
  }
  #facet-filter-top .facet.facet-sorting #sort_form_mobile {
    padding-bottom: 5px;
  }
  #facet-filter-top .facet.facet-sorting #sort_form_mobile select {
    box-sizing: content-box;
    height: 26px;
    padding-bottom: 8px;
    padding-right: 0;
  }
  #facet-filter-top .facet.select-wrapper {
    border-bottom: 1px solid #f0f0f0;
    margin: 0;
    padding: 0 15px;
  }
  #facet-filter-top .facet.select-wrapper:not(.active) .dropdown__facet-values {
    display: none;
  }
  #facet-filter-top .facet.select-wrapper.active .dropdown__facet-head {
    font-weight: bold;
    box-shadow: none;
    padding-right: 33px;
  }
  #facet-filter-top .facet.select-wrapper.active .dropdown__facet-head::after {
    transform: rotate(90deg);
  }
  #facet-filter-top .facet.select-wrapper.active .dropdown__facet-values {
    margin-left: 10px;
    position: relative;
    display: block;
    padding: 0;
    box-shadow: none;
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-head {
    border: 0;
    height: auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 0;
    padding-right: 30px;
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-head .dropdown-fake {
    display: none;
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) label.pseudo-checkbox {
    display: block;
    margin-bottom: 0;
    line-height: 24px;
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) span.checkbox,
  #facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) span.radio-button {
    float: right;
    margin: 2px 0 0 0;
    right: 28px;
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) span.radio-button .radio-inner {
    position: relative;
    left: 2px;
    top: 2px;
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .text__middle {
    width: calc(100% - 235px);
  }
  #facet-filter-top .facet.select-wrapper .dropdown__facet-values:not(.facet-values--color) .text__right {
    min-width: 30px;
  }
  #facet-filter-top .facet.select-wrapper .facet-values--color .link-facet-go-back-wrapper {
    margin-bottom: 25px;
  }
  #facet-filter-top .facet.select-wrapper .facet-values--color .facet-block li.facet-value-item {
    border-bottom: 0;
    margin-bottom: 0;
  }
  #facet-filter-top .facet.select-wrapper .range-facet .slider-range-wrapper {
    margin-top: 35px;
  }
  #facet-filter-top .facet.select-wrapper .range-facet .slider-range-wrapper,
  #facet-filter-top .facet.select-wrapper .range-facet .slider-values {
    width: calc(100% - 40px);
    margin-left: auto;
    margin-right: auto;
  }
  #facet-filter-top .facet.select-wrapper .range-facet .slider-values input {
    width: 100px;
  }
  #facet-filter-top.loading::before {
    content: '';
    position: fixed;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background-color: white;
    opacity: 0.7;
    -webkit-transition: 1s;
    -moz-transition: 1s;
    -ms-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
  }
}

.mobile-facet-wrapper {
  padding: 10px 15px;
  /* general for mobile facets */
  /* for mobile categories */
  /* for mobile filters */
}

.mobile-facet-wrapper.facet-opened {
  height: calc(100vh - 67px);
  overflow: hidden;
}

.mobile-facet-wrapper.mobile-category .real-label,
.mobile-facet-wrapper.mobile-filter .dropdown__facet-head {
  position: relative;
}

.mobile-facet-wrapper.mobile-category .real-label::after,
.mobile-facet-wrapper.mobile-filter .dropdown__facet-head::after {
  font-family: 'hagebau-icomoon' !important;
  content: "\e91a";
  font-size: 8px;
  float: right;
}

.mobile-facet-wrapper .facet {
  width: 100%;
  font-size: 14px;
}

.mobile-facet-wrapper .facet .link-facet-go-back-wrapper {
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 8px;
  padding-bottom: 8px;
  margin-right: 15px;
}

.mobile-facet-wrapper .facet .link-facet-go-back-wrapper i {
  padding-right: 10px;
  font-size: 8px;
}

.mobile-facet-wrapper .facet .facet.select-wrapper,
.mobile-facet-wrapper .facet .facet-block > li,
.mobile-facet-wrapper .facet .parent-category > li,
.mobile-facet-wrapper .facet .siblings > li:not(:last-child) {
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 8px;
}

.mobile-facet-wrapper .facet .real-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  font-weight: 400;
  margin-bottom: 8px;
}

.mobile-facet-wrapper.mobile-category {
  padding: 10px 20px;
}

.mobile-facet-wrapper.mobile-category .categories .facetHead {
  display: none;
}

.mobile-facet-wrapper.mobile-category .facet .hasSelection li.level1:not(.selected-category-path),
.mobile-facet-wrapper.mobile-category .facet .hasSelection li.level1.selected-category-path:not(.active-facetvalue) > a > .real-label,
.mobile-facet-wrapper.mobile-category .facet .hasSelection li.level2.selected-category-path:not(.active-facetvalue) li.level3:not(.active-facetvalue),
.mobile-facet-wrapper.mobile-category .facet .hasSelection li.level1.selected-category-path:not(.active-facetvalue) li.level2:not(.selected-category-path) {
  display: none;
}

.mobile-facet-wrapper.mobile-category .facet .hasSelection li.selected-category-path > a > .real-label {
  border-bottom: 1px solid #f0f0f0;
  padding-bottom: 8px;
}

.mobile-facet-wrapper.mobile-category .facet .hasSelection li.selected-category-path > a > .real-label::after {
  content: '';
}

.mobile-facet-wrapper.mobile-category .facet .siblings > li:first-child {
  margin-top: 15px;
}

.mobile-facet-wrapper.mobile-category .facet .active-facetvalue > a .real-label,
.mobile-facet-wrapper.mobile-category .facet .selected-category-path > a .real-label {
  font-weight: 700;
}

.mobile-facet-wrapper.mobile-category .facet .active-facetvalue > a {
  color: #000;
}

.mobile-facet-wrapper.mobile-filter {
  padding: 10px 20px;
}

.mobile-facet-wrapper.mobile-filter .applied-filter-wrapper {
  margin-left: -10px;
  margin-bottom: 8px;
  border-bottom: 1px solid #f0f0f0;
}

.mobile-facet-wrapper.mobile-filter .applied-filter-wrapper .filter-header {
  margin-left: 10px;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper {
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 8px;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper:not(.active) .dropdown__facet-values {
  display: none;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper.active .dropdown__facet-head {
  font-weight: bold;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper.active .dropdown__facet-head::after {
  transform: rotate(90deg);
  margin-right: 10px;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper.active .dropdown__facet-values {
  margin-left: 10px;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .dropdown__facet-head {
  border: 0;
  height: auto;
  margin-bottom: 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left: 0;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .dropdown__facet-head .dropdown-fake {
  display: none;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .dropdown__facet-head::after {
  margin-right: 10px;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .dropdown__facet-values:not(.facet-values--color) label.pseudo-checkbox {
  display: block;
  margin-bottom: 0;
  line-height: 24px;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .dropdown__facet-values:not(.facet-values--color) span.checkbox,
.mobile-facet-wrapper.mobile-filter .select-wrapper .dropdown__facet-values:not(.facet-values--color) span.radio-button {
  float: right;
  margin: 2px 0 0 0;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .dropdown__facet-values:not(.facet-values--color) span.radio-button .radio-inner {
  position: relative;
  left: 2px;
  top: 2px;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .dropdown__facet-values:not(.facet-values--color) .text__middle {
  width: calc(100% - 235px);
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .dropdown__facet-values:not(.facet-values--color) .text__right {
  min-width: 30px;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .facet-values--color .link-facet-go-back-wrapper {
  margin-bottom: 25px;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .facet-values--color .facet-block li.facet-value-item {
  border-bottom: 0;
  margin-bottom: 0;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .range-facet .slider-range-wrapper {
  margin-top: 35px;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .range-facet .slider-range-wrapper,
.mobile-facet-wrapper.mobile-filter .select-wrapper .range-facet .slider-values {
  width: calc(100% - 40px);
  margin-left: auto;
  margin-right: auto;
}

.mobile-facet-wrapper.mobile-filter .select-wrapper .range-facet .slider-values input {
  width: 100px;
}

/* *************** */
/* //mobile-facets */
/* *************** */
/* ************ */
/* START big VP */
/* ************ */
@media (min-width: 768px) {
  #facet-filter-top .facet-filter {
    max-height: 104px;
    overflow: hidden;
  }
  #facet-filter-top .facet-filter .facet .bubble-red {
    display: block;
    position: absolute;
    top: -6px;
    right: -7px;
    border: 2px solid #000;
    border-radius: 50%;
    height: 18px;
    width: 18px;
    background-color: #000;
  }
  #facet-filter-top .facet-filter .facet .bubble-red .bubble-counter {
    position: absolute;
    top: -12px;
    right: 3px;
    color: white;
    font-weight: bold;
  }
}

/* *********** */
/* END  big VP */
/* *********** */
/* ************** */
/* START small VP */
/* ************** */
@media (max-width: 767px) {
  #filter-popup-handle,
  #category-facet-popup-handle,
  #filter-facet-popup-handle {
    height: 30px;
    line-height: 28px;
    font-size: 12px;
  }
}

/* ************ */
/* END small VP */
/* ************ */
form .form-group {
  margin-bottom: 10px;
}

form .form-group label {
  font-weight: 300;
  margin-bottom: 5px;
}

form .form-group.errorMargin {
  margin-bottom: 31px;
}

form .mandatory:before {
  content: " *";
}

form .form-group.error label {
  color: #de0019;
}

form .form-group.error .mandatory {
  color: #de0019;
}

form .form-group.error input,
form .form-group.error textarea,
form .form-group.error select,
form .form-group.error label.pseudo-checkbox-block {
  color: #de0019;
  background: #FCF3F4;
  border: 1px solid #de0019;
}

form .form-group.error .help-inline span {
  color: #de0019;
  font-size: 12px;
  font-weight: 300;
}

form .required {
  margin-top: 10px;
  color: #595858;
}

form .form-error {
  padding-top: 5px;
  color: #de0019;
  font-weight: 400;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
  display: none;
}

input[type=number] {
  -moz-appearance: textfield;
}

.wishlist-popup input {
  width: 100%;
}

.wishlist-popup textarea {
  min-height: 61px;
  min-width: 100%;
  max-width: 100%;
  height: 61px;
  overflow: hidden;
  padding-top: 9px;
  padding-bottom: 9px;
  line-height: 1.5em;
}

@media (max-width: 767px) {
  .wishlist-popup .input-column {
    width: 100%;
  }
  .wishlist-popup textarea {
    max-width: 100%;
  }
  .wishlist-popup button {
    width: 100%;
  }
  .wishlist-popup .message-close {
    width: auto;
  }
}

.wishlist-popup .description {
  color: #3e4954;
  margin-left: 35px;
  font-weight: 300;
  font-size: 12px;
}

.wishlist-popup .listentry {
  margin-bottom: 10px;
  list-style-type: none;
}

.wishlist-popup .wishlist-box {
  margin-bottom: 0px;
}

@media (max-width: 767px) {
  .wishlist-popup ul {
    padding-left: 0px;
    padding-right: 0px;
    width: 100%;
  }
  .wishlist-popup .listentry {
    padding-left: 10px;
    padding-right: 15px;
  }
}

.wishlist-popup .bottom-row {
  margin-top: 30px;
  margin-bottom: 0px;
}

.wishlist-popup .bottom-row button.right {
  align: right;
}

@media (min-width: 768px) {
  .wishlist-popup .bottom-row .col-sm-6:last-child {
    text-align: right;
  }
}

@media (max-width: 767px) {
  .wishlist-popup .bottom-row .col-sm-6:last-child {
    margin-top: 20px;
  }
  .wishlist-popup .bottom-row .col-xs-12,
  .wishlist-popup .bottom-row .col-sm-6 {
    text-align: center;
  }
}

.account-customer-data {
  padding: 20px 0px 20px 0px;
}

.account-customer-data .customer-text {
  padding-right: 60px;
}

.account-customer-data .customer-hint-text {
  padding-right: 60px;
  font-weight: 300;
  font-size: 12px;
}

@media (max-width: 767px) {
  .account-customer-data .customer-hint-text {
    font-size: 11px;
  }
}

.localMessage,
.globalMessages,
#globalMessages {
  color: #FFF;
  font-weight: 400;
}

.localMessage .message-icon,
.globalMessages .message-icon,
#globalMessages .message-icon {
  background: transparent;
  position: absolute;
  line-height: 38px;
  border: none;
  border-right: 1px solid white;
  height: 100%;
  width: 40px;
  top: 0;
  left: 0;
  padding-left: 11px;
}

.localMessage .alert,
.globalMessages .alert,
#globalMessages .alert {
  display: flex;
  justify-content: space-between;
  padding: 5px 0px 5px 41px;
  border: 0;
  margin: 0 -5px 0px -5px;
  min-height: 40px;
  line-height: 30px;
  position: relative;
}

.localMessage .alert .message,
.globalMessages .alert .message,
#globalMessages .alert .message {
  display: inline-flex;
  vertical-align: right;
  padding-right: 15px;
  padding-left: 15px;
}

.localMessage .alert.negative,
.globalMessages .alert.negative,
#globalMessages .alert.negative {
  background: #de0019;
}

.localMessage .alert.neutral,
.globalMessages .alert.neutral,
#globalMessages .alert.neutral {
  background: #5E5F61;
}

.localMessage .alert.positive,
.globalMessages .alert.positive,
#globalMessages .alert.positive {
  background: #127f3e;
}

.siteMessages #no-product-price-message {
  text-align: center;
  background-color: #eba8a8;
  height: 50px;
  width: 100%;
  display: table;
}

.siteMessages #no-product-price-message .message {
  vertical-align: middle;
  display: table-cell;
  line-height: 18px;
}

.link-global-msg {
  color: #FFF;
  font-weight: 700;
}

.link-global-msg:hover, .link-global-msg:active, .link-global-msg:focus {
  color: #FFF;
  text-decoration: underline;
}

.alert .gm-close-icon {
  cursor: pointer;
}

.alert .gm-close-icon i {
  font-size: 15px;
}

.modal .gm-close-icon {
  display: none;
}

/* General */
.userLogin input,
.userLogin .select-wrapper {
  width: 100%;
}

.userLogin .description {
  color: #595858;
  margin-left: 35px;
  font-weight: 300;
  font-size: 12px;
}

@media (max-width: 767px) {
  .userLogin .btn {
    width: 100%;
  }
  .userLogin input {
    width: 100%;
    padding-left: 10px;
  }
  .userLogin ul {
    padding-left: 0px;
    padding-right: 0px;
    width: 100%;
  }
}

#login-tag #loginForm {
  padding: 0 10px;
  background-color: rgba(255, 255, 255, 0.8);
}

#login-tag .guest-form {
  background-color: rgba(255, 255, 255, 0.8);
  padding: 0 10px;
}

#login-tag h2, #login-tag p {
  margin-bottom: 20px;
}

#login-tag .form-actions {
  margin: 20px 0;
}

#login-tag .forgot-password .password-forgotten:before {
  font-family: 'hagebau-icomoon';
  font-size: 8px;
  padding-right: 5px;
  content: '\e91a';
  vertical-align: middle;
}

.user-basestores label:first-child {
  margin-top: 10px;
}

.user-basestores .pseudo-checkbox-block .real-label {
  display: block;
  padding-left: 40px;
}

#updatePwdForm .password-controls,
#loginForm .password-controls,
#updatePasswordForm .password-controls,
#customerResetPasswordForm .password-controls {
  position: relative;
}

#updatePwdForm .icon-preview.password,
#loginForm .icon-preview.password,
#updatePasswordForm .icon-preview.password,
#customerResetPasswordForm .icon-preview.password {
  position: absolute;
  right: 20px;
  line-height: 40px;
}

@media (hover: hover) {
  #updatePwdForm .icon-preview.password:hover,
  #loginForm .icon-preview.password:hover,
  #updatePasswordForm .icon-preview.password:hover,
  #customerResetPasswordForm .icon-preview.password:hover {
    cursor: pointer;
  }
}

/* General */
@media all {
  .siteSearch {
    position: relative;
  }
  .siteSearch .siteSearchSubmit {
    border: none;
    min-width: auto;
    color: #fff;
    background-color: #000;
    position: absolute;
    right: 0;
    padding: 0 18px;
  }
  .siteSearch .siteSearchSubmit i {
    padding: 0;
    float: none;
    color: #fff;
  }
  .siteSearch .siteSearchSubmit:hover {
    color: #fff;
    background-color: #000;
  }
  .siteSearch .siteSearchSubmit:hover i {
    color: #fff;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete {
    background: #fff;
    list-style-type: none;
    overflow-y: auto;
    position: absolute;
    top: 48px !important;
    left: calc(-50% - 20px) !important;
    padding: 20px;
    border: 1px solid #595858;
    width: 200% !important;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete .close-icon {
    cursor: pointer;
    font-size: 1.2em;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete .close-icon:hover {
    color: #127f3e;
  }
}

@media all and (min-width: 969px) {
  .siteSearch ul[id^='ui-id'].ui-autocomplete .suggest-tab {
    width: calc(30% - 40px);
  }
}

@media all {
  .siteSearch ul[id^='ui-id'].ui-autocomplete .suggest-tab a {
    font-size: 14px;
    line-height: 20px;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete .suggest-tab .icon-search {
    font-size: 15px;
    padding: 0 5px;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete .suggest-tab.suggestions {
    padding: 10px 0;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete .suggest-tab.suggestions:not(:last-child) {
    border-bottom: 1px solid #f0f0f0;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete .autoSuggestLowerSection {
    display: none;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete .searchAllProductsBtn {
    margin: 15px 0;
    width: 100%;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete .searchAllProductsBtn:after {
    content: '';
  }
  .siteSearch li#lowerSectionContainer {
    clear: left;
    float: right;
  }
}

@media all and (min-width: 970px) {
  .siteSearch li#lowerSectionContainer {
    width: 70%;
    column-gap: 20px;
    columns: 2;
  }
  .siteSearch li#lowerSectionContainer[data-columns="1"] {
    columns: 1;
  }
}

@media all {
  .siteSearch li#lowerSectionContainer ul {
    display: block !important;
    break-before: column;
    list-style: none;
    padding-inline-start: 0px;
  }
  .siteSearch li#lowerSectionContainer ul li {
    width: 100%;
  }
  .siteSearch li#lowerSectionContainer ul li.head {
    margin-top: 10px;
  }
  .siteSearch li#lowerSectionContainer ul#categoryList {
    left: 0 !important;
  }
  .siteSearch li#lowerSectionContainer ul#categoryList li {
    float: left;
  }
  .siteSearch li#lowerSectionContainer ul#contentList {
    left: 0 !important;
  }
  .siteSearch li#lowerSectionContainer ul#contentList li {
    float: right;
  }
  .siteSearch li {
    position: relative;
    padding: 0;
    color: #3e4954;
  }
  .siteSearch li.suggest-element:hover, .siteSearch li.suggest-element.ui-state-focus {
    background: #f0f0f0;
    cursor: pointer;
  }
  .siteSearch li.product-tab, .siteSearch li.content-tab, .siteSearch li.category-tab {
    float: right;
    width: 70%;
  }
  .siteSearch li.suggestCategories {
    padding: 5px 0;
  }
  .siteSearch li.product-tab.product-tab-main:not(:last-of-type) {
    border-bottom: 1px solid #f0f0f0;
  }
  .siteSearch li.product-tab.product-tab-main img {
    border: 1px solid #f0f0f0;
  }
  .siteSearch li.content-tab.content-tab-main:not(:last-of-type) {
    border-bottom: 1px solid #f0f0f0;
  }
  .siteSearch li .title small {
    font-style: italic;
  }
  .siteSearch a {
    font-size: 16px;
    color: #3e4954;
    min-height: 20px;
  }
  .siteSearch a:before, .siteSearch a:after {
    content: none;
  }
  .siteSearch a:hover {
    color: #3e4954;
  }
  .siteSearch .head {
    border-bottom: 1px solid #595858;
  }
  .siteSearch .nomatch,
  .siteSearch .suggestions,
  .siteSearch .contentSuggestions {
    padding: 5px;
  }
  .siteSearch .product-tab .thumb {
    margin: 10px 0px;
  }
  .siteSearch .product-tab .desc {
    margin: 10px 0px;
  }
  .siteSearch .product-tab .desc .title {
    font-size: 14px;
    line-height: 20px;
    height: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .siteSearch .product-tab .desc .productNumber {
    font-size: 12px;
    line-height: 18px;
    height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .siteSearch .content-tab .desc {
    width: 100%;
    padding: 5px 0;
  }
  .siteSearch .content-tab .desc .title {
    max-height: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .siteSearch .content-tab .desc .contentTab {
    font-size: 13px;
    max-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  /* special case no product search */
  ul.no-product-suggest {
    width: calc(100% - 20px) !important;
    left: 0px !important;
  }
  ul.no-product-suggest li {
    width: 90% !important;
    margin-left: 20px !important;
  }
}

@media (max-width: 970px) {
  .siteSearch ul[id^='ui-id'].ui-autocomplete {
    max-height: calc(100vh - 250px);
  }
}

@media (min-width: 970px) {
  .search-box-wrapper {
    padding-left: 0;
    padding-right: 0;
  }
  .siteSearch .siteSearchInput {
    width: 100%;
    background-color: transparent;
    border: 1px solid #595858;
  }
  .siteSearch .siteSearchInput:hover, .siteSearch .siteSearchInput:focus {
    border-color: #3e4954;
  }
  li.content-tab-main:nth-child(-n+1) {
    border-top: none;
  }
}

@media (min-width: 970px) and (max-width: 1199px) {
  .siteSearch .siteSearchInput {
    padding-right: 65px;
  }
  .siteSearch .siteSearchSubmit .button-label {
    display: none;
  }
}

@media (min-width: 1200px) {
  .siteSearch .siteSearchInput {
    padding-right: 115px;
  }
}

@media (max-width: 969px) {
  .search-box-wrapper {
    padding-left: 0;
    padding-right: 0;
  }
  .siteSearch {
    position: absolute;
    top: 60px;
    left: 0;
    display: none;
    width: 100%;
    background-color: transparent;
    z-index: 100;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete {
    left: 0px !important;
    width: 100% !important;
  }
  .siteSearch li.product-tab {
    float: none;
    margin: 0 30px 0 20px;
  }
  .siteSearch li.product-tab.product-tab-text {
    width: calc(100% - 20px);
  }
  .siteSearch li.product-tab.product-tab-main {
    width: calc(100% - 20px);
  }
  .siteSearch li.product-tab.product-tab-main:not(:last-of-type) {
    border-bottom: 1px solid #f0f0f0;
  }
  .siteSearch li.product-tab.product-tab-main:nth-child(1) {
    border-top: none;
  }
  .siteSearch li.content-tab {
    float: none;
    margin-left: 20px;
    width: 100%;
  }
  .siteSearch li.suggest-tab {
    float: none;
    width: 100%;
  }
  .siteSearch .productNumber {
    display: none;
  }
  .siteSearch .thumb,
  .siteSearch .desc {
    margin: 5px 0px !important;
  }
  .siteSearch input {
    padding: 0 3%;
    width: 100%;
    border: none;
    border: solid 1px #595858;
    background-color: #fff;
  }
  .siteSearch .siteSearchSubmit {
    right: 0;
    padding: 0;
  }
  .siteSearch .siteSearchSubmit .button-label {
    display: none;
  }
  li.product-tab-main:nth-child(-n+2) {
    border-top: none !important;
  }
}

.codescanner {
  position: absolute;
  border: none;
  opacity: .8;
}

@media (max-width: 768px) {
  .siteSearch ul[id^='ui-id'].ui-autocomplete {
    left: 0 !important;
    top: 40px !important;
    width: 100% !important;
    border: none !important;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete .autoSuggestLowerSection {
    display: none;
  }
  .siteSearch ul[id^='ui-id'].ui-autocomplete .searchAllProductsBtn {
    margin: 15px 0;
    width: 100%;
  }
  .siteSearch li.product-tab {
    float: none;
    margin: 0;
    width: 100%;
  }
  .siteSearch li.product-tab.head {
    width: 100%;
  }
  .siteSearch li.product-tab.product-tab-text {
    margin: 0;
  }
  .siteSearch li.product-tab.product-tab-main {
    width: 100%;
    min-height: 50px;
  }
  .siteSearch li.product-tab a.product {
    display: flex;
    height: 100%;
  }
  .siteSearch li.product-tab a.product .title b {
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .siteSearch li.category-tab {
    float: none;
  }
  .siteSearch li.content-tab {
    float: none;
    margin-left: 0;
    width: 100%;
  }
}

@media (min-width: 768px) and (max-width: 969px) {
  .siteSearch .codescanner {
    right: 55px;
  }
}

@media (max-width: 767px) {
  .siteSearch .codescanner {
    right: 50px;
  }
}

@media (max-width: 400px) {
  .siteSearch .codescanner {
    right: 40px;
  }
}

.dce-video-container {
  height: 80vh;
  width: 100%;
  object-fit: fill;
}

/* placement for sticky header tooltips */
#sticky-header-wrapper .tooltip {
  margin-top: 10px;
}

.page-cartPage .action-wrapper .tooltip {
  text-transform: none !important;
}

/*!
 * Datepicker for Bootstrap
 *
 * Copyright 2012 Stefan Petre
 * Licensed under the Apache License v2.0
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 */
.datepicker {
  top: 0;
  left: 0;
  padding: 4px;
  margin-top: 1px;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #000 88px, white 50px);
  min-width: 320px;
  border: unset;
}

@media (min-width: 768px) {
  .datepicker:before, .datepicker:after {
    content: '';
    display: inline-block;
    position: absolute;
  }
  .datepicker.datepicker-orient-top:before, .datepicker:not(.datepicker-orient-bottom):before {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #ccc;
    border-bottom-color: rgba(0, 0, 0, 0.2);
    top: -7px;
  }
  .datepicker.datepicker-orient-top:after, .datepicker:not(.datepicker-orient-bottom):after {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #ffffff;
    top: -6px;
  }
  .datepicker.datepicker-orient-bottom:before {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 7px solid #ccc;
    border-top-color: rgba(0, 0, 0, 0.2);
    bottom: -7px;
  }
  .datepicker.datepicker-orient-bottom:after {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #ffffff;
    bottom: -6px;
  }
  .datepicker.datepicker-orient-left:before, .datepicker:not(.datepicker-orient-right):before {
    left: 6px;
  }
  .datepicker.datepicker-orient-left:after, .datepicker:not(.datepicker-orient-right):after {
    left: 7px;
  }
  .datepicker.datepicker-orient-right:before {
    right: 6px;
  }
  .datepicker.datepicker-orient-right:after {
    right: 7px;
  }
}

.datepicker table {
  width: 100%;
  margin: 0;
}

.datepicker table td, .datepicker table th, .datepicker .table td, .datepicker .table th {
  border-color: #fff;
}

.datepicker td, .datepicker th {
  text-align: center;
  width: 40px;
  height: 40px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  font-weight: 300;
}

.datepicker td.day:not(.disabled):hover {
  background: #000;
  cursor: pointer;
  color: white;
  border-radius: 50%;
}

.datepicker td.day.disabled {
  color: #999;
  background: #f3f3f3;
  cursor: not-allowed !important;
  border-radius: unset !important;
}

.datepicker td.old,
.datepicker td.new {
  color: #999999;
}

.datepicker td.active,
.datepicker td.active:not(.disabled):hover {
  color: white;
  background-color: #127f3e;
  border-radius: 50%;
}

.datepicker td.active:hover,
.datepicker td.active:hover:hover,
.datepicker td.active:focus,
.datepicker td.active:hover:focus,
.datepicker td.active:active,
.datepicker td.active:hover:active,
.datepicker td.active.active,
.datepicker td.active:hover.active,
.datepicker td.active.disabled,
.datepicker td.active:hover.disabled,
.datepicker td.active[disabled],
.datepicker td.active:hover[disabled] {
  color: #ffffff;
  background-color: #127f3e;
}

.datepicker td.active:active,
.datepicker td.active:hover:active,
.datepicker td.active.active,
.datepicker td.active:hover.active {
  background-color: #127f3e;
}

.datepicker .datepicker-months td, .datepicker .datepicker-years td {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 20px;
  height: 250px;
  font-size: large;
}

.datepicker .datepicker-years td span, .datepicker .datepicker-months td span {
  display: block;
  width: 56px;
  height: 56px;
  line-height: 56px;
  float: left;
  margin: 2px;
  cursor: pointer;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  font-weight: bold;
}

.datepicker td.datepicker-day-entry.day {
  width: 38px;
  height: 38px;
  cursor: pointer;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  font-weight: bold;
}

.datepicker td:not(.disabled) span:hover {
  background: #000;
  color: white;
}

.datepicker td span.active {
  color: white;
  background-color: #000;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
}

.datepicker td span.active:hover,
.datepicker td span.active:focus,
.datepicker td span.active:active,
.datepicker td span.active.active,
.datepicker td span.active.disabled,
.datepicker td span.active[disabled] {
  color: white;
  background-color: #127f3e;
}

.datepicker td span.active:active,
.datepicker td span.active.active {
  background-color: #127f3e;
}

.datepicker td span.old {
  color: #999999;
}

.datepicker th.next, .datepicker th.prev {
  background-color: #000;
  color: white;
  font-size: xx-large;
  font-weight: bold;
}

.datepicker th.next i,
.datepicker th.prev i {
  font-size: 16px;
}

.datepicker thead tr:first-child th {
  cursor: pointer;
  line-height: 34px;
}

.datepicker thead tr:first-child th:hover {
  background-color: black;
}

.datepicker .datepicker-switch {
  font-weight: bolder;
  font-size: x-large;
  width: 145px;
  text-transform: uppercase;
  background-color: #000;
  color: white;
}

.datepicker .datepicker-label {
  width: 100%;
  text-align: left;
  background-color: #000;
  color: white;
  font-weight: bold;
}

@media screen and (min-width: 768px) {
  .datepicker {
    background-image: linear-gradient(to bottom, #000 44px, white 0px);
  }
  .datepicker .datepicker-label {
    display: none;
  }
  .datepicker .datepicker-switch, .datepicker .next, .datepicker .prev {
    font-size: small;
    line-height: unset !important;
    padding: unset !important;
  }
  .datepicker .next, .datepicker .prev {
    font-size: medium !important;
  }
  .datepicker .datepicker-months td, .datepicker .datepicker-years td {
    font-size: medium !important;
  }
}

.datepicker .datepicker-days td.day:focus,
.datepicker .datepicker-days td.day.focused {
  background: #f0f0f0;
  outline: 2px solid #3e4954;
  color: #3e4954;
}

.datepicker > div {
  display: none;
}

.input-append.date .add-on i,
.input-prepend.date .add-on i {
  display: block;
  cursor: pointer;
  width: 16px;
  height: 16px;
}

.bomForm .btn-function i {
  padding: 0;
  float: none;
}

.bomForm textarea.form-control {
  max-width: 100%;
}

.bomForm .flex-row {
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-align-items: baseline;
  -ms-flex-align: end;
  align-items: baseline;
}

.bomForm .flex-row .control-label {
  width: 100%;
}

.bomForm .bom-error {
  border-color: #de0019;
}

@media (min-width: 768px) {
  .bomForm .pos-relative {
    position: relative;
  }
  .bomForm .pos-bottom {
    position: absolute;
    bottom: 10px;
    right: 0;
  }
  .bomForm .flex-row .last.col-sm-3 {
    width: 24%;
  }
  .bomForm .flex-row .last.col-sm-6 {
    width: 49%;
  }
  .bomForm .flex-row .last.col-sm-9 {
    width: 74%;
  }
}

.bomForm .btn-primary:after,
.bomForm .btn-secondary:after,
.bomForm .btn-function:after,
.bomForm .btn-ghost-icon:after {
  content: normal;
}

.bomDetails .info-block-header {
  height: auto;
  min-height: 40px;
}

/* override usercentrics styles */
.uc-embedding-container {
  min-height: unset;
}

.uc-embedding-wrapper {
  display: grid;
  place-items: center;
  height: 100%;
  width: 100%;
  max-width: unset;
  max-height: unset;
  border-radius: 0;
  top: 0;
  left: 0;
  transform: unset;
  border: 1px solid #595858;
  overflow: hidden auto;
}

.uc-embedding-wrapper span:empty {
  display: none;
}

/* get rid of huge padding if iframe content not loaded cuz no permission */
.awsArticleDetailsContent {
  /* currently no firefox support  */
}

.awsArticleDetailsContent div:not([class^='col']):has( > .uc-embedding-container) {
  padding: 0 !important;
}

/* custom cookiesettings management*/
.modal-cookie .text-link {
  text-decoration: underline;
}

.modal-cookie .checkbox-wrapper {
  margin-top: 35px;
}

.modal-cookie .checkbox-wrapper .real-label {
  font-weight: 700;
  font-size: 18px;
}

.modal-cookie label[for="mandatory"] {
  cursor: not-allowed !important;
  pointer-events: none !important;
  -moz-appearance: none !important;
}

.modal-cookie .details-wrapper .details-text,
.modal-cookie .details-wrapper .show-less {
  display: none;
}

.modal-cookie .details-wrapper .details-btn {
  text-align: right;
  margin-bottom: 20px;
}

.modal-cookie .details-wrapper .details-btn i {
  padding-left: 5px;
  vertical-align: baseline;
}

.modal-cookie .details-wrapper .details-btn i:before {
  transition-duration: 0.4s;
  transition-property: transform;
  display: inline-block;
  padding-top: 2px;
}

.modal-cookie .details-wrapper .details-text p {
  margin-bottom: 20px;
}

.modal-cookie .details-wrapper input#detailsBtn:checked ~ div.details-btn .show-more {
  display: none;
}

.modal-cookie .details-wrapper input#detailsBtn:checked ~ div.details-btn .show-less {
  display: inline-block;
}

.modal-cookie .details-wrapper input#detailsBtn:checked ~ div.details-btn i:before {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.modal-cookie .details-wrapper input#detailsBtn:checked ~ div.details-text {
  display: block;
}

.modal-cookie .details-text {
  margin-top: 30px;
}

.modal-cookie .legal-notice {
  position: absolute;
  left: 10px;
  bottom: 0;
}

.modal-cookie #submitAll {
  /* HAG-5027: set hover effect from btn primary to submitAll button*/
}

.modal-cookie #submitAll:hover, .modal-cookie #submitAll:focus, .modal-cookie #submitAll.focus, .modal-cookie #submitAll:active {
  background-color: #000;
  color: white;
  border-color: #000;
}

.modal-cookie #submitAll:hover i, .modal-cookie #submitAll:focus i, .modal-cookie #submitAll.focus i, .modal-cookie #submitAll:active i {
  color: white;
}

@media (min-width: 768px) {
  .modal-cookie .details-wrapper {
    margin-top: 35px;
  }
  .modal-cookie .button-wrapper {
    display: flex;
    justify-content: flex-end;
    position: relative;
    margin-top: 40px;
  }
  .modal-cookie .button-wrapper .btn {
    float: right;
  }
  .modal-cookie #submitAll {
    margin-left: 40px;
  }
}

@media (max-width: 767px) {
  .modal-body.cookie .modal-header {
    padding: 0 5px;
  }
  .modal-body.cookie .modal-body {
    padding-top: 5px;
  }
  .modal-body.cookie .modal-body p {
    line-height: 18px;
    margin-bottom: 5px;
  }
  .modal-cookie .checkbox-wrapper {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .modal-cookie .checkbox-wrapper .checkbox-section:not(:last-child) .pseudo-checkbox {
    margin-bottom: 15px;
  }
  .modal-cookie .details-wrapper {
    margin-top: 5px;
  }
  .modal-cookie .details-wrapper .details-btn {
    margin-bottom: 5px;
  }
  .modal-cookie .button-wrapper {
    margin-top: 0;
  }
  .modal-cookie .button-wrapper .btn {
    width: 100%;
  }
  .modal-cookie #submitAll {
    float: right;
    margin-top: 15px;
    margin-bottom: 30px;
  }
}

.tabs-wrapper__container {
  display: flex;
  overflow: hidden;
}

.tabs-wrapper__container > .tab-wrapper:not(:only-child) .tab-link--first {
  transform: skew(-25deg);
}

.tabs-wrapper__container > .tab-wrapper:not(:only-child) .tab-link--first.active {
  transform: skew(25deg);
}

.tabs-wrapper__container > .tab-wrapper:not(:only-child) .tab-link--second {
  transform: skew(25deg);
}

.tabs-wrapper__container > .tab-wrapper:not(:only-child) .tab-link--second.active {
  transform: skew(-25deg);
}

.tabs-wrapper__container > .tab-wrapper:not(:only-child):first-child {
  margin-left: -15px;
}

.tabs-wrapper__container > .tab-wrapper:not(:only-child):first-child .tab-label {
  right: 50%;
  left: unset;
  transform: translate(50%, -50%);
}

.tabs-wrapper__container > .tab-wrapper:not(:only-child):not(:first-child) {
  margin-left: 5px;
}

.tabs-wrapper__container > .tab-wrapper:not(:only-child):last-child {
  margin-right: -15px;
}

.tabs-wrapper__container > .tab-wrapper:not(:only-child):last-child .tab-label {
  left: 50%;
  right: unset;
  transform: translate(-50%, -50%);
}

.tabs-wrapper__container .tab-wrapper {
  width: 100%;
  position: relative;
}

.tabs-wrapper__container .tab-label {
  left: 50%;
  transform: translate(-50%, -50%);
}

.tabs-wrapper__container .tab-label {
  margin: 0;
  white-space: normal;
  position: absolute;
  top: calc(50% - 2px);
  width: calc(100% - 50px);
  text-align: center;
  z-index: 30;
  pointer-events: none;
  font-size: 14px;
}

.tabs-wrapper__container .tab-link {
  border: 0;
  outline: 0;
  height: 60px;
  line-height: 60px;
  width: 100%;
  background-color: #dadada;
  position: relative;
}

.tabs-wrapper__container .tab-link:not(.active) {
  z-index: 20;
}

.tabs-wrapper__container .tab-link.active {
  background-color: #fff;
}

.animate {
  content: "";
  width: 40px;
  height: 40px;
  display: block;
  border-radius: 50%;
  background-color: #3399FF;
  z-index: 1;
  opacity: .5;
  position: absolute;
  top: calc(50% - 20px);
  animation: pulse 2s 15;
}

#pop-cancel {
  float: right;
  margin-top: 14px;
  margin-right: 5px;
  line-height: 20px;
}

#pop-body {
  min-width: 150px;
}

#pop-cancel,
.popover-title,
.popover-content {
  color: #3e4954 !important;
}

@keyframes pulse {
  0% {
    transform: scale(0.8);
    box-shadow: 0 0 0 0 rgba(102, 178, 255, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(102, 178, 255, 0);
  }
  100% {
    transform: scale(0.8);
    box-shadow: 0 0 0 0 rgba(102, 178, 255, 0);
  }
}

#bottomPanelInstall {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: fixed;
  bottom: 0;
  width: 100%;
  height: auto;
  border-width: 0 1px 1px 1px;
  border-style: solid;
  border-color: #595858;
  background-color: #FFF;
  z-index: 10;
  -moz-box-shadow: 0 -2px 5px #888;
  -webkit-box-shadow: 0 -2px 5px #888;
  box-shadow: 0 -2px 5px #888;
}

#bottomPanelInstallBtn {
  display: flex;
  flex-direction: row;
  align-items: center;
  word-wrap: normal;
}

#bottomPanelInstallBtn p {
  color: #3e4954;
  padding-right: 15px;
  padding-top: 5px;
}

#bottomPanelInstallBtn img {
  margin-right: 15px;
}

#bottomPanelCloseBtn {
  position: absolute;
  right: 0;
  bottom: calc(50% - 5px);
  opacity: 1;
}

#bottomPanelCloseBtn i {
  margin-right: 15px;
  font-size: 10px;
  font-weight: bolder;
  color: black;
}

.plzAppend {
  position: absolute;
  top: 0;
  left: 0;
}

.plzAppend .ui-menu {
  width: 150px;
  border: 1px solid black;
  max-height: 25vh;
  overflow-y: scroll;
  overflow-x: hidden;
}

.plzAppend .ui-menu .ui-menu-item {
  background-color: #fff;
  color: #000;
  max-height: 70px;
  margin-left: -40px;
  list-style: none;
  cursor: pointer;
  text-align: start;
}

.plzAppend .ui-menu .ui-menu-item :hover {
  background-color: lightgrey;
}

#postcodeDropdown {
  color: #000;
  text-decoration: underline #000;
  cursor: pointer;
}

#tabButtonWrapper {
  margin: 20px 0;
}

#tabButtonWrapper .tab-link {
  background-color: white;
  height: 40px;
  line-height: 40px;
}

#tabButtonWrapper .row-tabs-first {
  margin-bottom: 10px;
}

#tabButtonWrapper .row-tabs-first .tab-link.active {
  background-color: #000;
}

#tabButtonWrapper .row-tabs-first .tab-link.active ~ .tab-label {
  color: white;
}

#tabButtonWrapper .row-tabs-first .tab-link:hover:not(.active) {
  background-color: #000;
}

#tabButtonWrapper .row-tabs-first .tab-label {
  font-size: 18px;
  line-height: 20px;
  top: calc(50% - 1px);
}

#tabButtonWrapper .row-tabs-second .tabs-wrapper__container, #tabButtonWrapper .row-tabs-third .tabs-wrapper__container {
  min-height: 46px;
  gap: 5px;
}

#tabButtonWrapper .row-tabs-second .tabs-wrapper__container .tab-wrapper, #tabButtonWrapper .row-tabs-third .tabs-wrapper__container .tab-wrapper {
  margin-left: 0;
  margin-right: 0;
  min-width: calc(10% - 5px);
}

#tabButtonWrapper .row-tabs-second .tabs-wrapper__container .tab-link.active, #tabButtonWrapper .row-tabs-third .tabs-wrapper__container .tab-link.active {
  background-color: #fff;
  color: #127f3e;
}

#tabButtonWrapper .row-tabs-second .tabs-wrapper__container .tab-label, #tabButtonWrapper .row-tabs-third .tabs-wrapper__container .tab-label {
  font-size: 18px;
  line-height: 40px;
  white-space: nowrap;
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  transform: unset;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

#tabButtonWrapper .row-tabs-third .filter-facet-mobile-action {
  width: 50%;
  padding-left: 3px;
  float: right;
}

#tabButtonWrapper .row-tabs-third .filter-facet-mobile-action .btn.tab-link--first {
  background-color: #000;
  color: #fff;
}

#tabButtonWrapper .tabs-wrapper__container > .tab-wrapper:not(:only-child) .tab-link--first {
  transform: none;
}

#tabButtonWrapper .tabs-wrapper__container > .tab-wrapper:not(:only-child) .tab-link--first.active {
  transform: none;
}

#tabButtonWrapper .tabs-wrapper__container > .tab-wrapper:not(:only-child) .tab-link--second {
  transform: none;
}

#tabButtonWrapper .tabs-wrapper__container > .tab-wrapper:not(:only-child) .tab-link--second.active {
  transform: none;
}

#searchTabsContent {
  margin-left: -5px;
  margin-right: -5px;
  background-color: #f0f0f0;
}

#searchTabsContent .tabBody {
  margin-left: 5px;
  margin-right: 5px;
}

#searchTabsContent .pagination-col {
  border-bottom: 10px solid #f0f0f0;
}

.content-alt-tabs {
  width: 100%;
}

.content-alt-tabs ul {
  padding: 0px;
  list-style-type: none;
}

.content-alt-tabs li {
  margin: 5px 0px;
}

.tabBodyCms .sort-order,
.tabBodyCms .pagesize,
.tabBodyCms .current-page {
  width: 33.333333%;
}

@media (min-width: 1200px) {
  .tabBodyCms .pagesize {
    width: 50%;
  }
  .tabBodyCms .current-page,
  .tabBodyCms .sort-order {
    width: 25%;
  }
}

.tabBodyCms .paginationBar .sticked {
  width: 75%;
  max-width: 900px;
}

.tabBodyCms .contentListItem {
  position: relative;
}

.tabBodyCms .contentListItem .contentMainLink {
  position: relative;
  padding: 10px;
  display: inline-block;
  background: #fff;
  width: 100%;
}

.tabBodyCms .contentListItem .outer-image-box {
  padding-bottom: 75%;
  height: 0;
  position: relative;
  box-sizing: border-box;
}

.tabBodyCms .contentListItem .inner-image-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.tabBodyCms .contentListItem .centered-image {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.tabBodyCms .contentListItem .tileText {
  margin-top: 20px;
  font-size: 14px;
  word-wrap: break-word;
  overflow: hidden;
  line-height: 20px;
}

.tabBodyCms .contentListItem .tileText .title {
  font-weight: 600;
  height: 40px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tabBodyCms .contentListItem .tileText .description {
  font-weight: 400;
  margin-top: 10px;
  height: 60px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tabBodyCms .contentListItem .tileText .link {
  font-weight: 600;
  margin-top: 10px;
  height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
  text-transform: uppercase;
}

@media (max-width: 767px) {
  #tabButtonWrapper .tabs-wrapper__container .tab-wrapper .tab-label {
    font-size: 12px;
  }
  #tabButtonWrapper .row-tabs-second .tabs-wrapper__container {
    flex-wrap: wrap;
    gap: 10px;
  }
  #tabButtonWrapper .row-tabs-second .tab-wrapper {
    width: calc(50% - 5px) !important;
  }
  .tabBodyCms .facet-nav-col {
    margin-top: 10px;
  }
}

.toggle-component {
  text-align: center;
  background-color: white;
  padding-bottom: 20px;
}

.toggle-component .title {
  margin-bottom: 0;
  text-align: center;
}

.toggle-component .title:not(.white) {
  padding-top: 20px;
}

.toggle-component > .image {
  position: relative;
}

.toggle-component > .image .image-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.toggle-component > .image .image-wrapper .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  background: rgba(0, 0, 0, 0.2);
}

.toggle-component > .image .image-wrapper .overlay-partial {
  padding: 20px;
  display: inline-block;
  background: rgba(0, 0, 0, 0.3);
}

.toggle-component > .image .transparent-wrapper {
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
  text-align: center;
  padding-left: calc(3% - 40px);
  padding-right: calc(3% - 40px);
}

.toggle-component > .image .title.white {
  transition: ease font-size 0.2s;
  color: #fff;
}

.toggle-component > .image img {
  width: 100%;
}

.toggle-component > .toggle-btn {
  margin-top: 10px;
  min-width: calc(100% - 40px);
  transition: ease;
  transition-property: min-width;
  transition-duration: 1.5s;
}

.toggle-component > [type="checkbox"]:checked ~ label .show-less {
  display: none;
}

.toggle-component > [type="checkbox"]:not(:checked) ~ label .show-more {
  display: none;
}

.toggle-component > [type="checkbox"]:not(:checked) ~ .content-wrapper {
  max-height: 10000px;
}

.toggle-component > [type="checkbox"]:not(:checked) ~ .content-wrapper::after {
  opacity: 0;
  z-index: -1;
  transition: z-index 0.3s step-end, opacity 0.3s ease-in-out;
}

.toggle-component > .content-wrapper {
  text-align: left;
  max-height: 90px;
  overflow: hidden;
  position: relative;
  padding: 0 20px;
  margin-top: 20px;
  transition: max-height 0.3s ease-in-out;
}

.toggle-component > .content-wrapper::after {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: linear-gradient(transparent, #fff);
  transition: z-index 0.3s step-start, opacity 0.3s ease-in-out;
  opacity: 1;
  z-index: 1;
}

.toggle-component.btn-position-top {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  box-orient: vertical;
}

.toggle-component.btn-position-top > .image {
  -webkit-box-ordinal-group: 1;
  -moz-box-ordinal-group: 1;
  box-ordinal-group: 1;
}

.toggle-component.btn-position-top > .toggle-btn {
  -webkit-box-ordinal-group: 2;
  -moz-box-ordinal-group: 2;
  box-ordinal-group: 2;
  margin-top: 20px;
}

.toggle-component.btn-position-top > .content-wrapper {
  -webkit-box-ordinal-group: 3;
  -moz-box-ordinal-group: 3;
  box-ordinal-group: 3;
}

#content .toggle-elements > .yCmsComponent {
  margin-top: 0;
}

#content .toggle-elements .flexible-wrapper {
  margin-top: 0;
}

#content .toggle-elements .flexible-wrapper .yCmsComponent {
  margin-top: 0;
}

.yCmsComponent.sm .toggle-component > .image .transparent-wrapper,
.yCmsComponent.md .toggle-component > .image .transparent-wrapper,
.yCmsComponent.lg .toggle-component > .image .transparent-wrapper {
  padding-left: calc(16.6667% - 50px);
  padding-right: calc(16.6667% - 50px);
}

.yCmsComponent.sm .toggle-component > .image .overlay-partial,
.yCmsComponent.md .toggle-component > .image .overlay-partial,
.yCmsComponent.lg .toggle-component > .image .overlay-partial {
  padding: 25px;
}

.yCmsComponent.md .toggle-component > .toggle-btn,
.yCmsComponent.lg .toggle-component > .toggle-btn {
  min-width: 200px;
}

.floating-toggle-component * {
  transition: ease;
  transition-property: min-width,width;
  transition-duration: 0.5s;
}

.floating-toggle-component h1, .floating-toggle-component h2, .floating-toggle-component h3, .floating-toggle-component h4, .floating-toggle-component h5, .floating-toggle-component h6 {
  text-align: center;
  width: 100%;
}

.floating-toggle-component img {
  width: 100%;
  display: block;
}

.floating-toggle-component label {
  margin-top: 20px;
  cursor: pointer;
  width: 100%;
}

.floating-toggle-component [type="checkbox"]:checked + label.show-more {
  display: none;
}

.floating-toggle-component [type="checkbox"]:checked ~ div.long-text {
  display: block;
}

.floating-toggle-component .long-text {
  display: none;
  margin-bottom: 20px;
  margin-top: 20px;
}

.md .floating-toggle-component h1, .md .floating-toggle-component h3, .md .floating-toggle-component h4, .md .floating-toggle-component h5, .md .floating-toggle-component h6,
.md .floating-toggle-component h2:not(.title-wide),
.lg .floating-toggle-component h1,
.lg .floating-toggle-component h3,
.lg .floating-toggle-component h4,
.lg .floating-toggle-component h5,
.lg .floating-toggle-component h6,
.lg .floating-toggle-component h2:not(.title-wide) {
  text-align: left;
}

/* default settings - mobile */
.image-gallery {
  position: relative;
  overflow: hidden;
}

.image-gallery .image-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.image-gallery .image-wrapper img {
  width: 100%;
}

.image-gallery .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  background: rgba(0, 0, 0, 0.2);
}

.image-gallery .overlay-partial {
  padding: 20px;
  display: inline-block;
  background: rgba(0, 0, 0, 0.3);
}

.image-gallery .transparent-wrapper {
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
  color: #fff;
  text-align: center;
  padding-left: calc(3% - 40px);
  padding-right: calc(3% - 40px);
}

.image-gallery .transparent-wrapper .gallery-logo {
  max-width: 150px;
  max-height: 75px;
  margin-bottom: 5px;
}

.image-gallery .transparent-wrapper .headline {
  margin-bottom: 5px;
}

.image-gallery .transparent-wrapper .details {
  font-size: 14px;
  line-height: 18px;
  margin-bottom: 15px;
}

.image-gallery .transparent-wrapper .action {
  margin-top: 15px;
  width: 100%;
}

.image-gallery * {
  transition: ease;
  transition-property: line-height,margin-top,margin-bottom,margin-right,margin-left,font-size;
  transition-duration: 0.2s;
}

.yCmsComponent.sm .image-gallery .transparent-wrapper,
.yCmsComponent.md .image-gallery .transparent-wrapper,
.yCmsComponent.lg .image-gallery .transparent-wrapper {
  padding-left: calc(16.6667% - 50px);
  padding-right: calc(16.6667% - 50px);
}

.yCmsComponent.sm .image-gallery .transparent-wrapper .overlay-partial,
.yCmsComponent.md .image-gallery .transparent-wrapper .overlay-partial,
.yCmsComponent.lg .image-gallery .transparent-wrapper .overlay-partial {
  padding: 25px;
}

.yCmsComponent.sm .image-gallery .transparent-wrapper .gallery-logo,
.yCmsComponent.md .image-gallery .transparent-wrapper .gallery-logo,
.yCmsComponent.lg .image-gallery .transparent-wrapper .gallery-logo {
  max-width: 200px;
  max-height: 100px;
  margin-bottom: 20px;
}

.yCmsComponent.sm .image-gallery .transparent-wrapper .headline,
.yCmsComponent.md .image-gallery .transparent-wrapper .headline,
.yCmsComponent.lg .image-gallery .transparent-wrapper .headline {
  margin-bottom: 10px;
}

.yCmsComponent.sm .image-gallery .transparent-wrapper .details,
.yCmsComponent.md .image-gallery .transparent-wrapper .details,
.yCmsComponent.lg .image-gallery .transparent-wrapper .details {
  font-size: 14px;
  line-height: 22px;
  margin-bottom: 20px;
}

.yCmsComponent.sm .image-gallery .transparent-wrapper .action,
.yCmsComponent.md .image-gallery .transparent-wrapper .action,
.yCmsComponent.lg .image-gallery .transparent-wrapper .action {
  margin-top: 20px;
}

.carousel-component .slick-slider {
  padding: 0 5px;
}

.carousel-component .slick-track {
  display: flex;
  display: -ms-flexbox;
  display: -webkit-flex;
}

.carousel-component .slick-slide {
  padding: 20px 10px;
  transition: all .2s ease;
  display: flex;
  display: -ms-flexbox;
  display: -webkit-flex;
  height: auto;
}

@media (min-width: 768px) {
  .carousel-component .slick-slide:hover {
    transform: scale(1.1);
  }
  .carousel-component .slick-slide:hover > div {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    transition: all .1s ease .1s;
  }
}

.carousel-component .slick-slide .yCmsComponent {
  min-width: 1px;
  margin-top: 0 !important;
  display: flex;
  display: -ms-flexbox;
  display: -webkit-flex;
}

@media (max-width: 768px) {
  .carousel-component .slick-slide {
    padding: .3% 5px;
  }
  .carousel-component button.slick-prev {
    left: -5px;
  }
  .carousel-component button.slick-next {
    right: -5px;
  }
}

.headingLinkComponent {
  margin-bottom: 20px;
}

.headingLinkComponent .heading-title-box {
  padding-left: 0;
  height: 100%;
}

.headingLinkComponent .heading-title-box .heading-title {
  position: absolute;
  bottom: 0;
}

.headingLinkComponent .heading-button-box {
  padding-right: 0;
  padding-left: 0;
  height: 100%;
}

.headingLinkComponent .heading-button-box .heading-button {
  height: 100%;
  text-rendering: optimizeLegibility;
  line-height: 44px;
}

@media (max-width: 767px) {
  .headingLinkComponent {
    margin-top: 30px;
  }
  .headingLinkComponent .heading-title-box {
    border-bottom: 3px solid #000;
  }
  .headingLinkComponent .heading-title-box .heading-title {
    position: inherit;
  }
  .headingLinkComponent .heading-button-box {
    margin-top: 10px;
  }
}

@media (min-width: 768px) {
  .headingLinkComponent {
    border-bottom: 3px solid #000;
    height: 50px;
  }
}

.parallax-component {
  overflow: hidden;
  background-repeat: no-repeat;
}

.parallax-component .parallax-content {
  padding: 20px;
  color: #fff;
  background: rgba(0, 0, 0, 0.2);
}

@media (min-width: 768px) {
  .parallax-component .parallax-content {
    padding: 40px;
  }
}

@media (min-width: 970px) {
  .parallax-component .parallax-content {
    padding: 80px;
  }
}

@media (min-width: 1200px) {
  .parallax-component .parallax-content {
    padding: 90px;
  }
}

@media (max-width: 767px) {
  .parallax-component {
    background-position: 50% 0 !important;
  }
  .parallax-component .parallax-content {
    padding: 20px;
  }
}

.event-calendar-widget * {
  transition: ease;
  transition-property: width;
  transition-duration: 1s;
}

.event-calendar-widget .event-calendar-widget-nav {
  background-color: white;
  overflow: hidden;
  padding: 15px;
  display: block;
}

.event-calendar-widget .event-calendar-widget-nav .nav-head {
  min-height: 50px;
}

.event-calendar-widget .event-calendar-widget-nav .nav-head h2 {
  padding-top: 8px;
  margin-right: 130px;
}

.event-calendar-widget .event-calendar-widget-nav .nav-head .paging-events {
  float: right;
}

.event-calendar-widget .events {
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
  flex-wrap: wrap;
}

.event-calendar-widget .events > div {
  height: auto;
  width: 100%;
}

.event-calendar-widget .events .event-preview-empty {
  background-color: white;
  overflow: hidden;
  padding: 20px;
  margin: 10px;
  width: 100%;
}

.event-calendar-widget .events .event-container {
  display: flex;
  flex-flow: column nowrap;
}

.event-calendar-widget .events .event-container .event-link {
  margin: auto auto 0 auto;
}

.single-event-preview {
  height: 100%;
  background-color: white;
  overflow: hidden;
  padding: 20px;
  margin: 10px;
  display: block;
}

.single-event-preview.single-event-detail {
  margin: 10px 0px 0px;
  padding-bottom: 0px;
}

.single-event-preview .event-calendar {
  float: left;
}

.single-event-preview .event-calendar .date-day {
  font-size: calc(30px + 2 * ((100vw - 320px) / 880));
  font-weight: bolder;
  margin: 5px 0;
}

.single-event-preview .event-calendar .date-month {
  font-size: calc(18px + 2 * ((100vw - 320px) / 880));
  font-weight: bold;
}

.single-event-preview .event-notes {
  margin-left: 50px;
}

.single-event-preview .event-notes .event-note {
  position: relative;
  color: #595858;
}

.single-event-preview .event-notes .event-note .event-note-icon {
  font-size: 92%;
  float: left;
  position: absolute;
  top: 5px;
}

.single-event-preview .event-notes .event-note .event-note-text {
  margin-left: 20px;
}

.xs .event-calendar-widget .events .xs-12 {
  width: 100%;
}

.sm .event-calendar-widget .events .sm-12 {
  width: 100%;
}

.sm .event-calendar-widget .events .sm-6 {
  width: 50%;
}

.md .event-calendar-widget .events .md-6,
.lg .event-calendar-widget .events .md-6 {
  width: 50%;
}

.md .event-calendar-widget .events .md-4,
.lg .event-calendar-widget .events .md-4 {
  width: 33.33333%;
}

.event-registration {
  background-color: white;
  overflow: hidden;
  padding: 0px 15px 15px 65px;
  display: block;
}

.start-hidden {
  display: none;
}

.storeSelect ul {
  list-style: none;
  list-style-position: outside;
  padding-left: 0;
}

.storeSelect .card {
  display: flex;
  width: 30%;
  margin: 0 1% 1%;
  float: left;
  border: 1px solid #eaeaea;
  height: 235px;
}

.storeSelect .card a {
  width: 100%;
  height: 100%;
}

.storeSelect .card a:before, .storeSelect .card a:after {
  content: '';
}

.storeSelect .card a h2 {
  min-height: 40px;
  margin-left: 8px;
}

.storeSelect .card a img {
  margin: -10px auto;
  max-width: 95%;
}

.storeSelect .card:hover {
  border: 1px solid #aeaeae;
}

.storeSelectClose {
  font-size: 12px;
}

@media (min-width: 970px) {
  .storeSelect .card {
    height: 250px;
  }
  .storeSelect .card a img {
    margin: -10px auto;
    max-width: 95%;
  }
}

@media (min-width: 768px) {
  .storeSelect .card {
    height: 250px;
  }
  .storeSelect .card a {
    position: relative;
  }
  .storeSelect .card a img {
    max-width: 95%;
    position: absolute;
    bottom: 17px;
    right: 8px;
  }
}

@media (max-width: 767px) {
  .storeSelect .card {
    width: 97%;
    height: 120px;
    display: inline-table;
    padding: 20px 10px;
    float: none;
  }
  .storeSelect .card h2 {
    float: left;
    max-width: 45%;
    margin: auto;
    margin-top: 5px;
  }
  .storeSelect .card img {
    float: right;
    width: 45%;
    margin: auto;
  }
}

/* default settings - mobile */
.banner {
  position: relative;
  /* cut overlapping content to not destroy surrounding elements */
  overflow: hidden;
}

.banner .image-link {
  cursor: pointer;
}

.banner .image-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  /* overlay is disabled for banner comp - if a associate needs the overlay, turn it on with display=block */
}

.banner .image-wrapper .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  background: rgba(0, 0, 0, 0.2);
}

.banner .image-wrapper .overlay-partial {
  padding: 20px;
  display: inline-block;
  background: rgba(0, 0, 0, 0.3);
}

.banner img {
  width: 100%;
}

.banner .transparent-wrapper {
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
  color: #fff;
  text-align: center;
  padding-left: calc(3% - 40px);
  padding-right: calc(3% - 40px);
}

.banner .transparent-wrapper .details {
  font-size: 16px;
  line-height: 18px;
}

.banner .transparent-wrapper .details a {
  color: currentColor;
}

.banner .transparent-wrapper .details a:hover {
  color: #127f3e;
}

.banner .transparent-wrapper .separator {
  margin: 10px auto;
  width: 50px;
  border-bottom: 2px solid #fff;
}

.banner .transparent-wrapper .headline {
  margin-bottom: 0;
}

.banner .transparent-wrapper .action {
  margin-top: 10px;
  width: 100%;
}

.banner * {
  transition: ease;
  transition-property: line-height,margin-top,margin-bottom,margin-right,margin-left,font-size;
  transition-duration: 0.2s;
}

.yCmsComponent.sm .banner .transparent-wrapper,
.yCmsComponent.md .banner .transparent-wrapper,
.yCmsComponent.lg .banner .transparent-wrapper {
  padding-left: calc(16.6667% - 50px);
  padding-right: calc(16.6667% - 50px);
}

.yCmsComponent.sm .banner .transparent-wrapper .overlay-partial,
.yCmsComponent.md .banner .transparent-wrapper .overlay-partial,
.yCmsComponent.lg .banner .transparent-wrapper .overlay-partial {
  padding: 25px;
}

.yCmsComponent.sm .banner .transparent-wrapper .details,
.yCmsComponent.md .banner .transparent-wrapper .details,
.yCmsComponent.lg .banner .transparent-wrapper .details {
  font-size: 18px;
  line-height: 24px;
}

.yCmsComponent.sm .banner .transparent-wrapper .separator,
.yCmsComponent.md .banner .transparent-wrapper .separator,
.yCmsComponent.lg .banner .transparent-wrapper .separator {
  margin: 15px auto 10px;
}

.yCmsComponent.sm .banner .transparent-wrapper .action,
.yCmsComponent.md .banner .transparent-wrapper .action,
.yCmsComponent.lg .banner .transparent-wrapper .action {
  margin-top: 20px;
}

.arrowbanner {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: auto;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s;
  min-height: 380px;
  /* styling change for small only */
  /* styling change for large */
  /* styling change for large */
}

.arrowbanner.loaded {
  visibility: visible;
  opacity: 1;
  min-height: 0;
}

.arrowbanner .image-wrapper {
  position: relative;
  width: 100%;
}

.arrowbanner .image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.arrowbanner .text-wrapper {
  background-color: white;
  padding: 10px 20px 20px;
  width: 100%;
  position: relative;
}

.arrowbanner .text-wrapper:before {
  background-image: linear-gradient(to left top, white 0%, white 49%, transparent 51%);
  content: "";
  position: absolute;
  width: 100%;
  height: 35px;
  top: -35px;
  left: 0;
}

.arrowbanner .text-wrapper:after {
  content: none;
}

.arrowbanner .text-wrapper .arrow-headline {
  text-align: left;
  font-size: 22px;
  margin-bottom: 10px;
}

.arrowbanner .text-wrapper .arrow-content {
  flex: 1;
  font-size: 12px;
}

.arrowbanner .text-wrapper .arrow-button {
  margin-top: 20px;
}

.arrowbanner:not(.large) .arrow-button {
  min-width: 100%;
}

.arrowbanner:not(.large) a.container-link {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.arrowbanner:not(.large) a.container-link > .text-wrapper {
  height: 100%;
}

.arrowbanner:not(.large) a.container-link > .text-wrapper > .central-wrapper {
  height: 100%;
}

.arrowbanner:not(.large) a.container-link > .text-wrapper > .central-wrapper > .central-area {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.arrowbanner.large {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  /* Fix for container-link in large arrowbanner */
}

.arrowbanner.large > a.container-link {
  display: flex;
  flex-direction: row;
  width: 100%;
  height: 100%;
  align-items: stretch;
  /* Critical: move the order properties to child elements inside container-link */
}

.arrowbanner.large > a.container-link > .image-wrapper {
  order: 2;
}

.arrowbanner.large > a.container-link > .text-wrapper {
  order: 1;
}

.arrowbanner.large .image-wrapper {
  width: 70%;
  order: 2;
  position: relative;
  z-index: 0;
}

.arrowbanner.large .text-wrapper {
  padding: 20px 15px 20px 50px;
  width: 30%;
  order: 1;
  z-index: 1;
  position: relative;
}

.arrowbanner.large .text-wrapper .central-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}

.arrowbanner.large .text-wrapper .central-area {
  width: 100%;
}

.arrowbanner.large .text-wrapper .arrow-content {
  font-size: 14px;
}

.arrowbanner.large .text-wrapper:before {
  content: none;
}

.arrowbanner.large .text-wrapper:after {
  background-image: linear-gradient(to right bottom, white 0%, white 49%, transparent 51%);
  content: "";
  position: absolute;
  top: 0;
  right: -35px;
  width: 35px;
  height: 100%;
}

/* Fix for slick slider containing arrowbanners */
.slick-slider .arrowbanner.large.slick-slide a.container-link {
  display: flex;
}

.yCmsComponent.sm .arrowbanner.large .text-wrapper {
  padding-left: 30px;
}

/**
General teaser components
 */
.teaserComponent {
  text-align: center;
  position: relative;
  background-color: white;
  width: 100%;
  /* if entire component flexed (e.g. carousel) - flex component content */
}

.teaserComponent.teaser-flex,
.teaserComponent a.teaser-flex,
.teaserComponent .teaser-flex {
  display: flex;
  display: -ms-flexbox;
  display: -webkit-flex;
  flex-direction: column;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  justify-content: space-between;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  height: auto;
}

.teaserComponent .teaser-textbox {
  overflow: hidden;
  padding: 20px;
}

.teaserComponent .teaser-textbox .action {
  display: block;
}

.teaserComponent h4 {
  width: 100%;
}

.teaserComponent .teaser-imagebox {
  padding-bottom: 60%;
  height: 0;
  position: relative;
  overflow: hidden;
}

.teaserComponent .teaser-imagebox img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  overflow: hidden;
}

/**
product and category teaser
 */
.product-feature-component .teaser-imagebox h4,
.category-feature-component .teaser-imagebox h4 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: white;
  z-index: 2;
  margin-bottom: 0;
}

.product-feature-component .hooks,
.category-feature-component .hooks {
  position: absolute;
  top: 0;
  right: -5px;
  margin: 0px;
}

/**
brand and producer teaser component
 */
.brand-feature-component .teaser-headline,
.producer-feature-component .teaser-headline {
  overflow: hidden;
  padding: 20px;
}

.brand-feature-component .teaser-headline h4,
.producer-feature-component .teaser-headline h4 {
  margin-bottom: 0;
}

.brand-feature-component .teaser-imagebox img,
.producer-feature-component .teaser-imagebox img {
  padding-left: 20px;
  padding-right: 20px;
}

.product-feature-component .description {
  height: 72px;
  height: 3lh;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  text-overflow: ellipsis;
}

#content .flexible-wrapper {
  padding: 0;
  margin-top: -30px;
}

.background-highlighting-01 {
  background-color: #F6F7F9;
  margin-right: 0;
  margin-left: 0;
  padding-top: 5px;
}

.background-highlighting-01 * {
  color: #3e4954 !important;
}

.background-highlighting-02 {
  background-color: #60646D;
  margin-right: 0;
  margin-left: 0;
  padding-top: 5px;
}

.background-highlighting-02 * {
  color: #e1e5ea !important;
}

.background-highlighting-blue {
  background-color: #b7e2f5;
  margin-right: 0;
  margin-left: 0;
}

.background-highlighting-blue * {
  color: #3e4954 !important;
}

.questionnaire {
  text-align: center;
}

.questionnaire img {
  margin: auto;
}

.questionnaire .separator {
  border-bottom: 1px solid #D4D4D5;
}

.questionnaire .btn-container .btn,
.questionnaire .bnt-next-wrapper .btn {
  min-width: 100%;
}

.questionnaire .questions {
  min-height: 1px;
}

.questionnaire .questions:before, .questionnaire .questions:after {
  content: "";
  display: table;
}

.questionnaire .questions:after {
  clear: both;
}

.questionnaire * {
  transition-timing-function: ease;
  transition-property: min-width,width,margin-left,margin-right;
  transition-duration: 0.5s;
}

.yCmsComponent.sm .questionnaire .questions,
.yCmsComponent.sm .questionnaire .bnt-next-wrapper {
  margin-left: 16.667%;
  margin-right: 16.667%;
}

.yCmsComponent.md .questionnaire p,
.yCmsComponent.md .questionnaire .questions,
.yCmsComponent.lg .questionnaire p,
.yCmsComponent.lg .questionnaire .questions {
  margin-left: 8.333%;
  margin-right: 8.333%;
}

.yCmsComponent.md .questionnaire .btn-container,
.yCmsComponent.lg .questionnaire .btn-container {
  width: 33.333%;
  padding-left: 10px;
  padding-right: 10px;
  display: inline-block;
  float: left;
}

.yCmsComponent.md .questionnaire .answers-size-1 .btn-container,
.yCmsComponent.lg .questionnaire .answers-size-1 .btn-container {
  width: 100%;
}

.yCmsComponent.md .questionnaire .answers-size-2 .btn-container,
.yCmsComponent.md .questionnaire .answers-size-4 .btn-container,
.yCmsComponent.lg .questionnaire .answers-size-2 .btn-container,
.yCmsComponent.lg .questionnaire .answers-size-4 .btn-container {
  width: 50%;
}

.yCmsComponent.md .questionnaire .bnt-next-wrapper .btn,
.yCmsComponent.lg .questionnaire .bnt-next-wrapper .btn {
  min-width: 200px;
}

.contact-banner {
  margin-bottom: 1%;
}

.contact-banner .mobile-contact-box {
  background-color: white;
}

.contact-banner .mobile-contact-box .inner-image img {
  width: 100%;
}

.contact-banner .outer-image {
  top: 1px;
}

.contact-banner .outer-image img {
  border: 1px solid #f0f0f0;
  width: 100%;
}

.contact-banner .inner-image {
  padding-left: 0px;
}

.contact-banner .inner-image img {
  width: 100%;
}

.contact-banner #open-contact-info {
  float: right;
  width: 40px;
  background-color: transparent;
  border: transparent;
  color: #3e4954;
  font-weight: bold;
}

.contact-banner #open-contact-info:after {
  content: '\e92d';
  font-family: 'hagebau-icomoon';
}

.contact-banner #open-contact-info.open:after {
  content: '\e92c';
  font-family: 'hagebau-icomoon';
}

.contact-banner #open-contact-info + p {
  margin-right: 45px;
}

.contact-banner .contact-box {
  border: 1px solid #CCCCCC;
  background-color: white;
}

.contact-banner .contact-box .labelText {
  display: block;
  overflow: hidden;
}

.contact-banner .contact-text {
  overflow: hidden;
  margin: 2% 0% 0% 0%;
}

.contact-banner .contact-inner {
  padding-top: 20px;
  padding-bottom: 20px;
}

.contact-banner .cmsLabelText {
  overflow: hidden;
}

@media (max-width: 767px) {
  .contact-banner .contact-inner {
    display: none;
    border-top: 1px solid #f0f0f0;
  }
}

.simple_disp-img:not(#header-logo .simple_disp-img) {
  font-size: 0;
  position: relative;
  visibility: hidden;
  opacity: 0;
  aspect-ratio: 1000/670;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.simple_disp-img:not(#header-logo .simple_disp-img):not([data-empty]).loaded {
  opacity: 1;
  visibility: visible;
  aspect-ratio: auto;
}

.simple_disp-img:not(#header-logo .simple_disp-img) img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-height: 100%;
  max-width: 100%;
  width: 100%;
}

.simple_disp-img:not(#header-logo .simple_disp-img) .simple-banner-headline {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  min-height: 45px;
  padding: 0 5%;
  background: white;
}

.simple_disp-img:not(#header-logo .simple_disp-img) .simple-banner-headline:before {
  background-image: linear-gradient(to left top, white 0%, white 49%, transparent 51%);
  position: absolute;
  width: 100%;
  height: 35px;
  top: -35px;
  left: 0;
  content: "";
}

.simple_disp-img:not(#header-logo .simple_disp-img) .simple-banner-headline .h4 {
  text-align: center;
  font-size: 16px;
  line-height: 20px;
  margin-bottom: 0;
}

.yCmsComponent.md .simple_disp-img .simple-banner-headline h4,
.yCmsComponent.lg .simple_disp-img .simple-banner-headline h4 {
  font-size: 18px;
  line-height: 24px;
}

.simplefootercomponent {
  /* #footer-main-section */
}

.simplefootercomponent ul {
  margin: 0;
  padding: 0;
}

.simplefootercomponent li {
  list-style-type: none;
}

.simplefootercomponent .main-content-wrapper {
  background-color: #f0f0f0;
  border-bottom: 1px solid #595858;
}

.simplefootercomponent #footer-main-section {
  /* cmsicontextcomponent */
  /* main-content */
}

.simplefootercomponent #footer-main-section .flexible-wrapper > div > .mbs {
  margin: 0;
}

.simplefootercomponent #footer-main-section a {
  color: #595858;
}

.simplefootercomponent #footer-main-section a:hover {
  color: #127f3e;
}

.simplefootercomponent #footer-main-section .cmsicontextcomponent {
  overflow: hidden;
  text-align: center;
}

.simplefootercomponent #footer-main-section .cmsicontextcomponent img {
  display: inline-block;
}

.simplefootercomponent #footer-main-section .cmsicontextcomponent span {
  display: inline-block;
  text-align: center;
  margin-top: 10px;
}

.simplefootercomponent #footer-main-section .main-content {
  padding: 35px 0 40px 0;
  color: #595858;
}

.simplefootercomponent #footer-main-section .main-content strong {
  line-height: 28px;
  font-size: 17px;
  font-weight: bold;
}

.simplefootercomponent #footer-main-section .cms-navigation-bar-component a,
.simplefootercomponent #footer-main-section .cms-navigation-bar-component a > h3 {
  font-family: "Lato", sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 22px;
  color: #595858;
  text-decoration: none;
}

.simplefootercomponent #footer-main-section .cms-navigation-bar-component a:hover,
.simplefootercomponent #footer-main-section .cms-navigation-bar-component a > h3:hover {
  color: #127f3e;
}

.simplefootercomponent #footer-main-section .cms-navigation-bar-component h3 {
  line-height: 22px;
}

.simplefootercomponent #footer-main-section .cms-navigation-bar-component .footer-toggle-label,
.simplefootercomponent #footer-main-section .cms-navigation-bar-component .navigation-headline,
.simplefootercomponent #footer-main-section .cms-navigation-bar-component h2 {
  color: #595858;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  line-height: 22px;
  margin-bottom: 5px;
}

/* simplefootercomponent */
@media (min-width: 970px) {
  .simplefootercomponent {
    /* .main-content */
    /* #sub-navi-wrapper */
  }
  .simplefootercomponent .main-content .cmsicontextcomponent {
    vertical-align: middle;
    align-items: center;
    padding: 0 4%;
  }
  .simplefootercomponent .main-content .cmsicontextcomponent img {
    height: 40px;
    vertical-align: middle;
  }
  .simplefootercomponent .main-content .cmsicontextcomponent span {
    width: 100%;
    margin-top: 10px;
    vertical-align: middle;
  }
  .simplefootercomponent .sub-navi-wrapper .sub-navi {
    float: right;
  }
  .simplefootercomponent .sub-navi-wrapper .copyright {
    float: left;
  }
  /* simplefootercomponent */
}

/* @media (min-width: $screen-md-min) */
@media (max-width: 969px) {
  .simplefootercomponent {
    /* footer-main-section */
    /* #sub-navi-wrapper */
  }
  .simplefootercomponent #footer-main-section {
    /* .cms-navigation-bar-component */
  }
  .simplefootercomponent #footer-main-section .main-content {
    padding: 20px 0;
  }
  .simplefootercomponent #footer-main-section .main-content .html-snippet {
    text-align: center;
  }
  .simplefootercomponent #footer-main-section .link-account-wrapper {
    background-color: #f0f0f0;
    padding: 0;
    margin: 0 -10px;
  }
  .simplefootercomponent #footer-main-section .link-account-wrapper h3 {
    margin: 0;
    padding: 10px 20px 10px 30px;
    line-height: 22px;
    font-size: 14px;
  }
  .simplefootercomponent #footer-main-section .link-account-wrapper > div {
    border-bottom: 1px solid #595858;
  }
  .simplefootercomponent #footer-main-section .cmsicontextcomponent {
    display: flex;
    align-items: center;
    padding: 15px 0 15px 10%;
    float: none;
  }
  .simplefootercomponent #footer-main-section .cmsicontextcomponent span {
    text-align: left;
    margin: 0;
  }
  .simplefootercomponent #footer-main-section .cmsicontextcomponent img {
    width: 40px;
    margin-right: 20px;
  }
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component {
    overflow: hidden;
    border-bottom: 1px solid #595858;
    /* .footer-toggle */
  }
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component h2.navigation-headline,
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component h2.navigation-headline > a {
    margin: 0 -10px;
    padding: 10px 10px 10px 20px;
    line-height: 20px;
    background-color: inherit;
  }
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component ul.children li {
    margin-bottom: 0px;
  }
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component .link-list li {
    margin: 0 -10px;
    padding: 10px 0 10px 40px;
    border-bottom: 1px solid #595858;
  }
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component .footer-toggle ~ ul {
    max-height: 300px;
    transition: max-height 0.3s ease-in-out;
  }
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component .footer-toggle + .footer-toggle-label h2::after {
    font-family: 'hagebau-icomoon';
    content: "\e90b";
    font-size: 10px;
    color: #595858;
  }
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component .footer-toggle:checked + .footer-toggle-label h2::after {
    font-family: 'hagebau-icomoon';
    content: "\e90a";
    font-size: 10px;
    color: #595858;
  }
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component .footer-toggle:checked ~ ul {
    max-height: 0;
  }
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component .footer-toggle-label,
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component .footer-toggle-label h2 {
    margin: 0;
    width: 100%;
    cursor: pointer;
  }
  .simplefootercomponent #footer-main-section .cms-navigation-bar-component .footer-toggle-label h2:after {
    float: right;
  }
  .simplefootercomponent #footer-main-section .flexible-wrapper .mbs > *:first-child:not(.cms-navigation-bar-component) {
    padding-top: 20px;
  }
  .simplefootercomponent .sub-navi-wrapper .copyright {
    line-height: 30px;
  }
  .simplefootercomponent .sub-navi-wrapper .sub-navi li {
    padding: 0 8px;
  }
  /* simplefootercomponent */
  #footer-wrapper .simplefootercomponent .main-content-wrapper .yCmsComponent {
    padding: 10px 0 0 0;
  }
}

/* @media (max-width: $screen-sm-max) */
.hagebaufootercomponent {
  line-height: 22px;
  font-size: 12px;
  /* .advantage-list */
  /* main-content */
}

.hagebaufootercomponent ul {
  margin: 0;
  padding: 0;
}

.hagebaufootercomponent li {
  list-style-type: none;
}

.hagebaufootercomponent .advantages-wrapper {
  background-color: #fff;
  border-bottom: 1px solid #f0f0f0;
}

.hagebaufootercomponent .main-content-wrapper {
  background-color: #f0f0f0;
  border-bottom: 1px solid #595858;
}

.hagebaufootercomponent .advantage-list {
  padding: 40px 0;
  overflow: hidden;
  font-weight: 600;
  font-size: 14px;
}

.hagebaufootercomponent .advantage-list img {
  display: inline-block;
}

.hagebaufootercomponent .advantage-list span {
  font-weight: 600;
  display: inline-block;
}

.hagebaufootercomponent .advantage-list a {
  text-decoration: none;
}

.hagebaufootercomponent .advantage-list a:before {
  content: none;
}

.hagebaufootercomponent .main-content {
  padding: 35px 0 40px 0;
  font-size: 12px;
  color: #595858;
}

.hagebaufootercomponent .main-content a {
  font-size: 14px;
  font-weight: 600;
  color: #595858;
  text-decoration: none;
}

.hagebaufootercomponent .main-content a:hover {
  color: #127f3e;
  text-decoration: none;
}

.hagebaufootercomponent .main-content .footer-toggle-label,
.hagebaufootercomponent .main-content .link-account-wrapper a,
.hagebaufootercomponent .main-content .h3, .hagebaufootercomponent .main-content h3 {
  color: #595858;
  text-decoration: none;
  font-size: 14px;
  margin-bottom: 5px;
}

.hagebaufootercomponent .main-content .content-block {
  font-weight: 600;
}

.hagebaufootercomponent .main-content .content-block strong,
.hagebaufootercomponent .main-content .content-block .phone-link {
  line-height: 28px;
  font-size: 17px;
  font-weight: bold;
}

.hagebaufootercomponent .main-content .content-block strong [class^="icon-"],
.hagebaufootercomponent .main-content .content-block .phone-link [class^="icon-"] {
  font-size: 19px;
  line-height: 28px;
}

.hagebaufootercomponent .main-content .content-block .footer-hotline strong {
  color: #595858;
}

.hagebaufootercomponent .main-content .content-block .footer-hotline p {
  margin-bottom: 5px;
}

.hagebaufootercomponent .footer-toggle {
  display: none;
}

/* .hagebaufootercomponent */
@media (min-width: 970px) {
  .hagebaufootercomponent {
    /* .advantage-list */
    /* #sub-navi-wrapper */
  }
  .hagebaufootercomponent .advantages-wrapper {
    padding: 40px 0;
  }
  .hagebaufootercomponent .advantage-list li {
    display: flex;
    align-items: center;
    padding: 10px;
    float: left;
  }
  .hagebaufootercomponent .advantage-list li,
  .hagebaufootercomponent .advantage-list div.mbm {
    text-align: center;
    padding: 0 4%;
  }
  .hagebaufootercomponent .advantage-list img {
    height: 40px;
    vertical-align: middle;
  }
  .hagebaufootercomponent .advantage-list span {
    width: 100%;
    margin-top: 10px;
    vertical-align: middle;
  }
  .hagebaufootercomponent .advantage-list .cmsicontextcomponent {
    vertical-align: middle;
  }
  .hagebaufootercomponent .sub-navi-wrapper .sub-navi {
    float: right;
  }
  .hagebaufootercomponent .sub-navi-wrapper .copyright {
    float: left;
  }
  /* .hagebaufootercomponent */
  #footer-wrapper .hagebaufootercomponent .main-content .link-list .yCmsComponent {
    padding: 0;
  }
}

/* @media (min-width: $screen-md-min) */
@media (max-width: 969px) {
  .hagebaufootercomponent {
    background-position: 40% top;
    /* .main-content */
    /* .advantage-list */
    /* #sub-navi-wrapper */
  }
  .hagebaufootercomponent .link-account-wrapper {
    background-color: #f0f0f0;
    padding: 0;
    margin: 0;
  }
  .hagebaufootercomponent .link-account-wrapper h3 {
    margin: 0 -10px;
    padding: 10px 10px 10px 20px;
    line-height: 22px;
  }
  .hagebaufootercomponent .link-account-wrapper > div {
    border-bottom: 1px solid #595858;
  }
  .hagebaufootercomponent .main-content {
    padding: 0;
    /* .col-sm-3 */
    /* .footer-toggle */
    /* .footer-toggle-label */
  }
  .hagebaufootercomponent .main-content .content-block {
    overflow: hidden;
    border-bottom: 1px solid #595858;
  }
  .hagebaufootercomponent .main-content .content-block h3, .hagebaufootercomponent .main-content .content-block .h3 {
    margin: 0 -10px;
    padding: 10px 10px 10px 20px;
  }
  .hagebaufootercomponent .main-content .content-block div.html-snippet {
    text-align: center;
  }
  .hagebaufootercomponent .main-content .content-block div.html-snippet h3, .hagebaufootercomponent .main-content .content-block div.html-snippet .h3 {
    margin: 0 -10px;
    padding: 20px 10px 10px 10px;
  }
  .hagebaufootercomponent .main-content .content-block .footer-toggle-label {
    line-height: 22px;
    font-size: 14px;
  }
  .hagebaufootercomponent .main-content .content-block.note h3, .hagebaufootercomponent .main-content .content-block.note .h3 {
    border-bottom: none;
  }
  .hagebaufootercomponent .main-content .content-block .link-list li {
    margin: 0 10px;
    border-bottom: 1px solid #595858;
  }
  .hagebaufootercomponent .main-content .content-block.count-4 {
    text-align: center;
  }
  .hagebaufootercomponent .main-content .footer-toggle ~ ul {
    max-height: 300px;
    transition: max-height 0.3s ease-in-out;
  }
  .hagebaufootercomponent .main-content .footer-toggle + .footer-toggle-label::after {
    font-family: 'hagebau-icomoon';
    content: "\e90b";
    font-size: 10px;
    color: #595858;
  }
  .hagebaufootercomponent .main-content .footer-toggle:checked + .footer-toggle-label::after {
    font-family: 'hagebau-icomoon';
    content: "\e90a";
    font-size: 10px;
    color: #595858;
  }
  .hagebaufootercomponent .main-content .footer-toggle:checked ~ ul {
    max-height: 0;
  }
  .hagebaufootercomponent .main-content .footer-toggle-label {
    margin: 0;
    width: 100%;
    cursor: pointer;
  }
  .hagebaufootercomponent .main-content .footer-toggle-label:after {
    float: right;
  }
  .hagebaufootercomponent .advantage-list {
    padding: 0;
  }
  .hagebaufootercomponent .advantage-list .cmsicontextcomponent {
    display: flex;
    align-items: center;
    padding: 15px 0 15px 10%;
    float: none;
  }
  .hagebaufootercomponent .advantage-list .cmsicontextcomponent span {
    text-align: left;
    margin: 0;
  }
  .hagebaufootercomponent .advantage-list .cmsicontextcomponent img {
    width: 40px;
    margin-right: 20px;
  }
  .hagebaufootercomponent .sub-navi-wrapper .copyright {
    line-height: 30px;
  }
  .hagebaufootercomponent .sub-navi-wrapper .sub-navi li {
    padding: 0 8px;
  }
  /* hagebaufootercomponent */
  #footer-wrapper .hagebaufootercomponent .main-content .link-list .yCmsComponent {
    padding: 10px 0 10px 40px;
  }
}

/* @media (max-width: $screen-sm-max) */
/* CMSNavigationBarComponent */
.cms-navigation-bar-component input.footer-toggle {
  display: none;
}

#footer-wrapper .main-content-wrapper .cms-navigation-bar-component h3,
#footer-wrapper .main-content-wrapper .cms-navigation-bar-component a,
#footer-wrapper .main-content-wrapper .cms-navigation-bar-component a > h3 {
  font-family: "Lato", sans-serif;
  font-size: 14px;
  font-weight: 300;
  line-height: 22px;
  color: #595858;
  text-decoration: none;
  margin-bottom: 0;
}

#footer-wrapper .main-content-wrapper .cms-navigation-bar-component h3:hover,
#footer-wrapper .main-content-wrapper .cms-navigation-bar-component a:hover,
#footer-wrapper .main-content-wrapper .cms-navigation-bar-component a > h3:hover {
  text-decoration: none;
  font-weight: bold;
}

#footer-wrapper .main-content-wrapper .cms-navigation-bar-component .footer-toggle-label,
#footer-wrapper .main-content-wrapper .cms-navigation-bar-component .navigation-headline,
#footer-wrapper .main-content-wrapper .cms-navigation-bar-component h2 {
  color: #595858;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  line-height: 22px;
  margin-bottom: 5px;
}

/* #footer-main-section */
#content {
  /* cms-navigation-bar-component */
}

#content .cms-navigation-bar-component {
  background-color: inherit;
  padding: 0 10px;
}

#content .cms-navigation-bar-component .navigation-headline {
  padding: 10px 0 5px;
  margin-bottom: 0;
}

#content .cms-navigation-bar-component h3 {
  font-size: 14px;
}

#content .cms-navigation-bar-component ul li {
  list-style-type: none;
  font-size: 14px;
}

#content .cms-navigation-bar-component ul.children {
  padding: 0;
}

#content .cms-navigation-bar-component ul.children h3 {
  border-bottom: 1px solid #e1e5ea;
  margin-left: 0px;
  padding: 5px 0;
  font-family: "Lato", sans-serif;
  font-size: 14px;
  font-weight: 400;
}

#content .cms-navigation-bar-component ul.sub-children {
  padding: 0;
}

#content .cms-navigation-bar-component ul.sub-children li {
  border-bottom: 1px solid #e1e5ea;
  margin: 10px 0 5px 20px;
  padding-bottom: 10px;
}

#content .cms-navigation-bar-component ul.children h3:after,
#content .cms-navigation-bar-component ul.sub-children li:after {
  content: "\e91a";
  font-family: 'hagebau-icomoon' !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  vertical-align: middle;
  font-size: 8px;
  margin-left: 10px;
  float: right;
  /* Better Font Rendering =========== */
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media (max-width: 969px) {
  #content .cms-navigation-bar-component {
    border-color: #f0f0f0;
  }
  #content .cms-navigation-bar-component ul li h3 {
    border-bottom: 1px solid #f0f0f0;
  }
  #content .cms-navigation-bar-component ul li h3:hover a {
    color: white;
  }
  /* #content */
  #footer-wrapper > div:not(.sub-navi-wrapper) {
    /* .cms-navigation-bar-component */
  }
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component {
    overflow: hidden;
    border-bottom: 1px solid #595858;
    /* .footer-toggle */
  }
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component h2.navigation-headline,
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component h2.navigation-headline > a {
    padding: 10px;
    line-height: 20px;
    background-color: inherit;
  }
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component ul.children li {
    margin-bottom: 0px;
  }
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component .link-list li {
    margin: 0 -10px;
    padding: 10px 0 10px 40px;
    border-bottom: 1px solid #595858;
  }
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component .footer-toggle ~ ul {
    max-height: 300px;
    transition: max-height 0.3s ease-in-out;
  }
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component .footer-toggle + .footer-toggle-label h2::after {
    font-family: 'hagebau-icomoon';
    content: "\e90b";
    font-size: 10px;
    color: #595858;
  }
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component .footer-toggle:checked + .footer-toggle-label h2::after {
    font-family: 'hagebau-icomoon';
    content: "\e90a";
    font-size: 10px;
    color: #595858;
  }
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component .footer-toggle:checked ~ ul {
    max-height: 0;
  }
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component .footer-toggle-label,
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component .footer-toggle-label h2 {
    margin: 0;
    width: 100%;
    cursor: pointer;
  }
  #footer-wrapper > div:not(.sub-navi-wrapper) .cms-navigation-bar-component .footer-toggle-label h2:after {
    float: right;
  }
}

/* Extra styling for Product references and reference-like sliders on article details page*/
.product-references-component,
.js-content-product-slider {
  visibility: hidden;
  min-height: 450px;
  /* Minimum height to reserve space */
  width: 100%;
  /* Force full width from the beginning */
  /* When loaded class is applied */
  /* Image container styling */
  /* Image styling */
}

.product-references-component.loaded,
.js-content-product-slider.loaded {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s ease;
  min-height: unset;
}

.product-references-component .productImage,
.js-content-product-slider .productImage {
  aspect-ratio: 188/141;
}

.product-references-component .productImage img,
.js-content-product-slider .productImage img {
  width: 100%;
  height: auto;
}

.product-references-component .product-reference-headline h2,
.js-content-product-slider .product-reference-headline h2 {
  text-align: center;
}

.product-references-component .slick-slider,
.js-content-product-slider .slick-slider {
  padding: 0 5px;
}

.product-references-component .slick-slider .slick-track,
.js-content-product-slider .slick-slider .slick-track {
  display: flex;
  display: -ms-flexbox;
  display: -webkit-flex;
  margin-bottom: 30px;
}

.product-references-component .slick-slider a,
.js-content-product-slider .slick-slider a {
  font-size: inherit;
}

.product-references-component .slick-slider .slick-list,
.js-content-product-slider .slick-slider .slick-list {
  margin: -50px 0;
  padding: 50px 0;
}

.product-references-component .slick-slider .slick-slide,
.js-content-product-slider .slick-slider .slick-slide {
  padding: 0 5px;
  margin-bottom: 0;
  display: flex;
  display: -ms-flexbox;
  display: -webkit-flex;
  flex-wrap: nowrap;
}

@media (min-width: 768px) {
  .product-references-component .slick-slider .slick-slide:hover > div,
  .js-content-product-slider .slick-slider .slick-slide:hover > div {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    transition: all .1s ease .1s;
    transform: scale(1.05);
  }
}

@media (max-width: 969px) {
  .product-references-component .product-reference-container,
  .js-content-product-slider .product-reference-container {
    /*
      To mitigate CLS the height is getting dynamically set in productreferencescomponent.jsp based on the number of entries.
      But on mobile it turns into a slider, 360px being the height of the minimal configuration of the component.
      */
    min-height: 360px !important;
  }
}

.product-references-component .productListItem,
.js-content-product-slider .productListItem {
  width: 100%;
}

.product-references-component .productListItem .gridView,
.js-content-product-slider .productListItem .gridView {
  padding-bottom: 0;
}

.product-references-component .productListItem .select-wrapper select,
.js-content-product-slider .productListItem .select-wrapper select {
  font-size: 12px;
}

.product-references-component .listView,
.js-content-product-slider .listView {
  min-height: 85px;
  padding: 0px;
  border-width: 0px 0px 5px;
  border-radius: 0px;
  border-color: #f6f7f9;
  border-style: solid;
}

.product-references-component .listView > .row,
.js-content-product-slider .listView > .row {
  margin-left: 10px;
  margin-right: 10px;
}

.product-references-component .listView .section-1,
.product-references-component .listView .section-2,
.product-references-component .listView .section-3,
.js-content-product-slider .listView .section-1,
.js-content-product-slider .listView .section-2,
.js-content-product-slider .listView .section-3 {
  margin-top: 10px;
  margin-bottom: 10px;
  padding-left: 0;
  padding-right: 0px;
}

.product-references-component .listView .section-1,
.js-content-product-slider .listView .section-1 {
  height: 90px;
}

.product-references-component .listView .productImage,
.js-content-product-slider .listView .productImage {
  padding-left: 0;
  padding-right: 0;
}

.product-references-component .listView .productNameContainer,
.js-content-product-slider .listView .productNameContainer {
  padding-right: 20px;
}

.product-references-component .listView .stock-title,
.product-references-component .listView .consumer-price-caption,
.product-references-component .listView .label-qty,
.product-references-component .listView .label-quantity,
.js-content-product-slider .listView .stock-title,
.js-content-product-slider .listView .consumer-price-caption,
.js-content-product-slider .listView .label-qty,
.js-content-product-slider .listView .label-quantity {
  color: #3e4954;
  font-size: 12px;
  font-weight: bold;
  line-height: 18px;
}

.product-references-component .listView .productName,
.js-content-product-slider .listView .productName {
  word-wrap: break-word;
  vertical-align: middle;
  overflow: hidden;
  line-height: 18px;
  height: 39px;
  max-height: 39px;
}

.product-references-component .listView .productStockContainer,
.js-content-product-slider .listView .productStockContainer {
  padding: 0;
}

.product-references-component .listView .productStockLevel,
.js-content-product-slider .listView .productStockLevel {
  padding-left: 0;
  padding-right: 25px;
}

.product-references-component .listView .other-stock-wrapper,
.js-content-product-slider .listView .other-stock-wrapper {
  line-height: 1.2;
  margin-top: 7px;
}

.product-references-component .listView .productPriceContainer,
.js-content-product-slider .listView .productPriceContainer {
  height: 30px;
  max-height: 30px;
}

.product-references-component .listView .productPriceLive .consumer-price-caption,
.js-content-product-slider .listView .productPriceLive .consumer-price-caption {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: 8px;
}

.product-references-component .listView .productPriceLive .price,
.js-content-product-slider .listView .productPriceLive .price {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 0;
}

.product-references-component .listView .productPriceLive .unitFactor,
.product-references-component .listView .productPriceLive .unitSymbol,
.product-references-component .listView .productPriceLive .anonymous-price,
.js-content-product-slider .listView .productPriceLive .unitFactor,
.js-content-product-slider .listView .productPriceLive .unitSymbol,
.js-content-product-slider .listView .productPriceLive .anonymous-price {
  margin-bottom: 5px;
  font-size: 10px;
  font-weight: normal;
}

.product-references-component .listView .labelContainer,
.js-content-product-slider .listView .labelContainer {
  padding: 0;
}

.product-references-component .listView .label-quantity,
.js-content-product-slider .listView .label-quantity {
  margin-bottom: 5px;
}

.product-references-component .listView .quantityInputContainer,
.js-content-product-slider .listView .quantityInputContainer {
  padding-right: 20px;
}

.product-references-component .listView .quantityContainer,
.js-content-product-slider .listView .quantityContainer {
  padding: 0;
}

.product-references-component .listView .productActionContainer button.btn i,
.js-content-product-slider .listView .productActionContainer button.btn i {
  margin-right: 0;
  float: unset;
}

.product-references-component .listView .addToCartButton,
.product-references-component .listView .addToWishlistButton,
.js-content-product-slider .listView .addToCartButton,
.js-content-product-slider .listView .addToWishlistButton {
  padding: 0;
}

.product-references-component .listView .inner-container,
.js-content-product-slider .listView .inner-container {
  padding-left: 15px;
}

@media (min-width: 970px) {
  .js-content-product-slider .button-more .btn {
    padding: 5px 10px 0 10px;
  }
}

.js-content-product-slider .button-more span {
  font-size: 12px;
}

.js-content-product-slider .button-more span:after {
  font-size: 10px;
  float: none;
  margin-left: 5px;
}

.product-view-history-component .hooks,
.product-same-category-component .hooks {
  margin: 0;
  right: -10px;
}

.product-view-history-component .product-reference-container .slick-track {
  transition-property: padding-bottom;
  transition-duration: 0.4s;
}

.product-view-history-component .product-reference-container .slick-track:hover {
  padding-bottom: 60px;
}

.product-same-category-component .custom-tile {
  height: auto;
  /*@media(min-width: $screen-md-min) {
      height: 400px;
    }*/
}

.product-same-category-component .custom-tile__link {
  width: 100%;
  height: auto;
  padding: 20px 15px;
  background-color: white;
}

.product-same-category-component .custom-tile__link:hover {
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  transition: all .1s ease .1s;
  transform: scale(1.05);
}

.product-same-category-component .custom-tile__link:hover .custom-tile__content-text {
  color: #3e4954;
}

.product-same-category-component .custom-tile__content {
  height: calc(100% - calc(40px + 10px));
  padding: 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.product-same-category-component .custom-tile__content-text {
  height: 67%;
  display: grid;
  place-items: center;
  text-align: center;
  font-weight: bold;
  font-size: 1.25em;
}

.product-same-category-component .custom-tile__content-text > span {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.product-same-category-component .custom-tile__content-image-container {
  height: 33%;
}

.product-same-category-component .custom-tile__content-image-container img {
  object-fit: scale-down;
  max-height: 100%;
}

.product-same-category-component .custom-tile__button {
  margin-top: 10px;
}

.kennstdueinen {
  border: 1px solid #000;
}

.kennstdueinen a {
  color: #115DA8;
}

.kennstdueinen .image-wrapper {
  padding: 20px 1px 10px 1px;
}

.kennstdueinen .image-wrapper img {
  width: 100%;
}

.kennstdueinen .total-review-wrapper {
  margin: 10px;
}

.kennstdueinen .total-review-wrapper .provider-name {
  color: #60646D;
}

.kennstdueinen .review-stars-wrapper {
  font-size: 24px;
}

.kennstdueinen .stars {
  display: inline-block;
  padding-left: 0;
  color: #c4974c;
  line-height: 26px;
}

.kennstdueinen .rating-text {
  line-height: 26px;
  font-weight: 700;
}

.kennstdueinen .rating-max-text {
  line-height: 26px;
  font-weight: 700;
  color: #60646D;
}

.kennstdueinen .review-details-wrapper {
  border-top: 1px solid #f0f0f0;
  margin: 0 10px;
  padding-top: 10px;
}

.kennstdueinen .details-headline {
  font-weight: 700;
  margin-bottom: 30px;
}

.kennstdueinen .review-entry {
  overflow: hidden;
  overflow-wrap: break-word;
  padding-right: 30px;
  margin-bottom: 35px;
}

.kennstdueinen .review-title {
  color: #c4974c;
  font-weight: 700;
  font-style: italic;
  margin-bottom: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kennstdueinen .review-message {
  font-style: italic;
  max-height: 2.6em;
  line-height: 1.3em;
  overflow: hidden;
}

.kennstdueinen .ext-link {
  display: block;
}

.kennstdueinen .action-wrapper {
  margin: 0 10px 35px 10px;
}

.kennstdueinen .action-wrapper .review-link:not(:hover) {
  color: #fff;
  background-color: #c4974c;
}

.kennstdueinen .action-wrapper .review-link {
  font-weight: 700;
}

#footer-wrapper .simplefootercomponent #footer-main-section .flexible-wrapper .kennstdueinen .stars,
#footer-wrapper .hagebaufootercomponent #footer-main-section .main-content .kennstdueinen .stars {
  color: #c4974c !important;
}

/* Extra styling for Top Article Component */
.top-article-account .stock-title,
.top-article-account .other-stock-wrapper {
  display: none;
}

.top-article-account .productPriceContainer p {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .top-article-account .productPriceContainer {
    text-align: right;
  }
}

@media (max-width: 767px) {
  .top-article-account .paginationBar {
    height: auto;
  }
}

.personal-contact-banner {
  margin-bottom: 10px;
}

.personal-contact-banner img {
  width: 100%;
}

.personal-contact-banner .description {
  border: 1px solid #f0f0f0;
  padding: 10px;
  background-color: white;
}

.personal-contact-banner.three .description {
  margin-left: -10px;
}

@media (max-width: 767px) {
  .personal-contact-banner.three .description {
    margin-left: 0px;
  }
}

.personal-contact-banner.full .description {
  margin-left: -10px;
}

@media (max-width: 767px) {
  .personal-contact-banner.full .description {
    margin-left: 0px;
  }
}

.cmsIconTexts ul {
  margin: 0;
  padding: 0;
}

.cmsIconTexts li {
  list-style-type: none;
}

.cmsIconTexts .cmsIconText-list {
  overflow: hidden;
  font-weight: 400;
}

.cmsIconTexts .cmsIconText-list i {
  font-size: 40px;
  display: inline-block;
}

.cmsIconTexts .cmsIconText-list span {
  display: inline-block;
}

.cmsicontextcomponent {
  overflow: hidden;
  text-align: center;
}

.cmsicontextcomponent img {
  display: inline-block;
}

.cmsicontextcomponent span {
  display: inline-block;
  text-align: center;
  margin-top: 10px;
  font-size: 14px;
}

/* cmsicontextcomponent */
@media (min-width: 970px) {
  .cmsIconText-list i {
    vertical-align: top;
  }
  .cmsIconText-list span {
    width: 72%;
    vertical-align: middle;
  }
  .cmsicontextcomponent {
    vertical-align: middle;
    align-items: center;
    padding: 0 4%;
  }
  .cmsicontextcomponent img {
    height: 40px;
    vertical-align: middle;
  }
  .cmsicontextcomponent span {
    width: 100%;
    margin-top: 10px;
    vertical-align: middle;
  }
}

@media (max-width: 969px) {
  .cmsIconText-list i {
    display: inline-block;
    width: 100%;
    text-align: center;
  }
  .cmsIconText-list span {
    padding: 20px 0;
    display: inline-block;
    width: 72%;
    text-align: center;
  }
  .cmsicontextcomponent {
    display: flex;
    align-items: center;
    padding: 15px 0 15px 10%;
    float: none;
  }
  .cmsicontextcomponent span {
    text-align: left;
    margin: 0;
  }
  .cmsicontextcomponent img {
    width: 40px;
    margin-right: 20px;
  }
}

.contactmessageformcomponent .contact-message-form-comp-wrapper {
  padding: 20px 10px;
}

.contactmessageformcomponent .btnCancel {
  min-width: 200px;
}

.yCmsComponent.sm .contactmessageformcomponent .contact-message-form-comp-wrapper {
  margin: 0 8.3333%;
}

.yCmsComponent .contactmessageformcomponent .contact-message-form-comp-wrapper {
  margin: 0 16.6667%;
}

.yCmsComponent .contactmessageformcomponent .colVariant {
  width: 50%;
}

.yCmsComponent .contactmessageformcomponent .radio-button-group .radio label,
.yCmsComponent .contactmessageformcomponent .checkbox-list .checkbox label {
  display: flex;
  align-items: center;
}

.yCmsComponent .contactmessageformcomponent .radio-button-group .radio input[type="radio"],
.yCmsComponent .contactmessageformcomponent .checkbox-list .checkbox input[type="checkbox"] {
  margin-top: 0;
  margin-right: 8px;
}

.yCmsComponent.lg .contactmessageformcomponent .contact-message-form-comp-wrapper {
  margin: 0 25%;
}

.yCmsComponent.lg .contactmessageformcomponent .colVariant {
  width: 50%;
}

.yCmsComponent.lg .downloadList .downloadListItem {
  width: 20%;
}

.yCmsComponent.md .downloadList .downloadListItem {
  width: 25%;
}

.yCmsComponent.sm .downloadList .downloadListItem {
  width: 33.3333%;
}

@media (min-width: 470px) {
  .yCmsComponent.xs .downloadList .downloadListItem {
    width: 50%;
  }
}

.downloadComponent hr {
  color: #595858;
  margin: 0;
}

@media (min-width: 470px) {
  .downloadComponent .downloadList .productListItem .gridView {
    display: block !important;
    visibility: visible !important;
  }
  .downloadComponent .downloadList .productListItem .gridView .product-base-price-value {
    color: #595858;
  }
  .downloadComponent .downloadList .productListItem .listView {
    display: none !important;
  }
}

.downloadComponent .downloadList .downloadListItem {
  min-width: 180px;
  display: none;
  margin-bottom: 3%;
  transition: transform .2s ease;
}

@media (min-width: 768px) {
  .downloadComponent .downloadList .downloadListItem:hover {
    transform: scale(1.1);
  }
  .downloadComponent .downloadList .downloadListItem:hover > div {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    transition: all .15s ease .05s;
  }
}

.downloadComponent .downloadList .downloadListItem .list-item-content {
  background-color: white;
  display: inline-block;
  width: 100%;
  padding: 25px 15px 15px 15px;
}

.downloadComponent .downloadList .downloadListItem .pull-left-list {
  max-width: 100%;
  padding: 0;
  height: 127px;
  margin-bottom: 10px;
}

.downloadComponent .downloadList .downloadListItem img {
  margin: 0 auto;
  max-height: 100%;
}

.downloadComponent .downloadList .downloadListItem .slider {
  bottom: 0;
  border-top: 1px solid #f0f0f0;
}

.downloadComponent .downloadList .downloadListItem .slider .head {
  font-size: 18px;
  margin-top: 10px;
  height: 2.2em;
  max-height: 2.2em;
  overflow: hidden;
}

.downloadComponent .downloadList .downloadListItem .slider .additional-information {
  color: #595858;
  height: 5.8em;
  max-height: 5.8em;
  line-height: 20px;
  overflow: hidden;
}

.downloadComponent .downloadList .downloadListItem .actions {
  margin: 10px 0 0 0;
}

.downloadComponent .downloadList .downloadListItem .actions > div:nth-child(2) {
  margin-top: 10px;
}

.downloadComponent .downloadList .downloadListItem .actions .btn {
  text-overflow: ellipsis;
  width: 100%;
}

.download-modal.iframeWrapper {
  padding-bottom: 0;
  height: 100%;
}

.download-modal img {
  max-height: 100vh;
  max-width: 100%;
}

/* START small width */
/* END small width */
@media (max-width: 469px) {
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem {
    width: 100%;
  }
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .list-item-content {
    padding: 10px;
  }
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .pull-left-list {
    width: 33%;
    min-width: unset;
    float: left;
    padding: 5px;
  }
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .slider {
    float: left;
    padding: 0 10px;
    border-top: 0;
  }
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .slider .head {
    width: 100%;
    margin-top: 0;
    height: unset;
  }
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .actions {
    padding: 10px 10px 0;
    margin-top: 0;
    float: right;
  }
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .actions > div {
    width: 100%;
  }
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .actions > div:nth-child(2) {
    margin-top: 10px;
  }
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .slider,
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .actions {
    width: 67%;
    display: inline-block;
  }
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .additional-information {
    padding: 0;
    width: 100%;
    line-height: 18px;
    height: unset;
    overflow: hidden;
  }
  .yCmsComponent.xs .downloadComponent .downloadList .downloadListItem .additional-information .selling-points {
    padding: 0 0 0 18px;
  }
}

/* START PAGINATION */
.downloadPaginationBar.paginationBar {
  height: auto;
}

.downloadPaginationBar.paginationBar .sticked {
  z-index: 999;
  border-bottom: 1px solid #f0f0f0;
}

.downloadPaginationBar.paginationBar .pagination-label {
  margin: 10px 0 -5px 0;
  display: block;
  width: 100%;
  text-align: center;
}

.downloadPaginationBar.paginationBar .page-size-form,
.downloadPaginationBar.paginationBar .pagination {
  width: 100%;
  margin: 0;
}

.downloadPaginationBar.paginationBar .page-size-form {
  float: right;
}

.downloadPaginationBar.paginationBar .page-size-form .pagination-label {
  text-align: right;
}

.downloadPaginationBar.paginationBar .page-size-wrapper {
  text-align: right;
}

.downloadPaginationBar.paginationBar .page-size-wrapper input {
  display: none;
}

.downloadPaginationBar.paginationBar .page-size-wrapper .page-size-label {
  line-height: 38px;
  margin-right: 5px;
}

.downloadPaginationBar.paginationBar .page-size-wrapper .btn:not(.active) {
  background-color: inherit;
}

.downloadPaginationBar.paginationBar .page-size-wrapper > label:last-of-type {
  margin-right: 0;
}

.downloadPaginationBar.paginationBar .sortinResults {
  float: left;
  width: 100%;
  max-width: 250px;
  margin: 0;
}

.downloadPaginationBar.paginationBar .sortinResults .select-wrapper,
.downloadPaginationBar.paginationBar .sortinResults .select-wrapper .dropdown-fake {
  background-color: inherit;
}

.downloadPaginationBar.paginationBar .sortinResults .pagination-label {
  text-align: left;
}

.yCmsComponent.xs .downloadPaginationBar .pagination-wrapper > .col-xs-12 {
  width: 100%;
}

.yCmsComponent.xs .downloadPaginationBar .pagination-wrapper > .col-xs-8 {
  width: 66.66667%;
}

.yCmsComponent.xs .downloadPaginationBar .pagination-wrapper .sortinResults,
.yCmsComponent.xs .downloadPaginationBar .pagination-wrapper .page-size-form,
.yCmsComponent.xs .downloadPaginationBar .pagination-wrapper .pagination {
  width: 100%;
  margin: 0;
}

.yCmsComponent.xs .downloadPaginationBar .pagination-wrapper .sortinResults {
  max-width: unset;
}

.yCmsComponent.xs .downloadPaginationBar .pagination-wrapper .pagination {
  text-align: left;
}

.yCmsComponent.xs .downloadPaginationBar .pagination-wrapper .pagination li {
  margin: 0;
}

.storefinder-component {
  position: relative;
}

.storefinder-component .searchPane {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 1;
  width: 25%;
  min-width: 300px;
  background-color: #FFF;
}

.storefinder-component .searchPane input,
.storefinder-component .searchPane .btn {
  margin-bottom: 5px;
}

.storefinder-component .searchPane input {
  width: 100%;
  padding: 0 20px;
}

.storefinder-component .searchPane #storeFinderForm {
  padding: 16px 20px 0 20px;
}

.storefinder-component .storeResultList {
  max-height: 300px;
  overflow-y: auto;
  overflow-x: hidden;
}

.storefinder-component .storeResultList p {
  margin: -3px 0;
  color: #3e4954;
}

.storefinder-component .storeResultList .storeItem {
  padding: 0 20px;
}

.storefinder-component .storeResultList .storeItem .storeMarker {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 10px;
  vertical-align: top;
  text-align: center;
  color: #3e4954;
}

.storefinder-component .storeResultList .storeItem .storeMarker img {
  position: relative;
  width: 100%;
  vertical-align: initial;
}

.storefinder-component .storeResultList .storeItem .storeMarker h4 {
  padding-top: 3px;
  margin-bottom: 0;
}

.storefinder-component .storeResultList .storeItem .storeDetails {
  display: inline-block;
}

.storefinder-component .storeResultList .storeItem .storeDetails a {
  color: #127f3e;
  font-weight: bold;
}

.storefinder-component .storeResultList hr {
  margin: 10px 0;
}

.storefinder-component .storeResultList .vertical-fade {
  background: linear-gradient(rgba(255, 255, 255, 0), white);
  height: 40px;
  width: 100%;
  position: sticky;
  position: -webkit-sticky;
  bottom: 0;
}

.storefinder-component .storeMap {
  height: 500px;
}

.storefinder-component .storeMap #map {
  height: 100%;
}

.storefinder-component .storeMap div[role="dialog"] .view-link {
  margin-top: 10px;
}

.storefinder-component .storeMap div[role="dialog"] a {
  color: #127f3e;
  font-weight: bold;
}

.storefinder-component .storeMap div[role="dialog"] button:hover, .storefinder-component .storeMap div[role="dialog"] button:focus, .storefinder-component .storeMap div[role="dialog"] button.focus, .storefinder-component .storeMap div[role="dialog"] button:active {
  box-shadow: none;
  border-color: transparent;
}

.storefinder-component #nearMeStorefinderForm {
  display: none;
}

.storefinder-component .confirmation-necessary {
  position: relative;
  text-align: center;
  overflow: hidden;
  height: 500px;
}

.storefinder-component .confirmation-necessary .confirmation-image {
  height: 500px;
  margin-left: -100%;
  margin-right: -100%;
}

.storefinder-component .confirmation-necessary .overlay {
  background-color: rgba(0, 0, 0, 0.5);
  height: 100%;
  width: 100%;
  text-align: center;
  color: white;
}

.storefinder-component .confirmation-necessary .overlay,
.storefinder-component .confirmation-necessary .confirmation-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.storefinder-component .confirmation-necessary .confirmation-text {
  overflow: hidden;
  max-height: 500px;
}

@media (max-width: 767px) {
  .storefinder-component .searchPane {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    background-color: white;
  }
  .storefinder-component .confirmation-necessary,
  .storefinder-component .confirmation-necessary .confirmation-image,
  .storefinder-component .storeMap {
    height: 400px;
  }
  .storefinder-component .confirmation-necessary .confirmation-text {
    max-height: 400px;
  }
}

@media (min-width: 768px) {
  .storefinder-component .uc-embedding-wrapper {
    height: 70%;
    width: 60%;
    top: 15%;
    left: 20%;
  }
}

.storefinder-component #map .uc-embedding-container img {
  filter: opacity(0.35);
}

@keyframes drop {
  0% {
    transform: translateY(-100px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

.storefinder-component .map-marker-drop-animation {
  animation: drop 0.2s ease-in-out;
}

.socialmediasharecomponent .title {
  color: #282828;
  font-family: Catamaran;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 40px;
}

.socialmediasharecomponent a {
  margin-right: 10px;
}

.socialmediasharecomponent .far,
.socialmediasharecomponent .fab {
  font-size: 20px;
}

.socialmediasharecomponent .oval {
  display: inline-block;
  text-align: center;
  line-height: 40px;
  box-sizing: border-box;
  height: 41px;
  width: 41px;
  border: 1px solid #DFDFDF;
  border-radius: 50%;
}

@media (max-width: 767px) {
  .socialmediasharecomponent .title,
  .socialmediasharecomponent .share-buttons {
    text-align: center;
  }
}

@media (min-width: 768px) {
  .socialmediasharecomponent .title {
    text-align: right;
  }
  .socialmediasharecomponent .share-buttons {
    text-align: left;
  }
}

#searchTabsContent .ds-guided-selling-tool-app {
  margin-top: -30px;
}

.ds-guided-selling-tool-app {
  /* button end */
  /* card */
  /* end card */
  /* buttons */
  /* sidebar */
  /* viewports */
  /* end viewports */
}

.ds-guided-selling-tool-app .gs-text {
  margin-bottom: 20px;
  font-size: 1.5rem;
}

.ds-guided-selling-tool-app .gs-question-invalid {
  color: red;
}

.ds-guided-selling-tool-app button.gs-text {
  color: black;
  background-image: linear-gradient(#000, #000);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 0 0;
  transition: background-size .5s, color .5s;
  font-weight: bolder;
  word-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
  font-size: 1.25rem;
  border: 1px solid #282828;
  border-radius: 0;
  margin: 5px;
  width: 100%;
}

.ds-guided-selling-tool-app button.gs-text:focus {
  box-shadow: 0 0 10px -4px black !important;
  background-size: 100% 100%;
  color: #fff;
}

.ds-guided-selling-tool-app button.gs-text:active {
  box-shadow: 0 0 10px -4px black !important;
  color: #fff;
}

.ds-guided-selling-tool-app .text-center {
  text-align: center !important;
}

.ds-guided-selling-tool-app .bg-light {
  background-color: #f8f9fa !important;
}

.ds-guided-selling-tool-app .gs-teaser {
  position: relative;
  display: flex;
  flex-direction: row;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: .25rem;
  margin-bottom: 5px;
}

.ds-guided-selling-tool-app .gs-teaser .gs-textbox {
  padding: 1.25rem;
}

.ds-guided-selling-tool-app .gs-imagebox {
  float: left;
  border-radius: calc(.25rem - 1px);
}

.ds-guided-selling-tool-app .gs-imagebox img {
  max-width: 25rem;
  height: 100%;
  display: block;
  border-radius: calc(.25rem - 1px);
}

.ds-guided-selling-tool-app .gs-teaser .gs-textbox {
  padding: 10px;
  text-align: center;
  margin-top: auto;
  margin-bottom: auto;
}

.ds-guided-selling-tool-app .gs-teaser .gs-textbox > .gs-headline {
  font-size: 120%;
  font-weight: bolder;
  margin-bottom: .75rem;
}

.ds-guided-selling-tool-app .gs-teaser:after {
  content: "";
  display: table;
  clear: both;
}

.ds-guided-selling-tool-app .gs-teaser-textbox {
  flex: 1 1 auto;
  min-height: 1px;
  padding: 1.25rem;
  float: right;
  text-align: center;
  margin: 0 15px;
}

.ds-guided-selling-tool-app .gs-question > .gs-textbox > .gs-text {
  font-size: 120%;
  font-weight: bolder;
}

.ds-guided-selling-tool-app .gs-question-group-submit {
  color: white;
  background-color: #000;
  margin-bottom: 5px;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.5;
  width: 50%;
}

.ds-guided-selling-tool-app .gs-question-group-submit:hover {
  color: black;
  background-color: white;
}

.ds-guided-selling-tool-app .gs-question-group-submit:hover::after {
  color: black;
  content: "\e908";
  font-family: 'hagebau-icomoon' !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  float: right;
  margin-left: 20px;
  transition: all .2s ease-in-out;
}

.ds-guided-selling-tool-app .gs-question-group-submit::after {
  content: "\e908";
  color: white;
  font-family: 'hagebau-icomoon' !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  float: right;
  margin-left: 20px;
}

.ds-guided-selling-tool-app .gs-question-group-submit:focus::after {
  content: "\e908";
  color: black;
  font-family: 'hagebau-icomoon' !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  float: right;
  margin-left: 20px;
}

.ds-guided-selling-tool-app .gs-button,
.ds-guided-selling-tool-app .gs-question-group-submit {
  border: 1px solid #282828;
  border-radius: 0;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.ds-guided-selling-tool-app .gs-answer-selectbox {
  width: 50%;
  height: 30px;
  text-align: center;
  cursor: pointer;
}

.ds-guided-selling-tool-app .gs-question-group {
  width: 30%;
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  margin: 0;
  outline: 0;
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;
  z-index: 1600;
  background-color: #f8f9fa !important;
  text-align: center;
  transition: 0.9s ease-in-out;
}

.ds-guided-selling-tool-app .gs-question-group .gs-imagebox {
  margin: 5px;
}

.ds-guided-selling-tool-app .gs-question-group .gs-imagebox img {
  max-height: 12rem;
}

.ds-guided-selling-tool-app #gs-sidebar-close {
  float: right;
  width: 25px;
  margin-right: auto;
  margin-left: 10px;
}

.ds-guided-selling-tool-app #gs-sidebar-close i {
  font-size: 10px;
  font-weight: bold;
}

.ds-guided-selling-tool-app #gs-sidebar-close:hover {
  background-color: #f8f9fa !important;
  box-shadow: none;
}

.ds-guided-selling-tool-app #gs-sidebar-close:focus {
  background-color: #f8f9fa !important;
  box-shadow: none;
}

.ds-guided-selling-tool-app .gs-answer-container {
  margin: 0 15px 20px 15px;
}

.ds-guided-selling-tool-app .gs-answer-select {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}

.ds-guided-selling-tool-app .gs-answer-select:after {
  content: "";
  display: table;
  clear: both;
}

@media (max-width: 576px) {
  .ds-guided-selling-tool-app .gs-question-group {
    width: 100%;
    overflow-x: hidden;
  }
  .ds-guided-selling-tool-app .gs-question {
    display: contents;
  }
  .ds-guided-selling-tool-app .gs-answer-select {
    flex-direction: column;
  }
}

@media (min-width: 577px) {
  .ds-guided-selling-tool-app .gs-answer-select {
    flex-direction: column;
  }
  .ds-guided-selling-tool-app .gs-teaser {
    flex-direction: column;
    width: 100%;
  }
}

@media (max-width: 768px) {
  .ds-guided-selling-tool-app .gs-question-group-submit::after {
    content: none;
  }
  .ds-guided-selling-tool-app .gs-question-group-submit:hover::after {
    content: none;
  }
  .ds-guided-selling-tool-app .gs-question-group-submit:focus::after {
    content: none;
  }
  .ds-guided-selling-tool-app .gs-teaser {
    flex-direction: column;
  }
  .ds-guided-selling-tool-app .gs-imagebox img {
    width: 100%;
    max-width: none;
    max-height: 12rem;
  }
}

@media (min-width: 768px) {
  .ds-guided-selling-tool-app .gs-answer-select {
    flex-direction: row;
  }
  .ds-guided-selling-tool-app .gs-teaser {
    flex-direction: row;
  }
}

@media (min-width: 768px) and (max-width: 970px) {
  .ds-guided-selling-tool-app .gs-question-group {
    width: 35%;
  }
}

@media (max-width: 970px) {
  .ds-guided-selling-tool-app .gs-question-group-submit::after {
    content: none;
  }
  .ds-guided-selling-tool-app .gs-question-group-submit:hover::after {
    content: none;
  }
  .ds-guided-selling-tool-app .gs-question-group-submit:focus::after {
    content: none;
  }
}

.videoComponent {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
}

iframe[id^=ytplayer],
iframe[id^=vimeoplayer],
iframe[id^=s3player] {
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.videoComponentOverlay {
  width: 100%;
  min-height: 30vh;
  max-height: 100%;
  background-color: #2b2b2b;
  opacity: 1;
  z-index: 100;
  display: block;
  text-align: center;
  color: #FCF3F4;
}

.videoComponentOverlay p {
  font-weight: 500;
  padding-top: 10vh;
}

.videoComponentPictureOverlay {
  max-width: 100%;
  min-height: 50vh;
  z-index: 100;
  display: block;
  text-align: center;
  background-size: auto;
}

.videoComponentPictureOverlay h3 {
  font-size: 1.5rem;
}

.videoComponentOverlayButtonDefault {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.acceptCookiesBannerComponent {
  font-size: 0;
  position: relative;
  margin-bottom: 30px;
}

.acceptCookiesBannerComponent .js-replace {
  display: grid;
  grid-template-areas: "stack";
  place-items: center;
}

.acceptCookiesBannerComponent .js-replace > * {
  grid-area: stack;
}

.acceptCookiesBannerComponent .js-replace img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-height: 100%;
  max-width: 100%;
  width: 100%;
}

.acceptCookiesBannerComponent .js-replace .picture {
  position: relative;
  text-align: center;
  margin-top: 30px;
  background: #FFF;
  padding: 1.4rem;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.acceptCookiesBannerComponent .js-replace button::after {
  content: "";
}

.acceptCookiesBannerComponent .banner-headline {
  left: 0;
  text-align: center;
  width: 100%;
  min-height: 45px;
  padding: 0 5%;
}

.acceptCookiesBannerComponent .banner-headline h4 {
  text-align: center;
  font-size: 16px;
  line-height: 20px;
  margin-bottom: 0;
}

.yCmsComponent.md .simple_disp-img .simple-banner-headline h4,
.yCmsComponent.lg .simple_disp-img .simple-banner-headline h4 {
  font-size: 18px;
  line-height: 24px;
}

.article-slider-component .contentListItem .gridView {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 30rem;
}

@media (min-width: 320px) {
  .article-slider-component .contentListItem .gridView {
    min-height: 32rem;
  }
}

@media (min-width: 768px) {
  .article-slider-component .contentListItem .gridView {
    min-height: 37rem;
  }
}

@media (min-width: 1200px) {
  .article-slider-component .contentListItem .gridView {
    min-height: 40rem;
  }
}

.article-slider-component .contentListItem .section-one {
  height: unset;
}

.article-slider-component .contentListItem .date-wrapper {
  min-height: unset;
}

.article-slider-component .contentListItem .author-wrapper {
  height: unset;
  hyphens: auto;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  min-height: calc(20px * 2);
}

.article-slider-component .contentListItem .titleBreak {
  height: unset;
  hyphens: auto;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  min-height: calc(26px * 2);
}

@media (min-width: 970px) {
  .article-slider-component .contentListItem .titleBreak {
    line-clamp: 3;
    -webkit-line-clamp: 3;
    min-height: calc(26px * 3);
  }
}

@media (min-width: 1200px) {
  .article-slider-component .contentListItem .titleBreak {
    min-height: calc(32px * 3);
  }
}

.article-slider-component .contentListItem .description {
  hyphens: auto;
}

.article-slider-component .contentListItem .btnArticleLink {
  min-width: 100%;
}

@media (min-width: 768px) {
  .article-slider-component .contentListItem .btnArticleLink {
    min-width: unset;
  }
}

@media (min-width: 768px) {
  /* BEGIN: Styling for the dynamically generated navigation of H2 headlines */
  .headline-nav {
    position: fixed;
    top: 50%;
    z-index: 2;
    color: #3e4954;
    transition: background-color 0.3s ease-in-out;
    /*        transform: translate(0,calc(-50% + 40px)); */
  }
  .headline-nav:hover, .headline-nav.hover {
    background-color: rgba(255, 255, 255, 0.8);
  }
  .headline-nav:hover .cms-navigation .item, .headline-nav.hover .cms-navigation .item {
    opacity: 1;
    padding: 0 40px;
    max-width: 2000px;
    transition: 0s;
  }
  .headline-nav .cms-navigation {
    cursor: pointer;
    padding: 10px 0;
    font-weight: 400;
    transition: background-color 0.2s ease-in-out;
    height: 40px;
  }
  .headline-nav .cms-navigation .dot {
    width: 1px;
    height: 40px;
    margin: 5px 0 0 15px;
    position: absolute;
  }
  .headline-nav .cms-navigation .dot:before, .headline-nav .cms-navigation .dot:after {
    content: '';
    position: absolute;
    border-radius: 50%;
  }
  .headline-nav .cms-navigation .dot:before {
    width: 21px;
    height: 21px;
    background-color: white;
    top: -5px;
    left: -10px;
    border: 1px solid #3e4954;
  }
  .headline-nav .cms-navigation .dot:after {
    left: -5px;
    width: 11px;
    height: 11px;
    background-color: #3e4954;
    transition: background-color 0.5s ease-in-out;
  }
  .headline-nav .cms-navigation .item {
    opacity: 0;
    max-width: 0;
    padding: 0;
    overflow: hidden;
    white-space: nowrap;
    transition: max-width 0s linear 0.3s, padding 0s linear 0.3s;
  }
  .headline-nav .cms-navigation:hover {
    background-color: #fff;
    color: #000;
  }
  .headline-nav .cms-navigation:not(:last-child) .dot {
    background-color: #3e4954;
  }
  .headline-nav .cms-navigation.active .dot:after {
    background-color: #000;
  }
  /* END: Styling for the dynamically generated navigation of H2 headlines */
}

@media (max-width: 767px) {
  .headline-nav {
    display: none;
  }
}

.top-scroller {
  background-color: #f0f0f0;
  line-height: 80px;
  text-align: center;
}

@media (min-width: 768px) {
  .role-select-modal.modal-xl {
    width: 1200px;
    max-width: 100%;
    max-height: 100%;
  }
}

.role-select-modal .modal-body {
  padding: 20px;
}

.role-select-modal .select-row {
  align-items: stretch;
}

.role-select-modal .consumer,
.role-select-modal .business {
  padding: 0;
  border: 1px solid #f0f0f0;
}

.role-select-modal .consumer:hover,
.role-select-modal .business:hover {
  cursor: pointer;
  border: 1px solid #595858;
}

@media (min-width: 768px) {
  .role-select-modal .modal-content {
    top: 100px;
  }
  .role-select-modal .select-row {
    display: flex;
  }
  .role-select-modal .consumer,
  .role-select-modal .business {
    margin: 10px;
  }
}

@media (max-width: 767px) {
  .role-select-modal .modal-content {
    top: 40px;
  }
  .role-select-modal .select-row {
    display: block;
  }
  .role-select-modal .consumer,
  .role-select-modal .business {
    margin: 0;
  }
  .role-select-modal .consumer {
    margin-bottom: 10px;
  }
}

.popup-gallery.modal-xl {
  width: 1200px;
  max-width: 100%;
  max-height: 100%;
}

.popup-gallery.modal-lg {
  width: 940px;
  max-width: 100%;
  max-height: 100%;
}

.popup-gallery .modal-header .close {
  height: 30px;
}

.popup-gallery .modal-body {
  padding: 0 20px;
}

.popup-gallery .modal-content {
  overflow: hidden;
  max-width: 100%;
}

.popup-gallery .modal-content .modal-header {
  border: 0;
  padding: 20px 20px 10px;
}

.popup-gallery .modal-content .popup-gallery-single-slick .slick-slide {
  position: relative;
}

.popup-gallery .modal-content .popup-gallery-single-slick .description {
  display: block;
  left: 10px;
  right: 10px;
  bottom: 10px;
  background-color: rgba(255, 255, 255, 0.8);
  position: static;
  padding: 20px 0;
}

.popup-gallery .modal-content .popup-gallery-single-slick:after {
  content: '';
  width: 100%;
  border-bottom: 1px solid #D4D4D5;
  position: absolute;
  bottom: 0px;
}

.popup-gallery .modal-content .popup-gallery-nav-slick {
  margin-top: 20px;
  position: relative;
}

.popup-gallery .modal-content .popup-gallery-nav-slick .description {
  display: none;
}

.popup-gallery .modal-content .popup-gallery-nav-slick .slick-list {
  /* padding right to show half image from next element */
  padding: 0 calc(16.6667% - 25px) 5px 0 !important;
  margin: 0 -5px;
  /* linear gradients to the end of the visible slick list */
}

.popup-gallery .modal-content .popup-gallery-nav-slick .slick-list:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: calc(16.6667% - 30px);
  height: 100%;
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0), white);
  z-index: 10;
}

.popup-gallery .modal-content .popup-gallery-nav-slick .slick-slide {
  margin: 0 10px 0 0;
}

@media (min-width: 1200px) {
  .popup-gallery .modal-content .popup-gallery-nav-slick .slick-slide {
    margin: 0 20px 0 0;
  }
}

.popup-gallery .modal-content .popup-gallery-nav-slick .slick-slide:not(.slick-current) {
  position: relative;
  /* white overlay with opacity to all elements except current element */
}

.popup-gallery .modal-content .popup-gallery-nav-slick .slick-slide:not(.slick-current):after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.5);
}

.popup-gallery .modal-content .popup-gallery-nav-slick .slick-current {
  position: relative;
}

.popup-gallery .modal-content .popup-gallery-nav-slick .slick-current:after {
  content: '';
  width: 100%;
  border-bottom: 5px solid #de0019;
  position: absolute;
}

.popup-gallery .modal-content .popup-gallery-nav-slick .slick-dots {
  margin-top: 5px;
}

.popup-gallery .modal-content .popup-gallery-nav-slick .image-gallery-thumbnails {
  width: 250px;
}

.popup-gallery .modal-content .popup-gallery-nav-slick .image-gallery-thumbnails.slick-center {
  position: relative;
}

.popup-gallery .modal-content .popup-gallery-nav-slick .image-gallery-thumbnails.slick-center:before {
  content: "";
  height: 100%;
  width: 100%;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.6;
}

.popup-gallery .modal-content .slick-slider {
  overflow: hidden;
}

.popup-gallery .modal-content .slick-slider button.slick-prev {
  left: -7px;
}

.popup-gallery .modal-content .slick-slider button.slick-next {
  right: -7px;
}

.popup-gallery .modal-content .slick-slider button.slick-prev,
.popup-gallery .modal-content .slick-slider button.slick-next {
  top: calc(50% - 60px);
}

#topHeader {
  width: 100%;
  background-color: white;
}

#js-page-header .text-color-red {
  color: #de0019;
}

header {
  position: -webkit-sticky;
  /* Safari */
  position: sticky;
  /* all elements with transition */
}

header .logo-header,
header .full-table,
header #header-logo,
header .search-box-wrapper,
header #header-logo .main-logo img {
  transition: all .6s ease-out;
}

header .entire-header-wrapper {
  background-color: white;
  width: 100%;
}

header #sticky-header-wrapper ul {
  margin: 0;
}

header #sticky-header-wrapper ul li {
  vertical-align: baseline;
}

header #sticky-header-wrapper .contact-wrapper {
  line-height: 30px;
  max-height: 30px;
  overflow: hidden;
  margin: 0 20px 0 0;
}

header #sticky-header-wrapper .contact-wrapper p,
header #sticky-header-wrapper .contact-wrapper div {
  margin-bottom: 0;
  display: inline-block;
}

header #sticky-header-wrapper .contact-wrapper .phone-info {
  margin-right: 10px;
}

header #sticky-header-wrapper i {
  font-size: 14px;
}

header .main-logo .simple_disp-img a:before {
  display: block;
}

header .main-logo .simple_disp-img img {
  margin: 0;
}

header .main-logo a {
  float: left;
}

header .main-logo a:before {
  content: "";
}

header .locationSelectorDescr, header .b2bUnitSelectorDescr {
  margin-right: 5px;
}

header .dropdown {
  padding: 0;
}

header .dropdown .locationSelector,
header .dropdown .locationSelectorMobile,
header .dropdown .b2bUnitSelector,
header .dropdown .b2bUnitSelectorMobile {
  display: inline;
  position: relative;
}

header .dropdown .locationSelectorDropdown,
header .dropdown .locationSelectorDropdownMobile,
header .dropdown .b2bUnitSelectorDropdown,
header .dropdown .b2bUnitSelectorDropdownMobile {
  padding: 0;
}

header .dropdown .locationSelectorDropdown label,
header .dropdown .locationSelectorDropdownMobile label,
header .dropdown .b2bUnitSelectorDropdown label,
header .dropdown .b2bUnitSelectorDropdownMobile label {
  cursor: pointer;
}

header .dropdown .locationSelectorDropdown form,
header .dropdown .locationSelectorDropdownMobile form,
header .dropdown .b2bUnitSelectorDropdown form,
header .dropdown .b2bUnitSelectorDropdownMobile form {
  margin: 10px;
}

header .dropdown .locationSelectorDropdown form label,
header .dropdown .locationSelectorDropdownMobile form label,
header .dropdown .b2bUnitSelectorDropdown form label,
header .dropdown .b2bUnitSelectorDropdownMobile form label {
  color: #555;
  display: block;
  line-height: 20px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

header .dropdown .locationSelectorDropdown form label input,
header .dropdown .locationSelectorDropdownMobile form label input,
header .dropdown .b2bUnitSelectorDropdown form label input,
header .dropdown .b2bUnitSelectorDropdownMobile form label input {
  vertical-align: middle;
  margin: 0 5px;
  height: 20px;
}

header .dropdown .locationSelectorDropdown .location-selector__wrapper, header .dropdown .locationSelectorDropdown .b2bunit-selector__wrapper,
header .dropdown .locationSelectorDropdownMobile .location-selector__wrapper,
header .dropdown .locationSelectorDropdownMobile .b2bunit-selector__wrapper,
header .dropdown .b2bUnitSelectorDropdown .location-selector__wrapper,
header .dropdown .b2bUnitSelectorDropdown .b2bunit-selector__wrapper,
header .dropdown .b2bUnitSelectorDropdownMobile .location-selector__wrapper,
header .dropdown .b2bUnitSelectorDropdownMobile .b2bunit-selector__wrapper {
  padding: 10px;
}

header .dropdown .locationSelectorDropdown .additional-locations-b2c-label,
header .dropdown .locationSelectorDropdownMobile .additional-locations-b2c-label,
header .dropdown .b2bUnitSelectorDropdown .additional-locations-b2c-label,
header .dropdown .b2bUnitSelectorDropdownMobile .additional-locations-b2c-label {
  color: #555;
}

header .dropdown .locationSelectorDropdown .additional-locations-b2c-link,
header .dropdown .locationSelectorDropdownMobile .additional-locations-b2c-link,
header .dropdown .b2bUnitSelectorDropdown .additional-locations-b2c-link,
header .dropdown .b2bUnitSelectorDropdownMobile .additional-locations-b2c-link {
  color: #0e90d2 !important;
}

header .dropdown .locationSelectorDropdown .locationSelectorSubmit, header .dropdown .locationSelectorDropdown .b2bUnitSelectorSubmit,
header .dropdown .locationSelectorDropdownMobile .locationSelectorSubmit,
header .dropdown .locationSelectorDropdownMobile .b2bUnitSelectorSubmit,
header .dropdown .b2bUnitSelectorDropdown .locationSelectorSubmit,
header .dropdown .b2bUnitSelectorDropdown .b2bUnitSelectorSubmit,
header .dropdown .b2bUnitSelectorDropdownMobile .locationSelectorSubmit,
header .dropdown .b2bUnitSelectorDropdownMobile .b2bUnitSelectorSubmit {
  width: 100%;
  text-transform: uppercase;
  font-weight: 800;
  line-height: 28px;
  font-size: 15px;
  position: sticky;
  bottom: 0;
}

header .dropdown .locationSelectorDropdown .loadingLocations, header .dropdown .locationSelectorDropdown .loadingB2BUnits,
header .dropdown .locationSelectorDropdownMobile .loadingLocations,
header .dropdown .locationSelectorDropdownMobile .loadingB2BUnits,
header .dropdown .b2bUnitSelectorDropdown .loadingLocations,
header .dropdown .b2bUnitSelectorDropdown .loadingB2BUnits,
header .dropdown .b2bUnitSelectorDropdownMobile .loadingLocations,
header .dropdown .b2bUnitSelectorDropdownMobile .loadingB2BUnits {
  margin: 10px 5px;
}

header .dropdown .locationSelector, header .dropdown .b2bUnitSelector {
  margin-left: 5px;
  cursor: pointer;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

header .dropdown .locationSelectorMobile, header .dropdown .b2bUnitSelectorMobile {
  text-align: center;
}

header .dropdown .locationSelectorDropdown, header .dropdown .b2bUnitSelectorDropdown {
  right: 0;
  left: auto;
  top: 30px;
  max-height: 50vh;
  overflow-y: auto;
  text-overflow: ellipsis;
  max-width: 50vw;
}

header .dropdown .locationSelectorDropdown .location-selector__wrapper, header .dropdown .locationSelectorDropdown .b2bunit-selector__wrapper, header .dropdown .b2bUnitSelectorDropdown .location-selector__wrapper, header .dropdown .b2bUnitSelectorDropdown .b2bunit-selector__wrapper {
  padding: 10px;
}

header .dropdown .locationSelectorDropdown .b2bunit-selector-empty-label, header .dropdown .b2bUnitSelectorDropdown .b2bunit-selector-empty-label {
  color: #3e4954;
}

header .dropdown .locationSelectorDropdown-right, header .dropdown .b2bUnitSelectorDropdown-right {
  left: -25% !important;
  top: 30px;
}

header .dropdown .locationSelectorDropdownMobile, header .dropdown .b2bUnitSelectorDropdownMobile {
  top: 57px;
  left: 12%;
}

header .dropdown.dropdown-xs {
  position: static;
}

header .logo-header .link-contact .contact-wrapper p {
  margin-bottom: 0;
}

header .logo-header .link-contact .contact-wrapper i {
  margin-right: 5px;
}

header .logo-header .link-contact .contact-wrapper *:not(style) {
  display: inline-block;
  vertical-align: middle;
}

header .logo-header .link-contact .contact-wrapper style {
  display: none !important;
}

header .logo-header .mini-cart-wrapper {
  white-space: nowrap;
}

header .logo-header .mini-cart-wrapper .mini-cart {
  position: relative;
}

header .logo-header .mini-cart-wrapper .icon-ccart {
  position: absolute;
  left: 5px;
  top: 50%;
  transform: translateY(calc(-50% + 2px));
}

header .logo-header .mini-cart-wrapper .mc-row-wrapper {
  margin-left: 32px;
  display: inline-block;
  vertical-align: middle;
}

header .logo-header .mini-cart-wrapper .mc-price {
  font-weight: 700;
}

header .logo-header .mc-discount {
  color: #595858;
  font-weight: 300;
  font-size: 10px;
  width: 100%;
  display: flow-root;
}

header .logo-header .mc-free-freight {
  color: #000000;
  font-weight: 300;
  font-size: 12px;
  width: 100%;
  padding-top: 5px;
}

header .logo-header .mc-free-freight .mc-free-freight-price, header .logo-header .mc-free-freight .mc-free-freight-date {
  text-align: left;
  padding-left: 1px;
}

header .logo-header .mc-free-freight .positive {
  color: #127f3e;
}

header .logo-header .mc-free-freight .negative {
  color: #000;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  header .logo-header {
    /* IE10+ CSS styles */
  }
  header .logo-header .mc-discount {
    display: flex;
  }
}

@media (min-width: 970px) {
  #topHeader {
    z-index: 100;
  }
  header {
    z-index: 1050;
    top: -1px;
    /* the trick for IntersectionObserver in javascript */
  }
  .isHeaderSticky .logo-header {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .isHeaderSticky .logo-header .full-table {
    min-height: 60px;
  }
  .isHeaderSticky .logo-header #header-logo,
  .isHeaderSticky .logo-header .search-box-wrapper {
    padding-top: 0;
    padding-bottom: 0;
  }
  .isHeaderSticky .logo-header #header-logo .main-logo img {
    max-height: 50px;
    width: auto;
    height: auto;
  }
  header {
    width: 100%;
  }
  header .entire-header-wrapper {
    position: relative;
  }
  header a {
    color: #3e4954;
  }
  header a:hover {
    color: #127f3e;
  }
  header a:hover i {
    color: #127f3e;
  }
  header a i {
    color: #3e4954;
  }
  header i {
    padding-right: 5px;
  }
  #sticky-header-wrapper {
    position: relative;
    width: 100%;
    height: 30px;
    color: #000;
    background-color: #f0f0f0;
    box-shadow: 0 0 0 white;
    line-height: 30px;
    font-size: 14px;
  }
  #sticky-header-wrapper a {
    color: #000;
  }
  #sticky-header-wrapper a .additional-locations-b2c-link {
    color: #77ee77;
  }
  #sticky-header-wrapper a i {
    color: #000;
  }
  #sticky-header-wrapper a:hover {
    color: #127f3e;
  }
  #sticky-header-wrapper a:hover i {
    color: #127f3e;
  }
  #sticky-header-wrapper .header-wrapper {
    max-height: 30px;
  }
  #sticky-header-wrapper .direct-order {
    display: inline-block;
  }
  #sticky-header-wrapper .contact-wrapper div {
    display: inline-block;
  }
  #sticky-header-wrapper .contact-wrapper i {
    padding-right: 10px;
  }
  .welcome-wrapper {
    white-space: nowrap;
    margin-left: 20px;
    position: relative;
  }
  .welcome-wrapper a {
    display: inline-block;
    vertical-align: bottom;
  }
  .welcome-wrapper .username {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
  .logo-header {
    box-shadow: 0 1px 0 #f0f0f0;
    padding: 10px 0;
  }
  .logo-header .container-fluid {
    height: 100%;
  }
  .logo-header .row {
    height: 100%;
  }
  .logo-header .full-table {
    min-height: 80px;
  }
  .logo-header #header-logo {
    height: 100%;
    padding: 0 10px;
  }
  .logo-header .main-logo {
    padding: 0;
  }
  .logo-header .main-logo img {
    max-width: 280px;
    max-height: 120px;
    width: auto;
    height: auto;
  }
  .logo-header .link-item-wrapper {
    line-height: 20px;
    font-weight: bold;
    padding: 0 10px;
    text-align: right;
  }
  .logo-header .link-item-wrapper td {
    padding-top: 0;
    padding-bottom: 0;
  }
  .logo-header .link-item-wrapper i {
    font-size: 24px;
  }
  .logo-header td.link-contact {
    padding-right: 20px;
  }
  .logo-header .mini-cart-wrapper .mini-cart {
    border: 1px solid #f0f0f0;
    padding: 8px 5px;
    display: inline-block;
  }
  .logo-header .mini-cart-wrapper .count {
    float: left;
  }
  .logo-header .mini-cart-wrapper .price {
    padding-left: 13px;
  }
  .logo-header .mini-cart-wrapper .price.miniCartDiscountPrice {
    color: #595858;
  }
  .logo-header .mc-discount {
    line-height: 14px;
  }
  .logo-header .mc-discount .miniCartDiscountLabel,
  .logo-header .mc-discount .miniCartBonusPoints {
    float: left;
    padding-left: 1px;
    color: #595858;
  }
  /* reduce the width for contact slot and set minimum width for minicart, when the price for b2c is displayed in minicart */
  header.isNotB2B .link-item-wrapper .mini-cart-wrapper.isShowPrice {
    min-width: 190px;
  }
}

@media (min-width: 1200px) {
  header .welcome-wrapper .username {
    max-width: 250px;
  }
  header .dropdown .locationSelector, header .dropdown .b2bUnitSelector {
    max-width: 250px;
  }
}

@media (min-width: 970px) and (max-width: 1199px) {
  header .welcome-wrapper .username {
    max-width: 230px;
  }
  header .dropdown .locationSelector, header .dropdown .b2bUnitSelector {
    max-width: 230px;
  }
  header .logo-header .link-item-wrapper {
    padding-left: 1px;
    padding-right: 5px;
  }
}

@media (max-width: 969px) {
  header {
    top: -1px;
    /* the trick for IntersectionObserver in javascript */
    padding-top: 1px;
    /* compensate for the trick */
    background-color: white;
    z-index: 1010;
  }
  header .entire-header-wrapper {
    top: 0 !important;
  }
  .mini-cart-wrapper a {
    padding-top: 0;
    padding-bottom: 0;
    margin: 0;
    padding: 0 20px 0 20px;
    height: 40px;
    line-height: 38px;
    max-width: 100%;
    text-decoration: none;
    font-size: 14px;
    color: #3e4954;
    background-color: transparent;
    border-color: #3e4954;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    transition: all .2s ease-in-out;
  }
  .mini-cart-wrapper a i {
    color: #3e4954;
    line-height: 38px;
  }
  .mini-cart-wrapper a i.center {
    float: none;
    padding: 0;
  }
  .mini-cart-wrapper a:hover, .mini-cart-wrapper a:focus, .mini-cart-wrapper a.focus, .mini-cart-wrapper a:active {
    box-shadow: 0 0 10px -4px black;
    background-color: transparent;
    color: #3e4954;
    border-color: #3e4954;
  }
  .mini-cart-wrapper a:hover i, .mini-cart-wrapper a:focus i, .mini-cart-wrapper a.focus i, .mini-cart-wrapper a:active i {
    color: #3e4954;
  }
  .mini-cart-wrapper a.large {
    line-height: 48px;
    font-size: 18px;
    /* 18px */
  }
  .logo-header {
    position: relative;
    width: 100%;
    background-color: white;
    color: #3e4954;
  }
  .logo-header table td {
    padding-top: 0;
    padding-bottom: 0;
  }
  .logo-header #header-logo {
    padding: 0 0 0 50px;
  }
  .logo-header #header-logo .main-logo {
    display: inline-block;
  }
  .logo-header #header-logo img {
    max-height: 40px;
    max-width: 220px;
    width: auto;
  }
  .logo-header .mini-cart-wrapper a,
  .logo-header .btn:not(.siteSearchSubmit):not(.locationSelectorSubmit):not(.b2bUnitSelectorSubmit):not(.searchAllProductsBtn) {
    background-color: transparent;
    border-color: white;
    line-height: 58px;
    height: 100%;
    min-width: auto;
    padding: 0;
  }
  .logo-header .mini-cart-wrapper a i,
  .logo-header .btn:not(.siteSearchSubmit):not(.locationSelectorSubmit):not(.b2bUnitSelectorSubmit):not(.searchAllProductsBtn) i {
    color: #3e4954;
  }
  .logo-header .menu.active i.icon-menu:before {
    content: '\e907';
  }
  .logo-header .dropdown .locationSelectorSubmit, .logo-header .dropdown .b2bUnitSelectorSubmit {
    border-color: #000;
    color: white;
    background-color: #000;
  }
  .logo-header .link-item-wrapper {
    padding: 0;
    width: 100%;
  }
  .logo-header .mini-cart-wrapper {
    float: right;
  }
  .logo-header .mini-cart-wrapper .mini-cart {
    height: 60px;
    margin-left: 10px;
    margin-right: 15px;
  }
  .logo-header .mini-cart-wrapper a {
    display: block;
  }
  .logo-header .mini-cart-wrapper .mc-row-wrapper {
    text-align: right;
  }
  .logo-header .mini-cart-wrapper .miniCartCount {
    font-size: 14px;
  }
  .logo-header .mini-cart-wrapper .mc-price {
    font-size: 12px;
    line-height: 14px;
  }
  .logo-header .mini-cart-wrapper .mc-discount {
    line-height: 12px;
  }
  .logo-header .mini-cart-wrapper .miniCartCount,
  .logo-header .mini-cart-wrapper .miniCartCountLabel,
  .logo-header .mini-cart-wrapper .miniCartDiscountLabel {
    display: none;
  }
  .logo-header .mini-cart-wrapper .miniCartCount.hidePrice {
    display: inline-block;
  }
  .logo-header .account {
    overflow: visible;
  }
  .logo-header .icon-user {
    position: relative;
  }
  .logo-header .circle-check {
    display: block;
    line-height: 18px;
    border: 2px solid #127f3e;
    height: 18px;
    width: 18px;
    position: absolute;
    top: -10px;
    right: -10px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    background-color: #127f3e;
  }
  .logo-header .circle-check i.icon-check {
    padding: 0;
    color: white !important;
    line-height: 18px;
    font-size: 12px;
    vertical-align: top;
  }
  .logo-header .js-b2b-unit-selector.b2bUnitSelector {
    background-color: transparent;
    border-color: white;
    line-height: 58px;
    height: 100%;
    min-width: auto;
    padding: 0;
  }
  .logo-header .js-b2b-unit-selector.b2bUnitSelector i {
    color: #3e4954;
    -webkit-text-stroke-width: 0.01px;
    -webkit-text-stroke-color: #3e4954;
  }
  .logo-header .js-b2b-unit-selector.b2bUnitSelector .b2bUnitSelectorCurrent {
    display: none;
  }
}

@media (max-width: 767px) {
  header {
    top: -61px;
    /* the trick for IntersectionObserver in javascript */
    padding-top: 1px;
    /* compensate for the trick */
    margin-bottom: 60px;
  }
  .logo-location {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
  }
  .dropdown {
    margin: auto;
  }
  .dropdown .locationSelectorDropdown,
  .dropdown .locationSelectorDropdownMobile,
  .dropdown .b2bUnitSelectorDropdown,
  .dropdown .b2bUnitSelectorDropdownMobile {
    line-height: 30px;
    min-width: 161px;
  }
  .locationSelectorCurrent, .b2bUnitSelectorCurrent {
    font-weight: bold;
  }
  .logo-header {
    top: 60px;
    border-top: 1px solid #f0f0f0;
  }
  .logo-header .btn {
    width: 50px;
  }
  .logo-header #header-logo {
    display: block;
    position: absolute;
    top: -61px;
    left: 50%;
    transform: translateX(-50%);
    height: 60px;
    background-color: white;
    padding: 5px 10px;
  }
  .logo-header #header-logo > div {
    text-align: center;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }
}

@media (max-width: 400px) {
  .logo-header .btn {
    width: 40px;
  }
}

@media (min-width: 768px) and (max-width: 969px) {
  .logo-header .btn {
    width: 55px;
  }
  #header-logo {
    text-align: left;
  }
  .logo-location {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
  }
  .dropdown {
    margin: auto;
  }
  .dropdown .locationSelectorDropdown,
  .dropdown .locationSelectorDropdownMobile,
  .dropdown .b2bUnitSelectorDropdown,
  .dropdown .b2bUnitSelectorDropdownMobile {
    line-height: 30px;
    min-width: 161px;
  }
  .locationSelectorCurrent, .b2bUnitSelectorCurrent {
    font-weight: bold;
  }
  .locationSelectorDropdown.header .dropdown .b2bUnitSelectorDropdown {
    right: unset;
    top: unset;
  }
}

@media (max-width: 767px) {
  .b2bUnitSelectorDropdown {
    position: fixed;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%);
    z-index: 1250;
  }
  .js-b2b-unit-selector-submit.b2bUnitSelectorSubmit.btn.btn-primary {
    bottom: -1px !important;
  }
}

#footer-wrapper {
  position: relative;
  margin-top: 60px;
  /* #sub-navi-wrapper */
  /* .footerTaxNote */
}

#footer-wrapper .top-content-wrapper {
  background-color: #fff;
  border-bottom: 1px solid #f0f0f0;
}

#footer-wrapper .advantages-wrapper {
  background-color: #fff;
  border-bottom: 1px solid #f0f0f0;
}

#footer-wrapper .main-content-wrapper {
  background-color: #f0f0f0;
  border-bottom: 1px solid #595858;
}

#footer-wrapper .main-content-wrapper a {
  margin-top: 24px;
}

#footer-wrapper .main-content-wrapper li {
  margin-top: 24px;
}

#footer-wrapper .sub-navi-wrapper {
  background-color: #fff;
}

#footer-wrapper .advantages-wrapper .footer-advantage .yCmsComponent {
  padding: 35px 0;
}

#footer-wrapper ul {
  margin: 0;
  padding: 0;
}

#footer-wrapper li {
  list-style-type: none;
}

#footer-wrapper .footer-page-slot-wrapper .advantages-wrapper,
#footer-wrapper .footer-page-slot-wrapper .main-content-wrapper {
  padding-top: 20px;
  padding-bottom: 20px;
}

#footer-wrapper .sub-navi-wrapper {
  font-weight: 300;
  font-size: 14px;
  color: #595858;
}

#footer-wrapper .sub-navi-wrapper ul {
  display: inline;
  margin: 0;
  padding: 0;
}

#footer-wrapper .sub-navi-wrapper ul li {
  display: inline-block;
}

#footer-wrapper .sub-navi-wrapper ul h3 {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-size: 14px;
  color: #595858;
}

#footer-wrapper .sub-navi-wrapper ul a,
#footer-wrapper .sub-navi-wrapper ul a h3 {
  color: #595858;
  text-decoration: none;
}

#footer-wrapper .sub-navi-wrapper ul a:hover,
#footer-wrapper .sub-navi-wrapper ul a h3:hover {
  color: #595858;
}

#footer-wrapper .footerTaxNote p {
  margin-top: 5px;
  margin-bottom: 5px;
  padding: 10px;
  font-size: 12px;
  color: #595858;
  position: relative;
}

#footer-wrapper .footerTaxNote a {
  color: #595858;
}

#footer-wrapper .footerTaxNote a:hover, #footer-wrapper .footerTaxNote a:focus {
  color: #595858;
}

/* #footer-wrapper */
@media (min-width: 970px) {
  #footer-wrapper {
    /* #sub-navi-wrapper */
  }
  #footer-wrapper .footer {
    position: relative;
  }
  #footer-wrapper .flex-col-reverse {
    display: flex;
    flex-direction: column-reverse;
  }
  #footer-wrapper .sub-navi-wrapper {
    line-height: 60px;
    min-height: 60px;
    /* is required if only the middle sub navi content slot is used */
  }
  #footer-wrapper .sub-navi-wrapper ul li {
    padding: 0 0 0 15px;
  }
  #footer-wrapper .sub-navi-wrapper .sub-navigation-mid {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  #footer-wrapper .sub-navi-wrapper .sub-navigation-right {
    float: right;
  }
  #footer-wrapper .sub-navi-wrapper .sub-navigation-left {
    float: left;
  }
  #footer-wrapper .sub-navi-wrapper .sub-navigation-left li {
    float: left;
  }
  /* #footer-wrapper */
}

/* @media (min-width: $screen-md-min) */
@media (max-width: 969px) {
  #footer-wrapper {
    /* #sub-navi-wrapper */
  }
  #footer-wrapper .footer-page-slot-wrapper .main-content-wrapper .html-snippet {
    text-align: center;
    padding-top: 20px;
  }
  #footer-wrapper .sub-navi-wrapper {
    line-height: 50px;
  }
  #footer-wrapper .sub-navi-wrapper .sub-navi {
    border-bottom: 1px solid #f0f0f0;
  }
  #footer-wrapper .sub-navi-wrapper .sub-navi,
  #footer-wrapper .sub-navi-wrapper .copyright {
    display: inline-block;
    width: 100%;
    text-align: center;
  }
  #footer-wrapper .sub-navi-wrapper .sub-navigation-mid,
  #footer-wrapper .sub-navi-wrapper .sub-navigation-right,
  #footer-wrapper .sub-navi-wrapper .sub-navigation-left {
    width: 100%;
    line-height: 30px;
    display: flex;
    justify-content: center;
    padding: 10px 5px;
  }
  #footer-wrapper .sub-navi-wrapper .sub-navigation-mid li,
  #footer-wrapper .sub-navi-wrapper .sub-navigation-right li,
  #footer-wrapper .sub-navi-wrapper .sub-navigation-left li {
    padding: 0 8px;
  }
}

/* iOS-Hack - if page integrated by iframe */
.body {
  width: 1px;
  min-width: calc(100% - 4px);
}

#content {
  position: relative;
  background-color: #f0f0f0;
}

#content .yCmsComponent {
  margin-top: 30px;
  width: 100%;
}

#content .simple-cms-slider .yCmsComponent {
  margin-top: 0;
}

#content .below-add-to-cart-slot .yCmsComponent {
  margin-top: 10px;
}

.container-fluid {
  min-width: 320px;
  max-width: 1200px;
}

.page-contactPage .section2a {
  margin-right: 20px;
}

.page-contactPage .contact-page-radio-label {
  display: block;
}

.parallax-wrapper {
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
}

.page-background {
  background-color: #f0f0f0;
}

@media (max-width: 969px) {
  #breadcrumb {
    margin-top: 40px;
  }
  .parallax-wrapper {
    position: absolute;
    background-position: center 45px;
    background-size: cover;
  }
}

/* @media (max-width: $screen-xs-max) */
@media (min-width: 768px) {
  .parallax-wrapper {
    position: fixed;
    max-width: 1200px;
    background-attachment: fixed;
    background-position: center 45px;
  }
}

/* @media (min-width: $screen-sm-min) */
@media (min-width: 970px) {
  .parallax-wrapper {
    background-position: center 75px;
  }
}

/* @media (min-width: $screen-sm-min) */
@media (min-width: 1200px) {
  .parallax-wrapper {
    left: 50%;
    margin-left: -600px;
  }
}

/* @media (min-width: $screen-sm-min) */
#checkoutConfigForm {
  display: none;
}

.preloader {
  width: 100%;
  height: 140px;
  background: url("../../../shared/images/spinner-128.gif") center center no-repeat transparent;
  margin-top: 120px;
}

@media (max-width: 969px) {
  .preloader {
    margin-top: 0;
  }
}

header.checkout-header .logo-header {
  background-color: white;
  min-height: unset;
  z-index: 100;
}

header.checkout-header .logo-header .checkout-progress-wrapper {
  padding-top: 0;
  padding-bottom: 0;
}

header.checkout-header .logo-header #header-logo,
header.checkout-header .logo-header .checkout-progress-wrapper {
  background-color: white;
}

header.checkout-header .logo-header .checkout-progress-wrapper,
header.checkout-header .logo-header #checkoutProgress,
header.checkout-header .logo-header #checkoutProgress ul > .step {
  transition: all 0.3s linear;
}

@media (min-width: 970px) {
  .isHeaderSticky header.checkout-header .entire-header-wrapper .logo-header #checkoutProgress {
    padding-top: 0;
    padding-bottom: 0;
  }
  .isHeaderSticky header.checkout-header .entire-header-wrapper .logo-header #checkoutProgress ul > .step {
    padding-bottom: 5px;
  }
}

@media (max-width: 969px) {
  header.checkout-header {
    padding: 0;
    top: -60px;
  }
  header.checkout-header #header-logo,
  header.checkout-header #checkoutProgress {
    padding-bottom: 10px;
    padding-top: 10px;
  }
  header.checkout-header #header-logo {
    border-bottom: 1px solid #f0f0f0;
    text-align: center;
  }
  header.checkout-header table.full-table,
  header.checkout-header tbody,
  header.checkout-header tr,
  header.checkout-header td {
    display: block;
  }
  header.checkout-header .logo-header {
    position: relative;
    padding-left: 5px;
    padding-right: 5px;
    text-align: center;
  }
  header.checkout-header .logo-header > .container-fluid {
    padding: 0;
  }
}

.guest-form {
  margin-top: 20px;
}

.button-set {
  margin: 4em 0;
}

@media (max-width: 969px) {
  .button-set button {
    width: 100%;
  }
}

@media (min-width: 970px) {
  .button-set {
    text-align: right;
  }
}

/* Info block components */
.info-block .info-block-content {
  background-color: rgba(255, 255, 255, 0.8);
  border-top: 1px solid #f0f0f0;
}

.item-desc .item-name {
  word-wrap: break-word;
}

@media (min-width: 970px) {
  .info-block > div:first-child .info-block-header:after {
    content: '';
    position: absolute;
    top: 0;
    right: -10px;
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 10px solid #f0f0f0;
  }
}

.info-block-header {
  position: relative;
  height: 40px;
  padding: 10px;
  background: #f0f0f0;
  font-weight: 400;
}

/* datepicker component */
.datepicker .table-condensed > thead > tr > th, .datepicker .table-condensed > thead > tr > td,
.datepicker .table-condensed > tbody > tr > th, .datepicker .table-condensed > tbody > tr > td,
.datepicker .table-condensed > tfoot > tr > th, .datepicker .table-condensed > tfoot > tr > td {
  padding: 10px;
}

@media (max-width: 969px) {
  .info-block .info-block-content {
    border: 1px solid #f0f0f0;
  }
  .info-block-header,
  .summary-totals {
    border-width: 0 1px;
    border-style: solid;
    border-color: #f0f0f0;
  }
}

.page-account {
  /* START entry points */
  /* END entry points */
  /* START user account tiles and reduced navi */
  /* END user account tiles and reduced navi */
}

.page-account .account-page-heading {
  background-color: #e1e5ea;
  min-height: 50px;
  display: flex;
  display: -webkit-flex;
  align-items: center;
  justify-content: center;
}

.page-account .account-page-heading .account-heading {
  line-height: 24px;
  text-align: center;
  margin-bottom: 0;
}

.page-account .my-account-entry-points {
  margin-bottom: 30px;
}

.page-account .my-account-entry-points .inner {
  height: 100%;
  background-color: white;
  padding: 10px;
  position: relative;
  cursor: pointer;
}

.page-account .my-account-entry-points .btnCollapse {
  position: absolute;
  bottom: 0;
  right: 0;
  height: 40px;
  width: 40px;
  min-width: 40px;
  padding: 0;
}

.page-account .my-account-entry-points .btnCollapse i {
  float: none;
  padding: 0;
}

.page-account .my-account-entry-points .btnCollapse i:before {
  /* inline-block to enable rotate */
  display: inline-block;
  transition-duration: 0.4s;
  transition-property: transform;
}

.page-account .my-account-entry-points .entry-point.active .btnCollapse {
  background-color: #000;
  border-color: #000;
  color: white;
}

.page-account .my-account-entry-points .entry-point.active .btnCollapse i {
  color: white;
}

.page-account .my-account-entry-points .entry-point.active .btnCollapse i:before {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.page-account .my-account-entry-points .contact-circle {
  position: absolute;
  top: 10px;
  right: 10px;
  border: 2px solid #f0f0f0;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
}

.page-account .my-account-entry-points .contact-circle i {
  line-height: 35px;
  justify-content: center;
  display: flex;
  padding-right: 1px;
}

.page-account .my-account-entry-points .contact-circle i:before {
  padding: 0;
}

@media (min-width: 768px) {
  .page-account .my-account-entry-points .newDocumentsCount {
    bottom: 15px;
    position: absolute;
  }
}

@media (max-width: 767px) {
  .page-account .my-account-entry-points .newDocumentsCount {
    float: right;
  }
}

.page-account .my-account-entry-points .entry-point.contact .inner {
  cursor: unset;
}

.page-account .my-account-entry-points .entry-point.contact #contact-phone {
  text-decoration: underline;
}

.page-account .my-account-entry-points .entry-point.contact #contact-mail {
  text-decoration: underline;
}

.page-account .user-account-content .flexBox {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
}

.page-account .user-account-content .flexBox:after, .page-account .user-account-content .flexBox:before {
  display: none;
}

.page-account .user-account-content .flexBox .flex-col {
  height: auto;
}

.page-account .user-account-content .flexBox .inner {
  height: 100%;
}

.page-account .user-account-tiles {
  margin-left: -5px;
  margin-right: -5px;
}

.page-account .user-account-tiles .column {
  margin-bottom: 10px;
  padding: 0 5px;
}

.page-account .user-account-tiles .inner {
  padding: 25px;
  display: table;
  min-height: 155px;
  width: 100%;
  background-color: white;
}

.page-account .user-account-tiles .inner-row {
  display: table-row;
}

.page-account .user-account-tiles .icon-wrapper {
  display: table-cell;
  vertical-align: middle;
  width: 18%;
}

.page-account .user-account-tiles .icon-wrapper i {
  font-size: 25px;
}

.page-account .user-account-tiles .headline {
  margin: 0;
}

.page-account .user-account-tiles .text-wrapper {
  display: table-cell;
  vertical-align: middle;
  width: 82%;
}

.page-account .user-account-tiles .headline {
  margin-bottom: 5px;
}

.page-account .user-account-tiles p {
  margin-bottom: 0px;
}

.page-account .user-account-content:not(.reduced-nav) .link-back-to {
  display: none;
}

.page-account .reduced-nav .user-account-tiles {
  float: left;
}

.page-account .reduced-nav .user-account-tiles .inner {
  min-height: 0;
  padding: 0;
  background-color: transparent;
}

.page-account .reduced-nav .user-account-tiles .inner.active {
  color: #127f3e;
}

.page-account .reduced-nav .user-account-tiles .icon-wrapper i {
  font-size: 20px;
  position: absolute;
  top: calc(50% - 10px);
}

.page-account .reduced-nav .user-account-tiles .headline {
  margin: 0;
}

.page-account .reduced-nav .user-account-tiles p:not(.showMe) {
  display: none;
}

.page-account .reduced-nav .user-account-tiles .showMe {
  line-height: 18px;
  font-size: 12px;
}

.page-account .account-loader {
  position: absolute;
  left: calc(50% - 24px);
  z-index: 50;
}

.page-account .content-wrapper {
  position: relative;
}

.page-account .content-wrapper .description {
  padding: 0 10px;
  max-width: 600px;
  margin: 0 auto 30px auto;
  text-align: center;
}

.page-account .content-wrapper .row-heading {
  background: white;
  padding: 8px 10px;
}

.page-account .content-wrapper .row-heading .heading {
  margin: 0;
  display: inline-block;
  vertical-align: middle;
}

.page-account .content-wrapper .row-heading .link-back-to {
  margin-left: 20px;
  font-size: 12px;
  text-decoration: underline;
}

.page-account .documents .linked-documents-wrapper {
  padding-left: unset !important;
}

.page-account .documents .linked-document-type,
.page-account .documents .doc-detail-label {
  margin-top: 5px;
}

.page-account .documents .order-info {
  display: block !important;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 100%;
}

.page-account .documents .document-filter {
  margin: 10px 0 10px 0;
}

.page-account .documents .document-filter .btn.search {
  display: flex;
  justify-content: center;
  align-items: center;
}

.page-account .documents .document-filter .btn.search i {
  padding: 0;
  float: none;
  vertical-align: initial;
}

.page-account .documents .document-filter .order-number-min-input-warning, .page-account .documents .document-filter .document-number-min-input-warning {
  color: #C00000;
  display: none;
}

.page-account .documents .document-filter .document-number-input-warning-input {
  color: #C00000;
  background: #FCF3F4;
  border: 1px solid #de0019;
}

.page-account .documents .document-filter .document-number-input-warning-label {
  color: #C00000;
}

@media (min-width: 1200px) {
  .page-account .documents .document-filter .address-select {
    width: 70%;
  }
}

.page-account .documents-list .list-entry.expanded .detail-order-link.plus-icon:not(.mobile)::after,
.page-account .order-history-list .list-entry.expanded .detail-order-link.plus-icon:not(.mobile)::after,
.page-account .approval-dashboard .list-entry.expanded .detail-order-link.plus-icon:not(.mobile)::after {
  transform: rotate(180deg);
}

.page-account .documents-list .detail-link.plus-icon.approval-icon:not(.mobile)::after,
.page-account .order-history-list .detail-link.plus-icon.approval-icon:not(.mobile)::after,
.page-account .approval-dashboard .detail-link.plus-icon.approval-icon:not(.mobile)::after {
  transform: rotate(180deg);
}

.page-account .documents-list .detail-order-link.plus-icon:not(.mobile),
.page-account .order-history-list .detail-order-link.plus-icon:not(.mobile),
.page-account .approval-dashboard .detail-order-link.plus-icon:not(.mobile) {
  position: relative;
}

.page-account .documents-list .detail-order-link.plus-icon:not(.mobile)::before, .page-account .documents-list .detail-order-link.plus-icon:not(.mobile)::after,
.page-account .documents-list .detail-link.plus-icon:not(.mobile)::before,
.page-account .documents-list .detail-link.plus-icon:not(.mobile)::after,
.page-account .order-history-list .detail-order-link.plus-icon:not(.mobile)::before,
.page-account .order-history-list .detail-order-link.plus-icon:not(.mobile)::after,
.page-account .order-history-list .detail-link.plus-icon:not(.mobile)::before,
.page-account .order-history-list .detail-link.plus-icon:not(.mobile)::after,
.page-account .approval-dashboard .detail-order-link.plus-icon:not(.mobile)::before,
.page-account .approval-dashboard .detail-order-link.plus-icon:not(.mobile)::after,
.page-account .approval-dashboard .detail-link.plus-icon:not(.mobile)::before,
.page-account .approval-dashboard .detail-link.plus-icon:not(.mobile)::after {
  position: absolute;
  content: '';
  width: 15px;
  height: 1px;
  top: 20px;
  right: 20px;
  background-color: #000;
  transition: transform 0.2s ease-in-out;
}

.page-account .documents-list .detail-order-link.plus-icon:not(.mobile)::after,
.page-account .documents-list .detail-link.plus-icon:not(.mobile)::after,
.page-account .order-history-list .detail-order-link.plus-icon:not(.mobile)::after,
.page-account .order-history-list .detail-link.plus-icon:not(.mobile)::after,
.page-account .approval-dashboard .detail-order-link.plus-icon:not(.mobile)::after,
.page-account .approval-dashboard .detail-link.plus-icon:not(.mobile)::after {
  transform: rotate(90deg);
}

.page-account .documents-list .stock-title,
.page-account .documents-list .other-stock-wrapper {
  display: none;
}

.page-account .documents-list .entry-wrapper:hover {
  background-color: transparent;
}

.page-account .documents-list .productPriceContainer .price-per-unit {
  font-style: italic;
}

@media (max-width: 767px) {
  .page-account .documents-list .productPriceContainer {
    float: left;
  }
  .page-account .documents-list .addToCartContainer {
    margin-left: 25%;
    margin-top: 10px;
    float: left;
  }
  .page-account .documents-list .detail-origin-link {
    text-decoration: underline;
    font-style: italic;
  }
}

.page-account .user-content-wrapper {
  min-height: 150px;
}

.page-account .user-content-wrapper .sub-heading {
  text-align: center;
}

.page-account .user-content-wrapper .total-results {
  text-align: center;
}

.page-account .order-history-list .entry-wrapper:hover {
  background-color: transparent;
}

.page-account .order-history-list .order-history-tooltip {
  height: 40px;
  line-height: 40px;
}

.page-account .order-history .btn.search {
  display: flex;
  justify-content: center;
  align-items: center;
}

.page-account .order-history .btn.search i {
  padding: 0;
}

.page-account .order-history .wrap-text {
  overflow-wrap: break-word;
}

.page-account .order-history img.ids {
  height: 20px;
  position: relative;
  top: 7px;
}

.page-account .order-history img.delivery-mode {
  width: 30px;
}

.page-account .table-grid .table-grid-entry:nth-child(even) {
  background-color: white;
}

/* START my account old css stuff */
.accountContent .table-grid-entry i {
  color: #000;
}

.accountContent .hb-action {
  margin-top: 20px;
}

.accountContent .note {
  float: left;
  margin-top: 10px;
}

.myaccount-qty-input {
  text-align: center;
}

.my-account-text-input {
  padding-right: 5px;
  padding-left: 5px;
}

.account-profile-data .column,
.account-liability .column {
  border: 1px solid #f0f0f0;
  padding: 10px;
}

.account-profile-data .inner,
.account-liability .inner {
  border: 1px solid #f0f0f0;
  padding: 10px;
  min-height: 110px;
  overflow: hidden;
  background-color: white;
}

.account-profile-data .liability-entry,
.account-liability .liability-entry {
  margin-bottom: 10px;
}

.account-profile-data .column:nth-child(2n+3),
.account-liability .column:nth-child(2n+3) {
  clear: both;
}

.account-profile-data-advanced .inner {
  border: 1px solid #f0f0f0;
  padding: 10px 20px;
  overflow: hidden;
  min-height: 170px;
  background-color: white;
  position: relative;
}

.account-profile-data-advanced .inner .edit-link {
  display: flex;
  align-items: center;
  position: absolute;
  cursor: pointer;
  top: 10px;
  right: 20px;
}

.account-profile-data-advanced .inner .edit-link i {
  font-size: 18px;
  line-height: 24px;
}

@media (min-width: 970px) {
  .account-profile-data-advanced .inner.craftsmanfinder {
    display: flex;
    flex-wrap: wrap;
  }
}

.account-profile-data-advanced .inner.craftsmanfinder .switcher-wrapper {
  display: inline-flex;
  justify-content: flex-start;
  margin-bottom: 15px;
  gap: 5px;
  flex-direction: column;
  align-items: flex-start;
  float: right;
  width: 47%;
}

@media (min-width: 566px) {
  .account-profile-data-advanced .inner.craftsmanfinder .switcher-wrapper {
    flex-direction: row;
    align-items: center;
    width: unset;
  }
}

@media (min-width: 970px) {
  .account-profile-data-advanced .inner.craftsmanfinder .switcher-wrapper {
    float: unset;
    width: 100%;
    gap: 10px;
  }
}

.account-profile-data-advanced .inner.craftsmanfinder .switcher-wrapper .switcher-flag {
  display: flex;
  align-items: center;
  gap: 5px;
}

@media (min-width: 1200px) {
  .account-profile-data-advanced .inner.craftsmanfinder .switcher-wrapper .switcher-flag {
    width: 130px;
  }
}

@media (min-width: 1200px) {
  .account-profile-data-advanced .inner.craftsmanfinder .switcher-wrapper #js-switcher-text {
    width: calc(100% - 130px + 5px);
    margin-left: 15px;
  }
}

.account-profile-data-advanced .inner.craftsmanfinder .craftsmanfinder-logo {
  display: inline-flex;
}

.account-profile-data-advanced .inner.craftsmanfinder .craftsmanfinder-description {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  hyphens: auto;
}

@media (min-width: 970px) {
  .account-profile-data-advanced .inner.craftsmanfinder .craftsmanfinder-description {
    width: calc(100% - 130px - 15px);
    margin-left: 15px;
    align-self: flex-start;
    -webkit-line-clamp: 4;
  }
}

.account-profile-data-advanced .big-height {
  min-height: 200px;
}

@media (max-width: 767px) {
  .account-profile-data-advanced .inner {
    max-height: inherit;
    min-height: inherit;
  }
}

.myaccount-textarea {
  min-height: 40px;
  line-height: 1.5em;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  padding: 9px 10px;
  resize: vertical;
}

.simple-height-input {
  height: 40px !important;
}

.account-details-popup .product-list-header {
  padding: 10px 10px 10px 10px;
  border: 1px solid #595858;
  margin-bottom: 10px;
}

.account-details-popup .product-list-item {
  border-bottom: 1px solid #f0f0f0;
  padding-bottom: 5px;
}

.account-details-popup .no-spacing-row {
  margin-bottom: 0px;
}

.account-details-popup .account-messages .alert {
  display: none;
}

.account-details-popup .account-messages .neutral {
  display: block;
}

header-border
.btn-openModalDetails {
  line-height: inherit;
  font-weight: 300;
}

.default-size-button {
  width: 200px;
}

.full-size-button {
  width: 100%;
}

.btn .no-text-btn {
  padding-right: 0px;
  padding-left: 0px;
  float: none;
  vertical-align: baseline;
}

.btn .no-text-btn:before {
  padding-right: 0px;
  padding-left: 0px;
}

.myaccount-lightbox-addToCart {
  width: 100%;
}

.myaccount-lightbox-addToCart .icon-wrapper {
  width: 100%;
}

.btn-secondary .icon-wrapper {
  display: inline-block;
  line-height: 12px;
}

.user-box {
  font-size: 12px;
}

.user-box .title {
  color: #595858;
}

.user-box a:not(.popover-role) {
  color: #127f3e;
}

.myaccount-item-header {
  padding: 10px 0;
  background-color: #f6f7f9;
  border-bottom: 1px solid #595858;
  color: #595858;
  font-weight: 400;
  text-transform: uppercase;
  height: 40px;
}

.myaccount-item-header span {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.myaccount-item-header .mandatory-field:after {
  content: "*";
}

.myaccount-item-header.open-items-header {
  padding: 10px 5px;
}

.panel .myaccount-item-header,
.panel .info-block-header {
  background-color: #f6f7f9;
}

.panel .panel-link {
  display: block;
  outline: 0;
}

.item-group-summary {
  border-top: 1px solid #595858;
}

.small-icon {
  font-size: 12px;
}

.very-small-icon {
  font-size: 10px;
}

.myaccount-item .wishlist-submit i,
.myaccount-item .address-details-link i {
  color: #000;
}

.myaccount-item .list-item-input-box .control-label {
  display: none;
}

.myaccount-item .list-item-input-box input {
  max-width: 100%;
}

.openModalDocumentsDetails i,
.detail-permissions-link i {
  color: #000;
}

.myaccount-item > span {
  overflow: hidden;
}

.link-no-decoration::before {
  content: none;
}

.link-no-decoration:hover {
  text-decoration: none;
}

.scip-side-padding {
  padding-left: 0px;
  padding-right: 0px;
}

.replaceable-icon .loading-image {
  display: none;
}

.displayed-loading-icon {
  background-color: white;
  display: inline-block;
  float: left;
  height: 40px;
  line-height: 35px;
  padding: 0 4%;
}

.no-link {
  outline: 0;
}

.no-link:before {
  content: none;
}

.no-link:hover, .no-link:active, .no-link:focus {
  text-decoration: none;
  outline: 0;
}

.collapse-openItem i {
  position: absolute;
  top: 0;
}

.btn-icon {
  background: none;
  border: 0;
  color: #3e4954;
  padding: 0;
  line-height: inherit;
}

.btn-icon:hover, .btn-icon:active, .btn-icon:focus {
  background: none;
  padding: 0;
}

.btn-icon:hover i, .btn-icon:active i, .btn-icon:focus i {
  color: #3e4954;
}

.user-content-wrapper .pagination-wrapper,
.user-content-wrapper .paginationBar {
  height: unset;
}

.paginationBar.paginationBarDate {
  line-height: inherit;
  height: auto;
}

.paginationBar.paginationBarDate form {
  float: none;
}

.paginationBar.paginationBarDate form .select-wrapper {
  float: none;
}

.paginationBar.paginationBarDate form label {
  margin-bottom: 5px;
}

.paginationBar.paginationBarDate form button[type="submit"] {
  padding: 0;
}

.paginationBar.paginationBarDate .boxToDate .btn-calendar {
  color: #fff;
  background: #000;
}

.paginationBar.paginationBarDate .boxToDate .btn-calendar:hover {
  background: #127f3e;
}

.paginationBar.paginationBarDate .icon-search {
  padding: 0;
  float: none;
}

/* user Page */
.detail-user-link {
  word-wrap: break-word;
}

.user-box .btn-icon {
  line-height: inherit;
  font-size: 12px;
}

.user-box .btn-icon i {
  vertical-align: top;
}

.roleContainer {
  border: 1px solid #f0f0f0;
  padding-top: 30px !important;
}

.roleContainer .pseudo-checkbox {
  font-weight: 300;
}

.show-documentsDetails-form,
.show-documentsDetailsRefDokuemnt-form {
  display: inline;
}

.show-documentsDetails-form input,
.show-documentsDetailsRefDokuemnt-form input {
  border: 0;
}

.openModalDocumentsDetails {
  line-height: inherit;
  font-size: 14px;
  height: unset;
}

.openModalDocumentsDetails i {
  color: #000;
  line-height: 20px;
}

.openModalDocumentsDetails:before {
  content: "›";
}

.openModalDocumentsDetails.no-link:before {
  content: none;
}

.table-grid .orderInfoReference {
  height: 22px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (min-width: 768px) {
  #datepicker_form-left,
  #datepicker_form-right {
    position: relative;
  }
  #datepicker_form-left .datepicker,
  #datepicker_form-right .datepicker {
    top: 80px !important;
    left: 0 !important;
    min-width: 320px;
  }
}

@media (max-width: 767px) {
  .mobile-menu-overlay {
    position: fixed;
    top: 50vh !important;
    left: 50vw !important;
    transform: translate(-50%, -50%);
    min-width: 320px;
    width: 90%;
    max-width: 350px;
    z-index: 10001;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    padding: 10px;
  }
}

@media (max-width: 767px) {
  .mobile-menu-backdrop {
    position: fixed;
    top: -50vh;
    left: -50vw;
    width: 200vw !important;
    height: 200vh !important;
    overflow: hidden !important;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 10000;
  }
}

.small-icon.displayed-loading-icon {
  width: 100%;
}

.very-small-icon.displayed-loading-icon {
  width: 100%;
}

#addressForm #moreInfos.collapsing {
  width: 100%;
}

#addressForm textarea {
  min-height: 150px;
}

.collapsibleWithAnchor {
  display: inline;
  position: relative;
}

.collapsibleWithAnchor::before, .collapsibleWithAnchor::after {
  background: #127f3e;
  content: '';
  height: 1px;
  position: absolute;
  top: 50%;
  transition: transform 0.2s ease-in-out;
  width: 10px;
}

.collapsibleWithAnchor::before {
  right: -23px;
  transform: rotate(-45deg);
}

.collapsibleWithAnchor::after {
  right: -30px;
  transform: rotate(45deg);
}

.collapsibleWithAnchor.collapsed::before {
  transform: rotate(45deg);
}

.collapsibleWithAnchor.collapsed::after {
  transform: rotate(-45deg);
}

/*orders*/
.orderDetails-popup .order-totals,
#approvalDecisionForm .order-totals {
  font-size: 16px;
  padding: 15px;
}

.orderDetails-popup .order-totals.popup-order-totals .total,
#approvalDecisionForm .order-totals.popup-order-totals .total {
  border-bottom: 3px double #595858;
  margin-top: 10px;
}

.orderDetails-popup .order-totals.popup-order-totals .deliveryNoteLine,
#approvalDecisionForm .order-totals.popup-order-totals .deliveryNoteLine {
  border-bottom: 1px solid #595858;
  margin-top: 10px;
  right: 5px;
}

.orderDetails-popup .order-totals.popup-order-totals .order-totals,
#approvalDecisionForm .order-totals.popup-order-totals .order-totals {
  padding-right: 0;
}

.orderDetails-popup .order-totals.popup-order-totals .deliveryNote,
#approvalDecisionForm .order-totals.popup-order-totals .deliveryNote {
  margin-bottom: 0;
  margin-top: 10px;
}

/* Switch */
.Switch {
  position: relative;
  display: inline-block;
  font-size: 1.6em;
  font-weight: bold;
  color: #ccc;
  height: 18px;
  padding: 6px 6px 5px 6px;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  background: #f3f3f3;
  cursor: pointer;
}

.Switch.toggleError span {
  background: #de0019;
}

.Switch span {
  display: inline-block;
  width: 35px;
}

.Switch span.On {
  color: #33d2da;
}

.Switch .Toggle {
  position: absolute;
  top: 1px;
  width: 37px;
  height: 25px;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 4px;
  background: #fff;
  background: -moz-linear-gradient(top, #ececec 0%, #ffffff 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ececec), color-stop(100%, #ffffff));
  background: -webkit-linear-gradient(top, #ececec 0%, #ffffff 100%);
  background: -o-linear-gradient(top, #ececec 0%, #ffffff 100%);
  background: -ms-linear-gradient(top, #ececec 0%, #ffffff 100%);
  background: linear-gradient(top, #ececec 0%, #ffffff 100%);
  z-index: 999;
}

.Switch.On .Toggle {
  left: 2%;
}

.Switch.Off .Toggle {
  left: 60%;
}

/* Round Switch */
.Switch.Round {
  padding: 0px 20px;
  border-radius: 40px;
}

.Switch.Round .Toggle {
  border-radius: 40px;
  width: 14px;
  height: 14px;
}

.Switch.Round.On .Toggle {
  left: 60%;
  background: #127f3e;
}

.Switch.Round.Off .Toggle {
  left: 3%;
}

.Switch.Round.On.toggleError .Toggle {
  background: #de0019;
}

.disabled .switcher-wrapper span {
  visibility: hidden;
}

/* info icon roles */
#accountContent .myaccount-item-header div.popover {
  margin-left: -40;
  margin-right: -100px;
}

#accountContent .popover-role {
  cursor: pointer;
  vertical-align: baseline;
}

#accountContent .popover-role.user-list-role-icon {
  display: inline-grid;
  margin-left: 10px;
}

@media (min-width: 768px) {
  #accountContent .popover-role.user-create-roles {
    display: none;
  }
  #accountContent .popover-role.user-create-role-icon-b2badmingroup {
    bottom: 42px;
    left: 148px;
    position: relative;
  }
  #accountContent .popover-role.user-create-role-icon-b2bapprovergroup {
    bottom: 42px;
    left: 205px;
    position: relative;
  }
  #accountContent .popover-role.user-create-role-icon-b2bcustomergroup {
    bottom: 42px;
    left: 120px;
    position: relative;
  }
  #accountContent .popover-role.user-create-role-icon-b2bmanagergroup {
    bottom: 42px;
    left: 117px;
    position: relative;
  }
  #accountContent label.pseudo-checkbox-block .real-label {
    display: unset;
  }
}

@media (max-width: 767px) {
  #accountContent .popover-role.user-create-role-icon-b2badmingroup,
  #accountContent .popover-role.user-create-role-icon-b2bapprovergroup,
  #accountContent .popover-role.user-create-role-icon-b2bcustomergroup,
  #accountContent .popover-role.user-create-role-icon-b2bmanagergroup {
    display: none;
  }
  #accountContent .popover-role.user-create-roles {
    padding-left: 10px;
  }
}

/* END my account old css stuff */
.page-account .top-article-account .entry-actions .btn,
.page-account .order-history-list .entry-actions .btn,
.page-account .documents-list .entry-actions .btn,
.page-account .wishlist-list .entry-actions .btn {
  border: none;
  box-shadow: none;
}

.page-account .top-article-account .expanded .entry-wrapper,
.page-account .order-history-list .expanded .entry-wrapper,
.page-account .documents-list .expanded .entry-wrapper,
.page-account .wishlist-list .expanded .entry-wrapper {
  background: transparent;
  border-top: 1px solid #3e4954;
  border-bottom: none;
}

.page-account .top-article-account .expanded .details,
.page-account .order-history-list .expanded .details,
.page-account .documents-list .expanded .details,
.page-account .wishlist-list .expanded .details {
  border-bottom: 1px solid #3e4954;
}

.page-account .top-article-account .details .detail-loader,
.page-account .order-history-list .details .detail-loader,
.page-account .documents-list .details .detail-loader,
.page-account .wishlist-list .details .detail-loader {
  margin-left: auto;
  margin-right: auto;
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
}

.page-account .top-article-account .details .document-head,
.page-account .order-history-list .details .document-head,
.page-account .documents-list .details .document-head,
.page-account .wishlist-list .details .document-head {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 20px;
}

.page-account .top-article-account .productCode,
.page-account .order-history-list .productCode,
.page-account .documents-list .productCode,
.page-account .wishlist-list .productCode {
  font-size: 85%;
}

.page-account .top-article-account .productCode.mtm,
.page-account .order-history-list .productCode.mtm,
.page-account .documents-list .productCode.mtm,
.page-account .wishlist-list .productCode.mtm {
  color: #595858;
}

.page-account .top-article-account .productStockLevel,
.page-account .order-history-list .productStockLevel,
.page-account .documents-list .productStockLevel,
.page-account .wishlist-list .productStockLevel {
  padding-left: 0;
}

.page-account .top-article-account .stock-default-warehouse,
.page-account .order-history-list .stock-default-warehouse,
.page-account .documents-list .stock-default-warehouse,
.page-account .wishlist-list .stock-default-warehouse {
  font-size: 95%;
}

.page-account .top-article-account .stock-title,
.page-account .top-article-account .other-stock-wrapper,
.page-account .order-history-list .stock-title,
.page-account .order-history-list .other-stock-wrapper,
.page-account .documents-list .stock-title,
.page-account .documents-list .other-stock-wrapper,
.page-account .wishlist-list .stock-title,
.page-account .wishlist-list .other-stock-wrapper {
  display: none;
}

.page-account .top-article-account #productDimensions,
.page-account .order-history-list #productDimensions,
.page-account .documents-list #productDimensions,
.page-account .wishlist-list #productDimensions {
  padding-left: 0;
  padding-right: 0;
}

.page-account .top-article-account label,
.page-account .order-history-list label,
.page-account .documents-list label,
.page-account .wishlist-list label {
  font-size: 85%;
  margin-bottom: 0px;
  font-weight: 700;
}

.page-account .top-article-account .summary,
.page-account .order-history-list .summary,
.page-account .documents-list .summary,
.page-account .wishlist-list .summary {
  padding: 10px 0;
  overflow: hidden;
  flex-basis: 100%;
}

.page-account .top-article-account .required,
.page-account .order-history-list .required,
.page-account .documents-list .required,
.page-account .wishlist-list .required {
  margin-bottom: 15px;
  padding: 0 10px;
}

.page-account .top-article-account .entry-wrapper,
.page-account .top-article-account .productList .productListItem,
.page-account .order-history-list .entry-wrapper,
.page-account .order-history-list .productList .productListItem,
.page-account .documents-list .entry-wrapper,
.page-account .documents-list .productList .productListItem {
  background: white;
  background-clip: padding-box;
  border-bottom: 3px solid transparent;
  padding: 10px 0;
}

.page-account .top-article-account .productListItem .addToCartContainer .btn,
.page-account .top-article-account .productListItem .addToWishlistContainer .btn,
.page-account .order-history-list .productListItem .addToCartContainer .btn,
.page-account .order-history-list .productListItem .addToWishlistContainer .btn,
.page-account .documents-list .productListItem .addToCartContainer .btn,
.page-account .documents-list .productListItem .addToWishlistContainer .btn {
  padding: 0;
}

.page-account .wishlist-list .expanded .entry-wrapper {
  background-color: white;
  border-top: 2px solid #f0f0f0;
  border-bottom: none;
}

.page-account .wishlist-list .expanded .details {
  border-bottom: none;
}

@media (max-width: 767px) {
  #accountContent .paginationBar .pagination-label {
    display: none;
  }
  #accountContent .paginationBar .sort {
    margin-top: 10px;
  }
  #accountContent .paginationBar .mobile-pagination {
    width: 100% !important;
  }
  #accountContent .accountUnitManageUsers .paginationBar .mobile-pagination {
    bottom: 75px;
    padding: 0 10px;
  }
  #accountContent .accountUnitManageUsers .paginationBar .mobile-pagination .newUser-layer-form .btn {
    height: 40px;
  }
}

.top-articles-content .paginationBar:not(:first-child) .sort:nth-child(1),
.top-articles-content .paginationBar:not(:first-child) .sort:nth-child(2) {
  visibility: hidden;
}

/* ####################################################################### */
/* ############################### @MEDIA ################################ */
/* ####################################################################### */
@media (min-width: 768px) and (max-width: 969px) {
  .page-account .top-article-account .productActionContainer .quantityContainer button,
  .page-account .order-history-list .productActionContainer .quantityContainer button,
  .page-account .documents-list .productActionContainer .quantityContainer button,
  .page-account .wishlist-list .productActionContainer .quantityContainer button {
    display: none;
  }
}

/* ####################################################################### */
/* ############################### @MEDIA ################################ */
/* ####################################################################### */
@media (min-width: 768px) {
  .page-account {
    /* START entry points */
    /* END entry points */
    /* START user account tiles and reduced navi */
    /* END user account tiles and reduced navi */
  }
  .page-account .account-wrapper {
    margin-left: auto;
    margin-right: auto;
    max-width: calc(100% - 30px);
    float: none;
  }
  .page-account .my-account-entry-points {
    display: flex;
    display: -webkit-flex;
    margin-bottom: 30px;
  }
  .page-account .my-account-entry-points:after, .page-account .my-account-entry-points:before {
    display: none;
  }
  .page-account .my-account-entry-points .entry-point {
    flex-grow: 1;
    -webkit-flex-grow: 1;
    height: auto;
  }
  .page-account .my-account-entry-points .entry-point:not(:first-child):not(:last-child) {
    padding-left: 5px;
    padding-right: 5px;
  }
  .page-account .my-account-entry-points .entry-point:first-child {
    padding-right: 5px;
    padding-left: 0;
  }
  .page-account .my-account-entry-points .entry-point:last-child {
    padding-left: 5px;
    padding-right: 0;
  }
  .page-account .my-account-entry-points .inner {
    min-height: 155px;
  }
  .page-account .my-account-entry-points .entry-name {
    word-spacing: 1200px;
    margin-bottom: 5px;
  }
  .page-account .my-account-entry-points .entry-short-text {
    line-height: 18px;
    display: inline-block;
    margin-top: 3px;
  }
  .page-account .my-account-entry-points .contact-name.entry-row {
    margin-bottom: 10px;
  }
  .page-account .my-account-entry-points .contact-phone.entry-row,
  .page-account .my-account-entry-points .contact-mail.entry-row {
    margin-bottom: 5px;
  }
  .page-account .my-account-entry-points .btnCollapse {
    transition: background-color 0.8s ease, border-color 0.8s ease;
  }
  .page-account .account-loader {
    top: 100px;
  }
  .page-account .content-wrapper {
    min-height: 250px;
    margin-bottom: 40px;
  }
  .page-account .content-wrapper .row-heading {
    min-height: 40px;
    margin-bottom: 10px;
  }
  .page-account .reduced-nav .link-back-to {
    display: inline-block;
  }
  .page-account .reduced-nav .user-account-tiles {
    display: inline-block;
    width: 20%;
    padding-right: 10px;
    margin: 0;
  }
  .page-account .reduced-nav .user-account-tiles .column {
    width: 100%;
    padding: 0;
    margin-bottom: 10px;
  }
  .page-account .reduced-nav .user-content-wrapper {
    position: relative;
    display: inline-block;
    width: 80%;
    float: right;
    padding-left: 20px;
  }
  .page-account .top-article-account .productList .productListItem .price,
  .page-account .order-history-list .productList .productListItem .price,
  .page-account .documents-list .productList .productListItem .price,
  .page-account .wishlist-list .productList .productListItem .price {
    font-size: 16px;
  }
  .page-account .hidden-sm-up {
    display: none;
  }
  .page-account .text-right-sm-up {
    text-align: right;
  }
  .page-account .pln-sm-up {
    padding-left: 0;
  }
}

/* END @media min sm */
/* ####################################################################### */
/* ############################### @MEDIA ################################ */
/* ####################################################################### */
@media (min-width: 768px) and (max-width: 1199px) {
  .page-account .entry-short-text {
    width: calc(100% - 31px);
  }
}

/* ####################################################################### */
/* ############################### @MEDIA ################################ */
/* ####################################################################### */
@media (max-width: 768px) {
  .documents-list {
    margin-top: 50px;
  }
  .documents .paginationBar {
    height: auto;
  }
}

/* ####################################################################### */
/* ############################### @MEDIA ################################ */
/* ####################################################################### */
@media (max-width: 767px) {
  .page-account {
    /* START user account tiles and reduced navi */
    /* END user account tiles and reduced navi */
    /* START my account old css stuff */
    /* END my account old css stuff */
  }
  .page-account .my-account-entry-points {
    margin-bottom: 10px;
  }
  .page-account .my-account-entry-points .entry-point {
    margin-bottom: 5px;
    padding-left: 0;
    padding-right: 0;
  }
  .page-account .my-account-entry-points .entry-name {
    margin-bottom: 0;
  }
  .page-account .my-account-entry-points .inner {
    min-height: 40px;
    padding-right: 52px;
    transition: padding 0.1s ease;
  }
  .page-account .my-account-entry-points .btnCollapse {
    top: 0;
    right: 10px;
  }
  .page-account .my-account-entry-points .contact-name.entry-row {
    margin-bottom: 5px;
  }
  .page-account .my-account-entry-points .contact-phone.entry-row,
  .page-account .my-account-entry-points .contact-mail.entry-row {
    margin-bottom: 0px;
  }
  .page-account .my-account-entry-points .entry-point.active .inner {
    padding-right: 10px;
    padding-left: 50px;
  }
  .page-account .my-account-entry-points .entry-point.active .btnCollapse {
    left: 0;
  }
  .page-account .my-account-entry-points .entry-point.active .btnCollapse i:before {
    transform: rotate(180deg);
  }
  .page-account .my-account-entry-points .entry-point .btnCollapse i:before {
    transition-duration: 0s;
  }
  .page-account .my-account-entry-points #entryPointDocuments .entry-name {
    float: left;
  }
  .page-account .reduced-nav .user-account-tiles {
    display: block;
    width: 100%;
    padding: 10px 10px 0 10px;
    margin: 0;
    background-color: #f0f0f0;
  }
  .page-account .reduced-nav .user-account-tiles .column {
    margin-bottom: 15px;
    padding: 0 10px 0 30px;
  }
  .page-account .reduced-nav .user-content-wrapper {
    display: block;
    width: 100%;
    padding: 0 10px;
  }
  .page-account .account-loader {
    top: 50px;
  }
  .page-account .content-wrapper {
    min-height: 120px;
    margin-bottom: 30px;
  }
  .page-account .user-content-wrapper {
    float: right;
    margin-top: 20px;
  }
  .page-account .user-content-wrapper .row-heading {
    min-height: 40px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
  }
  .page-account .user-content-wrapper .row-heading i {
    padding-right: 10px;
  }
  .page-account .user-content-wrapper .row-heading .heading {
    vertical-align: sub;
  }
  .page-account .top-articles-content .listItemForm .addToCartContainer,
  .page-account .js-order-history-entry-wrapper .listItemForm .addToCartContainer {
    margin-left: 25%;
    margin-top: 10px;
    float: left;
  }
  .page-account .paginationBar.paginationBarDate .no-padding,
  .page-account .paginationBar.paginationBarDate .no-padding-left,
  .page-account .paginationBar.paginationBarDate .no-padding-right {
    padding: 0 !important;
  }
  .page-account .paginationBar.paginationBarDate .boxToDate {
    padding: 0 5px !important;
  }
  .page-account .paginationBar.paginationBarDate .boxToDate .btn-calendar {
    width: 100%;
    margin-top: 0;
  }
  .page-account .paginationBar.paginationBarDate .filterTyp {
    padding: 0 10px !important;
  }
  .page-account .account-pagination .mobile-pagination .btn {
    height: 30px;
    line-height: 28px;
    padding: 0;
  }
  .page-account .order-history-list,
  .page-account .documents-list,
  .page-account .wishlist-list {
    /*.order-history-tooltip {
        position: absolute;
        top: 18px;
        right: 50px;
      }*/
  }
  .page-account .order-history-list .list-entry,
  .page-account .documents-list .list-entry,
  .page-account .wishlist-list .list-entry {
    position: relative;
  }
  .page-account .order-history-list .list-entry .mbs:not(:last-child),
  .page-account .documents-list .list-entry .mbs:not(:last-child),
  .page-account .wishlist-list .list-entry .mbs:not(:last-child) {
    margin-bottom: 0;
  }
  .page-account .order-history-list .entry-row,
  .page-account .documents-list .entry-row,
  .page-account .wishlist-list .entry-row {
    padding-left: 10px;
  }
  .page-account .order-history-list .inline-xs,
  .page-account .documents-list .inline-xs,
  .page-account .wishlist-list .inline-xs {
    display: inline;
    padding: 0;
  }
  .page-account .order-history-list .entry-actions,
  .page-account .documents-list .entry-actions,
  .page-account .wishlist-list .entry-actions {
    font-size: 18px;
    position: absolute;
    top: 10px;
    right: 0;
    bottom: 0;
  }
  .page-account .order-history-list .entry-actions .mbs:not(:last-child),
  .page-account .documents-list .entry-actions .mbs:not(:last-child),
  .page-account .wishlist-list .entry-actions .mbs:not(:last-child) {
    margin-bottom: 10px;
  }
  .page-account .order-history-list .entry-actions .btn,
  .page-account .documents-list .entry-actions .btn,
  .page-account .wishlist-list .entry-actions .btn {
    height: 32px;
    line-height: 1;
  }
  .page-account .productList .productListItem .price {
    margin-bottom: 9px;
    font-size: 16px;
  }
  .page-account .inline-xs {
    display: inline;
    padding: 0;
  }
  .page-account .accountContent .table-grid-entry i {
    line-height: 20px;
  }
}

/* END @media max xs */
/* css for wishlist - remove this code snippet after wishlist refactoring */
.account-page-heading img {
  display: none;
}

.availability-outofstock-localization {
  color: #de0019;
}

span.stock-comment-text {
  display: none;
}

span.separator-pipe {
  display: none;
}

.link-to-open-bills {
  text-decoration: underline;
}

.link-to-open-bills:hover {
  color: #127f3e;
}

#accountContent .pagination-label {
  text-align: center;
}

.simple-checkout .availability-outofstock-localization {
  color: #de0019;
}

.simple-checkout span.stock-comment-text {
  display: none;
}

.simple-checkout span.separator-pipe {
  display: none;
}

.simple-checkout .button-set-bottom {
  padding: 20px;
  background-color: white;
}

.simple-checkout .shipping-mode-wrapper {
  background-color: white;
  padding: 15px 20px;
  margin-bottom: 20px;
}

.simple-checkout .shipping-mode-wrapper .shipping-mode-options {
  display: inline-block;
}

.simple-checkout .shipping-mode-wrapper .mode-label {
  font-weight: 700;
}

.simple-checkout .shipping-mode-wrapper .delivery-mode-option {
  margin: 0 0 0 30px;
  text-align: center;
}

.simple-checkout .redeemable-bonus-points {
  text-align: right;
}

.simple-checkout .package-delivery-date-note {
  font-size: small;
}

/* start - simple checkout configuration page */
.simple-checkout.B2CGUESTORDER #simpleCheckoutDeliveryConfigForm .col-pos,
.simple-checkout.B2CPRICEREQUEST #simpleCheckoutDeliveryConfigForm .col-pos,
.simple-checkout.B2BPRICEREQUEST #simpleCheckoutDeliveryConfigForm .col-pos {
  display: none;
}

.simple-checkout.B2CGUESTORDER #simpleCheckoutForms .order-note,
.simple-checkout.B2BORDER #simpleCheckoutForms .order-note {
  padding-top: 15px;
}

#simpleCheckoutForms hr {
  border-color: #d4d4d5;
  margin: 0;
}

#simpleCheckoutForms .bg-panel {
  background-color: white;
  padding: 20px 20px 0 20px;
}

#simpleCheckoutForms .simple-checkout-form > .bg-panel:nth-last-child(n + 3) {
  padding-bottom: 20px;
  margin-bottom: 20px;
}

#simpleCheckoutForms .simple-checkout-form .checkout-form-row {
  display: flex;
  flex-flow: wrap;
}

#simpleCheckoutForms .radio-button {
  text-align: center;
}

#simpleCheckoutForms .checkout-form-row > div:not(.col-note):not(.col-payment) {
  margin-top: 10px;
}

#simpleCheckoutForms .note-textarea-wrapper {
  margin-top: 15px;
}

#simpleCheckoutForms .col-payment {
  padding-bottom: 5px;
}

#simpleCheckoutForms .payment-type-option {
  display: block;
  margin: 15px 0;
}

#simpleCheckoutForms .form-group {
  width: 100%;
}

#simpleCheckoutForms .order-note {
  padding-bottom: 20px;
  margin-bottom: 0;
}

#simpleCheckoutForms .date input {
  width: calc(100% - 10px);
  display: inline-block;
}

#simpleCheckoutForms .date .datepicker-calendar {
  vertical-align: top;
  padding: 10px 0 0 0;
  background-color: transparent;
  border: 0;
}

#simpleCheckoutForms .date .datepicker-calendar:hover, #simpleCheckoutForms .date .datepicker-calendar:active, #simpleCheckoutForms .date .datepicker-calendar:focus {
  border-color: #3e4954;
}

#simpleCheckoutForms .date .datepicker-calendar i {
  border: 1px solid #595858;
  padding: 9px;
}

#simpleCheckoutForms .quickservice-date .datepicker-calendar {
  display: none;
}

#simpleCheckoutForms .quickservice-date .date {
  display: block;
}

#simpleCheckoutForms .quickservice-date .date input {
  width: 100%;
}

#simpleCheckoutForms .icon-calendar {
  color: #595858;
}

#simpleCheckoutForms .input-wrapper:hover .icon-calendar,
#simpleCheckoutForms .input-wrapper:focus .icon-calendar {
  color: #3e4954;
}

#simpleCheckoutForms .additional-options-wrapper {
  padding: 0 5px;
  margin: 10px 0 0 0;
}

#simpleCheckoutForms .additional-options-wrapper .additional-option {
  margin: 0 0 5px 0;
  text-align: left;
}

#simpleCheckoutForms .additional-options-wrapper .additional-option .real-label {
  white-space: normal;
}

#simpleCheckoutForms .multiple-select-wrapper {
  width: 100%;
}

#simpleCheckoutForms .order-note .pseudo-checkbox {
  margin-top: 0;
}

#simpleCheckoutForms .order-note .icon-info {
  bottom: 4px;
}

#simpleCheckoutForms #simpleCheckoutQuickserviceConfigForm .col-address {
  margin-bottom: 55px;
}

#simpleCheckoutForms .user-info .control-label {
  margin-bottom: 0;
}

#simpleCheckoutForms .user-info .addressDataOutput {
  display: block;
  padding-left: 11px;
}

.checkout-type-selector-label {
  display: contents;
  font-weight: unset !important;
}

/* ADYEN */
.create_update_payment_form .chckt-pm,
.create_update_payment_form .chckt-pm:first-child {
  border: none;
}

.create_update_payment_form .chckt-pm:last-child {
  border-bottom: 1px solid #d6d6d6;
  border-radius: 4px 4px 0 0;
  padding-bottom: 10px;
}

.create_update_payment_form .chckt-pm__header {
  cursor: pointer;
  padding: 10px 0;
}

.create_update_payment_form .chckt-pm__image {
  float: left;
  margin-left: 10px;
}

.create_update_payment_form .chckt-pm__image-border {
  border: none;
}

.create_update_payment_form .chckt-pm__radio-button {
  cursor: pointer;
  margin: 0 0 0 0;
  padding-top: 4px;
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 1px solid #a3a3a3;
  border-radius: 10px;
}

.create_update_payment_form .chckt-pm__name {
  padding-top: 0;
  line-height: 22px;
}

.create_update_payment_form .chckt-pm__details {
  padding: 0 40px;
}

.create_update_payment_form #card-div,
.create_update_payment_form .adyen-checkout__iban-input {
  padding: 20px 0;
}

.create_update_payment_form #cardLogos img {
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px inset rgba(0, 0, 0, 0.1);
  margin-right: 10px;
}

/* END - ADYEN */
/* end - simple checkout configuration page */
/* start - simple checkout summary page */
.simple-checkout.summary .info-box-row {
  display: flex;
  flex-wrap: wrap;
}

.simple-checkout.summary .info-box-row:after, .simple-checkout.summary .info-box-row:before {
  display: none;
}

.simple-checkout.summary .info-box-row > div {
  height: auto;
  margin-bottom: 20px;
}

.simple-checkout.summary .info-box {
  background-color: white;
  min-height: 145px;
  height: 100%;
  width: 100%;
}

.simple-checkout.summary .info-box .content {
  overflow: hidden;
}

.simple-checkout.summary .fa-edit {
  font-size: 24px;
}

.simple-checkout.summary #paymentCondition {
  min-height: 120px;
}

.simple-checkout.summary .cartItemHeader {
  border-bottom: 1px solid #f0f0f0;
}

.simple-checkout.summary .cartItems {
  background-color: white;
}

.simple-checkout.summary .cartItems .cartItem {
  height: 100%;
  border-bottom: 1px solid #f0f0f0;
}

.simple-checkout.summary .cartItems .cartItem .item-row {
  min-height: 90px;
}

.simple-checkout.summary .cartItems .cartItem .productImage .img-responsive {
  margin: 0;
}

.simple-checkout.summary .cartItems .cartItem .productName {
  line-height: 1.4em;
  max-height: 2.8em;
  overflow: hidden;
}

.simple-checkout.summary .cartItems .cartItem .productTotalPriceContainer {
  font-weight: bold;
}

.simple-checkout.summary .cartItems .cartItem .stock-title,
.simple-checkout.summary .cartItems .cartItem .other-stock-wrapper {
  display: none;
}

.simple-checkout.summary .cartItems .cartItem .productStockContainer .productStockLevel .light-text {
  font-size: 14px;
  font-weight: normal;
}

.simple-checkout.summary .cartItems i {
  font-size: 16px;
}

.simple-checkout.summary .cartItems .madatoryFollowupProductItem {
  margin-top: 0;
  border-top: 1px solid #f0f0f0;
  color: #595858;
}

.simple-checkout.summary .cartItems .madatoryFollowupProductItem .productInfo {
  color: #de0019;
  padding-bottom: 10px;
}

.simple-checkout.summary .totals-wrapper {
  line-height: 28px;
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.simple-checkout.summary .totals-wrapper .discount-row {
  font-weight: 700;
}

.simple-checkout.summary .totals-wrapper .summary-potential-promotions {
  margin-bottom: 10px;
  line-height: 24px;
}

.simple-checkout.summary .totals-wrapper .summary-voucher {
  margin-bottom: 10px;
}

.simple-checkout.summary .totals-wrapper .summary-voucher .coupon-checkbox-container {
  display: flex;
  padding-left: 0;
  align-items: center;
  line-height: 1;
  margin-bottom: 10px;
}

.simple-checkout.summary .totals-wrapper .summary-voucher .coupon-checkbox-container .pseudo-checkbox {
  margin-bottom: 0;
  line-height: 1;
}

.simple-checkout.summary .totals-wrapper .summary-voucher .js-voucher-respond {
  display: none;
}

.simple-checkout.summary .totals-wrapper .summary-voucher .js-voucher-respond form {
  height: 60px;
  width: 100%;
  display: inline-flex;
  gap: 10px;
}

.simple-checkout.summary .totals-wrapper .summary-voucher .js-voucher-respond #js-voucher-apply-btn {
  width: fit-content;
  height: 42px;
  min-width: unset;
}

.simple-checkout.summary .totals-wrapper .summary-voucher .js-voucher-respond #js-voucher-apply-btn:hover, .simple-checkout.summary .totals-wrapper .summary-voucher .js-voucher-respond #js-voucher-apply-btn:active, .simple-checkout.summary .totals-wrapper .summary-voucher .js-voucher-respond #js-voucher-apply-btn:focus {
  box-shadow: none;
}

.simple-checkout.summary .totals-wrapper .summary-voucher #js-voucher-code-text {
  margin-bottom: 5px;
  height: 42px;
  padding: 10px 21px;
  font-size: 14px;
}

.simple-checkout.summary .totals-wrapper .summary-voucher .js-release-voucher {
  display: flex;
  align-items: center;
  width: 100%;
  height: 42px;
  padding: 10px 21px;
  border: 1px solid #595858;
}

.simple-checkout.summary .totals-wrapper .summary-voucher i.js-release-voucher-remove-btn {
  margin-left: auto;
  font-size: 18px;
  cursor: pointer;
}

.simple-checkout.summary .totals-wrapper .summary-voucher i.js-release-voucher-remove-btn:active, .simple-checkout.summary .totals-wrapper .summary-voucher i.js-release-voucher-remove-btn:focus {
  box-shadow: none;
}

.simple-checkout.summary .inputRangeWrapper {
  margin-bottom: 25px;
}

.simple-checkout.summary #bonuspointsliderlabel {
  line-height: 24px;
}

.simple-checkout.summary #placeOrderForm .termsandconditions,
.simple-checkout.summary .useBonusPointsWrapper {
  display: flex;
}

.simple-checkout.summary #placeOrderForm .termsandconditions .pseudo-checkbox,
.simple-checkout.summary .useBonusPointsWrapper .pseudo-checkbox {
  float: left;
  overflow: visible;
  white-space: normal;
  text-indent: -30px;
  padding-left: 30px;
}

.simple-checkout.summary #placeOrderForm .termsandconditions .pseudo-checkbox .icon-check:before,
.simple-checkout.summary .useBonusPointsWrapper .pseudo-checkbox .icon-check:before {
  margin-left: 31px;
}

.simple-checkout.summary #placeOrderForm .termsandconditions .agb-label,
.simple-checkout.summary #placeOrderForm .termsandconditions .labelUseBonusPoints,
.simple-checkout.summary .useBonusPointsWrapper .agb-label,
.simple-checkout.summary .useBonusPointsWrapper .labelUseBonusPoints {
  margin-top: 0;
  float: right;
  width: 86%;
}

.simple-checkout.summary #placeOrderForm .termsandconditions a,
.simple-checkout.summary .useBonusPointsWrapper a {
  text-decoration: underline;
}

.simple-checkout.summary #placeOrderForm .termsandconditions a:before,
.simple-checkout.summary .useBonusPointsWrapper a:before {
  display: inline;
}

.simple-checkout.summary #placeOrderForm .force-left-button-container {
  position: absolute;
  right: 100%;
}

/* end - simple checkout summary page */
@media (max-width: 320px) {
  .anonymous-delivery-address-options > div {
    margin-bottom: 20px;
  }
}

@media (min-width: 970px) {
  .simple-checkout {
    padding-left: 0;
    padding-right: 0;
  }
  .simple-checkout .button-set-bottom .btn-primary {
    float: right;
  }
  .simple-checkout .button-set-bottom .btn-function {
    min-width: 200px;
  }
  /* start - simple checkout configuration page */
  #simpleCheckoutForms .address-section .chosen-container .chosen-drop {
    display: inline-table;
    padding-top: 5px;
    box-shadow: 0 -4px 4px -4px #595858;
  }
  #simpleCheckoutForms .address-section .chosen-container .chosen-drop li {
    max-width: 85vw;
  }
  #simpleCheckoutForms .new-address-wrapper {
    position: absolute;
    margin-top: 15px;
  }
  #simpleCheckoutForms .earliest-collect-date {
    position: absolute;
    bottom: 5px;
  }
  #simpleCheckoutForms #simpleCheckoutQuickserviceConfigForm .col-address {
    margin-bottom: 55px;
  }
  #simpleCheckoutForms #anonymousDeliverySeparateForm {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }
  #simpleCheckoutCollectConfigForm .form-group.site-address {
    margin-bottom: 65px;
  }
  /* end - simple checkout configuration page */
  /* start - simple checkout summary page */
  .simple-checkout.summary .cartItem .stock-default-warehouse {
    margin-bottom: 0;
  }
  /* end - simple checkout summary page */
}

@media (max-width: 969px) {
  .simple-checkout {
    padding-left: 0;
    padding-right: 0;
  }
  .simple-checkout .shipping-mode-wrapper {
    padding-top: 5px;
  }
  .simple-checkout .shipping-mode-wrapper .mode-label {
    margin: 10px 0 0 30px;
    display: inline-block;
    vertical-align: middle;
  }
  .simple-checkout .shipping-mode-wrapper .delivery-mode-option {
    margin: 10px 0 0 30px;
  }
  /* start - simple checkout configuration page */
  #simpleCheckoutForms {
    padding: 20px 20px 0 20px;
  }
  #simpleCheckoutForms .checkout-form-row {
    margin-top: 0;
    display: flex;
    flex-wrap: wrap;
  }
  #simpleCheckoutForms .checkout-form-row .col-pos {
    order: 1;
  }
  #simpleCheckoutForms .checkout-form-row .col-address {
    order: 2;
  }
  #simpleCheckoutForms .checkout-form-row .col-date {
    order: 3;
  }
  #simpleCheckoutForms .checkout-form-row .col-time {
    order: 4;
  }
  #simpleCheckoutForms .checkout-form-row > div {
    margin-top: 15px;
  }
  #simpleCheckoutForms .form-group {
    width: 100%;
  }
  #simpleCheckoutForms .new-address-wrapper {
    margin-top: 15px;
  }
  #simpleCheckoutForms .button-set-bottom > div {
    text-align: center;
    margin-bottom: 20px;
  }
  #simpleCheckoutForms .button-set-bottom .btn {
    text-align: left;
    min-width: 300px;
  }
  #simpleCheckoutForms .button-set-bottom .back-btn {
    margin-bottom: 20px;
  }
  /* end - simple checkout configuration page */
  /* start - simple checkout summary page */
  .simple-checkout.summary .infoBoxWrapperTop {
    background-color: #f0f0f0;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box-row {
    display: grid;
    margin-bottom: 0;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box {
    background-color: white;
    min-height: unset;
    margin-bottom: 10px;
    cursor: pointer;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box .content {
    display: none;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box .summary-edit-link {
    visibility: hidden;
    position: absolute;
    bottom: 20px;
    float: left;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box .summary-edit-link i {
    font-size: 26px;
    line-height: 26px;
    float: left;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box .summary-edit-link span {
    float: left;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box i.icon-arrow-down {
    font-size: 8px;
    line-height: 20px;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box i.icon-arrow-down:before {
    /* inline-block to enable rotate */
    display: inline-block;
    transition-duration: 0.4s;
    transition-property: transform;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box.active .summary-edit-link {
    visibility: visible;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box.active .content {
    display: block;
    border-top: 1px solid #f0f0f0;
    padding: 10px 0 30px;
  }
  .simple-checkout.summary .infoBoxWrapperTop .info-box.active i.icon-arrow-down:before {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  .simple-checkout.summary .cartItems .cartItem .productName {
    max-height: 4.2em;
  }
  .simple-checkout.summary .cartItems .cartItem .productItemQuantityContainer,
  .simple-checkout.summary .cartItems .cartItem .productItemPriceContainer,
  .simple-checkout.summary .cartItems .cartItem .productTotalPriceContainer {
    margin-top: 5px;
  }
  .simple-checkout.summary .cartItems .cartItem .productDetailsWrapper > div:last-child {
    margin-bottom: 10px;
    border-bottom: 1px solid #f0f0f0;
  }
  /* end - simple checkout summary page */
}

@media (max-width: 969px) {
  .page-simpleCheckoutConfigurationPage h1,
  .page-simpleCheckoutSummaryPage h1 {
    font-size: 26px;
  }
  #simpleCheckoutForms .button-set-bottom .btn {
    min-width: 280px;
  }
}

@media (max-width: 400px) {
  #simpleCheckoutForms .button-set-bottom .btn {
    min-width: 250px;
  }
}

@media (max-width: 767px) {
  .cart-weight-value {
    text-align: right;
  }
}

.skiptocontent,
.skiptonavigation,
.skip {
  position: absolute;
  z-index: 10000;
  left: -3000px;
}

.skiptocontent:before,
.skiptonavigation:before,
.skip:before {
  content: none;
}

.no-padding {
  padding: 0 !important;
}

.no-padding-right {
  padding-right: 0 !important;
}

.no-padding-left {
  padding-left: 0 !important;
}

.no-margin {
  margin: 0 !important;
}

.no-border {
  border: none !important;
}

.left {
  float: left;
}

.right {
  float: right;
}

.center {
  text-align: center;
}

.mrg-top {
  margin-top: 10px;
}

.mrg-bottom {
  margin-bottom: 10px;
}

.mrg {
  margin: 10px;
}

.padding {
  padding: 10px;
}

.full-width {
  width: 100%;
}

.notimplementedyet {
  background-color: yellow !important;
}

.img-center {
  margin: 0 auto;
}

.hidden {
  display: none;
}

.bold {
  font-weight: 700;
}

.margin-top-50 {
  margin-top: 50px;
}

.hb-overflow {
  overflow: hidden;
}

.hb-action {
  width: 100%;
  float: left;
  margin-top: 20px;
}

.posStatic {
  position: static;
}

.text-color-green {
  color: #127f3e;
}

.text-color-red {
  color: #de0019;
}

.bb-double {
  border-bottom: 3px double #3e4954;
}

.clear-before:before {
  content: none !important;
}

.placeholdersjs {
  color: #f0f0f0;
}

.box {
  border: 1px solid #f0f0f0;
}

/* This entire section makes Bootstrap Modals work with iOS */
.modal-ios {
  position: absolute;
  overflow: visible;
}

.ui-helper-hidden-accessible {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.text-wide {
  margin-left: auto;
  margin-right: auto;
  width: 66%;
}

.light-text {
  font-size: 12px;
  font-weight: bold;
  color: #595858;
}

.star-ref:after {
  content: '*';
}

.break-word {
  word-wrap: break-word;
}

.sticked {
  position: fixed;
  width: 100%;
  max-width: 1200px;
}

.unsticked {
  position: absolute;
  width: 100%;
  max-width: 1200px;
}

.bg-grey {
  background-color: #595858;
}

.bg-white {
  background-color: #fff;
}

.border-bottom-grey-light {
  border-bottom: 1px solid #f0f0f0;
}

@media (max-width: 767px) {
  .no-border-xs {
    border: 0 !important;
  }
}

.white {
  color: white;
}

.iframeWrapper {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  padding-top: 25px;
  height: 0;
}

.iframeWrapper embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.container-maxW {
  width: 100% !important;
}

.bg-white-concrete-wall {
  background: url(../images/30ProzentWeiss_ThinkstockPhotos-611991642.jpg);
}

.centered {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.inline-block {
  display: inline-block;
}

.stock-indicator {
  display: inline-block;
  width: 12px;
  height: 12px;
  border: 2px solid black;
  margin-right: 5px;
  vertical-align: middle;
  margin-top: 5px;
}

.stock-indicator.positive {
  background-color: #127f3e;
}

.stock-indicator.negative {
  background-color: #f9b409;
}

.stock-indicator.negative.red {
  background-color: #de0019;
}

.skip-link {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.infoPopupHtml {
  cursor: pointer;
}

/* padding all scale */
.pan {
  padding: 0;
}

.paxs {
  padding: 5px;
}

.pas {
  padding: 5px;
}

.pam {
  padding: 10px;
}

.pal {
  padding: 20px;
}

.pax {
  padding: 40px;
}

.paxl {
  padding: 80px;
}

.paxxl {
  padding: 160px;
}

/* padding left */
.pln {
  padding-left: 0;
}

.plxs {
  padding-left: 5px;
}

.pls {
  padding-left: 5px;
}

.plm {
  padding-left: 10px;
}

.pll {
  padding-left: 20px;
}

.plx {
  padding-left: 40px;
}

.plxl {
  padding-left: 80px;
}

.plxxl {
  padding-left: 160px;
}

/* padding right */
.prn {
  padding-right: 0;
}

.prxs {
  padding-right: 5px;
}

.prs {
  padding-right: 5px;
}

.prm {
  padding-right: 10px;
}

.prl {
  padding-right: 20px;
}

.prx {
  padding-right: 40px;
}

.prxl {
  padding-right: 80px;
}

.prxxl {
  padding-right: 160px;
}

/* padding bottom */
.pbn {
  padding-bottom: 0;
}

.pbxs {
  padding-bottom: 5px;
}

.pbs {
  padding-bottom: 5px;
}

.pbm {
  padding-bottom: 10px;
}

.pbl {
  padding-bottom: 20px;
}

.pbx {
  padding-bottom: 40px;
}

.pbxl {
  padding-bottom: 80px;
}

.pbxxl {
  padding-bottom: 160px;
}

/* padding top */
.ptn {
  padding-top: 0;
}

.ptxs {
  padding-top: 5px;
}

.pts {
  padding-top: 5px;
}

.ptm {
  padding-top: 10px;
}

.ptl {
  padding-top: 20px;
}

.ptx {
  padding-top: 40px;
}

.ptxl {
  padding-top: 80px;
}

.ptxxl {
  padding-top: 160px;
}

/* padding vertical */
.pvn {
  padding-top: 0;
  padding-bottom: 0;
}

.pvxs {
  padding-top: 5px;
  padding-bottom: 5px;
}

.pvs {
  padding-top: 5px;
  padding-bottom: 5px;
}

.pvm {
  padding-top: 10px;
  padding-bottom: 10px;
}

.pvl {
  padding-top: 20px;
  padding-bottom: 20px;
}

.pvx {
  padding-top: 40px;
  padding-bottom: 40px;
}

.pvxl {
  padding-top: 80px;
  padding-bottom: 80px;
}

.pvxxl {
  padding-top: 160px;
  padding-bottom: 160px;
}

/* padding horizontal */
.phn {
  padding-left: 0;
  padding-right: 0;
}

.phxs {
  padding-left: 5px;
  padding-right: 5px;
}

.phs {
  padding-left: 5px;
  padding-right: 5px;
}

.phm {
  padding-left: 10px;
  padding-right: 10px;
}

.phl {
  padding-left: 20px;
  padding-right: 20px;
}

.phx {
  padding-left: 40px;
  padding-right: 40px;
}

.phxl {
  padding-left: 80px;
  padding-right: 80px;
}

.phxxl {
  padding-left: 160px;
  padding-right: 160px;
}

/* margin all */
.man {
  margin: 0;
}

.maxs {
  margin: 5px;
}

.mas {
  margin: 5px;
}

.mam {
  margin: 10px;
}

.mal {
  margin: 20px;
}

.max {
  margin: 40px;
}

.maxl {
  margin: 80px;
}

.maxxl {
  margin: 160px;
}

/* margin left */
.mln {
  margin-left: 0;
}

.mlxs {
  margin-left: 5px;
}

.mls {
  margin-left: 5px;
}

.mlm {
  margin-left: 10px;
}

.mll {
  margin-left: 20px;
}

.mlx {
  margin-left: 40px;
}

.mlxl {
  margin-left: 80px;
}

.mlxxl {
  margin-left: 160px;
}

/* margin right */
.mrn {
  margin-right: 0;
}

.mrxs {
  margin-right: 5px;
}

.mrs {
  margin-right: 5px;
}

.mrm {
  margin-right: 10px;
}

.mrl {
  margin-right: 20px;
}

.mrx {
  margin-right: 40px;
}

.mrxl {
  margin-right: 80px;
}

.mrxxl {
  margin-right: 160px;
}

/* margin bottom */
.mbn {
  margin-bottom: 0;
}

.mbxs {
  margin-bottom: 5px;
}

.mbs {
  margin-bottom: 5px;
}

.mbm {
  margin-bottom: 10px;
}

.mbl {
  margin-bottom: 20px;
}

.mbx {
  margin-bottom: 40px;
}

.mbxl {
  margin-bottom: 80px;
}

.mbxxl {
  margin-bottom: 160px;
}

/* margin top */
.mtn {
  margin-top: 0;
}

.mtxs {
  margin-top: 5px;
}

.mts {
  margin-top: 5px;
}

.mtm {
  margin-top: 10px;
}

.mtl {
  margin-top: 20px;
}

.mtx {
  margin-top: 40px;
}

.mtxl {
  margin-top: 80px;
}

.mtxxl {
  margin-top: 160px;
}

/* margin vertical */
.mvn {
  margin-top: 0;
  margin-bottom: 0rem;
}

.mvxs {
  margin-top: 5px;
  margin-bottom: 5px;
}

.mvs {
  margin-top: 5px;
  margin-bottom: 5px;
}

.mvm {
  margin-top: 10px;
  margin-bottom: 10px;
}

.mvl {
  margin-top: 20px;
  margin-bottom: 20px;
}

.mvx {
  margin-top: 40px;
  margin-bottom: 40px;
}

.mvxl {
  margin-top: 80px;
  margin-bottom: 80px;
}

.mvxl {
  margin-top: 160px;
  margin-bottom: 160px;
}

/* margin horizontal */
.mhn {
  margin-left: 0;
  margin-right: 0;
}

.mhs {
  margin-left: 5px;
  margin-right: 5px;
}

.mhm {
  margin-left: 10px;
  margin-right: 10px;
}

.mhl {
  margin-left: 20px;
  margin-right: 20px;
}

.mhx {
  margin-left: 40px;
  margin-right: 40px;
}

.mhxl {
  margin-left: 80px;
  margin-right: 80px;
}

.mhxxl {
  margin-left: 160px;
  margin-right: 160px;
}

@media screen and (max-width: 767px) {
  .pan-ns {
    padding: 0;
  }
  .paxs-ns {
    padding: 5px;
  }
  .pas-ns {
    padding: 5px;
  }
  .pam-ns {
    padding: 10px;
  }
  .pal-ns {
    padding: 20px;
  }
  .pax-ns {
    padding: 40px;
  }
  .paxl-ns {
    padding: 80px;
  }
  .paxxl-ns {
    padding: 160px;
  }
  .pln-ns {
    padding-left: 0;
  }
  .plxs-ns {
    padding-left: 5px;
  }
  .pls-ns {
    padding-left: 5px;
  }
  .plm-ns {
    padding-left: 10px;
  }
  .pll-ns {
    padding-left: 20px;
  }
  .plx-ns {
    padding-left: 40px;
  }
  .plxl-ns {
    padding-left: 80px;
  }
  .plxxl-ns {
    padding-left: 160px;
  }
  .prn-ns {
    padding-right: 0;
  }
  .prxs-ns {
    padding-right: 5px;
  }
  .prs-ns {
    padding-right: 5px;
  }
  .prm-ns {
    padding-right: 10px;
  }
  .prl-ns {
    padding-right: 20px;
  }
  .prx-ns {
    padding-right: 40px;
  }
  .prxl-ns {
    padding-right: 80px;
  }
  .prxxl-ns {
    padding-right: 160px;
  }
  .pbn-ns {
    padding-bottom: 0;
  }
  .pbxs-ns {
    padding-bottom: 5px;
  }
  .pbs-ns {
    padding-bottom: 5px;
  }
  .pbm-ns {
    padding-bottom: 10px;
  }
  .pbl-ns {
    padding-bottom: 20px;
  }
  .pbx-ns {
    padding-bottom: 40px;
  }
  .pbxl-ns {
    padding-bottom: 80px;
  }
  .pbxxl-ns {
    padding-bottom: 160px;
  }
  .ptn-ns {
    padding-top: 0;
  }
  .ptxs-ns {
    padding-top: 5px;
  }
  .pts-ns {
    padding-top: 5px;
  }
  .ptm-ns {
    padding-top: 10px;
  }
  .ptl-ns {
    padding-top: 20px;
  }
  .ptx-ns {
    padding-top: 40px;
  }
  .ptxl-ns {
    padding-top: 80px;
  }
  .ptxxl-ns {
    padding-top: 160px;
  }
  .pvn-ns {
    padding-top: 0;
    padding-bottom: 0;
  }
  .pvxs-ns {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .pvs-ns {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .pvm-ns {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .pvl-ns {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .pvx-ns {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .pvxl-ns {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .pvxxl-ns {
    padding-top: 160px;
    padding-bottom: 160px;
  }
  .phn-ns {
    padding-left: 0;
    padding-right: 0;
  }
  .pvxs-ns {
    padding-left: 5px;
    padding-right: 5px;
  }
  .phs-ns {
    padding-left: 5px;
    padding-right: 5px;
  }
  .phm-ns {
    padding-left: 10px;
    padding-right: 10px;
  }
  .phl-ns {
    padding-left: 20px;
    padding-right: 20px;
  }
  .phx-ns {
    padding-left: 40px;
    padding-right: 40px;
  }
  .phxl-ns {
    padding-left: 80px;
    padding-right: 80px;
  }
  .phxxl-ns {
    padding-left: 160px;
    padding-right: 160px;
  }
  .man-ns {
    margin: 0;
  }
  .maxs-ns {
    margin: 5px;
  }
  .mas-ns {
    margin: 5px;
  }
  .mam-ns {
    margin: 10px;
  }
  .mal-ns {
    margin: 20px;
  }
  .max-ns {
    margin: 40px;
  }
  .maxl-ns {
    margin: 80px;
  }
  .maxxl-ns {
    margin: 160px;
  }
  .mln-ns {
    margin-left: 0;
  }
  .mlxs-ns {
    margin-left: 5px;
  }
  .mls-ns {
    margin-left: 5px;
  }
  .mlm-ns {
    margin-left: 10px;
  }
  .mll-ns {
    margin-left: 20px;
  }
  .mlx-ns {
    margin-left: 40px;
  }
  .mlxl-ns {
    margin-left: 80px;
  }
  .mlxxl-ns {
    margin-left: 160px;
  }
  .mrn-ns {
    margin-right: 0;
  }
  .mrxs-ns {
    margin-right: 5px;
  }
  .mrs-ns {
    margin-right: 5px;
  }
  .mrm-ns {
    margin-right: 10px;
  }
  .mrl-ns {
    margin-right: 20px;
  }
  .mrx-ns {
    margin-right: 40px;
  }
  .mrxl-ns {
    margin-right: 80px;
  }
  .mrxxl-ns {
    margin-right: 160px;
  }
  .mbn-ns {
    margin-bottom: 0;
  }
  .mbxs-ns {
    margin-bottom: 5px;
  }
  .mbs-ns {
    margin-bottom: 5px;
  }
  .mbm-ns {
    margin-bottom: 10px;
  }
  .mbl-ns {
    margin-bottom: 20px;
  }
  .mbx-ns {
    margin-bottom: 40px;
  }
  .mbxl-ns {
    margin-bottom: 80px;
  }
  .mbxxl-ns {
    margin-bottom: 160px;
  }
  .mtn-ns {
    margin-top: 0;
  }
  .mtxs-ns {
    margin-top: 5px;
  }
  .mts-ns {
    margin-top: 5px;
  }
  .mtm-ns {
    margin-top: 10px;
  }
  .mtl-ns {
    margin-top: 20px;
  }
  .mtx-ns {
    margin-top: 40px;
  }
  .mtxl-ns {
    margin-top: 80px;
  }
  .mtxxl-ns {
    margin-top: 160px;
  }
  .mvn-ns {
    margin-top: 0;
    margin-bottom: 0rem;
  }
  .mvxs-ns {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mvs-ns {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mvm-ns {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .mvl-ns {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .mvx-ns {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .mvxl-ns {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .mvxxl-ns {
    margin-top: 160px;
    margin-bottom: 160px;
  }
  .mhn-ns {
    margin-left: 0;
    margin-right: 0;
  }
  .mhs-ns {
    margin-left: 5px;
    margin-right: 5px;
  }
  .mhm-ns {
    margin-left: 10px;
    margin-right: 10px;
  }
  .mhl-ns {
    margin-left: 20px;
    margin-right: 20px;
  }
  .mhx-ns {
    margin-left: 40px;
    margin-right: 40px;
  }
  .mhxl-ns {
    margin-left: 80px;
    margin-right: 80px;
  }
  .mhxxl-ns {
    margin-left: 160px;
    margin-right: 160px;
  }
}

@media screen and (min-width: 768px) and (max-width: 969px) {
  .pan-sm {
    padding: 0;
  }
  .paxs-sm {
    padding: 5px;
  }
  .pas-sm {
    padding: 5px;
  }
  .pam-sm {
    padding: 10px;
  }
  .pal-sm {
    padding: 20px;
  }
  .pax-sm {
    padding: 40px;
  }
  .paxl-sm {
    padding: 80px;
  }
  .paxxl-sm {
    padding: 160px;
  }
  .pln-sm {
    padding-left: 0;
  }
  .plxs-sm {
    padding-left: 5px;
  }
  .pls-sm {
    padding-left: 5px;
  }
  .plm-sm {
    padding-left: 10px;
  }
  .pll-sm {
    padding-left: 20px;
  }
  .plx-sm {
    padding-left: 40px;
  }
  .plxl-sm {
    padding-left: 80px;
  }
  .plxxl-sm {
    padding-left: 160px;
  }
  .prn-sm {
    padding-right: 0;
  }
  .prxs-sm {
    padding-right: 5px;
  }
  .prs-sm {
    padding-right: 5px;
  }
  .prm-sm {
    padding-right: 10px;
  }
  .prl-sm {
    padding-right: 20px;
  }
  .prx-sm {
    padding-right: 40px;
  }
  .prxl-sm {
    padding-right: 80px;
  }
  .prxxl-sm {
    padding-right: 160px;
  }
  .pbn-sm {
    padding-bottom: 0;
  }
  .pbxs-sm {
    padding-bottom: 5px;
  }
  .pbs-sm {
    padding-bottom: 5px;
  }
  .pbm-sm {
    padding-bottom: 10px;
  }
  .pbl-sm {
    padding-bottom: 20px;
  }
  .pbx-sm {
    padding-bottom: 40px;
  }
  .pbxl-sm {
    padding-bottom: 80px;
  }
  .pbxxl-sm {
    padding-bottom: 160px;
  }
  .ptn-sm {
    padding-top: 0;
  }
  .ptxs-sm {
    padding-top: 5px;
  }
  .pts-sm {
    padding-top: 5px;
  }
  .ptm-sm {
    padding-top: 10px;
  }
  .ptl-sm {
    padding-top: 20px;
  }
  .ptx-sm {
    padding-top: 40px;
  }
  .ptxl-sm {
    padding-top: 80px;
  }
  .ptxxl-sm {
    padding-top: 160px;
  }
  .pvn-sm {
    padding-top: 0;
    padding-bottom: 0;
  }
  .pvxs-sm {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .pvs-sm {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .pvm-sm {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .pvl-sm {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .pvx-sm {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .pvxl-sm {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .pvxxl-sm {
    padding-top: 160px;
    padding-bottom: 160px;
  }
  .phn-sm {
    padding-left: 0;
    padding-right: 0;
  }
  .pvxs-sm {
    padding-left: 5px;
    padding-right: 5px;
  }
  .phs-sm {
    padding-left: 5px;
    padding-right: 5px;
  }
  .phm-sm {
    padding-left: 10px;
    padding-right: 10px;
  }
  .phl-sm {
    padding-left: 20px;
    padding-right: 20px;
  }
  .phx-sm {
    padding-left: 40px;
    padding-right: 40px;
  }
  .phxl-sm {
    padding-left: 80px;
    padding-right: 80px;
  }
  .phxxl-sm {
    padding-left: 160px;
    padding-right: 160px;
  }
  .man-sm {
    margin: 0;
  }
  .maxs-sm {
    margin: 5px;
  }
  .mas-sm {
    margin: 5px;
  }
  .mam-sm {
    margin: 10px;
  }
  .mal-sm {
    margin: 20px;
  }
  .max-sm {
    margin: 40px;
  }
  .maxl-sm {
    margin: 80px;
  }
  .maxxl-sm {
    margin: 160px;
  }
  .mln-sm {
    margin-left: 0;
  }
  .mlxs-sm {
    margin-left: 5px;
  }
  .mls-sm {
    margin-left: 5px;
  }
  .mlm-sm {
    margin-left: 10px;
  }
  .mll-sm {
    margin-left: 20px;
  }
  .mlx-sm {
    margin-left: 40px;
  }
  .mlxl-sm {
    margin-left: 80px;
  }
  .mlxxl-sm {
    margin-left: 160px;
  }
  .mrn-sm {
    margin-right: 0;
  }
  .mrxs-sm {
    margin-right: 5px;
  }
  .mrs-sm {
    margin-right: 5px;
  }
  .mrm-sm {
    margin-right: 10px;
  }
  .mrl-sm {
    margin-right: 20px;
  }
  .mrx-sm {
    margin-right: 40px;
  }
  .mrxl-sm {
    margin-right: 80px;
  }
  .mrxxl-sm {
    margin-right: 160px;
  }
  .mbn-sm {
    margin-bottom: 0;
  }
  .mbxs-sm {
    margin-bottom: 5px;
  }
  .mbs-sm {
    margin-bottom: 5px;
  }
  .mbm-sm {
    margin-bottom: 10px;
  }
  .mbl-sm {
    margin-bottom: 20px;
  }
  .mbx-sm {
    margin-bottom: 40px;
  }
  .mbxl-sm {
    margin-bottom: 80px;
  }
  .mbxxl-sm {
    margin-bottom: 160px;
  }
  .mtn-sm {
    margin-top: 0;
  }
  .mtxs-sm {
    margin-top: 5px;
  }
  .mts-sm {
    margin-top: 5px;
  }
  .mtm-sm {
    margin-top: 10px;
  }
  .mtl-sm {
    margin-top: 20px;
  }
  .mtx-sm {
    margin-top: 40px;
  }
  .mtxl-sm {
    margin-top: 80px;
  }
  .mtxxl-sm {
    margin-top: 160px;
  }
  .mvn-sm {
    margin-top: 0;
    margin-bottom: 0rem;
  }
  .mvxs-sm {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mvs-sm {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mvm-sm {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .mvl-sm {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .mvx-sm {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .mvxl-sm {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .mvxxl-sm {
    margin-top: 160px;
    margin-bottom: 160px;
  }
  .mhn-sm {
    margin-left: 0;
    margin-right: 0;
  }
  .mhs-sm {
    margin-left: 5px;
    margin-right: 5px;
  }
  .mhm-sm {
    margin-left: 10px;
    margin-right: 10px;
  }
  .mhl-sm {
    margin-left: 20px;
    margin-right: 20px;
  }
  .mhx-sm {
    margin-left: 40px;
    margin-right: 40px;
  }
  .mhxl-sm {
    margin-left: 80px;
    margin-right: 80px;
  }
  .mhxxl-sm {
    margin-left: 160px;
    margin-right: 160px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .pan-m {
    padding: 0;
  }
  .paxs-m {
    padding: 5px;
  }
  .pas-m {
    padding: 5px;
  }
  .pam-m {
    padding: 10px;
  }
  .pal-m {
    padding: 20px;
  }
  .pax-m {
    padding: 40px;
  }
  .paxl-m {
    padding: 80px;
  }
  .paxxl-m {
    padding: 160px;
  }
  .pln-m {
    padding-left: 0;
  }
  .plxs-m {
    padding-left: 5px;
  }
  .pls-m {
    padding-left: 5px;
  }
  .plm-m {
    padding-left: 10px;
  }
  .pll-m {
    padding-left: 20px;
  }
  .plx-m {
    padding-left: 40px;
  }
  .plxl-m {
    padding-left: 80px;
  }
  .plxxl-m {
    padding-left: 160px;
  }
  .prn-m {
    padding-right: 0;
  }
  .prxs-m {
    padding-right: 5px;
  }
  .prs-m {
    padding-right: 5px;
  }
  .prm-m {
    padding-right: 10px;
  }
  .prl-m {
    padding-right: 20px;
  }
  .prx-m {
    padding-right: 40px;
  }
  .prxl-m {
    padding-right: 80px;
  }
  .prxxl-m {
    padding-right: 160px;
  }
  .pbn-m {
    padding-bottom: 0;
  }
  .pbxs-m {
    padding-bottom: 5px;
  }
  .pbs-m {
    padding-bottom: 5px;
  }
  .pbm-m {
    padding-bottom: 10px;
  }
  .pbl-m {
    padding-bottom: 20px;
  }
  .pbx-m {
    padding-bottom: 40px;
  }
  .pbxl-m {
    padding-bottom: 80px;
  }
  .pbxxl-m {
    padding-bottom: 160px;
  }
  .ptn-m {
    padding-top: 0;
  }
  .ptxs-m {
    padding-top: 5px;
  }
  .pts-m {
    padding-top: 5px;
  }
  .ptm-m {
    padding-top: 10px;
  }
  .ptl-m {
    padding-top: 20px;
  }
  .ptx-m {
    padding-top: 40px;
  }
  .ptxl-m {
    padding-top: 80px;
  }
  .ptxxl-m {
    padding-top: 160px;
  }
  .pvn-m {
    padding-top: 0;
    padding-bottom: 0;
  }
  .pvxs-m {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .pvs-m {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .pvm-m {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .pvl-m {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .pvx-m {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .pvxl-m {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .pvxxl-m {
    padding-top: 160px;
    padding-bottom: 160px;
  }
  .phn-m {
    padding-left: 0;
    padding-right: 0;
  }
  .pvxs-m {
    padding-left: 5px;
    padding-right: 5px;
  }
  .phs-m {
    padding-left: 5px;
    padding-right: 5px;
  }
  .phm-m {
    padding-left: 10px;
    padding-right: 10px;
  }
  .phl-m {
    padding-left: 20px;
    padding-right: 20px;
  }
  .phx-m {
    padding-left: 40px;
    padding-right: 40px;
  }
  .phxl-m {
    padding-left: 80px;
    padding-right: 80px;
  }
  .phxxl-m {
    padding-left: 160px;
    padding-right: 160px;
  }
  .man-m {
    margin: 0;
  }
  .maxs-m {
    margin: 5px;
  }
  .mas-m {
    margin: 5px;
  }
  .mam-m {
    margin: 10px;
  }
  .mal-m {
    margin: 20px;
  }
  .max-m {
    margin: 40px;
  }
  .maxl-m {
    margin: 80px;
  }
  .maxxl-m {
    margin: 160px;
  }
  .mln-m {
    margin-left: 0;
  }
  .mlxs-m {
    margin-left: 5px;
  }
  .mls-m {
    margin-left: 5px;
  }
  .mlm-m {
    margin-left: 10px;
  }
  .mll-m {
    margin-left: 20px;
  }
  .mlx-m {
    margin-left: 40px;
  }
  .mlxl-m {
    margin-left: 80px;
  }
  .mlxxl-m {
    margin-left: 160px;
  }
  .mrn-m {
    margin-right: 0;
  }
  .mrxs-m {
    margin-right: 5px;
  }
  .mrs-m {
    margin-right: 5px;
  }
  .mrm-m {
    margin-right: 10px;
  }
  .mrl-m {
    margin-right: 20px;
  }
  .mrx-m {
    margin-right: 40px;
  }
  .mrxl-m {
    margin-right: 80px;
  }
  .mrxxl-m {
    margin-right: 160px;
  }
  .mbn-m {
    margin-bottom: 0;
  }
  .mbxs-m {
    margin-bottom: 5px;
  }
  .mbs-m {
    margin-bottom: 5px;
  }
  .mbm-m {
    margin-bottom: 10px;
  }
  .mbl-m {
    margin-bottom: 20px;
  }
  .mbx-m {
    margin-bottom: 40px;
  }
  .mbxl-m {
    margin-bottom: 80px;
  }
  .mbxxl-m {
    margin-bottom: 160px;
  }
  .mtn-m {
    margin-top: 0;
  }
  .mtxs-m {
    margin-top: 5px;
  }
  .mts-m {
    margin-top: 5px;
  }
  .mtm-m {
    margin-top: 10px;
  }
  .mtl-m {
    margin-top: 20px;
  }
  .mtx-m {
    margin-top: 40px;
  }
  .mtxl-m {
    margin-top: 80px;
  }
  .mtxxl-m {
    margin-top: 160px;
  }
  .mvn-m {
    margin-top: 0;
    margin-bottom: 0rem;
  }
  .mvxs-m {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mvs-m {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mvm-m {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .mvl-m {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .mvx-m {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .mvxl-m {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .mvxxl-m {
    margin-top: 160px;
    margin-bottom: 160px;
  }
  .mhn-m {
    margin-left: 0;
    margin-right: 0;
  }
  .mhxs-m {
    margin-left: 5px;
    margin-right: 5px;
  }
  .mhs-m {
    margin-left: 5px;
    margin-right: 5px;
  }
  .mhm-m {
    margin-left: 10px;
    margin-right: 10px;
  }
  .mhl-m {
    margin-left: 20px;
    margin-right: 20px;
  }
  .mhx-m {
    margin-left: 40px;
    margin-right: 40px;
  }
  .mhxl {
    margin-left: 80px;
    margin-right: 80px;
  }
  .mhxxl {
    margin-left: 160px;
    margin-right: 160px;
  }
}

@media screen and (min-width: 1200px) {
  .pan-l {
    padding: 0;
  }
  .paxs-l {
    padding: 5px;
  }
  .pas-l {
    padding: 5px;
  }
  .pam-l {
    padding: 10px;
  }
  .pal-l {
    padding: 20px;
  }
  .pax-l {
    padding: 40px;
  }
  .paxl-l {
    padding: 80px;
  }
  .paxxl-l {
    padding: 160px;
  }
  .pln-l {
    padding-left: 0;
  }
  .plxs-l {
    padding-left: 5px;
  }
  .pls-l {
    padding-left: 5px;
  }
  .plm-l {
    padding-left: 10px;
  }
  .pll-l {
    padding-left: 20px;
  }
  .plx-l {
    padding-left: 40px;
  }
  .plxl-l {
    padding-left: 80px;
  }
  .plxxl-l {
    padding-left: 160px;
  }
  .prn-l {
    padding-right: 0;
  }
  .prxs-l {
    padding-right: 5px;
  }
  .prs-l {
    padding-right: 5px;
  }
  .prm-l {
    padding-right: 10px;
  }
  .prl-l {
    padding-right: 20px;
  }
  .prx-l {
    padding-right: 40px;
  }
  .prxl-l {
    padding-right: 80px;
  }
  .prxxl-l {
    padding-right: 160px;
  }
  .pbn-l {
    padding-bottom: 0;
  }
  .pbxs-l {
    padding-bottom: 5px;
  }
  .pbs-l {
    padding-bottom: 5px;
  }
  .pbm-l {
    padding-bottom: 10px;
  }
  .pbl-l {
    padding-bottom: 20px;
  }
  .pbx-l {
    padding-bottom: 40px;
  }
  .pbxl-l {
    padding-bottom: 80px;
  }
  .pbxxl-l {
    padding-bottom: 160px;
  }
  .ptn-l {
    padding-top: 0;
  }
  .ptxs-l {
    padding-top: 5px;
  }
  .pts-l {
    padding-top: 5px;
  }
  .ptm-l {
    padding-top: 10px;
  }
  .ptl-l {
    padding-top: 20px;
  }
  .ptx-l {
    padding-top: 40px;
  }
  .ptxl-l {
    padding-top: 80px;
  }
  .ptxxl-l {
    padding-top: 160px;
  }
  .pvn-l {
    padding-top: 0;
    padding-bottom: 0;
  }
  .pvxs-l {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .pvs-l {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .pvm-l {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .pvl-l {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .pvx-l {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .pvxl-l {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .pvxxl-l {
    padding-top: 160px;
    padding-bottom: 160px;
  }
  .phn-l {
    padding-left: 0;
    padding-right: 0;
  }
  .pvxs-l {
    padding-left: 5px;
    padding-right: 5px;
  }
  .phs-l {
    padding-left: 5px;
    padding-right: 5px;
  }
  .phm-l {
    padding-left: 10px;
    padding-right: 10px;
  }
  .phl-l {
    padding-left: 20px;
    padding-right: 20px;
  }
  .phx-l {
    padding-left: 40px;
    padding-right: 40px;
  }
  .phxl-l {
    padding-left: 80px;
    padding-right: 80px;
  }
  .phxxl-l {
    padding-left: 160px;
    padding-right: 160px;
  }
  .man-l {
    margin: 0;
  }
  .maxs-l {
    margin: 5px;
  }
  .mas-l {
    margin: 5px;
  }
  .mam-l {
    margin: 10px;
  }
  .mal-l {
    margin: 20px;
  }
  .max-l {
    margin: 40px;
  }
  .maxl-l {
    margin: 80px;
  }
  .maxxl-l {
    margin: 160px;
  }
  .mln-l {
    margin-left: 0;
  }
  .mlxs-l {
    margin-left: 5px;
  }
  .mls-l {
    margin-left: 5px;
  }
  .mlm-l {
    margin-left: 10px;
  }
  .mll-l {
    margin-left: 20px;
  }
  .mlx-l {
    margin-left: 40px;
  }
  .mlxl-l {
    margin-left: 80px;
  }
  .mlxxl-l {
    margin-left: 160px;
  }
  .mrn-l {
    margin-right: 0;
  }
  .mrxs-l {
    margin-right: 5px;
  }
  .mrs-l {
    margin-right: 5px;
  }
  .mrm-l {
    margin-right: 10px;
  }
  .mrl-l {
    margin-right: 20px;
  }
  .mrx-l {
    margin-right: 40px;
  }
  .mrxl-l {
    margin-right: 80px;
  }
  .mrxxl-l {
    margin-right: 160px;
  }
  .mbn-l {
    margin-bottom: 0;
  }
  .mbxs-l {
    margin-bottom: 5px;
  }
  .mbs-l {
    margin-bottom: 5px;
  }
  .mbm-l {
    margin-bottom: 10px;
  }
  .mbl-l {
    margin-bottom: 20px;
  }
  .mbx-l {
    margin-bottom: 40px;
  }
  .mbxl-l {
    margin-bottom: 80px;
  }
  .mbxxl-l {
    margin-bottom: 160px;
  }
  .mtn-l {
    margin-top: 0;
  }
  .mtxs-l {
    margin-top: 5px;
  }
  .mts-l {
    margin-top: 5px;
  }
  .mtm-l {
    margin-top: 10px;
  }
  .mtl-l {
    margin-top: 20px;
  }
  .mtx-l {
    margin-top: 40px;
  }
  .mtxl-l {
    margin-top: 80px;
  }
  .mtxxl-l {
    margin-top: 160px;
  }
  .mvn-l {
    margin-top: 0;
    margin-bottom: 0rem;
  }
  .mvxs-l {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mvs-l {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mvm-l {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .mvl-l {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .mvx-l {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .mvxl-l {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .mvxxl-l {
    margin-top: 160px;
    margin-bottom: 160px;
  }
  .mhn-l {
    margin-left: 0;
    margin-right: 0;
  }
  .mhxs-l {
    margin-left: 5px;
    margin-right: 5px;
  }
  .mhs-l {
    margin-left: 5px;
    margin-right: 5px;
  }
  .mhm-l {
    margin-left: 10px;
    margin-right: 10px;
  }
  .mhl-l {
    margin-left: 20px;
    margin-right: 20px;
  }
  .mhx-l {
    margin-left: 40px;
    margin-right: 40px;
  }
  .mhxl-l {
    margin-left: 80px;
    margin-right: 80px;
  }
  .mhxxl-l {
    margin-left: 160px;
    margin-right: 160px;
  }
}

/* override css variables sap smartedit */
:root {
  --sapLinkColor: #3e4954 !important;
  --sapLink_Hover_Color: #127f3e !important;
}

/* override scss in one file for all pages */
/* special css to hide initial stock data at product detail */
#stockLevelsPopUp .stocks-list .liveStocks.negative,
#liveStocksPopUp .stocks-list .liveStocks.negative {
  display: none !important;
}

/* special css for delivery info icon at product list, product detail and cart */
.stock-default-warehouse i.delivery-info-icon,
#liveStock i.delivery-info-icon {
  padding-left: 5px;
  font-weight: bolder;
}

/* full text of product name on product lists */
.page-search .productList .listView .offers .section-1 .productName p, .page-productList .productList .listView .offers .section-1 .productName p {
  max-height: unset;
}

/* stock data in cart */
body.page-cartPage .cartPage .cartItems .cartItem .other-stock-wrapper {
  display: block;
}

/* special css for delivery info icon at product detail */
span.delivery-info-icon-wrapper {
  display: inline !important;
  top: 4px;
}

/* special css for delivery info icon at product reference component on product detail */
body .product-references-component .productList .listView .stock-default-warehouse > span:first-child {
  display: inline-block;
  margin-bottom: 7px;
}

/* special css for service product hints at checkout configuration */
.service-product-hint {
  font-size: 12px;
  column-count: 2;
}

.service-product-hint strong {
  font-size: 14px;
}

body .multiple-select-wrapper .multiselect-container.dropdown-menu li.checkbox.disabled:hover a,
body .multiple-select-wrapper .multiselect-container.dropdown-menu li.checkbox.disabled a {
  background-color: #428bca;
}

body .multiple-select-wrapper .multiselect-container.dropdown-menu li.checkbox.disabled:hover i.icon-check,
body .multiple-select-wrapper .multiselect-container.dropdown-menu li.checkbox.disabled:hover label.real-label,
body .multiple-select-wrapper .multiselect-container.dropdown-menu li.checkbox.disabled i.icon-check,
body .multiple-select-wrapper .multiselect-container.dropdown-menu li.checkbox.disabled label.real-label {
  color: #fff;
}

/* Main Navigation */
#main-nav-wrapper {
  border-bottom: 1px solid #fff;
}

/* special css for hiding number of products at category navigation at productlist */
.category-navigation .number-of-products {
  display: none !important;
}

/* simple checkout */
@media (min-width: 970px) {
  body #simpleCheckoutForms #simpleCheckoutCollectConfigForm .form-group.address-section {
    margin-bottom: 65px;
  }
}

body .simple-checkout {
  /* hide express delivery for b2c customers */
}

body .simple-checkout .icon-info {
  font-weight: 700;
}

@media (max-width: 969px) {
  body .simple-checkout .quickservice-icon {
    vertical-align: middle;
    vertical-align: -webkit-baseline-middle;
  }
}

body .simple-checkout #simpleCheckoutForms .row-two {
  display: flex;
  flex-wrap: wrap;
}

body .simple-checkout #simpleCheckoutForms .row-two .col-order-number {
  order: 1;
}

body .simple-checkout #simpleCheckoutForms .row-two .col-note {
  order: 3;
  margin-top: 15px;
}

body .simple-checkout #simpleCheckoutForms .row-two .col-service,
body .simple-checkout #simpleCheckoutForms .row-two .col-packaging {
  order: 2;
  margin-left: 0;
}

body .simple-checkout #simpleCheckoutCollectConfigForm .col-order-number {
  margin-right: 50%;
}

body .simple-checkout #simpleCheckoutCollectConfigForm .col-time {
  display: none;
}

body .simple-checkout .order-note-special .pseudo-checkbox {
  margin-bottom: 3px;
  margin-top: 2px;
}

body .simple-checkout .col-date,
body .simple-checkout .col-time {
  float: right;
}

body .simple-checkout #simpleCheckoutQuickserviceConfigForm .quickservice-date .datepicker-calendar {
  display: table-cell;
}

body .simple-checkout #simpleCheckoutQuickserviceConfigForm .quickservice-date .date {
  display: table;
}

body .simple-checkout #simpleCheckoutQuickserviceConfigForm .quickservice-date .date input {
  width: calc(100% - 10px);
}

body .simple-checkout.B2CPRICEREQUEST label.delivery-mode-option[for="express-delivery"], body .simple-checkout.B2CPRICEREQUEST i.popover-express-delivery, body .simple-checkout.B2CGUESTORDER label.delivery-mode-option[for="express-delivery"], body .simple-checkout.B2CGUESTORDER i.popover-express-delivery {
  display: none;
}

/* search */
@media (min-width: 768px) {
  .siteSearch .siteSearchInput:hover, .siteSearch .siteSearchInput:focus {
    border-color: #127f3e;
  }
}

#content .hooks li span {
  color: #fff !important;
}

.top-scroller {
  border-bottom: 1px solid white;
}

/* hide my account in header for b2c */
header.isNotB2B #sticky-header-wrapper #link-account, header.isNotB2B #sticky-header-wrapper #link-login {
  display: none;
}

.btn-primary {
  background-color: #323232 !important;
}

.clickable.active .btn.btn-ghost.btnCollapse {
  background-color: #323232 !important;
}

.btn.active {
  background-color: #323232 !important;
}

.storefinder-component .searchPane #storeFinderForm input::placeholder {
  color: #595858;
}

.productDetail .locationStockLink {
  color: #595858;
}

/* special bauwelt case to mark disabled/impossible variant options */
.productDimension option.not-available,
.productDimensions option.not-available {
  color: #808080 !important;
  background-color: #d0d0d0;
}

.turbo-track-component {
  font-family: Arial, sans-serif;
  max-width: 600px;
  margin: 0 auto;
}

.turbo-track-component .tracking-id-row {
  margin-bottom: 1rem;
}

.turbo-track-component .tracking-id-label {
  font-weight: bold;
  font-size: larger;
}

.turbo-track-component .tracking-id-value {
  margin-bottom: 0;
  font-size: larger;
}

.turbo-track-component .logo-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.turbo-track-component .sender, .turbo-track-component .receiver {
  flex: 0 0 auto;
}

.turbo-track-component .sender-logo, .turbo-track-component .receiver-logo {
  max-width: 100px;
  height: auto;
}

.turbo-track-component .receiver {
  text-align: center;
}

.turbo-track-component .receiver-name {
  text-align: right;
  margin-bottom: unset;
  margin-top: 10px;
}

.turbo-track-component .transporter-container {
  margin-top: 25px;
  margin-bottom: 0;
}

.turbo-track-component .transporter-logo {
  max-width: 80px;
  max-height: 80px;
  display: block;
  margin: 0 auto;
  /* Center the logo by default */
}

.turbo-track-component .transporter-logo.status-0 {
  margin-left: 0;
  margin-right: auto;
}

.turbo-track-component .transporter-logo.status-1 {
  margin-left: auto;
  margin-right: auto;
}

.turbo-track-component .transporter-logo.status-2 {
  margin-left: auto;
  margin-right: 0;
}

.turbo-track-component .arrow-right {
  position: relative;
  width: 100%;
  height: 2px;
  background-color: #595858;
  margin: 20px 0;
  margin-top: 0;
}

.turbo-track-component .arrow-right::after {
  content: '';
  position: absolute;
  right: -5px;
  top: 50%;
  transform: translateY(-50%);
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 12px solid #595858;
}

.turbo-track-component .tracking-status-container {
  position: relative;
  width: 100%;
  height: 60px;
}

.turbo-track-component .tracking-status-code {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  font-weight: bolder;
  background-color: #5E5F61;
  color: white;
}

.turbo-track-component .tracking-status-code-active {
  background-color: #127f3e;
}

.turbo-track-component .tracking-status-code-left {
  left: 0;
}

.turbo-track-component .tracking-status-code-center {
  left: 50%;
  transform: translateX(-50%);
}

.turbo-track-component .tracking-status-code-right {
  right: 0;
}

.turbo-track-component .tracking-status-code p {
  margin: 0;
  font-size: x-large;
}

.turbo-track-component .tracking-status-label-container {
  display: flex;
  justify-content: space-between;
  width: 100%;
  text-align: center;
}

.turbo-track-component .tracking-status-code-label {
  font-size: large;
}

.turbo-track-component tracking-status-code-label-mobile {
  line-height: 12px;
}

.turbo-track-component .tracking-delivery-container {
  display: flex;
  justify-content: space-between;
  margin-top: 25px;
}

.turbo-track-component .tracking-address-container-desktop {
  text-align: right;
}

.turbo-track-component .tracking-delivery-status-header,
.turbo-track-component .tracking-delivery-address-header,
.turbo-track-component .tracking-delivery-id-header,
.turbo-track-component .tracking-delivery-date-header {
  font-size: x-large;
}

.turbo-track-component .tracking-delivery-address {
  margin-bottom: 0;
  font-size: 1.3em;
}

.turbo-track-component .tracking-delivery-date {
  margin-bottom: 0.5rem;
  font-size: 1.5rem;
}

.turbo-track-component .tracking-delivery-time {
  margin-bottom: 0.5rem;
  font-size: x-large;
}

.turbo-track-component .tracking-banner-container {
  width: 100%;
  position: relative;
  margin-bottom: 20px;
}

.turbo-track-component .tracking-banner {
  height: 200px;
  width: 100%;
  object-fit: cover;
}

.turbo-track-component .tracking-number-overlay {
  position: absolute;
  bottom: 10px;
  left: 10px;
  background-color: rgba(0, 0, 0, 0.33);
  padding: 5px 10px;
  border-radius: 4px;
  display: inline-block;
  /* Makes the div only as wide as its content */
  white-space: nowrap;
  font-size: 1.4em;
  color: white;
}

.turbo-track-component .tracking-delivery-time-container,
.turbo-track-component .tracking-status-location-container {
  margin-top: 20px;
}

.turbo-track-component .tracking-delivery-time-update {
  font-size: 1.2rem;
}

.turbo-track-component .tracking-mobile-view-container .tracking-delivery-address-header {
  margin-top: 20px;
}

.turbo-track-component .tracking-additional-data-wrapper {
  margin-top: 40px;
}

.turbo-track-component .tracking-additional-data-header {
  font-size: large;
}

.turbo-track-component .tourbotrack-image-wrapper {
  margin-bottom: 20px;
}

.turbo-track-component .tracking-media-image {
  width: 100%;
}

.turbo-track-component .positive {
  color: #208738;
}

.turbo-track-component .negative {
  color: #d32d2d;
}

.turbo-track-component .tracking-order-item {
  margin-bottom: 20px;
}

.turbo-track-component .tracking-order-item p {
  margin: 0;
}

.turbo-track-component .tourbotrack-map-wrapper {
  margin-top: 40px;
}

.turbo-track-component #tourbotrack-map {
  width: 100%;
  height: 300px;
}

/*# sourceMappingURL=main.css.map */