Style contact-view layout

UI/WebServerResources/scss/components/autoScrollList/autoScrollList.scss

@@ -87,4 +87,5 @@
 .sg-avatar {
   @extend .md-tile-left;
   margin-right: 0;
+  margin-left: 0;
 }

UI/WebServerResources/scss/components/divider/divider.scss

@@ -5,7 +5,7 @@ md-divider {
   border-top: 1px solid;
   margin: 0;
 
-  &[md-inset] {
-    margin-left: $baseline-grid * 9; // fix for vs-repeat
+  &.md-inset {
+    margin-left: $baseline-grid * 9;
   }
 }

UI/WebServerResources/scss/components/toolbar/toolbar.scss

@@ -10,7 +10,7 @@ md-toolbar {
 }
 header {
   flex-direction: row;
-  flex-wrap: wrap;
+  flex-wrap: nowrap;
   align-items: stretch;
   justify-content: space-between;
   display: flex;

UI/WebServerResources/scss/core/typography/typography.scss

@@ -214,7 +214,8 @@ $sg-line-height-9: $sg-font-size-9 + $sg-md-typo-baseline;
 // Google Material Design specifications strongly recommend to avoid bold
 // font weight. Here are some variables to define weights more conveniently
 // ----------------------------------------------------------------------------
-$sg-font-light: 200;
+$sg-font-thin: 200;
+$sg-font-light: 300;
 $sg-font-regular: 400;
 $sg-font-medium: 600;
 $sg-font-bold: $sg-font-medium;
@@ -360,6 +361,12 @@ h6 {
     font-weight: $sg-font-regular;
     white-space: nowrap;
   }
+  .#{$md}-display-2--light {
+       $lineHeight: $sg-line-height-7;
+       font-size: $sg-font-size-7;
+       line-height: $lineHeight;
+       font-weight: $sg-font-light;
+   }
   .#{$md}-display-3 {
     $lineHeight : $sg-line-height-8;
     font-size: $sg-font-size-8;
@@ -374,7 +381,11 @@ h6 {
     font-weight: $sg-font-light;
     white-space: nowrap;
   }
-
+  .#{$md}-display-2-subheader {
+    @extend .#{$md}-title;
+    margin-bottom: $mg;
+    font-weight: $sg-font-thin;
+  }
   a,
   a:hover,
   a:active,