.google-sans-flex-trzcionka {
  font-family: "Google Sans Flex", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "wdth" 100,
    "GRAD" 0,
    "ROND" 0;
}
.conteinerfirst{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    font-family: "Google Sans Flex";
 color:yellow;

    background-image: url('./20260116_215249.jpg');
background-size: cover;

}

.zdjecie1{
  float: left;
height: 300px;
opacity: 1;
}

.zdjecie1:hover{
   transform: scale(2.05);
}

.foto {
  width: auto; /* 3 zdjęcia w rzędzie minus marginesy */
  height: 200px; /* Zachowanie proporcji */
  object-fit: cover; /* Zdjęcia wypełniają obszar bez rozciągania */
}

.galeria {
  display: flex;
  flex-wrap: wrap; /* Obrazy zawijają się do nowej linii */
  gap: 10px; /* Odstęp między zdjęciami */
  justify-content: center; /* Wyśrodkowanie galerii */
}

.foto:hover{
   transform: scale(2.05);
}

.conteiner1{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    font-family: "Google Sans Flex";
    text-align: right;
    border: 10px solid black;
    background-color: rgba(164, 8, 162, 0.5);
    width: 800px;
margin-top: 50px;
padding-top: 80px;

}
.conteiner2{
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 równe kolumny */
    gap: 10px;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}
.conteiner3{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}
.conteiner4{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.navigation__list { 
    list-style: none;
    display: flex;
    gap: 20px;
  position: fixed;
top: 0;
z-index: 1000; 
 padding: 10px 10px;
 background-color: pink;
 border: 10px solid black;
 margin-bottom: 100px;
}

#druga_sekcja { 
   scroll-margin-top: 150px;
    position:static;
    top: 500px;
    left: 20px;
    z-index: 10;

 }

.programowanie{
    font-family: "Google Sans Flex";
 color:rgb(26, 26, 19);
 padding-top: 110px;
}

.lista{
}

@media screen and (max-width: 200px) {
  /* Style dla ekranów o szerokości do 600px */
  body {
    background-color: rgb(8, 9, 9);
  }
  h1 {
    font-size: 20px;
  }