Incorporate VR UI styling changes

chrome/browser/resources/vr_shell/vr_shell_ui.css

 /* Copyright 2016 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. */
 
 html {
   background-color: rgba(255, 255, 255, 0);
 }
 
 #ui {
   left: 0;
@@ skipping 68 matching lines @@
   background-color: rgba(0, 0, 0, 0);
   background-position: center;
   background-repeat: no-repeat;
   background-size: contain;
   height: 192px;
   margin: auto auto;
   width: 192px;
 }
 
 .round-button {
-  background-color: #eee;
+  background-color: #fbfbfb;
   background-position: center;
   background-repeat: no-repeat;
-  background-size: contain;
-  border-radius: 10%;
-  height: 96px;
+  background-size: 70px;
+  border-radius: 6px;
+  height: 112px;
   margin: auto auto;
   opacity: 0.8;
-  transition: opacity 150ms ease-in-out;
-  width: 96px;
+  transition: opacity 50ms ease-in-out;
+  width: 112px;
 }
 
 .button-caption {
   color: white;
   font-size: 24px;
   max-width: 192px;
   opacity: 0;
   overflow: hidden;
   text-align: center;
-  transition: opacity 150ms ease-in-out;
+  transition: opacity 50ms ease-in-out;
   white-space: nowrap;
 }
 
 .rect-button {
   background-color: #eee;
   border-radius: 6px;
   color: black;
   font-size: 20px;
   line-height: 96px;
   opacity: 0.8;
   overflow: hidden;
   text-align: center;
   text-transform: uppercase;
   vertical-align: middle;
   white-space: nowrap;
   width: 300px;
 }
 
 .rect-button:hover {
   opacity: 1;
 }
 
 .disabled-button {
-  background-color: #aaa;
+  background-color: #bbb;
 }
 
 #back-button,
 #forward-button,
 #back-indicator,
 #forward-indicator {
   background-image: url(../../../../ui/webui/resources/images/vr_back.svg);
 }
 
 #reload-button {
   background-image: url(../../../../ui/webui/resources/images/vr_reload.svg);
 }
 
 #forward-button,
 #forward-indicator {
   transform: scaleX(-1);
 }
 
 #reload-ui-button {
+  --rotX: -0.2;
+  --rotY: 0;
+  --rotZ: 0;
+  --scale: 1;
+  --tranX: 0;
+  --tranY: -0.7;
+  --tranZ: -0.4;
+  background-color: rgba(255,255,255,0.25);
   color: white;
   font-size: 24px;
   padding: 12px;
 }
 
 #reload-ui-button:hover {
-  background-color: pink;
+  background-color: turquoise;
 }
 
 #content-interceptor {
   height: 1px;
   opacity: 0;
   width: 1px;
 }
 
 .tab {
   background-color: #eee;
@@ skipping 28 matching lines @@
 
 /* The tab clip element's width will be programmatically set to the total width
  * of all it's children (the tabs). By doing so, the tabs can be scrolled
  * horizontally in the tab container element. */
 #tab-clip {
   margin: 0 auto;
   overflow: hidden;
 }
 
 #url-indicator-container {
+  --scale: 1.2;
   --tranX: 0;
-  --tranY: -0.65;
-  --tranZ: -1.2;
+  --tranY: -0.75;
+  --tranZ: -1.8;
 }
 
 #url-indicator-border {
-  --fadeTimeMs: 500;
-  --fadeYOffset: -0.1;
+  --fadeTimeMs: 200;
+  --fadeYOffset: -0.05;
   --opacity: 0.9;
   --statusBarColor: rgb(66, 133, 244);
   background-color: #ececec;
-  border-radius: 200px;
+  border-radius: 6px;
   padding: 6px;
 }
 
 #url-indicator {
   align-items: center;
   background-color: #ececec;
-  border-radius: 200px;
+  border-radius: 6px;
   box-sizing: border-box;
   display: flex;
   height: 104px;
   justify-content: center;
   overflow: hidden;
   white-space: nowrap;
   width: 512px;
 }
 
 #url-indicator-content {
@@ skipping 32 matching lines @@
   overflow: hidden;
   white-space: nowrap;
   width: 100%;
 }
 
 #url-indicator #path {
   color: #868686;
 }
 
 #omnibox-ui-element {
-  --tranX: 0;
-  --tranY: -0.1;
-  --tranZ: -1.0;
   background-color: transparent;
   box-sizing: border-box;
-  font-family: arial;
   font-size: 16px;
-  width: 400px;
+  width: 368px;
 }
 
 #suggestions {
   border: 1px solid transparent;
   box-sizing: border-box;
 }
 
 .suggestion {
   align-items: center; /* Vertically center text in div. */
   background-color: white;
   /* Use a transparent border to hide text overflow, but allow background to
    * color show through. */
   border-left: 5px solid transparent;
   border-right: 5px solid transparent;
   box-sizing: border-box;
   display: flex;
   height: 24px;
   overflow: hidden;
   white-space: nowrap;
 }
 
 .suggestion:hover {
   background-color: orange;
 }
 
 #omnibox-url-element {
   background-color: white;
-  border: 1px solid grey;
+  border-radius: 6px;
   box-sizing: border-box;
   display: flex;
   flex-direction: row-reverse; /* Right-justify for convienence. */
+  height: 64px;
   margin-top: 2px;
-  padding: 5px;
+  padding: 8px;
+  transition: background-color 50ms ease-in-out;
 }
 
 #omnibox-input-field {
+  background-color: transparent;
   border: none;
-  font-size: 16px;
+  font-size: 27px;
   outline: none; /* Do not show an outline when focused. */
   overflow: hidden;
+  text-align: center;
   white-space: nowrap;
   width: 100%;
 }
 
 #omnibox-clear-button {
   background: url(../../../../ui/webui/resources/images/x-hover.png) no-repeat center center;
   width: 18px;
 }