jomo/index.html at main · timothyngugi26/jomo · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JOMO PRODUCTION - We Create Culture</title>
    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
</head>
<body>
    <header>
        <div class="logo">JOMO PRODUCTION</div>
        <nav>
            <ul>
                <li><a href="#about">About</a></li>
                <li><a href="#services">Services</a></li>
                <li><a href="#contact">Contact</a></li>
            </ul>
            <div class="menu-toggle">
                <i class="fas fa-bars"></i>
            </div>
        </nav>
    </header>

    <section class="hero">
        <div class="hero-content">
            <h1>We Don't Shoot Content.<br>We Create Culture.</h1>
            <p>Turning stories into impact through cinematic excellence</p>
            <a href="#contact" class="cta-button">Let's Begin Yours</a>
        </div>
    </section>

    <section id="about" class="about-section">
        <h2>About the Company</h2>
        <p>Kenyan production company with an aim of creating films that tell authentic, fictional and eye opening stories on how films and life mirror each other in an artistic way.</p>

        <div class="team-section">
            <h3>Key Members</h3>
            <div class="team-grid">
                <!-- Team members would be added here -->
                <div class="team-member">
                    <div class="placeholder-img"></div>
                    <p>Executive Producer</p>
                </div>
                <div class="team-member">
                    <div class="placeholder-img"></div>
                    <p>Director</p>
                </div>
                <div class="team-member">
                    <div class="placeholder-img"></div>
                    <p>Cinematographer</p>
                </div>
                <div class="team-member">
                    <div class="placeholder-img"></div>
                    <p>Production Designer</p>
                </div>
                <div class="team-member">
                    <div class="placeholder-img"></div>
                    <p>Line Producer</p>
                </div>
            </div>
        </div>
    </section>

    <section id="services" class="services-section">
        <h2>Our Full-Scope Production Process</h2>
        <p class="services-intro">Whether you're creating a cinematic story, a brand film, or a commercial that sells — we handle everything from script to screen and beyond.</p>

        <div class="service-cards">
            <div class="service-card">
                <h3>Pre-Production</h3>
                <p>Scripting | Casting | Planning</p>
                <p>We develop strong storylines, write compelling scripts, and cast the right talent to bring your vision to life. Every detail is planned — from locations to logistics — to ensure a smooth shoot and clear creative direction.</p>
            </div>

            <div class="service-card">
                <h3>Production</h3>
                <p>Filming | Directing | Sound</p>
                <p>On set, our experienced crew captures your story with cinematic precision. We use industry-grade equipment and professional direction to make every frame count, whether it's a feature film, a corporate ad, or a product shoot.</p>
            </div>

            <div class="service-card">
                <h3>Post-Production</h3>
                <p>Editing | VFX | Color Grading</p>
                <p>This is where the magic comes together. We edit, design sound, add motion graphics or VFX, and professionally color grade your footage to make it look polished, powerful, and premium — ready for any screen.</p>
            </div>

            <div class="service-card">
                <h3>Distribution & Brand Visibility</h3>
                <p>Marketing Strategy | Media Consulting | Monetization</p>
                <p>More than just creating — we make sure your film works for you. From online release strategies to ad campaign consulting, we help get your project seen, shared, and profitable — boosting your brand reach and business results.</p>
            </div>
        </div>

        <div class="services-cta">
            <p>Whether you're a filmmaker or a business owner, we don't just tell stories — we turn them into impact.</p>
            <a href="#contact" class="cta-button">Ready to create? Let's talk.</a>
        </div>
    </section>

    <section id="contact" class="contact-section">
        <h2>Every Story Deserves the Spotlight<br>Let's Begin Yours</h2>

        <div class="contact-container">
            <div class="contact-info">
                <h3>Contact Us</h3>
                <p><i class="fas fa-envelope"></i> jomoproduction24@gmail.com</p>
                <p><i class="fas fa-phone"></i> 0753740024</p>

                <div class="social-links">
                    <a href="https://www.tiktok.com/@jomo.production?is_from_webapp=1&sender_device=pc" target="_blank"><i class="fab fa-tiktok"></i></a>
                    <a href="https://www.instagram.com/jomo_production?igsh=MTMvcXppMXB5aGVuYQ==" target="_blank"><i class="fab fa-instagram"></i></a>
                    <a href="https://www.facebook.com/share/1KebYNqokX/" target="_blank"><i class="fab fa-facebook"></i></a>
                    <a href="https://x.com/Production96597?t=nEX74eLjFaptDOrkVUcF3A&s=09" target="_blank"><i class="fab fa-twitter"></i></a>
                </div>
            </div>

            <form class="contact-form">
                <input type="text" placeholder="Your Name" required>
                <input type="email" placeholder="Your Email" required>
                <input type="tel" placeholder="Phone Number">
                <textarea placeholder="Tell us about your project" required></textarea>
                <button type="submit" class="cta-button">Send Message</button>
            </form>
        </div>
    </section>

    <footer>
        <div class="footer-content">
            <div class="footer-logo">JOMO PRODUCTION</div>

            <div class="footer-links">
                <ul>
                    <li><a href="#">Home</a></li>
                    <li><a href="#about">About</a></li>
                    <li><a href="#services">Services</a></li>
                    <li><a href="#contact">Contact</a></li>
                </ul>

                <ul>
                    <li><a href="#">Privacy Policy</a></li>
                    <li><a href="#">Terms of Service</a></li>
                </ul>
            </div>

            <div class="footer-social">
                <a href="https://www.tiktok.com/@jomo.production?is_from_webapp=1&sender_device=pc" target="_blank"><i class="fab fa-tiktok"></i></a>
                <a href="https://www.instagram.com/jomo_production?igsh=MTMvcXppMXB5aGVuYQ==" target="_blank"><i class="fab fa-instagram"></i></a>
                <a href="https://www.facebook.com/share/1KebYNqokX/" target="_blank"><i class="fab fa-facebook"></i></a>
                <a href="https://x.com/Production96597?t=nEX74eLjFaptDOrkVUcF3A&s=09" target="_blank"><i class="fab fa-twitter"></i></a>
            </div>
        </div>

        <div class="footer-bottom">
            <p>&copy; 2024 JOMO PRODUCTION. All rights reserved.</p>
        </div>
    </footer>

    <script src="script.js"></script>
</body>
</html>