WebUI: font style changes for section titles and column headers

Bug: 849857
Cq-Include-Trybots: luci.chromium.try:closure_compilation
Change-Id: I2bdac0e55708bc7461041365ac736ad2c5bc7bc1
Reviewed-on: https://chromium-review.googlesource.com/1114204Reviewed-by: Scott Chen <scottchen@chromium.org>
Commit-Queue: Esmael El-Moslimany <aee@chromium.org>
Cr-Commit-Position: refs/heads/master@{#571331}

chrome/browser/resources/settings/settings_page/settings_section.html

@@ -20,8 +20,8 @@
       }
 
       #header .title {
-        @apply --cr-section-text;
-        font-size: 123%;
+        color: var(--google-grey-900);
+        font-size: 108%;
         font-weight: 400;
         letter-spacing: .25px;
         margin-bottom: 0;

chrome/browser/resources/settings/settings_shared_css.html

@@ -20,7 +20,7 @@
       h2 {
         align-items: center;
         align-self: flex-start;
-        color: var(--google-grey-900);
+        color: var(--google-grey-700);
         display: flex;
         font-size: inherit;
         font-weight: 500;
@@ -326,8 +326,9 @@
       }
 
       .column-header {
-        color: var(--google-grey-600);
-        font-weight: 500;
+        color: var(--google-grey-700);
+        font-size: inherit;
+        font-weight: 400;
       }
 
       /* Error message that appears in a toast to indicate the success or