Changing options page so it is in the center, has less padding, a drop shadow...

chrome/browser/resources/options/options_page.css

 body {
   font-size: 100%;
   -webkit-user-select: none;
 }
 
 #settings-title {
   -webkit-padding-end: 24px;
   padding-top: 1em;
   padding-bottom: 1em;
   text-align: end;
   font-size: 125%;
   font-weight: normal;
   color: #53627d;
   margin: 0;
 }
 
 #main-content {
   display: -webkit-box;
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
 }
 
 .overlay {
   position: fixed;
   left: 0;
   right: 0;
-  background: rgba(0, 0, 0, .5);
+  background: rgba(0, 0, 0, .2);
   top: 0;
   bottom: 0;
   z-index: 10;
   padding: 20px;
   display: -webkit-box;
-  -webkit-box-align: start;
+  -webkit-box-align: center;
   -webkit-box-pack: center;
 }
 
 #close-overlay {
   position: relative;
   top: -20px;
   width: 20px;
   height: 20px;
 }
 
 html[dir='ltr'] #close-overlay {
   float: right;
   right: -20px;
 }
 
 html[dir='rtl'] #close-overlay {
   float: left;
   left: -20px;
 }
 
 .overlay .button-strip {
   text-align: end;
 }
 
 .overlay > div {
   background: white;
   border-radius: 5px;
-  padding: 30px;
+  padding: 15px;
+  border: 1px solid #666;
+  -webkit-box-shadow: 3px 3px 3px #666;
 }
 
 #navbar {
   margin: 0;
 }
 
 #navbar-container {
   background: -webkit-gradient(linear,
                                left top,
                                left bottom,
@@ skipping 218 matching lines @@
 }
 
 .favicon-cell {
   background-position: left;
   background-repeat: no-repeat;
   -webkit-padding-start: 20px;
 }
 html[dir=rtl] .favicon-cell {
   background-position: right;
 }