PARTENAIRES / index.html
SELIGROUP's picture
Update index.html
cbfd524 verified
raw
history blame
7.43 kB
<html><head><base href="/">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#0a192f">
<link rel="manifest" href="data:application/json;base64,eyJuYW1lIjoiU0VMSSBHUk9VUCBTQVJMIiwic2hvcnRfbmFtZSI6IlNFTEkiLCJzdGFydF91cmwiOiIvIiwiZGlzcGxheSI6InN0YW5kYWxvbmUiLCJiYWNrZ3JvdW5kX2NvbG9yIjoiIzBhMTkyZiIsInRoZW1lX2NvbG9yIjoiIzBhMTkyZiJ9">
<title>SELI GROUP SARL - Recrutement d'Agents</title>
<style>
:root {
--primary: #0a192f;
--secondary: #64ffda;
--accent: #112240;
--text: #ccd6f6;
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
margin: 0;
padding: 0;
background: var(--primary);
color: var(--text);
line-height: 1.6;
-webkit-font-smoothing: antialiased;
}
.header {
background: var(--accent);
color: white;
text-align: center;
padding: 2rem;
position: relative;
overflow: hidden;
}
.header::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(45deg, rgba(10,25,47,0.8), rgba(100,255,218,0.2));
z-index: 1;
}
.header * {
position: relative;
z-index: 2;
}
.logo {
width: 120px;
height: 120px;
margin-bottom: 1rem;
filter: drop-shadow(0 0 10px rgba(100,255,218,0.3));
}
.container {
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding: 1rem;
display: flex;
flex-direction: column;
align-items: center;
}
.hero-image-container {
width: 100%;
display: flex;
justify-content: center;
margin: 1.5rem 0;
}
.hero-image {
width: 100%;
max-width: 800px;
border-radius: 15px;
box-shadow: 0 0 30px rgba(100,255,218,0.2);
transition: transform 0.3s ease;
}
.hero-image:hover {
transform: scale(1.02);
}
.mission-card {
background: var(--accent);
border-radius: 15px;
padding: 1.5rem;
margin: 1rem 0;
box-shadow: 0 4px 20px rgba(100,255,218,0.1);
border: 1px solid rgba(100,255,218,0.1);
transition: all 0.3s ease;
backdrop-filter: blur(10px);
width: 100%;
}
.mission-card:hover {
transform: translateY(-5px);
border-color: var(--secondary);
}
.current-mission {
text-align: center;
padding: 1rem;
margin: 1rem 0;
color: white;
border-bottom: 2px solid var(--secondary);
width: 100%;
}
.footer {
text-align: center;
padding: 1.5rem;
margin-top: 2rem;
border-top: 1px solid var(--secondary);
color: white;
}
.btn {
display: inline-block;
padding: 0.8rem 1.5rem;
margin: 0.5rem;
border-radius: 8px;
text-decoration: none;
font-weight: bold;
transition: all 0.3s ease;
position: relative;
overflow: hidden;
width: 100%;
max-width: 300px;
text-align: center;
}
.btn-primary {
background: transparent;
color: var(--secondary);
border: 2px solid var(--secondary);
}
.btn-primary:hover, .btn-primary:focus {
background: rgba(100,255,218,0.1);
box-shadow: 0 0 20px rgba(100,255,218,0.3);
outline: none;
}
.remuneration {
background: rgba(100,255,218,0.1);
color: var(--text);
padding: 1.2rem;
border-radius: 10px;
margin: 1.2rem 0;
border: 1px solid rgba(100,255,218,0.2);
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(20px); }
to { opacity: 1; transform: translateY(0); }
}
.animate {
animation: fadeIn 1s ease-out;
}
h1, h2, h3 {
color: var(--secondary);
}
.mission-title {
text-align: center;
margin-bottom: 1rem;
}
.target-text {
text-align: center;
color: white;
margin-top: 1rem;
font-weight: bold;
}
@media (max-width: 768px) {
.container {
padding: 0.8rem;
}
.header {
padding: 1.5rem;
}
.logo {
width: 100px;
height: 100px;
}
h1 {
font-size: 1.5rem;
}
h2 {
font-size: 1.2rem;
}
.mission-card {
padding: 1rem;
}
.btn {
padding: 0.7rem 1.2rem;
font-size: 0.9rem;
}
}
@media (max-width: 480px) {
.header {
padding: 1rem;
}
.logo {
width: 80px;
height: 80px;
}
.container {
padding: 0.5rem;
}
.mission-card {
padding: 0.8rem;
}
.remuneration {
padding: 1rem;
}
}
</style>
</head>
<body>
<div class="header">
<svg class="logo" viewBox="0 0 100 100">
<circle cx="50" cy="50" r="45" fill="none" stroke="var(--secondary)" stroke-width="2"/>
<text x="50" y="55" text-anchor="middle" fill="var(--secondary)" font-size="20">SELI</text>
<text x="50" y="70" text-anchor="middle" fill="var(--secondary)" font-size="12">GROUP</text>
</svg>
<h1>SELI GROUP SARL</h1>
</div>
<div class="container">
<div class="hero-image-container">
<img src="https://i.ibb.co/fXX5Btd/Black-and-Blue-Minimalist-Open-Recruitment-Instagram-Post-5.png" alt="Recrutement SELI GROUP" class="hero-image animate">
</div>
<div class="current-mission animate">
<h2 class="mission-title">MISSION ACTUELLE :</h2>
<p style="color: white;">Vente de solutions d'automatisations de taches en ligne (Taches diverses : commerciales ; stratégiques ; administratives ; marketing ; comptables ; logistiques ; services clients ; communication digitale ; appels d'offres ; etc) gérées par des outils dit ''agents autonomes d'intelligence artificielle'' personnalisées. Ces outils d'I.A personnalisés travaillent 24/7, et sont adaptés à tous types d'entreprises</p>
<p class="target-text">CIBLES DE VENTES : Entreprises de tous les domaines.</p>
</div>
<div class="mission-card animate">
<h2>Chef d'Equipe d'Agents de Terrains</h2>
<p><strong>Mission:</strong> Réunir indépendamment par vos moyens et connections et gérer un réseau de vendeurs, motiver votre équipe, représenter et répondre pour votre équipe auprès de la comptabilité.</p>
<div class="remuneration">
<h3>Rémunération</h3>
<p>5.000 FCFA sur chaque vente effectuée par un agent de votre équipe</p>
<p><strong>NB:</strong> Minimum 10 agents requis dans l'équipe</p>
</div>
<a href="https://forms.fillout.com/t/4motVjsTgbus" class="btn btn-primary">S'inscrire comme Chef d'Equipe d'Agents</a>
</div>
<div class="mission-card animate">
<h2>Agent de Terrain</h2>
<p><strong>Mission:</strong> Prospecter et commercialiser nos services et outils informatiques auprès des entreprises et clients potentiels.</p>
<div class="remuneration">
<h3>Rémunération</h3>
<p>20.000 FCFA par vente effectuée</p>
</div>
<a href="https://forms.fillout.com/t/rCv3618Auqus" class="btn btn-primary">S'inscrire comme Agent de Terrain</a>
</div>
<div class="footer">
<p>SELI GROUP SARL / CONTACT DU I.A MANAGER : GUY NIKIEMA +226 56888879</p>
</div>
</div>
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/sw.js').catch(err => console.log('ServiceWorker registration failed: ', err));
});
}
document.addEventListener('DOMContentLoaded', function() {
const cards = document.querySelectorAll('.mission-card');
cards.forEach((card, index) => {
card.style.animationDelay = `${index * 0.3}s`;
});
const buttons = document.querySelectorAll('.btn');
buttons.forEach(btn => {
btn.addEventListener('click', function(e) {
e.target.style.transform = 'scale(0.95)';
setTimeout(() => {
e.target.style.transform = 'scale(1)';
}, 100);
});
});
});
</script>
</body></html>