diff --git a/test.html b/test.html
new file mode 100644
index 0000000..b1bae78
--- /dev/null
+++ b/test.html
@@ -0,0 +1,180 @@
+<!DOCTYPE html>
+<html class="no-js" lang="">
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <title>WRA | Map</title>
+    <meta name="description" content="">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="apple-touch-icon" href="apple-touch-icon.png">
+    <!-- Place favicon.ico in the root directory -->
+    <link rel="stylesheet" href="css/normalize.css">
+    <link rel="stylesheet" href="css/main.css">
+    <link rel="stylesheet" href="css/well-card.css">
+    <link rel="stylesheet" href="css/map-desktop.css">
+    <script src="js/vendor/modernizr-2.8.3.min.js"></script>
+</head>
+
+
+
+
+
+
+<body>
+    <!--[if lt IE 8]>
+            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
+        <![endif]-->
+    <!-- Add your site or application content here -->
+
+
+
+
+
+
+    <nav class="top-nav">
+        <div class="main-bttns">
+        <button onclick="document.getElementById('menu').classList.toggle('closed'); document.getElementById('close-menu').classList.toggle('closed')"><img src="img/menu.svg" alt="menu" /></button> <h1>Well Report App</h1>
+        <a href="search.php"><button><img src="img/search.svg" alt="menu" /></button></a>
+        </div>
+
+        <div class="close-menu closed" id="close-menu" onclick="document.getElementById('menu').classList.toggle('closed'); document.getElementById('close-menu').classList.toggle('closed')"></div>
+        <div class="slide-menu closed" id="menu">
+
+            <p>Currntly signed in as: <br>
+
+            </p>
+            <h3>my.name@ct.gov</h3>
+            <a href="#">Logout</a>
+
+            <button>Terrain</button>
+            <button>Satilite</button>
+
+            <a class="settings" href="#">Settings</a>
+
+        </div>
+    </nav>
+
+    <main class="map">
+
+		<div id="map" class="google-maps">
+		</div>
+
+        <div class="well-preview well-card clearfix">
+            <div class="well-img"></div>
+            <div>
+                <h2>Well Name</h2>
+                <p>short well description</p>
+                <a href="details.php">DETAILS</a>
+            </div>
+        </div>
+
+        <div class="desk-details">
+			<a href="details.php" class="go-to" > go to > </a>
+        <?php
+            include 'details-content.php';
+            ?>
+        </div>
+
+    </main>
+
+    <nav class="bottom-nav">
+        <button><a href="map.php"><img src="img/map.svg" alt="menu" /></a></button>
+        <button><a href="wells-list.php"><img src="img/well.png" alt="menu" /></a></button>
+    </nav>
+
+    <nav class="fabs">
+        <button class="gps"><img src="img/gps.svg" alt="get location" /></button>
+        <button class="add-well"><a href="form.php"> <img src="img/add.svg" alt="add well" /></a></button>
+    </nav>
+
+    <script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
+    <script>
+        window.jQuery || document.write('<script src="js/vendor/jquery-1.12.0.min.js"><\/script>')
+    </script>
+    <script src="js/plugins.js"></script>
+    <script src="js/main.js"></script>
+
+    <script>
+
+        function initMap() {
+        var myLatLng = {position.coords.latitude, position.coords.longitude};
+        var map = new google.maps.Map(document.getElementById('map'), {
+          center: myLatLng,
+          zoom: 15
+        });
+        var infoWindow = new google.maps.InfoWindow;
+
+          // Change this depending on the name of your PHP or XML file
+          downloadUrl('http://wellreportapp.uconn.edu/xmlGenerate.php', function(data) {
+            var xml = data.responseXML;
+            var markers = xml.documentElement.getElementsByTagName('marker');
+            Array.prototype.forEach.call(markers, function(markerElem) {
+              var id = markerElem.getAttribute('id');
+                var name = markerElem.getAttribute('id');
+                var address = markerElem.getAttribute('address');
+              var point = new google.maps.LatLng(
+                  parseFloat(markerElem.getAttribute('lat')),
+                  parseFloat(markerElem.getAttribute('lng')));
+
+              var infowincontent = document.createElement('div');
+              var strong = document.createElement('strong');
+              strong.textContent = address
+              infowincontent.appendChild(strong);
+              infowincontent.appendChild(document.createElement('br'));
+
+
+              var text = document.createElement('text');
+              text.textContent = name
+              infowincontent.appendChild(text);
+              infowincontent.appendChild(document.createElement('br'));
+
+              var clicker = document.createElement('a');
+              var clickerText = document.createTextNode("go to details...");
+              clicker.setAttribute('href',"http://wellreportapp.uconn.edu/details.php?Well_ID="+id);
+              clicker.appendChild(clickerText);
+              infowincontent.appendChild(clicker);
+              var marker = new google.maps.Marker({
+                map: map,
+                position: point
+              });
+              marker.addListener('click', function() {
+                infoWindow.setContent(infowincontent);
+                infoWindow.open(map, marker);
+              });
+            });
+          });
+        }
+
+
+      function downloadUrl(url, callback) {
+        var request = window.ActiveXObject ?
+            new ActiveXObject('Microsoft.XMLHTTP') :
+            new XMLHttpRequest;
+
+        request.onreadystatechange = function() {
+          if (request.readyState == 4) {
+            request.onreadystatechange = doNothing;
+            callback(request, request.status);
+          }
+        };
+
+        request.open('GET', url, true);
+        request.send(null);
+      }
+
+      function doNothing() {}
+    </script>
+    <script async defer
+    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCNSoPsxLd0LbvQaH9R6npO7jj-jKAXyQ4&callback=initMap">
+    </script>
+</body>
+
+
+</html>
+<!--
+notes :
+we will need a file where we import the well name, address, longiture and latitude within the range we chose
+
+we need a food loop for it
+-->
