@@ -248,6 +248,13 @@ header .mobile-toggler {
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
}
|
||||
.display-banner.fitness-banner {
|
||||
background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url("/rss/img/fitness.jpg");
|
||||
padding: 180px 0px;
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
overflow: hidden;
|
||||
}
|
||||
.display-banner.kissing-banner {
|
||||
background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url("/rss/img/couple-kissing.jpg");
|
||||
padding: 180px 0px;
|
||||
@@ -291,8 +298,8 @@ footer ul {
|
||||
text-align: center;
|
||||
}
|
||||
.features-section .theme-card .card-header img {
|
||||
width: 125px;
|
||||
height: 125px;
|
||||
width: 170px;
|
||||
height: 170px;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
|
||||
-o-object-fit: cover;
|
||||
@@ -615,6 +622,40 @@ section .bolder {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.video-background {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
height: 65vh;
|
||||
width: 100%;
|
||||
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
|
||||
margin-top: 50px;
|
||||
}
|
||||
.video-background video {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
width: auto;
|
||||
height: auto;
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: -1;
|
||||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
}
|
||||
.video-background .content {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
color: white;
|
||||
text-align: center;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-color: rgba(0, 0, 0, 0.4862745098);
|
||||
border-radius: 12px;
|
||||
padding: 25px 45px;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.section-animation {
|
||||
opacity: 1;
|
||||
|
||||
@@ -270,6 +270,15 @@ header {
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
&.fitness-banner {
|
||||
background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)),
|
||||
url('/rss/img/fitness.jpg');
|
||||
padding: 180px 0px;
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
&.kissing-banner {
|
||||
background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)),
|
||||
url('/rss/img/couple-kissing.jpg');
|
||||
@@ -323,8 +332,8 @@ footer {
|
||||
text-align: center;
|
||||
|
||||
img {
|
||||
width: 125px;
|
||||
height: 125px;
|
||||
width: 170px;
|
||||
height: 170px;
|
||||
border-radius: 50%;
|
||||
box-shadow: map-get($shadows, 2);
|
||||
object-fit: cover;
|
||||
@@ -701,6 +710,41 @@ section {
|
||||
color: #{map-get($colors, white)};
|
||||
}
|
||||
|
||||
.video-background{
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
height: 65vh;
|
||||
width: 100%;
|
||||
box-shadow: #{map-get($shadows, 2)};
|
||||
margin-top: 50px;
|
||||
|
||||
video{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
width: auto;
|
||||
height: auto;
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: -1;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.content{
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
color: white;
|
||||
text-align: center;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-color: #0000007c;
|
||||
border-radius: 12px;
|
||||
padding: 25px 45px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.section-animation {
|
||||
opacity: 1;
|
||||
|
||||
BIN
rss/img/fitness.jpg
Normal file
|
After Width: | Height: | Size: 328 KiB |
BIN
rss/img/girl-face.jpg
Normal file
|
After Width: | Height: | Size: 178 KiB |
BIN
rss/img/kink2.jpg
Normal file
|
After Width: | Height: | Size: 282 KiB |
|
Before Width: | Height: | Size: 345 KiB After Width: | Height: | Size: 345 KiB |
BIN
rss/img/senior.jpg
Normal file
|
After Width: | Height: | Size: 248 KiB |
BIN
rss/img/vegan.jpg
Normal file
|
After Width: | Height: | Size: 256 KiB |
@@ -0,0 +1,22 @@
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const video = document.getElementById('first-video');
|
||||
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting) {
|
||||
const source = document.createElement('source');
|
||||
source.src = '/rss/videos/couple.mp4';
|
||||
source.type = 'video/mp4';
|
||||
video.appendChild(source);
|
||||
|
||||
video.load();
|
||||
video.play();
|
||||
video.playbackRate = 0.7; // Set after loading
|
||||
|
||||
observer.disconnect();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
observer.observe(video);
|
||||
});
|
||||
|
||||
@@ -63,32 +63,26 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="video-background">
|
||||
<video autoplay muted loop id="first-video">
|
||||
<source type="video/mp4" />
|
||||
</video>
|
||||
|
||||
<section>
|
||||
<div class="py-5 display-banner wedding-banner">
|
||||
<div class="container">
|
||||
<div class="flex-column justify-center align-center">
|
||||
<h3 class="text-white">Uncover True Love and Marriage with Free Dating</h3>
|
||||
<p class="text-white">Join free today at Stella Amor to connect with your lifelong partner using unique date filters for finance, kinks, lifestyle, and much more.</p>
|
||||
<div class="content">
|
||||
<h2>Couple Goals: Beach Vibes Edition</h2>
|
||||
<p>Ocean mornings, balcony chats, and that perfect connection living the dream with your favorite person.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section class="bg-white py-4">
|
||||
<div class="container my-3">
|
||||
<section class="bg-primary py-5 text-white shadow-4">
|
||||
<div class="container my-5">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-12 col-md-5">
|
||||
<div class="rounded-col-image">
|
||||
<img src="/rss/img/couple-beach.jpg" alt="Stella Amor dating experience">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-md-7 flex-column justify-center">
|
||||
<h2 class="mb-3">Join the Best <span class="bolder text-primary">Dating Platform </span> with Advanced Filters</h2>
|
||||
<p>Stella Amor offers free dating with advanced filters for finance, kinks, lifestyle, and more. Connect with singles who truly align with your values and passions. Start your journey to love today with a platform designed for your unique preferences!</p>
|
||||
<div class="d-flex mt-3">
|
||||
<h2 class="mb-3">Discovering the Best Dating Site for Introverts in <?php echo date('Y'); ?></h2>
|
||||
<p>If you're an introvert, finding love shouldn't feel like a performance. Stella Amor understands that, offering a platform where thoughtful profiles and meaningful filters let you connect at your own pace. Skip the small talk and dive straight into conversations about shared books, quiet hobbies, or weekend retreats. It's all about matching personalities that click without the exhaustion of traditional dating scenes.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-5">
|
||||
<img src="/rss/img/girl-face.jpg" alt="Introvert dating for finding love" class="img-w-100 img-rounded-lg shadow-2" loading="lazy">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -96,7 +90,7 @@
|
||||
|
||||
<div class="container border-top text-light" aria-hidden="true"></div>
|
||||
|
||||
<section class="py-2 bg-white">
|
||||
<section class="py-5 bg-light">
|
||||
<div class="container my-5">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-12 col-md-5">
|
||||
@@ -132,12 +126,23 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<section class="success-stories bg-white">
|
||||
<div class="container text-light border-top border-bottom py-4 mb-3">
|
||||
<section>
|
||||
<div class="py-5 display-banner wedding-banner">
|
||||
<div class="container">
|
||||
<div class="flex-column justify-center align-center">
|
||||
<h3 class="text-white">Uncover True Love and Marriage with Free Dating</h3>
|
||||
<p class="text-white">Join free today at Stella Amor to connect with your lifelong partner using unique date filters for finance, kinks, lifestyle, and much more.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="success-stories bg-white py-3">
|
||||
<div class="container text-light border-bottom py-5 mb-3">
|
||||
<div class="text-black">
|
||||
<h2 class="mb-4 text-center">Love Found on Stella Amor</h2>
|
||||
<h2 class="mb-4 text-center">Love Found at Stella Amor</h2>
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-4">
|
||||
<div class="theme-card primary">
|
||||
@@ -229,13 +234,13 @@
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
|
||||
<section class="filter-section bg-accent-white py-4">
|
||||
<div class="container my-5">
|
||||
<section class="filter-section bg-white py-2">
|
||||
<div class="container my-1">
|
||||
<h2 class="mb-4 text-center">What You Can Filter By</h2>
|
||||
<div class="row g-4">
|
||||
<div class="row g-4 justify-center my-2">
|
||||
<div class="col-12 col-md-6 col-lg-4 my-2">
|
||||
<div class="filter-card">
|
||||
<div class="filter-icon">
|
||||
@@ -327,10 +332,92 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex justify-center mt-4 pt-5">
|
||||
<a href="/register/" class="btn btn-white me-2">Join Free Now</a>
|
||||
</div>
|
||||
<p class="text-center mt-3">Stella Amor offers the best free dating filters to customize your search and start your love journey today!</p>
|
||||
</section>
|
||||
|
||||
<section class="bg-dark py-4">
|
||||
<div class="container my-3 py-5">
|
||||
<div class="row align-items-center text-white">
|
||||
<div class="col-12 col-md-5">
|
||||
<div class="rounded-col-image">
|
||||
<img src="/rss/img/couple-beach.jpg" alt="Stella Amor dating experience">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-md-7 flex-column justify-center">
|
||||
<h2 class="mb-3">Join the Best <span class="bolder text-primary">Dating Platform </span> with Advanced Filters</h2>
|
||||
<p>Stella Amor offers free dating with advanced filters for finance, kinks, lifestyle, and more. Connect with singles who truly align with your values and passions. Start your journey to love today with a platform designed for your unique preferences!</p>
|
||||
<div class="d-flex mt-3">
|
||||
<a href="/register/" class="btn primary btn-sm">Read more</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="bg-white py-5">
|
||||
<div class="container my-5 text-muted">
|
||||
<div class="row align-items-center text-dark py-5">
|
||||
<div class="col-12 col-md-7 flex-column justify-center">
|
||||
<h2 class="mb-3">Senior Dating Over 60: Where Experience Meets Compatibility</h2>
|
||||
<p>For singles over 60, Stella Amor is the spot to find someone who appreciates the richness of life you've built. Filter for shared interests like gardening, grandkids, or leisurely travels, and discover connections that honor your wisdom and stories. It's designed for those ready for companionship that feels effortless and real.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-5">
|
||||
<img src="/rss/img/senior.jpg" alt="Free senior dating" class="img-w-100 img-rounded-lg shadow-2" loading="lazy">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<div class="py-5 display-banner fitness-banner">
|
||||
<div class="container">
|
||||
<div class="flex-column justify-center align-center">
|
||||
<h3 class="text-white">Fitness-Focused Dating for Active Lifestyles</h3>
|
||||
<p class="text-white text-center">Love the gym but tired of mismatched energy levels? Stella Amor lets you filter for workout routines, nutrition preferences, and adventure goals, pairing you with someone who's as committed to health as you are. Couples formed here often bond over shared hikes or post-training meals that turn into something more.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="pt-5 pb-1 bg-white">
|
||||
<div class="container my-5 text-muted">
|
||||
<div class="row align-items-center border-bottom py-5 ">
|
||||
<div class="col-12 col-md-5 text-white">
|
||||
<img src="/rss/img/kink2.jpg" alt="Free Kink-Friendly Dating" class="img-w-100 img-rounded-lg shadow-2" loading="lazy">
|
||||
</div>
|
||||
<div class="col-12 col-md-7 flex-column justify-center text-dark">
|
||||
<h2 class="mb-3">Kink-Friendly Dating with Respect and Privacy</h2>
|
||||
<p>Curious about kink but want a safe entry point? Stella Amor offers private filters for preferences and boundaries, ensuring matches are based on mutual respect and consent. It's a welcoming space where beginners can explore without judgment, building trust from the start.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container my-5 pt-5 pb-4 border-bottom text-muted">
|
||||
<div class="row align-items-center pt-3">
|
||||
<div class="col-12 col-md-7 flex-column justify-center text-dark">
|
||||
<h2 class="mb-3">Vegan Dating That Nourishes Body and Soul</h2>
|
||||
<p>Being vegan is more than a diet. It's a lifestyle. Stella Amor helps plant-based singles find partners who share ethical eating and animal compassion through dedicated filters. From recipe swaps to ethical travel plans, these connections often grow into something deeply fulfilling.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-5">
|
||||
<img src="/rss/img/vegan.jpg" alt="Vegan dating app" class="img-w-100 img-rounded-lg shadow-2" loading="lazy">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section class="success-stories bg-white">
|
||||
<div class="container text-light mb-3 pb-3">
|
||||
<div class="text-black">
|
||||
<h4 class="mb-4 text-center text-xl fw-medium">This is <span class="text-primary fw-bold">Stella Amor</span></h4>
|
||||
<p class="text-center">Your dating site for real compatibility in 2025. Where introverts, seniors over 60, book lovers, fitness enthusiasts, single parents, eco-conscious singles, and everyone exploring kink or plant-based living finally meet someone who truly gets them.</p>
|
||||
<p class="text-center">No endless swiping. No surface-level matches. Just thoughtful questions, detailed filters, and connections that feel right from the very first message. So what are you waiting for?
|
||||
Create your profile today and start meeting people who match your lifestyle, values, and dreams.
|
||||
Love that actually fits, begins here.</p>
|
||||
<div class="d-flex justify-center mt-4">
|
||||
<a href="/register/" class="btn btn-outline-primary" title="Join now" aria-label="Sign up for free">Join now</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||