@charset "UTF-8";
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

* {
  box-sizing: border-box; }

.preload {
  transition: none !important;
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important; }
  .preload * {
    transition: none !important;
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important; }

/* Sections
    ========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
  margin: 0; }

/**
* Render the `main` element consistently in IE.
*/
main {
  display: block; }

/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/* Grouping content
    ========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */ }

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/* Text-level semantics
    ========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
  background-color: transparent; }

/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */ }

/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
  font-weight: bolder; }

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/**
* Add the correct font size in all browsers.
*/
small {
  font-size: 80%; }

/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

/* Embedded content
    ========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
  border-style: none; }

/* Forms
    ========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */ }

p {
  margin: 0; }

/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input {
  /* 1 */
  overflow: visible; }

/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select {
  /* 1 */
  text-transform: none; }

/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

/**
* Correct the padding in Firefox.
*/
fieldset {
  padding: 0.35em 0.75em 0.625em; }

/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
*    `fieldset` elements in all browsers.
*/
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */ }

/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
  vertical-align: baseline; }

/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
  overflow: auto; }

/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */ }

/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */ }

/* Interactive
    ========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
  display: block; }

/*
* Add the correct display in all browsers.
*/
summary {
  display: list-item; }

/* Misc
    ========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
  display: none; }

/**
* Add the correct display in IE 10.
*/
[hidden] {
  display: none; }

/* Slider */
.slick-loading .slick-list {
  background: #fff url([object Module]) center center no-repeat; }

/* Icons */
@font-face {
  font-family: 'slick';
  font-weight: normal;
  font-style: normal;
  src: url(data:application/vnd.ms-fontobject;base64,ZXhwb3J0IGRlZmF1bHQgImRhdGE6YXBwbGljYXRpb24vdm5kLm1zLWZvbnRvYmplY3Q7YmFzZTY0LEFBZ0FBR1FIQUFBQkFBSUFBQUFBQUFJQUJRa0FBQUFBQUFBQkFKQUJBQUFBQUV4UUFRQUFnQ0FBQUFBQUFBQUFBQUFBQUFFQUFBQUFBQUFBVHhERThBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBb0Fjd0JzQUdrQVl3QnJBQUFBRGdCU0FHVUFad0IxQUd3QVlRQnlBQUFBRmdCV0FHVUFjZ0J6QUdrQWJ3QnVBQ0FBTVFBdUFEQUFBQUFLQUhNQWJBQnBBR01BYXdBQUFBQUFBQUVBQUFBTkFJQUFBd0JRUmtaVVRXM1J5SzhBQUFkSUFBQUFIRWRFUlVZQU5BQUdBQUFIS0FBQUFDQlBVeTh5VC9iOXNnQUFBVmdBQUFCV1kyMWhjQ0lQUmIwQUFBSElBQUFCWW1kaGMzRC8vd0FEQUFBSElBQUFBQWhuYkhsbVA1dTJZQUFBQXp3QUFBSXNhR1ZoWkFBQk1mc0FBQURjQUFBQU5taG9aV0VENVFJRkFBQUJGQUFBQUNSb2JYUjRCa29BU2dBQUFiQUFBQUFXYkc5allRRDJBYUlBQUFNc0FBQUFFRzFoZUhBQVN3QkhBQUFCT0FBQUFDQnVZVzFsQlNlQndnQUFCV2dBQUFGdWNHOXpkQyt6TWdNQUFBYllBQUFBUlFBQkFBQUFBUUFBOE1RUVQxOFBQUFVBQ3dJQUFBQUFBTTl4ZUg4QUFBQUF6M0Y0ZndBbEFDVUIyd0hiQUFBQUNBQUNBQUFBQUFBQUFBRUFBQUhiQUFBQUxnSUFBQUFBQUFIYkFBRUFBQUFBQUFBQUFBQUFBQUFBQUFBRUFBRUFBQUFIQUVRQUFnQUFBQUFBQWdBQUFBRUFBUUFBQUVBQUFBQUFBQUFBQVFJQUFaQUFCUUFJQVV3QlpnQUFBRWNCVEFGbUFBQUE5UUFaQUlRQUFBSUFCUWtBQUFBQUFBQ0FBQUFCQUFBQUlBQUFBQUFBQUFBQVVHWkZaQUJBQUdFaGtnSGcvK0FBTGdIYi85c0FBQUFCQUFBQUFBQUFBZ0FBQUFBQUFBQUNBQUFBQWdBQUpRQWxBQ1VBSlFBQUFBQUFBd0FBQUFNQUFBQWNBQUVBQUFBQUFGd0FBd0FCQUFBQUhBQUVBRUFBQUFBTUFBZ0FBZ0FFQUFBQVlTQWlJWkFoa3YvL0FBQUFBQUJoSUNJaGtDR1MvLzhBQVArbDMrUGVkTjV4QUFFQUFBQUFBQUFBQUFBQUFBQUFBQUVHQUFBQkFBQUFBQUFBQUFFQ0FBQUFBZ0FBQUFBQUFBQUFBQUFBQUFBQUFBRUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQmdBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUZBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUJHQUl3QXNBRVdBQUlBSlFBbEFkc0Iyd0FZQUN3QUFEOEJOalF2QVNZaklnOEJCaFVVSHdFSEJoVVVId0VXTXpJMkZBY0dCd1lpSnlZbkpqUTNOamMyTWhjV0YvR0NCZ2FDQlFjSUJSMEdCbGRYQmdZZEJRZ0g3eDBlTWpCOE1ESWVIUjBlTWpCOE1ESWVjWUlHRGdhQ0JRVWVCUWNKQkZoWUJBa0hCUjRGMG53d01oNGRIUjR5TUh3d01oNGRIUjR5QUFBQUFnQWxBQ1VCMndIYkFCZ0FMQUFBSlRjMk5UUXZBVGMyTlRRdkFTWWpJZzhCQmhRZkFSWXpNallVQndZSEJpSW5KaWNtTkRjMk56WXlGeFlYQVNnZEJnWlhWd1lHSFFVSUJ3V0NCZ2FDQlFjSXVCMGVNakI4TURJZUhSMGVNakI4TURJZWNSNEZCd2tFV0ZnRUNRY0ZIZ1VGZ2dZT0JvSUYwbnd3TWg0ZEhSNHlNSHd3TWg0ZEhSNHlBQUFCQUNVQUpRSGJBZHNBRXdBQUFCUUhCZ2NHSWljbUp5WTBOelkzTmpJWEZoY0IyeDBlTWpCOE1ESWVIUjBlTWpCOE1ESWVBVDU4TURJZUhSMGVNakI4TURJZUhSMGVNZ0FCQUNVQUpRSGJBZHNBUXdBQUFSVVVCaXNCSWljbVB3RW1JeUlIQmdjR0J3WVVGeFlYRmhjV016STNOamMyTXpJZkFSWVZGQWNHQndZaklpY21KeVluSmpRM05qYzJOell6TWhjV0Z6YzJGeFlCMndvSWdBc0dCUWtvS2pvZEhCd1NGQXdMQ3d3VUVod2NIU0llSUJNR0FRUURKd01DSVNzcE5DOG1MQm9iRkJFUkZCc2FMQ1l2S2ljcEhTVUlEQXNCdDRBSUNnc0xDU2NuQ3d3VUVod2NPaHdjRWhRTUN3OE9IQU1ESndNREFnUW5GQlFSRkJzYUxDWmVKaXdhR3hRUkR4RWNKUWdFQmdBQUFBQUFBQXdBbGdBQkFBQUFBQUFCQUFVQURBQUJBQUFBQUFBQ0FBY0FJZ0FCQUFBQUFBQURBQ0VBYmdBQkFBQUFBQUFFQUFVQW5BQUJBQUFBQUFBRkFBc0F1Z0FCQUFBQUFBQUdBQVVBMGdBREFBRUVDUUFCQUFvQUFBQURBQUVFQ1FBQ0FBNEFFZ0FEQUFFRUNRQURBRUlBS2dBREFBRUVDUUFFQUFvQWtBQURBQUVFQ1FBRkFCWUFvZ0FEQUFFRUNRQUdBQW9BeGdCekFHd0FhUUJqQUdzQUFITnNhV05yQUFCU0FHVUFad0IxQUd3QVlRQnlBQUJTWldkMWJHRnlBQUJHQUc4QWJnQjBBRVlBYndCeUFHY0FaUUFnQURJQUxnQXdBQ0FBT2dBZ0FITUFiQUJwQUdNQWF3QWdBRG9BSUFBeEFEUUFMUUEwQUMwQU1nQXdBREVBTkFBQVJtOXVkRVp2Y21kbElESXVNQ0E2SUhOc2FXTnJJRG9nTVRRdE5DMHlNREUwQUFCekFHd0FhUUJqQUdzQUFITnNhV05yQUFCV0FHVUFjZ0J6QUdrQWJ3QnVBQ0FBTVFBdUFEQUFBRlpsY25OcGIyNGdNUzR3QUFCekFHd0FhUUJqQUdzQUFITnNhV05yQUFBQUFBSUFBQUFBQUFBQUFBQUFBQUFBQVFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQndBQUFBRUFBZ0VDQVFNQWh3QkVDbUZ5Y205M2NtbG5hSFFKWVhKeWIzZHNaV1owQUFBQUFBQUFBZi8vQUFJQUFRQUFBQTRBQUFBWUFBQUFBQUFDQUFFQUF3QUdBQUVBQkFBQUFBSUFBQUFBQUFFQUFBQUF6dTdYc0FBQUFBRFBjWGgvQUFBQUFNOXhlSDg9Ig==);
  src: url(data:application/vnd.ms-fontobject;base64,ZXhwb3J0IGRlZmF1bHQgImRhdGE6YXBwbGljYXRpb24vdm5kLm1zLWZvbnRvYmplY3Q7YmFzZTY0LEFBZ0FBR1FIQUFBQkFBSUFBQUFBQUFJQUJRa0FBQUFBQUFBQkFKQUJBQUFBQUV4UUFRQUFnQ0FBQUFBQUFBQUFBQUFBQUFFQUFBQUFBQUFBVHhERThBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBb0Fjd0JzQUdrQVl3QnJBQUFBRGdCU0FHVUFad0IxQUd3QVlRQnlBQUFBRmdCV0FHVUFjZ0J6QUdrQWJ3QnVBQ0FBTVFBdUFEQUFBQUFLQUhNQWJBQnBBR01BYXdBQUFBQUFBQUVBQUFBTkFJQUFBd0JRUmtaVVRXM1J5SzhBQUFkSUFBQUFIRWRFUlVZQU5BQUdBQUFIS0FBQUFDQlBVeTh5VC9iOXNnQUFBVmdBQUFCV1kyMWhjQ0lQUmIwQUFBSElBQUFCWW1kaGMzRC8vd0FEQUFBSElBQUFBQWhuYkhsbVA1dTJZQUFBQXp3QUFBSXNhR1ZoWkFBQk1mc0FBQURjQUFBQU5taG9aV0VENVFJRkFBQUJGQUFBQUNSb2JYUjRCa29BU2dBQUFiQUFBQUFXYkc5allRRDJBYUlBQUFNc0FBQUFFRzFoZUhBQVN3QkhBQUFCT0FBQUFDQnVZVzFsQlNlQndnQUFCV2dBQUFGdWNHOXpkQyt6TWdNQUFBYllBQUFBUlFBQkFBQUFBUUFBOE1RUVQxOFBQUFVBQ3dJQUFBQUFBTTl4ZUg4QUFBQUF6M0Y0ZndBbEFDVUIyd0hiQUFBQUNBQUNBQUFBQUFBQUFBRUFBQUhiQUFBQUxnSUFBQUFBQUFIYkFBRUFBQUFBQUFBQUFBQUFBQUFBQUFBRUFBRUFBQUFIQUVRQUFnQUFBQUFBQWdBQUFBRUFBUUFBQUVBQUFBQUFBQUFBQVFJQUFaQUFCUUFJQVV3QlpnQUFBRWNCVEFGbUFBQUE5UUFaQUlRQUFBSUFCUWtBQUFBQUFBQ0FBQUFCQUFBQUlBQUFBQUFBQUFBQVVHWkZaQUJBQUdFaGtnSGcvK0FBTGdIYi85c0FBQUFCQUFBQUFBQUFBZ0FBQUFBQUFBQUNBQUFBQWdBQUpRQWxBQ1VBSlFBQUFBQUFBd0FBQUFNQUFBQWNBQUVBQUFBQUFGd0FBd0FCQUFBQUhBQUVBRUFBQUFBTUFBZ0FBZ0FFQUFBQVlTQWlJWkFoa3YvL0FBQUFBQUJoSUNJaGtDR1MvLzhBQVArbDMrUGVkTjV4QUFFQUFBQUFBQUFBQUFBQUFBQUFBQUVHQUFBQkFBQUFBQUFBQUFFQ0FBQUFBZ0FBQUFBQUFBQUFBQUFBQUFBQUFBRUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQmdBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUZBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUJHQUl3QXNBRVdBQUlBSlFBbEFkc0Iyd0FZQUN3QUFEOEJOalF2QVNZaklnOEJCaFVVSHdFSEJoVVVId0VXTXpJMkZBY0dCd1lpSnlZbkpqUTNOamMyTWhjV0YvR0NCZ2FDQlFjSUJSMEdCbGRYQmdZZEJRZ0g3eDBlTWpCOE1ESWVIUjBlTWpCOE1ESWVjWUlHRGdhQ0JRVWVCUWNKQkZoWUJBa0hCUjRGMG53d01oNGRIUjR5TUh3d01oNGRIUjR5QUFBQUFnQWxBQ1VCMndIYkFCZ0FMQUFBSlRjMk5UUXZBVGMyTlRRdkFTWWpJZzhCQmhRZkFSWXpNallVQndZSEJpSW5KaWNtTkRjMk56WXlGeFlYQVNnZEJnWlhWd1lHSFFVSUJ3V0NCZ2FDQlFjSXVCMGVNakI4TURJZUhSMGVNakI4TURJZWNSNEZCd2tFV0ZnRUNRY0ZIZ1VGZ2dZT0JvSUYwbnd3TWg0ZEhSNHlNSHd3TWg0ZEhSNHlBQUFCQUNVQUpRSGJBZHNBRXdBQUFCUUhCZ2NHSWljbUp5WTBOelkzTmpJWEZoY0IyeDBlTWpCOE1ESWVIUjBlTWpCOE1ESWVBVDU4TURJZUhSMGVNakI4TURJZUhSMGVNZ0FCQUNVQUpRSGJBZHNBUXdBQUFSVVVCaXNCSWljbVB3RW1JeUlIQmdjR0J3WVVGeFlYRmhjV016STNOamMyTXpJZkFSWVZGQWNHQndZaklpY21KeVluSmpRM05qYzJOell6TWhjV0Z6YzJGeFlCMndvSWdBc0dCUWtvS2pvZEhCd1NGQXdMQ3d3VUVod2NIU0llSUJNR0FRUURKd01DSVNzcE5DOG1MQm9iRkJFUkZCc2FMQ1l2S2ljcEhTVUlEQXNCdDRBSUNnc0xDU2NuQ3d3VUVod2NPaHdjRWhRTUN3OE9IQU1ESndNREFnUW5GQlFSRkJzYUxDWmVKaXdhR3hRUkR4RWNKUWdFQmdBQUFBQUFBQXdBbGdBQkFBQUFBQUFCQUFVQURBQUJBQUFBQUFBQ0FBY0FJZ0FCQUFBQUFBQURBQ0VBYmdBQkFBQUFBQUFFQUFVQW5BQUJBQUFBQUFBRkFBc0F1Z0FCQUFBQUFBQUdBQVVBMGdBREFBRUVDUUFCQUFvQUFBQURBQUVFQ1FBQ0FBNEFFZ0FEQUFFRUNRQURBRUlBS2dBREFBRUVDUUFFQUFvQWtBQURBQUVFQ1FBRkFCWUFvZ0FEQUFFRUNRQUdBQW9BeGdCekFHd0FhUUJqQUdzQUFITnNhV05yQUFCU0FHVUFad0IxQUd3QVlRQnlBQUJTWldkMWJHRnlBQUJHQUc4QWJnQjBBRVlBYndCeUFHY0FaUUFnQURJQUxnQXdBQ0FBT2dBZ0FITUFiQUJwQUdNQWF3QWdBRG9BSUFBeEFEUUFMUUEwQUMwQU1nQXdBREVBTkFBQVJtOXVkRVp2Y21kbElESXVNQ0E2SUhOc2FXTnJJRG9nTVRRdE5DMHlNREUwQUFCekFHd0FhUUJqQUdzQUFITnNhV05yQUFCV0FHVUFjZ0J6QUdrQWJ3QnVBQ0FBTVFBdUFEQUFBRlpsY25OcGIyNGdNUzR3QUFCekFHd0FhUUJqQUdzQUFITnNhV05yQUFBQUFBSUFBQUFBQUFBQUFBQUFBQUFBQVFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQndBQUFBRUFBZ0VDQVFNQWh3QkVDbUZ5Y205M2NtbG5hSFFKWVhKeWIzZHNaV1owQUFBQUFBQUFBZi8vQUFJQUFRQUFBQTRBQUFBWUFBQUFBQUFDQUFFQUF3QUdBQUVBQkFBQUFBSUFBQUFBQUFFQUFBQUF6dTdYc0FBQUFBRFBjWGgvQUFBQUFNOXhlSDg9Ig==?#iefix) format("embedded-opentype"), url(data:font/woff;base64,ZXhwb3J0IGRlZmF1bHQgImRhdGE6Zm9udC93b2ZmO2Jhc2U2NCxkMDlHUms5VVZFOEFBQVZrQUFzQUFBQUFCMXdBQVFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQkRSa1lnQUFBQkNBQUFBaTRBQUFLYkgvcFdEa1pHVkUwQUFBTTRBQUFBR2dBQUFCeHQwY2l2UjBSRlJnQUFBMVFBQUFBY0FBQUFJQUF5QUFSUFV5OHlBQUFEY0FBQUFGSUFBQUJnVUJqL3JtTnRZWEFBQUFQRUFBQUFVQUFBQVdJaUMwU3dhR1ZoWkFBQUJCUUFBQUF1QUFBQU5nQUJNZnRvYUdWaEFBQUVSQUFBQUJ3QUFBQWtBK1VDQTJodGRIZ0FBQVJnQUFBQURnQUFBQTRFU2dCS2JXRjRjQUFBQkhBQUFBQUdBQUFBQmdBRlVBQnVZVzFsQUFBRWVBQUFBTndBQUFGdUJTZUJ3bkJ2YzNRQUFBVlVBQUFBRUFBQUFDQUFBd0FCZUp3OWtzOXZFa0VVeDJjcFd5ZVVvRllnTmtIaTJXdDdOM3JWbTNjVHMzVVZMQzRMeElXRVF2aTFQM2k3TzF0WUxKREFtbGdLR0VoUXJzYWpmMGo3SjNqWVRYclFXVXJNSkcrKytiNTVuNWU4Tnd3S0JoSERNTHY1a3hUM0FURUJ4S0JuM3FPQWw5enhIZ2IxTUFQaEhRZ0hreUYwOEdyL0w4Qi9FYjZ6V25tQ0o3QUpWTHViUU9oZUFyWHZKMUE0RVhpNmo0SStaZzlGMFFGS3ZzbmxCQ21YZXZlK3NGRW5iL25DcHRkdFE0UVloVkZSQVQxSHJGOFVRSy9STC9TYm1VYmNsc3ZHVkZYUlpLREhVRTM4Y2M0cXBrYkFBc3V3aUltdnJvK3VmY2ZhT0lRNnN6bHJtalJKRGFLWktuYmpOM0dXS0liaUl6UkZVZkNmZnV4eEtPTCszTERsRFZ2eDJUZHhOODRxWkVzbmhOQmE2cGdtMmRBc256YkxzRVRkc21SRnhVZUhWNGUrSTIvcHROOFR5cVY4VDNEdDI5dDdFWU91YWpWSXcyeTFXeTNNODZ3MHpnL0Z6Mkl2YXdtUUFVSE9WclBWZkxrb1NjVnluc3FzVEcwTUdVczR6NTVuaDNtbk9KYStsaStybDlXcFBJY0ZmRHViRGVhREMrZkxCZFlOM1FBRHpMYXVHZmo0QjZzWm1xNkNDcHFtdFN2RjBxbFVsMnFmNUFKSVVDU2xUcWxiN2xVRytMUmZHelpHelpFeUJnY2NNdTZNdXFQZWNORHZENFk5S2p0ajRnRCtEc3ZLVk1UY01kdHF0WnRta3pRc3RRdllqZTdTeWVwMFBEU0FoU09lSFlYWVdUaEVGLy9BLzBZdllWMWZTUXRwS1U1U1R0cmhiUTQ0NE90cEtTV0pJZzNwT2c4Y0JzN21hVFkxRVpmMDdhcStoaldzN0lXemRDWVRHaGIyQ3RaNDd4K1VoeDI4QUFCNG5HTmdZR0JrQUlKejc2NXZBTkhuQ3l2cVlUUUFXbmtIc3dBQWVKeGpZR1JnWU9BRFlna0dFR0JpWUFSQ0ZqQUc4UmdBQkhZQU4zaWNZMkJtWW1DY3dNREt3TUhvdzVqR3dNRGdEcVcvTWtneXREQXdNREd3Y2pLQVFRTURBeU9RVW1DQWdvQTAxeFFHQjRaRXhVbU1ELzQvWU5CanZQMy9OZ05FRFFQamJiQktCUVpHQURmTERnc0FBSGljWTJCZ1lHYUFZQmtHUmdZUWlBSHlHTUY4RmdZSElNM0R3TUhBQkdRek1DUXFLQ2xPVUp6MC96OVlIUkx2LytMN0QrOFYzY3VIbWdBSGpHd002RUxVQnl4VU1JT1pDbWJnQUFBNUxROFhlSnhqWUdSZ1lBQmlPNjh3NzNoK202OE0zRXdNSUhDK3NLSWVUcXN5cURMZVpyd041SEl3Z0tVQi9hWUpVZ0FBZUp4allHUmdZTHpOd01DZ3g4UUFBa0EySXdNcVlBSUFNR0lCN1FJQUFBQUNBQUFsQUNVQUpRQWxBQUFBQUZBQUFBVUFBSGljYlk0OWFzTkFFSVUvMlpKRGZraVJJdlhhcFVGQ0VxcGNwdEFCVXJnM1poRWlRb0tWZlk5VXFWTGxHRGxBRHBBVDVlMTZJVVd5c016M2hqZnpCcmpqalFUL0VqS3BDeSs0WWhONXlab3hjaXJQZStTTVd6NGpyNlMrNVV6U2EzVnV3cFRuQmZjOFJGN3l4RFp5S3M5cjVJeEhQaUt2MVA5aVpxRG55QXZNUTM5VWVjYlNjVmIvZ0pPMDNYazRDRm9tM1hZSzFjbGhNZFFVbEtvNy9kOU5GMTNSa0lkZnkrTVY3VFNlMnNsMTF0UkZhWFltSktwV1RkN2tkVm5KOHZlZXZaS2MrbjNJOTN0OUpudnI1bjRhVFZXVS8wejlBSTJxTWtWNG5HTmdaa0FHakF4b0FBQUFqZ0FGIg==) format("woff"), url(data:font/ttf;base64,ZXhwb3J0IGRlZmF1bHQgImRhdGE6Zm9udC90dGY7YmFzZTY0LEFBRUFBQUFOQUlBQUF3QlFSa1pVVFczUnlLOEFBQWRJQUFBQUhFZEVSVVlBTkFBR0FBQUhLQUFBQUNCUFV5OHlUL2I5c2dBQUFWZ0FBQUJXWTIxaGNDSVBSYjBBQUFISUFBQUJZbWRoYzNELy93QURBQUFISUFBQUFBaG5iSGxtUDV1MllBQUFBendBQUFJc2FHVmhaQUFCTWZzQUFBRGNBQUFBTm1ob1pXRUQ1UUlGQUFBQkZBQUFBQ1JvYlhSNEJrb0FTZ0FBQWJBQUFBQVdiRzlqWVFEMkFhSUFBQU1zQUFBQUVHMWhlSEFBU3dCSEFBQUJPQUFBQUNCdVlXMWxCU2VCd2dBQUJXZ0FBQUZ1Y0c5emRDK3pNZ01BQUFiWUFBQUFSUUFCQUFBQUFRQUE4TVFRVDE4UFBQVUFDd0lBQUFBQUFNOXhlSDhBQUFBQXozRjRmd0FsQUNVQjJ3SGJBQUFBQ0FBQ0FBQUFBQUFBQUFFQUFBSGJBQUFBTGdJQUFBQUFBQUhiQUFFQUFBQUFBQUFBQUFBQUFBQUFBQUFFQUFFQUFBQUhBRVFBQWdBQUFBQUFBZ0FBQUFFQUFRQUFBRUFBQUFBQUFBQUFBUUlBQVpBQUJRQUlBVXdCWmdBQUFFY0JUQUZtQUFBQTlRQVpBSVFBQUFJQUJRa0FBQUFBQUFDQUFBQUJBQUFBSUFBQUFBQUFBQUFBVUdaRlpBQkFBR0Voa2dIZy8rQUFMZ0hiLzlzQUFBQUJBQUFBQUFBQUFnQUFBQUFBQUFBQ0FBQUFBZ0FBSlFBbEFDVUFKUUFBQUFBQUF3QUFBQU1BQUFBY0FBRUFBQUFBQUZ3QUF3QUJBQUFBSEFBRUFFQUFBQUFNQUFnQUFnQUVBQUFBWVNBaUlaQWhrdi8vQUFBQUFBQmhJQ0loa0NHUy8vOEFBUCtsMytQZWRONXhBQUVBQUFBQUFBQUFBQUFBQUFBQUFBRUdBQUFCQUFBQUFBQUFBQUVDQUFBQUFnQUFBQUFBQUFBQUFBQUFBQUFBQUFFQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFCZ0FBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBRkFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQkdBSXdBc0FFV0FBSUFKUUFsQWRzQjJ3QVlBQ3dBQUQ4Qk5qUXZBU1lqSWc4QkJoVVVId0VIQmhVVUh3RVdNekkyRkFjR0J3WWlKeVluSmpRM05qYzJNaGNXRi9HQ0JnYUNCUWNJQlIwR0JsZFhCZ1lkQlFnSDd4MGVNakI4TURJZUhSMGVNakI4TURJZWNZSUdEZ2FDQlFVZUJRY0pCRmhZQkFrSEJSNEYwbnd3TWg0ZEhSNHlNSHd3TWg0ZEhSNHlBQUFBQWdBbEFDVUIyd0hiQUJnQUxBQUFKVGMyTlRRdkFUYzJOVFF2QVNZaklnOEJCaFFmQVJZek1qWVVCd1lIQmlJbkppY21ORGMyTnpZeUZ4WVhBU2dkQmdaWFZ3WUdIUVVJQndXQ0JnYUNCUWNJdUIwZU1qQjhNREllSFIwZU1qQjhNREllY1I0RkJ3a0VXRmdFQ1FjRkhnVUZnZ1lPQm9JRjBud3dNaDRkSFI0eU1Id3dNaDRkSFI0eUFBQUJBQ1VBSlFIYkFkc0FFd0FBQUJRSEJnY0dJaWNtSnlZME56WTNOaklYRmhjQjJ4MGVNakI4TURJZUhSMGVNakI4TURJZUFUNThNREllSFIwZU1qQjhNREllSFIwZU1nQUJBQ1VBSlFIYkFkc0FRd0FBQVJVVUJpc0JJaWNtUHdFbUl5SUhCZ2NHQndZVUZ4WVhGaGNXTXpJM05qYzJNeklmQVJZVkZBY0dCd1lqSWljbUp5WW5KalEzTmpjMk56WXpNaGNXRnpjMkZ4WUIyd29JZ0FzR0JRa29Lam9kSEJ3U0ZBd0xDd3dVRWh3Y0hTSWVJQk1HQVFRREp3TUNJU3NwTkM4bUxCb2JGQkVSRkJzYUxDWXZLaWNwSFNVSURBc0J0NEFJQ2dzTENTY25Dd3dVRWh3Y09od2NFaFFNQ3c4T0hBTURKd01EQWdRbkZCUVJGQnNhTENaZUppd2FHeFFSRHhFY0pRZ0VCZ0FBQUFBQUFBd0FsZ0FCQUFBQUFBQUJBQVVBREFBQkFBQUFBQUFDQUFjQUlnQUJBQUFBQUFBREFDRUFiZ0FCQUFBQUFBQUVBQVVBbkFBQkFBQUFBQUFGQUFzQXVnQUJBQUFBQUFBR0FBVUEwZ0FEQUFFRUNRQUJBQW9BQUFBREFBRUVDUUFDQUE0QUVnQURBQUVFQ1FBREFFSUFLZ0FEQUFFRUNRQUVBQW9Ba0FBREFBRUVDUUFGQUJZQW9nQURBQUVFQ1FBR0FBb0F4Z0J6QUd3QWFRQmpBR3NBQUhOc2FXTnJBQUJTQUdVQVp3QjFBR3dBWVFCeUFBQlNaV2QxYkdGeUFBQkdBRzhBYmdCMEFFWUFid0J5QUdjQVpRQWdBRElBTGdBd0FDQUFPZ0FnQUhNQWJBQnBBR01BYXdBZ0FEb0FJQUF4QURRQUxRQTBBQzBBTWdBd0FERUFOQUFBUm05dWRFWnZjbWRsSURJdU1DQTZJSE5zYVdOcklEb2dNVFF0TkMweU1ERTBBQUJ6QUd3QWFRQmpBR3NBQUhOc2FXTnJBQUJXQUdVQWNnQnpBR2tBYndCdUFDQUFNUUF1QURBQUFGWmxjbk5wYjI0Z01TNHdBQUJ6QUd3QWFRQmpBR3NBQUhOc2FXTnJBQUFBQUFJQUFBQUFBQUFBQUFBQUFBQUFBUUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFCd0FBQUFFQUFnRUNBUU1BaHdCRUNtRnljbTkzY21sbmFIUUpZWEp5YjNkc1pXWjBBQUFBQUFBQUFmLy9BQUlBQVFBQUFBNEFBQUFZQUFBQUFBQUNBQUVBQXdBR0FBRUFCQUFBQUFJQUFBQUFBQUVBQUFBQXp1N1hzQUFBQUFEUGNYaC9BQUFBQU05eGVIOD0i) format("truetype"), url([object Module]#slick) format("svg"); }

/* Arrows */
.slick-prev,
.slick-next {
  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 50%;
  display: block;
  width: 20px;
  height: 20px;
  padding: 0;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer;
  color: transparent;
  border: none;
  outline: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center; }

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  color: transparent;
  outline: none;
  background: transparent; }

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
  opacity: 1; }

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: .25; }

.slick-prev:before,
.slick-next:before {
  font-family: 'slick';
  font-size: 20px;
  line-height: 1;
  opacity: .75;
  color: white;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.slick-prev {
  left: -25px; }

[dir='rtl'] .slick-prev {
  right: -25px;
  left: auto; }

.slick-prev:before {
  content: '\2190'; }

[dir='rtl'] .slick-prev:before {
  content: '\2192'; }

.slick-next {
  right: -25px; }

[dir='rtl'] .slick-next {
  right: auto;
  left: -25px; }

.slick-next:before {
  content: '\2192'; }

[dir='rtl'] .slick-next:before {
  content: '\2190'; }

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px; }

.slick-dots {
  position: absolute;
  bottom: -25px;
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center; }

.slick-dots li {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer; }

.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 20px;
  height: 20px;
  padding: 5px;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: none;
  background: transparent; }

.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none; }

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1; }

.slick-dots li button:before {
  font-family: 'slick';
  font-size: 16px;
  line-height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  content: '\2022';
  text-align: center;
  opacity: .25;
  color: black;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.slick-dots li.slick-active button:before {
  opacity: .75;
  color: black; }

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0; }

.slick-list:focus {
  outline: none; }

.slick-list.dragging {
  cursor: pointer;
  cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto; }

.slick-track:before,
.slick-track:after {
  display: table;
  content: ''; }

.slick-track:after {
  clear: both; }

.slick-loading .slick-track {
  visibility: hidden; }

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px; }

[dir='rtl'] .slick-slide {
  float: right; }

.slick-slide img {
  display: block; }

.slick-slide.slick-loading img {
  display: none; }

.slick-slide.dragging img {
  pointer-events: none; }

.slick-initialized .slick-slide {
  display: block; }

.slick-loading .slick-slide {
  visibility: hidden; }

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent; }

.slick-arrow.slick-hidden {
  display: none; }

.slick-dots {
  bottom: 25px; }

.slick-arrow {
  z-index: 1;
  margin: 0 5px;
  top: 40%; }
  @media screen and (min-width: 1024px) {
    .slick-arrow {
      top: 45%; } }
  .slick-arrow::before {
    display: none; }

.slick-prev {
  left: 0; }
  @media screen and (min-width: 1024px) {
    .slick-prev {
      left: 0; } }

.slick-next {
  right: 70px; }
  @media screen and (min-width: 1024px) {
    .slick-next {
      right: 85px; } }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

:root {
  --globalContainerWidth: 1920px; }

body {
  font-family: var(--font-family), sans-serif;
  font-weight: var(--font-weight);
  font-style: var(--font-style); }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-family), sans-serif; }

.slick-arrow {
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  transition: all 0.2s; }

.slick-arrow:hover {
  background-color: #fff;
  box-shadow: 1px 1px 3px 3px rgba(0, 0, 0, 0.082); }

.slick-arrow.slick-next {
  display: flex;
  justify-content: center;
  flex-direction: row;
  align-items: center; }

.slick-arrow.slick-prev {
  display: flex;
  justify-content: center;
  flex-direction: row;
  align-items: center; }

.slick-arrow.slick-disabled {
  display: none; }

.animatedBanner-hoverAnimation-zoom {
  cursor: default;
  transform: none; }
  .animatedBanner-hoverAnimation-zoom:hover {
    cursor: pointer;
    transform: scale(1.1, 1.1); }

.animatedBanner-cursor-pointer {
  cursor: pointer; }

:root {
  --globalContainerWidth: 1920px; }

body {
  font-family: var(--font-family), sans-serif;
  font-weight: var(--font-weight);
  font-style: var(--font-style); }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-family), sans-serif; }

.slick-arrow {
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  transition: all 0.2s; }

.slick-arrow:hover {
  background-color: #fff;
  box-shadow: 1px 1px 3px 3px rgba(0, 0, 0, 0.082); }

.slick-arrow.slick-next {
  display: flex;
  justify-content: center;
  flex-direction: row;
  align-items: center; }

.slick-arrow.slick-prev {
  display: flex;
  justify-content: center;
  flex-direction: row;
  align-items: center; }

.slick-arrow.slick-disabled {
  display: none; }

.animatedBanner-hoverAnimation-zoom {
  cursor: default;
  transform: none; }
  .animatedBanner-hoverAnimation-zoom:hover {
    cursor: pointer;
    transform: scale(1.1, 1.1); }

.animatedBanner-cursor-pointer {
  cursor: pointer; }

.NotFoundUserContainer {
  width: 100vw;
  height: 100vh;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: center; }

.NotFoundSystemContainer {
  margin-top: -106px;
  margin-left: -300px;
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  text-align: center;
  flex-direction: column; }
  @media screen and (max-width: 1920px) {
    .NotFoundSystemContainer {
      margin-left: unset; } }

.NotFoundImage {
  max-height: 50vh;
  display: flex;
  justify-content: center;
  position: relative; }

.NotFoundTitle {
  color: #295148;
  font-size: 30px; }

.NotFoundButton {
  color: #295148;
  min-width: 200px;
  margin: 0 auto;
  padding: 10px 20px;
  background-color: transparent;
  border: 4px solid #295148;
  cursor: pointer;
  font-weight: bold;
  transition: .2s; }
  .NotFoundButton:hover {
    background-color: #29514823; }

.AdBannerContainer {
  height: 300px;
  width: 100%;
  margin: 20px 0;
  position: relative; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.AddressCardContainer {
  border: 2px solid black;
  padding: 16px;
  position: relative;
  width: 100%;
  height: 100%;
  min-width: 300px;
  display: flex;
  flex-direction: column;
  justify-content: space-between; }
  .AddressCardContainer .ButtonSimpleAnimatedContainer {
    width: 200px;
    align-self: center;
    margin-bottom: 10px; }

.AddressCardContentContainer {
  margin: 0 0 40px; }
  .AddressCardContentContainer p {
    margin-top: 8px; }

.AddressCardDeleteButtonContainer {
  position: absolute;
  right: 10px;
  top: 10px; }
  .AddressCardDeleteButtonContainer .ButtonDeleteAnimatedContainer {
    width: 1.5rem;
    height: 1.5rem; }

.AddressCardEditButton {
  width: 100%;
  text-align: center;
  text-transform: uppercase; }

.AlertContainer {
  width: 100%;
  max-width: var(--globalContainerWidth);
  position: fixed;
  top: 80px;
  z-index: 100;
  background: transparent;
  display: flex;
  justify-content: center; }

.AlertWrapper {
  width: 100%;
  max-width: 1024px;
  height: 100%;
  position: relative;
  min-height: 50px;
  left: calc(50% - 100% / 2);
  background: rgba(250, 45, 0, 0.8);
  padding: 10px;
  display: flex;
  justify-content: center;
  align-items: center; }
  .AlertWrapper span {
    font-weight: 500; }

.AlertCloseBtn {
  position: absolute;
  right: 5px;
  top: 5px;
  z-index: 101;
  background: none;
  outline: none;
  border: none;
  cursor: pointer; }
  .AlertCloseBtn i::before {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\F00D"; }

.ActionButton.ActionButtonCondensed {
  width: 24px; }
  .ActionButton.ActionButtonCondensed span {
    width: 16px;
    height: 16px;
    border-radius: unset;
    background-color: unset; }
    .ActionButton.ActionButtonCondensed span i {
      font-size: 1em; }
    .ActionButton.ActionButtonCondensed span:hover {
      box-shadow: none;
      transition: none; }

.ActionButton {
  width: 64px;
  text-align: center;
  z-index: 1;
  background: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start; }
  .ActionButton span {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: #DFDFDF;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; }
    .ActionButton span:hover {
      box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
      transition: 0.2s all; }
    .ActionButton span i {
      font-size: 16px; }
  .ActionButton p {
    font-size: 9px;
    font-style: normal;
    font-weight: 300;
    line-height: 1.5em;
    letter-spacing: 0;
    text-align: center;
    margin-top: 12.5px;
    width: 100%; }
  .ActionButton.Favourites span i::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F004"; }
  .ActionButton.Comparision span i::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F24E"; }
  .ActionButton.Related span i::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F12E"; }
  .ActionButton.ActionButtonSelected.Favourites span i::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\F004"; }
  .ActionButton.ActionButtonSelected.Comparision span i::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\F24E"; }
  .ActionButton.ActionButtonSelected.Related span i::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\F12E"; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ArticleExpandedDetailsItemValue {
  color: #333333;
  margin-left: 15px; }

.ArticleExpandedDetailsBatteryIconContainer {
  display: flex;
  align-items: center; }
  .ArticleExpandedDetailsBatteryIconContainer .label {
    margin-right: 15px; }

.ArticleExpandedDetailsQuantity {
  display: flex;
  align-items: center; }
  .ArticleExpandedDetailsQuantity span {
    margin-left: 10px; }

.ArticleItemImage {
  z-index: 0;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  cursor: pointer; }
  .ArticleItemImage img {
    image-rendering: -webkit-optimize-contrast; }

.ArticleItemSeparator {
  width: 0.5px;
  background-color: #e7e7e7;
  height: 100%;
  display: none; }

.ArticleItemTags {
  z-index: 1;
  padding: 0; }
  .ArticleItemTags p.ArticleTagsItem {
    font-size: 12px; }

.ArticleItemName {
  text-decoration: none;
  display: block;
  cursor: pointer;
  font-size: 16px;
  font-weight: 700;
  color: var(--productName-font-color); }

.ArticleItemActions {
  display: flex;
  align-items: flex-end;
  position: relative; }
  .ArticleItemActions .ArticleItemActionsWrapper {
    width: 100%;
    position: relative; }
    .ArticleItemActions .ArticleItemActionsWrapper hr {
      position: absolute;
      left: 0;
      top: 18px;
      height: 1px;
      background-color: #DFDFDF;
      border: 0;
      right: 0;
      z-index: 0; }
    .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer {
      width: 100%;
      display: flex;
      flex-direction: row;
      position: relative;
      z-index: 1; }

.ArticleItemProps {
  font-size: 12px;
  font-style: normal;
  font-weight: 300; }

.ArticleItemPropManufacturer {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 7.25px; }

.ArticleItemPropReview {
  display: flex;
  align-items: center;
  margin: 10px 0 0 0; }
  .ArticleItemPropReview > span:last-child {
    padding-left: 7.25px;
    font-weight: 700; }
  .ArticleItemPropReview .MuiRating-root {
    font-size: 1rem; }

.ArticleItemPropRegular em .IconsQuantityContainer {
  display: inline-block;
  position: relative;
  top: 3px; }

.ArticleItemSpecs {
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: 1.35em; }
  .ArticleItemSpecs ul {
    list-style: none;
    padding: 0; }
    .ArticleItemSpecs ul li {
      margin: 0; }
      .ArticleItemSpecs ul li em {
        padding-left: 0.5em;
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        color: #333333; }

.ArticleItemPrice {
  display: flex;
  flex-direction: column;
  align-items: flex-end; }
  .ArticleItemPrice .PriceWrapper {
    margin: 5px 0; }
  .ArticleItemPrice .PriceValueWrapper {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end; }
    .ArticleItemPrice .PriceValueWrapper .PriceDiscountPercentage {
      margin: 4px 10px 0 0; }
    .ArticleItemPrice .PriceValueWrapper .PriceValue .PriceValuePromotion {
      font-size: 28px; }
    .ArticleItemPrice .PriceValueWrapper .PriceValue .PriceValueRegular {
      font-size: 28px; }
      .ArticleItemPrice .PriceValueWrapper .PriceValue .PriceValueRegular.Old, .ArticleItemPrice .PriceValueWrapper .PriceValue .PriceValueRegular.OldPlaceholder {
        font-size: 18px;
        display: block;
        text-align: right;
        margin-top: 7.25px; }
  .ArticleItemPrice .PricePromotionDate {
    font-size: 10px;
    font-weight: 400;
    margin-bottom: 4px; }
  .ArticleItemPrice .PriceInfo {
    font-size: 13px;
    font-weight: 400;
    margin-top: 4px; }

.ArticleItemQuantitySelectors {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  max-height: 130px; }
  .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer {
    max-height: 165px;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 12.5px; }
    .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsMeasure {
      display: flex;
      flex-direction: column; }
      .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsMeasure p {
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 14px;
        letter-spacing: 0em;
        text-align: left;
        margin: 0 0 7.25px 0; }
      .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsMeasure select {
        border: 1px solid rgba(0, 0, 0, 0.15);
        width: 100px;
        height: 32px; }
    .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity {
      display: flex;
      flex-direction: column; }
      .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity p {
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 14px;
        letter-spacing: 0em;
        text-align: left;
        margin: 0 0 7.25px 0; }
      .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer {
        margin: 0;
        height: 32px; }
        .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer .ProductQuantitySelectorIcons {
          height: 30px;
          min-width: 32px; }

.ArticleTileFillerContainer {
  align-self: flex-start;
  display: inline-block;
  flex-basis: 50%;
  width: 50%;
  max-width: 50%;
  padding: 25px 12px 0;
  margin: 0;
  position: relative;
  cursor: pointer; }
  @media screen and (min-width: 768px) {
    .ArticleTileFillerContainer {
      flex-basis: 33.33333%;
      width: 33.33333%;
      max-width: 33.33333%; } }
  @media screen and (min-width: 1024px) {
    .ArticleTileFillerContainer {
      flex-basis: 50%;
      width: 50%;
      max-width: 50%; } }
  @media screen and (min-width: 1200px) {
    .ArticleTileFillerContainer {
      flex-basis: 33.33333%;
      width: 33.33333%;
      max-width: 33.33333%; } }
  .ArticleTileFillerContainer.ArticleTileFillerDouble {
    flex-basis: 100%;
    width: 100%;
    max-width: 100%; }
    @media screen and (min-width: 768px) {
      .ArticleTileFillerContainer.ArticleTileFillerDouble {
        flex-basis: 66.6666%;
        width: 66.6666%;
        max-width: 66.6666%; } }
    @media screen and (min-width: 1024px) {
      .ArticleTileFillerContainer.ArticleTileFillerDouble {
        flex-basis: 100%;
        width: 100%;
        max-width: 100%; } }
    @media screen and (min-width: 1200px) {
      .ArticleTileFillerContainer.ArticleTileFillerDouble {
        flex-basis: 66.6666%;
        width: 66.6666%;
        max-width: 66.6666%; } }

.ArticleTileFillerHeader {
  font-size: 16px; }

.ArticleTileFillerDescription {
  font-size: 14px; }

.ArticleTileFillerButton {
  opacity: .5;
  transition: opacity .15s;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2; }
  @media screen and (min-width: 1024px) {
    .ArticleTileFillerButton {
      opacity: 0; } }
  .ArticleTileFillerButton:hover {
    opacity: .8; }

.ArticleTileFillerTopBackground {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background-size: cover;
  cursor: pointer;
  z-index: 1; }

.ArticleTileFillerBottom {
  display: flex;
  flex-direction: column;
  padding: 6px 0 12px;
  cursor: pointer; }

.ArticleTileFillerTop {
  position: relative;
  height: 200px;
  z-index: 1; }
  .ArticleTileFillerTop:hover .ArticleTileFillerButton {
    opacity: .6; }
  @media screen and (min-width: 480px) {
    .ArticleTileFillerTop {
      height: 250px; } }
  @media screen and (min-width: 768px) {
    .ArticleTileFillerTop {
      height: 300px; } }
  @media screen and (min-width: 1200px) {
    .ArticleTileFillerTop {
      min-height: 300px;
      max-height: 500px;
      height: 25vw; } }
  @media screen and (min-width: 1920px) {
    .ArticleTileFillerTop {
      height: 500px; } }

.ArticleTileFillerContainer4 {
  align-self: flex-start;
  display: inline-block;
  flex-basis: 50%;
  width: 50%;
  max-width: 50%;
  padding: 25px 12px 0;
  margin: 0;
  position: relative; }
  @media screen and (min-width: 768px) {
    .ArticleTileFillerContainer4 {
      flex-basis: 25%;
      width: 25%;
      max-width: 25%; } }
  @media screen and (min-width: 1024px) {
    .ArticleTileFillerContainer4 {
      flex-basis: 50%;
      width: 50%;
      max-width: 50%; } }
  @media screen and (min-width: 1200px) {
    .ArticleTileFillerContainer4 {
      flex-basis: 25%;
      width: 25%;
      max-width: 25%; } }
  .ArticleTileFillerContainer4.ArticleTileFillerDouble {
    flex-basis: 100%;
    width: 100%;
    max-width: 100%; }
    @media screen and (min-width: 768px) {
      .ArticleTileFillerContainer4.ArticleTileFillerDouble {
        flex-basis: 50%;
        width: 50%;
        max-width: 50%; } }
    @media screen and (min-width: 1024px) {
      .ArticleTileFillerContainer4.ArticleTileFillerDouble {
        flex-basis: 100%;
        width: 100%;
        max-width: 100%; } }
    @media screen and (min-width: 1200px) {
      .ArticleTileFillerContainer4.ArticleTileFillerDouble {
        flex-basis: 50%;
        width: 50%;
        max-width: 50%; } }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ArticleTileItemContainer {
  display: inline-block;
  padding: 25px 12px 0;
  margin: 0 0 10px;
  position: relative;
  flex-basis: 33.33333%; }
  @media screen and (max-width: 1024px) {
    .ArticleTileItemContainer {
      flex-basis: 50.00000%; } }
  @media screen and (max-width: 768px) {
    .ArticleTileItemContainer {
      flex-basis: 33.33333%; } }
  @media screen and (max-width: 480px) {
    .ArticleTileItemContainer {
      flex-basis: 50.0000%; } }
  @media screen and (max-width: 375px) {
    .ArticleTileItemContainer {
      flex-basis: 100.0000%; } }
  @media screen and (max-width: 1440px) {
    .ArticleTileItemContainer {
      padding: 12.5px 8px 0; } }
  @media screen and (max-width: 1200px) {
    .ArticleTileItemContainer {
      padding: 12.5px 5px 0; } }
  .ArticleTileItemContainer .ArticleTileItemContainerInner {
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    padding: 5px 16px 10px;
    margin-bottom: 20px;
    position: relative;
    display: grid;
    grid-column-gap: 0;
    grid-row-gap: 0;
    grid-template-columns: 100%;
    grid-template-rows: auto min-content min-content min-content min-content min-content min-content;
    grid-template-areas: "image" "name" "props" "specs" "price" "quantity" "controls"; }
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemImage, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemName, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps,
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemSpecs, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemQuantitySelectorsContainer,
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemAddToCartContainer {
      outline: 0px dotted rgba(0, 0, 0, 0.2); }
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemImage {
      grid-area: image;
      margin: 0;
      height: calc(250px); }
      @media screen and (min-width: 480px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemImage {
          height: 250px; } }
      @media screen and (min-width: 768px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemImage {
          height: 300px; } }
      @media screen and (min-width: 1200px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemImage {
          height: 25vw; } }
      @media screen and (min-width: 1920px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemImage {
          height: 500px; } }
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemTags {
      grid-area: image;
      margin: 0; }
      @media screen and (max-width: 1200px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemTags p.ArticleTagsItem {
          font-size: 10px;
          padding: 2px 5px; } }
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemActions {
      grid-area: image;
      margin: 0;
      align-items: flex-start;
      justify-content: flex-end;
      width: 48px;
      position: absolute;
      top: 0;
      right: 0; }
      .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper {
        width: auto;
        margin: 0px; }
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper hr {
          display: none; }
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer {
          flex-direction: column; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer .ActionButton {
            width: 36px;
            padding: 0 0 5px 0; }
            .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer .ActionButton span {
              width: 36px;
              height: 36px; }
              .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer .ActionButton span i {
                font-size: 16px; }
            .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer .ActionButton p {
              display: none; }
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemName {
      grid-area: name;
      margin: 5px 0 0 0;
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap;
      line-height: 1.5em;
      font-size: 18px; }
      @media screen and (max-width: 1200px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemName {
          font-size: 16px; } }
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps {
      grid-area: props;
      margin: 5px 0 0 0;
      display: grid;
      grid-column-gap: 5px;
      grid-row-gap: 5px;
      grid-template-columns: calc(50% - 2.5px) calc(50% - 2.5px);
      grid-template-rows: auto auto;
      grid-template-areas: "propManufacturer propReviews" "propRegular propRegular"; }
      .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropManufacturer {
        grid-area: propManufacturer;
        overflow: hidden; }
      .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropReview {
        grid-area: propReviews;
        justify-content: flex-end;
        margin: 0; }
      .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropRegular {
        grid-area: propRegular; }
      @media screen and (max-width: 1200px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps {
          grid-column-gap: 0;
          grid-template-columns: calc(100%);
          grid-template-rows: auto auto auto;
          grid-template-areas: "propReviews" "propManufacturer" "propRegular"; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropReview {
            justify-content: flex-start; } }
      @media screen and (max-width: 1024px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps {
          grid-column-gap: 5px;
          grid-row-gap: 5px;
          grid-template-columns: calc(50% - 2.5px) calc(50% - 2.5px);
          grid-template-rows: auto auto;
          grid-template-areas: "propManufacturer propReviews" "propRegular propRegular"; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropReview {
            justify-content: flex-end; } }
      @media screen and (max-width: 768px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps {
          grid-column-gap: 0;
          grid-template-columns: calc(100%);
          grid-template-rows: auto auto auto;
          grid-template-areas: "propReviews" "propManufacturer" "propRegular"; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropReview {
            justify-content: flex-start; } }
      @media screen and (max-width: 375px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps {
          grid-column-gap: 5px;
          grid-row-gap: 5px;
          grid-template-columns: calc(50% - 2.5px) calc(50% - 2.5px);
          grid-template-rows: auto auto;
          grid-template-areas: "propManufacturer propReviews" "propRegular propRegular"; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropReview {
            justify-content: flex-end; } }
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemSpecs {
      grid-area: specs;
      margin: 7.25px 0 0 0; }
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice {
      grid-area: price;
      margin: 5px 0 0 0; }
      .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper {
        display: grid;
        grid-template-columns: auto auto;
        grid-template-rows: auto auto auto auto;
        grid-template-areas: "promotionDate promotionDate" "discountPercentage valueCurrent" "valueOld valueOld" "priceInfo priceInfo";
        grid-column-gap: 0px;
        grid-row-gap: 0px;
        margin: 0; }
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
          margin-right: 10px; }
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old {
          justify-content: flex-end;
          margin: 5px 0; }
      @media screen and (max-width: 1440px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper {
          grid-row-gap: 0px; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
            font-size: 16px; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
            font-size: 28px; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
            font-size: 28px; }
            .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
              font-size: 20px; } }
      @media screen and (max-width: 600px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper {
          grid-row-gap: 0px; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
            padding: 2px 4px;
            font-size: 12px; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
            font-size: 20px; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
            font-size: 20px; }
            .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
              font-size: 16px; } }
      @media screen and (max-width: 375px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper {
          display: grid;
          grid-template-columns: auto auto auto;
          grid-template-rows: auto auto auto;
          grid-template-areas: "promotionDate promotionDate promotionDate" "valueOld discountPercentage valueCurrent" "priceInfo priceInfo priceInfo";
          grid-column-gap: 10px;
          grid-row-gap: 5px;
          margin: 0; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
            font-size: 14px; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
            font-size: 26px; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
            font-size: 26px; }
            .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
              font-size: 18px; } }
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemQuantitySelectors {
      grid-area: quantity;
      margin: 0;
      padding: 0;
      height: 0;
      overflow: hidden; }
      .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer {
        margin: 5px 0 0 0; }
    .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemAddToCart, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleNavigateToCart {
      grid-area: controls;
      padding: 0;
      height: 0;
      overflow: hidden; }
      .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemAddToCart .ArticleItemAddToCartContainer, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleNavigateToCart .ArticleItemAddToCartContainer {
        margin: 5px 0 0 0; }
      @media screen and (max-width: 1200px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemAddToCart .ButtonStandardAnimatedContent, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleNavigateToCart .ButtonStandardAnimatedContent {
          padding: 0 5px; }
          .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleItemAddToCart .ButtonStandardAnimatedContent p, .ArticleTileItemContainer .ArticleTileItemContainerInner .ArticleNavigateToCart .ButtonStandardAnimatedContent p {
            font-size: 14px; } }
    .ArticleTileItemContainer .ArticleTileItemContainerInner:hover .ArticleItemImage {
      transition: all 0.2s; }
      @media screen and (min-width: 1024px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner:hover .ArticleItemImage {
          height: 190px; } }
      @media screen and (min-width: 1200px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner:hover .ArticleItemImage {
          height: calc(25vw - 110px); } }
      @media screen and (min-width: 1920px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner:hover .ArticleItemImage {
          height: 390px; } }
    .ArticleTileItemContainer .ArticleTileItemContainerInner:hover .ArticleItemQuantitySelectors {
      height: 60px;
      transition: all 0.2s; }
      @media screen and (max-width: 768px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner:hover .ArticleItemQuantitySelectors {
          height: 0; } }
    .ArticleTileItemContainer .ArticleTileItemContainerInner:hover .ArticleItemAddToCart, .ArticleTileItemContainer .ArticleTileItemContainerInner:hover .ArticleNavigateToCart {
      height: 50px;
      transition: all 0.2s;
      margin-top: 10px; }
      @media screen and (max-width: 768px) {
        .ArticleTileItemContainer .ArticleTileItemContainerInner:hover .ArticleItemAddToCart, .ArticleTileItemContainer .ArticleTileItemContainerInner:hover .ArticleNavigateToCart {
          height: 0; } }
  .ArticleTileItemContainer.Catalog .ArticleTileItemContainerInner:hover .ArticleItemImage {
    height: calc(250px); }
    @media screen and (min-width: 480px) {
      .ArticleTileItemContainer.Catalog .ArticleTileItemContainerInner:hover .ArticleItemImage {
        height: 250px; } }
    @media screen and (min-width: 768px) {
      .ArticleTileItemContainer.Catalog .ArticleTileItemContainerInner:hover .ArticleItemImage {
        height: 300px; } }
    @media screen and (min-width: 1200px) {
      .ArticleTileItemContainer.Catalog .ArticleTileItemContainerInner:hover .ArticleItemImage {
        height: 25vw; } }
    @media screen and (min-width: 1920px) {
      .ArticleTileItemContainer.Catalog .ArticleTileItemContainerInner:hover .ArticleItemImage {
        height: 500px; } }
  .ArticleTileItemContainer.FourColumns {
    flex-basis: 25%; }
    @media screen and (max-width: 1024px) {
      .ArticleTileItemContainer.FourColumns {
        flex-basis: 50%; } }
    @media screen and (max-width: 768px) {
      .ArticleTileItemContainer.FourColumns {
        flex-basis: 25%; } }
    @media screen and (max-width: 600px) {
      .ArticleTileItemContainer.FourColumns {
        flex-basis: 50%; } }
    @media screen and (max-width: 375px) {
      .ArticleTileItemContainer.FourColumns {
        flex-basis: 100%; } }
    @media screen and (max-width: 1440px) {
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemProps {
        grid-column-gap: 0;
        grid-template-columns: calc(100%);
        grid-template-rows: auto auto auto;
        grid-template-areas: "propReviews" "propManufacturer" "propRegular"; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropReview {
          justify-content: flex-start; } }
    @media screen and (max-width: 1024px) {
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemProps {
        grid-column-gap: 5px;
        grid-row-gap: 5px;
        grid-template-columns: calc(50% - 2.5px) calc(50% - 2.5px);
        grid-template-rows: auto auto;
        grid-template-areas: "propManufacturer propReviews" "propRegular propRegular"; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropReview {
          justify-content: flex-end; } }
    @media screen and (max-width: 768px) {
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemProps {
        grid-column-gap: 0;
        grid-template-columns: calc(100%);
        grid-template-rows: auto auto auto;
        grid-template-areas: "propReviews" "propManufacturer" "propRegular"; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropReview {
          justify-content: flex-start; } }
    @media screen and (max-width: 375px) {
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemProps {
        grid-column-gap: 5px;
        grid-row-gap: 5px;
        grid-template-columns: calc(50% - 2.5px) calc(50% - 2.5px);
        grid-template-rows: auto auto;
        grid-template-areas: "propManufacturer propReviews" "propRegular propRegular"; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemProps .ArticleItemPropReview {
          justify-content: flex-end; } }
    @media screen and (max-width: 1440px) {
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper {
        grid-row-gap: 5px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
          font-size: 16px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
          font-size: 28px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
          font-size: 28px; }
          .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
            font-size: 20px; } }
    @media screen and (max-width: 1200px) {
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
        font-size: 12px; }
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
        font-size: 20px; }
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
        font-size: 20px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
          font-size: 16px; } }
    @media screen and (max-width: 1024px) {
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper {
        grid-row-gap: 5px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
          font-size: 16px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
          font-size: 28px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
          font-size: 28px; }
          .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
            font-size: 20px; } }
    @media screen and (max-width: 768px) {
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper {
        grid-row-gap: 2px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
          padding: 2px 4px;
          font-size: 12px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
          font-size: 20px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
          font-size: 20px; }
          .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
            font-size: 16px; } }
    @media screen and (max-width: 600px) {
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
        font-size: 14px; }
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
        font-size: 26px; }
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
        font-size: 26px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
          font-size: 18px; } }
    @media screen and (max-width: 375px) {
      .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper {
        display: grid;
        grid-template-columns: auto auto auto;
        grid-template-rows: auto auto auto;
        grid-template-areas: "promotionDate promotionDate promotionDate" "valueOld discountPercentage valueCurrent" "priceInfo priceInfo priceInfo";
        grid-column-gap: 10px;
        grid-row-gap: 5px;
        margin: 0; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
          font-size: 14px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
          font-size: 26px; }
        .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
          font-size: 26px; }
          .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ArticleTileItemContainer.FourColumns .ArticleTileItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
            font-size: 18px; } }

.ArticleTileListContainer {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  background-color: #F3F3F3;
  padding: 0 12px 15px; }
  @media screen and (max-width: 1440px) {
    .ArticleTileListContainer {
      padding: 0 8px; } }
  @media screen and (max-width: 1200px) {
    .ArticleTileListContainer {
      padding: 0 5px; } }
  @media screen and (max-width: 768px) {
    .ArticleTileListContainer.Only1Item .ArticleTileItemContainer {
      flex-basis: 100.0000%; } }
  @media screen and (max-width: 768px) {
    .ArticleTileListContainer.Only2Items .ArticleTileItemContainer {
      flex-basis: 50.0000%; } }
  @media screen and (max-width: 768px) {
    .ArticleTileListContainer.Only3Items .ArticleTileItemContainer {
      flex-basis: 33.3333%; } }

.ArticleCompareButton {
  background-color: white;
  border-radius: 50%;
  width: 35px;
  height: 35px;
  border: none;
  cursor: pointer;
  color: #4D4D4D;
  opacity: 1;
  transition: .3s;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1; }
  .ArticleCompareButton:hover {
    opacity: 0.8; }
  .ArticleCompareButtonRemove {
    background-color: #4D4D4D;
    color: white; }
    @media screen and (min-width: 768px) {
      .ArticleCompareButtonRemove {
        width: 45px;
        height: 45px; } }
  @media screen and (max-width: 768px) {
    .ArticleCompareButton > .ArticleCompareBig::before {
      font-size: 24px; } }

.ArticleCompareIcon {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center; }
  @media screen and (max-width: 480px) {
    .ArticleCompareIcon {
      height: 12px; } }
  .ArticleCompareIcon::before {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F24E"; }

.ArticleCompareBig::before {
  font-size: 30px; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.PriceWrapper {
  color: var(--price-font-color);
  display: grid;
  grid-template-columns: auto auto auto 1fr;
  grid-template-rows: auto auto auto;
  grid-template-areas: "promotionDate promotionDate promotionDate filler" "valueOld discountPercentage valueCurrent filler" "priceInfo priceInfo priceInfo filler";
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  margin: 10px 0; }

.PricePromotionDate {
  grid-area: promotionDate;
  font-size: 14px;
  color: #333333;
  white-space: nowrap;
  display: block;
  text-align: right; }

.PriceValueRegular {
  grid-area: valueCurrent;
  display: flex;
  flex-direction: row;
  align-items: center;
  font-weight: bold;
  font-size: 24px; }
  @media screen and (max-width: 480px) {
    .PriceValueRegular {
      font-size: 20px; } }
  .PriceValueRegular.Old, .PriceValueRegular.OldPlaceholder {
    grid-area: valueOld;
    font-size: 18px;
    font-weight: normal;
    text-decoration: line-through;
    font-style: italic;
    opacity: .6; }
  .PriceValueRegular.OldPlaceholder {
    text-decoration: none; }

.PriceDiscountPercentage {
  grid-area: discountPercentage;
  display: flex;
  flex-direction: row;
  align-items: center;
  background-color: #CE0000;
  color: #fff;
  padding: 3px 8px;
  font-weight: bold;
  text-align: center;
  font-size: 18px;
  margin: 5px 0; }
  @media screen and (max-width: 480px) {
    .PriceDiscountPercentage {
      margin-bottom: 6px; } }

.PriceValuePromotion {
  grid-area: valueCurrent;
  display: flex;
  flex-direction: row;
  align-items: center;
  font-weight: bold;
  color: #CE0000;
  font-size: 24px;
  vertical-align: center; }
  @media screen and (max-width: 480px) {
    .PriceValuePromotion {
      font-size: 20px; } }

.PriceInfo {
  grid-area: priceInfo;
  font-size: 10px;
  text-align: right; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.NetPriceWrapper {
  color: var(--price-font-color);
  display: grid;
  grid-template-columns: auto auto 1fr;
  grid-template-rows: auto auto;
  grid-template-areas: "valueCaption valueCaption filler" "valueOld valueCurrent filler";
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  margin: 10px 0; }

.NetPriceCaption {
  grid-area: valueCaption; }

.NetPriceValueRegular {
  grid-area: valueCurrent;
  display: flex;
  flex-direction: row;
  align-items: center;
  font-weight: bold;
  font-size: 24px; }
  @media screen and (max-width: 480px) {
    .NetPriceValueRegular {
      font-size: 20px; } }
  .NetPriceValueRegular.Old, .NetPriceValueRegular.OldPlaceholder {
    grid-area: valueOld;
    font-size: 18px;
    font-weight: normal;
    text-decoration: line-through;
    font-style: italic;
    opacity: .6; }
  .NetPriceValueRegular.OldPlaceholder {
    text-decoration: none; }

.NetPriceValuePromotion {
  grid-area: valueCurrent;
  display: flex;
  flex-direction: row;
  align-items: center;
  font-weight: bold;
  color: #CE0000;
  font-size: 24px;
  vertical-align: center; }
  @media screen and (max-width: 480px) {
    .NetPriceValuePromotion {
      font-size: 20px; } }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ProductsCarouselItemContainer {
  display: block;
  padding: 5px;
  margin: 0 0 50px 0;
  position: relative;
  overflow: hidden;
  height: 500px; }
  @media screen and (max-width: 768px) {
    .ProductsCarouselItemContainer {
      height: 400px; } }
  @media screen and (max-width: 600px) {
    .ProductsCarouselItemContainer {
      height: 300px; } }

.ProductsCarouselItemContainerInner {
  width: 100%;
  height: 100%;
  background: #FFFFFF;
  position: relative;
  padding: 10px;
  display: grid;
  grid-column-gap: 0;
  grid-row-gap: 0;
  grid-template-columns: 100%;
  grid-template-rows: 1fr auto auto auto auto auto auto;
  grid-template-areas: "image" "name" "props" "specs" "price" "quantity" "controls"; }
  .ProductsCarouselItemContainerInner .ArticleItemImage, .ProductsCarouselItemContainerInner .ArticleItemName, .ProductsCarouselItemContainerInner .ArticleItemProps,
  .ProductsCarouselItemContainerInner .ArticleItemSpecs, .ProductsCarouselItemContainerInner .ArticleItemPrice, .ProductsCarouselItemContainerInner .ArticleItemQuantitySelectorsContainer,
  .ProductsCarouselItemContainerInner .ArticleItemAddToCartContainer {
    outline: 0px dotted rgba(0, 0, 0, 0.2); }
  .ProductsCarouselItemContainerInner .ArticleItemImage {
    grid-area: image;
    height: 100%; }
  .ProductsCarouselItemContainerInner .ArticleItemTags {
    grid-area: image;
    margin: 0; }
    @media screen and (max-width: 1200px) {
      .ProductsCarouselItemContainerInner .ArticleItemTags p.ArticleTagsItem {
        font-size: 10px;
        padding: 2px 5px; } }
  .ProductsCarouselItemContainerInner .ArticleItemActions {
    grid-area: image;
    margin: 0 0 0 0;
    align-items: flex-start;
    justify-content: flex-end;
    width: 48px;
    position: absolute;
    right: 0; }
    .ProductsCarouselItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper {
      width: auto;
      margin: 0px; }
      .ProductsCarouselItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper hr {
        display: none; }
      .ProductsCarouselItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer {
        flex-direction: column; }
        .ProductsCarouselItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer .ActionButton {
          width: 36px;
          padding: 0 0 5px 0; }
          .ProductsCarouselItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer .ActionButton span {
            width: 36px;
            height: 36px; }
            .ProductsCarouselItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer .ActionButton span i {
              font-size: 16px; }
          .ProductsCarouselItemContainerInner .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer .ActionButton p {
            display: none; }
  .ProductsCarouselItemContainerInner .ArticleItemName {
    grid-area: name;
    margin: 5px 0 0 0;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    line-height: 1.5em;
    font-size: 18px; }
    @media screen and (max-width: 1440px) {
      .ProductsCarouselItemContainerInner .ArticleItemName {
        font-size: 16px; } }
  .ProductsCarouselItemContainerInner .ArticleItemProps {
    grid-area: props;
    margin: 5px 0 0 0;
    display: grid;
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    grid-template-columns: calc(50% - 2.5px) calc(50% - 2.5px);
    grid-template-rows: auto auto;
    grid-template-areas: "propManufacturer propReviews" "propRegular propRegular"; }
    .ProductsCarouselItemContainerInner .ArticleItemProps .ArticleItemPropManufacturer {
      grid-area: propManufacturer;
      overflow: hidden; }
    .ProductsCarouselItemContainerInner .ArticleItemProps .ArticleItemPropReview {
      grid-area: propReviews;
      justify-content: flex-end;
      margin: 0; }
    .ProductsCarouselItemContainerInner .ArticleItemProps .ArticleItemPropRegular {
      grid-area: propRegular; }
    @media screen and (max-width: 1440px) {
      .ProductsCarouselItemContainerInner .ArticleItemProps {
        grid-template-columns: 100%;
        grid-template-rows: auto auto auto;
        grid-template-areas: "propReviews" "propManufacturer" "propRegular"; }
        .ProductsCarouselItemContainerInner .ArticleItemProps .ArticleItemPropReview {
          justify-content: flex-start; } }
    @media screen and (max-width: 1024px) {
      .ProductsCarouselItemContainerInner .ArticleItemProps {
        grid-template-columns: calc(50% - 2.5px) calc(50% - 2.5px);
        grid-template-rows: auto auto;
        grid-template-areas: "propManufacturer propReviews" "propRegular propRegular"; }
        .ProductsCarouselItemContainerInner .ArticleItemProps .ArticleItemPropReview {
          justify-content: flex-end; } }
    @media screen and (max-width: 768px) {
      .ProductsCarouselItemContainerInner .ArticleItemProps {
        grid-template-columns: 100%;
        grid-template-rows: auto auto auto;
        grid-template-areas: "propReviews" "propManufacturer" "propRegular"; }
        .ProductsCarouselItemContainerInner .ArticleItemProps .ArticleItemPropReview {
          justify-content: flex-start; } }
  .ProductsCarouselItemContainerInner .ArticleItemSpecs {
    grid-area: specs;
    margin: 5px 0 0 0; }
  .ProductsCarouselItemContainerInner .ArticleItemPrice {
    grid-area: price;
    margin: 5px 0 0 0; }
    .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper {
      display: grid;
      grid-template-columns: auto auto;
      grid-template-rows: auto auto auto;
      grid-template-areas: "promotionDate promotionDate" "discountPercentage valueCurrent" "valueOld valueOld" "priceInfo priceInfo";
      grid-column-gap: 10px;
      grid-row-gap: 5px;
      margin: 0; }
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PricePromotionDate,
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceInfo {
        font-size: 12px; }
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old {
        justify-content: flex-end; }
    @media screen and (max-width: 1440px) {
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
        font-size: 16px; }
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
        font-size: 26px; }
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
        font-size: 26px; }
        .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
          font-size: 20px; } }
    @media screen and (max-width: 1200px) {
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
        font-size: 12px; }
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
        font-size: 20px; }
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
        font-size: 20px; }
        .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
          font-size: 16px; } }
    @media screen and (max-width: 1024px) {
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
        font-size: 16px; }
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
        font-size: 26px; }
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
        font-size: 26px; }
        .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
          font-size: 20px; } }
    @media screen and (max-width: 600px) {
      .ProductsCarouselItemContainerInner .ArticleItemPrice {
        grid-row-gap: 2px; }
        .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
          margin: 0; }
        .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceInfo {
          margin: 0; } }
    @media screen and (max-width: 375px) {
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
        font-size: 12px; }
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
        font-size: 20px; }
      .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular {
        font-size: 20px; }
        .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
          font-size: 16px; } }
  .ProductsCarouselItemContainerInner .ArticleItemQuantitySelectors {
    grid-area: quantity;
    margin: 5px 0 0 0;
    overflow: hidden;
    height: 0; }
    .ProductsCarouselItemContainerInner .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity p {
      font-size: 12px; }
  .ProductsCarouselItemContainerInner .ArticleItemAddToCart {
    grid-area: controls;
    margin: 10px 0 0 0;
    overflow: hidden;
    height: 0; }
  @media screen and (max-width: 768px) {
    .ProductsCarouselItemContainerInner .ArticleItemSpecs {
      display: none; } }
  @media screen and (max-width: 600px) {
    .ProductsCarouselItemContainerInner .ArticleItemProps {
      display: none; }
    .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old {
      display: none; }
    .ProductsCarouselItemContainerInner .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
      display: none; } }
  .ProductsCarouselItemContainerInner:hover .ArticleItemQuantitySelectors {
    height: 55px;
    transition: all 0.2s; }
    @media screen and (max-width: 768px) {
      .ProductsCarouselItemContainerInner:hover .ArticleItemQuantitySelectors {
        height: 0; } }
  .ProductsCarouselItemContainerInner:hover .ArticleItemAddToCart {
    height: 50px;
    transition: all 0.2s; }
    @media screen and (max-width: 768px) {
      .ProductsCarouselItemContainerInner:hover .ArticleItemAddToCart {
        height: 0; } }

.ArticleTagsContainer {
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: flex-start;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1; }

.ArticleTagsItem {
  text-align: center;
  padding: 5px 10px; }
  .ArticleTagsItem:first-of-type() {
    padding-left: 0; }
  @media screen and (max-width: 600px) {
    .ArticleTagsItem {
      font-size: 80%;
      gap: 2px; } }

.ButtonAddToFavouritesContainer {
  position: relative;
  transition: opacity .3s;
  width: 24px;
  height: 24px;
  overflow: hidden;
  opacity: .7;
  transition: opacity .15s;
  cursor: pointer;
  padding: 0;
  border: none;
  background: none;
  outline: none;
  line-height: 1; }
  .ButtonAddToFavouritesContainer:hover {
    opacity: 1; }
  .ButtonAddToFavouritesContainer-Loading {
    cursor: progress; }
  .ButtonAddToFavouritesContainerBig {
    width: 30px;
    height: 30px; }

.ButtonAddToFavouritesLoader {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 30px;
  height: 30px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: opacity .3s;
  opacity: 0; }
  .ButtonAddToFavouritesLoader-Visible {
    opacity: 1; }

.ButtonAddToFavouritesIcon {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: opacity .3s;
  opacity: 1;
  display: flex;
  align-items: center;
  justify-content: center; }
  .ButtonAddToFavouritesIcon-Hidden {
    opacity: 0; }
  @media screen and (max-width: 480px) {
    .ButtonAddToFavouritesIcon svg {
      font-size: 15px; } }
  @media screen and (max-width: 768px) {
    .ButtonAddToFavouritesIcon > .ButtonAddToFavouritesBig::after {
      font-size: 24px; } }

.ButtonAddToFavouritesFilledIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\F004";
  font-size: 20px; }

.ButtonAddToFavouritesEmptyIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F004";
  font-size: 20px; }

.ButtonAddToFavouritesBig::after {
  font-size: 30px; }

.ButtonAddToFavouritesBig::after {
  font-size: 30px; }

.AnimatedExpanderContainer {
  display: flex;
  flex-direction: row;
  align-items: center;
  transition: opacity .3s;
  padding: 5px;
  opacity: 1;
  border: none;
  background: none;
  cursor: pointer;
  outline: none;
  margin: 0; }
  .AnimatedExpanderContainer:hover {
    opacity: .7; }
  .AnimatedExpanderContainer:focus {
    opacity: .7; }
  .AnimatedExpanderContainer p {
    font-size: 10px;
    margin: 0;
    font-weight: 600; }
  .AnimatedExpanderContainer svg {
    transform: scale(0.8); }

.AnimatedExpanderContainerDictionary {
  opacity: .7; }
  .AnimatedExpanderContainerDictionary:hover {
    opacity: .5; }
  .AnimatedExpanderContainerDictionary:focus {
    opacity: .5; }

.ButtonCloseContainer {
  border: none;
  background-color: transparent; }
  .ButtonCloseContainer:hover {
    cursor: pointer; }

.ButtonDeleteAnimatedContainer {
  position: relative;
  transition: opacity .3s;
  width: 16px;
  height: 16px;
  overflow: hidden;
  opacity: .7;
  cursor: pointer;
  padding: 0;
  border: none;
  background: none; }
  .ButtonDeleteAnimatedContainer:hover {
    opacity: 1; }
  .ButtonDeleteAnimatedContainer-Big {
    width: 22px;
    height: 22px; }
  .ButtonDeleteAnimatedContainer-Loading {
    cursor: progress; }

.ButtonDeleteAnimatedLoader {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: opacity .3s;
  opacity: 0; }
  .ButtonDeleteAnimatedLoader-Visible {
    opacity: 1; }

.ButtonDeleteAnimatedIcon {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: opacity .3s;
  opacity: 1; }
  .ButtonDeleteAnimatedIcon-Hidden {
    opacity: 0; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ButtonFavouritesContainer {
  border: none;
  background-color: transparent;
  position: relative;
  cursor: pointer;
  outline: none;
  opacity: 1;
  transition: opacity .3s;
  padding: 0;
  width: 24px;
  height: 24px; }

.ButtonFavouritesIndicator {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 16px;
  height: 16px;
  top: -5px;
  right: -10px;
  font-size: 12px;
  border-radius: 50%;
  background-color: #CE0000;
  color: #fff;
  display: none; }
  .ButtonFavouritesIndicator-Visible {
    display: flex; }

.ButtonFavouritesFavIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F004";
  font-size: 24px;
  color: var(--header-font-color);
  transition: .2s; }

.ButtonFavouritesFavIcon:hover::after {
  color: var(--navbar-hf-color); }

.ButtonAccountContainer {
  border: none;
  background-color: transparent;
  padding: 0;
  cursor: pointer;
  outline: none;
  opacity: .6;
  transition: all .3s;
  width: 24px;
  height: 24px; }
  .ButtonAccountContainer:focus {
    opacity: 1; }
  .ButtonAccountContainer:hover {
    opacity: 1; }

.ButtonHamburgerContainer {
  cursor: pointer;
  padding: 7px 0 0;
  transform: scale(0.7);
  outline: none;
  opacity: .8;
  transition-duration: .3s, .3s;
  transition-property: transform, opacity; }
  .ButtonHamburgerContainer:hover, .ButtonHamburgerContainer:focus {
    opacity: 1; }
  .ButtonHamburgerContainer .hamburger-inner,
  .ButtonHamburgerContainer .hamburger-inner::before,
  .ButtonHamburgerContainer .hamburger-inner::after,
  .ButtonHamburgerContainer.hamburger.is-active .hamburger-inner::before,
  .ButtonHamburgerContainer.hamburger.is-active .hamburger-inner::after {
    background-color: var(--header-font-color); }

.ButtonMobileAccountContainer {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  background: none;
  outline: none;
  border: none;
  cursor: pointer;
  padding: 10px; }
  .ButtonMobileAccountContainer svg {
    transition: all .3s; }
  .ButtonMobileAccountContainer:focus .ButtonMobileAccountLabel {
    opacity: 1; }
  .ButtonMobileAccountContainer:hover svg, .ButtonMobileAccountContainer:focus svg {
    transform: scale(1.2); }
  .ButtonMobileAccountContainer:hover .ButtonMobileAccountLabel, .ButtonMobileAccountContainer:focus .ButtonMobileAccountLabel {
    opacity: 1; }

.ButtonMobileAccountLabel {
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 0 20px;
  opacity: .7;
  transition: opacity .3s; }

.ButtonMobileCurrencyContainer {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  background: none;
  outline: none;
  border: none;
  cursor: pointer;
  padding: 10px; }
  .ButtonMobileCurrencyContainer:focus .ButtonMobileCurrencyLabel {
    opacity: 1; }
  .ButtonMobileCurrencyContainer:hover .ButtonMobileCurrencyLabel {
    opacity: 1; }
  .ButtonMobileCurrencyContainer:hover .ButtonMobileCurrencyPickerItemFlag {
    transform: scale(1.2); }

.ButtonMobileCurrencyLabel {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
  opacity: .7;
  transition: opacity .3s; }

.ButtonMobileCurrencyIcon {
  font-size: 16px;
  width: 24px;
  height: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 10px 0 0; }

.ButtonMobileFavouritesContainer {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  background: none;
  outline: none;
  border: none;
  cursor: pointer;
  padding: 10px; }
  .ButtonMobileFavouritesContainer:focus .ButtonMobileFavouritesLabel {
    opacity: 1; }
  .ButtonMobileFavouritesContainer:hover .ButtonMobileFavouritesLabel {
    opacity: 1; }
  .ButtonMobileFavouritesContainer:hover .ButtonMobileFavouritesPickerItemFlag {
    transform: scale(1.2); }

.ButtonMobileFavouritesLabel {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
  opacity: .7;
  transition: opacity .3s; }

.ButtonMobileFavouritesIcon {
  font-size: 16px;
  width: 24px;
  height: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 10px 0 0; }

.ButtonMobileLanguageContainer {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  background: none;
  outline: none;
  border: none;
  cursor: pointer;
  padding: 10px; }
  .ButtonMobileLanguageContainer:focus .ButtonMobileLanguageLabel {
    opacity: 1; }
  .ButtonMobileLanguageContainer:hover .ButtonMobileLanguageLabel {
    opacity: 1; }
  .ButtonMobileLanguageContainer:hover .ButtonMobileLanguagePickerItemFlag {
    transform: scale(1.2); }

.ButtonMobileLanguageLabel {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
  opacity: .7;
  transition: opacity .3s; }

.ButtonMobileLanguagePickerItemFlag {
  font-size: 24px;
  width: 24px;
  height: 18px;
  margin: 0 10px 0 0;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  transition: all .3s; }

.ButtonSearchContainer {
  cursor: pointer;
  outline: none;
  opacity: 1;
  transition-duration: .3s, .3s;
  transition-property: opacity, transfrom;
  padding: 0 10px;
  border: none;
  background: none;
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 11px; }
  @media screen and (max-width: 1024px) {
    .ButtonSearchContainer {
      padding: 0; } }
  .ButtonSearchContainer svg {
    transform: scale(1.3);
    color: black;
    transition: transform .3s;
    cursor: pointer;
    margin-top: 2px; }

.ButtonSearchSearchIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F002";
  font-size: 24px;
  color: var(--header-font-color);
  transition: .2s; }

.ButtonSearchSearchIcon:hover::after {
  color: var(--navbar-hf-color); }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ButtonShoppingCartContainer {
  border: none;
  background-color: transparent;
  position: relative;
  padding: 0;
  cursor: pointer;
  outline: none;
  opacity: 1;
  transition: all .3s;
  width: 24px;
  height: 24px; }

.ButtonShoppingCartIndicator {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 16px;
  height: 16px;
  top: -5px;
  right: -10px;
  font-size: 12px;
  border-radius: 50%;
  background-color: #CE0000;
  color: #fff;
  display: none; }
  .ButtonShoppingCartIndicator-Visible {
    display: flex; }

.ButtonShoppingCartCartIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F07A";
  font-size: 24px;
  color: var(--header-font-color);
  transition: .2s; }

.ButtonShoppingCartCartIcon:hover::after {
  color: var(--navbar-hf-color); }

.ButtonPaymentMethodContainer {
  width: 100%;
  min-width: 140px;
  height: 100px;
  background-color: white;
  border: 2px solid rgba(0, 0, 0, 0.2);
  transition: all .3s;
  padding: 0;
  cursor: pointer; }
  .ButtonPaymentMethodContainer:hover {
    box-shadow: 0 0 10px silver; }
  @media screen and (min-width: 768px) {
    .ButtonPaymentMethodContainer {
      min-width: 200px;
      height: 135px; } }
  .ButtonPaymentMethodContainer-Selected {
    border: 2px solid black; }

.ButtonPaymentMethodContainer {
  width: 100%;
  min-width: 140px;
  height: 100px;
  background-color: white;
  border: 2px solid rgba(0, 0, 0, 0.2);
  transition: all .3s;
  padding: 0;
  cursor: pointer; }
  .ButtonPaymentMethodContainer:hover {
    box-shadow: 0 0 10px silver; }
  @media screen and (min-width: 768px) {
    .ButtonPaymentMethodContainer {
      min-width: 200px;
      height: 135px; } }
  .ButtonPaymentMethodContainer-Selected {
    border: 2px solid black; }

.ButtonPaymentMethodCustomContainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%; }

.ButtonPaymentMethodCustomLabel {
  font-size: 12px;
  font-weight: 600; }
  @media screen and (min-width: 1024px) {
    .ButtonPaymentMethodCustomLabel {
      font-size: 14px; } }

.ButtonPaymentMethodContainer {
  width: 100%;
  min-width: 140px;
  height: 100px;
  background-color: white;
  border: 2px solid rgba(0, 0, 0, 0.2);
  transition: all .3s;
  padding: 0;
  cursor: pointer; }
  .ButtonPaymentMethodContainer:hover {
    box-shadow: 0 0 10px silver; }
  @media screen and (min-width: 768px) {
    .ButtonPaymentMethodContainer {
      min-width: 200px;
      height: 135px; } }
  .ButtonPaymentMethodContainer-Selected {
    border: 2px solid black; }

.ButtonPaymentMethodThirdPartyContainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%; }

.ButtonPaymentMethodThirdPartyImage {
  max-width: 120px;
  max-height: 80px;
  height: auto; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ButtonsProfileAnimatedButton {
  background-color: #fff;
  color: black;
  border: 2px solid black;
  padding: 20px 30px;
  transition: .3s;
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  text-transform: uppercase;
  z-index: 1; }
  .ButtonsProfileAnimatedButton:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: black;
    transform: translateX(-100%);
    transition: .2s;
    z-index: -2; }
  .ButtonsProfileAnimatedButton:hover {
    cursor: pointer;
    color: #fff;
    border: 2px solid black; }
    .ButtonsProfileAnimatedButton:hover:after {
      transform: translateX(0); }

.ButtonsProfileAnimatedIcon {
  margin-right: 10px; }

.ButtonsSelectorContainer {
  font-size: 14px;
  font-weight: 400;
  background-color: unset;
  border: none;
  cursor: pointer;
  height: 100%;
  outline: none;
  border: 1px solid rgba(0, 0, 0, 0.3);
  padding: 5px 10px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-right: 10px; }
  .ButtonsSelectorContainer:hover .ButtonsSelectorLabel, .ButtonsSelectorContainer:hover .ButtonsSelectorIcon, .ButtonsSelectorContainer:focus .ButtonsSelectorLabel, .ButtonsSelectorContainer:focus .ButtonsSelectorIcon {
    opacity: 1; }

.ButtonsSelectorLabel {
  opacity: .6;
  transition: all .3s;
  font-size: 12px;
  margin: 0 10px 0 0; }

.ButtonsSelectorIcon {
  opacity: .6;
  transition: all .3s; }

.ButtonSimpleAnimatedContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 100%;
  height: 50px;
  border: 2px solid var(--main-color);
  transition: background .3s;
  overflow: hidden;
  border-color: var(--main-color);
  cursor: pointer;
  background-color: var(--main-color); }
  .ButtonSimpleAnimatedContainer:disabled {
    border-color: gray; }
    .ButtonSimpleAnimatedContainer:disabled .ButtonSimpleAnimatedContent.ButtonSimpleAnimatedContent-Outlined {
      color: gray; }
  .ButtonSimpleAnimatedContainer:hover {
    background-color: white; }
    .ButtonSimpleAnimatedContainer:hover .ButtonSimpleAnimatedContent {
      color: var(--main-color); }
  .ButtonSimpleAnimatedContainer-Outlined {
    background-color: white; }
    .ButtonSimpleAnimatedContainer-Outlined:hover {
      background-color: var(--main-color); }
      .ButtonSimpleAnimatedContainer-Outlined:hover .ButtonSimpleAnimatedContent {
        color: white; }
    .ButtonSimpleAnimatedContainer-Outlined:hover:disabled {
      background-color: white; }
  .ButtonSimpleAnimatedContainer-Loading {
    background-color: silver;
    border-color: silver;
    cursor: progress; }

.ButtonSimpleAnimatedContainerNoBorders {
  border-width: 0; }

.ButtonSimpleAnimatedContent {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  font-weight: 600;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  padding: 0 10px;
  color: white;
  transform: translateY(0);
  opacity: 1;
  transition-duration: .5s, .5s, .5s;
  transition-property: color, opacity, transform; }
  .ButtonSimpleAnimatedContent-Outlined {
    color: var(--main-color); }
  .ButtonSimpleAnimatedContent-Loading {
    transform: translateY(100%);
    opacity: 0; }

.ButtonSimpleAnimatedLoader {
  width: 350px;
  opacity: 0;
  transform: scale(3);
  transition-duration: .5s;
  transition-timing-function: ease-in;
  transition-property: opacity, transform; }
  .ButtonSimpleAnimatedLoader-Visible {
    opacity: 1;
    transform: scale(0.8); }

.ButtonSimpleAnimatedTextContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%; }

.ButtonSimpleAnimatedTextLabel {
  font-size: 14px;
  font-weight: 600; }
  @media screen and (max-width: 480px) {
    .ButtonSimpleAnimatedTextLabel {
      font-size: 12px; } }

.ButtonStandardAnimatedContainer, .ButtonStandardAnimatedContainerNoBorders {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 100%;
  height: 50px;
  border: 2px solid var(--main-color);
  transition: background .3s;
  overflow: hidden;
  border-color: var(--main-color);
  cursor: pointer;
  background-color: var(--main-color); }
  .ButtonStandardAnimatedContainer:hover, .ButtonStandardAnimatedContainerNoBorders:hover {
    background-color: white; }
  .ButtonStandardAnimatedContainer-Outlined, .ButtonStandardAnimatedContainerNoBorders-Outlined {
    background-color: white; }
    .ButtonStandardAnimatedContainer-Outlined:hover, .ButtonStandardAnimatedContainerNoBorders-Outlined:hover {
      background-color: var(--main-color); }
  .ButtonStandardAnimatedContainer-Loading, .ButtonStandardAnimatedContainerNoBorders-Loading {
    border-color: silver;
    cursor: progress;
    background-color: silver; }
  .ButtonStandardAnimatedContainer-Success, .ButtonStandardAnimatedContainerNoBorders-Success {
    border-color: var(--main-color); }
  .ButtonStandardAnimatedContainer:disabled, .ButtonStandardAnimatedContainerNoBorders:disabled {
    border: 2px solid #c4c4c4;
    transition: none;
    overflow: hidden;
    border-color: #c4c4c4;
    cursor: pointer;
    background-color: #c4c4c4; }
    .ButtonStandardAnimatedContainer:disabled .ButtonStandardAnimatedContent, .ButtonStandardAnimatedContainerNoBorders:disabled .ButtonStandardAnimatedContent {
      color: white; }
  .ButtonStandardAnimatedContainer[disabled], .ButtonStandardAnimatedContainerNoBorders[disabled] {
    border: 2px solid #c4c4c4;
    transition: none;
    overflow: hidden;
    border-color: #c4c4c4;
    cursor: pointer;
    background-color: #c4c4c4; }
    .ButtonStandardAnimatedContainer[disabled] .ButtonStandardAnimatedContent, .ButtonStandardAnimatedContainerNoBorders[disabled] .ButtonStandardAnimatedContent {
      color: white; }

.ButtonStandardAnimatedContainerNoBorders {
  border-width: 0; }

.ButtonStandardAnimatedContent {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  font-weight: normal;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 0 24px;
  color: white;
  transform: translateY(0);
  opacity: 1;
  transition-duration: .5s, .5s, .5s;
  transition-property: color, transform, opacity; }
  .ButtonStandardAnimatedContent:hover {
    color: var(--main-color); }
  .ButtonStandardAnimatedContent p {
    font-size: 14px;
    font-weight: 500; }
    @media screen and (min-width: 1024px) {
      .ButtonStandardAnimatedContent p {
        font-size: 16px; } }
  .ButtonStandardAnimatedContent-Outlined {
    color: var(--main-color); }
  .ButtonStandardAnimatedContent-Outlined:hover {
    color: white; }
  .ButtonStandardAnimatedContent-Loading, .ButtonStandardAnimatedContent-Success {
    transform: translateY(100%);
    opacity: 0; }
  .ButtonStandardAnimatedContent-Center {
    left: 50%;
    transform: translateX(-50%);
    text-align: center; }
    .ButtonStandardAnimatedContent-Center p {
      margin: 0 auto; }

.ButtonStandardAnimatedSuccess {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  font-weight: 600;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 0 10px;
  color: white;
  background-color: var(--main-color);
  transform: translateY(-100%);
  opacity: 0;
  transition-duration: .5s, .5s;
  transition-property: color, transform; }
  .ButtonStandardAnimatedSuccess:hover {
    color: var(--main-color);
    background-color: white; }
  .ButtonStandardAnimatedSuccess p {
    font-size: 14px; }
    @media screen and (min-width: 1024px) {
      .ButtonStandardAnimatedSuccess p {
        font-size: 16px; } }
  .ButtonStandardAnimatedSuccess-Outlined {
    color: var(--main-color);
    background-color: white; }
  .ButtonStandardAnimatedSuccess-Outlined:hover {
    color: white;
    background-color: var(--main-color); }
  .ButtonStandardAnimatedSuccess-Visible {
    transform: translateY(0);
    opacity: 1; }

.ButtonStandardAnimatedLoader {
  opacity: 0;
  transform: scale(3);
  transition-duration: .5s, .5s;
  transition-property: transform, opacity;
  transition-timing-function: ease-in; }
  .ButtonStandardAnimatedLoader-Visible {
    opacity: 1;
    transform: scale(0.8); }

.ButtonStandardAnimatedCenterText {
  display: flex;
  justify-content: center; }

.ButtonVisibilityContainer {
  border: none;
  background-color: transparent; }
  .ButtonVisibilityContainer:hover {
    cursor: pointer; }

.ButtonVisibilityVisibilityOutlined::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F06E"; }

.ButtonVisibilityVisibilityOffOutlined::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F070"; }

.AnimatedBanner {
  height: 100%;
  width: 100%;
  max-height: 100%;
  margin: auto;
  background-size: cover !important;
  background-position: center !important;
  position: relative; }

.AnimatedBannerContent {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: 0px auto;
  width: 100%;
  height: 100%;
  z-index: 100; }

.HeroCarouselItemContainer {
  height: 100%;
  width: 100%;
  max-height: 100%;
  max-width: 100%;
  margin: auto;
  background-size: cover !important;
  background-position: center !important;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  position: relative; }

.HeroCarouselItemContent {
  margin: 50px auto;
  width: 100%;
  max-width: 100%;
  height: 100%;
  position: relative;
  z-index: 100; }

.HeroCarouselItemButton {
  position: absolute;
  max-width: 300px; }

.HeroCarouselItemPointer {
  cursor: pointer; }

.HeroCarouselItemButtonPositionLeftTop {
  left: 100px;
  top: 0; }

.HeroCarouselItemButtonPositionLeftCenter {
  left: 100px;
  top: 50%;
  transform: translateY(-50%); }

.HeroCarouselItemButtonPositionLeftBottom {
  left: 100px;
  bottom: 0; }

.HeroCarouselItemButtonPositionCenterTop {
  left: 50%;
  transform: translateX(-50%);
  top: 0; }

.HeroCarouselItemButtonPositionCenterCenter {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); }

.HeroCarouselItemButtonPositionCenterBottom {
  left: 50%;
  transform: translateX(-50%);
  bottom: 30px; }

.HeroCarouselItemButtonPositionRightTop {
  right: 100px;
  top: 0; }

.HeroCarouselItemButtonPositionRightCenter {
  right: 100px;
  top: 50%;
  transform: translateY(-50%); }

.HeroCarouselItemButtonPositionRightBottom {
  right: 100px;
  bottom: 0; }

.ImageModalCarouselItemContainer {
  height: 70vh;
  max-height: 100%;
  width: 100%;
  margin: 0 auto;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative; }

.LandingPageManufacturerCarouselItemSectionContainer {
  width: 100%;
  height: 300px;
  position: relative;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center; }
  @media screen and (max-width: 768px) {
    .LandingPageManufacturerCarouselItemSectionContainer {
      height: 100px; } }

.LandingPageManufacturerCarouselItemSectionLogo {
  filter: grayscale(100%);
  opacity: .5; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.PromoBarCarouselItemContainer {
  height: 45px;
  max-height: 45px;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: black;
  padding: 5px;
  color: #fff;
  position: relative;
  z-index: 1;
  overflow: hidden;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis; }

.CartArticleDetailsContainer {
  display: flex;
  flex-direction: column;
  height: 100%;
  margin-right: 20px; }

.CartArticleDiscountContainer {
  display: flex;
  flex-direction: column;
  align-self: start; }

.CartArticleDiscountRow {
  display: flex;
  flex-direction: row;
  align-items: flex-end; }

.CartArticleDiscountCodeRow {
  display: flex; }
  @media screen and (min-width: 600px) {
    .CartArticleDiscountCodeRow {
      flex-direction: row; } }

.CartArticleDiscountKey {
  font-size: 14px;
  opacity: 0.6;
  margin-right: 5px;
  white-space: nowrap; }

.CartArticleDiscountDiscount {
  font-weight: 600; }

.CartArticleNameValueContainer {
  display: flex;
  flex-direction: row;
  align-items: flex-end; }

.CartArticleNameValueKey {
  font-size: 14px;
  opacity: 0.6;
  margin-right: 5px;
  white-space: nowrap; }

.CartArticlePriceContainer {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  line-height: unset;
  font-size: 18px; }
  .CartArticlePriceContainer-Column {
    flex-direction: column;
    align-items: row; }

.CartArticlePriceOldPrice {
  text-decoration: line-through;
  opacity: 0.6; }
  .CartArticlePriceOldPrice-Column {
    margin-right: 5px; }

.CartArticlePriceCurrentPrice {
  display: flex;
  flex-direction: row; }

.CartArticlePriceCurrentPriceCurrency {
  margin-right: 5px; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.CartDetailedViewContainer {
  width: 100%;
  /*@media screen and (max-width: map-get($breakpoints, tablet)) {
      padding: 1em;
    }*/ }

.CartDetailedViewItemWrapper {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  width: 100%; }
  @media screen and (max-width: 768px) {
    .CartDetailedViewItemWrapper {
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: flex-start;
      height: auto; } }

.CartDetailedViewImage {
  height: 280px;
  min-width: 180px;
  margin: 0 25px 0 0;
  cursor: pointer;
  border: none;
  position: relative; }
  @media screen and (max-width: 768px) {
    .CartDetailedViewImage {
      margin: 0;
      align-self: center; } }

.CartDetailedViewItemControls {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  height: 100%;
  margin: 0;
  width: 100%;
  overflow: hidden; }
  @media screen and (max-width: 1920px) {
    .CartDetailedViewItemControls {
      flex-direction: column; } }
  @media screen and (max-width: 1440px) {
    .CartDetailedViewItemControls {
      flex-direction: row; } }
  @media screen and (max-width: 768px) {
    .CartDetailedViewItemControls {
      flex-direction: column; } }

.CartDetailedViewItemControlsLeft {
  max-width: 50%; }
  @media screen and (max-width: 1920px) {
    .CartDetailedViewItemControlsLeft {
      max-width: 100%;
      width: 100%; } }
  @media screen and (max-width: 1440px) {
    .CartDetailedViewItemControlsLeft {
      max-width: 50%; } }
  @media screen and (max-width: 1024px) {
    .CartDetailedViewItemControlsLeft {
      padding: 0 0 15px 0;
      max-width: 100%;
      width: 100%; } }

.CartDetailedViewItemControlsRight {
  min-width: 250px;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap; }
  .CartDetailedViewItemControlsRight > div {
    display: flex;
    flex-direction: row; }
    @media screen and (max-width: 1024px) {
      .CartDetailedViewItemControlsRight > div {
        padding-right: 10px; } }
  @media screen and (max-width: 1920px) {
    .CartDetailedViewItemControlsRight {
      max-width: 100%;
      align-self: flex-end; } }
  @media screen and (max-width: 1440px) {
    .CartDetailedViewItemControlsRight {
      max-width: 100%; } }
  @media screen and (max-width: 1024px) {
    .CartDetailedViewItemControlsRight {
      max-width: 50%; } }

.CartDetailedViewList {
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%; }

.CartDetailedViewItem {
  width: 100%;
  position: relative;
  padding: 15px 0 15px 0;
  border-bottom: 1px solid #C4C4C4; }
  @media screen and (max-width: 768px) {
    .CartDetailedViewItem {
      padding: 15px 0 15px 0; } }
  @media screen and (max-width: 375px) {
    .CartDetailedViewItem {
      padding: 5px 0 5px 0; } }

.CartDetailedViewItemTop {
  width: 80%; }

.CartDetailedViewItemTopHeader {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  margin: 0 0 10px; }

.CartDetailedViewItemTopHeaderName {
  font-size: 14px;
  max-width: 55vw;
  overflow: hidden;
  margin: 8px 0 12px;
  font-weight: 300;
  cursor: pointer; }
  @media screen and (max-width: 768px) {
    .CartDetailedViewItemTopHeaderName {
      max-width: 95vw; } }
  @media screen and (max-width: 1920px) {
    .CartDetailedViewItemTopHeaderName {
      font-size: 18px; } }

.CartDetailedViewItemTopQuantitySelector {
  height: 36px;
  width: 75px; }

.CartDetailedViewItemTopQuantityLabel {
  font-size: 14px;
  opacity: .8;
  margin-right: 10px; }

.CartDetailedViewItemTopQuantityValue {
  font-size: 14px; }

.CartDetailedViewItemBottom {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%; }
  @media screen and (min-width: 1024px) {
    .CartDetailedViewItemBottom {
      justify-content: flex-end; } }

.CartDetailedViewItemBottomPrice {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end; }
  @media screen and (min-width: 1024px) {
    .CartDetailedViewItemBottomPrice {
      flex-direction: row;
      align-items: center; } }
  @media screen and (max-width: 1024px) {
    .CartDetailedViewItemBottomPrice {
      flex-basis: 100%; }
      .CartDetailedViewItemBottomPrice .PriceWrapper {
        margin-top: 24px; } }
  @media screen and (max-width: 375px) {
    .CartDetailedViewItemBottomPrice .PriceWrapper {
      margin-top: 10px; } }

.CartDetailedViewItemBottomDiscount {
  display: flex;
  flex-direction: row;
  justify-content: end;
  align-items: flex-end;
  font-size: 11px;
  font-style: italic;
  gap: 0.5em; }
  .CartDetailedViewItemBottomDiscount b {
    font-weight: 500; }
  @media screen and (max-width: 1024px) {
    .CartDetailedViewItemBottomDiscount {
      flex-basis: 100%; } }

.CartDetailedViewItemBottomPriceOld {
  display: none;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.6);
  text-decoration: line-through; }
  .CartDetailedViewItemBottomPriceOld-Visible {
    display: initial; }
    @media screen and (min-width: 1024px) {
      .CartDetailedViewItemBottomPriceOld-Visible {
        margin: 0 10px 0 0; } }

.CartDetailedViewItemBottomButtonsDesktop {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  margin-top: 30px; }
  @media screen and (max-width: 1920px) {
    .CartDetailedViewItemBottomButtonsDesktop {
      margin-top: 16px; } }
  .CartDetailedViewItemBottomButtonsDesktop button {
    background-color: transparent;
    border: none;
    color: #BBBBBB;
    font-weight: 300;
    font-size: 12px;
    padding: 5px 10px;
    cursor: pointer;
    text-align: left;
    align-items: center;
    display: flex; }
    .CartDetailedViewItemBottomButtonsDesktop button i {
      float: left; }
  .CartDetailedViewItemBottomButtonsDesktop button:first-of-type {
    border-right: 1px solid #BBBBBB;
    padding-left: 0; }
  @media screen and (max-width: 1024px) {
    .CartDetailedViewItemBottomButtonsDesktop {
      margin-top: 16px; } }

.CartDetailedViewItemBottomButtonMobile {
  display: initial; }
  @media screen and (min-width: 1024px) {
    .CartDetailedViewItemBottomButtonMobile {
      display: none; } }

.CartDetailedViewItemDivider {
  position: absolute;
  bottom: -10px;
  left: 5%;
  width: 90%;
  height: 1px;
  background-color: #F3F3F3; }
  .CartDetailedViewItemDivider-Hidden {
    display: none; }

.CartDetailedViewButton {
  border: none;
  outline: none;
  background: none;
  text-decoration: underline;
  font-size: 12px;
  opacity: .7;
  cursor: pointer;
  padding: 0; }

.CartDetailedViewButtonDivider {
  margin: 0 5px; }

.CartDetailedViewPlaceholder {
  width: 100%;
  text-align: center;
  margin: 40px 0; }

.CartDetailedViewHeader {
  font-size: 18px;
  margin-bottom: 24px; }
  .CartDetailedViewHeader a {
    color: black;
    text-decoration: none; }
  @media screen and (max-width: 768px) {
    .CartDetailedViewHeader {
      margin-bottom: 1em; } }

.CartDetailedViewItemManufacturer {
  font-size: 12px;
  font-weight: 300; }

.CartDetailedViewItemFeature {
  font-size: 12px;
  font-weight: 300;
  margin-top: 5px; }

.CartDetailedViewRemove::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F1F8";
  margin-right: 7px;
  font-size: 16px; }

.CartDetailedViewMoveToFavourites::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F004";
  margin-right: 7px;
  font-size: 16px; }

.CartDetailedViewMoveToFavourites.CartDetailedViewIsToFavourites::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\F004"; }

.CartDetailedViewAllButtons {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  margin-top: 24px; }
  .CartDetailedViewAllButtons button {
    background-color: transparent;
    border: none;
    color: #BBBBBB;
    font-weight: 300;
    font-size: 12px;
    padding: 5px 10px;
    cursor: pointer;
    text-align: left;
    align-items: center;
    display: flex; }
    .CartDetailedViewAllButtons button i {
      float: left; }
  .CartDetailedViewAllButtons button:first-of-type {
    border-right: 1px solid #BBBBBB;
    padding-left: 0; }
  @media screen and (max-width: 768px) {
    .CartDetailedViewAllButtons {
      margin-bottom: 24px; } }

.CartItemsListItem {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 160px; }

.CartItemsListImage {
  height: 140px;
  min-width: 90px;
  margin: 0 10px;
  cursor: pointer;
  border: none;
  box-shadow: rgba(0, 0, 0, 0.15) 0 1px 3px 1px;
  position: relative;
  background: none; }

.CartItemsListDescription {
  max-height: 140px;
  height: 100%;
  margin: 10px;
  width: 220px; }

.CartItemsListDescriptionName {
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: 16px;
  letter-spacing: 0em;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer; }

.CartItemsListDescriptionPrice {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  font-size: 14px; }
  .CartItemsListDescriptionPrice .PriceValueRegular,
  .CartItemsListDescriptionPrice .PriceValuePromotion {
    font-size: 14px; }
  .CartItemsListDescriptionPrice .PricePromotionDate {
    display: none; }
  .CartItemsListDescriptionPrice .PriceDiscountPercentage {
    display: none; }

.CartItemsListDescriptionQuantityLabel {
  font-family: Roboto;
  font-size: 12px;
  font-style: normal;
  font-weight: 300;
  line-height: 14px;
  letter-spacing: 0em;
  text-align: left;
  opacity: .8;
  margin-right: 5px; }

.CartItemsListDescriptionQuantityValue {
  font-size: 14px; }

.CartItemsListDescriptionControls {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  margin-top: auto; }

.CartItemsListDescriptionControlsRemove {
  border: none;
  outline: none;
  background: none;
  font-size: 12px;
  opacity: .7;
  cursor: pointer;
  padding: 0; }

.CartPreviewContainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  position: relative; }

.CartPreviewCartControl {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  font-weight: 500;
  background-color: unset;
  border: none;
  cursor: pointer;
  height: 100%;
  width: 100%;
  outline: none; }

.CartPreviewCartWrapper {
  display: none;
  position: absolute;
  top: 60px;
  right: 0;
  width: 350px;
  border: solid 1px rgba(0, 0, 0, 0.15);
  border-top: none;
  background-color: white;
  overflow-y: hidden; }
  @media screen and (min-width: 1024px) {
    .CartPreviewCartWrapper {
      display: initial; } }

.CartPreviewCartCaption {
  font-family: Roboto;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 21px;
  letter-spacing: 0em;
  text-align: left;
  margin: 1em 10px; }

.CartPreviewControls {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  height: 90px;
  padding: 2px 0 0 0; }

.CartPreviewControlsHeader {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: flex-start;
  width: 100%;
  padding: 10px 10px 0; }

.CartPreviewControlsHeaderLabel {
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: 16px;
  letter-spacing: 0em;
  text-align: right;
  margin-right: 10px; }

.CartPreviewControlsHeaderValue {
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: 0em;
  text-align: right; }

.CartItemsListDescriptionControlsRemoveIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F1F8";
  font-size: 14px;
  color: black;
  transition: .2s;
  margin: 0 10px 0 0; }

.CartItemsListDescriptionControlsRemoveIcon:hover::after {
  color: var(--navbar-hf-color); }

.CategoryPickerContainer {
  max-width: var(--globalContainerWidth);
  margin: 0 auto; }
  .CategoryPickerContainer button {
    border: 1px solid #aaa;
    background-color: white;
    color: #aaa;
    font-weight: bold;
    margin-left: 10px;
    margin-top: 10px;
    padding: 10px 20px;
    border-radius: 10px;
    transition: .2s;
    cursor: pointer; }
    @media screen and (max-width: 375px) {
      .CategoryPickerContainer button {
        font-size: 14px; } }
  .CategoryPickerContainer.CategoryPickerActive {
    border-color: black;
    color: black; }
  .CategoryPickerContainer:hover {
    border-color: black;
    color: black; }

.MenusCategoryTreeContainer {
  display: flex;
  flex-direction: column;
  list-style: none;
  padding: 0 0 0 10px;
  margin: 0; }
  @media screen and (max-width: 1024px) {
    .MenusCategoryTreeContainer {
      padding: 8px 10px 8px 20px; } }

.CheckoutProcessEditDeliveryAddressContainer {
  width: 100%;
  margin-bottom: 40px; }

.CheckoutProcessEditDeliveryAddressLabel {
  font-size: 20px;
  font-weight: 600; }

.CheckoutProcessEditDeliveryAddressStyledForm {
  width: 95%;
  margin: 0 auto; }

.CheckoutProcessEditDeliveryAddressInputs {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 20px auto; }

.CheckoutProcessEditDeliveryAddressButtons {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: relative; }
  @media screen and (min-width: 600px) {
    .CheckoutProcessEditDeliveryAddressButtons {
      flex-direction: row-reverse;
      justify-content: space-between; } }

.CheckoutProcessEditDeliveryAddressButton {
  width: 100%; }

.CheckoutProcessEditDeliveryAddressRow {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%; }
  @media screen and (max-width: 600px) {
    .CheckoutProcessEditDeliveryAddressRow {
      display: block; } }

.CheckoutProcessEditDeliveryAddressWideField {
  width: 47.5%; }
  @media screen and (max-width: 600px) {
    .CheckoutProcessEditDeliveryAddressWideField {
      width: 97.5%; } }

.CheckoutProcessEditDeliveryAddressError {
  position: absolute;
  left: 0;
  color: red;
  font-size: 12px; }

.CheckoutProcessEditDeliveryAddressModalContainer {
  width: 800px;
  padding: 50px; }

.CheckoutEmptyCartCardContainer {
  width: 100%;
  margin-bottom: 40px; }

.CheckoutEmptyCartCardDivider {
  width: 100%;
  height: 1px;
  margin-bottom: 10px; }

.CheckoutEmptyCartCardLabel {
  font-size: 20px;
  font-weight: 600; }

.CheckoutEmptyCartCardDetails {
  font-size: 14px;
  margin-bottom: 40px; }

.CheckoutExpandableWrapperContainer {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  background-color: #fff;
  padding: 24px 0px; }
  @media screen and (max-width: 375px) {
    .CheckoutExpandableWrapperContainer {
      padding: 0; } }

.CheckoutExpandableWrapperHeader {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 10px 48px;
  background-color: #fff; }
  @media screen and (max-width: 1440px) {
    .CheckoutExpandableWrapperHeader {
      padding: 10px 16px; } }
  @media screen and (max-width: 375px) {
    .CheckoutExpandableWrapperHeader {
      padding: 0 16px; } }

.CheckoutExpandableWrapperHeaderLabel {
  font-size: 16px;
  font-weight: 600; }

.CheckoutExpandableWrapperButton {
  display: none; }
  .CheckoutExpandableWrapperButton-Visible {
    display: initial; }

.CheckoutExpandableWrapperButtonIcon {
  opacity: .6;
  font-size: 14px;
  transition: transform ease-in .1s;
  transform: rotate(0); }
  .CheckoutExpandableWrapperButtonIcon-Expanded {
    transform: rotate(90deg); }

.CheckoutExpandableWrapperContent {
  border-top: unset;
  width: 100%; }

.OrderSummaryAfterPaymentContainer {
  display: flex;
  padding: 50px;
  min-height: 100vh;
  flex-wrap: wrap; }

.OrderSummaryAfterPaymentParagraph {
  margin: 23px 0 110px;
  font-size: 18px; }
  @media screen and (max-width: 1200px) {
    .OrderSummaryAfterPaymentParagraph {
      margin-bottom: 40px; } }

.OrderSummaryAfterPaymentImage {
  width: 50%;
  position: relative;
  min-height: 50vh; }
  @media screen and (max-width: 1200px) {
    .OrderSummaryAfterPaymentImage {
      width: 100%; } }

.OrderSummaryAfterPaymentContent {
  width: 50%;
  padding-left: 100px; }
  @media screen and (max-width: 1200px) {
    .OrderSummaryAfterPaymentContent {
      width: 100%;
      padding-left: 20px; } }

.OrderSummaryAfterPaymentHeader {
  font-weight: 500;
  font-size: 36px; }
  @media screen and (max-width: 1200px) {
    .OrderSummaryAfterPaymentHeader {
      font-size: 26px; } }

.OrderSummaryAfterPaymentButton {
  max-width: 370px; }

.CheckoutProcessPaymentSelectionContainer {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between; }

.CheckoutProcessPaymentSelectionDividier {
  width: 100%;
  height: 1px;
  margin-bottom: 10px; }

.CheckoutProcessPaymentSelectionLabel {
  margin-top: 0; }

.CheckoutProcessPaymentSelectionMethods {
  position: relative; }

.CheckoutProcessPaymentSelectionError {
  position: absolute;
  bottom: -10px;
  font-size: 16px;
  left: 10px;
  color: red; }

.CheckoutProcessPaymentSelectionPaymentMethodsContainer {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
  justify-content: left;
  padding: 0; }
  .CheckoutProcessPaymentSelectionPaymentMethodsContainer:last-child {
    margin-right: 0 !important; }

.CheckoutProcessPaymentSelectionPaymentMethodsListItem {
  padding: 10px;
  flex-basis: 50%; }
  @media screen and (min-width: 768px) {
    .CheckoutProcessPaymentSelectionPaymentMethodsListItem {
      flex-basis: 33%; } }

.CheckoutSummaryFieldContainer {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding: 48px; }
  @media screen and (max-width: 1440px) {
    .CheckoutSummaryFieldContainer {
      padding: 16px; } }

.CheckoutSummaryFieldHeader {
  width: 100%; }

.CheckoutSummaryFieldSection {
  width: 100%;
  margin-top: 0;
  display: none; }
  .CheckoutSummaryFieldSection-Visible {
    margin-top: 20px;
    display: initial; }

.CheckoutHeaderDiscountsContainer {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  position: relative; }

.CheckoutHeaderDiscountsLabel {
  font-weight: 600;
  font-size: 14px;
  display: none; }
  .CheckoutHeaderDiscountsLabel-Visible {
    display: initial; }

.CheckoutHeaderDiscountsList {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding: 0; }

.CheckoutHeaderDiscountsItem {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  position: relative; }

.CheckoutHeaderDiscountsItemLabel {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;
  max-width: 60%; }

.CheckoutHeaderDiscountsItemLabelName {
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 16px;
  font-weight: normal; }

.CheckoutHeaderDiscountsItemLabelCode {
  font-size: 12px;
  opacity: .4;
  margin-left: 5px;
  text-overflow: ellipsis; }

.CheckoutHeaderDiscountsItemControls {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center; }

.CheckoutHeaderDiscountsItemControlsValue {
  font-size: 16px;
  font-weight: 600;
  color: var(--main-color); }

.CheckoutHeaderDiscountsLabelInputs {
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 5px;
  margin-top: 30px; }

.CheckoutHeaderDiscountsControls {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 20px;
  width: 100%;
  position: relative; }

.CheckoutHeaderDiscountsControlsError {
  position: absolute;
  color: red;
  font-size: 10px;
  width: 100%;
  text-align: center;
  display: none;
  bottom: -20px; }
  .CheckoutHeaderDiscountsControlsError-Visible {
    display: initial; }

.CheckoutHeaderDiscountsControlsInner {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: center;
  align-items: center; }

.CheckoutHeaderDiscountsControlsInnerButton {
  width: 100%;
  flex: 1;
  display: initial;
  margin-top: 10px;
  margin-left: 5px;
  max-width: 150px; }
  .CheckoutHeaderDiscountsControlsInnerButton-Hidden {
    display: none; }
  .CheckoutHeaderDiscountsControlsInnerButton .ButtonStandardAnimatedContainer {
    height: 40px; }

.CheckoutHeaderDiscountsControlsInnerInput {
  width: 100%;
  flex: 1;
  margin: 0 5px 0 0; }

.CheckoutHeaderDiscountsXItem::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F00D";
  margin-right: 5px; }

.CheckoutHeaderDiscountsRemove {
  display: flex;
  background-color: #fff;
  border: none;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  font-size: 12px;
  margin-right: 20px;
  margin-left: 0;
  padding-left: 0; }

.CheckoutSummaryFieldHeaderContainer {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%; }

.CheckoutSummaryFieldHeaderRow {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 16px;
  width: 100%; }

.CheckoutSummaryFieldHeaderRowLabel {
  font-weight: 300;
  font-size: 16px; }
  @media screen and (max-width: 375px) {
    .CheckoutSummaryFieldHeaderRowLabel {
      font-size: 14px; } }

.CheckoutSummaryFieldHeaderRowValue {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  font-weight: 500;
  font-size: 16px; }
  @media screen and (max-width: 375px) {
    .CheckoutSummaryFieldHeaderRowValue {
      font-size: 14px; } }

.CheckoutSummaryFieldHeaderRowValueInitial {
  font-size: 12px;
  opacity: .5;
  text-decoration: line-through;
  display: none;
  margin-right: 5px; }
  .CheckoutSummaryFieldHeaderRowValueInitial-Visible {
    display: initial; }

.CheckoutSummaryFieldHeaderRowValueCurrent {
  text-align: right; }

.CheckoutSummaryFieldHeaderDiscounts {
  width: 100%;
  margin: 20px 0; }

.CheckoutSummaryFieldHeaderComments {
  width: 100%;
  margin: 20px 0; }
  @media screen and (max-width: 375px) {
    .CheckoutSummaryFieldHeaderComments {
      margin: 10px 0 0 0; } }

.CheckoutSummaryFieldHeaderSum {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
  margin-top: 20px; }

.CheckoutSummaryFieldHeaderSumLabel {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end; }

.CheckoutSummaryFieldHeaderSumLabelMain {
  font-size: 18px;
  font-weight: normal; }
  @media screen and (max-width: 375px) {
    .CheckoutSummaryFieldHeaderSumLabelMain {
      font-size: 16px;
      font-weight: bold; } }

.CheckoutSummaryFieldHeaderSumLabelAside {
  display: none;
  font-size: 16px;
  margin-left: 5px;
  font-weight: 300; }
  .CheckoutSummaryFieldHeaderSumLabelAside-Visible {
    display: initial; }

.CheckoutSummaryFieldHeaderSumLabelValue {
  font-size: 24px;
  font-weight: 600; }
  @media screen and (max-width: 375px) {
    .CheckoutSummaryFieldHeaderSumLabelValue {
      font-size: 18px; } }

.CheckoutCommentsContainer {
  width: 100%; }

.CheckoutCommentsLabel {
  font-weight: 600;
  font-size: 14px; }

.CheckoutCommentsControls {
  margin-bottom: 20px;
  width: 100%;
  position: relative; }

.CheckoutCommentsControlsInner {
  width: 100%; }

.CheckoutCommentsControlsInnerInput {
  width: 100%;
  margin: 0 5px 0 0; }

.CheckoutCommentsExpandableContainerHeader {
  display: flex;
  justify-content: space-between;
  padding: 1em 0.2em;
  cursor: pointer;
  border-color: #C4C4C4;
  border-style: solid;
  border-width: 1px 0; }
  .CheckoutCommentsExpandableContainerHeader-Open {
    border-bottom-width: 0; }
  .CheckoutCommentsExpandableContainerHeader > span {
    font-size: 13px; }

.CheckoutCommentsExpandableContainerIcon {
  margin-right: 1em;
  transition: transform ease-in 0.1s; }
  .CheckoutCommentsExpandableContainerIcon-Open {
    transform: rotate(90deg); }

.CheckoutCommentsExpandableContainerContent {
  padding: 0;
  overflow: hidden;
  margin: 0;
  width: 100%; }

.ComparisonBarContainer {
  position: fixed;
  z-index: 999;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  background-color: #fff;
  -webkit-box-shadow: 0px -2px 17px -4px rgba(0, 0, 0, 0.74);
  -moz-box-shadow: 0px -2px 17px -4px rgba(0, 0, 0, 0.74);
  box-shadow: 0px -2px 17px -4px rgba(0, 0, 0, 0.74); }

.ComparisonBarWrapper {
  width: 100%;
  max-width: var(--globalContainerWidth);
  margin: 0 auto;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center; }

.ComparisonBarArticles {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  height: 100%; }
  .ComparisonBarArticles div {
    display: flex;
    justify-content: center;
    align-items: center;
    border: .3px solid #ddd;
    border-radius: 5px;
    margin: 0 3px;
    height: 50px;
    width: 60px;
    cursor: pointer;
    overflow: hidden;
    position: relative; }
    .ComparisonBarArticles div img {
      width: 100%; }
  @media screen and (max-width: 768px) {
    .ComparisonBarArticles {
      display: none; } }

.ComparisonBarShow {
  display: block;
  border: none;
  background-color: black;
  border: 1px solid black;
  color: white;
  font-size: 13px;
  padding: 10px 20px;
  border-radius: 5px;
  cursor: pointer;
  transition: .2s;
  margin-left: 20px; }
  .ComparisonBarShow:hover {
    color: black;
    background-color: white; }

.ComparisonBarInfo {
  position: absolute;
  top: -5px;
  right: -9px;
  background-color: white;
  padding: 3px 5px;
  border: 1px solid black;
  border-radius: 50%;
  color: black; }

.ComparisonBarClear {
  display: block;
  border: none;
  background-color: white;
  border: 1px solid black;
  color: black;
  font-size: 13px;
  padding: 10px 20px;
  border-radius: 5px;
  cursor: pointer;
  transition: .2s;
  margin-left: 5px;
  position: relative; }
  .ComparisonBarClear:hover {
    color: white;
    background-color: black; }
  .ComparisonBarClear:hover > small {
    color: black;
    background-color: white; }

:root {
  --tableColor: #d9dadb; }

.ComparisonTableContainer {
  max-width: var(--globalContainerWidth);
  padding: 20px;
  margin: 0 auto 100px;
  position: relative; }

.ComparisonTableTitle {
  display: table-row;
  width: 100%;
  line-height: 24px;
  font-weight: bold;
  background-color: var(--main-color); }
  .ComparisonTableTitle div {
    padding: 10px;
    font-size: 14px; }

.ComparisonTableHeading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 10px 0; }
  .ComparisonTableHeading a {
    color: black;
    cursor: pointer;
    font-weight: bold;
    text-decoration: none;
    font-size: 14px;
    margin-top: 10px; }
    @media screen and (max-width: 480px) {
      .ComparisonTableHeading a {
        font-size: 0.8rem; } }
  @media screen and (max-width: 480px) {
    .ComparisonTableHeading p {
      font-size: 0.8rem; } }
  @media screen and (max-width: 375px) {
    .ComparisonTableHeading p {
      margin-top: 10px; } }

.ComparisonTableCategory {
  cursor: pointer; }

.ComparisonTableRemove {
  position: absolute;
  right: -10px;
  top: -10px;
  background-color: white;
  border: 1px solid #222;
  cursor: pointer;
  border-radius: 5px; }

.ComparisonTableImage {
  position: relative;
  width: 150px;
  height: 150px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat; }
  @media screen and (max-width: 480px) {
    .ComparisonTableImage {
      width: 100px;
      height: 100px; } }

.ComparisonTableHeader {
  display: flex;
  justify-content: space-between;
  align-items: center; }

.ComparisonTableDifference {
  color: var(--comparisonDifference); }

.ComparisonTableTableHead {
  position: sticky;
  top: 60px;
  z-index: 100;
  overflow-x: auto;
  background-color: white; }

.ComparisonTableScroller,
.ComparisonTableTableBody {
  display: flex;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overflow: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none; }
  .ComparisonTableScroller::-webkit-scrollbar,
  .ComparisonTableTableBody::-webkit-scrollbar {
    display: none; }

.ComparisonTableTableBody {
  flex-direction: column; }

.ComparisonTableTableCell,
.ComparisonTableTableCell-Feature {
  min-width: 250px;
  margin: 0 10px;
  width: 20%;
  max-width: 20%;
  font-size: 14px; }
  @media screen and (max-width: 1024px) {
    .ComparisonTableTableCell,
    .ComparisonTableTableCell-Feature {
      min-width: 200px;
      margin: 0 10px; } }
  @media screen and (max-width: 480px) {
    .ComparisonTableTableCell,
    .ComparisonTableTableCell-Feature {
      min-width: 120px;
      margin: 0 10px; } }
  .ComparisonTableTableCell span,
  .ComparisonTableTableCell-Feature span {
    width: 100%;
    text-align: center; }

.ComparisonTableTableCell-Feature {
  display: flex;
  justify-content: center; }

.ComparisonTableTableRow {
  display: flex;
  width: 100%;
  padding: 15px 0;
  transition: .1s;
  border-bottom: 1px solid var(--tableColor); }
  .ComparisonTableTableRow:hover {
    background-color: var(--tableColor); }

.ComparisonTableScroller {
  height: 100%;
  margin-top: 10px; }

.ComparisonTableArrow {
  position: absolute;
  height: 30px;
  top: calc(50% - (30px / 2)); }
  .ComparisonTableArrow-Left {
    left: 5px; }
  .ComparisonTableArrow-Right {
    right: 5px; }

.ComparisonTableTableContainer {
  box-shadow: 0 0 10px var(--tableColor);
  margin: 10px 0; }
  @media screen and (max-width: 480px) {
    .ComparisonTableTableContainer {
      box-shadow: none; } }

.ComparisonTableTableBodyWrapper {
  display: table;
  width: 100%;
  height: 100%; }

.ContactFormFormContainer {
  display: flex;
  flex-direction: column; }

.ContactFormForm {
  max-width: 1024px;
  margin: 0 auto;
  padding: 20px 20px 60px 20px; }

.ContactFormInputsContainer {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: center;
  align-content: flex-start; }

.ContactFormInput {
  width: 50%;
  padding: 0.5em; }
  @media screen and (max-width: 600px) {
    .ContactFormInput {
      width: 100%;
      padding: 0; } }

.ContactFormTextField {
  width: 100%;
  min-width: 100%;
  padding: 0.5em;
  display: block; }
  @media screen and (max-width: 600px) {
    .ContactFormTextField {
      padding: 0; } }

.ContactFormCheckboxSection {
  display: block;
  padding: 0.5em; }
  @media screen and (max-width: 600px) {
    .ContactFormCheckboxSection {
      padding: 0; } }

.ContactFormSubmitBtn {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  max-width: 500px;
  padding: 0.5em; }
  @media screen and (max-width: 600px) {
    .ContactFormSubmitBtn {
      padding: 0; } }

.ContactFormError {
  position: absolute;
  left: 0;
  color: red;
  font-size: 12px; }

.ContactFormSuccess {
  position: absolute;
  left: 0;
  bottom: -20px;
  color: green;
  font-size: 16px;
  font-weight: bold; }

.CookiesAgreementCotnainer {
  text-align: left;
  margin: 30px 0; }

.CookiesAgreementContent {
  margin: 10px 0 10px 30px; }

.CookiesAgreementLabel {
  font-size: 20px;
  font-weight: bold;
  margin-left: 10px; }
  @media screen and (max-width: 600px) {
    .CookiesAgreementLabel {
      font-size: 16px; } }

.CookiesAgreementButton {
  border: 1px solid black;
  background-color: white;
  padding: 5px 10px;
  cursor: pointer;
  transition: .2s;
  font-size: 14px;
  margin-top: 5px;
  margin-left: 30px; }

.CookiesAgreementsModalBackground {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: rgba(1, 1, 1, 0.3);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10000; }

.CookiesAgreementsModalContent {
  background-color: #fff;
  width: 100%;
  height: 100%;
  max-width: 500px;
  max-height: 90vh;
  padding: 30px;
  display: flex;
  justify-content: initial;
  flex-direction: column;
  text-align: left;
  border: 2px solid black;
  position: relative; }
  @media screen and (max-width: 768px) {
    .CookiesAgreementsModalContent {
      width: 90%; } }

.CookiesAgreementsModalLabel {
  font-size: 20px;
  font-weight: bold;
  margin: 20px 0;
  border-bottom: 2px solid black;
  padding-bottom: 20px; }

.CookiesAgreementsModalButton {
  width: 30px;
  height: 30px;
  margin-left: auto;
  text-align: center;
  font-size: 20px;
  cursor: pointer;
  background-color: transparent;
  border: none;
  position: absolute;
  right: 20px;
  top: 20px; }

.CookiesAgreementsBackground {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: rgba(1, 1, 1, 0.3);
  display: flex;
  align-items: center;
  z-index: 10000;
  overflow-y: initial !important; }

.CookiesAgreementsContent {
  background-color: #fff;
  width: 100%;
  max-width: 500px;
  padding: 0px;
  display: flex;
  flex-direction: column;
  border: 2px solid var(--main-color);
  overflow-y: auto;
  max-height: 100vh;
  margin: 0 auto;
  padding: 30px; }
  .CookiesAgreementsContent::-webkit-scrollbar {
    display: none; }
  .CookiesAgreementsContent {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */ }
  @media screen and (max-width: 600px) {
    .CookiesAgreementsContent {
      width: 90%;
      max-height: 90vh; } }

.CookiesAgreementsButton {
  padding: 10px;
  background-color: black;
  color: white;
  margin: 30px 0 0 30px;
  cursor: pointer;
  text-transform: uppercase;
  font-size: 14px;
  max-width: 40%;
  background-color: var(--main-color);
  border: unset; }
  .CookiesAgreementsButton:disabled {
    cursor: default;
    background-color: #909090; }
  @media screen and (max-width: 600px) {
    .CookiesAgreementsButton {
      max-width: 100%;
      margin: 30px 0 0 0; } }

.CookiesAgreementsLabel {
  font-size: 20px;
  font-weight: bold;
  margin-left: 10px; }
  @media screen and (max-width: 600px) {
    .CookiesAgreementsLabel {
      font-size: 16px; } }

.CookiesAgreementsInput {
  text-align: left;
  margin: 20px 0 0; }

.CookiesAgreementsTitle {
  padding-bottom: 20px;
  width: 100%;
  font-weight: bold;
  font-size: 20px;
  border-bottom: 2px solid black; }

.CookiesAgreementsAlert {
  color: red;
  font-weight: bold;
  display: none; }
  .CookiesAgreementsAlert.Visible {
    display: block; }

.DeliveryTileDeliveryOptionContainer {
  width: 600px;
  opacity: 1 !important;
  display: flex;
  flex-direction: 'row';
  justify-content: 'space-between';
  align-items: 'unset';
  flex-wrap: 'nowrap';
  align-self: 'unset'; }

.DeliveryTileDeliveryOptionWrapper {
  display: flex;
  flex-direction: 'row';
  justify-content: 'unset';
  align-items: 'center';
  flex-wrap: 'nowrap';
  align-self: 'unset'; }

.DeliveryTileDeliveryOptionImg {
  width: 30px;
  height: 15px;
  margin-right: 20px; }

.DeliveryTileContainer, .DeliveryTileList {
  display: flex;
  flex-direction: 'column';
  justify-content: 'unset';
  align-items: 'unset';
  flex-wrap: 'nowrap';
  align-self: 'unset'; }

.DeliveryTileHeader {
  text-transform: uppercase; }

.DeliveryTileCountry {
  margin-bottom: 40px; }

.DeliveryTileOption {
  display: flex;
  flex-direction: 'row';
  justify-content: 'unset';
  align-items: 'center';
  flex-wrap: 'nowrap';
  align-self: 'unset';
  width: 100%;
  border: 1px solid black;
  padding: 20px;
  position: relative;
  margin-bottom: 20px; }

.DeliveryTileImg {
  margin-left: 15px;
  margin-top: 7px;
  margin-bottom: 13px;
  position: absolute;
  left: 170px;
  top: 21px;
  height: 20px;
  width: 20px;
  transition: color 0.2s ease-in;
  transition: fill 0.2s ease-in; }

.DropdownWrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 2px solid rgba(0, 0, 0, 0.15);
  transition: .2s;
  position: relative; }
  .DropdownWrapper-Open {
    border: 3px solid black; }
    .DropdownWrapper-Open .DropdownTitle {
      border-bottom: 2px solid rgba(0, 0, 0, 0.15); }

.DropdownTitle {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  border: none;
  background: transparent;
  font-weight: 700; }

.DropdownTitleLabel {
  padding-right: 10px; }

.DropdownListItemContainer {
  width: 100%;
  border-bottom: 2px solid rgba(0, 0, 0, 0.15); }
  .DropdownListItemContainer:last-child {
    border-bottom: none; }

.DropdownListItem {
  width: 100%;
  outline: none;
  border: none;
  background: none;
  transition: .2s;
  padding: 10px; }
  .DropdownListItem:hover {
    background-color: #ebebeb; }

.DropdownList {
  width: 100%;
  background-color: white;
  max-height: 320px;
  overflow-y: auto;
  overflow-x: hidden; }

.DynamicConfirmationModalContainer {
  padding: 1em; }

.DynamicConfirmationModalHeader {
  padding: 1em; }

.DynamicConfirmationModalCaption {
  padding: 1em; }

.DynamicConfirmationModalButton {
  padding: 0 1em 1em 1em;
  text-align: center; }
  .DynamicConfirmationModalButton button {
    cursor: pointer;
    border: 2px solid black;
    padding: 5px;
    min-width: 100px;
    margin: 5px;
    color: white;
    background-color: black;
    transition: color .2s linear;
    transition: background-color .2s linear; }
    .DynamicConfirmationModalButton button:hover {
      color: black;
      background-color: white;
      transition: color .2s linear;
      transition: background-color .2s linear; }
    .DynamicConfirmationModalButton button:nth-child(1) {
      color: black;
      background-color: white; }
      .DynamicConfirmationModalButton button:nth-child(1):hover {
        color: white;
        background-color: black; }

.DynamicErrorModalContainer {
  padding: 20px;
  background-color: var(--main-color); }

.DynamicErrorModalCaption {
  margin-top: 30px;
  margin-bottom: 30px;
  padding: 0em;
  color: white; }

.DynamicErrorModalButton {
  margin-top: 10px;
  text-align: center; }
  .DynamicErrorModalButton button {
    cursor: pointer;
    border: 2px solid white;
    padding: 10px;
    color: white;
    background-color: transparent;
    transition: color .2s linear;
    transition: background-color .2s linear; }
    .DynamicErrorModalButton button:hover {
      color: white;
      border: 2px solid black;
      background-color: black;
      transition: color .2s linear;
      transition: background-color .2s linear; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ErrorContainerContainer {
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center; }

.ErrorContainerWrapper {
  display: flex;
  flex-direction: column;
  justify-content: center; }
  @media screen and (min-width: 1024px) {
    .ErrorContainerWrapper {
      flex-direction: row; } }

.ErrorContainerRightSide {
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 20px;
  margin-top: 20px; }
  @media screen and (min-width: 1024px) {
    .ErrorContainerRightSide {
      margin-top: 0; } }

.ErrorContainerHeading {
  font-size: 100px;
  font-weight: bold;
  margin-right: 20px;
  border-bottom: 3px solid black;
  padding-bottom: 10px; }
  @media screen and (min-width: 1024px) {
    .ErrorContainerHeading {
      margin-top: 0;
      border-right: 3px solid black;
      border-bottom: none;
      padding-right: 20px;
      padding-bottom: 0; } }

.ErrorContainerButton {
  background-color: transparent;
  font-weight: bold;
  text-transform: uppercase;
  text-align: left;
  margin-top: 20px;
  font-size: 12px;
  border: none;
  padding: 0;
  transition: .2s; }
  .ErrorContainerButton:hover {
    cursor: pointer;
    color: #CE0000; }

.ComponentsFooterBottomMenuContainer {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  max-width: var(--globalContainerWidth); }

.ComponentsFooterBottomMenuPositionContainer {
  display: flex;
  flex-wrap: wrap; }
  @media screen and (max-width: 768px) {
    .ComponentsFooterBottomMenuPositionContainer {
      flex-flow: column wrap-reverse; } }

.ComponentsFooterBottomMenuPositionContainer > .ComponentsFooterBottomMenuPositionMainLabel {
  text-decoration: none;
  font-weight: 500;
  margin-bottom: 16px;
  font-size: 24px;
  color: white; }
  .ComponentsFooterBottomMenuPositionContainer > .ComponentsFooterBottomMenuPositionMainLabel-Selectable {
    cursor: pointer;
    text-decoration: none;
    font-weight: 500;
    font-size: 18px;
    margin: 0 20px;
    margin-bottom: 3px 0;
    color: white; }
    .ComponentsFooterBottomMenuPositionContainer > .ComponentsFooterBottomMenuPositionMainLabel-Selectable:hover {
      opacity: .7; }
    @media screen and (max-width: 768px) {
      .ComponentsFooterBottomMenuPositionContainer > .ComponentsFooterBottomMenuPositionMainLabel-Selectable {
        padding: 8px; } }

.ComponentsFooterInfoContainer {
  margin-top: 20px;
  max-width: var(--globalContainerWidth); }

.ComponentsFooterMenuContainer {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap; }
  @media screen and (max-width: 1200px) {
    .ComponentsFooterMenuContainer {
      flex-wrap: wrap; } }

.ComponentsFooterMenuPositionContainer {
  display: flex;
  flex-direction: column;
  margin: 0px 30px 30px 30px; }
  @media screen and (max-width: 1024px) {
    .ComponentsFooterMenuPositionContainer {
      margin: 0px 30px 10px 30px; } }

.ComponentsFooterMenuPositionMainLabel {
  text-decoration: none;
  font-weight: 500;
  margin-bottom: 16px;
  font-size: 18px;
  color: inherit; }
  @media screen and (max-width: 768px) {
    .ComponentsFooterMenuPositionMainLabel {
      margin-bottom: 4px; } }
  .ComponentsFooterMenuPositionMainLabel-Selectable {
    cursor: pointer;
    text-decoration: none;
    font-weight: 500;
    font-size: 18px;
    margin-bottom: 3px 0;
    color: inherit; }
    .ComponentsFooterMenuPositionMainLabel-Selectable:hover {
      opacity: .7; }

.ComponentsFooterMenuPositionSubLabel {
  margin: 4px 0;
  transition: .2s;
  font-size: 18px;
  cursor: pointer;
  color: inherit;
  text-decoration: none; }
  .ComponentsFooterMenuPositionSubLabel:hover {
    opacity: .7; }

.ComponentsFooterMenuPositionMainLabel, .ComponentsFooterMenuPositionSubLabel {
  word-break: normal;
  overflow-wrap: break-word; }

.ComponentsFooterSocialMediaContainer {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  text-align: center;
  margin: 0;
  padding: 30px 0px 30px 40px; }
  @media screen and (max-width: 768px) {
    .ComponentsFooterSocialMediaContainer {
      width: 100%;
      justify-content: center;
      padding: 30px 0px 30px 10px; } }
  .ComponentsFooterSocialMediaContainer li {
    margin: 0;
    text-align: center;
    list-style: none;
    margin-left: 25px;
    cursor: pointer;
    transition: .2s;
    text-align: center; }
    .ComponentsFooterSocialMediaContainer li:hover {
      opacity: .7; }
    .ComponentsFooterSocialMediaContainer li a {
      color: inherit;
      text-decoration: none; }

.ComponentsFooterContainer {
  max-width: 1920px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
  word-break: break-all; }
  @media screen and (min-width: 1024px) {
    .ComponentsFooterContainer-MenuOnLeft {
      justify-content: space-around; }
      .ComponentsFooterContainer-MenuOnLeft .ComponentsFooterNewsletterRight {
        padding: 30px 0; }
      .ComponentsFooterContainer-MenuOnLeft .ComponentsFooterSocialMediaContainer {
        padding-left: 0; } }

.ComponentsFooterContainerCenter {
  justify-content: center; }

.ComponentsFooterConnectico {
  line-height: 50px;
  background-color: black;
  color: white;
  text-align: center;
  font-size: 13px; }

.ComponentsFooterContactInfo {
  max-width: 300px; }

.ComponentsFooterInfoMenuContainer {
  display: flex;
  flex-wrap: wrap;
  padding: 30px 0px 30px 20px; }

.TinyWrapper_Footer_Contact {
  margin-bottom: 30px; }

.ComponentsFooterMenuContainerBottom {
  background: #1A1A1A;
  padding: 16px 0;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column; }

.ComponentsFooterNewsletterFormContainer {
  display: block;
  width: 500px;
  max-width: 80vw; }
  .ComponentsFooterNewsletterFormContainer .InputsTextfieldInput {
    height: 100%; }
  .ComponentsFooterNewsletterFormContainer .InputsAdaptedTextfieldTextfieldContainer {
    position: relative;
    padding-bottom: 10px; }
    @media screen and (max-width: 375px) {
      .ComponentsFooterNewsletterFormContainer .InputsAdaptedTextfieldTextfieldContainer {
        padding-bottom: 5px; } }
    .ComponentsFooterNewsletterFormContainer .InputsAdaptedTextfieldTextfieldContainer .InputsAdaptedTextfieldTextfieldError {
      position: absolute;
      bottom: -5px;
      left: 0; }
  .ComponentsFooterNewsletterFormContainer .InputsAdaptedCheckboxContainer {
    position: relative;
    padding-bottom: 10px; }
    .ComponentsFooterNewsletterFormContainer .InputsAdaptedCheckboxContainer .InputsAdaptedCheckboxError {
      bottom: 5px;
      left: 0; }

.ComponentsFooterNewsletterWrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  min-height: 800px;
  max-width: var(--globalContainerWidth);
  margin: 0 auto; }
  @media screen and (max-width: 1200px) {
    .ComponentsFooterNewsletterWrapper {
      flex-direction: column;
      min-height: auto; } }
  @media screen and (max-width: 600px) {
    .ComponentsFooterNewsletterWrapper {
      margin-top: 100px; } }
  .ComponentsFooterNewsletterWrapperWithoutLeft {
    min-height: 0; }

.ComponentsFooterNewsletterLeft {
  width: 50%;
  height: auto;
  padding: 20px;
  position: relative; }
  @media screen and (max-width: 1200px) {
    .ComponentsFooterNewsletterLeft {
      width: 90%;
      min-height: 300px;
      margin: 20px auto; } }

.ComponentsFooterNewsletterRight {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 80px 0;
  width: 50%; }
  @media screen and (max-width: 1200px) {
    .ComponentsFooterNewsletterRight {
      width: 100%;
      padding-top: 0; } }

.ComponentsFooterNewsletterLink {
  margin-top: 2em;
  padding: 0.75em 3.5em;
  background-color: var(--main-color);
  outline: none;
  color: white;
  text-decoration: none; }
  .ComponentsFooterNewsletterLink:visited {
    color: white; }
  .ComponentsFooterNewsletterLink:hover {
    color: gainsboro; }

.ComponentsFullScreenLoaderContainer {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  background-color: rgba(255, 255, 255, 0.3);
  display: flex;
  justify-content: center;
  align-items: center; }

.HomePageSectionContainerTitle {
  width: 100%;
  max-width: var(--globalContainerWidth);
  overflow: hidden; }
  @media screen and (max-width: 1024px) {
    .HomePageSectionContainerTitle {
      padding: 10px; } }

.HomePageSectionContainer {
  max-width: var(--globalContainerWidth); }

@media screen and (min-width: 1920px) {
  .HomePageSectionContainerFullWidth {
    margin-left: calc(-100vw / 2 + var(--globalContainerWidth) / 2);
    margin-right: calc(-100vw / 2 + var(--globalContainerWidth) / 2);
    max-width: unset; } }

.ArrowContainer {
  position: absolute;
  right: 0; }

.ArrowItem {
  font-size: 20px;
  color: black; }
  .ArrowItem.left {
    position: relative;
    right: 1px; }
    .ArrowItem.left::after {
      display: inline-block;
      font-style: normal;
      font-variant: normal;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      font-family: "Font Awesome 5 Free";
      font-weight: 600;
      content: "\F053"; }
  .ArrowItem.right {
    position: relative;
    left: 1px; }
    .ArrowItem.right::after {
      display: inline-block;
      font-style: normal;
      font-variant: normal;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      font-family: "Font Awesome 5 Free";
      font-weight: 600;
      content: "\F054"; }

.IconsQuantityContainer {
  width: 25px;
  height: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 24px;
  margin-left: 5px; }
  .IconsQuantityContainer div {
    width: 5px;
    height: 100%;
    background-color: #eee; }
  .IconsQuantityContainer .IconsQuantityEmpty::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F244";
    font-size: 16px;
    float: left; }
  .IconsQuantityContainer .IconsQuantityLittle::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F243";
    font-size: 16px;
    float: left; }
  .IconsQuantityContainer .IconsQuantityMedium::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F242";
    font-size: 16px;
    float: left; }
  .IconsQuantityContainer .IconsQuantityFull::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F240";
    font-size: 16px;
    float: left; }

.react-calendar {
  width: 350px;
  max-width: 100%;
  background: white;
  border: 1px solid #a0a096;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.125em; }

.react-calendar--doubleView {
  width: 700px; }

.react-calendar--doubleView .react-calendar__viewContainer {
  display: flex;
  margin: -0.5em; }

.react-calendar--doubleView .react-calendar__viewContainer > * {
  width: 50%;
  margin: 0.5em; }

.react-calendar,
.react-calendar *,
.react-calendar *:before,
.react-calendar *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.react-calendar button {
  margin: 0;
  border: 0;
  outline: none; }

.react-calendar button:enabled:hover {
  cursor: pointer; }

.react-calendar__navigation {
  height: 44px;
  margin-bottom: 1em; }

.react-calendar__navigation button {
  min-width: 44px;
  background: none; }

.react-calendar__navigation button:enabled:hover,
.react-calendar__navigation button:enabled:focus {
  background-color: #e6e6e6; }

.react-calendar__navigation button[disabled] {
  background-color: #f0f0f0; }

.react-calendar__month-view__weekdays {
  text-align: center;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 0.75em; }

.react-calendar__month-view__weekdays__weekday {
  padding: 0.5em; }

.react-calendar__month-view__weekNumbers {
  font-weight: bold; }

.react-calendar__month-view__weekNumbers .react-calendar__tile {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75em;
  padding: calc(0.75em / 0.75) calc(0.5em / 0.75); }

.react-calendar__month-view__days__day--weekend {
  color: #d10000; }

.react-calendar__month-view__days__day--neighboringMonth {
  color: #757575; }

.react-calendar__year-view .react-calendar__tile,
.react-calendar__decade-view .react-calendar__tile,
.react-calendar__century-view .react-calendar__tile {
  padding: 2em 0.5em; }

.react-calendar__tile {
  max-width: 100%;
  text-align: center;
  padding: 0.75em 0.5em;
  background: none; }

.react-calendar__tile:disabled {
  background-color: #f0f0f0; }

.react-calendar__tile:enabled:hover,
.react-calendar__tile:enabled:focus {
  background-color: #e6e6e6; }

.react-calendar__tile--now {
  background: #ffff76; }

.react-calendar__tile--now:enabled:hover,
.react-calendar__tile--now:enabled:focus {
  background: #ffffa9; }

.react-calendar__tile--hasActive {
  background: #76baff; }

.react-calendar__tile--hasActive:enabled:hover,
.react-calendar__tile--hasActive:enabled:focus {
  background: #a9d4ff; }

.react-calendar__tile--active {
  background: #006edc;
  color: white; }

.react-calendar__tile--active:enabled:hover,
.react-calendar__tile--active:enabled:focus {
  background: #1087ff; }

.react-calendar--selectRange .react-calendar__tile--hover {
  background-color: #e6e6e6; }

.react-date-picker__calendar {
  z-index: 10;
  opacity: 1;
  transform: none;
  transition: opacity 319ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 212ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  top: 28px;
  left: 16px;
  transform-origin: -16px 0px;
  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  border: unset; }

.react-date-picker__calendar--closed {
  opacity: 0;
  display: none; }

.react-calendar__navigation {
  height: unset !important; }

.react-calendar__navigation button[disabled] {
  background-color: #e6e6e6; }

.react-calendar__month-view__days .react-calendar__tile:enabled:hover {
  background-color: #e6e6e6;
  border-radius: 50%; }

.react-calendar__navigation button:enabled:focus {
  background-color: unset; }

.react-calendar__navigation button:enabled:hover {
  background-color: #e6e6e6; }

.react-calendar__month-view__days {
  padding: 6px; }

.react-date-picker__inputGroup__input:invalid {
  background: unset; }

abbr[title] {
  text-decoration: none; }

.react-calendar {
  border: unset; }

.react-calendar__month-view__weekdays {
  background-color: lightgray;
  text-transform: lowercase;
  padding: 6px;
  align-items: center;
  justify-content: center;
  color: rgba(0, 0, 0, 0.38); }

.react-calendar__month-view__weekdays__weekday {
  margin: 0 2px; }

.react-calendar button {
  width: 50px;
  height: 50px; }

.react-calendar__month-view__days .react-calendar__tile--active {
  border-radius: 50%; }

.react-calendar__year-view .react-calendar__tile {
  padding: 0; }

.react-calendar__tile:disabled {
  background-color: unset;
  color: #e6e6e6; }

.react-calendar__navigation {
  margin-bottom: 0;
  height: unset; }

.react-date-picker__calendar {
  height: unset !important; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.CartQuantitySelectorContainer {
  border: 2px solid rgba(0, 0, 0, 0.15);
  height: 32px;
  width: 100%;
  display: flex; }
  .CartQuantitySelectorContainer div {
    min-width: 32px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer; }
  .CartQuantitySelectorContainer div:nth-of-type(1) {
    border-right: 2px solid rgba(0, 0, 0, 0.15); }
  .CartQuantitySelectorContainer div:nth-of-type(2) {
    border-left: 2px solid rgba(0, 0, 0, 0.15); }

.CartQuantitySelectorInput {
  border: none;
  width: 100%;
  text-align: center;
  width: 48px; }
  .CartQuantitySelectorInput::-webkit-outer-spin-button {
    -webkit-appearance: none; }
  .CartQuantitySelectorInput::-webkit-inner-spin-button {
    -webkit-appearance: none; }
  .CartQuantitySelectorInput[type=number] {
    -moz-appearance: textfield; }

.CartQuantitySelectorLimit {
  border: 3px solid #CE0000; }

.CartQuantitySelectorIcons {
  border: none;
  display: flex; }

.CartQuantitySelectorRemoveItem::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: "light";
  content: "\F068";
  font-size: 10px;
  line-height: 32px; }

.CartQuantitySelectorAddItem::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: "light";
  content: "\F067";
  font-size: 10px;
  line-height: 32px; }

.CartQuantitySelectorDisabled {
  opacity: 0.5; }

.CurrencyPickerContainer {
  width: 100%;
  height: 60px;
  position: relative;
  display: none;
  justify-content: center;
  align-items: center; }
  @media screen and (min-width: 1024px) {
    .CurrencyPickerContainer {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; } }

.CurrencyPickerPickerControl {
  font-size: 14px;
  line-height: 16.4px;
  font-weight: 500;
  background-color: unset;
  border: none;
  cursor: pointer;
  height: 100%;
  width: 100%;
  outline: none;
  padding: 0; }
  .CurrencyPickerPickerControl:hover .CurrencyPickerPickerControlInner {
    opacity: 1; }
  .CurrencyPickerPickerControl:focus .CurrencyPickerPickerControlInner {
    text-decoration: underline; }

.CurrencyPickerPickerControlInner {
  opacity: .6;
  transition: all .3s;
  border: 1px solid #C4C4C4;
  width: 100%;
  padding: 4px 16px; }

.CurrencyPickerPickerWrapper {
  position: absolute;
  z-index: 100;
  top: 60px;
  right: 0;
  width: 100%;
  max-width: 250px;
  border: solid 1px rgba(0, 0, 0, 0.15);
  border-top: none;
  background-color: white; }

.CurrencyPickerPickerLabelText {
  font-size: 12px;
  font-weight: 600;
  padding: 8px 2px; }

.CurrencyPickerPickerLabel {
  display: flex;
  flex-direction: column;
  align-items: flex-start; }

.CurrencyPickerListItem {
  width: 100%;
  height: 60px;
  padding: 0;
  margin: 0 0 10px; }
  @media screen and (min-width: 1024px) {
    .CurrencyPickerListItem {
      margin: 0; } }

.CurrencyPickerListItemInner {
  width: 100%;
  height: 100%;
  font-size: 14px;
  padding: 0 15px;
  border: none;
  background: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  cursor: pointer;
  transition: background .3s;
  background-color: rgba(0, 0, 0, 0.05);
  position: relative; }
  .CurrencyPickerListItemInner:hover, .CurrencyPickerListItemInner:focus {
    background-color: rgba(0, 0, 0, 0.15); }
  @media screen and (min-width: 1024px) {
    .CurrencyPickerListItemInner {
      background-color: rgba(0, 0, 0, 0); } }

.CurrencyPickerListItemCheckIcon {
  position: absolute;
  top: 20px;
  right: 20px;
  opacity: .7; }

.CurrencyPickerListItemName {
  margin-left: 20px; }

.CurrencyPickerListSymbol {
  font-weight: bold;
  width: 15%;
  text-align: left; }

.CurrencyPickerMobileContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100vh; }
  @media screen and (min-width: 480px) {
    .CurrencyPickerMobileContainer {
      width: 350px;
      height: fit-content; } }

.CurrencyPickerMobileHeading {
  font-size: 20px;
  margin: 20px 0;
  font-weight: 600; }

.CurrencyPickerMobileHeadingDivider {
  width: 100%;
  color: black;
  margin: 0; }

.CurrencyPickerMobileList {
  width: 100%; }
  @media screen and (min-width: 480px) {
    .CurrencyPickerMobileList {
      height: 300px; } }

.InputsCurrentSearchPhraseContainer {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  width: 100%;
  margin: 5px 0; }

.InputsCurrentSearchPhrasePhrase {
  font-size: 32px; }

.InputsCurrentSearchPhraseButton {
  margin: 0 0 0 5px;
  opacity: .5;
  transition: opacity .3s; }
  .InputsCurrentSearchPhraseButton:hover {
    opacity: 1; }

.InputsDropdownSelectorContainer {
  height: 30px;
  position: relative;
  width: fit-content; }

.InputsDropdownSelectorPickerWrapper {
  position: absolute;
  z-index: 2;
  top: 30px;
  left: 0;
  border-top: none;
  background-color: white; }

.InputsSharedDropdownSelectorListItem {
  width: 100%;
  height: 40px;
  padding: 0;
  margin: 0 0 10px; }
  @media screen and (min-width: 1024px) {
    .InputsSharedDropdownSelectorListItem {
      margin: 0; } }

.InputsSharedDropdownSelectorListItemSort {
  min-width: 250px; }

.InputsSharedDropdownSelectorListItemView {
  min-width: 200px; }

.InputsSharedDropdownSelectorListItemInner {
  width: 100%;
  height: 100%;
  padding: 0 15px;
  border: none;
  background: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  cursor: pointer;
  transition: background .3s;
  background-color: rgba(0, 0, 0, 0.05);
  position: relative; }
  .InputsSharedDropdownSelectorListItemInner:hover, .InputsSharedDropdownSelectorListItemInner:focus {
    background-color: rgba(0, 0, 0, 0.15); }
  @media screen and (min-width: 1024px) {
    .InputsSharedDropdownSelectorListItemInner {
      background-color: rgba(0, 0, 0, 0); } }

.InputsSharedDropdownSelectorListItemViewIcon {
  width: 20px;
  opacity: .5;
  margin: 0 10px 0 0; }

.InputsSharedDropdownSelectorListItemLabel {
  justify-self: flex-start;
  font-size: 14px;
  margin: 0 0 2px 0; }

.InputsSharedDropdownSelectorListItemCheckIcon {
  position: absolute;
  top: 12px;
  right: 10px;
  opacity: .7; }

.InputsDropdownSelectorMobileContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100vh; }
  @media screen and (min-width: 480px) {
    .InputsDropdownSelectorMobileContainer {
      width: 350px;
      height: fit-content;
      max-height: 400px; } }

.InputsDropdownSelectorMobileHeading {
  font-size: 20px;
  margin: 20px 0;
  font-weight: 600; }

.InputsDropdownSelectorMobileHeadingDivider {
  width: 100%;
  color: black;
  margin: 0; }

.InputsDropdownSelectorMobileListView {
  width: 100%; }

.InputsDropdownSelectorMobileListSort {
  width: 100%; }

.BooleanCheckboxContainer {
  width: 100%; }

.BooleanCheckboxItemIcon {
  transition: opacity .15s;
  opacity: 0; }
  .BooleanCheckboxItemIcon-Selected {
    opacity: 1; }

.BooleanCheckboxItemLabel {
  margin: 0 0 0 5px;
  font-size: 14px;
  cursor: pointer;
  font-weight: 400; }
  .BooleanCheckboxItemLabel-Selected {
    font-weight: 700; }

.BooleanCheckboxItem {
  display: flex;
  flex-direction: row;
  align-items: center;
  transition: opacity .3s;
  margin: 1px 0; }
  .BooleanCheckboxItem:hover {
    opacity: .6; }
  @media screen and (max-width: 768px) {
    .BooleanCheckboxItem {
      margin-top: 5px;
      margin-bottom: 20px; } }

.FilterColorContainer {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap; }
  @media screen and (min-width: 480px) {
    .FilterColorContainer {
      flex-direction: row; } }

.FilterColorItem {
  margin: 5px 0 5px 3px; }
  .FilterColorItem:hover .FilterItemButtonColor-Selected {
    box-shadow: 0 0 10px gray; }
  .FilterColorItem:hover .FilterItemButtonLabel-Selected {
    opacity: 1; }

.FilterColorItemButton {
  display: flex;
  flex-direction: row;
  align-items: center;
  border: none;
  padding: 0;
  cursor: pointer;
  background: none; }
  @media screen and (min-width: 480px) {
    .FilterColorItemButton {
      margin: 5px 10px 5px 0; } }

.FilterColorItemButtonColor {
  width: 35px;
  height: 35px;
  margin-right: 10px;
  transition: all .15s;
  position: relative;
  outline: solid 2px rgba(180, 180, 180, 0.5);
  display: block; }
  .FilterColorItemButtonColor:hover {
    box-shadow: 0 0 10px #0000ff; }
  .FilterColorItemButtonColor::before {
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    color: white;
    font-size: 20px;
    text-shadow: 1px 1px 2px black;
    content: '\2713';
    opacity: 0;
    transition: opacity .3s; }
  @media screen and (min-width: 480px) {
    .FilterColorItemButtonColor {
      margin: 0; } }
  .FilterColorItemButtonColor-Selected {
    outline: solid 2px blue; }
    .FilterColorItemButtonColor-Selected::before {
      opacity: 1; }

.FilterColorItemButtonLabel {
  font-size: 14px;
  font-weight: 600;
  transition: all .15s;
  opacity: .7; }
  @media screen and (min-width: 480px) {
    .FilterColorItemButtonLabel {
      display: none; } }
  .FilterColorItemButtonLabel-Selected {
    opacity: 1; }

.FilterColorSelectedItem {
  display: inline-block;
  width: 16px;
  height: 16px;
  outline: solid 2px rgba(180, 180, 180, 0.5);
  margin-right: 8px;
  margin-bottom: 5px; }

.FilterDatePickerContainer {
  display: flex;
  flex-direction: column;
  justify-content: flex-start; }

.FilterDatePickerField {
  align-items: center;
  display: flex;
  flex-direction: row;
  margin: 5px 0; }

.FilterDatePickerFieldLabel {
  margin-right: 10px; }

.FiltersDictionaryComboboxContainer {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  /*max-height: 500px;*/ }

.FiltersDictionaryComboboxInputs {
  position: relative;
  width: 100%;
  align-self: center; }
  .FiltersDictionaryComboboxInputs > .fa-search {
    position: absolute;
    left: 5px;
    top: 7px; }

.FiltersDictionaryComboboxFilters {
  width: 100%;
  margin-bottom: 10px;
  padding: 5px 5px 5px 26px;
  border: 1px solid #a9a9a9;
  color: #000; }
  .FiltersDictionaryComboboxFilters::placeholder {
    color: #606060; }

.FiltersDictionaryComboboxPositions {
  width: 100%;
  /*overflow-y: scroll;
    height: 280px;*/
  padding: 0;
  margin-top: 0.75em; }

.FiltersDictianaryCheckboxSimpleContainer {
  display: flex;
  flex-direction: column; }

.FiltersDictianaryCheckboxSimpleAdditional {
  display: none;
  overflow: hidden; }
  .FiltersDictianaryCheckboxSimpleAdditional-Visible {
    display: initial; }

.FiltersDictianaryCheckboxSimpleExpander {
  margin-left: 30px;
  display: none; }
  .FiltersDictianaryCheckboxSimpleExpander-Visible {
    display: initial; }

.FiltersRangePickerContainer {
  width: 100%; }

.FiltersRangePickerInputs {
  display: flex;
  flex-direction: row;
  gap: 10px;
  width: 100%;
  margin-bottom: 5px; }
  .FiltersRangePickerInputsMin, .FiltersRangePickerInputsMax {
    flex: 1; }

.FiltersRangePickerError {
  display: none;
  color: red;
  font-size: 14px; }
  .FiltersRangePickerError-Visible {
    display: initial; }

.FiltersSharedPositionListContainer {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none; }

.FiltersSharedPositionListItem {
  display: flex;
  flex-direction: row;
  align-items: center;
  transition: opacity .3s;
  margin: 0 0 0.75em 0; }
  .FiltersSharedPositionListItem:hover {
    opacity: .6; }

.FiltersSharedPositionListItemIcon {
  transition: opacity .15s;
  border: 1px solid black;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center; }
  .FiltersSharedPositionListItemIcon svg {
    opacity: 0;
    font-size: 18px; }
  .FiltersSharedPositionListItemIcon-Selected svg {
    opacity: 1; }

.FiltersSharedPositionListItemLabel {
  margin: 0 0 0 0.5em;
  padding: 2px 5px;
  width: 100%;
  font-size: 14px;
  cursor: pointer;
  font-weight: 400; }
  .FiltersSharedPositionListItemLabel-Selected {
    font-weight: 700; }

.search-layout-1 .FilterWrapperContainer {
  width: 100%;
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #DEDEDE;
  display: contents; }
  .search-layout-1 .FilterWrapperContainer .FilterWrapperHeader {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 1.25em 0;
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    grid-template-areas: "filterName clearIcon expandIcon" "filterSuffix filterSuffix filterSuffix"; }
    .search-layout-1 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderName {
      grid-area: filterName;
      opacity: .6;
      color: black;
      transition: opacity 0.3s;
      font-size: 18px;
      line-height: 18px;
      font-weight: 900;
      display: flex;
      flex-direction: row;
      align-items: center; }
      .search-layout-1 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderName strong {
        display: none; }
        .search-layout-1 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderName strong span {
          display: inline-block;
          width: 18px;
          height: 18px;
          border-radius: 9px;
          background-color: red;
          display: flex;
          justify-content: center;
          align-items: center;
          margin-left: 0.25em; }
          .search-layout-1 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderName strong span em {
            font-size: 11px;
            font-weight: bold;
            font-style: normal;
            margin: 0;
            padding: 0;
            line-height: 1em;
            color: white; }
    .search-layout-1 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderSuffix {
      grid-area: filterSuffix;
      opacity: .6;
      color: black;
      margin-top: 0.5em; }
    .search-layout-1 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderClearIcon {
      grid-area: clearIcon;
      cursor: pointer;
      display: none;
      opacity: .6;
      color: black; }
    .search-layout-1 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderExpandIcon {
      grid-area: expandIcon;
      display: none;
      cursor: pointer;
      opacity: .6;
      color: black;
      font-size: 14px;
      transition: transform ease-in 0.1s;
      transform: rotate(90deg); }
  .search-layout-1 .FilterWrapperContainer .FilterWrapperContent {
    padding: 0;
    overflow: hidden;
    margin: 0;
    width: 100%;
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.2s ease; }
    .search-layout-1 .FilterWrapperContainer .FilterWrapperContent.Overflow {
      overflow: visible; }
    .search-layout-1 .FilterWrapperContainer .FilterWrapperContent > div {
      overflow: hidden;
      transition: margin-top 0.2s ease; }
    .search-layout-1 .FilterWrapperContainer .FilterWrapperContent:has(> div.IsOpen) {
      grid-template-rows: 1fr; }
      .search-layout-1 .FilterWrapperContainer .FilterWrapperContent:has(> div.IsOpen) > div {
        margin-top: 10px; }
    .search-layout-1 .FilterWrapperContainer .FilterWrapperContent:has(> div.IsClosed) {
      grid-template-rows: 0fr; }
      .search-layout-1 .FilterWrapperContainer .FilterWrapperContent:has(> div.IsClosed) > div {
        margin-top: 0; }
  .search-layout-1 .FilterWrapperContainer .FilterWrapperSelectedValuesList {
    margin-top: -0.75em;
    margin-bottom: 1.25em;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 11px; }
  .search-layout-1 .FilterWrapperContainer.HasSelection .FilterWrapperHeaderName strong {
    display: inline-block; }
  .search-layout-1 .FilterWrapperContainer.HasSelection .FilterWrapperHeaderClearIcon {
    display: initial; }
  .search-layout-1 .FilterWrapperContainer.IsExpandable .FilterWrapperHeaderName {
    cursor: pointer; }
  .search-layout-1 .FilterWrapperContainer.IsExpandable .FilterWrapperHeaderSuffix {
    cursor: pointer; }
  .search-layout-1 .FilterWrapperContainer.IsExpandable .FilterWrapperHeaderExpandIcon {
    display: initial; }
  .search-layout-1 .FilterWrapperContainer.IsExpanded .FilterWrapperHeaderExpandIcon {
    transform: rotate(-90deg); }
  .search-layout-1 .FilterWrapperContainer.IsExpanded .FilterWrapperContent {
    margin: 0 0 1.25em 0; }
  .search-layout-1 .FilterWrapperContainer.IsExpanded .FilterWrapperSelectedValuesList {
    display: none; }
  .search-layout-1 .FilterWrapperContainer:hover .FilterWrapperHeaderName {
    opacity: 1; }
  .search-layout-1 .FilterWrapperContainer:hover .FilterWrapperHeaderSuffix {
    opacity: 1; }
  .search-layout-1 .FilterWrapperContainer:hover .FilterWrapperHeaderClearIcon {
    opacity: 1; }
  .search-layout-1 .FilterWrapperContainer:hover .FilterWrapperHeaderExpandIcon {
    opacity: 1; }

.search-layout-2 .FilterWrapperContainer {
  display: contents; }
  .search-layout-2 .FilterWrapperContainer .FilterWrapperHeader {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 1.25em 0;
    grid-column: 1;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    grid-template-areas: "filterName clearIcon expandIcon" "filterSuffix filterSuffix filterSuffix"; }
    .search-layout-2 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderName {
      grid-area: filterName;
      opacity: .6;
      color: black;
      transition: opacity 0.3s;
      font-size: 18px;
      line-height: 18px;
      font-weight: 900;
      display: flex;
      flex-direction: row;
      align-items: center; }
      .search-layout-2 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderName strong {
        visibility: hidden; }
        .search-layout-2 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderName strong span {
          display: inline-block;
          width: 18px;
          height: 18px;
          border-radius: 9px;
          background-color: red;
          display: flex;
          justify-content: center;
          align-items: center;
          margin-left: 0.25em; }
          .search-layout-2 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderName strong span em {
            font-size: 11px;
            font-weight: bold;
            font-style: normal;
            margin: 0;
            padding: 0;
            line-height: 1em;
            color: white; }
    .search-layout-2 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderSuffix {
      grid-area: filterSuffix;
      opacity: .6;
      color: black;
      margin-top: 0.5em; }
    .search-layout-2 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderClearIcon {
      grid-area: clearIcon;
      cursor: pointer;
      display: none;
      opacity: .6;
      color: black; }
    .search-layout-2 .FilterWrapperContainer .FilterWrapperHeader .FilterWrapperHeaderExpandIcon {
      grid-area: expandIcon;
      display: none;
      cursor: pointer;
      opacity: .6;
      color: black;
      font-size: 14px;
      transition: transform ease-in 0.1s;
      transform: rotate(90deg); }
  .search-layout-2 .FilterWrapperContainer .FilterWrapperContent {
    margin: 0 0 1.25em 0;
    grid-column: 2;
    margin: 0; }
  .search-layout-2 .FilterWrapperContainer .FilterWrapperSelectedValuesList {
    grid-column: 3;
    margin-top: -0.75em;
    margin-bottom: 1.25em;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 11px; }
  .search-layout-2 .FilterWrapperContainer.HasSelection .FilterWrapperHeaderName strong {
    visibility: visible; }
  .search-layout-2 .FilterWrapperContainer.HasSelection .FilterWrapperHeaderClearIcon {
    display: initial; }
  .search-layout-2 .FilterWrapperContainer.IsExpandable .FilterWrapperHeaderName {
    cursor: pointer; }
  .search-layout-2 .FilterWrapperContainer.IsExpandable .FilterWrapperHeaderSuffix {
    cursor: pointer; }
  .search-layout-2 .FilterWrapperContainer.IsExpandable .FilterWrapperHeaderExpandIcon {
    display: initial; }
  .search-layout-2 .FilterWrapperContainer.IsExpanded .FilterWrapperHeaderExpandIcon {
    transform: rotate(-90deg); }
  .search-layout-2 .FilterWrapperContainer.IsExpanded .FilterWrapperContent {
    margin: 0 0 1.25em 0; }
  .search-layout-2 .FilterWrapperContainer.IsExpanded .FilterWrapperSelectedValuesList {
    display: none; }
  .search-layout-2 .FilterWrapperContainer:hover .FilterWrapperHeaderName {
    opacity: 1; }
  .search-layout-2 .FilterWrapperContainer:hover .FilterWrapperHeaderSuffix {
    opacity: 1; }
  .search-layout-2 .FilterWrapperContainer:hover .FilterWrapperHeaderClearIcon {
    opacity: 1; }
  .search-layout-2 .FilterWrapperContainer:hover .FilterWrapperHeaderExpandIcon {
    opacity: 1; }

.InputsAdaptedCheckboxContainer {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: relative;
  margin: 10px 0; }
  .InputsAdaptedCheckboxContainer article {
    margin-top: 10px;
    padding: 1em; }
  .InputsAdaptedCheckboxContainer span {
    font-size: 13px; }

.InputsAdaptedCheckboxExternal {
  display: flex;
  padding: 0 10px;
  flex: 1;
  align-items: center;
  font-size: 13px; }

.InputsAdaptedCheckboxError {
  margin-top: 10px;
  font-size: 12px;
  color: red; }

.InputsAdaptedCheckboxChecked {
  color: var(--main-color); }

.InputsAdaptedCheckboxWrapper {
  display: flex;
  align-items: center; }
  @media screen and (max-width: 480px) {
    .InputsAdaptedCheckboxWrapper {
      font-size: 13px; } }

.InputsAdaptedCheckboxWrapperCheckboxName {
  margin-left: 0.5em; }

.InputsAdaptedCheckboxWrapperCheckboxAction {
  font-size: 0.75em;
  text-decoration: underline;
  cursor: pointer;
  margin-left: 0.5em; }

.InputsAdaptedPasswordTextfieldContainer {
  width: 100%;
  position: relative;
  padding-bottom: 30px; }
  @media screen and (max-width: 375px) {
    .InputsAdaptedPasswordTextfieldContainer {
      padding-bottom: 10px; } }

.InputsAdaptedPasswordTextfieldLabel {
  font-size: 14px;
  font-variant-caps: all-petite-caps;
  color: gray; }

.InputsAdaptedPasswordTextfieldError {
  position: absolute;
  bottom: 6px;
  left: 0;
  color: #CE0000;
  font-size: 12px;
  margin: 0; }

.InputsAdaptedTextareafieldContainer {
  width: 100%;
  position: relative;
  padding-bottom: 20px; }

.InputsAdaptedTextareafieldLabel {
  font-size: 16px;
  font-variant-caps: all-petite-caps;
  color: gray; }

.InputsAdaptedTextareafieldError {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #CE0000;
  font-size: 12px;
  margin: 0; }

.InputsAdaptedTextfieldTextfieldContainer {
  width: 100%;
  position: relative;
  padding-bottom: 10px; }
  @media screen and (max-width: 375px) {
    .InputsAdaptedTextfieldTextfieldContainer {
      padding-bottom: 5px; } }

.InputsAdaptedTextfieldTextfieldLabel {
  font-size: 16px;
  font-variant-caps: all-petite-caps;
  color: gray; }

.InputsAdaptedPasswordTextfieldLabel {
  font-size: 16px; }

.InputsAdaptedTextfieldTextfieldError {
  color: #CE0000;
  font-size: 12px;
  margin: 5px 0 10px 0; }

.InputsAddressBookFormContainer {
  width: 100%;
  margin-bottom: 40px; }

.InputsAddressBookFormLabel {
  font-size: 20px;
  font-weight: 600; }

.InputsAddressBookFormAdditionalLabel {
  font-size: 16px;
  font-weight: 600;
  margin: 20px 0 10px; }

.InputsAddressBookFormStyledForm {
  width: 100%; }

.InputsAddressBookFormInputs {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 20px auto; }

.InputsAddressBookFormButtons {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: relative; }
  @media screen and (min-width: 600px) {
    .InputsAddressBookFormButtons {
      flex-direction: row-reverse;
      justify-content: space-between; } }

.InputsAddressBookFormButton {
  margin: 20px 0 0;
  width: 100%; }
  @media screen and (min-width: 600px) {
    .InputsAddressBookFormButton:nth-of-type(1) {
      margin: 20px 0 0 20px; } }

.InputsAddressBookFormRow {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  flex-wrap: wrap; }

.InputsAddressBookFormWideField {
  width: 47.5%; }
  @media screen and (max-width: 768px) {
    .InputsAddressBookFormWideField {
      width: 100%; } }

.InputsAddressBookFormError {
  position: absolute;
  left: 0;
  color: red;
  font-size: 12px; }

.InputsAgreements {
  margin-bottom: 16px; }
  .InputsAgreements span {
    font-size: 13px; }

.InputsBasicUserDataFormContainer {
  width: 100%;
  margin-bottom: 40px; }

.InputsBasicUserDataFormLabel {
  font-size: 20px;
  font-weight: 600; }

.InputsBasicUserDataFormAdditionalLabel {
  font-size: 16px;
  font-weight: 600;
  margin: 20px 0 10px; }

.InputsBasicUserDataFormStyledForm {
  width: 100%; }

.InputsBasicUserDataFormInputs {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 20px auto; }

.InputsBasicUserDataFormButtons {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: relative; }
  @media screen and (min-width: 600px) {
    .InputsBasicUserDataFormButtons {
      flex-direction: row-reverse;
      justify-content: space-between; } }

.InputsBasicUserDataFormButton {
  margin: 20px 0 0;
  width: 100%; }
  @media screen and (min-width: 600px) {
    .InputsBasicUserDataFormButton:nth-of-type(1) {
      margin: 20px 0 0 20px; } }

.InputsBasicUserDataFormRow {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  flex-wrap: wrap; }

.InputsBasicUserDataFormWideField {
  width: 47.5%; }
  @media screen and (max-width: 768px) {
    .InputsBasicUserDataFormWideField {
      width: 100%; } }

.InputsBasicUserDataFormError {
  position: absolute;
  left: 0;
  color: red;
  font-size: 12px; }

.InputsCreditCardCheckoutFormContainer {
  width: 100%; }

.InputsCreditCardCheckoutFormDivider {
  width: 100%;
  height: 1px;
  margin-bottom: 10px; }

.InputsCreditCardCheckoutFormLabel {
  font-size: 10px;
  font-weight: 600; }

.InputsCreditCardCheckoutFormInputs {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 600px;
  margin: 20px auto; }

.InputsCreditCardCheckoutFormRow {
  width: 100%; }

.InputsCreditCardCheckoutFormDouble {
  display: flex;
  flex-direction: row;
  justify-content: space-between; }

.InputsCreditCardCheckoutFormDoubleField {
  width: 150px; }

.InputsExtendedFormContainer {
  width: 100%;
  margin-bottom: 40px; }

.InputsExtendedFormDivider {
  width: 100%;
  height: 0px;
  margin-bottom: 10px; }

.InputsExtendedFormLabel {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 50px;
  margin-top: 50px; }
  @media screen and (max-width: 768px) {
    .InputsExtendedFormLabel {
      margin-top: 1em;
      margin-bottom: 2em; } }

@media screen and (max-width: 375px) {
  h2.InputsExtendedFormLabel {
    font-size: 16px; } }

.InputsExtendedFormAdditionalLabel {
  font-size: 16px;
  font-weight: 600;
  margin: 20px 0 10px; }

.InputsExtendedFormStyledForm {
  width: 100%; }

.InputsExtendedFormInputs {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 20px auto;
  padding: 0 5px; }

.InputsExtendedFormButtons {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: relative; }
  @media screen and (min-width: 600px) {
    .InputsExtendedFormButtons {
      flex-direction: row-reverse;
      justify-content: space-between; } }

.InputsExtendedFormButton {
  margin: 20px 0 0;
  width: 100%; }
  @media screen and (min-width: 600px) {
    .InputsExtendedFormButton:nth-of-type(1) {
      margin: 20px 0 0 20px; } }

.InputsExtendedFormRow {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%; }

.InputsExtendedFormWideField {
  width: 47.5%; }

.InputsExtendedFormNarrowField {
  width: 30%; }

.InputsExtendedFormAdditional {
  width: 100%;
  overflow: hidden;
  padding: 0 5px;
  margin: 0 -5px; }

.InputsExtendedFormError {
  position: absolute;
  left: 0;
  color: red;
  font-size: 12px; }

.InputsExtendedFormCompanyCheckbox {
  padding: 5px;
  margin-left: 8px; }

.InputsExtendedFormCompanyCheckboxWrapper {
  display: flex;
  align-content: center; }

.InputsExtendedFormPasswordDescription {
  font-size: 12px;
  background-color: lightyellow;
  padding: 10px 30px; }

.InputsLoginFormContainer {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 50px 0 100px 0; }
  .InputsLoginFormContainer .InputsLoginFormWrapper:first-of-type {
    border-right: 1px solid rgba(0, 0, 0, 0.2); }
    @media screen and (max-width: 1024px) {
      .InputsLoginFormContainer .InputsLoginFormWrapper:first-of-type {
        border-right: none;
        border-bottom: 1px solid rgba(0, 0, 0, 0.2); } }
  @media screen and (max-width: 1024px) {
    .InputsLoginFormContainer {
      margin: 0;
      padding: 0 32px; } }

.InputsLoginFormWrapper {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding: 50px 0; }
  .InputsLoginFormWrapper form {
    width: 500px;
    max-width: 100%; }
  .InputsLoginFormWrapper .InputsLoginFormButton {
    width: 500px;
    max-width: 100%; }
  @media screen and (max-width: 1024px) {
    .InputsLoginFormWrapper {
      width: 100%; } }

.InputsLoginFormLabel {
  font-size: 24px;
  font-weight: normal;
  margin-bottom: 60px; }

.InputsLoginFormStyledForm {
  width: 100%;
  margin-bottom: 60px; }

.InputsLoginFormInputs {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 20px auto; }

.InputsLoginFormButton {
  margin-top: 32px; }

.InputsLoginFormDivider {
  margin-top: 32px;
  width: 500px;
  max-width: 100%;
  position: relative; }
  .InputsLoginFormDivider hr {
    color: 1px solid rgba(0, 0, 0, 0.2);
    width: 100%; }
  .InputsLoginFormDivider span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    padding: 0 10px; }

.InputsLoginFormCheckboxLine {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 0; }
  .InputsLoginFormCheckboxLine .MuiCheckbox-root {
    color: #C4C4C4; }
  .InputsLoginFormCheckboxLine > div {
    width: 50%; }
    .InputsLoginFormCheckboxLine > div .InputsLoginFormRecovery, .InputsLoginFormCheckboxLine > div .InputsLoginFormResendSignupConfirmation {
      text-align: right;
      font-size: 13px;
      text-decoration: underline;
      cursor: pointer;
      font-weight: 300; }
    .InputsLoginFormCheckboxLine > div .InputsLoginFormResendSignupConfirmation {
      margin-top: 1.5em; }
  @media screen and (max-width: 768px) {
    .InputsLoginFormCheckboxLine {
      flex-wrap: wrap; }
      .InputsLoginFormCheckboxLine > div {
        width: 100%; }
        .InputsLoginFormCheckboxLine > div .InputsLoginFormRecovery, .InputsLoginFormCheckboxLine > div .InputsLoginFormResendSignupConfirmation {
          text-align: center;
          font-size: 14px; } }

.InputsLoginFormError {
  color: red;
  font-size: 12px;
  margin-top: 10px; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.FinalFormEmailChangeFormForm {
  display: block;
  flex-direction: column;
  max-width: 350px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 20px;
  padding-bottom: 40px; }
  @media screen and (max-width: 1024px) {
    .FinalFormEmailChangeFormForm {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding-bottom: 20px; } }

.FinalFormEmailChangeFormInputs {
  display: flex;
  flex-direction: column;
  max-width: 350px; }
  @media screen and (max-width: 1024px) {
    .FinalFormEmailChangeFormInputs {
      width: 350px; } }
  @media screen and (max-width: 600px) {
    .FinalFormEmailChangeFormInputs {
      width: 250px; } }

.FinalFormEmailChangeFormControls {
  max-width: 350px; }
  @media screen and (max-width: 1024px) {
    .FinalFormEmailChangeFormControls {
      margin: 0 0 20px 20px;
      width: 250px; } }
  @media screen and (max-width: 600px) {
    .FinalFormEmailChangeFormControls {
      margin: 0 0 20px 0; } }

.FinalFormEmailChangeFormError {
  color: #CE0000; }

.InputsLoginControlFormContainer {
  width: 100%; }

.InputsLoginControlFormStyledForm {
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: column; }
  @media screen and (max-width: 768px) {
    .InputsLoginControlFormStyledForm {
      margin-bottom: -48px; } }

.InputsLoginControlFormInputs {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 20px auto; }

.InputsLoginControlFormRecovery, .InputsLoginControlFormResendSignupConfirmation {
  align-self: flex-end;
  font-size: 14px;
  text-decoration: underline;
  opacity: .5;
  cursor: pointer;
  font-weight: 600;
  transition: opacity .3s; }
  .InputsLoginControlFormRecovery:hover, .InputsLoginControlFormResendSignupConfirmation:hover {
    opacity: .7; }

.InputsLoginControlFormResendSignupConfirmation {
  margin-top: 1.5em; }

.InputsLoginControlFormControls {
  position: relative;
  max-width: 425px;
  width: 100%;
  margin-top: 100px;
  margin-bottom: 50px; }

.InputsLoginControlFormError {
  padding-top: 10px;
  position: absolute;
  left: 0;
  color: red;
  font-size: 12px; }

.InputsLoginControlInput {
  margin: 25px 0; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.FinalFormPasswordChangeFormForm {
  position: relative;
  display: flex;
  flex-direction: column;
  padding-bottom: 20px;
  justify-content: center; }
  @media screen and (max-width: 1024px) {
    .FinalFormPasswordChangeFormForm {
      padding-bottom: 0;
      flex-direction: column;
      align-items: center; } }

.FinalFormPasswordChangeFormInputs {
  display: flex;
  flex-direction: column;
  width: 480px; }
  @media screen and (max-width: 1024px) {
    .FinalFormPasswordChangeFormInputs {
      width: 350px; } }
  @media screen and (max-width: 600px) {
    .FinalFormPasswordChangeFormInputs {
      width: 250px; } }

.FinalFormPasswordChangeFormControls {
  display: block;
  flex-direction: column;
  max-width: 350px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 60px;
  padding-bottom: 40px; }
  @media screen and (max-width: 1024px) {
    .FinalFormPasswordChangeFormControls {
      margin: 0 0 20px 20px;
      width: 250px; } }
  @media screen and (max-width: 600px) {
    .FinalFormPasswordChangeFormControls {
      margin: 0 0 20px 0;
      padding-top: 30px;
      padding-bottom: 30px; } }

.FinalFormPasswordChangeFormError {
  color: #CE0000;
  display: block;
  padding-top: 10px; }

.FinalFormPasswordDescription {
  font-size: 12px;
  background-color: lightyellow;
  padding: 10px 30px; }

.LanguagePickerContainer {
  width: 100%;
  height: 60px;
  position: relative;
  display: none;
  justify-content: center;
  align-items: center; }
  @media screen and (min-width: 1024px) {
    .LanguagePickerContainer {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; } }

.LanguagePickerPickerControl {
  font-size: 14px;
  line-height: 16.4px;
  font-weight: 500;
  background-color: unset;
  border: none;
  cursor: pointer;
  height: 100%;
  width: 100%;
  outline: none;
  padding: 0; }
  .LanguagePickerPickerControl:hover .LanguagePickerPickerControlInner {
    opacity: 1; }
  .LanguagePickerPickerControl:focus .LanguagePickerPickerControlInner {
    text-decoration: underline; }

.LanguagePickerPickerControlInner {
  opacity: .6;
  transition: all .3s;
  padding: 4px 16px;
  border: 1px solid #C4C4C4;
  width: 100%; }

.LanguagePickerPickerWrapper {
  position: absolute;
  top: 60px;
  right: 0;
  width: 100%;
  max-width: 250px;
  border: solid 1px rgba(0, 0, 0, 0.15);
  border-top: none;
  background-color: white; }

.LanguagePickerPickerLabelText {
  font-size: 12px;
  font-weight: 600;
  padding: 8px 2px; }

.LanguagePickerPickerLabel {
  display: flex;
  flex-direction: column;
  align-items: flex-start; }

.LanguagePickerListItem {
  width: 100%;
  height: 60px;
  padding: 0;
  margin: 0 0 10px;
  z-index: 100;
  position: relative;
  background: #fff;
  border-bottom: 1px solid gainsboro; }
  @media screen and (min-width: 1024px) {
    .LanguagePickerListItem {
      margin: 0; } }

.LanguagePickerListItemInner {
  width: 100%;
  height: 100%;
  padding: 0 15px;
  font-size: 14px;
  border: none;
  background: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  cursor: pointer;
  transition: background .3s;
  background-color: rgba(0, 0, 0, 0.05);
  position: relative; }
  .LanguagePickerListItemInner:hover, .LanguagePickerListItemInner:focus {
    background-color: rgba(0, 0, 0, 0.15); }
  @media screen and (min-width: 1024px) {
    .LanguagePickerListItemInner {
      background-color: rgba(0, 0, 0, 0); } }

.LanguagePickerListItemFlag {
  font-size: 20px;
  margin: 0 10px 0 0; }

.LanguagePickerListItemCheckIcon {
  position: absolute;
  top: 20px;
  right: 20px;
  opacity: .7; }

.LanguagePickerMobileContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100vh; }
  @media screen and (min-width: 480px) {
    .LanguagePickerMobileContainer {
      width: 350px;
      height: fit-content; } }

.LanguagePickerMobileHeading {
  font-size: 20px;
  margin: 20px 0;
  font-weight: 600; }

.LanguagePickerMobileHeadingDivider {
  width: 100%;
  color: black;
  margin: 0; }

.LanguagePickerMobileList {
  width: 100%; }
  @media screen and (min-width: 480px) {
    .LanguagePickerMobileList {
      height: 300px; } }

.InputsNewsletterSubscriberContainer {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding: 20px;
  box-sizing: border-box; }

.InputsNewsletterSubscriberLabel {
  font-size: 20px;
  font-weight: 600;
  margin: 0 0 15px; }

.InputsNewsletterSubscriberControls {
  width: 100%;
  height: auto;
  border: 1px solid rgba(128, 128, 128, 0.3);
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center; }

.InputsNewsletterSubscriberInput {
  height: 100%;
  padding: 15px 20px;
  font-size: 14px; }

.InputsNewsletterSubscriberInputInner {
  cursor: text;
  border: none; }
  .InputsNewsletterSubscriberInputInner::placeholder {
    opacity: .5;
    font-weight: 600; }

.InputsNewsletterSubscriberButton {
  cursor: pointer;
  margin: 0;
  background-color: transparent;
  border: none;
  padding: 15px 20px;
  font-size: 14px;
  font-weight: 600;
  transition: all .3s;
  color: black;
  opacity: 1; }
  .InputsNewsletterSubscriberButton:hover {
    background-color: gray;
    color: white; }
  .InputsNewsletterSubscriberButton-Disabled {
    cursor: initial;
    opacity: .3; }
    .InputsNewsletterSubscriberButton-Disabled:hover {
      background-color: transparent;
      color: black; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ProductQuantitySelectorContainer {
  border: 1px solid rgba(0, 0, 0, 0.15);
  height: 48px;
  max-width: 261px;
  display: flex;
  margin: 10px 0; }
  .ProductQuantitySelectorContainer div {
    min-width: 46px;
    height: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer; }
  .ProductQuantitySelectorContainer div:nth-of-type(1) {
    border-right: 1px solid rgba(0, 0, 0, 0.15); }
  .ProductQuantitySelectorContainer div:nth-of-type(2) {
    border-left: 1px solid rgba(0, 0, 0, 0.15); }

.ProductQuantitySelectorSmallerStyles {
  height: 48px;
  max-width: 172px;
  margin-bottom: 16px; }
  .ProductQuantitySelectorSmallerStyles div {
    min-width: 48px;
    height: 46px; }
  .ProductQuantitySelectorSmallerStyles .ProductQuantitySelectorInput {
    width: 74px; }

.ProductQuantitySelectorInput {
  border: none;
  height: 100%;
  text-align: center;
  width: 109px; }
  .ProductQuantitySelectorInput::-webkit-outer-spin-button {
    -webkit-appearance: none; }
  .ProductQuantitySelectorInput::-webkit-inner-spin-button {
    -webkit-appearance: none; }
  .ProductQuantitySelectorInput[type=number] {
    -moz-appearance: textfield; }

.ProductQuantitySelectorLimit {
  border: 3px solid #CE0000; }

.ProductQuantitySelectorIcons {
  border: none; }

.InputsQuantitySelectDesktopContainer {
  display: flex;
  flex-direction: row;
  width: 150px;
  height: 100%;
  position: relative;
  border: 1px solid rgba(0, 0, 0, 0.6); }

.InputsQuantitySelectDesktopButtons {
  display: flex;
  justify-content: space-between;
  position: absolute;
  right: 0;
  height: 100%; }

.InputsQuantitySelectDesktopIcon {
  height: 50%;
  z-index: 1; }
  .InputsQuantitySelectDesktopIcon:hover {
    background-color: rgba(0, 0, 0, 0.2); }

.InputsQuantitySelectMobileContainer {
  display: flex;
  flex-direction: row;
  position: relative;
  width: 186px;
  border: 1px solid rgba(0, 0, 0, 0.6); }

.InputsQuantitySelectMobileIcon {
  position: absolute;
  height: 100%;
  left: 0;
  width: 40px;
  z-index: 1; }
  .InputsQuantitySelectMobileIcon:hover {
    background-color: rgba(0, 0, 0, 0.2); }

@keyframes InputsSearchContainer-SlideIn {
  from {
    transform: translateX(-100%); }
  to {
    transform: translateX(0px); } }

.InputsSearchContainer {
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: transform .3s;
  z-index: 999; }
  .InputsSearchContainer-Open {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    animation-duration: 0.2s;
    animation-name: InputsSearchContainer-SlideIn; }
    .InputsSearchContainer-Open.Desktop {
      bottom: initial;
      top: 0; }
    .InputsSearchContainer-Open .ButtonSearchContainer {
      position: absolute;
      right: 0px; }
    .InputsSearchContainer-Open-Simple {
      left: 50px; }
      .InputsSearchContainer-Open-Simple .InputsSearchInput-Open .InputsSearchInputSearchIcon {
        position: absolute;
        left: 0;
        top: 15px; }
      .InputsSearchContainer-Open-Simple .InputsSearchInput-Open .InputsSearchInputSearchIcon::after {
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: "Font Awesome 6 Pro";
        font-weight: 300;
        content: "\F002"; }

.InputsSearchForm-Open {
  display: block;
  width: 100%;
  padding: 0 10px; }

.InputsSearchInput {
  color: var(--header-font-color);
  background-color: var(--navbar-bg-color);
  width: 0;
  height: 100%;
  transition: all .3s;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 0;
  position: relative; }
  .InputsSearchInput-Open {
    width: 1920px; }
    .InputsSearchInput-Open .InputsSearchInputCloseIcon::after {
      cursor: pointer;
      display: inline-block;
      font-style: normal;
      font-variant: normal;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      font-family: "Font Awesome 6 Pro";
      font-weight: 300;
      content: "\F00D";
      font-size: 24px;
      color: var(--header-font-color);
      transition: .2s;
      position: absolute;
      right: 40px; }
    .InputsSearchInput-Open .InputsSearchInputCloseIcon:hover::after {
      color: var(--navbar-hf-color); }
    .InputsSearchInput-Open .InputsSearchInputSearchIcon::after {
      cursor: pointer;
      display: inline-block;
      font-style: normal;
      font-variant: normal;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      font-family: "Font Awesome 6 Pro";
      font-weight: 300;
      content: "\F054";
      font-size: 24px;
      color: var(--header-font-color);
      transition: .2s;
      position: absolute;
      right: 10px; }
    .InputsSearchInput-Open .InputsSearchInputSearchIcon:hover::after {
      color: var(--navbar-hf-color); }

.InputsSearchInputInner {
  display: none;
  width: 0;
  border: none;
  background-color: transparent;
  font-size: 16px;
  transition: width .3s;
  outline: none; }
  .InputsSearchInputInner-Open {
    padding-bottom: 10px;
    border-bottom: 1px solid var(--header-font-color);
    display: block;
    width: 100%;
    max-width: 1920px;
    color: var(--header-font-color); }

.GlobalLayoutContainer.PromoBarOverMenu .InputsSearchContainer-Open.Desktop {
  top: 45px; }

@media screen and (min-width: 1024px) {
  .GlobalLayoutContainer.TwoLineNavbar .InputsSearchContainer {
    margin-right: auto; }
    .GlobalLayoutContainer.TwoLineNavbar .InputsSearchContainer form {
      display: block;
      width: 100%;
      padding: 0 10px; }
    .GlobalLayoutContainer.TwoLineNavbar .InputsSearchContainer .ButtonSearchContainer {
      display: none; }
    .GlobalLayoutContainer.TwoLineNavbar .InputsSearchContainer .InputsSearchInput {
      transition: none;
      width: calc((100vw - 150px - 45px - 45px - 45px - 8px)/2); }
      .GlobalLayoutContainer.TwoLineNavbar .InputsSearchContainer .InputsSearchInput .InputsSearchInputCloseIcon::after {
        cursor: pointer;
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: "Font Awesome 6 Pro";
        font-weight: 300;
        content: "\F00D";
        font-size: 24px;
        color: var(--header-font-color);
        position: absolute;
        right: 40px; }
      .GlobalLayoutContainer.TwoLineNavbar .InputsSearchContainer .InputsSearchInput .InputsSearchInputCloseIcon:hover::after {
        color: var(--navbar-hf-color); }
      .GlobalLayoutContainer.TwoLineNavbar .InputsSearchContainer .InputsSearchInput .InputsSearchInputSearchIcon::after {
        cursor: pointer;
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: "Font Awesome 6 Pro";
        font-weight: 300;
        content: "\F002";
        font-size: 24px;
        color: var(--header-font-color);
        position: absolute;
        right: 10px; }
      .GlobalLayoutContainer.TwoLineNavbar .InputsSearchContainer .InputsSearchInput .InputsSearchInputSearchIcon:hover::after {
        color: var(--navbar-hf-color); }
    .GlobalLayoutContainer.TwoLineNavbar .InputsSearchContainer .InputsSearchInputInner {
      transition: none;
      padding-bottom: 10px;
      border-bottom: 1px solid var(--header-font-color);
      display: block;
      width: 100%;
      max-width: 1920px;
      color: var(--header-font-color); } }

.SettingsPickerContainer {
  width: 45px;
  height: 60px;
  position: relative;
  display: none;
  justify-content: center;
  align-items: center; }
  @media screen and (min-width: 1024px) {
    .SettingsPickerContainer {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; } }

.SettingsPickerListContainer {
  padding: 24px 35px;
  width: 100%;
  height: 100%;
  position: relative; }

.SettingsPickerPickerControl {
  font-size: 20px;
  font-weight: 500;
  background-color: unset;
  border: none;
  cursor: pointer;
  height: 100%;
  width: 100%;
  outline: none;
  padding: 0; }
  .SettingsPickerPickerControl:hover .SettingsPickerPickerControlInner {
    opacity: 1; }
  .SettingsPickerPickerControl:focus .SettingsPickerPickerControlInner {
    text-decoration: underline; }

.SettingsPickerPickerControlInner {
  opacity: .6;
  transition: all .3s; }

.SettingsPickerPickerWrapper {
  position: absolute;
  top: 60px;
  right: 0;
  width: 250px;
  border: solid 1px rgba(0, 0, 0, 0.15);
  border-top: none;
  background-color: white; }

.SettingsPickerDivider {
  position: relative;
  width: 100%;
  font-size: 12px;
  display: flex;
  justify-content: center;
  padding: 10px; }
  .SettingsPickerDivider::after, .SettingsPickerDivider::before {
    content: '';
    height: 1px;
    position: absolute;
    background: rgba(0, 0, 0, 0.2);
    width: 40%;
    margin: 0 1px;
    top: calc(50% - 1px / 2); }
  .SettingsPickerDivider::before {
    right: 0; }
  .SettingsPickerDivider::after {
    left: 0; }

.SettingsPickerSettingsControls {
  margin-top: 38px; }

.SettingsPickerLogoutControl {
  width: 100%;
  position: absolute;
  bottom: 24px;
  padding: 0 35px;
  left: calc(50% - 100% / 2); }

.SettingsPickerUserIcon {
  opacity: 1;
  transition-property: opacity;
  transition-duration: .3s; }
  .SettingsPickerUserIcon::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F4FE";
    font-size: 24px;
    color: var(--header-font-color);
    transition: .2s; }
  .SettingsPickerUserIcon:hover::after, .SettingsPickerUserIcon.LoggedIn::after {
    color: var(--navbar-hf-color); }

.InputsSharedSelectorAnimatedListWrapper {
  width: 100%;
  height: 100%; }
  .InputsSharedSelectorAnimatedListWrapper-Loading {
    min-height: 300px; }
    @media screen and (min-width: 480px) {
      .InputsSharedSelectorAnimatedListWrapper-Loading {
        min-height: unset; } }

.InputsSharedSelectorAnimatedListContainer {
  width: 100%;
  height: 100%;
  list-style: none;
  overflow-y: scroll;
  overflow-x: hidden;
  margin: 0;
  padding: 10px;
  /* width */
  /* Track */
  /* Handle */
  /* Handle on hover */ }
  @media screen and (min-width: 1024px) {
    .InputsSharedSelectorAnimatedListContainer {
      padding: 0; } }
  .InputsSharedSelectorAnimatedListContainer-NoScroll {
    overflow-y: hidden; }
  .InputsSharedSelectorAnimatedListContainer::-webkit-scrollbar {
    width: 2px; }
  .InputsSharedSelectorAnimatedListContainer::-webkit-scrollbar-track {
    background: #f1f1f1; }
  .InputsSharedSelectorAnimatedListContainer::-webkit-scrollbar-thumb {
    background: #818181; }
  .InputsSharedSelectorAnimatedListContainer::-webkit-scrollbar-thumb:hover {
    background: #646464; }

.InputsTagCloudContainer {
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none; }
  @media screen and (max-width: 768px) {
    .InputsTagCloudContainer {
      padding-bottom: 16px;
      padding-left: 16px; } }

.InputsTagCloudItem {
  width: fit-content;
  margin: 0 0 5px 5px; }

.InputsTagCloudButton {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  border: 2px solid #f0f0f0;
  background-color: #f0f0f0;
  padding: 2px 10px;
  transition: all .3s;
  cursor: pointer;
  opacity: .6; }
  .InputsTagCloudButton:hover {
    background-color: rgba(102, 102, 102, 0.7);
    box-shadow: 0 0 10px #666;
    background-color: rgba(240, 240, 240, 0.7);
    box-shadow: 0 0 10px #f0f0f0;
    opacity: 1; }
    .InputsTagCloudButton:hover .InputsTagCloudButtonLabel {
      opacity: 1; }
  .InputsTagCloudButton .InputsTagCloudButtonLabel {
    color: unset; }
  .InputsTagCloudButton-Selected {
    border: 2px solid #666;
    opacity: 1; }
    .InputsTagCloudButton-Selected .InputsTagCloudButtonLabel {
      opacity: 1; }
    .InputsTagCloudButton-Selected:hover {
      background-color: rgba(102, 102, 102, 0.7);
      box-shadow: 0 0 10px #666; }

.InputsTagCloudButtonLabel {
  cursor: pointer;
  font-size: 14px;
  font-weight: 400;
  opacity: .7;
  transition: all .3s; }

.InputsTagCloudCountLabel {
  margin-left: 4px;
  font-size: 12px;
  font-weight: 400;
  opacity: .7;
  transition: all .3s;
  min-width: 2em; }

.TextareafieldContainer {
  width: 100%;
  height: 150px;
  border: 2px solid;
  border-color: rgba(0, 0, 0, 0.15);
  transition: border .3s;
  margin-top: 10px; }
  .TextareafieldContainer:hover {
    border-color: rgba(0, 0, 0, 0.3); }
  .TextareafieldContainer-Error {
    border-color: red; }

.TextareafieldInput {
  display: block;
  width: 100%;
  height: 100% !important;
  font-size: 14px;
  cursor: text;
  border: none;
  padding: 10px;
  text-align: left; }
  .TextareafieldInput::placeholder {
    opacity: .5;
    font-weight: 600;
    font-size: 14px; }
  .TextareafieldInput-AlignedRight {
    text-align: right; }
  .TextareafieldInput-IsShort {
    padding: 2px 10px; }

.InputsTextfieldFormContainer {
  display: flex;
  flex-direction: column;
  width: 100%; }
  @media screen and (min-width: 768px) {
    .InputsTextfieldFormContainer {
      flex-direction: row;
      align-items: center; } }

.InputsTextfieldFormLabel {
  min-width: 300px; }
  @media screen and (min-width: 768px) {
    .InputsTextfieldFormLabel {
      margin-right: 10px; } }

.InputsTextfieldFormLabelText {
  font-size: 18px;
  font-weight: 600;
  opacity: .6; }
  @media screen and (min-width: 768px) {
    .InputsTextfieldFormLabelText {
      text-align: end; } }

.InputsTextfieldFormInput {
  min-width: 350px;
  position: relative; }

.InputsTextfieldFormError {
  display: none;
  position: absolute;
  left: 0;
  bottom: -20px;
  width: 100%;
  font-size: 12px;
  color: red; }
  .InputsTextfieldFormError-Visible {
    display: initial; }

.InputsTextfieldContainer {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  height: 40px;
  transition: border .3s;
  margin-top: 10px; }
  .InputsTextfieldContainer:hover {
    border-color: black; }
  .InputsTextfieldContainer-Error {
    border-color: red; }
  .InputsTextfieldContainer-IsShort {
    height: 30px; }

.InputsTextfieldInput {
  font-size: 14px;
  cursor: text;
  border: 1px solid rgba(0, 0, 0, 0.5);
  height: 100%;
  padding: 10px;
  width: 100%;
  text-align: left; }
  .InputsTextfieldInput::placeholder {
    opacity: .5;
    font-weight: 600;
    font-size: 14px; }
  .InputsTextfieldInput-AlignedRight {
    text-align: right; }
  .InputsTextfieldInput-IsShort {
    padding: 2px 10px; }

.InputsTextfieldVisibility {
  position: absolute;
  right: 20px; }

.InputsTextfieldNumberPickerContainer {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%; }

.InputsTextfieldNumberPickerLabel {
  font-size: 16px;
  margin-right: 10px; }

.InputsTextfieldPasswordContainer {
  width: 100%;
  position: relative; }

.InputsTextfieldPasswordVisibility {
  position: absolute;
  right: 20px;
  top: 13px; }

.CartUnitSelectorContainer {
  position: relative;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-right: 10px; }
  @media screen and (min-width: 1024px) {
    .CartUnitSelectorContainer {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; } }

.CartUnitSelectorPickerControl {
  background-color: #fff;
  border: 2px solid rgba(0, 0, 0, 0.2);
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  padding: 0;
  cursor: pointer; }

.CartUnitSelectorUnit {
  padding: 0 15px 0 15px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center; }

.CartUnitSelectorPickerWrapper {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  border: solid 1px rgba(0, 0, 0, 0.15);
  border-top: none;
  background-color: white; }
  .CartUnitSelectorPickerWrapper button {
    width: 100%;
    padding: 8px;
    background-color: #fff;
    border: none;
    font-size: 12px;
    cursor: pointer;
    border-top: solid 1px rgba(0, 0, 0, 0.15); }
  .CartUnitSelectorPickerWrapper button:first-of-type {
    border: none; }

.CartUnitSelectorUnitDropdown {
  padding: 0 10px 0 10px;
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center; }

.CartUnitSelectorUnitDropdownIcon::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\F0D7"; }

.LeafletMapPopupContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 5px; }

.LeafletMapPopupName {
  margin-bottom: 10px; }

.LeafletMapContainer {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center; }

.LeafletMapRedirectIcon {
  padding-left: 2px;
  position: relative !important; }

.LeafletMapRedirect {
  display: flex;
  justify-content: center;
  margin: 10px 0;
  cursor: pointer; }

.InputsLoginControlFooterContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 450px;
  width: 100%; }

.InputsLoginControlFooterHeading {
  margin: 0 0 0 10px;
  font-size: 20px;
  font-weight: 600;
  margin: 20px 0; }

.InputsLoginControlHeaderContainer {
  max-width: 450px;
  width: 100%; }

.InputsLoginControlHeaderIcon {
  font-size: 20px; }

.InputsLoginControlHeaderHeading {
  font-size: 24px;
  font-weight: 500; }
  @media screen and (max-width: 480px) {
    .InputsLoginControlHeaderHeading {
      margin-bottom: 32px; } }

.InputsLoginControlContainer {
  width: 100%;
  height: 100%; }
  @media screen and (min-width: 768px) {
    .InputsLoginControlContainer {
      width: 600px;
      height: unset; } }

.InputsLoginControlHeader {
  margin: 30px 0; }

.InputsLoginControlLogin {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  align-items: center;
  width: 100%;
  padding: 0 10px;
  margin: 32px 0 70px;
  flex-grow: 1; }
  @media screen and (max-width: 768px) {
    .InputsLoginControlLogin {
      padding-bottom: 24px; } }
  @media screen and (min-width: 1024px) {
    .InputsLoginControlLogin {
      flex-grow: 0; } }

.InputsLoginControlFooter {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 10px 10px 40px;
  background-color: #f0f0f0;
  margin: 0 20px; }
  @media screen and (min-width: 480px) {
    .InputsLoginControlFooter {
      padding: 10px 0 40px; } }

.InputsLoginControlDivider {
  width: 100%;
  color: black;
  margin: 0; }

.MaintenanceUserContainer {
  width: 100vw;
  height: 100vh;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: center; }

.MaintenanceSystemContainer {
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  text-align: center;
  flex-direction: column;
  background-color: #1ED9DE; }

.MaintenanceImage {
  max-height: 50vh;
  display: flex;
  justify-content: center; }
  .MaintenanceImage img {
    height: 100%; }

.MaintenanceTitle {
  color: #264463;
  font-size: 30px; }

.MaintenanceParagraph {
  color: #264463; }

.MaterialElementsBreadcrumbsContainer {
  width: 100%;
  margin: 0 10px 10px 10px;
  padding: 0; }

.MaterialElementsDialogList {
  display: flex;
  flex-direction: row;
  list-style: none;
  padding: 0;
  margin: 0; }

.MaterialElementsFormCheckboxContainer {
  display: flex;
  flex-direction: row;
  width: 100%; }

.MaterialElementsFormCheckboxExternal {
  padding: 5px;
  flex: 1; }

.CheckboxStyledCheckbox {
  position: relative;
  cursor: pointer;
  padding: 0;
  border-color: #000000; }
  .CheckboxStyledCheckbox::before {
    content: '';
    display: inline-block;
    vertical-align: text-top;
    width: 16px;
    height: 16px;
    background: #fff;
    border-width: 1px;
    border-style: solid;
    border-color: inherit;
    transition: .2s; }
  .CheckboxStyledCheckbox:hover .CheckboxStyledCheckbox::before {
    box-shadow: 0 0 0 3px black; }

.CheckboxCheckbox {
  position: absolute;
  opacity: 0;
  width: 24px;
  height: 24px;
  z-index: 2; }
  .CheckboxCheckbox:checked + .CheckboxStyledCheckbox::before {
    background: inherit;
    border: 2px solid #fff; }
  .CheckboxCheckbox:checked + .CheckboxStyledCheckbox::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F00C";
    color: #fff;
    position: absolute;
    width: 100%;
    top: 5px;
    text-align: center;
    left: 0; }
  .CheckboxCheckbox:disabled + .CheckboxStyledCheckbox::before {
    background: #d6d6d6; }

.MaterialElementsSelectFormContainer {
  width: 100%;
  padding-bottom: 20px; }

.MaterialElementsSelectFormLabelText {
  font-size: 14px;
  font-variant-caps: all-petite-caps;
  color: gray; }

.MaterialElementsSelectFormSelect {
  position: relative;
  margin-top: 8px;
  background: #fff; }

.MaterialElementsSelectFormError {
  position: absolute;
  left: 0;
  bottom: -20px;
  width: 100%;
  font-size: 12px;
  color: red;
  display: none; }
  .MaterialElementsSelectFormError-Visible {
    display: initial; }

.MaterialElementsSelectProductPageContainer {
  display: flex;
  flex-direction: column;
  width: 100%; }

.MaterialElementsSelectProductPageLabel {
  font-size: 12px;
  text-decoration: underline;
  font-weight: 600;
  align-self: flex-end;
  margin: 15px 0 0; }

.MaterialElementsSelectProductPageSelect {
  width: 100%;
  margin: 5px 0 0; }

.MaterialElementsModalContainer {
  position: relative;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  background-color: white;
  box-shadow: 0 0 15px #999; }
  .MaterialElementsModalContainer-Mobile {
    position: absolute;
    box-shadow: unset; }

.MaterialElementsModalClose {
  position: absolute;
  top: 10px;
  right: 10px; }
  .MaterialElementsModalClose-Mobile {
    top: 20px;
    right: 20px; }

.OrderTableOrder {
  cursor: pointer; }

.ProductsTablePhoto {
  width: 70px; }
  .ProductsTablePhoto img {
    width: 100%; }

.ProductsTableLink {
  cursor: pointer; }

.SpinnerLoader {
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 3px solid rgba(37, 37, 37, 0.3);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite; }

@keyframes spin {
  to {
    -webkit-transform: rotate(360deg); } }

@-webkit-keyframes spin {
  to {
    -webkit-transform: rotate(360deg); } }

.MaterialElementsSpinnerWrapperContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  overflow: hidden; }

.MenusMobileWrapper {
  position: fixed;
  top: 60px;
  right: 0;
  bottom: 60px;
  width: 0;
  z-index: 1099;
  overflow: hidden;
  opacity: 0;
  transition: all 0.3s; }
  .MenusMobileWrapper-Open {
    opacity: 1;
    width: 100%;
    transition: all 0.3s; }
  .MenusMobileWrapper .MenusMobileHeader {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 45px;
    background-color: #F0F0F0;
    border-bottom: 1px solid #E0E0E0; }
    .MenusMobileWrapper .MenusMobileHeader div.Button {
      position: absolute;
      top: 0;
      right: 0;
      min-width: 45px;
      min-height: 45px; }
      .MenusMobileWrapper .MenusMobileHeader div.Button.Back {
        right: auto;
        left: 0;
        opacity: 0;
        transition: opacity 0.5s; }
        .MenusMobileWrapper .MenusMobileHeader div.Button.Back.BackButtonVisible {
          opacity: 1;
          transition: opacity 0.5s; }
      .MenusMobileWrapper .MenusMobileHeader div.Button button {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 45px;
        height: 45px;
        border: 0;
        font-size: 24px;
        background-color: transparent; }
    .MenusMobileWrapper .MenusMobileHeader div.Caption {
      width: 100%;
      padding: 0 0.5em;
      display: flex;
      direction: row;
      align-items: center;
      height: 45px;
      margin-left: 15px;
      transition: margin 0.5s; }
      .MenusMobileWrapper .MenusMobileHeader div.Caption.BackButtonVisible {
        margin-left: 35px;
        transition: margin 0.5s; }
  .MenusMobileWrapper .MenusMobileContainer {
    position: absolute;
    left: 0;
    right: 0;
    top: 45px;
    bottom: 0;
    display: block;
    overflow-x: hidden;
    overflow-y: scroll;
    background-color: white; }

.MenusMobileAccountContainer {
  width: 100%;
  height: 100%;
  padding: 20px; }
  .MenusMobileAccountContainer h2 {
    font-weight: normal;
    font-size: 16px;
    padding-bottom: 0.5em;
    margin-bottom: 1.5em;
    border-bottom: 2px solid #DD4000; }
  .MenusMobileAccountContainer .ButtonSimpleAnimatedContainer {
    height: 32px; }
  .MenusMobileAccountContainer .ButtonSimpleAnimatedTextLabel {
    font-weight: normal;
    font-size: 14px; }

.MenusMobileAccountMenu {
  width: 100%;
  margin-bottom: 2em; }
  .MenusMobileAccountMenu ul {
    padding: 0;
    list-style: none; }
    .MenusMobileAccountMenu ul li {
      font-size: 16px;
      border-bottom: 1px solid #E0E0E0;
      cursor: pointer; }
      .MenusMobileAccountMenu ul li div {
        height: 55px;
        display: flex;
        direction: row;
        justify-content: space-between;
        align-items: center; }

.MenusMobileSettingsContainer {
  display: flex;
  direction: row;
  justify-content: space-around;
  align-items: center;
  margin-bottom: 1.5em; }
  .MenusMobileSettingsContainer > button {
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.3); }

.MenusMobileLoginFormContainer {
  width: 100%;
  height: 100%;
  padding: 20px; }
  .MenusMobileLoginFormContainer h2 {
    font-weight: normal;
    font-size: 16px;
    padding-bottom: 0.5em;
    margin-bottom: 1.5em;
    border-bottom: 2px solid #DD4000; }
  .MenusMobileLoginFormContainer .InputsAdaptedCheckboxWrapperCheckboxName {
    font-size: 14px; }

.MenusMobileLoginFormForgotPassword {
  margin-top: 2em;
  font-size: 13px; }

.MenusMobileLoginFormButtons {
  margin-top: 2em; }
  .MenusMobileLoginFormButtons .SettingsPickerDivider {
    margin: 1.25em 0; }
  .MenusMobileLoginFormButtons .ButtonSimpleAnimatedContainer {
    height: 48px; }
  .MenusMobileLoginFormButtons .ButtonSimpleAnimatedTextLabel {
    font-weight: normal;
    font-size: 14px; }

.MenusMobileTreeContainer {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow-x: hidden;
  overflow-y: auto; }

.MenusMobileTreeItems {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: none;
  opacity: 0; }
  .MenusMobileTreeItems ul {
    padding: 0;
    margin: 25px;
    list-style: none; }
    .MenusMobileTreeItems ul li {
      display: flex;
      direction: row;
      justify-content: space-between;
      align-items: center;
      font-size: 16px;
      height: 55px;
      border-bottom: 1px solid #E0E0E0;
      cursor: pointer; }
      .MenusMobileTreeItems ul li div {
        display: flex;
        direction: row;
        align-items: center; }
        .MenusMobileTreeItems ul li div .image {
          margin-right: 10px; }

.MenusNavbarControlsContainer {
  margin-right: 8px;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  position: relative;
  padding: 0;
  background: transparent;
  z-index: 1001; }
  @media screen and (max-width: 1024px) {
    .MenusNavbarControlsContainer {
      border-bottom: none;
      margin-right: 6px;
      background-color: var(--navbar-bg-color); } }

.GlobalLayoutContainer.TwoLineNavbar .MenusNavbarControlsContainer {
  width: 100%; }

.MenusNavbarControlsSection {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 45px;
  height: 60px; }
  .MenusNavbarControlsSectionLong {
    width: 80px; }

.MenusNavbarControlsSectionSpecial {
  display: none;
  position: relative;
  z-index: 2;
  transition: opacity .3s;
  width: 45px;
  height: 60px; }
  @media screen and (min-width: 1024px) {
    .MenusNavbarControlsSectionSpecial {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; } }

.CategoryTreeMenuPositionGeneratorContainerWithSubmenu, .CategoryTreeMenuPositionGeneratorContainerNoSubmenu {
  margin: 0 0 30px 20px;
  display: block;
  max-height: 100%; }
  .CategoryTreeMenuPositionGeneratorContainerWithSubmenu button, .CategoryTreeMenuPositionGeneratorContainerNoSubmenu button {
    text-align: left; }

.CategoryTreeMenuPositionGeneratorButtonWithSubmenu, .CategoryTreeMenuPositionGeneratorButtonNoSubmenu {
  display: block;
  cursor: pointer;
  background-color: unset;
  border: unset;
  font-family: var(--menu-category-font-family);
  font-weight: var(--menu-category-font-weight);
  font-style: var(--menu-category-font-style);
  font-size: var(--menu-category-font-size);
  /*nowe style:
    font-size: 13px; //Nie powinno się nadpisywać ustawień wersji kolorystycznej
    margin-bottom: 24px;*/
  transition: .3s;
  align-self: flex-start;
  color: var(--menu-category-color);
  text-decoration: none; }
  .CategoryTreeMenuPositionGeneratorButtonWithSubmenu:hover, .CategoryTreeMenuPositionGeneratorButtonNoSubmenu:hover {
    color: var(--main-color) !important; }

.CategoryTreeMenuPositionGeneratorSubmenuHeader {
  display: flex;
  align-items: center;
  gap: 0.6em; }
  .CategoryTreeMenuPositionGeneratorSubmenuHeader > span {
    cursor: pointer;
    font-size: 0.8em;
    color: #8F8F8F;
    padding: 0 .2em; }

.CategoryTreeMenuPositionGeneratorSubmenu {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  overflow: hidden; }

.CategoryTreeMenuPositionGeneratorItemButton {
  display: block;
  cursor: pointer;
  background-color: unset;
  border: unset;
  font-size: var(--menu-subcategory-font-size);
  /*nowe style:
    font-size: 13px; //Nie powinno się nadpisywać ustawień wersji kolorystycznej
    */
  font-weight: normal;
  margin: 0 0 6px;
  transition: all .3s;
  line-height: 21px;
  text-decoration: none;
  color: inherit;
  /*nowe style:
    color: #8F8F8F; //Nie powinno się nadpisywać ustawień wersji kolorystycznej
    */ }
  .CategoryTreeMenuPositionGeneratorItemButton:hover {
    color: var(--main-color) !important; }

.CategoryTreeMenuPositionGeneratorPictogram {
  position: relative;
  height: 150px;
  width: 100%;
  margin-bottom: 10px; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.CategoryTreeMenuTabulatorContainer {
  min-height: 100%;
  position: relative;
  border-right: 4px solid var(--main-color); }
  .CategoryTreeMenuTabulatorContainer span {
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    padding: 10px;
    cursor: pointer; }
    .CategoryTreeMenuTabulatorContainer span svg {
      cursor: pointer; }
  .CategoryTreeMenuTabulatorContainer ul {
    padding: 0;
    margin: 0;
    height: 100%;
    list-style: none;
    display: flex;
    flex-direction: column;
    position: relative; }

.CategoryTreeMenuTabulatorItem {
  width: 100%;
  word-wrap: break-word; }
  .CategoryTreeMenuTabulatorItem:first-of-type {
    padding-top: 40px; }
  .CategoryTreeMenuTabulatorItem:last-of-type {
    padding-bottom: 6px;
    height: 100%; }

.CategoryTreeMenuTabulatorItemInner {
  display: block;
  cursor: pointer;
  margin: 0 0 5px;
  background-color: unset;
  border: none;
  font-weight: bold;
  font-size: 14px;
  transition: .3s;
  text-align: left;
  text-decoration: none;
  font-size: 18px;
  padding-bottom: 10px;
  position: relative;
  width: 100%;
  padding-right: 30px;
  border-bottom: 4px solid transparent;
  color: inherit; }
  .CategoryTreeMenuTabulatorItemInner span {
    padding: 3px 10px 0 0;
    font-size: 22px; }
  .CategoryTreeMenuTabulatorItemInner-Empty::after {
    display: none; }
  .CategoryTreeMenuTabulatorItemInner-Selected {
    opacity: 1;
    color: var(--main-color) !important;
    border-bottom: 4px solid var(--main-color); }
    .CategoryTreeMenuTabulatorItemInner-Selected::after {
      right: -9px;
      top: 0;
      bottom: 0;
      position: absolute;
      margin-left: 5px;
      content: "";
      width: 9px;
      height: 31px;
      color: #333333;
      height: 100%;
      background-color: #fff; }
    .CategoryTreeMenuTabulatorItemInner-Selected::before {
      color: var(--main-color) !important; }

.CategoryTreeMenuTabulatorPictogram {
  position: relative;
  height: 100px;
  width: 100px;
  margin-bottom: 10px; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.MenusCategoryTreeMenuContainer {
  position: absolute;
  left: 0;
  top: 0;
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: calc(max(500px, 50vh));
  grid-template-areas: "tabs tabContent";
  scrollbar-width: 0; }
  .MenusCategoryTreeMenuContainer ::-webkit-scrollbar {
    width: 0; }
  .MenusCategoryTreeMenuContainerType3 .CategoryTreeMenuPositionGeneratorButtonWithSubmenu, .MenusCategoryTreeMenuContainerType3 .CategoryTreeMenuPositionGeneratorButtonNoSubmenu {
    margin-bottom: 24px; }
  .MenusCategoryTreeMenuContainerType4 .MenusCategoryTreeMenuContent {
    width: 40vw; }
  .MenusCategoryTreeMenuContainerType4 .MenusCategoryTreeMenuContentImage {
    width: calc(min(500px, 15vw)); }
  .MenusCategoryTreeMenuContainerType2 {
    grid-template-areas: "tabs" "tabContent";
    grid-template-columns: calc(min(100vw, var(--globalContainerWidth)) - 8px - 10px);
    grid-template-rows: auto calc(max(500px, 50vh)); }
    .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator {
      width: 100%;
      border-bottom: 4px solid var(--main-color); }
      .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorContainer {
        border-right: none; }
        .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorContainer ul {
          flex-direction: row;
          justify-content: center;
          gap: 2em;
          padding: 15px;
          align-items: flex-end; }
      .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorItem {
        width: auto; }
        .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorItem:first-of-type {
          padding-top: unset; }
        .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorItem:last-of-type {
          display: none; }
      .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorItemInner {
        border-bottom: none;
        padding: 0;
        margin: 0; }
        .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorItemInner span {
          display: none; }
        .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorItemInner::after {
          display: inline-block;
          font-style: normal;
          font-variant: normal;
          text-rendering: auto;
          -webkit-font-smoothing: antialiased;
          font-family: "Font Awesome 6 Pro";
          font-weight: 300;
          content: "\F078";
          margin-left: 10px; }
        .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorItemInner-Empty::after {
          display: none; }
        .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorItemInner-Selected {
          border-bottom: none; }
          .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuTabulator .CategoryTreeMenuTabulatorItemInner-Selected::after {
            position: unset;
            width: unset;
            height: unset;
            color: unset;
            background-color: unset;
            margin-left: 10px; }
    .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuContent {
      width: 100%; }
    .MenusCategoryTreeMenuContainerType2 .MenusCategoryTreeMenuContentImage {
      width: calc(min(500px, 25vw) + 250px); }

.MenusCategoryTreeMenuTabulator {
  grid-area: tabs;
  padding: 0 0 0 10px;
  width: 250px;
  height: 100%;
  background-color: #fff;
  overflow-y: auto;
  overflow-x: hidden;
  box-shadow: -10px 10px 10px -10px rgba(0, 0, 0, 0.3); }

.MenusCategoryTreeMenuContent {
  grid-area: tabContent;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "tabSubmenu tabImage";
  border: 0;
  border-left: none;
  width: calc(min(100vw, var(--globalContainerWidth)) - 250px - 8px - 10px);
  background-color: #fff;
  height: 100%;
  box-shadow: 10px 10px 10px -10px rgba(0, 0, 0, 0.3); }
  .MenusCategoryTreeMenuContentImageOnly {
    grid-template-columns: auto;
    grid-template-areas: "tabImage"; }
    .MenusCategoryTreeMenuContentImageOnly .MenusCategoryTreeMenuContentImage {
      width: inherit; }

.MenusCategoryTreeMenuContentSubMenu {
  grid-area: tabSubmenu;
  padding: 30px;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: #bdbdbd #f7f7f7; }
  .MenusCategoryTreeMenuContentSubMenu ::-webkit-scrollbar {
    width: 12px; }
  .MenusCategoryTreeMenuContentSubMenu ::-webkit-scrollbar-track {
    background: #f7f7f7;
    border-radius: 20px; }
  .MenusCategoryTreeMenuContentSubMenu ::-webkit-scrollbar-thumb {
    background-color: #bdbdbd;
    border-radius: 20px;
    border: 3px solid #f7f7f7; }

.MenusCategoryTreeMenuContentImage {
  grid-area: tabImage;
  position: relative;
  width: calc(min(500px, 25vw)); }

.MenusCategoryTreeMenuContentProducts {
  overflow: hidden; }

.MenusCategoryTreeMenuContentList {
  display: flex;
  flex-direction: row;
  opacity: 0;
  padding: 0;
  flex-wrap: wrap;
  transition: .2s;
  align-items: flex-start;
  justify-content: flex-start;
  align-content: flex-start;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%; }

.MenusCategoryTreeMenuContentListWrap {
  opacity: 1; }

.CategoryIconsSubMenuContainer {
  width: 100%;
  max-width: var(--globalContainerWidth);
  height: 50vh;
  min-height: 500px;
  display: grid;
  grid-template-columns: 25vw 1fr;
  grid-template-rows: 100%;
  grid-template-areas: "image categories";
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); }

.CategoryIconsSubMenuImage {
  grid-area: image;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(240, 32, 32, 0.6);
  position: relative; }
  .CategoryIconsSubMenuImage span {
    color: white;
    font-size: 256px; }

.CategoryIconsSubMenuCategories {
  grid-area: categories;
  padding: 1em;
  overflow: hidden;
  overflow-y: auto; }
  .CategoryIconsSubMenuCategories ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 2em; }
    .CategoryIconsSubMenuCategories ul li {
      cursor: pointer;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 0.5em 1em;
      width: 10vw;
      text-align: center; }
      .CategoryIconsSubMenuCategories ul li svg {
        font-size: 36px; }
      .CategoryIconsSubMenuCategories ul li h2 {
        font-size: 13px;
        font-weight: 900;
        margin-top: 2em; }
      .CategoryIconsSubMenuCategories ul li:hover {
        color: #CE0000; }

.NavbarExpandableListItemList {
  display: flex;
  width: 100%;
  height: 59.9px;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 40px; }

.ManufacturersMenuContainer {
  width: 100%;
  padding: 1em;
  overflow: hidden;
  overflow-y: auto;
  max-width: var(--globalContainerWidth);
  margin: 0 auto;
  justify-content: space-between;
  display: flex;
  min-height: 500px;
  height: 50vh; }
  .ManufacturersMenuContainer ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 2em; }
    .ManufacturersMenuContainer ul li {
      cursor: pointer;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 0.5em 1em;
      width: 10vw;
      text-align: center; }
      .ManufacturersMenuContainer ul li:hover {
        background-color: #D4D4D4; }
      .ManufacturersMenuContainer ul li a {
        display: block;
        text-decoration: none;
        color: inherit; }

.MenusNavbarListItemContainer {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  height: 60px;
  cursor: pointer;
  width: auto;
  max-width: none;
  overflow: auto;
  text-decoration: none; }
  @media screen and (min-width: 1200px) {
    .MenusNavbarListItemContainer {
      max-width: none; } }
  @media screen and (min-width: 1440px) {
    .MenusNavbarListItemContainer {
      max-width: none; } }
  .MenusNavbarListItemContainer-Shortened {
    height: 100%;
    width: fit-content;
    max-width: 128px;
    overflow: hidden; }
    @media screen and (min-width: 1200px) {
      .MenusNavbarListItemContainer-Shortened {
        padding: 0 10px;
        max-width: 140px; } }
    @media screen and (min-width: 1440px) {
      .MenusNavbarListItemContainer-Shortened {
        padding: 0 10px;
        max-width: 160px; } }
  .MenusNavbarListItemContainer > .MenusNavbarListItemLabel {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    text-align: left;
    width: auto;
    text-overflow: unset;
    font-weight: bold;
    text-decoration: none;
    color: var(--header-font-color);
    transition: .2s; }
    @media screen and (min-width: 1200px) {
      .MenusNavbarListItemContainer > .MenusNavbarListItemLabel {
        width: auto; } }
    @media screen and (min-width: 1440px) {
      .MenusNavbarListItemContainer > .MenusNavbarListItemLabel {
        width: auto; } }
    .MenusNavbarListItemContainer > .MenusNavbarListItemLabel-Shortened {
      margin: 21px 0 0;
      display: initial;
      text-align: center;
      width: 80px;
      overflow: hidden;
      text-overflow: ellipsis; }
      @media screen and (min-width: 1200px) {
        .MenusNavbarListItemContainer > .MenusNavbarListItemLabel-Shortened {
          width: 100px; } }
      @media screen and (min-width: 1440px) {
        .MenusNavbarListItemContainer > .MenusNavbarListItemLabel-Shortened {
          width: 120px; } }
    .MenusNavbarListItemContainer > .MenusNavbarListItemLabel-Highlight {
      color: var(--navbar-hl-color); }
    .MenusNavbarListItemContainer > .MenusNavbarListItemLabel:hover {
      color: var(--navbar-hf-color); }

.MenusNavbarListItemImage {
  position: relative;
  height: 2em;
  width: 2em;
  margin-right: 0.5em; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.MenusNavbarDesktopNavigationListContainer {
  display: none;
  height: 59.5px;
  z-index: 999;
  width: 100%; }
  @media screen and (min-width: 1024px) {
    .MenusNavbarDesktopNavigationListContainer {
      display: initial;
      max-width: 100%;
      overflow: auto;
      overflow-y: hidden;
      /* Hide scrollbar for Chrome, Safari and Opera */
      /* Let's get this party started */
      -ms-overflow-style: none;
      /* IE and Edge */
      scrollbar-width: none;
      /* Firefox */ }
      .MenusNavbarDesktopNavigationListContainer::-webkit-scrollbar {
        display: none; } }
  .MenusNavbarDesktopNavigationListContainerType4 {
    overflow: unset;
    overflow-y: unset; }
    .MenusNavbarDesktopNavigationListContainerType4 .MenusNavbarDesktopNavigationListList li.CategoryMenuPosition {
      position: relative; }

.MenusNavbarDesktopNavigationListList {
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: row;
  align-items: center;
  list-style: none;
  justify-content: center;
  margin: 0;
  padding: 0;
  max-width: var(--globalContainerWidth);
  font-size: 16px; }
  @media screen and (min-width: 1920px) {
    .MenusNavbarDesktopNavigationListList li.ContainerMenuPosition .MenusNavbarDesktopNavigationListSubmenu {
      margin-left: calc(-100vw / 2 + var(--globalContainerWidth) / 2);
      margin-right: calc(-100vw / 2 + var(--globalContainerWidth) / 2); } }
  .MenusNavbarDesktopNavigationListList .MenusNavbarDesktopNavigationListItem {
    padding: 0 15px; }
  @media screen and (max-width: 1440px) {
    .MenusNavbarDesktopNavigationListList {
      font-size: 14px; }
      .MenusNavbarDesktopNavigationListList .MenusNavbarDesktopNavigationListItem {
        padding: 0 10px; } }

.MenusNavbarDesktopNavigationListItem {
  height: 60px; }
  .MenusNavbarDesktopNavigationListItem-Active {
    color: var(--main-color) !important; }

.ContainerMenuPosition.ColumnLayout {
  position: relative; }
  .ContainerMenuPosition.ColumnLayout > .MenusNavbarDesktopNavigationListSubmenu {
    left: 0;
    right: unset;
    width: 215px; }
    .ContainerMenuPosition.ColumnLayout > .MenusNavbarDesktopNavigationListSubmenu > .NavbarExpandableListItemList {
      height: 100%;
      flex-direction: column;
      gap: 0;
      padding: 0;
      align-items: flex-start;
      padding-top: 1px;
      padding-bottom: 25px; }
      .ContainerMenuPosition.ColumnLayout > .MenusNavbarDesktopNavigationListSubmenu > .NavbarExpandableListItemList > .MenusNavbarListItemContainer {
        padding-left: 20px;
        padding-bottom: 10px;
        align-items: flex-end;
        height: 47px;
        transition: .3s;
        width: 100%;
        justify-content: flex-start; }
        .ContainerMenuPosition.ColumnLayout > .MenusNavbarDesktopNavigationListSubmenu > .NavbarExpandableListItemList > .MenusNavbarListItemContainer:hover {
          border-left: 4px solid white; }
        .ContainerMenuPosition.ColumnLayout > .MenusNavbarDesktopNavigationListSubmenu > .NavbarExpandableListItemList > .MenusNavbarListItemContainer > .MenusNavbarListItemLabel {
          width: 100%;
          display: block; }

.MenusNavbarDesktopNavigationListSubmenu {
  position: absolute;
  top: 60px;
  left: 0;
  right: 0;
  display: none;
  background-color: var(--bg);
  -webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1); }
  .MenusNavbarDesktopNavigationListSubmenu-Active {
    display: initial; }
  .MenusNavbarDesktopNavigationListSubmenuReversed .MenusCategoryTreeMenuContainer {
    right: 0;
    left: unset;
    grid-template-areas: "tabContent tabs"; }
  .MenusNavbarDesktopNavigationListSubmenuReversed .MenusCategoryTreeMenuTabulator {
    box-shadow: 10px 10px 10px -10px rgba(0, 0, 0, 0.3);
    padding: 0 10px 0 0; }
  .MenusNavbarDesktopNavigationListSubmenuReversed .MenusCategoryTreeMenuContent {
    box-shadow: -10px 10px 10px -10px rgba(0, 0, 0, 0.3); }
  .MenusNavbarDesktopNavigationListSubmenuReversed .CategoryTreeMenuTabulatorContainer {
    border-left: 4px solid var(--main-color);
    border-right: unset; }
    .MenusNavbarDesktopNavigationListSubmenuReversed .CategoryTreeMenuTabulatorContainer span {
      left: 0;
      right: unset; }
  .MenusNavbarDesktopNavigationListSubmenuReversed .CategoryTreeMenuTabulatorItemInner {
    text-align: right;
    padding-left: 30px;
    padding-right: unset; }
    .MenusNavbarDesktopNavigationListSubmenuReversed .CategoryTreeMenuTabulatorItemInner span {
      transform: rotate(180deg); }
    .MenusNavbarDesktopNavigationListSubmenuReversed .CategoryTreeMenuTabulatorItemInner-Selected::after {
      left: -9px;
      margin-right: 5px; }
  .MenusNavbarDesktopNavigationListSubmenuReversed .CategoryTreeMenuTabulatorPictogram {
    margin-left: auto; }

/*
.MenusNavbarDesktopNavigationImage {
    position: relative;
    width: 25%;
    background-color: $bg;
    border: 4px solid var(--main-color);
    border-left: none;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;

    &-Empty{
        width: auto;
    }
}

.MenusNavbarDesktopNavigationWrapper {
    width: 100%;
    max-width: var(--globalContainerWidth);
    margin: 0 auto;
    justify-content: space-between;
    display: flex;
    min-height: 500px;
    height: 50vh;
}
*/
.MobileAccountSettingsSystemButtons {
  margin: 10px 0 10px 10px; }
  @media screen and (max-width: 768px) {
    .MobileAccountSettingsSystemButtons {
      margin: 10px 10px 10px 20px; } }

.MobileAccountSettingsList {
  list-style: none;
  padding-left: 20px; }
  .MobileAccountSettingsList li {
    font-size: 16px;
    margin-top: 30px;
    font-weight: 400;
    cursor: pointer;
    display: flex; }

.MobileAccountSettingsControls {
  margin-top: 50px;
  margin-left: 12px; }

.MobileAccountSettingsButton {
  margin: 30px 10px 30px 0; }

.MenusCategoryRootNodeContainer {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin: 5px 0 5px; }

.MenusCategoryRootNodeHeader {
  width: 100%;
  padding: 10px 0;
  position: relative;
  word-break: break-word; }
  .MenusCategoryRootNodeHeader:hover .MenusCategoryRootNodeHeaderIcon, .MenusCategoryRootNodeHeader:hover .MenusCategoryRootNodeHeaderLabel, .MenusCategoryRootNodeHeader-Open .MenusCategoryRootNodeHeaderIcon, .MenusCategoryRootNodeHeader-Open .MenusCategoryRootNodeHeaderLabel {
    opacity: 1; }

.MenusCategoryRootNodeHeaderInner {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  outline: none;
  width: 100%;
  background: none;
  border: none;
  padding: 0;
  text-align: left;
  text-decoration: none; }

.MenusCategoryRootNodeHeaderIcon {
  transition: transform ease-in 0.1s;
  font-size: 12px;
  display: none;
  margin-right: 5px; }
  .MenusCategoryRootNodeHeaderIcon-Visible {
    display: initial; }
  .MenusCategoryRootNodeHeaderIcon-Open {
    transform: rotate(90deg); }

.MenusCategoryRootNodeHeaderLabel {
  color: black;
  transition: opacity 0.3s;
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: 14px;
  margin: 0 25px 0 0; }
  .MenusCategoryRootNodeHeaderLabel-WithSubmenu {
    margin: 0 12px 0 0; }
  .MenusCategoryRootNodeHeaderLabel-Current {
    color: var(--category-hl-color); }
  @media screen and (max-width: 1024px) {
    .MenusCategoryRootNodeHeaderLabel {
      font-size: 16px; } }

.MenusCategoryRootNodeHeaderNavButton {
  position: absolute;
  right: 0;
  top: 7px;
  display: none;
  border: none;
  cursor: pointer;
  transition: opacity .3s;
  background: none; }
  .MenusCategoryRootNodeHeaderNavButton:hover {
    opacity: 1; }
  .MenusCategoryRootNodeHeaderNavButton-Visible {
    display: initial; }

.MenusCategoryRootNodeHeaderNavButtonInner {
  font-size: 18px;
  margin: 0 5px 0 10px;
  border: none;
  background: none; }

.MenusCategoryRootNodeContent {
  padding: 0;
  overflow: hidden;
  margin: 0;
  width: 100%; }

.MenusCategoryRootNodeContentList {
  padding: 0 0 0 8px;
  list-style: none; }
  @media screen and (max-width: 1024px) {
    .MenusCategoryRootNodeContentList {
      padding: 0;
      margin: 0; } }

.MenusCategoryRootNodeItem {
  padding: 0; }

.MenusCategorySearchHere {
  margin: 10px 20px; }

.MenusNavbarLogoContainer {
  height: 100%;
  min-width: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 5px 0 5px 10px;
  position: relative;
  text-decoration: none; }
  .MenusNavbarLogoContainer:hover {
    cursor: pointer; }
  @media screen and (min-width: 768px) {
    .MenusNavbarLogoContainer {
      min-width: 150px; } }
  @media screen and (min-width: 1440px) {
    .MenusNavbarLogoContainer {
      min-width: 200px; } }

.MenusNavbarLogoImage {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
  display: block; }

.MenusPaginatorContainer {
  display: flex;
  justify-content: center;
  align-items: center;
  list-style: none;
  padding-left: 0;
  margin: 20px auto;
  padding: 0 10px;
  max-width: 400px; }

.MenusPaginatorNext, .MenusPaginatorPrevious {
  font-size: 12px;
  opacity: .6;
  transition: all .3s;
  transform: scale(1);
  outline: none;
  padding: 5px 10px;
  cursor: pointer; }
  .MenusPaginatorNext:hover, .MenusPaginatorPrevious:hover {
    transform: scale(1.2);
    opacity: 1; }
  .MenusPaginatorNext:focus, .MenusPaginatorPrevious:focus {
    opacity: 1; }
  @media screen and (min-width: 600px) {
    .MenusPaginatorNext, .MenusPaginatorPrevious {
      font-size: 12px; } }
  .MenusPaginatorNextInner, .MenusPaginatorPreviousInner {
    outline: none; }

.MenusPaginatorPage {
  opacity: .5;
  font-size: 12px;
  transition: all .3s;
  cursor: pointer;
  margin: 0 5px; }
  .MenusPaginatorPage:hover {
    opacity: 1; }

.MenusPaginatorPageLink {
  font-weight: 600;
  outline: none;
  padding: 10px;
  font-size: 18px; }
  .MenusPaginatorPageLink-Active {
    transform: scale(1.1);
    text-decoration: underline;
    opacity: 1;
    text-underline-position: below; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.OrderCardContainer {
  width: 100%;
  border: 2px solid black;
  padding: 30px; }

.OrderCardButton {
  width: 100%;
  margin-top: 30px; }

.OrderCardButtonContent {
  width: 100%;
  text-align: center;
  text-transform: uppercase;
  font-size: 14px; }

.OrderCardParagraph {
  display: flex;
  flex-direction: column;
  margin: 0;
  margin-bottom: 20px; }

.OrderCardData {
  font-size: 18px; }

.OrderDetailsContainer {
  padding: 30px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }

.OrderDetailsSectionContainer {
  width: 100%;
  text-align: left;
  margin: 10px 0;
  padding: 10px;
  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); }
  .OrderDetailsSectionContainer p {
    margin: 10px; }
  @media screen and (min-width: 1024px) {
    .OrderDetailsSectionContainer {
      width: 49%; } }

.OrderDetailsTableContainer {
  margin-top: 40px;
  width: 100%; }
  @media screen and (max-width: 1024px) {
    .OrderDetailsTableContainer {
      overflow: auto; } }

.OrderDetailsHeading {
  width: 100%; }

.PageSectionsCarouselsCarouselContainer {
  width: 100%;
  height: 400px; }

.PageSectionsCarouselsCarouselSlidesSimpleHeroSlideContainer {
  width: auto;
  height: 400px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; }
  @media screen and (min-width: 1024px) {
    .PageSectionsCarouselsCarouselSlidesSimpleHeroSlideContainer {
      height: 600px; } }

.PageSectionsCarouselsCarouselSlidesSimpleHeroSlideInner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 70%;
  text-align: center; }
  @media screen and (min-width: 1024px) {
    .PageSectionsCarouselsCarouselSlidesSimpleHeroSlideInner {
      max-width: 60%; } }

.PageSectionsCarouselsCarouselSlidesSimpleHeroSlideTitle {
  color: white;
  font-size: 28px;
  font-weight: 600;
  margin: 0 0 10px;
  text-shadow: 2px 2px black; }
  @media screen and (min-width: 1024px) {
    .PageSectionsCarouselsCarouselSlidesSimpleHeroSlideTitle {
      font-size: 36px; } }

.PageSectionsCarouselsCarouselSlidesSimpleHeroSlideDescription {
  color: white;
  font-size: 18px;
  margin: 10px 0 10px;
  text-shadow: 2px 2px black;
  display: none; }
  .PageSectionsCarouselsCarouselSlidesSimpleHeroSlideDescriptionVisible {
    display: initial; }

.ProductPageMobileGalleryContainer {
  width: 100%;
  height: 80vw;
  max-height: 750px; }
  @media screen and (max-width: 768px) {
    .ProductPageMobileGalleryContainer {
      height: auto; } }

.PageSectionsSharedImageSlide {
  width: auto;
  height: 80vw;
  background-repeat: no-repeat;
  background-size: cover;
  max-height: 750px; }

.ProductCarouselImageSlideContainer {
  width: auto;
  height: 80vw;
  max-height: 750px;
  display: flex;
  justify-content: center; }

.PageSectionsHighlightedInfoContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  background-color: lightgray; }

.PageSectionsHighlightedInfoInner {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  max-width: 1200px;
  flex-wrap: wrap;
  padding: 30px 0; }

.PageSectionsHighlightedInfoColumn {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 20px 10px; }

.PageSectionsHighlightedInfoMain {
  font-weight: 600;
  font-size: 20px; }

.PageSectionsHighlightedInfoAside {
  font-weight: 600;
  font-size: 14px; }

.PageSectionsPostHighlightContainer {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center; }
  @media screen and (min-width: 768px) {
    .PageSectionsPostHighlightContainer {
      flex-direction: row;
      align-items: flex-start;
      justify-content: space-between; } }

.PageSectionsPostHighlightDescription {
  color: white;
  margin-bottom: 40px; }
  @media screen and (min-width: 1024px) {
    .PageSectionsPostHighlightDescription {
      margin-left: 80px; } }
  @media screen and (min-width: 768px) {
    .PageSectionsPostHighlightDescription {
      margin: 20px;
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      align-self: center; } }

@media screen and (min-width: 1024px) {
  .PageSectionsPostHighlightImg {
    flex: 2.5;
    max-height: 500px; } }

@media screen and (min-width: 768px) {
  .PageSectionsPostHighlightImg {
    flex: 1.5;
    overflow: hidden;
    display: flex;
    justify-content: center; } }

.PageSectionsPostHighlightImgInner {
  width: 100%;
  height: auto; }
  @media screen and (min-width: 768px) {
    .PageSectionsPostHighlightImgInner {
      height: 100%;
      max-height: 500px;
      width: auto; } }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ProductListItemContainer {
  display: flex;
  cursor: pointer;
  padding: 10px 10px 10px 20px;
  margin: 10px 0;
  background-color: white;
  position: relative; }
  @media screen and (max-width: 600px) {
    .ProductListItemContainer {
      padding-left: 10px; } }
  .ProductListItemContainer:hover {
    background-color: #F3F3F3; }

.ProductListItemContent {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: 20px; }
  .ProductListItemContent .PriceWrapper {
    grid-template-columns: auto auto 1fr;
    grid-template-areas: "promotionDate promotionDate      promotionDate" "valueCurrent  discountPercentage valueOld" "priceInfo     priceInfo          priceInfo";
    grid-column-gap: 4px;
    grid-row-gap: 2px;
    margin: 0; }
    .ProductListItemContent .PriceWrapper .PriceValueRegular {
      font-size: 1em;
      font-weight: 300; }
    .ProductListItemContent .PriceWrapper .PriceValueRegular.Old {
      font-size: 13px;
      font-weight: normal; }
    .ProductListItemContent .PriceWrapper .PricePromotionDate {
      font-size: 9px;
      font-weight: 600;
      text-align: left; }
    .ProductListItemContent .PriceWrapper .PriceInfo {
      font-size: 9px;
      text-align: left; }
    .ProductListItemContent .PriceWrapper .PriceValuePromotion {
      font-size: 18px; }
    .ProductListItemContent .PriceWrapper .PriceDiscountPercentage {
      font-size: 9px;
      font-weight: 500;
      padding: 2px 6px; }
  .ProductListItemContent > div:first-of-type {
    display: flex;
    align-items: center; }
    .ProductListItemContent > div:first-of-type > p {
      font-size: 18px;
      font-weight: normal;
      margin-bottom: 12px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      margin-right: 1em; }
      @media screen and (max-width: 768px) {
        .ProductListItemContent > div:first-of-type > p {
          max-width: 300px;
          font-size: 14px; } }
      @media screen and (max-width: 600px) {
        .ProductListItemContent > div:first-of-type > p {
          max-width: 250px; } }
      @media screen and (max-width: 375px) {
        .ProductListItemContent > div:first-of-type > p {
          max-width: 180px; } }

.ProductListItemImage {
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.24);
  position: relative;
  display: flex;
  justify-content: center;
  padding: 5px;
  background-color: white;
  height: 120px;
  width: 120px; }
  @media screen and (max-width: 600px) {
    .ProductListItemImage {
      height: 96px;
      width: 96px; } }

.ProductListItemTags {
  z-index: 1;
  padding: 0;
  position: unset;
  flex-direction: row;
  padding: 0 0 16px 10px; }
  .ProductListItemTags p.ArticleTagsItem {
    font-size: 12px;
    padding: 5px 7px;
    font-weight: 500; }
  @media screen and (max-width: 600px) {
    .ProductListItemTags {
      position: absolute;
      bottom: 0;
      left: 0;
      top: unset;
      flex-direction: column; }
      .ProductListItemTags p.ArticleTagsItem {
        font-size: 9px;
        padding: 2px 3px; } }

.CheckoutProcessAskQuestionLabel {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 48px; }
  @media screen and (max-width: 1200px) {
    .CheckoutProcessAskQuestionLabel {
      margin-top: 48px; } }
  @media screen and (max-width: 375px) {
    .CheckoutProcessAskQuestionLabel {
      margin-top: 20px;
      margin-bottom: 20px;
      font-size: 18px; } }

.CheckoutProcessAskQuestionStyledForm {
  width: 100%; }

.CheckoutProcessAskQuestionInputs {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 32px 0; }
  @media screen and (max-width: 1024px) {
    .CheckoutProcessAskQuestionInputs {
      width: 100%; } }
  @media screen and (max-width: 375px) {
    .CheckoutProcessAskQuestionInputs {
      margin: 10px 0; } }

.CheckoutProcessAskQuestionButtons {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: relative; }

.CheckoutProcessAskQuestionButton {
  width: 100%; }
  @media screen and (max-width: 768px) {
    .CheckoutProcessAskQuestionButton {
      width: 80%; } }
  @media screen and (max-width: 375px) {
    .CheckoutProcessAskQuestionButton {
      margin-bottom: 20px; } }

.CheckoutProcessAskQuestionError {
  position: absolute;
  left: 0;
  color: red;
  font-size: 12px; }

.CheckoutProcessAskQuestionStyledLabel {
  font-size: 14px; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ProductPageOpinionSectionAddOpinionModalContainer {
  width: 700px;
  min-height: 400px;
  padding: 40px; }

.ProductPageOpinionSectionAddOpinionModalContainerMobile {
  padding: 30px;
  height: 100%; }
  @media screen and (max-width: 375px) {
    .ProductPageOpinionSectionAddOpinionModalContainerMobile h2 {
      font-size: 18px;
      padding-bottom: 15px; } }
  @media screen and (max-width: 375px) {
    .ProductPageOpinionSectionAddOpinionModalContainerMobile h3 {
      font-size: 14px; } }

.ProductPageOpinionSectionAddOpinionModalSuccess {
  flex-direction: column;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  color: #24b112;
  padding-top: 32px; }
  .ProductPageOpinionSectionAddOpinionModalSuccess > .MuiSvgIcon-root {
    margin-bottom: 0.4em; }

.ProductPageOpinionSectionContainer {
  width: 100%; }
  .ProductPageOpinionSectionContainer > .ButtonSimpleAnimatedContainer {
    width: 30%; }
    @media screen and (max-width: 1024px) {
      .ProductPageOpinionSectionContainer > .ButtonSimpleAnimatedContainer {
        width: 40%; } }
    @media screen and (max-width: 768px) {
      .ProductPageOpinionSectionContainer > .ButtonSimpleAnimatedContainer {
        width: 100%; } }

.ProductPageOpinionSectionOpinions {
  margin: 20px 0; }
  @media screen and (min-width: 1200px) {
    .ProductPageOpinionSectionOpinions {
      width: 70%; } }

.ProductPageOpinionSectionEmpty {
  font-size: 18px;
  margin-bottom: 32px; }

.ProductPageOpinionSectionDropdown {
  width: 30%;
  margin-bottom: 16px;
  margin-left: auto; }
  @media screen and (min-width: 1920px) {
    .ProductPageOpinionSectionDropdown {
      width: 15%; } }
  @media screen and (max-width: 768px) {
    .ProductPageOpinionSectionDropdown {
      width: 100%; } }

.ProductPageOpinionContainer {
  width: 100%;
  padding: 20px;
  border: 1px solid #ddd; }

.ProductPageOpinionTopWrapper {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px; }
  @media screen and (max-width: 768px) {
    .ProductPageOpinionTopWrapper {
      margin-bottom: 16px; } }

.ProductPageOpinionName {
  margin-right: 10px;
  margin-bottom: 8px; }

.ProductPageOpinionFlex {
  display: flex;
  flex-wrap: wrap;
  align-items: center; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ProductPagestatisticsContainer {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 20px;
  align-items: center; }
  @media screen and (max-width: 375px) {
    .ProductPagestatisticsContainer {
      padding: 0; } }

.ProductPagestatisticsRow {
  display: flex;
  align-items: center; }

.ProductPagestatisticsLeft {
  margin-right: 100px; }
  @media screen and (max-width: 768px) {
    .ProductPagestatisticsLeft {
      margin-bottom: 20px; } }
  @media screen and (max-width: 480px) {
    .ProductPagestatisticsLeft {
      margin-right: 80px; } }
  @media screen and (max-width: 375px) {
    .ProductPagestatisticsLeft {
      margin-right: 40px; } }

.ProductPagestatisticsProgressBarContainer {
  width: 100px;
  margin: 0 10px; }

.ProductPagestatisticsStar {
  color: #ffb400; }

.ProductPagestatisticsProgressBar {
  background-color: #ffb400 !important; }

.ProductPagestatisticsProgressBar2 {
  background-color: #F3F3F3 !important; }

.ProductPagestatisticsRaiting {
  display: flex;
  align-items: center;
  margin-bottom: 10px; }
  .ProductPagestatisticsRaiting > .MuiRating-root {
    margin-left: 8px; }

.ProductPagestatisticsAmount {
  margin-right: 5px; }

.ProductPageControlsContainer {
  width: 100%; }

.ProductPageControlsButton {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin-top: 20px;
  justify-content: flex-start;
  align-items: flex-start; }
  @media screen and (max-width: 768px) {
    .ProductPageControlsButton {
      margin-top: 10px; } }

.ProductPageControlsButton b {
  font-size: 14px; }

.ProductPageControlsButtonContainer {
  width: 100%;
  max-width: 296px; }

.ProductPageControlsAskForPriceModal {
  width: auto;
  height: 90vh;
  padding: 50px;
  overflow-y: auto; }
  @media screen and (max-width: 768px) {
    .ProductPageControlsAskForPriceModal {
      padding: 20px; } }
  @media screen and (max-width: 600px) {
    .ProductPageControlsAskForPriceModal {
      padding: 15px; } }
  @media screen and (max-width: 480px) {
    .ProductPageControlsAskForPriceModal {
      padding: 10px; } }

.ProductPageSelectors {
  display: flex;
  flex-direction: row; }

.ProductPageMeasureSelector {
  display: flex;
  flex-direction: column;
  margin: 0 10px 0 0; }
  .ProductPageMeasureSelector b {
    margin-top: 2px;
    height: 17px; }
  .ProductPageMeasureSelector select {
    border: 1px solid rgba(0, 0, 0, 0.15);
    height: 48px;
    margin: 9px 0;
    margin-bottom: 48px; }
    @media screen and (max-width: 768px) {
      .ProductPageMeasureSelector select {
        margin-bottom: 10px; } }

.ProductPageQuantitySelector {
  margin: 0 0 0 10px; }
  .ProductPageQuantitySelector b {
    height: 17px; }
  .ProductPageQuantitySelector > div {
    display: flex;
    align-items: center;
    margin-bottom: 48px; }
    @media screen and (max-width: 768px) {
      .ProductPageQuantitySelector > div {
        margin-bottom: 10px; } }
    .ProductPageQuantitySelector > div > .ProductQuantitySelectorContainer {
      max-width: 296px; }
      .ProductPageQuantitySelector > div > .ProductQuantitySelectorContainer > .ProductQuantitySelectorIcons {
        min-width: 48px; }
    .ProductPageQuantitySelector > div > .ProductQuantitySelectorInput {
      width: 100px; }

.ProductPageGalleryContainer {
  width: 100%;
  overflow: hidden;
  position: relative; }
  @media screen and (min-width: 768px) {
    .ProductPageGalleryContainer {
      display: flex;
      flex-direction: column; } }
  .ProductPageGalleryContainer .ArticleTagsContainer {
    left: 20px;
    top: 21px; }

.ProductPageGalleryTopRow {
  display: flex;
  flex-direction: row;
  height: 550px;
  width: 100%;
  position: relative;
  cursor: pointer; }
  @media screen and (min-width: 1024px) {
    .ProductPageGalleryTopRow {
      height: 600px; } }
  @media screen and (min-width: 1440px) {
    .ProductPageGalleryTopRow {
      height: 900px; } }

.ProductPageGalleryBottomRow {
  display: none;
  flex-direction: row;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
  cursor: pointer; }
  .ProductPageGalleryBottomRow-Visible {
    display: flex; }
  .ProductPageGalleryBottomRow-Adjusted {
    justify-content: space-around; }

.ProductPageGallerySlideContainer {
  width: calc(100% - 32px);
  height: 550px;
  max-height: 550px;
  margin: 16px auto 16px; }
  .ProductPageGallerySlideContainer .ProductPageGallerySlide {
    width: 100%;
    height: 550px;
    max-height: 550px;
    position: relative;
    cursor: pointer;
    background-color: white; }
    .ProductPageGallerySlideContainer .ProductPageGallerySlide img {
      image-rendering: -webkit-optimize-contrast; }
  .ProductPageGallerySlideContainer-WithoutThumbnails {
    height: 736px;
    max-height: 736px; }
    .ProductPageGallerySlideContainer-WithoutThumbnails .ProductPageGallerySlide {
      height: 736px;
      max-height: 736px; }

.ProductPageGallerySlideNavCotnainer {
  width: calc(100% - 16px);
  margin: 0 auto 16px; }
  .ProductPageGallerySlideNavCotnainer .slick-track {
    display: flex;
    justify-content: center; }
  .ProductPageGallerySlideNavCotnainer .slick-slide {
    max-width: 25%;
    margin: 0 8px; }
    .ProductPageGallerySlideNavCotnainer .slick-slide div {
      display: flex;
      justify-content: center;
      background-color: #fff; }
  .ProductPageGallerySlideNavCotnainer .ProductPageGallerySlideNav {
    width: 100%;
    height: 186px;
    position: relative;
    cursor: pointer; }
    .ProductPageGallerySlideNavCotnainer .ProductPageGallerySlideNav img {
      image-rendering: -webkit-optimize-contrast; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ProductPageHeaderContainer {
  display: flex;
  flex-direction: column;
  width: 100%; }

.ProductPageHeaderInnerTop {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  align-items: flex-start; }

.ProductPageHeaderInnerTopLeft {
  display: flex;
  flex-direction: column;
  width: 100%; }
  .ProductPageHeaderInnerTopLeft .PriceWrapper {
    grid-template-areas: "promotionDate promotionDate promotionDate filler" "valueCurrent discountPercentage valueOld filler" "priceInfo priceInfo priceInfo filler"; }
    .ProductPageHeaderInnerTopLeft .PriceWrapper .PricePromotionDate {
      font-size: 16px;
      text-align: left; }
    .ProductPageHeaderInnerTopLeft .PriceWrapper .PriceValueRegular,
    .ProductPageHeaderInnerTopLeft .PriceWrapper .PriceValuePromotion {
      font-size: 36px; }
      @media screen and (max-width: 768px) {
        .ProductPageHeaderInnerTopLeft .PriceWrapper .PriceValueRegular,
        .ProductPageHeaderInnerTopLeft .PriceWrapper .PriceValuePromotion {
          font-size: 18px; } }
    .ProductPageHeaderInnerTopLeft .PriceWrapper .PriceValueRegular.Old {
      font-size: 24px; }
      @media screen and (max-width: 768px) {
        .ProductPageHeaderInnerTopLeft .PriceWrapper .PriceValueRegular.Old {
          font-size: 18px; } }
    .ProductPageHeaderInnerTopLeft .PriceWrapper .PriceInfo {
      text-align: left; }
  .ProductPageHeaderInnerTopLeft .NetPriceWrapper {
    grid-template-areas: "valueCaption valueCaption filler" "valueCurrent valueOld filler"; }
    .ProductPageHeaderInnerTopLeft .NetPriceWrapper .NetPriceValueRegular,
    .ProductPageHeaderInnerTopLeft .NetPriceWrapper .NetPriceValuePromotion {
      font-size: 24px; }
      @media screen and (max-width: 768px) {
        .ProductPageHeaderInnerTopLeft .NetPriceWrapper .NetPriceValueRegular,
        .ProductPageHeaderInnerTopLeft .NetPriceWrapper .NetPriceValuePromotion {
          font-size: 12px; } }
    .ProductPageHeaderInnerTopLeft .NetPriceWrapper .NetPriceValueRegular.Old {
      font-size: 16px; }
      @media screen and (max-width: 768px) {
        .ProductPageHeaderInnerTopLeft .NetPriceWrapper .NetPriceValueRegular.Old {
          font-size: 12px; } }

.ProductPageHeaderName {
  font-weight: 500;
  font-size: 24px;
  margin: 32px 0 32px; }
  @media screen and (max-width: 768px) {
    .ProductPageHeaderName {
      font-size: 18px;
      margin: 10px 0 10px; } }

.ProductPageHeaderPrice {
  font-weight: 600;
  font-size: 24px;
  white-space: nowrap;
  vertical-align: top;
  max-width: 150px;
  margin: 0 10px 0 0; }

.ProductPageHeaderButtons {
  padding-right: 35px;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center; }
  @media screen and (max-width: 1440px) {
    .ProductPageHeaderButtons {
      padding-right: 25px; } }
  @media screen and (max-width: 1024px) {
    .ProductPageHeaderButtons {
      padding-right: 20px; } }
  .ProductPageHeaderButtons button:first-of-type {
    margin-right: 20px; }

.ProductPageHeaderInnerTopWrapper {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: center; }

.ProductPageHeaderInnerTopWrapperReverse .ProductPageHeaderButtons {
  margin-top: 20px; }
  @media screen and (max-width: 1024px) {
    .ProductPageHeaderInnerTopWrapperReverse .ProductPageHeaderButtons {
      margin-top: unset; } }

.ProductPageHeaderParameters {
  list-style: none;
  padding: 0; }
  .ProductPageHeaderParameters li {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-bottom: 0.5em; }
    .ProductPageHeaderParameters li em {
      padding-left: 0.5em;
      font-weight: bold;
      font-style: normal;
      font-variant: normal;
      color: #333333; }

@media not screen and (min-width: 1440px) {
  .ProductPageHeaderInnerTopWrapperReverse {
    flex-direction: row; }
    .ProductPageHeaderInnerTopWrapperReverse .ProductPageHeaderButtons button:first-of-type {
      margin-right: 0; }
    .ProductPageHeaderInnerTopWrapperReverse .ProductPageHeaderButtons button:last-of-type {
      margin-left: 20px; } }

.ProductPageRelatedItemsContainer {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%; }

.ProductPageRelatedItemsLabel {
  margin: 0 0 20px;
  font-size: 16px;
  font-weight: 600;
  opacity: .7; }

.ProductPageRelatedItemsList {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  padding: 0;
  margin: 0; }

.ProductPageRelatedItemsItem {
  height: 100px;
  width: 75px;
  background-color: silver;
  margin: 0px 15px 20px 0;
  transition: all .15s;
  overflow: hidden;
  cursor: pointer; }
  .ProductPageRelatedItemsItem:last-of-type, .ProductPageRelatedItemsItem:nth-of-type(4n) {
    margin: 0 0 20px 0; }
  .ProductPageRelatedItemsItem:hover {
    box-shadow: 0 0 10px silver; }

.ProductPageRelatedItemsImage {
  object-fit: cover;
  height: 100%;
  width: auto; }

.TabsSectionDesktopContainer {
  width: 100%;
  max-width: var(--globalContainerWidth);
  margin: 0 auto; }
  .TabsSectionDesktopContainerFull {
    max-width: 100%; }

.TabsSectionDesktopTabs {
  width: 100%;
  cursor: pointer; }

.TabsSectionDesktopContent {
  width: 100%;
  min-height: 500px;
  padding: 40px;
  max-width: var(--globalContainerWidth);
  margin: 0 auto; }
  .TabsSectionDesktopContentFull {
    max-width: 100%; }
  @media screen and (max-width: 1200px) {
    .TabsSectionDesktopContent {
      padding: 16px; } }

.TabsSectionDesktopSelectorContainer {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  height: 60px; }
  @media screen and (max-width: 1024px) {
    .TabsSectionDesktopSelectorContainer {
      font-size: 14px; } }

.TabsSectionDesktopSelectorTab {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  flex: 1;
  margin: 0;
  position: relative;
  outline: none;
  transition: .2s;
  color: var(--trDark); }
  .TabsSectionDesktopSelectorTab:hover {
    color: var(--main-color); }
  .TabsSectionDesktopSelectorTab::after {
    width: 100%;
    position: absolute;
    bottom: 0;
    display: block;
    content: '';
    border-bottom: solid 2px var(--trDark);
    transition: .2s; }
  .TabsSectionDesktopSelectorTab:hover::after, .TabsSectionDesktopSelectorTab:focus::after {
    color: var(--main-color);
    border-color: var(--main-color); }
  .TabsSectionDesktopSelectorTab-Active {
    color: var(--main-color); }
    .TabsSectionDesktopSelectorTab-Active::after {
      color: var(--main-color);
      border-color: var(--main-color); }
    .TabsSectionDesktopSelectorTab-Active .TabsSectionDesktopSelectorTabLabel {
      color: var(--main-color); }

.TabsSectionDesktopSelectorTabLabel {
  font-weight: 600; }

.TabsSectionExpandableTabContainer {
  display: flex;
  flex-direction: column;
  width: 100%;
  cursor: pointer; }

.TabsSectionExpandableTabLabel {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 20px 20px;
  width: 100%;
  background-color: #ffffff; }
  @media screen and (max-width: 600px) {
    .TabsSectionExpandableTabLabel {
      padding: 30px 0px; } }

.TabsSectionExpandableTabLabelIcon {
  font-size: 14px;
  transition: transform ease-in .1s;
  color: black;
  transform: rotate(0); }
  .TabsSectionExpandableTabLabelIcon-Open {
    transform: rotate(90deg); }

.TabsSectionExpandableTabLabelText {
  margin: 0 0 0 10px;
  font-size: 16px;
  font-weight: 600; }

.TabsSectionExpandableTabContent {
  width: 100%;
  overflow-y: hidden;
  border-bottom: 2px solid silver; }

.ProductPageMobileContainer {
  width: 100%; }
  .ProductPageMobileContainerFull {
    width: 100%; }

.ProductPageMobileWrapper {
  padding: 0px 24px 24px 24px; }
  @media screen and (max-width: 375px) {
    .ProductPageMobileWrapper {
      padding: 0 0 24px 0; } }

.ProductNextPrevNavContainer {
  width: 100%;
  margin: 16px 0 0;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center; }
  .ProductNextPrevNavContainer--SingleIcon {
    justify-content: flex-end; }

.ProductNextPrevNavIconNext::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\F30B";
  margin-left: 15px; }

.ProductNextPrevNavIconPrev::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\F30A";
  margin-right: 15px; }

.ProductNextPrevNavButton {
  background: none;
  outline: none;
  border: none;
  cursor: pointer;
  font-weight: 500; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.ProductTileContainer {
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  height: auto;
  width: 200px;
  background-color: white;
  cursor: pointer;
  padding: 10px;
  margin: 10px; }
  .ProductTileContainer .PriceWrapper {
    grid-template-columns: auto auto 1fr;
    grid-template-areas: "promotionDate promotionDate      promotionDate" "valueCurrent  discountPercentage valueOld" "priceInfo     priceInfo          priceInfo";
    grid-column-gap: 4px;
    grid-row-gap: 2px;
    margin: 0; }
    .ProductTileContainer .PriceWrapper .PriceValueRegular {
      font-size: 1em;
      font-weight: 300; }
    .ProductTileContainer .PriceWrapper .PriceValueRegular.Old {
      font-size: 13px;
      font-weight: normal; }
    .ProductTileContainer .PriceWrapper .PricePromotionDate {
      font-size: 9px;
      font-weight: 600;
      text-align: left; }
    .ProductTileContainer .PriceWrapper .PriceInfo {
      font-size: 9px;
      text-align: left; }
    .ProductTileContainer .PriceWrapper .PriceValuePromotion {
      font-size: 18px; }
    .ProductTileContainer .PriceWrapper .PriceDiscountPercentage {
      font-size: 9px;
      font-weight: 500;
      padding: 2px 6px; }
  .ProductTileContainer > p {
    margin-bottom: 14px;
    margin-top: 12px;
    max-height: 32px;
    font-weight: normal;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
    @media screen and (max-width: 600px) {
      .ProductTileContainer > p {
        margin-bottom: 10px;
        margin-top: 16px; } }
  .ProductTileContainer:hover {
    background-color: #F3F3F3; }
  @media screen and (max-width: 480px) {
    .ProductTileContainer {
      width: 100%; } }

.ProductTileImage {
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.24);
  position: relative;
  display: flex;
  justify-content: center;
  padding: 5px;
  background-color: white;
  width: 100%;
  height: 194px; }

.ProductTileTags {
  z-index: 1;
  padding: 0;
  margin-top: 12px;
  gap: 12px; }
  .ProductTileTags p.ArticleTagsItem {
    font-size: 12px;
    font-weight: 500;
    padding: 2px 6px; }
  @media screen and (max-width: 600px) {
    .ProductTileTags {
      margin-left: 12px; } }

.ProfileLayoutCotnainer {
  width: 100%;
  max-width: var(--globalContainerWidth);
  display: flex;
  min-height: 100vh; }

.ProfileLayoutNav {
  width: 300px;
  background-color: #fff;
  box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.12); }
  @media screen and (max-width: 1024px) {
    .ProfileLayoutNav {
      display: none; } }

.ProfileLayoutContent {
  width: 100%; }

.ProfileLayoutList {
  list-style: none;
  padding-left: 20px;
  margin-top: 40px; }
  .ProfileLayoutList li {
    font-size: 18px;
    margin-top: 30px;
    font-weight: 400;
    cursor: pointer;
    display: flex; }
    .ProfileLayoutList li span {
      margin-left: 10px; }
    .ProfileLayoutList li i {
      width: 30px; }

.ProfileLayoutColor {
  color: var(--main-color); }

.ProfileLayoutIconAccount::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F007"; }

.ProfileLayoutIconOrders::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F467"; }

.ProfileLayoutIconAddressBook::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F7E7"; }

.ProfileLayoutIconBasic::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F4FF"; }

.ProfileLayoutIconSettings::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F013"; }

.StepperContainer {
  position: relative;
  display: flex;
  justify-content: space-between;
  margin-top: 70px;
  margin-bottom: 80px; }
  @media screen and (max-width: 1024px) {
    .StepperContainer {
      margin-top: 2em;
      margin-bottom: 1em; } }
  @media screen and (max-width: 768px) {
    .StepperContainer {
      margin-bottom: 4em; } }
  @media screen and (max-width: 375px) {
    .StepperContainer {
      margin-top: 1em;
      margin-bottom: 1em;
      margin-left: 2em;
      margin-right: 2em; } }
  .StepperContainer::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 25px;
    height: 2px;
    background-color: gray;
    z-index: 0; }
    @media screen and (max-width: 1200px) {
      .StepperContainer::before {
        top: 15px; } }
    @media screen and (max-width: 375px) {
      .StepperContainer::before {
        top: 25px; } }

.StepperIcon > span {
  position: relative;
  display: inline-block;
  padding: 0 1em;
  background-color: white; }

.StepperGuestFormIcon,
.StepperShipmentIcon,
.StepperPaymentIcon,
.StepperSummaryIcon {
  color: lightgray;
  font-size: 50px; }
  @media screen and (max-width: 1200px) {
    .StepperGuestFormIcon,
    .StepperShipmentIcon,
    .StepperPaymentIcon,
    .StepperSummaryIcon {
      font-size: 30px; } }
  @media screen and (max-width: 375px) {
    .StepperGuestFormIcon,
    .StepperShipmentIcon,
    .StepperPaymentIcon,
    .StepperSummaryIcon {
      font-size: 25px; } }

.StepperGuestFormIcon.StepperIsCurrent::after,
.StepperShipmentIcon.StepperIsCurrent::after,
.StepperPaymentIcon.StepperIsCurrent::after,
.StepperSummaryIcon.StepperIsCurrent::after {
  color: var(--main-color); }

.StepperGuestFormIcon.StepperIsCompleted::after,
.StepperShipmentIcon.StepperIsCompleted::after,
.StepperPaymentIcon.StepperIsCompleted::after,
.StepperSummaryIcon.StepperIsCompleted::after {
  color: black; }

.StepperGuestFormIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F2BB"; }

.StepperShipmentIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F0D1"; }

.StepperPaymentIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F873"; }

.StepperSummaryIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F467"; }

.StepperWrapper {
  position: relative;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
  background-color: white; }

.StepperLabel {
  position: relative;
  margin-top: 14px;
  color: lightgray; }
  @media screen and (max-width: 1024px) {
    .StepperLabel {
      margin: 8px; } }
  @media screen and (max-width: 600px) {
    .StepperLabel {
      font-size: 14px; } }
  @media screen and (max-width: 375px) {
    .StepperLabel {
      font-size: 12px; } }

.StepperMainColor {
  color: var(--main-color); }
  .StepperMainColor .StepperLabel {
    color: var(--main-color); }

.StepperBlackColor {
  color: black; }
  .StepperBlackColor .StepperLabel {
    color: black; }

.StepperMainBackground {
  background-color: var(--main-color); }

.StepperClickable {
  cursor: pointer; }

.ToastContainer {
  position: fixed;
  z-index: 999;
  top: 120px;
  width: 100%;
  display: flex;
  justify-content: center; }

.ToastToast {
  padding: 20px 40px;
  font-size: 18px;
  border-radius: 10px;
  box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.5);
  margin-left: -600px; }
  .ToastToast.success {
    color: #000000;
    background-color: white; }
  .ToastToast.error {
    background-color: indianred;
    color: white; }
  @media screen and (max-width: 1920px) {
    .ToastToast {
      margin-left: unset; } }

.UserButton {
  cursor: pointer; }
  .UserButton a {
    color: inherit;
    text-decoration: none; }
  .UserButton-scaleUp:hover {
    letter-spacing: 1px;
    box-shadow: 5px 40px -10px rgba(0, 0, 0, 0.57) !important; }
  .UserButton-lightUp:hover {
    text-shadow: 0px 0px 6px white; }
  .UserButton-switchColors:hover {
    color: #ffffff !important;
    background: rgba(0, 0, 0, 0.5);
    border-color: #fff !important; }
  .UserButton-roundUp:hover {
    color: #494949 !important;
    border-radius: 50px !important;
    border-color: #494949 !important; }
  .UserButton-iconPositionLeft {
    display: flex;
    align-items: center;
    flex-direction: row-reverse; }
    .UserButton-iconPositionLeft svg {
      margin-right: 10px; }
  .UserButton-iconPositionRight {
    display: flex;
    align-items: center;
    flex-direction: row; }
    .UserButton-iconPositionRight svg {
      margin-left: 10px; }

.WrappersSectionWrapperContainer {
  box-sizing: content-box;
  padding: 40px 10px;
  background-color: 'white'; }
  @media screen and (min-width: 768px) {
    .WrappersSectionWrapperContainer {
      padding: 60px 30px; } }
  @media screen and (min-width: 1024px) {
    .WrappersSectionWrapperContainer {
      padding: 80px 40px; } }
  @media screen and (min-width: 1200px) {
    .WrappersSectionWrapperContainer {
      padding: 80px 60px; } }
  @media screen and (min-width: 1440px) {
    .WrappersSectionWrapperContainer {
      padding: 80px; } }
  .WrappersSectionWrapperContainerDark {
    background-color: 'darkgray'; }

.WrappersSectionWrapperInner {
  box-sizing: content-box;
  max-width: 'none';
  margin: unset; }
  .WrappersSectionWrapperInnerMax {
    box-sizing: content-box;
    max-width: var(--globalContainerWidth);
    margin: auto; }

.ScrollButtonContainer {
  position: fixed;
  right: 1em;
  bottom: 1em;
  background-color: var(--main-color);
  color: white;
  padding: .5em;
  cursor: pointer;
  z-index: 2;
  height: 2.5em;
  width: 2.5em; }
  .ScrollButtonContainer i::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 600;
    content: "\F062"; }

.AddressCardsContainer {
  margin: 0 auto;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch; }

.AddressCardsContainerCardWrapper {
  margin: 10px;
  flex-grow: 1; }

.ContainersCustomerInitContainer {
  width: 100%; }

.IconSelectorIconContainer {
  outline: none;
  background: none;
  margin: 0 2.5px;
  border: 0;
  cursor: pointer; }

.IconSelectorIcon {
  opacity: .4;
  font-size: 24px; }
  .IconSelectorIcon-Selected {
    font-size: 24px;
    opacity: 1; }

.IconSelectorContainer {
  display: flex;
  align-items: center; }

.OrderCardsContainer {
  width: 100%;
  padding: 10px;
  display: flex;
  flex-direction: column; }
  .OrderCardsContainer .OrderCardsContainerCardWrapper:nth-child(n+2) {
    margin-top: 20px; }

/* bg = background */
/* tr = transparency */
/*użyto np. w dacie promocji na kafelku artykułu */
/* propozycja nazwy: "$borderHeader */
/*kolor czcionki na kolorowym tle, np. buttona, tagu systemowego itp. */
/*użyto w error indicatorach oraz jako tło przeceny na kafelku artykułu */
/* kolor tła obniżki procentowej ceny */
:root {
  --bg: #fff;
  /* kolor tła, głównie dla .button */
  --comparisonDifference: red;
  /* kolor porównanych w porównywarce parametrów */
  --primaryGray: #F3F3F3;
  --secondaryGray: #D4D4D4;
  /* kolor tła koszyka */
  --ternaryGray: #333333;
  --trDark: rgba(0, 0, 0, 0.5);
  --borderHeader: black;
  --fontOnbg: #fff;
  --error: #CE0000;
  --bgPercentage: #CE0000;
  --starColor: #ffb400;
  --success: #24b112; }

.SectionWrapperContainer {
  padding: 50px 0;
  border-bottom: 1px solid #D4D4D4;
  margin: 10px 0; }
  @media screen and (max-width: 768px) {
    .SectionWrapperContainer {
      padding: 10px 0; } }

.OrdersHistoryContentContainer {
  margin-top: 20px; }

.ArticleListContainer.ArticleListContainerCondensed .ArticleListList {
  display: grid;
  grid-auto-rows: 1fr; }
  .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem {
    padding: 10px 10px;
    margin-bottom: 16px;
    grid-template-columns: 1fr auto 20% 35% 25%;
    grid-template-rows: auto auto auto auto auto;
    grid-template-areas: "image\9separator  name     name    price" "image\9separator  props    specs   price" "image\9separator  props    specs   quantity" "image\9separator  actions  specs\9quantity" "image\9separator  actions  specs   controls"; }
    .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemSeparator {
      display: block;
      grid-area: separator;
      margin-left: 16px; }
    .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemName {
      font-size: 14px;
      font-weight: bold;
      margin: 0 0 4px 16.5px; }
    .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemProps {
      margin: 0 0 0 16.5px; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemProps .ArticleItemPropManufacturer {
        font-size: 10px;
        font-weight: bold; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemProps .ArticleItemPropReview {
        margin-top: 8px; }
        .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemProps .ArticleItemPropReview > span:last-child {
          font-size: 9px;
          font-weight: 500;
          padding-left: 4.31px; }
        .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemProps .ArticleItemPropReview .MuiRating-root {
          font-size: 1em; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemProps .ArticleItemPropRegular > span {
        display: none; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemProps .ArticleItemPropRegular .IconsQuantityContainer {
        margin-left: 0; }
    .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemTags {
      gap: 4px; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemTags p.ArticleTagsItem {
        font-size: 9px;
        font-weight: 500;
        padding: 2px 5px; }
    .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemActions {
      margin: 0 0 0 16.5px; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemActions .ArticleItemActionsWrapper .ArticleItemActionsContainer {
        gap: 0.5em; }
    .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemSpecs {
      margin: 0;
      font-size: 13px;
      color: #333333; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemSpecs ul {
        list-style: disc; }
        .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemSpecs ul li em {
          font-weight: 300;
          padding-left: 0; }
    .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemAddToCart, .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleNavigateToCart {
      margin: 6px 0 0 0;
      display: flex;
      justify-content: flex-end;
      align-items: flex-end; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemAddToCart .ButtonStandardAnimatedContainer, .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleNavigateToCart .ButtonStandardAnimatedContainer {
        height: 32px;
        width: 178px; }
        .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemAddToCart .ButtonStandardAnimatedContainer .ButtonStandardAnimatedContent p, .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleNavigateToCart .ButtonStandardAnimatedContainer .ButtonStandardAnimatedContent p {
          font-size: 11px;
          font-weight: 600; }
    .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors {
      margin: 0; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer {
        flex-direction: row-reverse;
        gap: 8px; }
        .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsMeasure p {
          font-size: 9px;
          font-weight: 600;
          line-height: 12px;
          margin: 0 0 4px 0; }
        .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsMeasure select {
          width: 74px;
          height: 24px;
          font-size: 11px; }
        .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity p {
          font-size: 9px;
          font-weight: 600;
          line-height: 12px;
          margin: 0 0 4px 0; }
        .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer {
          height: 24px; }
          .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer .ProductQuantitySelectorIcons {
            height: 22px;
            min-width: 23px; }
            .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer .ProductQuantitySelectorIcons .MuiSvgIcon-root {
              font-size: 1em; }
          .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer .ProductQuantitySelectorInput {
            font-size: 13px;
            width: 48px; }
    .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper {
      grid-template-columns: auto auto auto;
      grid-template-rows: auto auto auto;
      grid-template-areas: "promotionDate      promotionDate promotionDate" "discountPercentage valueCurrent  valueOld" "priceInfo          priceInfo     priceInfo";
      grid-column-gap: 4px;
      grid-row-gap: 5px;
      margin: 0; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceValueRegular {
        font-size: 18px; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old {
        font-size: 13px; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PricePromotionDate {
        margin-bottom: 0;
        font-size: 9px;
        font-weight: 600; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceInfo {
        font-size: 9px;
        margin-top: 0;
        color: #A30000; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
        font-size: 18px; }
      .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
        font-size: 9px;
        font-weight: 500;
        padding: 2px 6px; }
    .ArticleListContainer.ArticleListContainerCondensed .ArticleListList .ArticleListItem.CatalogDisabledPrices {
      grid-template-columns: 1fr auto 20% 60%;
      grid-template-rows: auto auto auto 1fr;
      grid-template-areas: "image\9separator  name     name" "image\9separator  props    specs" "image\9separator  actions  specs" "image\9separator  actions  controls"; }

.ArticleListContainer {
  width: 100%;
  background-color: #F3F3F3; }
  .ArticleListContainer .ArticleListList {
    margin: 0;
    padding: 16px 16px 0.1px 16px;
    list-style: none; }
    @media screen and (max-width: 768px) {
      .ArticleListContainer .ArticleListList {
        padding: 8px; } }
    .ArticleListContainer .ArticleListList .ArticleListItem {
      width: 100%;
      background: #FFFFFF;
      padding: 25px 25px;
      margin-bottom: 25px;
      position: relative;
      display: grid;
      grid-column-gap: 0;
      grid-row-gap: 0;
      grid-template-columns: 25% 20% 30% 25%;
      grid-template-rows: auto auto auto auto;
      grid-template-areas: "image\9name     name    name" "image\9props    specs   price" "image\9props    specs   quantity" "image\9  actions  actions quantity" "image\9  actions  actions controls"; }
      @media screen and (max-width: 768px) {
        .ArticleListContainer .ArticleListList .ArticleListItem {
          padding: 10px; } }
      .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemImage {
        grid-area: image; }
      .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemTags {
        grid-area: image; }
        @media screen and (max-width: 1200px) {
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemTags p.ArticleTagsItem {
            font-size: 10px;
            padding: 2px 5px; } }
      .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemName {
        grid-area: name;
        margin: 0 0 12.5px 25px; }
      .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemActions {
        grid-area: actions;
        margin: 0 12.5px 0px 25px; }
      .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemProps {
        grid-area: props;
        margin: 0 7.25px 12.5px 25px; }
      .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemSpecs {
        grid-area: specs;
        margin: 0 12.5px 12.5px 7.25px; }
      .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice {
        grid-area: price; }
        .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper {
          grid-template-columns: auto auto;
          grid-template-rows: auto auto auto auto;
          grid-template-areas: "promotionDate promotionDate" "discountPercentage valueCurrent" "valueOld valueOld" "priceInfo priceInfo";
          grid-column-gap: 10px;
          grid-row-gap: 10px;
          margin: 10px 0; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old {
            justify-content: flex-end; }
        @media screen and (max-width: 1440px) {
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
            font-size: 18px; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceValuePromotion {
            font-size: 24px; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceValueRegular {
            font-size: 24px; }
            .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old, .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceValueRegular.OldPlaceholder {
              font-size: 14px; } }
        @media screen and (max-width: 1200px) {
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper {
            grid-template-columns: auto;
            grid-template-rows: auto auto auto auto;
            grid-template-areas: "promotionDate" "valueOld" "discountPercentage" "valueCurrent" "priceInfo";
            grid-column-gap: 0;
            grid-row-gap: 10px;
            margin: 10px 0; }
            .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceDiscountPercentage {
              justify-content: center; } }
        @media screen and (max-width: 768px) {
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper {
            grid-template-columns: auto auto;
            grid-template-rows: auto auto auto auto;
            grid-template-areas: "promotionDate promotionDate" "discountPercentage valueCurrent" "valueOld valueOld" "priceInfo priceInfo";
            grid-column-gap: 5px;
            grid-row-gap: 0;
            margin: 0; }
            .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice .PriceWrapper .PriceValueRegular.Old {
              justify-content: flex-end; } }
      .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors {
        grid-area: quantity;
        margin: 12.5px 0 0 0;
        max-height: 100%; }
      .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemAddToCart, .ArticleListContainer .ArticleListList .ArticleListItem .ArticleNavigateToCart {
        grid-area: controls;
        margin: 12.5px 0 0 25px; }
        @media screen and (max-width: 1024px) {
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemAddToCart, .ArticleListContainer .ArticleListList .ArticleListItem .ArticleNavigateToCart {
            margin: 12.5px 0 0 0; } }
      @media screen and (max-width: 1350px) {
        .ArticleListContainer .ArticleListList .ArticleListItem {
          display: grid;
          grid-column-gap: 0;
          grid-row-gap: 0;
          grid-template-columns: 25% 20% 30% 25%;
          grid-template-rows: auto auto auto auto auto auto;
          grid-template-areas: "image   name     name    name" "image   props    props   price" "image   specs    specs   price" "image   specs    specs   quantity" "image   actions  actions quantity" "image   actions  actions controls"; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemSpecs {
            grid-area: specs;
            margin: 0 12.5px 12.5px 25px; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemAddToCart, .ArticleListContainer .ArticleListList .ArticleListItem .ArticleNavigateToCart {
            margin-left: 0; } }
      @media screen and (max-width: 1024px) {
        .ArticleListContainer .ArticleListList .ArticleListItem {
          display: grid;
          grid-column-gap: 0;
          grid-row-gap: 0;
          grid-template-columns: 25% 20% 30% 25%;
          grid-template-rows: auto auto auto auto auto auto;
          grid-template-areas: "image   name     name    name" "image   props    props   price" "image   specs    specs   price" "image   specs    specs   quantity" "image   actions  actions quantity" "image   actions  actions controls"; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemSpecs {
            grid-area: specs;
            margin: 0 12.5px 12.5px 25px; } }
      @media screen and (max-width: 768px) {
        .ArticleListContainer .ArticleListList .ArticleListItem {
          grid-column-gap: 0;
          grid-row-gap: 0;
          grid-template-columns: 25% 30% 20% 25%;
          grid-template-rows: auto auto auto auto auto;
          grid-template-areas: "image   name     name    name" "image   props    price   price" "image   specs    specs   quantity" "image   actions  actions quantity" "image   actions  actions controls"; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemActions {
            margin: 12.5px 0 12.5px 12.5px; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemSpecs {
            margin: 0 0 0 12.5px; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemName {
            margin: 12.5px 0 12.5px 12.5px; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemProps {
            margin: 0 0 12.5px 12.5px; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors {
            margin: 0 0 0 0; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice {
            margin: 12.5px 0 12.5px 12.5px; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemAddToCart, .ArticleListContainer .ArticleListList .ArticleListItem .ArticleNavigateToCart {
            margin: 0 0 0 12.5px; }
            .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemAddToCart .ButtonStandardAnimatedContainer, .ArticleListContainer .ArticleListList .ArticleListItem .ArticleNavigateToCart .ButtonStandardAnimatedContainer {
              height: 42px;
              margin-top: 10px; } }
      @media screen and (max-width: 600px) {
        .ArticleListContainer .ArticleListList .ArticleListItem {
          grid-template-columns: 100%;
          grid-template-rows: 200px auto auto auto auto auto auto auto;
          grid-template-areas: "image" "actions" "name" "props" "specs" "price" "quantity" "controls"; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemActions {
            margin: 12.5px 0 12.5px 0px; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemName {
            margin: 0 0 8px 0; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemProps,
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemSpecs,
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemPrice {
            margin: 0; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors {
            margin: 0 0 12.5px 0;
            align-items: stretch; }
            .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer {
              justify-content: stretch;
              gap: 4%; }
              .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsMeasure {
                width: 48%; }
                .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsMeasure select {
                  width: 100%;
                  height: 48px; }
              .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity {
                width: 60%; }
                .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer {
                  max-width: none;
                  height: 32px; }
                  .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer .ProductQuantitySelectorIcons {
                    min-width: 48px;
                    height: 32px; }
                    .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer .ProductQuantitySelectorIcons .MuiSvgIcon-root {
                      font-size: 1rem; }
                  .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer .ProductQuantitySelectorInput {
                    width: 100%; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemAddToCart, .ArticleListContainer .ArticleListList .ArticleListItem .ArticleNavigateToCart {
            margin: 0 0 0 0; }
            .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemAddToCart .ButtonStandardAnimatedContainer, .ArticleListContainer .ArticleListList .ArticleListItem .ArticleNavigateToCart .ButtonStandardAnimatedContainer {
              height: 48px;
              margin-top: 0; } }
      @media screen and (max-width: 375px) {
        .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsMeasure select {
          height: 32px; }
        .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer {
          height: 32px; }
          .ArticleListContainer .ArticleListList .ArticleListItem .ArticleItemQuantitySelectors .ArticleItemQuantitySelectorsContainer .ArticleItemQuantitySelectorsQuantity .ProductQuantitySelectorContainer .ProductQuantitySelectorIcons {
            min-width: 32px;
            height: 30px; } }
      .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices {
        grid-template-columns: 25% 35% 15% 25%;
        grid-template-rows: auto auto auto auto auto auto;
        grid-template-areas: "image   name     name    name" "image   props    specs   specs" "image   props    specs   specs" "image   actions  actions actions" "image   actions  actions actions" "image\9   .        .       controls"; }
        @media screen and (max-width: 1350px) {
          .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices {
            display: grid;
            grid-column-gap: 0;
            grid-row-gap: 0;
            grid-template-columns: 35% 40% 25%;
            grid-template-rows: auto auto auto auto auto auto;
            grid-template-areas: "image   name    name" "image   props   props" "image   specs   specs" "image   actions actions" "image   actions actions" "image   .       controls"; } }
        @media screen and (max-width: 768px) {
          .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices {
            grid-template-columns: 45% 30% 25%; }
            .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices .ArticleItemActions {
              margin: 12.5px 0 0 0; } }
        @media screen and (max-width: 600px) {
          .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices {
            grid-template-columns: 50% 25% 25%; }
            .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices .ArticleItemName,
            .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices .ArticleItemProps,
            .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices .ArticleItemSpecs,
            .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices .ArticleItemActions {
              margin-left: 12.5px; } }
        @media screen and (max-width: 480px) {
          .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices {
            display: grid;
            grid-column-gap: 0;
            grid-row-gap: 0;
            grid-template-columns: 100%;
            grid-template-rows: auto auto auto auto auto;
            grid-template-areas: "image" "name" "props" "specs" "actions"; }
            .ArticleListContainer .ArticleListList .ArticleListItem.CatalogDisabledPrices .ArticleItemImage {
              min-height: 300px; } }

table.articles-md {
  width: 100%;
  border-collapse: collapse; }
  table.articles-md thead {
    background-color: var(--color-light-grey); }
  table.articles-md th {
    font-weight: 600;
    font-size: 18px;
    color: #1584C3; }
  table.articles-md td {
    font-weight: 500;
    font-size: 20px;
    padding: 1em; }
  table.articles-md th, table.articles-md td {
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
  table.articles-md tbody tr.article-md-row {
    cursor: pointer; }
    table.articles-md tbody tr.article-md-row:hover {
      background-color: #F9FDFD; }
  table.articles-md tbody tr.article-md-row:nth-of-type(even) {
    background-color: #F2F8FA; }
    table.articles-md tbody tr.article-md-row:nth-of-type(even):hover {
      background-color: #F9FDFD; }
  table.articles-md tbody tr.article-md-details {
    border: 1px solid #1584C3;
    border-top: none;
    border-top: 1px solid lightgray; }

.article-md-details-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1em; }

.article-md-details-image {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  background: #fff;
  padding: 0 3rem; }
  .article-md-details-image img, .article-md-details-image span {
    max-width: 100%;
    max-height: 600px;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important; }

.article-md-row {
  border: 1px solid white;
  border-bottom: none; }
  .article-md-row .align-right {
    text-align: right; }
  .article-md-row .align-left {
    text-align: left; }
  .article-md-row.expanded {
    border: 1px solid #1584C3;
    border-bottom: none; }
  .article-md-row .arrow-icon {
    padding: 0 1em; }

.article-md-details-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1em;
  align-items: center;
  align-content: center; }

.article-md-details-group {
  display: contents; }
  .article-md-details-group > h4 {
    grid-column: 1;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase; }
    .article-md-details-group > h4 :after {
      content: ':'; }
  .article-md-details-group > div {
    grid-column: 2;
    font-size: 18px;
    font-weight: 400;
    text-align: left; }

.CategoriesCategoryDescriptionContainer {
  width: 100%;
  margin: 15px 0 15px 0; }
  @media screen and (max-width: 768px) {
    .CategoriesCategoryDescriptionContainer {
      text-align: start; } }
  .CategoriesCategoryDescriptionContainer > span {
    font-weight: bold;
    cursor: pointer; }

.CategoriesCategoryDescriptionContent {
  max-width: 100%;
  overflow: hidden; }
  @media screen and (max-width: 600px) {
    .CategoriesCategoryDescriptionContent {
      max-height: 300px; } }
  .CategoriesCategoryDescriptionContent-Full {
    max-height: unset; }

.CategoriesCategorySubCategoriesContainer {
  display: grid;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
  gap: 15px;
  padding: 10px 0; }
  .CategoriesCategorySubCategoriesContainer > div {
    background-color: white;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
    padding-top: 15px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    align-items: center; }
    .CategoriesCategorySubCategoriesContainer > div:hover {
      cursor: pointer;
      box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.6);
      transform: translate(-2px, -2px);
      transition: 0.2s ease-in-out all; }
    .CategoriesCategorySubCategoriesContainer > div div {
      width: 100%;
      height: 250px;
      position: relative; }
      .CategoriesCategorySubCategoriesContainer > div div img {
        width: 100%;
        height: 100%; }
    .CategoriesCategorySubCategoriesContainer > div p {
      padding-bottom: 15px;
      text-align: center;
      color: black; }

.LandingPageArticlesWithBookmarksSectionContainer {
  margin: 0 auto;
  max-width: var(--globalContainerWidth);
  padding: 30px 2px 0 2px; }
  .LandingPageArticlesWithBookmarksSectionContainerFull {
    max-width: 100%; }
  .LandingPageArticlesWithBookmarksSectionContainerWithContent {
    padding: 0 2px; }
  .LandingPageArticlesWithBookmarksSectionContainer .ArticlesListTileItemName {
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden; }

.LandingPageArticlesWithBookmarksSectionContent {
  padding: 25px; }
  @media screen and (max-width: 600px) {
    .LandingPageArticlesWithBookmarksSectionContent {
      padding: 20px 18px 25px; } }

.LandingPageArticlesSectionContainer {
  margin: 0 auto;
  max-width: var(--globalContainerWidth); }
  .LandingPageArticlesSectionContainerFull {
    max-width: 100%; }
  @media screen and (max-width: 600px) {
    .LandingPageArticlesSectionContainer .ProductPageMobileContainer {
      border-bottom: 4px solid var(--secondaryGray); }
      .LandingPageArticlesSectionContainer .ProductPageMobileContainer .TabsSectionExpandableTabLabel {
        padding: 20px;
        border: 4px solid var(--secondaryGray);
        flex-direction: row-reverse;
        justify-content: space-between; }
        .LandingPageArticlesSectionContainer .ProductPageMobileContainer .TabsSectionExpandableTabLabel > .TabsSectionExpandableTabLabelText {
          margin: 0 10px 0 0;
          font-size: 18px;
          font-weight: normal; }
      .LandingPageArticlesSectionContainer .ProductPageMobileContainer .TabsSectionExpandableTabContent {
        border-bottom: unset; }
        .LandingPageArticlesSectionContainer .ProductPageMobileContainer .TabsSectionExpandableTabContent > .ProductPageMobileWrapper {
          padding: 0 2px;
          background-color: var(--secondaryGray); } }

.LandingPageTinySectionContainer {
  margin: 0 auto;
  padding: 0 30px;
  max-width: var(--globalContainerWidth);
  overflow-wrap: break-word; }
  .LandingPageTinySectionContainerFull {
    max-width: 100%; }
  @media screen and (max-width: 768px) {
    .LandingPageTinySectionContainer {
      padding: 0 20px; } }

.LandingPageDoubleImageSectionContainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  max-width: var(--globalContainerWidth);
  margin: 0 auto;
  overflow: hidden; }
  .LandingPageDoubleImageSectionContainerFull {
    max-width: 100%; }

.LandingPageDoubleImageSectionContentWrapper {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  padding: 50px 0;
  max-width: var(--globalContainerWidth);
  overflow: hidden; }
  .LandingPageDoubleImageSectionContentWrapperFull {
    max-width: 100%; }
  @media screen and (max-width: 768px) {
    .LandingPageDoubleImageSectionContentWrapper {
      flex-direction: column;
      padding: 15px 18px;
      margin: 10px; } }

.LandingPageDoubleImageSectionWrapper {
  height: 100%;
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 20px;
  position: relative;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  margin: 0 20px; }
  @media screen and (max-width: 768px) {
    .LandingPageDoubleImageSectionWrapper {
      width: 100%;
      padding: 0;
      margin: 8px 0; } }
  .LandingPageDoubleImageSectionWrapperFull {
    padding: 0;
    margin: 0; }
    @media screen and (max-width: 768px) {
      .LandingPageDoubleImageSectionWrapperFull {
        margin: 10px; } }
  .LandingPageDoubleImageSectionWrapperPointer {
    cursor: pointer; }

.LandingPageDoubleImageSectionShade {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%; }

.LandingPageDoubleImageSectionLabel {
  height: 100%;
  width: 100%;
  z-index: 100;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 25px;
  margin: 0 auto; }

.LandingPageSliderWithButtonSectionDotsContainer {
  margin: 0;
  padding: 0; }
  .LandingPageSliderWithButtonSectionDotsContainer li button {
    border: 1px solid #CBCBCB;
    background-color: #CBCBCB;
    border-radius: 50%;
    width: 12px;
    height: 12px; }
    .LandingPageSliderWithButtonSectionDotsContainer li button::before {
      content: '';
      width: 12px;
      height: 12px; }
  .LandingPageSliderWithButtonSectionDotsContainer li.slick-active button::before {
    background-color: #fff;
    border-radius: 50%; }

.LandingPageSliderWithButtonSectionContainer {
  height: 100%;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  margin: 0; }
  .LandingPageSliderWithButtonSectionContainerFull {
    max-width: 100%; }
  @media screen and (max-width: 768px) {
    .LandingPageSliderWithButtonSectionContainer {
      width: 100%;
      height: 100%; } }
  .LandingPageSliderWithButtonSectionContainer .slick-arrow {
    padding: 50px; }

.LandingPageManufacturerCarouselSectionContainer {
  margin: 0 auto;
  max-width: var(--globalContainerWidth);
  background-color: var(--bg); }

.LandingPagePhotoWithTextSectionContainer {
  margin: 0 auto;
  overflow: hidden;
  max-width: var(--globalContainerWidth);
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 50px;
  position: relative; }
  .LandingPagePhotoWithTextSectionContainerFull {
    max-width: 100%; }

.LandingPagePhotoWithTextSectionButton {
  position: absolute;
  text-align: center;
  z-index: 100; }

.LandingPagePhotoWithTextSectionContainerPointer {
  cursor: pointer; }

.LandingPagePhotoWithTextSectionPositionLeftTop {
  left: 50px;
  top: 50px; }

.LandingPagePhotoWithTextSectionPositionLeftCenter {
  left: 50px;
  top: 50%;
  transform: translateY(-50%); }

.LandingPagePhotoWithTextSectionPositionLeftBottom {
  left: 50px;
  bottom: 50px; }

.LandingPagePhotoWithTextSectionPositionCenterTop {
  left: 50%;
  transform: translateX(-50%);
  top: 50px; }

.LandingPagePhotoWithTextSectionPositionCenterCenter {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); }

.LandingPagePhotoWithTextSectionPositionCenterBottom {
  left: 50%;
  transform: translateX(-50%);
  bottom: 50px; }

.LandingPagePhotoWithTextSectionPositionRightTop {
  right: 50px;
  top: 50px; }

.LandingPagePhotoWithTextSectionPositionRightCenter {
  right: 50px;
  top: 50%;
  transform: translateY(-50%); }

.LandingPagePhotoWithTextSectionPositionRightBottom {
  right: 50px;
  bottom: 50px; }

.TinyWrapper_PhotoWithTextSection_Content {
  z-index: 100;
  position: relative;
  width: 100%; }

.LandingPagePromotedSectionContainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
  max-width: var(--globalContainerWidth); }

.LandingPagePromotedSectionImageContainerFullWidth {
  max-width: 100%; }
  .LandingPagePromotedSectionImageContainerFullWidth .LandingPagePromotedSectionWrapper {
    padding: 0; }
    .LandingPagePromotedSectionImageContainerFullWidth .LandingPagePromotedSectionWrapper .LandingPagePromotedSectionLabel {
      padding: 20px; }
      @media screen and (max-width: 480px) {
        .LandingPagePromotedSectionImageContainerFullWidth .LandingPagePromotedSectionWrapper .LandingPagePromotedSectionLabel {
          padding: 10px; } }

.LandingPagePromotedSectionContainerPointer {
  cursor: pointer; }

.LandingPagePromotedSectionWrapper {
  max-width: var(--globalContainerWidth);
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 20px; }
  .LandingPagePromotedSectionWrapperFull {
    max-width: 100%; }
  .LandingPagePromotedSectionWrapperReverse {
    flex-direction: row-reverse; }
    .LandingPagePromotedSectionWrapperReverse .LandingPagePromotedSectionLabel {
      align-items: flex-start;
      padding-right: 20px;
      padding-left: unset; }
      @media screen and (max-width: 480px) {
        .LandingPagePromotedSectionWrapperReverse .LandingPagePromotedSectionLabel {
          padding-right: unset; } }
  @media screen and (max-width: 480px) {
    .LandingPagePromotedSectionWrapper {
      flex-direction: column;
      padding: 10px; } }

.LandingPagePromotedSectionImage {
  position: relative;
  width: 45%;
  height: 100%; }
  @media screen and (max-width: 480px) {
    .LandingPagePromotedSectionImage {
      width: 100%;
      height: 45%; } }

.LandingPagePromotedSectionLabel {
  height: 100%;
  width: 55%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  padding-left: 20px; }
  .LandingPagePromotedSectionLabel div.buttonContainer {
    margin-top: 30px; }
  @media screen and (max-width: 480px) {
    .LandingPagePromotedSectionLabel {
      width: 100%;
      height: 55%;
      padding-left: unset;
      padding-top: 10px;
      justify-content: flex-end;
      align-items: flex-start; }
      .LandingPagePromotedSectionLabel div.buttonContainer {
        margin-top: 10px; } }

.TinyWrapper_PromotedSection_Content {
  position: relative;
  width: 100%; }

.LandingPagePromotedSectionPositionLeftTop {
  left: 10px;
  top: 10px; }
  @media screen and (min-width: 1024px) {
    .LandingPagePromotedSectionPositionLeftTop {
      left: 80px;
      top: 80px; } }

.LandingPagePromotedSectionPositionLeftCenter {
  left: 10px;
  top: 50%;
  transform: translateY(-50%); }
  @media screen and (min-width: 1024px) {
    .LandingPagePromotedSectionPositionLeftCenter {
      left: 80px; } }

.LandingPagePromotedSectionPositionLeftBottom {
  left: 10px;
  bottom: 10px; }
  @media screen and (min-width: 1024px) {
    .LandingPagePromotedSectionPositionLeftBottom {
      left: 80px;
      bottom: 80px; } }

.LandingPagePromotedSectionPositionCenterTop {
  left: 50%;
  transform: translateX(-50%);
  top: 10px; }
  @media screen and (min-width: 1024px) {
    .LandingPagePromotedSectionPositionCenterTop {
      top: 80px; } }

.LandingPagePromotedSectionPositionCenterCenter {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); }

.LandingPagePromotedSectionPositionCenterBottom {
  left: 50%;
  transform: translateX(-50%);
  bottom: 10px; }
  @media screen and (min-width: 1024px) {
    .LandingPagePromotedSectionPositionCenterBottom {
      bottom: 80px; } }

.LandingPagePromotedSectionPositionRightTop {
  right: 10px;
  top: 10px; }
  @media screen and (min-width: 1024px) {
    .LandingPagePromotedSectionPositionRightTop {
      right: 80px;
      top: 80px; } }

.LandingPagePromotedSectionPositionRightCenter {
  right: 10px;
  top: 50%;
  transform: translateY(-50%); }
  @media screen and (min-width: 1024px) {
    .LandingPagePromotedSectionPositionRightCenter {
      right: 80px; } }

.LandingPagePromotedSectionPositionRightBottom {
  right: 10px;
  bottom: 10px; }
  @media screen and (min-width: 1024px) {
    .LandingPagePromotedSectionPositionRightBottom {
      right: 80px;
      bottom: 80px; } }

.buttonContainer {
  position: relative;
  width: 100%;
  height: 100%; }

.LandingPagePromotedSectionButton {
  position: absolute;
  text-align: center;
  z-index: 100; }

.VideoSectionContainer {
  margin: 0 auto;
  max-height: 100%;
  height: 100%;
  max-width: var(--globalContainerWidth);
  width: 100%;
  cursor: pointer;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; }
  .VideoSectionContainerLeft, .VideoSectionContainerRight {
    display: flex;
    align-items: center;
    justify-content: space-between; }
  .VideoSectionContainerLeft {
    flex-direction: row-reverse; }
  .VideoSectionContainer > div:nth-child(2) {
    width: inherit;
    height: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 30px; }
    @media screen and (max-width: 480px) {
      .VideoSectionContainer > div:nth-child(2) {
        padding: 20px; } }

.VideoSectionContainerFull {
  max-width: 100%; }
  .VideoSectionContainerFull > div:nth-child(2) {
    padding: 0; }

.VideoSectionVideoContainer {
  width: 50%; }
  .VideoSectionVideoContainerFull {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%; }

.VideoSectionLabel {
  width: 50%;
  position: relative;
  padding: 20px;
  overflow: hidden; }
  @media screen and (max-width: 768px) {
    .VideoSectionLabel {
      padding: 10px; } }

.VideoSectionVideoContainerFullLabel {
  z-index: 100;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.VideoSectionWrapper {
  max-width: var(--globalContainerWidth);
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  justify-content: space-between; }
  .VideoSectionWrapper-Left {
    flex-direction: row; }
  .VideoSectionWrapper-Right {
    flex-direction: row-reverse; }

.VideoSectionWrapperFull {
  max-width: 100%; }

.TinyWrapper_VideoSection_Content {
  z-index: 100;
  overflow-wrap: break-word; }

.LandingPageVideoSectionSectionButton {
  position: absolute;
  text-align: center;
  z-index: 100; }

.LandingPageVideoSectionSectionPositionLeftTop {
  left: 50px;
  top: 50px; }

.LandingPageVideoSectionSectionPositionLeftCenter {
  left: 50px;
  top: 50%;
  transform: translateY(-50%); }

.LandingPageVideoSectionSectionPositionLeftBottom {
  left: 50px;
  bottom: 50px; }

.LandingPageVideoSectionSectionPositionCenterTop {
  left: 50%;
  transform: translateX(-50%);
  top: 50px; }

.LandingPageVideoSectionSectionPositionCenterCenter {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); }

.LandingPageVideoSectionSectionPositionCenterBottom {
  left: 50%;
  transform: translateX(-50%);
  bottom: 50px; }

.LandingPageVideoSectionSectionPositionRightTop {
  right: 50px;
  top: 50px; }

.LandingPageVideoSectionSectionPositionRightCenter {
  right: 50px;
  top: 50%;
  transform: translateY(-50%); }

.LandingPageVideoSectionSectionPositionRightBottom {
  right: 50px;
  bottom: 50px; }

.LandingPageAnimatedSliderWithButtonSectionDotsContainer {
  margin: 0;
  padding: 0; }
  .LandingPageAnimatedSliderWithButtonSectionDotsContainer li button {
    border: 1px solid #CBCBCB;
    background-color: #CBCBCB;
    border-radius: 50%;
    width: 12px;
    height: 12px; }
    .LandingPageAnimatedSliderWithButtonSectionDotsContainer li button::before {
      content: '';
      width: 12px;
      height: 12px; }
  .LandingPageAnimatedSliderWithButtonSectionDotsContainer li.slick-active button::before {
    background-color: #fff;
    border-radius: 50%; }

.LandingPageAnimatedSliderWithButtonSectionContainer {
  height: 100%;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  margin: 0; }
  @media screen and (max-width: 768px) {
    .LandingPageAnimatedSliderWithButtonSectionContainer {
      width: 100%;
      height: 100%; } }
  .LandingPageAnimatedSliderWithButtonSectionContainer .slick-arrow {
    border-radius: 0;
    box-shadow: none;
    padding: 30px;
    background-color: rgba(39, 39, 39, 0.274);
    margin: 20px; }
    .LandingPageAnimatedSliderWithButtonSectionContainer .slick-arrow > .ArrowItem {
      color: white; }
    @media screen and (max-width: 768px) {
      .LandingPageAnimatedSliderWithButtonSectionContainer .slick-arrow {
        display: none; } }
  @media screen and (min-width: 1920px) {
    .LandingPageAnimatedSliderWithButtonSectionContainer-FullWidth {
      left: unset;
      transform: unset; } }

.LandingPageMapSectionContainer {
  margin: 50px auto;
  padding: 0 30px;
  max-width: 100%;
  max-width: var(--globalContainerWidth);
  overflow-wrap: break-word;
  height: 100%; }
  @media screen and (max-width: 768px) {
    .LandingPageMapSectionContainer {
      padding: 0 20px; } }

.InputsExtendedFormContainer {
  width: 100%;
  margin-bottom: 40px; }

.InputsExtendedFormDivider {
  width: 100%;
  height: 0px;
  margin-bottom: 10px; }

.InputsExtendedFormLabel {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 100px;
  margin-top: 50px; }
  @media screen and (max-width: 768px) {
    .InputsExtendedFormLabel {
      margin-top: 1em;
      margin-bottom: 2em; } }

.InputsExtendedFormAdditionalLabel {
  font-size: 16px;
  font-weight: 600;
  margin: 20px 0 10px; }

.InputsExtendedFormStyledForm {
  width: 100%; }

.InputsExtendedFormInputs {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 20px auto;
  padding: 0 5px; }

.InputsExtendedFormButtons {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: relative; }
  @media screen and (min-width: 600px) {
    .InputsExtendedFormButtons {
      flex-direction: row-reverse;
      justify-content: space-between; } }

.InputsExtendedFormButton {
  margin: 20px 0 0;
  width: 100%; }
  @media screen and (min-width: 600px) {
    .InputsExtendedFormButton:nth-of-type(1) {
      margin: 20px 0 0 20px; } }

.InputsExtendedFormRow {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%; }
  @media screen and (max-width: 600px) {
    .InputsExtendedFormRow {
      display: block; } }

.InputsExtendedFormWideField {
  width: 47.5%; }
  @media screen and (max-width: 600px) {
    .InputsExtendedFormWideField {
      width: 97.5%; } }

.InputsExtendedFormNarrowField {
  width: 30%; }

.InputsExtendedFormAdditional {
  width: 100%;
  overflow: hidden;
  padding: 0 5px;
  margin: 0 -5px; }

.InputsExtendedFormError {
  position: absolute;
  left: 0;
  color: red;
  font-size: 12px; }

.InputsExtendedFormCompanyCheckbox {
  padding: 5px; }

.InputsExtendedFormCompanyCheckboxWrapper {
  display: flex;
  align-content: center;
  margin-bottom: 1em;
  align-items: center; }

.ShipmentMethodContainer {
  margin-top: 16px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  padding: 30px 32px;
  cursor: pointer; }

.ShipmentMethodWrapper {
  display: flex;
  justify-content: space-between;
  align-items: center; }

.ShipmentMethodFree {
  font-weight: 300;
  opacity: .9; }

.ShipmentMethodPlanned {
  margin-left: 30px; }

.ShipmentMethodImage {
  width: 60px;
  height: 30px;
  position: relative; }

.ShipmentMethodStyledButton {
  margin-top: 15px; }

.ShipmentMethodCheckedParcelLocker {
  margin-top: 10px;
  display: flex;
  justify-content: space-between; }
  .ShipmentMethodCheckedParcelLocker small {
    cursor: pointer; }

.ShipmentMethodContainer {
  margin-top: 16px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  padding: 20px;
  cursor: pointer; }
  @media screen and (max-width: 1200px) {
    .ShipmentMethodContainer {
      font-size: 14px; } }
  @media screen and (max-width: 600px) {
    .ShipmentMethodContainer {
      padding: 14px; } }

.ShipmentMethodWrapper {
  display: flex;
  justify-content: space-between;
  align-items: center; }
  @media screen and (max-width: 1200px) {
    .ShipmentMethodWrapper {
      margin-bottom: 14px;
      margin-top: 16px; } }
  @media screen and (max-width: 375px) {
    .ShipmentMethodWrapper {
      font-size: 14px; } }

.ShipmentMethodFree {
  font-weight: 300;
  opacity: .9; }

.ShipmentMethodPlanned {
  margin-left: 30px; }

.ShipmentMethodImage {
  width: 60px;
  height: 30px;
  position: relative; }

.ShipmentMethodStyledButton {
  margin-top: 15px; }
  @media screen and (max-width: 375px) {
    .ShipmentMethodStyledButton {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 20px;
      background-color: white;
      border-top: 2px solid #C4C4C4;
      z-index: 1; } }

.ShipmentMethodCheckedParcelLocker {
  margin-top: 10px;
  display: flex;
  justify-content: space-between; }
  .ShipmentMethodCheckedParcelLocker small {
    cursor: pointer; }

.ShipmentMethodDiscountInfo {
  margin: 20px 10px;
  padding: 20px;
  font-weight: bold;
  color: darkgoldenrod;
  background-color: lightyellow;
  text-align: center; }

.ShipmentMethodUserAddresses {
  margin-top: 20px; }

.ShipmentMethodInpostAdditionalForm {
  padding: 2em 1em 1em 1em; }
  .ShipmentMethodInpostAdditionalForm > p {
    padding-bottom: 10px; }

.ShipmentMethodInpostAgreementCheckbox .CheckboxStyledCheckbox::before {
  width: 16px !important;
  height: 16px !important;
  margin-right: 5px; }

.ShipmentMethodInpostAgreementCheckbox .CheckboxStyledCheckbox::after {
  margin-top: 3px; }

.ShipmentMethodInpostAgreementCheckbox .CheckboxCheckbox:checked + .CheckboxStyledCheckbox::after {
  top: -1px;
  left: -2px; }

.ShipmentMethodInpostAgreementWhenChecked {
  color: inherit; }

.ShipmentMethodInpostAgreementWhenUnChecked {
  color: red; }

.OrderSummarySectionContainer {
  padding: 10px;
  width: 100%;
  position: relative; }
  @media screen and (max-width: 480px) {
    .OrderSummarySectionContainer {
      font-size: 14px; } }
  @media screen and (max-width: 375px) {
    .OrderSummarySectionContainer {
      font-size: 13px; } }

.OrderSummarySectionButton {
  position: absolute;
  right: 5px;
  top: 5px;
  background-color: transparent;
  text-decoration: underline;
  border: none;
  font-size: 14px;
  cursor: pointer; }

.OrderSummarySectionRowWrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 10px 0; }
  .OrderSummarySectionRowWrapper span {
    display: flex;
    align-items: center; }
    .OrderSummarySectionRowWrapper span img {
      width: 50px; }

.OrderSummarySectionHeading {
  margin: 0;
  margin-bottom: 32px; }

.OrderSummarySectionMargin {
  margin-right: 10px; }

.OrderSummarySectionSubHeading {
  margin-top: 20px; }

.OrderSummaryStyledButton {
  margin-top: 15px; }
  @media screen and (max-width: 375px) {
    .OrderSummaryStyledButton {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 20px;
      background-color: white;
      border-top: 2px solid #C4C4C4;
      z-index: 1; } }

.ProductPageDescriptionContainer {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
  font-size: 14px; }

.ProductPageDescriptionText {
  margin: 0; }

.ProductPageDescriptionDetails {
  margin-top: 10px; }

.ProductPageDescriptionDetailsContent {
  overflow: hidden; }

.ProductPageDescriptionDetailsContentText {
  margin: 0; }

.ProductPageTabsSectionContainer {
  width: 100%;
  background-color: var(--bg); }
  .ProductPageTabsSectionContainerFull {
    width: 100%; }

.NumberOfTilesSelectorSmallGrid::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F00A"; }

.NumberOfTilesSelectorBigGrid::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F009"; }

.MobileFiltersButton {
  border: 0px;
  background-color: transparent;
  cursor: pointer;
  position: relative; }
  .MobileFiltersButton i:after {
    font-size: 24px;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F1DE"; }
  .MobileFiltersButton span {
    position: absolute;
    right: -8px;
    top: -6px;
    color: white;
    font-size: 11px;
    font-weight: bold;
    display: inline-block;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    background-color: red;
    border-radius: 12px; }

.MobileFiltersButtonClose {
  border: 0px;
  background-color: transparent;
  cursor: pointer;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0em;
  text-align: left;
  display: flex;
  align-items: center; }
  .MobileFiltersButtonClose i:after {
    font-size: 20px;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\F177";
    margin-right: 0.25em; }

.MobileFiltersContainer {
  position: fixed;
  top: 60px;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: white;
  z-index: 9999;
  transform: translateX(100vw);
  transition: 0.2s all;
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: 80px 1fr 80px;
  grid-template-areas: "mfHeader" "mfContent" "mfActions"; }
  .MobileFiltersContainer-Opened {
    transform: translateX(0vw); }
    .MobileFiltersContainer-Opened .MobileFiltersValueSelector {
      display: grid; }

.MobileFiltersContainerHeader {
  grid-area: mfHeader;
  display: flex;
  flex-direction: row;
  width: 100%;
  padding: 15px 10px;
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2); }
  .MobileFiltersContainerHeader > div {
    width: 50%;
    display: flex;
    flex-direction: row; }
    .MobileFiltersContainerHeader > div:first-child {
      justify-content: flex-start; }
    .MobileFiltersContainerHeader > div:last-child {
      justify-content: flex-end; }

.MobileFiltersContainerContent {
  position: relative;
  grid-area: mfContent;
  overflow: auto;
  padding: 1em 15px; }

.MobileFiltersActions {
  grid-area: mfActions;
  display: flex;
  flex-direction: row;
  box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
  padding-top: 8px; }
  .MobileFiltersActions .MobileFiltersActionsApplyButton {
    width: 50%;
    min-width: 125px;
    margin: 8px 13px; }
  .MobileFiltersActions .MobileFiltersActionsClearButton {
    width: 50%;
    min-width: 125px;
    margin: 8px 13px; }

.MobileFiltersValueSelector {
  position: fixed;
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
  padding: 10px 20px;
  background-color: #fff;
  overflow-y: scroll;
  overflow-x: hidden;
  z-index: 9999;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4);
  transform: translateX(-110%);
  transition: 0s all;
  display: none;
  grid-template-columns: 100%;
  grid-template-rows: auto 1fr 75px;
  grid-template-areas: "mfvsHeader" "mfvsContent" "mfvsActions"; }
  .MobileFiltersValueSelector-Opened {
    transform: translateX(0%);
    transition: 0.2s all; }
  .MobileFiltersValueSelector-Closed {
    transform: translateX(110%);
    transition: 0.2s all; }
  .MobileFiltersValueSelector > div:nth-child(1) {
    grid-area: mfvsHeader; }
    .MobileFiltersValueSelector > div:nth-child(1) h3 {
      position: relative;
      margin: 0.5em 0 0.24em 0;
      padding: 0 20px 1em 0;
      font-family: var(--font-family);
      font-size: 18px;
      font-style: normal;
      font-weight: 400;
      line-height: 21px;
      letter-spacing: 0em;
      text-align: left; }
      .MobileFiltersValueSelector > div:nth-child(1) h3 span {
        position: absolute;
        top: 0;
        right: 0; }
  .MobileFiltersValueSelector > div:nth-child(2) {
    grid-area: mfvsContent;
    overflow-x: hidden;
    overflow-y: auto; }
  .MobileFiltersValueSelector > div:nth-child(3) {
    grid-area: mfvsActions;
    margin-top: 20px; }

.MobileFiltersSection h2 {
  border-bottom: 1px solid #C4C4C4;
  padding: 0 0 1em 0;
  margin: 1em 0;
  font-family: var(--font-family);
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 21px;
  letter-spacing: 0em;
  text-align: left; }

.MobileFiltersSection .MobileFiltersSectionContent ul {
  list-style: none;
  margin: 0;
  padding: 0; }
  .MobileFiltersSection .MobileFiltersSectionContent ul li {
    padding-bottom: 1em; }
    .MobileFiltersSection .MobileFiltersSectionContent ul li h3 {
      display: flex;
      align-items: center;
      position: relative;
      padding-right: 20px;
      font-family: var(--font-family);
      font-size: 18px;
      font-style: normal;
      font-weight: 400;
      line-height: 21px;
      margin: 0.5em 0 0.24em 0;
      letter-spacing: 0em;
      text-align: left; }
      .MobileFiltersSection .MobileFiltersSectionContent ul li h3 svg {
        position: absolute;
        top: 0;
        right: 0; }
      .MobileFiltersSection .MobileFiltersSectionContent ul li h3 span:nth-child(2) {
        display: inline-block;
        position: relative;
        margin-left: 0.25em; }
        .MobileFiltersSection .MobileFiltersSectionContent ul li h3 span:nth-child(2) span {
          display: flex;
          justify-content: center;
          align-items: center;
          width: 18px;
          height: 18px;
          background-color: red;
          border-radius: 9px; }
          .MobileFiltersSection .MobileFiltersSectionContent ul li h3 span:nth-child(2) span em {
            color: white;
            font-size: 11px;
            font-weight: bold;
            font-style: normal; }
    .MobileFiltersSection .MobileFiltersSectionContent ul li em {
      display: block;
      font-size: 12px;
      padding: 0.25em 0;
      color: #999; }
    .MobileFiltersSection .MobileFiltersSectionContent ul li small {
      font-family: var(--font-family);
      font-size: 12px;
      font-style: normal;
      font-weight: 300;
      line-height: 14px;
      letter-spacing: 0em;
      text-align: left; }
    .MobileFiltersSection .MobileFiltersSectionContent ul li span.tagBox {
      display: inline-block;
      padding: 5px 10px;
      margin: 2px; }
    .MobileFiltersSection .MobileFiltersSectionContent ul li span.colorBox {
      display: inline-block;
      width: 32px;
      height: 32px;
      margin: 2px; }

.MobileFiltersValueSelectorTag span.tagBox {
  display: inline-block;
  padding: 5px 10px;
  margin: 5px;
  filter: grayscale(0.75);
  border: 1px solid white;
  opacity: 0.5; }
  .MobileFiltersValueSelectorTag span.tagBox.selected {
    outline: 1px solid black;
    box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.5);
    opacity: 1;
    filter: grayscale(0); }

.MobileFiltersValueSelectorDictionary {
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: auto 1fr;
  grid-template-areas: "mfvsdSearchForm" "mfvsdValues";
  height: 100%; }
  .MobileFiltersValueSelectorDictionary span.dictionaryEntry {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 8px 0 8px 0; }
    .MobileFiltersValueSelectorDictionary span.dictionaryEntry i {
      font-size: 24px; }
    .MobileFiltersValueSelectorDictionary span.dictionaryEntry svg {
      visibility: hidden; }
    .MobileFiltersValueSelectorDictionary span.dictionaryEntry span:nth-child(1) {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 24px;
      height: 24px;
      border: 1px solid black; }
    .MobileFiltersValueSelectorDictionary span.dictionaryEntry span:nth-child(2) {
      display: inline-block;
      margin-left: 0.5em;
      padding: 3px 5px; }
    .MobileFiltersValueSelectorDictionary span.dictionaryEntry.selected svg {
      visibility: visible; }
  .MobileFiltersValueSelectorDictionary .MobileFiltersValueSelectorDictionarySearchForm {
    grid-area: "mfvsdSearchForm";
    display: grid;
    grid-template-columns: 1fr 24px;
    gap: 5px;
    grid-template-areas: "mfvsdInput mfvsdSearchButton"; }
    .MobileFiltersValueSelectorDictionary .MobileFiltersValueSelectorDictionarySearchForm input {
      grid-area: mfvsdInput;
      height: 32px; }
    .MobileFiltersValueSelectorDictionary .MobileFiltersValueSelectorDictionarySearchForm span {
      display: flex;
      justify-self: center;
      align-items: center;
      grid-area: mfvsdSearchButton; }
  .MobileFiltersValueSelectorDictionary .MobileFiltersValueSelectorDictionaryValues {
    grid-area: "mfvsdValues";
    overflow-x: hidden;
    overflow-y: auto; }

.MobileFiltersValueSelectorInt > div {
  display: flex;
  flex-direction: row;
  align-items: center; }

.MobileFiltersValueSelectorInt input {
  height: 2.5em;
  border: 0;
  border-bottom: 2px solid black;
  margin: 0.25em;
  text-align: right; }

.MobileFiltersValueSelectorInt span.clearButton {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px; }
  .MobileFiltersValueSelectorInt span.clearButton i {
    display: inline-block;
    width: 32px;
    height: 32px;
    font-size: 24px; }

.MobileFiltersValueSelectorDecimal > div {
  display: flex;
  flex-direction: row;
  align-items: center; }

.MobileFiltersValueSelectorDecimal input {
  height: 2.5em;
  border: 0;
  border-bottom: 2px solid black;
  margin: 0.25em;
  text-align: right; }

.MobileFiltersValueSelectorDecimal span.clearButton {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px; }
  .MobileFiltersValueSelectorDecimal span.clearButton i {
    display: inline-block;
    width: 32px;
    height: 32px;
    font-size: 24px; }

.MobileFiltersValueSelectorDateTime > div {
  display: flex;
  flex-direction: row;
  align-items: center; }

.MobileFiltersValueSelectorDateTime input {
  height: 2.5em;
  border: 0;
  border-bottom: 2px solid black;
  margin: 0.25em;
  text-align: right; }

.MobileFiltersValueSelectorDateTime span.clearButton {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px; }
  .MobileFiltersValueSelectorDateTime span.clearButton i {
    display: inline-block;
    width: 32px;
    height: 32px;
    font-size: 24px; }

.MobileFiltersValueSelectorColor span.color {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 8px 0 8px 0; }
  .MobileFiltersValueSelectorColor span.color i {
    font-size: 24px; }
  .MobileFiltersValueSelectorColor span.color svg {
    visibility: hidden; }
  .MobileFiltersValueSelectorColor span.color.selected svg {
    visibility: visible; }
  .MobileFiltersValueSelectorColor span.color span:nth-child(1) {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    border: 1px solid black; }
  .MobileFiltersValueSelectorColor span.color span:nth-child(2) {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 2px 2px 2px 0.5em;
    border: 1px solid #999; }
  .MobileFiltersValueSelectorColor span.color span:nth-child(3) {
    margin-left: 0.5em; }

.MobileFiltersValueSelectorBoolean label {
  display: flex;
  flex-direction: row;
  align-items: center; }
  .MobileFiltersValueSelectorBoolean label i {
    font-size: 24px; }
  .MobileFiltersValueSelectorBoolean label svg {
    visibility: hidden; }
  .MobileFiltersValueSelectorBoolean label span:nth-child(1) {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    border: 1px solid black; }
  .MobileFiltersValueSelectorBoolean label span:nth-child(2) {
    padding-left: 0.5em; }
  .MobileFiltersValueSelectorBoolean label.selected svg {
    visibility: visible; }

.MobileFiltersValueSelectorSort span.sortEntry {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 8px 0 8px 0; }
  .MobileFiltersValueSelectorSort span.sortEntry i {
    font-size: 24px; }
  .MobileFiltersValueSelectorSort span.sortEntry svg {
    visibility: hidden; }
  .MobileFiltersValueSelectorSort span.sortEntry span:nth-child(1) {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    border: 1px solid black;
    border-radius: 12px; }
  .MobileFiltersValueSelectorSort span.sortEntry span:nth-child(2) {
    padding-left: 0.5em; }
  .MobileFiltersValueSelectorSort span.sortEntry.selected svg {
    visibility: visible; }

.ViewSelectorListIcon::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\F00B"; }

.SearchSuggestionsContainer {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  min-height: 200px;
  height: calc(100% - 60px);
  background-color: #fff;
  color: #000;
  overflow: auto; }
  .SearchSuggestionsContainer.Desktop {
    height: auto;
    max-height: calc(100% - 60px);
    min-width: 400px;
    width: 90vw;
    max-width: 1700px;
    top: 60px;
    left: 50%;
    transform: translate(-50%, 0);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2); }

.GlobalLayoutContainer.PromoBarOverMenu .SearchSuggestionsContainer.Desktop {
  top: 105px; }

.SearchSuggestionsWrapper > small, .SearchSuggestionsWrapper .SearchSuggestionsContent {
  padding: 20px; }
  @media screen and (max-width: 600px) {
    .SearchSuggestionsWrapper > small, .SearchSuggestionsWrapper .SearchSuggestionsContent {
      padding: 10px; } }

.SearchSuggestionsProductsContainer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start; }
  @media screen and (max-width: 1024px) {
    .SearchSuggestionsProductsContainer {
      justify-content: center;
      align-items: center; } }

.SearchSuggestionsProductsSpinner {
  display: flex;
  justify-content: center; }

.SearchSuggestionsProductsCheckbox {
  margin-top: 10px; }
  .SearchSuggestionsProductsCheckbox > input {
    margin-right: .5em;
    vertical-align: middle; }

.SelectedProductProductImageModalContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center; }
  .SelectedProductProductImageModalContainer .carouselContainer {
    width: 80%; }
    .SelectedProductProductImageModalContainer .carouselContainer .slick-dots {
      display: flex !important;
      justify-content: center;
      align-items: center;
      margin: 0 auto;
      bottom: 0;
      left: -30px; }
      .SelectedProductProductImageModalContainer .carouselContainer .slick-dots li {
        margin: 0 30px;
        opacity: .5; }
      .SelectedProductProductImageModalContainer .carouselContainer .slick-dots li:first-of-type {
        margin-left: 0; }
      .SelectedProductProductImageModalContainer .carouselContainer .slick-dots li:last-of-type {
        margin-right: 0; }
      .SelectedProductProductImageModalContainer .carouselContainer .slick-dots li.slick-active {
        opacity: 1; }
  .SelectedProductProductImageModalContainer .slick-arrow {
    padding: 20px; }

.SelectedProductProductImageModalCustomPaginationImage {
  display: block;
  width: 70px;
  height: 70px;
  -webkit-box-shadow: 0px 0px 5px -2px rgba(0, 0, 0, 0.35);
  -moz-box-shadow: 0px 0px 5px -2px rgba(0, 0, 0, 0.35);
  box-shadow: 0px 0px 5px -2px rgba(0, 0, 0, 0.35); }
  .SelectedProductProductImageModalCustomPaginationImage img {
    max-width: 70px;
    max-height: 70px; }

.SelectedProductProductTabsSectionAlternativeSectionContainer {
  width: 80%;
  margin: 0 auto; }

.SelectedProductProductTabsSectionAskQuestionContainer {
  width: 100%;
  margin: 0 auto; }

.SelectedProductProductTabsSectionParametersSectionValue {
  text-transform: none;
  font-weight: 400;
  font-size: 15px;
  margin-left: 5px;
  padding-right: 10px; }

.SelectedProductProductTabsSectionParametersSectionNullStyled {
  color: black;
  font-style: italic; }

.SelectedProductProductTabsSectionParametersSectionImage {
  height: 24px;
  width: 24px; }

.SelectedProductProductTabsSectionDescriptionSectionContainer p {
  color: grey;
  font-size: 14px;
  line-height: 1.6; }

.SelectedProductProductTabsSectionJointlyOrderedSectionContainer {
  width: 80%;
  margin: 0 auto; }

.SelectedProductProductTabsSectionParametersSectionRow {
  width: 100%;
  display: flex;
  align-items: center;
  padding: 10px;
  background-color: #F3F3F3; }

.SelectedProductProductTabsSectionParametersSectionContainer .SelectedProductProductTabsSectionParametersSectionRow:nth-child(even) {
  background-color: #fff; }

.SelectedProductProductTabsSectionParametersSectionRowWhite {
  width: 100%;
  background-color: white;
  display: flex;
  align-items: center;
  padding: 10px; }

.SelectedProductProductTabsSectionParametersSectionValue, .SelectedProductProductTabsSectionParametersSectionQuantity {
  font-weight: 400;
  font-size: 16px;
  width: 50%;
  text-align: left;
  padding-left: 10px; }
  @media screen and (max-width: 480px) {
    .SelectedProductProductTabsSectionParametersSectionValue, .SelectedProductProductTabsSectionParametersSectionQuantity {
      font-size: 12px; } }

.SelectedProductProductTabsSectionParametersSectionNullStyled {
  color: black;
  font-style: italic; }

.SelectedProductProductTabsSectionParametersSectionQuantity {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 5px;
  font-weight: 400;
  font-size: 16px; }

.SelectedProductProductTabsSectionParametersSectionLabel {
  width: 50%;
  text-align: right;
  padding-right: 10px;
  font-weight: 300;
  font-size: 16px; }
  @media screen and (max-width: 480px) {
    .SelectedProductProductTabsSectionParametersSectionLabel {
      font-size: 12px; } }

.SelectedProductProductTabsSectionRelatedSectionContainer {
  width: 80%;
  margin: 0 auto; }

.ProductToolbarContainer {
  display: flex;
  flex-direction: column;
  width: 100%; }

.ProductToolbarHeader {
  width: 100%;
  margin-bottom: 20px; }

.ProductToolbarControls {
  width: 100%;
  align-self: flex-start;
  margin-bottom: 30px; }

.ProductToolbarDescription {
  width: 100%;
  margin-bottom: 15px; }

.ProductToolbarRelatedItems {
  width: 100%;
  margin-bottom: 20px; }

.VariantsDropdownItemContainer {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 0 10px;
  align-items: center; }

.VariantsDropdownItemLabel {
  font-weight: 700; }

.VariantsDropdownItemInfo {
  opacity: .9; }

.VariantsImageSelectionWrapper {
  display: flex;
  flex-direction: column;
  padding: 20px 0; }

.VariantsImageSelectionLabel {
  padding-bottom: 10px; }
  .VariantsImageSelectionLabel-Title {
    color: rgba(0, 0, 0, 0.6); }
  .VariantsImageSelectionLabel-Selection {
    font-weight: 700;
    padding-left: 10px; }

.VariantsImageSelectionImageContainer {
  width: 100%;
  display: flex;
  align-items: center; }

.VariantsImageSelectionImage {
  width: 54px;
  height: 80px;
  margin-right: 16px;
  background-size: contain;
  background-repeat: no-repeat;
  transition: .2s;
  position: relative;
  cursor: pointer; }
  .VariantsImageSelectionImage:first-child {
    border: 3px solid black; }
  .VariantsImageSelectionImage:hover {
    border: 3px solid black; }

.CartFullViewHeader {
  display: flex;
  justify-content: space-between;
  border-color: #C4C4C4;
  border-style: solid;
  border-width: 1px 0;
  padding: 1em 0.2em;
  cursor: pointer; }
  .CartFullViewHeader-Open {
    border-bottom-width: 0; }
  .CartFullViewHeader > span {
    font-size: 13px; }
    .CartFullViewHeader > span > i {
      margin-right: 1em; }

.CartFullViewContentIcon {
  margin-right: 1em;
  transition: transform ease-in 0.1s; }
  .CartFullViewContentIcon-Open {
    transform: rotate(90deg); }

.CartFullViewContent {
  padding: 0;
  overflow: hidden;
  margin: 0;
  width: 100%; }

.ContactFormPageTemplatePageContent {
  margin: 30px 0; }

.ContactFormPageTemplateMapHeader {
  width: 100%;
  text-align: center;
  margin: 30px 0; }

.InactiveOrderTemplateContainer {
  width: 100%;
  padding: 0 10px;
  max-width: 800px;
  margin: 150px auto; }

.LandingPageTemplateContainer {
  margin: 0 auto; }

.LoginTemplateContainer {
  width: 100%;
  height: 100%; }

.LoginTemplateWrapper {
  padding: 24px 48px;
  max-width: var(--globalContainerWidth);
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 0 auto; }
  @media screen and (max-width: 768px) {
    .LoginTemplateWrapper {
      flex-direction: column; } }
  .LoginTemplateWrapper .InputsLoginControlContainer {
    width: 100%; }

.LoginTemplateLoginSection,
.LoginTemplateRegisterSection {
  min-height: 100%;
  width: 50%;
  padding: 52px 56px; }
  @media screen and (max-width: 768px) {
    .LoginTemplateLoginSection,
    .LoginTemplateRegisterSection {
      width: 100%;
      padding: 0; } }

.LoginTemplateLoginSection {
  border: 1px solid var(--main-color); }
  @media screen and (max-width: 768px) {
    .LoginTemplateLoginSection {
      border: none; } }

.LoginTemplateRegisterSection {
  margin-left: 100px; }
  @media screen and (max-width: 768px) {
    .LoginTemplateRegisterSection {
      margin: 0; } }

.LoginTemplateRegisterButton {
  width: 100%;
  max-width: 388px;
  position: absolute;
  left: 0;
  top: 57px; }

.LoginControl_TinyMCEContent_adminContent {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  margin-top: 150px;
  margin-bottom: 50px; }

.OrderAuthorizeTemplateContainer {
  max-width: var(--globalContainerWidth);
  padding: 0 0 0;
  margin: 0 auto; }

.OrderGuestTemplateContainer {
  max-width: 800px;
  padding: 40px 0 0;
  margin: 0 auto; }
  @media screen and (max-width: 768px) {
    .OrderGuestTemplateContainer {
      max-width: auto;
      padding: 24px; } }

.StepsContainer {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
  max-width: var(--globalContainerWidth); }

.StepsWrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding-bottom: 20px;
  width: 100%;
  background-color: #F3F3F3;
  max-width: 100vw; }
  @media screen and (min-width: 1440px) {
    .StepsWrapper {
      flex-direction: row; } }
  @media screen and (max-width: 375px) {
    .StepsWrapper {
      background-color: white; } }

.StepsLeft,
.StepsRight {
  width: 100%; }
  @media screen and (min-width: 1440px) {
    .StepsLeft,
    .StepsRight {
      width: 50%; } }

.StepsSummary {
  margin: 50px 25px 25px 50px;
  background-color: #fff;
  margin: 3em;
  padding: 3em; }
  @media screen and (min-width: 1440px) {
    .StepsSummary {
      padding: 56px; } }
  @media screen and (max-width: 600px) {
    .StepsSummary {
      margin: 1em;
      padding: 1em; } }
  @media screen and (max-width: 375px) {
    .StepsSummary {
      margin: 0 10px;
      padding: 5px; } }

.StepsCart {
  margin: 25px 25px 25px 50px;
  background-color: #fff;
  margin: 3em;
  padding: 3em; }
  @media screen and (min-width: 1440px) {
    .StepsCart {
      padding: 24px; } }
  @media screen and (max-width: 600px) {
    .StepsCart {
      margin: 1em;
      padding: 1em; } }
  @media screen and (max-width: 375px) {
    .StepsCart {
      margin: 10px; } }

.StepsContent {
  background-color: #fff;
  margin: 3em 3em .5em 3em;
  padding: 3em; }
  @media screen and (min-width: 1440px) {
    .StepsContent {
      margin: 50px 50px 25px 25px;
      padding: 32px; } }
  @media screen and (max-width: 600px) {
    .StepsContent {
      margin: 1em;
      padding: 1em; } }
  @media screen and (max-width: 375px) {
    .StepsContent {
      margin: 10px;
      padding: 0.5em; } }
  .StepsContent .MuiIconButton-label {
    color: var(--main-color); }

.PasswordRecoveryTemplateContainer {
  width: 100%;
  padding: 0 10px;
  height: 100%;
  padding: 150px 280px; }
  @media screen and (max-width: 1024px) {
    .PasswordRecoveryTemplateContainer {
      padding: 50px 10px; } }

.PasswordRecoveryTemplateButtons {
  padding: 20px;
  display: flex;
  flex-direction: column; }
  .PasswordRecoveryTemplateButtons button {
    margin-top: 20px; }
  @media (min-width: 600px) {
    .PasswordRecoveryTemplateButtons {
      flex-direction: row; }
      .PasswordRecoveryTemplateButtons button {
        margin-top: 0; }
        .PasswordRecoveryTemplateButtons button:nth-child(1) {
          margin-right: 20px; } }

.PasswordRecoverySettingsSection {
  padding: 0 10px;
  max-width: calc(1920px / 2);
  margin-top: 20px;
  border: 1px solid #eee;
  padding: 30px;
  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); }

.PasswordRecoveryTemplateSettingsSectionHeader {
  display: block;
  font-size: 24px;
  margin-bottom: 24px; }
  @media screen and (max-width: 375px) {
    .PasswordRecoveryTemplateSettingsSectionHeader {
      font-size: 18px; } }

.PasswordRecoveryModal {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 20px; }
  .PasswordRecoveryModal p {
    font-size: 20px; }
  @media screen and (max-width: 1024px) {
    .PasswordRecoveryModal {
      width: 500px;
      height: 150px; } }

.PasswordRecoveryTemplateSettingsSectionBody {
  margin-bottom: 70px; }
  @media screen and (max-width: 375px) {
    .PasswordRecoveryTemplateSettingsSectionBody {
      font-size: 13px;
      margin-bottom: 20px; } }

.SetNewPasswordTemplateContainer {
  width: 100%;
  padding: 0 10px;
  max-width: 800px;
  margin: 150px auto; }

.SetNewPasswordTemplateButtons {
  padding: 20px;
  display: flex;
  flex-direction: column; }
  .SetNewPasswordTemplateButtons button {
    margin-top: 20px; }
  @media (min-width: 600px) {
    .SetNewPasswordTemplateButtons {
      flex-direction: row; }
      .SetNewPasswordTemplateButtons button {
        margin-top: 0; }
        .SetNewPasswordTemplateButtons button:nth-child(1) {
          margin-right: 20px; } }

.SetNewPasswordTemplateSection {
  margin-top: 20px;
  border: 1px solid #eee;
  padding: 30px;
  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); }

.SetNewPasswordTemplateSectionHeader {
  display: block;
  font-size: 20px;
  margin-bottom: 20px; }

.SetNewPasswordTemplateModal {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 20px; }
  .SetNewPasswordTemplateModal p {
    font-size: 20px; }
  @media screen and (max-width: 1024px) {
    .SetNewPasswordTemplateModal {
      width: 500px;
      height: 150px; } }

.UniversalSignupTemplateContainer {
  margin: 0 auto;
  width: 100%;
  padding: 40px 10px;
  display: flex;
  justify-content: center; }
  @media screen and (max-width: 1024px) {
    .UniversalSignupTemplateContainer {
      padding: 48px; } }
  @media screen and (max-width: 600px) {
    .UniversalSignupTemplateContainer {
      padding: 32px; } }
  @media screen and (max-width: 480px) {
    .UniversalSignupTemplateContainer {
      padding: 24px; } }
  @media screen and (max-width: 375px) {
    .UniversalSignupTemplateContainer {
      padding: 12px; } }

.UniversalSignupTemplateWrapper {
  max-width: 800px;
  width: 100%; }

.AddAddressBookTemplateContainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  padding: 0 20px;
  max-width: 800px;
  margin: 150px auto; }

.AddAddressBookTemplateModal {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: 50vh;
  padding: 30px; }
  .AddAddressBookTemplateModal p {
    font-size: 20px;
    margin-bottom: 20px; }
  .AddAddressBookTemplateModal span {
    width: 100%;
    display: flex;
    justify-content: space-between; }
  .AddAddressBookTemplateModal button {
    width: 45%; }
  @media screen and (max-width: 1024px) {
    .AddAddressBookTemplateModal {
      width: 500px;
      height: 200px; } }

.EditAddressBookTemplateContainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  padding: 100px;
  max-width: 800px;
  margin: 60px auto;
  border: 1px solid black;
  box-shadow: none; }
  @media screen and (max-width: 1200px) {
    .EditAddressBookTemplateContainer {
      padding: 0 40px;
      border: none; } }

.AddressBookTemplateContainer {
  display: flex;
  border: 1px solid black;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  padding: 100px;
  max-width: 1000px;
  margin: 60px auto;
  box-shadow: none; }
  @media screen and (max-width: 1440px) {
    .AddressBookTemplateContainer {
      padding: 0 40px;
      border: none; } }

.AddressBookTemplateButton {
  margin-bottom: 20px;
  padding: 10px;
  margin-top: 30px; }

.AddressBookTemplateSeactionHeader {
  font-size: 25px;
  padding-left: 10px; }

.AddressBookTemplateModal {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: 50vh;
  padding: 30px; }
  .AddressBookTemplateModal p {
    font-size: 16px;
    margin-bottom: 40px; }
  .AddressBookTemplateModal span {
    width: 100%;
    display: flex;
    justify-content: space-between; }
  .AddressBookTemplateModal button {
    width: 45%; }
  @media screen and (max-width: 1024px) {
    .AddressBookTemplateModal {
      width: 100%;
      height: 50vh; } }

.OrdersHistoryTemplateContainer {
  width: 100%;
  padding: 0 60px;
  max-width: 1200px;
  margin: 100px auto; }

.OrdersHistoryTemplateStatusesContainer {
  margin-top: 100px;
  border: 1px solid black;
  padding: 60px 60px 60px 60px;
  box-shadow: none; }
  @media screen and (max-width: 1440px) {
    .OrdersHistoryTemplateStatusesContainer {
      padding: 0;
      border: none; } }

.OrdersHistoryTemplateSectionHeader {
  font-size: 25px; }

.OrdersHistoryTemplateStatusDescriptionContainer {
  margin-top: 30px; }

.OrderTemplateContainer {
  width: 100%;
  padding: 0 10px;
  max-width: 1200px;
  margin: 0 auto; }

.UserAccountTemplateContainer {
  width: 100%;
  max-width: 640px;
  padding: 60px;
  margin: 0 auto; }

.UserAccountTemplateHeader {
  font-size: 36px;
  font-weight: 500; }

.UserTemplateTemplateContainer {
  width: 100%;
  padding: 0 10px;
  max-width: 800px;
  margin: 150px auto; }

.UserTemplateTemplateButtons {
  padding: 20px;
  display: flex;
  flex-direction: column; }
  .UserTemplateTemplateButtons button {
    margin-top: 20px; }
  @media (min-width: 600px) {
    .UserTemplateTemplateButtons {
      flex-direction: row; }
      .UserTemplateTemplateButtons button {
        margin-top: 0; }
        .UserTemplateTemplateButtons button:nth-child(n) {
          margin-right: 20px; } }

.UserTemplateTemplateSettings {
  width: 100%;
  max-width: 640px;
  padding: 1em 1em 4em 1em;
  margin: 0 auto; }

.UserSettingsTemplateSection {
  margin-top: 20px;
  border: 1px solid black;
  padding: 60px 60px 10px 60px; }

.UserSettingsTemplateSectionHeader {
  display: block;
  font-size: 20px;
  margin-bottom: 40px; }
  @media screen and (max-width: 600px) {
    .UserSettingsTemplateSectionHeader {
      margin-bottom: 50px; } }

.UserSettingsTemplateModal {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh; }
  .UserSettingsTemplateModal p {
    font-size: 20px; }
  @media screen and (max-width: 1024px) {
    .UserSettingsTemplateModal {
      width: 500px;
      height: 100px; } }

.SignupConfirmationResendTemplateContainer {
  width: 100%;
  padding: 0 10px;
  height: 100%;
  padding: 150px 280px; }
  @media screen and (max-width: 1024px) {
    .SignupConfirmationResendTemplateContainer {
      padding: 50px 10px; } }

.SignupConfirmationResendTemplateButtons {
  padding: 20px;
  display: flex;
  flex-direction: column; }
  .SignupConfirmationResendTemplateButtons button {
    margin-top: 20px; }
  @media (min-width: 600px) {
    .SignupConfirmationResendTemplateButtons {
      flex-direction: row; }
      .SignupConfirmationResendTemplateButtons button {
        margin-top: 0; }
        .SignupConfirmationResendTemplateButtons button:nth-child(1) {
          margin-right: 20px; } }

.SignupConfirmationResendSettingsSection {
  padding: 0 10px;
  max-width: calc(1920px / 2);
  margin-top: 20px;
  border: 1px solid #eee;
  padding: 30px;
  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); }

.SignupConfirmationResendTemplateSettingsSectionHeader {
  display: block;
  font-size: 24px;
  margin-bottom: 24px; }
  @media screen and (max-width: 375px) {
    .SignupConfirmationResendTemplateSettingsSectionHeader {
      font-size: 18px; } }

.SignupConfirmationResendModal {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 20px; }
  .SignupConfirmationResendModal p {
    font-size: 20px; }
  @media screen and (max-width: 1024px) {
    .SignupConfirmationResendModal {
      width: 500px;
      height: 150px; } }

.SignupConfirmationResendTemplateSettingsSectionBody {
  margin-bottom: 70px; }
  @media screen and (max-width: 375px) {
    .SignupConfirmationResendTemplateSettingsSectionBody {
      font-size: 13px;
      margin-bottom: 20px; } }

a, a:active, a:focus, a:visited, a:hover, a:focus-within, a:focus-visible {
  color: inherit; }

.GlobalLayoutContainer {
  position: relative;
  max-width: 100%;
  width: var(--globalContainerWidth);
  margin: 0 auto;
  margin-top: 0;
  width: 100vw;
  min-height: 100vh;
  display: grid;
  grid-auto-rows: auto 1fr auto;
  grid-auto-columns: 100%; }

.GlobalLayoutContent {
  position: relative;
  max-width: 100%;
  width: var(--globalContainerWidth);
  margin: 60px auto 0px auto; }

.GlobalLayoutContentOverlay {
  position: fixed;
  inset: 0;
  z-index: 999;
  background-color: rgba(0, 0, 0, 0.5); }

@media screen and (min-width: 1601px) {
  .GlobalLayoutContainer.IsBigNavbar.IsNotSearch .GlobalNavbarWrapper {
    background-color: transparent;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0); }
    .GlobalLayoutContainer.IsBigNavbar.IsNotSearch .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop {
      align-items: flex-start;
      display: grid;
      grid-template-columns: auto 1fr auto auto auto;
      height: 120px; }
      .GlobalLayoutContainer.IsBigNavbar.IsNotSearch .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarLogoContainer {
        background: var(--navbar-bg-color); }
        .GlobalLayoutContainer.IsBigNavbar.IsNotSearch .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarLogoContainer > .MenusNavbarLogoImage {
          max-height: 50%;
          position: absolute;
          bottom: 0; }
      .GlobalLayoutContainer.IsBigNavbar.IsNotSearch .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer {
        background: var(--navbar-bg-color); }
        .GlobalLayoutContainer.IsBigNavbar.IsNotSearch .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer > .InputsSearchContainer {
          background: var(--navbar-bg-color);
          height: 59.5px; }
      .GlobalLayoutContainer.IsBigNavbar.IsNotSearch .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarControlsContainer {
        margin-right: 0;
        padding-right: 8px;
        background: var(--navbar-bg-color);
        height: 59.5px; } }

@media screen and (min-width: 1024px) {
  .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarLogoContainer {
    margin-left: 0; } }
  @media screen and (min-width: 1024px) and (min-width: 1024px) {
    .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarLogoContainer {
      min-width: 80px; } }
  @media screen and (min-width: 1024px) and (min-width: 1440px) {
    .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarLogoContainer {
      min-width: 150px;
      margin-left: 30px; } }
  @media screen and (min-width: 1024px) and (min-width: 1920px) {
    .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarLogoContainer {
      margin-left: 70px; } }

@media screen and (min-width: 1024px) {
  .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer {
    display: flex;
    position: relative;
    padding-left: 0; } }
  @media screen and (min-width: 1024px) and (min-width: 1440px) {
    .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer {
      padding-left: 50px; } }

@media screen and (min-width: 1024px) {
    .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer > .MenusNavbarDesktopNavigationListList {
      justify-content: flex-end;
      gap: 1px;
      padding-right: 3px;
      font-size: .9em; } }
    @media screen and (min-width: 1024px) and (min-width: 1200px) {
      .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer > .MenusNavbarDesktopNavigationListList {
        font-size: unset;
        gap: 2px;
        padding-right: 13px; } }
    @media screen and (min-width: 1024px) and (min-width: 1920px) {
      .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer > .MenusNavbarDesktopNavigationListList {
        gap: 5px;
        padding-right: 35px; } }

@media screen and (min-width: 1024px) {
    .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer > .InputsSearchContainer {
      position: relative; }
      .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer > .InputsSearchContainer > .ButtonSearchContainer {
        width: auto;
        display: flex;
        align-items: flex-end;
        background-color: white;
        padding: 0.2em 1em;
        border-radius: 2em;
        height: 45%; } }
      @media screen and (min-width: 1024px) and (min-width: 1200px) {
        .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer > .InputsSearchContainer > .ButtonSearchContainer {
          width: 10em; } }

@media screen and (min-width: 1024px) {
      .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer > .InputsSearchContainer-Open {
        position: absolute; }
      .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer > .InputsSearchContainer .SearchSuggestionsContainer {
        position: absolute;
        transform: none;
        left: 0;
        right: 0;
        width: 100%;
        max-height: 90vh; }
      .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop > .MenusNavbarDesktopNavigationListContainer > .InputsSearchContainer .ButtonSearchSearchIcon::after {
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: "Font Awesome 6 Pro";
        font-weight: 400;
        content: "\F002";
        color: inherit;
        font-size: 1.5em; }
  .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop .SettingsPickerUserIcon::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 600;
    content: "\F007"; }
  .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop .ButtonFavouritesFavIcon::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 600;
    content: "\F004"; }
  .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop .ButtonShoppingCartCartIcon::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 6 Pro";
    font-weight: 600;
    content: "\F217"; }
  .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop .LanguagePickerContainer > .LanguagePickerPickerControl {
    font-weight: normal; } }
  @media screen and (min-width: 1024px) and (min-width: 1200px) {
    .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop .LanguagePickerContainer > .LanguagePickerPickerControl {
      font-size: 1em; } }

@media screen and (min-width: 1024px) {
    .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop .LanguagePickerContainer > .LanguagePickerPickerControl .LanguagePickerPickerControlInner {
      display: flex; } }
    @media screen and (min-width: 1024px) and (max-width: 1024px) {
      .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop .LanguagePickerContainer > .LanguagePickerPickerControl .LanguagePickerPickerControlInner {
        padding: 5px; } }

@media screen and (min-width: 1024px) {
    .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop .LanguagePickerContainer > .LanguagePickerPickerControl .LanguagePickerPickerControlInner::after {
      display: inline-block;
      font-style: normal;
      font-variant: normal;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      font-family: "Font Awesome 6 Pro";
      font-weight: 300;
      content: "\F078";
      position: relative;
      left: 5px; }
    .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop .LanguagePickerContainer > .LanguagePickerPickerControl .LanguagePickerPickerControlInner::after {
      transition: transform .3s; }
  .GlobalLayoutContainer.BigNavbar .GlobalNavbarWrapper .GlobalNavbarContainer.Desktop .LanguagePickerContainer-Open .LanguagePickerPickerControlInner::after {
    transform: rotate(180deg); }
  .GlobalLayoutContainer.BigNavbar .ComponentsFooterNewsletterRight {
    width: 100%;
    align-items: flex-start; } }

@media screen and (min-width: 1920px) {
  .GlobalLayoutContainer.BigNavbar .MenusNavbarDesktopNavigationListList li.ContainerMenuPosition .MenusNavbarDesktopNavigationListSubmenu {
    margin-left: 0;
    margin-right: 0; } }

.GlobalLayoutContainer.PromoBar .GlobalLayoutContent {
  margin: 105px auto 0px auto; }

@media screen and (min-width: 1024px) {
  .GlobalLayoutContainer.TwoLineNavbar .GlobalLayoutContent {
    margin: 120px auto 0px auto; } }

@media screen and (min-width: 1024px) {
  .GlobalLayoutContainer.TwoLineNavbar.PromoBar .GlobalLayoutContent {
    margin: 165px auto 0px auto; } }

.GlobalMobileMenuNavigationCategoryBreadcrumbs {
  padding: 20px 0 0 20px; }

.GlobalMobileMenuNavigationNavigationWrapper {
  padding: 0;
  width: 100%;
  overflow: hidden;
  margin: 10px 0px;
  height: 0; }

.GlobalNavbarWrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  display: flex;
  background-color: #fff;
  background: var(--navbar-bg-color);
  transition: top 0.5s;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); }

.GlobalNavbarContainer {
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  height: 60px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative; }
  .GlobalNavbarContainer.Desktop {
    justify-content: space-between; }
  @media screen and (max-width: 1024px) {
    .GlobalNavbarContainer {
      border-bottom: 0; } }
  @media screen and (min-width: 1440px) {
    .GlobalNavbarContainer {
      max-width: var(--globalContainerWidth); } }
  .GlobalNavbarContainer .ButtonMobileLanguageContainer {
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
    color: white;
    position: absolute;
    right: 0; }

.GlobalNavbarSecondLineMenu {
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  height: 60px;
  display: none;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative; }
  .GlobalNavbarSecondLineMenu .MenusNavbarDesktopNavigationListContainer {
    height: 59.5px; }
  .GlobalNavbarSecondLineMenu .MenusNavbarDesktopNavigationListList {
    justify-content: space-between;
    margin: auto; }
  .GlobalNavbarSecondLineMenu .MenusNavbarDesktopNavigationListItem {
    height: 59.5px; }
  .GlobalNavbarSecondLineMenu .MenusNavbarListItemContainer {
    height: 59.5px; }
  .GlobalNavbarSecondLineMenu .MenusNavbarDesktopNavigationListSubmenu {
    top: 60px; }
  @media screen and (min-width: 1024px) {
    .GlobalNavbarSecondLineMenu {
      display: flex; } }
  @media screen and (min-width: 1440px) {
    .GlobalNavbarSecondLineMenu {
      max-width: var(--globalContainerWidth); } }

.GlobalNavbarMobileWrapper {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1100;
  display: flex;
  background-color: #fff;
  background: var(--navbar-bg-color);
  transition: bottom 0.5s; }

.GlobalNavbarMobileContainer {
  width: 100%;
  margin: 0 0.8em;
  height: 60px;
  background-color: white;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
  background: var(--navbar-bg-color); }

.GlobalNavbarMobileIconButton {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: none;
  background-color: transparent;
  position: relative;
  cursor: pointer;
  outline: none;
  opacity: 1;
  transition: opacity .3s;
  padding: 0;
  font-size: 11px;
  white-space: nowrap;
  gap: 5px; }
  .GlobalNavbarMobileIconButton i {
    font-size: 24px;
    color: var(--header-font-color); }
  .GlobalNavbarMobileIconButton span {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 16px;
    height: 16px;
    top: -5px;
    right: -10px;
    font-size: 12px;
    border-radius: 50%;
    background-color: #CE0000;
    color: #fff; }

.GlobalBreadcrumbsContainer {
  cursor: pointer; }

.GlobalBreadcrumbsLinkContainer {
  cursor: pointer;
  opacity: .7;
  transition: opacity .15s;
  text-decoration: none; }
  .GlobalBreadcrumbsLinkContainer:hover {
    opacity: 1; }
  .GlobalBreadcrumbsLinkContainer-Current {
    cursor: default;
    opacity: 1; }

.GlobalBreadcrumbsLinkLabel {
  cursor: pointer; }
  .GlobalBreadcrumbsLinkLabel-Current {
    cursor: default; }

.search-layout-1 .GlobalSearchHeaderContainer {
  width: 100%;
  display: flex;
  flex-direction: column;
  background-color: white; }

.search-layout-1 .GlobalSearchHeaderSelectors {
  width: 100%;
  display: flex;
  flex-direction: row;
  margin: 0; }

.search-layout-1 .GlobalSearchHeaderSelectorsLeft {
  width: 50%;
  display: flex;
  flex-direction: row; }

.search-layout-1 .GlobalSearchHeaderSelectorsRight {
  width: 50%;
  display: flex;
  flex-direction: row;
  -webkit-justify-content: flex-end;
  justify-content: flex-end; }

.search-layout-1 .GlobalSearchHeaderSelectorsItem {
  display: flex;
  align-items: center; }

.search-layout-1 .GlobalSearchHeaderNoResultStyled {
  font-size: 20px;
  margin-bottom: 1em; }
  @media screen and (max-width: 1024px) {
    .search-layout-1 .GlobalSearchHeaderNoResultStyled {
      margin-left: 10px; } }
  .search-layout-1 .GlobalSearchHeaderNoResultStyled hr {
    margin-top: 2em; }

.search-layout-1 .GlobalSearchSpinnerWrapperContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0; }
  @media screen and (min-width: 1024px) {
    .search-layout-1 .GlobalSearchSpinnerWrapperContainer {
      width: 100%; } }

.search-layout-1 .GlobalPageSearchSpinnerStyle {
  position: fixed; }
  @media screen and (min-width: 1024px) {
    .search-layout-1 .GlobalPageSearchSpinnerStyle {
      width: 100vw; } }

.search-layout-1 .GlobalCurrentSearchPhraseContainer {
  margin: 10px 0; }

.search-layout-1 .GlobalPageSearchContainer {
  width: 100%;
  padding: 0 0 0 10px;
  flex-direction: column;
  display: flex;
  margin-bottom: 61px; }
  @media screen and (min-width: 1440px) {
    .search-layout-1 .GlobalPageSearchContainer {
      max-width: var(--globalContainerWidth);
      margin: 0 auto 61px; } }
  @media screen and (max-width: 768px) {
    .search-layout-1 .GlobalPageSearchContainer {
      padding: 0; } }

.search-layout-1 .GlobalPageSearchInner {
  width: 100%;
  display: flex;
  align-items: stretch;
  align-content: stretch;
  padding-top: 0; }

.search-layout-1 .GlobalPageSearchResults {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: 0;
  width: 100%; }
  @media screen and (min-width: 1024px) {
    .search-layout-1 .GlobalPageSearchResults {
      padding: 0px 0px 10px 20px; } }

.search-layout-1 .GlobalPageSearchResultsHeader {
  padding: 10px 10px 10px 0;
  display: flex;
  justify-content: space-between; }

.search-layout-1 .GlobalPageSearchPaginator {
  width: 100%;
  padding-left: 5%;
  padding-right: 5%;
  background-color: #fff; }

.search-layout-1 .GlobalPageSearchEmpty {
  width: 100%;
  height: 100%;
  padding-top: 70px;
  display: flex;
  justify-content: center;
  align-items: flex-start; }

.search-layout-1 .GlobalPageSearchFilters {
  padding: 0;
  padding-right: 24px;
  display: none !important;
  width: 350px;
  min-width: 350px;
  display: flex;
  flex-direction: column;
  margin-left: 0;
  height: 100%;
  position: sticky;
  top: 50px;
  overflow-y: auto;
  max-height: calc(100vh - 100px);
  transition: .3s;
  -ms-overflow-style: none;
  scrollbar-width: none; }
  .search-layout-1 .GlobalPageSearchFilters::-webkit-scrollbar {
    display: none; }
  .search-layout-1 .GlobalPageSearchFiltersHidden {
    width: 0;
    min-width: 0;
    padding: 0;
    margin: 0;
    overflow: hidden;
    opacity: 0; }
  @media screen and (min-width: 1024px) {
    .search-layout-1 .GlobalPageSearchFilters {
      width: 300px;
      min-width: 300px;
      padding-left: 16px;
      display: block !important; }
      .search-layout-1 .GlobalPageSearchFiltersHidden {
        width: 0;
        min-width: 0;
        padding: 0;
        margin: 0;
        overflow: hidden;
        opacity: 0; } }

.search-layout-1 .GlobalPageSearchDivider {
  width: 100%;
  margin: 0 auto; }

.search-layout-1 .GlobalPageSearchCategoryLabel {
  margin: 16px 10px 16px 10px;
  padding: 0;
  font-weight: 600;
  font-size: 20px; }

.search-layout-1 .GlobalFilterContainerContainer {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-top: 10px;
  padding-right: 10px;
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  position: relative;
  -ms-overflow-style: none;
  scrollbar-width: none; }
  @media screen and (max-width: 768px) {
    .search-layout-1 .GlobalFilterContainerContainer {
      padding: 0 0 70px 0; } }
  .search-layout-1 .GlobalFilterContainerContainer::-webkit-scrollbar {
    display: none; }

.search-layout-1 .GlobalFilterContainerFilters {
  width: 100%;
  display: flex;
  flex-direction: column;
  list-style: none;
  padding: 0;
  margin: 0; }

.search-layout-1 .GlobalFilterContainerFiltersItem {
  width: 100%; }

.search-layout-1 .GlobalFilterContainerControls {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: fixed;
  bottom: 0;
  background-color: white;
  border-top: 1px solid #999; }
  @media screen and (max-width: 768px) {
    .search-layout-1 .GlobalFilterContainerControls {
      flex-direction: row-reverse;
      align-items: center; } }

.search-layout-1 .GlobalFilterContainerButton {
  width: 100%;
  min-width: 125px;
  margin: 8px 13px; }

.search-layout-1 .GlobalFilterContainerClearButton {
  background-color: #E8E8E8 !important;
  border: none !important; }
  .search-layout-1 .GlobalFilterContainerClearButton:hover {
    background-color: var(--main-color) !important; }

.search-layout-2 .GlobalSearchHeaderContainer {
  width: 100%;
  display: flex;
  flex-direction: column;
  background-color: white; }

.search-layout-2 .GlobalSearchHeaderSelectors {
  width: 100%;
  display: flex;
  flex-direction: row;
  margin: 0; }

.search-layout-2 .GlobalSearchHeaderSelectorsLeft {
  width: 50%;
  display: flex;
  flex-direction: row; }

.search-layout-2 .GlobalSearchHeaderSelectorsRight {
  width: 50%;
  display: flex;
  flex-direction: row;
  -webkit-justify-content: flex-end;
  justify-content: flex-end; }

.search-layout-2 .GlobalSearchHeaderSelectorsItem {
  display: flex;
  align-items: center; }

.search-layout-2 .GlobalSearchHeaderNoResultStyled {
  font-size: 20px;
  margin-bottom: 1em; }
  @media screen and (max-width: 1024px) {
    .search-layout-2 .GlobalSearchHeaderNoResultStyled {
      margin-left: 10px; } }
  .search-layout-2 .GlobalSearchHeaderNoResultStyled hr {
    margin-top: 2em; }

.search-layout-2 .GlobalSearchSpinnerWrapperContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0; }
  @media screen and (min-width: 1024px) {
    .search-layout-2 .GlobalSearchSpinnerWrapperContainer {
      width: 100%; } }

.search-layout-2 .GlobalPageSearchSpinnerStyle {
  position: fixed; }
  @media screen and (min-width: 1024px) {
    .search-layout-2 .GlobalPageSearchSpinnerStyle {
      width: 100vw; } }

.search-layout-2 .GlobalCurrentSearchPhraseContainer {
  margin: 10px 0; }

.search-layout-2 .GlobalPageSearchContainer {
  width: 100%;
  padding: 0 0 0 10px;
  flex-direction: column;
  display: flex;
  margin-bottom: 61px; }
  @media screen and (min-width: 1440px) {
    .search-layout-2 .GlobalPageSearchContainer {
      max-width: var(--globalContainerWidth);
      margin: 0 auto 61px; } }
  @media screen and (max-width: 768px) {
    .search-layout-2 .GlobalPageSearchContainer {
      padding: 0; } }

.search-layout-2 .GlobalPageSearchInner {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  align-content: stretch;
  padding-top: 0; }

.search-layout-2 .GlobalPageSearchResults {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: 0;
  width: 100%; }
  @media screen and (min-width: 1024px) {
    .search-layout-2 .GlobalPageSearchResults {
      padding: 0px 0px 10px 20px; } }

.search-layout-2 .GlobalPageSearchResultsHeader {
  padding: 10px 10px 10px 0;
  display: flex;
  justify-content: space-between; }

.search-layout-2 .GlobalPageSearchPaginator {
  width: 100%;
  padding-left: 5%;
  padding-right: 5%;
  background-color: #fff; }

.search-layout-2 .GlobalPageSearchEmpty {
  width: 100%;
  height: 100%;
  padding-top: 70px;
  display: flex;
  justify-content: center;
  align-items: flex-start; }

.search-layout-2 .GlobalPageSearchFilters {
  padding: 0;
  padding-right: 24px;
  min-width: 350px;
  margin-left: 0;
  height: 100%;
  top: 50px;
  overflow-y: auto;
  max-height: calc(100vh - 100px);
  transition: .3s;
  -ms-overflow-style: none;
  scrollbar-width: none; }
  .search-layout-2 .GlobalPageSearchFilters::-webkit-scrollbar {
    display: none; }
  .search-layout-2 .GlobalPageSearchFiltersHidden {
    width: 0;
    min-width: 0;
    padding: 0;
    margin: 0;
    overflow: hidden;
    opacity: 0; }
  @media screen and (min-width: 1024px) {
    .search-layout-2 .GlobalPageSearchFilters {
      min-width: 300px;
      padding-left: 16px; }
      .search-layout-2 .GlobalPageSearchFiltersHidden {
        width: 0;
        min-width: 0;
        padding: 0;
        margin: 0;
        overflow: hidden;
        opacity: 0; } }

.search-layout-2 .GlobalPageSearchDivider {
  width: 100%;
  margin: 0 auto; }

.search-layout-2 .GlobalPageSearchCategoryLabel {
  margin: 16px 10px 16px 10px;
  padding: 0;
  font-weight: 600;
  font-size: 20px; }

.search-layout-2 .GlobalFilterContainerContainer {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-top: 10px;
  padding-right: 10px;
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  position: relative;
  -ms-overflow-style: none;
  scrollbar-width: none; }
  @media screen and (max-width: 768px) {
    .search-layout-2 .GlobalFilterContainerContainer {
      padding: 0 0 70px 0; } }
  .search-layout-2 .GlobalFilterContainerContainer::-webkit-scrollbar {
    display: none; }

.search-layout-2 .GlobalFilterContainerFilters {
  width: 100%;
  display: grid;
  grid-template-columns: auto 1fr auto;
  list-style: none;
  padding: 0;
  margin: 0; }

.search-layout-2 .GlobalFilterContainerFiltersItem {
  display: grid;
  grid-template-columns: subgrid;
  grid-column: 1 / -1; }

.search-layout-2 .GlobalFilterContainerControls {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center; }
  @media screen and (max-width: 768px) {
    .search-layout-2 .GlobalFilterContainerControls {
      flex-direction: row-reverse;
      align-items: center; } }

.search-layout-2 .GlobalFilterContainerButton {
  width: 100%;
  min-width: 125px;
  margin: 8px 13px; }

.search-layout-2 .GlobalFilterContainerClearButton {
  background-color: #E8E8E8 !important;
  border: none !important; }
  .search-layout-2 .GlobalFilterContainerClearButton:hover {
    background-color: var(--main-color) !important; }

.GlobalProductPageContainer {
  margin: 0 auto;
  width: 100%;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  max-width: var(--globalContainerWidth); }

.GlobalProductPageHeader {
  width: 100%;
  max-width: var(--globalContainerWidth);
  display: flex;
  flex-direction: column;
  position: relative;
  margin: 0 auto;
  flex-wrap: wrap; }
  @media screen and (min-width: 1024px) {
    .GlobalProductPageHeader {
      flex-direction: row;
      justify-content: space-between; } }
  @media screen and (min-width: 1440px) {
    .GlobalProductPageHeader {
      flex-wrap: unset; } }
  .GlobalProductPageHeader .MaterialElementsBreadcrumbsContainer {
    margin-left: 0;
    padding-right: 0; }

.GlobalProductPageToolbar {
  width: 100%;
  align-self: flex-start;
  padding: 0 16px; }
  @media screen and (min-width: 1024px) {
    .GlobalProductPageToolbar {
      width: 45%; } }

.GlobalProductPageToolbarSticky {
  padding-top: 75px;
  position: relative; }

.GlobalLayoutContainer.PromoBar .GlobalProductPageToolbarSticky {
  padding-top: 120px; }

.GlobalProductPageGallery {
  width: 65%;
  margin: 0 auto;
  background-color: #F3F3F3;
  overflow: hidden; }
  @media not screen and (min-width: 1440px) {
    .GlobalProductPageGallery {
      width: 100%;
      max-width: 1440px; } }
  @media screen and (max-width: 1200px) {
    .GlobalProductPageGallery {
      max-width: 1200px; } }
  @media screen and (max-width: 1024px) {
    .GlobalProductPageGallery {
      max-width: 1024px; } }
  @media screen and (max-width: 768px) {
    .GlobalProductPageGallery {
      position: relative;
      background-color: transparent; } }

.GlobalProductPageBody {
  width: 100%;
  max-width: var(--globalContainerWidth);
  margin: 120px auto; }
  @media screen and (max-width: 768px) {
    .GlobalProductPageBody {
      margin: 0; } }

.GlobalCartPageContainer {
  max-width: var(--globalContainerWidth);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  position: relative;
  align-items: center;
  background-color: var(--primaryGray);
  flex-wrap: wrap;
  padding: 60px 20px 20px 20px; }
  @media screen and (min-width: 1440px) {
    .GlobalCartPageContainer {
      flex-direction: row;
      justify-content: center;
      align-items: flex-start;
      flex-wrap: nowrap; } }
  @media screen and (max-width: 768px) {
    .GlobalCartPageContainer {
      padding: 1em; } }

.GlobalCartPageCart {
  width: 100%;
  margin-bottom: 20px;
  background-color: white;
  padding: 56px; }
  @media screen and (min-width: 1440px) {
    .GlobalCartPageCart {
      width: 70%;
      padding: 32px;
      margin-right: 32px;
      max-width: var(--globalContainerWidth);
      margin-bottom: 0; } }
  @media screen and (max-width: 768px) {
    .GlobalCartPageCart {
      padding: 1em; } }

.GlobalCartPageSummary {
  width: 100%;
  position: sticky;
  top: 50px; }

.leaflet-container {
  width: 100%;
  min-height: 300px;
  height: 100%; }

.ArticleTileItemName {
  color: var(--productName-font-color); }

/* @import './layoutTemplates/pro.scss'; */
@font-face {
  font-family: "Clash Display";
  src: url("/fonts/ClashDisplay-Variable.woff2") format("woff2"); }