:root {
  --red-1: #94120b;
  --blue-2: #0d7ce0;
  --red-3: #c22b23;
  --white: #ffffff;
  --black: #000000;
  --ultra-light-grey: #efefef;
  --light-grey: #c6c6c6;
  --grey: #4b4b4b;
  --dark-grey: #434343;
  --white-tr: #ffffffc4;
  
}


html, body {
    font-family: 'Open Sans', sans-serif;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: auto;
	}
	
body { 
    display: flex;
    flex-flow: column nowrap;
   }

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
   
}
a { text-decoration: none; outline: none;}
#open-menu, #close-menu {display:none;}
h1, h2, h3, h4, h5, h6, p, strong, a, address { font-family: Roboto, sans-serif;}
.header-1 {  line-height: 1.4em; font-size: 48px;  }
.header-2 {  line-height: 1.4em; font-size: 34px;  }
.header-3 {   line-height: 1.4em; font-size: 22px;  }
.header-4 {   line-height: 1.5em; font-size: 16px;  }
.header-5 {   line-height: 1.5em; font-size: 16px;  }
.header-6  {  line-height: 1.5em; font-size: 13px;  }
.basic-text { line-height: 1.8em; font-size: 16px; padding: 10px 0px; margin:0;}
.txt-up {text-transform: uppercase;}
.weight-300 {font-weight: 300;}
.weight-400 {font-weight: 400;}
.weight-700 {font-weight: 700;}
.color-black {color: var(--black);}
.color-grey { color: var(--grey);}
.color-red-1 {color: var(--red-1); }
.color-ultra-light-grey {color: var(--ultra-light-grey); }
.color-light-grey {color: var(--light-grey); }
.color-grey {color: var(--grey); }
.color-dark-grey {color: var(--dark-grey); }
.color-white {color: var(--white);}
.mr-1 {margin:0;}
.pd-1 {padding:0;}
.mr-15 {margin:15px;}
.mr-30 {margin-top: 30px;}
.mr-t-10 {margin-top:10px;}
.mr-10 {margin-top:10px;}
.show {display: flex;}
.hide {display: none;}
.button-1 { display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; gap:10px;padding: 15px 45px;  font-size: 14px; font-weight: 400; border-radius: 3px; text-align: center;  transition: all ease 0.5s;  }
.hr-red { width: 200px;  color: var(--red-1); margin: 5px; padding: 0px; background-color: var(--red-1); border-radius: 1px; border: 1px solid var(--red-1);}
.hr-white-1 { width: 200px;  color: var(--red-1); margin: 5px; padding: 0px; background-color: var(--white); border-radius: 1px; border: 1px solid white;}
.hr-red-1 { width: 50px;  color: var(--red-1); margin: 5px; padding: 0px; background-color: var(--red-1); border-radius: 1px; border: 1px solid white;}
.hr-red-2 { width: 200px;   color: var(--red-1); margin: 5px auto; padding: 0px; background-color: var(--red-1); border-radius: 1px; border: 1px solid white;}
.red-button-1 { border: 1px solid var(--white); color: var(--red-1); background-color: var(--white); }
.white-button { border: 1px solid var(--white); color: var(--red-1); background-color: var(--white); }
.red-button-2 { border: 1px solid var(--red-1); background-color: var(--white); color: var(--red-1); }
.red-button-2:hover { border: 1px solid var(--red-1); background-color: var(--red-1); color: var(--white); }
.white-button:hover { border: 1px solid var(--white); color: var(--white); background-color: var(--transparent); }
.red-button-1:hover { border: 1px solid var(--red-1); background-color: var(--red-1); color: var(--white); }
.button-download-transparent { display:flex; flex-flow: column nowrap; align-items: flex-start; justify-content: center;  padding: 5px 5px;   border-radius: 3px; text-align: center;  transition: all ease 1.0s; }
.button-download-transparent> img { max-width:100%;}
.shadow { box-shadow: 0px 5px 7px #c4c4c4;}
.button-download-transparent > span {font-size: 14px; font-weight: 700; color: var(--white); margin: 10px auto 0px auto;}
#cookie {
position: fixed;
z-index: 2205;
width:340px;
left:10px;
font-family: 'Open Sans', sans-serif;
bottom:10px;
background-color: black;
margin:0px;
padding:15px;
border-radius:10px;
}
#cookie p {
font-size:13px;
color: white;
margin:0px; 
padding:0px 0px;

display:inline-block;
}
#cookie a { color: #9efffc; }
#cookie button {
width:100%;
background-color: white;
color: black;
margin: 5px 0px;
font-size: 12px;
padding:6px 15px;
border: 1px solid white;
display:inline-block;
font-weight: bold;
font-family: 'Open Sans', sans-serif;
}
/********* header ************************/
#main-header { width: 100%; display: flex; z-index:5; position: fixed; align-items: start; align-content: center; flex-wrap: wrap; background-color: var(--red-1);  }
#header-info {width:100%;  margin:0;  display: flex; flex-flow: row nowrap;  align-items: center;  justify-content: right;  flex-grow: 1; background-color: #efefef; padding: 15px 25px 15px 0px;}
#header-info span {font-size: 14px; font-weight: 700; color: var(--dark-grey); line-height:1.6; margin:0px 25px 0px 0px; padding: 0px 10px;}
#header-info img { width: 20px; vertical-align: -5px; margin-right: 10px; }
#outer-wrapper { width:100%; margin:0; padding: 0px; display: flex; flex-flow: row nowrap; align-items: stretch;   }
#header-logo {  display: flex; flex-direction: row; align-items:center; justify-content: left;  } 
#header-logo a {margin:10px 0px 10px 25px;}
#header-logo > a > img {max-width:200px; margin:0; padding:0;}
#header-contact  { display: flex; flex-direction: row; align-items:center; justify-content: right; margin:0px 0px 0px 0px; padding: 0px 25px 0px 0px; }
#header-phone, #header-mail { font-size:22px; font-weight:700;  color: var(--white); margin:0; padding: 10px 20px; text-decoration: none; border:0; display: flex; flex-flow: row nowrap;    align-items: center;  justify-content: center;}
#header-phone  img , #header-mail  img { height: 28px;margin:0px; padding:0px 10px 0px 0px; border: 0px; }
#nav-wrapper { display:flex; margin: 0px; padding:0px 0px 0px 100px; align-items: center; justify-content: left; flex-flow: row nowrap; flex-grow: 1;  }
#menu-icons {display: none;}
nav {display:flex; flex-flow: row nowrap; align-items: center; justify-content: left; }
.nav-link {  text-align:center; font-size:15px; font-weight:700; color: var(--white); margin:0; padding: 15px 20px; text-transform: uppercase; line-height: 1.6; }
.onlymobile {display: none; flex-flow: row nowrap; align-items: center; justify-content: left; gap:10px; padding:5px 0px; margin:5px 0px; text-transform: lowercase;}
.onlymobile img {width:18px; height:18px;}
main {  display: flex; flex-direction: column; justify-content: stretch; align-content: flex-start; flex-wrap: nowrap; width:100%; margin:0; padding:0;}
/********* banner ************************/
#banner {width:100%; background-color: #f5f5f5; background: url('../pic/banner-1.webp') no-repeat fixed center center; display: flex; min-height: 710px; margin: 0px auto 0px auto; padding:0px; flex-direction: column; position:relative; }
#banner-background {display: flex; flex-flow: column wrap;  margin: 0px auto; padding: 0px; flex-grow: 1; position: absolute; z-index: 2; top: 0; left: 0; height: 710px;  right: 0; justify-content: center;  align-items: center;}
#banner h1 { margin: 10px 0px 0px 0px; padding:0; }
#banner h4 { letter-spacing: 3px; padding:0; margin:0;}
#banner p {  padding:0; width: 80%; text-align: center;line-height:1.8; color: var(--white);}
#banner a { margin:30px auto 0px auto;}
/********* main page ************************/
#wrapper-offer {position:relative; width:100%; margin:0px auto; padding:0; display:flex; flex-flow: column nowrap; height:280px;}
#main-offer { width: 100%; display: flex; flex-flow: row wrap; padding: 0px 0px 50px 0px; gap: 1rem; justify-content: center;  align-items: stretch; position:absolute; z-index:2; margin-top:-70px;}
.box-item { display: flex;  flex-flow: row nowrap;   width: 40%; justify-content: space-around;  gap: 1rem; padding: 25px; background-color: #ededed; }
.bi-1 { width:60%;display: flex; flex-flow: column wrap; margin:0; padding:0; flex-grow: 1; }
.box-item-img { width: 40%; display: flex; margin:0; padding:0; flex-flow: row nowrap;}
.box-item img { width: 100%; margin: 0; padding:0; box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px; }
.box-item-desc { width:100%; display: flex; flex-flow: row wrap; margin:0; padding:0; flex-grow: 1; align-content: start; }
.box-item-desc p { line-height: 1.8em; font-size: 16px; padding: 10px 0px; margin:0;  color: var(--dark-grey);}
.bi-1 a { margin-left: auto !important; margin-top:15px;}
#main-about { width: 100%; display: flex; flex-flow: row wrap; align-items: center; min-height: 350px; margin: 0; background: url('../pic/baner-ofirmie-1.webp') center top / auto repeat-y fixed;
}
#wrapper-box-text {    width: 100%; padding: 60px 60px; margin: 0; display: flex; flex-flow: column wrap; border: 1px solid #ffffff3d; align-items: center; justify-content: space-between;
    gap: 20px;  background-color: #94120ba1; }
#box-text { width: 100%; padding: 60px 60px;  margin: 0; display: flex; flex-flow: column nowrap; border: 1px solid #ffffff3d; align-items: center; justify-content: center;}
#box-text p {width: 70%;}
#main-products-scroller {width: 100%; display: flex; flex-flow: row wrap; align-items:center; flex-start; justify-content: center;  padding: 15px 75px; background: url('../pic/banner-scroller-1.webp') center top/auto no-repeat scroll; margin: 0;  }
.tag-list { margin:0; padding-inline:0; list-style: none; }
.tag-list li { display: flex; width:250px; flex-flow: column wrap; align-items: stretch; padding:0px; margin:0px 20px; gap: 0px; justify-content: space-between;}
.top-box-scroller { display:flex;  width:100%; flex-flow: column wrap; align-items: center; justify-content: center; padding:15px; margin:0;  gap: 10px; }
.tag-list li img {max-width:100%;     box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;}
.scroller {display: flex; max-width: 1600px; margin:0px auto 0px auto; }
.scroller__inner {padding-block: 1rem; display: flex; flex-wrap: wrap; gap: 1rem; }
.scroller[data-animated="true"] { overflow: hidden; -webkit-mask: linear-gradient(90deg, transparent, var(--red-3) 10%, var(--red-3) 90%, transparent); mask: linear-gradient(90deg,transparent, var(--red-3) 10%, var(--red-3) 90%, transparent); }
.scroller[data-animated="true"] .scroller__inner {  width: max-content;  flex-wrap: nowrap;  animation: scroll 35s linear infinite; }
@keyframes scroll {
  to {
      transform: translate(calc(-50% - .5rem));
  }
}
#download-pdf { width:100%; padding: 25px 25px;  height:auto; display: flex; flex-flow: row wrap; justify-content: center; background: url('../pic/bg-pdf-1.webp') center top / cover no-repeat scroll;  justify-items: center; column-gap: 40px;}
#di-1 { width: 583px; display: flex; flex-flow: column wrap; justify-content: center; align-items: start; }
#di-2 { display: flex; flex-flow: row wrap; align-content: center; }
/********** certificates *******************/
#wrapper-certificates {width: 100%; display: flex; flex-flow: column wrap; align-items: center; justify-content: center; padding: 60px 20px; margin:0px auto; background-color:#f0f0f0; }
#certificates-box {width: 80%; display: flex; flex-flow: row wrap; align-items: flex-start; justify-content: space-between; padding: 0px 20px; margin:60px auto; gap: 40px;}
.certificate { display: flex; width: 30%; flex-flow: column nowrap; align-items: center; justify-content: center; padding:10px;}
.certificate img {max-width:100%;}
/********** contact **********************/
#main-box { width: 100%; display: flex; flex-flow: row wrap; padding: 0px 0px; gap: 0rem; justify-content: center; align-items: center; flex-grow:1; margin:0; }
#wrapper-contact{ width: 100%; display: flex; flex-flow: row wrap; padding: 0px 0px 0px 0px;  gap: 0rem; justify-content: center;  align-items: center; margin: 0;  background: url('../pic/banner-kontakt.webp') center top / cover no-repeat scroll; position: relative; background-color: grey; }
#company-data { width: 80%; display: flex; flex-flow: row wrap; justify-content: center; align-items: stretch;  padding: 0px; gap: 1%; margin: -50px auto 0px auto; position: absolute;
    z-index: 1; top: 0; left: 0; right: 0; }
.cd { display: flex;  flex-flow: column nowrap;  justify-content: flex-start; align-items: center; margin: 0px 0px 0px 0px; padding: 15px 15px; width: 18.6%; gap: 20px;
    background: #EFEFEF; background: linear-gradient(180deg, rgb(255 255 255) 0%, rgb(214 214 214) 100%); box-shadow: 0px 5px 7px #c4c4c4; border: 1px solid white;}
.cd a { text-decoration: none; font-size: 16px; font-weight:700; color: var(--dark-grey); margin:0px; padding:0;}
.corners {  display: flex; width: 70px; flex-flow: row wrap; justify-content: center; align-items: center; height: 70px; border: 3px solid white;  margin: -40px auto 0px auto;
    border-radius: 35px; background-color: #e7e7e7; box-shadow: 0px 0px 7px #c7c7c7;  }
.corners img {width:28px; height:28px; margin: 0px auto;}
.text-data { display:flex; flex-flow: row wrap; justify-content: center; align-items: center; padding:0px; font-size:16px; font-weight:700; color: var(--dark-grey); text-align: center;}
#google-maps {width:100%; height:600px; display:flex; flex-flow: row wrap; padding: 0px; gap: 0rem; justify-content: center;  margin: 0px auto;}
#google-maps iframe {width:100%; height:600px; filter: grayscale(40%); margin:0; padding:0;}
#contact-form {  width: 80%;  display: flex; flex-flow: column nowrap;  padding: 150px 0px 100px 0px; gap: 0; justify-content: center; margin: 0; }
#contact-form form {display: flex;  flex-flow: row nowrap; justify-content: stretch;  align-items: stretch; width: 100%;}
.contact-form-box { display:flex; width:50%; padding:20px; margin:0; flex-flow: column nowrap; align-items: stretch; justify-content: stretch;  gap: 20px; }
.contact-form-box  input[type=text] { width: 100%; height: 50px; padding: 5px 5px;  border: 1px solid #efefef;  font-size: 14px;  color: var(--red-1); margin: 0px; background-color: #efefef;  font-family: 'Roboto', sans-serif; box-shadow: 0px 5px 7px #c4c4c4;}
#zapytanie {width: 100%; height: 100%;  padding: 10px 10px;  border: 1px solid #efefef; font-size: 14px;  color:  var(--red-1);  margin: 0px;  background-color: #efefef;   font-family: 'Roboto', sans-serif; box-shadow: 0px 5px 7px #c4c4c4;}
#contact-form input::placeholder, #zapytanie::placeholder {  color: var(--red-1); }
.containerk {  display: block;  position: relative;  font-size: 14px;  color: var(--red-1);  margin: 5px 0px 8px 0px;  padding-left: 30px;  cursor: pointer; font-family: 'Roboto', sans-serif;
    -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none;  font-weight: 400;}
.containerk input { position: absolute; opacity: 0;  cursor: pointer;  height: 0;  width: 0;}
.checkmarkk { position: absolute;  top: -4px; left: 0; height: 20px; width: 20px;  background-color: #d9dddf; border: 1px solid #cecece;}
.open1 {  color:  var(--red-1); text-decorkation: underline;}
.containerk:hover input ~ .checkmarkk {  background-color: #cbcbcb;}
.containerk input:checked ~ .checkmarkk {  background-color: var(--red-1);}
.checkmarkk:after { content: ""; position: absolute;  display: none;}
.containerk input:checked ~ .checkmarkk:after {  display: block;}
.containerk .checkmarkk:after { left: 6px; top: 2px;  width: 5px; height: 10px; border: solid white;  border-width: 0 3px 3px 0;  -webkit-transform: rotate(45deg);  -ms-transform: rotate(45deg);
  transform: rotate(45deg);}	
/************** categories *****************/
#back {width:100%; display: flex; flex-flow: row nowrap; margin:0px; padding:10px; padding:200px 0px 0px 50px;}
.button-back { display:flex; flex-flow: row nowrap; align-items: center; justify-content: center; border: 1px solid var(--red-1); background-color: var(--white); color: var(--red-1); padding:10px 20px; margin:0px; font-size: 14px; font-weight: 400; border-radius: 3px; text-align: center; gap; 10px; }              
#wrapper-category {width:100%; display: flex; flex-flow: column wrap; align-items: center; justify-content: start; margin: 0px; padding: 200px 0px 0px 0px;}
.wrapper-cat-title  {width:90%; display: flex; flex-flow: column wrap; align-items: center; justify-content: center; margin: 0px auto; padding:0;}
.wrapper-cat-title h1 { margin:0px auto; padding:0; text-align: center;}
.wrapper-cat-title p {font-size: 14px; line-height:1.8; color: var(--dark-grey); margin: 20px 0px 0px 0px; padding: 0;}
#box-clean-filters {width:100%; display: flex; flex-flow: row wrap; align-items: stretch; justify-content: center; margin: 0px; padding: 25px 0px 0px 0px; gap: 20px;}
#showproducts { max-width:300px;  flex-flow: row nowrap; font-size: 14px; font-weight: 700; justify-content: center; align-items: center; color: var(--red-1); background-color: var(--white); margin:15px auto 0px auto; padding: 15px 20px; border: 1px solid var(--red-1);}
#wrapper-products-list { width:96%; display: flex; flex-flow: row wrap; margin:0; padding: 20px 0px 40px 0px; align-items: flex-start; justify-content: flex-start; }
#filters-list { width:250px; display: flex; flex-flow: column nowrap; align-items: flex-start; padding: 10px; background-color: #f4f4f4;}
#filters-list h3 { font-size:16px; color: var(--red-1); font-weight:700; margin: 10px 0px; padding:0;}
#filters-list h4 { font-size:14px; color: var(--dark-grey); font-weight:700; margin: 10px 0px; padding:0;}
#filters-list form {width:100%; display: flex; flex-flow: column nowrap; }
#filters-list form label { font-size: 14px; color: var(--dark-grey); margin: 8px 10px; font-weight:400; width: fit-content;}
#products-list { display: flex; flex-flow: row wrap; align-items: stretch; justify-content: left; gap: 1%; width: calc( 100% - 250px); padding-left:0px; }
.list-products-box { width:22%; flex-flow: column wrap;  align-items: stretch; justify-content: space-between;  padding:0px;  margin:1%;}
.list-products-box img {max-width:100%;}
.top-product-box-scroller { display:flex;  width:100%; flex-flow: column wrap; align-items: center; justify-content: center;  gap: 0px; margin-bottom: 25px; }
.product-button-1 { width:100%; display: flex; padding: 15px 10px;  font-size: 14px; font-weight: 400; border-radius: 3px; text-align: center;  transition: all ease 0.5s;  
 border: 1px solid var(--red-1); background-color: var(--white); color: var(--red-1); margin-top:auto;  align-items: center; justify-content: center;}
.product-button-1:hover { border: 1px solid var(--red-1); background-color: var(--red-1); color: var(--white); }
.product-header-2 {   line-height: 1.5em; font-size: 22px;  margin:0; padding:0;}
.product-header-3 {   line-height: 1.5em; font-size: 14px;  margin:0; padding:0; }
#closefiltersbox { width:200px;  padding: 15px 10px;  font-size: 14px; font-weight: 700; border-radius: 3px; text-align: center;   border: 1px solid var(--red-1); background-color: var(--red-1); color: var(--white); margin-top:25px; flex-flow: row nowrap;   align-items: center; justify-content: center; gap: 10px;}
#openfiltersbox { width:200px;  padding: 15px 10px;  font-size: 14px; font-weight: 700; border-radius: 3px; text-align: center;   border: 1px solid var(--red-1); background-color: var(--red-1); color: var(--white); margin:0px; flex-flow: row nowrap;  align-items: center;  justify-content: center; gap: 10px;}
#openfiltersbox img, #closefiltersbox img {width:24px; height:24px; gap: 10px;}
/************* filters *************************/
/* Customize the label (the container) */
.container {  display: block;  position: relative;  padding-left: 35px;  margin-bottom: 12px; cursor: pointer;  font-size: 22px;  -webkit-user-select: none;  -moz-user-select: none;
  -ms-user-select: none;  user-select: none;}
/* Hide the browser's default checkbox */
.container input { position: absolute;  opacity: 0;  cursor: pointer;  height: 0;  width: 0;}
/* Create a custom checkbox */
.checkmark {  position: absolute;  top: 0;  left: 0;  height: 25px;  width: 25px;  background-color: #eee;  border: 1px solid #cecece;}
/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {  background-color: var(--red-1);  }
/* When the checkbox is checked, add a blue background */
.container input:checked ~ .checkmark {  background-color: var(--red-1);}
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {  content: "";  position: absolute;  display: none;}
/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after { display: block;}
/* Style the checkmark/indicator */
.container .checkmark:after { left: 9px; top: 5px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg);  -ms-transform: rotate(45deg);
  transform: rotate(45deg);}
#filtercleaner { width:200px;  flex-flow: row nowrap; font-size: 14px; font-weight: 700; justify-content: center; align-items: center; color: var(--red-1); background-color: var(--white); margin:0px; padding: 15px 20px; border: 1px solid var(--red-1); gap: 10px;}
.hidecleaner {display: none;} 
.showcleaner {display: flex;} 
.hidefilters {display: none;} 
.showfilters {display: flex;} 
/*************** end filters *******************/

/************** product ******************/
#wrapper-product {display: flex; flex-flow: row nowrap; padding: 200px 0px 0px 0px;  margin: 0px auto 50px auto; justify-content: center; align-items: stretch; width: 96%;}
#products-gallery {width: 40%; display: flex; flex-flow: column nowrap; align-items: flex-end; justify-content: center; margin:0px 0px 30px 0px; padding: 0px 25px;  }
#products-gallery img {max-width:100%; box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px; margin: 15px;}
#products-description {width:60%; display: flex; flex-flow: column nowrap; align-items: flex-start; justify-content: left;  padding: 30px 30px; background-color: #f2f2f2; }
#products-description p { line-height: 1.8em; font-size: 16px; padding: 10px 0px; margin:0; font-weight:400; margin: 20px 0px 0px 0px; color: var(--dark-grey);}

.pdf-button {display: flex; flex-flow: row nowrap; gap:10px; align-items: center; justify-content: center; line-height: 1.8em; font-size: 16px; padding: 10px 0px; margin:0; font-weight:700; margin: 10px 0px 0px 0px; color: var(--red-1);}
#products-description h3, #products-description h4, #products-description h5, #products-description h6 {font-size: 22px; font-weight:700; margin:5px 0px; padding:0px; color: var(--red-1); }
#products-description strong {font-weight:700; color: var(--red-1); }
#products-description h2 {background-color: #e9e9e9; padding: 10px 15px; }
#polityka-prywatnosci { width: 100%; display: flex; flex-flow: column wrap; align-items: flex-start; justify-content: left; margin:0; padding: 200px 25px 50px 25px;background-color: #f2f2f2;}
#polityka-prywatnosci p { font-size:13px; color: var(--dark-grey); margin:0; padding:0; line-height: 1.8; font-weight:400;}
#polityka-prywatnosci h1 {font-size: 28px; color: var(--red-1); margin:0; padding:0px 0px 20px 0px; line-height: 1.5;}
#komunikat, #komunikat1 { font-weight:700; font-size: 13px; color:#2c3f86; padding:5px 0px; line-height: 1.6; margin:0; text-align: left; height:0px;}
/********* footer ************************/
footer { width:100%; display: flex; flex-flow: row wrap; margin:0; padding:20px 25px; row-gap: 20px; background-color: #94120b; }
/*footer nav { width:100%; display: flex;flex-flow: row wrap;  justify-content: left;  margin:0px auto; position:relative;}
footer nav a {font-size: 12px; color: var(--white); margin:0; padding: 10px 15px; text-transform: uppercase; height: max-content; font-weight:700; }
footer nav a:not(:last-child)::after {content: ''; position: absolute; width:1px; height: 8px; background-color: var(--white); z-index:2; right:-2px; top: 13px; transform:skew(-15deg); }
footer address { width:60%; font-size:12px; line-height:1.8; color: var(--white); margin-right:0; padding:0; font-weight: 700;}
*/
footer p {font-size: 11px; color: var(--white); margin:0; padding: 10px 0px; font-weight:700; text-align:left;} 
#footer-company {width: 50%; display: flex; flex-flow: column wrap; margin: 0; padding: 0; column-gap:20px; justify-content: left; align-items: flex-start;}
#footer-company img {max-width:100%; margin-left:0; padding:0;}
footer address { width: 50%; display: flex; flex-flow: column wrap; margin: 0; padding: 0; column-gap:20px; justify-content: right; align-items: flex-end; color: var(--white); 
               font-size:11px; line-height:1.8; margin:0; padding:0; font-weight:700; font-style: normal;}
@media only screen and (max-width: 1730px) { 
.box-item {width: 48%;}
}

@media only screen and (max-width: 1590px) { 
#nav-wrapper {padding:0px 0px 0px 40px;}
.nav-link {font-size:14px; padding:15px 18px;}
#header-phone, #header-mail  { font-size:18px;}
}
@media only screen and (max-width: 1590px) { 
#company-data {width:94%;}
   } 
@media only screen and (max-width: 1450px) { 
#wrapper-offer {height: 200px;}
.box-item-img {width:200px; height:200px;}
.bi-1 { width: calc( 100% - 200px);}
.basic-text, .box-item-desc p, .wrapper-cat-title p {font-size:14px;}
.header-2 { font-size:32px;} 
}
@media only screen and (max-width: 1385px) { 
.product-header-2 {font-size:20px; margin:0px 0px 10px 0px;}
.product-header-3 {font-size: 13px;}
.product-button-1 {font-size:13px;}
#filters-list form label { font-size:13px;}
.header-2 { font-size:28px;} 
    }
@media only screen and (max-width: 1350px) { 
#nav-wrapper {padding:0px 0px 0px 40px;}
.nav-link {font-size:13px; padding:15px 13px;}
#header-phone, #header-mail  { font-size:16px; padding:15px 15px;}
#header-phone  img, #header-mail  img { height: 24px; }
#header-info span { font-size: 12px; }
#header-logo > a > img {max-width:100px;}
}
@media only screen and (max-width: 1315px) {
#wrapper-box-text, #box-text {padding:20px 20px;}
#box-text p {width: 90%;}
.header-2 {font-size: 28px;}
}

@media only screen and (max-width: 1260px) {
.list-products-box {  width: 30%; }
    }
@media only screen and (max-width: 1230px) {
#header-info {padding: 10px 25px 10px 0px;}
#header-info img { width: 16px; vertical-align: -3px; margin-right: 6px; }
#header-phone, #header-mail { font-size:13px; padding:15px 10px;}
#header-phone , #header-mail img { height: 21px; }
.nav-link { font-size: 12px; margin: 15px 10px; padding:0; }
#certificates-box {width:96%;}
    }

@media only screen and (max-width: 1115px) { 
.header-2 { font-size:26px;}
#header-info, #header-phone, #header-mail {display: none;}
.onlymobile {display: flex;}
#open-menu {display:flex; flex-flow: row nowrap; margin:0; padding:0;}
#close-menu {display:flex; flex-flow: row nowrap; margin:0px 0px 30px 0px; padding:0;}
#outer-wrapper {justify-content: space-between;}
#nav-wrapper {display: none; width:0%; padding: 50px 0px 0px 40px; right: 0; height: 100vh; flex-flow: column nowrap; justify-content: left; align-items: flex-start; position: fixed; z-index:5; background-color: #000000d9;  }   
#nav-wrapper nav { flex-flow: column nowrap; align-items: flex-start; justify-content: left;}
.hidden-mobile-wrapper {display: none !important; width:0% !important; opacity: 0; }
.visible-mobile-wrapper { display: flex !important; width:80% !important; opacity: 1; }
#banner {background-attachment: scroll;}
.text-data, .text-data a, .containerk   {font-size: 13px;}
#contact-form {width: 94%;}
#contact-form input::placeholder, #zapytanie::placeholder  {font-size:13px;}
#wrapper-category, #wrapper-product {padding:150px 0px 0px 0px;}
.header-5 {font-size: 13px;} 
    }
@media only screen and (max-width: 1080px) { 
#main-offer {  flex-flow: column wrap; gap: 90px; align-items:center; }
#wrapper-offer {height:480px;}
#main-offer {gap:10px;}
.box-item { width: 80%; }
.header-1 {font-size:28px;}
.header-3 { font-size:18px;} 
.header-4 {font-size: 16px;}  
#products-description h2, #products-description h3, #products-description h4, #products-description h5, #products-description h6 {font-size: 16px;} 
.basic-text, .box-item-desc p, .button-1, .wrapper-cat-title p, #products-description p {font-size:13px;}
#wrapper-certificates {gap: 0px;}
.header-2 { font-size:22px;}
}
@media only screen and (max-width: 1040px) {
#products-list {width:100%;}
#filters-list {display: none; position: fixed; z-index; 10; top:0; left: 0; width:100%; overflow-y: scroll; overflow-y: scroll; padding-top: 100px; height: 100%;}
.list-products-box {  width: 22%; }
#box-clean-filters {flex-flow: row nowrap; align-items: stretch; justify-content: center; padding-top: 15px;} 
#filtercleaner {margin: 0px;}
#openfiltersbox {display: flex;}
.product-button-1 {width:90%;}
#products-gallery { padding:0;}
#products-gallery img {margin:0;}  
}

@media only screen and (max-width: 970px) {
.list-products-box {width: 30%; }
}
@media only screen and (max-width: 940px) { 
.mr-30 {margin-top:15px;}
.box-item { width: 96%; }
.box-item-img {height: auto;}
.bi-1 {width:100%;}
#wrapper-offer {height:420px;}
.top-product-box-scroller {margin-bottom:15px;}
    }
@media only screen and (max-width: 880px) {
#download-pdf {flex-flow: column nowrap; align-items: center;}
#di-1  {align-items: center; width:90%;}
#wrapper-certificates {padding:30px 20px;}
.certificate {width:47%;}
#certificates-box {padding:0; margin: 30px auto; gap: 1%;}
#google-maps {height: 400px;}
#google-maps iframe {height: 400px;}
#wrapper-contact {position: static; margin:0px auto; flex-flow: column nowrap; }
#company-data {width:100%; flex-flow: column nowrap; gap:40px; margin:50px auto 0px auto; position: static;  align-items: center; z-index:0;}
.cd {width:60%;}
#contact-form {width: 60%; padding: 30px 0px 30px 0px;}
.contact-form-box {width:100%; padding: 10px 0px;}
#contact-form form {flex-flow: column nowrap;}
#zapytanie {height:200px; margin:0px;}
    }

@media only screen and (max-width: 830px) { 
#wrapper-product {flex-flow: column nowrap; align-items: center;}
#products-gallery { width: 60%; }
#products-description { width: 100%; }
}              
@media only screen and (max-width: 700px) { 
.cd {width:90%;}
#contact-form {width: 90%;}
}

@media only screen and (max-width: 570px) { 
#wrapper-product { padding: 90px 0px 0px 0px; }
#polityka-prywatnosci { padding: 90px 20px 50px 20px; }
#products-gallery { width: 100%; align-items: center;}
#products-gallery img {max-width: 350px;}
#banner {min-height: 610px;  background: url('../pic/banner-1-mobile.webp') no-repeat scroll center center; }
#banner h4 {text-align: center;}
.header-1 {font-size:22px;}
.header-2 {font-size:18px;}
.header-3 { font-size:14px;} 
.header-4 {font-size: 14px;} 
.header-5 {font-size: 11px;}  
#polityka-prywatnosci h1 { font-size:22px;}
#polityka-prywatnosci p {font-size:12px;} 
 #products-description h2, #products-description h3, #products-description h4, #products-description h5, #products-description h6 { font-size: 14px;}   
.basic-text, .box-item-desc p, .button-1, .wrapper-cat-title p, #products-description p {font-size:12px;}
.button-1 {padding:15px 20px;}
#main-offer {  flex-flow: row wrap; gap: 1%; align-items:stretch; }
.box-item { flex-flow: column nowrap; width: 47%; padding:10px; height:auto;}
.box-item-img {width:100%; align-items: center;}
.box-item-img img {width:100%; height: auto;}
#wrapper-box-text {padding: 10px;}
    #box-text {padding:20px 20px; }
#box-text p {width:96%;}
#banner-background {padding:150px 0px 0px 0px; height:100%; justify-content: flex-start;}
#main-products-scroller { padding: 15px 15px;}
.tag-list li {width:180px;}
#main-about {  background: url('../pic/baner-ofirmie-1-mobile.webp') center top / cover repeat-y scroll;}
#main-products-scroller { background: url('../pic/banner-scroller-1-mobile.webp') center top/auto no-repeat scroll;}
#download-pdf {background: url('../pic/bg-pdf-1-mobile.webp') center top / cover no-repeat scroll; }
#wrapper-contact{ background: url('../pic/banner-kontakt-mobile.webp') center top / auto repeat-y scroll; }
#box-clean-filters { align-items: flex-start; padding: 20px 20px; }
.list-products-box { width: 47%; }
#openfiltersbox {width:40%; padding: 10px 10px; font-size: 12px;}
#closefiltersbox {width:100%; padding: 10px 10px; font-size: 12px;}
#openfiltersbox img, #closefiltersbox img, #filtercleaner img {width:18px; height: 18px;}
.product-header-2 { font-size: 16px; }
.product-header-3 { font-size: 12px; }
.product-button-1 { width: 100%; margin-top: 15px;}
#filtercleaner  { width:40%; padding: 10px 10px; font-size: 12px;}
.product-header-2 { margin: 10px 0px 0px 0px; }
.top-box-scroller {padding:0;}
    }
@media only screen and (max-width: 430px) { 
#wrapper-category {padding: 100px 0px 0px 0px}
.header-1 {font-size:18px;}
.header-2 {font-size:16px;}
.header-3 { font-size:13px;} 
.pdf-button {font-size: 11px;}
#polityka-prywatnosci h1 { font-size:18px;}
 #products-description h2, #products-description h3, #products-description h4, #products-description h5, #products-description h6 { font-size: 13px;} 
.tag-list li {width: 160px;}
.basic-text, .box-item-desc p, .button-1, .product-button-1, .wrapper-cat-title p, #products-description p  {font-size:11px;}
#wrapper-offer {height: 390px;}
}  
@media only screen and (max-width: 430px) {
#wrapper-offer {height: 360px;}
    footer {flex-flow: column nowrap; align-items: center; justify-content: center; }
    #footer-company {width:100%; align-items: center; justify-content: center;}
    footer address {width:100%; align-items: center; justify-content: center; }
    }