First set of changes for M7 NTP.

chrome/browser/resources/new_tab_theme.css

 html {
   background-image: url(chrome://theme/IDR_THEME_NTP_BACKGROUND?$1);
   background-color: $2; /* COLOR_NTP_BACKGROUND */
   background-position: $3;
   background-repeat: $5;
   overflow: hidden;
 }
 
 html[bookmarkbarattached='true'] {
   background-position: $4;
 }
 
 body {
   color: $8; /* COLOR_NTP_TEXT */
   height: 100%;
   overflow: auto;
 }
 
-#main {
-  background: url(chrome://theme/IDR_PRODUCT_LOGO?$1) no-repeat 0 8px;
-}
-
+/* TODO(aa): Is this still in use? The styling may be incorrect with M7 NTP
+   rework. */
 #notification.first-run {
   background-color: $$1; /* COLOR_NTP_SECTION */
   border-color: $$2; /* COLOR_NTP_SECTION_BORDER */
 }
 
 #notification.first-run .link {
    color: $$6; /* COLOR_NTP_LINK_UNDERLINE */
 }
 
 #notification.first-run .link-color {
@@ skipping 67 matching lines @@
 .link-color {
   color: $9; /* COLOR_NTP_LINK */
 }
 
 :link,
 :visited,
 .link {
   color: $$6; /* COLOR_NTP_LINK_UNDERLINE */
 }
 
-#top-bar {
-  border-bottom: 1px solid $$2; /* COLOR_NTP_SECTION_BORDER */
+.section > h2 {
+  color: $$8; /* COLOR_NTP_SECTION_HEADER_TEXT */
+  background-image: url(chrome://theme/IDR_NEWTAB_SECTION_HEADER_BACKGROUND);
 }
 
-.section {
-  border-top: 1px solid $$2; /* COLOR_NTP_SECTION_BORDER */
-  border-bottom: 1px solid $$2; /* COLOR_NTP_SECTION_BORDER */
+.section > h2:hover {
+  color: $$9;
+  background-image: url(chrome://theme/IDR_NEWTAB_SECTION_HEADER_BACKGROUND_H);
 }
 
-.section.hidden + :not(.hidden) {
-  border-top: 1px solid $$2; /* COLOR_NTP_SECTION_BORDER */;
+.section:not(.hidden) > h2 {
+  background-image: url(chrome://theme/IDR_NEWTAB_SECTION_HEADER_BACKGROUND_A);
 }
 
-.section.hidden + .hidden > h2 {
-  border-left: 1px solid $$2; /* COLOR_NTP_SECTION_BORDER */
-}
-
-.section > h2 {
-  color: $8; /* COLOR_NTP_TEXT */
+.section > h2 > span {
+  background: $2; /* COLOR_NTP_BACKGROUND */
 }
 
 #apps-section a {
   color: $8; /* COLOR_NTP_TEXT */
 }
 
 #apps-section .app:hover > .front > a,
 #apps-section .app > .back {
   color: $$3; /* COLOR_NTP_SECTION_TEXT */
   background-color: $$1; /* COLOR_NTP_SECTION */;
 }
-
-#footer hr {
-  color: $$2; /* COLOR_NTP_SECTION_BORDER */
-}