X-Git-Url: https://472bisson.ca/gitweb/magnet.git/blobdiff_plain/434527ce5fbb459435a792c198ee6d12066c86c1..c0adce5f9b064b542725bc661737678311bd7479:/style.css

diff --git a/style.css b/style.css
index 3481055..b500007 100644
--- a/style.css
+++ b/style.css
@@ -1,47 +1,39 @@
-/* CSS layout */
 
-body {
-    margin: 5px;
-    padding: 5px;
-    font-family: monospace;
-}
+/* 
+    Created on : 10 Jun, 2018, 9:23:39 PM
+    Author     : Manjunath CV
+*/
 
-input[type=text] {
-    width: 420px;
-    height: 30px;
-    padding: 1px;
+@import url('https://fonts.googleapis.com/css2?family=Roboto&family=Roboto+Mono&display=swap');
 
-    font-family:monospace;
-    font-size:large;
+body {
+    font-family: 'Roboto', sans-serif;
+    
 }
 
-textarea {
-    width: 420px;
-    padding: 1px;
+#magnet {
+    font-family: 'Roboto Mono', monospace;
+}
 
-    font-family:monospace;
-    font-size:medium;
+section {
+    margin: auto;
+    width: 850px;
 }
 
-input[type=submit] {
+footer {
+    width:100%;
+    text-align: center;
+}
 
-    font-family:monospace;
-    font-size:large;
 
-    border: 1px solid #777777;
-    background: #6e9e2d;
-    color: white;
-    font: bold 11px 'Trebuchet MS';
-    padding: 4px;
-    height: 30px;
-    cursor: pointer;
-    -moz-border-radius: 4px;
-    -webkit-border-radius: 4px;
-}
 
-/*
+/* Responsive layout - makes the two columns/boxes 
+   stack on top of each other instead of next to 
+   each other, on small screens */
+@media (max-width: 850px) {
+    section {
+        width: 95%;
+    }
 
-http://www.tdl.com/~jrb/jrb7/css_textfield0.html
-http://www.red-team-design.com/style-an-input-button
 
-*/
\ No newline at end of file
+}