* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
html {
	scroll-behavior: smooth;
}

body {
	font-family: 'Open Sans', sans-serif;
	background-color: rgba(253, 248, 248, 0.785);
}
.underline {
	margin: 0 auto 40px;
	width: 160px;
	height: 4px;
	background-color: #0086f3;
}
.blue-text1 {
	color: #0086f3;
}
nav {
	z-index: 1;
}

.nav {
	height: 60px;
	background-color: #333;
	text-align: center;
	line-height: 50px;	
}


.nav-link,
.navbar-nav .show > .nav-link,  .navbar-brand, .fa-bars {
	color: #fff;
	text-transform: uppercase;
}

 .nav-link:focus,  .nav-link:hover, .navbar-nav .nav-link.active, .navbar-nav .show > .nav-link .navbar-brand {

	color:#0086f3;
} 

.navbar-toggler {
	padding: 10px 15px;
	
	color:#fff;
}

.navbar-brand:focus, .navbar-brand:hover {

	color:#0086f3;
}

.navbar-brand  {

	font-weight: bold;
}


.navbar-brand a {

	font-weight: bold;
	padding: 15px;
}
.wrapper {
	margin: 0 auto;
	width: 100%;
	max-width: 1800px;
}
.wrapper1 {
	margin: 0 0px;
	width: 100%;
	height: 100%;
	max-width: 1240px;
	max-height: 1300px;
}
.wrapper2 {
	margin:0 auto;
	width: 100%;
	height: 100%;
	max-width: 1300px;
	max-height: 1500px;
}
.wrapper3 {
	margin: 0 auto;
	width: 100%;
	height: 120%;
	max-width: 1300px;
	max-height: 1200px;
}
.wrapper4 {
	margin: 0 auto;
	width: 100%;
	height: 120%;
	max-width: 1300px;
	max-height: 1200px;
}


.wolf-bg {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.3);
}
.wolf-bg1 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.4);
}
.wolf-bg2 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
}
.wolf-bg3 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
}
.wolf-text {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: white;
}

.wolf-text span {
	text-transform: uppercase;
	color: #09f;
}

.home a {
	display: block;
	text-align: right;
	margin: 0 100px;
	text-decoration: none;
    color: #000;
    
    
}
.home a:hover {
	color: #0086f3;
}

.section-title {
	margin-bottom: 20px;
	text-transform: uppercase;
	font-weight: bold;
	text-align: center;
	
}
.section-title a {
	text-decoration: none;
	color: #333;
}


/* Nawigacja */
nav {
	position: sticky;
	top: 0;
	height: 100px;
	line-height: 60px;
	background-color: #ddd;
	text-align: center;
	z-index: 1;
}

section {
	scroll-margin-top: 70px;
}
table {
  width: 100%;
  border-collapse: collapse; /* Łączy obramowania w jedną linię */
}
th, td {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: left;
}

.nav1 {

    text-align: right;
    margin: 0 40px;
}

/* to jest taki kontener na stronie, pozwala trzymać tresc na środku max wysokość od 1200-do 1400 takiego wrapera*/
/* zapamiętać !!!! */

.burger-icon {
	display: block;
	margin-left: auto;
	padding: 0 30px;
	background: none;
	border: none;
	line-height: 60px;
	font-size: 25px;
	cursor: pointer;
}

/* header */

.header {
	position: relative;
	background-image: url('../img/koło.jpg');
	height: 300px;
	background-size: cover;
	background-position: 0 35%;
	
}
.header1 {
	position: relative;
	background-image: url('../img/pompa.png');
	height: 900px;
	background-size: cover;
	background-position: 0 65%;
}
.header2 {
	position: relative;
	background-image: url('../img/hpnext.png');
	height: 900px;
	background-size: cover;
	background-position: 0 55%;
}
.header3 {
	position: relative;
	background-image: url('../img/smarthome1280.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 35%;
}
.header4 {
	position: relative;
	background-image: url('../img/ogrzewanieCO2.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 35%;
}
.header5 {
	position: relative;
	background-image: url('../img/ogrzewaniepormieniowanie.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 35%;
}
.header6 {
	position: relative;
	background-image: url('../img/termostat.webp');
	height: 900px;
	background-size: cover;
	background-position: 0 35%;
}
.header7 {
	position: relative;
	background-image: url('../img/rekuperacja1.jpeg');
	height: 900px;
	background-size: cover;
	background-position: 0 35%;
}
.header8 {
	position: relative;
	background-image: url('../img/centrala.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 15%;
}
.header9 {
	position: relative;
	background-image: url('../img/fiberlarge.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 15%;
}
.header10 {
	position: relative;
	background-image: url('../img/currentlarge.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 15%;
}
.header11 {
	position: relative;
	background-image: url('../img/mierniklarge.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 25%;
}
.header12 {
	position: relative;
	background-image: url('../img/lazienkalarge.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 25%;
}
.header13 {
	position: relative;
	background-image: url('../img/floorheating1024x791.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 25%;
}
.header14 {
	position: relative;
	background-image: url('../img/solar1920.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 25%;
}
.header15 {
	position: relative;
	background-image: url('../img/smarthome1280.jpg');
	height: 900px;
	background-size: cover;
	background-position: 0 25%;
}


/* sekcja main */

main {
	margin: 70px 0;
}

.products {
	cursor: pointer;
text-align: center;
	
}



.about-us-info {
	margin-bottom: 30px;
	padding: 0 20px;
	font-size: 22px;
	
}

.about-us p {

	text-indent: 30px;
}
/* produkty */

.product {
display:inline-block;
	position: relative;
	height: 500px;
	width: 400px;
	background-size: cover;
	background-position: center;
	text-align: center;
	font-size: 16px;
	padding: 2px;

	

	/* margin: 40px auto;   */
}


.hero-bg {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.3);
	background-blend-mode: multiply;
	background-size: cover;     /* Obrazek wypełni cały powiększony kafelek */
    background-position: center; /* Wyśrodkowanie zdjęcia */
}

.hero-text {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: white;
}

.product1 .hero-bg {
	background-image: url('../img/rzeszowsmall.jpg');
}
.product2 .hero-bg {
	background-image: url('../img/PGEKR1.jpg');
}
.product3 .hero-bg {
	background-image: url('../img/PGEKCE1.jpg');
}
.product4 .hero-bg {
	background-image: url('../img/pgebe.webp');
}
.product5 .hero-bg {
	background-image: url('../img/cukgostyn1.jpg');
}
.product6 .hero-bg {
	background-image: url('../img/ecgorlice1.png');
}
.product7 .hero-bg {
	background-image: url('../img/ecsiekierki.jpg');
}
.product8 .hero-bg {
	background-image: url('../img/enea.jpg');
}
.product9 .hero-bg {
	background-image: url('../img/pecwyszkow.jpg');
}
.product10 .hero-bg {
	background-image: url('../img/portgdańsk.jpg');
}
.productp1 .hero-bg {
	background-image: url('../img/pompa3.jpg');
}	
.productp2 .hero-bg {
	background-image: url('../img/pompa4.jpg');
}
.productp3 .hero-bg {
	background-image: url('../img/pompa5.jpg');
}
.productp4 .hero-bg {
	background-image: url('../img/pompa6.jpg');
}
.productp5 .hero-bg {
	background-image: url('../img/pompa7.jpg');
}
.productp6 .hero-bg {
	background-image: url('../img/pompa8.jpg');
}
.productog1 .hero-bg {
	background-image: url('../img/ogrz1.jpg');
}
.productog2 .hero-bg {
	background-image: url('../img/ogrz2.jpg');
}
.productog3 .hero-bg {
	background-image: url('../img/ogrz3.jpg');
}
.productog4 .hero-bg {
	background-image: url('../img/ogrz4.jpg');
}
.productog5 .hero-bg {
	background-image: url('../img/ogrz5.jpg');
}
.productog6 .hero-bg {
	background-image: url('../img/ogrz6.jpg');
}
.productog7 .hero-bg {
	background-image: url('../img/ogrz7.jpg');
}
.productog8 .hero-bg {
	background-image: url('../img/ogrz8.jpg');
}
.productrek1 .hero-bg {
	background-image: url('../img/rek1.jpg');
}
.productrek2 .hero-bg {
	background-image: url('../img/rek2.jpg');
}
.productrek3 .hero-bg {
	background-image: url('../img/rek3.jpg');
}
.productrek4 .hero-bg {
	background-image: url('../img/rek4.jpg');
}
.productrek5 .hero-bg {
	background-image: url('../img/rek5.jpg');
}
.productrek6 .hero-bg {
	background-image: url('../img/rek6.jpg');
}
.productrek7 .hero-bg {
	background-image: url('../img/rek7.jpg');
}
.productrek8 .hero-bg {
	background-image: url('../img/rek10.jpg');
}
.productrek9 .hero-bg {
	background-image: url('../img/rek11.jpg');
}
.productel1 .hero-bg {
	background-image: url('../img/el1.jpg');
}
.productel2 .hero-bg {
	background-image: url('../img/el2.jpg');
}
.productel3 .hero-bg {
	background-image: url('../img/el3.jpg');
}
.productel4 .hero-bg {
	background-image: url('../img/el4.jpg');
}
.productel5 .hero-bg {
	background-image: url('../img/el5.jpg');
}
.productel6 .hero-bg {
	background-image: url('../img/el6.jpg');
}
.productel7 .hero-bg {
	background-image: url('../img/el7.jpg');
}
.productel8 .hero-bg {
	background-image: url('../img/el8.jpg');
}
.productlaz1 .hero-bg {
	background-image: url('../img/laz1.jpg');
}
.productlaz2 .hero-bg {
	background-image: url('../img/laz2.jpg');
}
.productlaz3 .hero-bg {
	background-image: url('../img/laz3.jpg');
}
.productlaz4 .hero-bg {
	background-image: url('../img/laz4.jpg');
}
.productlaz5 .hero-bg {
	background-image: url('../img/laz5.jpg');
}
.productlaz6 .hero-bg {
	background-image: url('../img/laz6.jpg');
}
.productlaz7 .hero-bg {
	background-image: url('../img/laz7.jpg');
}
.productlaz8 .hero-bg {
	background-image: url('../img/laz8.jpg');
}
.productlaz9 .hero-bg {
	background-image: url('../img/laz9.jpg');
}
.productlaz10 .hero-bg {
	background-image: url('../img/laz10.jpg');
}
.productlaz11 .hero-bg {
	background-image: url('../img/laz11.jpg');
}
.productlaz12 .hero-bg {
	background-image: url('../img/laz12.jpg');
}
.productlaz13 .hero-bg {
	background-image: url('../img/laz13.jpg');
}
.productlaz14 .hero-bg {
	background-image: url('../img/laz14.jpg');
}
.contact {
	text-align: center;
	text-transform: uppercase;
}
.contact h2 {
	margin: 20px;
	font-weight: bold;
	 
}

.contact h3 {
	margin: 20px 0;
	text-transform: uppercase;
	font-weight: bold;
	/* padding: 20px 0 ; */
}

footer {
	height: 80px;
	line-height: 80px;
	color: #ddd;
	background-color: #333;
	text-align: center;
	font-size: 20px;
}

.row a {

	text-decoration: none;
	color: #333;
}

.row a:hover {

	text-decoration: none;
	color:#0086f3;
}
.oferta i {

	margin-top: 20px;
	font-size: 62px;
}
.oferta-hover:hover {

	color:#0086f3;
}
.aboutus-card-tittle1 {

	font-size: 20px;
	text-transform: uppercase;

}
.about-us-text p {

 text-justify: inter-word;
}

.about-us-text2 {

	font-size: 24px;
	white-space: pre-line;
}
.about-us-text3 {
position: relative;
	bottom: 5px;
	padding: 20px 40px;
	text-align: left;
	font-size: 24px;
	color: #ccc3c3

}
.section-tittle {

	font-size: 26px;
	text-align: center;

}
.powietrze {

	font-weight: bold;
}

span1 {

	font-weight: bold;
	font-size: 26px;
	text-transform: uppercase;
}
.pv {

font-weight: bold;

}
.icon-box {
	margin-left: 50px;
}

.icon-box a {
	margin: 0 5px;
	color: #ddd;
	font-size: 30px;
	transition: color 0.3s;
}
.icon-box a:hover {
	color: #0086f3;
}

@media (min-width: 375px) {
	.burger-icon {
		display: block;
	}
	.nav-items {
		display: inline-block;
		margin-right: auto;
	}
	

}


@media (min-width: 768px) {
	.burger-icon {
		display: block;
	}
	.nav-items {
		display: inline-block;
		margin-right: auto;
	}

	.nav-items a {
		padding: 0 30px;
		text-decoration: none;
		text-transform: uppercase;
		font-weight: bold;
		color: #333 transition color 0.3s;
	}
	.nav-items a:hover {
		color: #09f;
	}
	.header {
		background-image: url('../img/koło.jpg');
		height: 400px;


	.wolf-text h1 {
		font-size: 36px;
	}
	.wolf-text p {
		font-size: 18px;
	}

	.product h3 {
		font-size: 24px;
	}

	@media (min-width: 992px) {
		.product-box {
			font-size: 0px;
		}
		section h2 {
			font-size: 30px;
		}
	}
		}

}

@media (min-width: 1200px) {
	.wolf-text h1 {
		font-size: 42px;
	}
	.wolf-text p {
		font-size: 24px;
	}
}

summary {
					display: flex;
					justify-content: center;
					align-items: center;
					list-style: none;
					cursor: pointer;
					font-weight: bold;
					padding: 10px;
					margin: 10px 60px;
					margin-right: 25px;
					font-size: 36px;
					background: none;
					border-width: 1px 1px;
					border-style: dashed;
				}

				summary::-webkit-details-marker {
					display: none;
				}

				/* Dodajemy własny symbol + przed tekstem */
				summary::before {
					content: '+ ';
					color: #0086f3;
				}

				/* Zmiana na - po otwarciu */
				details[open] summary::before {
					content: '- ';
					color: #333;
				}

				li {
					margin: 0 auto;
					font-size: 24px;
					
				}
				span1 {
					margin: 10px 20px
				}