API FAQ ARCHIVE

challenge12-webdev

public
tiara Apr 06, 2026 Never 56
Clone
HTML index
CSS style
HTML index 265 lines (255 loc) | 19.45 KB
Raw 
1
<!DOCTYPE html>
2
<html lang="id">
3
<head>
4
<meta charset="UTF-8">
5
<!-- NO viewport meta = broken mobile (UX flaw #1) -->
6
<title>Gadjah Mada High School</title>
7
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
8
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,700;0,900;1,400&family=DM+Sans:wght@300;400;500;600&display=swap" rel="stylesheet">
9
<link rel="stylesheet" href="style.css">
10
</head>
11
<body>
12
<nav id="mainNav" class="navbar navbar-expand-lg">
13
  <div class="container-fluid px-3">
14
    <a class="navbar-brand d-flex align-items-center gap-2 text-decoration-none" href="#">
15
      <div class="logo-emblem">G</div>
16
      <div>
17
        <div class="text-white fw-bold" style="font-size:11px; font-family:'Playfair Display',serif;">Gadjah Mada High School</div>
18
        <div class="text-warning" style="font-size:8px; letter-spacing:1px;">EST. 1985 · EXCELLENCE</div>
19
      </div>
20
    </a>
21
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navMenu">
22
      <span class="navbar-toggler-icon"></span>
23
    </button>
24
    <div class="collapse navbar-collapse" id="navMenu">
25
      <ul class="navbar-nav ms-auto">
26
        <li class="nav-item"><a class="nav-link" href="#about">About</a></li>
27
        <li class="nav-item"><a class="nav-link" href="#activities">Activities</a></li>
28
        <li class="nav-item"><a class="nav-link" href="#news">News</a></li>
29
        <li class="nav-item"><a class="nav-link" href="#teachers">Faculty</a></li>
30
        <li class="nav-item"><a class="nav-link" href="#organization">Organisasi</a></li>
31
        <li class="nav-item"><a class="nav-link" href="#achievements">Awards</a></li>
32
        <li class="nav-item"><a class="nav-link" href="#contact" style="background:#c9a84c;color:#0b1f3a!important;font-size:9px!important;">Contact</a></li>
33
      </ul>
34
    </div>
35
  </div>
36
</nav>
37
 
38
<section class="hero">
39
  <div class="container-fluid px-3">
40
    <div class="row align-items-center">
41
      <div class="col-12">
42
        <div class="hero-badge">Accredited · Award-Winning · 2025</div>
43
        <h1 class="hero">Shaping <em style="color:#c9a84c;">Futures,</em> Building Excellence</h1>
44
        <p>Gadjah Mada High School has been nurturing curious minds and developing principled leaders for four decades.</p>
45
        <a href="#about" class="btn btn-warning btn-sm me-1">Discover Our School</a>
46
        <a href="#contact" class="btn btn-outline-light btn-sm">Apply Now →</a>
47
        <div class="d-flex gap-3 mt-2">
48
          <div class="hero-stat"><span class="num">98%</span><span class="lbl">University Rate</span></div>
49
          <div class="hero-stat"><span class="num">40+</span><span class="lbl">Years of Excellence</span></div>
50
          <div class="hero-stat"><span class="num">120</span><span class="lbl">Expert Faculty</span></div>
51
        </div>
52
      </div>
53
    </div>
54
  </div>
55
</section>
56
 
57
<section id="about" class="bg-white">
58
  <div class="container py-1">
59
    <div class="sec-tag">Our Story</div>
60
    <div class="sec-title">A Tradition of Academic <em style="color:#c9a84c;">Excellence</em> Since 1985</div>
61
    <div class="sec-divider"></div>
62
    <div class="about-img-box">[School Profile Image — images/profile.jpg]</div>
63
    <p style="font-size:9px;color:#aaa;">⭐ 4.9 School Rating</p>
64
    <p class="text-secondary mb-1" style="font-size:11px;line-height:1.5;">Founded in 1985, Gadjah Mada High School was built on the belief that every child deserves access to world-class education in a nurturing, safe, and inspiring environment.</p>
65
    <p class="text-secondary mb-2" style="font-size:11px;line-height:1.5;">Our holistic approach fosters critical thinking, leadership, and compassion — qualities that define our alumni wherever they go in the world.</p>
66
    <div class="row g-1">
67
      <div class="col-6"><div class="pillar"><b>🎓 Academic Rigor</b><small>STEM &amp; Humanities advanced tracks</small></div></div>
68
      <div class="col-6"><div class="pillar"><b>🌱 Character First</b><small>Ethics, leadership, civic responsibility</small></div></div>
69
      <div class="col-6"><div class="pillar"><b>🎨 Creative Arts</b><small>Music, drama, visual arts</small></div></div>
70
      <div class="col-6"><div class="pillar"><b>🌍 Global Ready</b><small>Exchange programs in 18 countries</small></div></div>
71
    </div>
72
  </div>
73
</section>
74
 
75
<section id="activities" style="background:#f5f5f5;">
76
  <div class="container py-1">
77
    <div class="sec-tag">Campus Life</div>
78
    <div class="sec-title">Student <em style="color:#c9a84c;">Activities</em></div>
79
    <div class="sec-divider"></div>
80
    <div class="act-item"><span class="act-tag">Science &amp; Tech</span>Annual Science Olympiad — Competing regionally and nationally in robotics, chemistry, biology — consistently in the top 5% nationwide.</div>
81
    <div class="act-item"><span class="act-tag">Sports</span>Championship Athletics — Award-winning sports program developing teamwork and resilience across 25+ disciplines.</div>
82
    <div class="act-item"><span class="act-tag">Arts &amp; Culture</span>Performing Arts Festival — Annual festival of theater, music, dance, and visual arts — recognized at state level.</div>
83
    <div class="act-item"><span class="act-tag">Community</span>Environmental &amp; Social Clubs — Students lead change through Green Campus initiative, debate club, and 40+ active clubs.</div>
84
    <div class="act-item"><span class="act-tag">Academic</span>Model UN &amp; Debate League — Students represent schools across three continents, honing diplomacy and public speaking.</div>
85
  </div>
86
</section>
87
 
88
<section id="news" style="background:#faf7f0;">
89
  <div class="container py-1">
90
    <div class="sec-tag">Latest Updates</div>
91
    <div class="sec-title">School <em style="color:#c9a84c;">News</em> &amp; Events</div>
92
    <div class="sec-divider"></div>
93
    <table class="table table-bordered news-table">
94
      <thead><tr><th>Date</th><th>Category</th><th>Title</th><th>Description</th><th>Link</th></tr></thead>
95
      <tbody>
96
        <tr><td>March 1, 2025</td><td><span class="news-cat">Achievement</span></td><td>Gadjah Mada Wins National Robotics Championship</td><td>Team Apex clinched the national title at the 2025 National Robotics Invitational, defeating 142 schools.</td><td><a href="#">Read Full Story →</a></td></tr>
97
        <tr><td>February 20, 2025</td><td><span class="news-cat">Admission</span></td><td>Applications Open for 2025–2026 Academic Year</td><td>Accepting applications for Grades 7–12. Enrollment is limited — secure your place early.</td><td><a href="#">Apply Now →</a></td></tr>
98
        <tr><td>February 10, 2025</td><td><span class="news-cat">Event</span></td><td>International Culture Fair Returns This April</td><td>Students from 28 countries presenting cultural heritage — food, art, music, and stories.</td><td><a href="#">Learn More →</a></td></tr>
99
        <tr><td>January 28, 2025</td><td><span class="news-cat">Academic</span></td><td>New Advanced STEM Curriculum Launches</td><td>New AI &amp; Data Science track developed with leading universities, available for Grade 11–12.</td><td><a href="#">Explore →</a></td></tr>
100
        <tr><td>January 15, 2025</td><td><span class="news-cat">Arts</span></td><td>Student Art Exhibition Opens at City Gallery</td><td>Works by 36 students on display at City Contemporary Gallery until April.</td><td><a href="#">View Exhibition →</a></td></tr>
101
        <tr><td>January 5, 2025</td><td><span class="news-cat">Community</span></td><td>New Alumni Mentorship Programme Launches</td><td>Connects students with 200+ Gadjah Mada graduates across medicine, law, and entrepreneurship.</td><td><a href="#">Get Involved →</a></td></tr>
102
      </tbody>
103
    </table>
104
  </div>
105
</section>
106
 
107
<section id="teachers" class="bg-white">
108
  <div class="container py-1">
109
    <div class="sec-tag">Our People</div>
110
    <div class="sec-title">Meet Our <em style="color:#c9a84c;">Faculty</em></div>
111
    <div class="sec-divider"></div>
112
    <div class="row g-1">
113
      <div class="col-1 t-card"><div class="t-avatar">[img]</div><div class="t-name">Dr. Robert Chen</div><div class="t-subj">Math &amp; Physics</div><div class="t-bio">PhD from MIT. 18 years in education, making advanced math accessible for every learner.</div></div>
114
      <div class="col-1 t-card"><div class="t-avatar">[img]</div><div class="t-name">Ms. Sarah Okoye</div><div class="t-subj">English Lit.</div><div class="t-bio">Published author and former Oxford lecturer bringing literature to life.</div></div>
115
      <div class="col-1 t-card"><div class="t-avatar">[img]</div><div class="t-name">Mr. James Patel</div><div class="t-subj">Chem &amp; Bio</div><div class="t-bio">Former biotech researcher. Hands-on lab sessions turn students into scientists.</div></div>
116
      <div class="col-1 t-card"><div class="t-avatar">[img]</div><div class="t-name">Ms. Elena Marcos</div><div class="t-subj">Visual Arts</div><div class="t-bio">Award-winning illustrator with exhibitions across Europe. Students win national competitions.</div></div>
117
      <div class="col-1 t-card"><div class="t-avatar">[img]</div><div class="t-name">Mr. Daniel Torres</div><div class="t-subj">CS &amp; AI</div><div class="t-bio">Former Google engineer inspiring the next generation. Leads AI curriculum and robotics.</div></div>
118
      <div class="col-1 t-card"><div class="t-avatar">[img]</div><div class="t-name">Ms. Aisha Kamara</div><div class="t-subj">Phys. Ed.</div><div class="t-bio">Former Olympic athlete and certified sports psychologist. Leads championship athletics.</div></div>
119
      <div class="col-1 t-card"><div class="t-avatar">[img]</div><div class="t-name">Mr. François Dubois</div><div class="t-subj">History</div><div class="t-bio">Historian and documentarian connecting past events to present-day realities.</div></div>
120
      <div class="col-1 t-card"><div class="t-avatar">[img]</div><div class="t-name">Ms. Lily Nakamura</div><div class="t-subj">Music &amp; Arts</div><div class="t-bio">Classical pianist and theater director. Students perform at international festivals.</div></div>
121
    </div>
122
  </div>
123
</section>
124
 
125
<section id="organization" style="background:#f5f5f5;">
126
  <div class="container py-1">
127
    <div class="sec-tag">Organizations &amp; Clubs</div>
128
    <div class="sec-title">Student <em style="color:#c9a84c;">Organizations</em></div>
129
    <div class="sec-divider"></div>
130
    <p class="text-secondary mb-2" style="font-size:10px;">**Gadjah Mada High School supports various student organizations that build character, leadership, and a spirit of togetherness.**
131
</p>
132
    <ul class="org-list ps-3">
133
      <li><b>OSIS</b> — Organisasi Siswa Intra Sekolah. Official forum for student leadership that organizes school activities and serves as a bridge between students and school administration.<br><span class="org-meta">Leadership · Organisation · Activities &nbsp;|&nbsp; 45 Members &nbsp;|&nbsp; Leader: Rafi Ananda</span></li>
134
      <li><b>MPK</b> — Majelis Permusyawaratan Kelas. Student legislative body that supervises and evaluates OSIS for democratic and transparent school activities.<br><span class="org-meta">Legislative · Democracy · Supervision &nbsp;|&nbsp; 30 Members &nbsp;|&nbsp; Leader: Siti Rahayu</span></li>
135
      <li><b>PRAMUKA</b> — Praja Muda Karana. A scouting movement that develops independence, environmental care, and social spirit through camping and community service.<br><span class="org-meta">Scouting · Nature · Social &nbsp;|&nbsp; 80 Members &nbsp;|&nbsp; Leader: Budi Santoso</span></li>
136
      <li><b>PASKIBRA</b> — Pasukan Kibar Bendera. Flag raising unit for official ceremonies. Develops discipline, precision in formations, and strong nationalism.<br><span class="org-meta">Nationalism · Discipline · Ceremonies &nbsp;|&nbsp; 35 Members &nbsp;|&nbsp; Leader: Dian Pratama</span></li>
137
      <li><b>PMR</b> — Palang Merah Remaja. Works in health and humanitarian sectors: first aid, blood donation, and community health education.<br><span class="org-meta">Health · Humanity · First Aid &nbsp;|&nbsp; 55 Members &nbsp;|&nbsp; Leader: Annisa Putri</span></li>
138
      <li><b>PADUAN SUARA</b> — Paduan Suara Sekolah. Vocal group that performs at official events, inter-school competitions, and regional and national cultural performances.<br><span class="org-meta">Music · Vocal · Cultural Arts &nbsp;|&nbsp; 40 Members &nbsp;|&nbsp; Leader: Melody Ayu</span></li>
139
    </ul>
140
  </div>
141
</section>
142
 
143
<section id="achievements" style="background:#faf7f0;">
144
  <div class="container py-1">
145
    <div class="sec-tag">Pride &amp; Honor</div>
146
    <div class="sec-title">Our <em style="color:#c9a84c;">Achievements</em></div>
147
    <div class="sec-divider"></div>
148
    <ul class="ach-list list-unstyled">
149
      <li><b>National Academic Excellence Award</b> — Awarded by Ministry of Education for outstanding academic performance over five consecutive years. <span class="ach-year">2020–2025 · National Level</span></li>
150
      <li><b>National Robotics Champions</b> — Team Apex claimed the national robotics title in 2025, building on a decade of STEM excellence. <span class="ach-year">2025 · National Championship</span></li>
151
      <li><b>UNESCO School of the Year — APAC</b> — Recognized for exemplary international exchange programs and multicultural curriculum. <span class="ach-year">2023 · Asia-Pacific Region</span></li>
152
      <li><b>Best Performing Arts Program</b> — Named Best Performing Arts at State Education Awards, with 3 musicals winning regional acclaim. <span class="ach-year">2024 · State Level</span></li>
153
      <li><b>State Multi-Sport Champions</b> — Won state titles in football, swimming, and athletics — the first triple crown in 30 years. <span class="ach-year">2024 · State Championships</span></li>
154
      <li><b>Green School Platinum Certification</b> — Platinum sustainability certification for our zero-waste campus and solar energy transition. <span class="ach-year">2023 · Environmental Excellence</span></li>
155
    </ul>
156
    <!-- Stats: static, no animation, washed out on grey bg -->
157
    <div class="row g-0 stats-bar mt-2">
158
      <div class="col-3 stat-box"><b>98</b><small>% University Admission Rate</small></div>
159
      <div class="col-3 stat-box"><b>2800</b><small>Students Enrolled</small></div>
160
      <div class="col-3 stat-box"><b>120</b><small>Expert Faculty</small></div>
161
      <div class="col-3 stat-box"><b>85</b><small>Awards &amp; Recognitions</small></div>
162
    </div>
163
  </div>
164
</section>
165
 
166
<section id="contact" class="contact-section">
167
  <div class="container py-1">
168
    <div class="sec-tag">Get In Touch</div>
169
    <div class="sec-title">Contact <em style="color:#c9a84c;">Us</em></div>
170
    <div class="sec-divider"></div>
171
    <div class="row g-2">
172
      <div class="col-4">
173
        <p class="text-white mb-1" style="font-size:10px;">Whether you're a prospective family, current student, or community partner — our doors are always open.</p>
174
        <div class="contact-info" style="font-size:10px;color:#888;line-height:2.2;">
175
          <b style="font-size:9px;color:#c9a84c;text-transform:uppercase;display:block;">Address</b>Jendral Soedirman 12, West Jakarta<br>City, State 10001
176
          <b style="font-size:9px;color:#c9a84c;text-transform:uppercase;display:block;margin-top:4px;">Phone</b>(+62)812-3100-3000<br>Mon–Fri, 7:30 AM – 5:00 PM
177
          <b style="font-size:9px;color:#c9a84c;text-transform:uppercase;display:block;margin-top:4px;">Email</b>[email protected]<br>[email protected]
178
          <b style="font-size:9px;color:#c9a84c;text-transform:uppercase;display:block;margin-top:4px;">School Hours</b>Mon–Fri: 7:00 AM – 4:30 PM<br>Office: 7:30 AM – 5:00 PM
179
        </div>
180
      </div>
181
      <div class="col-8">
182
        <!-- form uses inline table layout with misaligned labels -->
183
        <table class="w-100">
184
          <tr>
185
            <td style="width:80px;"><label class="cform-label">First Name</label></td>
186
            <td class="pe-1"><input type="text" class="cform-input form-control" placeholder="Rehan"></td>
187
            <td style="width:80px;"><label class="cform-label">Last Name</label></td>
188
            <td><input type="text" class="cform-input form-control" placeholder="Santoso"></td>
189
          </tr>
190
          <tr>
191
            <td><label class="cform-label">Email</label></td>
192
            <td colspan="3"><input type="email" class="cform-input form-control" placeholder="[email protected]"></td>
193
          </tr>
194
          <tr>
195
            <td><label class="cform-label">Inquiry Type</label></td>
196
            <td colspan="3">
197
              <select class="cform-input form-control">
198
                <option value="">Select a topic...</option>
199
                <option>Admissions Inquiry</option>
200
                <option>Academic Programs</option>
201
                <option>Tuition &amp; Fees</option>
202
                <option>Student Life</option>
203
                <option>Partnership</option>
204
              </select>
205
            </td>
206
          </tr>
207
          <tr>
208
            <td><label class="cform-label">Message</label></td>
209
            <td colspan="3"><textarea class="cform-input form-control" rows="3" placeholder="Tell us how we can help you..."></textarea></td>
210
          </tr>
211
          <tr>
212
            <td></td>
213
            <td colspan="3" class="pt-1">
214
              <!-- two inconsistent button styles -->
215
              <button class="btn-send" onclick="this.textContent='✓ Sent!'">Send Message</button>
216
              <button class="btn-clear">Clear</button>
217
            </td>
218
          </tr>
219
        </table>
220
      </div>
221
    </div>
222
  </div>
223
</section>
224
 
225
<footer>
226
  <div class="container">
227
    <div class="row g-2 footer-cols">
228
      <div class="col-4 footer-col">
229
        <b>Gadjah Mada High School</b>
230
        <span style="font-size:9px;color:#444;display:block;">EST. 1985 · EXCELLENCE</span>
231
        <p style="font-size:9px;color:#444;line-height:1.7;margin-top:3px;">Shaping futures and building character since 1985. Where every student is known, valued, and inspired to achieve their full potential.</p>
232
        <span style="font-size:9px;color:#444;">f · in · tw · yt</span>
233
      </div>
234
      <div class="col-2 footer-col">
235
        <b>Quick Links</b>
236
        <a href="#about" class="footer-link">About Us</a>
237
        <a href="#activities" class="footer-link">Activities</a>
238
        <a href="#news" class="footer-link">News &amp; Events</a>
239
        <a href="#teachers" class="footer-link">Faculty</a>
240
        <a href="#achievements" class="footer-link">Awards</a>
241
      </div>
242
      <div class="col-2 footer-col">
243
        <b>Academics</b>
244
        <a href="#" class="footer-link">STEM Programs</a>
245
        <a href="#" class="footer-link">Humanities</a>
246
        <a href="#" class="footer-link">Arts &amp; Music</a>
247
        <a href="#" class="footer-link">Sports</a>
248
        <a href="#" class="footer-link">University Prep</a>
249
      </div>
250
      <div class="col-2 footer-col">
251
        <b>Admissions</b>
252
        <a href="#" class="footer-link">How to Apply</a>
253
        <a href="#" class="footer-link">Tuition &amp; Fees</a>
254
        <a href="#" class="footer-link">Scholarships</a>
255
        <a href="#" class="footer-link">Open Days</a>
256
        <a href="#" class="footer-link">FAQs</a>
257
      </div>
258
    </div>
259
    <div class="footer-copy">© 2025 Gadjah Mada High School. All rights reserved.</div>
260
  </div>
261
</footer>
262
 
263
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
264
</body>
265
</html>
CSS style 75 lines (63 loc) | 4.66 KB
Raw 
1
body { font-family: 'DM Sans', sans-serif; font-size: 11px; color: #444; }
2
 
3
/* NAV — static (not fixed), links too small to tap */
4
#mainNav { background: #0b1f3a; border-bottom: 1px solid #c9a84c; }
5
.logo-emblem { width:24px; height:24px; background:#c9a84c; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:900; color:#0b1f3a; }
6
.nav-link { color:#bbb !important; font-size:9px !important; padding:3px 5px !important; text-transform:uppercase; letter-spacing:.5px; }
7
/* no hover state */
8
 
9
/* HERO — no background, no visual weight */
10
.hero { background:#0b1f3a; padding:12px 0; }
11
.hero h1 { font-family:'Playfair Display',serif; font-size:20px; font-weight:900; color:#fff; margin-bottom:4px; }
12
.hero p { font-size:10px; color:#aaa; line-height:1.5; margin-bottom:6px; }
13
.hero-badge { font-size:9px; color:#c9a84c; text-transform:uppercase; letter-spacing:1px; margin-bottom:4px; }
14
.hero .btn { font-size:10px; padding:3px 10px; }
15
.hero-stat .num { font-family:'Playfair Display',serif; font-size:16px; color:#c9a84c; display:block; }
16
.hero-stat .lbl { font-size:8px; color:#888; text-transform:uppercase; }
17
 
18
/* SECTION SHARED — almost no vertical padding */
19
section { padding: 8px 0; }
20
.sec-tag   { font-size:9px; color:#c9a84c; text-transform:uppercase; letter-spacing:2px; }
21
.sec-title { font-family:'Playfair Display',serif; font-size:14px; font-weight:bold; color:#222; margin:2px 0 4px; }
22
.sec-divider { width:30px; height:2px; background:#c9a84c; margin-bottom:6px; }
23
 
24
/* ABOUT */
25
.about-img-box { width:100%; height:90px; background:#ccc; display:flex; align-items:center; justify-content:center; font-size:9px; color:#999; margin-bottom:6px; }
26
.pillar { font-size:9px; background:#f8f6f0; border-left:2px solid #c9a84c; padding:3px 5px; margin-bottom:3px; }
27
.pillar b { font-size:9px; }
28
.pillar small { color:#bbb; font-size:8px; display:block; } /* nearly invisible */
29
 
30
/* ACTIVITIES — plain list */
31
.act-item { background:#0b1f3a; color:#fff; font-size:10px; padding:4px 8px; margin-bottom:2px; }
32
.act-tag { font-size:8px; color:#c9a84c; display:block; }
33
 
34
/* NEWS — dense table */
35
.news-table th { font-size:9px; background:#eee; padding:3px 4px; }
36
.news-table td { font-size:9px; padding:3px 4px; vertical-align:top; color:#555; }
37
.news-cat { font-size:8px; background:#0b1f3a; color:#c9a84c; padding:1px 4px; white-space:nowrap; }
38
.news-table a { font-size:8px; color:#336699; }
39
 
40
/* TEACHERS — all 8 crammed in col-1 columns */
41
.t-card { text-align:center; padding:4px 2px; border:1px solid #f0f0f0; }
42
.t-avatar { width:38px; height:38px; background:#ddd; border-radius:50%; margin:0 auto 2px; display:flex; align-items:center; justify-content:center; font-size:7px; color:#aaa; border:1px solid #c9a84c; }
43
.t-name { font-size:8px; font-weight:bold; color:#222; }
44
.t-subj { font-size:7px; color:#c9a84c; }
45
.t-bio  { font-size:7px; color:#bbb; line-height:1.3; } /* 7px — unreadable */
46
 
47
/* STUDENT ORGS — plain bullet list */
48
.org-list li { font-size:10px; margin-bottom:5px; color:#444; }
49
.org-meta { font-size:8px; color:#bbb; display:block; }
50
 
51
/* ACHIEVEMENTS */
52
.ach-list li { font-size:10px; padding:3px 0; border-bottom:1px dotted #ddd; color:#555; }
53
.ach-year { font-size:8px; color:#ccc; }
54
/* stats bar — no animation, washed-out colors */
55
.stats-bar { background:#eee; padding:8px; margin-top:8px; }
56
.stat-box { text-align:center; }
57
.stat-box b { display:block; font-size:18px; color:#555; } /* should be gold on navy */
58
.stat-box small { font-size:8px; color:#aaa; }
59
 
60
/* CONTACT */
61
.contact-section { background:#0b1f3a; }
62
.contact-section .sec-title { color:#fff; }
63
.cform-input { background:rgba(255,255,255,.06) !important; border:1px solid rgba(255,255,255,.15) !important; color:#fff !important; font-size:10px; border-radius:0; }
64
.cform-input::placeholder { color:rgba(255,255,255,.3); font-size:10px; }
65
.cform-label { font-size:8px; color:#888; text-transform:uppercase; display:block; margin-bottom:1px; }
66
 
67
/* inconsistent button styles */
68
.btn-send  { background:#c9a84c; color:#0b1f3a; font-size:10px; padding:3px 12px; border:none; }
69
.btn-clear { background:#555; color:#fff; font-size:9px; padding:2px 8px; border:none; margin-left:4px; }
70
 
71
/* FOOTER — dark text on dark bg, nearly invisible */
72
footer { background:#060f1c; padding:8px 0; }
73
.footer-col b { font-size:9px; color:#555; text-transform:uppercase; display:block; margin-bottom:2px; } /* #555 on dark = invisible */
74
.footer-link { color:#444 !important; font-size:9px; text-decoration:none; display:block; } /* #444 on dark = invisible */
75
.footer-copy { font-size:8px; color:#333; margin-top:6px; } /* #333 on dark = invisible */
API FAQ Privacy Terms Contact
System Status: Stable

By using PasteCode you agree to our cookies policy to enhance your experience

Site design by Brill © 2025 PasteCode