mark
/
msos
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: mark:90055985fd9a65fcb23c73026c6a121330837cf9
Branches Tags
mark:master
mark:develop
..
compare: mark:8024c67fcf85649fc6cf1129298b0762badd9f20
Branches Tags
mark:develop
mark:master

No commits in common. "90055985fd9a65fcb23c73026c6a121330837cf9" and "8024c67fcf85649fc6cf1129298b0762badd9f20" have entirely different histories.
90055985fd ... 8024c67fcf

15 changed files with 156 additions and 153 deletions
Show Stats Expand all files Collapse all files

36
code_export.txt
View File

@ -4208,7 +4208,7 @@ footer hr {
</div> </div>
<div class="team-content"> <div class="team-content">
<h2>Meet our incredible team!</h2> <h2>Meet our incredible team!</h2>
<p>It’s not just about studying. It’s about meeting people, sharing stories, and making Slovenia feel like home.</p> <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>
<button class="btn btn-secondary">Learn more</button> <button class="btn btn-secondary">Learn more</button>
</div> </div>
</section> </section>
@ -4216,7 +4216,7 @@ footer hr {
<section class="activities-section"> <section class="activities-section">
<div class="activities-header"> <div class="activities-header">
<h2>Activities</h2> <h2>Activities</h2>
<p>It’s not just about studying. It’s about meeting people, sharing stories, and making Slovenia feel like home.</p> <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>
<div class="activities-content"> <div class="activities-content">
<div class="activities-nav"> <div class="activities-nav">
@ -4238,7 +4238,7 @@ footer hr {
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Latest news</h2> <h2>Latest news</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">
@ -4271,8 +4271,8 @@ footer hr {
<section class="testimonials-section"> <section class="testimonials-section">
<div class="testimonials-intro"> <div class="testimonials-intro">
<h2>See what they say about us</h2> <h2>See what our partners say about us</h2>
<p>Hear from our students and partners about what MSOS means to them — from settling in to building a strong community</p> <p>Everything you need to know about the product and billing.</p>
</div> </div>
<div class="testimonials-columns"> <div class="testimonials-columns">
<div class="testimonial-column"> <div class="testimonial-column">
@ -4329,7 +4329,7 @@ footer hr {
<section class="become-part-section"> <section class="become-part-section">
<div class="become-part-header"> <div class="become-part-header">
<h2>Become part of our amazing team</h2> <h2>Become part of our amazing team</h2>
<p>Join MSOS and be part of a community that supports, connects, and inspires students in Slovenia!</p> <p>We're a 100% remote team spread all across the world. Join us!</p>
</div> </div>
<img src="../images/9-becomepart.webp" alt="Our amazing team in a classroom setting" class="team-photo"> <img src="../images/9-becomepart.webp" alt="Our amazing team in a classroom setting" class="team-photo">
@ -4376,7 +4376,7 @@ footer hr {
<section class="faq-section"> <section class="faq-section">
<div class="faq-header"> <div class="faq-header">
<h2>Frequently asked questions</h2> <h2>Frequently asked questions</h2>
<p>Hear from our students and partners about what MSOS means to them — from settling in to building a strong community</p> <p>Everything you need to know about the product and billing.</p>
</div> </div>
<div class="faq-grid"> <div class="faq-grid">
<div class="faq-item"> <div class="faq-item">
@ -4691,7 +4691,7 @@ footer hr {
</div> </div>
<div class="team-content"> <div class="team-content">
<h2>Meet our incredible team!</h2> <h2>Meet our incredible team!</h2>
<p>It’s not just about studying. It’s about meeting people, sharing stories, and making Slovenia feel like home.</p> <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>
<button class="btn btn-secondary">Learn more</button> <button class="btn btn-secondary">Learn more</button>
</div> </div>
</section> </section>
@ -4699,7 +4699,7 @@ footer hr {
<section class="activities-section"> <section class="activities-section">
<div class="activities-header"> <div class="activities-header">
<h2>Activities</h2> <h2>Activities</h2>
<p>It’s not just about studying. It’s about meeting people, sharing stories, and making Slovenia feel like home.</p> <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>
<div class="activities-content"> <div class="activities-content">
<div class="activities-nav"> <div class="activities-nav">
@ -4721,7 +4721,7 @@ footer hr {
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Latest news</h2> <h2>Latest news</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">
@ -4754,8 +4754,8 @@ footer hr {
<section class="testimonials-section"> <section class="testimonials-section">
<div class="testimonials-intro"> <div class="testimonials-intro">
<h2>See what they say about us</h2> <h2>See what our partners say about us</h2>
<p>Hear from our students and partners about what MSOS means to them — from settling in to building a strong community</p> <p>Everything you need to know about the product and billing.</p>
</div> </div>
<div class="testimonials-columns"> <div class="testimonials-columns">
<div class="testimonial-column"> <div class="testimonial-column">
@ -4812,7 +4812,7 @@ footer hr {
<section class="become-part-section"> <section class="become-part-section">
<div class="become-part-header"> <div class="become-part-header">
<h2>Become part of our amazing team</h2> <h2>Become part of our amazing team</h2>
<p>Join MSOS and be part of a community that supports, connects, and inspires students in Slovenia!</p> <p>We're a 100% remote team spread all across the world. Join us!</p>
</div> </div>
<img src="../images/9-becomepart.webp" alt="Our amazing team in a classroom setting" class="team-photo"> <img src="../images/9-becomepart.webp" alt="Our amazing team in a classroom setting" class="team-photo">
@ -4859,7 +4859,7 @@ footer hr {
<section class="faq-section"> <section class="faq-section">
<div class="faq-header"> <div class="faq-header">
<h2>Frequently asked questions</h2> <h2>Frequently asked questions</h2>
<p>Hear from our students and partners about what MSOS means to them — from settling in to building a strong community</p> <p>Everything you need to know about the product and billing.</p>
</div> </div>
<div class="faq-grid"> <div class="faq-grid">
<div class="faq-item"> <div class="faq-item">
@ -11405,7 +11405,7 @@ document.addEventListener('DOMContentLoaded', function() {
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Најнови вести</h2> <h2>Најнови вести</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">
@ -11799,7 +11799,7 @@ document.addEventListener('DOMContentLoaded', function() {
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Најнови вести</h2> <h2>Најнови вести</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">
@ -15685,7 +15685,7 @@ msos spletna stran
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Zadnje novice</h2> <h2>Zadnje novice</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">
@ -16079,7 +16079,7 @@ msos spletna stran
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Zadnje novice</h2> <h2>Zadnje novice</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">

127
css/pages/_home.css
View File

@ -6,14 +6,13 @@
* Ta datoteka vsebuje stile, ki se uporabljajo izključno na domači strani. * Ta datoteka vsebuje stile, ki se uporabljajo izključno na domači strani.
* *
* 1. Hero Section * 1. Hero Section
* 2. Partners Section * 2. Meet the Team Section
* 3. Meet the Team Section * 3. Activities Section
* 4. Activities Section * 4. Latest News Section
* 5. Latest News Section * 5. Testimonials Section
* 6. Testimonials Section * 6. Become Part Section (vključno z obrazcem)
* 7. Become Part Section (vključno z obrazcem) * 7. FAQ Section
* 8. FAQ Section * 8. Stili za domačo stran na mobilnih napravah
* 9. Stili za domačo stran na mobilnih napravah
*/ */
/* 1. Hero Section */ /* 1. Hero Section */
@ -34,21 +33,35 @@
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: 1; z-index: 1;
background: url('../../images/HeroSection-img1.JPG') no-repeat center center/cover;
filter: blur(2px);
} }
.hero-image-left, .hero-image-right { .hero-image-left, .hero-image-right {
display: none; position: absolute;
top: -150px;
height: 1030px;
width: 50%;
background-size: cover;
background-position: center;
}
.hero-image-left {
left: 0;
transform: matrix(-1, 0, 0, 1, 0, 0);
}
.hero-image-right {
right: 0;
} }
.hero-overlay { .hero-overlay {
position: absolute; position: absolute;
top: 0; top: 79px;
left: 0; left: 0;
height: 100%; height: 801px;
width: 100%; width: 56.74%;
background: rgba(45, 115, 140, 0.64); background: linear-gradient(122.4deg, rgba(19, 49, 60, 0.92) 35.41%, rgba(39, 77, 90, 0.08) 92.92%);
border-radius: 0px 40px 40px 0px;
backdrop-filter: blur(12px);
z-index: 2; z-index: 2;
} }
@ -56,26 +69,23 @@
position: relative; position: relative;
z-index: 3; z-index: 3;
color: #FFFFFF; color: #FFFFFF;
width: 100%; padding-left: 120px;
max-width: 1000px; width: 605px;
margin: 0 auto;
text-align: center;
padding: 0 24px;
} }
.hero-content .badge-group { .hero-content .badge-group {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
padding: 8px 24px; padding: 6px 16px;
gap: 12px; gap: 12px;
background: rgba(255, 255, 255, 0.4); background: rgba(255, 255, 255, 0.4);
border-radius: 24px; border-radius: 16px;
margin-bottom: 32px; margin-bottom: 32px;
} }
.hero-content .message { .hero-content .message {
font-weight: 400; font-weight: 500;
font-size: 18px; font-size: 14px;
} }
.hero-content h1 { .hero-content h1 {
@ -92,28 +102,7 @@
margin: 0 0 72px 0; margin: 0 0 72px 0;
} }
/* 2. Partners Section */ /* 2. Meet the Team 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 { .meet-the-team-section {
display: flex; display: flex;
@ -168,7 +157,7 @@
margin: 0 0 56px 0; margin: 0 0 56px 0;
} }
/* 4. Activities Section */ /* 3. Activities Section */
.activities-section { .activities-section {
padding: 128px 80px; padding: 128px 80px;
@ -262,7 +251,7 @@
border-radius: 24px; border-radius: 24px;
} }
/* 5. Latest News Section */ /* 4. Latest News Section */
.latest-news-section { .latest-news-section {
padding: 128px 0; padding: 128px 0;
@ -298,7 +287,7 @@
margin-bottom: 64px; margin-bottom: 64px;
} }
/* 6. Testimonials Section */ /* 5. Testimonials Section */
.testimonials-section { .testimonials-section {
padding: 128px 80px; padding: 128px 80px;
@ -354,7 +343,7 @@
margin-top: 80px; margin-top: 80px;
} }
/* 7. Become Part Section */ /* 6. Become Part Section */
.become-part-section { .become-part-section {
padding: 128px 0; padding: 128px 0;
@ -390,6 +379,7 @@
display: block; display: block;
} }
/* Stili za obrazec znotraj sekcije */
.contact-form-container { .contact-form-container {
max-width: 800px; max-width: 800px;
margin: 0 auto; margin: 0 auto;
@ -479,7 +469,7 @@
font-size: 16px; font-size: 16px;
} }
/* 8. FAQ Section */ /* 7. FAQ Section */
.faq-section { .faq-section {
padding: 128px 0; padding: 128px 0;
@ -595,7 +585,7 @@
/* ========================================================================== /* ==========================================================================
9. Mobile Home Page Styles Mobile Home Page Styles
========================================================================== */ ========================================================================== */
@media (max-width: 768px) { @media (max-width: 768px) {
@ -606,9 +596,25 @@
margin-top: 0; margin-top: 0;
align-items: flex-start; align-items: flex-start;
} }
.hero-background {
background: url('../../images/HeroSection-img1.JPG') no-repeat center center/cover; .hero-overlay, .hero-image-left, .hero-image-right {
display: none;
} }
.hero-background {
background: url('../images/2.hero.jpg') no-repeat center center/cover;
}
.hero-background::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(122.4deg, rgba(19, 49, 60, 0.92) 35.41%, rgba(39, 77, 90, 0.08) 92.92%);
}
.hero-content { .hero-content {
padding: 64px 24px; padding: 64px 24px;
width: 100%; width: 100%;
@ -628,19 +634,6 @@
border-radius: 37px; 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 */ /* Mobile Meet the Team Section */
.meet-the-team-section { .meet-the-team-section {
flex-direction: column; flex-direction: column;

30
en/about-us/index.html
View File

@ -194,12 +194,12 @@
<div class="member-content"> <div class="member-content">
<div class="member-socials"> <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="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.linkedin.com/in/popovski-k?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" 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> <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>
<div class="member-info"> <div class="member-info">
<h4>Kristijan Popovski</h4> <h4>Kristijan Popovski</h4>
<p class="role">FOUNDER AND PRESIDENT</p> <p class="role">Founder and President</p>
</div> </div>
</div> </div>
</div> </div>
@ -208,12 +208,12 @@
<div class="member-content"> <div class="member-content">
<div class="member-socials"> <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="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.linkedin.com/in/lea-janachkovska-9833b9246?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" 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> <a href="https://www.instagram.com/lea_janackovska?igsh=djl0M2hjMXc0cWF2" target="_blank" aria-label="Instagram profile of Lea Janachkovska"><i class="fab fa-instagram"></i></a>
</div> </div>
<div class="member-info"> <div class="member-info">
<h4>Lea Janachkovska</h4> <h4>Lea Janachkovska</h4>
<p class="role">HUMAN RESOURCES</p> <p class="role">Board Member</p>
</div> </div>
</div> </div>
</div> </div>
@ -222,12 +222,12 @@
<div class="member-content"> <div class="member-content">
<div class="member-socials"> <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="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.linkedin.com/in/marko-arsov-3313202b9?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" 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> <a href="https://www.instagram.com/marko.arsov?igsh=OXh6dnRkNGNuZmpw" target="_blank" aria-label="Instagram profile of Marko Arsov"><i class="fab fa-instagram"></i></a>
</div> </div>
<div class="member-info"> <div class="member-info">
<h4>Marko Arsov</h4> <h4>Marko Arsov</h4>
<p class="role">EVENT MANAGER</p> <p class="role">Board Member</p>
</div> </div>
</div> </div>
</div> </div>
@ -236,12 +236,12 @@
<div class="member-content"> <div class="member-content">
<div class="member-socials"> <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="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.linkedin.com/in/marija-koshtrevska?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" 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> <a href="https://www.instagram.com/koshtrevska_10?igsh=eng3a2RlNHA5NGRn" target="_blank" aria-label="Instagram profile of Marija Koshtrevska"><i class="fab fa-instagram"></i></a>
</div> </div>
<div class="member-info"> <div class="member-info">
<h4>Marija Koshtrevska</h4> <h4>Marija Koshtrevska</h4>
<p class="role">IT COORDINATOR</p> <p class="role">Board Member</p>
</div> </div>
</div> </div>
</div> </div>
@ -250,12 +250,12 @@
<div class="member-content"> <div class="member-content">
<div class="member-socials"> <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="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.linkedin.com/in/monika-velinova-21632517a?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" 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> <a href="https://www.instagram.com/monivelinova?igsh=MTUxOGRmNjNkeXdiaA==" target="_blank" aria-label="Instagram profile of Monika Velinova"><i class="fab fa-instagram"></i></a>
</div> </div>
<div class="member-info"> <div class="member-info">
<h4>Monika Velinova</h4> <h4>Monika Velinova</h4>
<p class="role">SECRETARY</p> <p class="role">Board Member</p>
</div> </div>
</div> </div>
</div> </div>
@ -397,4 +397,4 @@
<!-- END_FOOTER --> <!-- END_FOOTER -->
</body> </body>
</html> </html>

70
en/index.html
View File

@ -33,7 +33,7 @@
<li class="menu-item menu-item-has-children"> <li class="menu-item menu-item-has-children">
<a href="#">Who We Are</a> <a href="#">Who We Are</a>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li><a href="../en/about-us/timeline-and-milestones/">Timeline & Milestones</a></li> <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> <li><a href="../en/about-us/">Our team, mission, vision & core values</a></li>
</ul> </ul>
</li> </li>
@ -105,7 +105,7 @@
<li class="menu-item menu-item-has-children"> <li class="menu-item menu-item-has-children">
<a href="#">Who We Are</a> <a href="#">Who We Are</a>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li><a href="../en/about-us/timeline-and-milestones/">Timeline & Milestones</a></li> <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> <li><a href="../en/about-us/">Our team, mission, vision & core values</a></li>
</ul> </ul>
</li> </li>
@ -175,28 +175,22 @@
<main> <main>
<section class="hero-section"> <section class="hero-section">
<div class="hero-background"></div> <div class="hero-background">
<div class="hero-image-left" style="background-image: url('../images/2.hero.webp');"></div>
<div class="hero-image-right" style="background-image: url('../images/2.hero.webp');"></div>
</div>
<div class="hero-overlay"></div> <div class="hero-overlay"></div>
<div class="hero-content"> <div class="hero-content">
<div class="heading-and-supporting-text"> <div class="heading-and-supporting-text">
<div class="badge-group"> <div class="badge-group">
<div class="badge-content"> <div class="badge-content">
<span class="message">First official Macedonian Student Organisation in Slovenia</span> <span class="message">First official MSOS</span>
</div> </div>
</div> </div>
<h1>Empowering young people with skills to change the world</h1> <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> <p>Whether you have a team of 2 or 200, our shared team inboxes keep everyone on the same page and in the loop.</p>
</div> </div>
<button class="btn btn-primary-orange">Become a member</button> <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.png" alt="Slovenian Embassy in Skopje logo">
<img src="../images/5.%20UL_EF-logoENG-HOR-CMYK_color-1.png" alt="University of Ljubljana School of Economics and Business logo">
<img src="../images/3.%20Logo_NLB_Banka_CMYK_MAC-1.png" alt="NLB Banka logo">
<img src="../images/1.%20mkd%20embassy%20in%20slovenia.png" alt="Embassy of North Macedonia in Slovenia logo">
</div> </div>
</section> </section>
@ -207,9 +201,9 @@
<button class="play-button" aria-label="Play video"></button> <button class="play-button" aria-label="Play video"></button>
</div> </div>
<div class="team-content"> <div class="team-content">
<h2>Every Student Has a Story – Here’s Ours</h2> <h2>Meet our incredible team!</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> <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>
<a href="../en/about-us/" class="btn btn-secondary">Learn more</a> <button class="btn btn-secondary">Learn more</button>
</div> </div>
</section> </section>
@ -221,15 +215,15 @@
<div class="activities-content"> <div class="activities-content">
<div class="activities-nav"> <div class="activities-nav">
<ul> <ul>
<li class="active">Student Support</li> <li class="active">Student representation</li>
<li>Fun & Social Life</li> <li>Education and culture</li>
<li>Education & Culture</li> <li>Entertainment and socializing</li>
<li>Student Representation</li> <li>Student support</li>
</ul> </ul>
<button class="btn btn-primary-orange">Become a member</button> <button class="btn btn-primary-orange">Become a member</button>
</div> </div>
<div class="activity-details"> <div class="activity-details">
<p>We know moving to a new country can feel overwhelming, so we’re 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, you’ll never have to go through the journey alone.</p> <p>Sed molestie penatibus sit bibendum pharetra purus faucibus fames aliquet. Morbi morbi ac sed tempor porta. Dui iaculis vitae fames sapien. Pellentesque urna eget habitasse arcu sed ornare. Dignissim lobortis ultrices maecenas magna ac habitant donec etiam at.</p>
<img src="../images/3.activites.webp" alt="A group of students smiling and collaborating"> <img src="../images/3.activites.webp" alt="A group of students smiling and collaborating">
</div> </div>
</div> </div>
@ -266,7 +260,7 @@
</div> </div>
</article> </article>
</div> </div>
<a href="../en/projects/" class="btn btn-secondary">See all</a> <button class="btn btn-secondary">See all</button>
</section> </section>
<section class="testimonials-section"> <section class="testimonials-section">
@ -376,38 +370,38 @@
<section class="faq-section"> <section class="faq-section">
<div class="faq-header"> <div class="faq-header">
<h2>Frequently asked questions</h2> <h2>Frequently asked questions</h2>
<p>Everything you wanted to know about studying and living in Slovenia — in one place.</p> <p>Everything you need to know about the product and billing.</p>
</div> </div>
<div class="faq-grid"> <div class="faq-grid">
<div class="faq-item"> <div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-heart"></i></div> <div class="faq-icon-container"><i class="fas fa-heart"></i></div>
<h3>How can I get a student visa or residence permit?</h3> <h3>Is there a free trial available?</h3>
<p>Quick guide on what documents you need and how long it takes.</p> <p>Yes, you can try us for free for 30 days. Our friendly team will work with you to get you up and running as soon as possible.</p>
</div> </div>
<div class="faq-item"> <div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-sync-alt"></i></div> <div class="faq-icon-container"><i class="fas fa-sync-alt"></i></div>
<h3>What is the cost of living & housing in Slovenia?</h3> <h3>Can I change my plan later?</h3>
<p>See average monthly expenses and where to find affordable housing.</p> <p>Of course. Our pricing scales with your company. Chat to our friendly team to find a solution that works for you.</p>
</div> </div>
<div class="faq-item"> <div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-ban"></i></div> <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> <h3>What is your cancellation policy?</h3>
<p>Find out which programs are in English—and when learning Slovene helps.</p> <p>We understand that things change. You can cancel your plan at any time and we’ll refund you the difference already paid.</p>
</div> </div>
<div class="faq-item"> <div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-plus-circle"></i></div> <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> <h3>Can other info be added to an invoice?</h3>
<p>Learn about the student work possibilities and how to manage it while studying.</p> <p>Yes, you can try us for free for 30 days. Our friendly team will work with you to get you up and running as soon as possible.</p>
</div> </div>
<div class="faq-item"> <div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-credit-card"></i></div> <div class="faq-icon-container"><i class="fas fa-credit-card"></i></div>
<h3>What student benefits and discounts are available?</h3> <h3>How does billing work?</h3>
<p>Ever heard of ‘Boni’? Student meal coupons that make eating out more affordable and planty more.</p> <p>Of course. Our pricing scales with your company. Chat to our friendly team to find a solution that works for you.</p>
</div> </div>
<div class="faq-item"> <div class="faq-item">
<div class="faq-icon-container"><i class="fas fa-envelope"></i></div> <div class="faq-icon-container"><i class="fas fa-envelope"></i></div>
<h3>What are tuition fees and are there scholarships?</h3> <h3>How do I change my account email?</h3>
<p>Info on tuition ranges and where to look for funding or fee waivers.</p> <p>We understand that things change. You can cancel your plan at any time and we’ll refund you the difference.</p>
</div> </div>
</div> </div>
<div class="faq-footer"> <div class="faq-footer">
@ -480,4 +474,4 @@
<!-- END_FOOTER --> <!-- END_FOOTER -->
</body> </body>
</html> </html>

14
en/index.html.bak
View File

@ -202,7 +202,7 @@
</div> </div>
<div class="team-content"> <div class="team-content">
<h2>Meet our incredible team!</h2> <h2>Meet our incredible team!</h2>
<p>It’s not just about studying. It’s about meeting people, sharing stories, and making Slovenia feel like home.</p> <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>
<button class="btn btn-secondary">Learn more</button> <button class="btn btn-secondary">Learn more</button>
</div> </div>
</section> </section>
@ -210,7 +210,7 @@
<section class="activities-section"> <section class="activities-section">
<div class="activities-header"> <div class="activities-header">
<h2>Activities</h2> <h2>Activities</h2>
<p>It’s not just about studying. It’s about meeting people, sharing stories, and making Slovenia feel like home.</p> <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>
<div class="activities-content"> <div class="activities-content">
<div class="activities-nav"> <div class="activities-nav">
@ -232,7 +232,7 @@
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Latest news</h2> <h2>Latest news</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">
@ -265,8 +265,8 @@
<section class="testimonials-section"> <section class="testimonials-section">
<div class="testimonials-intro"> <div class="testimonials-intro">
<h2>See what they say about us</h2> <h2>See what our partners say about us</h2>
<p>Hear from our students and partners about what MSOS means to them — from settling in to building a strong community</p> <p>Everything you need to know about the product and billing.</p>
</div> </div>
<div class="testimonials-columns"> <div class="testimonials-columns">
<div class="testimonial-column"> <div class="testimonial-column">
@ -323,7 +323,7 @@
<section class="become-part-section"> <section class="become-part-section">
<div class="become-part-header"> <div class="become-part-header">
<h2>Become part of our amazing team</h2> <h2>Become part of our amazing team</h2>
<p>Join MSOS and be part of a community that supports, connects, and inspires students in Slovenia!</p> <p>We're a 100% remote team spread all across the world. Join us!</p>
</div> </div>
<img src="../images/9-becomepart.webp" alt="Our amazing team in a classroom setting" class="team-photo"> <img src="../images/9-becomepart.webp" alt="Our amazing team in a classroom setting" class="team-photo">
@ -370,7 +370,7 @@
<section class="faq-section"> <section class="faq-section">
<div class="faq-header"> <div class="faq-header">
<h2>Frequently asked questions</h2> <h2>Frequently asked questions</h2>
<p>Hear from our students and partners about what MSOS means to them — from settling in to building a strong community</p> <p>Everything you need to know about the product and billing.</p>
</div> </div>
<div class="faq-grid"> <div class="faq-grid">
<div class="faq-item"> <div class="faq-item">

BIN
images/1. mkd embassy in slovenia.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 47 KiB

BIN
images/2. Slo embassy in Skopje_mcd-1.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 22 KiB

BIN
images/3. Logo_NLB_Banka_CMYK_MAC-1.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 57 KiB

BIN
images/5. UL_EF-logoENG-HOR-CMYK_color-1.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 96 KiB

BIN
images/HeroSection-img1.JPG
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 10 MiB

24
main.js
View File

@ -108,13 +108,16 @@ document.addEventListener('DOMContentLoaded', function() {
// --- Funkcionalnost za preklopnik jezika (Desktop Dropdown + Mobile Modal) --- // --- Funkcionalnost za preklopnik jezika (Desktop Dropdown + Mobile Modal) ---
function setupLanguageSwitcher() { function setupLanguageSwitcher() {
try { try {
// 1. POPRAVLJENA Logika za dinamično generiranje URL-jev
const path = window.location.pathname; const path = window.location.pathname;
const pathParts = path.split('/').filter(Boolean); const pathParts = path.split('/').filter(Boolean);
const validLangs = ['en', 'si', 'mk']; const validLangs = ['en', 'si', 'mk'];
let pathWithoutLang = '/'; let pathWithoutLang = '/';
if (pathParts.length > 0 && validLangs.includes(pathParts[0])) { if (pathParts.length > 0 && validLangs.includes(pathParts[0])) {
// Sestavi pot iz delov, ki sledijo jezikovni kodi
pathWithoutLang = '/' + pathParts.slice(1).join('/'); pathWithoutLang = '/' + pathParts.slice(1).join('/');
// Če se je originalna pot končala s '/', jo dodaj nazaj (za mape)
if (path.endsWith('/') && pathWithoutLang !== '/') { if (path.endsWith('/') && pathWithoutLang !== '/') {
pathWithoutLang += '/'; pathWithoutLang += '/';
} }
@ -124,10 +127,14 @@ document.addEventListener('DOMContentLoaded', function() {
document.querySelectorAll('a[data-lang]').forEach(link => { document.querySelectorAll('a[data-lang]').forEach(link => {
const targetLang = link.getAttribute('data-lang'); const targetLang = link.getAttribute('data-lang');
// Združi novo jezikovno kodo in preostanek poti
const newUrl = `/${targetLang}${pathWithoutLang}`; const newUrl = `/${targetLang}${pathWithoutLang}`;
// Zamenjaj morebitne dvojne poševnice z eno samo, razen na začetku
link.setAttribute('href', newUrl.replace(/\/{2,}/g, '/')); link.setAttribute('href', newUrl.replace(/\/{2,}/g, '/'));
}); });
// 2. POPRAVLJENA Logika za NAMIZNI dropdown
// Uporablja bolj specifičen selektor, ki se ujema z novo HTML strukturo
const desktopSelectors = document.querySelectorAll('.header-right-wrapper .language-selector'); const desktopSelectors = document.querySelectorAll('.header-right-wrapper .language-selector');
desktopSelectors.forEach(selector => { desktopSelectors.forEach(selector => {
const currentLang = selector.querySelector('.current-lang'); const currentLang = selector.querySelector('.current-lang');
@ -147,6 +154,7 @@ document.addEventListener('DOMContentLoaded', function() {
desktopSelectors.forEach(s => s.classList.remove('active')); desktopSelectors.forEach(s => s.classList.remove('active'));
}); });
// 3. Logika za MOBILNO modalno okno (ostaja enaka, vendar bo zdaj delovala pravilno)
const mobileLangButton = document.getElementById('mobile-lang-trigger'); const mobileLangButton = document.getElementById('mobile-lang-trigger');
const languageModal = document.getElementById('language-modal-overlay'); const languageModal = document.getElementById('language-modal-overlay');
const closeModalButton = document.getElementById('language-modal-close'); const closeModalButton = document.getElementById('language-modal-close');
@ -202,10 +210,18 @@ document.addEventListener('DOMContentLoaded', function() {
if (activityNavItems.length > 0 && activityDetailsText) { if (activityNavItems.length > 0 && activityDetailsText) {
const activitiesData = { const activitiesData = {
'Student Support': { text: "We know moving to a new country can feel overwhelming, so we’re 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, you’ll never have to go through the journey alone."}, 'Študentsko predstavništvo': { text: 'Vsebina za študentsko predstavništvo...'},
'Fun & Social Life': { text: "Student life is so much more than lectures and exams — it’s about the moments in between. At MSOS, we create those moments: from parties, concerts, and casual hangouts, to cinema nights, excursions, and team-building trips. We also host talks and events where you can share ideas, meet new people, and feel part of something bigger. Whether you’re connecting with Macedonian students or making friends with Slovenians and internationals, our activities are all about building a community where you can relax, have fun, and create memories that last long after university."}, 'Izobraževanje in kultura': { text: 'Vsebina za izobraževanje in kulturo...'},
'Education & Culture': { text: "Studying abroad isn’t only about lectures and exams — it’s also about growing as a person. That’s why we mix learning with culture. We run study groups and small workshops where you can share knowledge and pick up new skills. At the same time, we keep our traditions alive with cultural evenings, music, food, and gatherings that remind us of home. It’s a balance: support for your studies, and a space to stay connected to who we are."}, 'Zabava in druženje': { text: 'Vsebina za zabavo in druženje...'},
'Student Representation': { text: "Studying abroad comes with challenges, and sometimes students need a voice that’s heard. At MSOS, we take that role seriously. We organize meetings with government representatives, ministries, embassies, universities, and other key institutions to make sure the interests of Macedonian students in Slovenia are on the table. From campus issues to academic policies and integration, we work to solve problems, push for positive changes, and create a better experience for all of us."} 'Študentska podpora': { text: 'Vsebina za študentsko podoro...'},
'Student representation': { text: 'Content for student representation...'},
'Education and culture': { text: 'Content for education and culture...'},
'Entertainment and socializing': { text: 'Content for entertainment and socializing...'},
'Student support': { text: 'Content for student support...'},
'Студентско претставување': { text: 'Содржина за студентско претставување...'},
'Образование и култура': { text: 'Содржина за образование и култура...'},
'Забава и дружење': { text: 'Содржина за забава и дружење...'},
'Студентска поддршка': { text: 'Содржина за студентска поддршка...'}
}; };
activityNavItems.forEach(item => { activityNavItems.forEach(item => {

2
mk/index.html
View File

@ -232,7 +232,7 @@
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Најнови вести</h2> <h2>Најнови вести</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">

2
mk/index.html.bak
View File

@ -145,7 +145,7 @@
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Најнови вести</h2> <h2>Најнови вести</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">

2
si/index.html
View File

@ -232,7 +232,7 @@
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Zadnje novice</h2> <h2>Zadnje novice</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">

2
si/index.html.bak
View File

@ -145,7 +145,7 @@
<section class="latest-news-section"> <section class="latest-news-section">
<div class="news-header"> <div class="news-header">
<h2>Zadnje novice</h2> <h2>Zadnje novice</h2>
<p>Don’t miss what’s happening! Here you’ll find all our updates — from student news to upcoming activities and community highlights.</p> <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
</div> </div>
<div class="news-articles"> <div class="news-articles">
<article class="news-card"> <article class="news-card">