/* Globální styly pro text, pozadí atd. */
body {
  font-family: Arial, sans-serif;
  background-color: #e0f0ff;
  margin: 0;
  padding: 0;
  text-align: center;
  color: #003366;
}

header {
  padding: 20px;
}

nav {
  margin: 20px;
}

nav a {
  margin: 10px;
  text-decoration: none;
  color: white;
  background-color: #007BFF;
  padding: 10px 20px;
  border-radius: 5px;
}

/* Hlavní fotka */
.main-photo {
  width: 300px;
  height: auto;
  border-radius: 10px;
  display: block;
  margin: 20px auto;
}

/* Styly pro fotky v galeriích (např. na stránkách jako "Rodina") */
.gallery {
  display: flex;
  justify-content: center;
  padding: 20px;
}

.gallery img {
  width: 90%;            /* Fotky v galerii budou na 90 % dostupné šířky */
  max-width: 900px;      /* Maximální šířka fotky */
  height: auto;
  margin: 20px auto;
  display: block;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Jemný stín pro efekt */
}

/* Specifické styly pro galerii na stránce "Cestování" */
.cestovani-gallery {
  display: flex;
  flex-wrap: wrap;          /* Fotky budou v několika řadách */
  justify-content: center;  /* Zarovná fotky na střed */
  gap: 15px;                /* Vzdálenost mezi fotkami */
  padding: 20px;
}

.cestovani-gallery img {
  width: 320px;             /* Šířka fotek zvětšena na 320px */
  height: 300px;            /* Výška zvětšena na 300px */
  object-fit: cover;        /* Zajistí, že fotky budou mít správný poměr */
  image-rendering: crisp-edges; /* Pomůže s ostrostí obrázků */
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Jemný stín pro efekt */
  margin: 10px;             /* Vzdálenost mezi fotkami */
}

/* Specifické styly pro fotky na stránce "O mně" */
.gallery img {
  width: 30%;               /* Zmenšení fotky na 30 % šířky */
  height: auto;             /* Zachování poměru výšky */
  border-radius: 8px;       /* Zaoblení rohů fotky */
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Jemný stín pro efekt */
  display: block;           /* Zajistí, že fotka bude bloková a zarovnaná na střed */
  margin: 0 auto;           /* Středování fotky */
}

/* Tlačítka pro návrat */
.back-button {
  display: inline-block;
  margin-top: 20px; /* Zde přidáváš mezeru nad tlačítko */
  margin-bottom: 40px; /* A zde přidáváš mezeru pod tlačítko, aby bylo dál od spodního okraje */
  padding: 10px 20px;
  background-color: #007BFF;
  color: white;
  text-decoration: none;
  border-radius: 5px;
}