Clean up search outline

// FREEBIE

stylesheets/_index.scss

@@ -84,6 +84,16 @@ input.search {
   padding: 0;
   margin: 0;
   outline: 0;
+  height: $button-height;
+  width: 100%;
+  padding: 10px;
+  border: solid 1px $grey_l;
+  outline-offset: -2px;
+
+  &.active {
+    outline: solid 1px $blue;
+  }
+
   &::-webkit-search-cancel-button {
     -webkit-appearance: none;
     display: block;
@@ -92,15 +102,13 @@ input.search {
     background: url('/images/x.png') no-repeat center;
     background-size: cover;
   }
+
   &::-webkit-search-cancel-button:hover {
     cursor: pointer;
   }
 }
 
 .tool-bar {
-  background: $grey_l;
-  padding: 2px;
-
   button.show-new-conversation {
     float: right;
     height: $button-height;
@@ -116,16 +124,6 @@ input.search {
     }
   }
 
-  input.search {
-    height: $button-height;
-    width: 100%;
-    padding: 10px;
-    border: solid 1px $grey_l;
-
-    &.active {
-      outline: solid 1px $blue;
-    }
-  }
 }
 
 .last-timestamp {

stylesheets/manifest.css

@@ -495,7 +495,14 @@ input.search {
   border: none;
   padding: 0;
   margin: 0;
-  outline: 0; }
+  outline: 0;
+  height: 36px;
+  width: 100%;
+  padding: 10px;
+  border: solid 1px #f3f3f3;
+  outline-offset: -2px; }
+  input.search.active {
+    outline: solid 1px #2090ea; }
   input.search::-webkit-search-cancel-button {
     -webkit-appearance: none;
     display: block;
@@ -506,27 +513,17 @@ input.search {
   input.search::-webkit-search-cancel-button:hover {
     cursor: pointer; }
 
-.tool-bar {
-  background: #f3f3f3;
-  padding: 2px; }
-  .tool-bar button.show-new-conversation {
-    float: right;
-    height: 36px;
-    width: 36px;
-    border: 0;
-    outline: 0;
-    font: 300 36px Roboto, "Helvetica Neue", Arial, Helvetica, sans-serif;
-    color: white;
-    background: url("/images/pencil.png") no-repeat center center; }
-    .tool-bar button.show-new-conversation:hover {
-      background-color: #ebebeb; }
-  .tool-bar input.search {
-    height: 36px;
-    width: 100%;
-    padding: 10px;
-    border: solid 1px #f3f3f3; }
-    .tool-bar input.search.active {
-      outline: solid 1px #2090ea; }
+.tool-bar button.show-new-conversation {
+  float: right;
+  height: 36px;
+  width: 36px;
+  border: 0;
+  outline: 0;
+  font: 300 36px Roboto, "Helvetica Neue", Arial, Helvetica, sans-serif;
+  color: white;
+  background: url("/images/pencil.png") no-repeat center center; }
+  .tool-bar button.show-new-conversation:hover {
+    background-color: #ebebeb; }
 
 .last-timestamp {
   font-size: smaller;