-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
166 lines (159 loc) · 8.84 KB
/
index.html
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
162
163
164
165
166
<!doctype html>
<html lang="en">
<head>
<!-- Meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Oasis - Climate Action for Pioneers</title>
<meta name="description" content="Become a Climate Pioneer and lead the fight against climate change.">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<!-- Custom CSS -->
<link rel="stylesheet" href="main.css">
<!-- Google fonts -->
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Comfortaa" />
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="index.html">Ø</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mx-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">Home<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://oasis.substack.com/archive" target="_blank">Magazine<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="members.html">Pricing<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">About<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Services<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="marketplace.html">Marketplace<span class="sr-only">(current)</span></a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="navbar-btn my-2 my-lg-0">
<a href="members.html" class="btn btn-outline-success">Start journey</a>
</li>
</ul>
</div>
</nav>
<!-- Header -->
<header class="masthead">
<div class="container h-100">
<div class="row h-100 align-items-center">
<div class="col-12 text-center">
<h1 class="text-center" class="font-weight-bold">
Lead the fight against climate change
<br> </br>
<h4 class="text-center" class="lead">Receive rich insights to reduce and remove carbon emissions. <strong><a href="members.html">Join now for free.</a></strong></h4>
<!-- <a class="typewrite" data-period="1000" data-type='[ " today", " now." ]'><span class="wrap"></span></a> -->
<a href="#section1">
<svg width="2em" height="2em" viewBox="0 0 16 16" class="bi bi-arrow-down" fill="currentColor">
<path fill-rule="evenodd" d="M8 1a.5.5 0 0 1 .5.5v11.793l3.146-3.147a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 .708-.708L7.5 13.293V1.5A.5.5 0 0 1 8 1z"/>
</svg>
</a>
</div>
</div>
</div>
</header>
<!-- Image Showcases -->
<section class="showcase" id="section1">
<div class="container-fluid p-0">
<div class="row no-gutters bg-light">
<div class="col-lg-6 order-lg-2">
<img src="images/inspector.png" class="img-fluid">
</div>
<div class="col-lg-6 order-lg-1 my-auto showcase-text">
<h2>Discover trends</h2>
<p class="lead mb-0">Do you know the footprint of the internet? Receive researched insights and inspiration for and from climate experts and executives. Explore stories and services to avoid, reduce and remove emissions.</p>
<a class="btn btn-lg btn-success mt-3 mr-3" href="members.html" role="button">Sign up</a>
</div>
</div>
<div class="row no-gutters">
<div class="col-lg-6">
<img src="images/insurer.png" class="img-fluid">
</div>
<div class="col-lg-6 my-auto showcase-text">
<h2>Learn from others</h2>
<p class="lead mb-0">Ever wondered how companies think about reaching net-zero? Learn from other pioneers how they are tackling sustainability challenges in their organisations. Access the community, ask your questions and make new connections.</p>
<a class="btn btn-lg btn-success mt-3 mr-3" href="https://oasis.substack.com/archive" role="button">Show content</a>
</div>
</div>
<div class="row no-gutters bg-light">
<div class="col-lg-6 order-lg-2">
<img src="images/investor.png" class="img-fluid">
</div> <div class="col-lg-6 order-lg-1 my-auto showcase-text">
<h2>Know what to do</h2>
<p class="lead mb-0">How can I profit from all this? Turn knowledge into competitive advantage and achieve emission reduction and removal targets. To understand is to know what to do.</p>
<a class="btn btn-lg btn-success mt-3 mr-3" href="members.html" role="button">Register</a>
</div>
</div>
</div>
</section>
<!-- Testimonials This is just what I was looking for! "This community is brilliant!" "Really excited about this membership." Complex topics, simply explained!"-->
<section class="testimonials text-center">
<div class="container">
<h2 class="mb-5">Why Pioneers sign up</h2>
<div class="row">
<div class="col-lg-4">
<div class="testimonial-item mx-auto mb-5 mb-lg-0">
<!-- <img class="img-fluid img-small rounded-circle mb-3" src="images/Anna_Schober.jpeg" alt=""> -->
<h5>"The information provided is amazingly thorough, inspiring and pushes my sustainability mindset forward."</h5>
<p class="font-weight-light mb-0">Anna Schober, Facilitator & Process Designer</p>
</div>
</div>
<div class="col-lg-4">
<div class="testimonial-item mx-auto mb-5 mb-lg-0">
<!-- <img class="img-fluid img-small rounded-circle mb-3" src="images/gianni_serra.jpeg" alt=""> -->
<h5>"I like the choice of topics and the writing style."</h5>
<p class="font-weight-light mb-0">Gianni Serra, Director International Relations</p>
</div>
</div>
<div class="col-lg-4">
<div class="testimonial-item mx-auto mb-5 mb-lg-0">
<!-- <img class="img-fluid img-small rounded-circle mb-3" src="images/Maisie_Law.jpg" alt=""> -->
<h5>"Truly interesting and valuable content on everything climate action!"</h5>
<p class="font-weight-light mb-0">Maisie Law, Product Content Lead</p>
</div>
</div>
</div>
</div>
</section>
<!-- Call to Action -->
<section class="call-to-action text-center">
<div class="container">
<div class="row">
<div class="col-xl-9 mx-auto">
<h2 class="mb-4">Become a Pioneer now!</h2>
</div>
<div class="col-md-10 col-lg-8 col-xl-7 mx-auto">
<iframe src="https://oasis.substack.com/embed" width=100% height=100% style="border:0px solid #EEE; background:white;" frameborder="0" scrolling="no"></iframe>
<!-- <a class="btn btn-lg btn-success mt-3 mr-3" href="members.html" role="button"> Start journey</a> -->
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer id="sticky-footer" class="py-4 text-white-50 bg-light">
<div class="container text-center">
<span class="text-muted">Copyright © <a href="https://www.olyfia.com" target="_blank">Olyfia.com LLC</a></span>
</a>
</div>
</footer>
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
</body>
</html>