body {                    /* ustawienia tła */
  background-image: url("Tło360.jpg");
  background-size: contain;
  margin: 0;   /* dodajemy zerowy margines do body */
}
.logo {
  display: inline;
}
.logo img {               /* ustawienia obrazów logo */
  vertical-align: middle;
  float: left;
  width: 22%;
  margin-right: 1%;
  margin-left: 1%;
}
.head-con {               /* ustawienia tekstu w kontakt  */
  font-size: 1rem;
  text-align: right;
  margin-left: 0%;
  margin-top: 0%;
}
.linki-kontaktow2 {    /* ustawienia linków w górnym pasku */
  font-size: 1rem;     /* wielkość tekst i obrazek */
  float: right;
  margin-right: 1%;
  margin-top: 0%;
  visibility: visible;    /* visible - widoczny, hidden - ukryty */
}
.linki-kontaktow2 img.icon-con {
  width: 8%;
  margin-right: 5px;
}
.linki-kontaktow2 a.li-ko {
  text-decoration: none;
  color: #333;
}
.menu {
  text-align: center;
  margin-top: 7rem;
}
.menu-link {              /* ustawienia menu rozmiar czcionki i odstępy */
  font-size: 1.2rem;      /* rozmiar tekstu */
  margin-right: 15px;     /* ustalenie odstępu między odnośnikami */
}
.menu-link:active,
.menu-link:focus {        /* ustawienia menu kolor i przeźroczystość */
  background-color: rgba(100, 100, 100, 0.3);
}
.my-iframe {              /* ustawienia ramki zawartośći */
  width: 100%;
  height: 720px;
  border: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  display: block;
}
.about-us {
  display: inline;
}
.about-us img {           /* ustawienia obrazów w o nas i oferta */
  vertical-align: middle;
  float: left;
  width: 40%;
  height: auto ;
  margin-right: 1%;
  margin-left: 5%;
}
.tekst-onas {             /* ustawienia tekstu w o nas  */
    font-size: 1.1rem;
    display: inline-block;
    width: 40%;
    word-wrap: break-word;
  }
.tekst-onas p {
    float: left;
    margin-left: 10px;
  }
.tekst-onas b {
    font-weight: bold;
  }
.title-center-none {      /* ustawienia tytuł w o nas/ukrycie   */
    font-size: 1.5rem;
    font-weight: bold;
	margin-top: 2%;
    text-align: center;
	visibility: hidden;     /* visible - widoczny, hidden - ukryty */
  }
.title-center {           /* ustawienia tytuł w oferta i praca  */
    font-size: 1.5rem;
    font-weight: bold;
	margin-top: 2%;
    text-align: center;
  }
.tekst-oferta {           /* ustawienia tekstu w oferta  */
    font-size: 1.1rem;
    display: inline-block;
    width: 50%;
    word-wrap: break-word;
  }
.tekst-oferta p {
    float: left;
    margin-left: 10px;
  }
.tekst-oferta b {
    font-weight: bold;
  }
.work {
  display: inline;
}
.work img {               /* ustawienia obrazów w praca */
  vertical-align: middle;
  float: left;
  width: 22%;
  margin-right: 1%;
  margin-left: 5%;
}
.job-description {        /* ustawienia tekstu w praca  */
  display: inline;
  width: 55%;
  word-wrap: break-word;
  line-height: 1rem;    /* odległość między linijkami */
  margin-top: 5%;
}
.job-title {
  color: blue;
  font-size: 1.5rem;
  margin-left: 40%;
  width: 80%;
}
.job-info {
  font-size: 1rem;
  margin-left: 10px;
  text-align: center;
  width: 80%;
}
.job-email {
  font-size: 1rem;
  margin-top: 10px;
  text-align: left;
  margin-left: 20%;
}
.contact-header {         /* ustawienia tekstu w kontakt  */
  font-size: 3rem;
  font-weight: bold;
  text-align: left;
  margin-left: 5%;
  margin-top: 3%;
}
.contact-info {
  font-size: 1.1rem;
  float: left;
  margin-left: 5%;
  margin-top: 2%;
}
.contact-info b {
  font-weight: bold;
}
.contact-info img.icon {
  height: 3%;
  margin-right: 5px;
}
.contact-info a.links {
  text-decoration: none;
  color: #333;
}
.icon {
  margin-right: 3px;
  width: 8%;
}
.map-container {          /* ustawienia mapy */
  float: right;
  width: 50%; 
  margin-right: 15%;
  height: 25em;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 0 0 5px rgba(0,0,0,0.3);
  overflow: hidden;
}
.map-container iframe {
  width: 100%;
  height: 100%;
  margin-left: 0px; /* dodany margines lewy dla przesunięcia mapy w lewo */
}




@media screen and (min-width: 2160px) and (max-width: 767px) {   
  /* Zmiany stylu, które mają zastosowanie dla smartfonów z rozdzielczością UHD */
  /* Możesz dodać tutaj swoje specjalne style dla telefonów z rozdzielczością UHD */

}

/* Reguły CSS dla komputerów z rozdzielczością UHD o minimalnej szerokości ekranu 3840px */
@media screen and (min-width: 3840px) and (min-height: 2160px) {
  /* Zmiany stylu, które mają zastosowanie dla komputerów z rozdzielczością UHD */
  /* Możesz dodać tutaj swoje specjalne style dla komputerów z rozdzielczością UHD */

}

@media screen and (max-width: 800px) and (max-height: 600px) {
  /* Zmiany stylu, które mają zastosowanie dla komputerów z rozdzielczością UHD */
  /* Możesz dodać tutaj swoje specjalne style dla komputerów z rozdzielczością UHD */

}