dariuswiles.github.io/index.html at master · dariuswiles/dariuswiles.github.io · 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
162
163
164
165
166
167
168
169
<!DOCTYPE HTML>
<!--
	Introspect by TEMPLATED
	templated.co @templatedco
	Released for free under the Creative Commons Attribution 3.0 license (templated.co/license)
-->
<html lang="en-us">
	<head>
		<title>Civilized Century</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
		<link rel="stylesheet" href="assets/css/main.css" />
		<link rel="shortcut icon" href="images/favicon.ico">
		<script
			  src="https://code.jquery.com/jquery-3.6.0.slim.min.js"
			  integrity="sha256-u7e5khyithlIdTpu22PHhENmPcRdFiHRjhAuHcs05RI="
			  crossorigin="anonymous"></script>
		<script>
			var numberBanners = 0;
			function changeBanner() {
				var currentBanner = $("#banner .banner:visible").index();
				$("#banner .banner").eq(currentBanner).fadeOut(2500);
				var nextBanner = currentBanner < (numberBanners-1) ? currentBanner + 1 : 0;
				$("#banner .banner").eq(nextBanner).fadeIn(2500);
			}
			window.onload = function() {
				numberBanners = $("#banner").children().length;
				setInterval(changeBanner, 3500)
			};


		</script>
		<!-- MailerLite Universal -->
		<script>
		    (function(w,d,e,u,f,l,n){w[f]=w[f]||function(){(w[f].q=w[f].q||[])
		    .push(arguments);},l=d.createElement(e),l.async=1,l.src=u,
		    n=d.getElementsByTagName(e)[0],n.parentNode.insertBefore(l,n);})
		    (window,document,'script','https://assets.mailerlite.com/js/universal.js','ml');
		    ml('account', '1253612');
		</script>
		<!-- End MailerLite Universal -->
	</head>
	<body>

		<!-- Header -->
			<header id="header">
				<div class="inner">
					<a href="index.html" class="logo">
						<span class="sr">Civilized Century</span>
						<img src="images/logo.png" />
					</a>
					<nav id="nav">
						<a href="index.html" class="active">Home</a>
						<a href="route-75-100.html">Routes</a>
						<a href="store.html">Store</a>
						<a href="parking.html">Parking</a>
						<a href="support.html">Support</a>
						<a href="gallery.html">Gallery</a>
						<a href="tips.html">Tips</a>
					</nav>
				</div>
			</header>
			<a href="#menu" class="navPanelToggle"><span class="fa fa-bars"></span></a>

		<!-- Banner -->
			<section id="banner">
				<img class="banner banner-1 show" src="/images/banners/banner1.jpg" />
				<img class="banner banner-2" src="/images/banners/banner2.jpg" />
				<img class="banner banner-3" src="/images/banners/banner3.jpg" />
			</section>

		<!-- Main -->
			<section id="main">
				<div class="inner">
					<h1>Octennial Civilized Century</h1>
					<h2>Sunday, August 2<span style="text-transform: lowercase;">nd</span>, 2026</h2>
				</div>
			</section>

		<!-- Two -->
			<section id="two">
				<div class="inner">
					<article>
						<div class="content">
							<header>
								<h2>The Ride</h2>
							</header>
							<p>Want to enjoy the pinnacle of cycling goals but without the hassles. Perhaps the Civilized Century is for you! A "Century" is 100 miles with shorter routes available.</p>
							<ul>
								<li>No hills, hills, and more hills. Will not hear things like - "Wanna race to the top?" or "Nice climb". It's pretty much flat-ish!</li>
								<li>No ugly start times. Ride out at 8am or later!</li>
								<li>No time gates. There's 12 hours of daylight but 10 ought to do it.</li>
								<li>No long, early morning drive or expensive hotel stay. It's local!</li>
								<li>No rain. It never rains in California or so the song says.</li>
								<li>No wind. Well that, we cannot promise.</li>
								<li>No huge Event fee - it's $70 with a youth discount.</li>
							</ul>
							</div>
					</article>
					<article>
						<div class="content">
							<p>The course offers scenic views of the Peninsula Bay Area, a jaunt across Dumbarton Bridge, loop around Facebook/Meta campus, and a few hidden trails. Designed for safety, the South Bay section is clockwise to minimize left turns. And an overall portion of the course is trail, bike lane, or low car traffic.</p>
							<p><span style="color:red"> eBike Policy:</span> Pedal assisted (class 1/3) eBikes are okay. Throttle assisted (Class 2) are NOT allowed on any rides.</p>
							<!--header-->
							<!--/header-->
							<!-- place URL inside href quote old jersey placeholder -->
						 	<!--<a href="" target="_blank" class="button special">Order Jersey(s)</a>-->
							<!-- When registration opens, uncomment the following line by removing the exclamation point and two dashes near the start of the line and the two dashes near the end. -->
							<!--<a id="registerButton" href="#" class="button special">Register to Ride</a>&nbsp;&nbsp;<span><span style="color:red">Sold Out!</span></span>-->
							<!-- line below is the email list button -->
							<div class="ml-embedded" data-form="HIHz80"></div>
						</div>
					</article>

				</div>
			</section>

			<!-- Footer -->
			<section id="footer" class="houndstooth">
				<div class="inner">
					<p class="right">The "Civilized Century" is a cycling event organized by the <a href="https://www.meetup.com/Redwood-Shores-Cycling-Meetup/">Redwood Shores Cycling Meetup</a>.</p>
				</div>
			</section>
			<section id="registerModal">
				<div class="inner">
					<div id="eventbrite-widget-container-1298734352409"></div>
					<script src="https://www.eventbrite.com/static/widgets/eb_widgets.js"></script>
					<script type="text/javascript">
						var exampleCallback = function() {
							console.log('Order complete!');
							$('#registerButton').hide();
						};

						window.EBWidgets.createWidget({
							// Required
							widgetType: 'checkout',
							eventId: '1298734352409',
							iframeContainerId: 'eventbrite-widget-container-1298734352409',

							// Optional
							iframeContainerHeight: 800,  // Widget height in pixels. Defaults to a minimum of 425px if not provided
							onOrderComplete: exampleCallback  // Method called when an order has successfully completed
						});

						$('#registerButton').click(function(e) {
							e.preventDefault();
							$('#registerModal').show();
						});

						$('#registerModal').click(function(e) {
							console.log("modal clicked");
							$('#registerModal').hide();
						});
					</script>
				</div>
			</section>

		<!-- Scripts -->
			<script src="assets/js/jquery.min.js"></script>
			<script src="assets/js/skel.min.js"></script>
			<script src="assets/js/util.js"></script>
			<script src="assets/js/main.js"></script>

	</body>
</html>