body {
    font-family: system-ui;
    margin: 0;
    padding: 0;
    scroll-behavior: smooth; /* Płynne przewijanie */
}

header {
    background-color: #fff;
    color: #333;
    padding: 10px 0;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 1000;
	box-shadow: 0px 0px 8px -2px #000000ab;
}

#start_logo{
float: left;padding-left: 30%;  padding-right: 30px; width:80px;	
}

#navbar {
    padding-top: 20px;
	
}

#navbar ul {
    list-style-type: none;
    padding: 0;
}

#navbar ul li {
    display: inline;
    margin-right: 10px;
}

#navbar ul li a {
    color:#333;
    text-decoration: none;
    padding: 14px 12px;
    border-radius: 15px;
	font-weight: bold;
}

#navbar ul li a:hover {
    color:#910303;
}

main {
    padding-top: 113px; /* Zapobieganie ukryciu zawartości przez nagłówek */
}

section {
	padding: 130px 20px 20px 20px;
    margin: 20px;
	justify-content: center;
 	 display: flex;
    
}

.som_pdf {color: #515151;
background-color: #FFF;
  border: 1px solid #939393;
border-radius: 0px 25px 0px 25px;
  padding: 5px 25px 5px 25px;
  text-decoration: none;
transition: 0.5s ease;
}
.som_pdf:hover {
	color: #FFF;
	background-color: #797979;
  border: 1px solid #a8a8a8;
  padding: 5px 25px 5px 25px;
  text-decoration: none;
border-radius:30px 0px 30px 0px;
transition: 0.5s ease;
}

#pc{
	display: block;
		
}
#mobile{
	display: none;
		
}
#som_foto{
	max-width:708px;	
}

@media (max-aspect-ratio: 6/5){

#som_foto{
	width:100%;	
}

section {
	padding: 80px 5px 5px 5px;
    margin: 5px;
	justify-content: center;
 	 display: flex;
    
}
#pc{
	display: none;
		
}
#mobile{
	display: block;
		
}

}

#baner {
	background: url(image/woz.webp) fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-right: initial;
  padding-left: initial;
  padding-top: 200px;
  padding-bottom: 200px;
  transition: 1s ease;
  
	}

	
#witaj{
	transition: 1s ease;
	}
	
#witaj:hover{
	-webkit-transform: scale(0.9);
-ms-transform: scale(0.9);
transform: scale(0.9);
transition: 1s ease;

	}	

#img_osp{
	width: 100%;
	border: 2px solid white;
	transition: 1s ease;
	}
#img_osp:hover{
	width: 100%;
  box-shadow: 1px 1px 11px 0px #fb8604;
  border: 2px solid white;
    -webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
transition: 1s ease;
	}
	
	
	
#ban-text1{
	padding-top: 30px;
	padding-left: 13%;
	color: #FFBF00;
	font-size: 35px;
	text-shadow: 1px 1px 5px black;
	font-weight: bold;
	}
#ban-text2 {
	padding-bottom: 30px;
	padding-left: 13%;
	color: #FFF;
	font-size: 45px;
	text-shadow: 1px 1px 5px black;

	
	}
#procent_start{
width: 165px;float: right;margin-right: 13%;	
}
#procent_start2{
	display:none;	
}
#navbar2{
	display: none;
}
#nav-mobile{
	display:none;
}
@media (max-aspect-ratio: 4/3){
main {
    padding-top: 63px; /* Zapobieganie ukryciu zawartości przez nagłówek */
}

#start_logo{
	display:none;
}

#navbar {
    text-align:center;
	font-size: 20px;
}

#navbar ul {
    list-style-type: none;
    padding: 0;
}

#navbar ul li {
    display: inline;
    margin-right: 3px;
}

#navbar ul li a {
    color:#333;
    text-decoration: none;
    padding: 14px 5px;
    border-radius: 15px;
	font-weight: bold;
}
#nav-mobile{
	display:none;
}

}

@media (max-aspect-ratio: 6/5){
#navbar2 {
    text-align: left;
	font-size: 20px;
}

#navbar2 ul {
    list-style-type: none;
    padding-left: 5%;
}

#navbar2 ul li {
    margin-right: 3px;
	padding: 10px;
}

#navbar2 ul li a {
    color:#333;
    text-decoration: none;
    padding: 14px 5px;
    border-radius: 15px;
	font-weight: bold;
}
#nav-mobile{
	display: block;
}
#navbar{
	display: none;
}

#baner {
	background: url(image/woz.webp) fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-right: initial;
    padding-left: initial;
    padding-top: 120px;
    padding-bottom: 120px;
    transition: 1s ease;
    background-size: 320%;
 }	
	
#ban-text1{
	padding-top: 30px;
	padding-left: 13%;
	color: #FFBF00;
	font-size: 25px;
	text-shadow: 1px 1px 5px black;
	font-weight: bold;
	}
#ban-text2 {
	padding-bottom: 30px;
	padding-left: 13%;
	color: #FFF;
	font-size: 25px;
	text-shadow: 1px 1px 5px black;
	
	}	
#procent_start{
	display:none;
}
#procent_start2{
	display: block;
	margin-left:5;
	padding-top: 7%;
width: 100px;	
}
#navbar2{
	display: block;
}	
}

#all_kwadraty{
display:flex;justify-content: center; max-width:1200px;	
}

#kwadraty{
	width: 25%;
  margin: 25px;
  text-align: center;
  transition: 1s ease;
	}
	
#kwadraty:hover{
	width: 25%;
  margin: 25px;
  text-align: center;
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
transition: 1s ease;
}
@media (max-aspect-ratio: 6/5){
#all_kwadraty{
display: block;justify-content: center;		
}
#kwadraty{
	width: 90%;
	margin-top:50px;
  text-align: center;
  transition: ;
  
	}
	
#kwadraty:hover{
	width: 90%;
	margin-top:50px;
  text-align: center;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
transition: 1s ease;
}

}
#kontakt_all{

 display:flex;
 justify-content: center; 
 max-width:1200px;
}
#kontakt{

  float: left;
  text-align: left;
  max-width:600px;height:420px; background-color:white; padding-left:60px; padding-right:60px; padding-top:30px; border-radius: 0px 20px 20px 0px;
}

@media (max-aspect-ratio: 6/5){

#kontakt_all{
display: contents;
 justify-content: center; 
 max-width:1200px;
}
#kontakt{
	width:100%;  
  text-align: left;
   border-radius: 20px;
}
#kontakt_mapa{
	display:none;
	}

}
.foto-mini{
	height: 180px;
  padding: 5px;
  border-radius: 25px;	
  transition: 0.5s ease;
}
.foto-mini:hover{
	height: 180px;
  margin: 10px;
  border-radius: 25px;
  -webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
transition: 0.5s ease;	
}
#procent1{
	display:block;
}
#procent2{
	display: none;
}
@media (max-aspect-ratio: 6/5){
.foto-mini{
	height: 80px;
  padding: 1px;
  border-radius: 15px;	
  transition: 0.5s ease;
}
.foto-mini:hover{
	height: 80px;
  margin: 1px;
  border-radius: 15px;
  -webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
transition: 0.5s ease;	
}
#procent2{
	display:block;
}
#procent1{
	display: none;
}
}


#ban_bg2{
	background: url(image/bg2.webp) no-repeat fixed;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
  -moz-background-size: 130%;
  background-size: 130%;
  color: white;
  height: inherit;
  margin: 0 auto;
  padding: 0;
  background-position: center;
  min-height: 180px;
  width:100%;
	
	}
#ban_bg{
	background: url(image/bg.webp) no-repeat fixed;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
  -moz-background-size: 110%;
  background-size: 110%;
  color: white;
  height: inherit;
  margin: 0 auto;
  padding: 0;
  background-position: center;
  min-height: 180px;
  width:100%;
	
	}
@media (max-aspect-ratio: 6/5){
#ban_bg{
	background: url(image/bg.webp) no-repeat fixed;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
  -moz-background-size: 300%;
  background-size: 300%;
  color: white;
  height: inherit;
  margin: 0 auto;
  padding: 0;
  background-position: center;
  height: 180px;
  width:100%;

}
#ban_bg2{
	background: url(image/bg2.webp) no-repeat fixed;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
  -moz-background-size: 300%;
  background-size: 300%;
  color: white;
  height: inherit;
  margin: 0 auto;
  padding: 0;
  background-position: center;
  height: 180px;
  width:100%;

}
}

	
#ban_1i5{
	
  margin: 0 auto;
  padding: 0;
  background-position: center;
  width:100%;
	
}	
	
	
#srodek {
   margin: 0;
  position: relative;
  top: 40%;
  text-align:center;}
  
#srodek2 {
   margin: 0;
    background: yellow;
    position: relative;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
}
  
  
button {
	font-family: "Open Sans", "Noto Sans", sans-serif;
}

/* Chrome, Safari, Edge, Opera 
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox 
input[type=number] {
  -moz-appearance: textfield;
}
*/


.tabs {
	width: 100%;
	max-width: 1500px;
	margin: 10px auto;
}
.tabs2 {
	width: 100%;
	max-width: 1300px;
	margin: 10px auto;
}

.tab-header {
	display: flex;
	flex-wrap: wrap;
}

.tab-button {
	margin: 5px 5px;
  flex-grow: 1;
  background-color: #ffffff;
  border: 1px solid #cfcfcf;
  color: #909090;
  font-size: 15px;
  font-weight: 600;
  padding: 10px;
  cursor: pointer;
  text-align: center;
  box-sizing: border-box;
  transition-duration: 0.2s;
  transition-timing-function: linear;
  border-radius: 20px;
}

.tab-button:hover {
	color: #ffffff;
	background-color: #861717;
}

.tab-button.active {
	background-color: #861717;
  color: white;
  box-shadow: 1px 1px 6px #861717;
  border: 1px solid #fff;
}

.tab-content {
	border-top: none;
	font-size: 17px;
	font-weight: 300;
	line-height: 30px;
	padding: 10px 0px 0px 0px;
}

.tab-content img {
	float: left;
	display: block;
	max-width: 350px;
	margin-right: 20px;
	margin-bottom: 20px;
}

.tab-pane {
	display: none;
}

.tab-pane1 {
	display: none;
	overflow:hidden;
}

.tab-pane.active {
	display: block;
}

	
#prac {
  padding: 5px;
}
#zarz {
	display:block;
  padding: 5px;
}
#zarz2 {
	display: none;
  padding: 5px;
}
@media (max-aspect-ratio: 6/5){

#zarz {
	display: none;
  padding: 5px;
}
#zarz2 {
	display:block;
  padding: 5px;
}
}
	

@media (max-width: 770px) {
	.tab-content {
		font-size: 16px;
}

.tab-content img {
	float: none;
	max-width: 100%;
	margin: 0 auto;
	text-align: center;
}
}