diff --git a/html-ONLY-site/details-content.php b/html-ONLY-site/details-content.php
new file mode 100644
index 0000000..4c8d9bc
--- /dev/null
+++ b/html-ONLY-site/details-content.php
@@ -0,0 +1,260 @@
+
+<div class="group">
+            <img src="https://s-media-cache-ak0.pinimg.com/originals/33/c2/c4/33c2c4cf367ecee38a162d362a31fd68.jpg"/>
+        <ul class="inputs" id="report-metadata">
+            <li>
+                <h3>Date well completed</h3>
+                <?php
+                //Should add ternary operator for nulls and blanks
+                $W_Completion_Date = date("m/d/Y", strtotime($row['Date_Well_Completed']));
+                echo'<p id="well-completion-date">'.$W_Completion_Date.'</p>';
+                ?>
+            </li>
+
+            <li>
+                <h3>Date of report</h3>
+                <?php
+                //Should add ternary operator for nulls and blanks
+                $R_Completion_Date = date("m/d/Y", strtotime($row['Date_of_Report']));
+                echo'<p id="report-completion-date">'.$R_Completion_Date.'</p>';
+                ?>
+            </li>
+
+            <li>
+                <h3>Permit number</h3>
+                <?php
+                echo'<p id="permit-number" class="long-num">'.$Well_ID.'</p>';
+                ?>
+            </li>
+
+            <li>
+                <h3>Registrant number</h3>
+                <p id="registrant-number" class="long-num">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>State well number</h3>
+                <?php
+                //Should add ternary operator for nulls and blanks
+                echo'<p id="state-well-number" class="long-num">'.$row['State_Well_No'].'</p>';
+                ?>
+            </li>
+
+            <li>
+                <h3>Other number</h3>
+                <?php
+                //Should add ternary operator for nulls and blanks
+                echo'<p id="other-number" class="long-num">'.$row['Other_No'].'</p>';
+                ?>
+            </li>
+        </ul>
+</div>
+<div class="group">
+        <h2>Owner Info</h2>
+        <ul class="inputs" id="owner-info">
+            <li><h3>Name</h3>
+                <p id="name">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Address</h3>
+                <p id="address">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Town</h3>
+                <p id="town">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3 >Zip code</h3>
+                <p id="zip-code" class="med-num">STILLTODO</p>
+            </li>
+        </ul>
+</div>
+<div class="group">
+        <h2>Well location</h2>
+        <ul class="inputs" id="owner-info">
+
+            <li>
+                <h3>Address</h3>
+                <p id="address">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Town</h3>
+                <p id="town">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Zip code</h3>
+                <p id="zip-code" class="med-num">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Lot number</h3>
+                <p id="lot-number" class="med-num">STILLTODO</p>
+            </li>
+
+            <li id="get-gps-local">
+                <h3>GPS coordinates </h3>
+                <h4>Latitude</h4>
+                <p id="gps-coordinates-latitude">STILLTODO</p>
+                <h4 for="gps-coordinates">Longitude</h4>
+                <p id="gps-coordinates-longitude">STILLTODO</p>
+
+            </li>
+
+            <li>
+                <h3 >Location relative to three permanent landmarks</h3>
+                <p id="relative-location">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Use</h3>
+                <p id="other-use-case">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Drilling equipment</h3>
+                <p id="other-equipment">STILLTODO</p>
+            </li>
+
+        </ul>
+</div>
+
+<div class="group">
+        <h2>Casing Details</h2>
+        <ul class="inputs" id="casing-details">
+            <li>
+                <h3>Length</h3>
+                <p  id="length">STILLTODO</p>
+            </li>
+            <li>
+                <h3>Diameter</h3>
+                <p  id="diameter">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Weight per foot</h3>
+                <p  id="weight">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Threaded/Welded</h3>
+                <p>STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Drive Shoe?</h3>
+                <p>STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Casing Grouted?</h3>
+                <p>STILLTODO</p>
+            </li>
+        </ul>
+</div>
+<div class="group">
+        <h2>Yield Test</h2>
+        <ul class="inputs" id="yield-test">
+            <li>
+                <h3>Method</h3>
+                <p id="method">STILLTODO</p>
+            </li>
+            <li>
+                <h3>Test duration</h3>
+                <p  id="yield-hours">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Yield</h3>
+                <p id="yeld-gpm">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Yield test notes</h3>
+                <p id="yield-test-notes">STILLTODO</p>
+            </li>
+
+        </ul>
+</div>
+<div class="group">
+        <h2>Water Level</h2>
+        <ul class="inputs" id="yield-test">
+            <li>
+                <h3>From land surface</h3>
+                <p  id="water-from-surface">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>During yield test</h3>
+                <p  id="water-level-during-yield-test">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Depth of complete well</h3>
+                <p  id="water-from-surface">STILLTODO</p>
+            </li>
+
+        </ul>
+</div>
+<div class="group">
+        <h2>Screen Details</h2>
+        <ul class="inputs" id="screen-details">
+            <li>
+                <h3>Make</h3>
+                <p type="text" id="make">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Length open to aquifier</h3>
+                <p  id="length-open-to-aquifier">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Slot size</h3>
+                <p  id="slot-size">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Diameter</h3>
+                <p  id="diameter">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Gravel</h3>
+                <p>STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Diameter including gravel pack</h3>
+                <p  id="diameter-including-gravel-pack">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Gravel size</h3>
+                <p  id="gravel-size">STILLTODO</p>
+            </li>
+
+            <li>
+                <h3>Gravel pack location</h3>
+                <p  id="gravel-pack-location-from">STILLTODO</p>
+                to
+                <p  id="gravel-pack-location-to">STILLTODO</p>
+            </li>
+
+        </ul>
+</div>
+<div class="group">
+        <h2>Other Notes</h2>
+        <ul class="inputs" id="notes">
+
+            <li>
+                <p id="notes">STILLTODO</p>
+            </li>
+
+        </ul>
+</div>
+        <p type="submit" value="Submit">
diff --git a/html-ONLY-site/details.php b/html-ONLY-site/details.php
new file mode 100644
index 0000000..a316166
--- /dev/null
+++ b/html-ONLY-site/details.php
@@ -0,0 +1,87 @@
+<?php
+$mysqli = new mysqli("localhost", "db10e41481317066", "jXLUjNG/cQxm4VJ1SionhDKdcT4BT1Dos7sZMddIapa/8LYDpDNz+3hwGCz8Shon", "db10e41481317066");
+if ( (isset($_GET['Well_ID']))  && (is_numeric($_GET['Well_ID'])) ) {
+	$Well_ID = $_GET['Well_ID'];
+}
+else if ( (isset($_POST['Well_ID'])) && (is_numeric($_POST['Well_ID'])) ) {
+	$Well_ID = $_POST['Well_ID'];
+}
+else {
+    $Well_ID = "0";
+}
+
+$query = "SELECT Date_Well_Completed, Date_of_Report, State_Well_No, Other_No, CONCAT(Well_Street_Number, ' ', Well_Street_Name) AS 'WellAddress', Well_Town
+            FROM well_completion_report
+            WHERE Permit_Number = $Well_ID";
+if ($result = $mysqli->query($query)) {
+    $row = $result->fetch_assoc();
+}
+?>
+<!doctype html>
+<html class="no-js" lang="">
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <title></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/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">
+        <button><a href="map.php"><img alt="back" src="img/back.svg" ></a></button> <h1>Details</h1>
+        <button><a href="form.php"><img alt="edit" src="img/edit.svg" ></a></button>
+    </nav>
+<main class="details">
+
+<?php
+	include 'details-content.php';
+?>
+<main class="details">
+    <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>
+    <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
+    <script>
+        (function (b, o, i, l, e, r) {
+            b.GoogleAnalyticsObject = l;
+            b[l] || (b[l] = function () {
+                (b[l].q = b[l].q || []).push(arguments)
+            });
+            b[l].l = +new Date;
+            e = o.createElement(i);
+            r = o.getElementsByTagName(i)[0];
+            e.src = 'https://www.google-analytics.com/analytics.js';
+            r.parentNode.insertBefore(e, r)
+        }(window, document, 'script', 'ga'));
+        ga('create', 'UA-XXXXX-X', 'auto');
+        ga('send', 'pageview');
+    </script>
+</body>
+
+</html>
diff --git a/html-ONLY-site/priv_includes/config.inc.php b/html-ONLY-site/priv_includes/config.inc.php
deleted file mode 100644
index 17b607c..0000000
--- a/html-ONLY-site/priv_includes/config.inc.php
+++ /dev/null
@@ -1,15 +0,0 @@
-<?php
-define('OFFLINE_FLG', FALSE);
-define('OFFLINE_MSG','Site is currently down for maintenance.');
-
-define('AUTHENTICATION_FLG', TRUE);
-
-// BASE URL
-define('BASE_URL', 'http://wellreportapp.uconn.edu/');
-
-// Site Name
-define('SITE_NAME','WELLO');
-
-//database connection info file & database related php functions, any page can reference this via absolute URL
-define('MYSQL_CONN_FILE', 'mysqli_oo_connect.php');
-?>
diff --git a/html-ONLY-site/priv_includes/mysqli_oo_connect.php b/html-ONLY-site/priv_includes/mysqli_oo_connect.php
deleted file mode 100644
index 4d3e2eb..0000000
--- a/html-ONLY-site/priv_includes/mysqli_oo_connect.php
+++ /dev/null
@@ -1,20 +0,0 @@
-<?php
-// Declare and set constants for DB connection parameters
-DEFINE ('DB_USER', 'db10e41481317066');
-DEFINE ('DB_PASSWORD','jXLUjNG/cQxm4VJ1SionhDKdcT4BT1Dos7sZMddIapa/8LYDpDNz+3hwGCz8Shon');
-DEFINE ('DB_HOST','localhost');
-DEFINE ('DB_NAME','db10e41481317066');
-
-//Making a Connection
-$mysqli = new MySQLi(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);
-
-//Verify the Connection
-if ($mysqli->connect_error) { //if there is a connection error
-	echo $mysqli->connect_error; //echo error to screen
-	unset($mysqli); //delete the object created on line 19
-}
-else { //establish encoding
-	$mysqli->set_charset('utf8');
-}
-
-/* terminating php tag "?>" not needed if this file end in .php extension */
diff --git a/html-ONLY-site/search.html b/html-ONLY-site/search.html
index e4933d2..9e7faea 100644
--- a/html-ONLY-site/search.html
+++ b/html-ONLY-site/search.html
@@ -12,6 +12,7 @@
     <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/desktop.css">
     
     <script src="js/vendor/modernizr-2.8.3.min.js"></script>
 </head>
@@ -32,21 +33,21 @@
 
 
 
-    <nav class="top-nav">
+    <nav class="top-nav search">
         <input type="search" >
-        <button><a href="map.html"><img src="img/close.svg" alt="close" /></a></button>
+        <button><a href="map.php"><img src="img/close.svg" alt="close" /></a></button>
     </nav>
 
-    <main>
-
-        <div class="well-card clearfix">
-            <div class="well-img"></div>
-            <div>
-                <h2>Well Name</h2>
-                <p>short well description</p>
-            </div>
-        </div>
-
+    <main class="search">
+		<a href="details.php" class="search-result">
+			<div class="well-card clearfix">
+				<div class="well-img"></div>
+				<div>
+					<h2>Well Name</h2>
+					<p>short well description</p>
+				</div>
+			</div>
+		</a>
     </main>
 
 
diff --git a/html-ONLY-site/wells-list.php b/html-ONLY-site/wells-list.php
index 6d6ed6c..4f5c408 100644
--- a/html-ONLY-site/wells-list.php
+++ b/html-ONLY-site/wells-list.php
@@ -8,7 +8,8 @@
 }
 
 $query = "SELECT CONCAT(Well_Street_Number, ' ', Well_Street_Name) AS 'WellAddress', Well_Town, Permit_Number
-            FROM well_completion_report";
+            FROM well_completion_report
+            LIMIT 10";
 
 ?>
 
@@ -26,6 +27,8 @@
     <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">
+    <link rel="stylesheet" href="css/desktop.css">
 
     <script src="js/vendor/modernizr-2.8.3.min.js"></script>
 </head>
@@ -47,13 +50,17 @@
 
 
     <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>Nearby Wells</h1>
         <button><a href="search.html"><img src="img/search.svg" alt="menu" /></a></button>
+        </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:
-                <h3>my.name@ct.gov</h3>
+<!--                <h3>-->
+					my.name@ct.gov
+<!--			</h3>-->
             </p>
             <a href="#">Logout</a>
             <a class="settings" href="#">Settings</a>
@@ -61,14 +68,15 @@
         </div>
     </nav>
 
-    <main>
+    <main class="list">
+		<h1 class="title">Nearby Wells</h1>
     <?php
         if ($result = $mysqli->query($query)) {
 
             /* fetch associative array */
             while ($row = $result->fetch_assoc()) {
                 echo'
-                <a href="details.php">
+                <a href="details.php?Well_ID='.$row["Permit_Number"].'">
                     <div class="well-card clearfix">
                         <div class="well-img"></div>
                         <div>
@@ -87,7 +95,7 @@
     </main>
 
     <nav class="bottom-nav">
-        <button><a href="map.html"><img src="img/map.svg" alt="menu" /></a></button>
+        <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>