Change Certificate Viewer WebUI to match new style.

chrome/browser/resources/certificate_viewer.css

 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
  * Use of this source code is governed by a BSD-style license that can be
  * found in the LICENSE file. */
 
 /* Using 100% width within body should exclude margins. */
 html,
 body {
   height: 100%;
   width: 100%;
 }
 
 body {
   -webkit-box-sizing: border-box;
   margin: 0;
-  padding-top: 8px;
 }
 
 h3 {
   font-size: 100%;
-  font-weight: bold;
-  margin-top: 20px;
+  margin-bottom: 15px;
+  margin-top: 17px;
 }
 
 #usages-title {
   /* Workaround until webkit bug https://bugs.webkit.org/show_bug.cgi?id=80537
    * is resolved. */
-  padding-top: 20px;
+  padding-top: 17px;
 }
 
 #tabbox {
   height: 100%;
   width: 100%;
 }
 
 #tabpanels {
   overflow: auto;
 }
 
 #usages,
 #cert-field-value {
   -webkit-padding-start: 15px;
   white-space: pre-wrap;
 }
 
+#general h3 {
+  margin-bottom: 16px;
+  margin-top: 32px;
+}
+
 .groups {
   display: table;
 }
 
 .groups > * {
   display: table-row;
 }
 
+#usages,
 .groups > div > div {
-  -webkit-padding-start: 15px;
-  padding-top: 3px;
+  -webkit-padding-start: 20px;
+  color: #787878;
+  line-height: 18px;
 }
 
 .attribute {
   display: table-cell;
   white-space: nowrap;
 }
 
 .value {
   display: table-cell;
   white-space: pre-wrap;
@@ skipping 24 matching lines @@
   top: 20%;
 }
 
 #cert-field-value-section {
   bottom: 0;
   height: 30%;
 }
 
 .section-contents {
   -webkit-box-flex: 1;
-  border: 1px solid #9e9e9e;
+  background: #fff;
+  border: 1px solid #c8c8c8;
   /* Scrolling should be enabled on all tree views and value field. */
   overflow: auto;
 }
 
+.tree-row[selected] {
+  background-color: #f0f0f0;
+  background-image: none;
+}
+
+.tree-item > .tree-row {
+  border: 0;
+  border-radius: 0;
+  line-height: 29px;
+}
+
 #export {
   -webkit-margin-start: 1px;
-  margin-bottom: 10px;
-  margin-top: 5px;
+  float: right;
+  margin-bottom: 20px;
+  margin-top: 10px;
 }