
/* kolor strony*/
body {
background-color: black;

background-position: top top;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;

}


/* Styl dla tła lightboxu - zajmuje cały ekran i jest półprzezroczysty */
.lightbox {
  display: none; /* Domyślnie ukryty */
  position: fixed; /* Pozycjonowany względem okna przeglądarki */
  z-index: 1000; /* Upewnij się, że jest na wierzchu */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto; /* W razie potrzeby przewijanie */
  background-color: rgba(0, 0, 5, 0.4); /* Ciemne, półprzezroczyste tło */
}

/* Styl dla kontenera, w którym wyświetlany jest plik */
.lightbox-content {
  margin: 1% auto; /* Wyśrodkowanie w pionie i poziomie */
  padding: 2px;
  width: 90%; /* Szerokość kontenera */
  max-width: 830px; /* Maksymalna szerokość */
  background-color: black; /* Tło okna */
  position: relative;
}

/* Styl dla przycisku zamknięcia */
.close-btn {
  color: #ffffff;
  float: center;
  font-size: 34px;
  font-weight: bold;
  cursor: pointer;
}

/* przy zamknięciu */
.close-btn:hover,
.close-btn:focus {
  color: #dd2228;
  text-decoration: none;
  cursor: pointer;
}

/* Styl dla media wewnątrz lightboxa */
#lightbox-media img,
#lightbox-media video {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto; /* Wyśrodkowanie */
}



.file-group-box {
  
  /* Kluczowa linia: automatyczne marginesy po lewej i prawej stronie */
  margin-left: auto;
  margin-right: auto;
 

  /* Ramka i Zaokrąglenie */
  border: 2px solid #ccc; /* Lekka szara obwódka */
  border-radius: 8px; /* Zaokrąglone rogi */
  
  /* Odstępy */
  padding: 10px; /* Odstęp wewnątrz ramki */
  margin: 15px 0; /* Odstęp między ramkami */
  line-height: 28.0px;
margin-bottom: -5px;
  
  /* Cień (opcjonalny) */
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); /* Delikatny cień */
  
  /* Tło */
  background-color: #909090; /* szare tło */
  
  /* Szerokość */
  margin-left: auto;
  margin-right: auto;
  width: 90%; /* Szerokość ramki */
  max-width: 840px;
}

/* Styl dla tytułu w ramce div */
.file-group-box h4 {
  color: #000000;
  margin-top: 0;
  border-bottom: 1px solid #eee;
  padding-bottom: 5px;
margin-bottom: 5px;
}

/* Styl dla linków w ramkach*/
.file-link {
  display: inline; /* Każdy link w  linii */
  padding: 9px ;
  color: #ffffff; /* Kolor linku */
  text-decoration: none;

  
}

.file-link:hover {
  text-decoration: bold;
  color: #feff00;
}

.fb-link {
  color: #ffffff; /* Kolor bialy */
  text-decoration: none;
}


.fb-link:hover {
  color: #feff00; /* Kolor po najechaniu kursorem */
  
}





.napis {
/* napisy w menu*/

a:link { text-decoration: none; font-weight: bold; color:#000000 }
a:visited { text-decoration: none; color:#000000 }

a:active { text-decoration: none; color:#000000 }

a:hover{ color:#ffffff ; font-size : 20,5 pt}
a {cursor : crosshair}
}

.navigation-menu {
/* Wymuszona szerokość tła */
  width: 590px;

/* Wyśrodkowuje kontener (menu) na stronie */
  margin: 20px auto;

  /* Włącza Flexbox na kontenerze */
  display: flex;
  
  /* Wyśrodkowuje elementy (linki) wzdłuż głównej osi (poziomej) */
  justify-content: center;
  
 /* Odstępy pionowe */
  padding: 10px 0;

/* Poniżej: tło  z przezroczystością 70% (0.7) */
  background-color: rgba(144, 144, 144, 0.9);

/* Zaokrąglenie rogów */
border: 1px solid #ccc; /* Lekka szara obwódka */
  border-radius: 8px;
}



/* Linia o stałej szerokości  */
.short-line {
  width: 500px; 
  height: 1px;
  /* Kolor */
  background-color: #909090;
  /* Usunięcie domyślnego cienia */
  border: none; 
  /* 4. KLUCZ DO WYRÓWNANIA DO LEWEJ: */
  margin-left: auto; /* Zeruje margines lewy */
  margin-right: auto; /* Pozwala na wyrównanie do lewej */
}

