extra bits
This commit is contained in:
parent
06403d254f
commit
8fefc67428
@ -1,34 +1,32 @@
|
||||
"use client";
|
||||
import Image from 'next/image';
|
||||
import Image from "next/image";
|
||||
|
||||
const OurMission = () => {
|
||||
return (
|
||||
<div
|
||||
className="min-h-screen relative bg-fixed bg-cover bg-center text-white"
|
||||
style={{ backgroundImage: "url('destruction.jpg')" }}
|
||||
className="relative bg-fixed bg-cover bg-center text-white "
|
||||
style={{ backgroundImage: "url('destruction.jpg')", height: 845, overflow: "hidden" }}
|
||||
>
|
||||
{/* Overlay for Readability */}
|
||||
<div className="absolute inset-0 bg-black bg-opacity-50"></div>
|
||||
{/* Centered content */}
|
||||
<div className="relative z-20 flex flex-col items-center justify-center min-h-screen">
|
||||
<div className="relative z-20 flex flex-col items-center justify-center h-full py-auto">
|
||||
{/* Title & Mission Statement */}
|
||||
<div className="mb-10 flex flex-col items-center">
|
||||
<h1 className="text-4xl font-bold text-center tracking-tight mb-2 drop-shadow-lg">
|
||||
Our Mission
|
||||
</h1>
|
||||
<p className="text-lg text-center max-w-2xl text-white drop-shadow-md">
|
||||
Earthquake awareness accessible for everyone
|
||||
</p>
|
||||
<h1 className="text-4xl font-bold text-center tracking-tight mb-2 drop-shadow-lg">Our Mission</h1>
|
||||
<p className="text-lg text-center max-w-2xl text-white drop-shadow-md">Earthquake awareness accessible for everyone</p>
|
||||
</div>
|
||||
{/* Content Area */}
|
||||
<div className="max-w-5xl w-full p-8 bg-white bg-opacity-90 shadow-xl rounded-3xl">
|
||||
<p className="text-xl text-black leading-relaxed mb-6 max-w-3xl mx-auto">
|
||||
At <span className="font-bold text-black">Tremor Tracker</span>, we empower communities worldwide to understand where and why earthquakes occur to enable better preparation
|
||||
and recovery. Education, cutting-edge research, and innovative technology combine together.
|
||||
At <span className="font-bold text-black">Tremor Tracker</span>, we empower communities worldwide to understand where
|
||||
and why earthquakes occur to enable better preparation and recovery. Education, cutting-edge research, and innovative
|
||||
technology combine together.
|
||||
</p>
|
||||
<p className="text-xl text-black leading-relaxed mb-8 max-w-3xl mx-auto">
|
||||
We combine scientific insights with public awareness, delivering resources, tools, and real-time updates to enhance
|
||||
preparedness for earthquakes in order to save lives, improve recovery efficiency, and build resilience against seismic events.
|
||||
preparedness for earthquakes in order to save lives, improve recovery efficiency, and build resilience against seismic
|
||||
events.
|
||||
</p>
|
||||
<div className="flex flex-col md:flex-row md:justify-evenly gap-8 mt-8">
|
||||
<div className="flex flex-col items-center p-6 hover:bg-white hover:bg-opacity-10 rounded-xl transition-colors duration-300">
|
||||
|
||||
@ -32,16 +32,14 @@ const teamMembers = [
|
||||
export default function Page() {
|
||||
return (
|
||||
<div
|
||||
className="min-h-screen relative flex flex-col items-center justify-center px-4 py-20"
|
||||
className="min-h-screen relative flex flex-col items-center justify-center px-4 py-30"
|
||||
style={{ backgroundImage: "url('tectonicPlate.jpg')", backgroundSize: "cover", backgroundPosition: "center" }}
|
||||
>
|
||||
{/* Overlay */}
|
||||
<div className="absolute inset-0 bg-black bg-opacity-50 pointer-events-none"></div>
|
||||
{/* Header */}
|
||||
<div className="relative z-10 flex flex-col items-center mb-1">
|
||||
<h1 className="text-4xl font-bold text-center text-white mb-4 tracking-tight drop-shadow-lg">
|
||||
Meet the Team
|
||||
</h1>
|
||||
<h1 className="text-4xl font-bold text-center text-white mb-4 tracking-tight drop-shadow-lg">Meet the Team</h1>
|
||||
<p className="text-lg text-center max-w-2xl text-white mb-12 drop-shadow-md">
|
||||
Our world-class scientists and engineers drive innovation across the globe. Meet our four department heads:
|
||||
</p>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user