Compare commits

...

23 Commits

Author SHA1 Message Date
Mark Poljanšek d972e45c2f Posodobljeni članki
Deploy to Production on Develop Push / deploy (push) Successful in 1m22s Details
2025-09-09 17:49:31 +02:00
Mark Poljanšek d603ebf585 Popravki za herosliko
Deploy to Production on Develop Push / deploy (push) Successful in 1m19s Details
2025-09-09 14:26:42 +02:00
Mark Poljanšek d9ed2a449f Popravki za timeline
Deploy to Production on Develop Push / deploy (push) Successful in 1m17s Details
2025-09-09 14:21:55 +02:00
Mark Poljanšek eb3b804dbc Popravki za homepage
Deploy to Production on Develop Push / deploy (push) Successful in 1m36s Details
2025-09-09 13:25:10 +02:00
Mark Poljanšek 28c097a959 Posodobljeni meniji pri clankih
Deploy to Production on Develop Push / deploy (push) Successful in 1m15s Details
2025-09-09 00:08:51 +02:00
Mark Poljanšek 90055985fd Homepage update
Deploy to Production on Develop Push / deploy (push) Successful in 1m43s Details
2025-09-08 22:52:15 +02:00
Mark Poljanšek 32e3a274a2 Moje lokalne spremembe 2025-09-07 17:10:38 +02:00
Mark Poljanšek 8024c67fcf Posodobitov linkov v meniju
Deploy to Production on Develop Push / deploy (push) Successful in 1m23s Details
2025-09-05 12:44:45 +02:00
Mark Poljanšek 0346b10f6e popravki
Deploy to Production on Develop Push / deploy (push) Successful in 1m32s Details
2025-09-04 23:46:04 +02:00
Mark Poljanšek 66c4631769 Posodobljen about us
Deploy to Production on Develop Push / deploy (push) Successful in 1m33s Details
2025-09-04 23:34:11 +02:00
Mark Poljanšek 37b72526d8 Posodobljen mobilni meni
Deploy to Production on Develop Push / deploy (push) Successful in 1m7s Details
2025-09-04 20:43:28 +02:00
Mark Poljanšek c1094898b7 Popravljen mobilni meni
Deploy to Production on Develop Push / deploy (push) Successful in 59s Details
2025-09-04 16:14:35 +02:00
Mark Poljanšek 6ed8073b76 Popravljen desktop meni
Deploy to Production on Develop Push / deploy (push) Successful in 1m15s Details
2025-09-04 14:30:10 +02:00
Mark Poljanšek 544791f37e Dodajanje about us in timeline
Deploy to Production on Develop Push / deploy (push) Successful in 1m13s Details
2025-09-02 15:54:18 +02:00
Mark Poljanšek 0b5d53abb9 posodobitve headerjev in optimizacija slik
Deploy to Production on Develop Push / deploy (push) Successful in 1m7s Details
2025-08-25 16:16:29 +02:00
Mark Poljanšek 4e2eda277f 2 nova članka
Deploy to Production on Develop Push / deploy (push) Successful in 1m11s Details
2025-08-25 15:43:46 +02:00
Mark Poljanšek 13622695ad test za actions
Deploy to Production on Develop Push / deploy (push) Successful in 12s Details
2025-08-21 12:22:10 +02:00
Mark Poljanšek ef6c168e92 popravljen workflow
Deploy to Production on Develop Push / deploy (push) Successful in 11s Details
2025-08-21 12:13:17 +02:00
Mark Poljanšek 79d29d2824 popravljen workflow
Deploy to Production on Develop Push / deploy (push) Failing after 39s Details
2025-08-21 12:06:24 +02:00
Mark Poljanšek 09bf439765 popravljen workflow
Deploy to Production on Develop Push / deploy (push) Failing after 8s Details
2025-08-21 11:56:32 +02:00
Mark Poljanšek 5a7740c729 napisan workflow
Deploy to Production on Develop Push / deploy (push) Failing after 41s Details
2025-08-21 11:51:18 +02:00
Mark Poljanšek 47d608deb0 Sprememba, da lahko zazenem actions 2025-08-21 11:49:28 +02:00
Mark Poljanšek 79150b21d2 Prvotna verzija spletne strani 2025-08-21 11:06:11 +02:00
238 changed files with 45510 additions and 0 deletions

View File

@ -0,0 +1,28 @@
name: Deploy to Production on Develop Push
on:
push:
branches:
- develop
jobs:
deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v4
- name: Deploy to Server via rsync
run: |
mkdir -p ~/.ssh
echo "${{ secrets.SSH_PRIVATE_KEY }}" > ~/.ssh/id_rsa
chmod 600 ~/.ssh/id_rsa
rsync -avz --delete \
--exclude=".git/" \
--exclude=".gitea/" \
--exclude=".gitignore" \
-e "ssh -p ${{ secrets.SSH_PORT }} -i ~/.ssh/id_rsa -o StrictHostKeyChecking=no" \
./ \
${{ secrets.SSH_USER }}@${{ secrets.SSH_HOST }}:${{ secrets.TARGET_DIR }}

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
.venv/

6
.htaccess Normal file
View File

@ -0,0 +1,6 @@
RewriteEngine on
RewriteCond %{HTTP_HOST} ^msos\.spletnimojster\.si$ [OR]
RewriteCond %{HTTP_HOST} ^www\.msos\.spletnimojster\.si$
RewriteRule ^/?$ "https\:\/\/msos\.spletnimojster\.si\/en\/" [R=301,L]

View File

@ -0,0 +1 @@
msos spletna stran

BIN
apple-touch-icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

22739
code_export.txt Normal file

File diff suppressed because it is too large Load Diff

BIN
css/.DS_Store vendored Normal file

Binary file not shown.

77
css/base/_base.css Normal file
View File

@ -0,0 +1,77 @@
/* ==========================================================================
Base Styles
========================================================================== */
/**
* 1. Temeljni stili za celotno stran (box-sizing, osnovna pisava, barve).
* 2. Definicija glavnega `.container` razreda za omejitev širine vsebine.
* 3. Pravilo za preprečevanje drsenja strani, ko je mobilni meni odprt.
*/
/* 1. Temeljni stili */
/* NOVO: Globalno pravilo za box-sizing. To je ključno za preprečevanje
težav s postavitvijo in horizontalnim drsenjem. Vsem elementom naroči,
naj padding in border vključijo v svojo končno širino. */
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
html {
/*
* POMEMBNO: Ta selektor naj ostane brez `overflow` pravil.
* `overflow-x: hidden` na `<html>` ali `<body>` elementu preprečuje
* pravilno delovanje `position: sticky`, ki ga uporablja stranska
* vrstica v člankih.
*/
}
body {
font-family: 'Inter', sans-serif;
margin: 0;
background-color: #FFFFFF;
color: #101828;
/* `overflow-x: hidden;` je bil odstranjen, da omogoči pravilno delovanje `position: sticky`. */
}
/* Pravilo za preprečevanje drsenja, ko je mobilni meni odprt. To je pravilno in ostane. */
html.nav-open, html.nav-open body {
overflow: hidden;
}
/* 2. Glavni container */
.container {
max-width: 1280px; /* Uporabi max-width namesto fiksne širine za boljšo odzivnost. */
width: 100%; /* Zagotovi, da vsebnik zavzame razpoložljivo širino do svoje maksimalne meje. */
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 32px;
/* box-sizing: border-box; -- to pravilo je zdaj globalno in ni več potrebno tukaj */
}
/* ==========================================================================
Mobile Base Styles
========================================================================== */
@media (max-width: 768px) {
body {
/* Odmik na vrhu telesa strani zaradi fiksne glave na mobilnih napravah.
Ta stil je tukaj, ker vpliva na celotno stran. */
padding-top: 60px;
}
.container {
width: 100%;
padding: 0 24px;
}
}

0
css/base/_typography.css Normal file
View File

123
css/components/_buttons.css Normal file
View File

@ -0,0 +1,123 @@
/* ==========================================================================
Buttons Styles
========================================================================== */
/**
* Ta datoteka vsebuje stile za vse ponovno uporabljive gumbe na spletni strani.
*
* 1. Osnovni stil za gumbe (.btn)
* 2. Različice gumbov (.btn-primary, .btn-primary-orange, .btn-secondary)
* 3. Gumbi z ikonami (.social-icon-btn)
* 4. Posebni gumbi (.play-button)
* 5. Stili za gumbe na mobilnih napravah
*/
/* 1. Osnovni stil za gumbe */
.btn {
padding: 10px 18px;
border-radius: 8px;
font-weight: 600;
font-size: 16px;
line-height: 24px;
cursor: pointer;
border: 1px solid transparent;
box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
text-decoration: none;
display: inline-block;
text-align: center;
white-space: nowrap; /* KLJUČNA SPREMEMBA: Prepreči prelamljanje besedila */
}
/* 2. Različice gumbov */
.btn-primary {
background-color: #2D738C;
color: #FFFFFF;
border-color: #2D738C;
}
.btn-primary-orange {
background: #FA7850;
color: #FFFFFF;
padding: 16px 28px;
font-size: 18px;
line-height: 28px;
}
.btn-secondary {
background-color: #FFFFFF;
color: #344054;
border: 1px solid #D0D5DD;
}
/* 3. Gumbi z ikonami */
.social-icon-btn {
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
border: 1px solid #D0D5DD;
border-radius: 8px;
box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
color: #98A2B3;
font-size: 18px;
text-decoration: none;
}
/* 4. Posebni gumbi */
.play-button {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 80px;
height: 80px;
background: rgba(255, 255, 255, 0.56);
border-radius: 50%;
border: none;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
}
.play-button::after {
content: '';
width: 0;
height: 0;
border-left: 24px solid white;
border-top: 14px solid transparent;
border-bottom: 14px solid transparent;
margin-left: 5px;
}
/* ==========================================================================
Mobile Buttons Styles
========================================================================== */
@media (max-width: 768px) {
.btn-primary-orange {
width: auto;
padding: 16px 28px;
border-radius: 12px;
font-size: 16px;
}
.play-button {
width: 42px;
height: 42px;
}
.play-button::after {
border-left-width: 14px;
border-top-width: 8px;
border-bottom-width: 8px;
}
}

179
css/components/_cards.css Normal file
View File

@ -0,0 +1,179 @@
/* ==========================================================================
Cards Styles
========================================================================== */
/**
* Ta datoteka vsebuje stile za vse ponovno uporabljive komponente v obliki kartic.
*
* 1. Kartice z novicami (.news-card)
* 2. Kartice s pričevanji (.testimonial-card)
* 3. Kartice s projekti/objavami (.post-card)
* 4. Stili za kartice na mobilnih napravah
*/
/* 1. Kartice z novicami (.news-card) */
.news-card {
width: 405.33px;
background: transparent;
text-align: left;
}
.news-card img {
width: 100%;
height: 240px;
object-fit: cover;
border-radius: 8px;
margin-bottom: 32px;
}
.news-card .card-content {
color: #FFFFFF;
}
.news-card .author {
font-size: 14px;
font-weight: 600;
margin-bottom: 12px;
}
.news-card h3 {
font-size: 24px;
font-weight: 600;
line-height: 32px;
margin-bottom: 12px;
}
.news-card p {
font-size: 16px;
line-height: 24px;
}
/* 2. Kartice s pričevanji (.testimonial-card) */
.testimonial-card {
padding: 24px 24px 40px;
border: 1px solid #D0D5DD;
border-radius: 16px;
}
.testimonial-column .testimonial-card:nth-child(even) {
background: #F9FAFB;
}
.testimonial-card h3 {
font-size: 24px;
font-weight: 600;
line-height: 1.2;
color: #000000;
margin-bottom: 24px;
}
.testimonial-card p {
font-size: 16px;
line-height: 1.2;
color: #646E82;
margin-bottom: 24px;
}
.author-info {
display: flex;
align-items: center;
gap: 16px;
}
.author-info img {
width: 48px;
height: 48px;
border-radius: 50%;
object-fit: cover;
}
.author-info h4 {
font-size: 18px;
font-weight: 600;
margin: 0 0 6px 0;
color: #000000;
}
.author-info p {
font-size: 16px;
margin: 0;
color: #2D738C;
}
/* Specifična pravila za barve znotraj pričevanj */
.testimonial-card:nth-child(3) .author-info h4,
.testimonial-card:nth-child(3) .author-info p {
color: #2D738C;
}
.testimonial-column:nth-child(1) .testimonial-card:nth-child(2) .author-info h4,
.testimonial-column:nth-child(2) .testimonial-card:nth-child(2) .author-info h4,
.testimonial-column:nth-child(1) .testimonial-card:nth-child(2) .author-info p,
.testimonial-column:nth-child(2) .testimonial-card:nth-child(2) .author-info p {
color: #646E82;
}
/* 3. Kartice s projekti/objavami (.post-card) */
.post-card {
display: flex;
flex-direction: column;
}
.post-link {
text-decoration: none;
color: inherit;
}
.post-image {
width: 100%;
height: 240px;
object-fit: cover;
border-radius: 8px;
margin-bottom: 32px;
}
.post-meta {
font-size: 14px;
font-weight: 600;
color: #FA7850;
margin: 0 0 12px;
}
.post-title {
font-size: 24px;
font-weight: 600;
line-height: 32px;
color: #101828;
margin: 0 0 12px;
}
.post-excerpt {
font-size: 16px;
line-height: 24px;
color: #667085;
margin: 0;
}
/* ==========================================================================
Mobile Cards Styles
========================================================================== */
@media (max-width: 768px) {
/* Kartice z novicami */
.news-card {
width: 100%;
max-width: 321px;
}
/* Kartice s pričevanji */
.testimonial-card {
flex: 0 0 291px;
scroll-snap-align: start;
margin-right: 24px;
}
}

177
css/layout/_footer.css Normal file
View File

@ -0,0 +1,177 @@
/* ==========================================================================
Footer Styles
========================================================================== */
/**
* Ta datoteka vsebuje stile za nogo (footer) spletne strani.
*
* 1. Glavni kontejner za nogo
* 2. Vsebina noge (informacije, logotip, socialne ikone)
* 3. Povezave v nogi
* 4. Spodnji del noge (copyright, pravne povezave)
* 5. Stili za nogo na mobilnih napravah
*/
/* 1. Glavni kontejner za nogo */
footer {
background: #2D738C;
color: #FFFFFF;
padding: 64px 0 88px;
}
.footer-container {
width: 1280px;
margin: 0 auto;
}
.footer-main {
display: flex;
justify-content: space-between;
margin-bottom: 64px;
}
/* 2. Vsebina noge (informacije, logotip, socialne ikone) */
.footer-info {
width: 302px;
}
.footer-logo {
margin-bottom: 48px;
}
.footer-logo img {
height: auto;
width: 200px;
object-fit: contain;
}
.footer-info p {
font-size: 16px;
line-height: 1.5;
margin-bottom: 24px;
}
.social-icons {
display: flex;
gap: 24px;
}
.social-icons a {
color: #FFFFFF;
font-size: 24px;
text-decoration: none;
}
/* 3. Povezave v nogi */
.footer-links {
display: flex;
gap: 32px;
}
.links-column {
width: 192px;
}
.links-column h4 {
font-size: 18px;
font-weight: 600;
margin: 0 0 24px 0;
}
.links-column a {
display: block;
color: #FFFFFF;
text-decoration: none;
font-size: 16px;
margin-bottom: 16px;
}
/* 4. Spodnji del noge (copyright, pravne povezave) */
footer hr {
border: 0;
border-top: 1px solid rgba(255, 255, 255, 0.5);
margin: 0 0 24px 0;
}
.footer-bottom {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 14px;
}
.legal-links {
display: flex;
gap: 24px;
}
.legal-links a {
color: #FFFFFF;
text-decoration: none;
}
/* ==========================================================================
Mobile Footer Styles
========================================================================== */
@media (max-width: 768px) {
footer {
padding: 0;
}
.footer-container {
width: 100%;
padding: 0 24px;
}
.footer-main {
flex-direction: column;
align-items: flex-start;
padding: 48px 0;
gap: 48px;
margin-bottom: 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}
.footer-info {
width: 100%;
}
.footer-logo img {
max-width: 161px;
height: auto;
}
.footer-links {
flex-direction: column;
gap: 40px;
width: 100%;
}
.links-column {
width: 100%;
}
footer hr {
display: none;
}
.footer-bottom {
flex-direction: column;
gap: 32px;
padding: 40px 0;
align-items: flex-start;
}
.legal-links {
flex-direction: column;
gap: 16px;
align-items: flex-start;
}
}

457
css/layout/_header.css Normal file
View File

@ -0,0 +1,457 @@
/* ==========================================================================
Header Styles
========================================================================== */
/**
* Ta datoteka vsebuje stile za glavo (header) spletne strani.
*
* 1. Glavni kontejner za glavo
* 2. Vsebina glave (logotip, navigacija) - POSODOBLJENO
* 3. Gumbi in akcije v glavi (vključno z izbiro jezika)
* 4. Stili za namizni "dropdown" meni
* 5. Stili za mobilno glavo in "accordion" meni
* 6. Stili za modalno okno za izbiro jezika na mobilnih napravah
*/
/* 1. Glavni kontejner za glavo */
.dropdown-header-navigation {
position: absolute;
width: 100%;
height: 80px;
background: #FFFFFF;
border-bottom: 1px solid #F2F4F7;
display: flex;
justify-content: center;
align-items: center;
z-index: 1000;
}
/* 2. Vsebina glave (logotip, navigacija) - POSODOBLJENO */
.logo-link .logo-img {
height: 32px;
width: auto;
display: block; /* Za zanesljivo obnašanje */
}
/* Nov ovoj za desno stran glave */
.header-right-wrapper {
display: flex;
align-items: center;
gap: 24px; /* Razmik med navigacijo in gumbi */
}
/* Osnovna struktura navigacije */
.navigation {
list-style: none;
margin: 0;
padding: 0;
display: flex;
align-items: center;
height: 100%;
width: 100%;
}
.navigation .menu-item {
position: relative;
height: 100%;
display: flex;
align-items: center;
}
/* Povezave v glavnem meniju */
.navigation > .menu-item > a {
text-decoration: none;
color: #667085;
font-weight: 600;
font-size: 14px;
padding: 0 16px; /* Prilagojen padding */
height: 100%;
display: flex;
align-items: center;
transition: color 0.2s ease-in-out;
white-space: nowrap;
}
.navigation > .menu-item > a:hover {
color: #101828;
}
/* Poudarjanje aktivne strani na namizju */
.navigation .menu-item.active-page > a {
color: #2D738C;
}
/* Puščica za podmeni */
.navigation .menu-item-has-children > a::after {
content: '\f078';
font-family: 'Font Awesome 6 Free';
font-weight: 900;
font-size: 12px;
transition: transform 0.3s ease-in-out;
margin-left: 8px;
}
/* 3. Gumbi in akcije v glavi */
.navigation-actions {
display: flex;
align-items: center;
gap: 12px;
flex-shrink: 0;
}
.language-selector {
position: relative;
cursor: pointer;
}
.current-lang {
display: flex;
align-items: center;
gap: 8px;
color: #646E82;
padding: 8px;
border-radius: 6px;
transition: background-color 0.2s ease-in-out;
}
.current-lang:hover { background-color: #F9FAFB; }
.current-lang span { font-weight: 600; }
.current-lang .fa-chevron-down { transition: transform 0.3s ease-in-out; }
.lang-dropdown {
display: block;
position: absolute;
top: calc(100% + 8px);
right: 0;
background-color: #FFFFFF;
border: 1px solid #EAECF0;
border-radius: 8px;
box-shadow: 0 8px 16px rgba(0,0,0,0.08);
padding: 8px;
z-index: 1001;
min-width: 180px;
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
}
.language-selector.active .lang-dropdown {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.language-selector.active .current-lang .fa-chevron-down { transform: rotate(180deg); }
.lang-dropdown a {
display: block;
padding: 10px 12px;
color: #344054;
text-decoration: none;
font-weight: 500;
font-size: 16px;
white-space: nowrap;
border-radius: 6px;
}
.lang-dropdown a:hover { background-color: #F9FAFB; }
/* 4. Stili za namizni "dropdown" meni */
.dropdown-menu {
position: absolute;
top: 100%;
left: 50%;
background-color: #FFFFFF;
border: 1px solid #EAECF0;
list-style: none;
margin: 8px 0 0 0;
padding: 8px;
min-width: 260px;
border-radius: 12px;
box-shadow: 0 12px 24px -4px rgba(16, 24, 40, 0.08);
z-index: 1000;
opacity: 0;
visibility: hidden;
transform: translateX(-50%) translateY(10px);
transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
}
.navigation .menu-item:hover > .dropdown-menu {
opacity: 1;
visibility: visible;
transform: translateX(-50%) translateY(0);
}
.navigation .menu-item:hover > a::after {
transform: rotate(180deg);
}
.dropdown-menu li { padding: 0; }
.dropdown-menu a {
display: block;
padding: 12px 16px;
color: #344054;
text-decoration: none;
font-weight: 500;
font-size: 16px;
border-radius: 6px;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
white-space: nowrap;
}
.dropdown-menu a:hover {
background-color: #F9FAFB;
color: #2D738C;
}
.mobile-menu-icon, .mobile-nav-panel {
display: none;
}
/* ==========================================================================
5. Stili za mobilno glavo in "accordion" meni
========================================================================== */
@media (max-width: 1024px) {
.dropdown-header-navigation {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 60px;
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.06);
border-bottom: none;
z-index: 1002;
}
/* Skrij nov ovoj za desno stran na mobilni napravi */
.header-right-wrapper {
display: none;
}
.mobile-menu-icon {
display: block;
font-size: 24px;
color: #101828;
cursor: pointer;
z-index: 1003;
}
.mobile-menu-icon .fa-times { display: none; }
html.nav-open .mobile-menu-icon .fa-bars { display: none; }
html.nav-open .mobile-menu-icon .fa-times { display: block; }
.mobile-nav-panel {
display: flex;
flex-direction: column;
position: fixed;
top: 60px;
left: 0;
width: 100%;
height: calc(100vh - 60px);
background: #FFFFFF;
padding: 24px;
box-sizing: border-box;
transform: translateX(100%);
transition: transform 0.3s ease-in-out;
z-index: 1001;
overflow-y: auto;
}
html.nav-open .mobile-nav-panel {
transform: translateX(0);
}
.mobile-nav-panel .navigation.mobile-nav {
display: flex;
flex-direction: column;
align-items: stretch;
width: 100%;
gap: 0;
padding-bottom: 24px;
border-bottom: none;
}
.mobile-nav .menu-item {
display: block;
height: auto;
border-bottom: 1px solid #EAECF0;
}
.mobile-nav .menu-item:first-of-type {
border-top: 1px solid #EAECF0;
}
.mobile-nav .menu-item > a {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 16px;
font-size: 20px;
color: #101828;
font-weight: 600;
height: auto;
box-sizing: border-box;
}
.mobile-nav .menu-item.active-page > a {
color: #2D738C;
font-weight: 700;
border-left: 3px solid #2D738C;
padding-left: 13px;
background-color: transparent;
}
.mobile-nav .dropdown-menu {
position: static;
transform: none;
opacity: 1;
visibility: visible;
box-shadow: none;
border: none;
background-color: transparent;
width: 100%;
min-width: auto;
margin: 0;
padding: 0 0 8px 0;
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease-in-out;
}
.mobile-nav .menu-item.open > .dropdown-menu { max-height: 500px; }
.mobile-nav .dropdown-menu ul { padding: 0; margin: 0; list-style: none; }
.mobile-nav .dropdown-menu li { padding: 0; }
.mobile-nav .dropdown-menu a {
display: block;
padding: 12px 16px 12px 45px;
color: #344054;
font-weight: 500;
font-size: 18px;
border-radius: 6px;
white-space: normal;
}
.mobile-nav .dropdown-menu a:hover { background-color: #F9FAFB; }
.mobile-nav .menu-item:hover > .dropdown-menu { opacity: 1; visibility: visible; transform: none; }
.mobile-nav .menu-item:hover > a::after { transform: none; }
html.nav-open .mobile-nav .menu-item.open > a::after { transform: rotate(180deg); }
.mobile-nav-panel .navigation-actions {
display: flex;
flex-direction: column;
gap: 16px;
width: 100%;
margin-top: 32px;
padding-top: 32px;
border-top: 1px solid #EAECF0;
}
.mobile-nav-panel .navigation-actions .btn {
width: 100%;
max-width: 340px;
align-self: center;
}
.mobile-nav-panel .language-selector .current-lang {
justify-content: center;
width: 100%;
max-width: 340px;
margin: 0 auto;
background-color: #F9FAFB;
border: 1px solid #EAECF0;
box-sizing: border-box;
}
.mobile-nav-panel .lang-dropdown { display: none; }
}
/* ==========================================================================
6. Stili za modalno okno za izbiro jezika
========================================================================== */
#language-modal-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(16, 24, 40, 0.6);
z-index: 2000;
display: flex;
justify-content: center;
align-items: center;
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
#language-modal-overlay.active {
opacity: 1;
visibility: visible;
}
.language-modal-content {
background-color: #FFFFFF;
border-radius: 16px;
padding: 24px;
width: 90%;
max-width: 400px;
box-shadow: 0 12px 24px -4px rgba(16, 24, 40, 0.08);
transform: scale(0.95);
transition: transform 0.3s ease;
}
#language-modal-overlay.active .language-modal-content {
transform: scale(1);
}
.language-modal-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 24px;
}
.language-modal-header h3 {
margin: 0;
font-size: 20px;
font-weight: 600;
color: #101828;
}
#language-modal-close {
background: none;
border: none;
font-size: 24px;
color: #667085;
cursor: pointer;
padding: 4px;
line-height: 1;
}
.language-modal-body {
display: flex;
flex-direction: column;
gap: 12px;
}
.language-modal-body a {
display: block;
padding: 12px 16px;
text-align: center;
text-decoration: none;
font-size: 18px;
font-weight: 500;
color: #344054;
background-color: #F9FAFB;
border: 1px solid #EAECF0;
border-radius: 8px;
transition: background-color 0.2s ease, border-color 0.2s ease;
}
.language-modal-body a:hover,
.language-modal-body a.active-lang {
background-color: #FFFFFF;
border-color: #2D738C;
color: #2D738C;
}

34
css/main.css Normal file
View File

@ -0,0 +1,34 @@
/* ==========================================================================
Main Stylesheet
========================================================================== */
/**
* Ta datoteka deluje kot glavna vstopna točka in uvaža vse ostale CSS
* datoteke v pravilnem vrstnem redu. Ne dodajajte stilov neposredno sem,
* ampak v ustrezne pod-datoteke.
*
* VRSTNI RED UVAŽANJA:
* 1. Base - Osnovni stili (reset, tipografija, itd.)
* 2. Layout - Strukturni elementi strani (glava, noga)
* 3. Components- Ponovno uporabljivi elementi (gumbi, kartice)
* 4. Pages - Stili, specifični za posamezne strani
*/
/* 1. Base Styles */
@import 'base/_base.css';
@import 'base/_typography.css';
/* 2. Layout Components */
@import 'layout/_header.css';
@import 'layout/_footer.css';
/* 3. Reusable Components */
@import 'components/_buttons.css';
@import 'components/_cards.css';
/* 4. Page-specific Styles */
@import 'pages/_home.css';
@import 'pages/_projects.css';
@import 'pages/_article.css';
@import 'pages/_about.css';
@import 'pages/_timeline.css';

459
css/pages/_about.css Normal file
View File

@ -0,0 +1,459 @@
/* css/pages/_about.css */
/* ==========================================================================
About Us Page Specific Styles (Redesign)
========================================================================== */
/**
* This file contains styles used exclusively on the "Our team, mission, vision & core values" page.
*
* 1. Leadership Team Section
* 2. Our Core Values Section
* 3. Mission and Vision Section
* 4. Call to Action (FAQ) Section
* 5. Mobile Styles for the page
*/
/* ==========================================================================
1. Leadership Team Section
========================================================================== */
.team-section {
padding: 48px 80px 96px;
background-color: #FFFFFF;
text-align: center;
}
.team-section .page-header-section {
padding: 0;
margin-bottom: 64px;
}
.team-grid {
display: flex;
justify-content: center;
gap: 32px;
flex-wrap: wrap;
max-width: 1280px;
margin: 0 auto;
}
.member-card {
position: relative;
width: 326px;
height: 400px;
border-radius: 16px;
overflow: hidden;
color: #FFFFFF;
background-size: cover;
background-position: center;
transition: transform 0.3s ease-in-out;
}
.member-card::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 60%;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
z-index: 1;
transition: opacity 0.3s ease-in-out;
}
.member-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #2D738C;
opacity: 0;
z-index: 2;
transition: opacity 0.3s ease-in-out;
}
.member-content {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 24px;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 3;
}
.member-socials {
display: flex;
gap: 32px;
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s 0.3s;
}
.member-socials a {
color: #FFFFFF;
font-size: 32px;
text-decoration: none;
transition: color 0.2s ease, transform 0.2s ease;
}
.member-socials a:hover {
color: #FA7850;
transform: scale(1.1);
}
.member-info {
text-align: center;
transform: translateY(115px);
transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.member-card h4 {
margin: 0 0 4px 0;
font-size: 24px;
font-weight: 600;
line-height: 29px;
text-transform: uppercase;
}
.member-card .role {
margin: 0;
font-size: 16px;
font-weight: 500;
color: #FFE16E;
text-transform: uppercase;
}
/* Hover effects only for devices that support it (desktops) */
@media (hover: hover) {
.member-card:hover::before {
opacity: 0.8;
}
.member-card:hover::after {
opacity: 0;
}
.member-card:hover .member-socials {
opacity: 1;
visibility: visible;
transform: translateY(0);
transition: opacity 0.3s 0.1s ease, transform 0.3s 0.1s ease, visibility 0s 0s;
}
.member-card:hover .member-info {
transform: translateY(40px);
}
}
#member-kristijan { background-image: url('../../images/about_kristijan.webp'); }
#member-lea { background-image: url('../../images/about_lea.webp'); }
#member-marko { background-image: url('../../images/about_marko.webp'); }
#member-marija { background-image: url('../../images/about_marija.webp'); }
#member-monika { background-image: url('../../images/about_monika.webp'); }
/* ==========================================================================
2. Our Core Values Section
========================================================================== */
.core-values-section {
padding: 80px 80px 120px;
background-color: #F9FAFB;
}
.core-values-section > .page-header-section {
padding: 0;
margin-bottom: 64px;
background: transparent;
text-align: center;
}
.core-values-section > .page-header-section h2 {
font-size: 36px;
font-weight: 600;
line-height: 44px;
letter-spacing: -0.02em;
color: #101828;
}
.core-values-section > .page-header-section p {
font-size: 20px;
line-height: 30px;
color: #667085;
max-width: 768px;
margin: 20px auto 0;
}
.values-container {
max-width: 1062px;
margin: 0 auto;
display: flex;
flex-direction: column;
gap: 64px;
}
.value-row {
display: flex;
align-items: center;
gap: 24px;
}
.value-row:nth-child(even) {
flex-direction: row-reverse;
}
.value-image {
flex-basis: 519px;
flex-shrink: 0;
}
.value-image img {
width: 100%;
height: 270px;
border-radius: 16px;
object-fit: cover;
}
.value-content {
flex: 1;
text-align: left;
max-width: 519px;
}
.value-content h3 {
font-size: 24px;
font-weight: 600;
line-height: 1.2;
color: #101828;
margin: 0 0 16px 0;
}
.value-content p {
font-size: 16px;
line-height: 24px;
color: #667085;
margin: 0;
}
/* ==========================================================================
3. Mission and Vision Section
========================================================================== */
.mission-vision-section {
padding: 96px 80px;
background-color: #FFFFFF;
}
.mission-vision-section .page-header-section {
margin-bottom: 48px;
padding: 0;
}
.mission-vision-section .page-header-section h2 {
font-size: 36px;
font-weight: 600;
color: #101828;
text-align: center;
}
.mission-vision-grid {
display: flex;
justify-content: center;
gap: 40px;
max-width: 1060px;
margin: 0 auto;
}
.mission-box,
.vision-box {
position: relative;
flex: 1;
height: 200px;
background: #F9FAFB;
border-radius: 12px;
cursor: pointer;
overflow: hidden;
}
.box-content {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
padding: 40px;
box-sizing: border-box;
text-align: center;
transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
}
.box-content p {
font-family: 'Inter', sans-serif;
font-size: 18px;
line-height: 1.2;
color: #667085;
margin: 0;
}
.box-content img {
width: 100%;
height: 100%;
object-fit: contain;
}
.mission-icon-content,
.vision-icon-content {
padding: 0;
}
/* --- Animation Logic --- */
.mission-text-content { opacity: 1; transform: translateY(0); }
.mission-icon-content { opacity: 0; transform: translateY(20px); }
.vision-text-content { opacity: 0; transform: translateY(20px); }
.vision-icon-content { opacity: 1; transform: translateY(0); }
@media (hover: hover) {
.mission-vision-grid.show-vision .mission-text-content { opacity: 0; transform: translateY(-20px); }
.mission-vision-grid.show-vision .mission-icon-content { opacity: 1; transform: translateY(0); }
.mission-vision-grid.show-vision .vision-text-content { opacity: 1; transform: translateY(0); }
.mission-vision-grid.show-vision .vision-icon-content { opacity: 0; transform: translateY(-20px); }
}
/* ==========================================================================
4. Call to Action (FAQ) Section
========================================================================== */
.faq-cta-section {
padding: 96px 80px;
background-color: #FFFFFF;
}
.faq-cta-container {
max-width: 1280px;
margin: 0 auto;
padding: 40px 32px;
background-color: #F9FAFB;
border-radius: 16px;
display: flex;
flex-direction: column;
align-items: center;
gap: 32px;
}
.avatar-group {
display: flex;
position: relative;
width: 120px;
height: 56px;
justify-content: center;
align-items: center;
}
.avatar {
width: 48px;
height: 48px;
border-radius: 50%;
border: 2px solid #FFFFFF;
position: absolute;
object-fit: cover;
}
.avatar:nth-child(1) { left: 0; z-index: 1;}
.avatar:nth-child(2) { left: 50%; transform: translateX(-50%); z-index: 2;}
.avatar:nth-child(3) { right: 0; z-index: 1;}
.avatar.large {
width: 56px;
height: 56px;
}
.faq-cta-container h3 {
font-size: 20px;
font-weight: 500;
color: #101828;
margin: 0;
margin-top: -8px;
}
.faq-cta-container p {
font-size: 18px;
line-height: 28px;
color: #667085;
margin: -24px 0 0 0;
}
/* ==========================================================================
5. Mobile Styles for About Us Page
========================================================================== */
@media (max-width: 1024px) {
.team-grid { max-width: 700px; }
.values-container { gap: 64px; }
.value-row { gap: 32px; }
.value-image { flex-basis: 45%; min-width: 0; }
}
@media (max-width: 768px) {
.team-section,
.core-values-section,
.mission-vision-section,
.faq-cta-section {
padding: 64px 24px;
}
.team-section .page-header-section { margin-bottom: 48px; }
.team-grid { flex-direction: column; align-items: center; gap: 24px; }
.member-card { width: 100%; max-width: 326px; height: 400px; }
/* Core Values on Mobile */
.core-values-section .page-header-section { margin-bottom: 48px; }
.core-values-section > .page-header-section h2 { font-size: 32px; line-height: 40px; }
.core-values-section > .page-header-section p { font-size: 18px; line-height: 28px; }
.values-container { gap: 48px; }
.value-row, .value-row:nth-child(even) { flex-direction: column; gap: 24px; }
.value-row .value-content { order: 1; }
.value-row .value-image { order: 2; }
.value-image { width: 100%; flex-basis: auto; }
.value-content { text-align: center; max-width: 100%; }
.value-content h3 { font-size: 24px; line-height: 32px; }
.value-content p { font-size: 16px; line-height: 26px; }
/* Mission and Vision on Mobile */
.mission-vision-grid { flex-direction: column; gap: 24px; }
.mission-box, .vision-box { cursor: default; height: auto; padding: 32px; }
.box-content {
position: static;
transform: none !important;
opacity: 1 !important;
padding: 0;
}
.mission-box, .vision-box {
display: flex;
flex-direction: column;
gap: 16px;
}
.mission-icon-content, .vision-icon-content {
order: 1;
opacity: 1 !important; /* Ensure icons are visible */
transform: none !important;
}
.mission-text-content, .vision-text-content {
order: 2;
opacity: 1 !important; /* Ensure text is visible */
transform: none !important;
}
.faq-cta-container { padding: 32px; }
.faq-cta-container h3 { font-size: 18px; }
.faq-cta-container p { font-size: 16px; line-height: 24px; }
}

590
css/pages/_article.css Normal file
View File

@ -0,0 +1,590 @@
/* css/pages/_article.css */
/* ==========================================================================
Single Article/Project Page Specific Styles
========================================================================== */
/**
* Ta datoteka vsebuje stile, ki se uporabljajo izključno na strani s
* posameznim člankom ali projektom.
*
* 1. Glavna postavitev strani članka (z levo navigacijo)
* 2. Lepljiva leva navigacija (Scrollspy - Desktop)
* 3. Lepljiva zgornja vrstica z naslovom in progress barom (Mobile)
* 4. Glava članka (naslov, podnaslov, datum)
* 5. Glavna slika in slike v vsebini
* 6. Telo članka (vsebina, tipografija, citati)
* 7. Noga članka (avtor, deljenje)
* 8. Poziv k prijavi na novice (CTA)
* 9. Stili za stran s člankom na mobilnih napravah
*/
/* ==========================================================================
1. Glavna postavitev strani članka
========================================================================== */
.article-page {
padding-top: 80px;
background: #FFFFFF;
}
.article-layout-container {
display: flex;
max-width: 1280px;
margin: 0 auto;
padding: 0 32px;
gap: 64px;
align-items: flex-start;
}
.article-container {
flex-grow: 1;
min-width: 0;
padding: 96px 0;
}
/* ==========================================================================
2. Lepljiva leva navigacija (Scrollspy - Desktop) - POSODOBLJENO
========================================================================== */
.article-sidebar {
width: 288px;
flex-shrink: 0;
position: sticky;
top: 120px;
height: calc(100vh - 240px);
}
.scrollspy-nav {
height: 100%;
overflow-y: auto;
display: flex;
align-items: center;
}
.scrollspy-nav ul {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 40px;
border-left: 2px solid #EAECF0;
}
.scrollspy-nav li a {
display: block;
padding: 12px 24px;
text-decoration: none;
font-size: 16px;
font-weight: 500;
color: #667085;
border-left: 2px solid transparent;
margin-left: -2px;
transition: all 0.2s ease-in-out;
}
.scrollspy-nav li a:hover {
color: #101828;
background-color: #F9FAFB;
}
.scrollspy-nav li a.active {
color: #2D738C;
font-weight: 600;
border-left-color: #2D738C;
background-color: transparent;
}
/* ==========================================================================
3. Lepljiva zgornja vrstica (Mobile)
========================================================================== */
.mobile-article-header {
display: none;
position: sticky;
top: 60px;
background-color: #FFFFFF;
z-index: 900;
border-bottom: 1px solid #EAECF0;
padding: 12px 24px;
cursor: pointer;
justify-content: space-between;
align-items: center;
-webkit-tap-highlight-color: transparent;
}
.mobile-article-header .fa-chevron-down {
transition: transform 0.3s ease-in-out;
}
.mobile-article-header.open .fa-chevron-down {
transform: rotate(180deg);
}
#mobile-article-title {
font-size: 14px;
font-weight: 600;
color: #101828;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
flex-grow: 1;
padding-right: 16px;
}
.progress-bar-container {
width: 100%;
height: 3px;
background-color: #EAECF0;
position: absolute;
bottom: -1px;
left: 0;
}
.progress-bar {
width: 0%;
height: 100%;
background-color: #2D738C;
transition: width 0.1s linear;
}
.mobile-scrollspy-dropdown {
position: absolute;
top: 100%;
left: 0;
width: 100%;
background: #FFFFFF;
border-top: 1px solid #EAECF0;
box-shadow: 0 4px 6px rgba(0,0,0,0.05);
max-height: 0;
overflow: hidden;
opacity: 0;
visibility: hidden;
transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out, visibility 0.3s;
}
.mobile-scrollspy-dropdown.open {
max-height: 50vh;
opacity: 1;
visibility: visible;
overflow-y: auto;
}
.mobile-scrollspy-dropdown ul {
list-style: none;
padding: 8px;
margin: 0;
}
.mobile-scrollspy-dropdown a {
display: block;
padding: 12px 16px;
text-decoration: none;
color: #344054;
font-size: 16px;
font-weight: 500;
border-radius: 6px;
white-space: normal;
}
.mobile-scrollspy-dropdown a:hover,
.mobile-scrollspy-dropdown a.active {
background-color: #F9FAFB;
color: #2D738C;
}
/* ==========================================================================
4. Glava članka
========================================================================== */
.article-header {
text-align: center;
margin-bottom: 64px;
}
.article-publish-date {
font-size: 16px;
font-weight: 600;
color: #FA7850;
margin-bottom: 12px;
}
.article-header h1 {
font-size: 48px;
font-weight: 600;
line-height: 60px;
letter-spacing: -0.02em;
color: #101828;
margin: 0;
}
.article-subtitle {
font-size: 20px;
line-height: 30px;
color: #667085;
margin-top: 24px;
max-width: 960px;
margin-left: auto;
margin-right: auto;
}
/* ==========================================================================
5. Glavna slika in slike v vsebini
========================================================================== */
.article-main-image {
margin: 0 0 64px 0;
}
.article-main-image img {
width: 100%;
height: auto;
max-height: 516px;
object-fit: cover;
border-radius: 24px;
display: block;
margin: 0 auto;
}
.article-inline-image {
margin: 16px 0;
display: flex;
flex-direction: column;
gap: 16px;
}
.article-inline-image img {
width: 100%;
border-radius: 16px;
}
.article-inline-image figcaption {
font-size: 14px;
color: #667085;
text-align: center;
}
/* NOVO: Stili za odziven vdelan video */
.video-responsive {
position: relative;
overflow: hidden;
padding-top: 56.25%; /* 16:9 Aspect Ratio */
margin: 16px 0;
border-radius: 16px; /* Ujemanje z ostalimi slikami */
}
.video-responsive iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
}
/* ==========================================================================
6. Telo članka
========================================================================== */
.article-body {
max-width: 720px;
margin: 0 auto;
display: flex;
flex-direction: column;
gap: 32px;
}
.article-body p, .article-body ol li {
font-size: 18px;
line-height: 28px;
color: #667085;
margin: 0;
}
.article-body h2 {
font-size: 30px;
font-weight: 600;
line-height: 38px;
color: #101828;
margin: 16px 0;
scroll-margin-top: 120px;
}
.article-body ol {
padding-left: 24px;
display: flex;
flex-direction: column;
gap: 12px;
}
.article-quote {
margin: 16px 0;
padding-left: 20px;
border-left: 2px solid #D0D5DD;
display: flex;
flex-direction: column;
gap: 32px;
background: transparent;
}
.article-quote p {
font-family: 'Inter', sans-serif;
font-style: italic;
font-weight: 500;
font-size: 24px;
line-height: 36px;
color: #101828;
margin: 0;
}
.article-quote footer {
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 24px;
color: #FA7850;
background: transparent;
}
/* ==========================================================================
7. Noga članka
========================================================================== */
.article-footer {
max-width: 720px;
margin: 48px auto 0;
background: transparent;
}
.article-footer hr {
border: 0;
height: 1px;
background-color: #EAECF0;
margin: 0 0 24px 0;
}
.author-share-section {
display: flex;
justify-content: space-between;
align-items: center;
}
.author-details {
display: flex;
align-items: center;
gap: 16px;
}
.author-details img {
width: 56px;
height: 56px;
border-radius: 50%;
object-fit: cover;
}
.author-name {
font-size: 18px;
font-weight: 600;
color: #101828;
margin: 0;
}
.author-title {
font-size: 16px;
color: #667085;
margin: 0;
}
.share-buttons {
display: flex;
align-items: center;
gap: 12px;
}
/* ==========================================================================
8. Poziv k prijavi na novice (CTA)
========================================================================== */
.newsletter-cta {
padding: 0 32px 96px 32px;
}
.newsletter-cta .container {
padding: 64px;
background: #F9FAFB;
border-radius: 16px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
max-width: 1216px;
gap: 32px;
text-align: center;
}
.newsletter-cta .cta-content {
display: flex;
flex-direction: column;
align-items: center;
gap: 16px;
flex: 1;
}
.newsletter-cta h2 {
font-size: 30px;
font-weight: 600;
line-height: 38px;
color: #101828;
margin: 0;
}
.newsletter-cta p {
font-size: 20px;
line-height: 30px;
color: #667085;
margin: 0;
}
.newsletter-cta .subscribe-form-bottom {
display: flex;
gap: 16px;
align-items: flex-start;
}
.subscribe-form-bottom .input-wrapper {
display: flex;
flex-direction: column;
gap: 8px;
}
.subscribe-form-bottom input {
width: 360px;
height: 48px;
padding: 12px 16px;
border: 1px solid #D0D5DD;
border-radius: 8px;
box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
font-size: 16px;
box-sizing: border-box;
}
.subscribe-form-bottom .btn-primary-orange {
height: 48px;
padding-top: 0;
padding-bottom: 0;
display: flex;
align-items: center;
justify-content: center;
}
/* ==========================================================================
9. Mobile Article Page Styles
========================================================================== */
@media (max-width: 768px) {
.article-page {
padding-top: 0;
}
.article-layout-container {
flex-direction: column;
padding: 0;
gap: 0;
}
.article-sidebar {
display: none;
}
.mobile-article-header {
display: flex;
}
.article-container {
padding: 32px 24px 48px 24px;
}
.article-header {
margin-bottom: 32px;
}
.article-header h1 {
font-size: 32px;
line-height: 40px;
}
.article-subtitle {
font-size: 18px;
line-height: 28px;
}
.article-main-image {
margin: 0 0 32px 0;
width: 100%;
position: static;
left: auto;
right: auto;
}
.article-main-image img {
border-radius: 16px;
}
.article-body {
gap: 32px;
}
.article-body p {
font-size: 16px;
line-height: 26px;
}
.article-body h2 {
font-size: 24px;
line-height: 32px;
scroll-margin-top: 120px;
}
.article-quote p {
font-size: 20px;
line-height: 30px;
}
.author-share-section {
flex-direction: column;
align-items: flex-start;
gap: 24px;
}
.newsletter-cta {
padding: 0 24px 64px 24px;
}
.newsletter-cta .container {
flex-direction: column;
padding: 32px;
gap: 32px;
}
.newsletter-cta .cta-content,
.newsletter-cta .cta-content p {
align-items: center;
text-align: center;
}
.newsletter-cta .subscribe-form-bottom {
flex-direction: column;
width: 100%;
align-items: stretch;
}
.subscribe-form-bottom .input-wrapper {
width: 100%;
}
.subscribe-form-bottom input {
width: 100%;
}
.newsletter-cta .privacy-note {
text-align: center;
}
}

869
css/pages/_home.css Normal file
View File

@ -0,0 +1,869 @@
/* ==========================================================================
Home Page Specific Styles
========================================================================== */
/**
* Ta datoteka vsebuje stile, ki se uporabljajo izključno na domači strani.
*
* 1. Hero Section
* 2. Partners Section
* 3. Meet the Team Section
* 4. Activities Section
* 5. Latest News Section
* 6. Testimonials Section
* 7. Become Part Section (vključno z obrazcem)
* 8. FAQ Section
* 9. Stili za domačo stran na mobilnih napravah
*/
/* 1. Hero Section */
.hero-section {
position: relative;
height: 880px;
width: 100%;
display: flex;
align-items: center;
overflow: hidden;
}
.hero-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
background: url('../../images/HeroSection-img1.webp') no-repeat center center/cover; /* POPRAVLJENO */
filter: blur(2px);
}
.hero-image-left, .hero-image-right {
display: none;
}
.hero-overlay {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: rgba(45, 115, 140, 0.64);
z-index: 2;
}
.hero-content {
position: relative;
z-index: 3;
color: #FFFFFF;
width: 100%;
max-width: 1000px;
margin: 0 auto;
text-align: center;
padding: 0 24px;
}
.hero-content .badge-group {
display: inline-flex;
align-items: center;
padding: 8px 24px;
gap: 12px;
background: rgba(255, 255, 255, 0.4);
border-radius: 24px;
margin-bottom: 32px;
}
.hero-content .message {
font-weight: 400;
font-size: 18px;
}
.hero-content h1 {
font-weight: 700;
font-size: 60px;
line-height: 72px;
letter-spacing: -0.02em;
margin: 0 0 24px 0;
}
.hero-content p {
font-size: 20px;
line-height: 30px;
margin: 0 0 72px 0;
}
/* 2. Partners Section */
.partners-section {
background: #FFFFFF;
padding: 64px 0;
}
.partners-container {
max-width: 1280px;
margin: 0 auto;
padding: 0 24px;
display: flex;
justify-content: space-between;
align-items: center;
gap: 64px;
flex-wrap: wrap;
}
.partners-container img {
max-height: 56px;
width: auto;
object-fit: contain;
}
/* 3. Meet the Team Section */
.meet-the-team-section {
display: flex;
justify-content: center;
align-items: center;
padding: 128px 0;
gap: 40px;
background: #FFFFFF;
}
.video-container {
position: relative;
width: 619px;
height: 360px;
}
.video-thumbnail {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 16px;
}
.video-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(127.76deg, rgba(19, 49, 60, 0.92) -13.16%, rgba(39, 77, 90, 0.08) 98.5%);
backdrop-filter: blur(6px);
border-radius: 16px;
}
.team-content {
width: 619px;
}
.team-content h2 {
font-size: 36px;
font-weight: 600;
line-height: 44px;
letter-spacing: -0.02em;
color: #101828;
margin: 0 0 20px 0;
}
.team-content p {
font-size: 20px;
line-height: 30px;
color: #667085;
margin: 0 0 56px 0;
}
/* 4. Activities Section */
.activities-section {
padding: 128px 80px;
background: #F9FAFB;
}
.activities-header {
text-align: center;
margin-bottom: 96px;
}
.activities-header h2 {
font-size: 36px;
font-weight: 600;
line-height: 44px;
letter-spacing: -0.02em;
color: #101828;
margin-bottom: 20px;
}
.activities-header p {
font-size: 20px;
line-height: 30px;
color: #667085;
max-width: 768px;
margin: 0 auto;
}
.activities-content {
display: flex;
gap: 109px;
max-width: 1232px;
margin: 0 auto;
}
.activities-nav {
width: 302px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.activities-nav ul {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 40px;
}
.activities-nav li {
font-size: 20px;
color: #646E82;
cursor: pointer;
position: relative;
padding-left: 48px;
}
.activities-nav li::before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 24px;
height: 2px;
background-color: #646E82;
}
.activities-nav li.active {
font-size: 24px;
font-weight: 600;
color: #000000;
}
.activity-details {
width: 821px;
}
.activity-details p {
font-size: 20px;
line-height: 30px;
color: #667085;
margin-bottom: 40px;
}
.activity-details img {
width: 100%;
height: 400px;
object-fit: cover;
border-radius: 24px;
}
/* 5. Latest News Section */
.latest-news-section {
padding: 128px 0;
background: #2D738C;
text-align: center;
}
.news-header {
margin-bottom: 64px;
}
.news-header h2 {
font-size: 36px;
font-weight: 600;
line-height: 44px;
letter-spacing: -0.02em;
color: #FFFFFF;
margin-bottom: 20px;
}
.news-header p {
font-size: 20px;
line-height: 30px;
color: #FFFFFF;
max-width: 768px;
margin: 0 auto;
}
.news-articles {
display: flex;
justify-content: center;
gap: 32px;
margin-bottom: 64px;
}
/* 6. Testimonials Section */
.testimonials-section {
padding: 128px 80px;
display: flex;
justify-content: center;
align-items: center;
gap: 24px;
}
.testimonials-intro {
width: 411px;
flex-shrink: 0;
}
.testimonials-intro h2 {
font-size: 36px;
font-weight: 600;
line-height: 44px;
letter-spacing: -0.02em;
color: #101828;
margin-bottom: 24px;
}
.testimonials-intro p {
font-size: 20px;
line-height: 30px;
color: #667085;
}
.testimonials-columns {
display: flex;
gap: 24px;
width: 846px;
height: 800px;
overflow-y: scroll;
padding-right: 15px;
}
.testimonials-columns::-webkit-scrollbar {
width: 5px;
}
.testimonials-columns::-webkit-scrollbar-thumb {
background: #D0D5DD;
border-radius: 10px;
}
.testimonial-column {
display: flex;
flex-direction: column;
gap: 48px;
width: 411px;
}
.column-offset {
margin-top: 80px;
}
/* 7. Become Part Section */
.become-part-section {
padding: 128px 0;
background: #F9FAFB;
text-align: center;
}
.become-part-header {
margin-bottom: 64px;
}
.become-part-header h2 {
font-size: 36px;
font-weight: 600;
line-height: 44px;
letter-spacing: -0.02em;
color: #101828;
margin-bottom: 20px;
}
.become-part-header p {
font-size: 20px;
line-height: 30px;
color: #646E82;
}
.team-photo {
width: 1232px;
height: 400px;
object-fit: cover;
border-radius: 24px;
margin: 0 auto 96px;
display: block;
}
.contact-form-container {
max-width: 800px;
margin: 0 auto;
}
.contact-form {
display: flex;
flex-direction: column;
gap: 24px;
text-align: left;
}
.form-row {
display: flex;
gap: 32px;
}
.form-group {
flex: 1;
display: flex;
flex-direction: column;
}
.form-group label {
font-size: 14px;
font-weight: 500;
color: #344054;
margin-bottom: 6px;
}
.form-group input,
.form-group textarea,
.form-group select {
padding: 12px 16px;
border: 1px solid #D0D5DD;
border-radius: 8px;
box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
font-size: 16px;
background: #FFFFFF;
color: #646E82;
font-family: 'Inter', sans-serif;
}
.form-group input::placeholder,
.form-group textarea::placeholder {
color: #646E82;
}
.phone-input {
display: flex;
border: 1px solid #D0D5DD;
border-radius: 8px;
overflow: hidden;
box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
}
.phone-input select {
border: none;
border-right: 1px solid #D0D5DD;
border-radius: 0;
box-shadow: none;
}
.phone-input input {
border: none;
flex-grow: 1;
box-shadow: none;
}
.checkbox-group {
flex-direction: row;
align-items: center;
gap: 12px;
}
.checkbox-group input {
width: 20px;
height: 20px;
}
.checkbox-group label {
margin: 0;
color: #646E82;
}
.checkbox-group label a {
color: #2D738C;
}
.contact-form button {
width: 100%;
padding: 12px 20px;
font-size: 16px;
}
/* 8. FAQ Section */
.faq-section {
padding: 128px 0;
text-align: center;
}
.faq-header {
margin-bottom: 64px;
}
.faq-header h2 {
font-size: 36px;
font-weight: 600;
line-height: 44px;
letter-spacing: -0.02em;
color: #101828;
margin-bottom: 20px;
}
.faq-header p {
font-size: 20px;
line-height: 30px;
color: #667085;
max-width: 768px;
margin: 0 auto;
}
.faq-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 64px 32px;
max-width: 1232px;
margin: 0 auto 64px;
text-align: left;
}
.faq-item {
display: flex;
flex-direction: column;
gap: 20px;
}
.faq-icon-container {
width: 48px;
height: 48px;
background: rgba(39, 77, 90, 0.08);
border-radius: 24px;
display: flex;
justify-content: center;
align-items: center;
color: #2D738C;
font-size: 22px;
}
.faq-item h3 {
font-size: 20px;
font-weight: 600;
color: #101828;
margin: 0;
}
.faq-item p {
font-size: 16px;
line-height: 24px;
color: #667085;
margin: 0;
}
.faq-footer {
max-width: 1232px;
margin: 0 auto;
padding: 40px 32px;
background: #F9FAFB;
border-radius: 16px;
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
}
.faq-footer h3 {
font-size: 20px;
font-weight: 500;
color: #101828;
margin: 16px 0 0 0;
}
.faq-footer p {
font-size: 18px;
color: #667085;
margin: 0 0 32px 0;
}
.avatar-group {
display: flex;
position: relative;
width: 120px;
height: 56px;
}
.avatar {
width: 48px;
height: 48px;
border-radius: 50%;
border: 1.5px solid #FFFFFF;
position: absolute;
top: 8px;
object-fit: cover;
}
.avatar:nth-child(1) { left: 0; z-index: 3;}
.avatar:nth-child(2) { left: 50%; transform: translateX(-50%); top:0; z-index: 2;}
.avatar:nth-child(3) { right: 0; z-index: 1;}
.avatar.large {
width: 56px;
height: 56px;
}
/* ==========================================================================
9. Mobile Home Page Styles
========================================================================== */
@media (max-width: 768px) {
/* Mobile Hero Section */
.hero-section {
height: 600px;
margin-top: 0;
align-items: flex-start;
}
.hero-background {
background: url('../../images/HeroSection-img1.webp') no-repeat center center/cover; /* POPRAVLJENO */
}
.hero-content {
padding: 64px 24px;
width: 100%;
box-sizing: border-box;
}
.hero-content h1 {
font-size: 40px;
line-height: 48px;
letter-spacing: -0.03em;
}
.hero-content p {
font-size: 16px;
line-height: 24px;
margin-bottom: 64px;
}
.hero-content .badge-group {
border-radius: 37px;
}
/* Mobile Partners Section */
.partners-section {
padding: 40px 24px;
}
.partners-container {
gap: 32px;
justify-content: center;
}
.partners-container img {
max-height: 40px;
flex-basis: 40%;
}
/* Mobile Meet the Team Section */
.meet-the-team-section {
flex-direction: column;
padding: 64px 24px;
gap: 40px;
}
.video-container, .team-content {
width: 100%;
max-width: 327px;
}
.video-container {
height: 190px;
}
.team-content h2 {
font-size: 32px;
line-height: 40px;
text-align: center;
}
.team-content p {
font-size: 16px;
line-height: 24px;
text-align: center;
margin-bottom: 32px;
}
.team-content .btn-secondary {
margin: 0 auto;
display: block;
width: 124px;
height: 44px;
}
/* Mobile Activities Section */
.activities-section {
padding: 64px 0;
}
.activities-header {
padding: 0 24px;
margin-bottom: 48px;
}
.activities-header h2 {
font-size: 32px;
line-height: 40px;
}
.activities-header p {
font-size: 16px;
line-height: 24px;
}
.activities-content {
flex-direction: column;
align-items: center;
gap: 32px;
padding: 0 24px;
}
.activities-nav {
width: 100%;
max-width: 326px;
gap: 32px;
}
.activities-nav ul {
width: 100%;
gap: 16px;
}
.activities-nav li {
display: flex;
justify-content: space-between;
align-items: center;
padding: 16px;
background: rgba(208, 213, 221, 0.5);
border-radius: 8px;
font-size: 16px;
font-weight: 600;
color: #000;
}
.activities-nav li::before {
display: none;
}
.activities-nav li.active::after {
content: ' ';
display: inline-block;
border: solid black;
border-width: 0 2px 2px 0;
padding: 4px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
.activities-nav .btn-primary-orange {
align-self: center;
}
.activity-details {
width: 100%;
max-width: 327px;
}
.activity-details p {
font-size: 16px;
line-height: 24px;
}
.activity-details img {
height: 300px;
border-radius: 16px;
}
/* Mobile Latest News Section */
.latest-news-section {
padding: 64px 24px;
}
.news-header, .news-articles {
margin-bottom: 48px;
}
.news-header h2 {
font-size: 32px;
line-height: 40px;
}
.news-header p {
font-size: 16px;
line-height: 24px;
}
.news-articles {
flex-direction: column;
align-items: center;
gap: 48px;
}
/* Mobile Testimonials Section */
.testimonials-section {
flex-direction: column;
padding: 64px 0;
align-items: center;
gap: 32px;
}
.testimonials-intro {
width: 100%;
padding: 0 24px;
text-align: center;
box-sizing: border-box;
}
.testimonials-intro h2 {
font-size: 32px;
line-height: 40px;
}
.testimonials-intro p {
font-size: 16px;
line-height: 24px;
}
.testimonials-columns {
display: flex;
flex-direction: row;
width: 100%;
height: auto;
overflow-x: auto;
overflow-y: hidden;
padding: 0 24px;
box-sizing: border-box;
scroll-snap-type: x mandatory;
}
.testimonials-columns::-webkit-scrollbar {
display: none;
}
.testimonial-column {
display: contents;
}
.column-offset {
margin-top: 0;
}
/* Mobile Become Part Section */
.become-part-section {
padding: 64px 16px;
}
.become-part-header {
margin-bottom: 48px;
}
.become-part-header h2 {
font-size: 32px;
line-height: 40px;
}
.become-part-header p {
font-size: 16px;
line-height: 24px;
}
.team-photo {
width: 100%;
height: auto;
margin-bottom: 48px;
}
.contact-form-container {
width: 100%;
padding: 0;
}
.form-row {
flex-direction: column;
gap: 24px;
}
/* Mobile FAQ Section */
.faq-section {
padding: 64px 16px;
}
.faq-header {
margin-bottom: 48px;
}
.faq-header h2 {
font-size: 32px;
line-height: 40px;
}
.faq-header p {
font-size: 18px;
line-height: 28px;
}
.faq-grid {
grid-template-columns: 1fr;
gap: 40px;
padding: 0 8px;
}
.faq-item {
align-items: center;
}
.faq-item h3, .faq-item p {
text-align: center;
}
.faq-footer {
width: 100%;
box-sizing: border-box;
padding: 32px 20px;
}
}

231
css/pages/_projects.css Normal file
View File

@ -0,0 +1,231 @@
/* ==========================================================================
Projects Page Specific Styles (Listing Page)
========================================================================== */
/**
* Ta datoteka vsebuje stile, ki se uporabljajo izključno na strani s
* seznamom vseh projektov.
*
* 1. Glava strani (naslov, opis, obrazec za prijavo)
* 2. Sekcija z vsemi objavami (mreža)
* 3. Paginacija
* 4. Stili za stran s projekti na mobilnih napravah
*/
/* 1. Glava strani */
.page-content {
padding-top: 80px; /* Odmik za fiksno glavo */
}
.page-header-section {
padding: 96px 0;
background: #FFFFFF;
text-align: center;
}
.page-header-section .container.text-center {
display: flex;
flex-direction: column;
align-items: center;
gap: 24px;
max-width: 960px;
}
.page-subtitle {
font-weight: 600;
font-size: 16px;
color: #FA7850;
}
.page-header-section h1 {
font-weight: 600;
font-size: 48px;
line-height: 60px;
letter-spacing: -0.02em;
color: #101828;
margin: 0;
}
.page-description {
font-size: 20px;
line-height: 30px;
color: #667085;
max-width: 768px;
margin: 0;
}
.subscribe-form {
display: flex;
gap: 16px;
margin-top: 16px;
}
.subscribe-form input {
width: 360px;
height: 48px;
padding: 12px 16px;
border: 1px solid #D0D5DD;
border-radius: 8px;
box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
font-size: 16px;
box-sizing: border-box;
}
.subscribe-form .btn {
height: 48px;
/* SPREMEMBA: Dodan flexbox za popolno sredinsko poravnavo besedila znotraj gumba. */
display: flex;
align-items: center;
justify-content: center;
padding-top: 0;
padding-bottom: 0;
}
.privacy-note {
font-size: 14px;
color: #667085;
margin-top: -8px;
}
.privacy-note a {
color: #667085;
font-weight: 500;
}
/* 2. Sekcija z vsemi objavami */
.all-posts-section {
padding: 0 80px 96px;
}
.all-posts-section .container.column-layout {
flex-direction: column;
align-items: flex-start;
gap: 64px;
}
.all-posts-section h2 {
font-size: 24px;
font-weight: 600;
line-height: 32px;
color: #101828;
margin: 0;
}
.posts-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 48px 32px;
width: 100%;
}
/* 3. Paginacija */
.pagination {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 20px;
border-top: 1px solid #EAECF0;
}
.pagination-arrow {
display: flex;
align-items: center;
gap: 8px;
font-size: 14px;
font-weight: 500;
color: #667085;
text-decoration: none;
}
.pagination-numbers {
display: flex;
gap: 2px;
}
.page-number {
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
border-radius: 8px;
text-decoration: none;
font-size: 14px;
font-weight: 500;
color: #667085;
}
.page-number.active {
background-color: rgba(102, 112, 133, 0.16);
color: #2D738C;
}
.page-dots {
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
color: #667085;
}
/* ==========================================================================
Mobile Projects Page Styles
========================================================================== */
@media (max-width: 768px) {
.page-content {
padding-top: 60px; /* Prilagoditev za fiksno glavo */
}
.page-header-section {
padding: 64px 24px;
}
.page-header-section h1 {
font-size: 32px;
line-height: 40px;
}
.page-description {
font-size: 16px;
line-height: 24px;
}
.subscribe-form {
flex-direction: column;
width: 100%;
}
.subscribe-form input {
width: 100%;
}
.all-posts-section {
padding: 48px 24px;
}
.all-posts-section .container.column-layout {
gap: 32px;
}
.posts-grid {
grid-template-columns: 1fr;
gap: 48px;
}
.pagination {
flex-direction: column;
gap: 24px;
}
.pagination-numbers {
order: -1;
}
}

182
css/pages/_timeline.css Normal file
View File

@ -0,0 +1,182 @@
/* ==========================================================================
Timeline Page Specific Styles
========================================================================== */
/**
* This file contains styles used exclusively on the Timeline & Milestones page.
*
* 1. Timeline container and line
* 2. Timeline items and markers
* 3. Timeline content (text and images)
* 4. Mobile Styles for Timeline
*/
/* 1. Timeline container and line */
.timeline-section {
padding: 96px 0;
background: #FFFFFF;
}
.timeline-banner {
max-width: 1280px;
margin: 0 auto 96px;
padding: 0 32px;
box-sizing: border-box;
}
.timeline-banner img {
width: 100%;
height: auto;
border-radius: 16px;
object-fit: cover;
}
.timeline-container {
position: relative;
max-width: 1110px;
margin: 0 auto;
padding: 0 32px;
}
/* Navpična črta je bila odstranjena z izbrisom pravila .timeline-container::before */
/* 2. Timeline items and markers */
.timeline-item {
position: relative;
padding-left: 88px;
margin-bottom: 64px;
}
.timeline-item:last-child {
margin-bottom: 0;
}
.timeline-marker {
position: absolute;
left: 40px;
top: 6px;
width: 16px;
height: 16px;
border-radius: 2px;
transform: translateX(-50%) rotate(45deg);
background-color: #FA7850;
z-index: 2; /* Ensure markers are above the line */
}
.timeline-marker.milestone {
width: 12px;
height: 12px;
top: 8px;
border-radius: 50%;
background-color: #D0D5DD;
transform: translateX(-50%) rotate(0deg);
}
/* 3. Timeline content */
.timeline-entry {
position: relative;
}
.timeline-content .timeline-year,
.timeline-content .timeline-date {
font-family: 'Inter', sans-serif;
font-weight: 600;
color: #FA7850;
margin: 0 0 12px 0;
}
.timeline-content .timeline-year {
font-size: 18px;
line-height: 28px;
}
.timeline-content .timeline-date {
font-size: 16px;
line-height: 24px;
}
.timeline-content h2, .timeline-content h3 {
font-size: 30px;
font-weight: 600;
color: #101828;
margin: 0 0 16px 0;
}
.timeline-content h3 {
font-size: 24px;
}
.timeline-content p {
font-size: 18px;
line-height: 28px;
color: #667085;
margin: 0 0 1em 0;
}
.timeline-content p:last-child {
margin-bottom: 0;
}
.timeline-content ul {
list-style-type: none;
padding-left: 24px;
margin: 1em 0;
}
.timeline-content li {
font-size: 18px;
line-height: 28px;
color: #667085;
margin-bottom: 0.5em;
position: relative;
}
.timeline-content li::before {
content: '•';
color: #FA7850;
font-weight: bold;
display: inline-block;
width: 1em;
margin-left: -1em;
position: absolute;
left: -12px;
}
/* ==========================================================================
Mobile Timeline Styles
========================================================================== */
@media (max-width: 768px) {
.timeline-section {
padding: 64px 0;
}
.timeline-banner {
padding: 0 24px;
margin-bottom: 64px;
}
.timeline-container {
padding: 0 24px;
}
.timeline-item {
padding-left: 56px;
margin-bottom: 48px;
}
.timeline-marker,
.timeline-marker.milestone {
left: 24px;
}
.timeline-content h2 {
font-size: 24px;
}
.timeline-content h3 {
font-size: 20px;
}
.timeline-content p, .timeline-content li {
font-size: 16px;
line-height: 26px;
}
}

400
en/about-us/index.html Normal file
View File

@ -0,0 +1,400 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Our Team, Mission, Vision & Core Values - MSOS</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="page-content">
<!-- About Us Header Section -->
<section class="page-header-section">
<div class="container text-center">
<span class="page-subtitle" style="text-transform: uppercase;">About us</span>
<h1>Our team, mission, vision & core values</h1>
<p class="page-description">MSOS is more than an organization - it is the energy of the team behind it. Our members are the heart and driving force that inspires us, writing this story and shaping student life in Slovenia.</p>
</div>
</section>
<!-- Leadership Team Section -->
<section class="team-section">
<div class="page-header-section">
<h2>Leadership team</h2>
</div>
<div class="team-grid">
<!-- Kristijan Popovski -->
<div class="member-card" id="member-kristijan">
<div class="member-content">
<div class="member-socials">
<a href="mailto:kristijan.popovski@msosorg.com" aria-label="Email Kristijan Popovski"><i class="fas fa-envelope"></i></a>
<a href="https://www.linkedin.com/in/popovski-k" target="_blank" aria-label="LinkedIn profile of Kristijan Popovski"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.instagram.com/popovski.k/" target="_blank" aria-label="Instagram profile of Kristijan Popovski"><i class="fab fa-instagram"></i></a>
</div>
<div class="member-info">
<h4>Kristijan Popovski</h4>
<p class="role">FOUNDER AND PRESIDENT</p>
</div>
</div>
</div>
<!-- Lea Janachkovska -->
<div class="member-card" id="member-lea">
<div class="member-content">
<div class="member-socials">
<a href="mailto:lea.janackovska@msosorg.com" aria-label="Email Lea Janachkovska"><i class="fas fa-envelope"></i></a>
<a href="https://www.linkedin.com/in/lea-janachkovska-9833b9246/" target="_blank" aria-label="LinkedIn profile of Lea Janachkovska"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.instagram.com/lea_janackovska" target="_blank" aria-label="Instagram profile of Lea Janachkovska"><i class="fab fa-instagram"></i></a>
</div>
<div class="member-info">
<h4>Lea Janachkovska</h4>
<p class="role">HUMAN RESOURCES</p>
</div>
</div>
</div>
<!-- Marko Arsov -->
<div class="member-card" id="member-marko">
<div class="member-content">
<div class="member-socials">
<a href="mailto:marko.arsov@msosorg.com" aria-label="Email Marko Arsov"><i class="fas fa-envelope"></i></a>
<a href="https://www.linkedin.com/in/marko-arsov-3313202b9" target="_blank" aria-label="LinkedIn profile of Marko Arsov"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.instagram.com/marko.arsov" target="_blank" aria-label="Instagram profile of Marko Arsov"><i class="fab fa-instagram"></i></a>
</div>
<div class="member-info">
<h4>Marko Arsov</h4>
<p class="role">EVENT MANAGER</p>
</div>
</div>
</div>
<!-- Marija Koshtrevska -->
<div class="member-card" id="member-marija">
<div class="member-content">
<div class="member-socials">
<a href="mailto:marija.koshtrevska@msosorg.com" aria-label="Email Marija Koshtrevska"><i class="fas fa-envelope"></i></a>
<a href="https://www.linkedin.com/in/marija-koshtrevska/" target="_blank" aria-label="LinkedIn profile of Marija Koshtrevska"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.instagram.com/koshtrevska_10" target="_blank" aria-label="Instagram profile of Marija Koshtrevska"><i class="fab fa-instagram"></i></a>
</div>
<div class="member-info">
<h4>Marija Koshtrevska</h4>
<p class="role">IT COORDINATOR</p>
</div>
</div>
</div>
<!-- Monika Velinova -->
<div class="member-card" id="member-monika">
<div class="member-content">
<div class="member-socials">
<a href="mailto:monika.velinova@msosorg.com" aria-label="Email Monika Velinova"><i class="fas fa-envelope"></i></a>
<a href="https://www.linkedin.com/in/monika-velinova-21632517a/" target="_blank" aria-label="LinkedIn profile of Monika Velinova"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.instagram.com/monivelinova" target="_blank" aria-label="Instagram profile of Monika Velinova"><i class="fab fa-instagram"></i></a>
</div>
<div class="member-info">
<h4>Monika Velinova</h4>
<p class="role">SECRETARY</p>
</div>
</div>
</div>
</div>
</section>
<!-- Our Core Values Section -->
<section class="core-values-section">
<div class="page-header-section">
<h2>Our core values</h2>
<p class="page-description">Our shared values keep us connected and guide us as one team.</p>
</div>
<div class="values-container">
<div class="value-row">
<div class="value-content">
<h3>Volunteer spirit</h3>
<p>The strength of MSOS comes from giving our time and energy selflessly. Every project, event, and idea in MSOS is built on the hard work of our amazing volunteers. Our volunteer spirit is a testament to the dedication, passion, and collaborative energy of our community and the reason why we grow stronger together.</p>
</div>
<div class="value-image">
<img src="../../images/about_volunteer_spirit.webp" alt="A group of volunteers working together with positive energy.">
</div>
</div>
<div class="value-row">
<div class="value-image">
<img src="../../images/about_solidarity_and_care_for_each_other.webp" alt="Students supporting each other in a friendly and caring manner.">
</div>
<div class="value-content">
<h3>Solidarity & care for each other</h3>
<p>We are more than a group of students, but a family. We look after one another and support each other not just with studies, but also with everyday challenges. We are here to listen, help, and celebrate successes together. It's about giving without expecting anything in return and creating a safe, warm, and uplifting environment where everyone feels they belong.</p>
</div>
</div>
<div class="value-row">
<div class="value-content">
<h3>Love for our roots & ambition for the future</h3>
<p>We are proud of where we come from and carry our Macedonian heritage with us, while striving for a brighter future. Our roots give us strength, and our ambition pushes us forward. Our ambition drives us to be professional, innovative, and influential leaders and role models in our host country.</p>
</div>
<div class="value-image">
<img src="../../images/about_love_for_our_roots_ambition_for_the_future.webp" alt="A blend of traditional Macedonian culture and modern ambitious students.">
</div>
</div>
</div>
</section>
<!-- Mission and Vision Section -->
<section class="mission-vision-section">
<div class="page-header-section">
<h2>Mission and Vision</h2>
</div>
<div class="mission-vision-grid" id="mission-vision-interactive">
<!-- Mission Box -->
<div class="mission-box">
<div class="box-content mission-text-content">
<p>The mission of MSOS is to represent the interests, improve the lives, and ease the studies of Macedonian students in the Republic of Slovenia.</p>
</div>
<div class="box-content mission-icon-content">
<img src="../../images/about_mission.webp" alt="Mission Icon">
</div>
</div>
<!-- Vision Box -->
<div class="vision-box">
<div class="box-content vision-text-content">
<p>The vision of the MSOS is to provide a voice, a home, and support for Macedonian students in the Republic of Slovenia, while encouraging their active involvement in projects of common interest.</p>
</div>
<div class="box-content vision-icon-content">
<img src="../../images/about_vision.webp" alt="Vision Icon">
</div>
</div>
</div>
</section>
<!-- FAQ Call to Action Section -->
<section class="faq-cta-section">
<div class="faq-cta-container">
<div class="avatar-group">
<img src="../../images/about_marija_min.webp" alt="Avatar of Marija" class="avatar">
<img src="../../images/about_kristijan_min.webp" alt="Avatar of Kristijan" class="avatar large">
<img src="../../images/about_lea_min.webp" alt="Avatar of Lea" class="avatar">
</div>
<h3>Have any questions?</h3>
<p class="page-description" style="margin: 0;">Can't find the answer you're looking for? Please chat to our friendly team.</p>
<a href="#" class="btn btn-primary-orange">See all FAQs</a>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2025 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

400
en/about-us/index.html.bak Normal file
View File

@ -0,0 +1,400 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Our Team, Mission, Vision & Core Values - MSOS</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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="page-content">
<!-- About Us Header Section -->
<section class="page-header-section">
<div class="container text-center">
<span class="page-subtitle" style="text-transform: uppercase;">About us</span>
<h1>Our team, mission, vision & core values</h1>
<p class="page-description">MSOS is more than an organization - it is the energy of the team behind it. Our members are the heart and driving force that inspires us, writing this story and shaping student life in Slovenia.</p>
</div>
</section>
<!-- Leadership Team Section -->
<section class="team-section">
<div class="page-header-section">
<h2>Leadership team</h2>
</div>
<div class="team-grid">
<!-- Kristijan Popovski -->
<div class="member-card" id="member-kristijan">
<div class="member-content">
<div class="member-socials">
<a href="mailto:kristijan.popovski@msosorg.com" aria-label="Email Kristijan Popovski"><i class="fas fa-envelope"></i></a>
<a href="https://www.linkedin.com/in/popovski-k" target="_blank" aria-label="LinkedIn profile of Kristijan Popovski"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.instagram.com/popovski.k/" target="_blank" aria-label="Instagram profile of Kristijan Popovski"><i class="fab fa-instagram"></i></a>
</div>
<div class="member-info">
<h4>Kristijan Popovski</h4>
<p class="role">FOUNDER AND PRESIDENT</p>
</div>
</div>
</div>
<!-- Lea Janachkovska -->
<div class="member-card" id="member-lea">
<div class="member-content">
<div class="member-socials">
<a href="mailto:lea.janackovska@msosorg.com" aria-label="Email Lea Janachkovska"><i class="fas fa-envelope"></i></a>
<a href="https://www.linkedin.com/in/lea-janachkovska-9833b9246/" target="_blank" aria-label="LinkedIn profile of Lea Janachkovska"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.instagram.com/lea_janackovska" target="_blank" aria-label="Instagram profile of Lea Janachkovska"><i class="fab fa-instagram"></i></a>
</div>
<div class="member-info">
<h4>Lea Janachkovska</h4>
<p class="role">HUMAN RESOURCES</p>
</div>
</div>
</div>
<!-- Marko Arsov -->
<div class="member-card" id="member-marko">
<div class="member-content">
<div class="member-socials">
<a href="mailto:marko.arsov@msosorg.com" aria-label="Email Marko Arsov"><i class="fas fa-envelope"></i></a>
<a href="https://www.linkedin.com/in/marko-arsov-3313202b9" target="_blank" aria-label="LinkedIn profile of Marko Arsov"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.instagram.com/marko.arsov" target="_blank" aria-label="Instagram profile of Marko Arsov"><i class="fab fa-instagram"></i></a>
</div>
<div class="member-info">
<h4>Marko Arsov</h4>
<p class="role">EVENT MANAGER</p>
</div>
</div>
</div>
<!-- Marija Koshtrevska -->
<div class="member-card" id="member-marija">
<div class="member-content">
<div class="member-socials">
<a href="mailto:marija.koshtrevska@msosorg.com" aria-label="Email Marija Koshtrevska"><i class="fas fa-envelope"></i></a>
<a href="https://www.linkedin.com/in/marija-koshtrevska/" target="_blank" aria-label="LinkedIn profile of Marija Koshtrevska"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.instagram.com/koshtrevska_10" target="_blank" aria-label="Instagram profile of Marija Koshtrevska"><i class="fab fa-instagram"></i></a>
</div>
<div class="member-info">
<h4>Marija Koshtrevska</h4>
<p class="role">IT COORDINATOR</p>
</div>
</div>
</div>
<!-- Monika Velinova -->
<div class="member-card" id="member-monika">
<div class="member-content">
<div class="member-socials">
<a href="mailto:monika.velinova@msosorg.com" aria-label="Email Monika Velinova"><i class="fas fa-envelope"></i></a>
<a href="https://www.linkedin.com/in/monika-velinova-21632517a/" target="_blank" aria-label="LinkedIn profile of Monika Velinova"><i class="fab fa-linkedin-in"></i></a>
<a href="https://www.instagram.com/monivelinova" target="_blank" aria-label="Instagram profile of Monika Velinova"><i class="fab fa-instagram"></i></a>
</div>
<div class="member-info">
<h4>Monika Velinova</h4>
<p class="role">SECRETARY</p>
</div>
</div>
</div>
</div>
</section>
<!-- Our Core Values Section -->
<section class="core-values-section">
<div class="page-header-section">
<h2>Our core values</h2>
<p class="page-description">Our shared values keep us connected and guide us as one team.</p>
</div>
<div class="values-container">
<div class="value-row">
<div class="value-content">
<h3>Volunteer spirit</h3>
<p>The strength of MSOS comes from giving our time and energy selflessly. Every project, event, and idea in MSOS is built on the hard work of our amazing volunteers. Our volunteer spirit is a testament to the dedication, passion, and collaborative energy of our community and the reason why we grow stronger together.</p>
</div>
<div class="value-image">
<img src="../../images/about_volunteer_spirit.webp" alt="A group of volunteers working together with positive energy.">
</div>
</div>
<div class="value-row">
<div class="value-image">
<img src="../../images/about_solidarity_and_care_for_each_other.webp" alt="Students supporting each other in a friendly and caring manner.">
</div>
<div class="value-content">
<h3>Solidarity & care for each other</h3>
<p>We are more than a group of students, but a family. We look after one another and support each other not just with studies, but also with everyday challenges. We are here to listen, help, and celebrate successes together. It's about giving without expecting anything in return and creating a safe, warm, and uplifting environment where everyone feels they belong.</p>
</div>
</div>
<div class="value-row">
<div class="value-content">
<h3>Love for our roots & ambition for the future</h3>
<p>We are proud of where we come from and carry our Macedonian heritage with us, while striving for a brighter future. Our roots give us strength, and our ambition pushes us forward. Our ambition drives us to be professional, innovative, and influential leaders and role models in our host country.</p>
</div>
<div class="value-image">
<img src="../../images/about_love_for_our_roots_ambition_for_the_future.webp" alt="A blend of traditional Macedonian culture and modern ambitious students.">
</div>
</div>
</div>
</section>
<!-- Mission and Vision Section -->
<section class="mission-vision-section">
<div class="page-header-section">
<h2>Mission and Vision</h2>
</div>
<div class="mission-vision-grid" id="mission-vision-interactive">
<!-- Mission Box -->
<div class="mission-box">
<div class="box-content mission-text-content">
<p>The mission of MSOS is to represent the interests, improve the lives, and ease the studies of Macedonian students in the Republic of Slovenia.</p>
</div>
<div class="box-content mission-icon-content">
<img src="../../images/about_mission.webp" alt="Mission Icon">
</div>
</div>
<!-- Vision Box -->
<div class="vision-box">
<div class="box-content vision-text-content">
<p>The vision of the MSOS is to provide a voice, a home, and support for Macedonian students in the Republic of Slovenia, while encouraging their active involvement in projects of common interest.</p>
</div>
<div class="box-content vision-icon-content">
<img src="../../images/about_vision.webp" alt="Vision Icon">
</div>
</div>
</div>
</section>
<!-- FAQ Call to Action Section -->
<section class="faq-cta-section">
<div class="faq-cta-container">
<div class="avatar-group">
<img src="../../images/about_marija_min.webp" alt="Avatar of Marija" class="avatar">
<img src="../../images/about_kristijan_min.webp" alt="Avatar of Kristijan" class="avatar large">
<img src="../../images/about_lea_min.webp" alt="Avatar of Lea" class="avatar">
</div>
<h3>Have any questions?</h3>
<p class="page-description" style="margin: 0;">Can't find the answer you're looking for? Please chat to our friendly team.</p>
<a href="#" class="btn btn-primary-orange">See all FAQs</a>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2023 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

483
en/index.html Normal file
View File

@ -0,0 +1,483 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>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 (corrected path) -->
<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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main>
<section class="hero-section">
<div class="hero-background"></div>
<div class="hero-overlay"></div>
<div class="hero-content">
<div class="heading-and-supporting-text">
<div class="badge-group">
<div class="badge-content">
<span class="message">First official Macedonian Student Organisation in Slovenia</span>
</div>
</div>
<h1>Empowering young people with skills to change the world</h1>
<p>Be part of our exciting journey; Become a part of our student organization today!</p>
</div>
<button class="btn btn-primary-orange">Become a member</button>
</div>
</section>
<section class="partners-section">
<div class="partners-container">
<img src="../images/2.%20Slo%20embassy%20in%20Skopje_mcd-1.webp" alt="Slovenian Embassy in Skopje logo">
<img src="../images/5.%20UL_EF-logoENG-HOR-CMYK_color-1.webp" alt="University of Ljubljana School of Economics and Business logo">
<img src="../images/3.%20Logo_NLB_Banka_CMYK_MAC-1.webp" alt="NLB Banka logo">
<img src="../images/1.%20mkd%20embassy%20in%20slovenia.webp" alt="Embassy of North Macedonia in Slovenia logo">
</div>
</section>
<section class="meet-the-team-section">
<div class="video-container">
<img src="../images/3.activites.webp" alt="Team members collaborating" class="video-thumbnail">
<div class="video-overlay"></div>
<button class="play-button" aria-label="Play video"></button>
</div>
<div class="team-content">
<h2>Every Student Has a Story Heres Ours</h2>
<p>Curious about what MSOS is all about? This video tells our story—fast, fun, and from the heart. See what makes MSOS special in our video—and hit “Learn more” to be part of the story.</p>
<a href="../en/about-us/" class="btn btn-secondary">Learn more</a>
</div>
</section>
<section class="activities-section">
<div class="activities-header">
<h2>Activities</h2>
<p>Our philosophy is simple — hire a team of diverse, passionate people and foster a culture that empowers you to do you best work.</p>
</div>
<div class="activities-content">
<div class="activities-nav">
<ul>
<li class="active">Student Support</li>
<li>Fun & Social Life</li>
<li>Education & Culture</li>
<li>Student Representation</li>
</ul>
<button class="btn btn-primary-orange">Become a member</button>
</div>
<div class="activity-details">
<p>We know moving to a new country can feel overwhelming, so were here to make it easier. From helping you with university applications to finding your way around student life in Slovenia, you can always count on us. We offer free consultations, answer your questions on Instagram and Facebook (yes, even late at night), and host events where you can meet others and hear real experiences first-hand. With mentorship, info sessions, and a friendly community by your side, youll never have to go through the journey alone.</p>
<img src="../images/img1-08.09.2025.webp" alt="Students receiving support and guidance">
</div>
</div>
</section>
<section class="latest-news-section">
<div class="news-header">
<h2>Latest news</h2>
<p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div>
<div class="news-articles">
<article class="news-card">
<img src="../images/4-billwalsh.webp" alt="Pink and blue tinted image of a snowy mountain peak">
<div class="card-content">
<p class="author">Alec Whitten • 17 Jan 2022</p>
<h3>Bill Walsh leadership lessons</h3>
<p>Like to know the secrets of transforming a 2-14 team into a 3x Super Bowl...</p>
</div>
</article>
<article class="news-card">
<img src="../images/5-pmmentals.webp" alt="A woman presenting in front of a whiteboard with sticky notes to a team">
<div class="card-content">
<p class="author">Demi Wilkinson • 16 Jan 2022</p>
<h3>PM mental models</h3>
<p>Mental models are simple expressions of complex processes or relationships.</p>
</div>
</article>
<article class="news-card">
<img src="../images/6-whatiswireframing.webp" alt="A modern computer desk setup with a large monitor, keyboard, and headphones">
<div class="card-content">
<p class="author">Candice Wu • 15 Jan 2022</p>
<h3>What is Wireframing?</h3>
<p>Introduction to Wireframing and its Principles. Learn from the best in the industry.</p>
</div>
</article>
</div>
<a href="../en/projects/" class="btn btn-secondary">See all</a>
</section>
<section class="testimonials-section">
<div class="testimonials-intro">
<h2>See what our partners say about us</h2>
<p>Everything you need to know about the product and billing.</p>
</div>
<div class="testimonials-columns">
<div class="testimonial-column">
<div class="testimonial-card">
<h3>How collaboration makes us better</h3>
<p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
<div class="author-info">
<img src="../images/7-graphicdesigner.webp" alt="Aleksandar Popovski">
<div>
<h4>Aleksandar Popovski</h4>
<p>Graphic designer at MSOS</p>
</div>
</div>
</div>
<div class="testimonial-card">
<h3>Consectetur vitae ac parturient massa</h3>
<p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra.</p>
<div class="author-info">
<img src="../images/11-boy.webp" alt="Another team member">
<div>
<h4>Aleksandar Popovski</h4>
<p>Graphic designer at MSOS</p>
</div>
</div>
</div>
</div>
<div class="testimonial-column column-offset">
<div class="testimonial-card">
<h3>Proud partners</h3>
<p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
<div class="author-info">
<img src="../images/12-girl2.webp" alt="Another partner">
<div>
<h4>Aleksandar Popovski</h4>
<p>Graphic designer at MSOS</p>
</div>
</div>
</div>
<div class="testimonial-card">
<h3>Our collaboration experience</h3>
<p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
<div class="author-info">
<img src="../images/10-girl1.webp" alt="Another team member">
<div>
<h4>Aleksandar Popovski</h4>
<p>Graphic designer at MSOS</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="become-part-section">
<div class="become-part-header">
<h2>Become part of our amazing team</h2>
<p>We're a 100% remote team spread all across the world. Join us!</p>
</div>
<img src="../images/9-becomepart.webp" alt="Our amazing team in a classroom setting" class="team-photo">
<div class="contact-form-container">
<form class="contact-form">
<div class="form-row">
<div class="form-group">
<label for="first-name">First name</label>
<input type="text" id="first-name" placeholder="First name">
</div>
<div class="form-group">
<label for="last-name">Last name</label>
<input type="text" id="last-name" placeholder="Last name">
</div>
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" id="email" placeholder="student@email.com">
</div>
<div class="form-group">
<label for="phone-number">Phone number</label>
<div class="phone-input">
<select id="country-code" aria-label="Country code">
<option>US</option>
<option>SI</option>
<option>MK</option>
</select>
<input type="tel" id="phone-number" placeholder="+1 (555) 000-0000">
</div>
</div>
<div class="form-group">
<label for="message">Message</label>
<textarea id="message" rows="5"></textarea>
</div>
<div class="form-group checkbox-group">
<input type="checkbox" id="privacy-policy">
<label for="privacy-policy">You agree to our friendly <a href="#">privacy policy</a>.</label>
</div>
<button type="submit" class="btn btn-primary">Send message</button>
</form>
</div>
</section>
<section class="faq-section">
<div class="faq-header">
<h2>Frequently asked questions</h2>
<p>Everything you wanted to know about studying and living in Slovenia — in one place.</p>
</div>
<div class="faq-grid">
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-heart"></i></div>
<h3>How can I get a student visa or residence permit?</h3>
<p>Quick guide on what documents you need and how long it takes.</p>
</div>
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-sync-alt"></i></div>
<h3>What is the cost of living & housing in Slovenia?</h3>
<p>See average monthly expenses and where to find affordable housing.</p>
</div>
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-ban"></i></div>
<h3>Can I study in English, or do I need Slovene language?</h3>
<p>Find out which programs are in English—and when learning Slovene helps.</p>
</div>
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-plus-circle"></i></div>
<h3>Are there part-time jobs available? Can I work while studying?</h3>
<p>Learn about the student work possibilities and how to manage it while studying.</p>
</div>
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-credit-card"></i></div>
<h3>What student benefits and discounts are available?</h3>
<p>Ever heard of Boni? Student meal coupons that make eating out more affordable and planty more.</p>
</div>
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-envelope"></i></div>
<h3>What are tuition fees and are there scholarships?</h3>
<p>Info on tuition ranges and where to look for funding or fee waivers.</p>
</div>
</div>
<div class="faq-footer">
<div class="avatar-group">
<img src="../images/11-boy.webp" alt="Avatar 1" class="avatar">
<img src="../images/10-girl1.webp" alt="Avatar 2" class="avatar large">
<img src="../images/12-girl2.webp" alt="Avatar 3" class="avatar">
</div>
<h3>Still have questions?</h3>
<p>Cant find the answer youre looking for? Please chat to our friendly team.</p>
<button class="btn btn-primary-orange">See all FAQs</button>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2025 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

483
en/index.html.bak Normal file
View File

@ -0,0 +1,483 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>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 (corrected path) -->
<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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main>
<section class="hero-section">
<div class="hero-background"></div>
<div class="hero-overlay"></div>
<div class="hero-content">
<div class="heading-and-supporting-text">
<div class="badge-group">
<div class="badge-content">
<span class="message">First official Macedonian Student Organisation in Slovenia</span>
</div>
</div>
<h1>Empowering young people with skills to change the world</h1>
<p>Be part of our exciting journey; Become a part of our student organization today!</p>
</div>
<button class="btn btn-primary-orange">Become a member</button>
</div>
</section>
<section class="partners-section">
<div class="partners-container">
<img src="../images/2.%20Slo%20embassy%20in%20Skopje_mcd-1.webp" alt="Slovenian Embassy in Skopje logo">
<img src="../images/5.%20UL_EF-logoENG-HOR-CMYK_color-1.webp" alt="University of Ljubljana School of Economics and Business logo">
<img src="../images/3.%20Logo_NLB_Banka_CMYK_MAC-1.webp" alt="NLB Banka logo">
<img src="../images/1.%20mkd%20embassy%20in%20slovenia.webp" alt="Embassy of North Macedonia in Slovenia logo">
</div>
</section>
<section class="meet-the-team-section">
<div class="video-container">
<img src="../images/3.activites.webp" alt="Team members collaborating" class="video-thumbnail">
<div class="video-overlay"></div>
<button class="play-button" aria-label="Play video"></button>
</div>
<div class="team-content">
<h2>Every Student Has a Story Heres Ours</h2>
<p>Curious about what MSOS is all about? This video tells our story—fast, fun, and from the heart. See what makes MSOS special in our video—and hit “Learn more” to be part of the story.</p>
<a href="../en/about-us/" class="btn btn-secondary">Learn more</a>
</div>
</section>
<section class="activities-section">
<div class="activities-header">
<h2>Activities</h2>
<p>Our philosophy is simple — hire a team of diverse, passionate people and foster a culture that empowers you to do you best work.</p>
</div>
<div class="activities-content">
<div class="activities-nav">
<ul>
<li class="active">Student Support</li>
<li>Fun & Social Life</li>
<li>Education & Culture</li>
<li>Student Representation</li>
</ul>
<button class="btn btn-primary-orange">Become a member</button>
</div>
<div class="activity-details">
<p>We know moving to a new country can feel overwhelming, so were here to make it easier. From helping you with university applications to finding your way around student life in Slovenia, you can always count on us. We offer free consultations, answer your questions on Instagram and Facebook (yes, even late at night), and host events where you can meet others and hear real experiences first-hand. With mentorship, info sessions, and a friendly community by your side, youll never have to go through the journey alone.</p>
<img src="../images/img1-08.09.2025.webp" alt="Students receiving support and guidance">
</div>
</div>
</section>
<section class="latest-news-section">
<div class="news-header">
<h2>Latest news</h2>
<p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div>
<div class="news-articles">
<article class="news-card">
<img src="../images/4-billwalsh.webp" alt="Pink and blue tinted image of a snowy mountain peak">
<div class="card-content">
<p class="author">Alec Whitten • 17 Jan 2022</p>
<h3>Bill Walsh leadership lessons</h3>
<p>Like to know the secrets of transforming a 2-14 team into a 3x Super Bowl...</p>
</div>
</article>
<article class="news-card">
<img src="../images/5-pmmentals.webp" alt="A woman presenting in front of a whiteboard with sticky notes to a team">
<div class="card-content">
<p class="author">Demi Wilkinson • 16 Jan 2022</p>
<h3>PM mental models</h3>
<p>Mental models are simple expressions of complex processes or relationships.</p>
</div>
</article>
<article class="news-card">
<img src="../images/6-whatiswireframing.webp" alt="A modern computer desk setup with a large monitor, keyboard, and headphones">
<div class="card-content">
<p class="author">Candice Wu • 15 Jan 2022</p>
<h3>What is Wireframing?</h3>
<p>Introduction to Wireframing and its Principles. Learn from the best in the industry.</p>
</div>
</article>
</div>
<a href="../en/projects/" class="btn btn-secondary">See all</a>
</section>
<section class="testimonials-section">
<div class="testimonials-intro">
<h2>See what our partners say about us</h2>
<p>Everything you need to know about the product and billing.</p>
</div>
<div class="testimonials-columns">
<div class="testimonial-column">
<div class="testimonial-card">
<h3>How collaboration makes us better</h3>
<p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
<div class="author-info">
<img src="../images/7-graphicdesigner.webp" alt="Aleksandar Popovski">
<div>
<h4>Aleksandar Popovski</h4>
<p>Graphic designer at MSOS</p>
</div>
</div>
</div>
<div class="testimonial-card">
<h3>Consectetur vitae ac parturient massa</h3>
<p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra.</p>
<div class="author-info">
<img src="../images/11-boy.webp" alt="Another team member">
<div>
<h4>Aleksandar Popovski</h4>
<p>Graphic designer at MSOS</p>
</div>
</div>
</div>
</div>
<div class="testimonial-column column-offset">
<div class="testimonial-card">
<h3>Proud partners</h3>
<p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
<div class="author-info">
<img src="../images/12-girl2.webp" alt="Another partner">
<div>
<h4>Aleksandar Popovski</h4>
<p>Graphic designer at MSOS</p>
</div>
</div>
</div>
<div class="testimonial-card">
<h3>Our collaboration experience</h3>
<p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
<div class="author-info">
<img src="../images/10-girl1.webp" alt="Another team member">
<div>
<h4>Aleksandar Popovski</h4>
<p>Graphic designer at MSOS</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="become-part-section">
<div class="become-part-header">
<h2>Become part of our amazing team</h2>
<p>We're a 100% remote team spread all across the world. Join us!</p>
</div>
<img src="../images/9-becomepart.webp" alt="Our amazing team in a classroom setting" class="team-photo">
<div class="contact-form-container">
<form class="contact-form">
<div class="form-row">
<div class="form-group">
<label for="first-name">First name</label>
<input type="text" id="first-name" placeholder="First name">
</div>
<div class="form-group">
<label for="last-name">Last name</label>
<input type="text" id="last-name" placeholder="Last name">
</div>
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" id="email" placeholder="student@email.com">
</div>
<div class="form-group">
<label for="phone-number">Phone number</label>
<div class="phone-input">
<select id="country-code" aria-label="Country code">
<option>US</option>
<option>SI</option>
<option>MK</option>
</select>
<input type="tel" id="phone-number" placeholder="+1 (555) 000-0000">
</div>
</div>
<div class="form-group">
<label for="message">Message</label>
<textarea id="message" rows="5"></textarea>
</div>
<div class="form-group checkbox-group">
<input type="checkbox" id="privacy-policy">
<label for="privacy-policy">You agree to our friendly <a href="#">privacy policy</a>.</label>
</div>
<button type="submit" class="btn btn-primary">Send message</button>
</form>
</div>
</section>
<section class="faq-section">
<div class="faq-header">
<h2>Frequently asked questions</h2>
<p>Everything you wanted to know about studying and living in Slovenia — in one place.</p>
</div>
<div class="faq-grid">
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-heart"></i></div>
<h3>How can I get a student visa or residence permit?</h3>
<p>Quick guide on what documents you need and how long it takes.</p>
</div>
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-sync-alt"></i></div>
<h3>What is the cost of living & housing in Slovenia?</h3>
<p>See average monthly expenses and where to find affordable housing.</p>
</div>
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-ban"></i></div>
<h3>Can I study in English, or do I need Slovene language?</h3>
<p>Find out which programs are in English—and when learning Slovene helps.</p>
</div>
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-plus-circle"></i></div>
<h3>Are there part-time jobs available? Can I work while studying?</h3>
<p>Learn about the student work possibilities and how to manage it while studying.</p>
</div>
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-credit-card"></i></div>
<h3>What student benefits and discounts are available?</h3>
<p>Ever heard of Boni? Student meal coupons that make eating out more affordable and planty more.</p>
</div>
<div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-envelope"></i></div>
<h3>What are tuition fees and are there scholarships?</h3>
<p>Info on tuition ranges and where to look for funding or fee waivers.</p>
</div>
</div>
<div class="faq-footer">
<div class="avatar-group">
<img src="../images/11-boy.webp" alt="Avatar 1" class="avatar">
<img src="../images/10-girl1.webp" alt="Avatar 2" class="avatar large">
<img src="../images/12-girl2.webp" alt="Avatar 3" class="avatar">
</div>
<h3>Still have questions?</h3>
<p>Cant find the answer youre looking for? Please chat to our friendly team.</p>
<button class="btn btn-primary-orange">See all FAQs</button>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2023 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

338
en/projects/index.html Normal file
View File

@ -0,0 +1,338 @@
<!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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">privacy policy</a></p>
</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: Meet Student Slovenia 2024 -->
<article class="post-card">
<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">
<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">
<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">
<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>
<!-- Placeholder Project 1 -->
<article class="post-card">
<a href="testproject/" class="post-link">
<img src="../../images/4-billwalsh.webp" alt="Pink and blue tinted image of a snowy mountain peak" class="post-image">
<div class="post-content">
<p class="post-meta">Alec Whitten • 17 Jan 2022 • Public announcement</p>
<h3 class="post-title">Bill Walsh leadership lessons</h3>
<p class="post-excerpt">Like to know the secrets of transforming a 2-14 team into a 3x Super Bowl winning Dynasty?</p>
</div>
</a>
</article>
<!-- Placeholder Project 2 -->
<article class="post-card">
<a href="testproject/" class="post-link">
<img src="../../images/5-pmmentals.webp" alt="A woman presenting in front of a whiteboard with sticky notes to a team" class="post-image">
<div class="post-content">
<p class="post-meta">Demi Wilkinson • 16 Jan 2022 • Student life</p>
<h3 class="post-title">PM mental models</h3>
<p class="post-excerpt">Mental models are simple expressions of complex processes or relationships.</p>
</div>
</a>
</article>
</div>
<!-- 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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2025 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

338
en/projects/index.html.bak Normal file
View File

@ -0,0 +1,338 @@
<!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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">privacy policy</a></p>
</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: Meet Student Slovenia 2024 -->
<article class="post-card">
<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">
<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">
<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">
<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>
<!-- Placeholder Project 1 -->
<article class="post-card">
<a href="testproject/" class="post-link">
<img src="../../images/4-billwalsh.webp" alt="Pink and blue tinted image of a snowy mountain peak" class="post-image">
<div class="post-content">
<p class="post-meta">Alec Whitten • 17 Jan 2022 • Public announcement</p>
<h3 class="post-title">Bill Walsh leadership lessons</h3>
<p class="post-excerpt">Like to know the secrets of transforming a 2-14 team into a 3x Super Bowl winning Dynasty?</p>
</div>
</a>
</article>
<!-- Placeholder Project 2 -->
<article class="post-card">
<a href="testproject/" class="post-link">
<img src="../../images/5-pmmentals.webp" alt="A woman presenting in front of a whiteboard with sticky notes to a team" class="post-image">
<div class="post-content">
<p class="post-meta">Demi Wilkinson • 16 Jan 2022 • Student life</p>
<h3 class="post-title">PM mental models</h3>
<p class="post-excerpt">Mental models are simple expressions of complex processes or relationships.</p>
</div>
</a>
</article>
</div>
<!-- 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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2023 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,375 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Macedonian Student Night in Ljubljana - MSOS</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" />
<!-- Correct path 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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<!-- Sticky Mobile Header -->
<div class="mobile-article-header">
<span id="mobile-article-title">Macedonian Student Night in Ljubljana</span>
<i class="fas fa-chevron-down"></i>
<div class="progress-bar-container">
<div class="progress-bar"></div>
</div>
<!-- Dropdown Menu for Mobile -->
<div class="mobile-scrollspy-dropdown">
<ul id="mobile-scrollspy-links">
<!-- Links will be dynamically inserted here by JavaScript -->
</ul>
</div>
</div>
<div class="article-layout-container">
<!-- Desktop Scrollspy Sidebar -->
<aside class="article-sidebar">
<nav class="scrollspy-nav">
<ul>
<li><a href="#idea-to-movement" class="active">Idea to Movement</a></li>
<li><a href="#taste-of-macedonia">The Taste of Macedonia</a></li>
<li><a href="#community-support">Community Support</a></li>
<li><a href="#a-beginning">A Beginning to Remember</a></li>
</ul>
</nav>
</aside>
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Published on October 8, 2022</p>
<h1>Macedonian Student Night in Ljubljana</h1>
<p class="article-subtitle">From an idea to a party with 500 students that's how our story began!</p>
</header>
<figure class="article-main-image">
<img src="../../../images/msnl-1.webp" alt="Atmosphere from the Macedonian Student Night in Ljubljana">
</figure>
<div class="article-body">
<p>On October 8, 2022, in the heart of the Student Campus in Ljubljana, the first Macedonian Student Night in Slovenia took place. Under the motto #FeelsLikeHome, more than 500 young people enjoyed Macedonian music, delicious traditional food, and an atmosphere that felt like home. This event was not just a party it was the beginning of a new story, which would later grow into the Macedonian Student Organization in Slovenia (MSOS).</p>
<h2 id="idea-to-movement">How an idea for socializing became the start of a movement</h2>
<p>It all began with a simple wish to gather, get to know each other, and feel Macedonia, even though we were far from it. Kristijan Popovski, then a student at the School of Economics and Business in Ljubljana, shared his idea with a few colleagues, and the response was incredible. In less than two weeks, over 40 students joined the organizing team. Everyone contributed their enthusiasm and time, and the shared spirit and desire to connect turned this spontaneous initiative into an event we would remember for a long time.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-2.webp" alt="Preparations and meetings for the Macedonian Student Night">
<figcaption>Photos from the preparations and meetings for organizing the Macedonian Student Night.</figcaption>
</figure>
<p>From that moment on, we spent every free moment in the offices of the student organization <strong>Povezani</strong>, which gave us great support in organizing. Days and nights were spent planning, holding meetings, and writing social media posts all with the goal of creating an event that we initially thought would attract, if we were lucky, about 100 visitors.</p>
<p>A week before the event, we posted interesting facts about Macedonia every day its national treasures, music, and culture. Slowly but surely, we built the atmosphere and excitement, not only among Macedonian students but also among many others who wanted to feel our energy.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-3.webp" alt="Poster where Slovenians learn the Macedonian alphabet">
<figcaption>Poster with Cyrillic and Latin letters. Slovenians are learning the Macedonian alphabet, while Macedonians are teaching them.</figcaption>
</figure>
<blockquote class="article-quote">
<p>“Organizing the first MSOS party was a one-of-a-kind experience sleepless, ambitious, and involved in everything from logistics to mopping the floor... Thank goodness for Red Bull 😉 (P.S. We drank the entire fridge supply!)”</p>
<footer>— Marko - first-year student (at the time)</footer>
</blockquote>
<h2 id="taste-of-macedonia">The taste and smell of Macedonia in the heart of Ljubljana</h2>
<p>The party started at 8:00 PM and was designed in two parts. The first part was a real gastronomic and cultural journey through Macedonia. Students could try bread with ajvar and white cheese, Macedonian wine, tasty snacks, and traditional drinks. The tables were also filled with other authentic products that reminded everyone of home. All these flavors and aromas were made possible thanks to the support of the Macedonian products store <strong>“Makedonija Trade,”</strong> which selflessly contributed to making this part of the evening truly enjoyable.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-4.webp" alt="Stands with Macedonian symbols, food, and drinks">
<figcaption>Photos of the stands with Macedonian symbols, traditional food, and drinks.</figcaption>
</figure>
<p>In addition to the food, visitors could explore interesting facts about the country, photos of famous Macedonian figures and cultural landmarks, and see traditional costumes and a <strong>gaida</strong> up close. The atmosphere was warm and full of curiosity like a small exhibition within a large student party.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-5.webp" alt="Mini quiz about Macedonia">
<figcaption>Mini quiz with questions about Macedonia, where students in one part of the club are competing.</figcaption>
</figure>
<h2 id="community-support">Support from the Macedonian community and diplomacy</h2>
<p>The evening was enriched by the presence of important guests from the Macedonian community in Slovenia. <strong>The President of the Union of Macedonian Cultural Associations in Slovenia, Mr. Blagoja Nasteski</strong>, joined the event, confirming the importance of such initiatives for preserving the Macedonian spirit and tradition in the diaspora.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-6.webp" alt="Kristijan and Bisera with Ambassador Zelenkovska and Mr. Nasteski">
<figcaption>Kristijan and Bisera together with Ambassador Zelenkovska and the President of the Union of Macedonian Associations, Mr. Nasteski</figcaption>
</figure>
<p>We were especially honored to <strong>welcome the Ambassador of North Macedonia to Slovenia, Mrs. Suzana Zelenkovska</strong>, who gave warm words of encouragement and support to the youth. Her presence and interest in the event were an additional motivation to continue our mission of connecting and promoting the Macedonian student community.</p>
<p>The party had great energy spreading everywhere at one point there was a small but controlled chaos. Even though the event ended slightly earlier than planned, the students kept singing together for another hour while we were cleaning up the place. Truly, a night to remember!</p>
<blockquote class="article-quote">
<p>“I was part of the organizing team and was supposed to maintain order among the students, but when they played the song 'Biser Balkanski,' I couldn't resist so I joined in as well... That was my special moment that night!”</p>
<footer>— Hristijan - second-year student (at the time)</footer>
</blockquote>
<h2 id="a-beginning">A beginning to remember</h2>
<p>That night wasn't just another student party it was the moment we realized we had started something bigger. Instead of the expected 100 guests, about <strong>500 students</strong> came to the club, and the energy was incredible. New friendships were made, songs were sung from the heart, and Macedonian culture and tradition took center stage for the entire evening.</p>
<p>This night laid the foundation for the Macedonian Student Organization in Slovenia and showed us that with enthusiasm, unity, and a bit of courage, it's possible to create something that brings people together and gives them a sense of home even when they are far away from it.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-7.webp" alt="The dedicated team of volunteers after cleaning up the venue">
<figcaption>Photo taken at 4:00 a.m., after finishing and cleaning up the venue together with the dedicated team of volunteers</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../../images/about_kristijan_min.webp" alt="Avatar of Kristijan Popovski">
<div class="author-text">
<p class="author-name">Kristijan Popovski</p>
<p class="author-title">President and Founder</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
</div>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Join 2,000+ subscribers</h2>
<p>Stay in the loop with everything you need to know.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="#">privacy policy</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2025 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,368 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Macedonian Student Night in Ljubljana - MSOS</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" />
<!-- Correct path to the main CSS file -->
<link rel="stylesheet" href="../../../css/main.css">
</head>
<body>
<!-- START_HEADER -->
<header class="dropdown-header-navigation">
<div class="container">
<a href="../../../en/" class="logo-link">
<img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
</a>
<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, mission, vision & core values</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/">Event & Projects</a></li>
<li><a href="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
</div>
<div class="mobile-menu-icon">
<i class="fas fa-bars"></i>
<i class="fas fa-times"></i>
</div>
</div>
</header>
<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, mission, vision & core values</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/">Event & Projects</a></li>
<li><a href="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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>
<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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<!-- Sticky Mobile Header -->
<div class="mobile-article-header">
<span id="mobile-article-title">Macedonian Student Night in Ljubljana</span>
<i class="fas fa-chevron-down"></i>
<div class="progress-bar-container">
<div class="progress-bar"></div>
</div>
<!-- Dropdown Menu for Mobile -->
<div class="mobile-scrollspy-dropdown">
<ul id="mobile-scrollspy-links">
<!-- Links will be dynamically inserted here by JavaScript -->
</ul>
</div>
</div>
<div class="article-layout-container">
<!-- Desktop Scrollspy Sidebar -->
<aside class="article-sidebar">
<nav class="scrollspy-nav">
<ul>
<li><a href="#idea-to-movement" class="active">Idea to Movement</a></li>
<li><a href="#taste-of-macedonia">The Taste of Macedonia</a></li>
<li><a href="#community-support">Community Support</a></li>
<li><a href="#a-beginning">A Beginning to Remember</a></li>
</ul>
</nav>
</aside>
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Published on October 8, 2022</p>
<h1>Macedonian Student Night in Ljubljana</h1>
<p class="article-subtitle">From an idea to a party with 500 students that's how our story began!</p>
</header>
<figure class="article-main-image">
<img src="../../../images/msnl-1.webp" alt="Atmosphere from the Macedonian Student Night in Ljubljana">
</figure>
<div class="article-body">
<p>On October 8, 2022, in the heart of the Student Campus in Ljubljana, the first Macedonian Student Night in Slovenia took place. Under the motto #FeelsLikeHome, more than 500 young people enjoyed Macedonian music, delicious traditional food, and an atmosphere that felt like home. This event was not just a party it was the beginning of a new story, which would later grow into the Macedonian Student Organization in Slovenia (MSOS).</p>
<h2 id="idea-to-movement">How an idea for socializing became the start of a movement</h2>
<p>It all began with a simple wish to gather, get to know each other, and feel Macedonia, even though we were far from it. Kristijan Popovski, then a student at the School of Economics and Business in Ljubljana, shared his idea with a few colleagues, and the response was incredible. In less than two weeks, over 40 students joined the organizing team. Everyone contributed their enthusiasm and time, and the shared spirit and desire to connect turned this spontaneous initiative into an event we would remember for a long time.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-2.webp" alt="Preparations and meetings for the Macedonian Student Night">
<figcaption>Photos from the preparations and meetings for organizing the Macedonian Student Night.</figcaption>
</figure>
<p>From that moment on, we spent every free moment in the offices of the student organization <strong>Povezani</strong>, which gave us great support in organizing. Days and nights were spent planning, holding meetings, and writing social media posts all with the goal of creating an event that we initially thought would attract, if we were lucky, about 100 visitors.</p>
<p>A week before the event, we posted interesting facts about Macedonia every day its national treasures, music, and culture. Slowly but surely, we built the atmosphere and excitement, not only among Macedonian students but also among many others who wanted to feel our energy.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-3.webp" alt="Poster where Slovenians learn the Macedonian alphabet">
<figcaption>Poster with Cyrillic and Latin letters. Slovenians are learning the Macedonian alphabet, while Macedonians are teaching them.</figcaption>
</figure>
<blockquote class="article-quote">
<p>“Organizing the first MSOS party was a one-of-a-kind experience sleepless, ambitious, and involved in everything from logistics to mopping the floor... Thank goodness for Red Bull 😉 (P.S. We drank the entire fridge supply!)”</p>
<footer>— Marko - first-year student (at the time)</footer>
</blockquote>
<h2 id="taste-of-macedonia">The taste and smell of Macedonia in the heart of Ljubljana</h2>
<p>The party started at 8:00 PM and was designed in two parts. The first part was a real gastronomic and cultural journey through Macedonia. Students could try bread with ajvar and white cheese, Macedonian wine, tasty snacks, and traditional drinks. The tables were also filled with other authentic products that reminded everyone of home. All these flavors and aromas were made possible thanks to the support of the Macedonian products store <strong>“Makedonija Trade,”</strong> which selflessly contributed to making this part of the evening truly enjoyable.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-4.webp" alt="Stands with Macedonian symbols, food, and drinks">
<figcaption>Photos of the stands with Macedonian symbols, traditional food, and drinks.</figcaption>
</figure>
<p>In addition to the food, visitors could explore interesting facts about the country, photos of famous Macedonian figures and cultural landmarks, and see traditional costumes and a <strong>gaida</strong> up close. The atmosphere was warm and full of curiosity like a small exhibition within a large student party.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-5.webp" alt="Mini quiz about Macedonia">
<figcaption>Mini quiz with questions about Macedonia, where students in one part of the club are competing.</figcaption>
</figure>
<h2 id="community-support">Support from the Macedonian community and diplomacy</h2>
<p>The evening was enriched by the presence of important guests from the Macedonian community in Slovenia. <strong>The President of the Union of Macedonian Cultural Associations in Slovenia, Mr. Blagoja Nasteski</strong>, joined the event, confirming the importance of such initiatives for preserving the Macedonian spirit and tradition in the diaspora.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-6.webp" alt="Kristijan and Bisera with Ambassador Zelenkovska and Mr. Nasteski">
<figcaption>Kristijan and Bisera together with Ambassador Zelenkovska and the President of the Union of Macedonian Associations, Mr. Nasteski</figcaption>
</figure>
<p>We were especially honored to <strong>welcome the Ambassador of North Macedonia to Slovenia, Mrs. Suzana Zelenkovska</strong>, who gave warm words of encouragement and support to the youth. Her presence and interest in the event were an additional motivation to continue our mission of connecting and promoting the Macedonian student community.</p>
<p>The party had great energy spreading everywhere at one point there was a small but controlled chaos. Even though the event ended slightly earlier than planned, the students kept singing together for another hour while we were cleaning up the place. Truly, a night to remember!</p>
<blockquote class="article-quote">
<p>“I was part of the organizing team and was supposed to maintain order among the students, but when they played the song 'Biser Balkanski,' I couldn't resist so I joined in as well... That was my special moment that night!”</p>
<footer>— Hristijan - second-year student (at the time)</footer>
</blockquote>
<h2 id="a-beginning">A beginning to remember</h2>
<p>That night wasn't just another student party it was the moment we realized we had started something bigger. Instead of the expected 100 guests, about <strong>500 students</strong> came to the club, and the energy was incredible. New friendships were made, songs were sung from the heart, and Macedonian culture and tradition took center stage for the entire evening.</p>
<p>This night laid the foundation for the Macedonian Student Organization in Slovenia and showed us that with enthusiasm, unity, and a bit of courage, it's possible to create something that brings people together and gives them a sense of home even when they are far away from it.</p>
<figure class="article-inline-image">
<img src="../../../images/msnl-7.webp" alt="The dedicated team of volunteers after cleaning up the venue">
<figcaption>Photo taken at 4:00 a.m., after finishing and cleaning up the venue together with the dedicated team of volunteers</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../../images/about_kristijan_min.webp" alt="Avatar of Kristijan Popovski">
<div class="author-text">
<p class="author-name">Kristijan Popovski</p>
<p class="author-title">President and Founder</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
</div>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Join 2,000+ subscribers</h2>
<p>Stay in the loop with everything you need to know.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="#">privacy policy</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2023 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,347 @@
<!DOCTYPE html>
<html lang="mk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Македонска студентска вечер во Љубљана - МСОС</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" />
<!-- Povezava na novo glavno CSS datoteko -->
<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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Објавено на 8 октомври 2022</p>
<h1>Македонска студентска вечер во Љубљана</h1>
<p class="article-subtitle">Од идеја до журка со 500 студенти вака започна нашата приказна!</p>
</header>
<figure class="article-main-image">
<img src="../../images/msnl-1.webp" alt="Атмосфера од македонската студентска вечер во Љубљана">
</figure>
<div class="article-body">
<p>На 8 октомври 2022 година, во срцето на Студентскиот кампус во Љубљана, се одржа првата македонска студентска вечер во Словенија. Под мотото #FeelsLikeHome, повеќе од 500 млади уживаа во македонска музика, вкусна традиционална храна и атмосфера која потсетуваше на дома. Овој настан не беше само журка беше почеток на една нова приказна, која подоцна ќе прерасне во Македонска студентска организација во Словенија (МСОС).</p>
<h2>Како една идеја за дружење стана почеток на движење</h2>
<p>Сè започна со едноставна желба да се собереме, да се запознаеме и да ја почувствуваме Македонија, иако сме далеку од неа. Кристијан Поповски, тогаш студент на Економскиот факултет во Љубљана, ја сподели својата идеја со неколку колеги, а одговорот беше неверојатен. За помалку од две недели, преку 40 студенти се пријавија во организацискиот тим. Секој понесе дел од својот ентузијазам и време, а заедничкиот дух и желбата за поврзување ја претворија оваа спонтана иницијатива во настан што долго ќе го паметиме.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-2.webp" alt="Подготовки и состаноци за македонската студентска вечер">
<figcaption>Фотографии од подготовките и состаноците за организирање на македонската студентска вечер</figcaption>
</figure>
<p>Од тој момент, секој слободен миг го поминувавме во канцелариите на студентската организација <strong>„Повезани“</strong>, кои ни дадоа голема поддршка во организирањето. Денови и ноќи правевме планови, одржувавме состаноци, пишувавме објави на социјалните мрежи сè со цел да создадеме настан кој првично мислевме дека ќе привлече, ако имаме среќа, околу 100 посетители.</p>
<p>Една недела пред настанот, секој ден објавувавме интересни факти за Македонија, нејзините национални богатства, музика и култура. Полека, но сигурно, ја градевме атмосферата и ентузијазмот, не само кај македонските студенти, туку и кај многу други кои сакаа да ја почувствуваат нашата енергија.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-3.webp" alt="Хамер со испишани кирилични и латинични букви">
<figcaption>Хамер со испишани кирилични и латинични букви. Словенците ја учат македонската азбука, додека македонците ги подучуваат.</figcaption>
</figure>
<blockquote class="article-quote">
<p>„Организирањето на првата МСОС журка беше уникатно искуство без сон, амбициозни и вклучени во сè, од логистика до бришење на подот... Среќа што постои Red Bull 😉 (П.с. целиот фрижидер го испивме!)“</p>
<footer>— Марко студент во прва година</footer>
</blockquote>
<h2>Вкусот и мирисот на Македонија во срцето на Љубљана</h2>
<p>Журката започна во 20:00 часот и беше замислена во два дела. Првиот дел беше вистинско гастрономско и културно патување низ Македонија. Студентите можеа да пробаат лебчиња со ајвар и биено сирење, македонско вино, вкусни грицки и традиционални пијалоци. На масите имаше изложени и други автентични производи што сите ги потсетуваа на дома. Сите овие вкусови и мириси беа овозможени благодарение на поддршката од продавницата за македонски производи <strong>„Македонија Трејд“</strong>, кои несебично придонесоа овој дел од вечерта да биде вистинско уживање.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-4.webp" alt="Штандови со македонски обележја, традиционална храна и пијалаци">
<figcaption>Фотографии од штандовите со македонски обележја, традиционална храна и пијалаци.</figcaption>
</figure>
<p>Покрај храната, посетителите можеа да разгледаат интересни факти за државата, фотографии од познати македонски дејци и културни знаменитости, како и да видат традиционални носии и <strong>гајда</strong> одблиску. Атмосферата беше топла и полна со љубопитност како мала изложба во рамките на една голема студентска забава.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-5.webp" alt="Мини квиз со прашања за Македонија">
<figcaption>Мини квиз со прашања за Македонија, каде студентите во едниот дел од клубот се натпреваруваат</figcaption>
</figure>
<h2>Поддршка од македонската заедница и дипломатијата</h2>
<p>Вечерта беше збогатена и со присуството на важни гости од македонската заедница во Словенија. На настанот ни се придружи <strong>претседателот на Сојузот на македонските културни друштва во Словенија, г-н Благоја Настески</strong>, кој со своето присуство ја потврди важноста на ваквите иницијативи за одржување на македонскиот дух и традиција во дијаспората.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-6.webp" alt="Кристијан и Бисера заедно со амбасадорката Зеленковска и претседателот г-н Настески">
<figcaption>Кристијан и Бисера заедно со амбасадорката Зеленковска и претседателот на Сојузот на македонски друштва, г-н Настески</figcaption>
</figure>
<p>Посебна чест ни беше да ја пречекаме и <strong>амбасадорката на Северна Македонија во Словенија, г-ѓа Сузана Зеленковска</strong>, која упати топли зборови на охрабрување и поддршка за младите. Нејзиното присуство и интерес за настанот беа дополнителен мотив да продолжиме со нашата мисија за поврзување и афирмација на македонската студентска заедница.</p>
<p>Журката беше одлична, со супер енергија што се шири насекаде. Студенти на сите страни и во еден момент владееше мал, но контролиран хаос вистинско место каде што успеавме да се избориме и да направиме еден навистина одличен настан. Иако ја завршивме журката малку порано, студентите не престанаа уште еден час да пеат заедно со нас, како што го расчистувавме местото. Навистина, ноќ за паметење!</p>
<blockquote class="article-quote">
<p>„Бев дел од тимот за организација и требаше да одржувам ред и мир меѓу студентите, ама кога ми ја пуштија песната ‘Бисер Балкански’ не издржав па им се приклучив и јас... Тоа беше мојот специјален момент таа вечер!“</p>
<footer>— Христијан студент во втора година</footer>
</blockquote>
<h2>Почеток што ќе го паметиме</h2>
<p>Таа вечер не беше само уште една студентска забава беше моментот кога сфативме дека сме започнале нешто поголемо. Наместо очекуваните 100 гости, во клубот влегоа околу <strong>500 студенти</strong>, а енергијата беше неверојатна. Се создадоа нови пријателства, се слушаа песни што ги пеевме од срце, а македонската култура и традиција беа во прв план цела вечер.</p>
<p>Оваа ноќ го постави темелот за Македонската студентска организација во Словенија и ни покажа дека со ентузијазам, заедништво и малку храброст, може да се создаде нешто што ќе ги обедини луѓето и ќе им даде чувство на дом дури и кога се далеку од него.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-7.webp" alt="Посветениот тим на волонтери по завршувањето на настанот">
<figcaption>Фотографија направена во 4 часот наутро, по завршувањето и средувањето на просторот заедно со посветениот тим на волонтери</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../images/11-boy.webp" alt="Аватар на Кристијан Поповски">
<div class="author-text">
<p class="author-name">Кристијан Поповски</p>
<p class="author-title">Претседател и основач</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Копирај линк</button>
<a href="#" class="social-icon-btn" aria-label="Сподели на Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Сподели на Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Сподели на LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Придружете се на 2.000+ претплатници</h2>
<p>Останете во тек со сè што треба да знаете.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Внесете ја вашата е-пошта">
</div>
<button type="submit" class="btn btn-primary-orange">Претплати се</button>
</form>
<p class="privacy-note">Ние се грижиме за вашите податоци во нашата <a href="#">политика за приватност</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2025 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,347 @@
<!DOCTYPE html>
<html lang="mk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Македонска студентска вечер во Љубљана - МСОС</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" />
<!-- Povezava na novo glavno CSS datoteko -->
<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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Објавено на 8 октомври 2022</p>
<h1>Македонска студентска вечер во Љубљана</h1>
<p class="article-subtitle">Од идеја до журка со 500 студенти вака започна нашата приказна!</p>
</header>
<figure class="article-main-image">
<img src="../../images/msnl-1.webp" alt="Атмосфера од македонската студентска вечер во Љубљана">
</figure>
<div class="article-body">
<p>На 8 октомври 2022 година, во срцето на Студентскиот кампус во Љубљана, се одржа првата македонска студентска вечер во Словенија. Под мотото #FeelsLikeHome, повеќе од 500 млади уживаа во македонска музика, вкусна традиционална храна и атмосфера која потсетуваше на дома. Овој настан не беше само журка беше почеток на една нова приказна, која подоцна ќе прерасне во Македонска студентска организација во Словенија (МСОС).</p>
<h2>Како една идеја за дружење стана почеток на движење</h2>
<p>Сè започна со едноставна желба да се собереме, да се запознаеме и да ја почувствуваме Македонија, иако сме далеку од неа. Кристијан Поповски, тогаш студент на Економскиот факултет во Љубљана, ја сподели својата идеја со неколку колеги, а одговорот беше неверојатен. За помалку од две недели, преку 40 студенти се пријавија во организацискиот тим. Секој понесе дел од својот ентузијазам и време, а заедничкиот дух и желбата за поврзување ја претворија оваа спонтана иницијатива во настан што долго ќе го паметиме.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-2.webp" alt="Подготовки и состаноци за македонската студентска вечер">
<figcaption>Фотографии од подготовките и состаноците за организирање на македонската студентска вечер</figcaption>
</figure>
<p>Од тој момент, секој слободен миг го поминувавме во канцелариите на студентската организација <strong>„Повезани“</strong>, кои ни дадоа голема поддршка во организирањето. Денови и ноќи правевме планови, одржувавме состаноци, пишувавме објави на социјалните мрежи сè со цел да создадеме настан кој првично мислевме дека ќе привлече, ако имаме среќа, околу 100 посетители.</p>
<p>Една недела пред настанот, секој ден објавувавме интересни факти за Македонија, нејзините национални богатства, музика и култура. Полека, но сигурно, ја градевме атмосферата и ентузијазмот, не само кај македонските студенти, туку и кај многу други кои сакаа да ја почувствуваат нашата енергија.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-3.webp" alt="Хамер со испишани кирилични и латинични букви">
<figcaption>Хамер со испишани кирилични и латинични букви. Словенците ја учат македонската азбука, додека македонците ги подучуваат.</figcaption>
</figure>
<blockquote class="article-quote">
<p>„Организирањето на првата МСОС журка беше уникатно искуство без сон, амбициозни и вклучени во сè, од логистика до бришење на подот... Среќа што постои Red Bull 😉 (П.с. целиот фрижидер го испивме!)“</p>
<footer>— Марко студент во прва година</footer>
</blockquote>
<h2>Вкусот и мирисот на Македонија во срцето на Љубљана</h2>
<p>Журката започна во 20:00 часот и беше замислена во два дела. Првиот дел беше вистинско гастрономско и културно патување низ Македонија. Студентите можеа да пробаат лебчиња со ајвар и биено сирење, македонско вино, вкусни грицки и традиционални пијалоци. На масите имаше изложени и други автентични производи што сите ги потсетуваа на дома. Сите овие вкусови и мириси беа овозможени благодарение на поддршката од продавницата за македонски производи <strong>„Македонија Трејд“</strong>, кои несебично придонесоа овој дел од вечерта да биде вистинско уживање.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-4.webp" alt="Штандови со македонски обележја, традиционална храна и пијалаци">
<figcaption>Фотографии од штандовите со македонски обележја, традиционална храна и пијалаци.</figcaption>
</figure>
<p>Покрај храната, посетителите можеа да разгледаат интересни факти за државата, фотографии од познати македонски дејци и културни знаменитости, како и да видат традиционални носии и <strong>гајда</strong> одблиску. Атмосферата беше топла и полна со љубопитност како мала изложба во рамките на една голема студентска забава.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-5.webp" alt="Мини квиз со прашања за Македонија">
<figcaption>Мини квиз со прашања за Македонија, каде студентите во едниот дел од клубот се натпреваруваат</figcaption>
</figure>
<h2>Поддршка од македонската заедница и дипломатијата</h2>
<p>Вечерта беше збогатена и со присуството на важни гости од македонската заедница во Словенија. На настанот ни се придружи <strong>претседателот на Сојузот на македонските културни друштва во Словенија, г-н Благоја Настески</strong>, кој со своето присуство ја потврди важноста на ваквите иницијативи за одржување на македонскиот дух и традиција во дијаспората.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-6.webp" alt="Кристијан и Бисера заедно со амбасадорката Зеленковска и претседателот г-н Настески">
<figcaption>Кристијан и Бисера заедно со амбасадорката Зеленковска и претседателот на Сојузот на македонски друштва, г-н Настески</figcaption>
</figure>
<p>Посебна чест ни беше да ја пречекаме и <strong>амбасадорката на Северна Македонија во Словенија, г-ѓа Сузана Зеленковска</strong>, која упати топли зборови на охрабрување и поддршка за младите. Нејзиното присуство и интерес за настанот беа дополнителен мотив да продолжиме со нашата мисија за поврзување и афирмација на македонската студентска заедница.</p>
<p>Журката беше одлична, со супер енергија што се шири насекаде. Студенти на сите страни и во еден момент владееше мал, но контролиран хаос вистинско место каде што успеавме да се избориме и да направиме еден навистина одличен настан. Иако ја завршивме журката малку порано, студентите не престанаа уште еден час да пеат заедно со нас, како што го расчистувавме местото. Навистина, ноќ за паметење!</p>
<blockquote class="article-quote">
<p>„Бев дел од тимот за организација и требаше да одржувам ред и мир меѓу студентите, ама кога ми ја пуштија песната ‘Бисер Балкански’ не издржав па им се приклучив и јас... Тоа беше мојот специјален момент таа вечер!“</p>
<footer>— Христијан студент во втора година</footer>
</blockquote>
<h2>Почеток што ќе го паметиме</h2>
<p>Таа вечер не беше само уште една студентска забава беше моментот кога сфативме дека сме започнале нешто поголемо. Наместо очекуваните 100 гости, во клубот влегоа околу <strong>500 студенти</strong>, а енергијата беше неверојатна. Се создадоа нови пријателства, се слушаа песни што ги пеевме од срце, а македонската култура и традиција беа во прв план цела вечер.</p>
<p>Оваа ноќ го постави темелот за Македонската студентска организација во Словенија и ни покажа дека со ентузијазам, заедништво и малку храброст, може да се создаде нешто што ќе ги обедини луѓето и ќе им даде чувство на дом дури и кога се далеку од него.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-7.webp" alt="Посветениот тим на волонтери по завршувањето на настанот">
<figcaption>Фотографија направена во 4 часот наутро, по завршувањето и средувањето на просторот заедно со посветениот тим на волонтери</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../images/11-boy.webp" alt="Аватар на Кристијан Поповски">
<div class="author-text">
<p class="author-name">Кристијан Поповски</p>
<p class="author-title">Претседател и основач</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Копирај линк</button>
<a href="#" class="social-icon-btn" aria-label="Сподели на Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Сподели на Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Сподели на LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Придружете се на 2.000+ претплатници</h2>
<p>Останете во тек со сè што треба да знаете.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Внесете ја вашата е-пошта">
</div>
<button type="submit" class="btn btn-primary-orange">Претплати се</button>
</form>
<p class="privacy-note">Ние се грижиме за вашите податоци во нашата <a href="#">политика за приватност</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2023 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,401 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Meet Student Slovenia 2023 - MSOS</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" />
<!-- Correct path 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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<!-- Sticky Mobile Header -->
<div class="mobile-article-header">
<span id="mobile-article-title">Meet Student Slovenia 2023</span>
<i class="fas fa-chevron-down"></i>
<div class="progress-bar-container">
<div class="progress-bar"></div>
</div>
<!-- Dropdown Menu for Mobile -->
<div class="mobile-scrollspy-dropdown">
<ul id="mobile-scrollspy-links">
<!-- Links will be dynamically inserted here by JavaScript -->
</ul>
</div>
</div>
<div class="article-layout-container">
<!-- Desktop Scrollspy Sidebar -->
<aside class="article-sidebar">
<nav class="scrollspy-nav">
<ul>
<li><a href="#student-life" class="active">Behind student life in Slovenia</a></li>
<li><a href="#inspiring-voices">Voices that inspire</a></li>
<li><a href="#behind-the-scenes">Behind the scenes our supporters</a></li>
<li><a href="#why-special">Why was it special?</a></li>
<li><a href="#practical-advice">Practical advice first-hand</a></li>
<li><a href="#livestream">For those not physically present</a></li>
<li><a href="#see-you">See you in Slovenia!</a></li>
</ul>
</nav>
</aside>
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Published on September 18, 2023</p>
<h1>Meet Student Slovenia 2023</h1>
<p class="article-subtitle">Through honest first-hand stories, future students received support for their first step towards their new home.</p>
</header>
<figure class="article-main-image">
<img src="../../../images/event3-photo-1.webp" alt="Panel discussion at the 'Meet Student Slovenia 2023' event">
</figure>
<div class="article-body">
<p>What does the first step towards student life in Slovenia look like? We tried to answer this question through the event "Meet Student Slovenia," which we organized on September 18, 2023, at the NLB Gallery in Skopje. The atmosphere was full of excitement more than 100 future students and their families came with the same feeling: a desire to discover what awaits them where they will start their new chapter.</p>
<h2 id="student-life">What lies behind student life in Slovenia?</h2>
<p>Instead of dry information, students had the opportunity to hear real stories from those who are already walking the same path. Students from Ljubljana, Maribor, and Koper talked about their challenges, first impressions, funny situations, and moments when community support was crucial. And the audience? They absorbed everything with great attention, because exactly those questions that are never written in brochures here they received honest answers.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-2.webp" alt="Participants of the panel discussion">
<figcaption>Igor Arsov from the University of Primorska recounts his student experience at the Faculty of Management.</figcaption>
</figure>
<h2 id="inspiring-voices">Voices that inspire</h2>
<p>Our members Kiara Lazić, Angel Naumov, Klimentina Čapovska, and Igor Arsov appeared on stage each with their own story, their own faculty, their own city. Together with moderator Leon Šumanski and host Vasil Hanџiski, they transformed the panel into a real conversation that felt more like a friendly get-together than a formal discussion. They talked about exams, new friendships, life in student dorms, and how important it is not to give up even when things seem hardest.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-3.webp" alt="Vasil Hanџiski at the opening of the event">
<figcaption>Photograph from the opening of the event with the host Vasil Hanџiski.</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-4.webp" alt="The audience at the event">
<figcaption>Photograph of the event participants. We were a little surprised by the interest, but somehow we managed to fit everyone!♡</figcaption>
</figure>
<h2 id="behind-the-scenes">Behind the scenes our supporters</h2>
<p>The event would not have been possible without the support of the Embassy of the Republic of Slovenia in North Macedonia, NLB Bank Skopje, Capital Financial Center, Dijag, and Radio MOF. But the real strength came from MSOS members in preparing the event and the students with their questions, their energy, and their curiosity.</p>
<p>At the event, we received significant support and assistance from Melita Sekulovska in organizing the space and Aleksandar Popovski in designing the organization's website. We sincerely thanked them for their dedicated work, as well as the event coordinator, Lea Janačkovska, who made this event extraordinary.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-5.webp" alt="Mr. Branko Gregović and H.E. Gregor Presker">
<img src="../../../images/event3-photo-6.webp" alt="Kristijan Popovski, Melita Sekulovska, Lea Janačkovska, Marija Koštrevska and Aleksandar Popovski with certificates of appreciation">
<figcaption>The top two pictures show Mr. Branko Greganović, Chairman of the Management Board of NLB Bank Skopje, and on the right is H.E. the Ambassador of the Republic of Slovenia in North Macedonia, Mr. Gregor Presker. The bottom pictures show the President Kristijan Popovski, Melita Sekulovska, Lea Janačkovska, Marija Koštrevska, and Aleksandar Popovski.</figcaption>
</figure>
<p>With the help of Dijag doo company, we prepared two plaques for the Embassy and NLB Bank as a sign of gratitude for all the help and support they provided.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-7.webp" alt="Plaques for NLB Bank Skopje and the Embassy of the Republic of Slovenia">
<figcaption>Photograph of the plaques we presented to NLB Bank Skopje and the Embassy of the Republic of Slovenia in North Macedonia.</figcaption>
</figure>
<h2 id="why-special">Why was it special?</h2>
<p>Because this event was not just another presentation. It was a hand extended to future students a message that they are not alone, that a community is already waiting for them. Some left with new friends, others with concrete answers to questions that had bothered them for months. But everyone left with the same feeling: that Slovenia is no longer an unknown place, but a new home where they will be part of something bigger.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-8.webp" alt="Attendees at the event">
<figcaption>Photographs of the attendees at the event!</figcaption>
</figure>
<blockquote class="article-quote">
<p>“The event was a 'game changer' for me because I finally got information that really helped me get to know student Slovenia instead of just another pile of brochures. The panel was great, relaxed, with talks about the best places to go out, days stuck in the library, life in student dorms, and the classic 'I overslept before the exam' story... P.S. And the networking, the networking was top no awkward silence.”</p>
<footer>— Borjan Jovanovski, future student and event participant</footer>
</blockquote>
<h2 id="practical-advice">Practical advice first-hand</h2>
<p>A special moment of the event was the address by the Consul of the Embassy of the Republic of Slovenia in North Macedonia, Mr. Martin Glazar. He briefly presented the most important steps of the process for obtaining a temporary residence permit one of the biggest concerns and challenges for all foreign students in Slovenia. In this way, future students gained a clearer picture of what awaits them and how to more easily deal with administrative procedures.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-9.webp" alt="The Consul introducing students to the process of obtaining a temporary residence permit">
<figcaption>Photograph of the consul introducing students in an interesting way to the process of obtaining a temporary residence permit!</figcaption>
</figure>
<h2 id="livestream">For those who were not physically present with us</h2>
<p>Not everyone managed to be present in the hall, but that's why we made sure no one was left without this experience. We broadcast the event live through our Facebook page, and the recording is still available. If you want to experience the atmosphere and hear the stories first-hand, you can watch the entire event at this link here.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-10.webp" alt="Poster for the 'Meet Student Slovenia' event">
<figcaption>Photograph of the event poster!</figcaption>
</figure>
<h2 id="see-you">See you in Slovenia!</h2>
<p>With "Meet Student Slovenia 2023," we managed to extend a hand to new students and show them that an exciting journey full of new friendships, challenges, and successes awaits them. We sincerely hope that next time we will meet right there in the lecture halls, student dorms, and on the streets of Ljubljana, Maribor, and Koper.</p>
<p>This event would not have been possible without the support of our partners and friends, to whom we extend our immense gratitude:</p>
<ol>
<li>Embassy of the Republic of Slovenia in North Macedonia (partner)</li>
<li>NLB Bank Skopje (main sponsor and patron)</li>
<li>Capital Financial Center (sponsor)</li>
<li>Dijag doo (sponsor)</li>
<li>Radio MOF (media partner)</li>
</ol>
<p>Thanks to everyone who was part of this event and to future students, we say: your story in Slovenia is just beginning, and we are here to be a part of it.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-11.png" alt="A small part of the MSOS team">
<figcaption>Photo of a small part of the team because we forgot to take a group photo!&#129322;</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../../images/about_kristijan_min.webp" alt="Avatar of Kristijan Popovski">
<div class="author-text">
<p class="author-name">Kristijan Popovski</p>
<p class="author-title">President and Founder</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
</div>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Join 2,000+ subscribers</h2>
<p>Stay in the loop with everything you need to know.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="#">privacy policy</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2025 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,394 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Meet Student Slovenia 2023 - MSOS</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" />
<!-- Correct path to the main CSS file -->
<link rel="stylesheet" href="../../../css/main.css">
</head>
<body>
<!-- START_HEADER -->
<header class="dropdown-header-navigation">
<div class="container">
<a href="../../../en/" class="logo-link">
<img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
</a>
<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, mission, vision & core values</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/">Event & Projects</a></li>
<li><a href="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
</div>
<div class="mobile-menu-icon">
<i class="fas fa-bars"></i>
<i class="fas fa-times"></i>
</div>
</div>
</header>
<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, mission, vision & core values</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/">Event & Projects</a></li>
<li><a href="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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>
<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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<!-- Sticky Mobile Header -->
<div class="mobile-article-header">
<span id="mobile-article-title">Meet Student Slovenia 2023</span>
<i class="fas fa-chevron-down"></i>
<div class="progress-bar-container">
<div class="progress-bar"></div>
</div>
<!-- Dropdown Menu for Mobile -->
<div class="mobile-scrollspy-dropdown">
<ul id="mobile-scrollspy-links">
<!-- Links will be dynamically inserted here by JavaScript -->
</ul>
</div>
</div>
<div class="article-layout-container">
<!-- Desktop Scrollspy Sidebar -->
<aside class="article-sidebar">
<nav class="scrollspy-nav">
<ul>
<li><a href="#student-life" class="active">Behind student life in Slovenia</a></li>
<li><a href="#inspiring-voices">Voices that inspire</a></li>
<li><a href="#behind-the-scenes">Behind the scenes our supporters</a></li>
<li><a href="#why-special">Why was it special?</a></li>
<li><a href="#practical-advice">Practical advice first-hand</a></li>
<li><a href="#livestream">For those not physically present</a></li>
<li><a href="#see-you">See you in Slovenia!</a></li>
</ul>
</nav>
</aside>
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Published on September 18, 2023</p>
<h1>Meet Student Slovenia 2023</h1>
<p class="article-subtitle">Through honest first-hand stories, future students received support for their first step towards their new home.</p>
</header>
<figure class="article-main-image">
<img src="../../../images/event3-photo-1.webp" alt="Panel discussion at the 'Meet Student Slovenia 2023' event">
</figure>
<div class="article-body">
<p>What does the first step towards student life in Slovenia look like? We tried to answer this question through the event "Meet Student Slovenia," which we organized on September 18, 2023, at the NLB Gallery in Skopje. The atmosphere was full of excitement more than 100 future students and their families came with the same feeling: a desire to discover what awaits them where they will start their new chapter.</p>
<h2 id="student-life">What lies behind student life in Slovenia?</h2>
<p>Instead of dry information, students had the opportunity to hear real stories from those who are already walking the same path. Students from Ljubljana, Maribor, and Koper talked about their challenges, first impressions, funny situations, and moments when community support was crucial. And the audience? They absorbed everything with great attention, because exactly those questions that are never written in brochures here they received honest answers.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-2.webp" alt="Participants of the panel discussion">
<figcaption>Igor Arsov from the University of Primorska recounts his student experience at the Faculty of Management.</figcaption>
</figure>
<h2 id="inspiring-voices">Voices that inspire</h2>
<p>Our members Kiara Lazić, Angel Naumov, Klimentina Čapovska, and Igor Arsov appeared on stage each with their own story, their own faculty, their own city. Together with moderator Leon Šumanski and host Vasil Hanџiski, they transformed the panel into a real conversation that felt more like a friendly get-together than a formal discussion. They talked about exams, new friendships, life in student dorms, and how important it is not to give up even when things seem hardest.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-3.webp" alt="Vasil Hanџiski at the opening of the event">
<figcaption>Photograph from the opening of the event with the host Vasil Hanџiski.</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-4.webp" alt="The audience at the event">
<figcaption>Photograph of the event participants. We were a little surprised by the interest, but somehow we managed to fit everyone!♡</figcaption>
</figure>
<h2 id="behind-the-scenes">Behind the scenes our supporters</h2>
<p>The event would not have been possible without the support of the Embassy of the Republic of Slovenia in North Macedonia, NLB Bank Skopje, Capital Financial Center, Dijag, and Radio MOF. But the real strength came from MSOS members in preparing the event and the students with their questions, their energy, and their curiosity.</p>
<p>At the event, we received significant support and assistance from Melita Sekulovska in organizing the space and Aleksandar Popovski in designing the organization's website. We sincerely thanked them for their dedicated work, as well as the event coordinator, Lea Janačkovska, who made this event extraordinary.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-5.webp" alt="Mr. Branko Gregović and H.E. Gregor Presker">
<img src="../../../images/event3-photo-6.webp" alt="Kristijan Popovski, Melita Sekulovska, Lea Janačkovska, Marija Koštrevska and Aleksandar Popovski with certificates of appreciation">
<figcaption>The top two pictures show Mr. Branko Greganović, Chairman of the Management Board of NLB Bank Skopje, and on the right is H.E. the Ambassador of the Republic of Slovenia in North Macedonia, Mr. Gregor Presker. The bottom pictures show the President Kristijan Popovski, Melita Sekulovska, Lea Janačkovska, Marija Koštrevska, and Aleksandar Popovski.</figcaption>
</figure>
<p>With the help of Dijag doo company, we prepared two plaques for the Embassy and NLB Bank as a sign of gratitude for all the help and support they provided.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-7.webp" alt="Plaques for NLB Bank Skopje and the Embassy of the Republic of Slovenia">
<figcaption>Photograph of the plaques we presented to NLB Bank Skopje and the Embassy of the Republic of Slovenia in North Macedonia.</figcaption>
</figure>
<h2 id="why-special">Why was it special?</h2>
<p>Because this event was not just another presentation. It was a hand extended to future students a message that they are not alone, that a community is already waiting for them. Some left with new friends, others with concrete answers to questions that had bothered them for months. But everyone left with the same feeling: that Slovenia is no longer an unknown place, but a new home where they will be part of something bigger.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-8.webp" alt="Attendees at the event">
<figcaption>Photographs of the attendees at the event!</figcaption>
</figure>
<blockquote class="article-quote">
<p>“The event was a 'game changer' for me because I finally got information that really helped me get to know student Slovenia instead of just another pile of brochures. The panel was great, relaxed, with talks about the best places to go out, days stuck in the library, life in student dorms, and the classic 'I overslept before the exam' story... P.S. And the networking, the networking was top no awkward silence.”</p>
<footer>— Borjan Jovanovski, future student and event participant</footer>
</blockquote>
<h2 id="practical-advice">Practical advice first-hand</h2>
<p>A special moment of the event was the address by the Consul of the Embassy of the Republic of Slovenia in North Macedonia, Mr. Martin Glazar. He briefly presented the most important steps of the process for obtaining a temporary residence permit one of the biggest concerns and challenges for all foreign students in Slovenia. In this way, future students gained a clearer picture of what awaits them and how to more easily deal with administrative procedures.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-9.webp" alt="The Consul introducing students to the process of obtaining a temporary residence permit">
<figcaption>Photograph of the consul introducing students in an interesting way to the process of obtaining a temporary residence permit!</figcaption>
</figure>
<h2 id="livestream">For those who were not physically present with us</h2>
<p>Not everyone managed to be present in the hall, but that's why we made sure no one was left without this experience. We broadcast the event live through our Facebook page, and the recording is still available. If you want to experience the atmosphere and hear the stories first-hand, you can watch the entire event at this link here.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-10.webp" alt="Poster for the 'Meet Student Slovenia' event">
<figcaption>Photograph of the event poster!</figcaption>
</figure>
<h2 id="see-you">See you in Slovenia!</h2>
<p>With "Meet Student Slovenia 2023," we managed to extend a hand to new students and show them that an exciting journey full of new friendships, challenges, and successes awaits them. We sincerely hope that next time we will meet right there in the lecture halls, student dorms, and on the streets of Ljubljana, Maribor, and Koper.</p>
<p>This event would not have been possible without the support of our partners and friends, to whom we extend our immense gratitude:</p>
<ol>
<li>Embassy of the Republic of Slovenia in North Macedonia (partner)</li>
<li>NLB Bank Skopje (main sponsor and patron)</li>
<li>Capital Financial Center (sponsor)</li>
<li>Dijag doo (sponsor)</li>
<li>Radio MOF (media partner)</li>
</ol>
<p>Thanks to everyone who was part of this event and to future students, we say: your story in Slovenia is just beginning, and we are here to be a part of it.</p>
<figure class="article-inline-image">
<img src="../../../images/event3-photo-11.png" alt="A small part of the MSOS team">
<figcaption>Photo of a small part of the team because we forgot to take a group photo!&#129322;</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../../images/about_kristijan_min.webp" alt="Avatar of Kristijan Popovski">
<div class="author-text">
<p class="author-name">Kristijan Popovski</p>
<p class="author-title">President and Founder</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
</div>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Join 2,000+ subscribers</h2>
<p>Stay in the loop with everything you need to know.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="#">privacy policy</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2023 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,397 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Meet Student Slovenia 2024 - MSOS</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" />
<!-- Correct path 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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<!-- Sticky Mobile Header -->
<div class="mobile-article-header">
<span id="mobile-article-title">Meet Student Slovenia 2024</span>
<i class="fas fa-chevron-down"></i>
<div class="progress-bar-container">
<div class="progress-bar"></div>
</div>
<!-- Dropdown Menu for Mobile -->
<div class="mobile-scrollspy-dropdown">
<ul id="mobile-scrollspy-links">
<!-- Links will be dynamically inserted here by JavaScript -->
</ul>
</div>
</div>
<div class="article-layout-container">
<!-- Desktop Scrollspy Sidebar -->
<aside class="article-sidebar">
<nav class="scrollspy-nav">
<ul>
<li><a href="#coffee-chat" class="active">"Coffee chat" with future colleagues</a></li>
<li><a href="#what-remained">What remained behind us</a></li>
<li><a href="#the-support">The support that made a difference</a></li>
<li><a href="#why-special">Why was it special?</a></li>
<li><a href="#livestream">For those not physically present</a></li>
<li><a href="#see-you">See you in Slovenia!</a></li>
</ul>
</nav>
</aside>
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Published on September 16, 2024</p>
<h1>Meet Student Slovenia 2024</h1>
<p class="article-subtitle">When student stories turn into the first step towards a new home.</p>
</header>
<figure class="article-main-image">
<img src="../../../images/event4-img-1.webp" alt="A group of students at the 'Meet Student Slovenia 2024' event">
</figure>
<div class="article-body">
<p>Following the success in 2023, "Meet Student Slovenia" returned this year with even greater energy. On September 16, 2024, at the NLB Gallery in Skopje, we held the second edition of the event, which has become a true tradition. The interest was enormous we had twice as many applications as the capacity of the venue. The atmosphere was full of excitement, questions, and a desire for new beginnings.</p>
<h2 id="coffee-chat">"Coffee chat" with future colleagues, but on a panel discussion</h2>
<p>Our goal was never to create "dry presentations." Instead, we organized a panel a real conversation with four students who are already living the Slovenian student life. Marija Koštrevska from the University of Ljubljana, Vasil Hanџiski from the University of Maribor, Sofija Matovska from the University of Nova Gorica, and Igor Arsov from the University of Primorska spoke about everything: the first days away from home, how to find accommodation, what student "boni" (subsidized meals) are, and what it's like to build a new circle of friends. Everyone shared something of their own, and the audience asked questions and participated just like a coffee chat.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-2.webp" alt="Panel discussion with speakers">
<figcaption>Photograph of the moderator and panelists in the following order: Klimentina Čapovska (left, moderator), Vasil Hanџiski, Marija Koštrevska, Igor Arsov, and Sofija Matovska.</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event4-img-3.webp" alt="Marija Koštrevska and Sofija Matovska sharing their student experiences in Slovenia.">
<figcaption>Marija Koštrevska (in the upper picture) and Sofija Matovska (in the lower picture) are recounting their student experiences in Slovenia.</figcaption>
</figure>
<h2 id="what-remained">What remained behind us</h2>
<p>This evening was not just an exchange of information. It was a moment when future students understood that they are not alone in their worries and fears. Every question received an answer from experience, every dilemma was resolved with a real-life example. Many left encouraged, with new friends, and with the feeling that Slovenia is no longer so distant and unknown.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-4.webp" alt="Event host, coordinator, presenter, and representatives of the Embassy and partners.">
<figcaption>In the photos: Marko Ivanovski, event host (top-left), Lea Janačkovska, coordinator (top-center), Marko Arsov, presenter (top-right). The bottom picture shows representatives of the Embassy, the Management Board of NLB Bank, and the Management Board of MSOS.</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event4-img-5.webp" alt="Beautiful moments captured by the photographer.">
<figcaption>Beautiful moments of future and current students captured by the best photographer, Hristina Trajkovska.</figcaption>
</figure>
<h2 id="the-support">The support that made a difference</h2>
<p>"Meet Student Slovenia 2024" would not have looked this way without the help of our partners and friends. We extend great gratitude to the Embassy of the Republic of Slovenia in North Macedonia, NLB Bank Skopje as the patron and main sponsor of the entire event, and Capital Financial Center, who with their support made it possible for the event to be realized at this high level.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-6.webp" alt="Newly printed MSOS stickers">
<figcaption>Photograph of the newly printed MSOS stickers.</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event4-img-7.webp" alt="Handing over flowers as a thank you to the Embassy, Capital Financial Center and NLB Bank Skopje">
<figcaption>Photograph from the handing over of flowers as a sign of gratitude to the Embassy, Capital Financial Center, and NLB Bank Skopje.</figcaption>
</figure>
<p>Special thanks go to the MSOS team, who worked tirelessly for weeks on preparations from the initial idea to the last detail of the evening. Above all, great recognition goes to Lea Janačkovska, the event coordinator, who with her energy, patience, and organizational skills ensured that every piece fell into place.</p>
<p>This time, the memories of the evening are thanks to Hristina Trakovska, who was the photographer and made sure all those moments were captured so we can relive them again through photographs.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-8.webp" alt="Welcome speech by H.E. Ambassador Mr. Gregor Presker.">
<figcaption>Photograph of the welcome speech by H.E. Ambassador Mr. Gregor Presker.</figcaption>
</figure>
<h2 id="why-special">Why was it special?</h2>
<p>Because this event was not just another presentation. It was a hand extended to future students a message that they are not alone, that a community is already waiting for them. Some left with new friends, others with concrete answers to questions that had bothered them for months. But everyone left with the same feeling: that Slovenia is no longer an unknown place, but a new home where they will be part of something bigger.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-9.webp" alt="Attendees asking questions to the panelists">
<figcaption>Moments when the participants ask questions to the panelists! 😌✨</figcaption>
</figure>
<h2 id="livestream">For those not physically present with us</h2>
<p>We know that not everyone managed to attend the NLB Gallery, but we therefore provided a high-quality livestream. The event was broadcast live and is now available for re-watching. If you want to feel the atmosphere and hear the honest stories from the panel, you can watch the entire event here 👇</p>
<div class="video-responsive">
<iframe src="https://www.youtube.com/embed/DJD02mQIE98" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<figure class="article-inline-image">
<img src="../../../images/event4-img-10.webp" alt="Poster for the 'Meet Student Slovenia' event">
<figcaption>Photograph of the event poster!</figcaption>
</figure>
<h2 id="see-you">See you in Slovenia!</h2>
<p>"Meet Student Slovenia" is not just an event. It is a place where future students take their first step with support, with first-hand advice, and with the feeling that they are not alone. And this year we managed to create that feeling, and that is the greatest victory.</p>
<p>See you again next year!</p>
<p>P.S. Every year after a successfully organized event, the MSOS team traditionally heads to the nearest tavern, for an evening full of socializing, singing, and emotions! 😊 That's why it's worth being part of our team! Join us.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-11.webp" alt="The team behind the event.">
<figcaption>Photograph of the team behind the event! This year we arranged a team photo in advance because last year we forgot to take one together! 🫣</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event4-img-12.webp" alt="Team dinner after the event.">
<figcaption>Photograph from the team dinner after a successfully completed event!</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../../images/about_kristijan_min.webp" alt="Avatar of Kristijan Popovski">
<div class="author-text">
<p class="author-name">Kristijan Popovski</p>
<p class="author-title">President and Founder</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
</div>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Join 2,000+ subscribers</h2>
<p>Stay in the loop with everything you need to know.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="#">privacy policy</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2025 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,390 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Meet Student Slovenia 2024 - MSOS</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" />
<!-- Correct path to the main CSS file -->
<link rel="stylesheet" href="../../../css/main.css">
</head>
<body>
<!-- START_HEADER -->
<header class="dropdown-header-navigation">
<div class="container">
<a href="../../../en/" class="logo-link">
<img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
</a>
<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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
</div>
<div class="mobile-menu-icon">
<i class="fas fa-bars"></i>
<i class="fas fa-times"></i>
</div>
</div>
</header>
<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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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>
<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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<!-- Sticky Mobile Header -->
<div class="mobile-article-header">
<span id="mobile-article-title">Meet Student Slovenia 2024</span>
<i class="fas fa-chevron-down"></i>
<div class="progress-bar-container">
<div class="progress-bar"></div>
</div>
<!-- Dropdown Menu for Mobile -->
<div class="mobile-scrollspy-dropdown">
<ul id="mobile-scrollspy-links">
<!-- Links will be dynamically inserted here by JavaScript -->
</ul>
</div>
</div>
<div class="article-layout-container">
<!-- Desktop Scrollspy Sidebar -->
<aside class="article-sidebar">
<nav class="scrollspy-nav">
<ul>
<li><a href="#coffee-chat" class="active">"Coffee chat" with future colleagues</a></li>
<li><a href="#what-remained">What remained behind us</a></li>
<li><a href="#the-support">The support that made a difference</a></li>
<li><a href="#why-special">Why was it special?</a></li>
<li><a href="#livestream">For those not physically present</a></li>
<li><a href="#see-you">See you in Slovenia!</a></li>
</ul>
</nav>
</aside>
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Published on September 16, 2024</p>
<h1>Meet Student Slovenia 2024</h1>
<p class="article-subtitle">When student stories turn into the first step towards a new home.</p>
</header>
<figure class="article-main-image">
<img src="../../../images/event4-img-1.webp" alt="A group of students at the 'Meet Student Slovenia 2024' event">
</figure>
<div class="article-body">
<p>Following the success in 2023, "Meet Student Slovenia" returned this year with even greater energy. On September 16, 2024, at the NLB Gallery in Skopje, we held the second edition of the event, which has become a true tradition. The interest was enormous we had twice as many applications as the capacity of the venue. The atmosphere was full of excitement, questions, and a desire for new beginnings.</p>
<h2 id="coffee-chat">"Coffee chat" with future colleagues, but on a panel discussion</h2>
<p>Our goal was never to create "dry presentations." Instead, we organized a panel a real conversation with four students who are already living the Slovenian student life. Marija Koštrevska from the University of Ljubljana, Vasil Hanџiski from the University of Maribor, Sofija Matovska from the University of Nova Gorica, and Igor Arsov from the University of Primorska spoke about everything: the first days away from home, how to find accommodation, what student "boni" (subsidized meals) are, and what it's like to build a new circle of friends. Everyone shared something of their own, and the audience asked questions and participated just like a coffee chat.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-2.webp" alt="Panel discussion with speakers">
<figcaption>Photograph of the moderator and panelists in the following order: Klimentina Čapovska (left, moderator), Vasil Hanџiski, Marija Koštrevska, Igor Arsov, and Sofija Matovska.</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event4-img-3.webp" alt="Marija Koštrevska and Sofija Matovska sharing their student experiences in Slovenia.">
<figcaption>Marija Koštrevska (in the upper picture) and Sofija Matovska (in the lower picture) are recounting their student experiences in Slovenia.</figcaption>
</figure>
<h2 id="what-remained">What remained behind us</h2>
<p>This evening was not just an exchange of information. It was a moment when future students understood that they are not alone in their worries and fears. Every question received an answer from experience, every dilemma was resolved with a real-life example. Many left encouraged, with new friends, and with the feeling that Slovenia is no longer so distant and unknown.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-4.webp" alt="Event host, coordinator, presenter, and representatives of the Embassy and partners.">
<figcaption>In the photos: Marko Ivanovski, event host (top-left), Lea Janačkovska, coordinator (top-center), Marko Arsov, presenter (top-right). The bottom picture shows representatives of the Embassy, the Management Board of NLB Bank, and the Management Board of MSOS.</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event4-img-5.webp" alt="Beautiful moments captured by the photographer.">
<figcaption>Beautiful moments of future and current students captured by the best photographer, Hristina Trajkovska.</figcaption>
</figure>
<h2 id="the-support">The support that made a difference</h2>
<p>"Meet Student Slovenia 2024" would not have looked this way without the help of our partners and friends. We extend great gratitude to the Embassy of the Republic of Slovenia in North Macedonia, NLB Bank Skopje as the patron and main sponsor of the entire event, and Capital Financial Center, who with their support made it possible for the event to be realized at this high level.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-6.webp" alt="Newly printed MSOS stickers">
<figcaption>Photograph of the newly printed MSOS stickers.</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event4-img-7.webp" alt="Handing over flowers as a thank you to the Embassy, Capital Financial Center and NLB Bank Skopje">
<figcaption>Photograph from the handing over of flowers as a sign of gratitude to the Embassy, Capital Financial Center, and NLB Bank Skopje.</figcaption>
</figure>
<p>Special thanks go to the MSOS team, who worked tirelessly for weeks on preparations from the initial idea to the last detail of the evening. Above all, great recognition goes to Lea Janačkovska, the event coordinator, who with her energy, patience, and organizational skills ensured that every piece fell into place.</p>
<p>This time, the memories of the evening are thanks to Hristina Trakovska, who was the photographer and made sure all those moments were captured so we can relive them again through photographs.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-8.webp" alt="Welcome speech by H.E. Ambassador Mr. Gregor Presker.">
<figcaption>Photograph of the welcome speech by H.E. Ambassador Mr. Gregor Presker.</figcaption>
</figure>
<h2 id="why-special">Why was it special?</h2>
<p>Because this event was not just another presentation. It was a hand extended to future students a message that they are not alone, that a community is already waiting for them. Some left with new friends, others with concrete answers to questions that had bothered them for months. But everyone left with the same feeling: that Slovenia is no longer an unknown place, but a new home where they will be part of something bigger.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-9.webp" alt="Attendees asking questions to the panelists">
<figcaption>Moments when the participants ask questions to the panelists! 😌✨</figcaption>
</figure>
<h2 id="livestream">For those not physically present with us</h2>
<p>We know that not everyone managed to attend the NLB Gallery, but we therefore provided a high-quality livestream. The event was broadcast live and is now available for re-watching. If you want to feel the atmosphere and hear the honest stories from the panel, you can watch the entire event here 👇</p>
<div class="video-responsive">
<iframe src="https://www.youtube.com/embed/DJD02mQIE98" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<figure class="article-inline-image">
<img src="../../../images/event4-img-10.webp" alt="Poster for the 'Meet Student Slovenia' event">
<figcaption>Photograph of the event poster!</figcaption>
</figure>
<h2 id="see-you">See you in Slovenia!</h2>
<p>"Meet Student Slovenia" is not just an event. It is a place where future students take their first step with support, with first-hand advice, and with the feeling that they are not alone. And this year we managed to create that feeling, and that is the greatest victory.</p>
<p>See you again next year!</p>
<p>P.S. Every year after a successfully organized event, the MSOS team traditionally heads to the nearest tavern, for an evening full of socializing, singing, and emotions! 😊 That's why it's worth being part of our team! Join us.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-img-11.webp" alt="The team behind the event.">
<figcaption>Photograph of the team behind the event! This year we arranged a team photo in advance because last year we forgot to take one together! 🫣</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event4-img-12.webp" alt="Team dinner after the event.">
<figcaption>Photograph from the team dinner after a successfully completed event!</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../../images/about_kristijan_min.webp" alt="Avatar of Kristijan Popovski">
<div class="author-text">
<p class="author-name">Kristijan Popovski</p>
<p class="author-title">President and Founder</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
</div>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Join 2,000+ subscribers</h2>
<p>Stay in the loop with everything you need to know.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="#">privacy policy</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2023 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,361 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Morning Coffee in front of CTK 2024: Coffee, burek, and lots of smiles</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 using the correct relative path -->
<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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<!-- Sticky Mobile Header -->
<div class="mobile-article-header">
<span id="mobile-article-title">Morning Coffee in front of CTK 2024</span>
<i class="fas fa-chevron-down"></i>
<div class="progress-bar-container">
<div class="progress-bar"></div>
</div>
<!-- Dropdown Menu for Mobile -->
<div class="mobile-scrollspy-dropdown">
<ul id="mobile-scrollspy-links">
<!-- Links will be dynamically inserted here by JavaScript -->
</ul>
</div>
</div>
<div class="article-layout-container">
<!-- Desktop Scrollspy Sidebar -->
<aside class="article-sidebar">
<nav class="scrollspy-nav">
<ul>
<li><a href="#beating-stress" class="active">Beating Exam Stress with Coffee</a></li>
<li><a href="#student-emotions">Student Emotions</a></li>
<li><a href="#from-coffee-to-simulators">From coffee to simulators</a></li>
<li><a href="#coffee-and-burek">Coffee and Burek as motivation</a></li>
</ul>
</nav>
</aside>
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Published on June 8, 2024</p>
<h1>Morning Coffee in front of CTK 2024: Coffee, burek, and lots of smiles</h1>
<p class="article-subtitle">When exams somehow become easier with Saturday morning coffee, burek, and good company in at CTK!</p>
</header>
<figure class="article-main-image">
<img src="../../../images/event4-image1.webp" alt="Students enjoying coffee and burek in front of CTK library.">
</figure>
<div class="article-body">
<p>On June 8, 2024, from 9 to 12 AM, at the Central Technical Library of the University of Ljubljana (CTK), we organized our already traditional student break Morning Coffee in at CTK together with the team from Skupina Povezani and CTK. This was the second year in a row that we gathered at the same place, but each time brings new moments to remember.</p>
<h2 id="beating-stress">Beating Exam Stress with Coffee</h2>
<p>The exam session always brings stress hours and hours of studying, conversations revolving only around exams, first and second attempts, passed or not, some taking the exam for the first time, and some for the fifth time. That's why we decided to take a short break to catch our breath: to relax, to laugh, and to remind ourselves that we're in this study stress together.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-image2.webp" alt="Students lining up in front of the CTK library building.">
<figcaption>Hundreds of students lined up in front of CTK, waiting even before opening to secure a spot in the library on time.</figcaption>
</figure>
<p>With a cup of hot coffee in hand, and thanks to <strong>Burek Olimpija</strong>, we enjoyed delicious burek with meat and with cheese. We also tried to bring in a bit of fun we invited students to bring their own cups, and there was a prize for the most creative ones.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-image3.webp" alt="A student smiling while eating a piece of burek.">
<figcaption>Free warm burek the secret formula for solving even the toughest mathematical problems 😉</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event4-image4.webp" alt="A group of students with hot coffee posing for the camera.">
<figcaption>A group of students with hot coffee, posing for the camera.</figcaption>
</figure>
<h2 id="student-emotions">We asked two questions that revealed a whole palette of student emotions</h2>
<p>For an extra dose of interaction, we set up two big boards with questions that simply make you want to answer: <strong>“How do I survive the exam session?"</strong> and <strong>"Kako bi opisal počutje med izpitnem obdobjem?”</strong> (“How would you describe your feelings during the exam period?" in Slovenian).</p>
<p>The reactions were instant students rushed to write, and the answers were everything but boring: from "chaotic" and “We want to sleep! (not in CTK)!" to "chill", "stressed", "exhausted", "happy" and "sleepy". In other words a whole spectrum of student emotions, honestly poured into just a few words.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-image5.webp" alt="A white board with handwritten student answers about their feelings during the exam period.">
<figcaption>Witty and sincere answers on the big question boards at CTK.</figcaption>
</figure>
<h2 id="from-coffee-to-simulators">How we went from coffee to a flight simulator and 3D printing machines</h2>
<p>As a bonus for students, in cooperation with the university's technical library, the program was enriched with a CTK exhibition, where a flight simulator, 3D printers, and other interesting equipment were presented. Students could try them out and then rent them for free at the CTK Creative Studio part of their educational program.</p>
<h2 id="coffee-and-burek">Coffee and burek = motivation to get up every day and study for 12 hours</h2>
<p>Around 150 people visited the joint stand of MSOS, Skupina Povezani, and CTK to hang out, have coffee, grab a snack, and exchange stories among books and deadlines. The event took place in an excellent atmosphere lots of smiles, new acquaintances, and a small reminder that even in the most stressful periods, there's always time for coffee and good company.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-image6.webp" alt="Students gathered at the joint stand during the event.">
<figcaption>Part of the atmosphere at the joint stand</figcaption>
</figure>
<p>See you again next year even more relaxed and with even more coffee!</p>
<figure class="article-inline-image">
<img src="../../../images/event4-image7.webp" alt="A collage of photos showing students, coffee cups, and burek.">
<figcaption>Good company, lots of memories, and exam stress overcome together.</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../../images/about_kristijan_min.webp" alt="Avatar of Kristijan Popovski">
<div class="author-text">
<p class="author-name">Kristijan Popovski</p>
<p class="author-title">President and Founder</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
</div>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Join 2,000+ subscribers</h2>
<p>Stay in the loop with everything you need to know.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="#">privacy policy</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2025 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,354 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Morning Coffee in front of CTK 2024: Coffee, burek, and lots of smiles</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 using the correct relative path -->
<link rel="stylesheet" href="../../../css/main.css">
</head>
<body>
<!-- START_HEADER -->
<header class="dropdown-header-navigation">
<div class="container">
<a href="../../../en/" class="logo-link">
<img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
</a>
<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, mission, vision & core values</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/">Event & Projects</a></li>
<li><a href="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
</div>
<div class="mobile-menu-icon">
<i class="fas fa-bars"></i>
<i class="fas fa-times"></i>
</div>
</div>
</header>
<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, mission, vision & core values</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/">Event & Projects</a></li>
<li><a href="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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>
<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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<!-- Sticky Mobile Header -->
<div class="mobile-article-header">
<span id="mobile-article-title">Morning Coffee in front of CTK 2024</span>
<i class="fas fa-chevron-down"></i>
<div class="progress-bar-container">
<div class="progress-bar"></div>
</div>
<!-- Dropdown Menu for Mobile -->
<div class="mobile-scrollspy-dropdown">
<ul id="mobile-scrollspy-links">
<!-- Links will be dynamically inserted here by JavaScript -->
</ul>
</div>
</div>
<div class="article-layout-container">
<!-- Desktop Scrollspy Sidebar -->
<aside class="article-sidebar">
<nav class="scrollspy-nav">
<ul>
<li><a href="#beating-stress" class="active">Beating Exam Stress with Coffee</a></li>
<li><a href="#student-emotions">Student Emotions</a></li>
<li><a href="#from-coffee-to-simulators">From coffee to simulators</a></li>
<li><a href="#coffee-and-burek">Coffee and Burek as motivation</a></li>
</ul>
</nav>
</aside>
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Published on June 8, 2024</p>
<h1>Morning Coffee in front of CTK 2024: Coffee, burek, and lots of smiles</h1>
<p class="article-subtitle">When exams somehow become easier with Saturday morning coffee, burek, and good company in at CTK!</p>
</header>
<figure class="article-main-image">
<img src="../../../images/event4-image1.webp" alt="Students enjoying coffee and burek in front of CTK library.">
</figure>
<div class="article-body">
<p>On June 8, 2024, from 9 to 12 AM, at the Central Technical Library of the University of Ljubljana (CTK), we organized our already traditional student break Morning Coffee in at CTK together with the team from Skupina Povezani and CTK. This was the second year in a row that we gathered at the same place, but each time brings new moments to remember.</p>
<h2 id="beating-stress">Beating Exam Stress with Coffee</h2>
<p>The exam session always brings stress hours and hours of studying, conversations revolving only around exams, first and second attempts, passed or not, some taking the exam for the first time, and some for the fifth time. That's why we decided to take a short break to catch our breath: to relax, to laugh, and to remind ourselves that we're in this study stress together.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-image2.webp" alt="Students lining up in front of the CTK library building.">
<figcaption>Hundreds of students lined up in front of CTK, waiting even before opening to secure a spot in the library on time.</figcaption>
</figure>
<p>With a cup of hot coffee in hand, and thanks to <strong>Burek Olimpija</strong>, we enjoyed delicious burek with meat and with cheese. We also tried to bring in a bit of fun we invited students to bring their own cups, and there was a prize for the most creative ones.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-image3.webp" alt="A student smiling while eating a piece of burek.">
<figcaption>Free warm burek the secret formula for solving even the toughest mathematical problems 😉</figcaption>
</figure>
<figure class="article-inline-image">
<img src="../../../images/event4-image4.webp" alt="A group of students with hot coffee posing for the camera.">
<figcaption>A group of students with hot coffee, posing for the camera.</figcaption>
</figure>
<h2 id="student-emotions">We asked two questions that revealed a whole palette of student emotions</h2>
<p>For an extra dose of interaction, we set up two big boards with questions that simply make you want to answer: <strong>“How do I survive the exam session?"</strong> and <strong>"Kako bi opisal počutje med izpitnem obdobjem?”</strong> (“How would you describe your feelings during the exam period?" in Slovenian).</p>
<p>The reactions were instant students rushed to write, and the answers were everything but boring: from "chaotic" and “We want to sleep! (not in CTK)!" to "chill", "stressed", "exhausted", "happy" and "sleepy". In other words a whole spectrum of student emotions, honestly poured into just a few words.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-image5.webp" alt="A white board with handwritten student answers about their feelings during the exam period.">
<figcaption>Witty and sincere answers on the big question boards at CTK.</figcaption>
</figure>
<h2 id="from-coffee-to-simulators">How we went from coffee to a flight simulator and 3D printing machines</h2>
<p>As a bonus for students, in cooperation with the university's technical library, the program was enriched with a CTK exhibition, where a flight simulator, 3D printers, and other interesting equipment were presented. Students could try them out and then rent them for free at the CTK Creative Studio part of their educational program.</p>
<h2 id="coffee-and-burek">Coffee and burek = motivation to get up every day and study for 12 hours</h2>
<p>Around 150 people visited the joint stand of MSOS, Skupina Povezani, and CTK to hang out, have coffee, grab a snack, and exchange stories among books and deadlines. The event took place in an excellent atmosphere lots of smiles, new acquaintances, and a small reminder that even in the most stressful periods, there's always time for coffee and good company.</p>
<figure class="article-inline-image">
<img src="../../../images/event4-image6.webp" alt="Students gathered at the joint stand during the event.">
<figcaption>Part of the atmosphere at the joint stand</figcaption>
</figure>
<p>See you again next year even more relaxed and with even more coffee!</p>
<figure class="article-inline-image">
<img src="../../../images/event4-image7.webp" alt="A collage of photos showing students, coffee cups, and burek.">
<figcaption>Good company, lots of memories, and exam stress overcome together.</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../../images/about_kristijan_min.webp" alt="Avatar of Kristijan Popovski">
<div class="author-text">
<p class="author-name">Kristijan Popovski</p>
<p class="author-title">President and Founder</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
</div>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Join 2,000+ subscribers</h2>
<p>Stay in the loop with everything you need to know.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="#">privacy policy</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2023 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,347 @@
<!DOCTYPE html>
<html lang="sl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Macedonian Student Night in Ljubljana - MSOS</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" />
<!-- Povezava na novo glavno CSS datoteko -->
<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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Published on October 8, 2022</p>
<h1>Macedonian Student Night in Ljubljana</h1>
<p class="article-subtitle">From an idea to a party with 500 students that's how our story began!</p>
</header>
<figure class="article-main-image">
<img src="../../images/msnl-1.webp" alt="Atmosphere from the Macedonian Student Night in Ljubljana">
</figure>
<div class="article-body">
<p>On October 8, 2022, in the heart of the Student Campus in Ljubljana, the first Macedonian Student Night in Slovenia took place. Under the motto #FeelsLikeHome, more than 500 young people enjoyed Macedonian music, delicious traditional food, and an atmosphere that felt like home. This event was not just a party it was the beginning of a new story, which would later grow into the Macedonian Student Organization in Slovenia (MSOS).</p>
<h2>How an idea for socializing became the start of a movement</h2>
<p>It all began with a simple wish to gather, get to know each other, and feel Macedonia, even though we were far from it. Kristijan Popovski, then a student at the School of Economics and Business in Ljubljana, shared his idea with a few colleagues, and the response was incredible. In less than two weeks, over 40 students joined the organizing team. Everyone contributed their enthusiasm and time, and the shared spirit and desire to connect turned this spontaneous initiative into an event we would remember for a long time.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-2.webp" alt="Preparations and meetings for the Macedonian Student Night">
<figcaption>Photos from the preparations and meetings for organizing the Macedonian Student Night.</figcaption>
</figure>
<p>From that moment on, we spent every free moment in the offices of the student organization <strong>Povezani</strong>, which gave us great support in organizing. Days and nights were spent planning, holding meetings, and writing social media posts all with the goal of creating an event that we initially thought would attract, if we were lucky, about 100 visitors.</p>
<p>A week before the event, we posted interesting facts about Macedonia every day its national treasures, music, and culture. Slowly but surely, we built the atmosphere and excitement, not only among Macedonian students but also among many others who wanted to feel our energy.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-3.webp" alt="Poster where Slovenians learn the Macedonian alphabet">
<figcaption>Poster with Cyrillic and Latin letters. Slovenians are learning the Macedonian alphabet, while Macedonians are teaching them.</figcaption>
</figure>
<blockquote class="article-quote">
<p>“Organizing the first MSOS party was a one-of-a-kind experience sleepless, ambitious, and involved in everything from logistics to mopping the floor... Thank goodness for Red Bull 😉 (P.S. We drank the entire fridge supply!)”</p>
<footer>— Marko - first-year student (at the time)</footer>
</blockquote>
<h2>The taste and smell of Macedonia in the heart of Ljubljana</h2>
<p>The party started at 8:00 PM and was designed in two parts. The first part was a real gastronomic and cultural journey through Macedonia. Students could try bread with ajvar and white cheese, Macedonian wine, tasty snacks, and traditional drinks. The tables were also filled with other authentic products that reminded everyone of home. All these flavors and aromas were made possible thanks to the support of the Macedonian products store <strong>“Makedonija Trade,”</strong> which selflessly contributed to making this part of the evening truly enjoyable.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-4.webp" alt="Stands with Macedonian symbols, food, and drinks">
<figcaption>Photos of the stands with Macedonian symbols, traditional food, and drinks.</figcaption>
</figure>
<p>In addition to the food, visitors could explore interesting facts about the country, photos of famous Macedonian figures and cultural landmarks, and see traditional costumes and a <strong>gaida</strong> up close. The atmosphere was warm and full of curiosity like a small exhibition within a large student party.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-5.webp" alt="Mini quiz about Macedonia">
<figcaption>Mini quiz with questions about Macedonia, where students in one part of the club are competing.</figcaption>
</figure>
<h2>Support from the Macedonian community and diplomacy</h2>
<p>The evening was enriched by the presence of important guests from the Macedonian community in Slovenia. <strong>The President of the Union of Macedonian Cultural Associations in Slovenia, Mr. Blagoja Nasteski</strong>, joined the event, confirming the importance of such initiatives for preserving the Macedonian spirit and tradition in the diaspora.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-6.webp" alt="Kristijan and Bisera with Ambassador Zelenkovska and Mr. Nasteski">
<figcaption>Kristijan and Bisera together with Ambassador Zelenkovska and the President of the Union of Macedonian Associations, Mr. Nasteski</figcaption>
</figure>
<p>We were especially honored to <strong>welcome the Ambassador of North Macedonia to Slovenia, Mrs. Suzana Zelenkovska</strong>, who gave warm words of encouragement and support to the youth. Her presence and interest in the event were an additional motivation to continue our mission of connecting and promoting the Macedonian student community.</p>
<p>The party had great energy spreading everywhere at one point there was a small but controlled chaos. Even though the event ended slightly earlier than planned, the students kept singing together for another hour while we were cleaning up the place. Truly, a night to remember!</p>
<blockquote class="article-quote">
<p>“I was part of the organizing team and was supposed to maintain order among the students, but when they played the song 'Biser Balkanski,' I couldn't resist so I joined in as well... That was my special moment that night!”</p>
<footer>— Hristijan - second-year student (at the time)</footer>
</blockquote>
<h2>A beginning to remember</h2>
<p>That night wasn't just another student party it was the moment we realized we had started something bigger. Instead of the expected 100 guests, about <strong>500 students</strong> came to the club, and the energy was incredible. New friendships were made, songs were sung from the heart, and Macedonian culture and tradition took center stage for the entire evening.</p>
<p>This night laid the foundation for the Macedonian Student Organization in Slovenia and showed us that with enthusiasm, unity, and a bit of courage, it's possible to create something that brings people together and gives them a sense of home even when they are far away from it.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-7.webp" alt="The dedicated team of volunteers after cleaning up the venue">
<figcaption>Photo taken at 4:00 a.m., after finishing and cleaning up the venue together with the dedicated team of volunteers</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../images/11-boy.webp" alt="Avatar of Kristijan Popovski">
<div class="author-text">
<p class="author-name">Kristijan Popovski</p>
<p class="author-title">President and Founder</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Join 2,000+ subscribers</h2>
<p>Stay in the loop with everything you need to know.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="#">privacy policy</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2025 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,347 @@
<!DOCTYPE html>
<html lang="sl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Macedonian Student Night in Ljubljana - MSOS</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" />
<!-- Povezava na novo glavno CSS datoteko -->
<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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="article-page">
<article class="article-container">
<header class="article-header">
<p class="article-publish-date">Published on October 8, 2022</p>
<h1>Macedonian Student Night in Ljubljana</h1>
<p class="article-subtitle">From an idea to a party with 500 students that's how our story began!</p>
</header>
<figure class="article-main-image">
<img src="../../images/msnl-1.webp" alt="Atmosphere from the Macedonian Student Night in Ljubljana">
</figure>
<div class="article-body">
<p>On October 8, 2022, in the heart of the Student Campus in Ljubljana, the first Macedonian Student Night in Slovenia took place. Under the motto #FeelsLikeHome, more than 500 young people enjoyed Macedonian music, delicious traditional food, and an atmosphere that felt like home. This event was not just a party it was the beginning of a new story, which would later grow into the Macedonian Student Organization in Slovenia (MSOS).</p>
<h2>How an idea for socializing became the start of a movement</h2>
<p>It all began with a simple wish to gather, get to know each other, and feel Macedonia, even though we were far from it. Kristijan Popovski, then a student at the School of Economics and Business in Ljubljana, shared his idea with a few colleagues, and the response was incredible. In less than two weeks, over 40 students joined the organizing team. Everyone contributed their enthusiasm and time, and the shared spirit and desire to connect turned this spontaneous initiative into an event we would remember for a long time.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-2.webp" alt="Preparations and meetings for the Macedonian Student Night">
<figcaption>Photos from the preparations and meetings for organizing the Macedonian Student Night.</figcaption>
</figure>
<p>From that moment on, we spent every free moment in the offices of the student organization <strong>Povezani</strong>, which gave us great support in organizing. Days and nights were spent planning, holding meetings, and writing social media posts all with the goal of creating an event that we initially thought would attract, if we were lucky, about 100 visitors.</p>
<p>A week before the event, we posted interesting facts about Macedonia every day its national treasures, music, and culture. Slowly but surely, we built the atmosphere and excitement, not only among Macedonian students but also among many others who wanted to feel our energy.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-3.webp" alt="Poster where Slovenians learn the Macedonian alphabet">
<figcaption>Poster with Cyrillic and Latin letters. Slovenians are learning the Macedonian alphabet, while Macedonians are teaching them.</figcaption>
</figure>
<blockquote class="article-quote">
<p>“Organizing the first MSOS party was a one-of-a-kind experience sleepless, ambitious, and involved in everything from logistics to mopping the floor... Thank goodness for Red Bull 😉 (P.S. We drank the entire fridge supply!)”</p>
<footer>— Marko - first-year student (at the time)</footer>
</blockquote>
<h2>The taste and smell of Macedonia in the heart of Ljubljana</h2>
<p>The party started at 8:00 PM and was designed in two parts. The first part was a real gastronomic and cultural journey through Macedonia. Students could try bread with ajvar and white cheese, Macedonian wine, tasty snacks, and traditional drinks. The tables were also filled with other authentic products that reminded everyone of home. All these flavors and aromas were made possible thanks to the support of the Macedonian products store <strong>“Makedonija Trade,”</strong> which selflessly contributed to making this part of the evening truly enjoyable.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-4.webp" alt="Stands with Macedonian symbols, food, and drinks">
<figcaption>Photos of the stands with Macedonian symbols, traditional food, and drinks.</figcaption>
</figure>
<p>In addition to the food, visitors could explore interesting facts about the country, photos of famous Macedonian figures and cultural landmarks, and see traditional costumes and a <strong>gaida</strong> up close. The atmosphere was warm and full of curiosity like a small exhibition within a large student party.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-5.webp" alt="Mini quiz about Macedonia">
<figcaption>Mini quiz with questions about Macedonia, where students in one part of the club are competing.</figcaption>
</figure>
<h2>Support from the Macedonian community and diplomacy</h2>
<p>The evening was enriched by the presence of important guests from the Macedonian community in Slovenia. <strong>The President of the Union of Macedonian Cultural Associations in Slovenia, Mr. Blagoja Nasteski</strong>, joined the event, confirming the importance of such initiatives for preserving the Macedonian spirit and tradition in the diaspora.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-6.webp" alt="Kristijan and Bisera with Ambassador Zelenkovska and Mr. Nasteski">
<figcaption>Kristijan and Bisera together with Ambassador Zelenkovska and the President of the Union of Macedonian Associations, Mr. Nasteski</figcaption>
</figure>
<p>We were especially honored to <strong>welcome the Ambassador of North Macedonia to Slovenia, Mrs. Suzana Zelenkovska</strong>, who gave warm words of encouragement and support to the youth. Her presence and interest in the event were an additional motivation to continue our mission of connecting and promoting the Macedonian student community.</p>
<p>The party had great energy spreading everywhere at one point there was a small but controlled chaos. Even though the event ended slightly earlier than planned, the students kept singing together for another hour while we were cleaning up the place. Truly, a night to remember!</p>
<blockquote class="article-quote">
<p>“I was part of the organizing team and was supposed to maintain order among the students, but when they played the song 'Biser Balkanski,' I couldn't resist so I joined in as well... That was my special moment that night!”</p>
<footer>— Hristijan - second-year student (at the time)</footer>
</blockquote>
<h2>A beginning to remember</h2>
<p>That night wasn't just another student party it was the moment we realized we had started something bigger. Instead of the expected 100 guests, about <strong>500 students</strong> came to the club, and the energy was incredible. New friendships were made, songs were sung from the heart, and Macedonian culture and tradition took center stage for the entire evening.</p>
<p>This night laid the foundation for the Macedonian Student Organization in Slovenia and showed us that with enthusiasm, unity, and a bit of courage, it's possible to create something that brings people together and gives them a sense of home even when they are far away from it.</p>
<figure class="article-inline-image">
<img src="../../images/msnl-7.webp" alt="The dedicated team of volunteers after cleaning up the venue">
<figcaption>Photo taken at 4:00 a.m., after finishing and cleaning up the venue together with the dedicated team of volunteers</figcaption>
</figure>
</div>
<footer class="article-footer">
<hr>
<div class="author-share-section">
<div class="author-details">
<img src="../../images/11-boy.webp" alt="Avatar of Kristijan Popovski">
<div class="author-text">
<p class="author-name">Kristijan Popovski</p>
<p class="author-title">President and Founder</p>
</div>
</div>
<div class="share-buttons">
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</footer>
</article>
<section class="newsletter-cta">
<div class="container">
<div class="cta-content">
<h2>Join 2,000+ subscribers</h2>
<p>Stay in the loop with everything you need to know.</p>
<form class="subscribe-form-bottom">
<div class="input-wrapper">
<input type="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary-orange">Subscribe</button>
</form>
<p class="privacy-note">We care about your data in our <a href="#">privacy policy</a></p>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2023 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,481 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Timeline & Milestones - 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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="page-content">
<!-- Timeline Header Section -->
<section class="page-header-section">
<div class="container text-center">
<span class="page-subtitle" style="text-transform: uppercase;">About us</span>
<h1>Timeline & Milestones</h1>
<p class="page-description">Learn more about the company and the team behind it.</p>
</div>
</section>
<!-- Timeline Banner -->
<div class="timeline-banner">
<img src="../../../images/about_us-timeline-milestones_img0.webp" alt="MSOS Team Group Photo">
</div>
<!-- Timeline Section -->
<section class="timeline-section">
<div class="timeline-container">
<!-- Year 2022 -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-year">2022</p>
<h2>The Beginning of a Movement</h2>
<p>What started as a simple idea in the summer of 2022 quickly grew into something much bigger. From the spark at a wine tasting in Ljubljana, to the first Macedonian Student Party with over 500 attendees, and finally the creation of the founding team, 2022 was the year when MSOS was born. It was a year of enthusiasm, countless volunteer hours, and the first steps toward building a community that Macedonian students in Slovenia had long been waiting for.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">August 2022</p>
<h3>The Spark of an Idea</h3>
<p>It all started at a wine tasting event in the heart of Ljubljana. Among friends and good conversation, our founder Kristijan Popovski was encouraged by his Slovenian peers to organize something truly Macedonian. Inspired, he posted in a Facebook group of Macedonians living in Slovenia, calling for volunteers to help bring the idea to life.</p>
<p>Around 40 volunteers responded — a group of students who, without even realizing it, were laying the foundations of what would later become MSOS. Day after day, we worked side by side, sharing the same air, fueled by excitement and the desire to create something new. At that point, we weren't thinking about “founding an organization" — we were just a group of people trying to make one unforgettable event happen.</p>
<p>Two weeks later, the first Macedonian Student Party in Ljubljana came to life. Expectations were exceeded: sponsors and donors joined in, volunteers gave their all, and more than 500 people showed up.</p>
<p>That night made one thing very clear: Macedonian students in Slovenia needed a space to connect, celebrate, and support one another. And from that realization, MSOS was born.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">October 2022</p>
<h3>From One Event to a Bigger Vision</h3>
<p>After the success of the first Macedonian Student Party in Ljubljana, something changed. What began as a one-time event sparked a new energy among us. The group of volunteers who had worked side by side suddenly felt there was more to be done.</p>
<p>We started holding regular meetings and brainstorming sessions, often lasting late into the evening. In those small rooms, surrounded by notes and ideas scribbled on paper, we began to shape a bigger vision. We talked about what Macedonian students in Slovenia truly needed — not just parties, but support, connection, and a community they could rely on.</p>
<p>Those early sessions gave birth to our mission and vision. We didn't yet call ourselves an “organization," but we were slowly becoming one. What kept us going was the same spirit that created the first party — the belief that, together, we could make student life in Slovenia easier, warmer, and more meaningful.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">November 2022</p>
<h3>The Founding Team</h3>
<p>From the energy of the first events, a smaller circle of the most dedicated volunteers decided to take things further. They realized that for MSOS to grow, it needed structure, direction, and continuity. That was the moment when the first coordinating body was born — the group that would soon become the founding team of the organization.</p>
<p>This first team was made up of: Kristijan Popovski, Bisera Nikoloska, Marko Arsov, Ksenija Kraljevska, Aleksandar Balkoski, Kiara Lazić, Evgenija Kolovska, Dijana Dimkovska, Hristijan Bogdanovski, and Stefan Gjurovski. Each one brought something unique to the table — from leadership and creativity to organizational skills and dedication.</p>
<p>Together, they laid down the mission and vision, drafted the first structure, and set the foundations of what would grow into the official Macedonian Student Organization in Slovenia. At that time, no one could have imagined how quickly MSOS would evolve, but this team ensured that the idea would not remain just one successful party — it would become a movement.</p>
</div>
</div>
</div>
<!-- Year 2023 -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-year">2023</p>
<h2>From Idea to Tradition</h2>
<p>The year 2023 marked the transformation of MSOS from an emerging initiative into a recognizable student network. In March, we stepped into the public eye and immediately expanded beyond Ljubljana to Maribor and Koper. By September, we had already crossed borders with our first major panel event in Skopje, connecting future students with those already studying in Slovenia. 2023 was the year when MSOS stopped being just an idea and began building traditions that continue to grow today.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">March 2023</p>
<h3>Going Public</h3>
<p>On March 5, 2023, we officially introduced MSOS to the public as a student initiative. What had begun as an idea and a few events was now ready to be presented as something bigger — a movement with a clear mission and vision.</p>
<p>The launch was more than just an announcement. It was the moment when Macedonian students in Slovenia realized they had their own platform, their own voice, and a community they could call home. Through social media, word of mouth, and our first public activities, we reached students who until then felt scattered and disconnected.</p>
<p>For us as organizers, this was a defining step: MSOS was no longer just an idea among friends, but a name and a promise that other students could recognize and join. From that day on, everything became more serious — new projects, structured communication, and the understanding that we had a responsibility to represent and support our community.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">March 2023</p>
<h3>Growing Beyond Ljubljana</h3>
<p>The public launch of MSOS in March 2023 did more than just make us visible — it sparked a wave of interest across Slovenia. Very quickly, students from Maribor and Koper reached out, asking how they could get involved. What began as individual messages soon grew into local teams, ready to bring the MSOS spirit to their own cities.</p>
<p>This moment showed us that the need for community wasn't limited to Ljubljana. Macedonian students everywhere were looking for connection, support, and a network they could trust. With Maribor and Koper on board, MSOS transformed from a local initiative into a nationwide student presence, active across Slovenia's major university centers.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">September 2023</p>
<h3>"Meet Student Slovenia 2023"</h3>
<p>In September 2023, MSOS took a bold step — for the first time, we organized a panel event outside Slovenia, in Skopje. The idea was simple but powerful: bring together future students and their parents, and connect them directly with those already living and studying in Slovenia.</p>
<p>The turnout exceeded all expectations. More than 100 participants filled the NLB Gallery, eager to hear real stories; not from brochures or officials, but from students themselves. They spoke about everyday challenges, from housing and paperwork to making friends and building a new life far from home. The honesty of their experiences created an atmosphere that felt more like a family gathering than a formal event.</p>
<p>For many of the attendees, this was the first time they realized they were not alone in their worries. Questions that had been weighing on them for months found clear answers, and fears were replaced with excitement. For us as organizers, it was proof that MSOS was fulfilling its mission: to be the bridge between Macedonia and Slovenia, offering support even before students set foot in their new city.</p>
</div>
</div>
</div>
<!-- Year 2024 -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-year">2024</p>
<h2>From Recognition to Responsibility</h2>
<p>In 2024, MSOS grew into a fully recognized and nationwide student organization. We expanded to Nova Gorica, officially registered as an association on September 9, and organized our first international conference in Skopje. With Tour de Maribor on October 12, our local teams showed new energy and initiative, while on November 17 we signed a Memorandum of Cooperation with the Student Assembly of UKIM in Skopje. 2024 was the year MSOS gained legitimacy, broadened its reach, and strengthened its role as a bridge between students in Slovenia and Macedonia.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">May 2024</p>
<h3>Expanding to Nova Gorica</h3>
<p>By the spring of 2024, MSOS had already built a strong presence in Ljubljana, Maribor, and Koper. But one important piece was still missing: Nova Gorica. In May, we officially welcomed our first members from the University of Nova Gorica — students full of energy, motivation, and new perspectives.</p>
<p>For us, this expansion was more than just adding another city to the map. It symbolized the fact that MSOS was now present in all four major university centers in Slovenia. It meant that no matter where Macedonian students chose to study; from Ljubljana to the western border of the country, they could count on support, community, and a familiar face.</p>
<p>The arrival of the Nova Gorica team brought fresh energy and ideas into our organization, reminding us once again that MSOS is not only about structure, but about people who are ready to help each other and grow together.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">September 2024</p>
<h3>Official Registration</h3>
<p>On September 9, 2024, MSOS was officially registered in the Slovenian register of associations. This milestone marked a historic moment for us: from a student initiative built on enthusiasm and volunteer spirit, we became a legally recognized organization.</p>
<p>The registration gave us legitimacy to act as an institution, to run projects with legal backing, and to collaborate formally with universities, government bodies, and other organizations. For our team, it was more than a piece of paper — it was the confirmation that all the effort, countless volunteer hours, and shared vision had grown into something real and lasting.</p>
<p>That day we celebrated not just a legal status, but a sense of pride. MSOS was no longer just "our idea;" it became an organization that belongs to every Macedonian student in Slovenia.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<h3>First MSOS Conference</h3>
<p>Only a few weeks after our official registration, on September 25, 2024, MSOS took another bold step, organizing its first official conference in Skopje: "From Slovenia to North Macedonia: Synergy of Education and Business."</p>
<p>The event brought together three different worlds — students, government, and the business sector, around one shared question: How can young people educated abroad be motivated to return and contribute at home?</p>
<p>The program was divided into three panels:</p>
<ul>
<li><strong>Youth Panel</strong> where students educated in Slovenia shared their hopes, challenges, and perspectives on returning to Macedonia.</li>
<li><strong>Government Panel</strong> discussing policies for brain gain and the role of institutions in supporting young professionals.</li>
<li><strong>Business Panel</strong> focusing on how companies can create opportunities and incentives for returning graduates.</li>
</ul>
<p>The discussions touched on education, career opportunities, fair pay, and quality of life, the very factors that shape whether young people see a future in their home country.</p>
<p>For MSOS, this conference was more than an event. It was proof that our organization can go beyond student parties and support groups, and become a credible voice in debates about youth, education, and the future of Macedonia. It was a moment when we showed that student initiatives can grow into platforms that connect countries, generations, and sectors.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">October 2024</p>
<h3>Tour de Maribor</h3>
<p>On October 12, 2024, our Maribor team organized its first event — Tour de Maribor. The idea was to welcome new students by turning the entire city into a playground. Teams of participants received maps with 10 checkpoints, each offering a fun challenge: solving quizzes, making TikToks, trading random items, or snapping creative photos with Maribor's landmarks.</p>
<p>The adventure lasted for more than five hours and ended with prizes, music, and new friendships. But what mattered most wasn't the competition — it was the atmosphere. Strangers became teammates, teammates became friends, and Maribor students felt the spirit of MSOS as their own.</p>
<p>That day, something bigger was born: the MSOS spirit in Maribor. A new strength and initiative emerged, showing once again that MSOS isn't just about one city — it's about students everywhere who want to build a community together.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">November 2024</p>
<h3>Memorandum of Cooperation</h3>
<p>On International Students' Day, November 17, 2024, MSOS and the University Student Assembly at Ss. Cyril and Methodius University in Skopje signed a Memorandum of Cooperation.</p>
<p>With this step, we confirmed our joint commitment to improving student standards, strengthening regional cooperation, and creating a bridge for sharing best practices between Macedonia and Slovenia.</p>
<p>The memorandum symbolized more than a formal agreement — it was a recognition that Macedonian students abroad and at home share the same challenges and hopes. By working together, we opened a path for stronger collaboration, exchange of experiences, and building a student voice that crosses borders.</p>
</div>
</div>
</div>
<!-- Year 2025 -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-year">2025</p>
<h2>A Year of Community and New Beginnings</h2>
<p>In 2025, MSOS strengthened its presence across Slovenia with the first independent events from our teams in Nova Gorica and Koper. We stood in solidarity with Macedonia through peaceful gatherings and humanitarian actions, proving that our community is about more than student life alone. And with the upcoming opening of our first Student Hub in Ljubljana, 2025 marks a year of both unity and exciting new beginnings.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">March 2025</p>
<h3>Paint & Wine in Nova Gorica</h3>
<p>On International Women's Day, March 8, 2025, our team in Nova Gorica organized its very first independent event — a creative and vibrant Paint & Wine evening. With canvases, brushes, and a glass of wine in hand, students painted while enjoying the sunset accompanied by a live DJ set.</p>
<p>The event was more than just art and music. It was a celebration of creativity, diversity, and the energy of young people coming together in a relaxed and inspiring setting. For MSOS, it was also a proud milestone: proof that our local teams are not only active, but able to design and carry out unique events that reflect their own spirit and community.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<h3>MSOS Koper's First Event Handball Fan Zone</h3>
<p>On March 16, 2025, our MSOS Koper team organized its first event, a Fan Zone for the European Handball Championship qualification match between Macedonia and Slovenia. In cooperation with the Macedonian Handball Federation, we brought students together with face paints, red and yellow flags, Macedonian beer, and even arranged two buses from Ljubljana to Koper to cheer as one.</p>
<p>Sadly the event sadly stopped by the tragic news from Kochani. Despite this, the event showed the strength of our community and the passion of MSOS Koper in creating spaces where students unite and celebrate their identity.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">March-April 2025</p>
<h3>Solidarity for Kočani in difficult times</h3>
<p>In March and April 2025, MSOS stood together with the Macedonian community after the tragic events in Kočani. In Ljubljana, more than 700 people gathered in a peaceful vigil, filling the city square with candles and compassion. Soon after, our team in Maribor organized a charity basketball and football tournament, raising over €1,000 to support the families whose children were receiving treatment in Slovenia.</p>
<p>These moments reminded us that MSOS is not only about projects and events, but also about solidarity, empathy, and standing by our people in difficult times.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">October 2025</p>
<h3>Coming Soon MSOS Student Hub in Ljubljana</h3>
<p>The next big step for MSOS is the opening of our first Student Hub in Ljubljana this October. It will be a space for students to meet, work on projects, socialize, and create new ideas together. The Hub is envisioned as the new heart of our organization — a symbol of the community we have built and continue to grow.</p>
</div>
</div>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2025 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

View File

@ -0,0 +1,481 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Timeline & Milestones - 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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</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, mission, vision & core values</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="#">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="#">Student Welcome Guide</a></li>
<li><a href="#">Mentorship Programme</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Get to know Slovenia</a></li>
<li><a href="#">Get to know North Macedonia</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">News</a>
<ul class="dropdown-menu">
<li><a href="#">Announcements</a></li>
<li><a href="#">Open calls</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="si">Slovenščina (SI)</a>
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
<a href="#" data-lang="mk">Македонски (MK)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="page-content">
<!-- Timeline Header Section -->
<section class="page-header-section">
<div class="container text-center">
<span class="page-subtitle" style="text-transform: uppercase;">About us</span>
<h1>Timeline & Milestones</h1>
<p class="page-description">Learn more about the company and the team behind it.</p>
</div>
</section>
<!-- Timeline Banner -->
<div class="timeline-banner">
<img src="../../../images/about_us-timeline-milestones_img0.webp" alt="MSOS Team Group Photo">
</div>
<!-- Timeline Section -->
<section class="timeline-section">
<div class="timeline-container">
<!-- Year 2022 -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-year">2022</p>
<h2>The Beginning of a Movement</h2>
<p>What started as a simple idea in the summer of 2022 quickly grew into something much bigger. From the spark at a wine tasting in Ljubljana, to the first Macedonian Student Party with over 500 attendees, and finally the creation of the founding team, 2022 was the year when MSOS was born. It was a year of enthusiasm, countless volunteer hours, and the first steps toward building a community that Macedonian students in Slovenia had long been waiting for.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">August 2022</p>
<h3>The Spark of an Idea</h3>
<p>It all started at a wine tasting event in the heart of Ljubljana. Among friends and good conversation, our founder Kristijan Popovski was encouraged by his Slovenian peers to organize something truly Macedonian. Inspired, he posted in a Facebook group of Macedonians living in Slovenia, calling for volunteers to help bring the idea to life.</p>
<p>Around 40 volunteers responded — a group of students who, without even realizing it, were laying the foundations of what would later become MSOS. Day after day, we worked side by side, sharing the same air, fueled by excitement and the desire to create something new. At that point, we weren't thinking about “founding an organization" — we were just a group of people trying to make one unforgettable event happen.</p>
<p>Two weeks later, the first Macedonian Student Party in Ljubljana came to life. Expectations were exceeded: sponsors and donors joined in, volunteers gave their all, and more than 500 people showed up.</p>
<p>That night made one thing very clear: Macedonian students in Slovenia needed a space to connect, celebrate, and support one another. And from that realization, MSOS was born.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">October 2022</p>
<h3>From One Event to a Bigger Vision</h3>
<p>After the success of the first Macedonian Student Party in Ljubljana, something changed. What began as a one-time event sparked a new energy among us. The group of volunteers who had worked side by side suddenly felt there was more to be done.</p>
<p>We started holding regular meetings and brainstorming sessions, often lasting late into the evening. In those small rooms, surrounded by notes and ideas scribbled on paper, we began to shape a bigger vision. We talked about what Macedonian students in Slovenia truly needed — not just parties, but support, connection, and a community they could rely on.</p>
<p>Those early sessions gave birth to our mission and vision. We didn't yet call ourselves an “organization," but we were slowly becoming one. What kept us going was the same spirit that created the first party — the belief that, together, we could make student life in Slovenia easier, warmer, and more meaningful.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">November 2022</p>
<h3>The Founding Team</h3>
<p>From the energy of the first events, a smaller circle of the most dedicated volunteers decided to take things further. They realized that for MSOS to grow, it needed structure, direction, and continuity. That was the moment when the first coordinating body was born — the group that would soon become the founding team of the organization.</p>
<p>This first team was made up of: Kristijan Popovski, Bisera Nikoloska, Marko Arsov, Ksenija Kraljevska, Aleksandar Balkoski, Kiara Lazić, Evgenija Kolovska, Dijana Dimkovska, Hristijan Bogdanovski, and Stefan Gjurovski. Each one brought something unique to the table — from leadership and creativity to organizational skills and dedication.</p>
<p>Together, they laid down the mission and vision, drafted the first structure, and set the foundations of what would grow into the official Macedonian Student Organization in Slovenia. At that time, no one could have imagined how quickly MSOS would evolve, but this team ensured that the idea would not remain just one successful party — it would become a movement.</p>
</div>
</div>
</div>
<!-- Year 2023 -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-year">2023</p>
<h2>From Idea to Tradition</h2>
<p>The year 2023 marked the transformation of MSOS from an emerging initiative into a recognizable student network. In March, we stepped into the public eye and immediately expanded beyond Ljubljana to Maribor and Koper. By September, we had already crossed borders with our first major panel event in Skopje, connecting future students with those already studying in Slovenia. 2023 was the year when MSOS stopped being just an idea and began building traditions that continue to grow today.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">March 2023</p>
<h3>Going Public</h3>
<p>On March 5, 2023, we officially introduced MSOS to the public as a student initiative. What had begun as an idea and a few events was now ready to be presented as something bigger — a movement with a clear mission and vision.</p>
<p>The launch was more than just an announcement. It was the moment when Macedonian students in Slovenia realized they had their own platform, their own voice, and a community they could call home. Through social media, word of mouth, and our first public activities, we reached students who until then felt scattered and disconnected.</p>
<p>For us as organizers, this was a defining step: MSOS was no longer just an idea among friends, but a name and a promise that other students could recognize and join. From that day on, everything became more serious — new projects, structured communication, and the understanding that we had a responsibility to represent and support our community.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">March 2023</p>
<h3>Growing Beyond Ljubljana</h3>
<p>The public launch of MSOS in March 2023 did more than just make us visible — it sparked a wave of interest across Slovenia. Very quickly, students from Maribor and Koper reached out, asking how they could get involved. What began as individual messages soon grew into local teams, ready to bring the MSOS spirit to their own cities.</p>
<p>This moment showed us that the need for community wasn't limited to Ljubljana. Macedonian students everywhere were looking for connection, support, and a network they could trust. With Maribor and Koper on board, MSOS transformed from a local initiative into a nationwide student presence, active across Slovenia's major university centers.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">September 2023</p>
<h3>"Meet Student Slovenia 2023"</h3>
<p>In September 2023, MSOS took a bold step — for the first time, we organized a panel event outside Slovenia, in Skopje. The idea was simple but powerful: bring together future students and their parents, and connect them directly with those already living and studying in Slovenia.</p>
<p>The turnout exceeded all expectations. More than 100 participants filled the NLB Gallery, eager to hear real stories; not from brochures or officials, but from students themselves. They spoke about everyday challenges, from housing and paperwork to making friends and building a new life far from home. The honesty of their experiences created an atmosphere that felt more like a family gathering than a formal event.</p>
<p>For many of the attendees, this was the first time they realized they were not alone in their worries. Questions that had been weighing on them for months found clear answers, and fears were replaced with excitement. For us as organizers, it was proof that MSOS was fulfilling its mission: to be the bridge between Macedonia and Slovenia, offering support even before students set foot in their new city.</p>
</div>
</div>
</div>
<!-- Year 2024 -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-year">2024</p>
<h2>From Recognition to Responsibility</h2>
<p>In 2024, MSOS grew into a fully recognized and nationwide student organization. We expanded to Nova Gorica, officially registered as an association on September 9, and organized our first international conference in Skopje. With Tour de Maribor on October 12, our local teams showed new energy and initiative, while on November 17 we signed a Memorandum of Cooperation with the Student Assembly of UKIM in Skopje. 2024 was the year MSOS gained legitimacy, broadened its reach, and strengthened its role as a bridge between students in Slovenia and Macedonia.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">May 2024</p>
<h3>Expanding to Nova Gorica</h3>
<p>By the spring of 2024, MSOS had already built a strong presence in Ljubljana, Maribor, and Koper. But one important piece was still missing: Nova Gorica. In May, we officially welcomed our first members from the University of Nova Gorica — students full of energy, motivation, and new perspectives.</p>
<p>For us, this expansion was more than just adding another city to the map. It symbolized the fact that MSOS was now present in all four major university centers in Slovenia. It meant that no matter where Macedonian students chose to study; from Ljubljana to the western border of the country, they could count on support, community, and a familiar face.</p>
<p>The arrival of the Nova Gorica team brought fresh energy and ideas into our organization, reminding us once again that MSOS is not only about structure, but about people who are ready to help each other and grow together.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">September 2024</p>
<h3>Official Registration</h3>
<p>On September 9, 2024, MSOS was officially registered in the Slovenian register of associations. This milestone marked a historic moment for us: from a student initiative built on enthusiasm and volunteer spirit, we became a legally recognized organization.</p>
<p>The registration gave us legitimacy to act as an institution, to run projects with legal backing, and to collaborate formally with universities, government bodies, and other organizations. For our team, it was more than a piece of paper — it was the confirmation that all the effort, countless volunteer hours, and shared vision had grown into something real and lasting.</p>
<p>That day we celebrated not just a legal status, but a sense of pride. MSOS was no longer just "our idea;" it became an organization that belongs to every Macedonian student in Slovenia.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<h3>First MSOS Conference</h3>
<p>Only a few weeks after our official registration, on September 25, 2024, MSOS took another bold step, organizing its first official conference in Skopje: "From Slovenia to North Macedonia: Synergy of Education and Business."</p>
<p>The event brought together three different worlds — students, government, and the business sector, around one shared question: How can young people educated abroad be motivated to return and contribute at home?</p>
<p>The program was divided into three panels:</p>
<ul>
<li><strong>Youth Panel</strong> where students educated in Slovenia shared their hopes, challenges, and perspectives on returning to Macedonia.</li>
<li><strong>Government Panel</strong> discussing policies for brain gain and the role of institutions in supporting young professionals.</li>
<li><strong>Business Panel</strong> focusing on how companies can create opportunities and incentives for returning graduates.</li>
</ul>
<p>The discussions touched on education, career opportunities, fair pay, and quality of life, the very factors that shape whether young people see a future in their home country.</p>
<p>For MSOS, this conference was more than an event. It was proof that our organization can go beyond student parties and support groups, and become a credible voice in debates about youth, education, and the future of Macedonia. It was a moment when we showed that student initiatives can grow into platforms that connect countries, generations, and sectors.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">October 2024</p>
<h3>Tour de Maribor</h3>
<p>On October 12, 2024, our Maribor team organized its first event — Tour de Maribor. The idea was to welcome new students by turning the entire city into a playground. Teams of participants received maps with 10 checkpoints, each offering a fun challenge: solving quizzes, making TikToks, trading random items, or snapping creative photos with Maribor's landmarks.</p>
<p>The adventure lasted for more than five hours and ended with prizes, music, and new friendships. But what mattered most wasn't the competition — it was the atmosphere. Strangers became teammates, teammates became friends, and Maribor students felt the spirit of MSOS as their own.</p>
<p>That day, something bigger was born: the MSOS spirit in Maribor. A new strength and initiative emerged, showing once again that MSOS isn't just about one city — it's about students everywhere who want to build a community together.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">November 2024</p>
<h3>Memorandum of Cooperation</h3>
<p>On International Students' Day, November 17, 2024, MSOS and the University Student Assembly at Ss. Cyril and Methodius University in Skopje signed a Memorandum of Cooperation.</p>
<p>With this step, we confirmed our joint commitment to improving student standards, strengthening regional cooperation, and creating a bridge for sharing best practices between Macedonia and Slovenia.</p>
<p>The memorandum symbolized more than a formal agreement — it was a recognition that Macedonian students abroad and at home share the same challenges and hopes. By working together, we opened a path for stronger collaboration, exchange of experiences, and building a student voice that crosses borders.</p>
</div>
</div>
</div>
<!-- Year 2025 -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-year">2025</p>
<h2>A Year of Community and New Beginnings</h2>
<p>In 2025, MSOS strengthened its presence across Slovenia with the first independent events from our teams in Nova Gorica and Koper. We stood in solidarity with Macedonia through peaceful gatherings and humanitarian actions, proving that our community is about more than student life alone. And with the upcoming opening of our first Student Hub in Ljubljana, 2025 marks a year of both unity and exciting new beginnings.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">March 2025</p>
<h3>Paint & Wine in Nova Gorica</h3>
<p>On International Women's Day, March 8, 2025, our team in Nova Gorica organized its very first independent event — a creative and vibrant Paint & Wine evening. With canvases, brushes, and a glass of wine in hand, students painted while enjoying the sunset accompanied by a live DJ set.</p>
<p>The event was more than just art and music. It was a celebration of creativity, diversity, and the energy of young people coming together in a relaxed and inspiring setting. For MSOS, it was also a proud milestone: proof that our local teams are not only active, but able to design and carry out unique events that reflect their own spirit and community.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<h3>MSOS Koper's First Event Handball Fan Zone</h3>
<p>On March 16, 2025, our MSOS Koper team organized its first event, a Fan Zone for the European Handball Championship qualification match between Macedonia and Slovenia. In cooperation with the Macedonian Handball Federation, we brought students together with face paints, red and yellow flags, Macedonian beer, and even arranged two buses from Ljubljana to Koper to cheer as one.</p>
<p>Sadly the event sadly stopped by the tragic news from Kochani. Despite this, the event showed the strength of our community and the passion of MSOS Koper in creating spaces where students unite and celebrate their identity.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">March-April 2025</p>
<h3>Solidarity for Kočani in difficult times</h3>
<p>In March and April 2025, MSOS stood together with the Macedonian community after the tragic events in Kočani. In Ljubljana, more than 700 people gathered in a peaceful vigil, filling the city square with candles and compassion. Soon after, our team in Maribor organized a charity basketball and football tournament, raising over €1,000 to support the families whose children were receiving treatment in Slovenia.</p>
<p>These moments reminded us that MSOS is not only about projects and events, but also about solidarity, empathy, and standing by our people in difficult times.</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-marker milestone"></div>
<div class="timeline-entry">
<div class="timeline-content">
<p class="timeline-date">October 2025</p>
<h3>Coming Soon MSOS Student Hub in Ljubljana</h3>
<p>The next big step for MSOS is the opening of our first Student Hub in Ljubljana this October. It will be a space for students to meet, work on projects, socialize, and create new ideas together. The Hub is envisioned as the new heart of our organization — a symbol of the community we have built and continue to grow.</p>
</div>
</div>
</div>
</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>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>For students</h4>
<a href="#">Blog</a>
<a href="#">Gallery</a>
<a href="#">FAQs</a>
<a href="#">Brochure</a>
</div>
<div class="links-column">
<h4>Projects</h4>
<a href="#">Upcoming</a>
<a href="#">Previous</a>
</div>
<div class="links-column">
<h4>Organisation</h4>
<a href="#">About us</a>
<a href="#">Contact</a>
<a href="#">Documentation</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© MSOS org 2023 All rights reserved.</p>
<div class="legal-links">
<a href="#">Privacy policy</a>
<a href="#">Cookie Policy</a>
<a href="#">Legal Terms</a>
</div>
</div>
</div>
<script src="../../main.js"></script>
</footer>
<!-- END_FOOTER -->
</body>
</html>

64
export_code.sh Executable file
View File

@ -0,0 +1,64 @@
#!/bin/bash
# Nastavitev imena izhodne datoteke
OUTPUT_FILE="code_export.txt"
# Odstrani izhodno datoteko, če že obstaja, da začnemo s čisto datoteko
if [ -f "$OUTPUT_FILE" ]; then
rm "$OUTPUT_FILE"
fi
# Poišči vse datoteke, razen skritih datotek in določenih map (npr. node_modules).
# Dodane so izjeme za slike, videoposnetke, PDF-je, arhive in druge binarne datoteke
# neposredno v ukaz 'find' za boljšo zmogljivost.
find . -type f \
-not -path "*/\.*" \
-not -path "*node_modules*" \
-not -path "*vendor*" \
-not -path "*dist*" \
-not -path "*build*" \
-not -path "*/images/*" \
-not -iname "*.jpg" -not -iname "*.jpeg" \
-not -iname "*.png" -not -iname "*.gif" \
-not -iname "*.bmp" -not -iname "*.tiff" \
-not -iname "*.svg" -not -iname "*.ico" \
-not -iname "*.webp" \
-not -iname "*.mp4" -not -iname "*.mov" \
-not -iname "*.avi" -not -iname "*.mkv" \
-not -iname "*.webm" \
-not -iname "*.mp3" -not -iname "*.wav" \
-not -iname "*.ogg" -not -iname "*.flac" \
-not -iname "*.pdf" \
-not -iname "*.zip" \
-not -iname "*.tar" \
-not -iname "*.gz" \
-not -iname "*.bz2" \
-not -iname "*.rar" \
-not -iname "*.7z" \
-not -iname "*.doc" -not -iname "*.docx" \
-not -iname "*.xls" -not -iname "*.xlsx" \
-not -iname "*.ppt" -not -iname "*.pptx" \
-not -iname "*.eot" -not -iname "*.ttf" \
-not -iname "*.woff" -not -iname "*.woff2" \
| sort | while read -r file; do
# Preskoči samo izhodno datoteko in to skripto
if [[ "$file" == "./$OUTPUT_FILE" || "$file" == "./export_code.sh" ]]; then
continue
fi
# Dodatna varnostna preverba: preskoči slikovne datoteke po MIME tipu
if file --mime-type -b "$file" | grep -qiE '^(image)/'; then
continue
fi
# Dodaj ime datoteke in njeno vsebino v izhodno datoteko
echo "\"$file\" : " >> "$OUTPUT_FILE"
echo "\"\"\"" >> "$OUTPUT_FILE"
cat "$file" >> "$OUTPUT_FILE"
echo "\"\"\"" >> "$OUTPUT_FILE"
echo "" >> "$OUTPUT_FILE"
echo "" >> "$OUTPUT_FILE"
done
echo "Izvoz kode končan. Vsebina je shranjena v datoteko $OUTPUT_FILE"

BIN
favicon-96x96.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.5 KiB

BIN
favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

7
favicon.svg Normal file
View File

@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="152" height="152"><svg width="152" height="152" viewBox="0 0 152 152" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M62.4855 0.401367L98.1563 43.7625V43.764H98.1548C96.121 44.9356 94.3834 46.5612 93.0825 48.5037L38.1243 9.40846C45.5357 5.09231 53.7473 1.99802 62.4855 0.401367ZM119.026 49.4473L140.203 34.3826C137.707 30.4413 134.856 26.7483 131.694 23.3447L114.379 44.3922C116.288 45.6994 117.88 47.4286 119.026 49.4458V49.4473ZM90.5239 56.9371C90.5239 58.3798 90.73 59.7754 91.1071 61.0978L20.7795 72.1632C19.3106 66.6922 18.5579 61.0186 18.5579 55.2657C18.5579 49.5129 19.3396 43.8134 20.8421 38.2769L91.3637 51.9597C90.8216 53.5198 90.5239 55.1926 90.5239 56.9371ZM150.733 65.8469L147.835 65.3929L120.427 61.0798C120.8 59.7605 121.005 58.3725 121.005 56.9358C121.005 55.199 120.71 53.5338 120.172 51.9798L146.566 46.8592C147.024 48.0141 147.454 49.1826 147.856 50.3664C148.372 51.8869 148.642 53.4835 148.644 55.0893V55.1137C148.644 58.5858 148.374 62.0168 147.835 65.3914L150.733 65.8469ZM76.7974 92.054L97.6469 69.8029C95.6589 68.5521 93.9793 66.8564 92.7532 64.8545L53.2348 89.2934C54.7143 89.9546 56.2122 90.7149 57.6642 91.6671L57.7726 91.7341L60.2233 91.2679C62.4052 90.8535 64.6451 90.6433 66.8819 90.6433C70.2655 90.6433 73.6017 91.1262 76.7974 92.054ZM143.741 79.8757C141.818 84.5331 139.347 88.959 136.368 93.077L114.305 69.5325C116.207 68.2451 117.8 66.5387 118.956 64.5475L143.741 79.8757ZM101.329 117.673C106.341 116.249 111.129 114.241 115.613 111.695L109.338 71.7161C108.191 71.9918 106.996 72.1412 105.763 72.1412C104.609 72.1412 103.487 72.0086 102.406 71.7664L98.2664 109.574C99.6131 112.131 100.644 114.85 101.329 117.673ZM108.823 42.0357L112.505 8.40534C107.199 5.50454 101.507 3.22077 95.5259 1.64849L101.894 42.2246C103.13 41.9016 104.428 41.7279 105.765 41.7279C106.813 41.7279 107.836 41.833 108.823 42.0341V42.0357ZM117.695 56.9371C117.695 63.5111 112.354 68.8404 105.765 68.8404C99.1766 68.8404 93.8356 63.5111 93.8356 56.9371C93.8356 50.363 99.1766 45.0338 105.765 45.0338C112.354 45.0338 117.695 50.363 117.695 56.9371Z" fill="#FFE16E"></path>
<path d="M151.698 74.3473C151.698 112.076 123.972 143.334 87.7438 148.964C88.9134 146.645 88.6996 143.945 87.1452 141.518L87.1239 141.485C85.5573 139.108 83.9816 136.742 82.441 134.455C81.1798 132.234 78.9063 130.913 76.3228 130.913C74.5944 130.913 72.8843 131.525 71.562 132.589C70.2168 131.373 68.438 130.689 66.4867 130.689C64.5353 130.689 62.8833 131.327 61.5366 132.404C60.3517 131.667 58.9775 131.26 57.5224 131.26C55.5467 131.26 53.5342 132.084 52.1555 133.69C51.563 133.515 50.937 133.424 50.2912 133.424C46.8007 133.424 44.0997 136.076 44.0111 139.592V139.643C44.0005 140.612 44.2264 141.448 44.5425 142.166L43.7928 142.908C40.5039 144.568 38.1083 143.806 36.4547 141.785C36.0714 141.317 46.2159 129.65 46.0678 129.062L34.6453 140.872C31.1106 143.005 27.2354 143.103 25.4368 140.904C25.1436 140.546 24.9222 140.145 24.768 139.714C24.6352 139.339 42.7286 122.995 42.695 122.579L23.6564 138.029C21.586 138.311 20.0087 137.74 19.0835 136.292C17.0283 133.078 22.4548 128.931 22.4548 128.931C22.4548 128.931 45.9564 110.324 46.532 110.324L46.7244 110.327L46.9153 110.306C46.9259 110.304 46.9366 110.304 46.9473 110.304C46.9947 110.304 47.0359 110.315 47.074 110.339C47.5077 110.609 47.9566 110.941 48.3902 111.261C48.5612 111.387 48.7277 111.509 48.888 111.625C51.2455 113.324 53.8182 115.03 57.043 115.617C57.753 115.745 58.4889 115.81 59.231 115.81C62.1672 115.81 64.7094 114.837 66.3935 113.069C67.5921 111.809 68.8503 109.556 68.0304 105.967C67.6776 104.416 66.96 102.729 65.8378 100.811C64.3995 98.3566 62.6863 96.1353 60.7945 94.2614C62.7657 93.8866 64.7995 93.69 66.8821 93.69C83.2136 93.69 96.7203 105.752 98.9464 121.435C126.189 115.1 147.17 92.5017 151.051 64.4551C151.477 67.6926 151.698 70.9941 151.698 74.3473Z" fill="#FA7850"></path>
<path fill-rule="evenodd" clip-rule="evenodd" d="M28.3772 119.892C27.3899 120.602 26.4169 121.301 25.5081 122.113V122.111L20.7565 125.711C8.33842 112.259 0.75293 94.2962 0.75293 74.565C0.75293 51.6953 10.9417 31.2008 27.0365 17.3535C19.7533 28.1934 15.504 41.605 15.504 55.2634C15.504 68.9218 19.5304 81.6402 26.4624 92.3049C30.4964 90.5041 34.9671 89.5016 39.6713 89.5016C43.0411 89.5016 46.2888 90.0151 49.3441 90.9688C51.6542 91.8905 53.9308 92.858 56.018 94.2322L56.4746 94.5156C59.1817 96.6089 61.4781 99.4061 63.2004 102.346C64.5685 104.685 66.4465 108.587 64.1791 110.968C62.582 112.646 59.7619 113.011 57.5892 112.617C54.9813 112.143 52.7811 110.67 50.674 109.152C50.5244 109.044 50.3686 108.929 50.2073 108.81C49.7395 108.465 49.2261 108.086 48.689 107.752C48.0432 107.35 47.2996 107.196 46.5804 107.275C44.8911 107.248 43.3993 108.477 42.0953 109.551C41.9354 109.683 41.7784 109.812 41.6242 109.937C39.5019 111.651 37.3505 113.327 35.1488 114.937C34.4008 115.484 33.6542 116.034 32.9075 116.584C31.4243 117.675 29.9408 118.767 28.4458 119.843L28.3772 119.892ZM79.8313 136.045C81.4238 138.407 83.0026 140.779 84.5707 143.159V143.16C88.0627 148.613 79.9412 153.4 76.6157 146.2C76.9547 148.911 74.7728 151.366 72.032 151.346C69.459 151.419 68.1653 149.365 66.9788 147.482C66.8973 147.353 66.8162 147.224 66.7353 147.097C65.9291 150.644 60.7592 151.311 59.072 148.093C58.776 147.672 58.4926 147.242 58.2092 146.812C57.9721 146.452 57.7349 146.092 57.4901 145.736C57.4199 148.977 52.8454 149.978 51.3979 147.13C50.5032 145.822 49.6267 144.501 48.761 143.172C48.5949 142.906 48.4099 142.647 48.2248 142.388C47.639 141.569 47.0523 140.749 47.0616 139.67C47.1563 135.958 52.0407 135.32 53.4638 138.583C53.6103 133.416 59.9346 132.846 61.8951 137.342C62.6326 133.292 68.4683 132.386 70.4105 136.003C70.9678 136.815 71.5099 137.637 72.0504 138.462C71.5755 134.056 77.7685 132.204 79.8313 136.045Z" fill="#2D738C"></path>
</svg><style>@media (prefers-color-scheme: light) { :root { filter: none; } }
@media (prefers-color-scheme: dark) { :root { filter: none; } }
</style></svg>

After

Width:  |  Height:  |  Size: 5.9 KiB

BIN
images/.DS_Store vendored Normal file

Binary file not shown.

BIN
images/1-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

BIN
images/10-girl1.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB

BIN
images/11-boy.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 72 KiB

BIN
images/12-girl2.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

BIN
images/13-whitelogo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 KiB

BIN
images/2.hero.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 145 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

BIN
images/3.activites.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 202 KiB

BIN
images/4-billwalsh.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 190 KiB

BIN
images/5-pmmentals.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

BIN
images/9-becomepart.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 82 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 150 KiB

BIN
images/about_kristijan.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

BIN
images/about_lea.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 111 KiB

BIN
images/about_lea_min.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 121 KiB

BIN
images/about_marija.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 91 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

BIN
images/about_marko.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 151 KiB

BIN
images/about_mission.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
images/about_monika.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 84 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 158 KiB

BIN
images/about_vision.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 96 KiB

BIN
images/amazing_team.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 82 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB

BIN
images/event3-photo-1.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 164 KiB

BIN
images/event3-photo-10.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 135 KiB

BIN
images/event3-photo-2.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 139 KiB

BIN
images/event3-photo-3.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

BIN
images/event3-photo-4.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 191 KiB

BIN
images/event3-photo-5.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 145 KiB

BIN
images/event3-photo-6.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 85 KiB

BIN
images/event3-photo-7.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 155 KiB

BIN
images/event3-photo-8.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 106 KiB

BIN
images/event3-photo-9.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 106 KiB

BIN
images/event4-image1.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 163 KiB

BIN
images/event4-image2.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 KiB

BIN
images/event4-image3.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 47 KiB

BIN
images/event4-image4.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 111 KiB

BIN
images/event4-image5.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

BIN
images/event4-image6.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 238 KiB

BIN
images/event4-image7.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 164 KiB

BIN
images/event4-img-1.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 119 KiB

BIN
images/event4-img-10.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

BIN
images/event4-img-11.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 158 KiB

BIN
images/event4-img-12.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 142 KiB

BIN
images/event4-img-2.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 130 KiB

Some files were not shown because too many files have changed in this diff Show More