Add Demo button

hourglass/client/login/login.css

@@ -84,11 +84,11 @@
 	left: 12.5vh;
 }
 
-#loginButton {
+.loginButtons {
 	font-size: 3.5vh;
 	width: 12vw;
 	margin-top: 4vh;
-	margin-left: 16vw;
+	/* margin-left: 16vw; */
 	padding: 1vh;
 
 	border: 1px solid #FCF0F0;
@@ -99,16 +99,24 @@
 	text-align: center;
 	cursor: pointer;
 
-	-webkit-transition: background-color 0.4s ease;  
-	-moz-transition: background-color 0.4s ease; 
+	-webkit-transition: background-color 0.4s ease;
+	-moz-transition: background-color 0.4s ease;
 	-ms-transition: background-color 0.4s ease;
 	transition: background-color 0.4s ease;
 }
 
-#loginButton:hover {
+.loginButtons:hover {
 	background-color: rgba(0,0,0,0.2);
 }
 
+#loginContainer {
+    display: flex;
+}
+
+#demoButton {
+    margin-left: 11vw;
+}
+
 #version {
 	font-size: 1.7vh;
 	color: #FFF !important;
@@ -235,4 +243,4 @@ a:hover {
 	line-height: 6vh;
 	display: inline-block;
 	float: right;
-}
+}

hourglass/client/login/login.html

@@ -18,8 +18,11 @@
 				<h1>Everything in</h1>
 				<h2>One Place.</h2>
 				<h5><b>We</b> handle the organization, <b>you</b> handle the work.</h5>
-				<div id="loginButton" onclick="document.getElementById('login-buttons-google').click()">Sign in!</div>
-			</div>
+        <div id="loginContainer" >
+            <div class="loginButtons" onclick="document.getElementById('login-buttons-google').click()">Sign in!</div>
+            <div class="loginButtons" id="demoButton">Demo</div>
+        </div>
+      </div>
 		</div>
 		<footer id="loginFooter">
 			<p id="version">Version {{version}}</p>