diff --git a/static/styles.css b/static/styles.css
index 047e791..fc53240 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -6,10 +6,6 @@ body, html {
     height: 100%;
 }
 
-html {
-    font-size:130%;
-}
-
 h1 {
     text-align: center;
 }
@@ -20,8 +16,8 @@ div#pinner-modal form {
     padding: 20px;
     border: 1px solid #ccc;
     border-radius: 5px;
-    background-color: rgb(205, 243, 148, 0.7);
-    font-size: 135%;
+    background-color: rgba(202, 216, 3, 0.7);
+    font-size: 100%;
 }
 
 form p {
@@ -33,7 +29,6 @@ form p {
     height: 100vh;
     margin: 0 0;
     position: relative;
-    font-size: 120%;
 }
 
 main {
@@ -48,7 +43,6 @@ div.leaflet-popup-content {
 
 div.pinner-modal {
     position: absolute;
-    
     top: 10vh;
     left: 0;
     width: 100%;
@@ -59,6 +53,7 @@ div.pinner-modal {
     transition: bottom 0.5s ease;
     box-shadow: 0px -4px 15px rgba(0, 0, 0, 0.2);
     z-index: 999;
+
 }
 
 div.pinner-modal.active {
@@ -78,7 +73,7 @@ nav {
     background-color: rgba(202, 216, 3, 0.7);
     padding: 5px;
     z-index: 1000;
-    font-size: 120%;
+    font-size: 110%;
 }
 
 
@@ -112,4 +107,16 @@ flashes {
     border-radius: 20px;
     background-color: rgba(0,150,0,0.8);
     top: 8%;
+}
+
+#pinner-top {
+    background-color: green;
+}
+
+input#submit {
+    background-color: green;
+}
+
+button a {
+    color: black;
 }
\ No newline at end of file
diff --git a/templates/add_pin.html b/templates/add_pin.html
index 9a06278..ce0e6d2 100644
--- a/templates/add_pin.html
+++ b/templates/add_pin.html
@@ -1,4 +1,4 @@
-    <form method="post" enctype="multipart/form-data" style="background-color: rgb(205, 243, 148);">
+    <form method="post" enctype="multipart/form-data" >
         {{ form.hidden_tag() }}
         <!--<p>
             {{ form.description.label }}<br>
@@ -10,9 +10,14 @@
             {{ form.photo() }}
             {{ form.typeofpin }}        
 
-            <label for="lat">Latitud:</label><br>
+            <label for="lat">Latitud:</label>
             <input type="text" id="lat" name="lat" readonly>
-            <label for="lng">Longitud:</label><br>
+            <label for="lng">Longitud:</label>
             <input type="text" id="lng" name="lng" readonly>
-        <p>{{ form.submit() }}</p>
+        <table style="background-color: rgba(0,0,0,0);">
+            <tr style="background-color: transparent;">
+                <td style="background-color:transparent">{{ form.submit() }}</td>
+                <td style="background-color:transparent"><button style="background-color: red; color:white" id="cancel-add" type="button">Cancelar</button></td>
+            </tr>
+        </table>
     </form>
diff --git a/templates/base.html b/templates/base.html
index b49eabc..e43559f 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -14,7 +14,7 @@
     <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
 
 </head>
-<body style="background-color: rgb(205, 243, 148, 0.5); color: black;">
+<body style="color: black;">
     <nav style="height: 7vh;">
         <ul>
             <a href="/"><li><h2>El Bachemapa</h2></li></a>
@@ -73,6 +73,8 @@
         } else {modal_stat.hidden = true;}
     }
     pinner_button_top.addEventListener('click', toggleSlide);
+    const cancel_add = document.getElementById("cancel-add");
+    cancel_add.addEventListener('click', toggleSlide);
     observer.observe(document.body, { childList: true, subtree: true });
 </script>
 <script>
diff --git a/templates/index.html b/templates/index.html
index d18ee66..7e43c31 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -46,7 +46,7 @@
                 var radius = e.accuracy / 2;  // Accuracy of the location
                 // Add a pin (marker) at the user's location
                 user_marker = L.marker(e.latlng).addTo(map)
-                    .bindPopup("Te detectamos en un radio de " + radius + " metros de este punto").openPopup();
+                    .bindPopup("Te detectamos en un radio de " + parseInt(radius) + " metros de este punto").openPopup();
                 document.getElementById('lat').value = e.latlng.lat;
                 document.getElementById('lng').value = e.latlng.lng;
                 // Add a circle around the user's location
