Adjustments to the fatnav and sidenav, and other CSS updates

chrome/common/extensions/docs/static/sass/_html.scss

 //-----------------------------------------------------------------------
 // General Elements
 //-----------------------------------------------------------------------
 
 figure {
   margin: $default-padding 0;
   img {
     border: $default-border;
   }
 }
@@ skipping 39 matching lines @@
   line-height: 1.8em;
   a {
     text-decoration: underline!important;
   }
   b {
     background: yellow;
     font-weight: normal;
   }
   strike {
     text-decoration: none;
-    background-image: -webkit-linear-gradient(transparent 7px,#cc1f1f 7px,#cc1f1f 9px,transparent 9px);
-    background-image:    -moz-linear-gradient(transparent 7px,#cc1f1f 7px,#cc1f1f 9px,transparent 9px);
-    background-image:     -ms-linear-gradient(transparent 7px,#cc1f1f 7px,#cc1f1f 9px,transparent 9px);
-    background-image:      -o-linear-gradient(transparent 7px,#cc1f1f 7px,#cc1f1f 9px,transparent 9px);
-    background-image:         linear-gradient(transparent 7px,#cc1f1f 7px,#cc1f1f 9px,transparent 9px);
+    background-image: linear-gradient(transparent 7px,#cc1f1f 7px,#cc1f1f 9px,transparent 9px);
   }
   &[data-filename]::after {
     visibility: hidden;
   }
   &[data-filename]:hover::after {
     visibility: visible;
   }
 }
 
 
@@ skipping 52 matching lines @@
     left: -100%;
   }
   &::after {
     left: 100%;
   }
 }
 
 // Big blue buttonz!
 .button {
   background: #0370ea;
-  @include background-image(linear-gradient(top, #008dfd 0%,#0370ea 100%));
+  background-image: linear-gradient(top, #008dfd 0%,#0370ea 100%);
   border: 1px solid #076bd2;
   border-radius: 3px;
   color: $white !important;
   display: inline-block;
   font-size: 13px;
   font-weight: 700;
   line-height: 1.3;
   padding: 5px 20px;
   text-align: center;
   text-decoration: none !important;
   text-shadow: 1px 1px 1px #076bd2;
 
   &:hover {
-    @include background-image(linear-gradient(top, #008dfd 30%,#0370ea 100%));
+    background-image: linear-gradient(top, #008dfd 30%,#0370ea 100%);
     cursor: pointer;
   }
 
   a {
       color: inherit !important;
   }
 }
 
 .button-alt {
   background: #eee;
-  @include background-image(linear-gradient(bottom, #DCDCDC 46%, #FAFAFA 87%));
+  background-image: linear-gradient(bottom, #DCDCDC 46%, #FAFAFA 87%);
   border: 1px solid #d6d6d6;
   border-radius: 3px;
   color: #333 !important;
   display: inline-block;
   font-size: 12px;
   font-weight: 700;
   line-height: 24px;
   padding: 0 15px;
   text-align: center;
   text-decoration: none !important;
   text-shadow: none;
 
   &:hover {
-    @include background-image(linear-gradient(bottom, #DCDCDC 20%, #FAFAFA 87%));
+    background-image: linear-gradient(bottom, #DCDCDC 20%, #FAFAFA 87%);
     cursor: pointer;
   }
 }
 
 // Feedback and scroll to top buttons.
 .google-button {
   background-color: $gray-light;
   border-radius: 2px 0 0 0;
   border: 1px solid rgba(0,0,0,0.1);
   padding: 5px 12px;
   text-align: center;
   white-space: nowrap;
 
   &:hover {
     border-color: #c6c6c6;
-    @include box-shadow(0 -1px 1px rgba(0,0,0,0.1));
+    box-shadow: 0 -1px 1px rgba(0,0,0,0.1);
   }
   &:active {
     background-color: #f1f1f1;
-    @include box-shadow(inset 0 0px 2px rgba(0,0,0,0.2));
+    box-shadow: inset 0 0px 2px rgba(0,0,0,0.2);
   }
 }
 
 .screenshot,
 .screenshot img {
   margin: 1em 0;  
 }
 
+.video-container {
+  position: relative;
+  padding-bottom: 56.25%;
+  padding-top: 30px;
+  height: 0;
+  overflow: hidden;
+  margin: 0 0 20px 0;
+}
+.video-container iframe,
+.video-container object,
+.video-container embed {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
 p, div, aside {
   &.note,
   &.caution,
   &.warning {
     background-color: $gray-light;
     border-bottom: 1px solid;
     border-top: 1px solid;
     overflow: hidden;
     width: 85%;
     margin: auto;
     padding: 1em;
     //border: none;
     //box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15), 0 0 3px rgba(0, 0, 0, 0.15);
-    //background-image: -webkit-linear-gradient(top, rgba(51, 102, 204, 0.1), transparent, rgba(51, 102, 204, 0.1));
 
   }
   &.note {
     border-color: #36C;
   }
   &.caution {
     border-color: #FC3;
   }
   &.warning {
     border-color: #A03;
@@ skipping 379 matching lines @@
 
   .capitalize:first-letter {
     text-transform: uppercase;
   }
 }
 
 .optional {
   color: #7D7D7D;
 }
 */