login page, hitting enter = submits form; red map icon; smooth scrolling for iOS

img-vid/mapicon.svg

@@ -1,14 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="19px" height="26px" viewBox="0 0 19 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
-    <title>Maps Icon I</title>
-    <desc>Created with Sketch.</desc>
-    <defs></defs>
-    <g id="Welcome" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Desktop-HD" transform="translate(-1018.000000, -862.000000)" fill="#D1D3D4">
-            <g id="text" transform="translate(346.000000, 797.000000)">
-                <path d="M681.372302,78.8126403 C678.998734,78.8126403 677.075635,76.8880447 677.075635,74.5159731 C677.075635,72.1424049 678.998734,70.2193058 681.372302,70.2193058 C683.745122,70.2193058 685.668221,72.1424049 685.668221,74.5159731 C685.668221,76.8880447 683.745122,78.8126403 681.372302,78.8126403 Z M681.372302,65 C676.045991,65 672,69.7284292 672,74.5616186 C672,78.4167962 681.372302,91 681.372302,91 C681.372302,91 690.744604,78.4167962 690.744604,74.5616186 C690.744604,69.7284292 686.697116,65 681.372302,65 L681.372302,65 Z" id="Maps-Icon-I"></path>
-            </g>
-        </g>
-    </g>
-</svg>

rsvp.css

@@ -4,6 +4,7 @@
   padding    : 0;
   font-family: 'Glass Antiqua', cursive;
   color: #4A4A4A;
+  -webkit-overflow-scrolling: touch;
 }
 
 

savethedate.css

@@ -162,7 +162,8 @@ img {
 }
 .overlay-content {
     position: relative;
-    top: 25%;
+    top: 25vh;
+    bottom: 75vh;
     width: 100%;
     text-align: center;
     margin-top: 30px;
@@ -207,10 +208,8 @@ img {
   margin-top: 1em;
 }
 .overlay div {
-  background-color: pink;
 }
 
-
 #take-me-in-btn {
   display          : flex;
   width            : 262px;
@@ -248,6 +247,7 @@ img {
   font-size: 24px;
   color: #F8E6C1;
   letter-spacing: 2px;
+  line-height: normal;
 }
 
 ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
@@ -288,6 +288,11 @@ input:focus {outline:0;}
 @media
   only screen
   and (max-width : 330px) {
+
+  body {
+    position: fixed;
+  }
+
   #names {
     width         : 140px;
     margin-bottom : 2.5em;
@@ -352,6 +357,11 @@ input:focus {outline:0;}
   only screen
   and (min-width : 331px)
   and (max-width : 375px) {
+
+  body {
+    position: fixed;
+  }
+
   #names {
     width         : 140px;
     margin-bottom : 1.3em;
@@ -418,6 +428,11 @@ input:focus {outline:0;}
   only screen
   and (min-width : 376px)
   and (max-width : 766px) {
+
+body {
+  position: fixed;
+}
+
   #names {
     width         : 400px;
     margin-bottom : 3em;
@@ -484,6 +499,11 @@ input:focus {outline:0;}
   only screen
   and (min-width : 767px)
   and (max-width : 1024px) {
+
+  body {
+    position: fixed;
+  }
+
   #names {
     margin-bottom : .6em;
     font-size     : 90px;

savethedate.html

@@ -127,7 +127,7 @@
             <p id='p-oldehove-mobile'>Oldehove</p>
             <p id='p-thenetherlands-mobile'>The Netherlands
               <a href='https://goo.gl/maps/yj2srDnwXc42' target='_blank'><img class='mapbutton-mobile'
-                src='img-vid/mapicon.svg' alt='map pin drop icon'></a></p>
+                src='img-vid/mapicon-red.svg' alt='map pin drop icon'></a></p>
           </div>
           <button type='button' id='login-button' class='button1' onclick="openNav()">Login</button>
         </div>
@@ -139,7 +139,7 @@
     </div>
     <div id="myNav" class="overlay">
         <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
-        <div class="overlay-content">
+        <form class="overlay-content">
           <p class="modal-message">Please use your invitation email and code we sent</p>
           <input tabindex="1" class="input-box" type="text" id="email-input" tabindex="10" value="" placeholder="email">
               <br>
@@ -148,8 +148,8 @@
           <div class="invalid-credentials" id="invalid-credentials" style="font-size:22px; color: #ED3F54; font-weight: bold; letter-spacing: 1px; line-height: 150%;">
             Hmm.. that didn't work </br>Please make sure to use your invitation email and code we sent
           </div>
-          <button tabindex="3" id="take-me-in-btn" onclick="openRsvp()">Take me in!</button>
-        </div>
+          <button tabindex="3" type="submit" id="take-me-in-btn" onclick="openRsvp()">Take me in!</button>
+        </form>
     </div>
   </body>
   <script>