kristijan-dev #17

Merged
popovskik merged 6 commits from kristijan-dev into develop 2026-08-08 10:32:25 +00:00
31 changed files with 159 additions and 51 deletions
Showing only changes of commit a15e9f20f1 - Show all commits

View File

@ -194,16 +194,22 @@
<!-- Auto-rotating team hero -->
<section class="about-hero" aria-label="MSOS team moments">
<div class="about-hero-slide is-active" style="background-image:url('../../images/about-hero-01.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-12.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-02.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-03.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-13.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-04.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-05.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-14.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-06.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-07.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-15.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-08.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-09.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-16.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-10.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-11.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-17.webp')"></div>
<div class="about-hero-overlay"></div>
<div class="about-hero-content">
<span class="about-hero-eyebrow">About us</span>
@ -356,7 +362,7 @@
</section>
<!-- FAQ Call to Action Section -->
<!-- Appreciation to members & friends (photos are placeholders; names pending full list) -->
<!-- Appreciation to members & friends (names pending full list) -->
<section class="appreciation-section">
<div class="appr-intro">
<h2>Our members & friends</h2>
@ -365,25 +371,55 @@
<!-- Scrolling photo carousel (Apple-style focal zoom) -->
<div class="appr-marquee" aria-label="MSOS members and friends">
<div class="appr-track">
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-img-1.webp" alt="MSOS members at an event"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-1.webp" alt="MSOS members at an event"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/msnl-1.webp" alt="Macedonian Student Night in Ljubljana"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-image2.webp" alt="MSOS members at an event"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-5.webp" alt="MSOS members at an event"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/msnl-3.webp" alt="Macedonian Student Night in Ljubljana"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-img-7.webp" alt="MSOS members at an event"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-8.webp" alt="MSOS members at an event"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-01.webp" width="900" height="675" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-02.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-05.webp" width="690" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-06.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-07.webp" width="675" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-08.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-09.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-03.webp" width="675" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-10.webp" width="600" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-11.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-12.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-13.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-04.webp" width="900" height="675" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-14.webp" width="900" height="675" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-15.webp" width="675" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-16.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-17.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-18.webp" width="675" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-19.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-20.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-21.webp" width="675" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-22.webp" width="900" height="600" alt="MSOS members and friends"></div>
<!-- duplicate set for a seamless infinite loop (aria-hidden) -->
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-img-1.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-1.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/msnl-1.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-image2.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-5.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/msnl-3.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-img-7.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-8.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-01.webp" width="900" height="675" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-02.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-05.webp" width="690" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-06.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-07.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-08.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-09.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-03.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-10.webp" width="600" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-11.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-12.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-13.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-04.webp" width="900" height="675" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-14.webp" width="900" height="675" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-15.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-16.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-17.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-18.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-19.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-20.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-21.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-22.webp" width="900" height="600" alt=""></div>
</div>
</div>
</div>
</div>
<div class="appreciation-names">
<span class="appr-name">Kristijan P.</span>
<span class="appr-name">Lea J.</span>

BIN
images/about-hero-12.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 300 KiB

BIN
images/about-hero-13.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 155 KiB

BIN
images/about-hero-14.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 217 KiB

BIN
images/about-hero-15.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 249 KiB

BIN
images/about-hero-16.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 177 KiB

BIN
images/about-hero-17.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 91 KiB

BIN
images/members-01.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 93 KiB

BIN
images/members-02.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 82 KiB

BIN
images/members-03.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

BIN
images/members-04.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB

BIN
images/members-05.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 77 KiB

BIN
images/members-06.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

BIN
images/members-07.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

BIN
images/members-08.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 68 KiB

BIN
images/members-09.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 69 KiB

BIN
images/members-10.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 44 KiB

BIN
images/members-11.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

BIN
images/members-12.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

BIN
images/members-13.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 47 KiB

BIN
images/members-14.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

BIN
images/members-15.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 97 KiB

BIN
images/members-16.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

BIN
images/members-17.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

BIN
images/members-18.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 99 KiB

BIN
images/members-19.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 85 KiB

BIN
images/members-20.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

BIN
images/members-21.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

BIN
images/members-22.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

View File

@ -194,16 +194,22 @@
<!-- Auto-rotating team hero -->
<section class="about-hero" aria-label="Моменти од тимот на МСОС">
<div class="about-hero-slide is-active" style="background-image:url('../../images/about-hero-01.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-12.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-02.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-03.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-13.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-04.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-05.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-14.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-06.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-07.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-15.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-08.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-09.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-16.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-10.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-11.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-17.webp')"></div>
<div class="about-hero-overlay"></div>
<div class="about-hero-content">
<span class="about-hero-eyebrow">За нас</span>
@ -356,7 +362,7 @@
</section>
<!-- FAQ Call to Action Section -->
<!-- Appreciation to members & friends (photos are placeholders; names pending full list) -->
<!-- Appreciation to members & friends (names pending full list) -->
<section class="appreciation-section">
<div class="appr-intro">
<h2>Нашите членови и пријатели</h2>
@ -365,25 +371,55 @@
<!-- Scrolling photo carousel (Apple-style focal zoom) -->
<div class="appr-marquee" aria-label="Членови и пријатели на МСОС">
<div class="appr-track">
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-img-1.webp" alt="Членови на МСОС на настан"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-1.webp" alt="Членови на МСОС на настан"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/msnl-1.webp" alt="Македонска студентска вечер во Љубљана"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-image2.webp" alt="Членови на МСОС на настан"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-5.webp" alt="Членови на МСОС на настан"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/msnl-3.webp" alt="Македонска студентска вечер во Љубљана"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-img-7.webp" alt="Членови на МСОС на настан"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-8.webp" alt="Членови на МСОС на настан"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-01.webp" width="900" height="675" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-02.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-05.webp" width="690" height="900" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-06.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-07.webp" width="675" height="900" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-08.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-09.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-03.webp" width="675" height="900" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-10.webp" width="600" height="900" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-11.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-12.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-13.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-04.webp" width="900" height="675" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-14.webp" width="900" height="675" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-15.webp" width="675" height="900" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-16.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-17.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-18.webp" width="675" height="900" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-19.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-20.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-21.webp" width="675" height="900" alt="Членови и пријатели на МСОС"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-22.webp" width="900" height="600" alt="Членови и пријатели на МСОС"></div>
<!-- duplicate set for a seamless infinite loop (aria-hidden) -->
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-img-1.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-1.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/msnl-1.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-image2.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-5.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/msnl-3.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-img-7.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-8.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-01.webp" width="900" height="675" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-02.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-05.webp" width="690" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-06.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-07.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-08.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-09.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-03.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-10.webp" width="600" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-11.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-12.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-13.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-04.webp" width="900" height="675" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-14.webp" width="900" height="675" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-15.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-16.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-17.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-18.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-19.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-20.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-21.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-22.webp" width="900" height="600" alt=""></div>
</div>
</div>
</div>
</div>
<div class="appreciation-names">
<span class="appr-name">Kristijan P.</span>
<span class="appr-name">Lea J.</span>

View File

@ -194,16 +194,22 @@
<!-- Auto-rotating team hero -->
<section class="about-hero" aria-label="Trenutki ekipe MSOS">
<div class="about-hero-slide is-active" style="background-image:url('../../images/about-hero-01.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-12.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-02.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-03.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-13.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-04.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-05.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-14.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-06.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-07.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-15.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-08.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-09.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-16.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-10.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-11.webp')"></div>
<div class="about-hero-slide" style="background-image:url('../../images/about-hero-17.webp')"></div>
<div class="about-hero-overlay"></div>
<div class="about-hero-content">
<span class="about-hero-eyebrow">O nas</span>
@ -356,7 +362,7 @@
</section>
<!-- FAQ Call to Action Section -->
<!-- Appreciation to members & friends (photos are placeholders; names pending full list) -->
<!-- Appreciation to members & friends (names pending full list) -->
<section class="appreciation-section">
<div class="appr-intro">
<h2>Naši člani in prijatelji</h2>
@ -365,25 +371,55 @@
<!-- Scrolling photo carousel (Apple-style focal zoom) -->
<div class="appr-marquee" aria-label="Člani in prijatelji MSOS">
<div class="appr-track">
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-img-1.webp" alt="Člani MSOS na dogodku"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-1.webp" alt="Člani MSOS na dogodku"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/msnl-1.webp" alt="Makedonski študentski večer v Ljubljani"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-image2.webp" alt="Člani MSOS na dogodku"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-5.webp" alt="Člani MSOS na dogodku"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/msnl-3.webp" alt="Makedonski študentski večer v Ljubljani"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-img-7.webp" alt="Člani MSOS na dogodku"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-8.webp" alt="Člani MSOS na dogodku"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-01.webp" width="900" height="675" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-02.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-05.webp" width="690" height="900" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-06.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-07.webp" width="675" height="900" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-08.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-09.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-03.webp" width="675" height="900" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-10.webp" width="600" height="900" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-11.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-12.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-13.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-04.webp" width="900" height="675" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-14.webp" width="900" height="675" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-15.webp" width="675" height="900" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-16.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-17.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-18.webp" width="675" height="900" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-19.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-20.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-21.webp" width="675" height="900" alt="Člani in prijatelji MSOS"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-22.webp" width="900" height="600" alt="Člani in prijatelji MSOS"></div>
<!-- duplicate set for a seamless infinite loop (aria-hidden) -->
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-img-1.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-1.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/msnl-1.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-image2.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-5.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/msnl-3.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-img-7.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-8.webp" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-01.webp" width="900" height="675" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-02.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-05.webp" width="690" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-06.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-07.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-08.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-09.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-03.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-10.webp" width="600" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-11.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-12.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-13.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-04.webp" width="900" height="675" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-14.webp" width="900" height="675" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-15.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-16.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-17.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-18.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-19.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-20.webp" width="900" height="600" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-21.webp" width="675" height="900" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-22.webp" width="900" height="600" alt=""></div>
</div>
</div>
</div>
</div>
<div class="appreciation-names">
<span class="appr-name">Kristijan P.</span>
<span class="appr-name">Lea J.</span>