diff --git a/index2.html b/index2.html
new file mode 100644
index 0000000..f1403f8
--- /dev/null
+++ b/index2.html
@@ -0,0 +1,108 @@
+
+
+
+
+
+
+
+
+
+
+
+
+//not actually using anything below here at this stage
+ var cycle_route_sections = [[[51.531281,-0.126429], [51.535126,-0.135183], [51.539288,-0.137157], [51.544041,-0.131493]],[[51.545483,-0.117588], [51.540943,-0.110893], [51.536991,-0.114841], [51.534752,-0.112610], [51.532402,-0.122137]]];
+
+
+var draw_section = function (map, cycle_route_section) {
+
+ var cycle_route_section_lat_longs = [];
+
+ for (i = 0; i < cycle_route_section.length; i++) {
+ cycle_route_section_lat_longs.push(new google.maps.LatLng(cycle_route_section[i][0], cycle_route_section[i][1]));
+ }
+
+ var section = new google.maps.Polyline({
+ path: cycle_route_section_lat_longs,
+ strokeColor: "#456789",
+ strokeOpacity: 1.0,
+ strokeWeight: 4
+ });
+
+ section.setMap(map)
+}
+
+function setMarkers(map, locations) {
+
+ var marker_image_url = "http://google-maps-icons.googlecode.com/files/purple0"
+ var image = new google.maps.MarkerImage(marker_image_url,
+ // This marker is 20 pixels wide by 32 pixels tall.
+ new google.maps.Size(20, 32),
+ // The origin for this image is 0,0.
+ new google.maps.Point(0,0),
+ // The anchor for this image is the base of the flagpole at 0,32.
+ new google.maps.Point(0, 32));
+ var shape = {
+ coord: [1, 1, 1, 20, 18, 20, 18 , 1],
+ type: 'poly'
+ };
+
+ for (var i = 0; i < locations.length; i++) {
+ //put the right number on the marker
+ var image = marker_image_url + (i + 1) + ".png"
+ var location = locations[i];
+ var myLatLng = new google.maps.LatLng(location[1], location[2]);
+ var marker = new google.maps.Marker({
+ position: myLatLng,
+ map: map,
+ icon: image,
+ shape: shape,
+ title: location[0]
+ });
+ }
+}
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..32c1cde
--- /dev/null
+++ b/style.css
@@ -0,0 +1,26 @@
+.map {
+ width: 700px;
+ height:500px
+ }
+
+#navigation {
+ width: 700px;
+ height: 30px;
+ }
+
+.tab {
+ width: 50px;
+ height: 30px;
+ display: inline-block;
+ color: #d3d3d3;
+}
+
+.tab:hover {
+ background-color: #1e5b05;
+ color: #000000;
+}
+
+.tab_selected {
+ background-color: #1e5b05;
+ color: #000000;
+}