msos/en/projects/index.html

392 lines
23 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Projects - Macedonian Student Organisation in Slovenia</title>
<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<!-- Font Awesome (for icons) -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- Link to the main CSS file -->
<link rel="stylesheet" href="../../css/main.css">
</head>
<body>
<!-- START_HEADER -->
<header class="dropdown-header-navigation">
<div class="container">
<!-- Logotip je zdaj samostojen element na levi strani -->
<a href="../../en/" class="logo-link">
<img src="../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
</a>
<!-- Nov ovoj za vse elemente na desni strani -->
<div class="header-right-wrapper">
<nav>
<ul class="navigation desktop-nav">
<li class="menu-item menu-item-has-children">
<a href="#">Who We Are</a>
<ul class="dropdown-menu">
<li><a href="../../en/timeline-and-milestones/">Timeline & Milestones</a></li>
<li><a href="../../en/about-us/">Our team</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">What We Do</a>
<ul class="dropdown-menu">
<li><a href="../../en/projects/">Events & Projects</a></li>
<li><a href="../../en/blog/">Blog</a></li>
<li><a href="#">Gallery</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">Get Involved</a>
<ul class="dropdown-menu">
<li><a href="#">Become a member</a></li>
<li><a href="#">Support MSOS</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">For Students</a>
<ul class="dropdown-menu">
<li><a href="../../en/student-welcome-guide/">Student Welcome Guide</a></li>
<li><a href="../../en/faq/">FAQs</a></li>
<li><a href="../../en/get-to-know-slovenia/">Get to know Slovenia</a></li>
<li><a href="../../en/get-to-know-macedonia/">Get to know Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="../../en/news/">News and Announcements</a></li>
<li><a href="#">Press releases</a></li>
</ul>
</li>
</ul>
</nav>
<div class="navigation-actions">
<button class="btn btn-secondary">Become a member</button>
<button class="btn btn-primary">Donate</button>
<div class="language-selector">
<div class="current-lang">
<i class="fas fa-globe"></i>
<span id="current-lang-code">EN</span>
<i class="fas fa-chevron-down"></i>
</div>
<div class="lang-dropdown">
<a href="#" data-lang="en"><span class="lang-flag lang-flag-gb" aria-hidden="true"></span><span class="lang-name">English</span></a>
<a href="#" data-lang="si"><span class="lang-flag lang-flag-si" aria-hidden="true"></span><span class="lang-name">Slovenščina</span></a>
<a href="#" data-lang="mk"><span class="lang-flag lang-flag-mk" aria-hidden="true"></span><span class="lang-name">Македонски</span></a>
</div>
</div>
</div>
</div>
<!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
<div class="mobile-menu-icon">
<i class="fas fa-bars"></i>
<i class="fas fa-times"></i>
</div>
</div>
</header>
<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
<div class="mobile-nav-panel">
<nav>
<ul class="navigation mobile-nav">
<li class="menu-item menu-item-has-children">
<a href="#">Who We Are</a>
<ul class="dropdown-menu">
<li><a href="../../en/timeline-and-milestones/">Timeline & Milestones</a></li>
<li><a href="../../en/about-us/">Our team</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">What We Do</a>
<ul class="dropdown-menu">
<li><a href="../../en/projects/">Events & Projects</a></li>
<li><a href="../../en/blog/">Blog</a></li>
<li><a href="#">Gallery</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">Get Involved</a>
<ul class="dropdown-menu">
<li><a href="#">Become a member</a></li>
<li><a href="#">Support MSOS</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">For Students</a>
<ul class="dropdown-menu">
<li><a href="../../en/student-welcome-guide/">Student Welcome Guide</a></li>
<li><a href="../../en/faq/">FAQs</a></li>
<li><a href="../../en/get-to-know-slovenia/">Get to know Slovenia</a></li>
<li><a href="../../en/get-to-know-macedonia/">Get to know Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="../../en/news/">News and Announcements</a></li>
<li><a href="#">Press releases</a></li>
</ul>
</li>
</ul>
</nav>
<div class="navigation-actions">
<button class="btn btn-secondary">Become a member</button>
<button class="btn btn-primary">Donate</button>
<div class="language-selector">
<button class="current-lang" id="mobile-lang-trigger">
<i class="fas fa-globe"></i>
<span>EN</span>
<i class="fas fa-chevron-right"></i>
</button>
</div>
</div>
</div>
<!-- Modalno okno za izbiro jezika (ostaja enako) -->
<div id="language-modal-overlay">
<div class="language-modal-content">
<div class="language-modal-header">
<h3>Select Language</h3>
<button id="language-modal-close" aria-label="Close language selection">&times;</button>
</div>
<div class="language-modal-body">
<a href="#" data-lang="en"><span class="lang-flag lang-flag-gb" aria-hidden="true"></span><span class="lang-name">English</span></a>
<a href="#" data-lang="si"><span class="lang-flag lang-flag-si" aria-hidden="true"></span><span class="lang-name">Slovenščina</span></a>
<a href="#" data-lang="mk"><span class="lang-flag lang-flag-mk" aria-hidden="true"></span><span class="lang-name">Македонски</span></a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="page-content">
<!-- Page Header Section -->
<section class="page-header-section">
<div class="container text-center">
<span class="page-subtitle">Our projects</span>
<h1>Events & Projects</h1>
<p class="page-description">Subscribe to learn about new product features, the latest in technology, solutions, and updates.</p>
<form class="subscribe-form">
<input type="email" placeholder="Enter your email">
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="../../en/privacy-policy/">privacy policy</a></p>
</div>
</section>
<!-- Category Filter -->
<section class="filter-section">
<nav class="filter-nav" aria-label="Project categories">
<button type="button" class="filter-pill active" data-filter="all" aria-pressed="true">All</button>
<button type="button" class="filter-pill" data-filter="events" aria-pressed="false">Events</button>
<button type="button" class="filter-pill" data-filter="student-life" aria-pressed="false">Student Life</button>
<button type="button" class="filter-pill" data-filter="projects" aria-pressed="false">Projects</button>
<button type="button" class="filter-pill" data-filter="webinars" aria-pressed="false">Webinars</button>
</nav>
<div class="filter-subnav" data-parent="events" hidden>
<button type="button" class="filter-chip active" data-subfilter="all">All events</button>
<button type="button" class="filter-chip" data-subfilter="sports">Sports</button>
<button type="button" class="filter-chip" data-subfilter="cultural">Cultural</button>
<button type="button" class="filter-chip" data-subfilter="entertainment">Entertainment</button>
<button type="button" class="filter-chip" data-subfilter="educational">Educational</button>
</div>
</section>
<!-- All Projects Section -->
<section class="all-posts-section">
<div class="container column-layout">
<h2>All our projects</h2>
<div class="posts-grid">
<!-- Project: Humanitarian Sports Tournament in Maribor -->
<article class="post-card" data-category="events" data-subcategory="sports">
<a href="humanitarian-tournament-in-maribor/" class="post-link">
<img src="../../images/maribor-tournament-1.png" alt="Humanitarian Sports Tournament in Maribor" class="post-image">
<div class="post-content">
<p class="post-meta">MSOS Team • 5 Apr 2025 • Event</p>
<h3 class="post-title">Humanitarian Sports Tournament in Maribor</h3>
<p class="post-excerpt">Over 200 students played with heart in Maribor, raising 1,010 € for families hit by the Kočani tragedy.</p>
</div>
</a>
</article>
<!-- Project: In Memory of the Kochani Victims -->
<article class="post-card" data-category="events">
<a href="in-memory-of-the-kochani-victims/" class="post-link">
<img src="../../images/kochani-1.png" alt="In Memory of the Kochani Victims" class="post-image">
<div class="post-content">
<p class="post-meta">MSOS Team • 21 Mar 2025 • Event</p>
<h3 class="post-title">In Memory of the Kochani Victims</h3>
<p class="post-excerpt">More than 600 people gathered in Ljubljana to honor the victims of the Kochani fire.</p>
</div>
</a>
</article>
<!-- Project: Paint &amp; Wine at Sunset -->
<article class="post-card" data-category="events" data-subcategory="cultural">
<a href="paint-and-wine-at-sunset/" class="post-link">
<img src="../../images/paint-wine-1.jpg" alt="Paint &amp; Wine at Sunset" class="post-image">
<div class="post-content">
<p class="post-meta">MSOS Team • 8 Mar 2025 • Event</p>
<h3 class="post-title">Paint &amp; Wine at Sunset</h3>
<p class="post-excerpt">Paint, wine, and music brought students together in Gorizia for the first MSOS Nova Gorica event.</p>
</div>
</a>
</article>
<!-- Project: In Memory of Frosina Kulakova -->
<article class="post-card" data-category="events">
<a href="in-memory-of-frosina-kulakova/" class="post-link">
<img src="../../images/frosina-1.png" alt="In Memory of Frosina Kulakova" class="post-image">
<div class="post-content">
<p class="post-meta">MSOS Team • 8 Feb 2025 • Event</p>
<h3 class="post-title">In Memory of Frosina Kulakova</h3>
<p class="post-excerpt">Macedonian students in Ljubljana gathered in candlelight to honor Frosinas memory.</p>
</div>
</a>
</article>
<!-- Project: Watching Handball Together in Slovenia -->
<article class="post-card" data-category="events" data-subcategory="sports">
<a href="watching-handball-together-in-slovenia/" class="post-link">
<img src="../../images/handball-2025-1.png" alt="Watching Handball Together in Slovenia" class="post-image">
<div class="post-content">
<p class="post-meta">MSOS Team • 25 Jan 2025 • Event</p>
<h3 class="post-title">Watching Handball Together in Slovenia</h3>
<p class="post-excerpt">From Ljubljana to Maribor, students filled cafés with flags, chants, and laughter for the national team.</p>
</div>
</a>
</article>
<!-- Project: Meet Student Slovenia 2024 -->
<article class="post-card" data-category="events" data-subcategory="educational">
<a href="meet-student-slovenia-2024/" class="post-link">
<img src="../../images/event4-img-1.webp" alt="A group of students at the 'Meet Student Slovenia 2024' event" class="post-image">
<div class="post-content">
<p class="post-meta">MSOS Team • 16 Sep 2024 • Event</p>
<h3 class="post-title">Meet Student Slovenia 2024</h3>
<p class="post-excerpt">When student stories turn into the first step towards a new home.</p>
</div>
</a>
</article>
<!-- Project: Morning Coffee in front of CTK, 2024 -->
<article class="post-card" data-category="student-life">
<a href="morning-coffee-in-front-of-ctk/" class="post-link">
<img src="../../images/event4-image1.webp" alt="Students enjoying coffee and burek in front of CTK library" class="post-image">
<div class="post-content">
<p class="post-meta">MSOS Team • 8 Jun 2024 • Student Life</p>
<h3 class="post-title">Morning Coffee in front of CTK, 2024</h3>
<p class="post-excerpt">When exams somehow become easier with Saturday morning coffee, burek, and good company!</p>
</div>
</a>
</article>
<!-- Project: Meet Student Slovenia 2023 -->
<article class="post-card" data-category="events" data-subcategory="educational">
<a href="meet-student-slovenia-2023/" class="post-link">
<img src="../../images/event3-photo-1.webp" alt="Panel discussion at the 'Meet Student Slovenia 2023' event" class="post-image">
<div class="post-content">
<p class="post-meta">MSOS Team • 18 Sep 2023 • Event</p>
<h3 class="post-title">Meet Student Slovenia 2023</h3>
<p class="post-excerpt">Through honest first-hand stories, future students received support for their first step towards their new home.</p>
</div>
</a>
</article>
<!-- Project: Macedonian Student Night -->
<article class="post-card" data-category="events" data-subcategory="entertainment">
<a href="macedonian-student-night-in-ljubljana/" class="post-link">
<img src="../../images/msnl-1.webp" alt="Atmosphere from the Macedonian Student Night in Ljubljana" class="post-image">
<div class="post-content">
<p class="post-meta">Kristijan Popovski • 8 Oct 2022 • Event</p>
<h3 class="post-title">Macedonian Student Night in Ljubljana</h3>
<p class="post-excerpt">From an idea to a party with 500 students, that's how our story began!</p>
</div>
</a>
</article>
</div>
<p class="filter-empty" hidden>No projects match this filter yet.</p>
<!-- Pagination -->
<nav class="pagination">
<a href="#" class="pagination-arrow"><i class="fas fa-arrow-left"></i> Previous</a>
<div class="pagination-numbers">
<a href="#" class="page-number active">1</a>
<a href="#" class="page-number">2</a>
<a href="#" class="page-number">3</a>
<span class="page-dots">...</span>
<a href="#" class="page-number">8</a>
<a href="#" class="page-number">9</a>
<a href="#" class="page-number">10</a>
</div>
<a href="#" class="pagination-arrow">Next <i class="fas fa-arrow-right"></i></a>
</nav>
</div>
</section>
</main>
<!-- START_FOOTER -->
<footer>
<div class="footer-container">
<div class="footer-main">
<div class="footer-info">
<div class="footer-logo">
<img src="../../images/13-whitelogo.png" alt="Macedonian Student Organisation in Slovenia Logo">
</div>
<p class="footer-legal-name">Društvo Makedonska Študentska Organizacija v Sloveniji za študentsko podporo in kulturno sodelovanje</p>
<p>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
<a href="mailto:info@msosorg.com">info@msosorg.com</a>
</p>
<div class="social-icons">
<a href="https://www.facebook.com/msos.org" aria-label="Facebook" target="_blank" rel="noopener"><i class="fab fa-facebook-f"></i></a>
<a href="https://www.instagram.com/msosorg_com" aria-label="Instagram" target="_blank" rel="noopener"><i class="fab fa-instagram"></i></a>
<a href="https://www.linkedin.com/company/msos-org" aria-label="LinkedIn" target="_blank" rel="noopener"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.youtube.com/@msosorg" aria-label="YouTube" target="_blank" rel="noopener"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>Student guide</h4>
<a href="../../en/student-welcome-guide/">Student welcome guide</a>
<a href="../../en/student-welcome-guide/complete-student-journey/">The whole journey</a>
<a href="../../en/student-welcome-guide/application-deadlines/">Application deadlines</a>
<a href="../../en/student-welcome-guide/evs-application-guide/">Apply through eVŠ</a>
<a href="../../en/student-welcome-guide/student-residence-permit/">Residence permit</a>
<a href="../../en/student-welcome-guide/student-accommodation/">Accommodation</a>
</div>
<div class="links-column">
<h4>Explore</h4>
<a href="../../en/get-to-know-slovenia/">Get to know Slovenia</a>
<a href="../../en/get-to-know-macedonia/">Get to know Macedonia</a>
<a href="../../en/projects/">Projects and events</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="../../en/about-us/">About us</a>
<a href="../../en/timeline-and-milestones/">Timeline and milestones</a>
<a href="mailto:info@msosorg.com">Contact us</a>
<a href="../../en/privacy-policy/">Privacy policy</a>
<a href="../../en/cookie-policy/">Cookie policy</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© 2026 MSOS. All rights reserved.</p>
<div class="legal-links">
<a href="../../en/privacy-policy/">Privacy policy</a>
<a href="../../en/cookie-policy/">Cookie policy</a>
</div>
</div>
</div>
<script src="../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>