Górnośląsko-Zagłębiowska Metropolia<style type="text/css">/* CSS - nasza "farba na ścianach" i główny zarządca układu */
.gzm-wrapper {
font-family: sans-serif;
max-width: 900px;
/* Zamiast <p> </p> dajemy po prostu dolny margines 40px */
margin: 0 auto 40px auto;
color: #333;
}
.gzm-title {
color: #f20000; /* Główna czerwień miasta Chorzów */
font-size: 1.5rem;
margin-top: 0;
margin-bottom: 25px;
border-bottom: 2px solid #f20000;
padding-bottom: 10px;
}
/* Siatka funduszy - koniec z twardymi spacjami! */
.gzm-grid {
display: grid;
/* RWD: Przeglądarka sama ułoży kafelki. Min. 200px szerokości, maks. tyle, ile wejdzie */
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 20px;
list-style: none; /* Usuwamy punkty z listy */
padding: 0;
margin: 0;
}
/* Wygląd pojedynczego kafelka z logo */
.gzm-card {
display: flex;
justify-content: center;
align-items: center;
background-color: #ffffff;
border: 1px solid #eaeaea;
border-radius: 8px;
padding: 20px;
min-height: 160px;
/* Płynna animacja najechania myszką */
transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
/* Efekt najechania (Hover) - podnosi kafelek i barwi ramkę na czerwono */
.gzm-card:hover {
transform: translateY(-4px);
box-shadow: 0 8px 16px rgba(0,0,0,0.06);
border-color: #f20000;
}
/* Responsywne logotypy wewnątrz kafelków */
.gzm-img {
max-width: 100%;
max-height: 120px;
object-fit: contain; /* Pilnuje, by logo nie zostało rozciągnięte */
}
</style>
<!-- HTML - Nasz poprawny, czysty szkielet -->
<div class="gzm-wrapper"><!-- Dodany tytuł sekcji dla lepszej użyteczności (UX) -->
<h3 class="gzm-title">Projekty wspierane przez Górnośląsko-Zagłębiowską Metropolię</h3>
<ul class="gzm-grid">
<li><a class="gzm-card" href="https://mieszkancy.chorzow.eu/article/fundusz-odpornosci-gzm"><!-- Zwróć uwagę na opisowy atrybut alt="..." --> <img alt="Logo: Fundusz Odporności GZM" class="gzm-img" src="https://chorzow.eu/download/cmVzb3VyY2VzL2ZpbGVzLzk4L0Z1bmR1c3pfT2Rwb3Jub3NfX2NpX0daTV82N2Y0ZDBjZGEzZjc0LnBuZw%3D%3D" /> </a></li>
<li><a class="gzm-card" href="http://mieszkancy.chorzow.eu/article/wsparcie-finansowe-gzm-na-walke-z-epidemia"><img alt="Logo: Wsparcie finansowe GZM na walkę z epidemią" class="gzm-img" src="https://chorzow.eu/download/cmVzb3VyY2VzL2ZpbGVzLzk4LzFfNmEwMWQ4MDM2YzA0Yi5wbmc%3D" /> </a></li>
<li><a class="gzm-card" href="http://mieszkancy.chorzow.eu/article/metropolitalny-fundusz-solidarnosci"><img alt="Logo: Metropolitalny Fundusz Solidarności" class="gzm-img" src="https://chorzow.eu/download/cmVzb3VyY2VzL2ZpbGVzLzk4LzJfNmEwMWQ4OTFhMzRlOC5wbmc%3D" /> </a></li>
<li><a class="gzm-card" href="https://mieszkancy.chorzow.eu/article/program-dzialan-na-rzecz-ograniczenia-niskiej-emisji-gzm-2020"><img alt="Logo: Program działań na rzecz ograniczenia niskiej emisji GZM" class="gzm-img" src="https://chorzow.eu/download/cmVzb3VyY2VzL2ZpbGVzLzk4LzNfNmEwMWQ5MTBiNjM1My5wbmc%3D" /> </a></li>
</ul>
</div>2026-06-03 15:02:162026-06-03 15:02:16