diff --git a/Module 1 - HTML and CSS/Map&exlore b/Module 1 - HTML and CSS/Map&exlore
new file mode 100644
index 0000000..89d2cca
--- /dev/null
+++ b/Module 1 - HTML and CSS/Map&exlore	
@@ -0,0 +1,198 @@
+
+  
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html><head>
+
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+
+<style type="text/css">
+body, html {
+  margin:0;
+  border:0;
+  padding:0;
+  height:100%; 
+  max-height:100%; 
+  overflow: hidden;
+  font-size:9pt;
+  font-family:"Trebuchet MS", Helvetica, Tahoma, sans-serif;
+  background-color:#BBDDFF;
+}
+a.button:hover,  a.button:active { 
+  color:white;
+border: 1px solid black;
+background-color: #3333FF;
+  text-decoration: none;
+cursor:pointer;
+}
+.button a:link, .button a:visited { 
+  background-color: #000099;
+color:white;
+text-decoration: none;
+cursor:auto;
+}
+#map {
+position: absolute;
+top:300px;
+bottom:0px;
+left:400px;
+right:0px;
+overflow:hidden; 
+}
+#map * {
+cursor:crosshair;
+}
+#inputbox {
+position: fixed;
+top:0px;
+bottom:300px;
+height:100%;
+left:400px;
+right:0px;
+overflow:auto;
+	padding:5px;
+}
+#waypoints {
+position: fixed;
+left: 0px;
+top: 0px;
+right:400px;
+height: 100%;
+width: 400px;
+overflow:auto;
+}
+* html body {
+  padding: 0 0 0 0; 
+  }
+* html #map {
+  height:100%; 
+  width:75%; 
+  }
+img {
+  line-height: 0;
+}
+table.wpttable {
+font-size:8pt;
+border: 1px solid black;
+border-spacing: 0px;
+margin-left: auto;
+margin-right: auto;
+background-color: #FFFFFF;
+}
+table.wpttable  td, th {
+border: solid black;
+border-width: 1px;
+padding: 0px 2px;
+}
+table.wpttable tr td {
+text-align:right;
+}
+.button {
+   background-color: #000099;
+	color:white;	
+   border: 1px solid #0000FF;
+   padding: 0px 3px;
+	text-decoration:none;
+}
+.cellbutton {
+   color: #000099;
+/*background-color: inherit;	*/
+   border: 1px solid #000099;
+cursor:pointer;
+}
+.cellbuttonhover {
+   background-color: #3333FF;
+color:white;	
+   border: 1px solid white;
+	cursor:pointer;
+}
+</style>
+
+
+<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&amp;key=AIzaSyD9J85QdcbogCpDnhVcpHD6L5bHLbbaHcc"></script>
+<script type="text/javascript" src="http://cmap.m-plex.com/hb/maptypes.js"></script>
+<script type="text/javascript">
+<!--
+//<![CDATA[
+function OSMUrl(lat, lon) {return "http://www.openstreetmap.org/?lat=" + lat.toFixed(6) + "&amp;lon=" + lon.toFixed(6);};
+function YahooUrl(lat, lon) {return "http://maps.yahoo.com/#mvt=m&amp;lat=" + lat.toFixed(6) + "&amp;lon=" + lon.toFixed(6) + "&amp;zoom=16";};
+function GoogleUrl(lat, lon) {return "http://maps.google.com/maps?ll=" + lat.toFixed(6) + "," + lon.toFixed(6) + "&amp;z=15";};
+function BingUrl(lat, lon) {return "http://www.bing.com/maps/?v=2&amp;cp=" + lat.toFixed(6) + "~" + lon.toFixed(6) + "&amp;lvl=15";};
+function GMSVUrl(lat, lon) {return "http://maps.google.com/?ll=" + lat.toFixed(6) + "," + lon.toFixed(6) + "&amp;cbp=12,0,,0,5&amp;cbll=" + lat.toFixed(6) + "," + lon.toFixed(6) + "&amp;layer=c";};
+var map;
+var infowindow;
+var trace;
+function loadmap() {
+var typeMQOpenMap = new google.maps.ImageMapType(MQOpenMapOptions);
+var typeMQOpenSat = new google.maps.ImageMapType(MQOpenSatOptions);
+var typeMapnik = new google.maps.ImageMapType(MapnikOptions);
+var typeMQMap = new google.maps.ImageMapType(MQMapOptions);
+var typeMQSat = new google.maps.ImageMapType(MQSatOptions);
+var typeCHMSys = new google.maps.ImageMapType(CHMSysOptions);
+var typeCHMPct = new google.maps.ImageMapType(CHMPctOptions);
+var typeYahooMap = new google.maps.ImageMapType(YahooMapOptions);
+var typeYahooSat = new google.maps.ImageMapType(YahooSatOptions);
+var typeBingMap = new google.maps.ImageMapType(BingMapOptions);
+var typeBingSat = new google.maps.ImageMapType(BingSatOptions);
+var maptypelist = ['MQOpenMap', 'MQOpenSat', 'Mapnik', 'MQMap', 'MQSat', 'CHMSys', 'CHMPct', 'YahooMap', 'YahooSat', 'BingMap', 'BingSat', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.SATELLITE, google.maps.MapTypeId.HYBRID, google.maps.MapTypeId.TERRAIN];
+var maptypecontroloptions = {mapTypeIds: maptypelist, position: google.maps.TOP_RIGHT, style: google.maps.MapTypeControlStyle.DROPDOWN_MENU};
+var mapopt = {center: new google.maps.LatLng(0., 0.), zoom: 2, mapTypeId: 'MQOpenMap', mapTypeControl: true, mapTypeControlOptions: maptypecontroloptions, streetViewControl: true, disableDefaultUI: true, panControl: true, zoomControl: true, scaleControl: true, overviewMapControl: true, keyboardShortcuts: true, disableDoubleClickZoom: true};
+infowindow = new google.maps.InfoWindow();
+map = new google.maps.Map(document.getElementById("map"), mapopt)
+trace = new google.maps.Polyline({map: null});
+lotrace = new google.maps.Polyline({map: null});
+hitrace = new google.maps.Polyline({map: null});
+map.mapTypes.set('MQOpenMap', typeMQOpenMap);
+map.mapTypes.set('MQOpenSat', typeMQOpenSat);
+map.mapTypes.set('Mapnik', typeMapnik);
+map.mapTypes.set('MQMap', typeMQMap);
+map.mapTypes.set('MQSat', typeMQSat);
+map.mapTypes.set('CHMSys', typeCHMSys);
+map.mapTypes.set('CHMPct', typeCHMPct);
+map.mapTypes.set('YahooMap', typeYahooMap);
+map.mapTypes.set('YahooSat', typeYahooSat);
+map.mapTypes.set('BingMap', typeBingMap);
+map.mapTypes.set('BingSat', typeBingSat);
+google.maps.event.addListener(map, "center_changed", UpdateCoords);
+google.maps.event.addListener(map, "click", function () { infowindow.close()});
+google.maps.event.addListener(map, 'dblclick', function (theevent) {map.panTo(theevent.latLng);});
+window.onbeforeunload = WptClose;
+}
+//]]>
+-->
+</script>
+<title>CHM Waypoints Editor v2.1b</title>
+<script src="wptfunctions.js" type="text/javascript"></script>
+</head>
+
+<body onload="javascript: ChangeLayout(); loadmap();">
+
+<div id="waypoints">
+  <p id="output"></p>
+  
+</div>
+ 
+<div id="inputbox">
+  <p><a onclick="javascript:LoadText(false);" class="button">Load</a> <a onclick="javascript:LoadText(true);" class="button">Load and Pan</a> <a onclick="javascript:ReverseWaypoints();" class="button">Reverse order</a> <a onclick="javascript:RestoreWaypoints();" class="button">Undo</a> <a onclick="javascript:WriteTabText();" class="button">Save to Tab</a> <a onclick="javascript:ClearText();" class="button">Clear</a> <a onclick="javascript:ChangeLayout();" class="button">Change Layout</a>
+<select name="thickness" onchange="ChangeLineThickness(this.value);">
+<option value="0.25" selected >Th. -2</option>
+<option value="0.5" selected >Th. -1</option>
+<option value="1" selected >Th. Hwy.</option>
+<option value="2">Th. +1</option>
+<option value="4">Th. +2</option>
+<option value="8">Th. +3</option>
+<option value="16">Th. +4</option>
+<option value="32">Th. +5</option>
+</select>
+</p>
+  <textarea id="inputtext" style="font-size:x-small;" rows="7" cols="80"></textarea>
+  <p id="inuselabelsbar"><a onclick="javascript:LoadInUseLabels()" class="button">Load In-use Labels</a> <a onclick="javascript:ClearInUseLabels()" class="button">Clear</a> <textarea id="inuselabelstext" style="font-size:x-small;" rows="1" cols="55"></textarea></p>
+  <p id="errorbar">Paste .wpt file lines in the text area above.  Click Load and Pan above.</p>
+  <p id="coordbar">&nbsp;</p>
+</div>
+
+<div id="map">
+</div>
+ 
+
+</body></html>
+
