From 14cd59c18edfec614109c9f182efea885b8b5f70 Mon Sep 17 00:00:00 2001
From: Jennifer Meade <jmeade11@users.noreply.github.com>
Date: Thu, 2 Jan 2020 12:58:36 -0500
Subject: [PATCH] Update style.css

Remove dead CSS and fix issues and improve the appearance.  Promote good practices to students who may explore the styles use on their own sites.
---
 css/style.css | 47 ++++++++++++++++++++++++++++++-----------------
 1 file changed, 30 insertions(+), 17 deletions(-)

diff --git a/css/style.css b/css/style.css
index cb41f9e..cabef54 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,36 +1,49 @@
-body {
-  font: 16px/1.5 Courier, monospace;
-  margin: 0;
+:root {
+  --teal: #008080;
+  --red: #ff0000;
 }
 
 main {
-  width: 80%;
+  font-family: sans-serif;
   margin: 0 auto;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
+  text-align: center;
+  width: 80%;
 }
 
-.browse {
-  padding: 10px 25px;
+form {
+  display: flex;
 }
 
-a {
-  color: #c00;
+img {
+  margin: 1rem 0;
+  max-width: 500px;
+  width: 100%;
 }
 
 input {
-  width: 20em;
+  border: 1px solid var(--teal);
+  font-size: 1.5rem;
+  padding: .5rem .75rem;
+}
+
+input:focus {
+  box-shadow: 0px 0px 3px var(--teal);
+  outline: none;
 }
 
 input[type="search"] {
-  font-size: 200%;
-  margin: 1em;
+  flex-grow: 1;
+  width: 100%;
 }
 
-select {
-  font-size: 150%;
+input[type="submit"] {
+  background-color: var(--teal);
+  color: #fff;
+  flex-grow: 0;
+  font-size: 1rem;
+  text-transform: uppercase;
 }
+
 .fail {
-  color: red;
+  color: var(--red);
 }